zartui 3.1.17 → 3.1.19

package/es/table/Table.mjs

@@ -1,8 +1,9 @@
-import { createVNode as _createVNode } from "vue";
+import { withDirectives as _withDirectives, vShow as _vShow, createVNode as _createVNode } from "vue";
 import { defineComponent, computed, onMounted, ref } from "vue";
 import { createNamespace, makeArrayProp, makeStringProp, truthProp } from "../utils/index.mjs";
 import { Icon } from "../icon/index.mjs";
 import { SortOrderEnum } from "./types.mjs";
+import TextEllipsis from "../text-ellipsis/index.mjs";
 const [name, bem] = createNamespace("table");
 const tableProps = {
   headList: makeArrayProp(),
@@ -20,6 +21,10 @@ const tableProps = {
   border: {
     type: Boolean,
     default: false
+  },
+  hideTableHead: {
+    type: Boolean,
+    default: false
   }
 };
 var stdin_default = defineComponent({
@@ -27,7 +32,8 @@ var stdin_default = defineComponent({
   props: tableProps,
   emits: ["sort"],
   setup(props, {
-    emit
+    emit,
+    slots
   }) {
     const sortOrder = ref("");
     const sortKey = ref("");
@@ -105,6 +111,8 @@ var stdin_default = defineComponent({
       pingedLeft.value = mergedScrollLeft > 0;
     };
     const getHead = (colData) => {
+      const headSlot = slots[`head-${colData.id}`];
+      const headEllipsisType = colData.sorter ? "flat" : "dialog";
       if ((colData == null ? void 0 : colData.colSpan) !== 0) {
         return _createVNode("th", {
           "class": bem("left", {
@@ -115,10 +123,14 @@ var stdin_default = defineComponent({
             left: colData.fixed ? colData.left : ""
           },
           "colspan": (colData == null ? void 0 : colData.colSpan) !== 1 ? colData == null ? void 0 : colData.colSpan : null
-        }, [_createVNode("div", {
+        }, [headSlot ? headSlot(colData) : _createVNode("div", {
           "class": bem("head"),
           "onClick": () => onHeaderClick(colData)
-        }, [_createVNode("span", {
+        }, [colData.ellipsis ? _createVNode(TextEllipsis, {
+          "content": colData.label,
+          "expandType": headEllipsisType,
+          "class": bem("head-label-ellipsis")
+        }, null) : _createVNode("span", {
           "class": bem("head-label")
         }, [colData.label]), colData.sorter ? _createVNode("span", {
           "class": bem("head-sort")
@@ -139,6 +151,15 @@ var stdin_default = defineComponent({
         }, null)]) : ""])]);
       }
     };
+    const getElement = (rowData, colData) => {
+      if (rowData[colData.key] && rowData[colData.key].id && slots[`data-${rowData[colData.key].id}`]) {
+        return slots[`data-${rowData[colData.key].id}`](rowData[colData.key]);
+      }
+      return colData.ellipsis ? _createVNode(TextEllipsis, {
+        "content": rowData[colData.key],
+        "expandType": "dialog"
+      }, null) : rowData[colData.key];
+    };
     const getBody = (rowData, rowIndex) => _createVNode("tr", null, [formatColumns.value.map((colData) => {
       let additionalCellProps;
       if (colData.customCell) {
@@ -155,7 +176,7 @@ var stdin_default = defineComponent({
         "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]]);
+      }, [getElement(rowData, colData)]);
     })]);
     const getCol = () => {
       const cols = [];
@@ -196,9 +217,9 @@ var stdin_default = defineComponent({
       "style": {
         width: item.width
       }
-    }, null))]), _createVNode("thead", {
+    }, null))]), _withDirectives(_createVNode("thead", {
       "class": bem("thead")
-    }, [_createVNode("tr", null, [formatColumns.value.map((colData) => getHead(colData))])]), _createVNode("tbody", {
+    }, [_createVNode("tr", null, [formatColumns.value.map((colData) => getHead(colData))])]), [[_vShow, !props.hideTableHead]]), _createVNode("tbody", {
       "class": bem("tbody")
     }, [props.dataList.map((rowData, rowIndex) => getBody(rowData, rowIndex))])])]);
   }

package/es/table/index.css

@@ -1 +1 @@
-:root{--zt-table-head-color: var(--zt-primary-color);--zt-table-head-height: 40px;--zt-table-head-background: #e6f5ff;--zt-table-body-height: 40px;--zt-table-body-color: var(--zt-gray);--zt-table-body-background: var(--zt-white);--zt-table-sort-default: var(--zt-gray-5);--zt-table-sort-active: var(--zt-primary-color)}:root[zt-theme-size=large]{--zt-table-head-height: 52px}.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:-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-font-size-md);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-font-size-md);color:var(--zt-table-body-color);text-align:center;line-height:var(--zt-line-height-md);background:var(--zt-table-body-background);padding:10px 16px}.zt-table--striped .zt-table__tbody>tr:nth-child(2n)>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:-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}}
+:root{--zt-table-head-color: var(--zt-primary-color);--zt-table-head-height: 40px;--zt-table-head-background: #e6f5ff;--zt-table-body-height: 40px;--zt-table-body-color: var(--zt-gray);--zt-table-body-background: var(--zt-white);--zt-table-sort-default: var(--zt-gray-5);--zt-table-sort-active: var(--zt-primary-color)}:root[zt-theme-size=large]{--zt-table-head-height: 52px}.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:-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-font-size-md);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-font-size-md);color:var(--zt-table-body-color);text-align:center;line-height:var(--zt-line-height-md);background:var(--zt-table-body-background);padding:10px 16px}.zt-table--striped .zt-table__tbody>tr:nth-child(2n)>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:-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__head-label-ellipsis{width:100%}.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/es/table/index.d.ts

@@ -27,6 +27,10 @@ export declare const Table: import("../utils").WithInstall<import("vue").DefineC
         type: BooleanConstructor;
         default: boolean;
     };
+    hideTableHead: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, () => 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[]>;
@@ -56,6 +60,10 @@ export declare const Table: import("../utils").WithInstall<import("vue").DefineC
         type: BooleanConstructor;
         default: boolean;
     };
+    hideTableHead: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & {
     onSort?: ((...args: any[]) => any) | undefined;
 }, {
@@ -66,6 +74,7 @@ export declare const Table: import("../utils").WithInstall<import("vue").DefineC
     striped: boolean;
     emptyValue: string;
     skeletonRow: number;
+    hideTableHead: boolean;
 }, {}>>;
 export default Table;
 export { tableProps } from './Table';

package/es/table/style/index.mjs

@@ -1,4 +1,10 @@
 import "../../style/base.css";
 import "../../badge/index.css";
 import "../../icon/index.css";
+import "../../overlay/index.css";
+import "../../popup/index.css";
+import "../../loading/index.css";
+import "../../button/index.css";
+import "../../dialog/index.css";
+import "../../text-ellipsis/index.css";
 import "../index.css";

package/es/tabs/TabsTitle.mjs

@@ -97,6 +97,7 @@ var stdin_default = defineComponent({
       "aria-disabled": props.disabled || void 0,
       "aria-controls": props.controls
     }, [slots.prefix ? slots.prefix() : null, _createVNode("div", {
+      "class": bem("title"),
       "style": style.value
     }, [renderText()]), slots.suffix ? slots.suffix() : null]);
   }

package/es/tabs/index.css

@@ -1 +1 @@
-:root{--zt-tab-active-text-color: var(--zt-text-color);--zt-tab-disabled-text-color: var(--zt-text-color-3);--zt-tab-active-opacity: .2;--zt-tabs-default-color: var(--zt-primary-color);--zt-tabs-line-height: 44px;--zt-tabs-line-bottom: 16px;--zt-tabs-card-height: 32px;--zt-tabs-bottom-bar-width: 12px;--zt-tabs-bottom-bar-height: 4px;--zt-tabs-bottom-bar-color: var(--zt-primary-color);--zt-tabs-bottom-bar-radius: 2px;--zt-tabs-nav-background: var(--zt-background);--zt-tab-text-color: var(--zt-gray-a6);--zt-tabs-overlay-left-background: linear-gradient(90deg, #ffffff 0%, rgba(245, 250, 255, 0) 100%);--zt-tabs-overlay-right-background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%)}.zt-tab{position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:0 var(--zt-padding-md);color:var(--zt-tab-text-color);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-md);cursor:pointer}.zt-tab--active{color:var(--zt-tab-active-text-color);font-size:var(--zt-font-size-lg);font-weight:var(--zt-font-bold)}.zt-tab--active:active{opacity:var(--zt-tab-active-opacity)}.zt-tab--disabled{color:var(--zt-tab-disabled-text-color);cursor:not-allowed;font-size:var(--zt-font-size-md)}.zt-tab--grow{flex:1 0 auto;padding:0 var(--zt-padding-sm)}.zt-tab--shrink{flex:none;padding:0 var(--zt-padding-xs)}.zt-tab--card{color:var(--zt-tabs-default-color)}.zt-tab--card.zt-tab--active{color:var(--zt-white);background-color:var(--zt-tabs-default-color)}.zt-tab--card--disabled{color:var(--zt-tab-disabled-text-color)}.zt-tab__text--ellipsis{display:-webkit-box;overflow:hidden;-webkit-line-clamp:1;-webkit-box-orient:vertical}.zt-tab__text-wrapper,.zt-tabs{position:relative}.zt-tabs__wrap{overflow:hidden;position:relative}.zt-tabs__wrap--page-top{position:fixed}.zt-tabs__wrap--content-bottom{top:auto;bottom:0}.zt-tabs__overlay-left,.zt-tabs__overlay-right{position:absolute;top:0;width:var(--zt-tabs-line-height);height:var(--zt-tabs-line-height);pointer-events:none}.zt-tabs__overlay-left{left:0;background:var(--zt-tabs-overlay-left-background)}.zt-tabs__overlay-right{right:0;background:var(--zt-tabs-overlay-right-background)}.zt-tabs__nav{position:relative;display:flex;justify-content:flex-start;background-color:var(--zt-tabs-nav-background);-webkit-user-select:none;user-select:none}.zt-tabs__nav--complete{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.zt-tabs__nav--complete::-webkit-scrollbar{display:none}.zt-tabs__nav--line{box-sizing:content-box;height:100%;padding-bottom:var(--zt-tabs-line-bottom)}.zt-tabs__nav--line.zt-tabs__nav--shrink .zt-tab,.zt-tabs__nav--line.zt-tabs__nav--complete .zt-tab{flex:1 0 auto;padding:0 var(--zt-padding-sm)}.zt-tabs__nav--line.zt-tabs__nav--shrink .zt-tabs__nav,.zt-tabs__nav--line.zt-tabs__nav--complete .zt-tabs__nav{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.zt-tabs__nav--line.zt-tabs__nav--shrink .zt-tabs__nav::-webkit-scrollbar,.zt-tabs__nav--line.zt-tabs__nav--complete .zt-tabs__nav::-webkit-scrollbar{display:none}.zt-tabs__nav--card.zt-tabs__nav--shrink{display:inline-flex}.zt-tabs__line{position:absolute;bottom:var(--zt-tabs-line-bottom);left:0;z-index:1;width:var(--zt-tabs-bottom-bar-width);height:var(--zt-tabs-bottom-bar-height);background:var(--zt-tabs-bottom-bar-color);border-radius:var(--zt-tabs-bottom-bar-radius)}.zt-tabs__track{position:relative;display:flex;width:100%;height:100%;will-change:left}.zt-tabs__content--animated{overflow:hidden}.zt-tabs--line .zt-tabs__wrap{height:var(--zt-tabs-line-height)}.zt-tabs--card>.zt-tabs__wrap{height:var(--zt-tabs-card-height);display:flex;justify-content:center}.zt-theme-dark{--zt-tabs-overlay-left-background: linear-gradient(90deg, #0f1923 0%, rgba(15, 25, 35, 0) 100%);--zt-tabs-overlay-right-background: linear-gradient(90deg, rgba(15, 25, 35, 0) 3%, #0f1923 100%)}
+:root{--zt-tab-active-text-color: var(--zt-text-color);--zt-tab-disabled-text-color: var(--zt-text-color-3);--zt-tab-active-opacity: .2;--zt-tabs-default-color: var(--zt-primary-color);--zt-tabs-line-height: 44px;--zt-tabs-line-bottom: 16px;--zt-tabs-card-height: 32px;--zt-tabs-bottom-bar-width: 12px;--zt-tabs-bottom-bar-height: 4px;--zt-tabs-bottom-bar-color: var(--zt-primary-color);--zt-tabs-bottom-bar-radius: 2px;--zt-tabs-nav-background: var(--zt-background);--zt-tab-text-color: var(--zt-gray-a6);--zt-tabs-overlay-left-background: linear-gradient(90deg, #ffffff 0%, rgba(245, 250, 255, 0) 100%);--zt-tabs-overlay-right-background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%)}.zt-tab{position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:0 var(--zt-padding-md);color:var(--zt-tab-text-color);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-md);cursor:pointer}.zt-tab--active{color:var(--zt-tab-active-text-color);font-size:var(--zt-font-size-lg);font-weight:var(--zt-font-bold)}.zt-tab--active:active{opacity:var(--zt-tab-active-opacity)}.zt-tab--disabled{color:var(--zt-tab-disabled-text-color);cursor:not-allowed;font-size:var(--zt-font-size-md)}.zt-tab--grow{flex:1 0 auto;padding:0 var(--zt-padding-sm)}.zt-tab--shrink{flex:none;padding:0 var(--zt-padding-xs)}.zt-tab--card{color:var(--zt-tabs-default-color)}.zt-tab--card.zt-tab--active{color:var(--zt-white);background-color:var(--zt-tabs-default-color)}.zt-tab--card--disabled{color:var(--zt-tab-disabled-text-color)}.zt-tab__title{flex:1;display:flex;align-items:center;justify-content:center}.zt-tab__text--ellipsis{display:-webkit-box;overflow:hidden;-webkit-line-clamp:1;-webkit-box-orient:vertical}.zt-tab__text-wrapper,.zt-tabs{position:relative}.zt-tabs__wrap{overflow:hidden;position:relative}.zt-tabs__wrap--page-top{position:fixed}.zt-tabs__wrap--content-bottom{top:auto;bottom:0}.zt-tabs__overlay-left,.zt-tabs__overlay-right{position:absolute;top:0;width:var(--zt-tabs-line-height);height:var(--zt-tabs-line-height);pointer-events:none}.zt-tabs__overlay-left{left:0;background:var(--zt-tabs-overlay-left-background)}.zt-tabs__overlay-right{right:0;background:var(--zt-tabs-overlay-right-background)}.zt-tabs__nav{position:relative;display:flex;justify-content:flex-start;background-color:var(--zt-tabs-nav-background);-webkit-user-select:none;user-select:none}.zt-tabs__nav--complete{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.zt-tabs__nav--complete::-webkit-scrollbar{display:none}.zt-tabs__nav--line{box-sizing:content-box;height:100%;padding-bottom:var(--zt-tabs-line-bottom)}.zt-tabs__nav--line.zt-tabs__nav--shrink .zt-tab,.zt-tabs__nav--line.zt-tabs__nav--complete .zt-tab{flex:1 0 auto;padding:0 var(--zt-padding-sm)}.zt-tabs__nav--line.zt-tabs__nav--shrink .zt-tabs__nav,.zt-tabs__nav--line.zt-tabs__nav--complete .zt-tabs__nav{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.zt-tabs__nav--line.zt-tabs__nav--shrink .zt-tabs__nav::-webkit-scrollbar,.zt-tabs__nav--line.zt-tabs__nav--complete .zt-tabs__nav::-webkit-scrollbar{display:none}.zt-tabs__nav--card.zt-tabs__nav--shrink{display:inline-flex}.zt-tabs__line{position:absolute;bottom:var(--zt-tabs-line-bottom);left:0;z-index:1;width:var(--zt-tabs-bottom-bar-width);height:var(--zt-tabs-bottom-bar-height);background:var(--zt-tabs-bottom-bar-color);border-radius:var(--zt-tabs-bottom-bar-radius)}.zt-tabs__track{position:relative;display:flex;width:100%;height:100%;will-change:left}.zt-tabs__content--animated{overflow:hidden}.zt-tabs--line .zt-tabs__wrap{height:var(--zt-tabs-line-height)}.zt-tabs--card>.zt-tabs__wrap{height:var(--zt-tabs-card-height);display:flex;justify-content:center}.zt-theme-dark{--zt-tabs-overlay-left-background: linear-gradient(90deg, #0f1923 0%, rgba(15, 25, 35, 0) 100%);--zt-tabs-overlay-right-background: linear-gradient(90deg, rgba(15, 25, 35, 0) 3%, #0f1923 100%)}

package/es/text-ellipsis/TextEllipsis.d.ts

@@ -16,6 +16,10 @@ export declare const textEllipsisProps: {
         type: import("vue").PropType<string>;
         default: string;
     };
+    expandType: {
+        type: import("vue").PropType<"flat" | "dialog">;
+        default: "flat" | "dialog";
+    };
     collapseText: {
         type: import("vue").PropType<string>;
         default: string;
@@ -43,6 +47,10 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<string>;
         default: string;
     };
+    expandType: {
+        type: import("vue").PropType<"flat" | "dialog">;
+        default: "flat" | "dialog";
+    };
     collapseText: {
         type: import("vue").PropType<string>;
         default: string;
@@ -68,6 +76,10 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<string>;
         default: string;
     };
+    expandType: {
+        type: import("vue").PropType<"flat" | "dialog">;
+        default: "flat" | "dialog";
+    };
     collapseText: {
         type: import("vue").PropType<string>;
         default: string;
@@ -84,6 +96,7 @@ declare const _default: import("vue").DefineComponent<{
     rows: string | number;
     dots: string;
     expandText: string;
+    expandType: "flat" | "dialog";
     collapseText: string;
 }, {}>;
 export default _default;

package/es/text-ellipsis/TextEllipsis.mjs

@@ -1,13 +1,15 @@
 import { createVNode as _createVNode } from "vue";
-import { ref, watch, computed, onMounted, defineComponent } from "vue";
+import { computed, defineComponent, onMounted, ref, watch } from "vue";
 import { useEventListener } from "@zartui/use";
-import { makeNumericProp, makeStringProp, createNamespace } from "../utils/index.mjs";
+import { showDialog } from "../dialog/index.mjs";
+import { createNamespace, makeNumericProp, makeStringProp } from "../utils/index.mjs";
 const [name, bem] = createNamespace("text-ellipsis");
 const textEllipsisProps = {
   rows: makeNumericProp(1),
   dots: makeStringProp("..."),
   content: makeStringProp(""),
   expandText: makeStringProp(""),
+  expandType: makeStringProp("flat"),
   collapseText: makeStringProp(""),
   position: makeStringProp("end")
 };
@@ -127,13 +129,22 @@ var stdin_default = defineComponent({
       "class": bem("action"),
       "onClick": onClickAction
     }, [actionText.value]);
+    const onClickEllipsis = () => {
+      if (props.expandType === "dialog" && hasAction.value) {
+        showDialog({
+          message: props.content
+        }).then(() => {
+        });
+      }
+    };
     onMounted(calcEllipsised);
     watch(() => [props.content, props.rows, props.position], calcEllipsised);
     useEventListener("resize", calcEllipsised);
     return () => _createVNode("div", {
       "ref": root,
-      "class": bem()
-    }, [expanded.value ? props.content : text.value, hasAction.value ? renderAction() : null]);
+      "class": bem(),
+      "onClick": onClickEllipsis
+    }, [expanded.value ? props.content : text.value, props.expandType !== "dialog" && hasAction.value ? renderAction() : null]);
   }
 });
 export {

package/es/text-ellipsis/index.d.ts

@@ -15,6 +15,10 @@ export declare const TextEllipsis: import("../utils").WithInstall<import("vue").
         type: import("vue").PropType<string>;
         default: string;
     };
+    expandType: {
+        type: import("vue").PropType<"flat" | "dialog">;
+        default: "flat" | "dialog";
+    };
     collapseText: {
         type: import("vue").PropType<string>;
         default: string;
@@ -40,6 +44,10 @@ export declare const TextEllipsis: import("../utils").WithInstall<import("vue").
         type: import("vue").PropType<string>;
         default: string;
     };
+    expandType: {
+        type: import("vue").PropType<"flat" | "dialog">;
+        default: "flat" | "dialog";
+    };
     collapseText: {
         type: import("vue").PropType<string>;
         default: string;
@@ -56,6 +64,7 @@ export declare const TextEllipsis: import("../utils").WithInstall<import("vue").
     rows: string | number;
     dots: string;
     expandText: string;
+    expandType: "flat" | "dialog";
     collapseText: string;
 }, {}>>;
 export default TextEllipsis;

package/es/text-ellipsis/style/index.mjs

@@ -1,2 +1,9 @@
 import "../../style/base.css";
+import "../../badge/index.css";
+import "../../icon/index.css";
+import "../../overlay/index.css";
+import "../../popup/index.css";
+import "../../loading/index.css";
+import "../../button/index.css";
+import "../../dialog/index.css";
 import "../index.css";

package/es/toast/index.css

@@ -1 +1 @@
-:root{--zt-toast-max-width: 70%;--zt-toast-text-color: var(--zt-white);--zt-toast-loading-icon-color: var(--zt-white);--zt-toast-radius: var(--zt-radius-lg);--zt-toast-background: var(--zt-gray-a8);--zt-toast-text-min-width: 96px;--zt-toast-text-padding: var(--zt-padding-xs) var(--zt-padding-sm);--zt-toast-default-padding: var(--zt-padding-md);--zt-toast-default-width: 88px;--zt-toast-default-min-height: 84px;--zt-toast-position-top-distance: 20%;--zt-toast-position-bottom-distance: 20%;--zt-toast-icon-font-size: 36px}:root[zt-theme-size=large]{--zt-toast-icon-font-size: 42px}.zt-toast{display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:content-box;transition:all var(--zt-duration-fast);width:var(--zt-toast-default-width);max-width:var(--zt-toast-max-width);min-height:var(--zt-toast-default-min-height);padding:var(--zt-toast-default-padding);color:var(--zt-toast-text-color);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-md);white-space:pre-wrap;text-align:center;word-break:break-all;background:var(--zt-toast-background);border-radius:var(--zt-toast-radius)}.zt-toast--break-normal{word-break:normal;word-wrap:normal}.zt-toast--break-word{word-break:normal;word-wrap:break-word}.zt-toast--unclickable{overflow:hidden;cursor:not-allowed}.zt-toast--unclickable *{pointer-events:none}.zt-toast--text,.zt-toast--html{width:-webkit-fit-content;width:fit-content;min-width:var(--zt-toast-text-min-width);min-height:0;padding:var(--zt-toast-text-padding)}.zt-toast--text .zt-toast__text,.zt-toast--html .zt-toast__text{margin-top:0}.zt-toast--top{top:var(--zt-toast-position-top-distance)}.zt-toast--bottom{top:auto;bottom:var(--zt-toast-position-bottom-distance)}.zt-toast__icon{font-size:var(--zt-toast-icon-font-size)}.zt-toast__loading{padding:var(--zt-padding-base);color:var(--zt-toast-loading-icon-color)}.zt-toast__text{margin-top:var(--zt-padding-xs)}.zt-theme-dark{--zt-toast-background: var(--zt-gray-a1)}
+:root{--zt-toast-max-width: 70%;--zt-toast-text-color: var(--zt-white);--zt-toast-loading-icon-color: var(--zt-white);--zt-toast-radius: var(--zt-radius-lg);--zt-toast-background: var(--zt-gray-a8);--zt-toast-text-min-width: 96px;--zt-toast-text-padding: var(--zt-padding-xs) var(--zt-padding-sm);--zt-toast-default-padding: var(--zt-padding-md);--zt-toast-default-width: 88px;--zt-toast-default-min-height: 84px;--zt-toast-default-max-height: 80%;--zt-toast-position-top-distance: 20%;--zt-toast-position-bottom-distance: 20%;--zt-toast-icon-font-size: 36px}:root[zt-theme-size=large]{--zt-toast-icon-font-size: 42px}.zt-toast{display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:content-box;transition:all var(--zt-duration-fast);width:var(--zt-toast-default-width);max-width:var(--zt-toast-max-width);min-height:var(--zt-toast-default-min-height);max-height:var(--zt-toast-default-max-height);padding:var(--zt-toast-default-padding);color:var(--zt-toast-text-color);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-md);white-space:pre-wrap;text-align:center;word-break:break-all;background:var(--zt-toast-background);border-radius:var(--zt-toast-radius)}.zt-toast--break-normal{word-break:normal;word-wrap:normal}.zt-toast--break-word{word-break:normal;word-wrap:break-word}.zt-toast--unclickable{overflow:hidden;cursor:not-allowed}.zt-toast--unclickable *{pointer-events:none}.zt-toast--text,.zt-toast--html{width:-webkit-fit-content;width:fit-content;min-width:var(--zt-toast-text-min-width);min-height:0;padding:var(--zt-toast-text-padding)}.zt-toast--text .zt-toast__text,.zt-toast--html .zt-toast__text{margin-top:0}.zt-toast--top{top:var(--zt-toast-position-top-distance)}.zt-toast--bottom{top:auto;bottom:var(--zt-toast-position-bottom-distance)}.zt-toast__icon{font-size:var(--zt-toast-icon-font-size)}.zt-toast__loading{padding:var(--zt-padding-base);color:var(--zt-toast-loading-icon-color)}.zt-toast__text{margin-top:var(--zt-padding-xs)}.zt-theme-dark{--zt-toast-background: var(--zt-gray-a1)}

package/lib/calendar/Calendar.js

@@ -507,8 +507,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
     (0, import_vue2.watch)(() => props.show, init);
     (0, import_vue2.watch)(() => [props.type, props.minDate, props.maxDate], () => reset(getInitialDate(currentDate.value)));
     (0, import_vue2.watch)(() => props.defaultDate, (value = null) => {
-      currentDate.value = value;
-      scrollToCurrentDate();
+      reset(value);
     });
     (0, import_vue2.watch)(titleDate, (newValue) => {
       if (props.showType === "inline" && newValue) {

package/lib/date-time-picker/DateTimePicker.js

@@ -178,6 +178,21 @@ var stdin_default = (0, import_vue2.defineComponent)({
         }
       }
     };
+    (0, import_vue2.watch)(() => props.modelValue, onOpen, {
+      deep: true
+    });
+    (0, import_vue2.watch)(() => props.startValue, () => {
+      currentStartValue.value = props.startValue;
+      currentStartText.value = genOriginValueText(props.startValue);
+    }, {
+      deep: true
+    });
+    (0, import_vue2.watch)(() => props.endValue, () => {
+      currentEndValue.value = props.endValue;
+      currentEndText.value = genOriginValueText(props.endValue);
+    }, {
+      deep: true
+    });
     const renderTitle = () => {
       if (!props.range) {
         return (0, import_vue.createVNode)("div", {

package/lib/dialog/index.css

@@ -1 +1 @@
-:root{--zt-dialog-width: 350px;--zt-dialog-max-width: 90%;--zt-dialog-transition: var(--zt-duration-base);--zt-dialog-radius: 12px;--zt-dialog-background: var(--zt-background-popup);--zt-dialog-header-font-weight: var(--zt-font-bold);--zt-dialog-header-padding-top: 24px;--zt-dialog-header-isolated-padding: var(--zt-padding-lg) 0;--zt-dialog-header-primary-padding: 10px;--zt-dialog-message-padding: var(--zt-padding-lg) var(--zt-padding-md);--zt-dialog-message-max-height: 60vh;--zt-dialog-has-title-message-text-color: var(--zt-gray-a6);--zt-dialog-has-title-message-padding-top: var(--zt-padding-xs);--zt-dialog-has-title-message-primary-header: var(--zt-padding-lg);--zt-dialog-confirm-button-text-color: var(--zt-white);--zt-dialog-cancel-button-background-color: var(--zt-white)}.zt-dialog{top:45%;width:var(--zt-dialog-width);max-width:var(--zt-dialog-max-width);overflow:hidden;font-size:var(--zt-font-size-lg);background:var(--zt-dialog-background);border-radius:var(--zt-dialog-radius);-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:var(--zt-dialog-transition);transition-property:transform,opacity}.zt-dialog__header{color:var(--zt-text-color);padding-top:var(--zt-dialog-header-padding-top);font-weight:var(--zt-dialog-header-font-weight);line-height:var(--zt-line-height-lg);text-align:center}.zt-dialog__header--isolated{padding:var(--zt-dialog-header-isolated-padding)}.zt-dialog__header--custom-title{padding-left:0;padding-right:0;padding-top:0}.zt-dialog__header--primary{padding:var(--zt-dialog-header-primary-padding);background:var(--zt-primary-color);color:var(--zt-white)}.zt-dialog__content{text-align:center;font-size:0}.zt-dialog__message{display:inline-block;color:var(--zt-gray-a8);max-height:var(--zt-dialog-message-max-height);padding:var(--zt-dialog-message-padding);overflow-y:auto;font-size:var(--zt-font-size-lg);line-height:var(--zt-line-height-md);white-space:pre-wrap;text-align:left;word-wrap:break-word;-webkit-overflow-scrolling:touch}.zt-dialog__message--has-title{padding-top:var(--zt-dialog-has-title-message-padding-top);color:var(--zt-dialog-has-title-message-text-color);font-size:var(--zt-font-size-md)}.zt-dialog__message--primary-header{padding-top:var(--zt-dialog-has-title-message-primary-header)}.zt-dialog__message--left{text-align:left}.zt-dialog__message--right{text-align:right}.zt-dialog__message--justify{text-align:justify}.zt-dialog__footer{display:flex;overflow:hidden;-webkit-user-select:none;user-select:none;margin:0 var(--zt-padding-xl) var(--zt-padding-lg)}.zt-dialog__confirm,.zt-dialog__cancel{flex:1;margin:0;background-color:var(--zt-dialog-cancel-button-background-color)}.zt-dialog__confirm,.zt-dialog__confirm:active{color:var(--zt-dialog-confirm-button-text-color)}.zt-dialog__confirm--with-cancel{margin-left:8px}.zt-dialog--round-button .zt-dialog__footer{position:relative;height:auto;padding:var(--zt-padding-xs) var(--zt-padding-lg) var(--zt-padding-md)}.zt-dialog--round-button .zt-dialog__message{padding-bottom:var(--zt-padding-md);color:var(--zt-text-color)}.zt-dialog--round-button .zt-dialog__confirm,.zt-dialog--round-button .zt-dialog__cancel{height:var(--zt-dialog-round-button-height)}.zt-dialog--round-button .zt-dialog__confirm{color:var(--zt-white)}.zt-dialog-bounce-enter-from{transform:translate3d(-50%,-50%,0) scale(.7);opacity:0}.zt-dialog-bounce-leave-active{transform:translate3d(-50%,-50%,0) scale(.9);opacity:0}.zt-theme-dark{--zt-dialog-cancel-button-background-color: rbga(255, 255, 255, .2)}
+:root{--zt-dialog-width: 350px;--zt-dialog-max-width: 90%;--zt-dialog-transition: var(--zt-duration-base);--zt-dialog-radius: 12px;--zt-dialog-background: var(--zt-background-popup);--zt-dialog-header-font-weight: var(--zt-font-bold);--zt-dialog-header-padding-top: 24px;--zt-dialog-header-isolated-padding: var(--zt-padding-lg) 0;--zt-dialog-header-primary-padding: 10px;--zt-dialog-message-padding: var(--zt-padding-lg) var(--zt-padding-md);--zt-dialog-message-max-height: 60vh;--zt-dialog-has-title-message-text-color: var(--zt-gray-a6);--zt-dialog-has-title-message-padding-top: var(--zt-padding-xs);--zt-dialog-has-title-message-primary-header: var(--zt-padding-lg);--zt-dialog-confirm-button-text-color: var(--zt-white);--zt-dialog-cancel-button-background-color: var(--zt-white)}.zt-dialog{top:45%;width:var(--zt-dialog-width);max-width:var(--zt-dialog-max-width);overflow:hidden;font-size:var(--zt-font-size-lg);background:var(--zt-dialog-background);border-radius:var(--zt-dialog-radius);-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:var(--zt-dialog-transition);transition-property:transform,opacity}.zt-dialog__header{color:var(--zt-text-color);padding-top:var(--zt-dialog-header-padding-top);font-weight:var(--zt-dialog-header-font-weight);line-height:var(--zt-line-height-lg);text-align:center}.zt-dialog__header--isolated{padding:var(--zt-dialog-header-isolated-padding)}.zt-dialog__header--custom-title{padding-left:0;padding-right:0;padding-top:0}.zt-dialog__header--primary{padding:var(--zt-dialog-header-primary-padding);background:var(--zt-primary-color);color:var(--zt-white)}.zt-dialog__content{text-align:center;font-size:0}.zt-dialog__message{display:inline-block;color:var(--zt-gray-a8);max-height:var(--zt-dialog-message-max-height);padding:var(--zt-dialog-message-padding);overflow-y:auto;font-size:var(--zt-font-size-lg);line-height:var(--zt-line-height-md);white-space:pre-wrap;text-align:left;word-wrap:break-word;-webkit-overflow-scrolling:touch}.zt-dialog__message--has-title{padding-top:var(--zt-dialog-has-title-message-padding-top);color:var(--zt-dialog-has-title-message-text-color);font-size:var(--zt-font-size-md)}.zt-dialog__message--primary-header{padding-top:var(--zt-dialog-has-title-message-primary-header)}.zt-dialog__message--left{text-align:left}.zt-dialog__message--right{text-align:right}.zt-dialog__message--justify{text-align:justify}.zt-dialog__footer{display:flex;overflow:hidden;-webkit-user-select:none;user-select:none;margin:0 var(--zt-padding-xl) var(--zt-padding-lg)}.zt-dialog__confirm,.zt-dialog__cancel{flex:1;margin:0;background-color:var(--zt-dialog-cancel-button-background-color)}.zt-dialog__confirm,.zt-dialog__confirm:active{color:var(--zt-dialog-confirm-button-text-color)}.zt-dialog__confirm--with-cancel{margin-left:8px}.zt-dialog--round-button .zt-dialog__footer{position:relative;height:auto;padding:var(--zt-padding-xs) var(--zt-padding-lg) var(--zt-padding-md)}.zt-dialog--round-button .zt-dialog__message{padding-bottom:var(--zt-padding-md);color:var(--zt-text-color)}.zt-dialog--round-button .zt-dialog__confirm,.zt-dialog--round-button .zt-dialog__cancel{height:var(--zt-dialog-round-button-height)}.zt-dialog--round-button .zt-dialog__confirm{color:var(--zt-white)}.zt-dialog-bounce-enter-from{transform:translate3d(0,-50%,0) scale(.7);opacity:0}.zt-dialog-bounce-leave-active{transform:translate3d(0,-50%,0) scale(.9);opacity:0}.zt-theme-dark{--zt-dialog-cancel-button-background-color: rbga(255, 255, 255, .2)}

package/lib/drawer-select/DrawerSelect.d.ts

@@ -1,5 +1,5 @@
 import type { ExtractPropTypes, PropType } from 'vue';
-import { DrawerSelectFieldNames, DrawerSelectTreeNode } from './types';
+import { DrawerSelectFieldNames, DrawerSelectTreeNode, FlatTreeNode } from './types';
 declare const drawerSelectProps: {
     treeData: {
         type: PropType<DrawerSelectTreeNode[]>;
@@ -18,6 +18,11 @@ declare const drawerSelectProps: {
         type: BooleanConstructor;
         default: boolean;
     };
+    defaultSelectNode: PropType<FlatTreeNode>;
+    activeClassName: {
+        type: PropType<string>;
+        default: string;
+    };
 };
 export type DrawerSelectProps = ExtractPropTypes<typeof drawerSelectProps>;
 declare const _default: import("vue").DefineComponent<{
@@ -38,6 +43,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    defaultSelectNode: PropType<FlatTreeNode>;
+    activeClassName: {
+        type: PropType<string>;
+        default: string;
+    };
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("select" | "change")[], "select" | "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
     treeData: {
         type: PropType<DrawerSelectTreeNode[]>;
@@ -56,6 +66,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    defaultSelectNode: PropType<FlatTreeNode>;
+    activeClassName: {
+        type: PropType<string>;
+        default: string;
+    };
 }>> & {
     onChange?: ((...args: any[]) => any) | undefined;
     onSelect?: ((...args: any[]) => any) | undefined;
@@ -64,5 +79,6 @@ declare const _default: import("vue").DefineComponent<{
     placeholder: string;
     treeData: DrawerSelectTreeNode[];
     expandAll: boolean;
+    activeClassName: string;
 }, {}>;
 export default _default;

package/lib/drawer-select/DrawerSelect.js

@@ -50,7 +50,9 @@ const drawerSelectProps = {
   expandAll: {
     type: Boolean,
     default: false
-  }
+  },
+  defaultSelectNode: Object,
+  activeClassName: (0, import_utils.makeStringProp)("")
 };
 var stdin_default = (0, import_vue2.defineComponent)({
   name,
@@ -61,7 +63,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
   }) {
     const keyword = (0, import_vue2.ref)("");
     const expandNode = (0, import_vue2.ref)();
-    const selectNode = (0, import_vue2.ref)();
+    const selectNode = (0, import_vue2.ref)(props.defaultSelectNode);
     const flatArray = (0, import_vue2.ref)([]);
     const show = (0, import_vue2.ref)(false);
     const searchRef = (0, import_vue2.ref)();
@@ -260,6 +262,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
     const renderItem = (item) => {
       var _a, _b;
       const empty = isEmpty(item);
+      const active = empty && ((_a = selectNode.value) == null ? void 0 : _a.value) == item[fields.value.value];
       return (0, import_vue.createVNode)("div", {
         "onClick": (e) => {
           e.stopPropagation();
@@ -278,8 +281,10 @@ var stdin_default = (0, import_vue2.defineComponent)({
         "size": "20"
       }, null)]), (0, import_vue.createVNode)("div", {
         "class": [bem("item--label", {
-          active: empty && ((_a = selectNode.value) == null ? void 0 : _a.value) == item[fields.value.value]
-        }), "zt-hairline--top"]
+          active
+        }), "zt-hairline--top", {
+          [props.activeClassName]: active
+        }]
       }, [item[fields.value.text]])]), (0, import_vue.createVNode)("div", {
         "class": [bem("item--child")]
       }, [!empty && item.checked && ((_b = item[fields.value.children]) == null ? void 0 : _b.map(renderItem))])]);

package/lib/drawer-select/index.d.ts

@@ -16,6 +16,11 @@ export declare const DrawerSelect: import("../utils").WithInstall<import("vue").
         type: BooleanConstructor;
         default: boolean;
     };
+    defaultSelectNode: import("vue").PropType<import("./types").FlatTreeNode>;
+    activeClassName: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("select" | "change")[], "select" | "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     treeData: {
         type: import("vue").PropType<import("./types").DrawerSelectTreeNode[]>;
@@ -34,6 +39,11 @@ export declare const DrawerSelect: import("../utils").WithInstall<import("vue").
         type: BooleanConstructor;
         default: boolean;
     };
+    defaultSelectNode: import("vue").PropType<import("./types").FlatTreeNode>;
+    activeClassName: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
 }>> & {
     onChange?: ((...args: any[]) => any) | undefined;
     onSelect?: ((...args: any[]) => any) | undefined;
@@ -42,6 +52,7 @@ export declare const DrawerSelect: import("../utils").WithInstall<import("vue").
     placeholder: string;
     treeData: import("./types").DrawerSelectTreeNode[];
     expandAll: boolean;
+    activeClassName: string;
 }, {}>>;
 export default DrawerSelect;
 export type { DrawerSelectProps } from './DrawerSelect';

package/lib/dropdown-item/DropdownItem.d.ts

@@ -22,6 +22,14 @@ export declare const dropdownItemProps: {
     titleClass: PropType<unknown>;
     multiSelect: BooleanConstructor;
     itemLabel: StringConstructor;
+    placeholder: {
+        type: PropType<string>;
+        default: string;
+    };
+    resetDefaultValue: {
+        type: PropType<any[]>;
+        default: () => any[];
+    };
 };
 export type DropdownItemProps = ExtractPropTypes<typeof dropdownItemProps>;
 declare const _default: import("vue").DefineComponent<{
@@ -45,6 +53,14 @@ declare const _default: import("vue").DefineComponent<{
     titleClass: PropType<unknown>;
     multiSelect: BooleanConstructor;
     itemLabel: StringConstructor;
+    placeholder: {
+        type: PropType<string>;
+        default: string;
+    };
+    resetDefaultValue: {
+        type: PropType<any[]>;
+        default: () => any[];
+    };
 }, (() => JSX.Element) | undefined, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("reset" | "open" | "update:modelValue" | "change" | "close" | "opened" | "closed" | "confirm")[], "reset" | "open" | "update:modelValue" | "change" | "close" | "opened" | "closed" | "confirm", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
     title: StringConstructor;
     options: {
@@ -66,6 +82,14 @@ declare const _default: import("vue").DefineComponent<{
     titleClass: PropType<unknown>;
     multiSelect: BooleanConstructor;
     itemLabel: StringConstructor;
+    placeholder: {
+        type: PropType<string>;
+        default: string;
+    };
+    resetDefaultValue: {
+        type: PropType<any[]>;
+        default: () => any[];
+    };
 }>> & {
     onChange?: ((...args: any[]) => any) | undefined;
     onReset?: ((...args: any[]) => any) | undefined;
@@ -77,9 +101,11 @@ declare const _default: import("vue").DefineComponent<{
     onConfirm?: ((...args: any[]) => any) | undefined;
 }, {
     disabled: boolean;
+    placeholder: string;
     lazyRender: boolean;
     options: DropdownItemOption[];
     modelValueArray: any[];
     multiSelect: boolean;
+    resetDefaultValue: any[];
 }, {}>;
 export default _default;

package/lib/dropdown-item/DropdownItem.js

@@ -44,7 +44,9 @@ const dropdownItemProps = {
   modelValueArray: (0, import_utils.makeArrayProp)(),
   titleClass: import_utils.unknownProp,
   multiSelect: Boolean,
-  itemLabel: String
+  itemLabel: String,
+  placeholder: (0, import_utils.makeStringProp)("\u672A\u9009\u62E9"),
+  resetDefaultValue: (0, import_utils.makeArrayProp)()
 };
 var stdin_default = (0, import_vue2.defineComponent)({
   name,
@@ -101,10 +103,9 @@ var stdin_default = (0, import_vue2.defineComponent)({
       }
     };
     const onClickReset = () => {
-      props.options.forEach((item) => {
-        item.selected = false;
-      });
+      var _a;
       modelArray.splice(0);
+      modelArray.push(...(_a = props.resetDefaultValue) != null ? _a : []);
       state.showPopup = false;
       emit("reset");
     };
@@ -140,7 +141,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
         if (title.length > 0) {
           title = title.substring(0, title.length - 1);
         }
-        return title || "\u672A\u9009\u62E9";
+        return title;
       }
       const match = props.options.find((option) => option[fields.value.value] === props.modelValue);
       return match ? match[fields.value.text] : "";
@@ -153,8 +154,11 @@ var stdin_default = (0, import_vue2.defineComponent)({
       const text = option[fields.value.text];
       let active = false;
       if (props.multiSelect) {
-        if (option.selected) {
+        if (modelArray == null ? void 0 : modelArray.includes(value)) {
           active = true;
+          option.selected = true;
+        } else {
+          option.selected = false;
         }
       } else {
         active = value === props.modelValue;
@@ -162,12 +166,10 @@ var stdin_default = (0, import_vue2.defineComponent)({
       const onClick = () => {
         if (props.multiSelect) {
           if (option.selected) {
-            option.selected = false;
             modelArray.splice(modelArray.indexOf(value), 1);
             emit("update:modelValue", -value);
             emit("change", -value);
           } else {
-            option.selected = true;
             modelArray.push(value);
             emit("update:modelValue", value);
             emit("change", value);