@elliemae/ds-controlled-form 2.4.2-rc.0 → 2.4.2-rc.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-controlled-form",
-  "version": "2.4.2-rc.0",
+  "version": "2.4.2-rc.12",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Controlled Form Controllers",
   "module": "./esm/index.js",
@@ -159,6 +159,38 @@
       "import": "./esm/large-text-input/DSControlledLargeTextInput.js",
       "require": "./cjs/large-text-input/DSControlledLargeTextInput.js"
     },
+    "./input-group/styled": {
+      "import": "./esm/input-group/styled.js",
+      "require": "./cjs/input-group/styled.js"
+    },
+    "./input-group/react-desc-prop-types": {
+      "import": "./esm/input-group/react-desc-prop-types.js",
+      "require": "./cjs/input-group/react-desc-prop-types.js"
+    },
+    "./input-group/InputGroupDataTestIds": {
+      "import": "./esm/input-group/InputGroupDataTestIds.js",
+      "require": "./cjs/input-group/InputGroupDataTestIds.js"
+    },
+    "./input-group/InputGroup": {
+      "import": "./esm/input-group/InputGroup.js",
+      "require": "./cjs/input-group/InputGroup.js"
+    },
+    "./input-group": {
+      "import": "./esm/input-group/index.js",
+      "require": "./cjs/input-group/index.js"
+    },
+    "./input-group/exported-related/theming": {
+      "import": "./esm/input-group/exported-related/theming.js",
+      "require": "./cjs/input-group/exported-related/theming.js"
+    },
+    "./input-group/exported-related": {
+      "import": "./esm/input-group/exported-related/index.js",
+      "require": "./cjs/input-group/exported-related/index.js"
+    },
+    "./input-group/exported-related/data-test-ids": {
+      "import": "./esm/input-group/exported-related/data-test-ids.js",
+      "require": "./cjs/input-group/exported-related/data-test-ids.js"
+    },
     "./date-time-picker/utils/typeGuards": {
       "import": "./esm/date-time-picker/utils/typeGuards.js",
       "require": "./cjs/date-time-picker/utils/typeGuards.js"
@@ -491,6 +523,10 @@
       "import": "./esm/date-time-picker/config/useGetDestructuredValues.js",
       "require": "./cjs/date-time-picker/config/useGetDestructuredValues.js"
     },
+    "./date-time-picker/config/useFocusTracker": {
+      "import": "./esm/date-time-picker/config/useFocusTracker.js",
+      "require": "./cjs/date-time-picker/config/useFocusTracker.js"
+    },
     "./date-time-picker/config/useControlledDateTimePicker": {
       "import": "./esm/date-time-picker/config/useControlledDateTimePicker.js",
       "require": "./cjs/date-time-picker/config/useControlledDateTimePicker.js"
@@ -559,6 +595,10 @@
       "import": "./esm/combobox/utils/listHelper.js",
       "require": "./cjs/combobox/utils/listHelper.js"
     },
+    "./combobox/theming": {
+      "import": "./esm/combobox/theming.js",
+      "require": "./cjs/combobox/theming.js"
+    },
     "./combobox/tests/utils": {
       "import": "./esm/combobox/tests/utils.js",
       "require": "./cjs/combobox/tests/utils.js"
@@ -591,10 +631,6 @@
       "import": "./esm/combobox/parts/multi-selected-values-container/index.js",
       "require": "./cjs/combobox/parts/multi-selected-values-container/index.js"
     },
-    "./combobox/parts/menu-list/useMenuListSetFocusOption": {
-      "import": "./esm/combobox/parts/menu-list/useMenuListSetFocusOption.js",
-      "require": "./cjs/combobox/parts/menu-list/useMenuListSetFocusOption.js"
-    },
     "./combobox/parts/menu-list/useItemRenderer": {
       "import": "./esm/combobox/parts/menu-list/useItemRenderer.js",
       "require": "./cjs/combobox/parts/menu-list/useItemRenderer.js"
@@ -743,6 +779,18 @@
       "import": "./esm/checkbox/index.js",
       "require": "./cjs/checkbox/index.js"
     },
+    "./checkbox/exported-related/theming": {
+      "import": "./esm/checkbox/exported-related/theming.js",
+      "require": "./cjs/checkbox/exported-related/theming.js"
+    },
+    "./checkbox/exported-related": {
+      "import": "./esm/checkbox/exported-related/index.js",
+      "require": "./cjs/checkbox/exported-related/index.js"
+    },
+    "./checkbox/exported-related/data-test-ids": {
+      "import": "./esm/checkbox/exported-related/data-test-ids.js",
+      "require": "./cjs/checkbox/exported-related/data-test-ids.js"
+    },
     "./checkbox/ControlledCheckbox": {
       "import": "./esm/checkbox/ControlledCheckbox.js",
       "require": "./cjs/checkbox/ControlledCheckbox.js"
@@ -767,6 +815,10 @@
       "import": "./esm/autocomplete/react-desc-prop-types.js",
       "require": "./cjs/autocomplete/react-desc-prop-types.js"
     },
+    "./autocomplete/parts/styled": {
+      "import": "./esm/autocomplete/parts/styled.js",
+      "require": "./cjs/autocomplete/parts/styled.js"
+    },
     "./autocomplete/parts/menu-list/useItemRenderer": {
       "import": "./esm/autocomplete/parts/menu-list/useItemRenderer.js",
       "require": "./cjs/autocomplete/parts/menu-list/useItemRenderer.js"
@@ -799,6 +851,10 @@
       "import": "./esm/autocomplete/parts/container/Container.js",
       "require": "./cjs/autocomplete/parts/container/Container.js"
     },
+    "./autocomplete/parts/A11yFocusedOption": {
+      "import": "./esm/autocomplete/parts/A11yFocusedOption.js",
+      "require": "./cjs/autocomplete/parts/A11yFocusedOption.js"
+    },
     "./autocomplete": {
       "import": "./esm/autocomplete/index.js",
       "require": "./cjs/autocomplete/index.js"
@@ -840,20 +896,20 @@
     "build": "node ../../scripts/build/build.js"
   },
   "dependencies": {
-    "@elliemae/ds-button": "2.4.2-rc.0",
-    "@elliemae/ds-circular-progress-indicator": "2.4.2-rc.0",
-    "@elliemae/ds-controlled-form": "2.4.2-rc.0",
-    "@elliemae/ds-form": "2.4.2-rc.0",
-    "@elliemae/ds-form-layout-blocks": "2.4.2-rc.0",
-    "@elliemae/ds-grid": "2.4.2-rc.0",
-    "@elliemae/ds-icon": "2.4.2-rc.0",
-    "@elliemae/ds-icons": "2.4.2-rc.0",
-    "@elliemae/ds-pills": "2.4.2-rc.0",
-    "@elliemae/ds-popperjs": "2.4.2-rc.0",
-    "@elliemae/ds-props-helpers": "2.4.2-rc.0",
-    "@elliemae/ds-system": "2.4.2-rc.0",
-    "@elliemae/ds-tooltip": "2.4.2-rc.0",
-    "@elliemae/ds-truncated-tooltip-text": "2.4.2-rc.0",
+    "@elliemae/ds-button": "2.4.2-rc.12",
+    "@elliemae/ds-circular-progress-indicator": "2.4.2-rc.12",
+    "@elliemae/ds-controlled-form": "2.4.2-rc.12",
+    "@elliemae/ds-form": "2.4.2-rc.12",
+    "@elliemae/ds-form-layout-blocks": "2.4.2-rc.12",
+    "@elliemae/ds-grid": "2.4.2-rc.12",
+    "@elliemae/ds-icon": "2.4.2-rc.12",
+    "@elliemae/ds-icons": "2.4.2-rc.12",
+    "@elliemae/ds-pills": "2.4.2-rc.12",
+    "@elliemae/ds-popperjs": "2.4.2-rc.12",
+    "@elliemae/ds-props-helpers": "2.4.2-rc.12",
+    "@elliemae/ds-system": "2.4.2-rc.12",
+    "@elliemae/ds-tooltip": "2.4.2-rc.12",
+    "@elliemae/ds-truncated-tooltip-text": "2.4.2-rc.12",
     "prop-types": "~15.7.2",
     "react-desc": "~4.1.3",
     "react-popper": "~2.2.5",

package/types/autocomplete/parts/A11yFocusedOption.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { DSAutocompleteT } from '../react-desc-prop-types';
+export declare const isSeparator: (el: DSAutocompleteT.OptionTypes | undefined) => el is DSAutocompleteT.ItemSeparatorOptions;
+export declare const StyledA11ySelectedValues: any;
+export declare const A11yFocusedOption: React.ComponentType;

package/types/autocomplete/parts/container/styled.d.ts

@@ -1,2 +1,2 @@
-export declare const StyledContainerWithPopper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 export declare const StyledPopperWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;

package/types/autocomplete/utils/listHelper.d.ts

@@ -1,7 +1,7 @@
 import { DSAutocompleteT } from '../react-desc-prop-types';
-export declare const getSelectableOptions: (options: Array<CBOptionT>) => Array<CBOptionT>;
-export declare const getOptions: (options: Array<CBOptionT>) => Array<CBOptionT>;
-export declare const isSelectedValueEmpty: (value: CBOptionT | Array<CBOptionT>) => boolean;
-export declare const isSelectedValueMultiple: (value: CBOptionT | Array<CBOptionT>) => boolean;
-export declare const findInCircularList: <T extends unknown>(list: T[], from: number, criteria: (item: T) => boolean, step?: number) => number;
+export declare const getSelectableOptions: (options: Array<DSAutocompleteT.OptionTypes>) => Array<DSAutocompleteT.OptionTypes>;
+export declare const getOptions: (options: Array<DSAutocompleteT.OptionTypes>) => Array<DSAutocompleteT.OptionTypes>;
+export declare const isSelectedValueEmpty: (value: DSAutocompleteT.OptionTypes | Array<DSAutocompleteT.OptionTypes>) => boolean;
+export declare const isSelectedValueMultiple: (value: DSAutocompleteT.OptionTypes | Array<DSAutocompleteT.OptionTypes>) => boolean;
+export declare const findInCircularList: (list: DSAutocompleteT.OptionTypes[], from: number, criteria: (item: DSAutocompleteT.OptionTypes) => boolean, step?: number) => number;
 export declare const getFirstOption: (options: DSAutocompleteT.OptionTypes[]) => string;

package/types/checkbox/exported-related/data-test-ids.d.ts

@@ -0,0 +1,4 @@
+export declare const DSCheckboxDataTestIds: {
+    CONTAINER: string;
+    INPUT: string;
+};

package/types/checkbox/exported-related/index.d.ts

@@ -0,0 +1,2 @@
+export * from './data-test-ids';
+export * from './theming';

package/types/checkbox/exported-related/theming.d.ts

@@ -0,0 +1,6 @@
+export declare const DSCheckboxName = "ds-checkbox";
+export declare const DSCheckboxSlots: {
+    CONTAINER: string;
+    INPUT: string;
+    LABEL: string;
+};

package/types/checkbox/react-desc-prop-types.d.ts

@@ -5,15 +5,14 @@ export declare namespace DSControlledCheckboxT {
         checked: boolean | 'mixed';
         tabIndex?: number;
         hasError?: boolean;
-        'data-testid'?: string;
         wrapLabel: boolean;
     }
     interface OptionalProps {
         innerRef: React.RefObject<HTMLInputElement> | React.LegacyRef<HTMLInputElement>;
     }
     interface LegacyAriaProps {
-        ariaControls?: string;
-        ariaLabel?: string;
+        ariaControls: string;
+        ariaLabel: string;
     }
     interface Props extends DefaultProps, OptionalProps, Omit<GlobalAttributesT, 'checked'>, LegacyAriaProps {
     }
@@ -27,14 +26,15 @@ export declare namespace DSControlledCheckboxT {
         disabled?: boolean;
         readOnly?: boolean;
         checked: boolean | 'mixed';
+        wrapLabel: boolean;
     }
 }
 export declare const defaultProps: Partial<DSControlledCheckboxT.Props>;
 export declare const propTypes: {
     label: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
-    wrapLabel: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     hasError: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     innerRef: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
+    wrapLabel: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     'aria-*': import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     'on-*': import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     'data-*': import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;

package/types/checkbox/styles.d.ts

@@ -1,5 +1,6 @@
-import { DSControlledCheckboxT } from './react-desc-prop-types';
-export declare const StyledContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledCheckBox: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, DSControlledCheckboxT.StyledCheckBoxT, never>;
-export declare const StyledInput: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledLabel: import("styled-components").StyledComponent<"label", import("styled-components").DefaultTheme, DSControlledCheckboxT.StyledLabelT, never>;
+export declare const StyledContainer: any;
+export declare const StyledCheckBox: any;
+export declare const StyledInput: any;
+export declare const StyledInputMixed: any;
+export declare const StyledLabel: any;
+export declare const StyledWrapLabel: any;

package/types/combobox/ComboboxDataTestids.d.ts

@@ -1,6 +1,6 @@
 export declare const ComboboxDataTestid: {
     MULTISELECT: {
-        SELECT_ALL_CHECKBOX: string;
+        HEADER_LIST: string;
         SHOW_SELECTED_OPTIONS_TOGGLE: string;
     };
     CONTROLS_WRAPPER: string;

package/types/combobox/index.d.ts

@@ -1 +1,3 @@
 export * from './ComboBox';
+export * from './theming';
+export * from './ComboboxDataTestids';

package/types/combobox/parts/container/styled.d.ts

@@ -1,3 +1,2 @@
-export declare const StyledContainerWithPopper: any;
-export declare const StyledContainerInline: any;
+export declare const StyledContainer: any;
 export declare const StyledPopperWrapper: any;

package/types/combobox/parts/menu-list/styled.d.ts

@@ -2,4 +2,5 @@ export declare const StyledListWrapper: any;
 export declare const StyledList: any;
 export declare const StyledVirtualListWrapper: any;
 export declare const StyledCreatableLabel: any;
+export declare const StyledCreatableValue: any;
 export declare const StyledNoResultsWrapper: any;

package/types/combobox/react-desc-prop-types.d.ts

@@ -31,11 +31,10 @@ export declare namespace DSComboboxT {
         menuMaxHeight?: number;
         placeholder?: string;
         autoFocus?: boolean;
-        filteredOptions: OptionTypes[];
+        isMenuOpen?: boolean;
+        onMenuChange?: (state: boolean, reason: string, e: Event) => void;
         onCreate?: (label: string) => void;
-        onFilter?: (newOptions: OptionTypes[], inputValue: string) => void;
-        onMenuOpen?: () => void;
-        onMenuClose?: () => void;
+        onFilter?: (newOptions: OptionTypes[], inputValue?: string) => void;
         onCancel?: () => void;
         onBlur?: () => void;
         onSelectAll?: (suggestedValue: OptionTypes[] | [], event: React.MouseEvent | React.KeyboardEvent) => null;
@@ -49,11 +48,13 @@ export declare namespace DSComboboxT {
     interface DefaultProps {
         startPlacementPreference: string;
         placementOrderPreference: string[];
+        filteredOptions: OptionTypes[];
         hasError: boolean;
         inline: boolean;
         withoutPortal: boolean;
         zIndex: number;
         disabled: boolean;
+        noOptionsMessage: string;
         innerRef: React.RefObject<HTMLInputElement>;
         useMask: DSMaskT.Hook | typeof noop;
     }
@@ -70,12 +71,13 @@ export declare const ComboboxPropTypes: {
     disabled: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     autoFocus: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     hasError: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
+    noOptionsMessage: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
+    closeMenuOnScroll: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     onChange: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     onFilter: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     onCreate: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     onCancel: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
-    onMenuOpen: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
-    onMenuClose: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
+    onMenuChange: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     inputMinWidth: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     menuMinWidth: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
     menuMaxHeight: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;

package/types/combobox/sharedTypes.d.ts

@@ -1,11 +1,11 @@
-/// <reference types="react" />
+import React from 'react';
 import { useVirtual } from 'react-virtual';
 import { DSComboboxT } from './react-desc-prop-types';
 export declare namespace DSComboboxInternalsT {
     interface ComboBoxContextT {
         props: DSComboboxT.InternalProps;
         virtualListHelpers?: ReturnType<typeof useVirtual>;
-        showPopover: boolean;
+        menuState: boolean;
         setShowPopover: React.Dispatch<React.SetStateAction<boolean>>;
         referenceElement: HTMLElement | null;
         setReferenceElement: React.Dispatch<React.SetStateAction<HTMLElement | null>>;
@@ -25,6 +25,7 @@ export declare namespace DSComboboxInternalsT {
         setFocusOptionIdx: React.Dispatch<React.SetStateAction<string>>;
         showSelectedOptions: boolean;
         setShowSelectedOptions: React.Dispatch<React.SetStateAction<boolean>>;
+        setMenuState: (newState: boolean, reason?: string, e?: React.KeyboardEvent | React.MouseEvent | React.ChangeEvent<HTMLInputElement>) => void;
     }
 }
 export declare const isSeparator: (el: DSComboboxT.OptionTypes | undefined) => el is DSComboboxT.ItemSeparatorOptions;

package/types/combobox/theming.d.ts

@@ -0,0 +1,6 @@
+export declare const DSComboBoxName = "ds-combobox";
+export declare const DSComboboxSlots: {
+    CONTAINER: string;
+    INPUT_WRAPPER: string;
+    INPUT: string;
+};

package/types/combobox/utils/listHelper.d.ts

@@ -11,3 +11,4 @@ export declare const getSuggestedValueOnChange: (selectedOption: DSComboboxT.Ite
 export declare const filterOptions: (inputValue: string, options: DSComboboxT.OptionTypes[]) => DSComboboxT.OptionTypes[];
 export declare const selectedValuesWithSections: (optionsToParse: DSComboboxT.OptionTypes[], multiSelectedValue: DSComboboxT.ItemOption[]) => DSComboboxT.OptionTypes[];
 export declare const getFilteredOptionsSelected: (filteredOption: DSComboboxT.OptionTypes[], selectedValues: DSComboboxT.ItemOption[]) => DSComboboxT.OptionTypes[];
+export declare const scrollIfNeeded: (elem: HTMLElement, options?: ScrollIntoViewOptions | undefined) => void;

package/types/date-time-picker/config/useChangeHandlers.d.ts

@@ -2,6 +2,7 @@ import { useRelevantValueFromProps } from './useRelevantValueFromProps';
 import { useGetDestructuredValues } from './useGetDestructuredValues';
 import { useGetPropsBasedOnType } from './useGetPropsBasedOnType';
 import { useGetReferences } from './useGetReferences';
+import { useFocusTracker } from './useFocusTracker';
 import type { DSControlledDateTimePickerT } from '../propTypes';
 import type { DSControlledDateTimePickerInternalsT } from '../sharedTypes';
 interface Config {
@@ -9,8 +10,9 @@ interface Config {
     destructuredValues: ReturnType<typeof useGetDestructuredValues>;
     propsBasedOnType: ReturnType<typeof useGetPropsBasedOnType>;
     DOMRefs: ReturnType<typeof useGetReferences>;
+    focusTrackers: ReturnType<typeof useFocusTracker>;
 }
-export declare const useChangeHandlers: ({ relevantValues, destructuredValues, propsBasedOnType, DOMRefs }: Config) => {
+export declare const useChangeHandlers: ({ relevantValues, destructuredValues, propsBasedOnType, focusTrackers }: Config) => {
     handleChangeComposedDateTimeString: (newDateString: string, newTimeString: string, metaInfo: DSControlledDateTimePickerT.InternalInputsChangeMetaInfo) => void;
     handleChangeComposedDateString: (newDateString: string, metaInfo: Partial<DSControlledDateTimePickerT.InternalInputsChangeMetaInfo>) => void;
     handleChangeComposedTimeString: (newTimeString: string, metaInfo: Partial<DSControlledDateTimePickerT.InternalInputsChangeMetaInfo>) => void;

package/types/date-time-picker/config/useControlledDateTimePicker.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { useFocusTracker } from './useFocusTracker';
 import { useGetFlags } from './useGetFlags';
 import { useGetReferences } from './useGetReferences';
 import { useRelevantValueFromProps } from './useRelevantValueFromProps';
@@ -7,12 +7,9 @@ import { useGetDestructuredValues } from './useGetDestructuredValues';
 import { useChangeHandlers } from './useChangeHandlers';
 import { useGlobalKeyHandlers } from './useGlobalKeyHandlers';
 import type { DSControlledDateTimePickerT } from '../propTypes';
-export declare type LatestInteractionRegion = 'calendar-days' | 'calendar-head' | 'timewheel' | 'date-inputs' | 'time-inputs' | 'clear-btn' | '';
-export declare type ControlledDateTimePickerContextT = ReturnType<typeof useGetFlags> & ReturnType<typeof useGetReferences> & ReturnType<typeof useGetPropsBasedOnType> & ReturnType<typeof useRelevantValueFromProps> & ReturnType<typeof useGetDestructuredValues> & ReturnType<typeof useChangeHandlers> & ReturnType<typeof useGlobalKeyHandlers> & {
+export declare type ControlledDateTimePickerContextT = ReturnType<typeof useGetFlags> & ReturnType<typeof useFocusTracker> & ReturnType<typeof useGetReferences> & ReturnType<typeof useGetPropsBasedOnType> & ReturnType<typeof useRelevantValueFromProps> & ReturnType<typeof useGetDestructuredValues> & ReturnType<typeof useChangeHandlers> & ReturnType<typeof useGlobalKeyHandlers> & {
     props: DSControlledDateTimePickerT.InternalProps;
     ariaCurrentValueForInputs: string;
     dataAttrs: Record<string, string>;
-    latestInteractionRegion: LatestInteractionRegion;
-    setLatestInteractionRegion: React.Dispatch<React.SetStateAction<LatestInteractionRegion>>;
 };
 export declare const useControlledDateTimePicker: (props: DSControlledDateTimePickerT.Props) => ControlledDateTimePickerContextT;

package/types/date-time-picker/config/useFocusTracker.d.ts

@@ -0,0 +1,38 @@
+/// <reference types="react" />
+import { useGetReferences } from './useGetReferences';
+import { useGetFlags } from './useGetFlags';
+declare type LatestInteractionRegion = 'calendar-days' | 'calendar-head' | 'timewheel' | 'date-inputs' | 'time-inputs' | 'clear-btn' | 'picker-icon' | '';
+declare type CurrFocusDescriber = 'first-segment' | 'month-input' | 'day-input' | 'year-input' | 'hour-input' | 'minute-input' | 'meridiem-input' | 'last-segment' | 'clear-btn' | 'date-picker-icon' | 'time-picker-icon' | 'datetime-picker-icon' | 'calendar-prev-month' | 'calendar-next-month' | 'calendar-prev-year' | 'calendar-next-year' | 'calendar-metafocused-day' | 'timewheel-curr-hour' | 'timewheel-curr-minute' | 'timewheel-curr-meridiem' | '';
+interface Config {
+    DOMRefs: ReturnType<typeof useGetReferences>;
+    flags: ReturnType<typeof useGetFlags>;
+}
+export declare const useFocusTracker: ({ DOMRefs, flags }: Config) => {
+    latestInteractionRegion: LatestInteractionRegion;
+    setLatestInteractionRegion: import("react").Dispatch<import("react").SetStateAction<LatestInteractionRegion>>;
+    currFocusDescriber: CurrFocusDescriber;
+    setCurrFocusDescriber: import("react").Dispatch<import("react").SetStateAction<CurrFocusDescriber>>;
+    trackFocusResetter: () => void;
+    trackFocusMonthInput: () => void;
+    trackFocusDayInput: () => void;
+    trackFocusYearInput: () => void;
+    trackFocusHourInput: () => void;
+    trackFocusMinuteInput: () => void;
+    trackFocusMeridiemInput: () => void;
+    trackFocusClearBtn: () => void;
+    trackFocusDatePickerIcon: () => void;
+    trackFocusTimePickerIcon: () => void;
+    trackFocusDatetimePickerIcon: () => void;
+    trackFocusCalendarPrevMonth: () => void;
+    trackFocusCalendarNextMonth: () => void;
+    trackFocusCalendarPrevYear: () => void;
+    trackFocusCalendarNextYear: () => void;
+    trackFocusCalendarMetafocusedDay: () => void;
+    trackFocusTimewheelCurrHour: () => void;
+    trackFocusTimewheelCurrMinute: () => void;
+    trackFocusTimewheelCurrMeridiem: () => void;
+    trackFocusPicker: () => void;
+    trackFocusFirstSegment: () => void;
+    trackFocusLastSegment: () => void;
+};
+export {};

package/types/date-time-picker/config/useGetPropsBasedOnType.d.ts

@@ -1,16 +1,16 @@
 import type { DSControlledDateTimePickerT } from '../propTypes';
 export declare const useGetPropsBasedOnType: (propsWithDefaults: DSControlledDateTimePickerT.InternalProps) => {
-    getIsDisabledDay: any;
-    getIsOutOfRangeDay: any;
-    getIsStartRangeDay: any;
-    getIsDayInRange: any;
-    getIsEndRangeDay: any;
+    getIsDisabledDay: BooleanGetter<string>;
+    getIsOutOfRangeDay: BooleanGetter<string>;
+    getIsStartRangeDay: BooleanGetter<string> | (() => void);
+    getIsDayInRange: BooleanGetter<string> | (() => void);
+    getIsEndRangeDay: BooleanGetter<string> | (() => void);
     appOnDateChange: DSControlledDateTimePickerT.OnDateChange;
     appOnMonthChange: DSControlledDateTimePickerT.OnInternalInputsChange;
     appOnDayChange: DSControlledDateTimePickerT.OnInternalInputsChange;
     appOnYearChange: DSControlledDateTimePickerT.OnInternalInputsChange;
     appDate: string;
-    getIsDisabledTime: any;
+    getIsDisabledTime: BooleanGetter<string>;
     appOnTimeChange: DSControlledDateTimePickerT.OnTimeChange;
     appOnHourChange: DSControlledDateTimePickerT.OnInternalInputsChange;
     appOnMinuteChange: DSControlledDateTimePickerT.OnInternalInputsChange;

package/types/date-time-picker/config/useGetReferences.d.ts

@@ -1,39 +1,33 @@
 /// <reference types="react" />
 import { useGetFlags } from './useGetFlags';
-export declare const useGetReferences: ({ isWithDateInputs, isWithTimeInputs, withAnyPicker, withClearBtn, }: ReturnType<typeof useGetFlags>) => {
-    monthInputRef: import("react").RefObject<HTMLInputElement>;
-    dayInputRef: import("react").RefObject<HTMLInputElement>;
-    yearInputRef: import("react").RefObject<HTMLInputElement>;
-    hourInputRef: import("react").RefObject<HTMLInputElement>;
-    minutesInputRef: import("react").RefObject<HTMLInputElement>;
-    meridiemInputRef: import("react").RefObject<HTMLInputElement>;
-    clearButtonRef: import("react").RefObject<HTMLButtonElement>;
-    pickerButtonRef: import("react").RefObject<HTMLButtonElement>;
-    prevYearBtnRef: import("react").RefObject<HTMLButtonElement>;
-    prevMonthBtnRef: import("react").RefObject<HTMLButtonElement>;
-    nextMonthBtnRef: import("react").RefObject<HTMLButtonElement>;
-    nextYearBtnRef: import("react").RefObject<HTMLButtonElement>;
-    calendarDaysWrapperRef: import("react").RefObject<HTMLDivElement>;
-    prevHourBtnRef: import("react").RefObject<HTMLButtonElement>;
-    currHourBtnRef: import("react").RefObject<HTMLButtonElement>;
-    nextHourBtnRef: import("react").RefObject<HTMLButtonElement>;
-    prevMinutesBtnRef: import("react").RefObject<HTMLButtonElement>;
-    currMinutesBtnRef: import("react").RefObject<HTMLButtonElement>;
-    nextMinutesBtnRef: import("react").RefObject<HTMLButtonElement>;
-    prevMeridiemBtnRef: import("react").RefObject<HTMLButtonElement>;
-    currMeridiemBtnRef: import("react").RefObject<HTMLButtonElement>;
-    nextMeridiemBtnRef: import("react").RefObject<HTMLButtonElement>;
-    firstSegmentRef: import("react").RefObject<HTMLInputElement | HTMLButtonElement>;
-    lastSegmentRef: import("react").RefObject<HTMLInputElement | HTMLButtonElement>;
-    firstFragmentRefUpdateDeps: {
-        isWithDateInputs: boolean;
-        isWithTimeInputs: boolean;
-        withAnyPicker: boolean;
-    };
-    lastFragmentRefUpdateDeps: {
-        withAnyPicker: boolean;
-        withClearBtn: boolean;
-        isWithTimeInputs: boolean;
-        isWithDateInputs: boolean;
-    };
+declare type FirstSegment = 'month-input' | 'hour-input' | 'date-picker-icon' | 'time-picker-icon' | 'datetime-picker-icon' | '';
+declare type LastSegment = 'year-input' | 'meridiem-input' | 'clear-btn' | 'date-picker-icon' | 'time-picker-icon' | 'datetime-picker-icon' | '';
+export declare const useGetReferences: ({ isWithDateInputs, isWithTimeInputs, isDateSelector, isTimeSelector, isDateTimeSelector, withAnyPicker, withClearBtn, }: ReturnType<typeof useGetFlags>) => {
+    monthInputRef: import("react").MutableRefObject<HTMLInputElement>;
+    dayInputRef: import("react").MutableRefObject<HTMLInputElement>;
+    yearInputRef: import("react").MutableRefObject<HTMLInputElement>;
+    hourInputRef: import("react").MutableRefObject<HTMLInputElement>;
+    minutesInputRef: import("react").MutableRefObject<HTMLInputElement>;
+    meridiemInputRef: import("react").MutableRefObject<HTMLInputElement>;
+    clearButtonRef: import("react").MutableRefObject<HTMLButtonElement>;
+    pickerButtonRef: import("react").MutableRefObject<HTMLButtonElement>;
+    prevYearBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    prevMonthBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    nextMonthBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    nextYearBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    calendarDaysWrapperRef: import("react").MutableRefObject<HTMLDivElement>;
+    prevHourBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    currHourBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    nextHourBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    prevMinutesBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    currMinutesBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    nextMinutesBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    prevMeridiemBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    currMeridiemBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    nextMeridiemBtnRef: import("react").MutableRefObject<HTMLButtonElement>;
+    firstSegmentRef: import("react").MutableRefObject<HTMLInputElement | HTMLButtonElement>;
+    lastSegmentRef: import("react").MutableRefObject<HTMLInputElement | HTMLButtonElement>;
+    firstSegment: FirstSegment;
+    lastSegment: LastSegment;
 };
+export {};

package/types/date-time-picker/config/useGlobalKeyHandlers.d.ts

@@ -2,14 +2,16 @@ import { useChangeHandlers } from './useChangeHandlers';
 import { useGetPropsBasedOnType } from './useGetPropsBasedOnType';
 import { useGetReferences } from './useGetReferences';
 import { useGetFlags } from './useGetFlags';
+import { useFocusTracker } from './useFocusTracker';
 import type { DSControlledDateTimePickerT } from '../propTypes';
 interface Config {
     propsBasedOnType: ReturnType<typeof useGetPropsBasedOnType>;
     changeHandlers: ReturnType<typeof useChangeHandlers>;
     DOMRefs: ReturnType<typeof useGetReferences>;
     flags: ReturnType<typeof useGetFlags>;
+    focusTrackers: ReturnType<typeof useFocusTracker>;
 }
-export declare const useGlobalKeyHandlers: ({ propsBasedOnType, changeHandlers, DOMRefs, flags }: Config) => {
+export declare const useGlobalKeyHandlers: ({ propsBasedOnType, changeHandlers, flags, focusTrackers }: Config) => {
     onFillWithCurrentDateKeys: (e: React.KeyboardEvent<HTMLInputElement | HTMLButtonElement>, metaInfo?: Partial<DSControlledDateTimePickerT.InternalInputsChangeMetaInfo>) => void;
     onGlobalKeyDown: (e: React.KeyboardEvent<HTMLInputElement | HTMLButtonElement>) => void;
 };

package/types/date-time-picker/parts/DateInputs/DDInput.d.ts

@@ -10,6 +10,7 @@ interface DDInputsPropsT {
     placeholder: string;
     ariaCurrentValueForInputs: string;
     contextRef: React.MutableRefObject<HTMLInputElement | null>;
+    isFocused: boolean;
 }
-export declare const DDInput: React.MemoExoticComponent<({ onChange, onBlur, onFocus, onKeyDown, value, disabled, contextRef, placeholder, ariaCurrentValueForInputs, }: DDInputsPropsT) => JSX.Element>;
+export declare const DDInput: React.MemoExoticComponent<({ onChange, onBlur, onFocus, onKeyDown, value, disabled, contextRef, placeholder, ariaCurrentValueForInputs, isFocused, }: DDInputsPropsT) => JSX.Element>;
 export {};

package/types/date-time-picker/parts/DateInputs/MMInput.d.ts

@@ -11,6 +11,7 @@ interface MMInputsPropsT {
     contextRef: React.MutableRefObject<HTMLInputElement | null>;
     placeholder: string;
     ariaCurrentValueForInputs: string;
+    isFocused: boolean;
 }
-export declare const MMInput: React.MemoExoticComponent<({ onChange, onBlur, onFocus, onKeyDown, value, disabled, placeholder, contextRef, autoFocusMonthInput, ariaCurrentValueForInputs, }: MMInputsPropsT) => JSX.Element>;
+export declare const MMInput: React.MemoExoticComponent<({ onChange, onBlur, onFocus, onKeyDown, value, disabled, placeholder, contextRef, autoFocusMonthInput, ariaCurrentValueForInputs, isFocused, }: MMInputsPropsT) => JSX.Element>;
 export {};

package/types/date-time-picker/parts/DateInputs/YYYYInput.d.ts

@@ -10,6 +10,7 @@ interface YYYYInputsPropsT {
     contextRef: React.MutableRefObject<HTMLInputElement | null>;
     placeholder: string;
     ariaCurrentValueForInputs: string;
+    isFocused: boolean;
 }
-export declare const YYYYInput: React.MemoExoticComponent<({ onChange, onBlur, onFocus, onKeyDown, value, disabled, placeholder, contextRef, ariaCurrentValueForInputs, }: YYYYInputsPropsT) => JSX.Element>;
+export declare const YYYYInput: React.MemoExoticComponent<({ onChange, onBlur, onFocus, onKeyDown, value, disabled, placeholder, contextRef, ariaCurrentValueForInputs, isFocused, }: YYYYInputsPropsT) => JSX.Element>;
 export {};

package/types/date-time-picker/parts/Pickers/Calendar/useConfigCalendarCTX.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { useCurrentDisplayedMonthYearLogic } from './useCurrentDisplayedMonthYearLogic';
+import { useFocusLogic } from './useFocusLogic';
+import { usePopperTriggerLogic } from './usePopperTriggerLogic';
+import { useKeyboardHandlers } from './useKeyboardHandlers';
+export declare type CalendarContextT = ReturnType<typeof useCurrentDisplayedMonthYearLogic> & ReturnType<typeof useFocusLogic> & ReturnType<typeof usePopperTriggerLogic> & ReturnType<typeof useKeyboardHandlers> & {
+    showCalendar: boolean;
+    setShowCalendar: StateSetter<boolean>;
+    onPrevYearFocus: React.FocusEventHandler;
+    onPrevMonthFocus: React.FocusEventHandler;
+    onNextMonthFocus: React.FocusEventHandler;
+    onNextYearFocus: React.FocusEventHandler;
+};
+export declare const useConfigCalendarCTX: () => CalendarContextT;