persagy-vant 0.0.34 → 0.0.36

package/es/material-action-bar/index.mjs

@@ -1,8 +1,10 @@
 import { withInstall } from "../utils/index.mjs";
 import _MaterialActionBar from "./MaterialActionBar.mjs";
-const MaterialActionBar = withInstall(_MaterialActionBar);
-var stdin_default = MaterialActionBar;
+const MaterialActionList = withInstall(_MaterialActionBar);
+const MaterialActionBar = MaterialActionList;
+var stdin_default = MaterialActionList;
 export {
   MaterialActionBar,
+  MaterialActionList,
   stdin_default as default
 };

package/es/material-action-bar/style/index.mjs

@@ -8,6 +8,7 @@ import "../../button/index.css";
 import "../../action-bar-button/index.css";
 import "../../overlay/index.css";
 import "../../popup/index.css";
+import "../../toast/index.css";
 import "../../checkbox-group/index.css";
 import "../../checkbox/index.css";
 import "../../radio-group/index.css";

package/es/material-action-bar/style/less.mjs

@@ -8,6 +8,7 @@ import "../../button/index.less";
 import "../../action-bar-button/index.less";
 import "../../overlay/index.less";
 import "../../popup/index.less";
+import "../../toast/index.less";
 import "../../checkbox-group/index.less";
 import "../../checkbox/index.less";
 import "../../radio-group/index.less";

package/es/material-add/MaterialAdd.mjs

@@ -453,7 +453,6 @@ var stdin_default = defineComponent({
       }, [_createVNode("div", {
         "class": bem("detail-banner")
       }, [_createVNode(Swipe, {
-        "loop": false,
         "showIndicators": false,
         "class": bem("detail-swipe"),
         "onChange": (index) => {

package/es/material-add/index.css

@@ -1 +1 @@
-.van-material-action-bar{position:relative;padding:10px var(--van-padding-md)}.van-material-action-bar--selected{padding:10px var(--van-padding-md);background:var(--van-gray-2);border-radius:8px}.van-material-action-bar--selected:after{display:none}.van-material-action-bar:not(:last-child):after{position:absolute;right:var(--van-padding-md);bottom:0;left:var(--van-padding-md);height:1px;background:var(--van-border-color);transform:scaleY(.5);content:""}.van-material-action-bar__main{display:flex;align-items:center;min-height:22px}.van-material-action-bar__detail{display:inline-flex;flex:none;gap:2px;align-items:center;max-width:calc(100% - 96px);padding:0;overflow:hidden;color:var(--van-gray-9);font:inherit;font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);text-align:left;background:transparent;border:0;cursor:pointer;transition:opacity var(--van-animation-duration-fast)}.van-material-action-bar__detail:active{opacity:var(--van-active-opacity)}.van-material-action-bar__detail>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.van-material-action-bar__stepper-wrapper{position:relative;margin-left:auto}.van-material-action-bar__kind-tag{flex:none;margin-left:4px}.van-material-action-bar__stepper{flex:none;margin-left:0;--van-stepper-input-width: 32px;--van-stepper-input-height: 18px;--van-stepper-input-font-size: var(--van-font-size-md);--van-stepper-input-line-height: var(--van-line-height-lg)}.van-material-action-bar__number-trigger{position:absolute;z-index:1;top:0;left:18px;width:32px;height:18px;padding:0;background:transparent;border:0;cursor:pointer}.van-material-action-bar__unit{width:32px;margin-left:8px;overflow:hidden;color:var(--van-text-color-2);font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);text-overflow:ellipsis;white-space:nowrap}.van-material-action-bar__desc{margin:2px 0 0;overflow:hidden;color:var(--van-gray-6);font-size:var(--van-font-size-sm);line-height:20px;text-overflow:ellipsis;white-space:nowrap}.van-material-action-bar__warning{margin:2px 0 0;color:var(--van-red-500);font-size:var(--van-font-size-sm);line-height:20px}.van-material-action-bar__keyword{color:var(--van-primary-color)}.van-material-add{position:relative;display:flex;flex-direction:column;height:calc(100vh - 96px);max-height:calc(100vh - 96px);bottom:56px;overflow:hidden;background:var(--van-gray-2)}.van-material-add>.van-action-sheet__content{display:flex;flex:1;flex-direction:column;min-height:0;overflow:hidden}.van-material-add__nav{flex:none;--van-nav-bar-background-color: var(--van-gray-2)}.van-material-add__nav .van-nav-bar__left--slot{left:var(--van-padding-md)}.van-material-add__nav .van-nav-bar__right--slot{right:var(--van-padding-md)}.van-material-add__search{flex:none;padding:8px var(--van-padding-md);--van-search-padding: 0;--van-search-background-color: var(--van-gray-2);--van-search-content-background-color: var(--van-white)}.van-material-add__search .van-search__field{padding-left:0}.van-material-add__tabs{flex:none;padding-left:8px;--van-tabs-line-height: 44px;--van-tab-font-size: var(--van-font-size-md);--van-tabs-bottom-bar-width: 40px;--van-tabs-nav-background-color: transparent}.van-material-add__filter-tags{display:flex;flex:none;gap:6px;padding:12px var(--van-padding-md)}.van-material-add__filter-tags .van-filter-tag{min-width:56px;--van-filter-tag-background-color: var(--van-gray-4)}.van-material-add__body{flex:1;min-height:0;padding:0 var(--van-padding-md) 12px;overflow-y:auto}.van-material-add__tree-card{margin-bottom:12px;overflow:hidden;background:var(--van-white);border-radius:8px}.van-material-add__catalog-leaf{overflow:hidden}.van-material-add__catalog-leaf .van-material-action-bar:after{position:absolute;right:var(--van-padding-md);bottom:0;left:var(--van-padding-md);display:block;height:1px;content:"";background:var(--van-border-color);transform:scaleY(.5)}.van-tree-select__children>.van-tree-select__node:last-child>.van-material-add__catalog-leaf .van-material-action-bar:after{display:none}.van-material-add__material-list{overflow:hidden;background:var(--van-white);border-radius:8px}.van-material-add__empty{padding:32px 16px;color:var(--van-text-color-3);font-size:var(--van-font-size-md);text-align:center}.van-material-add__footer{position:relative;z-index:2;flex:none;background:var(--van-white);box-shadow:0 -2px 5px rgba(27,33,41,.1)}.van-material-add__footer .van-bottom-action-bar{box-shadow:none}.van-material-add__selected-panel{position:absolute;right:0;bottom:60px;left:0;display:flex;flex-direction:column;max-height:340px;overflow:hidden;background:var(--van-white);box-shadow:0 -2px 5px rgba(27,33,41,.1)}.van-material-add__selected-header{display:flex;align-items:center;justify-content:space-between;padding:12px var(--van-padding-md) 4px}.van-material-add__clear,.van-material-add__collapse{padding:0;background:transparent;border:0}.van-material-add__clear{color:var(--van-primary-color);font:inherit;font-size:var(--van-font-size-md)}.van-material-add__collapse{display:inline-flex;gap:2px;align-items:center;color:var(--van-gray-6);font:inherit;font-size:var(--van-font-size-md)}.van-material-add__selected-list{display:flex;flex-direction:column;gap:6px;padding:var(--van-padding-xs) var(--van-padding-md);overflow-y:auto}.van-material-add__detail-page{position:fixed;z-index:3000;inset:0;display:flex;flex-direction:column;overflow:hidden;background:var(--van-gray-2)}.van-material-add__detail-banner{position:absolute;top:0;right:0;left:0;height:320px;overflow:hidden;background:var(--van-gray-8)}.van-material-add__detail-swipe{height:320px;touch-action:pan-y}.van-material-add__detail-image{width:100%;height:310px;background-position:center;background-size:cover}.van-material-add__detail-image--motor{background-image:url(/dog1.jpg)}.van-material-add__detail-image--blower{background-image:url(/dog2.jpg)}.van-material-add__detail-image--coil{background-image:url(/dog3.jpg)}.van-material-add__detail-dots{position:absolute;z-index:2;top:226px;left:50%;display:flex;gap:6px;transform:translate(-50%)}.van-material-add__detail-dots>i{width:6px;height:6px;background:rgba(255,255,255,.55);border-radius:50%}.van-material-add__detail-dot--active{background:var(--van-white)!important}.van-material-add__detail-close{position:absolute;z-index:1;top:56px;left:var(--van-padding-md);display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;color:var(--van-gray-9);background:var(--van-gray-3);border:0;border-radius:50%;box-shadow:0 2px 5px rgba(27,33,41,.1)}.van-material-add__detail-content{position:relative;z-index:1;display:flex;flex:1;flex-direction:column;min-height:0;margin-top:246px;overflow:hidden;background:var(--van-white);border-radius:16px 16px 0 0}.van-material-add__detail-body{flex:1;min-height:0;padding:16px var(--van-padding-md) 24px;overflow-y:auto}.van-material-add__detail-section+.van-material-add__detail-section{margin-top:24px}.van-material-add__detail-section .van-blue-mark-header{margin-bottom:8px;padding:0}.van-material-add__detail-card{padding:8px 12px;color:var(--van-gray-9);font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);background:linear-gradient(90deg,var(--van-gray-2),rgba(241,244,246,.2));border-radius:8px}.van-material-add__detail-info-rows{display:flex;flex-direction:column;gap:8px}.van-material-add__detail-row{display:flex;gap:16px;justify-content:space-between;min-height:22px}.van-material-add__detail-row>span{flex:none;width:56px;color:var(--van-gray-6)}.van-material-add__detail-row>strong{flex:1;color:var(--van-gray-9);font-weight:400;text-align:right;white-space:pre-line}.van-material-add__detail-link{color:var(--van-primary-color)!important;font-weight:var(--van-font-weight-bold)!important}.van-material-add-detail-enter-active{transition:transform var(--van-animation-duration-fast) var(--van-animation-timing-function-enter);will-change:transform}.van-material-add-detail-leave-active{transition:transform var(--van-animation-duration-fast) var(--van-animation-timing-function-leave);will-change:transform}.van-material-add-detail-enter-from,.van-material-add-detail-leave-to{transform:translateY(100%)}.van-material-add-detail-section-enter-active,.van-material-add-detail-section-leave-active{overflow:hidden;transition:max-height .2s ease,opacity .2s ease}.van-material-add-detail-section-enter-from,.van-material-add-detail-section-leave-to{max-height:0;opacity:0}.van-material-add-detail-section-enter-to,.van-material-add-detail-section-leave-from{max-height:480px;opacity:1}.van-material-add-item{position:relative;padding:10px var(--van-padding-md);cursor:pointer;transition:background-color .2s ease}.van-material-add-item:active{background-color:var(--van-active-color)}.van-material-add-item--selected{padding:10px var(--van-padding-md);background:var(--van-gray-2);border-radius:8px}.van-material-add-item--selected:after{display:none}.van-material-add-item:not(:last-child):after{position:absolute;right:var(--van-padding-md);bottom:0;left:var(--van-padding-md);height:1px;background:var(--van-border-color);transform:scaleY(.5);content:""}.van-material-add-item__main{display:flex;align-items:center;min-height:22px}.van-material-add-item__detail{display:inline-flex;flex:1;gap:2px;align-items:center;min-width:0;padding:0;overflow:hidden;color:var(--van-gray-9);font:inherit;font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);text-align:left;background:transparent;border:0}.van-material-add-item__detail>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.van-material-add-item__kind-tag{flex:none;margin-left:4px}.van-material-add-item__stepper{flex:none;margin-left:8px;--van-stepper-input-width: 32px;--van-stepper-input-height: 18px;--van-stepper-input-font-size: var(--van-font-size-md);--van-stepper-input-line-height: var(--van-line-height-lg)}.van-material-add-item__unit{width:32px;margin-left:8px;overflow:hidden;color:var(--van-text-color-2);font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);text-overflow:ellipsis;white-space:nowrap}.van-material-add-item__desc{margin:4px 0 0;overflow:hidden;color:var(--van-gray-6);font-size:var(--van-font-size-sm);line-height:20px;text-overflow:ellipsis;white-space:nowrap}.van-material-add-item__keyword{color:var(--van-primary-color)}
+.van-material-action-bar{position:relative;padding:10px var(--van-padding-md)}.van-material-action-bar--selected{padding:10px var(--van-padding-md);background:var(--van-gray-2);border-radius:8px}.van-material-action-bar--selected:after{display:none}.van-material-action-bar:not(:last-child):after{position:absolute;right:var(--van-padding-md);bottom:0;left:var(--van-padding-md);height:1px;background:var(--van-border-color);transform:scaleY(.5);content:""}.van-material-action-bar__main{display:flex;align-items:center;min-height:22px}.van-material-action-bar__detail{display:inline-flex;flex:1 1 0;gap:2px;align-items:center;min-width:0;padding:0;overflow:hidden;color:var(--van-gray-9);font:inherit;font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);text-align:left;background:transparent;border:0;cursor:pointer;transition:opacity var(--van-animation-duration-fast)}.van-material-action-bar__detail:active{opacity:var(--van-active-opacity)}.van-material-action-bar__detail>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.van-material-action-bar__stepper-prefix{flex:none;margin:0 4px 0 8px;color:var(--van-text-color-2);font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg)}.van-material-action-bar__stepper-wrapper{position:relative;flex:none;margin-left:4px}.van-material-action-bar__kind-tag{flex:none;margin-left:4px}.van-material-action-bar__stepper{flex:none;margin-left:0;--van-stepper-input-width: 24px;--van-stepper-input-height: 18px;--van-stepper-input-font-size: var(--van-font-size-md);--van-stepper-input-line-height: var(--van-line-height-lg)}.van-material-action-bar__number-trigger{position:absolute;z-index:1;top:0;left:18px;width:24px;height:18px;padding:0;background:transparent;border:0;cursor:pointer}.van-material-action-bar__unit{flex:none;width:32px;margin-left:8px;overflow:hidden;color:var(--van-text-color-2);font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);text-overflow:ellipsis;white-space:nowrap}.van-material-action-bar__desc{margin:2px 0 0;overflow:hidden;color:var(--van-gray-6);font-size:var(--van-font-size-sm);line-height:20px;text-overflow:ellipsis;white-space:nowrap}.van-material-action-bar__warning{margin:2px 0 0;color:var(--van-red-500);font-size:var(--van-font-size-sm);line-height:20px}.van-material-action-bar__picking-outbound{display:flex;gap:4px;margin:2px 0 0;color:var(--van-text-color);font-size:var(--van-font-size-sm);line-height:20px}.van-material-action-bar__picking-label{color:var(--van-gray-6)}.van-material-action-bar__picking-value{font-weight:600}.van-material-action-bar__keyword{color:var(--van-primary-color)}.van-material-add{position:relative;display:flex;flex-direction:column;height:calc(100vh - 96px);max-height:calc(100vh - 96px);bottom:56px;overflow:hidden;background:var(--van-gray-2)}.van-material-add>.van-action-sheet__content{display:flex;flex:1;flex-direction:column;min-height:0;overflow:hidden}.van-material-add__nav{flex:none;--van-nav-bar-background-color: var(--van-gray-2)}.van-material-add__nav .van-nav-bar__left--slot{left:var(--van-padding-md)}.van-material-add__nav .van-nav-bar__right--slot{right:var(--van-padding-md)}.van-material-add__search{flex:none;padding:8px var(--van-padding-md);--van-search-padding: 0;--van-search-background-color: var(--van-gray-2);--van-search-content-background-color: var(--van-white)}.van-material-add__search .van-search__field{padding-left:0}.van-material-add__tabs{flex:none;padding-left:8px;--van-tabs-line-height: 44px;--van-tab-font-size: var(--van-font-size-md);--van-tabs-bottom-bar-width: 40px;--van-tabs-nav-background-color: transparent}.van-material-add__filter-tags{display:flex;flex:none;gap:6px;padding:12px var(--van-padding-md)}.van-material-add__filter-tags .van-filter-tag{min-width:56px;--van-filter-tag-background-color: var(--van-gray-4)}.van-material-add__body{flex:1;min-height:0;padding:0 var(--van-padding-md) 12px;overflow-y:auto}.van-material-add__tree-card{margin-bottom:12px;overflow:hidden;background:var(--van-white);border-radius:8px}.van-material-add__catalog-leaf{overflow:hidden}.van-material-add__catalog-leaf .van-material-action-bar:after{position:absolute;right:var(--van-padding-md);bottom:0;left:var(--van-padding-md);display:block;height:1px;content:"";background:var(--van-border-color);transform:scaleY(.5)}.van-tree-select__children>.van-tree-select__node:last-child>.van-material-add__catalog-leaf .van-material-action-bar:after{display:none}.van-material-add__material-list{overflow:hidden;background:var(--van-white);border-radius:8px}.van-material-add__empty{padding:32px 16px;color:var(--van-text-color-3);font-size:var(--van-font-size-md);text-align:center}.van-material-add__footer{position:relative;z-index:2;flex:none;background:var(--van-white);box-shadow:0 -2px 5px rgba(27,33,41,.1)}.van-material-add__footer .van-bottom-action-bar{box-shadow:none}.van-material-add__selected-panel{position:absolute;right:0;bottom:60px;left:0;display:flex;flex-direction:column;max-height:340px;overflow:hidden;background:var(--van-white);box-shadow:0 -2px 5px rgba(27,33,41,.1)}.van-material-add__selected-header{display:flex;align-items:center;justify-content:space-between;padding:12px var(--van-padding-md) 4px}.van-material-add__clear,.van-material-add__collapse{padding:0;background:transparent;border:0}.van-material-add__clear{color:var(--van-primary-color);font:inherit;font-size:var(--van-font-size-md)}.van-material-add__collapse{display:inline-flex;gap:2px;align-items:center;color:var(--van-gray-6);font:inherit;font-size:var(--van-font-size-md)}.van-material-add__selected-list{display:flex;flex-direction:column;gap:6px;padding:var(--van-padding-xs) var(--van-padding-md);overflow-y:auto}.van-material-add__detail-page{position:fixed;z-index:3000;inset:0;display:flex;flex-direction:column;overflow:hidden;background:var(--van-gray-2)}.van-material-add__detail-banner{position:absolute;top:0;right:0;left:0;height:320px;overflow:hidden;background:var(--van-gray-8)}.van-material-add__detail-swipe{height:320px;touch-action:pan-y}.van-material-add__detail-image{width:100%;height:310px;background-position:center;background-size:cover}.van-material-add__detail-image--motor{background-image:url(/dog1.jpg)}.van-material-add__detail-image--blower{background-image:url(/dog2.jpg)}.van-material-add__detail-image--coil{background-image:url(/dog3.jpg)}.van-material-add__detail-dots{position:absolute;z-index:2;top:226px;left:50%;display:flex;gap:6px;transform:translate(-50%)}.van-material-add__detail-dots>i{width:6px;height:6px;background:rgba(255,255,255,.55);border-radius:50%}.van-material-add__detail-dot--active{background:var(--van-white)!important}.van-material-add__detail-close{position:absolute;z-index:1;top:56px;left:var(--van-padding-md);display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;color:var(--van-gray-9);background:var(--van-gray-3);border:0;border-radius:50%;box-shadow:0 2px 5px rgba(27,33,41,.1)}.van-material-add__detail-content{position:relative;z-index:1;display:flex;flex:1;flex-direction:column;min-height:0;margin-top:246px;overflow:hidden;background:var(--van-white);border-radius:16px 16px 0 0}.van-material-add__detail-body{flex:1;min-height:0;padding:16px var(--van-padding-md) 24px;overflow-y:auto}.van-material-add__detail-section+.van-material-add__detail-section{margin-top:24px}.van-material-add__detail-section .van-blue-mark-header{margin-bottom:8px;padding:0}.van-material-add__detail-card{padding:8px 12px;color:var(--van-gray-9);font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);background:linear-gradient(90deg,var(--van-gray-2),rgba(241,244,246,.2));border-radius:8px}.van-material-add__detail-info-rows{display:flex;flex-direction:column;gap:8px}.van-material-add__detail-row{display:flex;gap:16px;justify-content:space-between;min-height:22px}.van-material-add__detail-row>span{flex:none;width:56px;color:var(--van-gray-6)}.van-material-add__detail-row>strong{flex:1;color:var(--van-gray-9);font-weight:400;text-align:right;white-space:pre-line}.van-material-add__detail-link{color:var(--van-primary-color)!important;font-weight:var(--van-font-weight-bold)!important}.van-material-add-detail-enter-active{transition:transform var(--van-animation-duration-fast) var(--van-animation-timing-function-enter);will-change:transform}.van-material-add-detail-leave-active{transition:transform var(--van-animation-duration-fast) var(--van-animation-timing-function-leave);will-change:transform}.van-material-add-detail-enter-from,.van-material-add-detail-leave-to{transform:translateY(100%)}.van-material-add-detail-section-enter-active,.van-material-add-detail-section-leave-active{overflow:hidden;transition:max-height .2s ease,opacity .2s ease}.van-material-add-detail-section-enter-from,.van-material-add-detail-section-leave-to{max-height:0;opacity:0}.van-material-add-detail-section-enter-to,.van-material-add-detail-section-leave-from{max-height:480px;opacity:1}.van-material-add-item{position:relative;padding:10px var(--van-padding-md);cursor:pointer;transition:background-color .2s ease}.van-material-add-item:active{background-color:var(--van-active-color)}.van-material-add-item--selected{padding:10px var(--van-padding-md);background:var(--van-gray-2);border-radius:8px}.van-material-add-item--selected:after{display:none}.van-material-add-item:not(:last-child):after{position:absolute;right:var(--van-padding-md);bottom:0;left:var(--van-padding-md);height:1px;background:var(--van-border-color);transform:scaleY(.5);content:""}.van-material-add-item__main{display:flex;align-items:center;min-height:22px}.van-material-add-item__detail{display:inline-flex;flex:1;gap:2px;align-items:center;min-width:0;padding:0;overflow:hidden;color:var(--van-gray-9);font:inherit;font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);text-align:left;background:transparent;border:0}.van-material-add-item__detail>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.van-material-add-item__kind-tag{flex:none;margin-left:4px}.van-material-add-item__stepper{flex:none;margin-left:8px;--van-stepper-input-width: 32px;--van-stepper-input-height: 18px;--van-stepper-input-font-size: var(--van-font-size-md);--van-stepper-input-line-height: var(--van-line-height-lg)}.van-material-add-item__unit{width:32px;margin-left:8px;overflow:hidden;color:var(--van-text-color-2);font-size:var(--van-font-size-md);line-height:var(--van-line-height-lg);text-overflow:ellipsis;white-space:nowrap}.van-material-add-item__desc{margin:4px 0 0;overflow:hidden;color:var(--van-gray-6);font-size:var(--van-font-size-sm);line-height:20px;text-overflow:ellipsis;white-space:nowrap}.van-material-add-item__keyword{color:var(--van-primary-color)}

package/es/material-add/style/index.mjs

@@ -13,6 +13,7 @@ import "../../overlay/index.css";
 import "../../popup/index.css";
 import "../../popover/index.css";
 import "../../nav-bar/index.css";
+import "../../toast/index.css";
 import "../../action-sheet/index.css";
 import "../../checkbox-group/index.css";
 import "../../checkbox/index.css";

package/es/material-add/style/less.mjs

@@ -13,6 +13,7 @@ import "../../overlay/index.less";
 import "../../popup/index.less";
 import "../../popover/index.less";
 import "../../nav-bar/index.less";
+import "../../toast/index.less";
 import "../../action-sheet/index.less";
 import "../../checkbox-group/index.less";
 import "../../checkbox/index.less";

package/es/material-detail/MaterialDetail.mjs

@@ -27,6 +27,7 @@ var stdin_default = defineComponent({
     const usageExpanded = ref(true);
     const noticeExpanded = ref(true);
     const bannerIndex = ref(0);
+    const swipeRef = ref();
     const item = computed(() => props.item);
     const close = () => emit("update:show", false);
     const infoRows = computed(() => {
@@ -83,14 +84,18 @@ var stdin_default = defineComponent({
     });
     const displayImages = computed(() => props.images.length ? props.images : defaultImages);
     return () => _createVNode(Transition, {
-      "name": "van-material-detail"
+      "name": "van-material-detail",
+      "onAfterEnter": () => {
+        var _a;
+        return (_a = swipeRef.value) == null ? void 0 : _a.resize();
+      }
     }, {
       default: () => [props.show && item.value ? _createVNode("div", {
         "class": bem()
       }, [_createVNode("div", {
         "class": bem("banner")
       }, [_createVNode(Swipe, {
-        "loop": false,
+        "ref": swipeRef,
         "showIndicators": false,
         "class": bem("swipe"),
         "onChange": (index) => {

package/es/material-display-bar/MaterialDisplayBar.d.ts

@@ -4,6 +4,7 @@ export declare type MaterialDisplayBarField = {
     label: string;
     showLabel?: boolean;
     showContent?: boolean;
+    showColon?: boolean;
     content?: string;
     type?: LabelType;
     vertical?: boolean;
@@ -148,8 +149,8 @@ declare const _default: import("vue").DefineComponent<{
     fields: MaterialDisplayBarField[];
     divider: boolean;
     showArrow: boolean;
-    unit: string;
     quantityLabel: string;
+    unit: string;
     rounded: boolean;
     stockInsufficient: boolean;
     stockInsufficientText: string;

package/es/material-display-bar/MaterialDisplayBar.mjs

@@ -38,10 +38,12 @@ var stdin_default = defineComponent({
         return;
       return _createVNode(Label, {
         "key": `${field.label}-${index}`,
+        "class": bem("field"),
         "size": "mini",
         "label": field.label,
         "showLabel": field.showLabel,
         "showContent": field.showContent,
+        "showColon": field.showColon,
         "content": field.content,
         "type": field.type,
         "vertical": field.vertical,
@@ -57,7 +59,7 @@ var stdin_default = defineComponent({
       route();
     };
     const renderBar = () => {
-      var _a, _b, _c;
+      var _a, _b, _c, _d;
       return _createVNode("section", {
         "class": bem({
           rounded: props.rounded
@@ -79,12 +81,12 @@ var stdin_default = defineComponent({
         "class": bem("quantity")
       }, [((_b = slots.quantity) == null ? void 0 : _b.call(slots)) || _createVNode(_Fragment, null, [props.quantityLabel && _createVNode("span", {
         "class": bem("quantity-label")
-      }, [props.quantityLabel]), _createVNode("strong", null, [props.quantity]), props.unit && _createVNode("span", null, [props.unit])])])]), props.fields.filter((field) => field.visible !== false).length > 0 && _createVNode("div", {
+      }, [props.quantityLabel]), _createVNode("strong", null, [props.quantity]), props.unit && _createVNode("span", null, [props.unit])]), (_c = slots["quantity-suffix"]) == null ? void 0 : _c.call(slots)])]), props.fields.filter((field) => field.visible !== false).length > 0 && _createVNode("div", {
         "class": bem("fields")
       }, [props.fields.map(renderField)])]), props.divider && _createVNode(Divider, {
         "hairline": true,
         "class": bem("divider")
-      }, null), ((_c = slots.default) == null ? void 0 : _c.call(slots)) && _createVNode("div", {
+      }, null), ((_d = slots.default) == null ? void 0 : _d.call(slots)) && _createVNode("div", {
         "class": bem("bottom")
       }, [slots.default()])]);
     };

package/es/material-display-bar/index.css

@@ -1 +1 @@
-:root{--van-material-display-bar-padding: 10px var(--van-padding-md);--van-material-display-bar-radius: var(--van-border-radius-lg);--van-material-display-bar-gap: 4px;--van-material-display-bar-fields-gap: 0;--van-material-display-bar-title-color: var(--van-gray-8);--van-material-display-bar-title-font-size: var(--van-font-size-md);--van-material-display-bar-title-line-height: var(--van-line-height-lg);--van-material-display-bar-title-gap: 2px;--van-material-display-bar-title-icon-size: 12px;--van-material-display-bar-quantity-color: var(--van-orange-700);--van-material-display-bar-quantity-gap: 2px;--van-material-display-bar-quantity-label-gap: 4px}.van-material-display-bar{overflow:hidden;background:var(--van-white)}.van-material-display-bar--rounded{border-radius:var(--van-material-display-bar-radius)}.van-material-display-bar__body{display:flex;flex-direction:column;gap:var(--van-material-display-bar-gap);padding:var(--van-material-display-bar-padding)}.van-material-display-bar__header,.van-material-display-bar__quantity,.van-material-display-bar__title{display:flex;align-items:center}.van-material-display-bar__header{justify-content:space-between;gap:var(--van-padding-sm);min-width:0}.van-material-display-bar__title{min-width:0;gap:var(--van-material-display-bar-title-gap);padding:0;color:var(--van-material-display-bar-title-color);font:inherit;font-size:var(--van-material-display-bar-title-font-size);font-weight:400;line-height:var(--van-material-display-bar-title-line-height);text-align:left;background:transparent;border:0;cursor:pointer}.van-material-display-bar__title:active{opacity:var(--van-active-opacity)}.van-material-display-bar__title-arrow{flex:none;color:var(--van-material-display-bar-title-color);font-size:var(--van-material-display-bar-title-icon-size)}.van-material-display-bar__quantity{flex:none;gap:var(--van-material-display-bar-quantity-gap);color:var(--van-material-display-bar-title-color);font-size:var(--van-material-display-bar-title-font-size);line-height:var(--van-material-display-bar-title-line-height);white-space:nowrap}.van-material-display-bar__quantity strong{color:var(--van-material-display-bar-quantity-color);font-weight:var(--van-font-weight-bold)}.van-material-display-bar__quantity-label{margin-right:var(--van-material-display-bar-quantity-label-gap)}.van-material-display-bar__stock-insufficient{flex:none;color:var(--van-red-500);font-size:var(--van-font-size-sm);line-height:var(--van-line-height-md);white-space:nowrap}.van-material-display-bar__fields{display:flex;flex-direction:column;gap:var(--van-material-display-bar-fields-gap);width:100%}.van-material-display-bar__divider.van-divider{margin:0 var(--van-padding-md)}.van-material-display-bar__bottom{display:flex;flex-direction:column;gap:var(--van-material-display-bar-gap)}.van-material-display-bar__swipe-cell{overflow:hidden;background:var(--van-gray-2)}.van-material-display-bar__swipe-cell--rounded{border-radius:var(--van-material-display-bar-radius)}.van-material-display-bar__delete{width:calc(100% - 8px);height:100%;margin:0 4px;border:0;border-radius:8px}
+:root{--van-material-display-bar-padding: 10px var(--van-padding-md);--van-material-display-bar-radius: var(--van-border-radius-lg);--van-material-display-bar-gap: 4px;--van-material-display-bar-fields-gap: 0;--van-material-display-bar-field-label-max-width: 120px;--van-material-display-bar-title-color: var(--van-gray-8);--van-material-display-bar-title-font-size: var(--van-font-size-md);--van-material-display-bar-title-line-height: var(--van-line-height-lg);--van-material-display-bar-title-gap: 2px;--van-material-display-bar-title-icon-size: 12px;--van-material-display-bar-quantity-color: var(--van-orange-700);--van-material-display-bar-quantity-gap: 4px;--van-material-display-bar-quantity-label-gap: 4px}.van-material-display-bar{overflow:hidden;background:var(--van-white)}.van-material-display-bar--rounded{border-radius:var(--van-material-display-bar-radius)}.van-material-display-bar__body{display:flex;flex-direction:column;gap:var(--van-material-display-bar-gap);padding:var(--van-material-display-bar-padding)}.van-material-display-bar__header,.van-material-display-bar__quantity,.van-material-display-bar__title{display:flex;align-items:center}.van-material-display-bar__header{justify-content:space-between;gap:var(--van-material-display-bar-gap);min-width:0}.van-material-display-bar__title{flex:1 1 0;min-width:0;gap:var(--van-material-display-bar-title-gap);padding:0;overflow:hidden;color:var(--van-material-display-bar-title-color);font:inherit;font-size:var(--van-material-display-bar-title-font-size);font-weight:400;line-height:var(--van-material-display-bar-title-line-height);text-align:left;background:transparent;border:0;cursor:pointer}.van-material-display-bar__title:active{opacity:var(--van-active-opacity)}.van-material-display-bar__title>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.van-material-display-bar__title-arrow{flex:none;color:var(--van-material-display-bar-title-color);font-size:var(--van-material-display-bar-title-icon-size)}.van-material-display-bar__quantity{flex:none;gap:var(--van-material-display-bar-quantity-gap);color:var(--van-material-display-bar-title-color);font-size:var(--van-material-display-bar-title-font-size);line-height:var(--van-material-display-bar-title-line-height);white-space:nowrap}.van-material-display-bar__quantity strong{color:var(--van-material-display-bar-quantity-color);font-weight:var(--van-font-weight-bold)}.van-material-display-bar__quantity-label{margin-right:var(--van-material-display-bar-quantity-label-gap)}.van-material-display-bar__stock-insufficient{flex:none;color:var(--van-red-500);font-size:var(--van-font-size-sm);line-height:var(--van-line-height-md);white-space:nowrap}.van-material-display-bar__fields{display:flex;flex-direction:column;gap:var(--van-material-display-bar-fields-gap);width:100%}.van-material-display-bar__field.van-label:not(.van-label--vertical):not(.van-label--tag):not(.van-label--media){min-width:0}.van-material-display-bar__field.van-label:not(.van-label--vertical):not(.van-label--tag):not(.van-label--media) .van-label__label{max-width:var(--van-material-display-bar-field-label-max-width);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.van-material-display-bar__field.van-label:not(.van-label--vertical):not(.van-label--tag):not(.van-label--media) .van-label__value,.van-material-display-bar__field.van-label:not(.van-label--vertical):not(.van-label--tag):not(.van-label--media) .van-label__text,.van-material-display-bar__field.van-label:not(.van-label--vertical):not(.van-label--tag):not(.van-label--media) .van-label__link{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.van-material-display-bar__field.van-label:not(.van-label--vertical):not(.van-label--tag):not(.van-label--media) .van-label__text,.van-material-display-bar__field.van-label:not(.van-label--vertical):not(.van-label--tag):not(.van-label--media) .van-label__link{display:block}.van-material-display-bar__divider.van-divider{margin:0 var(--van-padding-md)}.van-material-display-bar__bottom{display:flex;flex-direction:column;gap:var(--van-material-display-bar-gap)}.van-material-display-bar__swipe-cell{overflow:hidden;background:var(--van-gray-2)}.van-material-display-bar__swipe-cell--rounded{border-radius:var(--van-material-display-bar-radius)}.van-material-display-bar__delete{width:calc(100% - 8px);height:100%;margin:0 4px;border:0;border-radius:8px}

package/es/material-display-bar/index.d.ts

@@ -1,4 +1,105 @@
-export declare const MaterialDisplayBar: import("../utils").WithInstall<import("vue").DefineComponent<{
+export declare const MaterialPreviewList: import("../utils").WithInstall<import("vue").DefineComponent<{
+    name: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    quantity: (NumberConstructor | StringConstructor)[];
+    quantityLabel: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    unit: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    showArrow: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    rounded: BooleanConstructor;
+    stockInsufficient: BooleanConstructor;
+    stockInsufficientText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    swipeDelete: BooleanConstructor;
+    deleteText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    fields: {
+        type: import("vue").PropType<import("./MaterialDisplayBar").MaterialDisplayBarField[]>;
+        default: () => never[];
+    };
+    divider: {
+        type: BooleanConstructor;
+        default: true;
+    };
+} & {
+    to: import("vue").PropType<import("vue-router").RouteLocationRaw>;
+    url: StringConstructor;
+    replace: BooleanConstructor;
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("delete" | "click-title" | "click-media" | "click-field")[], "delete" | "click-title" | "click-media" | "click-field", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    name: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    quantity: (NumberConstructor | StringConstructor)[];
+    quantityLabel: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    unit: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    showArrow: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    rounded: BooleanConstructor;
+    stockInsufficient: BooleanConstructor;
+    stockInsufficientText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    swipeDelete: BooleanConstructor;
+    deleteText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    fields: {
+        type: import("vue").PropType<import("./MaterialDisplayBar").MaterialDisplayBarField[]>;
+        default: () => never[];
+    };
+    divider: {
+        type: BooleanConstructor;
+        default: true;
+    };
+} & {
+    to: import("vue").PropType<import("vue-router").RouteLocationRaw>;
+    url: StringConstructor;
+    replace: BooleanConstructor;
+}>> & {
+    onDelete?: ((...args: any[]) => any) | undefined;
+    "onClick-title"?: ((...args: any[]) => any) | undefined;
+    "onClick-media"?: ((...args: any[]) => any) | undefined;
+    "onClick-field"?: ((...args: any[]) => any) | undefined;
+}, {
+    replace: boolean;
+    name: string;
+    fields: import("./MaterialDisplayBar").MaterialDisplayBarField[];
+    divider: boolean;
+    showArrow: boolean;
+    quantityLabel: string;
+    unit: string;
+    rounded: boolean;
+    stockInsufficient: boolean;
+    stockInsufficientText: string;
+    swipeDelete: boolean;
+    deleteText: string;
+}>>;
+export declare const MaterialPreview: import("../utils").WithInstall<import("vue").DefineComponent<{
     name: {
         type: import("vue").PropType<string>;
         default: string;
@@ -91,13 +192,114 @@ export declare const MaterialDisplayBar: import("../utils").WithInstall<import("
     fields: import("./MaterialDisplayBar").MaterialDisplayBarField[];
     divider: boolean;
     showArrow: boolean;
+    quantityLabel: string;
     unit: string;
+    rounded: boolean;
+    stockInsufficient: boolean;
+    stockInsufficientText: string;
+    swipeDelete: boolean;
+    deleteText: string;
+}>>;
+export declare const MaterialDisplayBar: import("../utils").WithInstall<import("vue").DefineComponent<{
+    name: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    quantity: (NumberConstructor | StringConstructor)[];
+    quantityLabel: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    unit: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    showArrow: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    rounded: BooleanConstructor;
+    stockInsufficient: BooleanConstructor;
+    stockInsufficientText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    swipeDelete: BooleanConstructor;
+    deleteText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    fields: {
+        type: import("vue").PropType<import("./MaterialDisplayBar").MaterialDisplayBarField[]>;
+        default: () => never[];
+    };
+    divider: {
+        type: BooleanConstructor;
+        default: true;
+    };
+} & {
+    to: import("vue").PropType<import("vue-router").RouteLocationRaw>;
+    url: StringConstructor;
+    replace: BooleanConstructor;
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("delete" | "click-title" | "click-media" | "click-field")[], "delete" | "click-title" | "click-media" | "click-field", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    name: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    quantity: (NumberConstructor | StringConstructor)[];
+    quantityLabel: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    unit: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    showArrow: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    rounded: BooleanConstructor;
+    stockInsufficient: BooleanConstructor;
+    stockInsufficientText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    swipeDelete: BooleanConstructor;
+    deleteText: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    fields: {
+        type: import("vue").PropType<import("./MaterialDisplayBar").MaterialDisplayBarField[]>;
+        default: () => never[];
+    };
+    divider: {
+        type: BooleanConstructor;
+        default: true;
+    };
+} & {
+    to: import("vue").PropType<import("vue-router").RouteLocationRaw>;
+    url: StringConstructor;
+    replace: BooleanConstructor;
+}>> & {
+    onDelete?: ((...args: any[]) => any) | undefined;
+    "onClick-title"?: ((...args: any[]) => any) | undefined;
+    "onClick-media"?: ((...args: any[]) => any) | undefined;
+    "onClick-field"?: ((...args: any[]) => any) | undefined;
+}, {
+    replace: boolean;
+    name: string;
+    fields: import("./MaterialDisplayBar").MaterialDisplayBarField[];
+    divider: boolean;
+    showArrow: boolean;
     quantityLabel: string;
+    unit: string;
     rounded: boolean;
     stockInsufficient: boolean;
     stockInsufficientText: string;
     swipeDelete: boolean;
     deleteText: string;
 }>>;
-export default MaterialDisplayBar;
-export type { MaterialDisplayBarField, MaterialDisplayBarProps } from './MaterialDisplayBar';
+export default MaterialPreviewList;
+export type { MaterialDisplayBarField, MaterialDisplayBarProps, MaterialDisplayBarField as MaterialPreviewListField, MaterialDisplayBarProps as MaterialPreviewListProps, MaterialDisplayBarField as MaterialPreviewField, MaterialDisplayBarProps as MaterialPreviewProps, } from './MaterialDisplayBar';

package/es/material-display-bar/index.less

@@ -5,6 +5,7 @@
   --van-material-display-bar-radius: @material-detail-radius;
   --van-material-display-bar-gap: @material-detail-gap;
   --van-material-display-bar-fields-gap: @material-detail-fields-gap;
+  --van-material-display-bar-field-label-max-width: @material-detail-field-label-max-width;
   --van-material-display-bar-title-color: @material-detail-title-color;
   --van-material-display-bar-title-font-size: @material-detail-title-font-size;
   --van-material-display-bar-title-line-height: @material-detail-title-line-height;
@@ -37,14 +38,16 @@
 
   &__header {
     justify-content: space-between;
-    gap: var(--van-padding-sm);
+    gap: var(--van-material-display-bar-gap);
     min-width: 0;
   }
 
   &__title {
+    flex: 1 1 0;
     min-width: 0;
     gap: var(--van-material-display-bar-title-gap);
     padding: 0;
+    overflow: hidden;
     color: var(--van-material-display-bar-title-color);
     font: inherit;
     font-size: var(--van-material-display-bar-title-font-size);
@@ -56,6 +59,13 @@
     cursor: pointer;
 
     &:active { opacity: var(--van-active-opacity); }
+
+    > span {
+      min-width: 0;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
   }
 
   &__title-arrow {
@@ -90,6 +100,29 @@
 
   &__fields { display: flex; flex-direction: column; gap: var(--van-material-display-bar-fields-gap); width: 100%; }
 
+  &__field.van-label:not(.van-label--vertical):not(.van-label--tag):not(.van-label--media) {
+    min-width: 0;
+
+    .van-label__label {
+      max-width: var(--van-material-display-bar-field-label-max-width);
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .van-label__value,
+    .van-label__text,
+    .van-label__link {
+      min-width: 0;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .van-label__text,
+    .van-label__link { display: block; }
+  }
+
   &__divider.van-divider {
     margin: 0 var(--van-padding-md);
   }

package/es/material-display-bar/index.mjs

@@ -1,8 +1,12 @@
 import { withInstall } from "../utils/index.mjs";
 import _MaterialDisplayBar from "./MaterialDisplayBar.mjs";
-const MaterialDisplayBar = withInstall(_MaterialDisplayBar);
-var stdin_default = MaterialDisplayBar;
+const MaterialPreviewList = withInstall(_MaterialDisplayBar);
+const MaterialPreview = MaterialPreviewList;
+const MaterialDisplayBar = MaterialPreviewList;
+var stdin_default = MaterialPreviewList;
 export {
   MaterialDisplayBar,
+  MaterialPreview,
+  MaterialPreviewList,
   stdin_default as default
 };

package/es/material-display-bar/var.less

@@ -2,11 +2,12 @@
 @material-detail-radius: var(--van-border-radius-lg);
 @material-detail-gap: 4px;
 @material-detail-fields-gap: 0;
+@material-detail-field-label-max-width: 120px;
 @material-detail-title-color: var(--van-gray-8);
 @material-detail-title-font-size: var(--van-font-size-md);
 @material-detail-title-line-height: var(--van-line-height-lg);
 @material-detail-title-gap: 2px;
 @material-detail-title-icon-size: 12px;
 @material-detail-quantity-color: var(--van-orange-700);
-@material-detail-quantity-gap: 2px;
+@material-detail-quantity-gap: 4px;
 @material-detail-quantity-label-gap: 4px;

package/es/tag/Tag.d.ts

@@ -1,6 +1,6 @@
 import { type PropType, type ExtractPropTypes } from 'vue';
-export declare type TagSize = 'large' | 'medium';
-export declare type TagType = 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'gray';
+export declare type TagSize = 'large' | 'medium' | 'small';
+export declare type TagType = 'default' | 'primary' | 'success' | 'warning' | 'danger' | 'gray' | 'turquoise' | 'purple' | 'violet';
 declare const tagProps: {
     size: {
         type: PropType<TagSize>;
@@ -20,6 +20,10 @@ declare const tagProps: {
     round: BooleanConstructor;
     textColor: StringConstructor;
     closeable: BooleanConstructor;
+    rightIcon: StringConstructor;
+    number: (NumberConstructor | StringConstructor)[];
+    showNumber: BooleanConstructor;
+    numberColor: StringConstructor;
 };
 export declare type TagProps = ExtractPropTypes<typeof tagProps>;
 declare const _default: import("vue").DefineComponent<{
@@ -41,6 +45,10 @@ declare const _default: import("vue").DefineComponent<{
     round: BooleanConstructor;
     textColor: StringConstructor;
     closeable: BooleanConstructor;
+    rightIcon: StringConstructor;
+    number: (NumberConstructor | StringConstructor)[];
+    showNumber: BooleanConstructor;
+    numberColor: StringConstructor;
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "close"[], "close", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
     size: {
         type: PropType<TagSize>;
@@ -60,6 +68,10 @@ declare const _default: import("vue").DefineComponent<{
     round: BooleanConstructor;
     textColor: StringConstructor;
     closeable: BooleanConstructor;
+    rightIcon: StringConstructor;
+    number: (NumberConstructor | StringConstructor)[];
+    showNumber: BooleanConstructor;
+    numberColor: StringConstructor;
 }>> & {
     onClose?: ((...args: any[]) => any) | undefined;
 }, {
@@ -70,5 +82,6 @@ declare const _default: import("vue").DefineComponent<{
     show: boolean;
     plain: boolean;
     closeable: boolean;
+    showNumber: boolean;
 }>;
 export default _default;

package/es/tag/Tag.mjs

@@ -11,7 +11,11 @@ const tagProps = {
   plain: Boolean,
   round: Boolean,
   textColor: String,
-  closeable: Boolean
+  closeable: Boolean,
+  rightIcon: String,
+  number: [String, Number],
+  showNumber: Boolean,
+  numberColor: String
 };
 var stdin_default = defineComponent({
   name,
@@ -45,7 +49,11 @@ var stdin_default = defineComponent({
         plain,
         round,
         size,
-        closeable
+        closeable,
+        rightIcon,
+        number,
+        showNumber,
+        numberColor
       } = props;
       const classes = {
         mark,
@@ -60,10 +68,19 @@ var stdin_default = defineComponent({
         "class": [bem("close"), HAPTICS_FEEDBACK],
         "onClick": onClose
       }, null);
+      const RightIcon = rightIcon && _createVNode(Icon, {
+        "name": rightIcon,
+        "class": bem("right-icon")
+      }, null);
       return _createVNode("span", {
         "style": getStyle(),
         "class": bem([classes, type])
-      }, [(_a = slots.default) == null ? void 0 : _a.call(slots), CloseIcon]);
+      }, [showNumber && number !== void 0 && _createVNode("span", {
+        "class": bem("number"),
+        "style": {
+          color: numberColor
+        }
+      }, [number]), (_a = slots.default) == null ? void 0 : _a.call(slots), RightIcon, CloseIcon]);
     };
     return () => _createVNode(Transition, {
       "name": props.closeable ? "van-fade" : void 0

package/es/tag/index.css

@@ -1 +1 @@
-:root{--van-tag-padding: 0 var(--van-padding-base);--van-tag-text-color: var(--van-white);--van-tag-font-size: var(--van-font-size-sm);--van-tag-border-radius: 2px;--van-tag-line-height: 16px;--van-tag-medium-padding: 2px 6px;--van-tag-large-padding: var(--van-padding-base) var(--van-padding-xs);--van-tag-large-border-radius: var(--van-border-radius-md);--van-tag-large-font-size: var(--van-font-size-md);--van-tag-round-border-radius: var(--van-border-radius-max);--van-tag-danger-color: var(--van-red-700);--van-tag-danger-background-color: var(--van-red-100);--van-tag-primary-color: var(--van-blue-700);--van-tag-primary-background-color: var(--van-blue-100);--van-tag-success-color: var(--van-green-700);--van-tag-success-background-color: var(--van-green-100);--van-tag-warning-color: var(--van-orange-700);--van-tag-warning-background-color: var(--van-orange-100);--van-tag-gray-color: var(--van-gray-8);--van-tag-gray-background-color: var(--van-gray-3);--van-tag-default-color: var(--van-gray-6);--van-tag-plain-background-color: transparent}.van-tag{position:relative;display:inline-flex;align-items:center;padding:var(--van-tag-padding);color:var(--van-tag-text-color);font-size:var(--van-tag-font-size);line-height:var(--van-tag-line-height);border-radius:var(--van-tag-border-radius)}.van-tag--default{background:var(--van-tag-default-color)}.van-tag--default.van-tag--plain{color:var(--van-tag-default-color)}.van-tag--danger{background:var(--van-tag-danger-background-color);color:var(--van-tag-danger-color)}.van-tag--primary{background:var(--van-tag-primary-background-color);color:var(--van-tag-primary-color)}.van-tag--success{background:var(--van-tag-success-background-color);color:var(--van-tag-success-color)}.van-tag--warning{background:var(--van-tag-warning-background-color);color:var(--van-tag-warning-color)}.van-tag--gray{background:var(--van-tag-gray-background-color);color:var(--van-tag-gray-color)}.van-tag--plain{background:var(--van-tag-plain-background-color);border-color:currentColor}.van-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}.van-tag--medium{padding:var(--van-tag-medium-padding)}.van-tag--large{padding:var(--van-tag-large-padding);font-size:var(--van-tag-large-font-size);border-radius:var(--van-tag-large-border-radius)}.van-tag--mark{border-radius:0 var(--van-tag-round-border-radius) var(--van-tag-round-border-radius) 0}.van-tag--mark:after{display:block;width:2px;content:""}.van-tag--round{border-radius:var(--van-tag-round-border-radius)}.van-tag__close{margin-left:2px}
+:root{--van-tag-padding: 0 var(--van-padding-base);--van-tag-text-color: var(--van-white);--van-tag-font-size: var(--van-font-size-sm);--van-tag-border-radius: 2px;--van-tag-line-height: 16px;--van-tag-medium-padding: 2px 6px;--van-tag-small-padding: 1px 4px;--van-tag-small-font-size: var(--van-font-size-xs);--van-tag-large-padding: var(--van-padding-base) var(--van-padding-xs);--van-tag-large-border-radius: var(--van-border-radius-md);--van-tag-large-font-size: var(--van-font-size-md);--van-tag-round-border-radius: var(--van-border-radius-max);--van-tag-icon-gap: 2px;--van-tag-right-icon-size: 12px;--van-tag-small-right-icon-size: 10px;--van-tag-large-right-icon-size: 14px;--van-tag-danger-color: var(--van-red-700);--van-tag-danger-background-color: var(--van-red-100);--van-tag-primary-color: var(--van-blue-700);--van-tag-primary-background-color: var(--van-blue-100);--van-tag-success-color: var(--van-green-700);--van-tag-success-background-color: var(--van-green-100);--van-tag-warning-color: var(--van-orange-700);--van-tag-warning-background-color: var(--van-orange-100);--van-tag-gray-color: var(--van-gray-8);--van-tag-gray-background-color: var(--van-gray-3);--van-tag-turquoise-color: #0f766e;--van-tag-turquoise-background-color: #ccfbf1;--van-tag-purple-color: #7e22ce;--van-tag-purple-background-color: #f3e8ff;--van-tag-violet-color: #6d28d9;--van-tag-violet-background-color: #ede9fe;--van-tag-default-color: var(--van-gray-6);--van-tag-plain-background-color: transparent}.van-tag{position:relative;display:inline-flex;align-items:center;padding:var(--van-tag-padding);color:var(--van-tag-text-color);font-size:var(--van-tag-font-size);line-height:var(--van-tag-line-height);border-radius:var(--van-tag-border-radius)}.van-tag--default{background:var(--van-tag-default-color)}.van-tag--default.van-tag--plain{color:var(--van-tag-default-color)}.van-tag--danger{background:var(--van-tag-danger-background-color);color:var(--van-tag-danger-color)}.van-tag--primary{background:var(--van-tag-primary-background-color);color:var(--van-tag-primary-color)}.van-tag--success{background:var(--van-tag-success-background-color);color:var(--van-tag-success-color)}.van-tag--warning{background:var(--van-tag-warning-background-color);color:var(--van-tag-warning-color)}.van-tag--gray{background:var(--van-tag-gray-background-color);color:var(--van-tag-gray-color)}.van-tag--turquoise{background:var(--van-tag-turquoise-background-color);color:var(--van-tag-turquoise-color)}.van-tag--purple{background:var(--van-tag-purple-background-color);color:var(--van-tag-purple-color)}.van-tag--violet{background:var(--van-tag-violet-background-color);color:var(--van-tag-violet-color)}.van-tag--plain{background:var(--van-tag-plain-background-color);border-color:currentColor}.van-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}.van-tag--medium{padding:var(--van-tag-medium-padding)}.van-tag--small{padding:var(--van-tag-small-padding);font-size:var(--van-tag-small-font-size);--van-tag-right-icon-size: var(--van-tag-small-right-icon-size)}.van-tag--large{padding:var(--van-tag-large-padding);font-size:var(--van-tag-large-font-size);border-radius:var(--van-tag-large-border-radius);--van-tag-right-icon-size: var(--van-tag-large-right-icon-size)}.van-tag--mark{border-radius:0 var(--van-tag-round-border-radius) var(--van-tag-round-border-radius) 0}.van-tag--mark:after{display:block;width:2px;content:""}.van-tag--round{border-radius:var(--van-tag-round-border-radius)}.van-tag__close{margin-left:var(--van-tag-icon-gap)}.van-tag__right-icon{margin-left:var(--van-tag-icon-gap);font-size:var(--van-tag-right-icon-size)}.van-tag__number{margin-right:2px;font-weight:600}