@elliemae/ds-controlled-form 2.3.3-rc.0 → 2.4.0-rc.0

package/types/{controlled-autocomplete → autocomplete}/parts/controls/styled.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare const StyledControlsWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {
+export declare const StyledControlsWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/react-desc-prop-types").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {
     minWidth: number;
     hasError: boolean;
 }, never>;

package/types/autocomplete/parts/controls/useKeyboardNavigation.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const useKeyboardNavigation: () => {
+    onInputKeyDown: React.KeyboardEventHandler<HTMLInputElement>;
+};

package/types/autocomplete/parts/controls/useMaskedOnChange.d.ts

@@ -0,0 +1,2 @@
+declare const useMaskedOnChange: () => any;
+export { useMaskedOnChange };

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

@@ -0,0 +1,54 @@
+import React from 'react';
+export declare function noop<T extends unknown[]>(..._args: T): void;
+export declare namespace DSAutocompleteT {
+    interface CommonItemOptions {
+        dsId: string;
+        disabled?: boolean;
+        render?: React.ComponentType<unknown>;
+    }
+    interface ItemSeparatorOptions extends CommonItemOptions {
+        type: 'separator';
+    }
+    interface ItemSectionOptions extends CommonItemOptions {
+        type: 'section';
+        label: string;
+    }
+    interface ItemOption extends CommonItemOptions {
+        value: string;
+        label: string;
+        type: 'option';
+    }
+    type OptionTypes = ItemOption | ItemSectionOptions | ItemSeparatorOptions;
+    type SelectedOptionsT = ItemOption[] | ItemOption | null;
+    interface PropsOptional {
+        placeholder?: string;
+        autoFocus?: boolean;
+        onFilter?: (value: string) => void;
+    }
+    interface RequiredProps {
+        options: OptionTypes[];
+        value: string;
+    }
+    interface DefaultProps {
+        startPlacementPreference: string;
+        placementOrderPreference: string[];
+        hasError: boolean;
+        withoutPortal: boolean;
+        zIndex: number;
+        disabled: boolean;
+        innerRef: React.RefObject<HTMLInputElement>;
+        inputProps: object;
+    }
+    interface Props extends Partial<DefaultProps>, RequiredProps, PropsOptional {
+    }
+    interface InternalProps extends DefaultProps, RequiredProps, PropsOptional {
+    }
+}
+export declare const propTypes: {
+    placeholder: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
+    options: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
+    value: 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;
+    onChange: import("@elliemae/ds-props-helpers/types/propTypes/types").ReactDescT;
+};

package/types/autocomplete/sharedTypes.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+import { useVirtual } from 'react-virtual';
+import { DSAutocompleteT } from './react-desc-prop-types';
+export declare namespace DSAutoCompleteInternalsT {
+    interface AutocompleteContext {
+        props: DSAutocompleteT.InternalProps;
+        virtualListHelpers?: ReturnType<typeof useVirtual>;
+        showPopover: boolean;
+        setShowPopover: React.Dispatch<React.SetStateAction<boolean>>;
+        referenceElement: HTMLElement | null;
+        setReferenceElement: React.Dispatch<React.SetStateAction<HTMLElement | null>>;
+        scrollOptionIntoView: (dsId: string, opts?: any) => void;
+        inputRef: React.RefObject<HTMLInputElement>;
+        listRef: React.RefObject<HTMLDivElement>;
+        wrapperListRef: React.RefObject<HTMLDivElement>;
+        controlsWrapperRef: React.RefObject<HTMLDivElement>;
+        focusOptionIdx: string;
+        setCurrentOption: React.Dispatch<React.SetStateAction<string>>;
+    }
+}

package/types/{controlled-checkbox → checkbox}/react-desc-prop-types.d.ts

@@ -11,8 +11,8 @@ export declare namespace DSControlledCheckboxT {
         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 {
     }

package/types/{controlled-combobox → combobox}/ComboBoxCTX.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="react" />
 import { DSComboboxT } from './react-desc-prop-types';
 import { DSComboboxInternalsT } from './sharedTypes';
-export declare const defaultProps: DSComboboxT.Props;
+export declare function noop<T extends unknown[]>(..._args: T): void;
+export declare const defaultProps: DSComboboxT.DefaultProps;
 /** Context for cross component communication */
 export declare const ComboBoxContext: import("react").Context<DSComboboxInternalsT.ComboBoxContextT>;
 export default ComboBoxContext;

package/types/{controlled-combobox → combobox}/ComboboxDataTestids.d.ts

@@ -1,12 +1,14 @@
 export declare const ComboboxDataTestid: {
+    MULTISELECT: {
+        SELECT_ALL_CHECKBOX: string;
+        SHOW_SELECTED_OPTIONS_TOGGLE: string;
+    };
+    CONTROLS_WRAPPER: string;
+    CONTAINER: string;
     INPUT: string;
     LIST: string;
     SELECTED_VALUES: string;
-    SELECT_ALL_BUTTON: string;
-    CLEAR_ALL_BUTTON: string;
     DROPDOWN: string;
     OPTION: string;
-    SELECT_ALL_CHECKBOX: string;
-    SHOW_SELECTED_OPTIONS_TOGGLE: string;
     ALLY_SELECTED_VALUES: string;
 };

package/types/{controlled-combobox → combobox}/config/useCorrectOptions.d.ts

@@ -1,3 +1,3 @@
 import { DSComboboxT } from '../react-desc-prop-types';
-declare const useCorrectOptions: (propsWithDefaults: DSComboboxT.Props, showSelectedOptions: boolean) => DSComboboxT.OptionTypes[];
+declare const useCorrectOptions: (propsWithDefaults: DSComboboxT.Props, inputValue: string, showSelectedOptions: boolean) => DSComboboxT.OptionTypes[];
 export { useCorrectOptions };

package/types/combobox/constants.d.ts

@@ -0,0 +1,8 @@
+export declare const MENU_OPTION_TYPES: {
+    OPTION: "option";
+    SECTION: "section";
+    SEPARATOR: "separator";
+};
+export declare const INTERNAL_MENU_OPTION_TYPES: {
+    CREATABLE: "creatable";
+};

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

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const A11yFocusedOption: React.ComponentType;

package/types/combobox/parts/A11ySelectedValues.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const A11ySelectedValues: () => JSX.Element;

package/types/combobox/parts/DropdownIndicator.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const DropdownIndicator: () => JSX.Element;

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

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Container: () => JSX.Element;

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

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

package/types/combobox/parts/controls/Controls.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const Controls: () => JSX.Element;

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

@@ -0,0 +1,5 @@
+export declare const StyledControlsWrapper: any;
+export declare const StyledSelection: any;
+export declare const StyledHeaderActionsWrapper: any;
+export declare const StyleDropdownIndicator: any;
+export declare const StyleHeaderActionsSeparator: any;

package/types/combobox/parts/controls-input/ControlsInput.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const ControlsInput: () => JSX.Element;

package/types/combobox/parts/controls-input/styled.d.ts

@@ -0,0 +1,4 @@
+export declare const StyledInput: any;
+export declare const StyledInputPlaceHolder: any;
+export declare const StyledInputWidthReference: any;
+export declare const StyledInputWrapper: any;

package/types/{controlled-combobox → combobox}/parts/controls-input/useControlsInput.d.ts

@@ -1,8 +1,8 @@
 /// <reference types="react" />
 interface UseControlsInputT {
-    handleOnFocus: () => void;
     handleOnBlur: () => void;
-    handleOnChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
+    handleOnChange?: React.ChangeEventHandler<HTMLInputElement>;
+    handleOnFocus: React.FocusEventHandler<HTMLInputElement>;
     showPlaceholder: string | null | undefined;
     spanReferenceText: string | undefined;
     width: number;

package/types/combobox/parts/controls-input/useMaskedOnChange.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const useMaskedOnChange: () => import("react").ChangeEventHandler<HTMLInputElement>;
+export { useMaskedOnChange };

package/types/{controlled-combobox → combobox}/parts/dropdown-indicator/styled.d.ts

@@ -1,2 +1,2 @@
 /// <reference types="react" />
-export declare const StyledDropDownButton: import("styled-components").StyledComponent<import("react").ComponentType<import("@elliemae/ds-button/types/v2/propTypes").DSButtonT.Props>, import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledDropDownButton: import("styled-components").StyledComponent<import("react").ComponentType<import("@elliemae/ds-button/types/v2/react-desc-prop-types").DSButtonT.Props>, import("styled-components").DefaultTheme, {}, never>;

package/types/combobox/parts/header-list/HeaderList.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const HeaderList: () => JSX.Element;

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

@@ -0,0 +1,5 @@
+export declare const StyledHeaderListWrapper: any;
+export declare const StyledButtonSelection: any;
+export declare const StyledSelectedItems: any;
+export declare const StyledNoOptionsSelected: any;
+export declare const StyledSelectAllCheckbox: any;

package/types/combobox/parts/header-list/useHeaderListHandlers.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+declare const useHeaderListHandlers: () => {
+    handleKeyDown: (e: React.KeyboardEvent) => void;
+    handleToggleSelectedValuesFilter: React.MouseEventHandler<Element>;
+    handleFilterSelectionBtnOnTab: (e: React.KeyboardEvent) => void;
+    handleOnMouseDown: (e: React.MouseEvent) => void;
+    handleCheckAllOnTab: (e: React.KeyboardEvent) => void;
+    handleSelectAllCheckboxChange: (e: React.MouseEvent | React.KeyboardEvent) => void;
+    checkboxStatus: boolean | "mixed";
+};
+export { useHeaderListHandlers };

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

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const MenuList: () => JSX.Element;

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

@@ -0,0 +1,5 @@
+export declare const StyledListWrapper: any;
+export declare const StyledList: any;
+export declare const StyledVirtualListWrapper: any;
+export declare const StyledCreatableLabel: any;
+export declare const StyledNoResultsWrapper: any;

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

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const useItemRenderer: () => Array<JSX.Element> | null;

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

@@ -0,0 +1 @@
+export declare const useMenuListSetFocusOption: () => void;

package/types/combobox/parts/multi-selected-values-container/MultiSelectedValuesContainer.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const MultiSelectedValuesContainer: () => JSX.Element;

package/types/combobox/parts/multi-selected-values-container/RemovableSelectedValuePill.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { DSComboboxT } from '../../react-desc-prop-types';
+export declare const RemovableSelectedValuePill: React.ComponentType<{
+    pill: DSComboboxT.ItemOption;
+}>;

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

@@ -0,0 +1 @@
+export declare const StyledA11ySelectedValues: any;

package/types/{controlled-combobox → combobox}/react-desc-prop-types.d.ts

@@ -1,4 +1,6 @@
 import React from 'react';
+import { DSMaskT } from '../mask-hook';
+export declare function noop<T extends unknown[]>(..._args: T): void;
 export declare namespace DSComboboxT {
     interface CommonItemOptions {
         dsId: string;
@@ -24,34 +26,39 @@ export declare namespace DSComboboxT {
     type OptionTypes = ItemOption | ItemSectionOptions | ItemSeparatorOptions | ItemCreatableOption;
     type SelectedOptionsT = ItemOption[] | ItemOption | null;
     interface PropsOptional {
-        innerRef: React.RefObject<HTMLInputElement>;
-    }
-    interface DefaultProps {
-        placeholder?: string;
-        options: OptionTypes[];
-        selectedValues: SelectedOptionsT;
-        hasError?: boolean;
-        inline?: boolean;
-        autoFocus?: boolean;
-        startPlacementPreference?: string;
-        placementOrderPreference?: string[];
-        withoutPortal?: boolean;
-        zIndex?: number;
         inputMinWidth?: number;
         menuMinWidth?: number;
         menuMaxHeight?: number;
-        disabled?: boolean;
-        onKeyDown: (e: React.KeyboardEvent<HTMLInputElement>, value: ItemOption | undefined) => void;
-        onChange: (value: ItemOption | null) => void;
-        onBlur: () => void;
-        onSelectAll: () => void;
-        onClearAll: () => void;
-        onFilter: (value: string) => void;
-        onCreate: (label: string) => void;
+        placeholder?: string;
+        autoFocus?: boolean;
+        onCreate?: (label: string) => void;
+        onFilter?: (value: string) => void;
         onMenuOpen?: () => void;
+        onMenuClose?: () => void;
         onCancel?: () => void;
+        onBlur?: () => void;
+        onSelectAll?: (suggestedValue: OptionTypes[] | [], event: React.MouseEvent | React.KeyboardEvent) => null;
+        onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>, value: ItemOption) => void;
+    }
+    interface RequiredProps {
+        options: OptionTypes[];
+        selectedValues: SelectedOptionsT;
+        onChange: (suggestedValue: ItemOption | OptionTypes[] | null, selectedOption: ItemOption, event: React.MouseEvent | React.KeyboardEvent) => void;
+    }
+    interface DefaultProps {
+        startPlacementPreference: string;
+        placementOrderPreference: string[];
+        hasError: boolean;
+        inline: boolean;
+        withoutPortal: boolean;
+        zIndex: number;
+        disabled: boolean;
+        innerRef: React.RefObject<HTMLInputElement>;
+        useMask: DSMaskT.Hook | typeof noop;
+    }
+    interface Props extends Partial<DefaultProps>, RequiredProps, PropsOptional {
     }
-    interface Props extends DefaultProps, PropsOptional {
+    interface InternalProps extends DefaultProps, RequiredProps, PropsOptional {
     }
 }
 export declare const ComboboxPropTypes: any;

package/types/{controlled-combobox → combobox}/sharedTypes.d.ts

@@ -3,25 +3,29 @@ import { useVirtual } from 'react-virtual';
 import { DSComboboxT } from './react-desc-prop-types';
 export declare namespace DSComboboxInternalsT {
     interface ComboBoxContextT {
-        props: DSComboboxT.Props;
+        props: DSComboboxT.InternalProps;
         virtualListHelpers?: ReturnType<typeof useVirtual>;
         showPopover: boolean;
         setShowPopover: React.Dispatch<React.SetStateAction<boolean>>;
         referenceElement: HTMLElement | null;
         setReferenceElement: React.Dispatch<React.SetStateAction<HTMLElement | null>>;
-        hasFocus: boolean;
         pillGroupRef: React.RefObject<HTMLDivElement>;
         scrollOptionIntoView: (dsId: string) => void;
         setHasFocus: React.Dispatch<React.SetStateAction<boolean>>;
+        hasFocus: boolean;
         listRef: React.RefObject<HTMLDivElement>;
         wrapperListRef: React.RefObject<HTMLDivElement>;
+        inputValue: string;
+        setInputValue: React.Dispatch<React.SetStateAction<string>>;
         selectedOptionsRef: React.RefObject<HTMLDivElement>;
         controlsWrapperRef: React.RefObject<HTMLDivElement>;
         selectAllCheckboxRef: React.RefObject<HTMLInputElement>;
         toggleSelectionButtonRef: React.RefObject<HTMLButtonElement>;
         focusOptionIdx: string;
-        setCurrentOption: React.Dispatch<React.SetStateAction<string>>;
+        setFocusOptionIdx: React.Dispatch<React.SetStateAction<string>>;
         showSelectedOptions: boolean;
         setShowSelectedOptions: React.Dispatch<React.SetStateAction<boolean>>;
     }
 }
+export declare const isSeparator: (el: DSComboboxT.OptionTypes | undefined) => el is DSComboboxT.ItemSeparatorOptions;
+export declare const isOption: (el: DSComboboxT.OptionTypes | undefined) => el is DSComboboxT.ItemOption;

package/types/{controlled-combobox → combobox}/utils/listHelper.d.ts

@@ -5,3 +5,6 @@ export declare const isSelectedValueEmpty: (value: DSComboboxT.SelectedOptionsT)
 export declare const isSelectedValueMultiple: (value: DSComboboxT.SelectedOptionsT) => boolean;
 export declare const isSelected: (value: DSComboboxT.SelectedOptionsT, activeOption: DSComboboxT.ItemOption) => boolean;
 export declare const findInCircularList: (list: DSComboboxT.OptionTypes[], from: number, criteria: (item: DSComboboxT.OptionTypes) => boolean, step?: number) => number;
+export declare const getFirstOption: (options: DSComboboxT.OptionTypes[], selectedValues: DSComboboxT.SelectedOptionsT, inputValue: string) => string;
+export declare const getSuggestedValueOnChange: (selectedOption: DSComboboxT.ItemOption, selectedValues: DSComboboxT.SelectedOptionsT) => DSComboboxT.ItemOption | DSComboboxT.ItemOption[] | null;
+export declare const getLastValueSelected: (selectedValues: DSComboboxT.SelectedOptionsT) => DSComboboxT.ItemOption | null;