@pisell/materials 2.2.48 → 2.2.49

package/lib/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.js

@@ -0,0 +1,313 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/dataSourceTable/hooks/useTableProps.tsx
+var useTableProps_exports = {};
+__export(useTableProps_exports, {
+  default: () => useTableProps_default
+});
+module.exports = __toCommonJS(useTableProps_exports);
+var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_utils = require("@pisell/utils");
+var import_ahooks = require("ahooks");
+var import_filter = __toESM(require("../filter"));
+var import_usePagination = __toESM(require("./usePagination"));
+var import_useColumns = __toESM(require("./useColumns"));
+var import_useVariables = __toESM(require("../../hooks/useVariables"));
+var import_useComponentId = __toESM(require("../../hooks/useComponentId"));
+var import_useDataSource = __toESM(require("../../hooks/useDataSource"));
+var import_pisellToast = __toESM(require("../../../pisellToast"));
+var import_locales = require("../../../../locales");
+var import_pisellModal = __toESM(require("../../../pisellModal"));
+var import_dayjs = __toESM(require("dayjs"));
+var useTableProps = (props) => {
+  var _a;
+  const {
+    originProps,
+    openDrawer,
+    closeDrawer,
+    refreshData,
+    handleFilterChange,
+    tableRef
+  } = props;
+  const {
+    title: propsTitle,
+    subTitle: propsSubTitle,
+    titleButtons,
+    tableButtons,
+    operation,
+    filter: propsFilter,
+    search,
+    clickToDetail,
+    onRow: propsOnRow,
+    filterBy
+  } = originProps;
+  const {
+    items,
+    show,
+    title: operationTitle,
+    width,
+    align,
+    fixed,
+    type
+  } = operation || {};
+  const componentId = (0, import_useComponentId.default)(originProps);
+  const { list, destroy, update } = (0, import_useDataSource.default)();
+  const { data } = list;
+  const pagination = (0, import_usePagination.default)({ data });
+  (0, import_react.useEffect)(() => {
+    if (tableRef == null ? void 0 : tableRef.current) {
+      tableRef.current.formInstance.setFieldValue("pagination", {
+        page: (pagination == null ? void 0 : pagination.current) || 1,
+        size: (pagination == null ? void 0 : pagination.pageSize) || 10
+      });
+    }
+  }, [pagination]);
+  const { registerValueVariable } = (0, import_useVariables.default)();
+  const title = (0, import_react.useMemo)(() => {
+    if ((0, import_utils.isString)(propsTitle)) {
+      return /* @__PURE__ */ import_react.default.createElement("span", { className: "data-source-table-title" }, propsTitle);
+    }
+    return propsTitle;
+  }, [propsTitle]);
+  const subTitle = (0, import_react.useMemo)(() => {
+    if ((0, import_utils.isString)(propsSubTitle)) {
+      return /* @__PURE__ */ import_react.default.createElement("span", { className: "data-source-table-sub-title" }, propsSubTitle);
+    }
+    return propsSubTitle;
+  }, [propsSubTitle]);
+  const handleOpenDrawer = (0, import_ahooks.useMemoizedFn)((record, item) => {
+    var _a2;
+    (_a2 = item == null ? void 0 : item.onClick) == null ? void 0 : _a2.call(item, record);
+    if (item.openMode === "custom") {
+      return;
+    }
+    registerValueVariable == null ? void 0 : registerValueVariable(componentId, {
+      currentRecord: record
+    });
+    openDrawer(item);
+  });
+  const handleDelete = (0, import_ahooks.useMemoizedFn)(
+    async (record, softDelete) => {
+      try {
+        registerValueVariable == null ? void 0 : registerValueVariable(componentId, {
+          currentRecord: { ...record }
+        });
+        setTimeout(async () => {
+          if (softDelete) {
+            const deleteTime = (0, import_dayjs.default)().format("YYYY-MM-DD HH:mm:ss");
+            await (update == null ? void 0 : update.runAsync({
+              ...record,
+              deleted_at: deleteTime
+            }));
+          } else {
+            await (destroy == null ? void 0 : destroy.runAsync(record.id));
+          }
+          refreshData();
+          (0, import_pisellToast.default)({
+            content: (0, import_locales.getText)("pisell-action-delete-success")
+          });
+        });
+      } catch (error) {
+        console.error(error);
+        (0, import_pisellToast.default)({
+          content: (0, import_locales.getText)("pisell-action-delete-failed")
+        });
+      }
+    }
+  );
+  const actionsColumns = (0, import_react.useMemo)(() => {
+    if (!show) {
+      return [];
+    }
+    return [
+      {
+        title: operationTitle,
+        key: "actions",
+        align,
+        width,
+        fixed,
+        items,
+        type,
+        render: (_, record) => {
+          return /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, items == null ? void 0 : items.map((item) => {
+            const { label, actionType, show: show2 } = item;
+            const handleClick = (e) => {
+              e.stopPropagation();
+              if (actionType === "delete") {
+                import_pisellModal.default.confirm({
+                  title: (0, import_locales.getText)("pisell-delete-confirm-title"),
+                  content: (0, import_locales.getText)("pisell-delete-confirm-content"),
+                  okText: (0, import_locales.getText)("pisell-delete-confirm-ok"),
+                  cancelText: (0, import_locales.getText)("pisell-delete-confirm-cancel"),
+                  onOk: () => {
+                    handleDelete(record, item == null ? void 0 : item.softDelete);
+                  }
+                });
+                return;
+              } else {
+                handleOpenDrawer(record, item);
+              }
+            };
+            if ((0, import_utils.isBoolean)(show2)) {
+              if (!show2) {
+                return null;
+              }
+            } else if ((0, import_utils.isFunction)(show2)) {
+              const result = show2(record);
+              if (!result) {
+                return null;
+              }
+            }
+            return /* @__PURE__ */ import_react.default.createElement(
+              import_antd.Button,
+              {
+                onClick: handleClick,
+                type: type === "link" ? "link" : "default",
+                style: type === "link" ? {
+                  padding: "0",
+                  height: "auto"
+                } : {
+                  height: "auto"
+                }
+              },
+              label
+            );
+          }));
+        }
+      }
+    ];
+  }, [operationTitle, show, width, align, fixed, type, items]);
+  const columns = (0, import_useColumns.default)({
+    columns: originProps.columns,
+    fields: (_a = originProps.dataSource) == null ? void 0 : _a.fields,
+    // 操作列
+    actionsColumns
+  });
+  const buttons = (0, import_react.useMemo)(() => {
+    var _a2;
+    if (!(titleButtons == null ? void 0 : titleButtons.show)) {
+      return null;
+    }
+    return (_a2 = titleButtons == null ? void 0 : titleButtons.items) == null ? void 0 : _a2.map((button) => {
+      const { actionType, buttonProps, beforeOpen } = button;
+      return {
+        ...button,
+        ...buttonProps,
+        title: button.label,
+        size: "large",
+        onClick: () => {
+          if (actionType === "add") {
+            let result = true;
+            if (beforeOpen) {
+              result = beforeOpen();
+            }
+            if (result) {
+              handleOpenDrawer(null, button);
+            }
+          }
+        }
+      };
+    });
+  }, [titleButtons]);
+  const actionButtons = (0, import_react.useMemo)(() => {
+    var _a2;
+    if (!(tableButtons == null ? void 0 : tableButtons.show)) {
+      return null;
+    }
+    return (_a2 = tableButtons == null ? void 0 : tableButtons.items) == null ? void 0 : _a2.map((button) => {
+      const { actionType, buttonProps } = button;
+      return {
+        ...button,
+        ...buttonProps,
+        size: "large",
+        title: button.label,
+        onClick: () => {
+          if (actionType === "add") {
+            handleOpenDrawer(null, button);
+          }
+        }
+      };
+    });
+  }, [tableButtons]);
+  const filter = (0, import_react.useMemo)(() => {
+    if (!(propsFilter == null ? void 0 : propsFilter.show) && !(search == null ? void 0 : search.show)) {
+      return null;
+    }
+    return /* @__PURE__ */ import_react.default.createElement(
+      import_filter.default,
+      {
+        ...propsFilter,
+        componentId,
+        search,
+        handleValuesChange: handleFilterChange,
+        filterBy
+      }
+    );
+  }, [propsFilter, search]);
+  const onRow = (0, import_ahooks.useMemoizedFn)((record) => {
+    if (!(clickToDetail == null ? void 0 : clickToDetail.show)) {
+      return propsOnRow;
+    }
+    return {
+      ...propsOnRow,
+      onClick: (event) => {
+        var _a2;
+        let detail;
+        if (clickToDetail == null ? void 0 : clickToDetail.useCustomAction) {
+          detail = {
+            openMode: clickToDetail == null ? void 0 : clickToDetail.openMode,
+            openContentSize: clickToDetail == null ? void 0 : clickToDetail.openContentSize,
+            openTitle: clickToDetail == null ? void 0 : clickToDetail.openTitle,
+            actionType: clickToDetail == null ? void 0 : clickToDetail.actionType,
+            key: clickToDetail == null ? void 0 : clickToDetail.actionType
+          };
+        } else {
+          detail = items == null ? void 0 : items.find((item) => item.key === (clickToDetail == null ? void 0 : clickToDetail.key));
+        }
+        if (detail) {
+          handleOpenDrawer(record, detail);
+        }
+        (_a2 = propsOnRow == null ? void 0 : propsOnRow.onClick) == null ? void 0 : _a2.call(propsOnRow, record, event);
+      }
+    };
+  });
+  return {
+    ...originProps,
+    title,
+    pagination,
+    columns,
+    subTitle,
+    buttons,
+    filter,
+    onRow,
+    actionButtons
+  };
+};
+var useTableProps_default = useTableProps;

package/lib/components/dataSourceComponents/dataSourceTable/hooks/useTableQuery.d.ts

@@ -0,0 +1,33 @@
+/// <reference types="react" />
+import { DataSourceTableProps } from '../type';
+declare type Params = {
+    pagination?: {
+        page: number;
+        size: number;
+    };
+    order_by?: string;
+    tabs?: {
+        name: string;
+        filterBy: Record<string, any>;
+        sortBy: string;
+    };
+};
+declare const useTableQuery: (props: DataSourceTableProps) => {
+    queryPageConfig: {
+        page: number;
+        pageSize: number;
+        filter: Record<string, any>;
+        sort: string;
+    };
+    setQueryPageConfig: import("react").Dispatch<import("react").SetStateAction<{
+        page: number;
+        pageSize: number;
+        filter: Record<string, any>;
+        sort: string;
+    }>>;
+    handleValuesChange: (params: Params, allParams: Params) => void;
+    refreshData: () => void;
+    handleFilterChange: (changedFields: any, allFields: any) => void;
+    refreshCurrentPage: () => void;
+};
+export default useTableQuery;

package/lib/components/dataSourceComponents/dataSourceTable/hooks/useTableQuery.js

@@ -0,0 +1,89 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/dataSourceTable/hooks/useTableQuery.ts
+var useTableQuery_exports = {};
+__export(useTableQuery_exports, {
+  default: () => useTableQuery_default
+});
+module.exports = __toCommonJS(useTableQuery_exports);
+var import_react = require("react");
+var import_ahooks = require("ahooks");
+var useTableQuery = (props) => {
+  var _a, _b, _c, _d;
+  const { filterBy, sortBy, tabs } = props;
+  const [queryPageConfig, setQueryPageConfig] = (0, import_react.useState)({
+    page: 1,
+    pageSize: 10,
+    filter: ((_b = (_a = tabs == null ? void 0 : tabs.items) == null ? void 0 : _a[0]) == null ? void 0 : _b.filterBy) || filterBy || {},
+    sort: ((_d = (_c = tabs == null ? void 0 : tabs.items) == null ? void 0 : _c[0]) == null ? void 0 : _d.sortBy) || sortBy
+  });
+  const handleValuesChange = (0, import_ahooks.useMemoizedFn)(
+    (params, allParams) => {
+      const { page, size } = params.pagination || {};
+      setQueryPageConfig((prev) => {
+        var _a2, _b2, _c2;
+        let sort = prev.sort || sortBy;
+        let filter = prev.filter;
+        if ("tabs" in params) {
+          sort = ((_a2 = params.tabs) == null ? void 0 : _a2.sortBy) || sortBy || "";
+          filter = { ...prev.filter, ...((_b2 = params.tabs) == null ? void 0 : _b2.filterBy) || {} };
+        }
+        if ("order_by" in params) {
+          sort = params.order_by || ((_c2 = allParams.tabs) == null ? void 0 : _c2.sortBy) || sortBy;
+        }
+        return {
+          ...prev,
+          page: size !== prev.pageSize ? 1 : page ?? prev.page,
+          pageSize: size ?? prev.pageSize,
+          sort,
+          filter
+        };
+      });
+    }
+  );
+  const handleFilterChange = (0, import_ahooks.useMemoizedFn)(
+    (changedFields, allFields) => {
+      setQueryPageConfig((prev) => ({
+        ...prev,
+        page: 1,
+        filter: { ...prev.filter, ...allFields, ...filterBy || {} }
+      }));
+    }
+  );
+  const refreshData = (0, import_ahooks.useMemoizedFn)(() => {
+    setQueryPageConfig((prev) => ({
+      ...prev,
+      page: 1
+    }));
+  });
+  const refreshCurrentPage = (0, import_ahooks.useMemoizedFn)(() => {
+    setQueryPageConfig((prev) => ({
+      ...prev
+    }));
+  });
+  return {
+    queryPageConfig,
+    setQueryPageConfig,
+    handleValuesChange,
+    refreshData,
+    handleFilterChange,
+    refreshCurrentPage
+  };
+};
+var useTableQuery_default = useTableQuery;

package/lib/components/dataSourceComponents/dataSourceTable/index.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { TableRef } from './BaseTable';
+import './index.less';
+import { DataSourceTableProps } from './type';
+declare const _default: React.ForwardRefExoticComponent<DataSourceTableProps & React.RefAttributes<TableRef>>;
+export default _default;

package/lib/components/dataSourceComponents/dataSourceTable/index.js

@@ -0,0 +1,43 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/dataSourceTable/index.tsx
+var dataSourceTable_exports = {};
+__export(dataSourceTable_exports, {
+  default: () => dataSourceTable_default
+});
+module.exports = __toCommonJS(dataSourceTable_exports);
+var import_react = __toESM(require("react"));
+var import_BaseTable = __toESM(require("./BaseTable"));
+var import_DataSourceProvider = __toESM(require("../provider/dataSource/DataSourceProvider"));
+var import_index = require("./index.less");
+var DataSourceTable = (props, ref) => {
+  const { dataSource, __designMode, extraParams } = props;
+  return /* @__PURE__ */ import_react.default.createElement(import_DataSourceProvider.default, { dataSource, __designMode, extraParams }, /* @__PURE__ */ import_react.default.createElement(import_BaseTable.default, { ...props, ref }));
+};
+var dataSourceTable_default = (0, import_react.forwardRef)(DataSourceTable);

package/lib/components/dataSourceComponents/dataSourceTable/index.less

@@ -0,0 +1,5 @@
+.data-source-table-title {
+  color: #101828;
+  font-weight: 600;
+  font-size: 20px;
+}

package/lib/components/dataSourceComponents/dataSourceTable/provider/tableSetting/TableSettingContext.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export interface TableSettingContextType {
+    dataSource?: string;
+    children?: React.ReactNode;
+}
+export declare const TableSettingContext: import("react").Context<TableSettingContextType>;
+export default TableSettingContext;

package/lib/components/dataSourceComponents/dataSourceTable/provider/tableSetting/TableSettingContext.js

@@ -0,0 +1,33 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/dataSourceTable/provider/tableSetting/TableSettingContext.ts
+var TableSettingContext_exports = {};
+__export(TableSettingContext_exports, {
+  TableSettingContext: () => TableSettingContext,
+  default: () => TableSettingContext_default
+});
+module.exports = __toCommonJS(TableSettingContext_exports);
+var import_react = require("react");
+var initialContext = {};
+var TableSettingContext = (0, import_react.createContext)(initialContext);
+var TableSettingContext_default = TableSettingContext;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  TableSettingContext
+});

package/lib/components/dataSourceComponents/dataSourceTable/provider/tableSetting/TableSettingProvider.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { TableSettingContextType } from './TableSettingContext';
+/**
+ * @title: 表单设置Provider
+ * @description: 提供表单设置信息
+ */
+declare const TableSettingProvider: React.FC<TableSettingContextType>;
+export default TableSettingProvider;

package/lib/components/dataSourceComponents/dataSourceTable/provider/tableSetting/TableSettingProvider.js

@@ -0,0 +1,52 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/dataSourceComponents/dataSourceTable/provider/tableSetting/TableSettingProvider.tsx
+var TableSettingProvider_exports = {};
+__export(TableSettingProvider_exports, {
+  default: () => TableSettingProvider_default
+});
+module.exports = __toCommonJS(TableSettingProvider_exports);
+var import_react = __toESM(require("react"));
+var import_TableSettingContext = __toESM(require("./TableSettingContext"));
+var TableSettingProvider = (props) => {
+  const { children, dataSource } = props;
+  const value = import_react.default.useMemo(() => {
+    return {
+      dataSource
+    };
+  }, [dataSource]);
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_TableSettingContext.default.Provider,
+    {
+      value
+    },
+    children
+  );
+};
+var TableSettingProvider_default = TableSettingProvider;

package/lib/components/dataSourceComponents/dataSourceTable/type.d.ts

@@ -0,0 +1,78 @@
+/// <reference types="react" />
+import { ColumnType } from 'antd/es/table';
+import { DataSourceType } from '../provider/dataSource/DataSourceContext';
+export declare type OperationItem = {
+    label?: string;
+    openMode: 'modal' | 'drawer' | 'custom';
+    openContentSize: 'small' | 'middle' | 'large';
+    openTitle: string;
+    actionType: 'detail' | 'edit' | 'delete' | 'custom';
+    key: string;
+    buttonProps?: any;
+    onClick?: (record: any) => void;
+};
+export interface DataSourceTableProps {
+    title?: string | React.ReactNode | (() => React.ReactNode);
+    subTitle?: string | React.ReactNode | (() => React.ReactNode);
+    titleButtons?: {
+        show: boolean;
+        maxCount: number;
+        items: OperationItem[];
+    };
+    tableButtons?: {
+        show: boolean;
+        maxCount: number;
+        items: OperationItem[];
+    };
+    buttons?: any[];
+    operation?: {
+        show: boolean;
+        title: string;
+        width: number;
+        align: 'left' | 'center' | 'right';
+        fixed: 'left' | 'right' | false;
+        type: 'link' | 'button';
+        items: OperationItem[];
+    };
+    operationContent?: {
+        [key: string]: React.ReactNode;
+    };
+    dataSource: DataSourceType;
+    columns: ColumnType<any>[];
+    filter: any;
+    search?: {
+        show: boolean;
+        placeholder: string;
+    };
+    __designMode: string;
+    componentId: string;
+    clickToDetail?: {
+        show: boolean;
+        useCustomAction: boolean;
+        actionType: string;
+        openMode: 'modal' | 'drawer';
+        openContentSize: 'small' | 'middle' | 'large';
+        openTitle: string;
+        key: string;
+    };
+    onRow?: any;
+    filterBy?: Record<string, any>;
+    sortBy: string;
+    tabs?: {
+        show: boolean;
+        type: string;
+        items: {
+            name: string;
+            filterBy: Record<string, any>;
+            sortBy: string;
+        }[];
+    };
+    onValuesChange?: (changedValues: any, values: any) => void;
+    extraParams?: {
+        list?: Record<string, any>;
+        get?: Record<string, any>;
+        update?: Record<string, any>;
+        create?: Record<string, any>;
+        destroy?: Record<string, any>;
+    };
+}