@innovaccer/design-system 4.22.0 → 4.24.0

package/dist/core/components/atoms/progressBar/ProgressBar.d.ts

@@ -7,6 +7,9 @@ export interface ProgressBarProps extends BaseProps {
     max: number;
     size: ProgressBarSize;
     state?: ProgressBarState;
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
+    id?: string;
 }
 export declare const ProgressBar: {
     (props: ProgressBarProps): React.JSX.Element;

package/dist/core/components/atoms/progressRing/ProgressRing.d.ts

@@ -5,6 +5,9 @@ export interface ProgressRingProps extends BaseProps {
     size: ProgressRingSize;
     value: number;
     max: number;
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
+    id?: string;
 }
 export declare const ProgressRing: {
     (props: ProgressRingProps): React.JSX.Element;

package/dist/core/components/atoms/segmentedControl/SegmentedControl.d.ts

@@ -12,6 +12,8 @@ export interface SegmentedControlProps extends BaseProps {
     isEqualWidth?: boolean;
     disabled?: boolean;
     children: React.ReactElement<SegmentedControlItemProps> | React.ReactElement<SegmentedControlItemProps>[];
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
 }
 export declare const SegmentedControl: {
     (props: SegmentedControlProps): React.JSX.Element | null;

package/dist/core/components/atoms/spinner/Spinner.d.ts

@@ -6,6 +6,7 @@ export interface SpinnerProps extends BaseProps {
     appearance: SpinnerAppearance;
     size: SpinnerSize;
     'aria-label'?: string;
+    'aria-labelledby'?: string;
 }
 export declare const Spinner: {
     (props: SpinnerProps): React.JSX.Element;

package/dist/core/components/atoms/statusHint/StatusHint.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import { BaseProps } from "../../../utils/types";
+import { BaseProps, BaseHtmlProps } from "../../../utils/types";
 import { MessageAppearance } from "../../../common.type";
 declare type StatusHintSize = 'small' | 'regular';
-export interface StatusHintProps extends BaseProps {
+export interface StatusHintProps extends BaseProps, BaseHtmlProps<HTMLDivElement> {
     children: React.ReactText | React.ReactNode;
     size?: StatusHintSize;
     appearance: MessageAppearance;

package/dist/core/components/atoms/toast/Toast.d.ts

@@ -11,6 +11,9 @@ export interface ToastProps extends BaseProps {
     message?: string;
     actions?: Action[];
     onClose?: () => void;
+    'aria-label'?: string;
+    'aria-atomic'?: 'true' | 'false' | boolean;
+    id?: string;
 }
 export declare const Toast: {
     (props: ToastProps): React.JSX.Element;

package/dist/core/components/molecules/chat/Chat.d.ts

@@ -2,6 +2,9 @@ import * as React from 'react';
 import { BaseProps } from "../../../utils/types";
 export interface ChatProps extends BaseProps {
     children: React.ReactNode;
+    role?: string;
+    'aria-live'?: 'polite' | 'assertive' | 'off';
+    'aria-label'?: string;
 }
 export declare const Chat: {
     (props: ChatProps): React.JSX.Element;

package/dist/core/components/molecules/chat/chatBubble/IncomingBubble.d.ts

@@ -18,6 +18,7 @@ export interface IncomingOptionProps extends BaseProps {
     urgentMessage?: () => JSX.Element;
     avatarData?: ChatAvatarProps;
     showAvatar?: boolean;
+    'aria-label'?: string;
 }
 export declare const IncomingBubble: {
     (props: IncomingOptionProps): React.JSX.Element;

package/dist/core/components/molecules/chat/chatBubble/OutgoingBubble.d.ts

@@ -9,6 +9,7 @@ export interface OutgoingOptionProps extends BaseProps {
     actionBar?: () => JSX.Element;
     urgentMessage?: () => JSX.Element;
     failedMessage?: () => JSX.Element;
+    'aria-label'?: string;
 }
 export declare const OutgoingBubble: {
     (props: OutgoingOptionProps): React.JSX.Element;

package/dist/core/components/molecules/chat/chatInput/ChatInput.d.ts

@@ -14,6 +14,7 @@ export interface ChatInputProps extends BaseProps {
     onKeyDown?: (e: React.KeyboardEvent<HTMLTextAreaElement>) => void;
     onSend?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>, value?: string) => void;
     onStopGenerating?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    'aria-label'?: string;
 }
 declare const ChatInput: React.FC<ChatInputProps>;
 export default ChatInput;

package/dist/core/components/molecules/chat/unreadMessage/UnreadMessage.d.ts

@@ -2,6 +2,9 @@ import * as React from 'react';
 import { BaseProps } from "../../../../utils/types";
 export interface UnreadMessageProps extends BaseProps {
     text: string;
+    onClick?: React.MouseEventHandler<HTMLDivElement>;
+    onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;
+    onKeyUp?: React.KeyboardEventHandler<HTMLDivElement>;
 }
 declare const UnreadMessage: React.FC<UnreadMessageProps>;
 export default UnreadMessage;

package/dist/core/components/molecules/chipInput/ChipInput.d.ts

@@ -20,7 +20,7 @@ export interface ChipInputProps extends BaseProps {
     placeholder?: string;
     value?: string[];
     defaultValue: string[];
-    autoFocus: boolean;
+    autoFocus?: boolean;
     onChange?: (chips: string[]) => void;
     onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
     onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;

package/dist/core/components/molecules/chipInput/utils.d.ts

@@ -0,0 +1,2 @@
+export declare type ChipInputBorderFocusRegion = 'input' | 'icon' | 'chip' | 'fieldChrome' | null;
+export declare const getChipInputBorderFocusRegion: (target: EventTarget | null, inputClassName: string) => ChipInputBorderFocusRegion;

package/dist/core/components/molecules/dropzone/Dropzone.d.ts

@@ -7,6 +7,7 @@ export interface DropzoneProps extends BaseProps, DropzoneBaseProps {
     type: DropZoneType;
     sizeLabel?: string;
     sampleFileLink?: React.ReactNode;
+    'aria-label'?: string;
 }
 export declare const Dropzone: {
     (props: DropzoneProps): React.JSX.Element;

package/dist/core/components/molecules/editableInput/EditableInput.d.ts

@@ -10,6 +10,10 @@ export interface EditableInputProps extends BaseProps {
     errorMessage?: string;
     inputOptions: Omit<InputProps, 'error' | 'value' | 'defaultValue' | 'size' | 'placeholder'>;
     onChange?: (value: string) => void;
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
+    'aria-describedby'?: string;
+    id?: string;
 }
 export declare const EditableInput: {
     (props: EditableInputProps): React.JSX.Element;

package/dist/core/components/molecules/fileUploader/FileUploaderButton.d.ts

@@ -8,6 +8,8 @@ export interface FileUploaderButtonProps extends BaseProps {
     uploadButtonLabel: string;
     disabled: boolean;
     onChange?: (fileList: File[], event: React.ChangeEvent<HTMLInputElement>) => void;
+    'aria-labelledby'?: string;
+    'aria-describedby'?: string;
 }
 export declare const FileUploaderButton: {
     (props: FileUploaderButtonProps): React.JSX.Element;

package/dist/core/components/molecules/inputMask/InputMask.d.ts

@@ -13,6 +13,7 @@ export interface MaskProps extends BaseProps {
     onPaste?: (e: React.ClipboardEvent<HTMLInputElement>, val?: string) => void;
     clearOnEmptyBlur?: boolean;
     helpText?: string;
+    useDefaultValueOnEmpty?: boolean;
 }
 export declare type InputMaskProps = InputProps & MaskProps;
 declare type InputMaskType = React.ForwardRefExoticComponent<InputProps & MaskProps & React.RefAttributes<HTMLInputElement>> & {

package/dist/core/components/molecules/modal/Modal.d.ts

@@ -26,6 +26,7 @@ declare class Modal extends React.Component<ModalProps, ModalState> {
     modalRef: React.RefObject<HTMLDivElement>;
     modalContentRef: React.RefObject<HTMLDivElement>;
     previousActiveElement: HTMLElement | null;
+    staticFocusTarget: HTMLElement | null;
     autoHeadingId: string;
     element: Element;
     static defaultProps: {

package/dist/core/components/molecules/popover/Popover.d.ts

@@ -19,6 +19,7 @@ export interface PopoverProps extends Pick<PopperWrapperProps, PopperProps>, Bas
     dark?: boolean;
     customStyle: CustomStyle;
     triggerClass?: string;
+    wrapperElement?: 'div' | 'span';
     hideOnReferenceEscape?: boolean;
     boundaryElement: React.RefObject<HTMLElement> | Element;
     animationClass?: {

package/dist/core/components/molecules/sidesheet/Sidesheet.d.ts

@@ -27,6 +27,7 @@ declare class Sidesheet extends React.Component<SidesheetProps, SidesheetState>
     sidesheetRef: React.RefObject<HTMLDivElement>;
     sidesheetContentRef: React.RefObject<HTMLDivElement>;
     previousActiveElement: HTMLElement | null;
+    staticFocusTarget: HTMLElement | null;
     autofocusRAF: number | null;
     autoHeadingId: string;
     element: Element;
@@ -39,7 +40,7 @@ declare class Sidesheet extends React.Component<SidesheetProps, SidesheetState>
     constructor(props: SidesheetProps);
     onCloseHandler: (event: KeyboardEvent) => void;
     onFocusTrapKeyDown: (event: KeyboardEvent) => void;
-    focusFirstFocusable: () => void;
+    focusOnOpen: () => void;
     onOpenAnimationStart: (event: React.AnimationEvent<HTMLDivElement>) => void;
     activateFocusTrap: () => void;
     deactivateFocusTrap: () => void;

package/dist/core/components/molecules/stepper/Step.d.ts

@@ -8,6 +8,7 @@ export interface StepProps {
     onChange?: (label: string, value?: React.ReactText) => void;
     onKeyDown?: (e: React.KeyboardEvent) => void;
     isTabStop?: boolean;
+    stepIndex: number;
 }
 export declare const Step: React.ForwardRefExoticComponent<StepProps & React.RefAttributes<HTMLDivElement>>;
 export default Step;

package/dist/core/components/organisms/calendar/Calendar.d.ts

@@ -73,6 +73,7 @@ interface CalendarState {
     focusedDateMonthIndex?: number;
     focusedMonth?: number;
     focusedYearIndex?: number;
+    pendingFocusDate?: Date;
 }
 export declare class Calendar extends React.Component<CalendarProps, CalendarState> {
     static defaultProps: {
@@ -93,9 +94,9 @@ export declare class Calendar extends React.Component<CalendarProps, CalendarSta
         col: number;
     } | null;
     getInRangeError: () => boolean;
-    selectYear: (year: number) => () => void;
+    selectYear: (year: number, disabled?: boolean | undefined) => () => void;
     yearMouseOverHandler: (year: number, isCurrentYear: boolean, isDisabled: boolean, ev: React.MouseEvent<HTMLButtonElement>) => void;
-    selectMonth: (month: number) => () => void;
+    selectMonth: (month: number, disabled?: boolean | undefined) => () => void;
     monthMouseOverHandler: (month: number, isCurrentMonth: boolean, isDisabled: boolean, ev: React.MouseEvent<HTMLButtonElement>) => void;
     selectDate: (index: number, date: number, prevMonthDayRange: number, dayRange: number) => void;
     calculateDate: (index: number, date: number, prevMonthDayRange: number, dayRange: number, isDateHovered: boolean) => Date | undefined;
@@ -108,7 +109,7 @@ export declare class Calendar extends React.Component<CalendarProps, CalendarSta
     onDateRowMouseLeaveHandler: () => void;
     handleMonthCellKeyDown: (event: React.KeyboardEvent, _month: number, disabled: boolean) => void;
     handleYearCellKeyDown: (event: React.KeyboardEvent, _year: number, _offset: number, disabled: boolean) => void;
-    handleDateCellKeyDown: (ev: React.KeyboardEvent, index: number, row: number, col: number, noOfRows: number, date: number, prevMonthDayRange: number, dayRange: number, inRangeError: boolean, rangePicker: boolean, startDate?: Date | undefined, endDate?: Date | undefined) => void;
+    handleDateCellKeyDown: (ev: React.KeyboardEvent, index: number, _row: number, _col: number, _noOfRows: number, date: number, prevMonthDayRange: number, dayRange: number, inRangeError: boolean, rangePicker: boolean, startDate?: Date | undefined, endDate?: Date | undefined) => void;
     renderBodyDate: (index: number) => React.JSX.Element;
     renderEventsIndicator(size: string, active: boolean): React.JSX.Element;
     renderDateValues: (index: number) => React.JSX.Element[];

package/dist/core/components/organisms/calendar/utils.d.ts

@@ -18,11 +18,10 @@ export declare const formatDateAriaLabel: (d: Date) => string;
 export interface HandleDateViewKeyDownParams {
     event: React.KeyboardEvent;
     container: HTMLElement;
-    focusedRow: number;
-    focusedCol: number;
-    totalRows: number;
-    monthIndex: number;
-    onNavigate: (row: number, col: number) => void;
+    focusedDate: Date;
+    startOfWeekIndex?: number;
+    isDateDisabled?: (d: Date) => boolean;
+    onNavigate: (newDate: Date) => void;
     onSelect: () => void;
     onPageUp: () => void;
     onPageDown: () => void;
@@ -35,6 +34,7 @@ export interface HandleMonthViewKeyDownParams {
     event: React.KeyboardEvent;
     container: HTMLElement;
     focusedMonth: number;
+    isMonthDisabled?: (month: number) => boolean;
     onNavigate: (month: number) => void;
     onSelect: (month: number) => void;
     onEscape?: () => void;
@@ -45,6 +45,7 @@ export interface HandleYearViewKeyDownParams {
     container: HTMLElement;
     focusedYearIndex: number;
     yearBlockStart: number;
+    isYearDisabled?: (year: number) => boolean;
     onNavigate: (yearIndex: number) => void;
     onSelect: (year: number) => void;
     onPageUp: () => void;

package/dist/core/components/organisms/combobox/Combobox.d.ts

@@ -29,6 +29,8 @@ export interface ComboboxProps extends BaseProps {
     className?: string;
     'aria-label'?: string;
     'aria-labelledby'?: string;
+    'aria-describedby'?: string;
+    'aria-errormessage'?: string;
 }
 export declare const Combobox: {
     (props: ComboboxProps): React.JSX.Element;

package/dist/core/components/organisms/combobox/ComboboxList.d.ts

@@ -7,6 +7,7 @@ export interface ComboboxListProps extends BaseProps {
     size: TListboxSize;
     tagName: TagType;
     showDivider: boolean;
+    'aria-multiselectable'?: boolean;
 }
 export declare const ComboboxList: {
     (props: ComboboxListProps): React.JSX.Element;

package/dist/core/components/organisms/combobox/trigger/ComboboxTrigger.d.ts

@@ -19,6 +19,8 @@ interface ComboboxTriggerProps {
     clearButton?: boolean;
     'aria-label'?: string;
     'aria-labelledby'?: string;
+    'aria-describedby'?: string;
+    'aria-errormessage'?: string;
 }
 export declare const ComboboxTrigger: (props: ComboboxTriggerProps) => React.JSX.Element;
 export default ComboboxTrigger;

package/dist/core/components/organisms/combobox/trigger/MultiselectTrigger.d.ts

@@ -30,6 +30,7 @@ export interface MultiSelectTriggerProps extends BaseProps {
     role?: React.AriaRole;
     'aria-label'?: string;
     'aria-labelledby'?: string;
+    'aria-invalid'?: boolean | 'true' | 'false' | 'grammar' | 'spelling';
 }
 export declare const MultiSelectTrigger: React.ForwardRefExoticComponent<MultiSelectTriggerProps & React.RefAttributes<HTMLElement>>;
 export default MultiSelectTrigger;

package/dist/core/components/organisms/grid/Grid.d.ts

@@ -156,6 +156,7 @@ export interface GridState {
 export declare class Grid extends React.Component<GridProps, GridState> {
     static defaultProps: GridProps;
     gridRef: GridRef;
+    gridId: string;
     isHeadSyncing: boolean;
     isBodySyncing: boolean;
     constructor(props: GridProps);

package/dist/core/components/organisms/grid/GridContext.d.ts

@@ -3,6 +3,7 @@ import { GridProps } from "../../../index.type";
 import { GridRef } from "./Grid";
 declare type ContextProps = GridProps & {
     ref: GridRef;
+    gridId: string;
     isSortingListUpdated: boolean;
     updateIsSortingListUpdated: () => void;
 };

package/dist/core/components/organisms/grid/VirtualList.d.ts

@@ -9,6 +9,7 @@ interface VirtualScrollProps extends BaseProps {
     totalLength: number;
     renderItem: (index: number, item?: object) => React.ReactElement;
     onScroll?: (event: Event, element: HTMLElement) => void;
+    role?: React.AriaRole;
 }
 declare const VirtualList: (props: VirtualScrollProps) => React.JSX.Element;
 export default VirtualList;

package/dist/core/components/organisms/inlineMessage/InlineMessage.d.ts

@@ -1,8 +1,9 @@
 import * as React from 'react';
-import { BaseProps } from "../../../utils/types";
+import { BaseProps, BaseHtmlProps } from "../../../utils/types";
 import { MessageAppearance } from "../../../common.type";
 export declare type MessageSize = 'regular' | 'small';
-export interface InlineMessageProps extends BaseProps {
+export interface InlineMessageProps extends BaseProps, BaseHtmlProps<HTMLDivElement> {
+    id?: string;
     appearance: MessageAppearance;
     description: string;
     size: MessageSize;

package/dist/core/components/organisms/listbox/Listbox.d.ts

@@ -11,7 +11,14 @@ export interface ListboxProps extends BaseProps, BaseHtmlProps<HTMLUListElement
     tagName: TagType;
     showDivider: boolean;
 }
-export declare const ListboxContext: React.Context<Pick<ListboxProps, "size" | "className" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoComplete" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "cite" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "data" | "dateTime" | "default" | "defer" | "disabled" | "download" | "encType" | "form" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "label" | "list" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "name" | "noValidate" | "open" | "optimum" | "pattern" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "span" | "src" | "srcDoc" | "srcLang" | "srcSet" | "start" | "step" | "summary" | "target" | "type" | "useMap" | "value" | "width" | "wmode" | "wrap" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "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" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "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" | "css" | "key" | "data-test" | "showDivider">>;
+export interface ListboxInternalProps extends ListboxProps {
+    customFocusManagement?: boolean;
+}
+export declare type ListboxContextValue = Omit<ListboxInternalProps, 'children' | 'tagName'> & {
+    rovingIndex: number;
+    setRovingIndex: React.Dispatch<React.SetStateAction<number>>;
+};
+export declare const ListboxContext: React.Context<ListboxContextValue>;
 export declare const Listbox: {
     (props: ListboxProps): React.JSX.Element;
     displayName: string;
@@ -21,6 +28,7 @@ export declare const Listbox: {
         type: string;
         draggable: boolean;
         showDivider: boolean;
+        customFocusManagement: boolean;
     };
     Item: {
         (props: import("./listboxItem").ListboxItemProps): React.JSX.Element;

package/dist/core/components/organisms/listbox/listboxItem/ListBody.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ListboxItemProps } from "./ListboxItem";
 export declare const ListBody: {
-    (props: ListboxItemProps): React.JSX.Element;
+    (props: ListboxItemProps & React.HTMLAttributes<HTMLDivElement>): React.JSX.Element;
     displayName: string;
 };
 export default ListBody;

package/dist/core/components/organisms/listbox/listboxItem/ListboxItem.d.ts

@@ -5,6 +5,8 @@ export interface ListboxItemProps extends BaseProps, BaseHtmlProps<HTMLLIElement
     children: React.ReactNode;
     nestedBody?: React.ReactNode;
     expanded?: boolean;
+    nestedListId?: string;
+    nestedListAriaLabel?: string;
     disabled?: boolean;
     selected?: boolean;
     activated?: boolean;

package/dist/core/components/organisms/listbox/nestedList/NestedList.d.ts

@@ -2,6 +2,8 @@ import * as React from 'react';
 export interface NestedListProp {
     expanded?: boolean;
     nestedBody?: React.ReactNode;
+    id?: string;
+    'aria-label'?: string;
 }
 export declare const NestedList: (props: NestedListProp) => React.JSX.Element;
 export default NestedList;

package/dist/core/components/organisms/listbox/reorderList/Draggable.d.ts

@@ -9,6 +9,9 @@ declare class Draggable<Value = string> extends React.Component<IProps<Value>> {
     lastScroll: number;
     lastYOffset: number;
     lastListYOffset: number;
+    mouseDownX: number;
+    mouseDownY: number;
+    hasDragStarted: boolean;
     dropTimeout?: number;
     needle: number;
     afterIndex: number;
@@ -16,6 +19,7 @@ declare class Draggable<Value = string> extends React.Component<IProps<Value>> {
         itemDragged: number;
         itemDraggedOutOfBounds: number;
         selectedItem: number;
+        focusedIndex: number;
         initialX: number;
         initialY: number;
         targetX: number;
@@ -24,6 +28,8 @@ declare class Draggable<Value = string> extends React.Component<IProps<Value>> {
         targetWidth: number;
         scrollingSpeed: number;
         scrollWindow: boolean;
+        isClickAndFollow: boolean;
+        ariaMessage: string;
     };
     schdOnMouseMove: {
         (e: MouseEvent): void;
@@ -43,6 +49,7 @@ declare class Draggable<Value = string> extends React.Component<IProps<Value>> {
         scrollingSpeed: number;
     }): void;
     componentWillUnmount(): void;
+    ensureKeyboardReorderVisible: (pickedIndex: number, needleIndex: number) => void;
     doScrolling: () => void;
     getChildren: () => Element[];
     static defaultProps: {
@@ -63,8 +70,13 @@ declare class Draggable<Value = string> extends React.Component<IProps<Value>> {
     autoScrolling: (clientY: number) => void;
     animateItems: (needle: number, movedItem: number, offset: number, animateMovedItem?: boolean) => void;
     isDraggedItemOutOfBounds: () => boolean;
+    finalizeActivePointerDrop: () => void;
+    completeClickAndFollowDropAtFocusedIndex: (index: number) => void;
     onEnd: (e: TouchEvent & MouseEvent) => void;
     finishDrop: () => void;
+    cancelKeyboardPick: () => void;
+    commitKeyboardReorder: () => void;
+    advanceTabFocusFromActiveElement: (shiftKey: boolean) => void;
     onKeyDown: (e: React.KeyboardEvent) => void;
     render(): React.JSX.Element;
 }

package/dist/core/components/organisms/listbox/reorderList/DraggableList.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-import { ListboxProps } from "../../../../index.type";
-export declare const DraggableList: (props: ListboxProps) => React.JSX.Element;
+import { ListboxInternalProps } from "../Listbox";
+export declare const DraggableList: (props: ListboxInternalProps) => React.JSX.Element;

package/dist/core/components/organisms/listbox/reorderList/types.d.ts

@@ -2,8 +2,10 @@ export interface IItemProps {
     key?: number;
     tabIndex?: number;
     'aria-roledescription'?: string;
+    'aria-grabbed'?: boolean;
     onKeyDown?: (e: React.KeyboardEvent) => void;
     onWheel?: (e: React.WheelEvent) => void;
+    onFocus?: () => void;
     style?: React.CSSProperties;
     ref?: React.RefObject<any>;
 }

package/dist/core/components/organisms/listbox/utils.d.ts

@@ -1 +1,4 @@
+import * as React from 'react';
+export declare const resolveListboxOptionFromEvent: (event: React.SyntheticEvent, fallback: HTMLElement) => HTMLElement;
+export declare const isListboxOptionDisabled: (optionElement: HTMLElement) => boolean;
 export declare const onKeyDown: (event: React.KeyboardEvent) => void;

package/dist/core/components/organisms/menu/MenuContext.d.ts

@@ -8,6 +8,7 @@ export declare type ContextProps = {
     setHighlightFirstItem?: React.Dispatch<React.SetStateAction<boolean>>;
     setHighlightLastItem?: React.Dispatch<React.SetStateAction<boolean>>;
     setFocusedOption?: React.Dispatch<React.SetStateAction<HTMLElement | undefined>>;
+    menuId?: string;
 };
 export declare const MenuContext: React.Context<ContextProps>;
 export default MenuContext;

package/dist/core/components/organisms/menu/SubMenuContext.d.ts

@@ -5,6 +5,7 @@ export declare type ContextProps = {
     parentListRef?: React.RefObject<HTMLDivElement>;
     menuID?: string;
     triggerID?: string;
+    parentMenuTriggerRef?: React.RefObject<HTMLButtonElement>;
 };
 export declare const SubMenuContext: React.Context<ContextProps>;
 export default SubMenuContext;

package/dist/core/components/organisms/select/Select.d.ts

@@ -14,7 +14,7 @@ export interface SelectProps extends BaseProps {
     children?: React.ReactNode;
     width?: number | string;
     styleType?: SelectStyleType;
-    popoverWidth?: number;
+    popoverWidth?: number | string;
     maxHeight?: number;
     minHeight?: number;
     value?: OptionType | OptionType[];
@@ -25,6 +25,9 @@ export interface SelectProps extends BaseProps {
     onToggle?: (open: boolean) => void;
     trigger?: React.ReactElement;
     triggerOptions?: SelectTriggerProps;
+    'aria-describedby'?: string;
+    'aria-errormessage'?: string;
+    trapFocus?: boolean;
 }
 export interface SelectMethods {
     setOpen: (open: boolean) => void;

package/dist/core/components/organisms/select/SelectContext.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { OptionType, TListboxSize, SelectStyleType } from "../../../common.type";
 export declare type ContextProps = {
+    listboxId?: string;
     openPopover?: boolean;
     setOpenPopover?: React.Dispatch<React.SetStateAction<boolean>>;
     selectValue?: OptionType | OptionType[];
@@ -15,7 +16,7 @@ export declare type ContextProps = {
     setWithSearch?: React.Dispatch<React.SetStateAction<boolean>>;
     multiSelect?: boolean;
     listRef?: React.RefObject<HTMLDivElement>;
-    triggerRef?: React.RefObject<HTMLButtonElement>;
+    triggerRef?: React.RefObject<HTMLElement | null>;
     focusedOption?: HTMLElement;
     setFocusedOption?: React.Dispatch<React.SetStateAction<HTMLElement | undefined>>;
     setHighlightFirstItem?: React.Dispatch<React.SetStateAction<boolean>>;
@@ -23,6 +24,7 @@ export declare type ContextProps = {
     size?: TListboxSize;
     styleType?: SelectStyleType;
     error?: boolean;
+    rovingIndex?: number;
 };
 export declare const SelectContext: React.Context<ContextProps>;
 export default SelectContext;

package/dist/core/components/organisms/select/SelectOption.d.ts

@@ -10,6 +10,7 @@ export interface SelectOptionProps extends BaseProps {
     withCheckbox?: boolean;
     disabled?: boolean;
     'aria-label'?: string;
+    index?: number;
 }
 export declare const SelectOption: {
     (props: SelectOptionProps): React.JSX.Element;

package/dist/core/components/organisms/select/SelectTrigger.d.ts

@@ -4,6 +4,10 @@ import { BaseProps } from "../../../utils/types";
 export declare type SelectTriggerSize = 'small' | 'regular';
 export interface SelectTriggerProps extends BaseProps {
     'aria-label'?: string;
+    'aria-describedby'?: string;
+    'aria-errormessage'?: string;
+    'aria-invalid'?: boolean | 'true' | 'false' | 'grammar' | 'spelling';
+    'aria-controls'?: string;
     triggerSize?: SelectTriggerSize;
     icon?: string;
     iconType?: IconType;

package/dist/core/components/organisms/select/utils.d.ts

@@ -1,12 +1,17 @@
 import React from 'react';
 import { OptionType } from "../../../common.type";
+export declare const getNextFocusableAfterTrigger: (startNode: HTMLElement | null, shiftKey: boolean, excludeContainer?: HTMLElement | null | undefined) => HTMLElement | null;
+export declare const getFocusableElements: (container: HTMLElement) => HTMLElement[];
 export declare const mapInitialValue: (multiSelect: boolean, selectedValue: OptionType | OptionType[] | undefined) => OptionType | OptionType[];
 export declare const elementExist: (targetObject: OptionType, mainList: OptionType | OptionType[] | undefined) => number;
 export declare const removeOrAddToList: (targetObject: OptionType, prevList: OptionType[]) => OptionType[];
 export declare const computeValue: (multiSelect: boolean | undefined, selectValue: any, setLabel?: ((count: number) => string | undefined) | undefined) => any;
 export declare const handleKeyDownTrigger: (event: React.KeyboardEvent, setOpenPopover?: React.Dispatch<React.SetStateAction<boolean>> | undefined, setHighlightFirstItem?: React.Dispatch<React.SetStateAction<boolean>> | undefined, setHighlightLastItem?: React.Dispatch<React.SetStateAction<boolean>> | undefined) => void;
 export declare const focusListItem: (position: string, setFocusedOption?: React.Dispatch<React.SetStateAction<HTMLElement | undefined>> | undefined, listRef?: any) => void;
-export declare const handleKeyDown: (event: React.KeyboardEvent, focusedOption: Element | undefined, setFocusedOption?: React.Dispatch<React.SetStateAction<HTMLElement | undefined>> | undefined, setHighlightFirstItem?: React.Dispatch<React.SetStateAction<boolean>> | undefined, setHighlightLastItem?: React.Dispatch<React.SetStateAction<boolean>> | undefined, listRef?: any, withSearch?: boolean | undefined, setOpenPopover?: React.Dispatch<React.SetStateAction<boolean>> | undefined, triggerRef?: any) => void;
+export declare const handleKeyDown: (event: React.KeyboardEvent, _focusedOption: Element | undefined, setFocusedOption?: React.Dispatch<React.SetStateAction<HTMLElement | undefined>> | undefined, setHighlightFirstItem?: React.Dispatch<React.SetStateAction<boolean>> | undefined, setHighlightLastItem?: React.Dispatch<React.SetStateAction<boolean>> | undefined, listRef?: any, withSearch?: boolean | undefined, setOpenPopover?: React.Dispatch<React.SetStateAction<boolean>> | undefined, triggerRef?: any) => void;
 export declare const handleEnterKey: (focusedOption: Element | undefined) => void;
-export declare const navigateOptions: (direction: string, focusedOption: Element | undefined, setFocusedOption?: React.Dispatch<React.SetStateAction<HTMLElement | undefined>> | undefined, listRef?: any, withSearch?: boolean | undefined) => void;
+export declare const navigateOptions: (direction: string, eventTarget: Element | undefined, setFocusedOption?: React.Dispatch<React.SetStateAction<HTMLElement | undefined>> | undefined, listRef?: any, withSearch?: boolean | undefined) => void;
 export declare const handleInputKeyDown: (event: React.KeyboardEvent, listRef: any, setFocusedOption?: React.Dispatch<React.SetStateAction<HTMLElement | undefined>> | undefined, setOpenPopover?: React.Dispatch<React.SetStateAction<boolean>> | undefined, triggerRef?: any) => void;
+export declare const LISTBOX_ITEM_SELECTOR = "[data-test=\"DesignSystem-Select-Option\"]";
+export declare const getRovingIndex: (listRef: React.RefObject<HTMLDivElement | null> | null, focusedOption: HTMLElement | undefined) => number;
+export declare const focusPopoverInitial: (listRef: React.RefObject<HTMLDivElement | null> | null, setFocusedOption: React.Dispatch<React.SetStateAction<HTMLElement | undefined>> | undefined) => number;

package/dist/core/components/organisms/textField/TextFieldCommon.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 interface RenderHelpTextProps {
     helpText: string;
     error?: boolean;
+    id?: string;
 }
 export declare const RenderHelpText: React.FC<RenderHelpTextProps>;
 interface RenderCounterProps {