rayyy-vue-table-components 1.0.16 → 1.0.17

package/README.md

@@ -94,6 +94,117 @@ const handleSortChange = (sortInfo: SortChangValue<User>) => {
 </script>
 ```
 
+## TypeScript 類型支持
+
+本庫提供完整的 TypeScript 類型定義，包括：
+
+### 組件類型
+
+```typescript
+import type {
+  // BaseTable 組件類型
+  BaseTableProps,
+  BaseTableEmits,
+  BaseTableInstance,
+  
+  // BaseBtn 組件類型
+  BaseBtnProps,
+  BaseBtnEmits,
+  BaseBtnInstance,
+  
+  // BaseDialog 組件類型
+  BaseDialogProps,
+  BaseDialogEmits,
+  BaseDialogInstance,
+  
+  // 插件類型
+  PluginOptions,
+  VueTableComponentsPlugin
+} from 'rayyy-vue-table-components/types/components'
+```
+
+### 數據類型
+
+```typescript
+import type {
+  TableColumn,
+  SortChangValue,
+  TableListReq,
+  Pager,
+  MenuItemType,
+  QRCodeResult
+} from 'rayyy-vue-table-components/types'
+```
+
+### 使用示例
+
+```typescript
+// 定義數據類型
+interface User extends Record<string, unknown> {
+  id: number
+  name: string
+  email: string
+  age: number
+  status: 'active' | 'inactive'
+}
+
+// 定義表格列配置
+const userColumns: TableColumn<User>[] = [
+  {
+    prop: 'id',
+    label: 'ID',
+    width: 80,
+    align: 'center'
+  },
+  {
+    prop: 'name',
+    label: '姓名',
+    width: 120
+  },
+  {
+    prop: 'email',
+    label: '郵箱',
+    width: 200
+  },
+  {
+    prop: 'age',
+    label: '年齡',
+    width: 80,
+    align: 'center',
+    sortable: true
+  },
+  {
+    prop: 'status',
+    label: '狀態',
+    width: 100,
+    align: 'center',
+    formatter: (row: User) => row.status === 'active' ? '啟用' : '停用'
+  }
+]
+
+// 表格數據
+const userData: User[] = [
+  { id: 1, name: '張三', email: 'zhangsan@example.com', age: 25, status: 'active' },
+  { id: 2, name: '李四', email: 'lisi@example.com', age: 30, status: 'inactive' }
+]
+
+// BaseTable Props 類型示例
+const tableProps: BaseTableProps<User> = {
+  loading: false,
+  data: userData,
+  columns: userColumns,
+  showSelection: true,
+  showSummary: true,
+  showOverFlowTooltip: true,
+  summaryMethod: ({ columns, data }) => {
+    return ['總計', '', '', data.reduce((sum, user) => sum + user.age, 0).toString(), '']
+  },
+  baseTableRowClassName: ({ row, rowIndex }) => {
+    return row.status === 'active' ? 'active-row' : 'inactive-row'
+  }
+}
+```
+
 ## API
 
 ### BaseTable Props

package/dist/index.d.ts

@@ -1 +1,6 @@
+export * from './src/index'
+export {}
+import VueTableComponents from './src/index'
+export default VueTableComponents
+export * from './src/index'
 export {}

package/dist/src/App.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+export default _default;

package/dist/src/components/BaseBtn.vue.d.ts

@@ -0,0 +1,35 @@
+type __VLS_Props = {
+    text?: string;
+    type?: 'default' | 'primary' | 'success' | 'warning' | 'info' | 'danger';
+    size?: 'default' | 'small' | 'large';
+    plain?: boolean;
+    class?: string;
+    disabled?: boolean;
+    textBtn?: boolean;
+    icon?: object;
+    link?: boolean;
+    isFill?: boolean;
+    loading?: boolean;
+    dataCy?: string;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    click: (evt: MouseEvent) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClick?: ((evt: MouseEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/src/components/BaseDialog.vue.d.ts

@@ -0,0 +1,36 @@
+type __VLS_Props = {
+    modelValue: boolean;
+    title?: string;
+    subTitle?: string;
+    beforeClose?: () => void;
+    customWidth?: string;
+    isWaring?: boolean;
+    isPrimary?: boolean;
+    bodyLoading?: boolean;
+    submitLoading?: boolean;
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        customHeader?(_: {}): any;
+        default?(_: {}): any;
+        customFooter?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    "update:modelValue": (data: boolean) => any;
+    "click:submit": () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((data: boolean) => any) | undefined;
+    "onClick:submit"?: (() => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/src/components/BaseTable.vue.d.ts

@@ -0,0 +1,41 @@
+import { VNode } from 'vue';
+import { TableColumnCtx } from 'element-plus';
+import { SortChangValue, TableColumn } from 'src/types';
+declare const _default: <T extends Record<string, unknown> = Record<string, unknown>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
+        readonly "onSelection-change"?: ((selection: T[]) => any) | undefined;
+        readonly "onCurrent-change"?: ((currentRow: T) => any) | undefined;
+        readonly "onColumn-sort-change"?: ((value: SortChangValue<T>) => any) | undefined;
+        readonly "onCell-click"?: ((column: TableColumn<T>, row: T) => any) | undefined;
+    } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onSelection-change" | "onCurrent-change" | "onColumn-sort-change" | "onCell-click"> & {
+        loading?: boolean;
+        data: T[];
+        columns: TableColumn<T>[];
+        showSelection?: boolean;
+        showSummary?: boolean;
+        showOverFlowTooltip?: boolean;
+        summaryMethod?: ((param: {
+            columns: TableColumnCtx<Record<string, unknown>>[];
+            data: T[];
+        }) => (string | VNode)[]) | undefined;
+        baseTableRowClassName?: ((data: {
+            row: T;
+            rowIndex: number;
+        }) => string) | undefined;
+    } & Partial<{}>> & import('vue').PublicProps;
+    expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
+    attrs: any;
+    slots: {};
+    emit: {
+        (e: "selection-change", selection: T[]): void;
+        (e: "current-change", currentRow: T): void;
+        (e: "cell-click", column: TableColumn<T>, row: T): void;
+        (e: "column-sort-change", value: SortChangValue<T>): void;
+    };
+}>) => import('vue').VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/src/components/index.d.ts

@@ -0,0 +1,7 @@
+export { default as BaseTable } from './BaseTable.vue';
+export { default as BaseBtn } from './BaseBtn.vue';
+export { default as BaseDialog } from './BaseDialog.vue';
+export type { BaseTableProps, BaseTableEmits, BaseTableInstance, BaseBtnProps, BaseBtnEmits, BaseBtnInstance, BaseDialogProps, BaseDialogEmits, BaseDialogInstance, PluginOptions, VueTableComponentsPlugin } from '../types/components';
+export type { default as BaseTableType } from './BaseTable.vue';
+export type { default as BaseBtnType } from './BaseBtn.vue';
+export type { default as BaseDialogType } from './BaseDialog.vue';

package/dist/src/global.d.ts

@@ -0,0 +1,18 @@
+declare module 'rayyy-vue-table-components' {
+  import type { App } from 'vue'
+  import type { DefineComponent } from 'vue'
+
+  export function install(app: App, options?: Record<string, unknown>): void
+
+  export const BaseTable: DefineComponent
+  export const BaseBtn: DefineComponent
+  export const BaseDialog: DefineComponent
+
+  export * from './types'
+
+  const plugin: {
+    install: typeof install
+  }
+
+  export default plugin
+}