@ws-ui/ui-components 1.0.12 → 1.0.13

package/dist/index.d.ts

@@ -1,18 +1,26 @@
 import { Context } from 'react';
 import { CSSProperties } from 'react';
 import { default as default_2 } from 'react';
+import { Dispatch } from 'react';
 import { ElementType } from 'react';
+import { FocusEvent as FocusEvent_2 } from 'react';
 import { ForwardRefExoticComponent } from 'react';
 import { HTMLAttributes } from 'react';
+import { InputHTMLAttributes } from 'react';
 import { JSX } from 'react';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
+import { MouseEvent as MouseEvent_2 } from 'react';
 import { default as Qodly } from './Qodly.svg?react';
+import { ReactElement } from 'react';
 import { ReactNode } from 'react';
 import { Ref } from 'react';
 import { RefAttributes } from 'react';
+import { SetStateAction } from 'react';
 import { UseComboboxReturnValue } from 'downshift';
+import { UseComboboxStateChange } from 'downshift';
 import { UseMultipleSelectionReturnValue } from 'downshift';
 import { UseSelectReturnValue } from 'downshift';
+import { UseSelectStateChange } from 'downshift';
 
 export declare type BreadcrumbColorConfig = {
     active: string;
@@ -2616,8 +2624,8 @@ declare interface HandleProps {
 
 export declare type IconType = (props: JSX.IntrinsicElements['svg']) => JSX.Element;
 
-export declare interface IDownshiftHookParams<T = unknown> {
-    options?: ISelectOption<T>[] | ISelectOptionGroup<T>[];
+export declare interface IDownshiftHookParams<T> {
+    options?: T[] | ISelectOptionGroup<T>[];
     value?: SelectValue<T>;
     defaultValue?: SelectValue<T>;
     onChange?: ((value: SelectValue<T>) => void) | ((value: SelectValue<T> | ((prev: SelectValue<T>) => SelectValue<T>)) => void);
@@ -2628,32 +2636,35 @@ export declare interface IDownshiftHookParams<T = unknown> {
     onOpenChange?: (isOpen: boolean) => void;
     inputValue?: string;
     onInputChange?: (value: string) => void;
-    getOptionLabel?: (option: ISelectOption<T>) => string;
-    getOptionValue?: (option: ISelectOption<T>) => string | number;
-    items?: ISelectOption<T>[];
+    getOptionLabel?: (option: T) => string;
+    getOptionValue?: (option: T) => string | number;
+    formatOptionLabel?: (option: T) => ReactNode;
+    items?: T[];
     customOptionGenerator?: OptionGenerator<T>;
     disableInternalFiltering?: boolean;
+    isOptionDisabled?: (option: T) => boolean;
+    stateReducer?: (state: any, actionAndChanges: UseComboboxStateChange<T> | UseSelectStateChange<T>) => Partial<any>;
 }
 
-export declare interface IDownshiftHookReturn<T = unknown> {
+export declare interface IDownshiftHookReturn<T> {
     isOpen: boolean;
-    selectedItem: ISelectOption<T> | null;
+    selectedItem: T | null;
     highlightedIndex: number;
     inputValue: string;
-    getToggleButtonProps: UseSelectReturnValue<ISelectOption<T>>['getToggleButtonProps'] | UseComboboxReturnValue<ISelectOption<T>>['getToggleButtonProps'];
-    getMenuProps: UseSelectReturnValue<ISelectOption<T>>['getMenuProps'] | UseComboboxReturnValue<ISelectOption<T>>['getMenuProps'];
-    getItemProps: UseSelectReturnValue<ISelectOption<T>>['getItemProps'] | UseComboboxReturnValue<ISelectOption<T>>['getItemProps'];
-    getInputProps?: UseComboboxReturnValue<ISelectOption<T>>['getInputProps'];
-    selectedItems: ISelectOption<T>[];
-    filteredItems: ISelectOption<T>[];
+    getToggleButtonProps: UseSelectReturnValue<T>['getToggleButtonProps'] | UseComboboxReturnValue<T>['getToggleButtonProps'];
+    getMenuProps: UseSelectReturnValue<T>['getMenuProps'] | UseComboboxReturnValue<T>['getMenuProps'];
+    getItemProps: UseSelectReturnValue<T>['getItemProps'] | UseComboboxReturnValue<T>['getItemProps'];
+    getInputProps?: UseComboboxReturnValue<T>['getInputProps'];
+    selectedItems: T[];
+    filteredItems: T[];
     setInputValue: (value: string) => void;
     setIsOpen: (isOpen: boolean) => void;
     toggleMenu: () => void;
     openMenu: () => void;
     closeMenu: () => void;
     clearSelection: () => void;
-    removeItem: (item: ISelectOption<T>) => void;
-    multipleSelection: UseMultipleSelectionReturnValue<ISelectOption<T>>;
+    removeItem: (item: T) => void;
+    multipleSelection: UseMultipleSelectionReturnValue<T>;
     isMulti: boolean;
     isSearchable: boolean;
 }
@@ -2798,33 +2809,27 @@ export declare interface ISelectContextValue<T = unknown> {
     isInvalid: boolean;
     isDisabled: boolean;
     hasMessage: boolean;
-    setHasMessage: default_2.Dispatch<default_2.SetStateAction<boolean>>;
-    options?: ISelectOption<T>[] | ISelectOptionGroup<T>[];
+    setHasMessage: Dispatch<SetStateAction<boolean>>;
+    options?: T[] | ISelectOptionGroup<T>[];
     downshift: IDownshiftHookReturn<T>;
+    getOptionLabel: (option: T) => string | number;
+    getOptionValue: (option: T) => string | number;
+    isOptionDisabled: (option: T) => boolean;
+    formatOptionLabel?: (option: T) => ReactNode;
 }
 
 export declare interface ISelectOption<T = unknown> {
     value: string | number;
-    label: string;
+    label: string | number;
     data?: T;
     isDisabled?: boolean;
     icon?: ReactNode;
-    [index: string]: string | number | boolean | ReactNode | T;
+    [index: string]: unknown;
 }
 
-export declare interface ISelectOptionGroup<T = unknown> {
+export declare interface ISelectOptionGroup<T> {
     label: string;
-    options: ISelectOption<T>[];
-}
-
-export declare interface ISelectOptionProps<T = unknown> extends default_2.HTMLAttributes<HTMLDivElement> {
-    className?: string;
-    children?: ReactNode;
-    data: ISelectOption<T>;
-    isDisabled?: boolean;
-    isFocused?: boolean;
-    isSelected?: boolean;
-    innerProps?: default_2.HTMLAttributes<HTMLDivElement>;
+    options: T[];
 }
 
 export declare const ListItem: ForwardRefExoticComponent<ListItemProps & RefAttributes<HTMLElement>>;
@@ -2898,7 +2903,7 @@ export declare type NumberSize = {
     height: number;
 };
 
-export declare type OptionGenerator<T = unknown> = (inputValue: string, currentOptions: ISelectOption<T>[]) => ISelectOption<T>[];
+export declare type OptionGenerator<T> = (inputValue: string, currentOptions: T[]) => T[];
 
 export declare const Panel: default_2.ForwardRefExoticComponent<PanelProps & default_2.RefAttributes<HTMLDivElement>>;
 
@@ -3289,7 +3294,7 @@ export declare const Select: {
     Menu: ForwardRefExoticComponent<SelectMenuProps & RefAttributes<HTMLDivElement>>;
     MenuList: ForwardRefExoticComponent<SelectMenuListProps & RefAttributes<HTMLDivElement>>;
     Option: {
-        <T>({ className, children, data, isDisabled, isFocused, isSelected, innerProps, ...props }: ISelectOptionProps<T>): JSX_2.Element;
+        <T>({ className, children, data, isDisabled, isFocused, isSelected, innerProps, ...props }: SelectOptionProps<T>): JSX_2.Element;
         displayName: string;
     };
     Group: {
@@ -3313,56 +3318,18 @@ export declare const Select: {
     }) => React.ReactElement;
 };
 
-/**
- * Adapter component to usage the system Select with the legacy interface.
- * Original interface:
- * {
- *   value: string;
- *   onChange: (val: string) => void;
- *   options: { name: string }[];
- *   errorMessage?: string;
- *   onBlur?: () => void;
- * }
- */
-export declare const SelectAdapter: ({ value, onChange, options, errorMessage, onBlur, }: SelectAdapterProps) => JSX_2.Element;
-
-declare interface SelectAdapterProps {
-    /**
-     * The current value of the select (name property of the option)
-     */
-    value: string;
-    /**
-     * Callback when value changes. Returns the name property.
-     */
-    onChange: (val: string) => void;
-    /**
-     * List of options. Each option must have a name property.
-     */
-    options: {
-        name: string;
-    }[];
-    /**
-     * Error message to display. If provided, shows error state.
-     */
-    errorMessage?: string;
-    /**
-     * Blur handler
-     */
-    onBlur?: () => void;
-}
-
-export declare interface SelectClearIndicatorProps extends default_2.HTMLAttributes<HTMLDivElement> {
+export declare interface SelectClearIndicatorProps extends HTMLAttributes<HTMLDivElement> {
     color?: SelectColor;
     className?: string;
     children?: ReactNode;
-    onClick?: (event: default_2.MouseEvent) => void;
+    onClick?: (event: MouseEvent_2) => void;
     isDisabled?: boolean;
 }
 
-export declare interface SelectClearSearchIndicatorProps extends default_2.HTMLAttributes<HTMLDivElement> {
+export declare interface SelectClearSearchIndicatorProps extends HTMLAttributes<HTMLDivElement> {
     className?: string;
     children?: ReactNode;
-    onClick?: (event: default_2.MouseEvent) => void;
+    onClick?: (event: MouseEvent_2) => void;
     isDisabled?: boolean;
 }
 
@@ -3405,22 +3372,22 @@ export declare interface SelectColorConfig {
     iconActionHover: string;
 }
 
-export declare interface SelectControlProps extends default_2.HTMLAttributes<HTMLDivElement> {
+export declare interface SelectControlProps extends HTMLAttributes<HTMLDivElement> {
     className?: string;
     children: ReactNode;
     isFocused?: boolean;
     isDisabled?: boolean;
 }
 
-export declare interface SelectDropdownIndicatorProps extends default_2.HTMLAttributes<HTMLDivElement> {
+export declare interface SelectDropdownIndicatorProps extends HTMLAttributes<HTMLDivElement> {
     color?: SelectColor;
     className?: string;
     children?: ReactNode;
-    onClick?: (event: default_2.MouseEvent) => void;
+    onClick?: (event: MouseEvent_2) => void;
     isDisabled?: boolean;
 }
 
-export declare interface SelectFieldProps<T = unknown> extends default_2.InputHTMLAttributes<HTMLInputElement> {
+export declare interface SelectFieldProps<T> extends InputHTMLAttributes<HTMLInputElement> {
     placeholder?: string;
     noOptionsMessage?: string | ((inputValue: string) => string);
     hideNoOptions?: boolean;
@@ -3435,28 +3402,28 @@ export declare interface SelectFieldProps<T = unknown> extends default_2.InputHT
     hideSelectedOptions?: boolean;
     isSearchClearable?: boolean;
     searchPlacement?: 'trigger' | 'menu';
-    onFocus?: (event: default_2.FocusEvent<HTMLElement>) => void;
-    onBlur?: (event: default_2.FocusEvent<HTMLElement>) => void;
+    onFocus?: (event: FocusEvent_2<HTMLElement>) => void;
+    onBlur?: (event: FocusEvent_2<HTMLElement>) => void;
     onMenuOpen?: () => void;
     onMenuClose?: () => void;
     renderMenuHeader?: (props: IDownshiftHookReturn<T>) => ReactNode;
-    formatOptionLabel?: (option: ISelectOption<T> & {
-        data?: Record<string, unknown>;
-    }) => ReactNode;
+    formatOptionLabel?: (option: T) => ReactNode;
     displayFormattedOption?: boolean;
-    isOptionDisabled?: (option: ISelectOption<T>) => boolean;
+    isOptionDisabled?: (option: T) => boolean;
+    renderMultiValue?: (props: SelectMultiValueProps<T>) => ReactNode;
+    renderOption?: (props: SelectOptionProps<T>) => ReactNode;
     name?: string;
     id?: string;
     className?: string;
     'aria-label'?: string;
     'aria-labelledby'?: string;
     'aria-describedby'?: string;
-    inputRef?: default_2.Ref<HTMLInputElement>;
+    inputRef?: Ref<HTMLInputElement>;
     controlShouldRenderValue?: boolean;
     blurInputOnSelect?: boolean;
     tabSelectsValue?: boolean;
     backspaceRemovesValue?: boolean;
-    onSelectionComplete?: (value: string, option: ISelectOption<T> | null) => void;
+    onSelectionComplete?: (value: string, option: T | null) => void;
     children?: ReactNode;
 }
 
@@ -3465,48 +3432,50 @@ export declare interface SelectGroupHeadingProps {
     children: ReactNode;
 }
 
-export declare interface SelectGroupProps<T = unknown> {
+export declare interface SelectGroupProps<T> {
     className?: string;
     children: ReactNode;
     data: ISelectOptionGroup<T>;
     label: string;
-    options: ISelectOption<T>[];
+    options: T[];
 }
 
-export declare interface SelectInputProps extends Omit<default_2.InputHTMLAttributes<HTMLInputElement>, 'size'> {
+export declare interface SelectInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
     isHidden?: boolean;
     inputClassName?: string;
     inputStyle?: CSSProperties;
 }
 
-export declare interface SelectMenuListProps extends default_2.HTMLAttributes<HTMLDivElement> {
+export declare interface SelectMenuListProps extends HTMLAttributes<HTMLDivElement> {
     className?: string;
     children: ReactNode;
     isLoading?: boolean;
     maxHeight?: number;
 }
 
-export declare interface SelectMenuProps extends default_2.HTMLAttributes<HTMLDivElement> {
+export declare interface SelectMenuProps extends HTMLAttributes<HTMLDivElement> {
     className?: string;
     children: ReactNode;
     placement?: 'auto' | 'bottom' | 'top';
     position?: 'absolute' | 'fixed';
 }
 
-export declare interface SelectMessageProps extends default_2.HTMLAttributes<HTMLDivElement> {
-    icon?: default_2.ReactElement;
+export declare interface SelectMessageProps extends HTMLAttributes<HTMLDivElement> {
+    icon?: ReactElement;
     className?: string;
     children: ReactNode;
 }
 
-export declare interface SelectMultiValueProps<T = unknown> {
+export declare type SelectMultiValue<T> = T[];
+
+export declare interface SelectMultiValueProps<T> {
     className?: string;
     children?: ReactNode;
-    data: ISelectOption<T>;
+    data: T;
     index: number;
     isDisabled?: boolean;
     isFocused?: boolean;
-    onRemove?: (item: ISelectOption<T>) => void;
+    onRemove?: (item: T) => void;
 }
 
 export declare interface SelectNoOptionsMessageProps {
@@ -3515,25 +3484,37 @@ export declare interface SelectNoOptionsMessageProps {
     inputValue?: string;
 }
 
+export declare interface SelectOptionProps<T> extends HTMLAttributes<HTMLDivElement> {
+    className?: string;
+    children?: ReactNode;
+    data: T;
+    isDisabled?: boolean;
+    isFocused?: boolean;
+    isSelected?: boolean;
+    innerProps?: HTMLAttributes<HTMLDivElement>;
+}
+
 export declare interface SelectPlaceholderProps {
     className?: string;
     children: ReactNode;
 }
 
-export declare interface SelectRootProps<T = unknown> extends Omit<default_2.HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'onChange'> {
+export declare interface SelectRootProps<T = unknown> extends Omit<HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'onChange'> {
     size?: SelectSize;
     color?: 'primary' | 'positive' | 'warning' | 'negative';
     isInvalid?: boolean;
     isDisabled?: boolean;
     className?: string;
     children: ReactNode;
-    downshiftParams?: IDownshiftHookParams<T>;
+    downshiftParams?: SelectStrictParams<T>;
 }
 
-export declare interface SelectSingleValueProps<T = unknown> {
+export declare type SelectSingleValue<T> = T | null;
+
+export declare interface SelectSingleValueProps<T> {
     className?: string;
     children?: ReactNode;
-    data: ISelectOption<T>;
+    data: T;
     isDisabled?: boolean;
 }
 
@@ -3564,7 +3545,19 @@ export declare interface SelectSizeConfig {
     icon: string;
 }
 
-export declare type SelectValue<T = unknown> = ISelectOption<T> | ISelectOption<T>[] | null;
+export declare type SelectStrictParams<T> = Omit<IDownshiftHookParams<T>, 'onChange' | 'value' | 'defaultValue' | 'isMulti'> & ({
+    isMulti?: false;
+    value?: T | null;
+    defaultValue?: T | null;
+    onChange?: (value: T | null) => void;
+} | {
+    isMulti: true;
+    value?: T[];
+    defaultValue?: T[];
+    onChange?: (value: T[]) => void;
+});
+
+export declare type SelectValue<T> = SelectSingleValue<T> | SelectMultiValue<T>;
 
 export declare interface SelectValueContainerProps {
     className?: string;
@@ -3814,6 +3807,7 @@ export declare interface TooltipProps {
     delay?: number;
     /** Controle whether to trigger the tooltip visibility by eather click or hover event */
     trigger?: 'hover' | 'click';
+    className?: string;
 }
 
 export declare const useTabsContext: () => TabsContextType;