vant 3.2.3 → 3.2.7

package/es/tree-select/index.css

@@ -1 +1 @@
-:root{--van-tree-select-font-size:var(--van-font-size-md);--van-tree-select-nav-background-color:var(--van-background-color);--van-tree-select-content-background-color:var(--van-white);--van-tree-select-nav-item-padding:14px var(--van-padding-sm);--van-tree-select-item-height:48px;--van-tree-select-item-active-color:var(--van-danger-color);--van-tree-select-item-disabled-color:var(--van-gray-5);--van-tree-select-item-selected-size:16px}.van-tree-select{position:relative;display:flex;font-size:var(--van-tree-select-font-size);-webkit-user-select:none;user-select:none}.van-tree-select__nav{flex:1;overflow-y:auto;background-color:var(--van-tree-select-nav-background-color);-webkit-overflow-scrolling:touch}.van-tree-select__nav-item{padding:var(--van-tree-select-nav-item-padding)}.van-tree-select__content{flex:2;overflow-y:auto;background-color:var(--van-tree-select-content-background-color);-webkit-overflow-scrolling:touch}.van-tree-select__item{position:relative;padding:0 32px 0 var(--van-padding-md);font-weight:var(--van-font-weight-bold);line-height:var(--van-tree-select-item-height);cursor:pointer}.van-tree-select__item--active{color:var(--van-tree-select-item-active-color)}.van-tree-select__item:active{background-color:var(--van-active-color)}.van-tree-select__item--disabled{color:var(--van-tree-select-item-disabled-color);cursor:not-allowed}.van-tree-select__item--disabled:active{background-color:transparent}.van-tree-select__selected{position:absolute;top:50%;right:var(--van-padding-md);margin-top:calc(var(--van-padding-xs) * -1);font-size:var(--van-tree-select-item-selected-size)}
+:root{--van-tree-select-font-size:var(--van-font-size-md);--van-tree-select-nav-background-color:var(--van-background-color);--van-tree-select-content-background-color:var(--van-background-color-light);--van-tree-select-nav-item-padding:14px var(--van-padding-sm);--van-tree-select-item-height:48px;--van-tree-select-item-active-color:var(--van-danger-color);--van-tree-select-item-disabled-color:var(--van-gray-5);--van-tree-select-item-selected-size:16px}.van-tree-select{position:relative;display:flex;font-size:var(--van-tree-select-font-size);-webkit-user-select:none;user-select:none}.van-tree-select__nav{flex:1;overflow-y:auto;background:var(--van-tree-select-nav-background-color);-webkit-overflow-scrolling:touch}.van-tree-select__nav-item{padding:var(--van-tree-select-nav-item-padding)}.van-tree-select__content{flex:2;overflow-y:auto;background:var(--van-tree-select-content-background-color);-webkit-overflow-scrolling:touch}.van-tree-select__item{position:relative;padding:0 32px 0 var(--van-padding-md);font-weight:var(--van-font-weight-bold);line-height:var(--van-tree-select-item-height);cursor:pointer}.van-tree-select__item--active{color:var(--van-tree-select-item-active-color)}.van-tree-select__item:active{background-color:var(--van-active-color)}.van-tree-select__item--disabled{color:var(--van-tree-select-item-disabled-color);cursor:not-allowed}.van-tree-select__item--disabled:active{background-color:transparent}.van-tree-select__selected{position:absolute;top:50%;right:var(--van-padding-md);margin-top:calc(var(--van-padding-xs) * -1);font-size:var(--van-tree-select-item-selected-size)}

package/es/tree-select/index.d.ts

@@ -11,44 +11,44 @@ export declare const TreeSelect: import("../utils").WithInstall<import("vue").De
         type: (NumberConstructor | StringConstructor)[];
         default: number;
     };
-    activeId: {
-        type: import("vue").PropType<string | number | (string | number)[]>;
-        default: number;
-    };
     selectedIcon: {
-        type: StringConstructor;
+        type: import("vue").PropType<string>;
         default: string;
     };
     mainActiveIndex: {
         type: (NumberConstructor | StringConstructor)[];
         default: number;
     };
+    activeId: {
+        type: import("vue").PropType<string | number | (string | number)[]>;
+        default: number;
+    };
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click-item" | "click-nav" | "update:activeId" | "update:mainActiveIndex")[], "click-item" | "click-nav" | "update:activeId" | "update:mainActiveIndex", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<{
     max?: unknown;
     items?: unknown;
     height?: unknown;
-    activeId?: unknown;
     selectedIcon?: unknown;
     mainActiveIndex?: unknown;
+    activeId?: unknown;
 } & {
-    max: string | number;
     height: string | number;
+    max: string | number;
     items: import("./TreeSelect").TreeSelectItem[];
-    activeId: string | number | (string | number)[];
     selectedIcon: string;
     mainActiveIndex: string | number;
+    activeId: string | number | (string | number)[];
 } & {}> & {
     "onClick-item"?: ((...args: any[]) => any) | undefined;
     "onClick-nav"?: ((...args: any[]) => any) | undefined;
     "onUpdate:activeId"?: ((...args: any[]) => any) | undefined;
     "onUpdate:mainActiveIndex"?: ((...args: any[]) => any) | undefined;
 }, {
-    max: string | number;
     height: string | number;
+    max: string | number;
     items: import("./TreeSelect").TreeSelectItem[];
-    activeId: string | number | (string | number)[];
     selectedIcon: string;
     mainActiveIndex: string | number;
+    activeId: string | number | (string | number)[];
 }>>;
 export default TreeSelect;
-export type { TreeSelectItem, TreeSelectChild } from './TreeSelect';
+export type { TreeSelectItem, TreeSelectChild, TreeSelectProps, } from './TreeSelect';

package/es/tree-select/index.less

@@ -20,7 +20,7 @@
   &__nav {
     flex: 1;
     overflow-y: auto;
-    background-color: var(--van-tree-select-nav-background-color);
+    background: var(--van-tree-select-nav-background-color);
     -webkit-overflow-scrolling: touch;
 
     &-item {
@@ -31,7 +31,7 @@
   &__content {
     flex: 2;
     overflow-y: auto;
-    background-color: var(--van-tree-select-content-background-color);
+    background: var(--van-tree-select-content-background-color);
     -webkit-overflow-scrolling: touch;
   }
 

package/es/tree-select/var.less

@@ -2,7 +2,7 @@
 
 @tree-select-font-size: var(--van-font-size-md);
 @tree-select-nav-background-color: var(--van-background-color);
-@tree-select-content-background-color: var(--van-white);
+@tree-select-content-background-color: var(--van-background-color-light);
 @tree-select-nav-item-padding: 14px var(--van-padding-sm);
 @tree-select-item-height: 48px;
 @tree-select-item-active-color: var(--van-danger-color);

package/es/uploader/Uploader.d.ts

@@ -3,12 +3,36 @@ import { Interceptor } from '../utils';
 import { ImagePreviewOptions } from '../image-preview';
 import type { ImageFit } from '../image';
 import type { UploaderMaxSize, UploaderAfterRead, UploaderBeforeRead, UploaderResultType, UploaderFileListItem } from './types';
-declare const props: {
+declare const uploaderProps: {
+    name: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: string;
+    };
+    accept: {
+        type: PropType<string>;
+        default: string;
+    };
     capture: StringConstructor;
     multiple: BooleanConstructor;
     disabled: BooleanConstructor;
     readonly: BooleanConstructor;
     lazyLoad: BooleanConstructor;
+    maxCount: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    imageFit: {
+        type: PropType<ImageFit>;
+        default: ImageFit;
+    };
+    resultType: {
+        type: PropType<UploaderResultType>;
+        default: UploaderResultType;
+    };
+    uploadIcon: {
+        type: PropType<string>;
+        default: string;
+    };
     uploadText: StringConstructor;
     deletable: {
         type: BooleanConstructor;
@@ -19,6 +43,10 @@ declare const props: {
         type: BooleanConstructor;
         default: true;
     };
+    modelValue: {
+        type: PropType<UploaderFileListItem[]>;
+        default: () => never[];
+    };
     beforeRead: PropType<UploaderBeforeRead>;
     beforeDelete: PropType<Interceptor>;
     previewSize: (NumberConstructor | StringConstructor)[];
@@ -31,46 +59,42 @@ declare const props: {
         type: BooleanConstructor;
         default: true;
     };
+    maxSize: {
+        type: PropType<UploaderMaxSize>;
+        default: number;
+    };
+};
+export declare type UploaderProps = ExtractPropTypes<typeof uploaderProps>;
+declare const _default: import("vue").DefineComponent<{
     name: {
         type: (NumberConstructor | StringConstructor)[];
         default: string;
     };
     accept: {
-        type: StringConstructor;
+        type: PropType<string>;
         default: string;
     };
-    modelValue: {
-        type: PropType<UploaderFileListItem[]>;
-        default: () => never[];
-    };
-    maxSize: {
-        type: PropType<UploaderMaxSize>;
-        default: number;
-    };
+    capture: StringConstructor;
+    multiple: BooleanConstructor;
+    disabled: BooleanConstructor;
+    readonly: BooleanConstructor;
+    lazyLoad: BooleanConstructor;
     maxCount: {
         type: (NumberConstructor | StringConstructor)[];
         default: number;
     };
     imageFit: {
         type: PropType<ImageFit>;
-        default: string;
+        default: ImageFit;
     };
     resultType: {
         type: PropType<UploaderResultType>;
-        default: string;
+        default: UploaderResultType;
     };
     uploadIcon: {
-        type: StringConstructor;
+        type: PropType<string>;
         default: string;
     };
-};
-export declare type UploaderProps = ExtractPropTypes<typeof props>;
-declare const _default: import("vue").DefineComponent<{
-    capture: StringConstructor;
-    multiple: BooleanConstructor;
-    disabled: BooleanConstructor;
-    readonly: BooleanConstructor;
-    lazyLoad: BooleanConstructor;
     uploadText: StringConstructor;
     deletable: {
         type: BooleanConstructor;
@@ -81,6 +105,10 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: true;
     };
+    modelValue: {
+        type: PropType<UploaderFileListItem[]>;
+        default: () => never[];
+    };
     beforeRead: PropType<UploaderBeforeRead>;
     beforeDelete: PropType<Interceptor>;
     previewSize: (NumberConstructor | StringConstructor)[];
@@ -93,79 +121,51 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: true;
     };
-    name: {
-        type: (NumberConstructor | StringConstructor)[];
-        default: string;
-    };
-    accept: {
-        type: StringConstructor;
-        default: string;
-    };
-    modelValue: {
-        type: PropType<UploaderFileListItem[]>;
-        default: () => never[];
-    };
     maxSize: {
         type: PropType<UploaderMaxSize>;
         default: number;
     };
-    maxCount: {
-        type: (NumberConstructor | StringConstructor)[];
-        default: number;
-    };
-    imageFit: {
-        type: PropType<ImageFit>;
-        default: string;
-    };
-    resultType: {
-        type: PropType<UploaderResultType>;
-        default: string;
-    };
-    uploadIcon: {
-        type: StringConstructor;
-        default: string;
-    };
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "delete" | "oversize" | "click-upload" | "close-preview" | "click-preview")[], "update:modelValue" | "delete" | "oversize" | "click-upload" | "close-preview" | "click-preview", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<{
+    name?: unknown;
+    accept?: unknown;
     capture?: unknown;
     multiple?: unknown;
     disabled?: unknown;
     readonly?: unknown;
     lazyLoad?: unknown;
+    maxCount?: unknown;
+    imageFit?: unknown;
+    resultType?: unknown;
+    uploadIcon?: unknown;
     uploadText?: unknown;
     deletable?: unknown;
     afterRead?: unknown;
     showUpload?: unknown;
+    modelValue?: unknown;
     beforeRead?: unknown;
     beforeDelete?: unknown;
     previewSize?: unknown;
     previewImage?: unknown;
     previewOptions?: unknown;
     previewFullImage?: unknown;
-    name?: unknown;
-    accept?: unknown;
-    modelValue?: unknown;
     maxSize?: unknown;
-    maxCount?: unknown;
-    imageFit?: unknown;
-    resultType?: unknown;
-    uploadIcon?: unknown;
 } & {
     name: string | number;
     accept: string;
     disabled: boolean;
-    readonly: boolean;
     modelValue: UploaderFileListItem[];
+    readonly: boolean;
     multiple: boolean;
     lazyLoad: boolean;
+    maxCount: string | number;
+    imageFit: ImageFit;
+    resultType: UploaderResultType;
+    uploadIcon: string;
     deletable: boolean;
     showUpload: boolean;
     previewImage: boolean;
     previewFullImage: boolean;
     maxSize: UploaderMaxSize;
-    maxCount: string | number;
-    imageFit: ImageFit;
-    resultType: UploaderResultType;
-    uploadIcon: string;
 } & {
     capture?: string | undefined;
     beforeRead?: UploaderBeforeRead | undefined;
@@ -185,18 +185,18 @@ declare const _default: import("vue").DefineComponent<{
     name: string | number;
     accept: string;
     disabled: boolean;
-    readonly: boolean;
     modelValue: UploaderFileListItem[];
+    readonly: boolean;
     multiple: boolean;
     lazyLoad: boolean;
+    maxCount: string | number;
+    imageFit: ImageFit;
+    resultType: UploaderResultType;
+    uploadIcon: string;
     deletable: boolean;
     showUpload: boolean;
     previewImage: boolean;
     previewFullImage: boolean;
     maxSize: UploaderMaxSize;
-    maxCount: string | number;
-    imageFit: ImageFit;
-    resultType: UploaderResultType;
-    uploadIcon: string;
 }>;
 export default _default;

package/es/uploader/Uploader.js

@@ -1,7 +1,7 @@
 import { createVNode as _createVNode, mergeProps as _mergeProps, resolveDirective as _resolveDirective } from "vue";
 import { ref, reactive, defineComponent } from 'vue'; // Utils
 
-import { pick, extend, isPromise, truthProp, getSizeStyle } from '../utils';
+import { pick, extend, isPromise, truthProp, numericProp, getSizeStyle, makeArrayProp, makeStringProp, makeNumericProp } from '../utils';
 import { bem, name, toArray, isOversize, filterFiles, isImageFile, readFileContent } from './utils'; // Composables
 
 import { useCustomFieldValue } from '@vant/use';
@@ -11,70 +11,56 @@ import { Icon } from '../icon';
 import { ImagePreview } from '../image-preview';
 import UploaderPreviewItem from './UploaderPreviewItem'; // Types
 
-var props = {
+var uploaderProps = {
+  name: makeNumericProp(''),
+  accept: makeStringProp('image/*'),
   capture: String,
   multiple: Boolean,
   disabled: Boolean,
   readonly: Boolean,
   lazyLoad: Boolean,
+  maxCount: makeNumericProp(Infinity),
+  imageFit: makeStringProp('cover'),
+  resultType: makeStringProp('dataUrl'),
+  uploadIcon: makeStringProp('photograph'),
   uploadText: String,
   deletable: truthProp,
   afterRead: Function,
   showUpload: truthProp,
+  modelValue: makeArrayProp(),
   beforeRead: Function,
   beforeDelete: Function,
-  previewSize: [Number, String],
+  previewSize: numericProp,
   previewImage: truthProp,
   previewOptions: Object,
   previewFullImage: truthProp,
-  name: {
-    type: [Number, String],
-    default: ''
-  },
-  accept: {
-    type: String,
-    default: 'image/*'
-  },
-  modelValue: {
-    type: Array,
-    default: () => []
-  },
   maxSize: {
     type: [Number, String, Function],
-    default: Number.MAX_VALUE
-  },
-  maxCount: {
-    type: [Number, String],
-    default: Number.MAX_VALUE
-  },
-  imageFit: {
-    type: String,
-    default: 'cover'
-  },
-  resultType: {
-    type: String,
-    default: 'dataUrl'
-  },
-  uploadIcon: {
-    type: String,
-    default: 'photograph'
+    default: Infinity
   }
 };
 export default defineComponent({
   name,
-  props,
+  props: uploaderProps,
   emits: ['delete', 'oversize', 'click-upload', 'close-preview', 'click-preview', 'update:modelValue'],
 
-  setup(props, {
-    emit,
-    slots
-  }) {
+  setup(props, _ref) {
+    var {
+      emit,
+      slots
+    } = _ref;
     var inputRef = ref();
 
-    var getDetail = (index = props.modelValue.length) => ({
-      name: props.name,
-      index
-    });
+    var getDetail = function (index) {
+      if (index === void 0) {
+        index = props.modelValue.length;
+      }
+
+      return {
+        name: props.name,
+        index
+      };
+    };
 
     var resetInput = () => {
       if (inputRef.value) {

package/es/uploader/UploaderPreviewItem.d.ts

@@ -4,25 +4,25 @@ import { ImageFit } from '../image';
 import type { UploaderFileListItem } from './types';
 declare const _default: import("vue").DefineComponent<{
     name: (NumberConstructor | StringConstructor)[];
+    item: {
+        type: PropType<UploaderFileListItem>;
+        required: true;
+    };
     index: NumberConstructor;
     imageFit: PropType<ImageFit>;
     lazyLoad: BooleanConstructor;
     deletable: BooleanConstructor;
     previewSize: (NumberConstructor | StringConstructor)[];
     beforeDelete: PropType<Interceptor>;
-    item: {
-        type: PropType<UploaderFileListItem>;
-        required: true;
-    };
 }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("delete" | "preview")[], "delete" | "preview", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<{
     name?: unknown;
+    item?: unknown;
     index?: unknown;
     imageFit?: unknown;
     lazyLoad?: unknown;
     deletable?: unknown;
     previewSize?: unknown;
     beforeDelete?: unknown;
-    item?: unknown;
 } & {
     item: UploaderFileListItem;
     lazyLoad: boolean;
@@ -30,9 +30,9 @@ declare const _default: import("vue").DefineComponent<{
 } & {
     name?: string | number | undefined;
     index?: number | undefined;
+    imageFit?: ImageFit | undefined;
     beforeDelete?: Interceptor | undefined;
     previewSize?: string | number | undefined;
-    imageFit?: ImageFit | undefined;
 }> & {
     onDelete?: ((...args: any[]) => any) | undefined;
     onPreview?: ((...args: any[]) => any) | undefined;

package/es/uploader/UploaderPreviewItem.js

@@ -1,8 +1,8 @@
-import { createVNode as _createVNode } from "vue";
+import { resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
 import { defineComponent } from 'vue'; // Utils
 
 import { bem, isImageFile } from './utils';
-import { isDef, extend, getSizeStyle, callInterceptor } from '../utils'; // Components
+import { isDef, extend, numericProp, getSizeStyle, callInterceptor, makeRequiredProp } from '../utils'; // Components
 
 import { Icon } from '../icon';
 import { Image } from '../image';
@@ -10,24 +10,23 @@ import { Loading } from '../loading'; // Types
 
 export default defineComponent({
   props: {
-    name: [Number, String],
+    name: numericProp,
+    item: makeRequiredProp(Object),
     index: Number,
     imageFit: String,
     lazyLoad: Boolean,
     deletable: Boolean,
-    previewSize: [Number, String],
-    beforeDelete: Function,
-    item: {
-      type: Object,
-      required: true
-    }
+    previewSize: numericProp,
+    beforeDelete: Function
   },
   emits: ['delete', 'preview'],
 
-  setup(props, {
-    emit,
-    slots
-  }) {
+  setup(props, _ref) {
+    var {
+      emit,
+      slots
+    } = _ref;
+
     var renderMask = () => {
       var {
         status,
@@ -58,8 +57,7 @@ export default defineComponent({
         beforeDelete
       } = props;
       event.stopPropagation();
-      callInterceptor({
-        interceptor: beforeDelete,
+      callInterceptor(beforeDelete, {
         args: [item, {
           name,
           index
@@ -111,7 +109,7 @@ export default defineComponent({
           "lazyLoad": props.lazyLoad,
           "onClick": onPreview
         }, {
-          default: () => [renderCover()]
+          default: renderCover
         });
       }
 

package/es/uploader/index.css

@@ -1 +1 @@
-:root{--van-uploader-size:80px;--van-uploader-icon-size:24px;--van-uploader-icon-color:var(--van-gray-4);--van-uploader-text-color:var(--van-gray-6);--van-uploader-text-font-size:var(--van-font-size-sm);--van-uploader-upload-background-color:var(--van-gray-1);--van-uploader-upload-active-color:var(--van-active-color);--van-uploader-delete-color:var(--van-white);--van-uploader-delete-icon-size:14px;--van-uploader-delete-background-color:rgba(0, 0, 0, 0.7);--van-uploader-file-background-color:var(--van-background-color);--van-uploader-file-icon-size:20px;--van-uploader-file-icon-color:var(--van-gray-7);--van-uploader-file-name-padding:0 var(--van-padding-base);--van-uploader-file-name-margin-top:var(--van-padding-xs);--van-uploader-file-name-font-size:var(--van-font-size-sm);--van-uploader-file-name-text-color:var(--van-gray-7);--van-uploader-mask-text-color:var(--van-white);--van-uploader-mask-background-color:rgba(50, 50, 51, 0.88);--van-uploader-mask-icon-size:22px;--van-uploader-mask-message-font-size:var(--van-font-size-sm);--van-uploader-mask-message-line-height:var(--van-line-height-xs);--van-uploader-loading-icon-size:22px;--van-uploader-loading-icon-color:var(--van-white);--van-uploader-disabled-opacity:var(--van-disabled-opacity)}.van-uploader{position:relative;display:inline-block}.van-uploader__wrapper{display:flex;flex-wrap:wrap}.van-uploader__wrapper--disabled{opacity:var(--van-uploader-disabled-opacity)}.van-uploader__input{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;cursor:pointer;opacity:0}.van-uploader__input-wrapper{position:relative}.van-uploader__input:disabled{cursor:not-allowed}.van-uploader__upload{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;width:var(--van-uploader-size);height:var(--van-uploader-size);margin:0 var(--van-padding-xs) var(--van-padding-xs) 0;background-color:var(--van-uploader-upload-background-color)}.van-uploader__upload:active{background-color:var(--van-uploader-upload-active-color)}.van-uploader__upload--readonly:active{background-color:var(--van-uploader-upload-background-color)}.van-uploader__upload-icon{color:var(--van-uploader-icon-color);font-size:var(--van-uploader-icon-size)}.van-uploader__upload-text{margin-top:var(--van-padding-xs);color:var(--van-uploader-text-color);font-size:var(--van-uploader-text-font-size)}.van-uploader__preview{position:relative;margin:0 var(--van-padding-xs) var(--van-padding-xs) 0;cursor:pointer}.van-uploader__preview-image{display:block;width:var(--van-uploader-size);height:var(--van-uploader-size);overflow:hidden}.van-uploader__preview-delete{position:absolute;top:0;right:0;width:var(--van-uploader-delete-icon-size);height:var(--van-uploader-delete-icon-size);background-color:var(--van-uploader-delete-background-color);border-radius:0 0 0 12px}.van-uploader__preview-delete-icon{position:absolute;top:0;right:0;color:#fff;color:var(--van-uploader-delete-color);font-size:var(--van-uploader-delete-icon-size);transform:scale(.7) translate(10%,-10%)}.van-uploader__preview-cover{position:absolute;top:0;right:0;bottom:0;left:0}.van-uploader__mask{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--van-uploader-mask-text-color);background-color:var(--van-uploader-mask-background-color)}.van-uploader__mask-icon{font-size:var(--van-uploader-mask-icon-size)}.van-uploader__mask-message{margin-top:6px;padding:0 var(--van-padding-base);font-size:var(--van-uploader-mask-message-font-size);line-height:var(--van-uploader-mask-message-line-height)}.van-uploader__loading{width:var(--van-uploader-loading-icon-size);height:var(--van-uploader-loading-icon-size);color:var(--van-uploader-loading-icon-color)}.van-uploader__file{display:flex;flex-direction:column;align-items:center;justify-content:center;width:var(--van-uploader-size);height:var(--van-uploader-size);background-color:var(--van-uploader-file-background-color)}.van-uploader__file-icon{color:var(--van-uploader-file-icon-color);font-size:var(--van-uploader-file-icon-size)}.van-uploader__file-name{box-sizing:border-box;width:100%;margin-top:var(--van-uploader-file-name-margin-top);padding:var(--van-uploader-file-name-padding);color:var(--van-uploader-file-name-text-color);font-size:var(--van-uploader-file-name-font-size);text-align:center}
+:root{--van-uploader-size:80px;--van-uploader-icon-size:24px;--van-uploader-icon-color:var(--van-gray-4);--van-uploader-text-color:var(--van-text-color-2);--van-uploader-text-font-size:var(--van-font-size-sm);--van-uploader-upload-background-color:var(--van-gray-1);--van-uploader-upload-active-color:var(--van-active-color);--van-uploader-delete-color:var(--van-white);--van-uploader-delete-icon-size:14px;--van-uploader-delete-background-color:rgba(0, 0, 0, 0.7);--van-uploader-file-background-color:var(--van-background-color);--van-uploader-file-icon-size:20px;--van-uploader-file-icon-color:var(--van-gray-7);--van-uploader-file-name-padding:0 var(--van-padding-base);--van-uploader-file-name-margin-top:var(--van-padding-xs);--van-uploader-file-name-font-size:var(--van-font-size-sm);--van-uploader-file-name-text-color:var(--van-gray-7);--van-uploader-mask-text-color:var(--van-white);--van-uploader-mask-background-color:rgba(50, 50, 51, 0.88);--van-uploader-mask-icon-size:22px;--van-uploader-mask-message-font-size:var(--van-font-size-sm);--van-uploader-mask-message-line-height:var(--van-line-height-xs);--van-uploader-loading-icon-size:22px;--van-uploader-loading-icon-color:var(--van-white);--van-uploader-disabled-opacity:var(--van-disabled-opacity)}.van-uploader{position:relative;display:inline-block}.van-uploader__wrapper{display:flex;flex-wrap:wrap}.van-uploader__wrapper--disabled{opacity:var(--van-uploader-disabled-opacity)}.van-uploader__input{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;cursor:pointer;opacity:0}.van-uploader__input-wrapper{position:relative}.van-uploader__input:disabled{cursor:not-allowed}.van-uploader__upload{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;width:var(--van-uploader-size);height:var(--van-uploader-size);margin:0 var(--van-padding-xs) var(--van-padding-xs) 0;background:var(--van-uploader-upload-background-color)}.van-uploader__upload:active{background-color:var(--van-uploader-upload-active-color)}.van-uploader__upload--readonly:active{background-color:var(--van-uploader-upload-background-color)}.van-uploader__upload-icon{color:var(--van-uploader-icon-color);font-size:var(--van-uploader-icon-size)}.van-uploader__upload-text{margin-top:var(--van-padding-xs);color:var(--van-uploader-text-color);font-size:var(--van-uploader-text-font-size)}.van-uploader__preview{position:relative;margin:0 var(--van-padding-xs) var(--van-padding-xs) 0;cursor:pointer}.van-uploader__preview-image{display:block;width:var(--van-uploader-size);height:var(--van-uploader-size);overflow:hidden}.van-uploader__preview-delete{position:absolute;top:0;right:0;width:var(--van-uploader-delete-icon-size);height:var(--van-uploader-delete-icon-size);background:var(--van-uploader-delete-background-color);border-radius:0 0 0 12px}.van-uploader__preview-delete-icon{position:absolute;top:0;right:0;color:var(--van-uploader-delete-color);font-size:var(--van-uploader-delete-icon-size);transform:scale(.7) translate(10%,-10%)}.van-uploader__preview-cover{position:absolute;top:0;right:0;bottom:0;left:0}.van-uploader__mask{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--van-uploader-mask-text-color);background:var(--van-uploader-mask-background-color)}.van-uploader__mask-icon{font-size:var(--van-uploader-mask-icon-size)}.van-uploader__mask-message{margin-top:6px;padding:0 var(--van-padding-base);font-size:var(--van-uploader-mask-message-font-size);line-height:var(--van-uploader-mask-message-line-height)}.van-uploader__loading{width:var(--van-uploader-loading-icon-size);height:var(--van-uploader-loading-icon-size);color:var(--van-uploader-loading-icon-color)}.van-uploader__file{display:flex;flex-direction:column;align-items:center;justify-content:center;width:var(--van-uploader-size);height:var(--van-uploader-size);background:var(--van-uploader-file-background-color)}.van-uploader__file-icon{color:var(--van-uploader-file-icon-color);font-size:var(--van-uploader-file-icon-size)}.van-uploader__file-name{box-sizing:border-box;width:100%;margin-top:var(--van-uploader-file-name-margin-top);padding:var(--van-uploader-file-name-padding);color:var(--van-uploader-file-name-text-color);font-size:var(--van-uploader-file-name-font-size);text-align:center}