vant 3.2.2 → 3.2.6

package/es/uploader/utils.js

@@ -1,13 +1,7 @@
 import { createNamespace, isFunction } from '../utils';
 var [name, bem] = createNamespace('uploader');
 export { name, bem };
-export function toArray(item) {
-  if (Array.isArray(item)) {
-    return item;
-  }
-
-  return [item];
-}
+export var toArray = item => Array.isArray(item) ? item : [item];
 export function readFileContent(file, resultType) {
   return new Promise(resolve => {
     if (resultType === 'file') {
@@ -57,9 +51,7 @@ export function filterFiles(items, maxSize) {
   };
 }
 var IMAGE_REGEXP = /\.(jpeg|jpg|gif|png|svg|webp|jfif|bmp|dpg)/i;
-export function isImageUrl(url) {
-  return IMAGE_REGEXP.test(url);
-}
+export var isImageUrl = url => IMAGE_REGEXP.test(url);
 export function isImageFile(item) {
   // some special urls cannot be recognized
   // user can add `isImage` flag to mark it as an image url

package/es/utils/{base.d.ts → basic.d.ts}

@@ -1,4 +1,4 @@
-import { PropType, ComponentPublicInstance } from 'vue';
+import type { ComponentPublicInstance } from 'vue';
 export declare function noop(): void;
 export declare const extend: {
     <T, U>(target: T, source: U): T & U;
@@ -7,11 +7,6 @@ export declare const extend: {
     (target: object, ...sources: any[]): any;
 };
 export declare const inBrowser: boolean;
-export declare const unknownProp: PropType<unknown>;
-export declare const truthProp: {
-    type: BooleanConstructor;
-    default: true;
-};
 export declare type ComponentInstance = ComponentPublicInstance<{}, any>;
 export declare function get(object: any, path: string): any;
 export declare type Writeable<T> = {

package/es/utils/{base.js → basic.js}

@@ -1,12 +1,6 @@
 export function noop() {}
 export var extend = Object.assign;
-export var inBrowser = typeof window !== 'undefined'; // PropTypes
-
-export var unknownProp = null;
-export var truthProp = {
-  type: Boolean,
-  default: true
-}; // eslint-disable-next-line
+export var inBrowser = typeof window !== 'undefined'; // eslint-disable-next-line
 
 export function get(object, path) {
   var keys = path.split('.');

package/{lib/utils/create/bem.d.ts → es/utils/create.d.ts}

@@ -1,3 +1,9 @@
+export declare function createTranslate(name: string): (path: string, ...args: any[]) => any;
+export declare type Translate = ReturnType<typeof createTranslate>;
+export declare type Mod = string | {
+    [key: string]: any;
+};
+export declare type Mods = Mod | Mod[];
 /**
  * bem helper
  * b() // 'button'
@@ -6,9 +12,6 @@
  * b('text', { disabled }) // 'button__text button__text--disabled'
  * b(['disabled', 'primary']) // 'button button--disabled button--primary'
  */
-export declare type Mod = string | {
-    [key: string]: any;
-};
-export declare type Mods = Mod | Mod[];
 export declare function createBEM(name: string): (el?: Mods | undefined, mods?: Mods | undefined) => Mods;
 export declare type BEM = ReturnType<typeof createBEM>;
+export declare function createNamespace(name: string): readonly [string, (el?: Mods | undefined, mods?: Mods | undefined) => Mods, (path: string, ...args: any[]) => any];

package/es/utils/create.js

@@ -0,0 +1,53 @@
+import { get } from './basic';
+import { camelize } from './format';
+import { isFunction } from './validate';
+import locale from '../locale';
+export function createTranslate(name) {
+  var prefix = camelize(name) + '.';
+  return (path, ...args) => {
+    var messages = locale.messages();
+    var message = get(messages, prefix + path) || get(messages, path);
+    return isFunction(message) ? message(...args) : message;
+  };
+}
+
+function genBem(name, mods) {
+  if (!mods) {
+    return '';
+  }
+
+  if (typeof mods === 'string') {
+    return " " + name + "--" + mods;
+  }
+
+  if (Array.isArray(mods)) {
+    return mods.reduce((ret, item) => ret + genBem(name, item), '');
+  }
+
+  return Object.keys(mods).reduce((ret, key) => ret + (mods[key] ? genBem(name, key) : ''), '');
+}
+/**
+ * bem helper
+ * b() // 'button'
+ * b('text') // 'button__text'
+ * b({ disabled }) // 'button button--disabled'
+ * b('text', { disabled }) // 'button__text button__text--disabled'
+ * b(['disabled', 'primary']) // 'button button--disabled button--primary'
+ */
+
+
+export function createBEM(name) {
+  return (el, mods) => {
+    if (el && typeof el !== 'string') {
+      mods = el;
+      el = '';
+    }
+
+    el = el ? name + "__" + el : name;
+    return "" + el + genBem(el, mods);
+  };
+}
+export function createNamespace(name) {
+  var prefixedName = "van-" + name;
+  return [prefixedName, createBEM(prefixedName), createTranslate(prefixedName)];
+}

package/es/utils/{dom/scroll.d.ts → dom.d.ts}

@@ -1,9 +1,12 @@
+import { Ref } from 'vue';
 export declare type ScrollElement = Element | Window;
 export declare function getScrollTop(el: ScrollElement): number;
 export declare function setScrollTop(el: ScrollElement, value: number): void;
 export declare function getRootScrollTop(): number;
 export declare function setRootScrollTop(value: number): void;
 export declare function getElementTop(el: ScrollElement, scroller?: ScrollElement): number;
-export declare function getVisibleHeight(el: ScrollElement): number;
-export declare function getVisibleTop(el: ScrollElement): number;
 export declare function resetScroll(): void;
+export declare const stopPropagation: (event: Event) => void;
+export declare function preventDefault(event: Event, isStopPropagation?: boolean): void;
+export declare function trigger(target: Element, type: string): void;
+export declare function isHidden(elementRef: HTMLElement | Ref<HTMLElement | undefined>): boolean;

package/es/utils/dom.js

@@ -0,0 +1,70 @@
+import { useRect } from '@vant/use';
+import { unref } from 'vue';
+import { isIOS as checkIsIOS } from './validate';
+export function getScrollTop(el) {
+  var top = 'scrollTop' in el ? el.scrollTop : el.pageYOffset; // iOS scroll bounce cause minus scrollTop
+
+  return Math.max(top, 0);
+}
+export function setScrollTop(el, value) {
+  if ('scrollTop' in el) {
+    el.scrollTop = value;
+  } else {
+    el.scrollTo(el.scrollX, value);
+  }
+}
+export function getRootScrollTop() {
+  return window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
+}
+export function setRootScrollTop(value) {
+  setScrollTop(window, value);
+  setScrollTop(document.body, value);
+} // get distance from element top to page top or scroller top
+
+export function getElementTop(el, scroller) {
+  if (el === window) {
+    return 0;
+  }
+
+  var scrollTop = scroller ? getScrollTop(scroller) : getRootScrollTop();
+  return useRect(el).top + scrollTop;
+}
+var isIOS = checkIsIOS(); // hack for iOS12 page scroll
+// see: https://developers.weixin.qq.com/community/develop/doc/00044ae90742f8c82fb78fcae56800
+
+export function resetScroll() {
+  if (isIOS) {
+    setRootScrollTop(getRootScrollTop());
+  }
+}
+export var stopPropagation = event => event.stopPropagation();
+export function preventDefault(event, isStopPropagation) {
+  /* istanbul ignore else */
+  if (typeof event.cancelable !== 'boolean' || event.cancelable) {
+    event.preventDefault();
+  }
+
+  if (isStopPropagation) {
+    stopPropagation(event);
+  }
+}
+export function trigger(target, type) {
+  var inputEvent = document.createEvent('HTMLEvents');
+  inputEvent.initEvent(type, true, true);
+  target.dispatchEvent(inputEvent);
+}
+export function isHidden(elementRef) {
+  var el = unref(elementRef);
+
+  if (!el) {
+    return false;
+  }
+
+  var style = window.getComputedStyle(el);
+  var hidden = style.display === 'none'; // offsetParent returns null in the following situations:
+  // 1. The element or its parent element has the display property set to none.
+  // 2. The element has the position property set to fixed
+
+  var parentHidden = el.offsetParent === null && style.position !== 'fixed';
+  return hidden || parentHidden;
+}

package/es/utils/format.d.ts

@@ -0,0 +1,12 @@
+import { CSSProperties } from 'vue';
+export declare function addUnit(value?: string | number): string | undefined;
+export declare function getSizeStyle(originSize?: string | number): CSSProperties | undefined;
+export declare function getZIndexStyle(zIndex?: string | number): CSSProperties;
+export declare function unitToPx(value: string | number): number;
+export declare const camelize: (str: string) => string;
+export declare const kebabCase: (str: string) => string;
+export declare function padZero(num: number | string, targetLength?: number): string;
+/** clamps number within the inclusive lower and upper bounds */
+export declare const clamp: (num: number, min: number, max: number) => number;
+export declare function formatNumber(value: string, allowDot?: boolean, allowMinus?: boolean): string;
+export declare function addNumber(num1: number, num2: number): number;

package/es/utils/format.js

@@ -0,0 +1,127 @@
+import { inBrowser } from './basic';
+import { isDef, isNumeric } from './validate';
+export function addUnit(value) {
+  if (!isDef(value)) {
+    return undefined;
+  }
+
+  return isNumeric(value) ? value + "px" : String(value);
+}
+export function getSizeStyle(originSize) {
+  if (isDef(originSize)) {
+    var size = addUnit(originSize);
+    return {
+      width: size,
+      height: size
+    };
+  }
+}
+export function getZIndexStyle(zIndex) {
+  var style = {};
+
+  if (zIndex !== undefined) {
+    style.zIndex = +zIndex;
+  }
+
+  return style;
+} // cache
+
+var rootFontSize;
+
+function getRootFontSize() {
+  if (!rootFontSize) {
+    var doc = document.documentElement;
+    var fontSize = doc.style.fontSize || window.getComputedStyle(doc).fontSize;
+    rootFontSize = parseFloat(fontSize);
+  }
+
+  return rootFontSize;
+}
+
+function convertRem(value) {
+  value = value.replace(/rem/g, '');
+  return +value * getRootFontSize();
+}
+
+function convertVw(value) {
+  value = value.replace(/vw/g, '');
+  return +value * window.innerWidth / 100;
+}
+
+function convertVh(value) {
+  value = value.replace(/vh/g, '');
+  return +value * window.innerHeight / 100;
+}
+
+export function unitToPx(value) {
+  if (typeof value === 'number') {
+    return value;
+  }
+
+  if (inBrowser) {
+    if (value.includes('rem')) {
+      return convertRem(value);
+    }
+
+    if (value.includes('vw')) {
+      return convertVw(value);
+    }
+
+    if (value.includes('vh')) {
+      return convertVh(value);
+    }
+  }
+
+  return parseFloat(value);
+}
+var camelizeRE = /-(\w)/g;
+export var camelize = str => str.replace(camelizeRE, (_, c) => c.toUpperCase());
+export var kebabCase = str => str.replace(/([A-Z])/g, '-$1').toLowerCase().replace(/^-/, '');
+export function padZero(num, targetLength = 2) {
+  var str = num + '';
+
+  while (str.length < targetLength) {
+    str = '0' + str;
+  }
+
+  return str;
+}
+/** clamps number within the inclusive lower and upper bounds */
+
+export var clamp = (num, min, max) => Math.min(Math.max(num, min), max);
+
+function trimExtraChar(value, char, regExp) {
+  var index = value.indexOf(char);
+
+  if (index === -1) {
+    return value;
+  }
+
+  if (char === '-' && index !== 0) {
+    return value.slice(0, index);
+  }
+
+  return value.slice(0, index + 1) + value.slice(index).replace(regExp, '');
+}
+
+export function formatNumber(value, allowDot = true, allowMinus = true) {
+  if (allowDot) {
+    value = trimExtraChar(value, '.', /\./g);
+  } else {
+    value = value.split('.')[0];
+  }
+
+  if (allowMinus) {
+    value = trimExtraChar(value, '-', /-/g);
+  } else {
+    value = value.replace(/-/, '');
+  }
+
+  var regExp = allowDot ? /[^-0-9.]/g : /[^-0-9]/g;
+  return value.replace(regExp, '');
+} // add num and avoid float number
+
+export function addNumber(num1, num2) {
+  var cardinal = Math.pow(10, 10);
+  return Math.round((num1 + num2) * cardinal) / cardinal;
+}

package/es/utils/index.d.ts

@@ -1,12 +1,9 @@
-export * from './base';
+export * from './basic';
+export * from './props';
+export * from './dom';
 export * from './create';
+export * from './format';
 export * from './constant';
 export * from './validate';
-export * from './dom/style';
-export * from './dom/event';
-export * from './dom/scroll';
 export * from './interceptor';
 export * from './with-install';
-export * from './format/unit';
-export * from './format/number';
-export * from './format/string';

package/es/utils/index.js

@@ -1,12 +1,9 @@
-export * from './base';
+export * from './basic';
+export * from './props';
+export * from './dom';
 export * from './create';
+export * from './format';
 export * from './constant';
 export * from './validate';
-export * from './dom/style';
-export * from './dom/event';
-export * from './dom/scroll';
 export * from './interceptor';
-export * from './with-install';
-export * from './format/unit';
-export * from './format/number';
-export * from './format/string';
+export * from './with-install';

package/es/utils/interceptor.d.ts

@@ -1,6 +1,5 @@
 export declare type Interceptor = (...args: any[]) => Promise<boolean> | boolean;
-export declare function callInterceptor(options: {
-    interceptor?: Interceptor;
+export declare function callInterceptor(interceptor: Interceptor | undefined, { args, done, canceled, }: {
     args?: any[];
     done: () => void;
     canceled?: () => void;

package/es/utils/interceptor.js

@@ -1,15 +1,13 @@
-import { isPromise, noop } from '.';
-export function callInterceptor(options) {
-  var {
-    interceptor,
-    args,
-    done,
-    canceled
-  } = options;
-
+import { noop } from './basic';
+import { isPromise } from './validate';
+export function callInterceptor(interceptor, {
+  args = [],
+  done,
+  canceled
+}) {
   if (interceptor) {
     // eslint-disable-next-line prefer-spread
-    var returnVal = interceptor.apply(null, args || []);
+    var returnVal = interceptor.apply(null, args);
 
     if (isPromise(returnVal)) {
       returnVal.then(value => {

package/es/utils/mount-component.js

@@ -1,4 +1,4 @@
-import { createApp, reactive, nextTick } from 'vue';
+import { createApp, reactive } from 'vue';
 import { extend } from '../utils';
 import { useExpose } from '../composables/use-expose';
 export function usePopupState() {
@@ -11,8 +11,10 @@ export function usePopupState() {
   };
 
   var open = props => {
-    extend(state, props);
-    nextTick(() => toggle(true));
+    extend(state, props, {
+      transitionAppear: true
+    });
+    toggle(true);
   };
 
   var close = () => toggle(false);

package/es/utils/props.d.ts

@@ -0,0 +1,31 @@
+/**
+ * prop type helpers
+ * help us to write less code and reduce bundle size
+ */
+import type { PropType } from 'vue';
+export declare const unknownProp: PropType<unknown>;
+export declare const numericProp: (NumberConstructor | StringConstructor)[];
+export declare const truthProp: {
+    type: BooleanConstructor;
+    default: true;
+};
+export declare const makeRequiredProp: <T>(type: T) => {
+    type: T;
+    required: true;
+};
+export declare const makeArrayProp: <T>() => {
+    type: PropType<T[]>;
+    default: () => never[];
+};
+export declare const makeNumberProp: <T>(defaultVal: T) => {
+    type: NumberConstructor;
+    default: T;
+};
+export declare const makeNumericProp: <T>(defaultVal: T) => {
+    type: (NumberConstructor | StringConstructor)[];
+    default: T;
+};
+export declare const makeStringProp: <T>(defaultVal: T) => {
+    type: PropType<T>;
+    default: T;
+};

package/es/utils/props.js

@@ -0,0 +1,30 @@
+/**
+ * prop type helpers
+ * help us to write less code and reduce bundle size
+ */
+export var unknownProp = null;
+export var numericProp = [Number, String];
+export var truthProp = {
+  type: Boolean,
+  default: true
+};
+export var makeRequiredProp = type => ({
+  type,
+  required: true
+});
+export var makeArrayProp = () => ({
+  type: Array,
+  default: () => []
+});
+export var makeNumberProp = defaultVal => ({
+  type: Number,
+  default: defaultVal
+});
+export var makeNumericProp = defaultVal => ({
+  type: numericProp,
+  default: defaultVal
+});
+export var makeStringProp = defaultVal => ({
+  type: String,
+  default: defaultVal
+});

package/es/utils/validate.d.ts

@@ -1,8 +1,8 @@
-export declare function isDef<T>(val: T): val is NonNullable<T>;
-export declare function isFunction(val: unknown): val is Function;
-export declare function isObject(val: unknown): val is Record<any, any>;
-export declare function isPromise<T = any>(val: unknown): val is Promise<T>;
-export declare function isDate(val: unknown): val is Date;
+export declare const isDef: <T>(val: T) => val is NonNullable<T>;
+export declare const isFunction: (val: unknown) => val is Function;
+export declare const isObject: (val: unknown) => val is Record<any, any>;
+export declare const isPromise: <T = any>(val: unknown) => val is Promise<T>;
+export declare const isDate: (val: unknown) => val is Date;
 export declare function isMobile(value: string): boolean;
-export declare function isNumeric(val: string | number): val is string;
-export declare function isIOS(): boolean;
+export declare const isNumeric: (val: string | number) => val is string;
+export declare const isIOS: () => boolean;

package/es/utils/validate.js

@@ -1,27 +1,13 @@
-import { inBrowser } from './base';
-export function isDef(val) {
-  return val !== undefined && val !== null;
-} // eslint-disable-next-line @typescript-eslint/ban-types
+import { inBrowser } from './basic';
+export var isDef = val => val !== undefined && val !== null; // eslint-disable-next-line @typescript-eslint/ban-types
 
-export function isFunction(val) {
-  return typeof val === 'function';
-}
-export function isObject(val) {
-  return val !== null && typeof val === 'object';
-}
-export function isPromise(val) {
-  return isObject(val) && isFunction(val.then) && isFunction(val.catch);
-}
-export function isDate(val) {
-  return Object.prototype.toString.call(val) === '[object Date]' && !Number.isNaN(val.getTime());
-}
+export var isFunction = val => typeof val === 'function';
+export var isObject = val => val !== null && typeof val === 'object';
+export var isPromise = val => isObject(val) && isFunction(val.then) && isFunction(val.catch);
+export var isDate = val => Object.prototype.toString.call(val) === '[object Date]' && !Number.isNaN(val.getTime());
 export function isMobile(value) {
   value = value.replace(/[^-|\d]/g, '');
   return /^((\+86)|(86))?(1)\d{10}$/.test(value) || /^0[0-9-]{10,13}$/.test(value);
 }
-export function isNumeric(val) {
-  return typeof val === 'number' || /^\d+(\.\d+)?$/.test(val);
-}
-export function isIOS() {
-  return inBrowser ? /ios|iphone|ipad|ipod/.test(navigator.userAgent.toLowerCase()) : false;
-}
+export var isNumeric = val => typeof val === 'number' || /^\d+(\.\d+)?$/.test(val);
+export var isIOS = () => inBrowser ? /ios|iphone|ipad|ipod/.test(navigator.userAgent.toLowerCase()) : false;

package/es/utils/with-install.js

@@ -1,4 +1,4 @@
-import { camelize } from './format/string'; // https://github.com/youzan/vant/issues/8302
+import { camelize } from './format'; // https://github.com/youzan/vant/issues/8302
 
 export function withInstall(options) {
   options.install = app => {

package/lib/action-bar/ActionBar.d.ts

@@ -8,7 +8,7 @@ declare const _default: import("vue").DefineComponent<{
     safeAreaInsetBottom?: unknown;
 } & {
     safeAreaInsetBottom: boolean;
-} & {}> & {}, {
+} & {}>, {
     safeAreaInsetBottom: boolean;
 }>;
 export default _default;

package/lib/action-bar/index.css

@@ -1 +1 @@
-:root{--van-action-bar-background-color:var(--van-white);--van-action-bar-height:50px}.van-action-bar{position:fixed;right:0;bottom:0;left:0;display:flex;align-items:center;box-sizing:content-box;height:var(--van-action-bar-height);background-color:var(--van-action-bar-background-color)}
+:root{--van-action-bar-background-color:var(--van-white);--van-action-bar-height:50px}.van-action-bar{position:fixed;right:0;bottom:0;left:0;display:flex;align-items:center;box-sizing:content-box;height:var(--van-action-bar-height);background:var(--van-action-bar-background-color)}

package/lib/action-bar/index.d.ts

@@ -7,7 +7,7 @@ export declare const ActionBar: import("../utils").WithInstall<import("vue").Def
     safeAreaInsetBottom?: unknown;
 } & {
     safeAreaInsetBottom: boolean;
-} & {}> & {}, {
+} & {}>, {
     safeAreaInsetBottom: boolean;
 }>>;
 export default ActionBar;

package/lib/action-bar/index.less

@@ -14,5 +14,5 @@
   align-items: center;
   box-sizing: content-box;
   height: var(--van-action-bar-height);
-  background-color: var(--van-action-bar-background-color);
+  background: var(--van-action-bar-background-color);
 }

package/lib/action-bar-button/ActionBarButton.d.ts

@@ -32,7 +32,7 @@ declare const _default: import("vue").DefineComponent<{
     to?: import("vue-router").RouteLocationRaw | undefined;
     color?: string | undefined;
     icon?: string | undefined;
-}> & {}, {
+}>, {
     replace: boolean;
     disabled: boolean;
     loading: boolean;

package/lib/action-bar-button/index.d.ts

@@ -30,7 +30,7 @@ export declare const ActionBarButton: import("../utils").WithInstall<import("vue
     to?: import("vue-router").RouteLocationRaw | undefined;
     color?: string | undefined;
     icon?: string | undefined;
-}> & {}, {
+}>, {
     replace: boolean;
     disabled: boolean;
     loading: boolean;

package/lib/action-bar-icon/ActionBarIcon.d.ts

@@ -33,7 +33,7 @@ declare const _default: import("vue").DefineComponent<{
     iconPrefix?: string | undefined;
     icon?: string | undefined;
     iconClass?: unknown;
-}> & {}, {
+}>, {
     replace: boolean;
     dot: boolean;
 }>;

package/lib/action-bar-icon/ActionBarIcon.js

@@ -28,7 +28,7 @@ var _default = (0, _vue.defineComponent)({
     text: String,
     icon: String,
     color: String,
-    badge: [Number, String],
+    badge: _utils.numericProp,
     iconClass: _utils.unknownProp,
     iconPrefix: String
   }),
@@ -55,7 +55,7 @@ var _default = (0, _vue.defineComponent)({
           "content": badge,
           "class": bem('icon')
         }, {
-          default: () => [slots.icon()]
+          default: slots.icon
         });
       }
 

package/lib/action-bar-icon/index.css

@@ -1 +1 @@
-:root{--van-action-bar-icon-width:48px;--van-action-bar-icon-height:100%;--van-action-bar-icon-color:var(--van-text-color);--van-action-bar-icon-size:18px;--van-action-bar-icon-font-size:var(--van-font-size-xs);--van-action-bar-icon-active-color:var(--van-active-color);--van-action-bar-icon-text-color:var(--van-gray-7);--van-action-bar-icon-background-color:var(--van-white)}.van-action-bar-icon{display:flex;flex-direction:column;justify-content:center;min-width:var(--van-action-bar-icon-width);height:var(--van-action-bar-icon-height);color:var(--van-action-bar-icon-text-color);font-size:var(--van-action-bar-icon-font-size);line-height:1;text-align:center;background-color:var(--van-action-bar-icon-background-color);cursor:pointer}.van-action-bar-icon:active{background-color:var(--van-action-bar-icon-active-color)}.van-action-bar-icon__icon{margin:0 auto var(--van-padding-base);color:var(--van-action-bar-icon-color);font-size:var(--van-action-bar-icon-size)}
+:root{--van-action-bar-icon-width:48px;--van-action-bar-icon-height:100%;--van-action-bar-icon-color:var(--van-text-color);--van-action-bar-icon-size:18px;--van-action-bar-icon-font-size:var(--van-font-size-xs);--van-action-bar-icon-active-color:var(--van-active-color);--van-action-bar-icon-text-color:var(--van-gray-7);--van-action-bar-icon-background-color:var(--van-white)}.van-action-bar-icon{display:flex;flex-direction:column;justify-content:center;min-width:var(--van-action-bar-icon-width);height:var(--van-action-bar-icon-height);color:var(--van-action-bar-icon-text-color);font-size:var(--van-action-bar-icon-font-size);line-height:1;text-align:center;background:var(--van-action-bar-icon-background-color);cursor:pointer}.van-action-bar-icon:active{background-color:var(--van-action-bar-icon-active-color)}.van-action-bar-icon__icon{margin:0 auto var(--van-padding-base);color:var(--van-action-bar-icon-color);font-size:var(--van-action-bar-icon-size)}