@deot/vc 1.0.42 → 1.0.43

package/dist/index.d.ts

@@ -9436,12 +9436,12 @@ export declare const Components: {
     type: (StringConstructor | FunctionConstructor)[];
     default: string;
     };
-    defaultSort: {
+    sort: {
     type: ObjectConstructor;
     default: () => {};
     };
     delay: NumberConstructor;
-    }>, () => JSX_2.Element, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, ("select" | "select-all" | "selection-change" | "expand-change" | "current-change" | "cell-mouse-enter" | "cell-mouse-leave" | "header-click" | "header-contextmenu" | "sort-change" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-dragend ")[], "select" | "select-all" | "selection-change" | "expand-change" | "current-change" | "cell-mouse-enter" | "cell-mouse-leave" | "header-click" | "header-contextmenu" | "sort-change" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-dragend ", PublicProps, Readonly<ExtractPropTypes<    {
+    }>, () => JSX_2.Element, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, ("select" | "select-all" | "selection-change" | "expand-change" | "current-change" | "cell-mouse-enter" | "cell-mouse-leave" | "header-click" | "header-contextmenu" | "update:sort" | "sort-change" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-dragend ")[], "select" | "select-all" | "selection-change" | "expand-change" | "current-change" | "cell-mouse-enter" | "cell-mouse-leave" | "header-click" | "header-contextmenu" | "update:sort" | "sort-change" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-dragend ", PublicProps, Readonly<ExtractPropTypes<    {
     data: {
     type: ArrayConstructor;
     default: () => never[];
@@ -9508,7 +9508,7 @@ export declare const Components: {
     type: (StringConstructor | FunctionConstructor)[];
     default: string;
     };
-    defaultSort: {
+    sort: {
     type: ObjectConstructor;
     default: () => {};
     };
@@ -9523,6 +9523,7 @@ export declare const Components: {
     "onCell-mouse-leave"?: ((...args: any[]) => any) | undefined;
     "onHeader-click"?: ((...args: any[]) => any) | undefined;
     "onHeader-contextmenu"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:sort"?: ((...args: any[]) => any) | undefined;
     "onSort-change"?: ((...args: any[]) => any) | undefined;
     "onCell-click"?: ((...args: any[]) => any) | undefined;
     "onCell-dblclick"?: ((...args: any[]) => any) | undefined;
@@ -9531,6 +9532,7 @@ export declare const Components: {
     "onRow-dblclick"?: ((...args: any[]) => any) | undefined;
     "onHeader-dragend "?: ((...args: any[]) => any) | undefined;
     }>, {
+    sort: Record<string, any>;
     data: unknown[];
     border: boolean;
     placeholder: string | Function;
@@ -9542,7 +9544,6 @@ export declare const Components: {
     expandSelectable: boolean;
     showHeader: boolean;
     rows: number;
-    defaultSort: Record<string, any>;
     stripe: boolean;
     divider: boolean;
     showSummary: boolean;
@@ -9616,12 +9617,12 @@ export declare const Components: {
     type: (StringConstructor | FunctionConstructor)[];
     default: string;
     };
-    defaultSort: {
+    sort: {
     type: ObjectConstructor;
     default: () => {};
     };
     delay: NumberConstructor;
-    }>, () => JSX_2.Element, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, ("select" | "select-all" | "selection-change" | "expand-change" | "current-change" | "cell-mouse-enter" | "cell-mouse-leave" | "header-click" | "header-contextmenu" | "sort-change" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-dragend ")[], "select" | "select-all" | "selection-change" | "expand-change" | "current-change" | "cell-mouse-enter" | "cell-mouse-leave" | "header-click" | "header-contextmenu" | "sort-change" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-dragend ", PublicProps, Readonly<ExtractPropTypes<    {
+    }>, () => JSX_2.Element, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, ("select" | "select-all" | "selection-change" | "expand-change" | "current-change" | "cell-mouse-enter" | "cell-mouse-leave" | "header-click" | "header-contextmenu" | "update:sort" | "sort-change" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-dragend ")[], "select" | "select-all" | "selection-change" | "expand-change" | "current-change" | "cell-mouse-enter" | "cell-mouse-leave" | "header-click" | "header-contextmenu" | "update:sort" | "sort-change" | "cell-click" | "cell-dblclick" | "row-click" | "row-contextmenu" | "row-dblclick" | "header-dragend ", PublicProps, Readonly<ExtractPropTypes<    {
     data: {
     type: ArrayConstructor;
     default: () => never[];
@@ -9688,7 +9689,7 @@ export declare const Components: {
     type: (StringConstructor | FunctionConstructor)[];
     default: string;
     };
-    defaultSort: {
+    sort: {
     type: ObjectConstructor;
     default: () => {};
     };
@@ -9703,6 +9704,7 @@ export declare const Components: {
     "onCell-mouse-leave"?: ((...args: any[]) => any) | undefined;
     "onHeader-click"?: ((...args: any[]) => any) | undefined;
     "onHeader-contextmenu"?: ((...args: any[]) => any) | undefined;
+    "onUpdate:sort"?: ((...args: any[]) => any) | undefined;
     "onSort-change"?: ((...args: any[]) => any) | undefined;
     "onCell-click"?: ((...args: any[]) => any) | undefined;
     "onCell-dblclick"?: ((...args: any[]) => any) | undefined;
@@ -9711,6 +9713,7 @@ export declare const Components: {
     "onRow-dblclick"?: ((...args: any[]) => any) | undefined;
     "onHeader-dragend "?: ((...args: any[]) => any) | undefined;
     }>, {
+    sort: Record<string, any>;
     data: unknown[];
     border: boolean;
     placeholder: string | Function;
@@ -9722,7 +9725,6 @@ export declare const Components: {
     expandSelectable: boolean;
     showHeader: boolean;
     rows: number;
-    defaultSort: Record<string, any>;
     stripe: boolean;
     divider: boolean;
     showSummary: boolean;

package/dist/index.iife.js

@@ -26325,7 +26325,35 @@ var Vc = (function (exports, vue) {
       };
     }
   });
-  const TableSort = "div";
+  const TableSort = /* @__PURE__ */ vue.defineComponent({
+    name: "vc-table-sort",
+    props: {
+      order: String
+    },
+    emits: ["click"],
+    setup(props2, {
+      emit
+    }) {
+      const handleClick = (v) => {
+        emit("click", props2.order !== v ? v : "");
+      };
+      return () => {
+        return vue.createVNode("span", {
+          "class": "vc-table-sort"
+        }, [vue.createVNode("span", {
+          "class": [{
+            "is-ascending": props2.order === "ascending"
+          }, "vc-table-sort__icon vc-table-sort__icon--ascending"],
+          "onClick": vue.withModifiers(() => handleClick("ascending"), ["stop"])
+        }, null), vue.createVNode("span", {
+          "class": [{
+            "is-descending": props2.order === "descending"
+          }, "vc-table-sort__icon vc-table-sort__icon--descending"],
+          "onClick": vue.withModifiers(() => handleClick("descending"), ["stop"])
+        }, null)]);
+      };
+    }
+  });
   const TableFilter = "div";
   const TableHeader = /* @__PURE__ */ vue.defineComponent({
     name: "vc-table-header",
@@ -26333,7 +26361,7 @@ var Vc = (function (exports, vue) {
       fixed: [Boolean, String],
       border: Boolean,
       // 排序全部交给外部处理，内部不处理数据，只做交互
-      defaultSort: {
+      sort: {
         type: Object,
         default: () => ({})
       }
@@ -26530,10 +26558,12 @@ var Vc = (function (exports, vue) {
         document.body.style.cursor = "";
       };
       const handleSort = (prop, order) => {
-        table.emit("sort-change", {
+        const v = {
           prop,
           order
-        });
+        };
+        table.emit("update:sort", v);
+        table.emit("sort-change", v);
       };
       const handleFilter = (column, value) => {
         const {
@@ -26591,9 +26621,10 @@ var Vc = (function (exports, vue) {
             store: table.store
           }) : column.label, column.tooltip ? vue.createVNode(Icon, {
             "type": "o-info",
+            "class": "vc-table__tooltip",
             "onMouseenter": (e) => handleCellMouseEnter(e, column)
           }, null) : null, column.sortable ? vue.createVNode(TableSort, {
-            "order": column.prop === props2.defaultSort.prop ? props2.defaultSort.order : "",
+            "order": column.prop === props2.sort.prop ? props2.sort.order : "",
             "onClick": (order) => handleSort(column.prop, order)
           }, null) : null, column.filters ? vue.createVNode(TableFilter, {
             "data": column.filters,
@@ -26807,7 +26838,7 @@ var Vc = (function (exports, vue) {
      * 排序全部交给外部处理，内部不处理数据，只做交互
      * 列与列之间互斥
      */
-    defaultSort: {
+    sort: {
       type: Object,
       default: () => ({})
     },
@@ -26818,7 +26849,7 @@ var Vc = (function (exports, vue) {
   const Table$1 = /* @__PURE__ */ vue.defineComponent({
     name: COMPONENT_NAME$j,
     props: props$d,
-    emits: ["select", "select-all", "selection-change", "cell-mouse-enter", "cell-mouse-leave", "cell-click", "cell-dblclick", "row-click", "row-contextmenu", "row-dblclick", "header-click", "header-contextmenu", "current-change", "header-dragend ", "expand-change", "sort-change"],
+    emits: ["select", "select-all", "selection-change", "cell-mouse-enter", "cell-mouse-leave", "cell-click", "cell-dblclick", "row-click", "row-contextmenu", "row-dblclick", "header-click", "header-contextmenu", "current-change", "header-dragend ", "expand-change", "sort-change", "update:sort"],
     setup(props2, {
       slots,
       expose,
@@ -27201,7 +27232,7 @@ var Vc = (function (exports, vue) {
         }, [vue.createVNode(TableHeader, {
           "ref": tableHeader,
           "border": props2.border,
-          "default-sort": props2.defaultSort,
+          "sort": props2.sort,
           "style": bodyWidthStyle.value
         }, null)]), states.columns.length > 0 && vue.createVNode(ScrollerWheel, {
           "ref": scroller,
@@ -27250,7 +27281,7 @@ var Vc = (function (exports, vue) {
         }, [vue.createVNode(TableHeader, {
           "ref": leftFixedTableHeader,
           "border": props2.border,
-          "default-sort": props2.defaultSort,
+          "sort": props2.sort,
           "style": bodyWidthStyle.value,
           "fixed": "left"
         }, null)]), vue.createVNode("div", {
@@ -27289,7 +27320,7 @@ var Vc = (function (exports, vue) {
         }, [vue.createVNode(TableHeader, {
           "ref": rightFixedTableHeader,
           "border": props2.border,
-          "default-sort": props2.defaultSort,
+          "sort": props2.sort,
           "style": bodyWidthStyle.value,
           "fixed": "right"
         }, null)]), vue.createVNode("div", {

package/dist/index.umd.cjs

@@ -26328,7 +26328,35 @@
       };
     }
   });
-  const TableSort = "div";
+  const TableSort = /* @__PURE__ */ vue.defineComponent({
+    name: "vc-table-sort",
+    props: {
+      order: String
+    },
+    emits: ["click"],
+    setup(props2, {
+      emit
+    }) {
+      const handleClick = (v) => {
+        emit("click", props2.order !== v ? v : "");
+      };
+      return () => {
+        return vue.createVNode("span", {
+          "class": "vc-table-sort"
+        }, [vue.createVNode("span", {
+          "class": [{
+            "is-ascending": props2.order === "ascending"
+          }, "vc-table-sort__icon vc-table-sort__icon--ascending"],
+          "onClick": vue.withModifiers(() => handleClick("ascending"), ["stop"])
+        }, null), vue.createVNode("span", {
+          "class": [{
+            "is-descending": props2.order === "descending"
+          }, "vc-table-sort__icon vc-table-sort__icon--descending"],
+          "onClick": vue.withModifiers(() => handleClick("descending"), ["stop"])
+        }, null)]);
+      };
+    }
+  });
   const TableFilter = "div";
   const TableHeader = /* @__PURE__ */ vue.defineComponent({
     name: "vc-table-header",
@@ -26336,7 +26364,7 @@
       fixed: [Boolean, String],
       border: Boolean,
       // 排序全部交给外部处理，内部不处理数据，只做交互
-      defaultSort: {
+      sort: {
         type: Object,
         default: () => ({})
       }
@@ -26533,10 +26561,12 @@
         document.body.style.cursor = "";
       };
       const handleSort = (prop, order) => {
-        table.emit("sort-change", {
+        const v = {
           prop,
           order
-        });
+        };
+        table.emit("update:sort", v);
+        table.emit("sort-change", v);
       };
       const handleFilter = (column, value) => {
         const {
@@ -26594,9 +26624,10 @@
             store: table.store
           }) : column.label, column.tooltip ? vue.createVNode(Icon, {
             "type": "o-info",
+            "class": "vc-table__tooltip",
             "onMouseenter": (e) => handleCellMouseEnter(e, column)
           }, null) : null, column.sortable ? vue.createVNode(TableSort, {
-            "order": column.prop === props2.defaultSort.prop ? props2.defaultSort.order : "",
+            "order": column.prop === props2.sort.prop ? props2.sort.order : "",
             "onClick": (order) => handleSort(column.prop, order)
           }, null) : null, column.filters ? vue.createVNode(TableFilter, {
             "data": column.filters,
@@ -26810,7 +26841,7 @@
      * 排序全部交给外部处理，内部不处理数据，只做交互
      * 列与列之间互斥
      */
-    defaultSort: {
+    sort: {
       type: Object,
       default: () => ({})
     },
@@ -26821,7 +26852,7 @@
   const Table$1 = /* @__PURE__ */ vue.defineComponent({
     name: COMPONENT_NAME$j,
     props: props$d,
-    emits: ["select", "select-all", "selection-change", "cell-mouse-enter", "cell-mouse-leave", "cell-click", "cell-dblclick", "row-click", "row-contextmenu", "row-dblclick", "header-click", "header-contextmenu", "current-change", "header-dragend ", "expand-change", "sort-change"],
+    emits: ["select", "select-all", "selection-change", "cell-mouse-enter", "cell-mouse-leave", "cell-click", "cell-dblclick", "row-click", "row-contextmenu", "row-dblclick", "header-click", "header-contextmenu", "current-change", "header-dragend ", "expand-change", "sort-change", "update:sort"],
     setup(props2, {
       slots,
       expose,
@@ -27204,7 +27235,7 @@
         }, [vue.createVNode(TableHeader, {
           "ref": tableHeader,
           "border": props2.border,
-          "default-sort": props2.defaultSort,
+          "sort": props2.sort,
           "style": bodyWidthStyle.value
         }, null)]), states.columns.length > 0 && vue.createVNode(ScrollerWheel, {
           "ref": scroller,
@@ -27253,7 +27284,7 @@
         }, [vue.createVNode(TableHeader, {
           "ref": leftFixedTableHeader,
           "border": props2.border,
-          "default-sort": props2.defaultSort,
+          "sort": props2.sort,
           "style": bodyWidthStyle.value,
           "fixed": "left"
         }, null)]), vue.createVNode("div", {
@@ -27292,7 +27323,7 @@
         }, [vue.createVNode(TableHeader, {
           "ref": rightFixedTableHeader,
           "border": props2.border,
-          "default-sort": props2.defaultSort,
+          "sort": props2.sort,
           "style": bodyWidthStyle.value,
           "fixed": "right"
         }, null)]), vue.createVNode("div", {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deot/vc",
-  "version": "1.0.42",
+  "version": "1.0.43",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -19,9 +19,9 @@
     "access": "public"
   },
   "dependencies": {
-    "@deot/vc-components": "^1.0.42",
-    "@deot/vc-hooks": "^1.0.42",
-    "@deot/vc-shared": "^1.0.42"
+    "@deot/vc-components": "^1.0.43",
+    "@deot/vc-hooks": "^1.0.43",
+    "@deot/vc-shared": "^1.0.43"
   },
   "peerDependencies": {
     "vue": "*"