vant 4.0.0-alpha.0 → 4.0.0-alpha.1

package/es/picker/index.less

@@ -60,6 +60,7 @@ body {
   }
 
   &__title {
+    color: var(--van-text-color);
     max-width: 50%;
     font-weight: var(--van-font-bold);
     font-size: var(--van-picker-title-font-size);

package/es/popup/Popup.d.ts

@@ -43,6 +43,7 @@ declare const popupProps: {
         type: import("vue").PropType<PopupCloseIconPosition>;
         default: PopupCloseIconPosition;
     };
+    safeAreaInsetTop: BooleanConstructor;
     safeAreaInsetBottom: BooleanConstructor;
 };
 export declare type PopupProps = ExtractPropTypes<typeof popupProps>;
@@ -89,6 +90,7 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<PopupCloseIconPosition>;
         default: PopupCloseIconPosition;
     };
+    safeAreaInsetTop: BooleanConstructor;
     safeAreaInsetBottom: BooleanConstructor;
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("open" | "close" | "keydown" | "opened" | "closed" | "update:show" | "clickOverlay" | "clickCloseIcon")[], "open" | "close" | "keydown" | "opened" | "closed" | "update:show" | "clickOverlay" | "clickCloseIcon", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
     show: BooleanConstructor;
@@ -133,6 +135,7 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<PopupCloseIconPosition>;
         default: PopupCloseIconPosition;
     };
+    safeAreaInsetTop: BooleanConstructor;
     safeAreaInsetBottom: BooleanConstructor;
 }>> & {
     onKeydown?: ((...args: any[]) => any) | undefined;
@@ -157,5 +160,6 @@ declare const _default: import("vue").DefineComponent<{
     closeable: boolean;
     closeOnPopstate: boolean;
     closeIconPosition: PopupCloseIconPosition;
+    safeAreaInsetTop: boolean;
 }>;
 export default _default;

package/es/popup/Popup.js

@@ -18,6 +18,7 @@ const popupProps = extend({}, popupSharedProps, {
   iconPrefix: String,
   closeOnPopstate: Boolean,
   closeIconPosition: makeStringProp("top-right"),
+  safeAreaInsetTop: Boolean,
   safeAreaInsetBottom: Boolean
 });
 const [name, bem] = createNamespace("popup");
@@ -112,6 +113,7 @@ var stdin_default = defineComponent({
       const {
         round,
         position,
+        safeAreaInsetTop,
         safeAreaInsetBottom
       } = props;
       return _withDirectives(_createVNode("div", _mergeProps({
@@ -121,6 +123,7 @@ var stdin_default = defineComponent({
           round,
           [position]: position
         }), {
+          "van-safe-area-top": safeAreaInsetTop,
           "van-safe-area-bottom": safeAreaInsetBottom
         }],
         "onKeydown": onKeydown

package/es/popup/index.d.ts

@@ -41,6 +41,7 @@ export declare const Popup: import("../utils").WithInstall<import("vue").DefineC
         type: import("vue").PropType<import("./types").PopupCloseIconPosition>;
         default: import("./types").PopupCloseIconPosition;
     };
+    safeAreaInsetTop: BooleanConstructor;
     safeAreaInsetBottom: BooleanConstructor;
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("open" | "close" | "keydown" | "opened" | "closed" | "update:show" | "clickOverlay" | "clickCloseIcon")[], "open" | "close" | "keydown" | "opened" | "closed" | "update:show" | "clickOverlay" | "clickCloseIcon", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     show: BooleanConstructor;
@@ -85,6 +86,7 @@ export declare const Popup: import("../utils").WithInstall<import("vue").DefineC
         type: import("vue").PropType<import("./types").PopupCloseIconPosition>;
         default: import("./types").PopupCloseIconPosition;
     };
+    safeAreaInsetTop: BooleanConstructor;
     safeAreaInsetBottom: BooleanConstructor;
 }>> & {
     onKeydown?: ((...args: any[]) => any) | undefined;
@@ -109,6 +111,7 @@ export declare const Popup: import("../utils").WithInstall<import("vue").DefineC
     closeable: boolean;
     closeOnPopstate: boolean;
     closeIconPosition: import("./types").PopupCloseIconPosition;
+    safeAreaInsetTop: boolean;
 }>>;
 export default Popup;
 export type { PopupProps } from './Popup';

package/es/skeleton/Skeleton.js

@@ -1,4 +1,4 @@
-import { createVNode as _createVNode } from "vue";
+import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
 import { defineComponent } from "vue";
 import { addUnit, truthProp, numericProp, getSizeStyle, makeStringProp, makeNumericProp, createNamespace } from "../utils";
 const [name, bem] = createNamespace("skeleton");
@@ -21,9 +21,11 @@ const skeletonProps = {
 };
 var stdin_default = defineComponent({
   name,
+  inheritAttrs: false,
   props: skeletonProps,
   setup(props, {
-    slots
+    slots,
+    attrs
   }) {
     const renderAvatar = () => {
       if (props.avatar) {
@@ -66,12 +68,12 @@ var stdin_default = defineComponent({
       if (!props.loading) {
         return (_a = slots.default) == null ? void 0 : _a.call(slots);
       }
-      return _createVNode("div", {
+      return _createVNode("div", _mergeProps({
         "class": bem({
           animate: props.animate,
           round: props.round
         })
-      }, [renderAvatar(), _createVNode("div", {
+      }, attrs), [renderAvatar(), _createVNode("div", {
         "class": bem("content")
       }, [renderTitle(), renderRows()])]);
     };

package/es/style/base.css

@@ -1 +1 @@
-body{--van-black: #000;--van-white: #fff;--van-gray-1: #f7f8fa;--van-gray-2: #f2f3f5;--van-gray-3: #ebedf0;--van-gray-4: #dcdee0;--van-gray-5: #c8c9cc;--van-gray-6: #969799;--van-gray-7: #646566;--van-gray-8: #323233;--van-red: #ee0a24;--van-blue: #1989fa;--van-orange: #ff976a;--van-orange-dark: #ed6a0c;--van-orange-light: #fffbe8;--van-green: #07c160;--van-gradient-red: linear-gradient(to right, #ff6034, #ee0a24);--van-gradient-orange: linear-gradient(to right, #ffd01e, #ff8917);--van-primary-color: var(--van-blue);--van-success-color: var(--van-green);--van-danger-color: var(--van-red);--van-warning-color: var(--van-orange);--van-text-color: var(--van-gray-8);--van-text-color-2: var(--van-gray-6);--van-text-color-3: var(--van-gray-5);--van-link-color: #576b95;--van-active-color: var(--van-gray-2);--van-active-opacity: .6;--van-disabled-opacity: .5;--van-background: var(--van-gray-1);--van-background-2: var(--van-white);--van-background-3: var(--van-white);--van-padding-base: 4px;--van-padding-xs: 8px;--van-padding-sm: 12px;--van-padding-md: 16px;--van-padding-lg: 24px;--van-padding-xl: 32px;--van-font-bold: 600;--van-font-size-xs: 10px;--van-font-size-sm: 12px;--van-font-size-md: 14px;--van-font-size-lg: 16px;--van-line-height-xs: 14px;--van-line-height-sm: 18px;--van-line-height-md: 20px;--van-line-height-lg: 22px;--van-base-font: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Segoe UI, Arial, Roboto, "PingFang SC", "miui", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;--van-price-font: avenir-heavy, "PingFang SC", helvetica neue, arial, sans-serif;--van-duration-base: .3s;--van-duration-fast: .2s;--van-ease-out: ease-out;--van-ease-in: ease-in;--van-border-color: var(--van-gray-3);--van-border-width: 1px;--van-radius-sm: 2px;--van-radius-md: 4px;--van-radius-lg: 8px;--van-radius-max: 999px}.van-theme-dark{--van-text-color: #f5f5f5;--van-text-color-2: #707070;--van-text-color-3: #4d4d4d;--van-border-color: #3a3a3c;--van-active-color: #3a3a3c;--van-background: #000;--van-background-2: #1c1c1e;--van-background-3: #37363b}html{-webkit-tap-highlight-color:transparent}body{margin:0;font-family:var(--van-base-font)}a{text-decoration:none}input,button,textarea{color:inherit;font:inherit}a:focus,input:focus,button:focus,textarea:focus,[class*=van-]:focus{outline:none}ol,ul{margin:0;padding:0;list-style:none}@keyframes van-slide-up-enter{0%{transform:translateY(100%)}}@keyframes van-slide-up-leave{to{transform:translateY(100%)}}@keyframes van-slide-down-enter{0%{transform:translateY(-100%)}}@keyframes van-slide-down-leave{to{transform:translateY(-100%)}}@keyframes van-slide-left-enter{0%{transform:translate(-100%)}}@keyframes van-slide-left-leave{to{transform:translate(-100%)}}@keyframes van-slide-right-enter{0%{transform:translate(100%)}}@keyframes van-slide-right-leave{to{transform:translate(100%)}}@keyframes van-fade-in{0%{opacity:0}to{opacity:1}}@keyframes van-fade-out{0%{opacity:1}to{opacity:0}}@keyframes van-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.van-fade-enter-active{animation:var(--van-duration-base) van-fade-in both var(--van-ease-out)}.van-fade-leave-active{animation:var(--van-duration-base) van-fade-out both var(--van-ease-in)}.van-slide-up-enter-active{animation:van-slide-up-enter var(--van-duration-base) both var(--van-ease-out)}.van-slide-up-leave-active{animation:van-slide-up-leave var(--van-duration-base) both var(--van-ease-in)}.van-slide-down-enter-active{animation:van-slide-down-enter var(--van-duration-base) both var(--van-ease-out)}.van-slide-down-leave-active{animation:van-slide-down-leave var(--van-duration-base) both var(--van-ease-in)}.van-slide-left-enter-active{animation:van-slide-left-enter var(--van-duration-base) both var(--van-ease-out)}.van-slide-left-leave-active{animation:van-slide-left-leave var(--van-duration-base) both var(--van-ease-in)}.van-slide-right-enter-active{animation:van-slide-right-enter var(--van-duration-base) both var(--van-ease-out)}.van-slide-right-leave-active{animation:van-slide-right-leave var(--van-duration-base) both var(--van-ease-in)}.van-clearfix:after{display:table;clear:both;content:""}.van-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.van-multi-ellipsis--l2{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical}.van-multi-ellipsis--l3{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;-webkit-box-orient:vertical}.van-safe-area-bottom{padding-bottom:constant(safe-area-inset-bottom);padding-bottom:env(safe-area-inset-bottom)}.van-haptics-feedback{cursor:pointer}.van-haptics-feedback:active{opacity:var(--van-active-opacity)}[class*=van-hairline]:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--van-border-color);transform:scale(.5)}.van-hairline,.van-hairline--top,.van-hairline--left,.van-hairline--right,.van-hairline--bottom,.van-hairline--surround,.van-hairline--top-bottom{position:relative}.van-hairline--top:after{border-top-width:var(--van-border-width)}.van-hairline--left:after{border-left-width:var(--van-border-width)}.van-hairline--right:after{border-right-width:var(--van-border-width)}.van-hairline--bottom:after{border-bottom-width:var(--van-border-width)}.van-hairline--top-bottom:after,.van-hairline-unset--top-bottom:after{border-width:var(--van-border-width) 0}.van-hairline--surround:after{border-width:var(--van-border-width)}
+body{--van-black: #000;--van-white: #fff;--van-gray-1: #f7f8fa;--van-gray-2: #f2f3f5;--van-gray-3: #ebedf0;--van-gray-4: #dcdee0;--van-gray-5: #c8c9cc;--van-gray-6: #969799;--van-gray-7: #646566;--van-gray-8: #323233;--van-red: #ee0a24;--van-blue: #1989fa;--van-orange: #ff976a;--van-orange-dark: #ed6a0c;--van-orange-light: #fffbe8;--van-green: #07c160;--van-gradient-red: linear-gradient(to right, #ff6034, #ee0a24);--van-gradient-orange: linear-gradient(to right, #ffd01e, #ff8917);--van-primary-color: var(--van-blue);--van-success-color: var(--van-green);--van-danger-color: var(--van-red);--van-warning-color: var(--van-orange);--van-text-color: var(--van-gray-8);--van-text-color-2: var(--van-gray-6);--van-text-color-3: var(--van-gray-5);--van-link-color: #576b95;--van-active-color: var(--van-gray-2);--van-active-opacity: .6;--van-disabled-opacity: .5;--van-background: var(--van-gray-1);--van-background-2: var(--van-white);--van-background-3: var(--van-white);--van-padding-base: 4px;--van-padding-xs: 8px;--van-padding-sm: 12px;--van-padding-md: 16px;--van-padding-lg: 24px;--van-padding-xl: 32px;--van-font-bold: 600;--van-font-size-xs: 10px;--van-font-size-sm: 12px;--van-font-size-md: 14px;--van-font-size-lg: 16px;--van-line-height-xs: 14px;--van-line-height-sm: 18px;--van-line-height-md: 20px;--van-line-height-lg: 22px;--van-base-font: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Segoe UI, Arial, Roboto, "PingFang SC", "miui", "Hiragino Sans GB", "Microsoft Yahei", sans-serif;--van-price-font: avenir-heavy, "PingFang SC", helvetica neue, arial, sans-serif;--van-duration-base: .3s;--van-duration-fast: .2s;--van-ease-out: ease-out;--van-ease-in: ease-in;--van-border-color: var(--van-gray-3);--van-border-width: 1px;--van-radius-sm: 2px;--van-radius-md: 4px;--van-radius-lg: 8px;--van-radius-max: 999px}.van-theme-dark{--van-text-color: #f5f5f5;--van-text-color-2: #707070;--van-text-color-3: #4d4d4d;--van-border-color: #3a3a3c;--van-active-color: #3a3a3c;--van-background: #000;--van-background-2: #1c1c1e;--van-background-3: #37363b}html{-webkit-tap-highlight-color:transparent}body{margin:0;font-family:var(--van-base-font)}a{text-decoration:none}input,button,textarea{color:inherit;font:inherit}a:focus,input:focus,button:focus,textarea:focus,[class*=van-]:focus{outline:none}ol,ul{margin:0;padding:0;list-style:none}@keyframes van-slide-up-enter{0%{transform:translateY(100%)}}@keyframes van-slide-up-leave{to{transform:translateY(100%)}}@keyframes van-slide-down-enter{0%{transform:translateY(-100%)}}@keyframes van-slide-down-leave{to{transform:translateY(-100%)}}@keyframes van-slide-left-enter{0%{transform:translate(-100%)}}@keyframes van-slide-left-leave{to{transform:translate(-100%)}}@keyframes van-slide-right-enter{0%{transform:translate(100%)}}@keyframes van-slide-right-leave{to{transform:translate(100%)}}@keyframes van-fade-in{0%{opacity:0}to{opacity:1}}@keyframes van-fade-out{0%{opacity:1}to{opacity:0}}@keyframes van-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.van-fade-enter-active{animation:var(--van-duration-base) van-fade-in both var(--van-ease-out)}.van-fade-leave-active{animation:var(--van-duration-base) van-fade-out both var(--van-ease-in)}.van-slide-up-enter-active{animation:van-slide-up-enter var(--van-duration-base) both var(--van-ease-out)}.van-slide-up-leave-active{animation:van-slide-up-leave var(--van-duration-base) both var(--van-ease-in)}.van-slide-down-enter-active{animation:van-slide-down-enter var(--van-duration-base) both var(--van-ease-out)}.van-slide-down-leave-active{animation:van-slide-down-leave var(--van-duration-base) both var(--van-ease-in)}.van-slide-left-enter-active{animation:van-slide-left-enter var(--van-duration-base) both var(--van-ease-out)}.van-slide-left-leave-active{animation:van-slide-left-leave var(--van-duration-base) both var(--van-ease-in)}.van-slide-right-enter-active{animation:van-slide-right-enter var(--van-duration-base) both var(--van-ease-out)}.van-slide-right-leave-active{animation:van-slide-right-leave var(--van-duration-base) both var(--van-ease-in)}.van-clearfix:after{display:table;clear:both;content:""}.van-ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.van-multi-ellipsis--l2{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;-webkit-box-orient:vertical}.van-multi-ellipsis--l3{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:3;-webkit-box-orient:vertical}.van-safe-area-top{padding-top:constant(safe-area-inset-top);padding-top:env(safe-area-inset-top)}.van-safe-area-bottom{padding-bottom:constant(safe-area-inset-bottom);padding-bottom:env(safe-area-inset-bottom)}.van-haptics-feedback{cursor:pointer}.van-haptics-feedback:active{opacity:var(--van-active-opacity)}[class*=van-hairline]:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid var(--van-border-color);transform:scale(.5)}.van-hairline,.van-hairline--top,.van-hairline--left,.van-hairline--right,.van-hairline--bottom,.van-hairline--surround,.van-hairline--top-bottom{position:relative}.van-hairline--top:after{border-top-width:var(--van-border-width)}.van-hairline--left:after{border-left-width:var(--van-border-width)}.van-hairline--right:after{border-right-width:var(--van-border-width)}.van-hairline--bottom:after{border-bottom-width:var(--van-border-width)}.van-hairline--top-bottom:after,.van-hairline-unset--top-bottom:after{border-width:var(--van-border-width) 0}.van-hairline--surround:after{border-width:var(--van-border-width)}

package/es/style/base.less

@@ -25,6 +25,11 @@
   .multi-ellipsis(3);
 }
 
+.van-safe-area-top {
+  padding-top: constant(safe-area-inset-top);
+  padding-top: env(safe-area-inset-top);
+}
+
 .van-safe-area-bottom {
   padding-bottom: constant(safe-area-inset-bottom);
   padding-bottom: env(safe-area-inset-bottom);

package/es/swipe-cell/SwipeCell.js

@@ -143,7 +143,7 @@ var stdin_default = defineComponent({
       return _createVNode("div", {
         "ref": root,
         "class": bem(),
-        "onClick": getClickHandler("cell"),
+        "onClick": getClickHandler("cell", lockClick),
         "onTouchstart": onTouchStart,
         "onTouchmove": onTouchMove,
         "onTouchend": onTouchEnd,

package/es/toast/Toast.js

@@ -82,6 +82,7 @@ var stdin_default = defineComponent({
       } = props;
       if (isDef(message) && message !== "") {
         return type === "html" ? _createVNode("div", {
+          "key": 0,
           "class": bem("text"),
           "innerHTML": String(message)
         }, null) : _createVNode("div", {

package/lib/calendar/Calendar.d.ts

@@ -66,6 +66,7 @@ declare const calendarProps: {
         type: BooleanConstructor;
         default: true;
     };
+    safeAreaInsetTop: BooleanConstructor;
     safeAreaInsetBottom: {
         type: BooleanConstructor;
         default: true;
@@ -152,6 +153,7 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: true;
     };
+    safeAreaInsetTop: BooleanConstructor;
     safeAreaInsetBottom: {
         type: BooleanConstructor;
         default: true;
@@ -236,6 +238,7 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: true;
     };
+    safeAreaInsetTop: BooleanConstructor;
     safeAreaInsetBottom: {
         type: BooleanConstructor;
         default: true;
@@ -273,6 +276,7 @@ declare const _default: import("vue").DefineComponent<{
     lazyRender: boolean;
     closeOnClickOverlay: boolean;
     closeOnPopstate: boolean;
+    safeAreaInsetTop: boolean;
     poppable: boolean;
     maxRange: string | number;
     showMark: boolean;

package/lib/calendar/Calendar.js

@@ -67,6 +67,7 @@ const calendarProps = {
   showRangePrompt: import_utils.truthProp,
   confirmDisabledText: String,
   closeOnClickOverlay: import_utils.truthProp,
+  safeAreaInsetTop: Boolean,
   safeAreaInsetBottom: import_utils.truthProp,
   minDate: {
     type: Date,
@@ -415,6 +416,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
           "closeable": props.showTitle || props.showSubtitle,
           "teleport": props.teleport,
           "closeOnPopstate": props.closeOnPopstate,
+          "safeAreaInsetTop": props.safeAreaInsetTop,
           "closeOnClickOverlay": props.closeOnClickOverlay,
           "onUpdate:show": updateShow
         }, {

package/lib/calendar/index.css

@@ -1 +1 @@
-body{--van-calendar-background: var(--van-background-2);--van-calendar-popup-height: 80%;--van-calendar-header-shadow: 0 2px 10px rgba(125, 126, 128, .16);--van-calendar-header-title-height: 44px;--van-calendar-header-title-font-size: var(--van-font-size-lg);--van-calendar-header-subtitle-font-size: var(--van-font-size-md);--van-calendar-weekdays-height: 30px;--van-calendar-weekdays-font-size: var(--van-font-size-sm);--van-calendar-month-title-font-size: var(--van-font-size-md);--van-calendar-month-mark-color: rgba(242, 243, 245, .8);--van-calendar-month-mark-font-size: 160px;--van-calendar-day-height: 64px;--van-calendar-day-font-size: var(--van-font-size-lg);--van-calendar-range-edge-color: var(--van-white);--van-calendar-range-edge-background: var(--van-primary-color);--van-calendar-range-middle-color: var(--van-primary-color);--van-calendar-range-middle-background-opacity: .1;--van-calendar-selected-day-size: 54px;--van-calendar-selected-day-color: var(--van-white);--van-calendar-info-font-size: var(--van-font-size-xs);--van-calendar-info-line-height: var(--van-line-height-xs);--van-calendar-selected-day-background: var(--van-primary-color);--van-calendar-day-disabled-color: var(--van-text-color-3);--van-calendar-confirm-button-height: 36px;--van-calendar-confirm-button-margin: 7px 0}.van-theme-dark{--van-calendar-month-mark-color: rgba(100, 101, 102, .2);--van-calendar-day-disabled-color: var(--van-gray-7)}.van-calendar{display:flex;flex-direction:column;height:100%;background:var(--van-calendar-background)}.van-calendar__popup.van-popup--top,.van-calendar__popup.van-popup--bottom{height:var(--van-calendar-popup-height)}.van-calendar__popup.van-popup--left,.van-calendar__popup.van-popup--right{height:100%}.van-calendar__popup .van-popup__close-icon{top:11px}.van-calendar__header{flex-shrink:0;box-shadow:var(--van-calendar-header-shadow)}.van-calendar__month-title,.van-calendar__header-title,.van-calendar__header-subtitle{height:var(--van-calendar-header-title-height);font-weight:var(--van-font-bold);line-height:var(--van-calendar-header-title-height);text-align:center}.van-calendar__header-title{font-size:var(--van-calendar-header-title-font-size)}.van-calendar__header-subtitle{font-size:var(--van-calendar-header-subtitle-font-size)}.van-calendar__month-title{font-size:var(--van-calendar-month-title-font-size)}.van-calendar__weekdays{display:flex}.van-calendar__weekday{flex:1;font-size:var(--van-calendar-weekdays-font-size);line-height:var(--van-calendar-weekdays-height);text-align:center}.van-calendar__body{flex:1;overflow:auto;-webkit-overflow-scrolling:touch}.van-calendar__days{position:relative;display:flex;flex-wrap:wrap;-webkit-user-select:none;user-select:none}.van-calendar__month-mark{position:absolute;top:50%;left:50%;z-index:0;color:var(--van-calendar-month-mark-color);font-size:var(--van-calendar-month-mark-font-size);transform:translate(-50%,-50%);pointer-events:none}.van-calendar__day,.van-calendar__selected-day{display:flex;align-items:center;justify-content:center;text-align:center}.van-calendar__day{position:relative;width:14.285%;height:var(--van-calendar-day-height);font-size:var(--van-calendar-day-font-size);cursor:pointer}.van-calendar__day--end,.van-calendar__day--start,.van-calendar__day--start-end,.van-calendar__day--multiple-middle,.van-calendar__day--multiple-selected{color:var(--van-calendar-range-edge-color);background:var(--van-calendar-range-edge-background)}.van-calendar__day--start{border-radius:var(--van-radius-md) 0 0 var(--van-radius-md)}.van-calendar__day--end{border-radius:0 var(--van-radius-md) var(--van-radius-md) 0}.van-calendar__day--start-end,.van-calendar__day--multiple-selected{border-radius:var(--van-radius-md)}.van-calendar__day--middle{color:var(--van-calendar-range-middle-color)}.van-calendar__day--middle:after{position:absolute;top:0;right:0;bottom:0;left:0;background-color:currentColor;opacity:var(--van-calendar-range-middle-background-opacity);content:""}.van-calendar__day--disabled{color:var(--van-calendar-day-disabled-color);cursor:default}.van-calendar__top-info,.van-calendar__bottom-info{position:absolute;right:0;left:0;font-size:var(--van-calendar-info-font-size);line-height:var(--van-calendar-info-line-height)}@media (max-width: 350px){.van-calendar__top-info,.van-calendar__bottom-info{font-size:9px}}.van-calendar__top-info{top:6px}.van-calendar__bottom-info{bottom:6px}.van-calendar__selected-day{width:var(--van-calendar-selected-day-size);height:var(--van-calendar-selected-day-size);color:var(--van-calendar-selected-day-color);background:var(--van-calendar-selected-day-background);border-radius:var(--van-radius-md)}.van-calendar__footer{flex-shrink:0;padding-left:var(--van-padding-md);padding-right:var(--van-padding-md)}.van-calendar__confirm{height:var(--van-calendar-confirm-button-height);margin:var(--van-calendar-confirm-button-margin)}
+body{--van-calendar-background: var(--van-background-2);--van-calendar-popup-height: 80%;--van-calendar-header-shadow: 0 2px 10px rgba(125, 126, 128, .16);--van-calendar-header-title-height: 44px;--van-calendar-header-title-font-size: var(--van-font-size-lg);--van-calendar-header-subtitle-font-size: var(--van-font-size-md);--van-calendar-weekdays-height: 30px;--van-calendar-weekdays-font-size: var(--van-font-size-sm);--van-calendar-month-title-font-size: var(--van-font-size-md);--van-calendar-month-mark-color: rgba(242, 243, 245, .8);--van-calendar-month-mark-font-size: 160px;--van-calendar-day-height: 64px;--van-calendar-day-font-size: var(--van-font-size-lg);--van-calendar-range-edge-color: var(--van-white);--van-calendar-range-edge-background: var(--van-primary-color);--van-calendar-range-middle-color: var(--van-primary-color);--van-calendar-range-middle-background-opacity: .1;--van-calendar-selected-day-size: 54px;--van-calendar-selected-day-color: var(--van-white);--van-calendar-info-font-size: var(--van-font-size-xs);--van-calendar-info-line-height: var(--van-line-height-xs);--van-calendar-selected-day-background: var(--van-primary-color);--van-calendar-day-disabled-color: var(--van-text-color-3);--van-calendar-confirm-button-height: 36px;--van-calendar-confirm-button-margin: 7px 0}.van-theme-dark{--van-calendar-month-mark-color: rgba(100, 101, 102, .2);--van-calendar-day-disabled-color: var(--van-gray-7)}.van-calendar{display:flex;flex-direction:column;height:100%;background:var(--van-calendar-background)}.van-calendar__popup.van-popup--top,.van-calendar__popup.van-popup--bottom{height:var(--van-calendar-popup-height)}.van-calendar__popup.van-popup--left,.van-calendar__popup.van-popup--right{height:100%}.van-calendar__popup .van-popup__close-icon{top:11px}.van-calendar__header{flex-shrink:0;box-shadow:var(--van-calendar-header-shadow)}.van-calendar__month-title,.van-calendar__header-title,.van-calendar__header-subtitle{color:var(--van-text-color);height:var(--van-calendar-header-title-height);font-weight:var(--van-font-bold);line-height:var(--van-calendar-header-title-height);text-align:center}.van-calendar__header-title{font-size:var(--van-calendar-header-title-font-size)}.van-calendar__header-subtitle{font-size:var(--van-calendar-header-subtitle-font-size)}.van-calendar__month-title{font-size:var(--van-calendar-month-title-font-size)}.van-calendar__weekdays{display:flex}.van-calendar__weekday{flex:1;font-size:var(--van-calendar-weekdays-font-size);line-height:var(--van-calendar-weekdays-height);text-align:center}.van-calendar__body{flex:1;overflow:auto;-webkit-overflow-scrolling:touch}.van-calendar__days{position:relative;display:flex;flex-wrap:wrap;-webkit-user-select:none;user-select:none}.van-calendar__month-mark{position:absolute;top:50%;left:50%;z-index:0;color:var(--van-calendar-month-mark-color);font-size:var(--van-calendar-month-mark-font-size);transform:translate(-50%,-50%);pointer-events:none}.van-calendar__day,.van-calendar__selected-day{display:flex;align-items:center;justify-content:center;text-align:center}.van-calendar__day{position:relative;width:14.285%;height:var(--van-calendar-day-height);font-size:var(--van-calendar-day-font-size);cursor:pointer}.van-calendar__day--end,.van-calendar__day--start,.van-calendar__day--start-end,.van-calendar__day--multiple-middle,.van-calendar__day--multiple-selected{color:var(--van-calendar-range-edge-color);background:var(--van-calendar-range-edge-background)}.van-calendar__day--start{border-radius:var(--van-radius-md) 0 0 var(--van-radius-md)}.van-calendar__day--end{border-radius:0 var(--van-radius-md) var(--van-radius-md) 0}.van-calendar__day--start-end,.van-calendar__day--multiple-selected{border-radius:var(--van-radius-md)}.van-calendar__day--middle{color:var(--van-calendar-range-middle-color)}.van-calendar__day--middle:after{position:absolute;top:0;right:0;bottom:0;left:0;background-color:currentColor;opacity:var(--van-calendar-range-middle-background-opacity);content:""}.van-calendar__day--disabled{color:var(--van-calendar-day-disabled-color);cursor:default}.van-calendar__top-info,.van-calendar__bottom-info{position:absolute;right:0;left:0;font-size:var(--van-calendar-info-font-size);line-height:var(--van-calendar-info-line-height)}@media (max-width: 350px){.van-calendar__top-info,.van-calendar__bottom-info{font-size:9px}}.van-calendar__top-info{top:6px}.van-calendar__bottom-info{bottom:6px}.van-calendar__selected-day{width:var(--van-calendar-selected-day-size);height:var(--van-calendar-selected-day-size);color:var(--van-calendar-selected-day-color);background:var(--van-calendar-selected-day-background);border-radius:var(--van-radius-md)}.van-calendar__footer{flex-shrink:0;padding-left:var(--van-padding-md);padding-right:var(--van-padding-md)}.van-calendar__confirm{height:var(--van-calendar-confirm-button-height);margin:var(--van-calendar-confirm-button-margin)}

package/lib/calendar/index.d.ts

@@ -63,6 +63,7 @@ export declare const Calendar: import("../utils").WithInstall<import("vue").Defi
         type: BooleanConstructor;
         default: true;
     };
+    safeAreaInsetTop: BooleanConstructor;
     safeAreaInsetBottom: {
         type: BooleanConstructor;
         default: true;
@@ -147,6 +148,7 @@ export declare const Calendar: import("../utils").WithInstall<import("vue").Defi
         type: BooleanConstructor;
         default: true;
     };
+    safeAreaInsetTop: BooleanConstructor;
     safeAreaInsetBottom: {
         type: BooleanConstructor;
         default: true;
@@ -184,6 +186,7 @@ export declare const Calendar: import("../utils").WithInstall<import("vue").Defi
     lazyRender: boolean;
     closeOnClickOverlay: boolean;
     closeOnPopstate: boolean;
+    safeAreaInsetTop: boolean;
     poppable: boolean;
     maxRange: string | number;
     showMark: boolean;

package/lib/calendar/index.less

@@ -61,6 +61,7 @@ body {
   &__month-title,
   &__header-title,
   &__header-subtitle {
+    color: var(--van-text-color);
     height: var(--van-calendar-header-title-height);
     font-weight: var(--van-font-bold);
     line-height: var(--van-calendar-header-title-height);

package/lib/config-provider/ConfigProvider.js

@@ -58,6 +58,8 @@ var stdin_default = (0, import_vue2.defineComponent)({
       (0, import_vue2.watch)(() => props.theme, (newVal, oldVal) => {
         document.body.classList.remove(`van-theme-${oldVal}`);
         document.body.classList.add(`van-theme-${newVal}`);
+      }, {
+        immediate: true
       });
     }
     (0, import_vue2.provide)(CONFIG_PROVIDER_KEY, props);

package/lib/date-picker/DatePicker.js

@@ -115,7 +115,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
       }
     });
     (0, import_vue2.watch)(() => props.modelValue, (newValues) => {
-      if ((0, import_utils.isSameValue)(newValues, currentValues.value)) {
+      if (!(0, import_utils.isSameValue)(newValues, currentValues.value)) {
         currentValues.value = newValues;
       }
     });

package/lib/dialog/index.css

@@ -1 +1 @@
-body{--van-dialog-width: 320px;--van-dialog-small-screen-width: 90%;--van-dialog-font-size: var(--van-font-size-lg);--van-dialog-transition: var(--van-duration-base);--van-dialog-radius: 16px;--van-dialog-background: var(--van-background-2);--van-dialog-header-font-weight: var(--van-font-bold);--van-dialog-header-line-height: 24px;--van-dialog-header-padding-top: 26px;--van-dialog-header-isolated-padding: var(--van-padding-lg) 0;--van-dialog-message-padding: var(--van-padding-lg);--van-dialog-message-font-size: var(--van-font-size-md);--van-dialog-message-line-height: var(--van-line-height-md);--van-dialog-message-max-height: 60vh;--van-dialog-has-title-message-text-color: var(--van-gray-7);--van-dialog-has-title-message-padding-top: var(--van-padding-xs);--van-dialog-button-height: 48px;--van-dialog-round-button-height: 36px;--van-dialog-confirm-button-text-color: var(--van-primary-color)}.van-dialog{top:45%;left:50%;width:var(--van-dialog-width);overflow:hidden;font-size:var(--van-dialog-font-size);background:var(--van-dialog-background);border-radius:var(--van-dialog-radius);-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:var(--van-dialog-transition);transition-property:transform,opacity}@media (max-width: 321px){.van-dialog{width:var(--van-dialog-small-screen-width)}}.van-dialog__header{padding-top:var(--van-dialog-header-padding-top);font-weight:var(--van-dialog-header-font-weight);line-height:var(--van-dialog-header-line-height);text-align:center}.van-dialog__header--isolated{padding:var(--van-dialog-header-isolated-padding)}.van-dialog__content--isolated{display:flex;align-items:center;min-height:104px}.van-dialog__message{flex:1;max-height:var(--van-dialog-message-max-height);padding:26px var(--van-dialog-message-padding);overflow-y:auto;font-size:var(--van-dialog-message-font-size);line-height:var(--van-dialog-message-line-height);white-space:pre-wrap;text-align:center;word-wrap:break-word;-webkit-overflow-scrolling:touch}.van-dialog__message--has-title{padding-top:var(--van-dialog-has-title-message-padding-top);color:var(--van-dialog-has-title-message-text-color)}.van-dialog__message--left{text-align:left}.van-dialog__message--right{text-align:right}.van-dialog__footer{display:flex;overflow:hidden;-webkit-user-select:none;user-select:none}.van-dialog__confirm,.van-dialog__cancel{flex:1;height:var(--van-dialog-button-height);margin:0;border:0}.van-dialog__confirm,.van-dialog__confirm:active{color:var(--van-dialog-confirm-button-text-color)}.van-dialog--round-button .van-dialog__footer{position:relative;height:auto;padding:var(--van-padding-xs) var(--van-padding-lg) var(--van-padding-md)}.van-dialog--round-button .van-dialog__message{padding-bottom:var(--van-padding-md);color:var(--van-text-color)}.van-dialog--round-button .van-dialog__confirm,.van-dialog--round-button .van-dialog__cancel{height:var(--van-dialog-round-button-height)}.van-dialog--round-button .van-dialog__confirm{color:var(--van-white)}.van-dialog-bounce-enter-from{transform:translate(-50%,-50%) scale(.7);opacity:0}.van-dialog-bounce-leave-active{transform:translate(-50%,-50%) scale(.9);opacity:0}
+body{--van-dialog-width: 320px;--van-dialog-small-screen-width: 90%;--van-dialog-font-size: var(--van-font-size-lg);--van-dialog-transition: var(--van-duration-base);--van-dialog-radius: 16px;--van-dialog-background: var(--van-background-2);--van-dialog-header-font-weight: var(--van-font-bold);--van-dialog-header-line-height: 24px;--van-dialog-header-padding-top: 26px;--van-dialog-header-isolated-padding: var(--van-padding-lg) 0;--van-dialog-message-padding: var(--van-padding-lg);--van-dialog-message-font-size: var(--van-font-size-md);--van-dialog-message-line-height: var(--van-line-height-md);--van-dialog-message-max-height: 60vh;--van-dialog-has-title-message-text-color: var(--van-gray-7);--van-dialog-has-title-message-padding-top: var(--van-padding-xs);--van-dialog-button-height: 48px;--van-dialog-round-button-height: 36px;--van-dialog-confirm-button-text-color: var(--van-primary-color)}.van-dialog{top:45%;left:50%;width:var(--van-dialog-width);overflow:hidden;font-size:var(--van-dialog-font-size);background:var(--van-dialog-background);border-radius:var(--van-dialog-radius);-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:var(--van-dialog-transition);transition-property:transform,opacity}@media (max-width: 321px){.van-dialog{width:var(--van-dialog-small-screen-width)}}.van-dialog__header{color:var(--van-text-color);padding-top:var(--van-dialog-header-padding-top);font-weight:var(--van-dialog-header-font-weight);line-height:var(--van-dialog-header-line-height);text-align:center}.van-dialog__header--isolated{padding:var(--van-dialog-header-isolated-padding)}.van-dialog__content--isolated{display:flex;align-items:center;min-height:104px}.van-dialog__message{color:var(--van-text-color);flex:1;max-height:var(--van-dialog-message-max-height);padding:26px var(--van-dialog-message-padding);overflow-y:auto;font-size:var(--van-dialog-message-font-size);line-height:var(--van-dialog-message-line-height);white-space:pre-wrap;text-align:center;word-wrap:break-word;-webkit-overflow-scrolling:touch}.van-dialog__message--has-title{padding-top:var(--van-dialog-has-title-message-padding-top);color:var(--van-dialog-has-title-message-text-color)}.van-dialog__message--left{text-align:left}.van-dialog__message--right{text-align:right}.van-dialog__footer{display:flex;overflow:hidden;-webkit-user-select:none;user-select:none}.van-dialog__confirm,.van-dialog__cancel{flex:1;height:var(--van-dialog-button-height);margin:0;border:0}.van-dialog__confirm,.van-dialog__confirm:active{color:var(--van-dialog-confirm-button-text-color)}.van-dialog--round-button .van-dialog__footer{position:relative;height:auto;padding:var(--van-padding-xs) var(--van-padding-lg) var(--van-padding-md)}.van-dialog--round-button .van-dialog__message{padding-bottom:var(--van-padding-md);color:var(--van-text-color)}.van-dialog--round-button .van-dialog__confirm,.van-dialog--round-button .van-dialog__cancel{height:var(--van-dialog-round-button-height)}.van-dialog--round-button .van-dialog__confirm{color:var(--van-white)}.van-dialog-bounce-enter-from{transform:translate(-50%,-50%) scale(.7);opacity:0}.van-dialog-bounce-leave-active{transform:translate(-50%,-50%) scale(.9);opacity:0}

package/lib/dialog/index.less

@@ -37,6 +37,7 @@ body {
   }
 
   &__header {
+    color: var(--van-text-color);
     padding-top: var(--van-dialog-header-padding-top);
     font-weight: var(--van-dialog-header-font-weight);
     line-height: var(--van-dialog-header-line-height);
@@ -56,6 +57,7 @@ body {
   }
 
   &__message {
+    color: var(--van-text-color);
     flex: 1;
     max-height: var(--van-dialog-message-max-height);
     padding: 26px var(--van-dialog-message-padding);

package/lib/index-bar/IndexBar.js

@@ -65,6 +65,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
       children,
       linkChildren
     } = (0, import_use.useChildren)(INDEX_BAR_KEY);
+    let selectActiveIndex;
     linkChildren({
       props
     });
@@ -92,6 +93,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
       }
       return -1;
     };
+    const getMatchAnchor = (index) => children.find((item) => String(item.index) === index);
     const onScroll = () => {
       if ((0, import_utils.isHidden)(root)) {
         return;
@@ -103,7 +105,16 @@ var stdin_default = (0, import_vue2.defineComponent)({
       const scrollTop = (0, import_utils.getScrollTop)(scrollParent.value);
       const scrollParentRect = (0, import_use.useRect)(scrollParent);
       const rects = children.map((item) => item.getRect(scrollParent.value, scrollParentRect));
-      const active = getActiveAnchor(scrollTop, rects);
+      let active = -1;
+      if (selectActiveIndex) {
+        const match = getMatchAnchor(selectActiveIndex);
+        if (match) {
+          const rect = match.getRect(scrollParent.value, scrollParentRect);
+          active = getActiveAnchor(rect.top, rects);
+        }
+      } else {
+        active = getActiveAnchor(scrollTop, rects);
+      }
       activeAnchor.value = indexList[active];
       if (sticky) {
         children.forEach((item, index) => {
@@ -122,7 +133,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
           if (index === active) {
             state.active = true;
             state.top = Math.max(props.stickyOffsetTop, rects[index].top - scrollTop) + scrollParentRect.top;
-          } else if (index === active - 1) {
+          } else if (index === active - 1 && selectActiveIndex === "") {
             const activeItemTop = rects[active].top - scrollTop;
             state.active = activeItemTop > 0;
             state.top = activeItemTop + scrollParentRect.top - rects[index].height;
@@ -131,6 +142,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
           }
         });
       }
+      selectActiveIndex = "";
     };
     const init = () => {
       (0, import_vue2.nextTick)(onScroll);
@@ -156,9 +168,18 @@ var stdin_default = (0, import_vue2.defineComponent)({
       }, [index]);
     });
     const scrollTo = (index) => {
-      index = String(index);
-      const match = children.find((item) => String(item.index) === index);
+      selectActiveIndex = String(index);
+      const match = getMatchAnchor(selectActiveIndex);
       if (match) {
+        const scrollTop = (0, import_utils.getScrollTop)(scrollParent.value);
+        const scrollParentRect = (0, import_use.useRect)(scrollParent);
+        const {
+          offsetHeight
+        } = document.documentElement;
+        if (scrollTop === offsetHeight - scrollParentRect.height) {
+          onScroll();
+          return;
+        }
         match.$el.scrollIntoView();
         if (props.sticky && props.stickyOffsetTop) {
           (0, import_utils.setRootScrollTop)((0, import_utils.getRootScrollTop)() - props.stickyOffsetTop);