@tmagic/table 1.3.16 → 1.4.0-beta.2

package/dist/tmagic-table.js

@@ -553,4 +553,4 @@ const index = {
   }
 };
 
-export { _sfc_main as MagicTable, index as default };
+export { _sfc_main as MagicTable, index as default, formatter };

package/dist/tmagic-table.umd.cjs

@@ -555,6 +555,7 @@
 
   exports.MagicTable = _sfc_main;
   exports.default = index;
+  exports.formatter = formatter;
 
   Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
 

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.3.16",
+  "version": "1.4.0-beta.2",
   "name": "@tmagic/table",
   "type": "module",
   "sideEffects": [
@@ -29,32 +29,33 @@
     "url": "https://github.com/Tencent/tmagic-editor.git"
   },
   "dependencies": {
-    "@tmagic/design": "1.3.16",
-    "@tmagic/form": "1.3.16",
-    "@tmagic/utils": "1.3.16",
+    "@tmagic/design": "1.4.0-beta.2",
+    "@tmagic/form": "1.4.0-beta.2",
+    "@tmagic/utils": "1.4.0-beta.2",
     "lodash-es": "^4.17.21",
-    "vue": "^3.3.8"
+    "vue": "^3.4.21"
   },
   "peerDependencies": {
-    "@tmagic/form": "1.3.16",
-    "vue": "^3.3.8"
+    "@tmagic/form": "1.4.0-beta.2",
+    "vue": "^3.4.21"
   },
   "devDependencies": {
     "@types/color": "^3.0.1",
     "@types/lodash-es": "^4.17.4",
     "@types/node": "^18.19.0",
     "@vitejs/plugin-vue": "^4.5.2",
-    "@vue/compiler-sfc": "^3.3.8",
-    "@vue/test-utils": "^2.3.2",
+    "@vue/compiler-sfc": "^3.4.21",
+    "@vue/test-utils": "^2.4.4",
     "rimraf": "^3.0.2",
     "sass": "^1.35.1",
-    "typescript": "^5.0.4",
-    "vite": "^5.0.7",
-    "vue-tsc": "^1.8.25"
+    "typescript": "^5.4.2",
+    "vite": "^5.1.6",
+    "vue-tsc": "^2.0.6"
   },
   "scripts": {
     "build": "npm run build:type && vite build",
     "build:type": "npm run clear:type && vue-tsc --declaration --emitDeclarationOnly --project tsconfig.build.json",
-    "clear:type": "rimraf ./types"
+    "clear:type": "rimraf ./types",
+    "type:check": "vue-tsc --noEmit"
   }
 }

package/src/Table.vue

@@ -72,6 +72,7 @@ import ActionsColumn from './ActionsColumn.vue';
 import ComponentColumn from './ComponentColumn.vue';
 import ExpandColumn from './ExpandColumn.vue';
 import PopoverColumn from './PopoverColumn.vue';
+import type { ColumnConfig } from './schema';
 import TextColumn from './TextColumn.vue';
 
 defineOptions({
@@ -81,7 +82,7 @@ defineOptions({
 const props = withDefaults(
   defineProps<{
     data: any[];
-    columns?: any[];
+    columns?: ColumnConfig[];
     /** 合并行或列的计算方法 */
     spanMethod?: (data: { row: any; column: any; rowIndex: number; columnIndex: number }) => [number, number];
     loading?: boolean;

package/src/index.ts

@@ -21,6 +21,8 @@ import { App } from 'vue';
 import Table from './Table.vue';
 
 export { default as MagicTable } from './Table.vue';
+export * from './schema';
+export * from './utils';
 
 export default {
   install(app: App) {

package/src/schema.ts

@@ -20,10 +20,10 @@ import { FormConfig, FormValue } from '@tmagic/form';
 
 export interface ColumnActionConfig {
   type?: 'delete' | 'copy' | 'edit';
-  buttonType: string;
+  buttonType?: string;
   display?: (row: any) => boolean;
-  text: string | ((row: any) => string);
-  name: string;
+  text?: string | ((row: any) => string);
+  name?: string;
   tooltip?: string;
   tooltipPlacement?: string;
   icon?: any;
@@ -33,7 +33,7 @@ export interface ColumnActionConfig {
   action?: (data: { data: any }) => void;
 }
 
-export type ColumnConfig = {
+export interface ColumnConfig<T = any> {
   form?: FormConfig;
   rules?: any;
   values?: FormValue;
@@ -43,12 +43,12 @@ export type ColumnConfig = {
   fixed?: 'left' | 'right' | boolean;
   width?: number | string;
   actions?: ColumnActionConfig[];
-  type?: 'popover' | 'expand' | 'component' | string | ((value: any, row: any) => string);
+  type?: 'popover' | 'expand' | 'component' | string | ((value: any, row: T) => string);
   text?: string;
   prop?: string;
   showHeader?: boolean;
   table?: ColumnConfig[];
-  formatter?: 'datetime' | ((item: any, row: Record<string, any>) => any);
+  formatter?: 'datetime' | ((item: any, row: T) => any);
   popover?: {
     placement: string;
     width: string;
@@ -57,9 +57,9 @@ export type ColumnConfig = {
   };
   sortable?: boolean | 'custom';
   action?: 'tip' | 'actionLink' | 'img' | 'link' | 'tag';
-  handler?: (row: any) => void;
+  handler?: (row: T) => void;
   /** 当type为expand时有效，展开为html */
-  expandContent?: (row: any, prop?: string) => string;
+  expandContent?: (row: T, prop?: string) => string;
   /** 当type为expand时，展开为vue组件；当type为component时显示的组件 */
   component?: any;
   /** 当type为expand时，展开的vue组件props；当type为component时显示的组件的props */
@@ -68,4 +68,4 @@ export type ColumnConfig = {
   listeners?: any;
   /** 当type为tip时有效，显示文案 */
   buttonText?: string;
-};
+}

package/types/ActionsColumn.vue.d.ts

@@ -1,5 +1,5 @@
 import { ColumnConfig } from './schema';
-declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     columns: any[];
     config: ColumnConfig;
     rowkeyName?: string | undefined;
@@ -11,7 +11,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     editState: () => never[];
 }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "after-action": (...args: any[]) => void;
-}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     columns: any[];
     config: ColumnConfig;
     rowkeyName?: string | undefined;
@@ -30,15 +30,6 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     editState: any;
 }, {}>;
 export default _default;
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToRuntimeProps<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};
 type __VLS_WithDefaults<P, D> = {
     [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
         default: D[K];
@@ -47,3 +38,12 @@ type __VLS_WithDefaults<P, D> = {
 type __VLS_Prettify<T> = {
     [K in keyof T]: T[K];
 } & {};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/types/ComponentColumn.vue.d.ts

@@ -1,9 +1,9 @@
 import { ColumnConfig } from './schema';
-declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     config: ColumnConfig;
 }>, {
     config: () => {};
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     config: ColumnConfig;
 }>, {
     config: () => {};
@@ -11,15 +11,6 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     config: ColumnConfig;
 }, {}>;
 export default _default;
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToRuntimeProps<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};
 type __VLS_WithDefaults<P, D> = {
     [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
         default: D[K];
@@ -28,3 +19,12 @@ type __VLS_WithDefaults<P, D> = {
 type __VLS_Prettify<T> = {
     [K in keyof T]: T[K];
 } & {};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/types/ExpandColumn.vue.d.ts

@@ -1,9 +1,9 @@
 import { ColumnConfig } from './schema';
-declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     config: ColumnConfig;
 }>, {
     config: () => {};
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     config: ColumnConfig;
 }>, {
     config: () => {};
@@ -11,15 +11,6 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     config: ColumnConfig;
 }, {}>;
 export default _default;
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToRuntimeProps<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};
 type __VLS_WithDefaults<P, D> = {
     [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
         default: D[K];
@@ -28,3 +19,12 @@ type __VLS_WithDefaults<P, D> = {
 type __VLS_Prettify<T> = {
     [K in keyof T]: T[K];
 } & {};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/types/PopoverColumn.vue.d.ts

@@ -1,9 +1,9 @@
 import { ColumnConfig } from './schema';
-declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     config: ColumnConfig;
 }>, {
     config: () => {};
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     config: ColumnConfig;
 }>, {
     config: () => {};
@@ -11,15 +11,6 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     config: ColumnConfig;
 }, {}>;
 export default _default;
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToRuntimeProps<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};
 type __VLS_WithDefaults<P, D> = {
     [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
         default: D[K];
@@ -28,3 +19,12 @@ type __VLS_WithDefaults<P, D> = {
 type __VLS_Prettify<T> = {
     [K in keyof T]: T[K];
 } & {};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/types/Table.vue.d.ts

@@ -1,6 +1,7 @@
-declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+import type { ColumnConfig } from './schema';
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     data: any[];
-    columns?: any[] | undefined;
+    columns?: ColumnConfig<any>[] | undefined;
     /** 合并行或列的计算方法 */
     spanMethod?: ((data: {
         row: any;
@@ -38,9 +39,9 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     "selection-change": (...args: any[]) => void;
     "expand-change": (...args: any[]) => void;
     "cell-click": (...args: any[]) => void;
-}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     data: any[];
-    columns?: any[] | undefined;
+    columns?: ColumnConfig<any>[] | undefined;
     /** 合并行或列的计算方法 */
     spanMethod?: ((data: {
         row: any;
@@ -75,22 +76,13 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     "onExpand-change"?: ((...args: any[]) => any) | undefined;
     "onCell-click"?: ((...args: any[]) => any) | undefined;
 }, {
-    columns: any[];
+    columns: ColumnConfig[];
     loading: boolean;
     showHeader: boolean;
     defaultExpandAll: boolean;
     border: boolean;
 }, {}>;
 export default _default;
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToRuntimeProps<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};
 type __VLS_WithDefaults<P, D> = {
     [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
         default: D[K];
@@ -99,3 +91,12 @@ type __VLS_WithDefaults<P, D> = {
 type __VLS_Prettify<T> = {
     [K in keyof T]: T[K];
 } & {};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/types/TextColumn.vue.d.ts

@@ -1,11 +1,11 @@
 import { ColumnConfig } from './schema';
-declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     config: ColumnConfig;
     editState?: any;
 }>, {
     config: () => {};
     editState: () => {};
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<{
     config: ColumnConfig;
     editState?: any;
 }>, {
@@ -16,15 +16,6 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     editState: any;
 }, {}>;
 export default _default;
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToRuntimeProps<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};
 type __VLS_WithDefaults<P, D> = {
     [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
         default: D[K];
@@ -33,3 +24,12 @@ type __VLS_WithDefaults<P, D> = {
 type __VLS_Prettify<T> = {
     [K in keyof T]: T[K];
 } & {};
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/types/index.d.ts

@@ -1,5 +1,7 @@
 import { App } from 'vue';
 export { default as MagicTable } from './Table.vue';
+export * from './schema';
+export * from './utils';
 declare const _default: {
     install(app: App): void;
 };

package/types/schema.d.ts

@@ -1,10 +1,10 @@
 import { FormConfig, FormValue } from '@tmagic/form';
 export interface ColumnActionConfig {
     type?: 'delete' | 'copy' | 'edit';
-    buttonType: string;
+    buttonType?: string;
     display?: (row: any) => boolean;
-    text: string | ((row: any) => string);
-    name: string;
+    text?: string | ((row: any) => string);
+    name?: string;
     tooltip?: string;
     tooltipPlacement?: string;
     icon?: any;
@@ -15,7 +15,7 @@ export interface ColumnActionConfig {
         data: any;
     }) => void;
 }
-export type ColumnConfig = {
+export interface ColumnConfig<T = any> {
     form?: FormConfig;
     rules?: any;
     values?: FormValue;
@@ -25,12 +25,12 @@ export type ColumnConfig = {
     fixed?: 'left' | 'right' | boolean;
     width?: number | string;
     actions?: ColumnActionConfig[];
-    type?: 'popover' | 'expand' | 'component' | string | ((value: any, row: any) => string);
+    type?: 'popover' | 'expand' | 'component' | string | ((value: any, row: T) => string);
     text?: string;
     prop?: string;
     showHeader?: boolean;
     table?: ColumnConfig[];
-    formatter?: 'datetime' | ((item: any, row: Record<string, any>) => any);
+    formatter?: 'datetime' | ((item: any, row: T) => any);
     popover?: {
         placement: string;
         width: string;
@@ -39,9 +39,9 @@ export type ColumnConfig = {
     };
     sortable?: boolean | 'custom';
     action?: 'tip' | 'actionLink' | 'img' | 'link' | 'tag';
-    handler?: (row: any) => void;
+    handler?: (row: T) => void;
     /** 当type为expand时有效，展开为html */
-    expandContent?: (row: any, prop?: string) => string;
+    expandContent?: (row: T, prop?: string) => string;
     /** 当type为expand时，展开为vue组件；当type为component时显示的组件 */
     component?: any;
     /** 当type为expand时，展开的vue组件props；当type为component时显示的组件的props */
@@ -50,4 +50,4 @@ export type ColumnConfig = {
     listeners?: any;
     /** 当type为tip时有效，显示文案 */
     buttonText?: string;
-};
+}