@broxus/react-uikit 0.21.0 → 0.22.0

package/dist/esm/components/Close/index.js

@@ -3,9 +3,9 @@ import * as React from 'react';
 import { useConfig } from '../../components/ConfigProvider';
 import { Icon } from '../../components/Icon';
 const defaultElement = 'button';
-export function Close(props) {
+export function Close({ className, ...props }) {
     const config = useConfig();
-    const { className, prefixCls = config.prefixCls, ...restProps } = props;
+    const { prefixCls = config.prefixCls, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'close'), [config, prefixCls]);
     return (React.createElement(Icon, { "aria-hidden": "false", className: classNames(rootCls, className), component: defaultElement, tabIndex: -1, ...restProps, icon: "close" }));
 }

package/dist/esm/components/Component/index.js

@@ -1,6 +1,3 @@
 import * as React from 'react';
 const defaultElement = 'div';
-export const Component = React.forwardRef((props, ref) => {
-    const { component: PolymorphicElement = defaultElement, ...restProps } = props;
-    return React.createElement(PolymorphicElement, { ref: ref, ...restProps });
-});
+export const Component = React.forwardRef(({ component: PolymorphicElement = defaultElement, ...props }, ref) => React.createElement(PolymorphicElement, { ref: ref, ...props }));

package/dist/esm/components/ConfigProvider/index.d.ts

@@ -129,4 +129,4 @@ export interface ConfigContextConsumedProps {
 }
 export declare const ConfigContext: React.Context<ConfigContextConsumedProps>;
 export declare function useConfig(): ConfigContextConsumedProps;
-export declare function ConfigContextProvider({ children, ...restProps }: Partial<React.PropsWithChildren<ConfigContextConsumedProps>>): React.JSX.Element;
+export declare function ConfigContextProvider({ children, ...props }: Partial<React.PropsWithChildren<ConfigContextConsumedProps>>): React.JSX.Element;

package/dist/esm/components/ConfigProvider/index.js

@@ -39,7 +39,7 @@ export const ConfigContext = React.createContext({
 export function useConfig() {
     return React.useContext(ConfigContext);
 }
-export function ConfigContextProvider({ children, ...restProps }) {
+export function ConfigContextProvider({ children, ...props }) {
     const initialContext = useConfig();
     const context = React.useMemo(() => {
         let direction = 'ltr';
@@ -49,8 +49,8 @@ export function ConfigContextProvider({ children, ...restProps }) {
         catch (e) {
             error(e.message);
         }
-        return { ...initialContext, direction, ...restProps };
-    }, [initialContext, restProps]);
+        return { ...initialContext, direction, ...props };
+    }, [initialContext, props]);
     return React.createElement(ConfigContext.Provider, { value: context }, children);
 }
 if (process.env.NODE_ENV !== 'production') {

package/dist/esm/components/Container/index.d.ts

@@ -7,5 +7,10 @@ export interface ContainerOwnProps {
     preserve?: boolean;
     size?: 'xsmall' | 'small' | 'large' | 'xlarge' | 'expand';
 }
-export type ContainerProps<E extends React.ElementType = React.ElementType> = React.PropsWithChildren<ContainerOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, ContainerOwnProps>;
-export declare const Container: React.MemoExoticComponent<(<E extends React.ElementType = "div">(props: ContainerProps<E>) => React.JSX.Element)>;
+export type ContainerProps<E extends React.ElementType = React.ElementType> = ContainerOwnProps & PolymorphicProps<E> & PolymorphicProps<E, ContainerOwnProps>;
+declare const defaultElement = "div";
+export declare function Container<E extends React.ElementType = typeof defaultElement>({ className, component, expandLeft, expandRight, preserve, size, ...props }: React.PropsWithChildren<ContainerProps<E>>): React.JSX.Element;
+export declare namespace Container {
+    var displayName: string;
+}
+export {};

package/dist/esm/components/Container/index.js

@@ -3,17 +3,17 @@ import * as React from 'react';
 import { Component } from '../../components/Component';
 import { useConfig } from '../../components/ConfigProvider';
 const defaultElement = 'div';
-export const Container = React.memo((props) => {
+export function Container({ className, component = defaultElement, expandLeft, expandRight, preserve, size, ...props }) {
     const config = useConfig();
-    const { className, expandLeft, expandRight, prefixCls = config.prefixCls, preserve, size, ...restProps } = props;
+    const { prefixCls = config.prefixCls, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'container'), [config, prefixCls]);
     return (React.createElement(Component, { className: classNames(rootCls, {
             [`${prefixCls || config.prefixCls}-preserve`]: preserve,
             [`${rootCls}-${size}`]: size !== undefined,
             [`${rootCls}-expand-left`]: expandLeft,
             [`${rootCls}-expand-right`]: expandRight,
-        }, className), component: defaultElement, ...restProps }));
-});
+        }, className), component: component, ...restProps }));
+}
 if (process.env.NODE_ENV !== 'production') {
     Container.displayName = 'Container';
 }

package/dist/esm/components/Control/Checkbox/Checkbox.js

@@ -3,10 +3,10 @@ import classNames from 'classnames';
 import * as React from 'react';
 import { useConfig } from '../../../components/ConfigProvider';
 import { useCheckboxGroup } from '../../../components/Control/Checkbox/CheckboxGroupContext';
-export const Checkbox = React.forwardRef((props, ref) => {
+export const Checkbox = React.forwardRef(({ block, children, className, disabled, id, size, skipGroup, style, type = 'checkbox', onChange: onChangeCallback, onMouseEnter, onMouseLeave, ...props }, ref) => {
     const config = useConfig();
     const checkboxGroup = useCheckboxGroup();
-    const { block, children, className, direction = config.checkbox?.direction || config.direction, disabled, id, prefixCls = config.checkbox?.prefixCls || config.prefixCls, size, skipGroup, style, type = 'checkbox', onChange: onChangeCallback, onMouseEnter, onMouseLeave, ...restProps } = props;
+    const { direction = config.checkbox?.direction || config.direction, prefixCls = config.checkbox?.prefixCls || config.prefixCls, ...restProps } = props;
     const prevValue = React.useRef(restProps.value);
     const [internalChecked, setInternalChecked] = React.useState(restProps.checked
         ?? restProps.defaultChecked

package/dist/esm/components/Control/Checkbox/Group.js

@@ -3,9 +3,9 @@ import * as React from 'react';
 import { useConfig } from '../../../components/ConfigProvider';
 import { Checkbox } from '../../../components/Control/Checkbox/Checkbox';
 import { CheckboxGroupContext } from '../../../components/Control/Checkbox/CheckboxGroupContext';
-export const Group = React.forwardRef((props, ref) => {
+export const Group = React.forwardRef(({ block, children, className, defaultValue, options = [], size, stack, style, onChange, ...props }, ref) => {
     const config = useConfig();
-    const { block, children, className, defaultValue, direction = config.checkbox?.direction || config.direction, options = [], prefixCls = config.checkbox?.prefixCls || config.prefixCls, size, stack, style, onChange, ...restProps } = props;
+    const { direction = config.checkbox?.direction || config.direction, prefixCls = config.checkbox?.prefixCls || config.prefixCls, ...restProps } = props;
     const [value, setValue] = React.useState(restProps.value || defaultValue || []);
     const [registeredValues, setRegisteredValues] = React.useState([]);
     const memoOptions = React.useMemo(() => options.map((option) => {

package/dist/esm/components/Control/Input/Input.js

@@ -6,10 +6,7 @@ import { useInput } from '../../../components/Control/Input/useInput';
 import { Icon } from '../../../components/Icon';
 export const Input = React.forwardRef((props, ref) => {
     const config = useConfig();
-    const { allowClear, htmlSize, inputRef, prefix, prefixCls, suffix, wrapperClasses, onClear, ...restProps } = useInput({
-        type: 'text',
-        ...props,
-    });
+    const { allowClear, htmlSize, inputRef, prefix, prefixCls, suffix, wrapperClasses, onClear, ...restProps } = useInput({ type: 'text', ...props });
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls, 'input'), [config, prefixCls]);
     const controlCls = React.useMemo(() => config.getRootPrefixCls(prefixCls, 'control'), [config, prefixCls]);
     const inputProps = omit({

package/dist/esm/components/Control/Input/Password/index.js

@@ -3,9 +3,9 @@ import * as React from 'react';
 import { useConfig } from '../../../../components/ConfigProvider';
 import { Input } from '../../../../components/Control/Input/Input';
 import { Icon } from '../../../../components/Icon';
-export const Password = React.forwardRef((props, ref) => {
+export const Password = React.forwardRef(({ onBlur: onBlurCallback, onChange: onChangeCallback, ...props }, ref) => {
     const config = useConfig();
-    const { prefixCls = config.control?.prefixCls ?? config.prefixCls, onBlur: onBlurCallback, onChange: onChangeCallback, ...restProps } = props;
+    const { prefixCls = config.control?.prefixCls ?? config.prefixCls, ...restProps } = props;
     const inputRef = React.useRef(null);
     const removePasswordTimeout = React.useRef(null);
     const [visible, setVisible] = React.useState(false);

package/dist/esm/components/Control/Radio/Group.js

@@ -4,9 +4,9 @@ import * as React from 'react';
 import { useConfig } from '../../../components/ConfigProvider';
 import { Radio } from '../../../components/Control/Radio/Radio';
 import { RadioGroupContext } from '../../../components/Control/Radio/RadioGroupContext';
-export const Group = React.forwardRef((props, ref) => {
+export const Group = React.forwardRef(({ block, children, className, defaultValue, disabled, id, options, size, stack, style, ...props }, ref) => {
     const config = useConfig();
-    const { block, children, className, defaultValue, direction = config.radio?.direction || config.direction, disabled, id, options, prefixCls = config.radio?.prefixCls || config.prefixCls, size, stack, style, ...restProps } = props;
+    const { direction = config.radio?.direction || config.direction, prefixCls = config.radio?.prefixCls || config.prefixCls, ...restProps } = props;
     const [value, setValue] = useMergedState(defaultValue, {
         value: restProps.value,
     });

package/dist/esm/components/Control/Radio/Radio.js

@@ -3,10 +3,10 @@ import classNames from 'classnames';
 import * as React from 'react';
 import { useConfig } from '../../../components/ConfigProvider';
 import { useRadioGroup } from '../../../components/Control/Radio/RadioGroupContext';
-export const Radio = React.forwardRef((props, ref) => {
+export const Radio = React.forwardRef(({ block, children, className, disabled, id, size, skipGroup, style, onChange: onChangeCallback, onMouseEnter, onMouseLeave, ...props }, ref) => {
     const config = useConfig();
     const radioGroup = useRadioGroup();
-    const { block, children, className, direction = config.radio?.direction || config.direction, disabled, id, prefixCls = config.radio?.prefixCls || config.prefixCls, size, skipGroup, style, onChange: onChangeCallback, onMouseEnter, onMouseLeave, ...restProps } = props;
+    const { direction = config.radio?.direction || config.direction, prefixCls = config.radio?.prefixCls || config.prefixCls, ...restProps } = props;
     const [internalChecked, setInternalChecked] = React.useState(restProps.checked
         ?? restProps.defaultChecked
         ?? ('value' in restProps && restProps.value === radioGroup?.value));

package/dist/esm/components/Control/Select/index.d.ts

@@ -5,12 +5,10 @@ import * as React from 'react';
 import { type ControlProps, type SelectPlacement } from '../../../components/Control/types';
 import { type SizeType } from '../../../types';
 export type { BaseSelectRef, OptionProps };
-export interface InternalSelectProps<ValueType = any, OptionType extends BaseOptionType | DefaultOptionType = DefaultOptionType> extends Omit<RcSelectProps<ValueType, OptionType>, 'allowClear' | 'mode' | 'placement'> {
-    mode?: 'multiple' | 'tags' | 'SECRET_COMBOBOX_MODE_DO_NOT_USE';
+export interface InternalSelectProps<ValueType = any, OptionType extends BaseOptionType | DefaultOptionType = DefaultOptionType> extends Omit<RcSelectProps<ValueType, OptionType>, 'placement'> {
     size?: SizeType;
 }
-export interface SelectProps<ValueType = any, OptionType extends BaseOptionType | DefaultOptionType = DefaultOptionType> extends Omit<ControlProps<ValueType>, 'value' | 'defaultValue'>, Omit<InternalSelectProps<ValueType, OptionType>, 'inputIcon' | 'mode' | 'getInputElement' | 'backfill'> {
-    mode?: 'multiple' | 'tags';
+export interface SelectProps<ValueType = any, OptionType extends BaseOptionType | DefaultOptionType = DefaultOptionType> extends Omit<ControlProps<ValueType>, 'allowClear' | 'defaultValue' | 'suffix' | 'value'>, Omit<InternalSelectProps<ValueType, OptionType>, 'inputIcon' | 'getInputElement' | 'backfill'> {
     placement?: SelectPlacement;
     showArrow?: boolean;
 }

package/dist/esm/components/Control/Select/index.js

@@ -7,9 +7,9 @@ import { Icon } from '../../../components/Icon';
 import { Spinner } from '../../../components/Spinner';
 const SECRET_COMBOBOX_MODE_DO_NOT_USE = 'SECRET_COMBOBOX_MODE_DO_NOT_USE';
 /* eslint-disable jsx-a11y/label-has-associated-control */
-function InternalSelect(props, ref) {
+function InternalSelect({ allowClear, popupMatchSelectWidth, builtinPlacements = getBuiltInPlacements(popupMatchSelectWidth), className, listHeight = 256, listItemHeight = 24, mode, placement = 'bottom-left', showArrow = true, showSearch = false, onPressEnter, ...props }, ref) {
     const config = useConfig();
-    const { allowClear, direction = config.select?.direction || config.direction, popupMatchSelectWidth, builtinPlacements = getBuiltInPlacements(popupMatchSelectWidth), className, listHeight = 256, listItemHeight = 24, placement = 'bottom-left', prefixCls = config.select?.prefixCls || config.prefixCls, showArrow = true, showSearch = false, onPressEnter, ...restProps } = props;
+    const { direction = config.select?.direction || config.direction, prefixCls = config.select?.prefixCls || config.prefixCls, ...restProps } = props;
     const inputRef = React.useRef(null);
     const labelRef = React.useRef(null);
     const [focused, setFocused] = React.useState(false);
@@ -56,16 +56,6 @@ function InternalSelect(props, ref) {
     }, [direction]);
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.select?.prefixCls || config.prefixCls, 'select'), [config, prefixCls]);
     const controlCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.select?.prefixCls || config.prefixCls, 'control'), [config, prefixCls]);
-    const mode = React.useMemo(() => {
-        const { mode: m } = restProps;
-        if (m === 'combobox') {
-            return undefined;
-        }
-        if (m === SECRET_COMBOBOX_MODE_DO_NOT_USE) {
-            return 'combobox';
-        }
-        return m;
-    }, [restProps]);
     const wrapperClasses = React.useMemo(() => classNames([controlCls, `${controlCls}-select`], {
         [`${controlCls}-${restProps.size}`]: restProps.size,
         [`${controlCls}-rtl`]: direction === 'rtl',
@@ -95,6 +85,7 @@ function InternalSelect(props, ref) {
             else {
                 suffixIcon = React.createElement(Spinner, { key: "spinner", ratio: 0.7 });
             }
+            suffixIcon = React.createElement("div", { className: `${rootCls}-arrow ${rootCls}-arrow-loading` }, suffixIcon);
         }
         else if (showArrow) {
             const isMultiple = mode === 'multiple' || mode === 'tags';
@@ -127,8 +118,11 @@ function InternalSelect(props, ref) {
                 suffixIcon = config.select.arrowIcon;
             }
             else {
-                suffixIcon = internalOpen ? (React.createElement(Icon, { key: "expand_less", icon: "expand_less" })) : (React.createElement(Icon, { key: "expand_more", icon: "expand_more", onClick: onClickIcon }));
+                suffixIcon = internalOpen
+                    ? React.createElement(Icon, { key: "expand_less", icon: "expand_less", onClick: onClickIcon })
+                    : React.createElement(Icon, { key: "expand_more", icon: "expand_more", onClick: onClickIcon });
             }
+            suffixIcon = React.createElement("div", { className: `${rootCls}-arrow` }, suffixIcon);
         }
         // Not found content
         let mergedNotFound;
@@ -162,7 +156,7 @@ function InternalSelect(props, ref) {
             prefixCls: rootCls,
             removeIcon: React.createElement(Icon, { icon: "clear" }),
             showSearch,
-            suffixIcon,
+            suffix: suffixIcon,
             transitionName: `${prefixCls || config.select?.prefixCls || config.prefixCls}-motion-slide-bottom-small`,
             ...restProps,
             notFoundContent: mergedNotFound,
@@ -170,7 +164,6 @@ function InternalSelect(props, ref) {
                 [`${prefixCls || config.select?.prefixCls || config.prefixCls}-dropdown-rtl`]: direction === 'rtl',
             }),
             popupMatchSelectWidth: true,
-            // eslint-disable-next-line sort-keys
             onBlur,
             onFocus,
             onKeyDown,

package/dist/esm/components/Control/TextArea/index.js

@@ -8,9 +8,9 @@ function fixEmojiLength(value, maxLength) {
     return [...(value || '')].slice(0, maxLength).join('');
 }
 /* eslint-disable jsx-a11y/label-has-associated-control */
-export const TextArea = React.forwardRef((props, ref) => {
+export const TextArea = React.forwardRef(({ className, dir, disabled, maxLength, readOnly, showCount, state, onPressEnter, ...props }, ref) => {
     const config = useConfig();
-    const { className, dir, disabled, maxLength, prefixCls = config.prefixCls, readOnly, showCount, state, onPressEnter, ...restProps } = props;
+    const { prefixCls = config.prefixCls, ...restProps } = props;
     const hasMaxLength = Number(maxLength) > 0;
     const [compositing, setCompositing] = React.useState(false);
     const [focused, setFocused] = React.useState(false);

package/dist/esm/components/Cover/index.d.ts

@@ -5,7 +5,7 @@ export interface CoverProps extends React.HTMLAttributes<HTMLDivElement> {
     prefixCls?: string;
     width?: number;
 }
-export declare function Cover(props: CoverProps): React.JSX.Element;
+export declare function Cover({ automute, children, className, height, width, ...props }: CoverProps): React.JSX.Element;
 export declare namespace Cover {
     var displayName: string;
 }

package/dist/esm/components/Cover/index.js

@@ -2,9 +2,9 @@ import { debounce, Dimensions, isBrowser } from '@broxus/js-utils';
 import classNames from 'classnames';
 import * as React from 'react';
 import { useConfig } from '../../components/ConfigProvider';
-export function Cover(props) {
+export function Cover({ automute = true, children, className, height, width, ...props }) {
     const config = useConfig();
-    const { automute = true, children, className, height, prefixCls = config.prefixCls, width, ...restProps } = props;
+    const { prefixCls = config.prefixCls, ...restProps } = props;
     const container = React.useRef(null);
     const coveringElement = React.useRef(null);
     const resize = React.useCallback(() => {

package/dist/esm/components/DatePicker/PickerButton.d.ts

@@ -1,3 +1,3 @@
 import * as React from 'react';
 import { type ButtonProps } from '../../components/Button';
-export declare const PickerButton: React.MemoExoticComponent<(props: ButtonProps) => React.JSX.Element>;
+export declare function PickerButton(props: ButtonProps): React.JSX.Element;

package/dist/esm/components/DatePicker/PickerButton.js

@@ -1,3 +1,5 @@
 import * as React from 'react';
 import { Button } from '../../components/Button';
-export const PickerButton = React.memo((props) => React.createElement(Button, { size: "small", type: "primary", ...props }));
+export function PickerButton(props) {
+    return React.createElement(Button, { size: "small", type: "primary", ...props });
+}

package/dist/esm/components/DescriptionList/DescriptionList.d.ts

@@ -3,7 +3,7 @@ export interface DescriptionListProps extends React.HTMLAttributes<HTMLDListElem
     divided?: boolean;
     prefixCls?: string;
 }
-export declare function DescriptionList(props: DescriptionListProps): React.JSX.Element;
+export declare function DescriptionList({ className, divided, ...props }: DescriptionListProps): React.JSX.Element;
 export declare namespace DescriptionList {
     var displayName: string;
 }

package/dist/esm/components/DescriptionList/DescriptionList.js

@@ -1,9 +1,9 @@
 import classNames from 'classnames';
 import * as React from 'react';
 import { useConfig } from '../../components/ConfigProvider';
-export function DescriptionList(props) {
+export function DescriptionList({ className, divided, ...props }) {
     const config = useConfig();
-    const { className, divided, prefixCls = config.prefixCls, ...restProps } = props;
+    const { prefixCls = config.prefixCls, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'description-list'), [config, prefixCls]);
     return (React.createElement("dl", { className: classNames(rootCls, {
             [`${rootCls}-divider`]: divided,

package/dist/esm/components/Divider/index.d.ts

@@ -5,7 +5,7 @@ export interface DividerProps extends Omit<React.HTMLAttributes<HTMLHRElement>,
     small?: boolean;
     vertical?: boolean;
 }
-export declare function Divider(props: DividerProps): React.JSX.Element;
+export declare function Divider({ className, icon, small, vertical, ...props }: DividerProps): React.JSX.Element;
 export declare namespace Divider {
     var displayName: string;
 }

package/dist/esm/components/Divider/index.js

@@ -1,9 +1,9 @@
 import classNames from 'classnames';
 import * as React from 'react';
 import { useConfig } from '../../components/ConfigProvider';
-export function Divider(props) {
+export function Divider({ className, icon, small, vertical, ...props }) {
     const config = useConfig();
-    const { className, icon, prefixCls = config.prefixCls, small, vertical, ...restProps } = props;
+    const { prefixCls = config.prefixCls, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'divider'), [config, prefixCls]);
     return (React.createElement("hr", { className: classNames({
             [`${rootCls}-icon`]: icon && !small && !vertical,

package/dist/esm/components/Dotnav/Dotnav.d.ts

@@ -3,7 +3,7 @@ export interface DotnavProps extends React.HTMLAttributes<HTMLUListElement> {
     prefixCls?: string;
     vertical?: boolean;
 }
-export declare function Dotnav(props: DotnavProps): React.JSX.Element;
+export declare function Dotnav({ className, vertical, ...props }: DotnavProps): React.JSX.Element;
 export declare namespace Dotnav {
     var displayName: string;
 }

package/dist/esm/components/Dotnav/Dotnav.js

@@ -1,9 +1,9 @@
 import classNames from 'classnames';
 import * as React from 'react';
 import { useConfig } from '../../components/ConfigProvider';
-export function Dotnav(props) {
+export function Dotnav({ className, vertical, ...props }) {
     const config = useConfig();
-    const { className, prefixCls = config.prefixCls, vertical, ...restProps } = props;
+    const { prefixCls = config.prefixCls, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'dotnav'), [config, prefixCls]);
     return (React.createElement("ul", { className: classNames(rootCls, {
             [`${rootCls}-vertical`]: vertical,

package/dist/esm/components/Dotnav/Item.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 export interface DotnavItemProps extends Omit<React.LiHTMLAttributes<HTMLLIElement>, 'children'> {
     isActive?: boolean;
 }
-export declare function Item(props: DotnavItemProps): React.JSX.Element;
+export declare function Item({ className, isActive, onClick, ...props }: DotnavItemProps): React.JSX.Element;
 export declare namespace Item {
     var displayName: string;
 }

package/dist/esm/components/Dotnav/Item.js

@@ -2,12 +2,11 @@ import classNames from 'classnames';
 import * as React from 'react';
 import { Button } from '../../components/Button';
 import { useConfig } from '../../components/ConfigProvider';
-export function Item(props) {
+export function Item({ className, isActive, onClick, ...props }) {
     const config = useConfig();
-    const { className, isActive, onClick, ...restProps } = props;
     return (React.createElement("li", { className: classNames({
             [`${config.prefixCls}-active`]: isActive,
-        }, className), ...restProps },
+        }, className), ...props },
         React.createElement(Button, { type: "text", onClick: onClick })));
 }
 if (process.env.NODE_ENV !== 'production') {

package/dist/esm/components/Drawer/index.d.ts

@@ -2,11 +2,11 @@ import { type DrawerProps as RcDrawerProps } from '@rc-component/drawer';
 import * as React from 'react';
 import { type Direction } from '../../types';
 export type DrawerSize = 'large';
-export type DrawerRef = {
+export interface DrawerRef {
     collapse: VoidFunction;
     expand: VoidFunction;
     isOpen?: boolean;
-};
+}
 export interface PushState {
     distance: string | number;
 }

package/dist/esm/components/Drawer/index.js

@@ -5,9 +5,9 @@ import * as React from 'react';
 import { useConfig } from '../../components/ConfigProvider';
 import { addModalMode, getMotionName, removeModalMode } from '../../utils';
 const defaultPushState = { distance: 180 };
-export const Drawer = React.forwardRef((props, ref) => {
+export const Drawer = React.forwardRef(({ animation = 'slide', children, className, defaultOpen, destroyOnHidden, direction, keyboard = true, mask = true, maskClosable = true, motion, open, placement = 'right', push = defaultPushState, rootClassName, rootStyle, size, trigger, onClose: onCloseCallback, ...props }, ref) => {
     const config = useConfig();
-    const { animation = 'slide', children, className, defaultOpen, destroyOnHidden, direction, getContainer = config.getPopupContainer, keyboard = true, mask = true, maskClosable = true, motion, open, placement = 'right', prefixCls = config.prefixCls, push = defaultPushState, rootClassName, rootStyle, size, trigger, onClose: onCloseCallback, ...restProps } = props;
+    const { getContainer = config.getPopupContainer, prefixCls = config.prefixCls, ...restProps } = props;
     const [isShown, setShown] = React.useState(defaultOpen);
     const [internalOpen, setOpen] = React.useState(defaultOpen);
     const mergedOpen = open === undefined ? internalOpen : open;

package/dist/esm/components/Drop/index.d.ts

@@ -22,12 +22,12 @@ export interface DropProps extends Pick<TriggerProps, 'alignPoint' | 'action' |
     onOverlayClick?: (event: Event) => void;
     onVisibleChange?: (visible: boolean) => void;
 }
-export type TriggerRef = {
+export interface TriggerRef {
     forceAlign: VoidFunction;
-};
-export type DropRef = {
+}
+export interface DropRef {
     close: VoidFunction;
     open: VoidFunction;
     triggerRef: TriggerRef | null;
-};
+}
 export declare const Drop: React.ForwardRefExoticComponent<DropProps & React.RefAttributes<DropRef>>;

package/dist/esm/components/Drop/index.js

@@ -4,9 +4,9 @@ import * as React from 'react';
 import { useConfig } from '../../components/ConfigProvider';
 import placements from '../../components/Drop/placements';
 import { getMotionName, mergeDropMaskMotion } from '../../utils';
-export const Drop = React.forwardRef((props, ref) => {
+export const Drop = React.forwardRef(({ action = ['hover'], align, alignPoint, arrow = false, autoDestroy, builtinPlacements = placements, children, defaultVisible, hideAction = action, maskMotion, minOverlayWidthMatchTrigger, motion, openClassName, overlay, overlayClassName, overlayStyle, placement = 'bottom-left', rootCls: externalRootCls, showAction = action, visible, onAlign, onOverlayClick, onVisibleChange, ...props }, ref) => {
     const config = useConfig();
-    const { action = ['hover'], align, alignPoint, arrow = false, autoDestroy, builtinPlacements = placements, children, defaultVisible, getPopupContainer = config.getPopupContainer, hideAction = action, maskMotion, minOverlayWidthMatchTrigger, motion, openClassName, overlay, overlayClassName, overlayStyle, placement = 'bottom-left', prefixCls = config.prefixCls, rootCls: externalRootCls, showAction = action, visible, onAlign, onOverlayClick, onVisibleChange, ...restProps } = props;
+    const { getPopupContainer = config.getPopupContainer, prefixCls = config.prefixCls, ...restProps } = props;
     const triggerRef = React.useRef(null);
     const [triggerVisible, setTriggerVisible] = React.useState(defaultVisible);
     const mergedVisible = 'visible' in restProps ? visible : triggerVisible;

package/dist/esm/components/Dropdown/index.js

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { useConfig } from '../../components/ConfigProvider';
 import { Drop } from '../../components/Drop';
-export const Dropdown = React.forwardRef((props, ref) => {
+export const Dropdown = React.forwardRef(({ children, ...props }, ref) => {
     const config = useConfig();
-    const { children, prefixCls = config.prefixCls, ...restProps } = props;
+    const { prefixCls = config.prefixCls, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'dropdown'), [config, prefixCls]);
     return (React.createElement(Drop, { ref: ref, ...restProps, rootCls: rootCls }, children));
 });

package/dist/esm/components/Flex/Flex.d.ts

@@ -18,7 +18,7 @@ export interface FlexOwnProps extends FlexBreakpoint, FlexBreakpointsConfig {
     inline?: boolean;
     prefixCls?: string;
 }
-export type FlexProps<E extends React.ElementType = React.ElementType> = React.PropsWithChildren<FlexOwnProps & PolymorphicProps<E>> & PolymorphicProps<E, FlexOwnProps>;
+export type FlexProps<E extends React.ElementType = React.ElementType> = FlexOwnProps & PolymorphicProps<E> & PolymorphicProps<E, FlexOwnProps>;
 declare const defaultElement = "div";
-export declare function Flex<E extends React.ElementType = typeof defaultElement>(props: FlexProps<E>): React.JSX.Element;
+export declare function Flex<E extends React.ElementType = typeof defaultElement>({ alignContent, alignItems, className, component, flexDirection, flexWrap, inline, justifyContent, ...props }: React.PropsWithChildren<FlexProps<E>>): React.JSX.Element;
 export {};

package/dist/esm/components/Flex/Flex.js

@@ -37,9 +37,9 @@ function mapJustifyContentBreakpoints(value) {
     }
     return config;
 }
-export function Flex(props) {
+export function Flex({ alignContent, alignItems, className, component = defaultElement, flexDirection, flexWrap, inline, justifyContent, ...props }) {
     const config = useConfig();
-    const { alignContent, alignItems, className, flexDirection, flexWrap, inline, justifyContent, prefixCls = config.prefixCls, ...restProps } = props;
+    const { prefixCls = config.prefixCls, ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'flex'), [config, prefixCls]);
     const justifyContentCls = React.useMemo(
     // eslint-disable-next-line no-nested-ternary
@@ -59,5 +59,5 @@ export function Flex(props) {
                 [`${rootCls}-inline`]: inline,
                 [`${rootCls}-wrap-${alignContentMap.get(alignContent)}`]: alignContent && alignContentMap.has(alignContent),
                 [rootCls]: !inline,
-            }, justifyContentCls, className), component: defaultElement, ...restProps })));
+            }, justifyContentCls, className), component: component, ...restProps })));
 }

package/dist/esm/components/Flex/Item.d.ts

@@ -8,7 +8,7 @@ export interface ItemOwnItem {
     order?: Order | BreakpointsConfig<Order>;
     prefixCls?: string;
 }
-export type ItemProps<E extends React.ElementType = React.ElementType> = React.PropsWithChildren<ItemOwnItem & PolymorphicProps<E>> & PolymorphicProps<E, ItemOwnItem>;
+export type ItemProps<E extends React.ElementType = React.ElementType> = ItemOwnItem & PolymorphicProps<E> & PolymorphicProps<E, ItemOwnItem>;
 declare const defaultElement = "div";
-export declare function Item<E extends React.ElementType = typeof defaultElement>(props: ItemProps<E>): React.JSX.Element;
+export declare function Item<E extends React.ElementType = typeof defaultElement>({ className, component, itemDimensions, order, ...props }: React.PropsWithChildren<ItemProps<E>>): React.JSX.Element;
 export {};

package/dist/esm/components/Flex/Item.js

@@ -5,14 +5,14 @@ import { useConfig } from '../../components/ConfigProvider';
 import { FlexContext } from '../../components/Flex/context';
 import { getBreakpointsConfigClasses } from '../../utils';
 const defaultElement = 'div';
-export function Item(props) {
+export function Item({ className, component = defaultElement, itemDimensions, order, ...props }) {
     const config = useConfig();
     const { getRootCls } = React.useContext(FlexContext);
-    const { className, itemDimensions, order, prefixCls = getRootCls(), ...restProps } = props;
+    const { prefixCls = getRootCls(), ...restProps } = props;
     const orderCls = React.useMemo(() => (typeof order === 'string'
         ? `${prefixCls}-${order}`
         : getBreakpointsConfigClasses(prefixCls || config.prefixCls, 'flex', order)), [config.prefixCls, order, prefixCls]);
     return (React.createElement(Component, { className: classNames({
             [`${prefixCls}-${itemDimensions}`]: itemDimensions !== undefined,
-        }, orderCls, className), component: defaultElement, ...restProps }));
+        }, orderCls, className), component: component, ...restProps }));
 }

package/dist/esm/components/Flex/context.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-export type FlexContextConsumerProps = {
+export interface FlexContextConsumerProps {
     getRootCls(): string | undefined;
-};
+}
 export declare const FlexContext: React.Context<FlexContextConsumerProps>;

package/dist/esm/components/Form/Controls.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 export interface ControlsProps extends React.HTMLAttributes<HTMLDivElement> {
     prefixCls?: string;
 }
-export declare function Controls(props: ControlsProps): React.JSX.Element;
+export declare function Controls({ className, ...props }: ControlsProps): React.JSX.Element;
 export declare namespace Controls {
     var displayName: string;
 }

package/dist/esm/components/Form/Controls.js

@@ -2,10 +2,10 @@ import classNames from 'classnames';
 import * as React from 'react';
 import { useConfig } from '../../components/ConfigProvider';
 import { FormContext } from '../../components/Form/context';
-export function Controls(props) {
+export function Controls({ className, ...props }) {
     const config = useConfig();
     const { getRootCls } = React.useContext(FormContext);
-    const { className, prefixCls = getRootCls(), ...restProps } = props;
+    const { prefixCls = getRootCls(), ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'controls'), [config, prefixCls]);
     return React.createElement("div", { className: classNames(rootCls, className), ...restProps });
 }

package/dist/esm/components/Form/ControlsText.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 export interface ControlsTextProps extends React.HTMLAttributes<HTMLDivElement> {
     prefixCls?: string;
 }
-export declare function ControlsText(props: ControlsTextProps): React.JSX.Element;
+export declare function ControlsText({ className, ...props }: ControlsTextProps): React.JSX.Element;
 export declare namespace ControlsText {
     var displayName: string;
 }

package/dist/esm/components/Form/ControlsText.js

@@ -2,10 +2,10 @@ import classNames from 'classnames';
 import * as React from 'react';
 import { useConfig } from '../../components/ConfigProvider';
 import { FormContext } from '../../components/Form/context';
-export function ControlsText(props) {
+export function ControlsText({ className, ...props }) {
     const config = useConfig();
     const { getRootCls } = React.useContext(FormContext);
-    const { className, prefixCls = getRootCls(), ...restProps } = props;
+    const { prefixCls = getRootCls(), ...restProps } = props;
     const rootCls = React.useMemo(() => config.getRootPrefixCls(prefixCls || config.prefixCls, 'controls-text'), [config, prefixCls]);
     return React.createElement("div", { className: classNames(rootCls, className), ...restProps });
 }

package/dist/esm/components/Form/Fieldset.d.ts

@@ -3,7 +3,7 @@ export interface FieldsetProps extends React.FieldsetHTMLAttributes<HTMLFieldSet
     layout?: 'stacked' | 'horizontal';
     prefixCls?: string;
 }
-export declare function Fieldset(props: FieldsetProps): React.JSX.Element;
+export declare function Fieldset({ className, layout, ...props }: FieldsetProps): React.JSX.Element;
 export declare namespace Fieldset {
     var displayName: string;
 }