@momentum-design/components 0.104.1 → 0.104.3

package/dist/components/accordionbutton/accordionbutton.types.d.ts

@@ -1,8 +1,11 @@
-import type { ValueOf } from '../../utils/types';
+import type { TypedCustomEvent, ValueOf } from '../../utils/types';
+import type AccordionButton from './accordionbutton.component';
 import { ICON_NAME, VARIANT } from './accordionbutton.constants';
 type Variant = ValueOf<typeof VARIANT>;
 type IconName = ValueOf<typeof ICON_NAME>;
 interface Events {
-    onShownEvent: Event;
+    onShownEvent: TypedCustomEvent<AccordionButton, {
+        expanded: boolean;
+    }>;
 }
 export type { Variant, IconName, Events };

package/dist/components/animation/animation.types.d.ts

@@ -1,12 +1,20 @@
 import type AnimationNames from '@momentum-design/animations/dist/types/types';
+import type { TypedCustomEvent } from '../../utils/types';
+import type Animation from './animation.component';
 /** Event mapping for React */
 interface Events {
     /** This event is dispatched when the animation is loaded */
-    onLoadEvent: Event;
+    onLoadEvent: TypedCustomEvent<Animation, {
+        name: AnimationNames;
+    }>;
     /** This event is dispatched when all animation loops completed */
-    onCompleteEvent: Event;
+    onCompleteEvent: TypedCustomEvent<Animation, {
+        name: AnimationNames;
+    }>;
     /** This event is dispatched when animation loading failed */
-    onErrorEvent: Event;
+    onErrorEvent: TypedCustomEvent<Animation, {
+        error: Error;
+    }>;
 }
 type LoopType = `${boolean | number}`;
 export type { Events, AnimationNames, LoopType };

package/dist/components/brandvisual/brandvisual.types.d.ts

@@ -1,6 +1,12 @@
 import type BrandVisualNames from '@momentum-design/brand-visuals/dist/types/types';
+import type { TypedCustomEvent } from '../../utils/types';
+import type Brandvisual from './brandvisual.component';
 interface Events {
-    onLoadEvent: Event;
-    onErrorEvent: Event;
+    onLoadEvent: TypedCustomEvent<Brandvisual, {
+        name: BrandVisualNames;
+    }>;
+    onErrorEvent: TypedCustomEvent<Brandvisual, {
+        error: Error;
+    }>;
 }
 export type { BrandVisualNames, Events };

package/dist/components/buttonlink/buttonlink.types.d.ts

@@ -1,7 +1,9 @@
+import type { OverrideEventTarget } from "../../utils/types";
+import type ButtonLink from "./buttonlink.component";
 interface Events {
-    onClickEvent: MouseEvent;
-    onKeyDownEvent: KeyboardEvent;
-    onFocusEvent: FocusEvent;
-    onBlurEvent: Event;
+    onClickEvent: OverrideEventTarget<MouseEvent, ButtonLink>;
+    onKeyDownEvent: OverrideEventTarget<KeyboardEvent, ButtonLink>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, ButtonLink>;
+    onBlurEvent: OverrideEventTarget<FocusEvent, ButtonLink>;
 }
 export type { Events };

package/dist/components/buttonsimple/buttonsimple.types.d.ts

@@ -1,11 +1,12 @@
-import type { ValueOf } from '../../utils/types';
+import type { OverrideEventTarget, ValueOf } from '../../utils/types';
+import type ButtonSimple from './buttonsimple.component';
 import { BUTTON_TYPE, BUTTON_SIZES } from './buttonsimple.constants';
 type ButtonSize = ValueOf<typeof BUTTON_SIZES>;
 type ButtonType = ValueOf<typeof BUTTON_TYPE>;
 interface Events {
-    onClickEvent: MouseEvent;
-    onKeyDownEvent: KeyboardEvent;
-    onKeyUpEvent: KeyboardEvent;
-    onFocusEvent: FocusEvent;
+    onClickEvent: OverrideEventTarget<MouseEvent, ButtonSimple>;
+    onKeyDownEvent: OverrideEventTarget<KeyboardEvent, ButtonSimple>;
+    onKeyUpEvent: OverrideEventTarget<KeyboardEvent, ButtonSimple>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, ButtonSimple>;
 }
 export type { ButtonSize, ButtonType, Events };

package/dist/components/cardbutton/cardbutton.types.d.ts

@@ -1,7 +1,9 @@
+import type { OverrideEventTarget } from "../../utils/types";
+import type CardButton from "./cardbutton.component";
 interface Events {
-    onClickEvent: MouseEvent;
-    onKeyDownEvent: KeyboardEvent;
-    onKeyUpEvent: KeyboardEvent;
-    onFocusEvent: FocusEvent;
+    onClickEvent: OverrideEventTarget<MouseEvent, CardButton>;
+    onKeyDownEvent: OverrideEventTarget<KeyboardEvent, CardButton>;
+    onKeyUpEvent: OverrideEventTarget<KeyboardEvent, CardButton>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, CardButton>;
 }
 export type { Events };

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

@@ -46,7 +46,6 @@ declare const CardCheckbox_base: import("../../utils/mixins/index.types").Constr
  * It toggles the checked state when enter key is used.
  * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the card.
  * It toggles the checked state when space key is used.
- * @event change - (React: onChange) Event that gets dispatched when the card state changes.
  * @event focus - (React: onFocus) Event that gets dispatched when the card receives focus.
  *
  */

package/dist/components/cardcheckbox/cardcheckbox.component.js

@@ -60,7 +60,6 @@ import styles from './cardcheckbox.styles';
  * It toggles the checked state when enter key is used.
  * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the card.
  * It toggles the checked state when space key is used.
- * @event change - (React: onChange) Event that gets dispatched when the card state changes.
  * @event focus - (React: onFocus) Event that gets dispatched when the card receives focus.
  *
  */

package/dist/components/cardcheckbox/cardcheckbox.types.d.ts

@@ -1,11 +1,11 @@
-import type { ValueOf } from '../../utils/types';
+import type { OverrideEventTarget, ValueOf } from '../../utils/types';
+import type CardCheckbox from './cardcheckbox.component';
 import { SELECTION_TYPE } from './cardcheckbox.constants';
 type SelectionType = ValueOf<typeof SELECTION_TYPE>;
 interface Events {
-    onClickEvent: MouseEvent;
-    onKeyDownEvent: KeyboardEvent;
-    onKeyUpEvent: KeyboardEvent;
-    onFocusEvent: FocusEvent;
-    onChangeEvent: Event;
+    onClickEvent: OverrideEventTarget<MouseEvent, CardCheckbox>;
+    onKeyDownEvent: OverrideEventTarget<KeyboardEvent, CardCheckbox>;
+    onKeyUpEvent: OverrideEventTarget<KeyboardEvent, CardCheckbox>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, CardCheckbox>;
 }
 export { SelectionType, Events };

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

@@ -45,7 +45,6 @@ declare const CardRadio_base: import("../../utils/mixins/index.types").Construct
  * It toggles the checked state when enter key is used.
  * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the card.
  * It toggles the checked state when space key is used.
- * @event change - (React: onChange) Event that gets dispatched when the card state changes.
  * @event focus - (React: onFocus) Event that gets dispatched when the card receives focus.
  *
  */

package/dist/components/cardradio/cardradio.component.js

@@ -60,7 +60,6 @@ import styles from './cardradio.styles';
  * It toggles the checked state when enter key is used.
  * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the card.
  * It toggles the checked state when space key is used.
- * @event change - (React: onChange) Event that gets dispatched when the card state changes.
  * @event focus - (React: onFocus) Event that gets dispatched when the card receives focus.
  *
  */

package/dist/components/cardradio/cardradio.types.d.ts

@@ -1,8 +1,9 @@
+import type { OverrideEventTarget } from '../../utils/types';
+import type CardRadio from './cardradio.component';
 interface Events {
-    onClickEvent: MouseEvent;
-    onKeyDownEvent: KeyboardEvent;
-    onKeyUpEvent: KeyboardEvent;
-    onFocusEvent: FocusEvent;
-    onChangeEvent: Event;
+    onClickEvent: OverrideEventTarget<MouseEvent, CardRadio>;
+    onKeyDownEvent: OverrideEventTarget<KeyboardEvent, CardRadio>;
+    onKeyUpEvent: OverrideEventTarget<KeyboardEvent, CardRadio>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, CardRadio>;
 }
 export type { Events };

package/dist/components/checkbox/checkbox.types.d.ts

@@ -1,5 +1,7 @@
+import type { OverrideEventTarget, TypedCustomEvent } from "../../utils/types";
+import type Checkbox from "./checkbox.component";
 interface Events {
-    onChangeEvent: Event;
-    onFocusEvent: FocusEvent;
+    onChangeEvent: TypedCustomEvent<Checkbox>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, Checkbox>;
 }
 export type { Events };

package/dist/components/dialog/dialog.types.d.ts

@@ -1,13 +1,24 @@
-import type { ValueOf } from '../../utils/types';
+import type { TypedCustomEvent, ValueOf } from '../../utils/types';
+import type Dialog from './dialog.component';
 import { DIALOG_ROLE, DIALOG_SIZE, DIALOG_VARIANT } from './dialog.constants';
 type DialogRole = (typeof DIALOG_ROLE)[number];
 type DialogSize = ValueOf<typeof DIALOG_SIZE>;
 type DialogVariant = ValueOf<typeof DIALOG_VARIANT>;
 interface Events {
-    onShownEvent: Event;
-    onHiddenEvent: Event;
-    onCreatedEvent: Event;
-    onDestroyedEvent: Event;
-    onCloseEvent: Event;
+    onShownEvent: TypedCustomEvent<Dialog, {
+        show: boolean;
+    }>;
+    onHiddenEvent: TypedCustomEvent<Dialog, {
+        show: boolean;
+    }>;
+    onCreatedEvent: TypedCustomEvent<Dialog, {
+        show: boolean;
+    }>;
+    onDestroyedEvent: TypedCustomEvent<Dialog, {
+        show: boolean;
+    }>;
+    onCloseEvent: TypedCustomEvent<Dialog, {
+        show: boolean;
+    }>;
 }
 export type { DialogSize, DialogRole, DialogVariant, Events };

package/dist/components/input/input.types.d.ts

@@ -1,16 +1,16 @@
-import type { TypedEvent, ValueOf } from '../../utils/types';
+import type { OverrideEventTarget, TypedCustomEvent, ValueOf } from '../../utils/types';
 import type Input from './input.component';
 import { AUTO_CAPITALIZE, AUTO_COMPLETE, INPUT_TYPE } from './input.constants';
 type AutoCapitalizeType = ValueOf<typeof AUTO_CAPITALIZE>;
 type AutoCompleteType = ValueOf<typeof AUTO_COMPLETE>;
 type InputType = ValueOf<typeof INPUT_TYPE>;
-type InputClearEvent = TypedEvent<Input>;
-type InputChangeEvent = TypedEvent<Input>;
+type InputClearEvent = TypedCustomEvent<Input>;
+type InputChangeEvent = TypedCustomEvent<Input>;
 interface Events {
-    onInputEvent: InputEvent;
+    onInputEvent: OverrideEventTarget<InputEvent, Input>;
     onChangeEvent: InputChangeEvent;
-    onFocusEvent: FocusEvent;
-    onBlurEvent: FocusEvent;
+    onFocusEvent: OverrideEventTarget<FocusEvent, Input>;
+    onBlurEvent: OverrideEventTarget<FocusEvent, Input>;
     onClearEvent: InputClearEvent;
 }
 export type { AutoCapitalizeType, AutoCompleteType, InputType, InputClearEvent, InputChangeEvent, Events };

package/dist/components/inputchip/inputchip.types.d.ts

@@ -1,4 +1,6 @@
+import type { TypedCustomEvent } from "../../utils/types";
+import type InputChip from "./inputchip.component";
 interface Events {
-    onRemoveEvent: Event;
+    onRemoveEvent: TypedCustomEvent<InputChip>;
 }
 export type { Events };

package/dist/components/link/link.types.d.ts

@@ -1,10 +1,11 @@
-import type { ValueOf } from '../../utils/types';
+import type { OverrideEventTarget, ValueOf } from '../../utils/types';
+import type Link from './link.component';
 import { LINK_SIZES } from './link.constants';
 type LinkSize = ValueOf<typeof LINK_SIZES>;
 interface Events {
-    onClickEvent: MouseEvent;
-    onBlurEvent: Event;
-    onKeyDownEvent: KeyboardEvent;
-    onFocusEvent: FocusEvent;
+    onClickEvent: OverrideEventTarget<MouseEvent, Link>;
+    onBlurEvent: OverrideEventTarget<FocusEvent, Link>;
+    onKeyDownEvent: OverrideEventTarget<KeyboardEvent, Link>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, Link>;
 }
 export type { LinkSize, Events };

package/dist/components/linkbutton/linkbutton.types.d.ts

@@ -1,10 +1,11 @@
-import type { ValueOf } from '../../utils/types';
+import type { OverrideEventTarget, ValueOf } from '../../utils/types';
+import type LinkButton from './linkbutton.component';
 import { LINKBUTTON_SIZES } from './linkbutton.constants';
 type LinkButtonSize = ValueOf<typeof LINKBUTTON_SIZES>;
 interface Events {
-    onClickEvent: MouseEvent;
-    onKeyDownEvent: KeyboardEvent;
-    onFocusEvent: FocusEvent;
-    onBlurEvent: Event;
+    onClickEvent: OverrideEventTarget<MouseEvent, LinkButton>;
+    onKeyDownEvent: OverrideEventTarget<KeyboardEvent, LinkButton>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, LinkButton>;
+    onBlurEvent: OverrideEventTarget<FocusEvent, LinkButton>;
 }
 export type { Events, LinkButtonSize };

package/dist/components/linksimple/linksimple.types.d.ts

@@ -1,7 +1,9 @@
+import type { OverrideEventTarget } from "../../utils/types";
+import type LinkSimple from "./linksimple.component";
 interface Events {
-    onClickEvent: MouseEvent;
-    onBlurEvent: Event;
-    onKeyDownEvent: KeyboardEvent;
-    onFocusEvent: FocusEvent;
+    onClickEvent: OverrideEventTarget<MouseEvent, LinkSimple>;
+    onBlurEvent: OverrideEventTarget<FocusEvent, LinkSimple>;
+    onKeyDownEvent: OverrideEventTarget<KeyboardEvent, LinkSimple>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, LinkSimple>;
 }
 export type { Events };

package/dist/components/listitem/listitem.types.d.ts

@@ -1,21 +1,22 @@
-import type { ValueOf } from '../../utils/types';
+import type { OverrideEventTarget, TypedCustomEvent, ValueOf } from '../../utils/types';
+import type ListItem from './listitem.component';
 import { LISTITEM_VARIANTS } from './listitem.constants';
 export type ListItemVariants = ValueOf<typeof LISTITEM_VARIANTS>;
 export interface Events {
-    onClickEvent: MouseEvent;
-    onKeyDownEvent: KeyboardEvent;
-    onKeyUpEvent: KeyboardEvent;
-    onFocusEvent: FocusEvent;
-    onEnabledEvent: Event;
-    onDisabledEvent: Event;
-    onCreatedEvent: Event;
-    onDestroyedEvent: Event;
+    onClickEvent: OverrideEventTarget<MouseEvent, ListItem>;
+    onKeyDownEvent: OverrideEventTarget<KeyboardEvent, ListItem>;
+    onKeyUpEvent: OverrideEventTarget<KeyboardEvent, ListItem>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, ListItem>;
+    onEnabledEvent: TypedCustomEvent<ListItem>;
+    onDisabledEvent: TypedCustomEvent<ListItem>;
+    onCreatedEvent: TypedCustomEvent<ListItem>;
+    onDestroyedEvent: TypedCustomEvent<ListItem>;
 }
 declare global {
     interface GlobalEventHandlersEventMap {
-        disabled: Event;
-        enabled: Event;
-        created: Event;
-        destroyed: Event;
+        disabled: TypedCustomEvent<ListItem>;
+        enabled: TypedCustomEvent<ListItem>;
+        created: TypedCustomEvent<ListItem>;
+        destroyed: TypedCustomEvent<ListItem>;
     }
 }

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

@@ -31,6 +31,10 @@ import type { ArrowPositions, ArrowDirections } from './menuitem.types';
  * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the menuitem.
  * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the menuitem.
  * @event focus - (React: onFocus) This event is dispatched when the menuitem receives focus.
+ * @event enabled - (React: onEnabled) This event is dispatched after the menuitem is enabled
+ * @event disabled - (React: onDisabled) This event is dispatched after the menuitem is disabled
+ * @event created - (React: onCreated) This event is dispatched after the menuitem is created (added to the DOM)
+ * @event destroyed - (React: onDestroyed) This event is dispatched after the menuitem is destroyed (removed from the DOM)
  */
 declare class MenuItem extends ListItem {
     /**

package/dist/components/menuitem/menuitem.component.js

@@ -45,6 +45,10 @@ import styles from './menuitem.styles';
  * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the menuitem.
  * @event keyup - (React: onKeyUp) This event is dispatched when a key is released on the menuitem.
  * @event focus - (React: onFocus) This event is dispatched when the menuitem receives focus.
+ * @event enabled - (React: onEnabled) This event is dispatched after the menuitem is enabled
+ * @event disabled - (React: onDisabled) This event is dispatched after the menuitem is disabled
+ * @event created - (React: onCreated) This event is dispatched after the menuitem is created (added to the DOM)
+ * @event destroyed - (React: onDestroyed) This event is dispatched after the menuitem is destroyed (removed from the DOM)
  */
 class MenuItem extends ListItem {
     constructor() {

package/dist/components/menuitem/menuitem.types.d.ts

@@ -1,9 +1,15 @@
-import type { ValueOf } from '../../utils/types';
+import type { OverrideEventTarget, TypedCustomEvent, ValueOf } from '../../utils/types';
+import type MenuItem from './menuitem.component';
 import { ARROW_POSITIONS, ARROW_DIRECTIONS } from './menuitem.constants';
 interface Events {
-    onChangeEvent: Event;
-    onClickEvent: MouseEvent;
-    onFocusEvent: FocusEvent;
+    onClickEvent: OverrideEventTarget<MouseEvent, MenuItem>;
+    onKeyDownEvent: OverrideEventTarget<KeyboardEvent, MenuItem>;
+    onKeyUpEvent: OverrideEventTarget<KeyboardEvent, MenuItem>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, MenuItem>;
+    onEnabledEvent: TypedCustomEvent<MenuItem>;
+    onDisabledEvent: TypedCustomEvent<MenuItem>;
+    onCreatedEvent: TypedCustomEvent<MenuItem>;
+    onDestroyedEvent: TypedCustomEvent<MenuItem>;
 }
 type ArrowPositions = ValueOf<typeof ARROW_POSITIONS>;
 type ArrowDirections = ValueOf<typeof ARROW_DIRECTIONS>;

package/dist/components/menuitemcheckbox/menuitemcheckbox.types.d.ts

@@ -1,9 +1,10 @@
-import { ValueOf } from '../../utils/types';
+import type { OverrideEventTarget, TypedCustomEvent, ValueOf } from '../../utils/types';
+import type MenuItemCheckbox from './menuitemcheckbox.component';
 import { INDICATOR } from './menuitemcheckbox.constants';
 type Indicator = ValueOf<typeof INDICATOR>;
 interface Events {
-    onChangeEvent: Event;
-    onClickEvent: MouseEvent;
-    onFocusEvent: FocusEvent;
+    onChangeEvent: TypedCustomEvent<MenuItemCheckbox>;
+    onClickEvent: OverrideEventTarget<MouseEvent, MenuItemCheckbox>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, MenuItemCheckbox>;
 }
 export type { Events, Indicator };

package/dist/components/menuitemradio/menuitemradio.types.d.ts

@@ -1,9 +1,10 @@
-import { ValueOf } from '../../utils/types';
+import type { TypedCustomEvent, OverrideEventTarget, ValueOf } from '../../utils/types';
+import type MenuItemRadio from './menuitemradio.component';
 import { INDICATOR } from './menuitemradio.constants';
 type Indicator = ValueOf<typeof INDICATOR>;
 interface Events {
-    onChangeEvent: Event;
-    onClickEvent: MouseEvent;
-    onFocusEvent: FocusEvent;
+    onChangeEvent: TypedCustomEvent<MenuItemRadio>;
+    onClickEvent: OverrideEventTarget<MouseEvent, MenuItemRadio>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, MenuItemRadio>;
 }
 export type { Events, Indicator };

package/dist/components/menupopover/menupopover.types.d.ts

@@ -1,10 +1,7 @@
-import type MenuItem from '../menuitem';
-export type MenuPopoverChangeEvent = Event & {
-    target: MenuItem;
-};
-export type MenuPopoverActionEvent = Event & {
-    target: MenuItem;
-};
+import type { TypedCustomEvent } from '../../utils/types';
+import type MenuItem from '../menuitem/menuitem.component';
+export type MenuPopoverChangeEvent = TypedCustomEvent<MenuItem>;
+export type MenuPopoverActionEvent = TypedCustomEvent<MenuItem>;
 export interface Events {
     onChangeEvent: MenuPopoverChangeEvent;
     onActionEvent: MenuPopoverActionEvent;

package/dist/components/menusection/menusection.types.d.ts

@@ -1,7 +1,6 @@
-import type MenuItem from '../menuitem';
-export type MenuSectionChangeEvent = Event & {
-    target: MenuItem;
-};
+import type { TypedCustomEvent } from '../../utils/types';
+import type MenuItem from '../menuitem/menuitem.component';
+export type MenuSectionChangeEvent = TypedCustomEvent<MenuItem>;
 export interface Events {
     onChangeEvent: MenuSectionChangeEvent;
 }

package/dist/components/navmenuitem/navmenuitem.types.d.ts

@@ -1,11 +1,15 @@
-import { ValueOf } from '../../utils/types';
+import type { OverrideEventTarget, TypedCustomEvent, ValueOf } from '../../utils/types';
+import type NavMenuItem from './navmenuitem.component';
 import { ALLOWED_BADGE_TYPES } from './navmenuitem.constants';
 type BadgeType = ValueOf<typeof ALLOWED_BADGE_TYPES>;
 interface Events {
-    onClickEvent: MouseEvent;
-    onKeyDownEvent: KeyboardEvent;
-    onKeyUpEvent: KeyboardEvent;
-    onFocusEvent: FocusEvent;
-    onActiveChangeEvent: Event;
+    onClickEvent: OverrideEventTarget<MouseEvent, NavMenuItem>;
+    onKeyDownEvent: OverrideEventTarget<KeyboardEvent, NavMenuItem>;
+    onKeyUpEvent: OverrideEventTarget<KeyboardEvent, NavMenuItem>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, NavMenuItem>;
+    onActiveChangeEvent: TypedCustomEvent<NavMenuItem, {
+        navId: string;
+        active: boolean;
+    }>;
 }
 export type { Events, BadgeType };

package/dist/components/option/option.types.d.ts

@@ -1,7 +1,9 @@
+import type { OverrideEventTarget } from "../../utils/types";
+import type Option from "./option.component";
 interface Events {
-    onClickEvent: MouseEvent;
-    onKeyDownEvent: KeyboardEvent;
-    onKeyUpEvent: KeyboardEvent;
-    onFocusEvent: FocusEvent;
+    onClickEvent: OverrideEventTarget<MouseEvent, Option>;
+    onKeyDownEvent: OverrideEventTarget<KeyboardEvent, Option>;
+    onKeyUpEvent: OverrideEventTarget<KeyboardEvent, Option>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, Option>;
 }
 export type { Events };

package/dist/components/password/password.types.d.ts

@@ -1,7 +1,9 @@
+import type { OverrideEventTarget, TypedCustomEvent } from "../../utils/types";
+import type Password from "./password.component";
 interface Events {
-    onInputEvent: InputEvent;
-    onChangeEvent: Event;
-    onFocusEvent: FocusEvent;
-    onBlurEvent: FocusEvent;
+    onInputEvent: OverrideEventTarget<InputEvent, Password>;
+    onChangeEvent: TypedCustomEvent<Password>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, Password>;
+    onBlurEvent: OverrideEventTarget<FocusEvent, Password>;
 }
 export type { Events };

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

@@ -1,19 +1,19 @@
-import type { ValueOf, TypedEvent } from '../../utils/types';
+import type { ValueOf, TypedCustomEvent } from '../../utils/types';
 import type Popover from './popover.component';
 import { POPOVER_PLACEMENT, TRIGGER, COLOR } from './popover.constants';
 type PopoverPlacement = ValueOf<typeof POPOVER_PLACEMENT>;
 type PopoverColor = ValueOf<typeof COLOR>;
 type PopoverTrigger = ValueOf<typeof TRIGGER> | `${ValueOf<typeof TRIGGER>} ${ValueOf<typeof TRIGGER>}`;
-type PopoverShownEvent = TypedEvent<Popover, {
+type PopoverShownEvent = TypedCustomEvent<Popover, {
     show: boolean;
 }>;
-type PopoverHiddenEvent = TypedEvent<Popover, {
+type PopoverHiddenEvent = TypedCustomEvent<Popover, {
     show: boolean;
 }>;
-type PopoverCreatedEvent = TypedEvent<Popover, {
+type PopoverCreatedEvent = TypedCustomEvent<Popover, {
     show: boolean;
 }>;
-type PopoverDestroyedEvent = TypedEvent<Popover, {
+type PopoverDestroyedEvent = TypedCustomEvent<Popover, {
     show: boolean;
 }>;
 interface Events {

package/dist/components/radio/radio.types.d.ts

@@ -1,5 +1,7 @@
+import type { OverrideEventTarget, TypedCustomEvent } from "../../utils/types";
+import type Radio from "./radio.component";
 interface Events {
-    onChangeEvent: Event;
-    onFocusEvent: FocusEvent;
+    onChangeEvent: TypedCustomEvent<Radio>;
+    onFocusEvent: OverrideEventTarget<FocusEvent, Radio>;
 }
 export type { Events };

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

@@ -46,6 +46,8 @@ declare const Select_base: import("../../utils/mixins/index.types").Constructor<
  * @cssproperty --mdc-select-border-color-warning - The border color of the select when in warning state.
  * @cssproperty --mdc-select-border-color-error - The border color of the select when in error state.
  * @cssproperty --mdc-select-width - The width of the select.
+ * @cssproperty --mdc-select-listbox-height - The height of the listbox inside the select.
+ * @cssproperty --mdc-select-listbox-width - The width of the listbox inside the select (default: `--mdc-select-width`).
  */
 declare class Select extends Select_base implements AssociatedFormControl {
     /**
@@ -57,12 +59,6 @@ declare class Select extends Select_base implements AssociatedFormControl {
      * @default false
      */
     readonly: boolean;
-    /**
-     * height attribute of the select field. If set,
-     * then a scroll bar will be visible when there more options than the adjusted height.
-     * @default auto
-     */
-    height: string;
     /**
      * The placeholder text which will be shown on the text if provided.
      */

package/dist/components/select/select.component.js

@@ -62,6 +62,8 @@ import styles from './select.styles';
  * @cssproperty --mdc-select-border-color-warning - The border color of the select when in warning state.
  * @cssproperty --mdc-select-border-color-error - The border color of the select when in error state.
  * @cssproperty --mdc-select-width - The width of the select.
+ * @cssproperty --mdc-select-listbox-height - The height of the listbox inside the select.
+ * @cssproperty --mdc-select-listbox-width - The width of the listbox inside the select (default: `--mdc-select-width`).
  */
 class Select extends FormInternalsMixin(DataAriaLabelMixin(FormfieldWrapper)) {
     constructor() {
@@ -71,12 +73,6 @@ class Select extends FormInternalsMixin(DataAriaLabelMixin(FormfieldWrapper)) {
          * @default false
          */
         this.readonly = false;
-        /**
-         * height attribute of the select field. If set,
-         * then a scroll bar will be visible when there more options than the adjusted height.
-         * @default auto
-         */
-        this.height = 'auto';
         /**
          * The placeholder text which will be shown on the text if provided.
          */
@@ -563,7 +559,6 @@ class Select extends FormInternalsMixin(DataAriaLabelMixin(FormfieldWrapper)) {
           @closebyoutsideclick="${() => {
             this.displayPopover = false;
         }}"
-          style="--mdc-popover-max-width: var(--mdc-select-width); --mdc-popover-max-height: ${this.height};"
         >
           <slot @click="${this.handleOptionsClick}"></slot>
         </mdc-popover>
@@ -581,10 +576,6 @@ __decorate([
     property({ type: Boolean }),
     __metadata("design:type", Object)
 ], Select.prototype, "readonly", void 0);
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", Object)
-], Select.prototype, "height", void 0);
 __decorate([
     property({ type: String, reflect: true }),
     __metadata("design:type", String)

package/dist/components/select/select.styles.js

@@ -15,6 +15,8 @@ const styles = css `
     --mdc-select-border-color-warning: var(--mds-color-theme-text-warning-normal);
     --mdc-select-border-color-error: var(--mds-color-theme-text-error-normal);
     --mdc-select-width: 100%;
+    --mdc-select-listbox-width: var(--mdc-select-width);
+    --mdc-select-listbox-height: auto;
 
     display: flex;
     flex-direction: column;
@@ -79,9 +81,13 @@ const styles = css `
     display: flex;
     padding: 2px;
   }
+
+  /* Popover height, width & padding overrides */
+  :host mdc-popover {
+    --mdc-popover-max-width: var(--mdc-select-listbox-width);
+    --mdc-popover-max-height: var(--mdc-select-listbox-height);
+  }
   :host mdc-popover::part(popover-content) {
-    min-width: auto;
-    width: var(--mdc-select-width);
     max-height: var(--mdc-popover-max-height);
     padding: 0.75rem 0.5rem;
   }