@v-c/table 0.0.1 → 0.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Body/BodyRow.cjs +4 -4
- package/dist/Body/BodyRow.js +4 -4
- package/dist/Body/MeasureRow.cjs +17 -1
- package/dist/Body/MeasureRow.js +18 -2
- package/dist/FixedHolder/index.cjs +12 -12
- package/dist/FixedHolder/index.js +13 -13
- package/dist/Footer/index.cjs +3 -2
- package/dist/Footer/index.js +3 -2
- package/dist/Header/Header.cjs +15 -15
- package/dist/Header/Header.js +15 -15
- package/dist/Table.cjs +9 -6
- package/dist/Table.js +9 -6
- package/package.json +2 -2
package/dist/Body/BodyRow.cjs
CHANGED
|
@@ -88,6 +88,7 @@ var BodyRow = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
|
88
88
|
};
|
|
89
89
|
const baseRowNode = (0, vue.createVNode)(RowComponent, (0, vue.mergeProps)(rowProps.value, {
|
|
90
90
|
"data-row-key": rowKey,
|
|
91
|
+
"key": `row-${rowKey}`,
|
|
91
92
|
"class": (0, _v_c_util.clsx)(className, `${prefixCls}-row`, `${prefixCls}-row-level-${indent}`, rowProps.value?.className, rowProps.value?.class, classNames?.row, { [expandedClsName]: indent >= 1 }),
|
|
92
93
|
"style": mergedRowStyle
|
|
93
94
|
}), _isSlot(_slot = flattenColumns.map((column, colIndex) => {
|
|
@@ -123,6 +124,7 @@ var BodyRow = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
|
123
124
|
expandRowNode = (0, vue.createVNode)(require_ExpandedRow.default, {
|
|
124
125
|
"expanded": expanded.value,
|
|
125
126
|
"className": (0, _v_c_util.clsx)(`${prefixCls}-expanded-row`, `${prefixCls}-expanded-row-level-${indent + 1}`, computedExpandedRowClassName),
|
|
127
|
+
"key": `expanded-row-${rowKey}`,
|
|
126
128
|
"prefixCls": prefixCls,
|
|
127
129
|
"component": RowComponent,
|
|
128
130
|
"cellComponent": BodyCellComponent,
|
|
@@ -131,10 +133,8 @@ var BodyRow = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
|
131
133
|
"isEmpty": false
|
|
132
134
|
}, _isSlot(expandContent) ? expandContent : { default: () => [expandContent] });
|
|
133
135
|
}
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
if (childArr.length === 1) return childArr[0];
|
|
137
|
-
return childArr;
|
|
136
|
+
if (expandRowNode) return (0, vue.createVNode)(vue.Fragment, null, [baseRowNode, expandRowNode]);
|
|
137
|
+
return (0, vue.createVNode)(vue.Fragment, null, [baseRowNode]);
|
|
138
138
|
};
|
|
139
139
|
}
|
|
140
140
|
});
|
package/dist/Body/BodyRow.js
CHANGED
|
@@ -83,6 +83,7 @@ var BodyRow_default = /* @__PURE__ */ defineComponent({
|
|
|
83
83
|
};
|
|
84
84
|
const baseRowNode = createVNode(RowComponent, mergeProps(rowProps.value, {
|
|
85
85
|
"data-row-key": rowKey,
|
|
86
|
+
"key": `row-${rowKey}`,
|
|
86
87
|
"class": clsx(className, `${prefixCls}-row`, `${prefixCls}-row-level-${indent}`, rowProps.value?.className, rowProps.value?.class, classNames?.row, { [expandedClsName]: indent >= 1 }),
|
|
87
88
|
"style": mergedRowStyle
|
|
88
89
|
}), _isSlot(_slot = flattenColumns.map((column, colIndex) => {
|
|
@@ -118,6 +119,7 @@ var BodyRow_default = /* @__PURE__ */ defineComponent({
|
|
|
118
119
|
expandRowNode = createVNode(ExpandedRow_default, {
|
|
119
120
|
"expanded": expanded.value,
|
|
120
121
|
"className": clsx(`${prefixCls}-expanded-row`, `${prefixCls}-expanded-row-level-${indent + 1}`, computedExpandedRowClassName),
|
|
122
|
+
"key": `expanded-row-${rowKey}`,
|
|
121
123
|
"prefixCls": prefixCls,
|
|
122
124
|
"component": RowComponent,
|
|
123
125
|
"cellComponent": BodyCellComponent,
|
|
@@ -126,10 +128,8 @@ var BodyRow_default = /* @__PURE__ */ defineComponent({
|
|
|
126
128
|
"isEmpty": false
|
|
127
129
|
}, _isSlot(expandContent) ? expandContent : { default: () => [expandContent] });
|
|
128
130
|
}
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
if (childArr.length === 1) return childArr[0];
|
|
132
|
-
return childArr;
|
|
131
|
+
if (expandRowNode) return createVNode(Fragment, null, [baseRowNode, expandRowNode]);
|
|
132
|
+
return createVNode(Fragment, null, [baseRowNode]);
|
|
133
133
|
};
|
|
134
134
|
}
|
|
135
135
|
});
|
package/dist/Body/MeasureRow.cjs
CHANGED
|
@@ -8,6 +8,7 @@ const require_MeasureCell = require("./MeasureCell.cjs");
|
|
|
8
8
|
let vue = require("vue");
|
|
9
9
|
let _v_c_resize_observer = require("@v-c/resize-observer");
|
|
10
10
|
_v_c_resize_observer = require_rolldown_runtime.__toESM(_v_c_resize_observer);
|
|
11
|
+
let _v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
|
|
11
12
|
let _v_c_util_dist_Dom_isVisible = require("@v-c/util/dist/Dom/isVisible");
|
|
12
13
|
_v_c_util_dist_Dom_isVisible = require_rolldown_runtime.__toESM(_v_c_util_dist_Dom_isVisible);
|
|
13
14
|
function _isSlot(s) {
|
|
@@ -26,6 +27,21 @@ var MeasureRow = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
|
26
27
|
const { measureRowRender } = require_TableContext.useInjectTableContext();
|
|
27
28
|
return () => {
|
|
28
29
|
let _slot;
|
|
30
|
+
const cloneTitle = (title) => {
|
|
31
|
+
if (Array.isArray(title)) return title.map((node) => cloneTitle(node));
|
|
32
|
+
if ((0, vue.isVNode)(title)) {
|
|
33
|
+
const cloned = (0, vue.cloneVNode)(title, { ref: void 0 });
|
|
34
|
+
let children = cloned.children;
|
|
35
|
+
if (cloned.children?.default && typeof cloned.children.default === "function") {
|
|
36
|
+
children = (0, _v_c_util_dist_props_util.filterEmpty)(cloned.children?.default?.());
|
|
37
|
+
if (Array.isArray(children)) children = children.map((child) => cloneTitle(child));
|
|
38
|
+
else if ((0, vue.isVNode)(children)) children = cloneTitle(children);
|
|
39
|
+
cloned.children.default = () => children;
|
|
40
|
+
} else if (Array.isArray(children)) cloned.children = children.map((child) => cloneTitle(child));
|
|
41
|
+
return cloned;
|
|
42
|
+
}
|
|
43
|
+
return title;
|
|
44
|
+
};
|
|
29
45
|
const measureRow = (0, vue.createVNode)("tr", {
|
|
30
46
|
"aria-hidden": "true",
|
|
31
47
|
"class": `${props.prefixCls}-measure-row`,
|
|
@@ -36,7 +52,7 @@ var MeasureRow = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
|
36
52
|
props.onColumnResize(columnKey, size.offsetWidth);
|
|
37
53
|
});
|
|
38
54
|
} }, _isSlot(_slot = props.columnsKey.map((columnKey) => {
|
|
39
|
-
const titleForMeasure = props.columns.find((col) => col.key === columnKey)?.title;
|
|
55
|
+
const titleForMeasure = cloneTitle(props.columns.find((col) => col.key === columnKey)?.title);
|
|
40
56
|
return (0, vue.createVNode)(require_MeasureCell.default, {
|
|
41
57
|
"key": columnKey,
|
|
42
58
|
"columnKey": columnKey,
|
package/dist/Body/MeasureRow.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { useInjectTableContext } from "../context/TableContext.js";
|
|
2
2
|
import MeasureCell_default from "./MeasureCell.js";
|
|
3
|
-
import { createVNode, defineComponent, isVNode, ref } from "vue";
|
|
3
|
+
import { cloneVNode, createVNode, defineComponent, isVNode, ref } from "vue";
|
|
4
4
|
import ResizeObserver from "@v-c/resize-observer";
|
|
5
|
+
import { filterEmpty } from "@v-c/util/dist/props-util";
|
|
5
6
|
import isVisible from "@v-c/util/dist/Dom/isVisible";
|
|
6
7
|
function _isSlot(s) {
|
|
7
8
|
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
|
|
@@ -19,6 +20,21 @@ var MeasureRow_default = /* @__PURE__ */ defineComponent({
|
|
|
19
20
|
const { measureRowRender } = useInjectTableContext();
|
|
20
21
|
return () => {
|
|
21
22
|
let _slot;
|
|
23
|
+
const cloneTitle = (title) => {
|
|
24
|
+
if (Array.isArray(title)) return title.map((node) => cloneTitle(node));
|
|
25
|
+
if (isVNode(title)) {
|
|
26
|
+
const cloned = cloneVNode(title, { ref: void 0 });
|
|
27
|
+
let children = cloned.children;
|
|
28
|
+
if (cloned.children?.default && typeof cloned.children.default === "function") {
|
|
29
|
+
children = filterEmpty(cloned.children?.default?.());
|
|
30
|
+
if (Array.isArray(children)) children = children.map((child) => cloneTitle(child));
|
|
31
|
+
else if (isVNode(children)) children = cloneTitle(children);
|
|
32
|
+
cloned.children.default = () => children;
|
|
33
|
+
} else if (Array.isArray(children)) cloned.children = children.map((child) => cloneTitle(child));
|
|
34
|
+
return cloned;
|
|
35
|
+
}
|
|
36
|
+
return title;
|
|
37
|
+
};
|
|
22
38
|
const measureRow = createVNode("tr", {
|
|
23
39
|
"aria-hidden": "true",
|
|
24
40
|
"class": `${props.prefixCls}-measure-row`,
|
|
@@ -29,7 +45,7 @@ var MeasureRow_default = /* @__PURE__ */ defineComponent({
|
|
|
29
45
|
props.onColumnResize(columnKey, size.offsetWidth);
|
|
30
46
|
});
|
|
31
47
|
} }, _isSlot(_slot = props.columnsKey.map((columnKey) => {
|
|
32
|
-
const titleForMeasure = props.columns.find((col) => col.key === columnKey)?.title;
|
|
48
|
+
const titleForMeasure = cloneTitle(props.columns.find((col) => col.key === columnKey)?.title);
|
|
33
49
|
return createVNode(MeasureCell_default, {
|
|
34
50
|
"key": columnKey,
|
|
35
51
|
"columnKey": columnKey,
|
|
@@ -11,8 +11,8 @@ let _v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
|
|
|
11
11
|
function useColumnWidth(colWidths, columnCount) {
|
|
12
12
|
return (0, vue.computed)(() => {
|
|
13
13
|
const cloneColumns = [];
|
|
14
|
-
for (let i = 0; i < columnCount; i += 1) {
|
|
15
|
-
const val = colWidths[i];
|
|
14
|
+
for (let i = 0; i < columnCount.value; i += 1) {
|
|
15
|
+
const val = colWidths.value[i];
|
|
16
16
|
if (val !== void 0) cloneColumns[i] = val;
|
|
17
17
|
else return null;
|
|
18
18
|
}
|
|
@@ -44,12 +44,12 @@ var FixedHolder = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
|
44
44
|
setup(props, { slots, expose }) {
|
|
45
45
|
const context = require_TableContext.useInjectTableContext();
|
|
46
46
|
const scrollRef = (0, vue.ref)(null);
|
|
47
|
+
const { colWidths, columCount } = (0, _v_c_util_dist_props_util.toPropsRefs)(props, "colWidths", "columCount");
|
|
47
48
|
expose({ nativeElement: scrollRef });
|
|
48
|
-
const TableComponent = (0, vue.computed)(() => context.getComponent(["header", "table"], "table"));
|
|
49
49
|
const combinationScrollBarSize = (0, vue.computed)(() => {
|
|
50
50
|
return context.isSticky && !props.fixHeader ? 0 : context.scrollbarSize;
|
|
51
51
|
});
|
|
52
|
-
const mergedColumnWidth = useColumnWidth(
|
|
52
|
+
const mergedColumnWidth = useColumnWidth(colWidths, columCount);
|
|
53
53
|
const isColGroupEmpty = (0, vue.computed)(() => {
|
|
54
54
|
const widths = mergedColumnWidth.value;
|
|
55
55
|
const noWidth = !widths || !widths.length || widths.every((w) => !w);
|
|
@@ -107,14 +107,14 @@ var FixedHolder = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
|
107
107
|
(0, vue.onBeforeUnmount)(() => {
|
|
108
108
|
scrollRef.value?.removeEventListener("wheel", onWheel);
|
|
109
109
|
});
|
|
110
|
-
const slotProps = (0, vue.computed)(() => ({
|
|
111
|
-
...props,
|
|
112
|
-
columns: columnsWithScrollbar.value,
|
|
113
|
-
flattenColumns: flattenColumnsWithScrollbar.value,
|
|
114
|
-
stickyOffsets: headerStickyOffsets.value
|
|
115
|
-
}));
|
|
116
110
|
return () => {
|
|
117
|
-
const TableComp =
|
|
111
|
+
const TableComp = context.getComponent(["header", "table"], "table");
|
|
112
|
+
const slotsProps = {
|
|
113
|
+
...props,
|
|
114
|
+
columns: columnsWithScrollbar.value,
|
|
115
|
+
flattenColumns: flattenColumnsWithScrollbar.value,
|
|
116
|
+
stickyOffsets: headerStickyOffsets.value
|
|
117
|
+
};
|
|
118
118
|
return (0, vue.createVNode)("div", {
|
|
119
119
|
"style": {
|
|
120
120
|
overflow: "hidden",
|
|
@@ -134,7 +134,7 @@ var FixedHolder = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
|
134
134
|
"colWidths": [...mergedColumnWidth.value || [], combinationScrollBarSize.value],
|
|
135
135
|
"columCount": props.columCount + 1,
|
|
136
136
|
"columns": flattenColumnsWithScrollbar.value
|
|
137
|
-
}, null), slots.default?.(
|
|
137
|
+
}, null), slots.default?.(slotsProps)] })]);
|
|
138
138
|
};
|
|
139
139
|
}
|
|
140
140
|
});
|
|
@@ -2,12 +2,12 @@ import { useInjectTableContext } from "../context/TableContext.js";
|
|
|
2
2
|
import ColGroup_default from "../ColGroup.js";
|
|
3
3
|
import { computed, createVNode, defineComponent, onBeforeUnmount, onMounted, ref } from "vue";
|
|
4
4
|
import { clsx } from "@v-c/util";
|
|
5
|
-
import { getStylePxValue } from "@v-c/util/dist/props-util";
|
|
5
|
+
import { getStylePxValue, toPropsRefs } from "@v-c/util/dist/props-util";
|
|
6
6
|
function useColumnWidth(colWidths, columnCount) {
|
|
7
7
|
return computed(() => {
|
|
8
8
|
const cloneColumns = [];
|
|
9
|
-
for (let i = 0; i < columnCount; i += 1) {
|
|
10
|
-
const val = colWidths[i];
|
|
9
|
+
for (let i = 0; i < columnCount.value; i += 1) {
|
|
10
|
+
const val = colWidths.value[i];
|
|
11
11
|
if (val !== void 0) cloneColumns[i] = val;
|
|
12
12
|
else return null;
|
|
13
13
|
}
|
|
@@ -39,12 +39,12 @@ var FixedHolder_default = /* @__PURE__ */ defineComponent({
|
|
|
39
39
|
setup(props, { slots, expose }) {
|
|
40
40
|
const context = useInjectTableContext();
|
|
41
41
|
const scrollRef = ref(null);
|
|
42
|
+
const { colWidths, columCount } = toPropsRefs(props, "colWidths", "columCount");
|
|
42
43
|
expose({ nativeElement: scrollRef });
|
|
43
|
-
const TableComponent = computed(() => context.getComponent(["header", "table"], "table"));
|
|
44
44
|
const combinationScrollBarSize = computed(() => {
|
|
45
45
|
return context.isSticky && !props.fixHeader ? 0 : context.scrollbarSize;
|
|
46
46
|
});
|
|
47
|
-
const mergedColumnWidth = useColumnWidth(
|
|
47
|
+
const mergedColumnWidth = useColumnWidth(colWidths, columCount);
|
|
48
48
|
const isColGroupEmpty = computed(() => {
|
|
49
49
|
const widths = mergedColumnWidth.value;
|
|
50
50
|
const noWidth = !widths || !widths.length || widths.every((w) => !w);
|
|
@@ -102,14 +102,14 @@ var FixedHolder_default = /* @__PURE__ */ defineComponent({
|
|
|
102
102
|
onBeforeUnmount(() => {
|
|
103
103
|
scrollRef.value?.removeEventListener("wheel", onWheel);
|
|
104
104
|
});
|
|
105
|
-
const slotProps = computed(() => ({
|
|
106
|
-
...props,
|
|
107
|
-
columns: columnsWithScrollbar.value,
|
|
108
|
-
flattenColumns: flattenColumnsWithScrollbar.value,
|
|
109
|
-
stickyOffsets: headerStickyOffsets.value
|
|
110
|
-
}));
|
|
111
105
|
return () => {
|
|
112
|
-
const TableComp =
|
|
106
|
+
const TableComp = context.getComponent(["header", "table"], "table");
|
|
107
|
+
const slotsProps = {
|
|
108
|
+
...props,
|
|
109
|
+
columns: columnsWithScrollbar.value,
|
|
110
|
+
flattenColumns: flattenColumnsWithScrollbar.value,
|
|
111
|
+
stickyOffsets: headerStickyOffsets.value
|
|
112
|
+
};
|
|
113
113
|
return createVNode("div", {
|
|
114
114
|
"style": {
|
|
115
115
|
overflow: "hidden",
|
|
@@ -129,7 +129,7 @@ var FixedHolder_default = /* @__PURE__ */ defineComponent({
|
|
|
129
129
|
"colWidths": [...mergedColumnWidth.value || [], combinationScrollBarSize.value],
|
|
130
130
|
"columCount": props.columCount + 1,
|
|
131
131
|
"columns": flattenColumnsWithScrollbar.value
|
|
132
|
-
}, null), slots.default?.(
|
|
132
|
+
}, null), slots.default?.(slotsProps)] })]);
|
|
133
133
|
};
|
|
134
134
|
}
|
|
135
135
|
});
|
package/dist/Footer/index.cjs
CHANGED
|
@@ -12,8 +12,9 @@ let vue = require("vue");
|
|
|
12
12
|
var Footer = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
13
13
|
name: "TableFooter",
|
|
14
14
|
props: ["stickyOffsets", "flattenColumns"],
|
|
15
|
+
inheritAttrs: false,
|
|
15
16
|
setup(props, { slots }) {
|
|
16
|
-
const
|
|
17
|
+
const context = require_TableContext.useInjectTableContext();
|
|
17
18
|
const summaryContext = (0, vue.reactive)({
|
|
18
19
|
stickyOffsets: props.stickyOffsets,
|
|
19
20
|
flattenColumns: props.flattenColumns,
|
|
@@ -27,7 +28,7 @@ var Footer = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
|
27
28
|
summaryContext.scrollColumnIndex = scrollColumn?.scrollbar ? lastColumnIndex : null;
|
|
28
29
|
});
|
|
29
30
|
require_SummaryContext.useProvideSummaryContext(summaryContext);
|
|
30
|
-
return () => (0, vue.createVNode)("tfoot", { "class": `${prefixCls}-summary` }, [slots.default?.()]);
|
|
31
|
+
return () => (0, vue.createVNode)("tfoot", { "class": `${context.prefixCls}-summary` }, [slots.default?.()]);
|
|
31
32
|
}
|
|
32
33
|
});
|
|
33
34
|
var Footer_default = Footer;
|
package/dist/Footer/index.js
CHANGED
|
@@ -7,8 +7,9 @@ import { createVNode, defineComponent, reactive, watchEffect } from "vue";
|
|
|
7
7
|
var Footer_default = /* @__PURE__ */ defineComponent({
|
|
8
8
|
name: "TableFooter",
|
|
9
9
|
props: ["stickyOffsets", "flattenColumns"],
|
|
10
|
+
inheritAttrs: false,
|
|
10
11
|
setup(props, { slots }) {
|
|
11
|
-
const
|
|
12
|
+
const context = useInjectTableContext();
|
|
12
13
|
const summaryContext = reactive({
|
|
13
14
|
stickyOffsets: props.stickyOffsets,
|
|
14
15
|
flattenColumns: props.flattenColumns,
|
|
@@ -22,7 +23,7 @@ var Footer_default = /* @__PURE__ */ defineComponent({
|
|
|
22
23
|
summaryContext.scrollColumnIndex = scrollColumn?.scrollbar ? lastColumnIndex : null;
|
|
23
24
|
});
|
|
24
25
|
useProvideSummaryContext(summaryContext);
|
|
25
|
-
return () => createVNode("tfoot", { "class": `${prefixCls}-summary` }, [slots.default?.()]);
|
|
26
|
+
return () => createVNode("tfoot", { "class": `${context.prefixCls}-summary` }, [slots.default?.()]);
|
|
26
27
|
}
|
|
27
28
|
});
|
|
28
29
|
const FooterComponents = Summary_default;
|
package/dist/Header/Header.cjs
CHANGED
|
@@ -59,29 +59,29 @@ var Header = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
|
59
59
|
const context = require_TableContext.useInjectTableContext();
|
|
60
60
|
const headerCls = (0, vue.computed)(() => context.classNames?.header || {});
|
|
61
61
|
const headerStyles = (0, vue.computed)(() => context.styles?.header || {});
|
|
62
|
-
const rows = (0, vue.computed)(() => {
|
|
63
|
-
return parseHeaderRows(props.columns, headerCls.value, headerStyles.value);
|
|
64
|
-
});
|
|
65
62
|
return () => {
|
|
66
63
|
let _slot;
|
|
67
64
|
const WrapperComponent = context.getComponent(["header", "wrapper"], "thead");
|
|
68
65
|
const trComponent = context.getComponent(["header", "row"], "tr");
|
|
69
66
|
const thComponent = context.getComponent(["header", "cell"], "th");
|
|
67
|
+
const rows = parseHeaderRows(props.columns, headerCls.value, headerStyles.value);
|
|
70
68
|
return (0, vue.createVNode)(WrapperComponent, {
|
|
71
69
|
"class": (0, _v_c_util.clsx)(`${context.prefixCls}-thead`, headerCls.value.wrapper),
|
|
72
70
|
"style": headerStyles.value.wrapper
|
|
73
|
-
}, _isSlot(_slot = rows.
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
71
|
+
}, _isSlot(_slot = rows.map((row, rowIndex) => {
|
|
72
|
+
return (0, vue.createVNode)(require_HeaderRow.default, {
|
|
73
|
+
"classNames": headerCls.value,
|
|
74
|
+
"styles": headerStyles.value,
|
|
75
|
+
"key": rowIndex,
|
|
76
|
+
"flattenColumns": props.flattenColumns,
|
|
77
|
+
"cells": row,
|
|
78
|
+
"stickyOffsets": props.stickyOffsets,
|
|
79
|
+
"rowComponent": trComponent,
|
|
80
|
+
"cellComponent": thComponent,
|
|
81
|
+
"onHeaderRow": props.onHeaderRow,
|
|
82
|
+
"index": rowIndex
|
|
83
|
+
}, null);
|
|
84
|
+
})) ? _slot : { default: () => [_slot] });
|
|
85
85
|
};
|
|
86
86
|
}
|
|
87
87
|
});
|
package/dist/Header/Header.js
CHANGED
|
@@ -54,29 +54,29 @@ var Header_default = /* @__PURE__ */ defineComponent({
|
|
|
54
54
|
const context = useInjectTableContext();
|
|
55
55
|
const headerCls = computed(() => context.classNames?.header || {});
|
|
56
56
|
const headerStyles = computed(() => context.styles?.header || {});
|
|
57
|
-
const rows = computed(() => {
|
|
58
|
-
return parseHeaderRows(props.columns, headerCls.value, headerStyles.value);
|
|
59
|
-
});
|
|
60
57
|
return () => {
|
|
61
58
|
let _slot;
|
|
62
59
|
const WrapperComponent = context.getComponent(["header", "wrapper"], "thead");
|
|
63
60
|
const trComponent = context.getComponent(["header", "row"], "tr");
|
|
64
61
|
const thComponent = context.getComponent(["header", "cell"], "th");
|
|
62
|
+
const rows = parseHeaderRows(props.columns, headerCls.value, headerStyles.value);
|
|
65
63
|
return createVNode(WrapperComponent, {
|
|
66
64
|
"class": clsx(`${context.prefixCls}-thead`, headerCls.value.wrapper),
|
|
67
65
|
"style": headerStyles.value.wrapper
|
|
68
|
-
}, _isSlot(_slot = rows.
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
66
|
+
}, _isSlot(_slot = rows.map((row, rowIndex) => {
|
|
67
|
+
return createVNode(HeaderRow_default, {
|
|
68
|
+
"classNames": headerCls.value,
|
|
69
|
+
"styles": headerStyles.value,
|
|
70
|
+
"key": rowIndex,
|
|
71
|
+
"flattenColumns": props.flattenColumns,
|
|
72
|
+
"cells": row,
|
|
73
|
+
"stickyOffsets": props.stickyOffsets,
|
|
74
|
+
"rowComponent": trComponent,
|
|
75
|
+
"cellComponent": thComponent,
|
|
76
|
+
"onHeaderRow": props.onHeaderRow,
|
|
77
|
+
"index": rowIndex
|
|
78
|
+
}, null);
|
|
79
|
+
})) ? _slot : { default: () => [_slot] });
|
|
80
80
|
};
|
|
81
81
|
}
|
|
82
82
|
});
|
package/dist/Table.cjs
CHANGED
|
@@ -9,7 +9,6 @@ const require_valueUtil = require("./utils/valueUtil.cjs");
|
|
|
9
9
|
const require_index = require("./Body/index.cjs");
|
|
10
10
|
const require_constant = require("./constant.cjs");
|
|
11
11
|
const require_index$1 = require("./FixedHolder/index.cjs");
|
|
12
|
-
const require_Summary = require("./Footer/Summary.cjs");
|
|
13
12
|
const require_index$2 = require("./Footer/index.cjs");
|
|
14
13
|
const require_Header = require("./Header/Header.cjs");
|
|
15
14
|
const require_index$3 = require("./hooks/useColumns/index.cjs");
|
|
@@ -33,6 +32,7 @@ let _v_c_util_dist_isEqual = require("@v-c/util/dist/isEqual");
|
|
|
33
32
|
_v_c_util_dist_isEqual = require_rolldown_runtime.__toESM(_v_c_util_dist_isEqual);
|
|
34
33
|
let _v_c_util_dist_pickAttrs = require("@v-c/util/dist/pickAttrs");
|
|
35
34
|
_v_c_util_dist_pickAttrs = require_rolldown_runtime.__toESM(_v_c_util_dist_pickAttrs);
|
|
35
|
+
let _v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
|
|
36
36
|
function _isSlot(s) {
|
|
37
37
|
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
|
|
38
38
|
}
|
|
@@ -138,9 +138,10 @@ var ImmutableTable = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, s
|
|
|
138
138
|
const fixColumn = (0, vue.computed)(() => horizonScroll.value && flattenColumns.value.some(({ fixed }) => fixed));
|
|
139
139
|
const summaryNode = (0, vue.computed)(() => props.summary?.(mergedData.value));
|
|
140
140
|
const fixFooter = (0, vue.computed)(() => {
|
|
141
|
-
const node = summaryNode.value;
|
|
142
|
-
if (!node ||
|
|
143
|
-
|
|
141
|
+
const node = Array.isArray(summaryNode.value) ? (0, _v_c_util_dist_props_util.filterEmpty)(summaryNode.value)?.[0] : summaryNode.value;
|
|
142
|
+
if (!node || !(0, vue.isVNode)(node)) return false;
|
|
143
|
+
const fixed = node.props?.fixed;
|
|
144
|
+
return (fixHeader.value || stickyConfig.value.isSticky) && node?.type?.name === "TableSummary" && (fixed || fixed === "");
|
|
144
145
|
});
|
|
145
146
|
const scrollXStyle = (0, vue.computed)(() => {
|
|
146
147
|
if (horizonScroll.value) return { overflowX: "auto" };
|
|
@@ -343,7 +344,9 @@ var ImmutableTable = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, s
|
|
|
343
344
|
return () => {
|
|
344
345
|
let _slot, _slot2;
|
|
345
346
|
slotChildren.value = slots.default?.();
|
|
346
|
-
const renderFixedHeaderTable = (fixedHolderPassProps) =>
|
|
347
|
+
const renderFixedHeaderTable = (fixedHolderPassProps) => {
|
|
348
|
+
return (0, vue.createVNode)(vue.Fragment, null, [(0, vue.createVNode)(require_Header.default, fixedHolderPassProps, null), fixFooter.value === "top" && (0, vue.createVNode)(require_index$2.default, fixedHolderPassProps, { default: () => [summaryNode.value] })]);
|
|
349
|
+
};
|
|
347
350
|
const renderFixedFooterTable = (fixedHolderPassProps) => (0, vue.createVNode)(require_index$2.default, fixedHolderPassProps, { default: () => [summaryNode.value] });
|
|
348
351
|
const bodyTableNode = (0, vue.createVNode)(require_index.default, {
|
|
349
352
|
"data": mergedData.value,
|
|
@@ -442,7 +445,7 @@ var ImmutableTable = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, s
|
|
|
442
445
|
"flattenColumns": flattenColumns.value
|
|
443
446
|
}), null),
|
|
444
447
|
bodyTableNode,
|
|
445
|
-
summaryNode.value && (0, vue.createVNode)(require_index$2.default, {
|
|
448
|
+
!fixFooter.value && summaryNode.value && (0, vue.createVNode)(require_index$2.default, {
|
|
446
449
|
"stickyOffsets": mergedStickyOffsets.value,
|
|
447
450
|
"flattenColumns": flattenColumns.value
|
|
448
451
|
}, { default: () => [summaryNode.value] })
|
package/dist/Table.js
CHANGED
|
@@ -4,7 +4,6 @@ import { getColumnsKey, validNumberValue, validateValue } from "./utils/valueUti
|
|
|
4
4
|
import Body_default from "./Body/index.js";
|
|
5
5
|
import { EXPAND_COLUMN, INTERNAL_HOOKS } from "./constant.js";
|
|
6
6
|
import FixedHolder_default from "./FixedHolder/index.js";
|
|
7
|
-
import Summary_default from "./Footer/Summary.js";
|
|
8
7
|
import Footer_default, { FooterComponents } from "./Footer/index.js";
|
|
9
8
|
import Header_default from "./Header/Header.js";
|
|
10
9
|
import useColumns from "./hooks/useColumns/index.js";
|
|
@@ -25,6 +24,7 @@ import { getDOM } from "@v-c/util/dist/Dom/findDOMNode";
|
|
|
25
24
|
import { getTargetScrollBarSize } from "@v-c/util/dist/getScrollBarSize";
|
|
26
25
|
import isEqual from "@v-c/util/dist/isEqual";
|
|
27
26
|
import pickAttrs from "@v-c/util/dist/pickAttrs";
|
|
27
|
+
import { filterEmpty } from "@v-c/util/dist/props-util";
|
|
28
28
|
function _isSlot(s) {
|
|
29
29
|
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
|
|
30
30
|
}
|
|
@@ -130,9 +130,10 @@ var ImmutableTable = /* @__PURE__ */ defineComponent((props, { attrs, slots, exp
|
|
|
130
130
|
const fixColumn = computed(() => horizonScroll.value && flattenColumns.value.some(({ fixed }) => fixed));
|
|
131
131
|
const summaryNode = computed(() => props.summary?.(mergedData.value));
|
|
132
132
|
const fixFooter = computed(() => {
|
|
133
|
-
const node = summaryNode.value;
|
|
134
|
-
if (!node ||
|
|
135
|
-
|
|
133
|
+
const node = Array.isArray(summaryNode.value) ? filterEmpty(summaryNode.value)?.[0] : summaryNode.value;
|
|
134
|
+
if (!node || !isVNode(node)) return false;
|
|
135
|
+
const fixed = node.props?.fixed;
|
|
136
|
+
return (fixHeader.value || stickyConfig.value.isSticky) && node?.type?.name === "TableSummary" && (fixed || fixed === "");
|
|
136
137
|
});
|
|
137
138
|
const scrollXStyle = computed(() => {
|
|
138
139
|
if (horizonScroll.value) return { overflowX: "auto" };
|
|
@@ -335,7 +336,9 @@ var ImmutableTable = /* @__PURE__ */ defineComponent((props, { attrs, slots, exp
|
|
|
335
336
|
return () => {
|
|
336
337
|
let _slot, _slot2;
|
|
337
338
|
slotChildren.value = slots.default?.();
|
|
338
|
-
const renderFixedHeaderTable = (fixedHolderPassProps) =>
|
|
339
|
+
const renderFixedHeaderTable = (fixedHolderPassProps) => {
|
|
340
|
+
return createVNode(Fragment, null, [createVNode(Header_default, fixedHolderPassProps, null), fixFooter.value === "top" && createVNode(Footer_default, fixedHolderPassProps, { default: () => [summaryNode.value] })]);
|
|
341
|
+
};
|
|
339
342
|
const renderFixedFooterTable = (fixedHolderPassProps) => createVNode(Footer_default, fixedHolderPassProps, { default: () => [summaryNode.value] });
|
|
340
343
|
const bodyTableNode = createVNode(Body_default, {
|
|
341
344
|
"data": mergedData.value,
|
|
@@ -434,7 +437,7 @@ var ImmutableTable = /* @__PURE__ */ defineComponent((props, { attrs, slots, exp
|
|
|
434
437
|
"flattenColumns": flattenColumns.value
|
|
435
438
|
}), null),
|
|
436
439
|
bodyTableNode,
|
|
437
|
-
summaryNode.value && createVNode(Footer_default, {
|
|
440
|
+
!fixFooter.value && summaryNode.value && createVNode(Footer_default, {
|
|
438
441
|
"stickyOffsets": mergedStickyOffsets.value,
|
|
439
442
|
"flattenColumns": flattenColumns.value
|
|
440
443
|
}, { default: () => [summaryNode.value] })
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@v-c/table",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.0.
|
|
4
|
+
"version": "0.0.3",
|
|
5
5
|
"exports": {
|
|
6
6
|
".": {
|
|
7
7
|
"types": "./dist/index.d.ts",
|
|
@@ -20,8 +20,8 @@
|
|
|
20
20
|
"vue": "^3.0.0"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
|
+
"@v-c/util": "^1.0.6",
|
|
23
24
|
"@v-c/resize-observer": "^1.0.3",
|
|
24
|
-
"@v-c/util": "^1.0.5",
|
|
25
25
|
"@v-c/virtual-list": "^1.0.5"
|
|
26
26
|
},
|
|
27
27
|
"publishConfig": {
|