@canlooks/can-ui 0.0.21 → 0.0.23

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

@@ -1,7 +1,7 @@
-import { ReactNode, Ref } from 'react';
-import { ColorPropsValue, DIVProps, Id, Size } from '../../../types';
+import React, { ReactNode, Ref } from 'react';
+import { ColorPropsValue, DIVProps, Id, Size } from '../../types';
 export interface CheckboxBaseProps extends DIVProps {
-    inputProps?: JSX.IntrinsicElements['input'];
+    inputProps?: React.JSX.IntrinsicElements['input'];
     inputRef?: Ref<HTMLInputElement>;
     /** @private 内部使用 */
     _type: 'checkbox' | 'radio';
@@ -16,4 +16,4 @@ export interface CheckboxBaseProps extends DIVProps {
     checked?: boolean;
     onChange?(e: React.ChangeEvent<HTMLInputElement>): void;
 }
-export declare const CheckboxBase: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<CheckboxBaseProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>>;
+export declare const CheckboxBase: React.MemoExoticComponent<({ inputProps, inputRef, _type, size, color, label, value, indeterminate, disabled, readOnly, defaultChecked, checked, onChange, ...props }: CheckboxBaseProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/dist/esm/components/checkboxBase/checkboxBase.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-import { forwardRef, memo, useRef } from 'react';
+import { memo, useRef } from 'react';
 import { classnames, cloneRef, useControlled, useTouchRipple } from '../../utils';
 import { classes, useStyle } from './checkboxBase.style';
 import { CheckOutlined } from '@ant-design/icons';
 import { useCheckboxBaseGroupContext } from '../checkboxBaseGroup';
-export const CheckboxBase = memo(forwardRef(({ inputProps, inputRef, _type, size, color, label, value, indeterminate, disabled, readOnly, defaultChecked = false, checked, onChange, ...props }, ref) => {
+export const CheckboxBase = memo(({ inputProps, inputRef, _type, size, color, label, value, indeterminate, disabled, readOnly, defaultChecked = false, checked, onChange, ...props }) => {
     const context = useCheckboxBaseGroupContext();
     size ??= context.size || 'medium';
     color ??= context.color || 'primary';
@@ -32,7 +32,7 @@ export const CheckboxBase = memo(forwardRef(({ inputProps, inputRef, _type, size
         inputProps?.onKeyDown?.(e);
         e.key === 'Enter' && clickHandler(e);
     };
-    return (_jsxs("div", { ...props, ref: ref, css: useStyle({ color }), className: classnames(classes.root, props.className), onClick: clickHandler, "data-size": size, "data-checked": innerChecked.current && !indeterminate, "data-disabled": disabled, children: [_type === 'checkbox'
+    return (_jsxs("div", { ...props, css: useStyle({ color }), className: classnames(classes.root, props.className), onClick: clickHandler, "data-size": size, "data-checked": innerChecked.current && !indeterminate, "data-disabled": disabled, children: [_type === 'checkbox'
                 ? _jsx("div", { ref: checkboxRef, className: classes.checkbox, children: indeterminate
                         ? _jsx("div", { className: classes.indeterminate })
                         : innerChecked.current
@@ -42,4 +42,4 @@ export const CheckboxBase = memo(forwardRef(({ inputProps, inputRef, _type, size
                         ? _jsx("div", { className: classes.radioChecked })
                         : null }), !!label &&
                 _jsx("div", { className: classes.label, children: label }), _jsx("input", { type: _type, disabled: disabled, readOnly: readOnly, ...inputProps, ref: cloneRef(innerInputRef, inputRef), className: classnames(classes.input, inputProps?.className), onKeyDown: inputKeydown })] }));
-}));
+});

package/dist/esm/components/checkboxBase/checkboxBase.style.d.ts

@@ -1,10 +1,10 @@
 import { CheckboxBaseProps } from './checkboxBase';
 export declare const classes: {
-    checkbox: string;
-    radio: string;
     input: string;
     label: string;
     icon: string;
+    checkbox: string;
+    radio: string;
     radioChecked: string;
     indeterminate: string;
 } & {

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

@@ -1,7 +1,7 @@
 import { ReactElement } from 'react';
 import { FlexProps } from '../flex';
 import { CheckboxBaseProps } from '../checkboxBase';
-import { ColorPropsValue, Id, Obj, Size } from '../../../types';
+import { ColorPropsValue, Id, Obj, SelectableProps, Size } from '../../types';
 export interface ItemType extends Omit<CheckboxBaseProps, '_type'>, Obj {
 }
 export interface CheckboxBaseGroupCommonProps<I extends ItemType> extends Omit<FlexProps, 'defaultValue' | 'onChange'> {
@@ -10,19 +10,7 @@ export interface CheckboxBaseGroupCommonProps<I extends ItemType> extends Omit<F
     items?: I[];
     primaryKey?: keyof I;
 }
-export interface CheckboxBaseGroupSingleProps<I extends ItemType, V extends Id = Id> extends CheckboxBaseGroupCommonProps<I> {
-    multiple?: false;
-    defaultValue?: V;
-    value?: V;
-    onChange?(value: V): void;
-}
-export interface CheckboxBaseGroupMultipleProps<I extends ItemType, V extends Id = Id> extends CheckboxBaseGroupCommonProps<I> {
-    multiple: true;
-    defaultValue?: V[];
-    value?: V[];
-    onChange?(value: V[]): void;
-}
-export type CheckboxBaseGroupProps<I extends ItemType, V extends Id = Id> = CheckboxBaseGroupSingleProps<I, V> | CheckboxBaseGroupMultipleProps<I, V>;
+export type CheckboxBaseGroupProps<I extends ItemType, V extends Id = Id> = CheckboxBaseGroupCommonProps<I> & SelectableProps<V>;
 export declare function useCheckboxBaseGroupContext(): {
     size?: Size;
     color?: ColorPropsValue;

package/dist/esm/components/checkboxBaseGroup/checkboxBaseGroup.js

@@ -1,18 +1,19 @@
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
-import { Children, cloneElement, createContext, forwardRef, isValidElement, useContext } from 'react';
+import { Children, cloneElement, createContext, isValidElement, useContext } from 'react';
 import { Flex } from '../flex';
-import { classnames, isSelected, useControlledSelect } from '../../utils';
+import { classnames, isSelected } from '../../utils';
 import { classes } from './checkboxBaseGroup.style';
-import { Checkbox } from '../checkbox/checkbox';
+import { Checkbox } from '../checkbox';
 import { Radio } from '../radio';
-import { useTheme } from '../app';
+import { useTheme } from '../theme';
+import { useShallowSelection } from '../selectionContext';
 const checkboxBaseGroupContext = createContext({});
 export function useCheckboxBaseGroupContext() {
     return useContext(checkboxBaseGroupContext);
 }
-export const CheckboxBaseGroup = forwardRef(({ size, color, items, primaryKey = 'value', multiple, defaultValue, value, onChange, ...props }, ref) => {
+export const CheckboxBaseGroup = (({ size, color, items, primaryKey = 'value', multiple, defaultValue, value, onChange, ...props }) => {
     const { spacing } = useTheme();
-    const [innerValue, toggleSelected] = useControlledSelect({ multiple, defaultValue, value, onChange });
+    const [innerValue, toggleSelected] = useShallowSelection({ multiple, defaultValue, value, onChange });
     const renderItems = () => {
         if (items) {
             return items.map((p, i) => {
@@ -28,17 +29,18 @@ export const CheckboxBaseGroup = forwardRef(({ size, color, items, primaryKey =
             if (!isValidElement(c)) {
                 return c;
             }
-            const itemValue = c.props.value;
+            const { props } = c;
+            const itemValue = props.value;
             return cloneElement(c, {
-                size: c.props.size ?? size,
-                color: c.props.color ?? color,
+                size: props.size ?? size,
+                color: props.color ?? color,
                 checked: isSelected(itemValue, innerValue.current),
                 onChange: e => {
-                    c.props.onChange?.(e);
+                    props.onChange?.(e);
                     toggleSelected(itemValue);
                 }
             });
         });
     };
-    return (_jsx(Flex, { gap: spacing[8], ...props, ref: ref, className: classnames(classes.root, props.className), children: renderItems() }));
+    return (_jsx(Flex, { gap: spacing[8], ...props, className: classnames(classes.root, props.className), children: renderItems() }));
 });

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

@@ -1,8 +1,8 @@
 import { ReactElement } from 'react';
-import { DIVProps, DefineElement } from '../../../types';
+import { DIVProps, DefineElement } from '../../types';
 export interface ClickAwayProps extends DIVProps {
     container?: DefineElement<Element | Window>;
-    /** 传入addEventListener的事件类型，@default 'click' */
+    /** 传入addEventListener的事件类型，默认为`'click'` */
     eventType?: string;
     onClickAway?(e: MouseEvent): void;
     disabled?: boolean;
@@ -10,4 +10,4 @@ export interface ClickAwayProps extends DIVProps {
     /** 用于参考的目标元素，若为数组，需要点击数组外的元素才会触发clickAway */
     targets?: () => Element | null | (Element | null)[];
 }
-export declare const ClickAway: import("react").ForwardRefExoticComponent<Omit<ClickAwayProps, "ref"> & import("react").RefAttributes<any>>;
+export declare function ClickAway({ ref, container, eventType, onClickAway, disabled, children, targets, ...props }: ClickAwayProps): ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | undefined;

package/dist/esm/components/clickAway/clickAway.js

@@ -1,6 +1,6 @@
-import { cloneElement, forwardRef, isValidElement, useCallback, useEffect, useRef } from 'react';
+import { cloneElement, isValidElement, useCallback, useEffect, useRef } from 'react';
 import { cloneRef, isChildOf, toArray, useSync } from '../../utils';
-export const ClickAway = forwardRef(({ container = self, eventType = 'click', onClickAway, disabled, children, targets, ...props }, ref) => {
+export function ClickAway({ ref, container = self, eventType = 'click', onClickAway, disabled, children, targets, ...props }) {
     const syncOnClickAway = useSync(onClickAway);
     const childRef = useRef(null);
     const targetsArr = useRef([]);
@@ -33,4 +33,4 @@ export const ClickAway = forwardRef(({ container = self, eventType = 'click', on
             ref: clonedRef
         })
         : children;
-});
+}

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

@@ -1,9 +1,9 @@
-import { ReactNode, Ref } from 'react';
+import React, { ReactNode, Ref } from 'react';
 import { PopperProps, PopperRef } from '../popper';
-import { ColorPropsValue, DIVProps, Size } from '../../../types';
+import { ColorPropsValue, DIVProps, Size } from '../../types';
 import Color from 'color';
 export interface ColorPickerProps extends Omit<DIVProps, 'defaultValue' | 'onChange'> {
-    inputProps?: JSX.IntrinsicElements['input'];
+    inputProps?: React.JSX.IntrinsicElements['input'];
     inputRef?: Ref<HTMLInputElement>;
     popperProps?: PopperProps;
     popperRef?: Ref<PopperRef>;
@@ -18,4 +18,4 @@ export interface ColorPickerProps extends Omit<DIVProps, 'defaultValue' | 'onCha
     value?: Color;
     onChange?(color: Color): void;
 }
-export declare const ColorPicker: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<ColorPickerProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>>;
+export declare const ColorPicker: React.MemoExoticComponent<({ inputProps, inputRef, popperProps, popperRef, size, shape, label, presets, defaultOpen, open, onOpenChange, defaultValue, value, onChange, ...props }: ColorPickerProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/dist/esm/components/colorPicker/colorPicker.js

@@ -1,13 +1,13 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-import { forwardRef, memo, useMemo } from 'react';
+import { memo, useMemo } from 'react';
 import { Popper } from '../popper';
 import { InputBase } from '../inputBase';
 import { classes, colorPickerPopperStyle, style } from './colorPicker.style';
 import { classnames, cloneRef, colorTransfer, useControlled, useTouchRipple } from '../../utils';
-import { useTheme } from '../app';
+import { useTheme } from '../theme';
 import { Palette } from '../palette';
 import Color from 'color';
-export const ColorPicker = memo(forwardRef(({ inputProps, inputRef, popperProps, popperRef, size, shape = 'square', label = '自定义', presets, defaultOpen, open, onOpenChange, defaultValue, value, onChange, ...props }, ref) => {
+export const ColorPicker = memo(({ inputProps, inputRef, popperProps, popperRef, size, shape = 'square', label = '自定义', presets, defaultOpen, open, onOpenChange, defaultValue, value, onChange, ...props }) => {
     const theme = useTheme();
     size ??= theme.size;
     const [innerOpen, setInnerOpen] = useControlled(defaultOpen, open, onOpenChange);
@@ -15,13 +15,13 @@ export const ColorPicker = memo(forwardRef(({ inputProps, inputRef, popperProps,
         popperProps?.onOpenChange?.(open);
         setInnerOpen(open);
     };
-    const [innerValue, setInnerValue] = useControlled(defaultValue ?? Color(theme.colors.primary, 'hex'), value, onChange);
-    return (_jsxs("div", { ...props, ref: ref, css: style, className: classnames(classes.root, props.className), "data-size": size, "data-shape": shape, children: [presets?.map((color, i) => {
+    const [innerValue, setInnerValue] = useControlled(defaultValue ?? Color(theme.colors.primary.main, 'hex'), value, onChange);
+    return (_jsxs("div", { ...props, css: style, className: classnames(classes.root, props.className), "data-size": size, "data-shape": shape, children: [presets?.map((color, i) => {
                 const colorInstance = Color(typeof color === 'string' ? colorTransfer(color, theme) : color);
                 return (_jsx(BlockItem, { selected: colorInstance.hex() === innerValue.current.hex(), color: Color(color), onClick: () => setInnerValue(Color(color, 'hex')) }, i));
             }), _jsx(Popper, { css: colorPickerPopperStyle, open: innerOpen.current, trigger: ['click', 'enter'], placement: "bottomLeft", content: _jsx(Palette, { value: innerValue.current, onChange: setInnerValue }), ...popperProps, popperRef: popperRef, onOpenChange: openChangeHandler, children: _jsx(InputBase, { className: classes.inputBase, size: size, shape: shape === 'circular' ? 'rounded' : shape, children: ({ ref, ...rest }) => _jsxs(_Fragment, { children: [_jsx(BlockItem, { color: innerValue.current }), !!label &&
                                 _jsx("div", { className: classes.label, children: label }), _jsx("input", { ...rest, ...inputProps, ref: cloneRef(ref, inputRef), "data-hidden": "true" })] }) }) })] }));
-}));
+});
 function BlockItem({ color, onClick, selected }) {
     const light = useMemo(() => color.luminosity() >= .8, [color]);
     const colorObject = useMemo(() => ({

package/dist/esm/components/colorPicker/colorPicker.style.js

@@ -37,7 +37,7 @@ export const style = defineCss(({ spacing, borderRadius, divider, background })
         overflow: hidden;
         cursor: pointer;
         position: relative;
-        ${getTranparentBackground(background.body, background.card)}
+        ${getTranparentBackground(background.body, background.content)}
         background-size: 50% 50%;
 
         .${classes.blockColor} {

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

@@ -4,4 +4,4 @@ export interface ContextMenuProps extends Omit<BubbleProps, 'onClick'> {
     items?: ItemPropType[];
     onClick?(item: ItemPropType): void;
 }
-export declare const ContextMenu: import("react").ForwardRefExoticComponent<Omit<ContextMenuProps, "ref"> & import("react").RefAttributes<unknown>>;
+export declare function ContextMenu({ items, onClick, ...props }: ContextMenuProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/esm/components/contextMenu/contextMenu.js

@@ -1,13 +1,12 @@
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
-import { forwardRef } from 'react';
 import { Bubble } from '../bubble';
 import { MenuItem } from '../menuItem';
-export const ContextMenu = forwardRef(({ items, onClick, ...props }, ref) => {
+export function ContextMenu({ items, onClick, ...props }) {
     const renderItems = (items) => {
         return items?.map((p, i) => _jsx(MenuItem, { ...p, onClick: e => {
                 p.onClick?.(e);
                 onClick?.(p);
             }, children: renderItems(p.children) }, p.value ?? i));
     };
-    return (_jsx(Bubble, { placement: "bottomRight", ...props, ref: ref, trigger: "contextMenu", showArrow: false, content: props.content ?? renderItems(items) }));
-});
+    return (_jsx(Bubble, { placement: "bottomRight", showArrow: false, ...props, trigger: "contextMenu", content: props.content ?? renderItems(items) }));
+}

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

@@ -1,4 +1,4 @@
-import { Size } from '../../../types';
+import { Size } from '../../types';
 import { ButtonProps } from '../button';
 import { InputProps } from '../input';
 import { FlexProps } from '../flex';
@@ -15,4 +15,4 @@ export interface CounterProps extends Omit<FlexProps, 'defaultValue' | 'onChange
     increaseProps?: ButtonProps;
     inputProps?: InputProps;
 }
-export declare const Counter: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<CounterProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>>;
+export declare const Counter: import("react").MemoExoticComponent<({ size, min, max, step, precision, defaultValue, value, onChange, decreaseProps, increaseProps, inputProps, ...props }: CounterProps) => import("@emotion/react/jsx-runtime").JSX.Element>;

package/dist/esm/components/counter/counter.js

@@ -1,12 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-import { forwardRef, memo } from 'react';
+import { memo } from 'react';
 import { classes, style } from './counter.style';
 import { classnames, useControlled } from '../../utils';
 import { Button } from '../button';
 import { MinusOutlined, PlusOutlined } from '@ant-design/icons';
 import { Input } from '../input';
 import { Flex } from '../flex';
-export const Counter = memo(forwardRef(({ size, min = -Infinity, max = Infinity, step = 1, precision = 0, defaultValue = 0, value, onChange, decreaseProps, increaseProps, inputProps, ...props }, ref) => {
+export const Counter = memo(({ size, min = -Infinity, max = Infinity, step = 1, precision = 0, defaultValue = 0, value, onChange, decreaseProps, increaseProps, inputProps, ...props }) => {
     const [innerValue, setInnerValue] = useControlled(defaultValue, value, onChange);
     const commonButtonProps = {
         size,
@@ -16,7 +16,7 @@ export const Counter = memo(forwardRef(({ size, min = -Infinity, max = Infinity,
     const clickHandler = (dir) => {
         setInnerValue(Math.max(min, Math.min(max, innerValue.current + dir * step)));
     };
-    return (_jsxs(Flex, { compact: true, ...props, ref: ref, css: style, className: classnames(classes.root, props.className), children: [_jsx(Button, { disabled: innerValue.current <= min, ...commonButtonProps, ...decreaseProps, onClick: e => {
+    return (_jsxs(Flex, { compact: true, ...props, css: style, className: classnames(classes.root, props.className), children: [_jsx(Button, { disabled: innerValue.current <= min, ...commonButtonProps, ...decreaseProps, onClick: e => {
                     decreaseProps?.onClick?.(e);
                     clickHandler(-1);
                 }, children: _jsx(MinusOutlined, {}) }), _jsx(Input, { type: "number", widthAdaptable: true, size: size, min: min, max: max, step: step, precision: precision, ...inputProps, className: classnames(classes.input, inputProps?.className), value: innerValue.current, onChange: e => {
@@ -26,4 +26,4 @@ export const Counter = memo(forwardRef(({ size, min = -Infinity, max = Infinity,
                     increaseProps?.onClick?.(e);
                     clickHandler(1);
                 }, children: _jsx(PlusOutlined, {}) })] }));
-}));
+});

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

@@ -1,5 +1,5 @@
 import { ReactElement, ReactNode, Ref } from 'react';
-import { DIVProps, Id, Obj } from '../../../types';
+import { DIVProps, Id, Obj } from '../../types';
 import { ColumnType, DataGridBaseProps, DataGridMultipleProps, DataGridSingleProps, OrderType, RowType } from '../dataGrid';
 import { FormItemProps, FormProps, FormRef, FormValue } from '../form';
 import { CurdFilter, CurdFilterProps } from './curdFilter';
@@ -8,7 +8,7 @@ import { ButtonProps } from '../button';
 import { CurdDialogProps } from './curdDialog';
 import { BubbleConfirmProps } from '../bubbleConfirm';
 export type CurdFormItemProps<I = any> = FormItemProps<I> & {
-    /** 对filter或form内的字段单独排序，数字越大越靠后，@default 0 */
+    /** 对filter或form内的字段单独排序，数字越大越靠后，默认为`0` */
     order?: number;
 } & Obj;
 export type CurdFormItemType<I = any> = CurdFormItemProps<I> | ReactElement | true;
@@ -69,13 +69,13 @@ export interface CurdBaseProps<R extends RowType, F extends FormValue> extends D
     renderExtraControl?(row: R): ReactNode;
     /** 用于做每行数据标题的字段 */
     titleKey?: keyof R;
-    /** 数据的名称，@default "数据" */
+    /** 数据的名称，默认为`"数据"` */
     dataName?: ReactNode;
-    /** create操作的名称，@default "添加" */
+    /** create操作的名称，默认为`"添加"` */
     createName?: ReactNode;
-    /** update操作的名称，@default "编辑" */
+    /** update操作的名称，默认为`"编辑"` */
     updateName?: ReactNode;
-    /** delete操作的名称，@default "删除" */
+    /** delete操作的名称，默认为`"删除"` */
     deleteName?: ReactNode;
     /** create操作完成后触发，若返回promise则会等待promise返回再触发loadRows */
     onCreate?(formValue: F): any;
@@ -87,13 +87,13 @@ export interface CurdBaseProps<R extends RowType, F extends FormValue> extends D
     formProps?: FormProps<F>;
     formRef?: Ref<FormRef<F>>;
 }
-interface CurdSingleProps<R extends RowType, V extends Id = Id, F extends FormValue = FormValue> extends Omit<DataGridSingleProps<R, V>, 'columns'>, CurdBaseProps<R, F> {
+interface CurdSingleProps<R extends RowType, F extends FormValue = FormValue, V extends Id = Id> extends Omit<DataGridSingleProps<R, V>, 'columns'>, CurdBaseProps<R, F> {
 }
-interface CurdMultipleProps<R extends RowType, V extends Id = Id, F extends FormValue = FormValue> extends Omit<DataGridMultipleProps<R, V>, 'columns'>, CurdBaseProps<R, F> {
+interface CurdMultipleProps<R extends RowType, F extends FormValue = FormValue, V extends Id = Id> extends Omit<DataGridMultipleProps<R, V>, 'columns'>, CurdBaseProps<R, F> {
 }
-export type CurdProps<R extends RowType, V extends Id = Id, F extends FormValue = FormValue> = CurdSingleProps<R, V, F> | CurdMultipleProps<R, V, F>;
+export type CurdProps<R extends RowType, F extends FormValue = FormValue, V extends Id = Id> = CurdSingleProps<R, F, V> | CurdMultipleProps<R, F, V>;
 export declare const Curd: {
-    <R extends RowType, V extends Id = Id, F extends FormValue = FormValue>(props: CurdProps<R, V, F>): ReactElement;
+    <R extends RowType, F extends FormValue = FormValue, V extends Id = Id>(props: CurdProps<R, F, V>): ReactElement;
     Filter: typeof CurdFilter;
     CONTROL_COLUMN: symbol;
 };

package/dist/esm/components/curd/curd.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
-import { forwardRef, memo, useCallback, useEffect, useMemo, useRef } from 'react';
+import { memo, useCallback, useEffect, useMemo, useRef } from 'react';
 import { DataGrid } from '../dataGrid';
 import { CurdFilter } from './curdFilter';
 import { classes, style } from './curd.style';
@@ -15,7 +15,7 @@ import { CurdDialog } from './curdDialog';
 import { useAppContext } from '../app';
 import { BubbleConfirm } from '../bubbleConfirm';
 import { useSelectionContext } from '../selectionContext';
-export const Curd = memo(forwardRef((props, ref) => {
+export const Curd = memo((props) => {
     const { wrapperProps, wrapperRef, variant = 'standard', loadRows, columns, toolbarLeft, toolbarRight, reloadable = true, onReload, resizable = true, columnConfigurable = true, filterProps, filterRef, initialFilterValue, onFilter, renderFilter, copyable, creatable = true, updatable = true, deletable = true, createButtonProps, updateButtonProps, deleteButtonProps, deleteConfirmProps, controlColumnTitle = '操作', renderExtraControl, titleKey, dataName = '', createName = '添加', updateName = '编辑', deleteName = '删除', onCreate, onUpdate, onDelete, postData, dialogProps, formProps, formRef, onChange, ...dataGridProps } = props;
     /**
      * -------------------------------------------------------------
@@ -86,13 +86,13 @@ export const Curd = memo(forwardRef((props, ref) => {
      * -------------------------------------------------------------
      * 行数据
      */
-    const { setInnerOptions } = useSelectionContext();
+    const { setOptions } = useSelectionContext();
     const [innerRows, _setInnerRows] = useDerivedState(props.rows);
     useEffect(() => {
-        innerRows.current?.length && setInnerOptions?.(innerRows.current);
+        innerRows.current?.length && setOptions?.(innerRows.current);
     }, []);
     const setInnerRows = (data) => {
-        setInnerOptions?.(data);
+        setOptions?.(data);
         _setInnerRows(data);
     };
     const [innerTotal, setInnerTotal] = useDerivedState(props.paginationProps?.total || 0);
@@ -128,7 +128,7 @@ export const Curd = memo(forwardRef((props, ref) => {
      * 弹窗与曾删改部分
      */
     const curdDialogRef = useRef(null);
-    const activeRow = useRef();
+    const activeRow = useRef(void 0);
     const createHandler = (e) => {
         createButtonProps?.onClick?.(e);
         activeRow.current = void 0;
@@ -171,14 +171,14 @@ export const Curd = memo(forwardRef((props, ref) => {
                                     _jsxs(Button, { prefix: _jsx(PlusOutlined, {}), ...createButtonProps, onClick: createHandler, children: [createName, dataName] }), toolbarLeft] }), _jsxs("div", { className: classes.toolbarRight, children: [!!toolbarRight &&
                                     _jsxs(_Fragment, { children: [toolbarRight, _jsx(Divider, { className: classes.divider, orientation: "vertical" })] }), reloadable &&
                                     _jsx(Tooltip, { title: "\u5237\u65B0", children: _jsx(Button, { shape: "circular", variant: "text", color: "text", prefix: _jsx(ReloadOutlined, {}), loading: innerLoading.current, onClick: reloadHandler }) }), resizable &&
-                                    _jsx(CurdResizable, { innerSize: innerSize.current, setInnerSize: setInnerSize }), !!columnConfigurable &&
-                                    _jsx(CurdColumnConfig, { columns: orderedColumns, innerVisible: innerVisible.current, setInnerVisible: setInnerVisible, setInnerOrder: setInnerOrder })] })] }), _jsx("div", { className: classes.card, children: _jsx(DataGrid, { ...dataGridProps, ref: ref, columns: actualColumns, tableProps: {
+                                    _jsx(CurdResizable, { innerSize: innerSize.current, setInnerSize: setInnerSize }), columnConfigurable &&
+                                    _jsx(CurdColumnConfig, { columns: orderedColumns, innerVisible: innerVisible.current, setInnerVisible: setInnerVisible, setInnerOrder: setInnerOrder })] })] }), _jsx("div", { className: classes.card, children: _jsx(DataGrid, { ...dataGridProps, columns: actualColumns, tableProps: {
                         ...props.tableProps,
                         ...resizable && { size: innerSize.current }
                     }, loading: innerLoading.current, rows: innerRows.current, paginatable: !loadRows && props.paginatable, renderPagination: loadRows && props.paginatable !== false
                         ? () => _jsx(Pagination, { ...props.paginationProps, total: innerTotal.current, page: innerPage.current, onPageChange: setInnerPage, pageSize: innerPageSize.current, onPageSizeChange: setInnerPageSize })
                         : props.renderPagination, orderColumn: innerOrderColumn.current, orderType: innerOrderType.current, onOrderChange: orderChangeHandler }) }), (creatable || updatable) &&
                 _jsx(CurdDialog, { ...dialogProps, ref: curdDialogRef, onFinish: finishHandler, curdProps: props })] }));
-}));
+});
 Curd.Filter = CurdFilter;
 Curd.CONTROL_COLUMN = Symbol('control-column');

package/dist/esm/components/curd/curd.style.d.ts

@@ -1,8 +1,7 @@
 export declare const classes: {
+    filter: string;
     divider: string;
-    card: string;
     toolbar: string;
-    filter: string;
     filterGridContainer: string;
     filterGrid: string;
     filterItem: string;
@@ -11,6 +10,7 @@ export declare const classes: {
     filteredTitle: string;
     toolbarLeft: string;
     toolbarRight: string;
+    card: string;
     control: string;
     dialogTitle: string;
     copyButton: string;

package/dist/esm/components/curd/curd.style.js

@@ -76,7 +76,7 @@ export const style = defineCss(({ spacing, text, background, borderRadius }) =>
 
     &[data-variant=standard] {
         .${classes.card} {
-            background-color: ${background.card};
+            background-color: ${background.content};
             padding: ${spacing[8]}px;
         }
     }

package/dist/esm/components/curd/curdColumnConfig.d.ts

@@ -1,7 +1,7 @@
 import { Dispatch, ReactElement, SetStateAction } from 'react';
 import { CurdColumn } from './curd';
 import { RowType } from '../dataGrid';
-import { Id } from '../../../types';
+import { Id } from '../../types';
 type CurdColumnConfigProps<R extends RowType> = {
     columns?: CurdColumn<R>[];
     innerVisible: Id[];

package/dist/esm/components/curd/curdDialog.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-import { forwardRef, memo, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
+import { memo, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import { Dialog } from '../dialog';
 import { Form, FormItem } from '../form';
 import { Curd } from './curd';
@@ -9,17 +9,17 @@ import { Button } from '../button';
 import { CopyOutlined } from '@ant-design/icons';
 import { classes, dialogStyle } from './curd.style';
 import { PickerDialog } from '../pickerDialog';
-export const CurdDialog = memo(forwardRef(({ onFinish, 
+export const CurdDialog = memo(({ ref, onFinish, 
 // 继承来的属性
-curdProps, ...props }, ref) => {
+curdProps, ...props }) => {
     const { columns, postData, copyable, titleKey, formProps, formRef, dataName = '', createName = '添加', updateName = '编辑' } = curdProps;
     /**
      * ----------------------------------------------------------------
      * ref与promise部分
      */
     const innerFormRef = useRef(null);
-    const resolveFn = useRef();
-    const rejectFn = useRef();
+    const resolveFn = useRef(void 0);
+    const rejectFn = useRef(void 0);
     const [innerOpen, setInnerOpen] = useControlled(props.defaultOpen, props.open);
     const closeHandler = (reason) => {
         if (reason === 'confirmed') {
@@ -92,4 +92,4 @@ curdProps, ...props }, ref) => {
             : _jsxs("div", { className: classes.dialogTitle, children: [_jsxs("span", { children: [createName, dataName] }), copyable &&
                         _jsxs(Button, { variant: "plain", prefix: _jsx(CopyOutlined, {}), onClick: () => pickerDialogRef.current.open(), children: ["\u4ECE\u5DF2\u6709", dataName || '数据', "\u590D\u5236"] })] }), ...props, open: innerOpen.current, onClose: closeHandler, onConfirm: confirmHandler, confirmLoading: innerLoading.current, children: [_jsx(Loading, { loading: transforming.current, children: _jsx(Form, { labelWidth: "20%", ...formProps, ref: cloneRef(formRef, innerFormRef), onFinish: finishHandler, children: renderedFormItems }) }), copyable &&
                 _jsx(PickerDialog, { ref: pickerDialogRef, onToggle: copiedHandler, children: _jsx(Curd, { ...curdProps, variant: "embeded", copyable: false, creatable: false, updatable: false, deletable: false }) })] }));
-}));
+});

package/dist/esm/components/curd/curdFilter.d.ts

@@ -6,7 +6,7 @@ import { RowType } from '../dataGrid';
 export interface CurdFilterProps<R extends RowType, F extends FormValue = FormValue> extends Omit<FormProps<F>, 'variant'>, Pick<CurdBaseProps<R, F>, 'columns'> {
     /** 筛选项是否可收起与展开，若开启此功能，需保证每项的高度一致，否则可能出现样式问题 */
     expandable?: boolean;
-    /** 是否显示"筛选"按钮，若为false，则每次触发onChange的同时会触发onFilter，若为true，则onFilter只会在点击按钮时触发，@default false */
+    /** 是否显示"筛选"按钮，若为false，则每次触发onChange的同时会触发onFilter，若为true，则onFilter只会在点击按钮时触发，默认为false */
     showButton?: boolean;
     /** 是否显示已生效的筛选条件 */
     renderConditions?(filterValue: F, formInstance: FormRef<F> | null): ReactNode;

package/dist/esm/components/curd/curdFilter.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@emotion/react/jsx-runtime";
-import { forwardRef, isValidElement, memo, useMemo, useRef, useState } from 'react';
+import { isValidElement, memo, useMemo, useRef, useState } from 'react';
 import { Form, FormItem } from '../form';
 import { classes } from './curd.style';
 import { classnames, cloneRef, columnsToFilterItem } from '../../utils';
@@ -7,8 +7,8 @@ import { Grid } from '../grid';
 import { Button } from '../button';
 import { DownOutlined, FilterOutlined } from '@ant-design/icons';
 import { Collapse } from '../transitionBase';
-import { useTheme } from '../app';
-export const CurdFilter = memo(forwardRef(({ columns, expandable, showButton, renderConditions, buttonProps, onFilter, columnCount = 3, ...props }, ref) => {
+import { useTheme } from '../theme';
+export const CurdFilter = memo(({ ref, columns, expandable, showButton, renderConditions, buttonProps, onFilter, columnCount = 3, ...props }) => {
     const { spacing } = useTheme();
     const items = useMemo(() => {
         return columnsToFilterItem(columns);
@@ -51,4 +51,4 @@ export const CurdFilter = memo(forwardRef(({ columns, expandable, showButton, re
                                             _jsx(Button, { variant: "text", suffix: _jsx(DownOutlined, { style: { rotate: expanded ? '180deg' : void 0 } }), onClick: () => setExpanded(o => !o), children: expanded ? '收起' : '展开' }), showButton &&
                                             _jsx(Button, { prefix: _jsx(FilterOutlined, {}), variant: "outlined", ...buttonProps, onClick: clickHandler, children: buttonProps?.children ?? '筛选' })] })] }) }), !!renderConditions &&
                 _jsxs("div", { className: classes.filtered, children: [_jsx("div", { className: classes.filteredTitle, children: "\u5DF2\u7B5B\u9009\uFF1A" }), renderConditions(filteredConditions, formRef.current)] })] }));
-}));
+});

package/dist/esm/components/curd/curdResizable.d.ts

@@ -1,5 +1,5 @@
 import { Dispatch, SetStateAction } from 'react';
-import { Size } from '../../../types';
+import { Size } from '../../types';
 export declare const CurdResizable: import("react").MemoExoticComponent<({ innerSize, setInnerSize }: {
     innerSize: Size;
     setInnerSize: Dispatch<SetStateAction<Size>>;

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

@@ -1,5 +1,5 @@
-import { ReactElement, ReactNode } from 'react';
-import { DIVProps, Id, Obj } from '../../../types';
+import React, { ReactElement, ReactNode } from 'react';
+import { DIVProps, Id, Obj } from '../../types';
 import { FieldPath } from '../../utils';
 import { TableProps } from '../table';
 import { PaginationProps } from '../pagination';
@@ -7,7 +7,7 @@ import { SelectionContextProps } from '../selectionContext';
 import { CheckboxProps } from '../checkbox';
 import { RadioProps } from '../radio';
 export type RowType = Obj;
-export interface ColumnType<R extends RowType = RowType> extends Omit<JSX.IntrinsicElements['td'], 'key' | 'ref' | 'title' | 'children'>, Omit<JSX.IntrinsicElements['th'], 'key' | 'ref' | 'title' | 'children'> {
+export interface ColumnType<R extends RowType = RowType> extends Omit<React.JSX.IntrinsicElements['td'], 'key' | 'ref' | 'title' | 'children'>, Omit<React.JSX.IntrinsicElements['th'], 'key' | 'ref' | 'title' | 'children'> {
     title?: ReactNode;
     /** 若不指定key，默认使用{@link field}作为key */
     key?: string | number;
@@ -27,7 +27,7 @@ export interface ColumnType<R extends RowType = RowType> extends Omit<JSX.Intrin
     _negativeRowSpan?: number;
 }
 type DataGridSharedProps<R extends RowType> = {
-    /** 数据的主键名，@default "id" */
+    /** 数据的主键名，默认为"id" */
     primaryKey?: keyof R;
     /**
      * 当数据中存在该字段，则会渲染可展开的子行；
@@ -36,8 +36,8 @@ type DataGridSharedProps<R extends RowType> = {
     childrenKey?: keyof R;
     indent?: number;
     renderExpandIcon?(key: Id, isExpand: boolean, expanded: Id[]): ReactNode;
-    rowProps?(row: R, index: number, rows: R[]): JSX.IntrinsicElements['tr'];
-    /** 点击行时是否触发选中，@default true */
+    rowProps?(row: R, index: number, rows: R[]): React.JSX.IntrinsicElements['tr'];
+    /** 点击行时是否触发选中，默认为true */
     clickRowToSelect?: boolean;
     selectorProps?(row: R, index: number, rows: R[]): CheckboxProps | RadioProps;
 };
@@ -55,17 +55,17 @@ export interface DataGridBaseProps<R extends RowType> extends DataGridSharedProp
      * 行之间的关系
      * @enum {"dependent"}：会自动判断子父行的选中关系。
      * @enum {"standalone"}：所有行相互独立
-     * @default "dependent"
+     * 默认为"dependent"
      */
     relation?: SelectionContextProps<R>['relation'];
     integration?: SelectionContextProps<R>['integration'];
-    /** 是否允许全选，@default true */
+    /** 是否允许全选，默认为true */
     allowSelectAll?: boolean;
     defaultExpanded?: Id[];
     expanded?: Id[];
     onExpandedChange?(expanded: Id[], key: Id, isExpand: boolean): void;
     loading?: boolean;
-    /** 是否内置翻页，@default true */
+    /** 是否内置翻页，默认为true */
     paginatable?: boolean;
     paginationProps?: PaginationProps;
     renderPagination?(props: PaginationProps): ReactNode;
@@ -107,8 +107,8 @@ export declare function useDataGridContext(): {
      */
     childrenKey?: keyof RowType | undefined;
     renderExpandIcon?(key: Id, isExpand: boolean, expanded: Id[]): ReactNode;
-    rowProps?(row: RowType, index: number, rows: RowType[]): JSX.IntrinsicElements["tr"];
-    /** 点击行时是否触发选中，@default true */
+    rowProps?(row: RowType, index: number, rows: RowType[]): React.JSX.IntrinsicElements["tr"];
+    /** 点击行时是否触发选中，默认为true */
     clickRowToSelect?: boolean;
     selectorProps?(row: RowType, index: number, rows: RowType[]): CheckboxProps | RadioProps;
     primaryKey: keyof RowType;