@vtable-guild/vtable-guild 2.2.1 → 2.3.0

package/dist/table/src/components/TableBody.mjs

@@ -0,0 +1,124 @@
+import { defineComponent as g, inject as x, computed as h, createVNode as u } from "vue";
+import "../../../core/src/utils/tv.mjs";
+import E from "./TableRow.mjs";
+import T from "./TableCell.mjs";
+import v from "./TableEmpty.mjs";
+import { TABLE_CONTEXT_KEY as k } from "../context.mjs";
+import { resolveBodyCell as K } from "../utils/cell.mjs";
+import { getByDataIndex as N } from "../composables/useColumns.mjs";
+import { cn as p } from "tailwind-variants";
+function R(e) {
+  return Number.isFinite(e) ? e <= 0 ? 0 : Math.floor(e) : 1;
+}
+const j = /* @__PURE__ */ g({
+  name: "TableBody",
+  props: {
+    dataSource: {
+      type: Array,
+      required: !0
+    },
+    columns: {
+      type: Array,
+      required: !0
+    },
+    tbodyClass: {
+      type: String,
+      required: !0
+    },
+    rowClass: {
+      type: String,
+      required: !0
+    },
+    tdClass: {
+      type: String,
+      required: !0
+    },
+    emptyClass: {
+      type: String,
+      required: !0
+    },
+    bodyCellEllipsisClass: {
+      type: String,
+      required: !0
+    },
+    rowKey: {
+      type: [String, Function],
+      default: void 0
+    }
+  },
+  setup(e) {
+    const l = x(k, {});
+    function S(t, n) {
+      return typeof e.rowKey == "function" ? e.rowKey(t) : typeof e.rowKey == "string" && e.rowKey in t ? t[e.rowKey] : n;
+    }
+    const b = h(() => {
+      const t = /* @__PURE__ */ new Set();
+      return e.dataSource.map((n, o) => {
+        const s = [];
+        return e.columns.forEach((m, r) => {
+          const c = `${o}:${r}`;
+          if (t.has(c)) return;
+          const y = K({
+            text: N(n, m.dataIndex),
+            record: n,
+            rowIndex: o,
+            column: m,
+            bodyCell: l.bodyCell,
+            transformCellText: l.transformCellText
+          }), C = R(y.colSpan), d = R(y.rowSpan);
+          if (C === 0 || d === 0) return;
+          const f = Math.min(e.dataSource.length, o + d), w = Math.min(e.columns.length, r + C);
+          for (let i = o; i < f; i += 1)
+            for (let a = r; a < w; a += 1)
+              i === o && a === r || t.add(`${i}:${a}`);
+          s.push({
+            column: m,
+            colIndex: r,
+            resolvedCell: {
+              ...y,
+              colSpan: C,
+              rowSpan: d
+            }
+          });
+        }), s;
+      });
+    });
+    return () => u("tbody", {
+      class: e.tbodyClass
+    }, [e.dataSource.length > 0 ? e.dataSource.map((t, n) => {
+      const o = S(t, n), s = l.expandable?.(), m = l.isExpanded?.(o) ?? !1, r = s?.expandRowByClick ?? !1, c = l.isRowExpandable?.(t) ?? !1, C = l.treeFlattenData?.value?.find((a) => a.record === t)?.level ?? 0, d = l.getRowClassName?.(t, n), f = l.getRowProps?.(t, n), w = typeof s?.expandedRowClassName == "function" ? s.expandedRowClassName(t, n, C) : s?.expandedRowClassName, i = r ? () => {
+        c && l.toggleExpand?.(t, n);
+      } : void 0;
+      return [u(E, {
+        key: o,
+        rowClass: p(e.rowClass, d) ?? "",
+        rowProps: f,
+        onClick: i
+      }, {
+        default: () => [b.value[n]?.map((a) => u(T, {
+          key: a.column.key ?? String(a.column.dataIndex ?? a.colIndex),
+          record: t,
+          rowIndex: n,
+          column: a.column,
+          colIndex: a.colIndex,
+          resolvedCell: a.resolvedCell,
+          tdClass: e.tdClass,
+          bodyCellEllipsisClass: e.bodyCellEllipsisClass
+        }, null))]
+      }), m && s?.expandedRowRender && u("tr", {
+        key: `${o}-expanded`,
+        class: p(e.rowClass, d, l.subThemeSlots?.expandedRow(), w)
+      }, [u("td", {
+        colspan: e.columns.length,
+        class: p(e.tdClass, l.subThemeSlots?.expandedRowCell())
+      }, [s.expandedRowRender(t, n, 0, !0)])])];
+    }) : u(v, {
+      colSpan: e.columns.length || 1,
+      emptyClass: e.emptyClass,
+      tdClass: e.tdClass
+    }, null)]);
+  }
+});
+export {
+  j as default
+};

package/dist/table/src/components/TableCell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableCell.d.ts","sourceRoot":"","sources":["../../../../../table/src/components/TableCell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA0C,KAAK,QAAQ,EAAmB,MAAM,KAAK,CAAA;AAG5F,OAAO,KAAK,EAAuB,UAAU,EAAE,MAAM,UAAU,CAAA;AAI/D,OAAO,EAKL,KAAK,gBAAgB,EACtB,MAAM,eAAe,CAAA;;;cAQQ,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;;;;;;;;cAEjC,QAAQ,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;;;;;;;;cAGrD,QAAQ,CAAC,gBAAgB,CAAC;;;;;;;;;;;;;cALlB,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;;;;;;;;cAEjC,QAAQ,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;;;;;;;;cAGrD,QAAQ,CAAC,gBAAgB,CAAC;;;;;;;;;;;;;;AARhD,wBA8aE"}
+{"version":3,"file":"TableCell.d.ts","sourceRoot":"","sources":["../../../../../table/src/components/TableCell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA0C,KAAK,QAAQ,EAAmB,MAAM,KAAK,CAAA;AAG5F,OAAO,KAAK,EAAuB,UAAU,EAAE,MAAM,UAAU,CAAA;AAK/D,OAAO,EAKL,KAAK,gBAAgB,EACtB,MAAM,eAAe,CAAA;;;cAQQ,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;;;;;;;;cAEjC,QAAQ,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;;;;;;;;cAGrD,QAAQ,CAAC,gBAAgB,CAAC;;;;;;;;;;;;;cALlB,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;;;;;;;;cAEjC,QAAQ,CAAC,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;;;;;;;;cAGrD,QAAQ,CAAC,gBAAgB,CAAC;;;;;;;;;;;;;;AARhD,wBAsZE"}

package/dist/table/src/components/TableCell.mjs

@@ -0,0 +1,222 @@
+import { defineComponent as J, inject as Q, ref as B, computed as c, createVNode as r, mergeProps as L } from "vue";
+import "../../../core/src/utils/tv.mjs";
+import U from "../../../core/src/components/Tooltip.mjs";
+import { TABLE_CONTEXT_KEY as Z } from "../context.mjs";
+import { getByDataIndex as ee, getColumnKey as O } from "../composables/useColumns.mjs";
+import { useFixedColumnStyle as le } from "../composables/useFixedColumnStyle.mjs";
+import { resolveBodyCell as ne, omitCellProps as P, isRenderedCell as te, getEllipsisConfig as oe } from "../utils/cell.mjs";
+import ae from "./SelectionCheckbox.mjs";
+import se from "./SelectionRadio.mjs";
+import N from "./ExpandIcon.mjs";
+import { isInHoverRange as re } from "../composables/useHoverState.mjs";
+import { TABLE_ALIGN_CLASSES as ce } from "../../../theme/src/presets/antdv/table.mjs";
+import { cn as m } from "tailwind-variants";
+const Ie = /* @__PURE__ */ J({
+  name: "TableCell",
+  props: {
+    record: {
+      type: Object,
+      required: !0
+    },
+    rowIndex: {
+      type: Number,
+      required: !0
+    },
+    column: {
+      type: Object,
+      required: !0
+    },
+    colIndex: {
+      type: Number,
+      required: !0
+    },
+    resolvedCell: {
+      type: Object,
+      default: void 0
+    },
+    tdClass: {
+      type: String,
+      required: !0
+    },
+    bodyCellEllipsisClass: {
+      type: String,
+      required: !0
+    }
+  },
+  setup(e) {
+    const l = Q(Z, {}), H = B(null), I = B(!1), o = c(() => e.resolvedCell ?? ne({
+      text: ee(e.record, e.column.dataIndex),
+      record: e.record,
+      rowIndex: e.rowIndex,
+      column: e.column,
+      bodyCell: l.bodyCell,
+      transformCellText: l.transformCellText
+    })), D = c(() => {
+      if (!e.column.fixed) return null;
+      const n = O(e.column) ?? e.colIndex;
+      return l.fixedOffsets?.value?.get(n) ?? null;
+    }), {
+      fixedStyle: W,
+      fixedClass: T
+    } = le({
+      fixedInfo: () => D.value
+    }), i = c(() => l.getSelectionState?.(e.record, e.rowIndex) ?? {
+      checked: !1,
+      indeterminate: !1,
+      disabled: !1
+    }), f = c(() => i.value.checked), _ = c(() => re(e.rowIndex, o.value.rowSpan ?? 1, l.hoverRange?.value ?? null));
+    function S() {
+      if (!l.hoverable?.value) return;
+      const n = Math.max(1, o.value.rowSpan ?? 1);
+      l.setHoverRange?.(e.rowIndex, e.rowIndex + n - 1);
+    }
+    function h() {
+      l.hoverable?.value && l.clearHoverRange?.();
+    }
+    function j(n) {
+      return (t) => {
+        S(), typeof n == "function" && n(t);
+      };
+    }
+    function A(n) {
+      return (t) => {
+        h(), typeof n == "function" && n(t);
+      };
+    }
+    const E = c(() => ({
+      ...P(o.value.renderCellProps),
+      ...P(o.value.customCellProps)
+    })), z = c(() => {
+      const n = e.column.align ? ce[e.column.align] : "", t = l.subThemeSlots, a = _.value && l.hoverable?.value, x = l.isColumnSorted?.(e.column) && t ? t.tdSorted() : "", R = f.value && t ? m(t.tdSelected(), a ? t.tdRowSelectedHover() : "") : "", k = a && t && !f.value ? t.tdRowHover() : "";
+      return m(e.tdClass, n, e.column.className, o.value.customCellProps?.class, o.value.customCellProps?.className, o.value.renderCellProps?.class, o.value.renderCellProps?.className, x, R, k, T.value);
+    }), w = c(() => {
+      const n = {}, a = l.columnWidths?.[String(O(e.column) ?? e.colIndex)] ?? e.column.width;
+      return a && (n.width = typeof a == "number" ? `${a}px` : a), {
+        ...n,
+        ...W.value ?? {},
+        ...o.value.customCellProps?.style ?? {},
+        ...o.value.renderCellProps?.style ?? {}
+      };
+    }), K = c(() => l.isTreeData?.value ? l.getFlattenRow?.(e.record) ?? null : null), F = c(() => l.isTreeData?.value && e.column.key !== "__vtg_selection__" && e.column.key !== "__vtg_expand__" && e.colIndex <= 2 ? (() => {
+      const n = l.rowSelection?.(), t = l.expandable?.();
+      let a = 0;
+      return n && (a += 1), t && t.showExpandColumn !== !1 && (a += 1), e.colIndex === a;
+    })() : !1);
+    function $(n) {
+      return {
+        ...w.value,
+        ...n ?? {}
+      };
+    }
+    function G() {
+      const n = H.value, t = o.value.tooltipText;
+      I.value = !!(n && t && (n.scrollWidth > n.clientWidth || n.scrollHeight > n.clientHeight));
+    }
+    function V() {
+      I.value = !1;
+    }
+    return () => {
+      if (o.value.colSpan === 0 || o.value.rowSpan === 0)
+        return null;
+      const n = o.value.colSpan !== 1 ? o.value.colSpan : void 0, t = o.value.rowSpan !== 1 ? o.value.rowSpan : void 0;
+      if (e.column.key === "__vtg_selection__") {
+        const v = l.rowSelection?.(), C = v?.type === "radio" ? r(se, {
+          checked: i.value.checked,
+          disabled: i.value.disabled,
+          onChange: (d) => l.toggleRow?.(e.record, e.rowIndex, d)
+        }, null) : r(ae, {
+          checked: i.value.checked,
+          indeterminate: i.value.indeterminate,
+          disabled: i.value.disabled,
+          onChange: (d, y) => l.toggleRow?.(e.record, e.rowIndex, y)
+        }, null);
+        let u = C, s;
+        if (v?.renderCell) {
+          const d = v.renderCell(i.value.checked, e.record, e.rowIndex, C);
+          te(d) ? (u = d.children, s = d.props) : u = d;
+        }
+        const g = !!v?.renderCell, b = _.value && l.hoverable?.value, M = m(e.tdClass, l.vtgClass?.(g ? "text-center" : "text-center leading-[0]"), e.column.className, s?.class, s?.className, f.value && l.subThemeSlots ? m(l.subThemeSlots.tdSelected(), b ? l.subThemeSlots.tdRowSelectedHover() : "") : b && l.subThemeSlots ? l.subThemeSlots.tdRowHover() : "", T.value);
+        return r("td", L(P(s), {
+          class: M,
+          style: $(s?.style),
+          colspan: n,
+          rowspan: t,
+          onMouseenter: S,
+          onMouseleave: h
+        }), [u]);
+      }
+      if (e.column.key === "__vtg_expand__") {
+        const v = l.expandable?.(), p = l.getRowKey?.(e.record, e.rowIndex), C = p !== void 0 && (l.isExpanded?.(p) ?? !1), u = l.isRowExpandable?.(e.record) ?? !1, s = l.subThemeSlots, g = _.value && l.hoverable?.value, b = l.isColumnSorted?.(e.column) && s ? s.tdSorted() : "", M = f.value && s ? m(s.tdSelected(), g ? s.tdRowSelectedHover() : "") : "", d = g && s && !f.value ? s.tdRowHover() : "", y = m(e.tdClass, l.vtgClass?.("text-center"), e.column.className, b, M, d, T.value);
+        return v?.expandIcon ? r("td", {
+          class: y,
+          style: w.value,
+          colspan: n,
+          rowspan: t,
+          onMouseenter: S,
+          onMouseleave: h
+        }, [v.expandIcon({
+          expanded: C,
+          record: e.record,
+          expandable: u,
+          onExpand: (de, Y) => {
+            Y.stopPropagation(), u && l.toggleExpand?.(e.record, e.rowIndex);
+          }
+        })]) : r("td", {
+          class: y,
+          style: w.value,
+          colspan: n,
+          rowspan: t,
+          onMouseenter: S,
+          onMouseleave: h
+        }, [r(N, {
+          expanded: C,
+          expandable: u,
+          variant: "row",
+          onClick: () => {
+            u && l.toggleExpand?.(e.record, e.rowIndex);
+          }
+        }, null)]);
+      }
+      const a = K.value, x = F.value && a, R = x ? r("span", {
+        style: {
+          display: "inline-block",
+          width: `${a.level * (l.treeIndentSize?.value ?? 15)}px`
+        }
+      }, null) : null, k = x && a.hasChildren ? r(N, {
+        expanded: a.expanded,
+        expandable: !0,
+        variant: "tree",
+        onClick: () => l.toggleTreeExpand?.(e.record, e.rowIndex)
+      }, null) : x ? r(N, {
+        expanded: !1,
+        expandable: !1,
+        variant: "tree"
+      }, null) : null, q = oe(e.column), X = q.enabled ? q.showTitle ? r(U, {
+        block: !0,
+        title: o.value.tooltipText,
+        placement: "top",
+        open: I.value
+      }, {
+        default: () => [r("div", {
+          ref: H,
+          class: e.bodyCellEllipsisClass,
+          onMouseenter: G,
+          onMouseleave: V
+        }, [o.value.content])]
+      }) : r("div", {
+        class: e.bodyCellEllipsisClass
+      }, [o.value.content]) : o.value.content;
+      return r("td", L(E.value, {
+        class: z.value,
+        style: w.value,
+        colspan: n,
+        rowspan: t,
+        onMouseenter: j(E.value.onMouseenter),
+        onMouseleave: A(E.value.onMouseleave)
+      }), [R, k, X]);
+    };
+  }
+});
+export {
+  Ie as default
+};

package/dist/table/src/components/TableEmpty.mjs

@@ -0,0 +1,38 @@
+import { defineComponent as n, inject as o, createVNode as t, h as l, resolveDynamicComponent as a } from "vue";
+import { TABLE_CONTEXT_KEY as m } from "../context.mjs";
+const y = /* @__PURE__ */ n({
+  name: "TableEmpty",
+  props: {
+    colSpan: {
+      type: Number,
+      required: !0
+    },
+    emptyClass: {
+      type: String,
+      required: !0
+    },
+    tdClass: {
+      type: String,
+      required: !0
+    }
+  },
+  setup(s) {
+    const e = o(m, {});
+    return () => {
+      const p = e.subThemeSlots, r = e.presetConfig?.value;
+      return t("tr", null, [t("td", {
+        class: [s.tdClass, s.emptyClass],
+        colspan: s.colSpan
+      }, [e.empty ? e.empty() : t("div", {
+        class: p?.emptyWrapper()
+      }, [r?.emptyIcon && t("div", {
+        class: p?.emptyIcon()
+      }, [l(a(r.emptyIcon))]), t("p", {
+        class: p?.emptyText()
+      }, [e.locale?.value.empty.text ?? "暂无数据"])])])]);
+    };
+  }
+});
+export {
+  y as default
+};

package/dist/table/src/components/TableHeader.mjs

@@ -0,0 +1,51 @@
+import { defineComponent as C, inject as i, createVNode as l, mergeProps as m } from "vue";
+import d from "./TableHeaderCell.mjs";
+import { TABLE_CONTEXT_KEY as p } from "../context.mjs";
+const g = /* @__PURE__ */ C({
+  name: "TableHeader",
+  props: {
+    rows: {
+      type: Array,
+      required: !0
+    },
+    theadClass: {
+      type: String,
+      required: !0
+    },
+    rowClass: {
+      type: String,
+      required: !0
+    },
+    thClass: {
+      type: String,
+      required: !0
+    },
+    headerCellInnerClass: {
+      type: String,
+      required: !0
+    }
+  },
+  setup(e) {
+    const o = i(p, {});
+    return () => l("thead", {
+      class: e.theadClass
+    }, [e.rows.map((n, s) => {
+      const u = n.map((r) => r.column), t = o.getHeaderRowProps?.(u, s);
+      return l("tr", m({
+        key: `header-row-${s}`
+      }, t, {
+        class: [e.rowClass, t?.class, t?.className],
+        style: t?.style
+      }), [n.map((r, a) => l(d, {
+        key: `${String(r.column.key ?? r.column.title ?? a)}-${s}-${a}`,
+        cell: r,
+        index: a,
+        thClass: e.thClass,
+        headerCellInnerClass: e.headerCellInnerClass
+      }, null))]);
+    })]);
+  }
+});
+export {
+  g as default
+};

package/dist/table/src/components/TableHeaderCell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableHeaderCell.d.ts","sourceRoot":"","sources":["../../../../../table/src/components/TableHeaderCell.tsx"],"names":[],"mappings":"AAAA,OAAO,EASL,KAAK,QAAQ,EACd,MAAM,KAAK,CAAA;AAOZ,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;;;cA4EzC,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;;;cAAjD,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;;AAJvE,wBAuvBE"}
+{"version":3,"file":"TableHeaderCell.d.ts","sourceRoot":"","sources":["../../../../../table/src/components/TableHeaderCell.tsx"],"names":[],"mappings":"AAAA,OAAO,EASL,KAAK,QAAQ,EACd,MAAM,KAAK,CAAA;AAOZ,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;;;cAuBzC,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;;;cAAjD,QAAQ,CAAC,cAAc,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;;AAJvE,wBA2tBE"}