@consta/uikit 3.9.1 → 3.11.0

package/__internal__/src/components/Button/Button.js

@@ -1,9 +1,10 @@
 import { __assign, __rest } from "tslib";
 import './Button.css';
-import React from 'react';
+import React, { useRef } from 'react';
+import { useForkRef } from '../../hooks/useForkRef/useForkRef';
 import { cnMixFocus } from '../../mixs/MixFocus/MixFocus';
 import { cn } from '../../utils/bem';
-import { getSizeByMap } from '../../utils/getSizeByMap';
+import { getByMap } from '../../utils/getByMap';
 import { forwardRefWithAs } from '../../utils/types/PropsWithAsAttributes';
 import { usePropsHandler } from '../EventInterceptor/usePropsHandler';
 import { Loader } from '../Loader/Loader';
@@ -38,7 +39,8 @@ var sizeMapOnlyIcon = {
     l: 'm'
 };
 export var Button = forwardRefWithAs(function (props, ref) {
-    var _a = usePropsHandler(COMPONENT_NAME, props, ref), _b = _a.size, size = _b === void 0 ? buttonPropSizeDefault : _b, _c = _a.view, view = _c === void 0 ? buttonPropViewDefault : _c, _d = _a.width, width = _d === void 0 ? buttonPropWidthDefault : _d, _e = _a.form, form = _e === void 0 ? buttonPropFormDefault : _e, iconLeft = _a.iconLeft, iconRight = _a.iconRight, label = _a.label, className = _a.className, onClick = _a.onClick, disabled = _a.disabled, loading = _a.loading, tabIndex = _a.tabIndex, _f = _a.as, as = _f === void 0 ? 'button' : _f, onlyIcon = _a.onlyIcon, iconSizeProp = _a.iconSize, otherProps = __rest(_a, ["size", "view", "width", "form", "iconLeft", "iconRight", "label", "className", "onClick", "disabled", "loading", "tabIndex", "as", "onlyIcon", "iconSize"]);
+    var buttonRef = useRef(null);
+    var _a = usePropsHandler(COMPONENT_NAME, props, buttonRef), _b = _a.size, size = _b === void 0 ? buttonPropSizeDefault : _b, _c = _a.view, view = _c === void 0 ? buttonPropViewDefault : _c, _d = _a.width, width = _d === void 0 ? buttonPropWidthDefault : _d, _e = _a.form, form = _e === void 0 ? buttonPropFormDefault : _e, iconLeft = _a.iconLeft, iconRight = _a.iconRight, label = _a.label, className = _a.className, onClick = _a.onClick, disabled = _a.disabled, loading = _a.loading, tabIndex = _a.tabIndex, _f = _a.as, as = _f === void 0 ? 'button' : _f, onlyIcon = _a.onlyIcon, iconSizeProp = _a.iconSize, otherProps = __rest(_a, ["size", "view", "width", "form", "iconLeft", "iconRight", "label", "className", "onClick", "disabled", "loading", "tabIndex", "as", "onlyIcon", "iconSize"]);
     var Tag = as;
     var IconOnly = (!label || onlyIcon) && (iconLeft || iconRight);
     var IconLeft = iconLeft;
@@ -46,8 +48,8 @@ export var Button = forwardRefWithAs(function (props, ref) {
     var withIcon = !!iconLeft || !!iconRight;
     var title = props.title || (!!IconOnly && label) || undefined;
     var iconSize = IconOnly
-        ? getSizeByMap(sizeMapOnlyIcon, size, iconSizeProp)
-        : getSizeByMap(sizeMap, size, iconSizeProp);
+        ? getByMap(sizeMapOnlyIcon, size, iconSizeProp)
+        : getByMap(sizeMap, size, iconSizeProp);
     var handleClick = function (e) {
         if (!disabled && !loading && onClick) {
             onClick(e);
@@ -62,7 +64,7 @@ export var Button = forwardRefWithAs(function (props, ref) {
             loading: loading,
             withIcon: withIcon,
             onlyIcon: !!IconOnly
-        }, [cnMixFocus(), className]), tabIndex: tabIndex, title: title, ref: ref }, (Tag === 'button' ? { disabled: disabled || loading } : {})),
+        }, [cnMixFocus(), className]), tabIndex: tabIndex, title: title, ref: useForkRef([ref, buttonRef]) }, (Tag === 'button' ? { disabled: disabled || loading } : {})),
         IconOnly && React.createElement(IconOnly, { className: cnButton('Icon'), size: iconSize }),
         !IconOnly &&
             ((IconLeft || IconRight) && label ? (React.createElement(React.Fragment, null,

package/__internal__/src/components/Calendar/Calendar.js

@@ -2,7 +2,7 @@ import { __assign, __rest } from "tslib";
 import './Calendar.css';
 import React from 'react';
 import { cn } from '../../utils/bem';
-import { getSizeByMap } from '../../utils/getSizeByMap';
+import { getByMap } from '../../utils/getByMap';
 import { CalendarViewOneMonth } from './CalendarViewOneMonth/CalendarViewOneMonth';
 import { CalendarViewSlider } from './CalendarViewSlider/CalendarViewSlider';
 import { CalendarViewTwoMonths } from './CalendarViewTwoMonths/CalendarViewTwoMonths';
@@ -15,7 +15,7 @@ var viewMap = {
 };
 export var Calendar = React.forwardRef(function (props, ref) {
     var _a = props.view, view = _a === void 0 ? calendarPropViewDefault : _a, className = props.className, otherProps = __rest(props, ["view", "className"]);
-    var ViewComponent = getSizeByMap(viewMap, view);
+    var ViewComponent = getByMap(viewMap, view);
     return React.createElement(ViewComponent, __assign({}, otherProps, { ref: ref, className: cnCalendar(null, [className]) }));
 });
 export * from './CalendarCell/CalendarCell';

package/__internal__/src/components/ChoiceGroup/ChoiceGroup.d.ts

@@ -16,7 +16,12 @@ export declare type СhoiceGroupPropWidth = typeof choiceGroupWidth[number];
 export declare const choiceGroupWidthDefault: СhoiceGroupPropWidth;
 export declare type ChoiceGroupPropGetLabel<ITEM> = (item: ITEM) => string | number;
 export declare type ChoiceGroupPropGetIcon<ITEM> = (item: ITEM) => React.FC<IconProps> | undefined;
-declare type CommonProps<ITEM> = {
+export declare type ChoiceGroupPropValue<ITEM, MULTIPLE extends boolean> = (MULTIPLE extends true ? ITEM[] : ITEM) | null;
+export declare type ChoiceGroupPropOnChange<ITEM, MULTIPLE extends boolean> = (props: {
+    e: React.ChangeEvent<HTMLInputElement>;
+    value: MULTIPLE extends true ? ITEM[] | null : ITEM;
+}) => void;
+declare type Props<ITEM, MULTIPLE extends boolean = false> = PropsWithHTMLAttributesAndRef<{
     size?: ChoiceGroupPropSize;
     form?: ChoiceGroupPropForm;
     view?: ChoiceGroupPropView;
@@ -27,30 +32,14 @@ declare type CommonProps<ITEM> = {
     getLabel: ChoiceGroupPropGetLabel<ITEM>;
     getIcon?: ChoiceGroupPropGetIcon<ITEM>;
     name: string;
-    children?: never;
     disabled?: boolean;
     getDisabled?: (item: ITEM) => boolean | undefined;
-};
-declare type OnChangeMultiple<ITEM> = (props: {
-    e: React.ChangeEvent<HTMLInputElement>;
-    value: ITEM[] | null;
-}) => void;
-declare type OnChangeWithoutMultiple<ITEM> = (props: {
-    e: React.ChangeEvent<HTMLInputElement>;
-    value: ITEM;
-}) => void;
-declare type PropsWithMultiple<ITEM> = {
-    value?: ITEM[] | null;
-    multiple: true;
-    onChange: OnChangeMultiple<ITEM>;
-};
-declare type PropsWithoutMultiple<ITEM> = {
-    value?: ITEM | null;
-    multiple: false;
-    onChange: OnChangeWithoutMultiple<ITEM>;
-};
-declare type Props<ITEM> = PropsWithHTMLAttributesAndRef<CommonProps<ITEM> & (PropsWithMultiple<ITEM> | PropsWithoutMultiple<ITEM>), HTMLDivElement>;
-declare type ChoiceGroup = <ITEM>(props: Props<ITEM>) => React.ReactElement | null;
+    value?: ChoiceGroupPropValue<ITEM, MULTIPLE>;
+    onChange?: ChoiceGroupPropOnChange<ITEM, MULTIPLE>;
+    multiple?: MULTIPLE;
+    children?: never;
+}, HTMLDivElement>;
+declare type ChoiceGroupComponent = <ITEM, MULTIPLE extends boolean = false>(props: Props<ITEM, MULTIPLE>) => React.ReactElement | null;
 export declare const cnChoiceGroup: import("@bem-react/classname").ClassNameFormatter;
-export declare const ChoiceGroup: ChoiceGroup;
+export declare const ChoiceGroup: ChoiceGroupComponent;
 export {};

package/__internal__/src/components/ChoiceGroup/ChoiceGroup.js

@@ -3,7 +3,7 @@ import './ChoiceGroup.css';
 import React from 'react';
 import { useChoiceGroup } from '../../hooks/useChoiceGroup/useChoiceGroup';
 import { cn } from '../../utils/bem';
-import { getSizeByMap } from '../../utils/getSizeByMap';
+import { getByMap } from '../../utils/getByMap';
 import { ChoiceGroupItem } from './Item/ChoiceGroup-Item';
 export var choiceGroupForms = ['default', 'brick', 'round'];
 export var choiceGroupDefaultForm = 'default';
@@ -28,7 +28,7 @@ export var ChoiceGroup = React.forwardRef(function (props, ref) {
         callBack: onChange,
         multiple: multiple
     }), getOnChange = _h.getOnChange, getChecked = _h.getChecked;
-    var iconSize = getSizeByMap(sizeMap, size, iconSizeProp);
+    var iconSize = getByMap(sizeMap, size, iconSizeProp);
     return (React.createElement("div", __assign({}, otherProps, { ref: ref, className: cnChoiceGroup({ size: size, form: form, view: view, width: width, onlyIcon: onlyIcon, disabled: disabled }, [className]) }), items.map(function (item, idx) {
         var itemChecked = getChecked(item);
         var itemDisabled = !!getDisabled && getDisabled(item);

package/__internal__/src/components/Collapse/Collapse.js

@@ -3,7 +3,7 @@ import './Collapse.css';
 import React from 'react';
 import { IconArrowDown } from '../../icons/IconArrowDown/IconArrowDown';
 import { cn } from '../../utils/bem';
-import { getSizeByMap } from '../../utils/getSizeByMap';
+import { getByMap } from '../../utils/getByMap';
 import { Text } from '../Text/Text';
 import { CollapseIcon, collapseIconPropDirection, } from './CollapseIcon/CollapseIcon';
 export var collapsePropSize = ['m', 'l', 's', 'xs', '2xs'];
@@ -48,7 +48,7 @@ export var Collapse = React.forwardRef(function (props, ref) {
                 hoverEffect: hoverEffect,
                 iconPosition: iconPosition
             }) }, otherProps),
-            React.createElement(CollapseIcon, { className: cnCollapse('Icon', { position: iconPosition }), size: getSizeByMap(sizeIconMap, size), icon: icon, closeIcon: closeIcon, isOpen: isOpen, direction: directionIcon, closeDirection: closeDirectionIcon }),
+            React.createElement(CollapseIcon, { className: cnCollapse('Icon', { position: iconPosition }), size: getByMap(sizeIconMap, size), icon: icon, closeIcon: closeIcon, isOpen: isOpen, direction: directionIcon, closeDirection: closeDirectionIcon }),
             React.createElement(Text, { className: cnCollapse('LabelText'), view: view, size: size }, label),
             iconPosition === 'left' && renderSide(rightSide)),
         React.createElement("div", { className: cnCollapse('Body', { isOpen: isOpen, divider: divider }) },

package/__internal__/src/components/Combobox/helpers.d.ts

@@ -97,7 +97,7 @@ export declare function withDefaultGetters<ITEM = DefaultItem, GROUP = DefaultGr
     items: ITEM[];
     onChange: PropOnChange<ITEM, MULTIPLE>;
     disabled?: boolean | undefined;
-    form?: "default" | "round" | "brick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "defaultBrick" | "brickDefault" | "brickClear" | "clearBrick" | "clearClear" | undefined;
+    form?: "default" | "round" | "brick" | "brickDefault" | "defaultBrick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "brickClear" | "clearBrick" | "clearClear" | undefined;
     size?: "s" | "m" | "l" | undefined;
     view?: "default" | "clear" | undefined;
     placeholder?: string | undefined;

package/__internal__/src/components/ContextMenu/ContextMenuGroupHeader/ContextMenuGroupHeader.js

@@ -1,7 +1,7 @@
 import './ContextMenuGroupHeader.css';
 import React from 'react';
 import { cn } from '../../../utils/bem';
-import { getSizeByMap } from '../../../utils/getSizeByMap';
+import { getByMap } from '../../../utils/getByMap';
 import { Text } from '../../Text/Text';
 import { contextMenuDefaultSize } from '../helpers';
 export var cnContextMenuGroupHeader = cn('ContextMenuGroupHeader');
@@ -12,5 +12,5 @@ var sizeMap = {
 };
 export var ContextMenuGroupHeader = function (_a) {
     var label = _a.label, _b = _a.size, size = _b === void 0 ? contextMenuDefaultSize : _b, first = _a.first;
-    return (React.createElement(Text, { view: "secondary", transform: "uppercase", className: cnContextMenuGroupHeader({ size: size, first: first }), size: getSizeByMap(sizeMap, size) }, label));
+    return (React.createElement(Text, { view: "secondary", transform: "uppercase", className: cnContextMenuGroupHeader({ size: size, first: first }), size: getByMap(sizeMap, size) }, label));
 };

package/__internal__/src/components/ContextMenu/ContextMenuLevel/ContextMenuLevel.js

@@ -44,11 +44,11 @@ export var ContextMenuLevel = React.forwardRef(function (props, ref) {
     // props относящиеся к уровню меню
     size = _a === void 0 ? contextMenuDefaultSize : _a, level = props.level, activeItem = props.activeItem, addLevel = props.addLevel, className = props.className, deleteLevel = props.deleteLevel, items = props.items, setHoveredParenLevel = props.setHoveredParenLevel, 
     // props относящиеся к пунктам меню
-    getLabel = props.getLabel, getRightSideBar = props.getRightSideBar, getLeftSideBar = props.getLeftSideBar, getSubItems = props.getSubItems, getGroupId = props.getGroupId, getAccent = props.getAccent, getDisabled = props.getDisabled, getOnClick = props.getOnClick, 
+    getLabel = props.getLabel, getRightSideBar = props.getRightSideBar, getLeftSideBar = props.getLeftSideBar, getSubItems = props.getSubItems, getGroupId = props.getGroupId, getAccent = props.getAccent, getDisabled = props.getDisabled, getOnClick = props.getOnClick, getItemOnClick = props.getItemOnClick, onItemClick = props.onItemClick, 
     // props относящиеся к группам меню
     sortGroup = props.sortGroup, getGroupLabel = props.getGroupLabel, 
     // props относящиеся к поповеру
-    direction = props.direction, possibleDirections = props.possibleDirections, offset = props.offset, onSetDirection = props.onSetDirection, hoveredParenLevel = props.hoveredParenLevel, spareDirection = props.spareDirection, anchorRef = props.anchorRef, otherProps = __rest(props, ["size", "level", "activeItem", "addLevel", "className", "deleteLevel", "items", "setHoveredParenLevel", "getLabel", "getRightSideBar", "getLeftSideBar", "getSubItems", "getGroupId", "getAccent", "getDisabled", "getOnClick", "sortGroup", "getGroupLabel", "direction", "possibleDirections", "offset", "onSetDirection", "hoveredParenLevel", "spareDirection", "anchorRef"]);
+    direction = props.direction, possibleDirections = props.possibleDirections, offset = props.offset, onSetDirection = props.onSetDirection, hoveredParenLevel = props.hoveredParenLevel, spareDirection = props.spareDirection, anchorRef = props.anchorRef, otherProps = __rest(props, ["size", "level", "activeItem", "addLevel", "className", "deleteLevel", "items", "setHoveredParenLevel", "getLabel", "getRightSideBar", "getLeftSideBar", "getSubItems", "getGroupId", "getAccent", "getDisabled", "getOnClick", "getItemOnClick", "onItemClick", "sortGroup", "getGroupLabel", "direction", "possibleDirections", "offset", "onSetDirection", "hoveredParenLevel", "spareDirection", "anchorRef"]);
     var _b = __read(useState(false), 2), hovered = _b[0], setHovered = _b[1];
     var groups = getGroups(items, getGroupId, undefined, undefined, sortGroup && (function (a, b) { return sortGroup(a.key, b.key); }));
     var getItemIndex = function (groupId, itemIndex) { return groupId + "-" + itemIndex; };
@@ -94,7 +94,20 @@ export var ContextMenuLevel = React.forwardRef(function (props, ref) {
                 var leftSide = typeof getLeftSideBar === 'function' ? getLeftSideBar(item) : undefined;
                 var rightSide = typeof getRightSideBar === 'function' ? getRightSideBar(item) : undefined;
                 var subItems = typeof getSubItems === 'function' ? getSubItems(item) : undefined;
-                var onClick = !disabled && typeof getOnClick === 'function' ? getOnClick(item) : undefined;
+                var onClick = function (e) {
+                    var _a, _b;
+                    if (!disabled) {
+                        if (typeof getItemOnClick === 'function') {
+                            (_a = getItemOnClick(item)) === null || _a === void 0 ? void 0 : _a(e);
+                        }
+                        if (typeof getOnClick === 'function') {
+                            (_b = getOnClick(item)) === null || _b === void 0 ? void 0 : _b(e);
+                        }
+                        if (typeof onItemClick === 'function') {
+                            onItemClick === null || onItemClick === void 0 ? void 0 : onItemClick({ e: e, item: item });
+                        }
+                    }
+                };
                 var onMouseEnter = subItems && !disabled
                     ? function () {
                         addLevel(level + 1, subItems, ref, itemIndex);

package/__internal__/src/components/ContextMenu/helpers.d.ts

@@ -16,7 +16,7 @@ export declare type ContextMenuPropGetKey<ITEM> = (item: ITEM) => string | numbe
 export declare type ContextMenuPropGetDisable<ITEM> = (item: ITEM) => boolean | undefined;
 export declare type ContextMenuPropGetGroupLabel = (id: string | number | undefined) => string | number | undefined;
 export declare type ContextMenuPropSortGroup = (a: string | number, b: string | number) => number;
-export declare type ContextMenuPropGetOnClick<ITEM> = (item: ITEM) => React.EventHandler<React.MouseEvent<HTMLDivElement>>;
+export declare type ContextMenuPropGetItemOnClick<ITEM> = (item: ITEM) => React.EventHandler<React.MouseEvent<HTMLDivElement>> | undefined;
 export declare const contextMenuPropSubMenuDirections: readonly ["rightStartUp", "rightStartDown", "leftStartUp", "leftStartDown"];
 export declare type ContextMenuPropSubMenuDirection = typeof contextMenuPropSubMenuDirections[number];
 export declare const contextMenuPropDefaultSubMenuDirection: ContextMenuPropSubMenuDirection;
@@ -38,13 +38,18 @@ export declare type ContextMenuProps<ITEM> = PropsWithHTMLAttributesAndRef<{
     getAccent?: ContextMenuPropGetAccent<ITEM>;
     size?: ContextMenuPropSize;
     sortGroup?: ContextMenuPropSortGroup;
-    getOnClick?: ContextMenuPropGetOnClick<ITEM>;
+    getOnClick?: ContextMenuPropGetItemOnClick<ITEM>;
+    getItemOnClick?: ContextMenuPropGetItemOnClick<ITEM>;
     direction?: Direction;
     possibleDirections?: readonly Direction[];
     subMenuDirection?: ContextMenuPropSubMenuDirection;
     getKey?: ContextMenuPropGetKey<ITEM>;
     getDisabled?: ContextMenuPropGetDisable<ITEM>;
     offset?: number;
+    onItemClick?: (props: {
+        e: React.MouseEvent;
+        item: ITEM;
+    }) => void;
     onClickOutside?: ClickOutsideHandler;
     spareDirection?: Direction;
 } & PositioningProps, HTMLDivElement>;

package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeDate/DatePickerFieldTypeDate.d.ts

@@ -12,7 +12,7 @@ export declare const DatePickerFieldTypeDate: React.ForwardRefExoticComponent<{
     disabled?: boolean | undefined;
     size?: "xs" | "s" | "m" | "l" | undefined;
     view?: "default" | "clear" | undefined;
-    form?: "default" | "round" | "brick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "defaultBrick" | "brickDefault" | "brickClear" | "clearBrick" | "clearClear" | "brickRound" | "roundBrick" | undefined;
+    form?: "default" | "round" | "brick" | "brickRound" | "roundBrick" | "brickDefault" | "defaultBrick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "brickClear" | "clearBrick" | "clearClear" | undefined;
     status?: "alert" | "success" | "warning" | undefined;
     width?: "default" | "full" | undefined;
     onFocus?: ((event: React.FocusEvent<HTMLElement>) => void) | undefined;

package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeDateRange/DatePickerFieldTypeDateRange.d.ts

@@ -13,7 +13,7 @@ export declare const DatePickerFieldTypeDateRange: React.ForwardRefExoticCompone
     disabled?: boolean | undefined;
     size?: "xs" | "s" | "m" | "l" | undefined;
     view?: "default" | "clear" | undefined;
-    form?: "default" | "round" | "brick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "defaultBrick" | "brickDefault" | "brickClear" | "clearBrick" | "clearClear" | "brickRound" | "roundBrick" | undefined;
+    form?: "default" | "round" | "brick" | "brickRound" | "roundBrick" | "brickDefault" | "defaultBrick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "brickClear" | "clearBrick" | "clearClear" | undefined;
     status?: "alert" | "success" | "warning" | undefined;
     width?: "default" | "full" | undefined;
     onFocus?: ((event: React.FocusEvent<HTMLElement>) => void) | undefined;

package/__internal__/src/components/DatePickerCanary/DatePickerFieldTypeDateRange/DatePickerFieldTypeDateRange.js

@@ -4,7 +4,7 @@ import React, { forwardRef, useEffect, useRef, useState } from 'react';
 import isBefore from 'date-fns/isBefore';
 import isEqual from 'date-fns/isEqual';
 import { cn } from '../../../utils/bem';
-import { getSizeByMap } from '../../../utils/getSizeByMap';
+import { getByMap } from '../../../utils/getByMap';
 import { DatePickerFieldTypeDate } from '../DatePickerFieldTypeDate/DatePickerFieldTypeDate';
 import { datePickerErrorTypes } from '../helpers';
 import { mapFormForEnd, mapFormForStart } from './helpers';
@@ -88,6 +88,6 @@ export var DatePickerFieldTypeDateRange = forwardRef(function (props, ref) {
         setEndDate(value === null || value === void 0 ? void 0 : value[1]);
     }, [(_b = value === null || value === void 0 ? void 0 : value[1]) === null || _b === void 0 ? void 0 : _b.getTime()]);
     return (React.createElement("div", __assign({}, otherProps, { className: cnDatePickerFieldTypeDateRange(null, [className]), ref: ref }),
-        React.createElement(DatePickerFieldTypeDate, __assign({}, commonProps, { inputRef: startFieldInputRef, ref: startFieldRef, leftSide: startFieldLeftSide, rightSide: startFieldRightSide, form: getSizeByMap(mapFormForStart, form), value: startDate, onChange: handleStartDateChange, onFocus: startFieldOnFocus, onBlur: startFieldOnBlur, focused: startFocused })),
-        React.createElement(DatePickerFieldTypeDate, __assign({}, commonProps, { inputRef: endFieldInputRef, ref: endFieldRef, leftSide: endFieldLeftSide, rightSide: endFieldRightSide, form: getSizeByMap(mapFormForEnd, form), value: endDate, onChange: handleEndDateChange, onFocus: endFieldOnFocus, onBlur: endFieldOnBlur, focused: endFocused }))));
+        React.createElement(DatePickerFieldTypeDate, __assign({}, commonProps, { inputRef: startFieldInputRef, ref: startFieldRef, leftSide: startFieldLeftSide, rightSide: startFieldRightSide, form: getByMap(mapFormForStart, form), value: startDate, onChange: handleStartDateChange, onFocus: startFieldOnFocus, onBlur: startFieldOnBlur, focused: startFocused })),
+        React.createElement(DatePickerFieldTypeDate, __assign({}, commonProps, { inputRef: endFieldInputRef, ref: endFieldRef, leftSide: endFieldLeftSide, rightSide: endFieldRightSide, form: getByMap(mapFormForEnd, form), value: endDate, onChange: handleEndDateChange, onFocus: endFieldOnFocus, onBlur: endFieldOnBlur, focused: endFocused }))));
 });

package/__internal__/src/components/DatePickerCanary/helpers.d.ts

@@ -104,7 +104,7 @@ export declare const isDateRangeParams: (params: DatePickerProps<DatePickerPropT
     disabled?: boolean | undefined;
     size?: "xs" | "s" | "m" | "l" | undefined;
     view?: "default" | "clear" | undefined;
-    form?: "default" | "round" | "brick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "defaultBrick" | "brickDefault" | "brickClear" | "clearBrick" | "clearClear" | "brickRound" | "roundBrick" | undefined;
+    form?: "default" | "round" | "brick" | "brickRound" | "roundBrick" | "brickDefault" | "defaultBrick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "brickClear" | "clearBrick" | "clearClear" | undefined;
     status?: "alert" | "success" | "warning" | undefined;
     onFocus?: ((event: import("react").FocusEvent<HTMLElement>) => void) | undefined;
     onBlur?: ((event: import("react").FocusEvent<HTMLElement>) => void) | undefined;
@@ -149,7 +149,7 @@ export declare const isNotDateRangeParams: (params: DatePickerProps<DatePickerPr
     disabled?: boolean | undefined;
     size?: "xs" | "s" | "m" | "l" | undefined;
     view?: "default" | "clear" | undefined;
-    form?: "default" | "round" | "brick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "defaultBrick" | "brickDefault" | "brickClear" | "clearBrick" | "clearClear" | "brickRound" | "roundBrick" | undefined;
+    form?: "default" | "round" | "brick" | "brickRound" | "roundBrick" | "brickDefault" | "defaultBrick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "brickClear" | "clearBrick" | "clearClear" | undefined;
     status?: "alert" | "success" | "warning" | undefined;
     onFocus?: ((event: import("react").FocusEvent<HTMLElement>) => void) | undefined;
     onBlur?: ((event: import("react").FocusEvent<HTMLElement>) => void) | undefined;

package/__internal__/src/components/DateTimeCanary/DateTimeCanary.js

@@ -1,6 +1,6 @@
 import { __assign, __rest } from "tslib";
 import React, { forwardRef } from 'react';
-import { getSizeByMap } from '../../utils/getSizeByMap';
+import { getByMap } from '../../utils/getByMap';
 import { DateTimeTypeDate } from './DateTimeTypeDate/DateTimeTypeDate';
 import { DateTimeTypeDateTime } from './DateTimeTypeDateTime/DateTimeTypeDateTime';
 import { DateTimeTypeMonth } from './DateTimeTypeMonth/DateTimeTypeMonth';
@@ -16,7 +16,7 @@ var typeMap = {
 };
 export var DateTime = forwardRef(function (props, ref) {
     var _a = props.type, type = _a === void 0 ? dateTimePropTypeDefault : _a, otherProps = __rest(props, ["type"]);
-    var Component = getSizeByMap(typeMap, type);
+    var Component = getByMap(typeMap, type);
     return React.createElement(Component, __assign({}, otherProps, { ref: ref }));
 });
 export * from './helpers/types';

package/__internal__/src/components/EventInterceptor/eventInterceptorMap.d.ts

@@ -1,9 +1,4 @@
 /// <reference types="react" />
-import { COMPONENT_NAME as BUTTON_NAME } from '../Button/Button';
-import { COMPONENT_NAME as CHECKBOX_NAME } from '../Checkbox/Checkbox';
-import { COMPONENT_NAME as SELECT_NAME } from '../SelectComponents/cnSelect';
-import { COMPONENT_NAME as SNACKBAR_NAME } from '../SnackBar/SnackBar';
-import { COMPONENT_NAME as TEXTFIELD_NAME } from '../TextField/TextField';
 export declare const eventInterceptorMap: {
     readonly Button: <T extends import("../Button/Button").Props>(props: T, handler: import("./EventInterceptor").EventInterceptorHandler, ref: import("react").RefObject<HTMLElement>) => T;
     readonly Checkbox: <P extends {
@@ -25,8 +20,8 @@ export declare const eventInterceptorMap: {
         tabIndex?: number | undefined;
         inputRef?: ((instance: HTMLInputElement | null) => void) | import("react").RefObject<HTMLInputElement> | null | undefined;
         children?: undefined;
-    } & Pick<import("react").HTMLAttributes<HTMLLabelElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & import("react").RefAttributes<HTMLLabelElement>>(props: P, handler: import("./EventInterceptor").EventInterceptorHandler, checkboxRef: import("react").RefObject<HTMLLabelElement>) => P;
-    readonly Select: <PROPS extends import("../Select/helpers").SelectProps<import("../Select/helpers").DefaultItem, import("../Select/helpers").DefaultGroup>>(props: PROPS, handler: import("./EventInterceptor").EventInterceptorHandler, controlRef: import("react").RefObject<HTMLDivElement | null>) => PROPS;
+    } & Pick<import("react").HTMLAttributes<HTMLLabelElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & import("react").RefAttributes<HTMLLabelElement>>(props: P, handler: import("./EventInterceptor").EventInterceptorHandler, ref: import("react").RefObject<HTMLLabelElement>) => P;
+    readonly Select: <PROPS extends import("../Select/helpers").SelectProps<import("../Select/helpers").DefaultItem, import("../Select/helpers").DefaultGroup>>(props: PROPS, handler: import("./EventInterceptor").EventInterceptorHandler, ref: import("react").RefObject<HTMLDivElement | null>) => PROPS;
     readonly SnackBar: <P_1 extends import("react").PropsWithChildren<import("../../utils/types/PropsWithHTMLAttributes").PropsWithHTMLAttributes<{
         items: import("../SnackBar/SnackBar").Item[];
         children?: undefined;
@@ -43,7 +38,7 @@ export declare const eventInterceptorMap: {
         maxLength?: number | undefined;
         size?: "xs" | "s" | "m" | "l" | undefined;
         view?: "default" | "clear" | undefined;
-        form?: "default" | "round" | "brick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "defaultBrick" | "brickDefault" | "brickClear" | "clearBrick" | "clearClear" | "brickRound" | "roundBrick" | undefined;
+        form?: "default" | "round" | "brick" | "brickRound" | "roundBrick" | "brickDefault" | "defaultBrick" | "clearRound" | "roundClear" | "clearDefault" | "defaultClear" | "brickClear" | "clearBrick" | "clearClear" | undefined;
         state?: "alert" | "success" | "warning" | undefined;
         status?: "alert" | "success" | "warning" | undefined;
         width?: "default" | "full" | undefined;
@@ -69,11 +64,11 @@ export declare const eventInterceptorMap: {
         caption?: string | undefined;
         labelPosition?: "left" | "top" | undefined;
         focused?: boolean | undefined;
-    } & {
+    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "slot" | "spellCheck" | "style" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & {
         rows?: undefined;
         minRows?: undefined;
         maxRows?: undefined;
     } & {
         rightSide?: string | import("react").FC<import("../../utils/types/PropsWithHTMLAttributes").PropsWithHTMLAttributes<import("../../icons/Icon/Icon").Props, HTMLSpanElement>> | undefined;
-    } & Pick<import("react").HTMLAttributes<HTMLDivElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "slot" | "spellCheck" | "style" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & import("react").RefAttributes<HTMLElement>>(props: P_2, handler: import("./EventInterceptor").EventInterceptorHandler, textFieldRef: import("react").RefObject<HTMLDivElement>) => P_2;
+    } & import("react").RefAttributes<HTMLElement>>(props: P_2, handler: import("./EventInterceptor").EventInterceptorHandler, ref: import("react").RefObject<HTMLDivElement>) => P_2;
 };

package/__internal__/src/components/EventInterceptor/eventInterceptorMap.js

@@ -1,18 +1,12 @@
-var _a;
-import { COMPONENT_NAME as BUTTON_NAME } from '../Button/Button';
-import { COMPONENT_NAME as CHECKBOX_NAME } from '../Checkbox/Checkbox';
-import { COMPONENT_NAME as SELECT_NAME } from '../SelectComponents/cnSelect';
-import { COMPONENT_NAME as SNACKBAR_NAME } from '../SnackBar/SnackBar';
-import { COMPONENT_NAME as TEXTFIELD_NAME } from '../TextField/TextField';
 import { useButtonEventHandler } from './propsHandlers/useButtonEventHandler';
 import { useCheckboxEventsHandler } from './propsHandlers/useCheckboxEventsHandler';
 import { useSelectEventsHandler } from './propsHandlers/useSelectEventsHandler';
 import { useSnackBarEventsHandler } from './propsHandlers/useSnackBarEventsHandler';
 import { useTextFieldEventsHandler } from './propsHandlers/useTextFieldEventsHandler';
-export var eventInterceptorMap = (_a = {},
-    _a[BUTTON_NAME] = useButtonEventHandler,
-    _a[CHECKBOX_NAME] = useCheckboxEventsHandler,
-    _a[SELECT_NAME] = useSelectEventsHandler,
-    _a[SNACKBAR_NAME] = useSnackBarEventsHandler,
-    _a[TEXTFIELD_NAME] = useTextFieldEventsHandler,
-    _a);
+export var eventInterceptorMap = {
+    Button: useButtonEventHandler,
+    Checkbox: useCheckboxEventsHandler,
+    Select: useSelectEventsHandler,
+    SnackBar: useSnackBarEventsHandler,
+    TextField: useTextFieldEventsHandler
+};

package/__internal__/src/components/EventInterceptor/propsHandlers/useButtonEventHandler.js

@@ -1,5 +1,4 @@
 import { __assign, __read, __spread } from "tslib";
-import { COMPONENT_NAME } from '../../Button/Button';
 export var useButtonEventHandler = function (props, handler, ref) {
     var newProps = __assign({}, props);
     newProps.onClick = function () {
@@ -10,12 +9,13 @@ export var useButtonEventHandler = function (props, handler, ref) {
         }
         var _b = __read(onClickArgs, 1), e = _b[0];
         var value = {
-            component: COMPONENT_NAME,
+            component: 'Button',
             event: e.type,
             options: {
                 text: e.currentTarget.innerText,
                 pageURL: e.currentTarget.baseURI,
-                DOMRef: ref.current
+                DOMRef: ref.current,
+                props: newProps
             }
         };
         handler(value);

package/__internal__/src/components/EventInterceptor/propsHandlers/useCheckboxEventsHandler.d.ts

@@ -19,4 +19,4 @@ export declare const useCheckboxEventsHandler: <P extends {
     tabIndex?: number | undefined;
     inputRef?: ((instance: HTMLInputElement | null) => void) | React.RefObject<HTMLInputElement> | null | undefined;
     children?: undefined;
-} & Pick<React.HTMLAttributes<HTMLLabelElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<HTMLLabelElement>>(props: P, handler: EventInterceptorHandler, checkboxRef: React.RefObject<HTMLLabelElement>) => P;
+} & Pick<React.HTMLAttributes<HTMLLabelElement>, "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "slot" | "spellCheck" | "style" | "title" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React.RefAttributes<HTMLLabelElement>>(props: P, handler: EventInterceptorHandler, ref: React.RefObject<HTMLLabelElement>) => P;

package/__internal__/src/components/EventInterceptor/propsHandlers/useCheckboxEventsHandler.js

@@ -1,6 +1,5 @@
 import { __assign, __read, __spread } from "tslib";
-import { COMPONENT_NAME } from '../../Checkbox/Checkbox';
-export var useCheckboxEventsHandler = function (props, handler, checkboxRef) {
+export var useCheckboxEventsHandler = function (props, handler, ref) {
     var newProps = __assign({}, props);
     newProps.onChange = function () {
         var _a;
@@ -10,13 +9,14 @@ export var useCheckboxEventsHandler = function (props, handler, checkboxRef) {
         }
         var _b = __read(onChangeArgs, 1), checked = _b[0].checked;
         var value = {
-            component: COMPONENT_NAME,
+            component: 'Checkbox',
             event: 'change',
             options: {
                 label: newProps.label,
                 checked: checked,
                 pageURL: window.location.href,
-                DOMRef: checkboxRef.current
+                DOMRef: ref.current,
+                props: newProps
             }
         };
         handler(value);

package/__internal__/src/components/EventInterceptor/propsHandlers/useSelectEventsHandler.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { SelectProps } from '../../Select/helpers';
 import { EventInterceptorHandler } from '../EventInterceptor';
-export declare const useSelectEventsHandler: <PROPS extends SelectProps<import("../../Select/helpers").DefaultItem, import("../../Select/helpers").DefaultGroup>>(props: PROPS, handler: EventInterceptorHandler, controlRef: React.RefObject<HTMLDivElement | null>) => PROPS;
+export declare const useSelectEventsHandler: <PROPS extends SelectProps<import("../../Select/helpers").DefaultItem, import("../../Select/helpers").DefaultGroup>>(props: PROPS, handler: EventInterceptorHandler, ref: React.RefObject<HTMLDivElement | null>) => PROPS;

package/__internal__/src/components/EventInterceptor/propsHandlers/useSelectEventsHandler.js

@@ -1,13 +1,12 @@
 import { __assign } from "tslib";
 import React from 'react';
 import { defaultGetItemLabel } from '../../Select/helpers';
-import { COMPONENT_NAME } from '../../SelectComponents/cnSelect';
-export var useSelectEventsHandler = function (props, handler, controlRef) {
+export var useSelectEventsHandler = function (props, handler, ref) {
     var newProps = __assign({}, props);
     React.useEffect(function () {
         if (newProps.value) {
             var value = {
-                component: COMPONENT_NAME,
+                component: 'Select',
                 event: 'change',
                 options: {
                     placeholder: newProps.placeholder,
@@ -16,7 +15,8 @@ export var useSelectEventsHandler = function (props, handler, controlRef) {
                         : defaultGetItemLabel(newProps.value),
                     value: newProps.value,
                     pageURL: window.location.href,
-                    DOMRef: controlRef.current
+                    DOMRef: ref.current,
+                    props: newProps
                 }
             };
             handler(value);