@sdata/web-vue 1.9.0 → 1.11.0

package/es/table/table-th.js

@@ -15,7 +15,7 @@ import IconCaretUp from "../icon/icon-caret-up/index.js";
 import IconFilter from "../icon/icon-filter/index.js";
 import { useColumnFilter } from "./hooks/use-column-filter.js";
 import { useColumnSorter } from "./hooks/use-column-sorter.js";
-import { computed, createVNode, defineComponent, inject, isVNode, mergeProps, toRefs } from "vue";
+import { Fragment, computed, createVNode, defineComponent, inject, isVNode, mergeProps, toRefs } from "vue";
 //#region components/table/table-th.tsx
 function _isSlot(s) {
 	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
@@ -95,7 +95,7 @@ var table_th_default = /* @__PURE__ */ defineComponent({
 				var _columnFilterValue$va;
 				return createVNode("li", {
 					"class": `${prefixCls}-filters-item`,
-					"key": index
+					"key": `${item.value}-${index}`
 				}, [isMultipleFilter.value ? createVNode(Checkbox, {
 					"value": item.value,
 					"modelValue": columnFilterValue.value,
@@ -162,13 +162,10 @@ var table_th_default = /* @__PURE__ */ defineComponent({
 			if (isFunction(props.column.title)) return props.column.title();
 			return props.column.title;
 		};
-		const renderCell = () => {
+		const renderCellContent = () => {
 			var _props$column7, _props$column8, _props$column9;
 			let _slot3;
-			return createVNode("span", {
-				"class": cellCls.value,
-				"onClick": hasSorter.value ? handleClickSorter : void 0
-			}, [
+			return createVNode(Fragment, null, [
 				((_props$column7 = props.column) === null || _props$column7 === void 0 ? void 0 : _props$column7.ellipsis) && ((_props$column8 = props.column) === null || _props$column8 === void 0 ? void 0 : _props$column8.tooltip) ? createVNode(auto_tooltip_default, {
 					"class": `${prefixCls}-th-title`,
 					"tooltipProps": tooltipProps.value
@@ -177,12 +174,22 @@ var table_th_default = /* @__PURE__ */ defineComponent({
 				filterIconAlignLeft.value && renderFilter()
 			]);
 		};
+		const renderCell = () => {
+			if (hasSorter.value) return createVNode("button", {
+				"type": "button",
+				"class": cellCls.value,
+				"onClick": handleClickSorter
+			}, [renderCellContent()]);
+			return createVNode("span", { "class": cellCls.value }, [renderCellContent()]);
+		};
 		const style = computed(() => {
-			var _props$column10, _props$column11;
-			return _objectSpread2(_objectSpread2(_objectSpread2({}, getStyle(props.column, {
+			var _props$column$colSpan, _props$column$rowSpan, _props$column10, _props$column11;
+			const colSpan = (_props$column$colSpan = props.column.colSpan) !== null && _props$column$colSpan !== void 0 ? _props$column$colSpan : 1;
+			const rowSpan = (_props$column$rowSpan = props.column.rowSpan) !== null && _props$column$rowSpan !== void 0 ? _props$column$rowSpan : 1;
+			return _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({}, getStyle(props.column, {
 				dataColumns: props.dataColumns,
 				operations: props.operations
-			})), (_props$column10 = props.column) === null || _props$column10 === void 0 ? void 0 : _props$column10.cellStyle), (_props$column11 = props.column) === null || _props$column11 === void 0 ? void 0 : _props$column11.headerCellStyle);
+			})), colSpan > 1 ? { gridColumn: `span ${colSpan}` } : void 0), rowSpan > 1 ? { gridRow: `span ${rowSpan}` } : void 0), (_props$column10 = props.column) === null || _props$column10 === void 0 ? void 0 : _props$column10.cellStyle), (_props$column11 = props.column) === null || _props$column11 === void 0 ? void 0 : _props$column11.headerCellStyle);
 		});
 		const cls = computed(() => {
 			var _props$column12, _props$column13;
@@ -197,28 +204,22 @@ var table_th_default = /* @__PURE__ */ defineComponent({
 				(_props$column13 = props.column) === null || _props$column13 === void 0 ? void 0 : _props$column13.headerCellClass
 			];
 		});
-		const handleMouseDown = (ev) => {
-			var _props$column14;
-			if ((_props$column14 = props.column) === null || _props$column14 === void 0 ? void 0 : _props$column14.dataIndex) {
-				var _tableCtx$onThMouseDo, _props$column15;
-				(_tableCtx$onThMouseDo = tableCtx.onThMouseDown) === null || _tableCtx$onThMouseDo === void 0 || _tableCtx$onThMouseDo.call(tableCtx, (_props$column15 = props.column) === null || _props$column15 === void 0 ? void 0 : _props$column15.dataIndex, ev);
-			}
+		const handleResizeMouseDown = (ev) => {
+			var _props$column14, _tableCtx$onThMouseDo;
+			if (!((_props$column14 = props.column) === null || _props$column14 === void 0 ? void 0 : _props$column14.dataIndex)) return;
+			(_tableCtx$onThMouseDo = tableCtx.onThMouseDown) === null || _tableCtx$onThMouseDo === void 0 || _tableCtx$onThMouseDo.call(tableCtx, props.column.dataIndex, ev);
 		};
 		return () => {
-			var _props$column$colSpan, _props$column$rowSpan, _slots$th$, _slots$th;
-			const colSpan = (_props$column$colSpan = props.column.colSpan) !== null && _props$column$colSpan !== void 0 ? _props$column$colSpan : 1;
-			const rowSpan = (_props$column$rowSpan = props.column.rowSpan) !== null && _props$column$rowSpan !== void 0 ? _props$column$rowSpan : 1;
-			return createVNode((_slots$th$ = (_slots$th = slots.th) === null || _slots$th === void 0 ? void 0 : _slots$th.call(slots, { column: props.column })[0]) !== null && _slots$th$ !== void 0 ? _slots$th$ : "th", {
+			var _slots$th$, _slots$th;
+			return createVNode((_slots$th$ = (_slots$th = slots.th) === null || _slots$th === void 0 ? void 0 : _slots$th.call(slots, { column: props.column })[0]) !== null && _slots$th$ !== void 0 ? _slots$th$ : "div", {
 				class: cls.value,
-				style: style.value,
-				colspan: colSpan > 1 ? colSpan : void 0,
-				rowspan: rowSpan > 1 ? rowSpan : void 0
+				style: style.value
 			}, { default: () => [
 				renderCell(),
 				!filterIconAlignLeft.value && renderFilter(),
 				props.resizable && createVNode("span", {
 					"class": `${prefixCls}-column-handle`,
-					"onMousedown": handleMouseDown
+					"onPointerdown": handleResizeMouseDown
 				}, null)
 			] });
 		};

package/es/table/table-thead.js

@@ -5,7 +5,7 @@ var table_thead_default = /* @__PURE__ */ defineComponent({
 	setup(_, { slots }) {
 		return () => {
 			var _slots$thead$, _slots$thead;
-			return createVNode((_slots$thead$ = (_slots$thead = slots.thead) === null || _slots$thead === void 0 ? void 0 : _slots$thead.call(slots)[0]) !== null && _slots$thead$ !== void 0 ? _slots$thead$ : "thead", null, { default: slots.default });
+			return createVNode((_slots$thead$ = (_slots$thead = slots.thead) === null || _slots$thead === void 0 ? void 0 : _slots$thead.call(slots)[0]) !== null && _slots$thead$ !== void 0 ? _slots$thead$ : "div", { class: "sd-table-thead" }, { default: slots.default });
 		};
 	}
 });

package/es/table/table-tr.d.ts

@@ -33,8 +33,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: () => {};
     };
 }>> & Readonly<{}>, {
-    checked: boolean;
     empty: boolean;
+    checked: boolean;
     expand: boolean;
     record: TableDataWithRaw;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/es/table/table-tr.js

@@ -25,7 +25,7 @@ var table_tr_default = /* @__PURE__ */ defineComponent({
 			return createVNode((_slots$tr$ = (_slots$tr = slots.tr) === null || _slots$tr === void 0 ? void 0 : _slots$tr.call(slots, {
 				rowIndex: props.rowIndex,
 				record: (_props$record = props.record) === null || _props$record === void 0 ? void 0 : _props$record.raw
-			})[0]) !== null && _slots$tr$ !== void 0 ? _slots$tr$ : "tr", { class: cls.value }, { default: slots.default });
+			})[0]) !== null && _slots$tr$ !== void 0 ? _slots$tr$ : "div", { class: cls.value }, { default: slots.default });
 		};
 	}
 });

package/es/table/table.d.ts

@@ -2,9 +2,15 @@ import type { PropType } from 'vue';
 import type { Size } from '../_utils/constant';
 import type { BaseType } from '../_utils/types';
 import type { TableBorder, TableChangeExtra, TableColumnData, TableComponents, TableData, TableDraggable, TableExpandable, TableOperationColumn, TablePagePosition, TableRowSelection } from './interface';
-import { VirtualListProps } from '../_components/virtual-list-v2/interface';
+import { VirtualListProps } from '../_components/virtual-list/interface';
 import { PaginationProps } from '../pagination';
 import { ScrollbarProps } from '../scrollbar';
+type TableVirtualListProps = VirtualListProps & {
+    threshold?: number;
+    fixedSize?: boolean;
+    estimatedSize?: number;
+    itemKey?: string | ((item: unknown, index: number) => string | number);
+};
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     columns: {
         type: PropType<TableColumnData[]>;
@@ -30,10 +36,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: PropType<Size>;
         default: () => "mini" | "small" | "medium" | "large";
     };
-    tableLayoutFixed: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
     loading: {
         type: (BooleanConstructor | ObjectConstructor)[];
         default: boolean;
@@ -65,7 +67,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: number;
     };
     rowKey: {
-        type: StringConstructor;
+        type: PropType<string | ((record: TableData) => BaseType)>;
         default: string;
     };
     showHeader: {
@@ -73,7 +75,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: boolean;
     };
     virtualListProps: {
-        type: PropType<VirtualListProps>;
+        type: PropType<TableVirtualListProps>;
     };
     spanMethod: {
         type: PropType<(data: {
@@ -161,6 +163,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: PropType<boolean | ScrollbarProps>;
         default: boolean;
     };
+    debug: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     showEmptyTree: {
         type: BooleanConstructor;
         default: boolean;
@@ -232,10 +238,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: PropType<Size>;
         default: () => "mini" | "small" | "medium" | "large";
     };
-    tableLayoutFixed: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
     loading: {
         type: (BooleanConstructor | ObjectConstructor)[];
         default: boolean;
@@ -267,7 +269,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: number;
     };
     rowKey: {
-        type: StringConstructor;
+        type: PropType<string | ((record: TableData) => BaseType)>;
         default: string;
     };
     showHeader: {
@@ -275,7 +277,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: boolean;
     };
     virtualListProps: {
-        type: PropType<VirtualListProps>;
+        type: PropType<TableVirtualListProps>;
     };
     spanMethod: {
         type: PropType<(data: {
@@ -363,6 +365,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: PropType<boolean | ScrollbarProps>;
         default: boolean;
     };
+    debug: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     showEmptyTree: {
         type: BooleanConstructor;
         default: boolean;
@@ -394,24 +400,24 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     size: "mini" | "small" | "medium" | "large";
     loading: boolean | Record<string, any>;
     data: TableData[];
+    columns: TableColumnData[];
     scrollbar: boolean | ScrollbarProps;
     bordered: boolean | TableBorder;
-    columns: TableColumnData[];
     hoverable: boolean;
     defaultExpandAllRows: boolean;
     indentSize: number;
     filterIconAlignLeft: boolean;
     stripe: boolean;
-    tableLayoutFixed: boolean;
     pagination: boolean | PaginationProps;
     pagePosition: "top" | "tl" | "tr" | "bottom" | "bl" | "br";
-    rowKey: string;
+    rowKey: string | ((record: TableData) => BaseType);
     showHeader: boolean;
     spanAll: boolean;
     hideExpandButtonOnEmpty: boolean;
     columnResizable: boolean;
     summaryText: string;
     stickyHeader: number | boolean;
+    debug: boolean;
     showEmptyTree: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;