vant 3.2.3 → 3.2.7

package/lib/coupon-cell/CouponCell.d.ts

@@ -1,5 +1,29 @@
-import { PropType } from 'vue';
+import { ExtractPropTypes } from 'vue';
 import type { CouponInfo } from '../coupon';
+declare const couponCellProps: {
+    title: StringConstructor;
+    border: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    editable: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    coupons: {
+        type: import("vue").PropType<CouponInfo[]>;
+        default: () => never[];
+    };
+    currency: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    chosenCoupon: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+};
+export declare type CouponCellProps = ExtractPropTypes<typeof couponCellProps>;
 declare const _default: import("vue").DefineComponent<{
     title: StringConstructor;
     border: {
@@ -11,11 +35,11 @@ declare const _default: import("vue").DefineComponent<{
         default: true;
     };
     coupons: {
-        type: PropType<CouponInfo[]>;
+        type: import("vue").PropType<CouponInfo[]>;
         default: () => never[];
     };
     currency: {
-        type: StringConstructor;
+        type: import("vue").PropType<string>;
         default: string;
     };
     chosenCoupon: {

package/lib/coupon-cell/CouponCell.js

@@ -12,8 +12,21 @@ var _cell = require("../cell");
 // Utils
 // Components
 var [name, bem, t] = (0, _utils.createNamespace)('coupon-cell');
+var couponCellProps = {
+  title: String,
+  border: _utils.truthProp,
+  editable: _utils.truthProp,
+  coupons: (0, _utils.makeArrayProp)(),
+  currency: (0, _utils.makeStringProp)('¥'),
+  chosenCoupon: (0, _utils.makeNumericProp)(-1)
+};
 
-function formatValue(coupons, chosenCoupon, currency) {
+function formatValue(_ref) {
+  var {
+    coupons,
+    chosenCoupon,
+    currency
+  } = _ref;
   var coupon = coupons[+chosenCoupon];
 
   if (coupon) {
@@ -35,31 +48,14 @@ function formatValue(coupons, chosenCoupon, currency) {
 
 var _default = (0, _vue.defineComponent)({
   name,
-  props: {
-    title: String,
-    border: _utils.truthProp,
-    editable: _utils.truthProp,
-    coupons: {
-      type: Array,
-      default: () => []
-    },
-    currency: {
-      type: String,
-      default: '¥'
-    },
-    chosenCoupon: {
-      type: [Number, String],
-      default: -1
-    }
-  },
+  props: couponCellProps,
 
   setup(props) {
     return () => {
       var selected = props.coupons[+props.chosenCoupon];
-      var value = formatValue(props.coupons, props.chosenCoupon, props.currency);
       return (0, _vue.createVNode)(_cell.Cell, {
         "class": bem(),
-        "value": value,
+        "value": formatValue(props),
         "title": props.title || t('title'),
         "border": props.border,
         "isLink": props.editable,

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

@@ -13,7 +13,7 @@ export declare const CouponCell: import("../utils").WithInstall<import("vue").De
         default: () => never[];
     };
     currency: {
-        type: StringConstructor;
+        type: import("vue").PropType<string>;
         default: string;
     };
     chosenCoupon: {
@@ -43,3 +43,4 @@ export declare const CouponCell: import("../utils").WithInstall<import("vue").De
     chosenCoupon: string | number;
 }>>;
 export default CouponCell;
+export type { CouponCellProps } from './CouponCell';

package/lib/coupon-list/CouponList.d.ts

@@ -1,12 +1,36 @@
-import { PropType } from 'vue';
+import { ExtractPropTypes } from 'vue';
 import { CouponInfo } from '../coupon';
-declare const _default: import("vue").DefineComponent<{
+declare const couponListProps: {
+    code: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    coupons: {
+        type: import("vue").PropType<CouponInfo[]>;
+        default: () => never[];
+    };
+    currency: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
     showCount: {
         type: BooleanConstructor;
         default: true;
     };
+    emptyImage: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    chosenCoupon: {
+        type: NumberConstructor;
+        default: number;
+    };
     enabledTitle: StringConstructor;
     disabledTitle: StringConstructor;
+    disabledCoupons: {
+        type: import("vue").PropType<CouponInfo[]>;
+        default: () => never[];
+    };
     showExchangeBar: {
         type: BooleanConstructor;
         default: true;
@@ -17,74 +41,104 @@ declare const _default: import("vue").DefineComponent<{
     };
     closeButtonText: StringConstructor;
     inputPlaceholder: StringConstructor;
+    exchangeMinLength: {
+        type: NumberConstructor;
+        default: number;
+    };
     exchangeButtonText: StringConstructor;
+    displayedCouponIndex: {
+        type: NumberConstructor;
+        default: number;
+    };
     exchangeButtonLoading: BooleanConstructor;
     exchangeButtonDisabled: BooleanConstructor;
+};
+export declare type CouponListProps = ExtractPropTypes<typeof couponListProps>;
+declare const _default: import("vue").DefineComponent<{
     code: {
-        type: StringConstructor;
+        type: import("vue").PropType<string>;
         default: string;
     };
-    exchangeMinLength: {
-        type: NumberConstructor;
-        default: number;
+    coupons: {
+        type: import("vue").PropType<CouponInfo[]>;
+        default: () => never[];
+    };
+    currency: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    showCount: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    emptyImage: {
+        type: import("vue").PropType<string>;
+        default: string;
     };
     chosenCoupon: {
         type: NumberConstructor;
         default: number;
     };
-    coupons: {
-        type: PropType<CouponInfo[]>;
-        default: () => never[];
-    };
+    enabledTitle: StringConstructor;
+    disabledTitle: StringConstructor;
     disabledCoupons: {
-        type: PropType<CouponInfo[]>;
+        type: import("vue").PropType<CouponInfo[]>;
         default: () => never[];
     };
-    displayedCouponIndex: {
+    showExchangeBar: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    showCloseButton: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    closeButtonText: StringConstructor;
+    inputPlaceholder: StringConstructor;
+    exchangeMinLength: {
         type: NumberConstructor;
         default: number;
     };
-    currency: {
-        type: StringConstructor;
-        default: string;
-    };
-    emptyImage: {
-        type: StringConstructor;
-        default: string;
+    exchangeButtonText: StringConstructor;
+    displayedCouponIndex: {
+        type: NumberConstructor;
+        default: number;
     };
+    exchangeButtonLoading: BooleanConstructor;
+    exchangeButtonDisabled: BooleanConstructor;
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "exchange" | "update:code")[], "change" | "exchange" | "update:code", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<{
+    code?: unknown;
+    coupons?: unknown;
+    currency?: unknown;
     showCount?: unknown;
+    emptyImage?: unknown;
+    chosenCoupon?: unknown;
     enabledTitle?: unknown;
     disabledTitle?: unknown;
+    disabledCoupons?: unknown;
     showExchangeBar?: unknown;
     showCloseButton?: unknown;
     closeButtonText?: unknown;
     inputPlaceholder?: unknown;
+    exchangeMinLength?: unknown;
     exchangeButtonText?: unknown;
+    displayedCouponIndex?: unknown;
     exchangeButtonLoading?: unknown;
     exchangeButtonDisabled?: unknown;
-    code?: unknown;
-    exchangeMinLength?: unknown;
-    chosenCoupon?: unknown;
-    coupons?: unknown;
-    disabledCoupons?: unknown;
-    displayedCouponIndex?: unknown;
-    currency?: unknown;
-    emptyImage?: unknown;
 } & {
     code: string;
     currency: string;
     coupons: CouponInfo[];
     chosenCoupon: number;
     showCount: boolean;
+    emptyImage: string;
+    disabledCoupons: CouponInfo[];
     showExchangeBar: boolean;
     showCloseButton: boolean;
-    exchangeButtonLoading: boolean;
-    exchangeButtonDisabled: boolean;
     exchangeMinLength: number;
-    disabledCoupons: CouponInfo[];
     displayedCouponIndex: number;
-    emptyImage: string;
+    exchangeButtonLoading: boolean;
+    exchangeButtonDisabled: boolean;
 } & {
     enabledTitle?: string | undefined;
     disabledTitle?: string | undefined;
@@ -101,13 +155,13 @@ declare const _default: import("vue").DefineComponent<{
     coupons: CouponInfo[];
     chosenCoupon: number;
     showCount: boolean;
+    emptyImage: string;
+    disabledCoupons: CouponInfo[];
     showExchangeBar: boolean;
     showCloseButton: boolean;
-    exchangeButtonLoading: boolean;
-    exchangeButtonDisabled: boolean;
     exchangeMinLength: number;
-    disabledCoupons: CouponInfo[];
     displayedCouponIndex: number;
-    emptyImage: string;
+    exchangeButtonLoading: boolean;
+    exchangeButtonDisabled: boolean;
 }>;
 export default _default;

package/lib/coupon-list/CouponList.js

@@ -7,8 +7,6 @@ var _vue = require("vue");
 
 var _utils = require("../utils");
 
-var _use = require("@vant/use");
-
 var _useRefs = require("../composables/use-refs");
 
 var _tab = require("../tab");
@@ -26,71 +24,43 @@ var _coupon = require("../coupon");
 // Components
 var [name, bem, t] = (0, _utils.createNamespace)('coupon-list');
 var EMPTY_IMAGE = 'https://img.yzcdn.cn/vant/coupon-empty.png';
+var couponListProps = {
+  code: (0, _utils.makeStringProp)(''),
+  coupons: (0, _utils.makeArrayProp)(),
+  currency: (0, _utils.makeStringProp)('¥'),
+  showCount: _utils.truthProp,
+  emptyImage: (0, _utils.makeStringProp)(EMPTY_IMAGE),
+  chosenCoupon: (0, _utils.makeNumberProp)(-1),
+  enabledTitle: String,
+  disabledTitle: String,
+  disabledCoupons: (0, _utils.makeArrayProp)(),
+  showExchangeBar: _utils.truthProp,
+  showCloseButton: _utils.truthProp,
+  closeButtonText: String,
+  inputPlaceholder: String,
+  exchangeMinLength: (0, _utils.makeNumberProp)(1),
+  exchangeButtonText: String,
+  displayedCouponIndex: (0, _utils.makeNumberProp)(-1),
+  exchangeButtonLoading: Boolean,
+  exchangeButtonDisabled: Boolean
+};
 
 var _default = (0, _vue.defineComponent)({
   name,
-  props: {
-    showCount: _utils.truthProp,
-    enabledTitle: String,
-    disabledTitle: String,
-    showExchangeBar: _utils.truthProp,
-    showCloseButton: _utils.truthProp,
-    closeButtonText: String,
-    inputPlaceholder: String,
-    exchangeButtonText: String,
-    exchangeButtonLoading: Boolean,
-    exchangeButtonDisabled: Boolean,
-    code: {
-      type: String,
-      default: ''
-    },
-    exchangeMinLength: {
-      type: Number,
-      default: 1
-    },
-    chosenCoupon: {
-      type: Number,
-      default: -1
-    },
-    coupons: {
-      type: Array,
-      default: () => []
-    },
-    disabledCoupons: {
-      type: Array,
-      default: () => []
-    },
-    displayedCouponIndex: {
-      type: Number,
-      default: -1
-    },
-    currency: {
-      type: String,
-      default: '¥'
-    },
-    emptyImage: {
-      type: String,
-      default: EMPTY_IMAGE
-    }
-  },
+  props: couponListProps,
   emits: ['change', 'exchange', 'update:code'],
 
-  setup(props, {
-    emit,
-    slots
-  }) {
+  setup(props, _ref) {
+    var {
+      emit,
+      slots
+    } = _ref;
     var [couponRefs, setCouponRefs] = (0, _useRefs.useRefs)();
     var state = (0, _vue.reactive)({
       tab: 0,
       code: props.code
     });
-    var {
-      height: windowHeight
-    } = (0, _use.useWindowSize)();
     var buttonDisabled = (0, _vue.computed)(() => !props.exchangeButtonLoading && (props.exchangeButtonDisabled || !state.code || state.code.length < props.exchangeMinLength));
-    var listStyle = (0, _vue.computed)(() => ({
-      height: windowHeight.value - (props.showExchangeBar ? 140 : 94) + 'px'
-    }));
 
     var onExchange = () => {
       emit('exchange', state.code); // auto clear currentCode when not use v-model
@@ -151,9 +121,9 @@ var _default = (0, _vue.defineComponent)({
       }, {
         default: () => [(0, _vue.createVNode)("div", {
           "class": bem('list', {
+            'with-bar': props.showExchangeBar,
             'with-bottom': props.showCloseButton
-          }),
-          "style": listStyle.value
+          })
         }, [coupons.map((coupon, index) => (0, _vue.createVNode)(_coupon.Coupon, {
           "key": coupon.id,
           "ref": setCouponRefs(index),
@@ -178,9 +148,9 @@ var _default = (0, _vue.defineComponent)({
       }, {
         default: () => [(0, _vue.createVNode)("div", {
           "class": bem('list', {
+            'with-bar': props.showExchangeBar,
             'with-bottom': props.showCloseButton
-          }),
-          "style": listStyle.value
+          })
         }, [disabledCoupons.map(coupon => (0, _vue.createVNode)(_coupon.Coupon, {
           "disabled": true,
           "key": coupon.id,
@@ -201,7 +171,7 @@ var _default = (0, _vue.defineComponent)({
     return () => (0, _vue.createVNode)("div", {
       "class": bem()
     }, [renderExchangeBar(), (0, _vue.createVNode)(_tabs.Tabs, {
-      'active': state.tab,
+      "active": state.tab,
       "onUpdate:active": $event => state.tab = $event,
       "class": bem('tab'),
       "border": false

package/lib/coupon-list/index.css

@@ -1 +1 @@
-:root{--van-coupon-list-background-color:var(--van-background-color);--van-coupon-list-field-padding:5px 0 5px var(--van-padding-md);--van-coupon-list-exchange-button-height:32px;--van-coupon-list-close-button-height:40px;--van-coupon-list-empty-image-size:200px;--van-coupon-list-empty-tip-color:var(--van-gray-6);--van-coupon-list-empty-tip-font-size:var(--van-font-size-md);--van-coupon-list-empty-tip-line-height:var(--van-line-height-md)}.van-coupon-list{position:relative;height:100%;background-color:var(--van-coupon-list-background-color)}.van-coupon-list__field{padding:var(--van-coupon-list-field-padding)}.van-coupon-list__field .van-field__body{height:34px;padding-left:var(--van-padding-sm);line-height:34px;background:var(--van-gray-1);border-radius:17px}.van-coupon-list__field .van-field__body::-webkit-input-placeholder{color:var(--van-gray-5)}.van-coupon-list__field .van-field__body::placeholder{color:var(--van-gray-5)}.van-coupon-list__field .van-field__clear{margin-right:0}.van-coupon-list__exchange-bar{display:flex;align-items:center;background-color:var(--van-white)}.van-coupon-list__exchange{flex:none;height:var(--van-coupon-list-exchange-button-height);font-size:var(--van-font-size-lg);line-height:calc(var(--van-coupon-list-exchange-button-height) - 2px);border:0}.van-coupon-list .van-tabs__wrap{box-shadow:0 6px 12px -12px var(--van-gray-6)}.van-coupon-list__list{box-sizing:border-box;padding:var(--van-padding-md) 0 var(--van-padding-lg);overflow-y:auto;-webkit-overflow-scrolling:touch}.van-coupon-list__list--with-bottom{padding-bottom:calc(var(--van-padding-md) + 50px)}.van-coupon-list__bottom{position:absolute;bottom:0;left:0;z-index:999;box-sizing:border-box;width:100%;padding:5px var(--van-padding-md);font-weight:var(--van-font-weight-bold);background-color:var(--van-white)}.van-coupon-list__close{height:var(--van-coupon-list-close-button-height)}.van-coupon-list__empty{padding-top:60px;text-align:center}.van-coupon-list__empty p{margin:var(--van-padding-md) 0;color:var(--van-coupon-list-empty-tip-color);font-size:var(--van-coupon-list-empty-tip-font-size);line-height:var(--van-coupon-list-empty-tip-line-height)}.van-coupon-list__empty img{width:var(--van-coupon-list-empty-image-size);height:var(--van-coupon-list-empty-image-size)}
+:root{--van-coupon-list-background-color:var(--van-background-color);--van-coupon-list-field-padding:5px 0 5px var(--van-padding-md);--van-coupon-list-exchange-button-height:32px;--van-coupon-list-close-button-height:40px;--van-coupon-list-empty-image-size:200px;--van-coupon-list-empty-tip-color:var(--van-text-color-2);--van-coupon-list-empty-tip-font-size:var(--van-font-size-md);--van-coupon-list-empty-tip-line-height:var(--van-line-height-md)}.van-coupon-list{position:relative;height:100%;background:var(--van-coupon-list-background-color)}.van-coupon-list__field{padding:var(--van-coupon-list-field-padding)}.van-coupon-list__field .van-field__body{height:34px;padding-left:var(--van-padding-sm);line-height:34px;background:var(--van-gray-1);border-radius:17px}.van-coupon-list__field .van-field__body::-webkit-input-placeholder{color:var(--van-text-color-3)}.van-coupon-list__field .van-field__body::placeholder{color:var(--van-text-color-3)}.van-coupon-list__field .van-field__clear{margin-right:0}.van-coupon-list__exchange-bar{display:flex;align-items:center;background-color:var(--van-background-color-light)}.van-coupon-list__exchange{flex:none;height:var(--van-coupon-list-exchange-button-height);font-size:var(--van-font-size-lg);line-height:calc(var(--van-coupon-list-exchange-button-height) - 2px);border:0}.van-coupon-list .van-tabs__wrap{box-shadow:0 6px 12px -12px var(--van-gray-6)}.van-coupon-list__list{box-sizing:border-box;height:calc(100vh - 108px);padding:var(--van-padding-md) 0 var(--van-padding-lg);overflow-y:auto;-webkit-overflow-scrolling:touch}.van-coupon-list__list--with-bar{height:calc(100vh - 152px)}.van-coupon-list__list--with-bottom{padding-bottom:50px}.van-coupon-list__bottom{position:absolute;bottom:0;left:0;z-index:999;box-sizing:border-box;width:100%;padding:5px var(--van-padding-md);font-weight:var(--van-font-weight-bold);background-color:var(--van-background-color-light)}.van-coupon-list__close{height:var(--van-coupon-list-close-button-height)}.van-coupon-list__empty{padding-top:60px;text-align:center}.van-coupon-list__empty p{margin:var(--van-padding-md) 0;color:var(--van-coupon-list-empty-tip-color);font-size:var(--van-coupon-list-empty-tip-font-size);line-height:var(--van-coupon-list-empty-tip-line-height)}.van-coupon-list__empty img{width:var(--van-coupon-list-empty-image-size);height:var(--van-coupon-list-empty-image-size)}

package/lib/coupon-list/index.d.ts

@@ -1,10 +1,34 @@
 export declare const CouponList: import("../utils").WithInstall<import("vue").DefineComponent<{
+    code: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    coupons: {
+        type: import("vue").PropType<import("..").CouponInfo[]>;
+        default: () => never[];
+    };
+    currency: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
     showCount: {
         type: BooleanConstructor;
         default: true;
     };
+    emptyImage: {
+        type: import("vue").PropType<string>;
+        default: string;
+    };
+    chosenCoupon: {
+        type: NumberConstructor;
+        default: number;
+    };
     enabledTitle: StringConstructor;
     disabledTitle: StringConstructor;
+    disabledCoupons: {
+        type: import("vue").PropType<import("..").CouponInfo[]>;
+        default: () => never[];
+    };
     showExchangeBar: {
         type: BooleanConstructor;
         default: true;
@@ -15,74 +39,50 @@ export declare const CouponList: import("../utils").WithInstall<import("vue").De
     };
     closeButtonText: StringConstructor;
     inputPlaceholder: StringConstructor;
-    exchangeButtonText: StringConstructor;
-    exchangeButtonLoading: BooleanConstructor;
-    exchangeButtonDisabled: BooleanConstructor;
-    code: {
-        type: StringConstructor;
-        default: string;
-    };
     exchangeMinLength: {
         type: NumberConstructor;
         default: number;
     };
-    chosenCoupon: {
-        type: NumberConstructor;
-        default: number;
-    };
-    coupons: {
-        type: import("vue").PropType<import("..").CouponInfo[]>;
-        default: () => never[];
-    };
-    disabledCoupons: {
-        type: import("vue").PropType<import("..").CouponInfo[]>;
-        default: () => never[];
-    };
+    exchangeButtonText: StringConstructor;
     displayedCouponIndex: {
         type: NumberConstructor;
         default: number;
     };
-    currency: {
-        type: StringConstructor;
-        default: string;
-    };
-    emptyImage: {
-        type: StringConstructor;
-        default: string;
-    };
+    exchangeButtonLoading: BooleanConstructor;
+    exchangeButtonDisabled: BooleanConstructor;
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "exchange" | "update:code")[], "change" | "exchange" | "update:code", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<{
+    code?: unknown;
+    coupons?: unknown;
+    currency?: unknown;
     showCount?: unknown;
+    emptyImage?: unknown;
+    chosenCoupon?: unknown;
     enabledTitle?: unknown;
     disabledTitle?: unknown;
+    disabledCoupons?: unknown;
     showExchangeBar?: unknown;
     showCloseButton?: unknown;
     closeButtonText?: unknown;
     inputPlaceholder?: unknown;
+    exchangeMinLength?: unknown;
     exchangeButtonText?: unknown;
+    displayedCouponIndex?: unknown;
     exchangeButtonLoading?: unknown;
     exchangeButtonDisabled?: unknown;
-    code?: unknown;
-    exchangeMinLength?: unknown;
-    chosenCoupon?: unknown;
-    coupons?: unknown;
-    disabledCoupons?: unknown;
-    displayedCouponIndex?: unknown;
-    currency?: unknown;
-    emptyImage?: unknown;
 } & {
     code: string;
     currency: string;
     coupons: import("..").CouponInfo[];
     chosenCoupon: number;
     showCount: boolean;
+    emptyImage: string;
+    disabledCoupons: import("..").CouponInfo[];
     showExchangeBar: boolean;
     showCloseButton: boolean;
-    exchangeButtonLoading: boolean;
-    exchangeButtonDisabled: boolean;
     exchangeMinLength: number;
-    disabledCoupons: import("..").CouponInfo[];
     displayedCouponIndex: number;
-    emptyImage: string;
+    exchangeButtonLoading: boolean;
+    exchangeButtonDisabled: boolean;
 } & {
     enabledTitle?: string | undefined;
     disabledTitle?: string | undefined;
@@ -99,13 +99,14 @@ export declare const CouponList: import("../utils").WithInstall<import("vue").De
     coupons: import("..").CouponInfo[];
     chosenCoupon: number;
     showCount: boolean;
+    emptyImage: string;
+    disabledCoupons: import("..").CouponInfo[];
     showExchangeBar: boolean;
     showCloseButton: boolean;
-    exchangeButtonLoading: boolean;
-    exchangeButtonDisabled: boolean;
     exchangeMinLength: number;
-    disabledCoupons: import("..").CouponInfo[];
     displayedCouponIndex: number;
-    emptyImage: string;
+    exchangeButtonLoading: boolean;
+    exchangeButtonDisabled: boolean;
 }>>;
 export default CouponList;
+export type { CouponListProps } from './CouponList';

package/lib/coupon-list/index.less

@@ -14,7 +14,7 @@
 .van-coupon-list {
   position: relative;
   height: 100%;
-  background-color: var(--van-coupon-list-background-color);
+  background: var(--van-coupon-list-background-color);
 
   &__field {
     padding: var(--van-coupon-list-field-padding);
@@ -27,7 +27,7 @@
       border-radius: 17px;
 
       &::placeholder {
-        color: var(--van-gray-5);
+        color: var(--van-text-color-3);
       }
     }
 
@@ -39,7 +39,7 @@
   &__exchange-bar {
     display: flex;
     align-items: center;
-    background-color: var(--van-white);
+    background-color: var(--van-background-color-light);
   }
 
   &__exchange {
@@ -56,12 +56,17 @@
 
   &__list {
     box-sizing: border-box;
+    height: calc(100vh - 108px);
     padding: var(--van-padding-md) 0 var(--van-padding-lg);
     overflow-y: auto;
     -webkit-overflow-scrolling: touch;
 
+    &--with-bar {
+      height: calc(100vh - 152px);
+    }
+
     &--with-bottom {
-      padding-bottom: calc(var(--van-padding-md) + 50px);
+      padding-bottom: 50px;
     }
   }
 
@@ -74,7 +79,7 @@
     width: 100%;
     padding: 5px var(--van-padding-md);
     font-weight: var(--van-font-weight-bold);
-    background-color: var(--van-white);
+    background-color: var(--van-background-color-light);
   }
 
   &__close {

package/lib/coupon-list/var.less

@@ -5,6 +5,6 @@
 @coupon-list-exchange-button-height: 32px;
 @coupon-list-close-button-height: 40px;
 @coupon-list-empty-image-size: 200px;
-@coupon-list-empty-tip-color: var(--van-gray-6);
+@coupon-list-empty-tip-color: var(--van-text-color-2);
 @coupon-list-empty-tip-font-size: var(--van-font-size-md);
 @coupon-list-empty-tip-line-height: var(--van-line-height-md);