@momentum-design/components 0.120.31 → 0.120.33

package/dist/react/checkbox/index.d.ts

@@ -33,6 +33,7 @@ import type { Events } from '../../components/checkbox/checkbox.types';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  *
  * @slot label - Slot for the label element. If not provided, the `label` property will be used to render the label.
  * @slot toggletip - Slot for the toggletip info icon button. If not provided, the `toggletip-text` property will be used to render the info icon button and toggletip.
@@ -49,6 +50,7 @@ import type { Events } from '../../components/checkbox/checkbox.types';
  * @csspart help-text-container - The container for the helper/validation icon and text elements.
  * @csspart checkbox-input - The native checkbox input element.
  * @csspart text-container - The container for the label and helper text elements.
+ * @csspart static-checkbox - The static checkbox element.
  */
 declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {
     onChange: EventName<Events["onChangeEvent"]>;

package/dist/react/checkbox/index.js

@@ -34,6 +34,7 @@ import { TAG_NAME } from '../../components/checkbox/checkbox.constants';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  *
  * @slot label - Slot for the label element. If not provided, the `label` property will be used to render the label.
  * @slot toggletip - Slot for the toggletip info icon button. If not provided, the `toggletip-text` property will be used to render the info icon button and toggletip.
@@ -50,6 +51,7 @@ import { TAG_NAME } from '../../components/checkbox/checkbox.constants';
  * @csspart help-text-container - The container for the helper/validation icon and text elements.
  * @csspart checkbox-input - The native checkbox input element.
  * @csspart text-container - The container for the label and helper text elements.
+ * @csspart static-checkbox - The static checkbox element.
  */
 const reactWrapper = createComponent({
     tagName: TAG_NAME,

package/dist/react/combobox/index.d.ts

@@ -58,6 +58,7 @@ import type { Events } from '../../components/combobox/combobox.types';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  *
  * @csspart label - The label element.
  * @csspart label-text - The container for the label and required indicator elements.

package/dist/react/combobox/index.js

@@ -59,6 +59,7 @@ import { TAG_NAME } from '../../components/combobox/combobox.constants';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  *
  * @csspart label - The label element.
  * @csspart label-text - The container for the label and required indicator elements.

package/dist/react/formfieldgroup/index.d.ts

@@ -47,6 +47,7 @@ import Component from '../../components/formfieldgroup';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  */
 declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {}>;
 export default reactWrapper;

package/dist/react/formfieldgroup/index.js

@@ -50,6 +50,7 @@ import { TAG_NAME } from '../../components/formfieldgroup/formfieldgroup.constan
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  */
 const reactWrapper = createComponent({
     tagName: TAG_NAME,

package/dist/react/formfieldwrapper/index.d.ts

@@ -33,6 +33,7 @@ import Component from '../../components/formfieldwrapper';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  */
 declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {}>;
 export default reactWrapper;

package/dist/react/formfieldwrapper/index.js

@@ -36,6 +36,7 @@ import { TAG_NAME } from '../../components/formfieldwrapper/formfieldwrapper.con
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  */
 const reactWrapper = createComponent({
     tagName: TAG_NAME,

package/dist/react/index.d.ts

@@ -9,14 +9,14 @@ export { default as Avatar } from './avatar';
 export { default as AvatarButton } from './avatarbutton';
 export { default as Badge } from './badge';
 export { default as Banner } from './banner';
+export { default as Brandvisual } from './brandvisual';
 export { default as Bullet } from './bullet';
 export { default as Button } from './button';
-export { default as Brandvisual } from './brandvisual';
 export { default as ButtonGroup } from './buttongroup';
 export { default as ButtonLink } from './buttonlink';
 export { default as Buttonsimple } from './buttonsimple';
-export { default as Card } from './card';
 export { default as CardButton } from './cardbutton';
+export { default as Card } from './card';
 export { default as CardCheckbox } from './cardcheckbox';
 export { default as CardRadio } from './cardradio';
 export { default as Checkbox } from './checkbox';
@@ -81,7 +81,7 @@ export { default as Textarea } from './textarea';
 export { default as ThemeProvider } from './themeprovider';
 export { default as Toast } from './toast';
 export { default as Toggle } from './toggle';
-export { default as Tooltip } from './tooltip';
 export { default as ToggleTip } from './toggletip';
+export { default as Tooltip } from './tooltip';
 export { default as Typewriter } from './typewriter';
 export { default as VirtualizedList } from './virtualizedlist';

package/dist/react/index.js

@@ -9,14 +9,14 @@ export { default as Avatar } from './avatar';
 export { default as AvatarButton } from './avatarbutton';
 export { default as Badge } from './badge';
 export { default as Banner } from './banner';
+export { default as Brandvisual } from './brandvisual';
 export { default as Bullet } from './bullet';
 export { default as Button } from './button';
-export { default as Brandvisual } from './brandvisual';
 export { default as ButtonGroup } from './buttongroup';
 export { default as ButtonLink } from './buttonlink';
 export { default as Buttonsimple } from './buttonsimple';
-export { default as Card } from './card';
 export { default as CardButton } from './cardbutton';
+export { default as Card } from './card';
 export { default as CardCheckbox } from './cardcheckbox';
 export { default as CardRadio } from './cardradio';
 export { default as Checkbox } from './checkbox';
@@ -81,7 +81,7 @@ export { default as Textarea } from './textarea';
 export { default as ThemeProvider } from './themeprovider';
 export { default as Toast } from './toast';
 export { default as Toggle } from './toggle';
-export { default as Tooltip } from './tooltip';
 export { default as ToggleTip } from './toggletip';
+export { default as Tooltip } from './tooltip';
 export { default as Typewriter } from './typewriter';
 export { default as VirtualizedList } from './virtualizedlist';

package/dist/react/input/index.d.ts

@@ -43,6 +43,7 @@ import type { Events } from '../../components/input/input.types';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  * @cssproperty --mdc-input-text-color - Text color for the input field
  * @cssproperty --mdc-input-border-color - Border color for the input container
  * @cssproperty --mdc-input-background-color - Background color for the input field

package/dist/react/input/index.js

@@ -44,6 +44,7 @@ import { TAG_NAME } from '../../components/input/input.constants';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  * @cssproperty --mdc-input-text-color - Text color for the input field
  * @cssproperty --mdc-input-border-color - Border color for the input container
  * @cssproperty --mdc-input-background-color - Background color for the input field

package/dist/react/password/index.d.ts

@@ -51,6 +51,7 @@ import type { Events as EventsInherited } from '../../components/input/input.typ
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  * @cssproperty --mdc-input-text-color - Text color for the input field
  * @cssproperty --mdc-input-border-color - Border color for the input container
  * @cssproperty --mdc-input-background-color - Background color for the input field

package/dist/react/password/index.js

@@ -52,6 +52,7 @@ import { TAG_NAME } from '../../components/password/password.constants';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  * @cssproperty --mdc-input-text-color - Text color for the input field
  * @cssproperty --mdc-input-border-color - Border color for the input container
  * @cssproperty --mdc-input-background-color - Background color for the input field

package/dist/react/progressbar/index.d.ts

@@ -30,6 +30,7 @@ import Component from '../../components/progressbar';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  * @cssproperty --mdc-progressbar-background-color - Background color of the remaining progressbar portion.
  * @cssproperty --mdc-progressbar-progress-background-color - Background color of the elapsed progressbar portion.
  * @cssproperty --mdc-progressbar-height - The height of the progressbar.

package/dist/react/progressbar/index.js

@@ -33,6 +33,7 @@ import { TAG_NAME } from '../../components/progressbar/progressbar.constants';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  * @cssproperty --mdc-progressbar-background-color - Background color of the remaining progressbar portion.
  * @cssproperty --mdc-progressbar-progress-background-color - Background color of the elapsed progressbar portion.
  * @cssproperty --mdc-progressbar-height - The height of the progressbar.

package/dist/react/radio/index.d.ts

@@ -18,14 +18,11 @@ import type { Events } from '../../components/radio/radio.types';
  * @event change - (React: onChange) Event that gets dispatched when the radio state changes.
  * @event focus - (React: onFocus) Event that gets dispatched when the radio receives focus.
  *
- * @cssproperty --mdc-radio-text-disabled-color - color of the label when disabled
- * @cssproperty --mdc-radio-control-inactive-hover - color of the radio button when inactive and hovered
- * @cssproperty --mdc-radio-control-inactive-pressed-color - color of the radio button when inactive and pressed
- * @cssproperty --mdc-radio-control-active-hover-color - color of the radio button when active and hovered
- * @cssproperty --mdc-radio-control-active-pressed-color - color of the radio button when active and pressed
- * @cssproperty --mdc-radio-disabled-border-color - color of the radio button when disabled
- * @cssproperty --mdc-radio-control-active-disabled-background - color of the radio button when active and disabled
- * @cssproperty --mdc-radio-control-inactive-disabled-background - color of the radio button when inactive and disabled
+ * @cssproperty --mdc-radio-inner-circle-size - size of the inner circle
+ * @cssproperty --mdc-radio-outer-circle-size - size of the outer circle
+ * @cssproperty --mdc-radio-inner-circle-background-color - background color of the inner circle
+ * @cssproperty --mdc-radio-outer-circle-border-color - border color of the outer circle
+ * @cssproperty --mdc-radio-outer-circle-background-color - background color of the outer circle
  *
  * @csspart label - The label element.
  * @csspart label-text - The container for the label and required indicator elements.

package/dist/react/radio/index.js

@@ -19,14 +19,11 @@ import { TAG_NAME } from '../../components/radio/radio.constants';
  * @event change - (React: onChange) Event that gets dispatched when the radio state changes.
  * @event focus - (React: onFocus) Event that gets dispatched when the radio receives focus.
  *
- * @cssproperty --mdc-radio-text-disabled-color - color of the label when disabled
- * @cssproperty --mdc-radio-control-inactive-hover - color of the radio button when inactive and hovered
- * @cssproperty --mdc-radio-control-inactive-pressed-color - color of the radio button when inactive and pressed
- * @cssproperty --mdc-radio-control-active-hover-color - color of the radio button when active and hovered
- * @cssproperty --mdc-radio-control-active-pressed-color - color of the radio button when active and pressed
- * @cssproperty --mdc-radio-disabled-border-color - color of the radio button when disabled
- * @cssproperty --mdc-radio-control-active-disabled-background - color of the radio button when active and disabled
- * @cssproperty --mdc-radio-control-inactive-disabled-background - color of the radio button when inactive and disabled
+ * @cssproperty --mdc-radio-inner-circle-size - size of the inner circle
+ * @cssproperty --mdc-radio-outer-circle-size - size of the outer circle
+ * @cssproperty --mdc-radio-inner-circle-background-color - background color of the inner circle
+ * @cssproperty --mdc-radio-outer-circle-border-color - border color of the outer circle
+ * @cssproperty --mdc-radio-outer-circle-background-color - background color of the outer circle
  *
  * @csspart label - The label element.
  * @csspart label-text - The container for the label and required indicator elements.

package/dist/react/searchfield/index.d.ts

@@ -34,6 +34,7 @@ import type { Events as EventsInherited } from '../../components/input/input.typ
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  * @cssproperty --mdc-input-text-color - Text color for the input field
  * @cssproperty --mdc-input-border-color - Border color for the input container
  * @cssproperty --mdc-input-background-color - Background color for the input field

package/dist/react/searchfield/index.js

@@ -35,6 +35,7 @@ import { TAG_NAME } from '../../components/searchfield/searchfield.constants';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  * @cssproperty --mdc-input-text-color - Text color for the input field
  * @cssproperty --mdc-input-border-color - Border color for the input container
  * @cssproperty --mdc-input-background-color - Background color for the input field

package/dist/react/select/index.d.ts

@@ -52,6 +52,7 @@ import type { Events } from '../../components/select/select.types';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  * @cssproperty --mdc-select-background-color - The background color of the combobox of select.
  * @cssproperty --mdc-select-text-color - The text color of the select.
  * @cssproperty --mdc-select-border-color - The border color of the select.

package/dist/react/select/index.js

@@ -53,6 +53,7 @@ import { TAG_NAME } from '../../components/select/select.constants';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  * @cssproperty --mdc-select-background-color - The background color of the combobox of select.
  * @cssproperty --mdc-select-text-color - The text color of the select.
  * @cssproperty --mdc-select-border-color - The border color of the select.

package/dist/react/staticcheckbox/index.d.ts

@@ -10,15 +10,10 @@ import Component from '../../components/staticcheckbox';
  *
  * @dependency mdc-icon
  *
- * @cssproperty --mdc-staticcheckbox-border-color - Border color in high contrast.
- * @cssproperty --mdc-staticcheckbox-checked-background-color - Background color for a selected checkbox.
- * @cssproperty --mdc-staticcheckbox-disabled-background-color - Background color for a disabled checkbox.
- * @cssproperty --mdc-checkbox-disabled-border-color - Border color for a disabled checkbox.
- * @cssproperty --mdc-checkbox-disabled-checked-icon-color - Background color for a disabled, selected checkbox.
- * @cssproperty --mdc-staticcheckbox-disabled-icon-color - Icon color for a disabled checkbox.
- * @cssproperty --mdc-staticcheckbox-icon-background-color - Background color for an unselected checkbox.
- * @cssproperty --mdc-staticcheckbox-icon-border-color - Default background color for an unselected checkbox.
- * @cssproperty --mdc-staticcheckbox-icon-color - Icon color for an unselected checkbox.
+ * @cssproperty --mdc-checkbox-border-color - Controls the border color of the checkbox.
+ * @cssproperty --mdc-checkbox-background-color - Controls the background color of the checkbox.
+ * @cssproperty --mdc-checkbox-icon-color - Controls the icon color of the checkbox.
+ * @cssproperty --mdc-checkbox-size - Controls the size of the checkbox.
  *
  * @csspart icon-container - The container for the checkbox icon.
  * @csspart checkbox-icon - The checkbox icon.

package/dist/react/staticcheckbox/index.js

@@ -13,15 +13,10 @@ import { TAG_NAME } from '../../components/staticcheckbox/staticcheckbox.constan
  *
  * @dependency mdc-icon
  *
- * @cssproperty --mdc-staticcheckbox-border-color - Border color in high contrast.
- * @cssproperty --mdc-staticcheckbox-checked-background-color - Background color for a selected checkbox.
- * @cssproperty --mdc-staticcheckbox-disabled-background-color - Background color for a disabled checkbox.
- * @cssproperty --mdc-checkbox-disabled-border-color - Border color for a disabled checkbox.
- * @cssproperty --mdc-checkbox-disabled-checked-icon-color - Background color for a disabled, selected checkbox.
- * @cssproperty --mdc-staticcheckbox-disabled-icon-color - Icon color for a disabled checkbox.
- * @cssproperty --mdc-staticcheckbox-icon-background-color - Background color for an unselected checkbox.
- * @cssproperty --mdc-staticcheckbox-icon-border-color - Default background color for an unselected checkbox.
- * @cssproperty --mdc-staticcheckbox-icon-color - Icon color for an unselected checkbox.
+ * @cssproperty --mdc-checkbox-border-color - Controls the border color of the checkbox.
+ * @cssproperty --mdc-checkbox-background-color - Controls the background color of the checkbox.
+ * @cssproperty --mdc-checkbox-icon-color - Controls the icon color of the checkbox.
+ * @cssproperty --mdc-checkbox-size - Controls the size of the checkbox.
  *
  * @csspart icon-container - The container for the checkbox icon.
  * @csspart checkbox-icon - The checkbox icon.

package/dist/react/staticradio/index.d.ts

@@ -7,18 +7,11 @@ import Component from '../../components/staticradio';
  *
  * @tagname mdc-staticradio
  *
- * @cssproperty --mdc-staticradio-inner-circle-size - size of the inner circle
- * @cssproperty --mdc-staticradio-text-disabled-color - color of the label when disabled
- * @cssproperty --mdc-staticradio-normal-border-color - color of the radio button border when normal
- * @cssproperty --mdc-staticradio-disabled-border-color - color of the radio button border when disabled
- * @cssproperty --mdc-staticradio-inner-circle-normal-background - background color of the inner circle when normal
- * @cssproperty --mdc-staticradio-inner-circle-disabled-background - background color of the inner circle when disabled
- * @cssproperty --mdc-staticradio-control-inactive-color - color of the radio button when inactive
- * @cssproperty --mdc-staticradio-control-inactive-disabled-background - background color of the radio button when
- *  inactive and disabled
- * @cssproperty --mdc-staticradio-control-active-color - color of the radio button when active
- * @cssproperty --mdc-staticradio-control-active-disabled-background - background color of the radio button
- *  when active and disabled
+ * @cssproperty --mdc-radio-inner-circle-size - size of the inner circle
+ * @cssproperty --mdc-radio-outer-circle-size - size of the outer circle
+ * @cssproperty --mdc-radio-inner-circle-background-color - background color of the inner circle
+ * @cssproperty --mdc-radio-outer-circle-border-color - border color of the outer circle
+ * @cssproperty --mdc-radio-outer-circle-background-color - background color of the outer circle
  *
  * @csspart radio-icon - The radio icon.
  *

package/dist/react/staticradio/index.js

@@ -10,18 +10,11 @@ import { TAG_NAME } from '../../components/staticradio/staticradio.constants';
  *
  * @tagname mdc-staticradio
  *
- * @cssproperty --mdc-staticradio-inner-circle-size - size of the inner circle
- * @cssproperty --mdc-staticradio-text-disabled-color - color of the label when disabled
- * @cssproperty --mdc-staticradio-normal-border-color - color of the radio button border when normal
- * @cssproperty --mdc-staticradio-disabled-border-color - color of the radio button border when disabled
- * @cssproperty --mdc-staticradio-inner-circle-normal-background - background color of the inner circle when normal
- * @cssproperty --mdc-staticradio-inner-circle-disabled-background - background color of the inner circle when disabled
- * @cssproperty --mdc-staticradio-control-inactive-color - color of the radio button when inactive
- * @cssproperty --mdc-staticradio-control-inactive-disabled-background - background color of the radio button when
- *  inactive and disabled
- * @cssproperty --mdc-staticradio-control-active-color - color of the radio button when active
- * @cssproperty --mdc-staticradio-control-active-disabled-background - background color of the radio button
- *  when active and disabled
+ * @cssproperty --mdc-radio-inner-circle-size - size of the inner circle
+ * @cssproperty --mdc-radio-outer-circle-size - size of the outer circle
+ * @cssproperty --mdc-radio-inner-circle-background-color - background color of the inner circle
+ * @cssproperty --mdc-radio-outer-circle-border-color - border color of the outer circle
+ * @cssproperty --mdc-radio-outer-circle-background-color - background color of the outer circle
  *
  * @csspart radio-icon - The radio icon.
  *

package/dist/react/statictoggle/index.d.ts

@@ -10,21 +10,13 @@ import Component from '../../components/statictoggle';
  *
  * @slot default - This is a default/unnamed slot
  *
- * @cssproperty --mdc-statictoggle-width - Width of the toggle
- * @cssproperty --mdc-statictoggle-height - Height of the toggle
- * @cssproperty --mdc-statictoggle-width-compact - Width of the toggle when it's size is compact
- * @cssproperty --mdc-statictoggle-height-compact - Height of the toggle when it's size is compact
- * @cssproperty --mdc-statictoggle-border-radius - Border radius of the toggle
- * @cssproperty --mdc-statictoggle-border-radius-compact - Border radius of the toggle when it's size is compact
- * @cssproperty --mdc-statictoggle-border - Border of the toggle
- * @cssproperty --mdc-statictoggle-inactive-rest-color - Background color of the inactive toggle in rest state
- * @cssproperty --mdc-statictoggle-inactive-disabled-color - Background color of the inactive toggle in disabled state
- * @cssproperty --mdc-statictoggle-active-rest-color - Background color of the active toggle in rest state
- * @cssproperty --mdc-statictoggle-active-disabled-color - Background color of the active toggle in disabled state
- * @cssproperty --mdc-statictoggle-icon-color-normal - Color of the icon in normal state
- * @cssproperty --mdc-statictoggle-icon-color-disabled - Color of the icon in disabled state
- * @cssproperty --mdc-statictoggle-icon-background-color-normal - Background color of the icon in normal state
- * @cssproperty --mdc-statictoggle-icon-background-color-disabled - Background color of the icon in disabled state
+ * @cssproperty --mdc-toggle-width - The width of the toggle
+ * @cssproperty --mdc-toggle-height - The height of the toggle
+ * @cssproperty --mdc-toggle-border-radius - The border radius of the toggle
+ * @cssproperty --mdc-toggle-border-color - The border color of the toggle
+ * @cssproperty --mdc-toggle-background-color - The background color of the toggle
+ * @cssproperty --mdc-toggle-icon-color - The icon color of the toggle
+ * @cssproperty --mdc-toggle-icon-background-color - The icon background color of the toggle
  *
  * @csspart slider - The slider part of the toggle
  * @csspart toggle-icon - The icon part of the toggle

package/dist/react/statictoggle/index.js

@@ -13,21 +13,13 @@ import { TAG_NAME } from '../../components/statictoggle/statictoggle.constants';
  *
  * @slot default - This is a default/unnamed slot
  *
- * @cssproperty --mdc-statictoggle-width - Width of the toggle
- * @cssproperty --mdc-statictoggle-height - Height of the toggle
- * @cssproperty --mdc-statictoggle-width-compact - Width of the toggle when it's size is compact
- * @cssproperty --mdc-statictoggle-height-compact - Height of the toggle when it's size is compact
- * @cssproperty --mdc-statictoggle-border-radius - Border radius of the toggle
- * @cssproperty --mdc-statictoggle-border-radius-compact - Border radius of the toggle when it's size is compact
- * @cssproperty --mdc-statictoggle-border - Border of the toggle
- * @cssproperty --mdc-statictoggle-inactive-rest-color - Background color of the inactive toggle in rest state
- * @cssproperty --mdc-statictoggle-inactive-disabled-color - Background color of the inactive toggle in disabled state
- * @cssproperty --mdc-statictoggle-active-rest-color - Background color of the active toggle in rest state
- * @cssproperty --mdc-statictoggle-active-disabled-color - Background color of the active toggle in disabled state
- * @cssproperty --mdc-statictoggle-icon-color-normal - Color of the icon in normal state
- * @cssproperty --mdc-statictoggle-icon-color-disabled - Color of the icon in disabled state
- * @cssproperty --mdc-statictoggle-icon-background-color-normal - Background color of the icon in normal state
- * @cssproperty --mdc-statictoggle-icon-background-color-disabled - Background color of the icon in disabled state
+ * @cssproperty --mdc-toggle-width - The width of the toggle
+ * @cssproperty --mdc-toggle-height - The height of the toggle
+ * @cssproperty --mdc-toggle-border-radius - The border radius of the toggle
+ * @cssproperty --mdc-toggle-border-color - The border color of the toggle
+ * @cssproperty --mdc-toggle-background-color - The background color of the toggle
+ * @cssproperty --mdc-toggle-icon-color - The icon color of the toggle
+ * @cssproperty --mdc-toggle-icon-background-color - The icon background color of the toggle
  *
  * @csspart slider - The slider part of the toggle
  * @csspart toggle-icon - The icon part of the toggle

package/dist/react/textarea/index.d.ts

@@ -57,6 +57,7 @@ import type { Events } from '../../components/textarea/textarea.types';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  * @cssproperty --mdc-textarea-text-color - Text color for the textarea field
  * @cssproperty --mdc-textarea-background-color - Background color for the textarea field
  * @cssproperty --mdc-textarea-border-color - Border color for the textarea field

package/dist/react/textarea/index.js

@@ -58,6 +58,7 @@ import { TAG_NAME } from '../../components/textarea/textarea.constants';
  * @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
  * @cssproperty --mdc-help-text-line-height - Line height for the help text.
  * @cssproperty --mdc-help-text-color - Color for the help text.
+ * @cssproperty --mdc-required-indicator-color - Color for the required indicator text.
  * @cssproperty --mdc-textarea-text-color - Text color for the textarea field
  * @cssproperty --mdc-textarea-background-color - Background color for the textarea field
  * @cssproperty --mdc-textarea-border-color - Border color for the textarea field

package/dist/react/toggle/index.d.ts

@@ -22,16 +22,13 @@ import type { Events } from '../../components/toggle/toggle.types';
  * @event change - (React: onChange) Event that gets dispatched when the toggle state changes.
  * @event focus - (React: onFocus) Event that gets dispatched when the toggle receives focus.
  *
- * @cssproperty --mdc-toggle-width - Width of the toggle
- * @cssproperty --mdc-toggle-height - Height of the toggle
- * @cssproperty --mdc-toggle-width-compact - Width of the toggle when it's size is compact
- * @cssproperty --mdc-toggle-height-compact - Height of the toggle when it's size is compact
- * @cssproperty --mdc-toggle-label-color-disabled - Color of the toggle label and help text in disabled state
- * @cssproperty --mdc-toggle-help-text-color - Color of the help text label
- * @cssproperty --mdc-toggle-active-hover-color - Background color of the active toggle in hover state
- * @cssproperty --mdc-toggle-active-pressed-color - Background color of the active toggle in pressed state
- * @cssproperty --mdc-toggle-inactive-hover-color - Background color of the inactive toggle in hover state
- * @cssproperty --mdc-toggle-inactive-pressed-color - Background color of the inactive toggle in pressed state
+ * @cssproperty --mdc-toggle-width - The width of the toggle
+ * @cssproperty --mdc-toggle-height - The height of the toggle
+ * @cssproperty --mdc-toggle-border-radius - The border radius of the toggle
+ * @cssproperty --mdc-toggle-border-color - The border color of the toggle
+ * @cssproperty --mdc-toggle-background-color - The background color of the toggle
+ * @cssproperty --mdc-toggle-icon-color - The icon color of the toggle
+ * @cssproperty --mdc-toggle-icon-background-color - The icon background color of the toggle
  *
  * @csspart label - The label element.
  * @csspart label-text - The container for the label and required indicator elements.
@@ -41,7 +38,7 @@ import type { Events } from '../../components/toggle/toggle.types';
  * @csspart help-text - The helper/validation text element.
  * @csspart helper-icon - The helper/validation icon element that is displayed next to the helper/validation text.
  * @csspart help-text-container - The container for the helper/validation icon and text elements.
- * @csspart container - The container element that wraps the toggle input.
+ * @csspart static-toggle - The static-toggle element that wraps the toggle input.
  * @csspart toggle-input - The native checkbox input element styled as a toggle switch.
  */
 declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {

package/dist/react/toggle/index.js

@@ -23,16 +23,13 @@ import { TAG_NAME } from '../../components/toggle/toggle.constants';
  * @event change - (React: onChange) Event that gets dispatched when the toggle state changes.
  * @event focus - (React: onFocus) Event that gets dispatched when the toggle receives focus.
  *
- * @cssproperty --mdc-toggle-width - Width of the toggle
- * @cssproperty --mdc-toggle-height - Height of the toggle
- * @cssproperty --mdc-toggle-width-compact - Width of the toggle when it's size is compact
- * @cssproperty --mdc-toggle-height-compact - Height of the toggle when it's size is compact
- * @cssproperty --mdc-toggle-label-color-disabled - Color of the toggle label and help text in disabled state
- * @cssproperty --mdc-toggle-help-text-color - Color of the help text label
- * @cssproperty --mdc-toggle-active-hover-color - Background color of the active toggle in hover state
- * @cssproperty --mdc-toggle-active-pressed-color - Background color of the active toggle in pressed state
- * @cssproperty --mdc-toggle-inactive-hover-color - Background color of the inactive toggle in hover state
- * @cssproperty --mdc-toggle-inactive-pressed-color - Background color of the inactive toggle in pressed state
+ * @cssproperty --mdc-toggle-width - The width of the toggle
+ * @cssproperty --mdc-toggle-height - The height of the toggle
+ * @cssproperty --mdc-toggle-border-radius - The border radius of the toggle
+ * @cssproperty --mdc-toggle-border-color - The border color of the toggle
+ * @cssproperty --mdc-toggle-background-color - The background color of the toggle
+ * @cssproperty --mdc-toggle-icon-color - The icon color of the toggle
+ * @cssproperty --mdc-toggle-icon-background-color - The icon background color of the toggle
  *
  * @csspart label - The label element.
  * @csspart label-text - The container for the label and required indicator elements.
@@ -42,7 +39,7 @@ import { TAG_NAME } from '../../components/toggle/toggle.constants';
  * @csspart help-text - The helper/validation text element.
  * @csspart helper-icon - The helper/validation icon element that is displayed next to the helper/validation text.
  * @csspart help-text-container - The container for the helper/validation icon and text elements.
- * @csspart container - The container element that wraps the toggle input.
+ * @csspart static-toggle - The static-toggle element that wraps the toggle input.
  * @csspart toggle-input - The native checkbox input element styled as a toggle switch.
  */
 const reactWrapper = createComponent({

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@momentum-design/components",
   "packageManager": "yarn@3.2.4",
-  "version": "0.120.31",
+  "version": "0.120.33",
   "engines": {
     "node": ">=20.0.0",
     "npm": ">=8.0.0"