zartui 3.0.7 → 3.0.8

package/lib/overlay/index.d.ts

@@ -35,6 +35,6 @@ export default Overlay;
 export type { OverlayProps } from './Overlay';
 declare module 'vue' {
     interface GlobalComponents {
-        VanOverlay: typeof Overlay;
+        ZtOverlay: typeof Overlay;
     }
 }

package/lib/popover/Popover.js

@@ -196,12 +196,14 @@ var stdin_default = (0, import_vue2.defineComponent)({
       return __async(this, null, function* () {
         var _a;
         if (wrapperRef.value && popupRef.value && arrowRef.value) {
+          const popoverEl = popupRef.value;
+          const wrapperEl = wrapperRef.value;
           const {
             x,
             y,
             placement: realPlacement,
             middlewareData
-          } = yield (0, import_vue3.computePosition)(wrapperRef.value, popupRef.value, {
+          } = yield (0, import_vue3.computePosition)(wrapperEl, popoverEl, {
             placement: props.placement,
             middleware: [(0, import_vue3.offset)(8), (0, import_vue3.shift)({
               padding: 4,
@@ -212,11 +214,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
               padding: 6
             })]
           });
-          Object.assign(popupRef.value.style, {
-            left: `${x}px`,
-            top: `${y}px`
-          });
-          popupRef.value.setAttribute("data-popper-placement", realPlacement);
+          let popupTop = y;
           const side = realPlacement.split("-")[0];
           const arrowSide = {
             top: "bottom",
@@ -224,6 +222,16 @@ var stdin_default = (0, import_vue2.defineComponent)({
             bottom: "top",
             left: "right"
           }[side];
+          if (y < 0) {
+            popupTop = 0;
+          } else if (y > 0 && y + popoverEl.offsetHeight > document.body.clientHeight) {
+            popupTop = document.body.clientHeight - popoverEl.offsetHeight;
+          }
+          Object.assign(popupRef.value.style, {
+            left: `${x}px`,
+            top: `${popupTop}px`
+          });
+          popupRef.value.setAttribute("data-popper-placement", realPlacement);
           const {
             x: arrowX,
             y: arrowY

package/lib/swipe-cell/index.d.ts

@@ -34,6 +34,6 @@ export type { SwipeCellProps };
 export type { SwipeCellSide, SwipeCellPosition, SwipeCellInstance, } from './types';
 declare module 'vue' {
     interface GlobalComponents {
-        VanSwipeCell: typeof SwipeCell;
+        ZtSwipeCell: typeof SwipeCell;
     }
 }

package/lib/table/Table.d.ts

@@ -1,5 +1,6 @@
 import { CSSProperties } from 'vue';
 import type { ExtractPropTypes } from 'vue';
+import { SortOrderType } from './types';
 export declare type TableBodyOption = {
     [key: string]: any;
 };
@@ -9,7 +10,9 @@ export declare type TableHeaderOption = {
     width?: string;
     fixed?: boolean;
     style?: CSSProperties;
-    click?: (data: TableBodyOption) => void;
+    click?: (data: TableBodyOption, index?: number) => void;
+    defaultSortOrder?: SortOrderType;
+    sorter?: boolean;
     [key: string]: any;
 };
 export declare const tableProps: {
@@ -72,7 +75,7 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "sort"[], "sort", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
     headList: {
         type: import("vue").PropType<TableHeaderOption[]>;
         default: () => TableHeaderOption[];
@@ -101,7 +104,9 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
-}>>, {
+}>> & {
+    onSort?: ((...args: any[]) => any) | undefined;
+}, {
     border: boolean;
     loading: boolean;
     headList: TableHeaderOption[];

package/lib/table/Table.js

@@ -24,6 +24,8 @@ module.exports = __toCommonJS(stdin_exports);
 var import_vue = require("vue");
 var import_vue2 = require("vue");
 var import_utils = require("../utils");
+var import_icon = require("../icon");
+var import_types = require("./types");
 const [name, bem] = (0, import_utils.createNamespace)("table");
 const tableProps = {
   headList: (0, import_utils.makeArrayProp)(),
@@ -46,12 +48,42 @@ const tableProps = {
 var stdin_default = (0, import_vue2.defineComponent)({
   name,
   props: tableProps,
-  setup(props) {
-    const fixedBoxRef = (0, import_vue2.ref)();
+  emits: ["sort"],
+  setup(props, {
+    emit
+  }) {
+    const sortOrder = (0, import_vue2.ref)("");
+    const sortKey = (0, import_vue2.ref)("");
     const fixedColumn = (0, import_vue2.computed)(() => props.headList.filter((v) => v.fixed));
+    const formatColumns = (0, import_vue2.computed)(() => {
+      const columns = [];
+      let left = 0;
+      props.headList.forEach((element, index) => {
+        var _a;
+        const column = Object.assign({}, element);
+        const preColumn = props.headList[index - 1];
+        const nextColumn = props.headList[index + 1];
+        if (preColumn) {
+          left += Number((_a = preColumn.width) == null ? void 0 : _a.split("px")[0]);
+          column.left = `${left}px`;
+        } else {
+          column.left = 0;
+        }
+        if (element.fixed && !nextColumn.fixed) {
+          column.lastFixLeft = true;
+        }
+        columns.push(column);
+      });
+      return columns;
+    });
+    const pingedLeft = (0, import_vue2.ref)(false);
     const resortHeadList = (0, import_vue2.computed)(() => fixedColumn.value.concat(props.headList.filter((v) => !v.fixed)));
     (0, import_vue2.onMounted)(() => {
       const fixedIndexList = props.headList.map((v, i) => {
+        if (v.sorter && v.defaultSortOrder) {
+          sortOrder.value = v.defaultSortOrder || "";
+          sortKey.value = v.key;
+        }
         if (v.fixed) {
           return `tableHead${i}`;
         } else {
@@ -68,31 +100,86 @@ var stdin_default = (0, import_vue2.defineComponent)({
         }, 0);
       }
     });
-    const onScroll = (e) => {
-      var _a, _b, _c;
-      if (((_a = e.target) == null ? void 0 : _a.scrollLeft) > 0) {
-        (_b = fixedBoxRef.value) == null ? void 0 : _b.classList.add("shadow");
+    const getNextSortOrder = (type) => {
+      if (!type) {
+        return import_types.SortOrderEnum.ASCEND;
+      } else if (type === import_types.SortOrderEnum.ASCEND) {
+        return import_types.SortOrderEnum.DESCEND;
       } else {
-        (_c = fixedBoxRef.value) == null ? void 0 : _c.classList.remove("shadow");
+        return "";
       }
     };
-    const onClick = (data, click) => {
-      if (click) {
-        click(data);
+    const onHeaderClick = (data) => {
+      if (!data.sorter)
+        return;
+      sortOrder.value = getNextSortOrder(data.key === sortKey.value ? sortOrder.value : "");
+      sortKey.value = data.key;
+      emit("sort", {
+        order: sortOrder.value,
+        key: data.key
+      });
+    };
+    const onScroll = (event) => {
+      const {
+        scrollLeft,
+        currentTarget
+      } = event;
+      const mergedScrollLeft = typeof scrollLeft === "number" ? scrollLeft : currentTarget == null ? void 0 : currentTarget.scrollLeft;
+      pingedLeft.value = mergedScrollLeft > 0;
+    };
+    const getHead = (colData) => {
+      if ((colData == null ? void 0 : colData.colSpan) !== 0) {
+        return (0, import_vue.createVNode)("th", {
+          "class": bem("left", {
+            fixed: colData.fixed,
+            last: colData.lastFixLeft && pingedLeft.value
+          }),
+          "style": {
+            left: colData.fixed ? colData.left : ""
+          },
+          "colspan": (colData == null ? void 0 : colData.colSpan) !== 1 ? colData == null ? void 0 : colData.colSpan : null
+        }, [(0, import_vue.createVNode)("div", {
+          "class": bem("head"),
+          "onClick": () => onHeaderClick(colData)
+        }, [(0, import_vue.createVNode)("span", {
+          "class": bem("head-label")
+        }, [colData.label]), colData.sorter ? (0, import_vue.createVNode)("span", {
+          "class": bem("head-sort")
+        }, [(0, import_vue.createVNode)(import_icon.Icon, {
+          "class": [colData.key === sortKey.value && sortOrder.value === import_types.SortOrderEnum.ASCEND ? bem("sort-active") : ""],
+          "name": "spinner-shrink",
+          "size": "12",
+          "style": {
+            marginBottom: "-3px"
+          }
+        }, null), (0, import_vue.createVNode)(import_icon.Icon, {
+          "class": [colData.key === sortKey.value && sortOrder.value === import_types.SortOrderEnum.DESCEND ? bem("sort-active") : ""],
+          "name": "spinner-expand",
+          "size": "12",
+          "style": {
+            marginTop: "-3px"
+          }
+        }, null)]) : ""])]);
       }
     };
-    const getValue = (value) => value === void 0 || value === "" || value === null ? props.emptyValue : value;
-    const genColumn = (headObj, index, isFixed) => (0, import_vue.createVNode)("div", {
-      "class": [bem(isFixed ? "fixed-head" : "head")],
-      "id": isFixed ? `fixedHead${index}` : `tableHead${index}`,
-      "style": isFixed ? "" : headObj.width ? `width:${headObj.width};` : ""
-    }, [(0, import_vue.createVNode)("div", {
-      "class": [bem("item"), bem("head-item")]
-    }, [headObj.label]), props.dataList.map((data) => (0, import_vue.createVNode)("div", {
-      "class": [bem("item"), bem("body")],
-      "style": headObj.style,
-      "onClick": () => onClick(data, headObj.click)
-    }, [getValue(data[headObj.key])]))]);
+    const getBody = (rowData, rowIndex) => (0, import_vue.createVNode)("tr", null, [formatColumns.value.map((colData) => {
+      let additionalCellProps;
+      if (colData.customCell) {
+        additionalCellProps = colData.customCell(rowData, rowIndex);
+      }
+      const style = Object.assign({}, colData.style);
+      style.left = colData.fixed ? colData.left : "";
+      return (additionalCellProps == null ? void 0 : additionalCellProps.rowSpan) !== 0 && (additionalCellProps == null ? void 0 : additionalCellProps.colSpan) !== 0 && (0, import_vue.createVNode)("td", {
+        "onClick": () => colData.click && colData.click(rowData, rowIndex),
+        "class": bem("left", {
+          fixed: colData.fixed,
+          last: colData.lastFixLeft && pingedLeft.value
+        }),
+        "colspan": (additionalCellProps == null ? void 0 : additionalCellProps.colSpan) !== 1 ? additionalCellProps == null ? void 0 : additionalCellProps.colSpan : null,
+        "rowspan": (additionalCellProps == null ? void 0 : additionalCellProps.rowSpan) !== 1 ? additionalCellProps == null ? void 0 : additionalCellProps.rowSpan : null,
+        "style": style
+      }, [rowData[colData.key]]);
+    })]);
     const getCol = () => {
       const cols = [];
       const col = resortHeadList.value.length;
@@ -123,15 +210,19 @@ var stdin_default = (0, import_vue2.defineComponent)({
       })
     }, [getLoadingColumn()]) : (0, import_vue.createVNode)("div", {
       "class": bem({
-        striped: props.striped,
-        "no-border": !props.border
-      })
-    }, [(0, import_vue.createVNode)("div", {
-      "class": bem("normal-box"),
+        fixed: fixedColumn.value.length > 0,
+        bordered: props.border,
+        striped: props.striped
+      }),
       "onScroll": onScroll
-    }, [resortHeadList.value.map((x, i) => genColumn(x, i))]), (0, import_vue.createVNode)("div", {
-      "class": bem("fixed-box"),
-      "ref": fixedBoxRef
-    }, [fixedColumn.value.map((x, i) => genColumn(x, i, true))])]);
+    }, [(0, import_vue.createVNode)("table", null, [(0, import_vue.createVNode)("colgroup", null, [props.headList.map((item) => (0, import_vue.createVNode)("col", {
+      "style": {
+        width: item.width
+      }
+    }, null))]), (0, import_vue.createVNode)("thead", {
+      "class": bem("thead")
+    }, [(0, import_vue.createVNode)("tr", null, [formatColumns.value.map((colData) => getHead(colData))])]), (0, import_vue.createVNode)("tbody", {
+      "class": bem("tbody")
+    }, [props.dataList.map((rowData, rowIndex) => getBody(rowData, rowIndex))])])]);
   }
 });

package/lib/table/index.css

@@ -1 +1 @@
-:root{--zt-table-head-height: 40px;--zt-table-head-font-size: var(--zt-font-size-md);--zt-table-head-color: var(--zt-blue);--zt-table-head-background: #e6f5ff;--zt-table-body-height: 40px;--zt-table-body-font-size: var(--zt-font-size-md);--zt-table-body-color: var(--zt-gray-default);--zt-table-body-background: var(--zt-white)}.zt-base-hair{position:relative}.zt-base-hair:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--zt-border-color);transform:scale(.5)}.zt-table{position:relative}.zt-table--no-border .zt-table__head:after,.zt-table--no-border .zt-table__fixed-head:after,.zt-table--no-border .zt-table__normal-box:after,.zt-table--no-border .zt-table__head-item:after,.zt-table--no-border .zt-table__body:after{display:none}.zt-table--skeleton{background-color:#fff;padding-bottom:10px}.zt-table__row{display:flex;box-sizing:border-box;padding:0 10px;height:40px}.zt-table__row--head{display:flex;justify-content:center;align-items:center;background-color:#e7f0fb;margin-bottom:8px}.zt-table__row--head .zt-table__col-item{background-color:#cfdae9;height:20px}.zt-table__col{display:flex;align-items:center;justify-content:center;box-sizing:border-box;flex:1;padding:4px 6px;height:40px}.zt-table__col-item{width:100%;height:100%;border-radius:4px;background-color:rgba(45,75,115,.06)}.zt-table--animate{animation:zt-table-blink var(--zt-skeleton-duration) ease-in-out infinite}.zt-table__normal-box{display:flex;overflow-x:scroll;position:relative}.zt-table__normal-box:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--zt-border-color);transform:scale(.5)}.zt-table__normal-box:after{border-left-width:var(--zt-border-width)}.zt-table__normal-box::-webkit-scrollbar{width:unset;background-color:unset;height:4px}.zt-table__normal-box::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.1)}.zt-table--striped .zt-table__body:nth-child(odd){background-color:var(--zt-background)}.zt-table__fixed-box{display:flex;position:absolute;top:0;left:0;z-index:2}.zt-table__fixed-box.shadow:after{content:"";position:absolute;top:0;right:-10px;width:10px;height:100%;opacity:.06;background-image:linear-gradient(90deg,#000000 0%,rgba(0,0,0,0) 100%)}.zt-table__fixed-head{position:relative}.zt-table__fixed-head:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--zt-border-color);transform:scale(.5)}.zt-table__fixed-head:after{border-width:var(--zt-border-width)}.zt-table__head{flex-shrink:0;flex:1 0 auto;position:relative}.zt-table__head:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--zt-border-color);transform:scale(.5)}.zt-table__head:after{border-right-width:var(--zt-border-width)}.zt-table__item{text-align:center}.zt-table__head-item{height:var(--zt-table-head-height);font-size:var(--zt-table-head-font-size);color:var(--zt-table-head-color);line-height:var(--zt-table-head-height);background:var(--zt-table-head-background);font-weight:600;position:relative}.zt-table__head-item:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--zt-border-color);transform:scale(.5)}.zt-table__head-item:after{border-width:var(--zt-border-width) 0}.zt-table__body{height:var(--zt-table-body-height);font-size:var(--zt-table-body-font-size);color:var(--zt-table-body-color);line-height:var(--zt-table-body-height);background:var(--zt-table-body-background);position:relative}.zt-table__body:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}@keyframes zt-table-blink{50%{opacity:.6}}
+:root{--zt-table-head-height: 40px;--zt-table-head-font-size: var(--zt-font-size-md);--zt-table-head-color: var(--zt-blue);--zt-table-head-background: #e6f5ff;--zt-table-body-height: 40px;--zt-table-body-line-height: 20px;--zt-table-body-font-size: var(--zt-font-size-md);--zt-table-body-color: var(--zt-gray-default);--zt-table-body-background: var(--zt-white);--zt-table-sort-default: var(--zt-gray-5);--zt-table-sort-active: var(--zt-blue)}.zt-base-hair{position:relative}.zt-base-hair:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--zt-border-color);transform:scale(.5)}.zt-table table{border-collapse:separate;border-spacing:0;width:100%;table-layout:auto;box-sizing:border-box}.zt-table--fixed{overflow:auto scroll}.zt-table--fixed::-webkit-scrollbar{width:0;height:0}.zt-table--fixed table{table-layout:fixed}.zt-table--thead-fixed{position:-webkit-sticky!important;position:sticky!important;z-index:2}.zt-table--bordered{position:relative}.zt-table--bordered:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--zt-border-color);transform:scale(.5)}.zt-table--bordered:after{border-left-width:var(--zt-border-width)}.zt-table--bordered>table{position:relative}.zt-table--bordered>table:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--zt-border-color);transform:scale(.5)}.zt-table--bordered>table:after{border-top-width:var(--zt-border-width)}.zt-table--bordered .zt-table__thead>tr>th{position:relative}.zt-table--bordered .zt-table__thead>tr>th:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--zt-border-color);transform:scale(.5)}.zt-table--bordered .zt-table__thead>tr>th:after{border-right-width:var(--zt-border-width);border-bottom-width:var(--zt-border-width)}.zt-table--bordered .zt-table__tbody>tr>td{position:relative}.zt-table--bordered .zt-table__tbody>tr>td:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--zt-border-color);transform:scale(.5)}.zt-table--bordered .zt-table__tbody>tr>td:after{border-right-width:var(--zt-border-width);border-bottom-width:var(--zt-border-width)}.zt-table__thead>tr>th{box-sizing:border-box;overflow-wrap:break-word;min-height:var(--zt-table-head-height);font-weight:600;font-size:var(--zt-table-head-font-size);color:var(--zt-table-head-color);text-align:center;line-height:var(--zt-table-head-height);background:var(--zt-table-head-background)}.zt-table__tbody>tr>td{box-sizing:border-box;overflow-wrap:break-word;min-height:var(--zt-table-body-height);font-size:var(--zt-table-body-font-size);color:var(--zt-table-body-color);text-align:center;line-height:var(--zt-table-body-line-height);background:var(--zt-table-body-background);padding:10px 16px}.zt-table--striped .zt-table__tbody>tr:nth-child(even)>td{background:var(--zt-table-head-background)}.zt-table__left--last{border-right:none!important}.zt-table__left--last:after{content:"";position:absolute;top:0;right:-10px;width:10px;height:100%;opacity:.06;background-image:linear-gradient(90deg,#000000 0%,rgba(0,0,0,0) 100%)}.zt-table__left--fixed{position:-webkit-sticky!important;position:sticky!important;z-index:2}.zt-table__head{display:flex;justify-content:center}.zt-table__head-sort{display:inline-flex;align-items:center;justify-content:center;flex-direction:column;color:var(--zt-table-sort-default)}.zt-table__head-label{line-height:var(--zt-table-head-height)}.zt-table__sort-active{color:var(--zt-table-sort-active)}.zt-table--skeleton{background-color:#fff;padding-bottom:10px}.zt-table__row{display:flex;box-sizing:border-box;padding:0 10px;height:40px}.zt-table__row--head{display:flex;justify-content:center;align-items:center;background-color:#e7f0fb;margin-bottom:8px}.zt-table__row--head .zt-table__col-item{background-color:#cfdae9;height:20px}.zt-table__col{display:flex;align-items:center;justify-content:center;box-sizing:border-box;flex:1;padding:4px 6px;height:40px}.zt-table__col-item{width:100%;height:100%;border-radius:4px;background-color:rgba(45,75,115,.06)}.zt-table--animate{animation:zt-table-blink var(--zt-skeleton-duration) ease-in-out infinite}@keyframes zt-table-blink{50%{opacity:.6}}

package/lib/table/index.d.ts

@@ -27,7 +27,7 @@ export declare const Table: import("../utils").WithInstall<import("vue").DefineC
         type: BooleanConstructor;
         default: boolean;
     };
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "sort"[], "sort", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     headList: {
         type: import("vue").PropType<import("./Table").TableHeaderOption[]>;
         default: () => import("./Table").TableHeaderOption[];
@@ -56,7 +56,9 @@ export declare const Table: import("../utils").WithInstall<import("vue").DefineC
         type: BooleanConstructor;
         default: boolean;
     };
-}>>, {
+}>> & {
+    onSort?: ((...args: any[]) => any) | undefined;
+}, {
     border: boolean;
     loading: boolean;
     headList: import("./Table").TableHeaderOption[];

package/lib/table/style/index.js

@@ -1,2 +1,4 @@
 require("../../style/base.css");
+require("../../badge/index.css");
+require("../../icon/index.css");
 require("../index.css");

package/lib/table/types.d.ts

@@ -0,0 +1,5 @@
+export declare type SortOrderType = 'ascend' | 'descend';
+export declare enum SortOrderEnum {
+    ASCEND = "ascend",
+    DESCEND = "descend"
+}

package/lib/table/types.js

@@ -0,0 +1,27 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var stdin_exports = {};
+__export(stdin_exports, {
+  SortOrderEnum: () => SortOrderEnum
+});
+module.exports = __toCommonJS(stdin_exports);
+var SortOrderEnum = /* @__PURE__ */ ((SortOrderEnum2) => {
+  SortOrderEnum2["ASCEND"] = "ascend";
+  SortOrderEnum2["DESCEND"] = "descend";
+  return SortOrderEnum2;
+})(SortOrderEnum || {});

package/lib/tag/Tag.d.ts

@@ -17,6 +17,7 @@ export declare const tagProps: {
     borderColor: StringConstructor;
     closeable: BooleanConstructor;
     icon: StringConstructor;
+    image: StringConstructor;
     iconPrefix: StringConstructor;
     iconColor: StringConstructor;
     badge: BooleanConstructor;
@@ -52,6 +53,7 @@ declare const _default: import("vue").DefineComponent<{
     borderColor: StringConstructor;
     closeable: BooleanConstructor;
     icon: StringConstructor;
+    image: StringConstructor;
     iconPrefix: StringConstructor;
     iconColor: StringConstructor;
     badge: BooleanConstructor;
@@ -85,6 +87,7 @@ declare const _default: import("vue").DefineComponent<{
     borderColor: StringConstructor;
     closeable: BooleanConstructor;
     icon: StringConstructor;
+    image: StringConstructor;
     iconPrefix: StringConstructor;
     iconColor: StringConstructor;
     badge: BooleanConstructor;

package/lib/tag/Tag.js

@@ -1,6 +1,8 @@
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name2 in all)
@@ -14,6 +16,14 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var stdin_exports = {};
 __export(stdin_exports, {
@@ -26,6 +36,7 @@ var import_vue2 = require("vue");
 var import_utils = require("../utils");
 var import_icon = require("../icon");
 var import_parse = require("../utils/parse");
+var import_image = __toESM(require("../image"));
 const [name, bem] = (0, import_utils.createNamespace)("tag");
 const tagProps = {
   mark: Boolean,
@@ -38,6 +49,7 @@ const tagProps = {
   borderColor: String,
   closeable: Boolean,
   icon: String,
+  image: String,
   iconPrefix: String,
   iconColor: String,
   badge: Boolean,
@@ -100,27 +112,33 @@ var stdin_default = (0, import_vue2.defineComponent)({
         "class": [bem("close"), import_utils.HAPTICS_FEEDBACK],
         "onClick": onClose
       }, null);
-      const LeftIcon = props.icon && (0, import_vue.createVNode)(import_icon.Icon, {
-        "name": props.icon,
-        "class": bem("icon"),
-        "classPrefix": props.iconPrefix,
-        "style": {
-          color: props.iconColor
+      const LeftIcon = () => {
+        if (props.image) {
+          return (0, import_vue.createVNode)(import_image.default, {
+            "class": bem("image"),
+            "src": props.image
+          }, null);
+        } else if (props.icon) {
+          return (0, import_vue.createVNode)(import_icon.Icon, {
+            "name": props.icon,
+            "class": bem("icon"),
+            "classPrefix": props.iconPrefix,
+            "style": {
+              color: props.iconColor
+            }
+          }, null);
         }
-      }, null);
+      };
       return (0, import_vue.createVNode)("span", {
         "style": getStyle(),
         "class": bem([classes, type])
-      }, [LeftIcon, (_a = slots.default) == null ? void 0 : _a.call(slots), CloseIcon]);
-    };
-    const getStampStyle = () => {
-      const style = {
-        color: props.color || props.textColor,
-        width: props.stampDiameter + "px",
-        height: props.stampDiameter + "px"
-      };
-      return style;
+      }, [LeftIcon(), (_a = slots.default) == null ? void 0 : _a.call(slots), CloseIcon]);
     };
+    const getStampStyle = () => ({
+      color: props.color || props.textColor,
+      width: props.stampDiameter + "px",
+      height: props.stampDiameter + "px"
+    });
     const renderStampTag = () => {
       var _a;
       const {

package/lib/tag/index.css

@@ -1 +1 @@
-:root{--zt-tag-padding: var(--zt-padding-base) var(--zt-padding-sm);--zt-tag-text-color: var(--zt-white);--zt-tag-font-size: var(--zt-font-size-sm);--zt-tag-radius: 2px;--zt-tag-line-height: 16px;--zt-tag-icon-gap: 2px;--zt-tag-icon-size: 16px;--zt-tag-close-icon-size: 20px;--zt-tag-round-radius: 12px;--zt-tag-round-line-height: 16px;--zt-tag-badge-padding: 0 var(--zt-padding-sm);--zt-tag-closeable-font-size: var(--zt-font-size-md);--zt-tag-closeable-line-height: 20px;--zt-tag-closeable-radius: 14px;--zt-tag-closeable-background: var(--zt-gray-a6);--zt-tag-danger-color: var(--zt-danger-color);--zt-tag-primary-color: var(--zt-primary-color);--zt-tag-success-color: var(--zt-success-color);--zt-tag-warning-color: var(--zt-warning-color);--zt-tag-default-color: var(--zt-gray-a08);--zt-tag-plain-background: var(--zt-background-2);--zt-tag-stamp-diameter: 60px}.zt-tag{position:relative;display:inline-flex;box-sizing:border-box;align-items:center;padding:var(--zt-tag-padding);color:var(--zt-tag-text-color);font-size:var(--zt-tag-font-size);line-height:var(--zt-tag-line-height);border-radius:var(--zt-tag-radius);overflow:hidden;word-break:break-all}.zt-tag__icon{font-size:var(--zt-tag-icon-size);margin-right:var(--zt-tag-icon-gap)}.zt-tag--default{background:var(--zt-tag-default-color)}.zt-tag--default.zt-tag--plain{color:var(--zt-tag-default-color)}.zt-tag--danger{background:var(--zt-tag-danger-color)}.zt-tag--danger.zt-tag--plain{color:var(--zt-tag-danger-color)}.zt-tag--primary{background:var(--zt-tag-primary-color)}.zt-tag--primary.zt-tag--plain{color:var(--zt-tag-primary-color)}.zt-tag--success{background:var(--zt-tag-success-color)}.zt-tag--success.zt-tag--plain{color:var(--zt-tag-success-color)}.zt-tag--warning{background:var(--zt-tag-warning-color)}.zt-tag--warning.zt-tag--plain{color:var(--zt-tag-warning-color)}.zt-tag--plain{background:var(--zt-tag-plain-background);border-color:currentColor}.zt-tag--plain:before{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;border-color:inherit;border-radius:inherit;content:"";pointer-events:none}.zt-tag--mark{border-radius:0 var(--zt-tag-round-radius) var(--zt-tag-round-radius) 0}.zt-tag--mark:after{display:block;width:2px;content:""}.zt-tag--round{border-radius:var(--zt-tag-round-radius);line-height:var(--zt-tag-round-line-height)}.zt-tag__close{font-size:var(--zt-tag-close-icon-size);margin-left:2px}.zt-tag--closeable{font-size:var(--zt-tag-closeable-font-size);line-height:var(--zt-tag-closeable-line-height);background:var(--zt-tag-closeable-background);border-radius:var(--zt-tag-closeable-radius)}.zt-tag--badge{position:absolute;text-align:center;display:block;box-sizing:border-box;padding:var(--zt-tag-badge-padding)}.zt-tag__stamp{width:var(--zt-tag-stamp-diameter);height:var(--zt-tag-stamp-diameter);background:rgba(0,0,0,0);padding:0}.zt-tag__stamp--text{width:50px;height:24px;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;text-align:center;font-weight:600}.zt-tag__stamp--default{color:var(--zt-gray-a6)}.zt-tag__stamp--danger{color:var(--zt-tag-danger-color)}.zt-tag__stamp--primary{color:var(--zt-tag-primary-color)}.zt-tag__stamp--success{color:var(--zt-tag-success-color)}.zt-tag__stamp--warning{color:var(--zt-tag-warning-color)}.zt-theme-dark{--zt-tag-closeable-background: rgba(255, 255, 255, .1)}
+:root{--zt-tag-padding: var(--zt-padding-base) var(--zt-padding-sm);--zt-tag-text-color: var(--zt-white);--zt-tag-font-size: var(--zt-font-size-sm);--zt-tag-radius: 2px;--zt-tag-line-height: 16px;--zt-tag-icon-gap: 2px;--zt-tag-icon-size: 16px;--zt-tag-close-icon-size: 20px;--zt-tag-round-radius: 12px;--zt-tag-round-line-height: 16px;--zt-tag-badge-padding: 0 var(--zt-padding-sm);--zt-tag-closeable-font-size: var(--zt-font-size-md);--zt-tag-closeable-line-height: 20px;--zt-tag-closeable-radius: 14px;--zt-tag-closeable-background: var(--zt-gray-a6);--zt-tag-danger-color: var(--zt-danger-color);--zt-tag-primary-color: var(--zt-primary-color);--zt-tag-success-color: var(--zt-success-color);--zt-tag-warning-color: var(--zt-warning-color);--zt-tag-default-color: var(--zt-gray-a08);--zt-tag-plain-background: var(--zt-background-2);--zt-tag-stamp-diameter: 60px}.zt-tag{position:relative;display:inline-flex;box-sizing:border-box;align-items:center;padding:var(--zt-tag-padding);color:var(--zt-tag-text-color);font-size:var(--zt-tag-font-size);line-height:var(--zt-tag-line-height);border-radius:var(--zt-tag-radius);overflow:hidden;word-break:break-all}.zt-tag__icon{font-size:var(--zt-tag-icon-size);margin-right:var(--zt-tag-icon-gap)}.zt-tag__image{width:var(--zt-tag-icon-size);height:var(--zt-tag-icon-size);margin-right:var(--zt-tag-icon-gap)}.zt-tag--default{background:var(--zt-tag-default-color)}.zt-tag--default.zt-tag--plain{color:var(--zt-tag-default-color)}.zt-tag--danger{background:var(--zt-tag-danger-color)}.zt-tag--danger.zt-tag--plain{color:var(--zt-tag-danger-color)}.zt-tag--primary{background:var(--zt-tag-primary-color)}.zt-tag--primary.zt-tag--plain{color:var(--zt-tag-primary-color)}.zt-tag--success{background:var(--zt-tag-success-color)}.zt-tag--success.zt-tag--plain{color:var(--zt-tag-success-color)}.zt-tag--warning{background:var(--zt-tag-warning-color)}.zt-tag--warning.zt-tag--plain{color:var(--zt-tag-warning-color)}.zt-tag--plain{background:var(--zt-tag-plain-background);border-color:currentColor}.zt-tag--plain:before{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;border-color:inherit;border-radius:inherit;content:"";pointer-events:none}.zt-tag--mark{border-radius:0 var(--zt-tag-round-radius) var(--zt-tag-round-radius) 0}.zt-tag--mark:after{display:block;width:2px;content:""}.zt-tag--round{border-radius:var(--zt-tag-round-radius);line-height:var(--zt-tag-round-line-height)}.zt-tag__close{font-size:var(--zt-tag-close-icon-size);margin-left:2px}.zt-tag--closeable{font-size:var(--zt-tag-closeable-font-size);line-height:var(--zt-tag-closeable-line-height);background:var(--zt-tag-closeable-background);border-radius:var(--zt-tag-closeable-radius)}.zt-tag--badge{position:absolute;text-align:center;display:block;box-sizing:border-box;padding:var(--zt-tag-badge-padding)}.zt-tag__stamp{width:var(--zt-tag-stamp-diameter);height:var(--zt-tag-stamp-diameter);background:rgba(0,0,0,0);padding:0}.zt-tag__stamp--text{width:50px;height:24px;line-height:24px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;text-align:center;font-weight:600}.zt-tag__stamp--default{color:var(--zt-gray-a6)}.zt-tag__stamp--danger{color:var(--zt-tag-danger-color)}.zt-tag__stamp--primary{color:var(--zt-tag-primary-color)}.zt-tag__stamp--success{color:var(--zt-tag-success-color)}.zt-tag__stamp--warning{color:var(--zt-tag-warning-color)}.zt-theme-dark{--zt-tag-closeable-background: rgba(255, 255, 255, .1)}

package/lib/tag/index.d.ts

@@ -15,6 +15,7 @@ export declare const Tag: import("../utils").WithInstall<import("vue").DefineCom
     borderColor: StringConstructor;
     closeable: BooleanConstructor;
     icon: StringConstructor;
+    image: StringConstructor;
     iconPrefix: StringConstructor;
     iconColor: StringConstructor;
     badge: BooleanConstructor;
@@ -48,6 +49,7 @@ export declare const Tag: import("../utils").WithInstall<import("vue").DefineCom
     borderColor: StringConstructor;
     closeable: BooleanConstructor;
     icon: StringConstructor;
+    image: StringConstructor;
     iconPrefix: StringConstructor;
     iconColor: StringConstructor;
     badge: BooleanConstructor;

package/lib/tag/style/index.js

@@ -1,4 +1,5 @@
 require("../../style/base.css");
 require("../../badge/index.css");
 require("../../icon/index.css");
+require("../../image/index.css");
 require("../index.css");

package/lib/uploader/UploaderPreviewItem.d.ts

@@ -14,7 +14,7 @@ declare const _default: import("vue").DefineComponent<{
     deletable: BooleanConstructor;
     previewSize: PropType<Numeric | [Numeric, Numeric]>;
     beforeDelete: PropType<Interceptor>;
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("delete" | "preview")[], "preview" | "delete", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("preview" | "delete")[], "preview" | "delete", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     name: (NumberConstructor | StringConstructor)[];
     item: {
         type: PropType<UploaderFileListItem>;