element-plus-suite 0.0.0-stage → 0.0.2

package/README.md

@@ -1,3 +1,128 @@
-# Temporary Holding Version
+# Element Plus Suite
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Element Plus Suite 是基于 Element Plus 二次封装的组件库，开箱即用。可以显著地提升制作 CRUD 页面的效率，轻松搬砖。
+
+[文档](https://th74100.github.io/element-plus-suite/) · [GitHub](https://github.com/th74100/element-plus-suite)
+
+## 特性
+
+- **🚀 高效开发**：提供常用业务组件，减少重复代码
+- **🎯 灵活配置**：支持 JSON 配置式和模板式，满足不同场景需求
+- **💪 TypeScript**：提供完整的类型定义，更好的开发体验
+- **🔥 Element Plus**：基于 Element Plus，支持主题定制
+
+## 环境要求
+
+- Vue 3.2 或更高版本
+- Element Plus 2.0 或更高版本
+- 支持 ESM 的现代构建工具
+
+## 安装
+
+```bash
+npm install element-plus-suite
+```
+
+## 注册组件
+
+如果项目已经全局注册 Element Plus，可以直接注册组件库：
+
+```ts
+import { createApp } from 'vue'
+import ElementPlusSuite from 'element-plus-suite'
+import App from './App.vue'
+
+const app = createApp(App)
+
+app.use(ElementPlusSuite)
+app.mount('#app')
+```
+
+如果需要一起注册 Element Plus：
+
+```ts
+import { createApp } from 'vue'
+import ElementPlus from 'element-plus'
+import 'element-plus/dist/index.css'
+import ElementPlusSuite from 'element-plus-suite'
+import App from './App.vue'
+
+const app = createApp(App)
+
+app.use(ElementPlus)
+app.use(ElementPlusSuite)
+app.mount('#app')
+```
+
+也可以按需导入：
+
+```ts
+import { ElTablePro } from 'element-plus-suite'
+```
+
+## 快速开始
+
+```vue
+<script setup lang="ts">
+import { ElTablePro, type TableProColumn } from 'element-plus-suite'
+
+interface User {
+  id: number
+  name: string
+  email: string
+}
+
+const columns: TableProColumn<User>[] = [
+  { prop: 'name', label: '姓名', minWidth: 140 },
+  { prop: 'email', label: '邮箱', minWidth: 220 },
+]
+
+const dataSource: User[] = [
+  { id: 1, name: '林晓', email: 'linxiao@example.com' },
+  { id: 2, name: '陈默', email: 'chenmo@example.com' },
+]
+</script>
+
+<template>
+  <ElTablePro
+    :columns="columns"
+    :data="dataSource"
+    row-key="id"
+    :pagination="false"
+  />
+</template>
+```
+
+## 远程数据
+
+将 `data` 换成 `request` 即可接入远程数据。`request` 接收当前分页参数和取消信号，并返回统一的数据结构：
+
+```ts
+import type { TableProRequest } from 'element-plus-suite'
+
+const requestUsers: TableProRequest<User> = async ({
+  page,
+  pageSize,
+  signal,
+}) => {
+  const params = new URLSearchParams({
+    page: String(page ?? 1),
+    pageSize: String(pageSize ?? 20),
+  })
+  const response = await fetch(`/api/users?${params}`, { signal })
+  const payload = await response.json()
+
+  return {
+    data: payload.list,
+    total: payload.total,
+  }
+}
+```
+
+接口的原始返回结构在 `request` 内部适配即可，组件只接收 `data` 和 `total`。
+
+更多用法请查看[文档](https://th74100.github.io/element-plus-suite/)。
+
+## License
+
+MIT

package/dist/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("vue"),b=require("element-plus");function M(e,t){return e.flatMap(r=>{if(r.visible===!1)return[];const{visible:l,slot:c,headerSlot:s,render:u,headerRender:n,autoMerge:a,children:d,...m}=r,p={...m},g={},h=c?t[c]:void 0,y=s?t[s]:void 0;if(h?g.default=h:u&&(g.default=f=>u({row:f.row,column:f.column,$index:f.$index})),y?g.header=y:n&&(g.header=f=>n({column:f.column,$index:f.$index,store:f.store,_self:f._self})),d?.length){const f={default:()=>M(d,t)};return g.header&&(f.header=g.header),[o.h(b.ElTableColumn,p,f)]}return[o.h(b.ElTableColumn,p,Object.keys(g).length?g:void 0)]})}function z(e){return e.prop??e.property}function x(e,t){if(e===null||typeof e!="object")return;const r=e;if(Object.prototype.hasOwnProperty.call(r,t))return r[t];if(!t.includes("."))return;let l=r;for(const c of t.split(".")){if(l===null||typeof l!="object")return;l=l[c]}return l}function q(e){return e.flatMap(t=>t.visible===!1?[]:t.children?.length?q(t.children):[t])}function C(e,t=[]){const r=q(e),l=new Map;for(const n of r){const a=z(n);a&&!l.has(a)&&l.set(a,n)}const c=new Set,s=[],u=n=>{!n||c.has(n)||!l.has(n)||(c.add(n),s.push({key:n,getValue:a=>x(a,n)}))};return t.forEach(u),r.forEach(n=>{n.autoMerge&&u(z(n))}),s}function D(e,t){const r=e.length,l=new Map(t.map(u=>[u.key,Array.from({length:r},()=>1)]));if(!r||!t.length)return l;const c=e.map(u=>t.map(n=>n.getValue(u))),s=t.map(()=>0);for(let u=1;u<=r;u+=1){let n=!0;for(let a=0;a<t.length;a+=1){const d=u<r&&n&&c[u][a]===c[u-1][a];if(!d){const m=l.get(t[a].key),p=s[a],g=u-p;m[p]=g;for(let h=p+1;h<u;h+=1)m[h]=0;s[a]=u}n=d}}return l}function I(e,t="children"){return e.some(r=>{if(r===null||typeof r!="object")return!1;const l=r[t];return Array.isArray(l)&&l.length>0})}function L(e){const t=o.computed(()=>C(e.columns(),e.mergeFields())),r=o.computed(()=>t.value.length?e.tableRef.value?.store?.states?.data?.value??e.data.value:e.data.value),l=o.computed(()=>{if(!t.value.length||e.lazy())return new Map;const s=e.treeProps()?.children??"children",u=r.value;return I(u,s)?new Map:D(u,t.value)});return{spanMethod:o.computed(()=>{const s=e.userSpanMethod();return t.value.length?u=>{const n=s?.(u);if(n!==void 0)return n;const a=u.column.property,d=a?l.value.get(a)?.[u.rowIndex]:void 0;if(!(d===void 0||d===1))return{rowspan:d,colspan:1}}:s}),spanMap:l}}const T={page:1,pageSize:20,pageSizes:[10,20,50,100],layout:"total, sizes, prev, pager, next, jumper",background:!0};function _(e){return e===!1?null:{...T,...e===!0?{}:e??{}}}function O(e){const t=o.computed(()=>_(e())),r=o.shallowRef(t.value?.page??1),l=o.shallowRef(t.value?.pageSize??20);o.watch(()=>t.value?.page,n=>{n!==void 0&&(r.value=n)}),o.watch(()=>t.value?.pageSize,n=>{n!==void 0&&(l.value=n)});const c=o.computed(()=>t.value?r.value:null),s=o.computed(()=>t.value?l.value:null);function u(n){l.value=n,r.value=1}return{enabled:o.computed(()=>t.value!=null),config:t,currentPage:r,pageSize:l,requestPage:c,requestPageSize:s,setPageSize:u}}function j(e){const t=o.shallowRef(!1);let r=null,l=0;async function c(){const u=e.request();if(!u)return;r?.abort(),r=new AbortController;const n=++l,a=r;t.value=!0;try{const d=await u({page:e.page(),pageSize:e.pageSize(),signal:a.signal});if(a.signal.aborted||n!==l)return;e.onData?.(d),e.onLoaded?.(d)}catch(d){if(a.signal.aborted||n!==l)return;e.onError?.(d)}finally{n===l&&(t.value=!1)}}function s(){r?.abort(),l+=1,t.value=!1}return o.onBeforeUnmount(s),{loading:t,load:c,cancel:s}}const A=o.defineComponent({name:"ElTablePro",inheritAttrs:!1,props:{columns:{type:Array,default:()=>[]},request:{type:Function,default:void 0},pagination:{type:[Boolean,Object],default:!0},mergeFields:{type:Array,default:()=>[]},data:{type:Array,default:()=>[]},rowKey:{type:[String,Function],required:!0}},emits:{loaded:e=>!0,error:e=>!0},setup(e,{attrs:t,emit:r,expose:l}){const c=o.useSlots(),s=o.shallowRef(null),u=o.shallowRef([]),n=o.shallowRef(0),a=O(()=>e.pagination),d=o.computed(()=>{const i=e.rowKey;return typeof i=="function"?v=>String(i(v)):i}),{loading:m,load:p,cancel:g}=j({request:()=>e.request,page:()=>a.requestPage.value,pageSize:()=>a.requestPageSize.value,onData:i=>{u.value=i.data,n.value=i.total},onLoaded:i=>r("loaded",i),onError:i=>r("error",i)}),h=o.computed(()=>m.value),y=o.computed(()=>{if(e.request)return u.value;if(!e.data)return[];if(!a.config.value)return e.data;const i=(a.currentPage.value-1)*a.pageSize.value;return e.data.slice(i,i+a.pageSize.value)}),f=o.computed(()=>e.request?n.value:e.data?.length??0),{spanMethod:R}=L({tableRef:s,columns:()=>e.columns,data:y,mergeFields:()=>e.mergeFields,userSpanMethod:()=>t.spanMethod,treeProps:()=>t.treeProps,lazy:()=>!!t.lazy});async function S(i){i?.page!==void 0&&(a.currentPage.value=i.page),await p()}o.watch(()=>e.request,i=>{u.value=[],n.value=0,i?S():g()}),o.watch(()=>[a.requestPage.value,a.requestPageSize.value],()=>{e.request&&S()});const F=new Proxy({},{get(i,v){if(v==="reload")return S;const P=s.value;if(!P)return;const w=P[v];return typeof w=="function"?w.bind(P):w},has(i,v){return v==="reload"?!0:s.value!=null&&v in s.value}});return l(F),o.onMounted(()=>{e.request&&S()}),()=>{const i=o.h(b.ElTable,{...t,ref:s,data:y.value,rowKey:d.value,spanMethod:R.value},{default:()=>M(e.columns,c),empty:c.empty,append:c.append});return[o.withDirectives(i,[[b.vLoading,h.value]]),a.enabled.value?o.h(b.ElPagination,{currentPage:a.currentPage.value,pageSize:a.pageSize.value,total:f.value,pageSizes:[...a.config.value?.pageSizes??[]],layout:a.config.value?.layout,background:a.config.value?.background,"onUpdate:currentPage":v=>{a.currentPage.value=v},"onUpdate:pageSize":v=>{a.setPageSize(v)}}):null]}}}),k=[A];function E(e){k.forEach(t=>{const r=t.name;r&&e.component(r,t)})}const B={install:E};exports.ElTablePro=A;exports.TABLE_PRO_DEFAULT_PAGINATION=T;exports.default=B;exports.install=E;exports.normalizePagination=_;

package/dist/index.d.ts

@@ -0,0 +1,9 @@
+import { App } from 'vue';
+import { ElTablePro } from './table-pro';
+export * from './table-pro';
+export { ElTablePro };
+export declare function install(app: App): void;
+declare const _default: {
+    install: typeof install;
+};
+export default _default;

package/dist/index.js

@@ -0,0 +1,338 @@
+import { h as P, computed as g, shallowRef as m, watch as z, onBeforeUnmount as F, defineComponent as C, useSlots as D, onMounted as R, withDirectives as j } from "vue";
+import { ElTableColumn as q, ElTable as I, vLoading as L, ElPagination as k } from "element-plus";
+function T(e, t) {
+  return e.flatMap((r) => {
+    if (r.visible === !1) return [];
+    const {
+      visible: l,
+      slot: s,
+      headerSlot: o,
+      render: u,
+      headerRender: n,
+      autoMerge: a,
+      children: c,
+      ...y
+    } = r, p = { ...y }, f = {}, h = s ? t[s] : void 0, b = o ? t[o] : void 0;
+    if (h ? f.default = h : u && (f.default = (d) => u({
+      row: d.row,
+      column: d.column,
+      $index: d.$index
+    })), b ? f.header = b : n && (f.header = (d) => n({
+      column: d.column,
+      $index: d.$index,
+      store: d.store,
+      _self: d._self
+    })), c?.length) {
+      const d = {
+        default: () => T(c, t)
+      };
+      return f.header && (d.header = f.header), [P(q, p, d)];
+    }
+    return [
+      P(
+        q,
+        p,
+        Object.keys(f).length ? f : void 0
+      )
+    ];
+  });
+}
+function x(e) {
+  return e.prop ?? e.property;
+}
+function O(e, t) {
+  if (e === null || typeof e != "object") return;
+  const r = e;
+  if (Object.prototype.hasOwnProperty.call(r, t))
+    return r[t];
+  if (!t.includes(".")) return;
+  let l = r;
+  for (const s of t.split(".")) {
+    if (l === null || typeof l != "object") return;
+    l = l[s];
+  }
+  return l;
+}
+function _(e) {
+  return e.flatMap((t) => t.visible === !1 ? [] : t.children?.length ? _(t.children) : [t]);
+}
+function V(e, t = []) {
+  const r = _(e), l = /* @__PURE__ */ new Map();
+  for (const n of r) {
+    const a = x(n);
+    a && !l.has(a) && l.set(a, n);
+  }
+  const s = /* @__PURE__ */ new Set(), o = [], u = (n) => {
+    !n || s.has(n) || !l.has(n) || (s.add(n), o.push({
+      key: n,
+      getValue: (a) => O(a, n)
+    }));
+  };
+  return t.forEach(u), r.forEach((n) => {
+    n.autoMerge && u(x(n));
+  }), o;
+}
+function B(e, t) {
+  const r = e.length, l = new Map(
+    t.map((u) => [u.key, Array.from({ length: r }, () => 1)])
+  );
+  if (!r || !t.length) return l;
+  const s = e.map((u) => t.map((n) => n.getValue(u))), o = t.map(() => 0);
+  for (let u = 1; u <= r; u += 1) {
+    let n = !0;
+    for (let a = 0; a < t.length; a += 1) {
+      const c = u < r && n && s[u][a] === s[u - 1][a];
+      if (!c) {
+        const y = l.get(t[a].key), p = o[a], f = u - p;
+        y[p] = f;
+        for (let h = p + 1; h < u; h += 1)
+          y[h] = 0;
+        o[a] = u;
+      }
+      n = c;
+    }
+  }
+  return l;
+}
+function K(e, t = "children") {
+  return e.some((r) => {
+    if (r === null || typeof r != "object") return !1;
+    const l = r[t];
+    return Array.isArray(l) && l.length > 0;
+  });
+}
+function U(e) {
+  const t = g(
+    () => V(e.columns(), e.mergeFields())
+  ), r = g(() => t.value.length ? e.tableRef.value?.store?.states?.data?.value ?? e.data.value : e.data.value), l = g(() => {
+    if (!t.value.length || e.lazy())
+      return /* @__PURE__ */ new Map();
+    const o = e.treeProps()?.children ?? "children", u = r.value;
+    return K(u, o) ? /* @__PURE__ */ new Map() : B(u, t.value);
+  });
+  return {
+    spanMethod: g(() => {
+      const o = e.userSpanMethod();
+      return t.value.length ? (u) => {
+        const n = o?.(u);
+        if (n !== void 0) return n;
+        const a = u.column.property, c = a ? l.value.get(a)?.[u.rowIndex] : void 0;
+        if (!(c === void 0 || c === 1))
+          return { rowspan: c, colspan: 1 };
+      } : o;
+    }),
+    spanMap: l
+  };
+}
+const $ = {
+  page: 1,
+  pageSize: 20,
+  pageSizes: [10, 20, 50, 100],
+  layout: "total, sizes, prev, pager, next, jumper",
+  background: !0
+};
+function N(e) {
+  return e === !1 ? null : {
+    ...$,
+    ...e === !0 ? {} : e ?? {}
+  };
+}
+function G(e) {
+  const t = g(() => N(e())), r = m(t.value?.page ?? 1), l = m(t.value?.pageSize ?? 20);
+  z(
+    () => t.value?.page,
+    (n) => {
+      n !== void 0 && (r.value = n);
+    }
+  ), z(
+    () => t.value?.pageSize,
+    (n) => {
+      n !== void 0 && (l.value = n);
+    }
+  );
+  const s = g(
+    () => t.value ? r.value : null
+  ), o = g(
+    () => t.value ? l.value : null
+  );
+  function u(n) {
+    l.value = n, r.value = 1;
+  }
+  return {
+    // 模板直接依赖这个布尔值，避免访问可能为 null 的配置。
+    enabled: g(() => t.value != null),
+    config: t,
+    currentPage: r,
+    pageSize: l,
+    requestPage: s,
+    requestPageSize: o,
+    setPageSize: u
+  };
+}
+function H(e) {
+  const t = m(!1);
+  let r = null, l = 0;
+  async function s() {
+    const u = e.request();
+    if (!u) return;
+    r?.abort(), r = new AbortController();
+    const n = ++l, a = r;
+    t.value = !0;
+    try {
+      const c = await u({
+        page: e.page(),
+        pageSize: e.pageSize(),
+        signal: a.signal
+      });
+      if (a.signal.aborted || n !== l)
+        return;
+      e.onData?.(c), e.onLoaded?.(c);
+    } catch (c) {
+      if (a.signal.aborted || n !== l)
+        return;
+      e.onError?.(c);
+    } finally {
+      n === l && (t.value = !1);
+    }
+  }
+  function o() {
+    r?.abort(), l += 1, t.value = !1;
+  }
+  return F(o), { loading: t, load: s, cancel: o };
+}
+const J = /* @__PURE__ */ C({
+  name: "ElTablePro",
+  inheritAttrs: !1,
+  props: {
+    columns: {
+      type: Array,
+      default: () => []
+    },
+    request: {
+      type: Function,
+      default: void 0
+    },
+    pagination: {
+      type: [Boolean, Object],
+      default: !0
+    },
+    mergeFields: {
+      type: Array,
+      default: () => []
+    },
+    data: {
+      type: Array,
+      default: () => []
+    },
+    rowKey: {
+      type: [String, Function],
+      required: !0
+    }
+  },
+  emits: {
+    loaded: (e) => !0,
+    error: (e) => !0
+  },
+  setup(e, {
+    attrs: t,
+    emit: r,
+    expose: l
+  }) {
+    const s = D(), o = m(null), u = m([]), n = m(0), a = G(() => e.pagination), c = g(() => {
+      const i = e.rowKey;
+      return typeof i == "function" ? (v) => String(i(v)) : i;
+    }), {
+      loading: y,
+      load: p,
+      cancel: f
+    } = H({
+      request: () => e.request,
+      page: () => a.requestPage.value,
+      pageSize: () => a.requestPageSize.value,
+      onData: (i) => {
+        u.value = i.data, n.value = i.total;
+      },
+      onLoaded: (i) => r("loaded", i),
+      onError: (i) => r("error", i)
+    }), h = g(() => y.value), b = g(() => {
+      if (e.request) return u.value;
+      if (!e.data) return [];
+      if (!a.config.value) return e.data;
+      const i = (a.currentPage.value - 1) * a.pageSize.value;
+      return e.data.slice(i, i + a.pageSize.value);
+    }), d = g(() => e.request ? n.value : e.data?.length ?? 0), {
+      spanMethod: A
+    } = U({
+      tableRef: o,
+      columns: () => e.columns,
+      data: b,
+      mergeFields: () => e.mergeFields,
+      userSpanMethod: () => t.spanMethod,
+      treeProps: () => t.treeProps,
+      lazy: () => !!t.lazy
+    });
+    async function S(i) {
+      i?.page !== void 0 && (a.currentPage.value = i.page), await p();
+    }
+    z(() => e.request, (i) => {
+      u.value = [], n.value = 0, i ? S() : f();
+    }), z(() => [a.requestPage.value, a.requestPageSize.value], () => {
+      e.request && S();
+    });
+    const E = new Proxy({}, {
+      get(i, v) {
+        if (v === "reload") return S;
+        const M = o.value;
+        if (!M) return;
+        const w = M[v];
+        return typeof w == "function" ? w.bind(M) : w;
+      },
+      has(i, v) {
+        return v === "reload" ? !0 : o.value != null && v in o.value;
+      }
+    });
+    return l(E), R(() => {
+      e.request && S();
+    }), () => {
+      const i = P(I, {
+        ...t,
+        ref: o,
+        data: b.value,
+        rowKey: c.value,
+        spanMethod: A.value
+      }, {
+        default: () => T(e.columns, s),
+        empty: s.empty,
+        append: s.append
+      });
+      return [j(i, [[L, h.value]]), a.enabled.value ? P(k, {
+        currentPage: a.currentPage.value,
+        pageSize: a.pageSize.value,
+        total: d.value,
+        pageSizes: [...a.config.value?.pageSizes ?? []],
+        layout: a.config.value?.layout,
+        background: a.config.value?.background,
+        "onUpdate:currentPage": (v) => {
+          a.currentPage.value = v;
+        },
+        "onUpdate:pageSize": (v) => {
+          a.setPageSize(v);
+        }
+      }) : null];
+    };
+  }
+}), Q = [J];
+function W(e) {
+  Q.forEach((t) => {
+    const r = t.name;
+    r && e.component(r, t);
+  });
+}
+const Z = { install: W };
+export {
+  J as ElTablePro,
+  $ as TABLE_PRO_DEFAULT_PAGINATION,
+  Z as default,
+  W as install,
+  N as normalizePagination
+};

package/dist/shared/utils.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/table-pro/composables/use-table-merge.d.ts

@@ -0,0 +1,19 @@
+import { ComputedRef, ShallowRef } from 'vue';
+import { TableProColumn, TableProSpanMethodParams, TableProTableInstance, TableProTableProps } from '../types';
+interface UseTableMergeOptions<Row> {
+    tableRef: ShallowRef<TableProTableInstance | null>;
+    columns: () => TableProColumn<Row>[];
+    data: ComputedRef<Row[]>;
+    mergeFields: () => string[];
+    userSpanMethod: () => TableProTableProps['spanMethod'];
+    treeProps: () => TableProTableProps['treeProps'];
+    lazy: () => boolean;
+}
+export declare function useTableMerge<Row>(options: UseTableMergeOptions<Row>): {
+    spanMethod: ComputedRef<import('..').TableProSpanMethod<any> | ((params: TableProSpanMethodParams<Row>) => {
+        rowspan: number;
+        colspan: number;
+    } | number[] | undefined) | undefined>;
+    spanMap: ComputedRef<Map<string, number[]>>;
+};
+export {};

package/dist/table-pro/composables/use-table-pagination.d.ts

@@ -0,0 +1,14 @@
+import { TableProPagination } from '../types';
+/**
+ * 管理 TablePro 的分页状态。
+ * false 表示关闭分页，此时传给 request 的 page/pageSize 都是 null。
+ */
+export declare function useTablePagination(pagination: () => boolean | TableProPagination | undefined): {
+    enabled: import('vue').ComputedRef<boolean>;
+    config: import('vue').ComputedRef<import('..').ResolvedTableProPagination | null>;
+    currentPage: import('vue').ShallowRef<number, number>;
+    pageSize: import('vue').ShallowRef<number, number>;
+    requestPage: import('vue').ComputedRef<number | null>;
+    requestPageSize: import('vue').ComputedRef<number | null>;
+    setPageSize: (size: number) => void;
+};

package/dist/table-pro/composables/use-table-request.d.ts

@@ -0,0 +1,20 @@
+import { TableProRequest, TableProRequestResult } from '../types';
+interface UseTableRequestOptions<Row> {
+    request: () => TableProRequest<Row> | undefined;
+    page: () => number | null;
+    pageSize: () => number | null;
+    onLoaded?: (result: TableProRequestResult<Row>) => void;
+    onError?: (error: unknown) => void;
+    onData?: (result: TableProRequestResult<Row>) => void;
+}
+/**
+ * 管理远程请求生命周期。
+ * 同时使用 AbortController 和递增 requestId，
+ * 即使调用方没有透传 signal，旧请求也不会覆盖新数据。
+ */
+export declare function useTableRequest<Row>(options: UseTableRequestOptions<Row>): {
+    loading: import('vue').ShallowRef<boolean, boolean>;
+    load: () => Promise<void>;
+    cancel: () => void;
+};
+export {};

package/dist/table-pro/index.d.ts

@@ -0,0 +1,3 @@
+export { default as ElTablePro } from './index.vue';
+export type { TableProColumn, TableProColumnContext, TableProColumnHeaderRenderScope, TableProColumnRenderScope, TableProInstance, TableProOwnInstance, TableProOwnProps, TableProPagination, TableProProps, TableProRequest, TableProRequestParams, TableProRequestResult, TableProSpanMethod, TableProSpanMethodParams, TableProSpanMethodResult, TableProTableInstance, TableProTableProps, TableProTreeProps, ResolvedTableProPagination, } from './types';
+export { TABLE_PRO_DEFAULT_PAGINATION, normalizePagination, } from './types';

package/dist/table-pro/index.vue.d.ts

@@ -0,0 +1,68 @@
+import { PropType } from 'vue';
+import { TableProColumn, TableProPagination, TableProRequest, TableProRequestResult } from './types';
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    columns: {
+        type: PropType<TableProColumn<any>[]>;
+        default: () => never[];
+    };
+    request: {
+        type: PropType<TableProRequest<any>>;
+        default: undefined;
+    };
+    pagination: {
+        type: PropType<boolean | TableProPagination>;
+        default: boolean;
+    };
+    mergeFields: {
+        type: PropType<string[]>;
+        default: () => never[];
+    };
+    data: {
+        type: PropType<any[]>;
+        default: () => never[];
+    };
+    rowKey: {
+        type: PropType<string | ((row: any) => string | number)>;
+        required: true;
+    };
+}>, () => (import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
+    [key: string]: any;
+}> | null)[], {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    loaded: (_result: TableProRequestResult<any>) => true;
+    error: (_error: unknown) => true;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    columns: {
+        type: PropType<TableProColumn<any>[]>;
+        default: () => never[];
+    };
+    request: {
+        type: PropType<TableProRequest<any>>;
+        default: undefined;
+    };
+    pagination: {
+        type: PropType<boolean | TableProPagination>;
+        default: boolean;
+    };
+    mergeFields: {
+        type: PropType<string[]>;
+        default: () => never[];
+    };
+    data: {
+        type: PropType<any[]>;
+        default: () => never[];
+    };
+    rowKey: {
+        type: PropType<string | ((row: any) => string | number)>;
+        required: true;
+    };
+}>> & Readonly<{
+    onError?: ((_error: unknown) => any) | undefined;
+    onLoaded?: ((_result: TableProRequestResult<any>) => any) | undefined;
+}>, {
+    data: any[];
+    columns: TableProColumn<any>[];
+    request: TableProRequest<any>;
+    pagination: boolean | TableProPagination;
+    mergeFields: string[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/table-pro/render-columns.d.ts

@@ -0,0 +1,9 @@
+import { Slots, VNode } from 'vue';
+import { TableProColumn } from './types';
+/**
+ * 把列配置转换成 ElTableColumn 节点。
+ *
+ * 注意：ElTable 依赖直接子节点注册列，所以调用方必须把返回值
+ * 直接放进 ElTable 的默认插槽，不能再包一层组件。
+ */
+export declare function renderTableColumns(columns: TableProColumn<any>[], slots: Slots): VNode[];

package/dist/table-pro/types.d.ts

@@ -0,0 +1,189 @@
+import { Ref, VNode, VNodeChild } from 'vue';
+/**
+ * 表格列在运行时由 Element Plus 提供。
+ * 这里只声明组件库会用到的公共字段，其余字段保持开放
+ */
+export interface TableProColumnContext<Row = any> {
+    id?: string;
+    realWidth?: number | null;
+    type?: string;
+    label?: string;
+    className?: string;
+    labelClassName?: string;
+    property?: string;
+    prop?: string;
+    width?: string | number;
+    minWidth?: string | number;
+    renderHeader?: (data: any) => VNode;
+    sortable?: boolean | string;
+    sortMethod?: (a: Row, b: Row) => number;
+    sortBy?: string | ((row: Row, index: number, array?: Row[]) => string) | string[];
+    formatter?: (row: Row, column: TableProColumnContext<Row>, cellValue: any, index: number) => string | VNode;
+    filters?: {
+        text: string;
+        value: string;
+    }[];
+    filteredValue?: string[];
+    children?: TableProColumnContext<Row>[];
+    [key: string]: any;
+}
+export interface TableProTableStore {
+    states?: {
+        data?: Ref<any[]>;
+        columns?: Ref<TableProColumnContext<any>[]>;
+    };
+    [key: string]: any;
+}
+/**
+ * 使用 Proxy 暴露 ElTable 实例能力。
+ */
+export interface TableProTableInstance {
+    store: TableProTableStore;
+    setCurrentRow: (row: any) => void;
+    getSelectionRows?: () => any;
+    toggleRowSelection: (row: any, selected?: boolean) => void;
+    clearSelection: () => void;
+    clearFilter: (columnKeys?: string | string[]) => void;
+    toggleAllSelection: () => void;
+    toggleRowExpansion: (row: any, expanded?: boolean) => void;
+    clearSort: () => void;
+    doLayout: () => void;
+    sort: (prop: string, order: string) => void;
+    [key: string]: any;
+}
+export interface TableProTreeProps {
+    hasChildren?: string;
+    children?: string;
+    [key: string]: any;
+}
+export interface TableProSpanMethodParams<Row = any> {
+    row: Row;
+    rowIndex: number;
+    column: TableProColumnContext<Row>;
+    columnIndex: number;
+}
+export type TableProSpanMethodResult = number[] | {
+    rowspan: number;
+    colspan: number;
+} | undefined;
+export type TableProSpanMethod<Row = any> = (params: TableProSpanMethodParams<Row>) => TableProSpanMethodResult;
+/** TablePro 使用的 ElTable 公共属性；其余原生属性通过开放索引接收。 */
+export interface TableProTableProps {
+    spanMethod?: TableProSpanMethod;
+    treeProps?: TableProTreeProps;
+    [key: string]: any;
+}
+export interface TableProRequestParams {
+    page: number | null;
+    pageSize: number | null;
+    signal: AbortSignal;
+}
+export interface TableProRequestResult<Row> {
+    data: Row[];
+    total: number;
+}
+export interface TableProColumnHeaderRenderScope<Row extends Record<string, any>> {
+    column: TableProColumnContext<Row>;
+    $index: number;
+    store: TableProTableInstance['store'];
+    _self: unknown;
+}
+export interface TableProColumnRenderScope<Row> {
+    row: Row;
+    column: TableProColumnContext<any>;
+    $index: number;
+}
+export type TableProRequest<Row> = (params: TableProRequestParams) => Promise<TableProRequestResult<Row>>;
+type ElTableColumnProps = {
+    type?: string;
+    label?: string;
+    className?: string;
+    labelClassName?: string;
+    property?: string;
+    prop?: string;
+    width?: string | number;
+    minWidth?: string | number;
+    renderHeader?: (data: any) => VNode;
+    sortable?: boolean | string;
+    sortMethod?: (a: any, b: any) => number;
+    sortBy?: string | ((row: any, index: number, array?: any[]) => string) | string[];
+    resizable?: boolean;
+    columnKey?: string;
+    align?: string;
+    headerAlign?: string;
+    showOverflowTooltip?: boolean | Record<string, any>;
+    tooltipFormatter?: (data: any) => string;
+    fixed?: boolean | string;
+    formatter?: (row: any, column: TableProColumnContext<any>, cellValue: any, index: number) => string | VNode;
+    selectable?: (row: any, index: number) => boolean;
+    reserveSelection?: boolean;
+    filterMethod?: (value: string, row: any, column: TableProColumnContext<any>) => void;
+    filteredValue?: string[];
+    filters?: {
+        text: string;
+        value: string;
+    }[];
+    filterPlacement?: string;
+    filterMultiple?: boolean;
+    filterClassName?: string;
+    index?: number | ((index: number) => number);
+    sortOrders?: ('ascending' | 'descending' | null)[];
+    [key: string]: any;
+};
+export interface TableProColumnExtra<Row> {
+    visible?: boolean;
+    slot?: string;
+    headerSlot?: string;
+    /** 使用渲染函数生成单元格内容 */
+    render?: (scope: TableProColumnRenderScope<Row>) => VNodeChild;
+    /** 使用渲染函数生成表头内容 */
+    headerRender?: (scope: TableProColumnHeaderRenderScope<Row & Record<string, any>>) => VNodeChild;
+    /** 当前页内连续相同值时自动合并单元格 */
+    autoMerge?: boolean;
+    children?: TableProColumn<Row>[];
+}
+export type TableProColumn<Row> = Omit<ElTableColumnProps, 'prop' | 'children' | 'formatter'> & TableProColumnExtra<Row> & {
+    prop?: string;
+    formatter?: (row: Row, column: TableProColumnContext<any>, cellValue: unknown, index: number) => string | VNode | undefined;
+};
+export interface TableProPagination {
+    page?: number;
+    pageSize?: number;
+    pageSizes?: number[];
+    layout?: string;
+    background?: boolean;
+}
+export interface TableProOwnProps<Row> {
+    columns?: TableProColumn<Row>[];
+    request?: TableProRequest<Row>;
+    pagination?: boolean | TableProPagination;
+    /** 按数组顺序逐级合并连续同值字段 */
+    mergeFields?: string[];
+}
+type ElTableProps = Partial<TableProTableProps>;
+export type TableProProps<Row extends Record<string, any>> = Omit<ElTableProps, 'data' | 'rowKey'> & TableProOwnProps<Row> & {
+    data?: Row[];
+    rowKey: (keyof Row & string) | ((row: Row) => string | number);
+};
+export interface TableProOwnInstance {
+    reload: (options?: {
+        page?: number;
+    }) => Promise<void>;
+}
+export type TableProInstance = TableProOwnInstance & TableProTableInstance;
+export declare const TABLE_PRO_DEFAULT_PAGINATION: {
+    readonly page: 1;
+    readonly pageSize: 20;
+    readonly pageSizes: readonly [10, 20, 50, 100];
+    readonly layout: "total, sizes, prev, pager, next, jumper";
+    readonly background: true;
+};
+export type ResolvedTableProPagination = {
+    page: number;
+    pageSize: number;
+    pageSizes: readonly number[];
+    layout: string;
+    background: boolean;
+};
+export declare function normalizePagination(pagination: boolean | TableProPagination | undefined): ResolvedTableProPagination | null;
+export {};

package/dist/table-pro/utils/merge-cells.d.ts

@@ -0,0 +1,14 @@
+import { TableProColumn } from '../types';
+export interface TableProMergeField<Row> {
+    key: string;
+    getValue: (row: Row) => unknown;
+}
+/**
+ * mergeFields 的顺序决定多级合并层级；autoMerge 列按列顺序补充。
+ */
+export declare function resolveMergeFields<Row>(columns: TableProColumn<Row>[], mergeFields?: string[]): TableProMergeField<Row>[];
+/**
+ * 只合并连续同值。后一个字段必须处在前一个字段的同一组内。
+ */
+export declare function calculateRowSpans<Row>(dataSource: readonly Row[], fields: TableProMergeField<Row>[]): Map<string, number[]>;
+export declare function hasTreeRows(dataSource: readonly unknown[], childrenField?: string): boolean;

package/package.json

@@ -1,6 +1,32 @@
-{
-  "name": "element-plus-suite",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+{
+  "name": "element-plus-suite",
+  "version": "0.0.2",
+  "description": "Unofficial enhancement components for Element Plus",
+  "type": "module",
+  "sideEffects": false,
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "scripts": {
+    "build": "vite build",
+    "typecheck": "vue-tsc --noEmit"
+  },
+  "peerDependencies": {
+    "element-plus": "^2.0.0",
+    "vue": "^3.2.0"
+  },
+  "devDependencies": {
+    "element-plus": "^2.11.7",
+    "vue": "^3.5.24"
+  }
+}