vant 3.3.5 → 3.4.1

package/lib/field/Field.js

@@ -1,48 +1,58 @@
-"use strict";
-
-exports.__esModule = true;
-exports.fieldSharedProps = exports.default = void 0;
-
-var _vue = require("vue");
-
-var _utils = require("../utils");
-
-var _utils2 = require("./utils");
-
-var _Cell = require("../cell/Cell");
-
-var _use = require("@vant/use");
-
-var _useId = require("../composables/use-id");
-
-var _useExpose = require("../composables/use-expose");
-
-var _icon = require("../icon");
-
-var _cell = require("../cell");
-
-// Utils
-// Composables
-// Components
-var [name, bem] = (0, _utils.createNamespace)('field'); // provide to Search component to inherit
-
-var fieldSharedProps = {
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  __markAsModule(target);
+  for (var name2 in all)
+    __defProp(target, name2, { get: all[name2], enumerable: true });
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+__export(exports, {
+  default: () => stdin_default,
+  fieldSharedProps: () => fieldSharedProps
+});
+var import_vue = __toModule(require("vue"));
+var import_vue2 = __toModule(require("vue"));
+var import_utils = __toModule(require("../utils"));
+var import_utils2 = __toModule(require("./utils"));
+var import_Cell = __toModule(require("../cell/Cell"));
+var import_use = __toModule(require("@vant/use"));
+var import_use_id = __toModule(require("../composables/use-id"));
+var import_use_expose = __toModule(require("../composables/use-expose"));
+var import_icon = __toModule(require("../icon"));
+var import_cell = __toModule(require("../cell"));
+const [name, bem] = (0, import_utils.createNamespace)("field");
+const fieldSharedProps = {
   id: String,
   name: String,
   leftIcon: String,
   rightIcon: String,
   autofocus: Boolean,
   clearable: Boolean,
-  maxlength: _utils.numericProp,
+  maxlength: import_utils.numericProp,
   formatter: Function,
-  clearIcon: (0, _utils.makeStringProp)('clear'),
-  modelValue: (0, _utils.makeNumericProp)(''),
+  clearIcon: (0, import_utils.makeStringProp)("clear"),
+  modelValue: (0, import_utils.makeNumericProp)(""),
   inputAlign: String,
   placeholder: String,
   autocomplete: String,
   errorMessage: String,
-  clearTrigger: (0, _utils.makeStringProp)('focus'),
-  formatTrigger: (0, _utils.makeStringProp)('onChange'),
+  clearTrigger: (0, import_utils.makeStringProp)("focus"),
+  formatTrigger: (0, import_utils.makeStringProp)("onChange"),
   error: {
     type: Boolean,
     default: null
@@ -56,14 +66,13 @@ var fieldSharedProps = {
     default: null
   }
 };
-exports.fieldSharedProps = fieldSharedProps;
-var fieldProps = (0, _utils.extend)({}, _Cell.cellSharedProps, fieldSharedProps, {
-  rows: _utils.numericProp,
-  type: (0, _utils.makeStringProp)('text'),
+const fieldProps = (0, import_utils.extend)({}, import_Cell.cellSharedProps, fieldSharedProps, {
+  rows: import_utils.numericProp,
+  type: (0, import_utils.makeStringProp)("text"),
   rules: Array,
   autosize: [Boolean, Object],
-  labelWidth: _utils.numericProp,
-  labelClass: _utils.unknownProp,
+  labelWidth: import_utils.numericProp,
+  labelClass: import_utils.unknownProp,
   labelAlign: String,
   showWordLimit: Boolean,
   errorMessageAlign: String,
@@ -72,460 +81,372 @@ var fieldProps = (0, _utils.extend)({}, _Cell.cellSharedProps, fieldSharedProps,
     default: null
   }
 });
-
-var _default = (0, _vue.defineComponent)({
+var stdin_default = (0, import_vue2.defineComponent)({
   name,
   props: fieldProps,
-  emits: ['blur', 'focus', 'clear', 'keypress', 'click-input', 'click-left-icon', 'click-right-icon', 'update:modelValue'],
-
-  setup(props, _ref) {
-    var {
-      emit,
-      slots
-    } = _ref;
-    var id = (0, _useId.useId)();
-    var state = (0, _vue.reactive)({
+  emits: ["blur", "focus", "clear", "keypress", "click-input", "click-left-icon", "click-right-icon", "update:modelValue"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const id = (0, import_use_id.useId)();
+    const state = (0, import_vue2.reactive)({
       focused: false,
       validateFailed: false,
-      validateMessage: ''
+      validateMessage: ""
     });
-    var inputRef = (0, _vue.ref)();
-    var customValue = (0, _vue.ref)();
-    var {
+    const inputRef = (0, import_vue2.ref)();
+    const customValue = (0, import_vue2.ref)();
+    const {
       parent: form
-    } = (0, _use.useParent)(_utils.FORM_KEY);
-
-    var getModelValue = () => {
-      var _props$modelValue;
-
-      return String((_props$modelValue = props.modelValue) != null ? _props$modelValue : '');
+    } = (0, import_use.useParent)(import_utils.FORM_KEY);
+    const getModelValue = () => {
+      var _a;
+      return String((_a = props.modelValue) != null ? _a : "");
     };
-
-    var getProp = key => {
-      if ((0, _utils.isDef)(props[key])) {
+    const getProp = (key) => {
+      if ((0, import_utils.isDef)(props[key])) {
         return props[key];
       }
-
-      if (form && (0, _utils.isDef)(form.props[key])) {
+      if (form && (0, import_utils.isDef)(form.props[key])) {
         return form.props[key];
       }
     };
-
-    var showClear = (0, _vue.computed)(() => {
-      var readonly = getProp('readonly');
-
+    const showClear = (0, import_vue2.computed)(() => {
+      const readonly = getProp("readonly");
       if (props.clearable && !readonly) {
-        var hasValue = getModelValue() !== '';
-        var trigger = props.clearTrigger === 'always' || props.clearTrigger === 'focus' && state.focused;
+        const hasValue = getModelValue() !== "";
+        const trigger = props.clearTrigger === "always" || props.clearTrigger === "focus" && state.focused;
         return hasValue && trigger;
       }
-
       return false;
     });
-    var formValue = (0, _vue.computed)(() => {
+    const formValue = (0, import_vue2.computed)(() => {
       if (customValue.value && slots.input) {
         return customValue.value();
       }
-
       return props.modelValue;
     });
-
-    var runRules = rules => rules.reduce((promise, rule) => promise.then(() => {
+    const runRules = (rules) => rules.reduce((promise, rule) => promise.then(() => {
       if (state.validateFailed) {
         return;
       }
-
-      var {
+      let {
         value
       } = formValue;
-
       if (rule.formatter) {
         value = rule.formatter(value, rule);
       }
-
-      if (!(0, _utils2.runSyncRule)(value, rule)) {
+      if (!(0, import_utils2.runSyncRule)(value, rule)) {
         state.validateFailed = true;
-        state.validateMessage = (0, _utils2.getRuleMessage)(value, rule);
+        state.validateMessage = (0, import_utils2.getRuleMessage)(value, rule);
         return;
       }
-
       if (rule.validator) {
-        return (0, _utils2.runRuleValidator)(value, rule).then(result => {
-          if (result && typeof result === 'string') {
+        return (0, import_utils2.runRuleValidator)(value, rule).then((result) => {
+          if (result && typeof result === "string") {
             state.validateFailed = true;
             state.validateMessage = result;
           } else if (result === false) {
             state.validateFailed = true;
-            state.validateMessage = (0, _utils2.getRuleMessage)(value, rule);
+            state.validateMessage = (0, import_utils2.getRuleMessage)(value, rule);
           }
         });
       }
     }), Promise.resolve());
-
-    var resetValidation = () => {
+    const resetValidation = () => {
       if (state.validateFailed) {
         state.validateFailed = false;
-        state.validateMessage = '';
+        state.validateMessage = "";
       }
     };
-
-    var validate = function (rules) {
-      if (rules === void 0) {
-        rules = props.rules;
-      }
-
-      return new Promise(resolve => {
-        resetValidation();
-
-        if (rules) {
-          runRules(rules).then(() => {
-            if (state.validateFailed) {
-              resolve({
-                name: props.name,
-                message: state.validateMessage
-              });
-            } else {
-              resolve();
-            }
-          });
-        } else {
-          resolve();
-        }
-      });
-    };
-
-    var validateWithTrigger = trigger => {
+    const validate = (rules = props.rules) => new Promise((resolve) => {
+      resetValidation();
+      if (rules) {
+        runRules(rules).then(() => {
+          if (state.validateFailed) {
+            resolve({
+              name: props.name,
+              message: state.validateMessage
+            });
+          } else {
+            resolve();
+          }
+        });
+      } else {
+        resolve();
+      }
+    });
+    const validateWithTrigger = (trigger) => {
       if (form && props.rules) {
-        var defaultTrigger = form.props.validateTrigger === trigger;
-        var rules = props.rules.filter(rule => {
+        const defaultTrigger = form.props.validateTrigger === trigger;
+        const rules = props.rules.filter((rule) => {
           if (rule.trigger) {
             return rule.trigger === trigger;
           }
-
           return defaultTrigger;
         });
-
         if (rules.length) {
           validate(rules);
         }
       }
-    }; // native maxlength have incorrect line-break counting
-    // see: https://github.com/youzan/vant/issues/5033
-
-
-    var limitValueLength = value => {
-      var {
+    };
+    const limitValueLength = (value) => {
+      const {
         maxlength
       } = props;
-
-      if ((0, _utils.isDef)(maxlength) && value.length > maxlength) {
-        var modelValue = getModelValue();
-
-        if (modelValue && modelValue.length === +maxlength) {
+      if ((0, import_utils.isDef)(maxlength) && (0, import_utils2.getStringLength)(value) > maxlength) {
+        const modelValue = getModelValue();
+        if (modelValue && (0, import_utils2.getStringLength)(modelValue) === +maxlength) {
           return modelValue;
         }
-
-        return value.slice(0, +maxlength);
+        return (0, import_utils2.cutString)(value, +maxlength);
       }
-
       return value;
     };
-
-    var updateValue = function (value, trigger) {
-      if (trigger === void 0) {
-        trigger = 'onChange';
-      }
-
+    const updateValue = (value, trigger = "onChange") => {
       value = limitValueLength(value);
-
-      if (props.type === 'number' || props.type === 'digit') {
-        var isNumber = props.type === 'number';
-        value = (0, _utils.formatNumber)(value, isNumber, isNumber);
+      if (props.type === "number" || props.type === "digit") {
+        const isNumber = props.type === "number";
+        value = (0, import_utils.formatNumber)(value, isNumber, isNumber);
       }
-
       if (props.formatter && trigger === props.formatTrigger) {
         value = props.formatter(value);
       }
-
       if (inputRef.value && inputRef.value.value !== value) {
         inputRef.value.value = value;
       }
-
       if (value !== props.modelValue) {
-        emit('update:modelValue', value);
+        emit("update:modelValue", value);
       }
     };
-
-    var onInput = event => {
-      // skip update value when composing
+    const onInput = (event) => {
       if (!event.target.composing) {
         updateValue(event.target.value);
       }
     };
-
-    var blur = () => {
-      var _inputRef$value;
-
-      return (_inputRef$value = inputRef.value) == null ? void 0 : _inputRef$value.blur();
+    const blur = () => {
+      var _a;
+      return (_a = inputRef.value) == null ? void 0 : _a.blur();
     };
-
-    var focus = () => {
-      var _inputRef$value2;
-
-      return (_inputRef$value2 = inputRef.value) == null ? void 0 : _inputRef$value2.focus();
+    const focus = () => {
+      var _a;
+      return (_a = inputRef.value) == null ? void 0 : _a.focus();
     };
-
-    var adjustTextareaSize = () => {
-      var input = inputRef.value;
-
-      if (props.type === 'textarea' && props.autosize && input) {
-        (0, _utils2.resizeTextarea)(input, props.autosize);
+    const adjustTextareaSize = () => {
+      const input = inputRef.value;
+      if (props.type === "textarea" && props.autosize && input) {
+        (0, import_utils2.resizeTextarea)(input, props.autosize);
       }
     };
-
-    var onFocus = event => {
+    const onFocus = (event) => {
       state.focused = true;
-      emit('focus', event);
-      (0, _vue.nextTick)(adjustTextareaSize); // readonly not work in legacy mobile safari
-
-      if (getProp('readonly')) {
+      emit("focus", event);
+      (0, import_vue2.nextTick)(adjustTextareaSize);
+      if (getProp("readonly")) {
         blur();
       }
     };
-
-    var onBlur = event => {
-      if (getProp('readonly')) {
+    const onBlur = (event) => {
+      if (getProp("readonly")) {
         return;
       }
-
       state.focused = false;
-      updateValue(getModelValue(), 'onBlur');
-      emit('blur', event);
-      validateWithTrigger('onBlur');
-      (0, _vue.nextTick)(adjustTextareaSize);
-      (0, _utils.resetScroll)();
+      updateValue(getModelValue(), "onBlur");
+      emit("blur", event);
+      validateWithTrigger("onBlur");
+      (0, import_vue2.nextTick)(adjustTextareaSize);
+      (0, import_utils.resetScroll)();
     };
-
-    var onClickInput = event => emit('click-input', event);
-
-    var onClickLeftIcon = event => emit('click-left-icon', event);
-
-    var onClickRightIcon = event => emit('click-right-icon', event);
-
-    var onClear = event => {
-      (0, _utils.preventDefault)(event);
-      emit('update:modelValue', '');
-      emit('clear', event);
+    const onClickInput = (event) => emit("click-input", event);
+    const onClickLeftIcon = (event) => emit("click-left-icon", event);
+    const onClickRightIcon = (event) => emit("click-right-icon", event);
+    const onClear = (event) => {
+      (0, import_utils.preventDefault)(event);
+      emit("update:modelValue", "");
+      emit("clear", event);
     };
-
-    var showError = (0, _vue.computed)(() => {
-      if (typeof props.error === 'boolean') {
+    const showError = (0, import_vue2.computed)(() => {
+      if (typeof props.error === "boolean") {
         return props.error;
       }
-
       if (form && form.props.showError && state.validateFailed) {
         return true;
       }
     });
-    var labelStyle = (0, _vue.computed)(() => {
-      var labelWidth = getProp('labelWidth');
-
+    const labelStyle = (0, import_vue2.computed)(() => {
+      const labelWidth = getProp("labelWidth");
       if (labelWidth) {
         return {
-          width: (0, _utils.addUnit)(labelWidth)
+          width: (0, import_utils.addUnit)(labelWidth)
         };
       }
     });
-
-    var onKeypress = event => {
-      var ENTER_CODE = 13;
-
+    const onKeypress = (event) => {
+      const ENTER_CODE = 13;
       if (event.keyCode === ENTER_CODE) {
-        var submitOnEnter = form && form.props.submitOnEnter;
-
-        if (!submitOnEnter && props.type !== 'textarea') {
-          (0, _utils.preventDefault)(event);
-        } // trigger blur after click keyboard search button
-
-
-        if (props.type === 'search') {
+        const submitOnEnter = form && form.props.submitOnEnter;
+        if (!submitOnEnter && props.type !== "textarea") {
+          (0, import_utils.preventDefault)(event);
+        }
+        if (props.type === "search") {
           blur();
         }
       }
-
-      emit('keypress', event);
+      emit("keypress", event);
     };
-
-    var getInputId = () => props.id || id + "-input";
-
-    var renderInput = () => {
-      var controlClass = bem('control', [getProp('inputAlign'), {
+    const getInputId = () => props.id || `${id}-input`;
+    const renderInput = () => {
+      const controlClass = bem("control", [getProp("inputAlign"), {
         error: showError.value,
         custom: !!slots.input,
-        'min-height': props.type === 'textarea' && !props.autosize
+        "min-height": props.type === "textarea" && !props.autosize
       }]);
-
       if (slots.input) {
-        return (0, _vue.createVNode)("div", {
+        return (0, import_vue.createVNode)("div", {
           "class": controlClass,
           "onClick": onClickInput
         }, [slots.input()]);
       }
-
-      var inputAttrs = {
+      const inputAttrs = {
         id: getInputId(),
         ref: inputRef,
         name: props.name,
-        rows: props.rows !== undefined ? +props.rows : undefined,
+        rows: props.rows !== void 0 ? +props.rows : void 0,
         class: controlClass,
         value: props.modelValue,
-        disabled: getProp('disabled'),
-        readonly: getProp('readonly'),
+        disabled: getProp("disabled"),
+        readonly: getProp("readonly"),
         autofocus: props.autofocus,
         placeholder: props.placeholder,
         autocomplete: props.autocomplete,
-        'aria-labelledby': props.label ? id + "-label" : undefined,
+        "aria-labelledby": props.label ? `${id}-label` : void 0,
         onBlur,
         onFocus,
         onInput,
         onClick: onClickInput,
-        onChange: _utils2.endComposing,
+        onChange: import_utils2.endComposing,
         onKeypress,
-        onCompositionend: _utils2.endComposing,
-        onCompositionstart: _utils2.startComposing
+        onCompositionend: import_utils2.endComposing,
+        onCompositionstart: import_utils2.startComposing
       };
-
-      if (props.type === 'textarea') {
-        return (0, _vue.createVNode)("textarea", inputAttrs, null);
+      if (props.type === "textarea") {
+        return (0, import_vue.createVNode)("textarea", inputAttrs, null);
       }
-
-      return (0, _vue.createVNode)("input", (0, _vue.mergeProps)((0, _utils2.mapInputType)(props.type), inputAttrs), null);
+      return (0, import_vue.createVNode)("input", (0, import_vue.mergeProps)((0, import_utils2.mapInputType)(props.type), inputAttrs), null);
     };
-
-    var renderLeftIcon = () => {
-      var leftIconSlot = slots['left-icon'];
-
+    const renderLeftIcon = () => {
+      const leftIconSlot = slots["left-icon"];
       if (props.leftIcon || leftIconSlot) {
-        return (0, _vue.createVNode)("div", {
-          "class": bem('left-icon'),
+        return (0, import_vue.createVNode)("div", {
+          "class": bem("left-icon"),
           "onClick": onClickLeftIcon
-        }, [leftIconSlot ? leftIconSlot() : (0, _vue.createVNode)(_icon.Icon, {
+        }, [leftIconSlot ? leftIconSlot() : (0, import_vue.createVNode)(import_icon.Icon, {
           "name": props.leftIcon,
           "classPrefix": props.iconPrefix
         }, null)]);
       }
     };
-
-    var renderRightIcon = () => {
-      var rightIconSlot = slots['right-icon'];
-
+    const renderRightIcon = () => {
+      const rightIconSlot = slots["right-icon"];
       if (props.rightIcon || rightIconSlot) {
-        return (0, _vue.createVNode)("div", {
-          "class": bem('right-icon'),
+        return (0, import_vue.createVNode)("div", {
+          "class": bem("right-icon"),
           "onClick": onClickRightIcon
-        }, [rightIconSlot ? rightIconSlot() : (0, _vue.createVNode)(_icon.Icon, {
+        }, [rightIconSlot ? rightIconSlot() : (0, import_vue.createVNode)(import_icon.Icon, {
           "name": props.rightIcon,
           "classPrefix": props.iconPrefix
         }, null)]);
       }
     };
-
-    var renderWordLimit = () => {
+    const renderWordLimit = () => {
       if (props.showWordLimit && props.maxlength) {
-        var count = getModelValue().length;
-        return (0, _vue.createVNode)("div", {
-          "class": bem('word-limit')
-        }, [(0, _vue.createVNode)("span", {
-          "class": bem('word-num')
-        }, [count]), (0, _vue.createTextVNode)("/"), props.maxlength]);
+        const count = (0, import_utils2.getStringLength)(getModelValue());
+        return (0, import_vue.createVNode)("div", {
+          "class": bem("word-limit")
+        }, [(0, import_vue.createVNode)("span", {
+          "class": bem("word-num")
+        }, [count]), (0, import_vue.createTextVNode)("/"), props.maxlength]);
       }
     };
-
-    var renderMessage = () => {
+    const renderMessage = () => {
       if (form && form.props.showErrorMessage === false) {
         return;
       }
-
-      var message = props.errorMessage || state.validateMessage;
-
+      const message = props.errorMessage || state.validateMessage;
       if (message) {
-        var slot = slots['error-message'];
-        var errorMessageAlign = getProp('errorMessageAlign');
-        return (0, _vue.createVNode)("div", {
-          "class": bem('error-message', errorMessageAlign)
+        const slot = slots["error-message"];
+        const errorMessageAlign = getProp("errorMessageAlign");
+        return (0, import_vue.createVNode)("div", {
+          "class": bem("error-message", errorMessageAlign)
         }, [slot ? slot({
           message
         }) : message]);
       }
     };
-
-    var renderLabel = () => {
-      var colon = getProp('colon') ? ':' : '';
-
+    const renderLabel = () => {
+      const colon = getProp("colon") ? ":" : "";
       if (slots.label) {
         return [slots.label(), colon];
       }
-
       if (props.label) {
-        return (0, _vue.createVNode)("label", {
-          "id": id + "-label",
+        return (0, import_vue.createVNode)("label", {
+          "id": `${id}-label`,
           "for": getInputId()
         }, [props.label + colon]);
       }
     };
-
-    var renderFieldBody = () => [(0, _vue.createVNode)("div", {
-      "class": bem('body')
-    }, [renderInput(), showClear.value && (0, _vue.createVNode)(_icon.Icon, {
+    const renderFieldBody = () => [(0, import_vue.createVNode)("div", {
+      "class": bem("body")
+    }, [renderInput(), showClear.value && (0, import_vue.createVNode)(import_icon.Icon, {
       "name": props.clearIcon,
-      "class": bem('clear'),
+      "class": bem("clear"),
       "onTouchstart": onClear
-    }, null), renderRightIcon(), slots.button && (0, _vue.createVNode)("div", {
-      "class": bem('button')
+    }, null), renderRightIcon(), slots.button && (0, import_vue.createVNode)("div", {
+      "class": bem("button")
     }, [slots.button()])]), renderWordLimit(), renderMessage()];
-
-    (0, _useExpose.useExpose)({
+    (0, import_use_expose.useExpose)({
       blur,
       focus,
       validate,
       formValue,
       resetValidation
     });
-    (0, _vue.provide)(_use.CUSTOM_FIELD_INJECTION_KEY, {
+    (0, import_vue2.provide)(import_use.CUSTOM_FIELD_INJECTION_KEY, {
       customValue,
       resetValidation,
       validateWithTrigger
     });
-    (0, _vue.watch)(() => props.modelValue, () => {
+    (0, import_vue2.watch)(() => props.modelValue, () => {
       updateValue(getModelValue());
       resetValidation();
-      validateWithTrigger('onChange');
-      (0, _vue.nextTick)(adjustTextareaSize);
+      validateWithTrigger("onChange");
+      (0, import_vue2.nextTick)(adjustTextareaSize);
     });
-    (0, _vue.onMounted)(() => {
+    (0, import_vue2.onMounted)(() => {
       updateValue(getModelValue(), props.formatTrigger);
-      (0, _vue.nextTick)(adjustTextareaSize);
+      (0, import_vue2.nextTick)(adjustTextareaSize);
     });
     return () => {
-      var disabled = getProp('disabled');
-      var labelAlign = getProp('labelAlign');
-      var Label = renderLabel();
-      var LeftIcon = renderLeftIcon();
-      return (0, _vue.createVNode)(_cell.Cell, {
+      const disabled = getProp("disabled");
+      const labelAlign = getProp("labelAlign");
+      const Label = renderLabel();
+      const LeftIcon = renderLeftIcon();
+      return (0, import_vue.createVNode)(import_cell.Cell, {
         "size": props.size,
         "icon": props.leftIcon,
         "class": bem({
           error: showError.value,
           disabled,
-          ["label-" + labelAlign]: labelAlign
+          [`label-${labelAlign}`]: labelAlign
         }),
         "center": props.center,
         "border": props.border,
         "isLink": props.isLink,
         "clickable": props.clickable,
         "titleStyle": labelStyle.value,
-        "valueClass": bem('value'),
-        "titleClass": [bem('label', [labelAlign, {
+        "valueClass": bem("value"),
+        "titleClass": [bem("label", [labelAlign, {
           required: props.required
         }]), props.labelClass],
         "arrowDirection": props.arrowDirection
@@ -537,7 +458,4 @@ var _default = (0, _vue.defineComponent)({
       });
     };
   }
-
 });
-
-exports.default = _default;