@canlooks/can-ui 0.0.53 → 0.0.55

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

@@ -24,7 +24,13 @@ export type LoadRowsReturn<R extends RowType> = {
     total: number;
 };
 type EachRowType<R extends RowType, T> = T | ((row: R) => T);
-export interface CurdBaseProps<R extends RowType, F extends FormValue> extends DataGridBaseProps<R> {
+export type CurdRef<R extends RowType = RowType, F extends FormValue = FormValue> = {
+    openCreateDialog(initialValue?: F): Promise<F> | undefined;
+    selectSingle(): Promise<R> | undefined;
+    selectMultiple(selected?: Id[]): Promise<Id[]> | undefined;
+};
+export interface CurdBaseProps<R extends RowType, F extends FormValue> extends Omit<DataGridBaseProps<R>, 'ref'> {
+    ref?: Ref<CurdRef<R, F>>;
     /** 默认属性会传递给DataGrid组件，外层包裹元素的属性使用wrapperProps */
     wrapperProps?: DivProps;
     wrapperRef?: Ref<HTMLDivElement>;
@@ -82,14 +88,14 @@ export interface CurdBaseProps<R extends RowType, F extends FormValue> extends D
     onUpdate?(formValue: F, row: R): any;
     onDelete?(row: R): any;
     /** 行数据转换为表单值的方法，若不指定，行数据会直接填入表单 */
-    postData?(row: R): F | Promise<F>;
+    rowToForm?(row: R): F | Promise<F>;
     dialogProps?: CurdDialogProps<R, F>;
     formProps?: FormProps<F>;
     formRef?: Ref<FormRef<F>>;
 }
-interface CurdSingleProps<R extends RowType, F extends FormValue = FormValue, V extends Id = Id> 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>, 'ref' | '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> {
+interface CurdMultipleProps<R extends RowType, F extends FormValue = FormValue, V extends Id = Id> extends Omit<DataGridMultipleProps<R, V>, 'ref' | 'columns'>, CurdBaseProps<R, 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: {

package/dist/cjs/components/curd/curd.js

@@ -23,7 +23,22 @@ const faPenToSquare_1 = require("@fortawesome/free-regular-svg-icons/faPenToSqua
 const faPlus_1 = require("@fortawesome/free-solid-svg-icons/faPlus");
 const faRotateRight_1 = require("@fortawesome/free-solid-svg-icons/faRotateRight");
 exports.Curd = (0, react_1.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;
+    const { ref, 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, rowToForm, dialogProps, formProps, formRef, onChange, ...dataGridProps } = props;
+    /**
+     * -------------------------------------------------------------
+     * ref
+     */
+    (0, react_1.useImperativeHandle)(ref, () => ({
+        openCreateDialog(initialValue) {
+            return curdDialogRef.current?.open(void 0, initialValue);
+        },
+        selectSingle() {
+            return curdDialogRef.current?.selectSingle();
+        },
+        selectMultiple(selected) {
+            return curdDialogRef.current?.selectMultiple(selected);
+        }
+    }));
     /**
      * -------------------------------------------------------------
      * 筛选部分

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

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.dialogStyle = exports.style = exports.classes = void 0;
 const react_1 = require("@emotion/react");
 const utils_1 = require("../../utils");
+const button_style_1 = require("../button/button.style");
 exports.classes = (0, utils_1.defineInnerClasses)('curd', [
     'filter',
     'filterGridContainer',
@@ -94,5 +95,9 @@ exports.dialogStyle = (0, utils_1.defineCss)(({ spacing }) => (0, react_1.css) `
         display: flex;
         align-items: center;
         gap: ${spacing[8]}px;
+        
+        .${button_style_1.classes.root} {
+            font-size: 1rem;
+        }
     }
 `);

package/dist/cjs/components/curd/curdDialog.d.ts

@@ -3,8 +3,11 @@ import { DialogProps } from '../dialog';
 import { RowType } from '../dataGrid';
 import { FormValue } from '../form';
 import { CurdBaseProps } from './curd';
+import { Id } from '../../types';
 export type CurdDialogRef<R extends RowType = RowType, F extends FormValue = FormValue> = {
-    open(activeRow?: R): Promise<F>;
+    open(activeRow?: R, initialFormValue?: F): Promise<F>;
+    selectSingle(): Promise<R>;
+    selectMultiple(selected?: Id[]): Promise<Id[]>;
 };
 export interface CurdDialogProps<R extends RowType, F extends FormValue = FormValue> extends Omit<DialogProps, 'ref'> {
     ref?: Ref<CurdDialogRef<R, F>>;

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

@@ -14,35 +14,49 @@ const curd_style_1 = require("./curd.style");
 const pickerDialog_1 = require("../pickerDialog");
 const __1 = require("../..");
 const faCopy_1 = require("@fortawesome/free-regular-svg-icons/faCopy");
-exports.CurdDialog = (0, react_2.memo)(({ ref, onFinish, 
-// 继承来的属性
-curdProps, ...props }) => {
-    const { columns, postData, copyable, titleKey, formProps, formRef, dataName = '', createName = '添加', updateName = '编辑' } = curdProps;
+exports.CurdDialog = (0, react_2.memo)(({ ref, onFinish, curdProps, ...props }) => {
+    const { columns, rowToForm, copyable, titleKey, formProps, formRef, dataName = '', createName = '添加', updateName = '编辑' } = curdProps;
     /**
      * ----------------------------------------------------------------
      * ref与promise部分
      */
     const innerFormRef = (0, react_2.useRef)(null);
-    const resolvers = (0, react_2.useRef)(void 0);
+    const openResolvers = (0, react_2.useRef)(void 0);
     const [innerOpen, setInnerOpen] = (0, utils_1.useControlled)(props.defaultOpen, props.open);
     const closeHandler = (reason) => {
         if (reason === 'confirmed') {
             return;
         }
         props.onClose?.(reason);
-        resolvers.current?.reject({
+        openResolvers.current?.reject({
             type: 'canceled',
             value: innerFormRef.current.getFormValue()
         });
         setInnerOpen(false);
     };
+    const [selectMode, setSelectMode] = (0, react_2.useState)('single');
+    const selectResolvers = (0, react_2.useRef)(void 0);
     (0, react_2.useImperativeHandle)(ref, () => ({
-        open(row) {
+        open(row, initialFormValue) {
             innerFormRef.current?.resetForm();
-            setInnerOpen(true);
+            suppressTransform.current = !!initialFormValue;
+            initialFormValue && innerFormRef.current?.setFormValue(initialFormValue);
             setActiveRow(row);
-            const { promise } = resolvers.current = Promise.withResolvers();
+            setInnerOpen(true);
+            const { promise } = openResolvers.current = Promise.withResolvers();
+            return promise;
+        },
+        selectSingle() {
+            isCopying.current = false;
+            setSelectMode('single');
+            pickerDialogRef.current.open().then();
+            const { promise } = selectResolvers.current = Promise.withResolvers();
             return promise;
+        },
+        selectMultiple(selected) {
+            isCopying.current = false;
+            setSelectMode('multiple');
+            return pickerDialogRef.current.open(selected);
         }
     }));
     /**
@@ -50,13 +64,14 @@ curdProps, ...props }) => {
      * 表单项
      */
     const [activeRow, setActiveRow] = (0, react_2.useState)();
+    const suppressTransform = (0, react_2.useRef)(false);
     const [transforming, setFormValue] = (0, utils_1.useLoading)(async (row) => {
-        const formValue = postData && row ? await postData(row) : row;
+        const formValue = rowToForm && row ? await rowToForm(row) : row;
         formValue && innerFormRef.current?.setFormValue(formValue);
     });
     (0, react_2.useEffect)(() => {
-        innerOpen.current && setFormValue(activeRow);
-    }, [innerOpen.current]); // 依赖innerOpen而不依赖activeRow的原因是，有可能连续两次打开的activeRow是相同的
+        innerOpen.current && !suppressTransform.current && setFormValue(activeRow);
+    }, [innerOpen.current, activeRow]);
     const renderedFormItems = (0, react_2.useMemo)(() => {
         return (0, utils_1.columnsToFormItem)(columns, activeRow)?.map(col => {
             if ((0, react_2.isValidElement)(col)) {
@@ -75,7 +90,7 @@ curdProps, ...props }) => {
     };
     const [innerLoading, finishHandler] = (0, utils_1.useLoading)(async (value) => {
         formProps?.onFinish?.(value);
-        resolvers.current?.resolve(value);
+        openResolvers.current?.resolve(value);
         await onFinish?.(value);
         setInnerOpen(false);
     }, props.confirmLoading);
@@ -83,20 +98,32 @@ curdProps, ...props }) => {
      * ----------------------------------------------------------------
      * 复制
      */
+    const isCopying = (0, react_2.useRef)(false);
     const pickerDialogRef = (0, react_2.useRef)(null);
-    const copiedHandler = (checked, value, row) => {
-        const title = !(0, utils_1.isUnset)(titleKey) ? row[titleKey] : void 0;
-        typeof title === 'string'
-            ? setFormValue({
-                ...row,
-                [titleKey]: `${title} - 副本`
-            })
-            : setFormValue(row);
+    const onCopyButtonClick = () => {
+        isCopying.current = true;
+        setSelectMode('single');
+        pickerDialogRef.current.open().then();
+    };
+    const toggleHandler = (checked, value, row) => {
+        if (isCopying.current) {
+            const title = !(0, utils_1.isUnset)(titleKey) ? row[titleKey] : void 0;
+            typeof title === 'string'
+                ? setFormValue({
+                    ...row,
+                    [titleKey]: `${title} - 副本`
+                })
+                : setFormValue(row);
+        }
+        else {
+            // 处理selectSingle
+            selectResolvers.current?.resolve(row);
+        }
     };
     const rowTitle = activeRow && !(0, utils_1.isUnset)(titleKey) ? activeRow[titleKey] : void 0;
     return ((0, jsx_runtime_1.jsxs)(dialog_1.Dialog, { css: curd_style_1.dialogStyle, width: 600, title: activeRow
             ? `${updateName}${dataName}${rowTitle ? ' - ' + rowTitle : ''}`
             : (0, jsx_runtime_1.jsxs)("div", { className: curd_style_1.classes.dialogTitle, children: [(0, jsx_runtime_1.jsxs)("span", { children: [createName, dataName] }), copyable &&
-                        (0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "plain", prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCopy_1.faCopy }), onClick: () => pickerDialogRef.current.open(), children: ["\u4ECE\u5DF2\u6709", dataName || '数据', "\u590D\u5236"] })] }), ...props, open: innerOpen.current, onClose: closeHandler, onConfirm: confirmHandler, confirmLoading: innerLoading.current, children: [(0, jsx_runtime_1.jsx)(loading_1.Loading, { open: transforming.current, children: (0, jsx_runtime_1.jsx)(form_1.Form, { labelWidth: "20%", ...formProps, ref: (0, utils_1.cloneRef)(formRef, innerFormRef), onFinish: finishHandler, children: renderedFormItems }) }), copyable &&
-                (0, jsx_runtime_1.jsx)(pickerDialog_1.PickerDialog, { ref: pickerDialogRef, onToggle: copiedHandler, children: (0, jsx_runtime_1.jsx)(curd_1.Curd, { ...curdProps, variant: "embeded", copyable: false, creatable: false, updatable: false, deletable: false }) })] }));
+                        (0, jsx_runtime_1.jsxs)(button_1.Button, { variant: "plain", prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCopy_1.faCopy }), onClick: onCopyButtonClick, children: ["\u4ECE\u5DF2\u6709", dataName || '数据', "\u590D\u5236"] })] }), ...props, open: innerOpen.current, onClose: closeHandler, onConfirm: confirmHandler, confirmLoading: innerLoading.current, children: [(0, jsx_runtime_1.jsx)(loading_1.Loading, { open: transforming.current, children: (0, jsx_runtime_1.jsx)(form_1.Form, { labelWidth: "20%", ...formProps, ref: (0, utils_1.cloneRef)(formRef, innerFormRef), onFinish: finishHandler, children: renderedFormItems }) }), copyable &&
+                (0, jsx_runtime_1.jsx)(pickerDialog_1.PickerDialog, { ref: pickerDialogRef, multiple: selectMode === 'multiple', onToggle: toggleHandler, children: (0, jsx_runtime_1.jsx)(curd_1.Curd, { ...curdProps, variant: "embeded", copyable: false, creatable: false, updatable: false, deletable: false }) })] }));
 });

package/dist/cjs/components/pickerDialog/pickerDialog.js

@@ -16,13 +16,6 @@ exports.PickerDialog = (({ ref, dialogRef, multiple, children, showSelectedList
 // 以下属性从SelectionContextBaseProps继承
 options = rows ?? nodes, primaryKey = 'id', childrenKey = 'children', relation = 'dependent', integration = 'shallowest', disabled, clearable = !!multiple, onToggle, ...props }) => {
     const resolvers = (0, react_1.useRef)(void 0);
-    const [innerValue, _setInnerValue] = (0, react_1.useState)(multiple ? [] : null);
-    const setInnerValue = (value) => {
-        _setInnerValue(value);
-        // 单选模式，值每次改变都触发确认
-        !multiple && confirmHandler(value);
-    };
-    const [innerOpen, setInnerOpen] = (0, utils_1.useControlled)(props.defaultOpen, props.open);
     (0, react_1.useImperativeHandle)(ref, () => ({
         open(value) {
             _setInnerValue(value ?? null);
@@ -31,6 +24,13 @@ options = rows ?? nodes, primaryKey = 'id', childrenKey = 'children', relation =
             return promise;
         }
     }));
+    const [innerValue, _setInnerValue] = (0, react_1.useState)(multiple ? [] : null);
+    const setInnerValue = (value) => {
+        _setInnerValue(value);
+        // 单选模式，值每次改变都触发确认
+        !multiple && confirmHandler(value);
+    };
+    const [innerOpen, setInnerOpen] = (0, utils_1.useControlled)(props.defaultOpen, props.open);
     const onCloseHandler = (reason) => {
         if (reason === 'confirmed') {
             return;

package/dist/cjs/extensions/curd/curd.d.ts

@@ -10,24 +10,24 @@ import { Id } from '../../types';
 export declare function CURD<R extends RowType, F extends FormValue = FormValue>(props?: CurdBaseProps<R, F>): <T extends ComponentClass>(target: T) => T;
 export declare namespace CURD {
     var Column: typeof import("./curd").Column;
-    var Reqeust: typeof import("./curd").Reqeust;
+    var LoadRows: typeof import("./curd").LoadRows;
     var OnReload: typeof import("./curd").OnReload;
     var OnFilter: typeof import("./curd").OnFilter;
     var OnCreate: typeof import("./curd").OnCreate;
     var OnUpdate: typeof import("./curd").OnUpdate;
     var OnDelete: typeof import("./curd").OnDelete;
-    var PostData: typeof import("./curd").PostData;
+    var RowToForm: typeof import("./curd").RowToForm;
 }
 export declare function DATA_GRID<R extends RowType, V extends Id = Id>(props?: DataGridProps<R, V>): <T extends ComponentClass>(target: T) => T;
 export declare namespace DATA_GRID {
     var Column: typeof import("./curd").Column;
-    var Reqeust: typeof import("./curd").Reqeust;
+    var LoadRows: typeof import("./curd").LoadRows;
     var OnReload: typeof import("./curd").OnReload;
     var OnFilter: typeof import("./curd").OnFilter;
     var OnCreate: typeof import("./curd").OnCreate;
     var OnUpdate: typeof import("./curd").OnUpdate;
     var OnDelete: typeof import("./curd").OnDelete;
-    var PostData: typeof import("./curd").PostData;
+    var RowToForm: typeof import("./curd").RowToForm;
 }
 type ColumnDecorator = (prototype: Object, property: string, descriptor?: TypedPropertyDescriptor<any>) => void;
 export declare function Column(title: ReactNode): ColumnDecorator;
@@ -51,8 +51,8 @@ export declare function Form(prototype: Object, property: string, descriptor?: T
  * 方法修饰器
  */
 type MethodDecorator = (prototype: Object, property: string, descriptor: TypedPropertyDescriptor<any>) => void;
-export declare function Reqeust(): MethodDecorator;
-export declare function Reqeust(prototype: Object, property: string, descriptor: TypedPropertyDescriptor<any>): void;
+export declare function LoadRows(): MethodDecorator;
+export declare function LoadRows(prototype: Object, property: string, descriptor: TypedPropertyDescriptor<any>): void;
 export declare function OnReload(): MethodDecorator;
 export declare function OnReload(prototype: Object, property: string, descriptor: TypedPropertyDescriptor<any>): void;
 export declare function OnFilter(): MethodDecorator;
@@ -63,6 +63,6 @@ export declare function OnUpdate(): MethodDecorator;
 export declare function OnUpdate(prototype: Object, property: string, descriptor: TypedPropertyDescriptor<any>): void;
 export declare function OnDelete(): MethodDecorator;
 export declare function OnDelete(prototype: Object, property: string, descriptor: TypedPropertyDescriptor<any>): void;
-export declare function PostData(): MethodDecorator;
-export declare function PostData(prototype: Object, property: string, descriptor: TypedPropertyDescriptor<any>): void;
+export declare function RowToForm(): MethodDecorator;
+export declare function RowToForm(prototype: Object, property: string, descriptor: TypedPropertyDescriptor<any>): void;
 export {};

package/dist/cjs/extensions/curd/curd.js

@@ -7,13 +7,13 @@ exports.Hide = Hide;
 exports.Sort = Sort;
 exports.Filter = Filter;
 exports.Form = Form;
-exports.Reqeust = Reqeust;
+exports.LoadRows = LoadRows;
 exports.OnReload = OnReload;
 exports.OnFilter = OnFilter;
 exports.OnCreate = OnCreate;
 exports.OnUpdate = OnUpdate;
 exports.OnDelete = OnDelete;
-exports.PostData = PostData;
+exports.RowToForm = RowToForm;
 const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
 const curd_1 = require("../../components/curd");
 const dataGrid_1 = require("../../components/dataGrid");
@@ -119,8 +119,8 @@ function setColumnConfigValue(key, value = true) {
     };
 }
 const prototype_methods = new WeakMap();
-CURD.Reqeust = DATA_GRID.Reqeust = Reqeust;
-function Reqeust(a, b, c) {
+CURD.LoadRows = DATA_GRID.LoadRows = LoadRows;
+function LoadRows(a, b, c) {
     return typeof c === 'undefined'
         ? setMethods('loadRows')
         : setMethods('loadRows')(a, b, c);
@@ -155,11 +155,11 @@ function OnDelete(a, b, c) {
         ? setMethods('onDelete')
         : setMethods('onDelete')(a, b, c);
 }
-CURD.PostData = DATA_GRID.PostData = PostData;
-function PostData(a, b, c) {
+CURD.RowToForm = DATA_GRID.RowToForm = RowToForm;
+function RowToForm(a, b, c) {
     return typeof c === 'undefined'
-        ? setMethods('postData')
-        : setMethods('postData')(a, b, c);
+        ? setMethods('rowToForm')
+        : setMethods('rowToForm')(a, b, c);
 }
 /**
  * 通用设置prototype_methods的方法

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

@@ -24,7 +24,13 @@ export type LoadRowsReturn<R extends RowType> = {
     total: number;
 };
 type EachRowType<R extends RowType, T> = T | ((row: R) => T);
-export interface CurdBaseProps<R extends RowType, F extends FormValue> extends DataGridBaseProps<R> {
+export type CurdRef<R extends RowType = RowType, F extends FormValue = FormValue> = {
+    openCreateDialog(initialValue?: F): Promise<F> | undefined;
+    selectSingle(): Promise<R> | undefined;
+    selectMultiple(selected?: Id[]): Promise<Id[]> | undefined;
+};
+export interface CurdBaseProps<R extends RowType, F extends FormValue> extends Omit<DataGridBaseProps<R>, 'ref'> {
+    ref?: Ref<CurdRef<R, F>>;
     /** 默认属性会传递给DataGrid组件，外层包裹元素的属性使用wrapperProps */
     wrapperProps?: DivProps;
     wrapperRef?: Ref<HTMLDivElement>;
@@ -82,14 +88,14 @@ export interface CurdBaseProps<R extends RowType, F extends FormValue> extends D
     onUpdate?(formValue: F, row: R): any;
     onDelete?(row: R): any;
     /** 行数据转换为表单值的方法，若不指定，行数据会直接填入表单 */
-    postData?(row: R): F | Promise<F>;
+    rowToForm?(row: R): F | Promise<F>;
     dialogProps?: CurdDialogProps<R, F>;
     formProps?: FormProps<F>;
     formRef?: Ref<FormRef<F>>;
 }
-interface CurdSingleProps<R extends RowType, F extends FormValue = FormValue, V extends Id = Id> 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>, 'ref' | '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> {
+interface CurdMultipleProps<R extends RowType, F extends FormValue = FormValue, V extends Id = Id> extends Omit<DataGridMultipleProps<R, V>, 'ref' | 'columns'>, CurdBaseProps<R, 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: {

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 { memo, useCallback, useEffect, useMemo, useRef } from 'react';
+import { memo, useCallback, useEffect, useMemo, useRef, useImperativeHandle } from 'react';
 import { DataGrid } from '../dataGrid';
 import { CurdFilter } from './curdFilter';
 import { classes, style } from './curd.style';
@@ -20,7 +20,22 @@ import { faPenToSquare } from '@fortawesome/free-regular-svg-icons/faPenToSquare
 import { faPlus } from '@fortawesome/free-solid-svg-icons/faPlus';
 import { faRotateRight } from '@fortawesome/free-solid-svg-icons/faRotateRight';
 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;
+    const { ref, 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, rowToForm, dialogProps, formProps, formRef, onChange, ...dataGridProps } = props;
+    /**
+     * -------------------------------------------------------------
+     * ref
+     */
+    useImperativeHandle(ref, () => ({
+        openCreateDialog(initialValue) {
+            return curdDialogRef.current?.open(void 0, initialValue);
+        },
+        selectSingle() {
+            return curdDialogRef.current?.selectSingle();
+        },
+        selectMultiple(selected) {
+            return curdDialogRef.current?.selectMultiple(selected);
+        }
+    }));
     /**
      * -------------------------------------------------------------
      * 筛选部分

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

@@ -1,5 +1,6 @@
 import { css } from '@emotion/react';
 import { defineInnerClasses, defineCss } from '../../utils';
+import { classes as buttonClasses } from '../button/button.style';
 export const classes = defineInnerClasses('curd', [
     'filter',
     'filterGridContainer',
@@ -91,5 +92,9 @@ export const dialogStyle = defineCss(({ spacing }) => css `
         display: flex;
         align-items: center;
         gap: ${spacing[8]}px;
+        
+        .${buttonClasses.root} {
+            font-size: 1rem;
+        }
     }
 `);

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

@@ -3,8 +3,11 @@ import { DialogProps } from '../dialog';
 import { RowType } from '../dataGrid';
 import { FormValue } from '../form';
 import { CurdBaseProps } from './curd';
+import { Id } from '../../types';
 export type CurdDialogRef<R extends RowType = RowType, F extends FormValue = FormValue> = {
-    open(activeRow?: R): Promise<F>;
+    open(activeRow?: R, initialFormValue?: F): Promise<F>;
+    selectSingle(): Promise<R>;
+    selectMultiple(selected?: Id[]): Promise<Id[]>;
 };
 export interface CurdDialogProps<R extends RowType, F extends FormValue = FormValue> extends Omit<DialogProps, 'ref'> {
     ref?: Ref<CurdDialogRef<R, F>>;

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

@@ -11,35 +11,49 @@ import { classes, dialogStyle } from './curd.style';
 import { PickerDialog } from '../pickerDialog';
 import { Icon } from '../..';
 import { faCopy } from '@fortawesome/free-regular-svg-icons/faCopy';
-export const CurdDialog = memo(({ ref, onFinish, 
-// 继承来的属性
-curdProps, ...props }) => {
-    const { columns, postData, copyable, titleKey, formProps, formRef, dataName = '', createName = '添加', updateName = '编辑' } = curdProps;
+export const CurdDialog = memo(({ ref, onFinish, curdProps, ...props }) => {
+    const { columns, rowToForm, copyable, titleKey, formProps, formRef, dataName = '', createName = '添加', updateName = '编辑' } = curdProps;
     /**
      * ----------------------------------------------------------------
      * ref与promise部分
      */
     const innerFormRef = useRef(null);
-    const resolvers = useRef(void 0);
+    const openResolvers = useRef(void 0);
     const [innerOpen, setInnerOpen] = useControlled(props.defaultOpen, props.open);
     const closeHandler = (reason) => {
         if (reason === 'confirmed') {
             return;
         }
         props.onClose?.(reason);
-        resolvers.current?.reject({
+        openResolvers.current?.reject({
             type: 'canceled',
             value: innerFormRef.current.getFormValue()
         });
         setInnerOpen(false);
     };
+    const [selectMode, setSelectMode] = useState('single');
+    const selectResolvers = useRef(void 0);
     useImperativeHandle(ref, () => ({
-        open(row) {
+        open(row, initialFormValue) {
             innerFormRef.current?.resetForm();
-            setInnerOpen(true);
+            suppressTransform.current = !!initialFormValue;
+            initialFormValue && innerFormRef.current?.setFormValue(initialFormValue);
             setActiveRow(row);
-            const { promise } = resolvers.current = Promise.withResolvers();
+            setInnerOpen(true);
+            const { promise } = openResolvers.current = Promise.withResolvers();
+            return promise;
+        },
+        selectSingle() {
+            isCopying.current = false;
+            setSelectMode('single');
+            pickerDialogRef.current.open().then();
+            const { promise } = selectResolvers.current = Promise.withResolvers();
             return promise;
+        },
+        selectMultiple(selected) {
+            isCopying.current = false;
+            setSelectMode('multiple');
+            return pickerDialogRef.current.open(selected);
         }
     }));
     /**
@@ -47,13 +61,14 @@ curdProps, ...props }) => {
      * 表单项
      */
     const [activeRow, setActiveRow] = useState();
+    const suppressTransform = useRef(false);
     const [transforming, setFormValue] = useLoading(async (row) => {
-        const formValue = postData && row ? await postData(row) : row;
+        const formValue = rowToForm && row ? await rowToForm(row) : row;
         formValue && innerFormRef.current?.setFormValue(formValue);
     });
     useEffect(() => {
-        innerOpen.current && setFormValue(activeRow);
-    }, [innerOpen.current]); // 依赖innerOpen而不依赖activeRow的原因是，有可能连续两次打开的activeRow是相同的
+        innerOpen.current && !suppressTransform.current && setFormValue(activeRow);
+    }, [innerOpen.current, activeRow]);
     const renderedFormItems = useMemo(() => {
         return columnsToFormItem(columns, activeRow)?.map(col => {
             if (isValidElement(col)) {
@@ -72,7 +87,7 @@ curdProps, ...props }) => {
     };
     const [innerLoading, finishHandler] = useLoading(async (value) => {
         formProps?.onFinish?.(value);
-        resolvers.current?.resolve(value);
+        openResolvers.current?.resolve(value);
         await onFinish?.(value);
         setInnerOpen(false);
     }, props.confirmLoading);
@@ -80,20 +95,32 @@ curdProps, ...props }) => {
      * ----------------------------------------------------------------
      * 复制
      */
+    const isCopying = useRef(false);
     const pickerDialogRef = useRef(null);
-    const copiedHandler = (checked, value, row) => {
-        const title = !isUnset(titleKey) ? row[titleKey] : void 0;
-        typeof title === 'string'
-            ? setFormValue({
-                ...row,
-                [titleKey]: `${title} - 副本`
-            })
-            : setFormValue(row);
+    const onCopyButtonClick = () => {
+        isCopying.current = true;
+        setSelectMode('single');
+        pickerDialogRef.current.open().then();
+    };
+    const toggleHandler = (checked, value, row) => {
+        if (isCopying.current) {
+            const title = !isUnset(titleKey) ? row[titleKey] : void 0;
+            typeof title === 'string'
+                ? setFormValue({
+                    ...row,
+                    [titleKey]: `${title} - 副本`
+                })
+                : setFormValue(row);
+        }
+        else {
+            // 处理selectSingle
+            selectResolvers.current?.resolve(row);
+        }
     };
     const rowTitle = activeRow && !isUnset(titleKey) ? activeRow[titleKey] : void 0;
     return (_jsxs(Dialog, { css: dialogStyle, width: 600, title: activeRow
             ? `${updateName}${dataName}${rowTitle ? ' - ' + rowTitle : ''}`
             : _jsxs("div", { className: classes.dialogTitle, children: [_jsxs("span", { children: [createName, dataName] }), copyable &&
-                        _jsxs(Button, { variant: "plain", prefix: _jsx(Icon, { icon: faCopy }), 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, { open: 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 }) })] }));
+                        _jsxs(Button, { variant: "plain", prefix: _jsx(Icon, { icon: faCopy }), onClick: onCopyButtonClick, children: ["\u4ECE\u5DF2\u6709", dataName || '数据', "\u590D\u5236"] })] }), ...props, open: innerOpen.current, onClose: closeHandler, onConfirm: confirmHandler, confirmLoading: innerLoading.current, children: [_jsx(Loading, { open: transforming.current, children: _jsx(Form, { labelWidth: "20%", ...formProps, ref: cloneRef(formRef, innerFormRef), onFinish: finishHandler, children: renderedFormItems }) }), copyable &&
+                _jsx(PickerDialog, { ref: pickerDialogRef, multiple: selectMode === 'multiple', onToggle: toggleHandler, children: _jsx(Curd, { ...curdProps, variant: "embeded", copyable: false, creatable: false, updatable: false, deletable: false }) })] }));
 });

package/dist/esm/components/pickerDialog/pickerDialog.js

@@ -13,13 +13,6 @@ export const PickerDialog = (({ ref, dialogRef, multiple, children, showSelected
 // 以下属性从SelectionContextBaseProps继承
 options = rows ?? nodes, primaryKey = 'id', childrenKey = 'children', relation = 'dependent', integration = 'shallowest', disabled, clearable = !!multiple, onToggle, ...props }) => {
     const resolvers = useRef(void 0);
-    const [innerValue, _setInnerValue] = useState(multiple ? [] : null);
-    const setInnerValue = (value) => {
-        _setInnerValue(value);
-        // 单选模式，值每次改变都触发确认
-        !multiple && confirmHandler(value);
-    };
-    const [innerOpen, setInnerOpen] = useControlled(props.defaultOpen, props.open);
     useImperativeHandle(ref, () => ({
         open(value) {
             _setInnerValue(value ?? null);
@@ -28,6 +21,13 @@ options = rows ?? nodes, primaryKey = 'id', childrenKey = 'children', relation =
             return promise;
         }
     }));
+    const [innerValue, _setInnerValue] = useState(multiple ? [] : null);
+    const setInnerValue = (value) => {
+        _setInnerValue(value);
+        // 单选模式，值每次改变都触发确认
+        !multiple && confirmHandler(value);
+    };
+    const [innerOpen, setInnerOpen] = useControlled(props.defaultOpen, props.open);
     const onCloseHandler = (reason) => {
         if (reason === 'confirmed') {
             return;