@touchvue/ui 1.0.0-beta.5 → 1.0.0-beta.51

package/lib/packages/components/input/src/input.vue2.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
-var index$1 = require('../../button/index.js');
-var index = require('../../icon/index.js');
+var index$2 = require('../../button/index.js');
+var index$1 = require('../../icon/index.js');
 var dis = require('../../../directives/dis/src/dis.js');
 var tip = require('../../../directives/tip/src/tip.js');
-var index$2 = require('../../../locale/index.js');
+var index = require('../../../locale/index.js');
 
 const __default__ = vue.defineComponent({
   name: "ToInput"
@@ -15,6 +15,12 @@ const __default__ = vue.defineComponent({
 var _sfc_main = /* @__PURE__ */ vue.defineComponent({
   ...__default__,
   props: {
+    flex: Boolean,
+    // 是否自动获取焦点
+    autofocus: {
+      type: Boolean,
+      default: false
+    },
     desc: {
       type: String,
       default: ""
@@ -49,12 +55,16 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     },
     placeholder: {
       type: String,
-      default: "\u8BF7\u8F93\u5165"
+      default: ""
     },
     type: {
       type: String,
       default: "text"
     },
+    icon: {
+      type: String,
+      default: ""
+    },
     tabindex: {
       type: String,
       default: "1"
@@ -93,7 +103,7 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     },
     spChars: {
       type: [String, Boolean],
-      default: '/,\\,[,],{,},"'
+      default: ""
     },
     prefix: {
       type: String,
@@ -117,7 +127,7 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     },
     clearable: {
       type: Boolean,
-      default: false
+      default: true
     },
     preventFocus: {
       type: Boolean,
@@ -139,14 +149,6 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
       type: Boolean,
       default: true
     },
-    fillet: {
-      type: String,
-      default: "normal"
-    },
-    filletPosition: {
-      type: String,
-      default: ""
-    },
     color: {
       type: String,
       default: "default"
@@ -157,7 +159,7 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     },
     mode: {
       type: String,
-      default: ""
+      default: "default"
     },
     width: {
       type: [Number, String],
@@ -175,19 +177,18 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
       type: [String, Number],
       default: 0
     },
-    value: {
-      type: [String, Number],
-      default: () => {
-        return "";
-      }
-    },
     readonly: {
       type: Boolean,
       default: false
+    },
+    count: {
+      type: Boolean,
+      default: false
     }
   },
-  emits: ["update:modelValue", "click", "clear", "input", "keyup", "change", "keydown", "cut", "paste", "keypress", "focus", "blur"],
+  emits: ["update:modelValue", "click", "clear", "input", "keyup", "change", "keydown", "cut", "paste", "keypress", "focus", "blur", "enter", "ctrlenter"],
   setup(__props, { expose: __expose, emit: __emit }) {
+    const ins = vue.getCurrentInstance();
     const props = __props;
     const emit = __emit;
     const ToForm = vue.inject("ToForm", {});
@@ -200,12 +201,14 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const clearVisible = vue.ref(false);
     const itype = vue.ref("text");
     const disabled = vue.ref(props.disabled);
+    const inputRef = vue.ref(null);
     vue.watch(
       () => props.modelValue,
       (val) => {
+        clearVisible.value = !!val;
         data.value = val;
       },
-      { immediate: true }
+      { immediate: true, deep: true }
     );
     vue.watch(
       () => props.type,
@@ -238,6 +241,7 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
             }
             let pre = data.value.substring(0, data.value.indexOf("."));
             let suf = data.value.substring(data.value.indexOf(".") + 1);
+            suf = suf.replace(/[/.]/g, "").substring(0, Number(props.dot));
             data.value = `${pre}.${suf}`;
           }
           if (Number(data.value) < Number(props.min)) {
@@ -246,7 +250,17 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
           if (Number(data.value) > Number(props.max)) {
             data.value = props.max;
           }
+          if (String(data.value).length > Number(props.maxlength)) {
+            data.value = Number(String(data.value).slice(0, Number(props.maxlength)));
+          }
         }
+        if (iSpChars.value) {
+          const filterData = filter(iSpChars.value, val);
+          if (filterData !== false) {
+            data.value = filterData;
+          }
+        }
+        emit("update:modelValue", data.value);
       }
     );
     vue.watch(
@@ -261,23 +275,69 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
         errorTip.value = val;
       }
     );
+    vue.watch(
+      () => props.autofocus,
+      (val) => {
+        if (val) {
+          focusInput();
+        }
+      }
+    );
+    const filter = (chars, from) => {
+      if (chars && from) {
+        const check = new RegExp(
+          `[${chars.split(",").map((char) => "\\" + char).join("")}]+`,
+          ""
+        );
+        const reg = new RegExp(
+          `[${chars.split(",").map((char) => "\\" + char).join("")}]*`,
+          "g"
+        );
+        if (check.test(from)) {
+          return from.replace(reg, "");
+        } else {
+          return false;
+        }
+      } else {
+        return false;
+      }
+    };
+    const focusInput = () => {
+      if (inputRef.value) {
+        try {
+          if (!inputRef.value.disabled) {
+            setTimeout(() => {
+              var _a;
+              (_a = inputRef.value) == null ? void 0 : _a.focus();
+            }, 100);
+          }
+        } catch (error) {
+          console.error("\u8F93\u5165\u6846\u805A\u7126\u5931\u8D25:", error);
+        }
+      }
+    };
     vue.onMounted(() => {
-      data.value = props.step ? 0 : props.value || props.modelValue;
+      data.value = props.modelValue;
       itype.value = props.type;
+      if (props.autofocus) {
+        vue.nextTick(() => {
+          focusInput();
+        });
+      }
     });
     const iPlaceholder = vue.computed(() => {
-      if (!disabled.value && !props.placeholder && props.placeholder !== "") {
-        return "\u8BF7\u586B\u5199";
+      if (!disabled.value && !props.placeholder) {
+        return index.t("to.common.placeholder.input");
       } else {
         return props.placeholder;
       }
     });
-    const iconMode = vue.computed(() => {
-      if (props.mode === "none" || props.mode === "line" || focused.value)
-        return "none";
-      if (props.mode === "fill")
-        return "fill";
-      return "plain";
+    const iSpChars = vue.computed(() => {
+      var _a, _b, _c;
+      if (props.spChars) {
+        return props.spChars;
+      }
+      return (_c = (_b = (_a = ins.appContext.config.globalProperties.$TouchUI) == null ? void 0 : _a.input) == null ? void 0 : _b.spChars) != null ? _c : '/,\\,[,],{,},"';
     });
     const setClass = vue.computed(() => {
       const arr = ["to-form-readonly"];
@@ -287,7 +347,9 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
         arr.push("to-input-tip-show");
       } else {
         if (props.mode) {
-          arr.push(`mode-${props.mode}`);
+          for (let i = 0; i < props.mode.split(" ").length; i++) {
+            arr.push(`mode-${props.mode.split(" ")[i]}`);
+          }
         }
         if (props.type) {
           arr.push(`type-${props.type}`);
@@ -305,14 +367,11 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
           arr.push("is-link");
         }
         if (props.type === "textarea" && (typeof props.height === "number" || Number(props.height) > 1)) {
-          arr.push(`to-input-height-${props.height}`);
+          arr.push(`height-${props.height}`);
         }
         if (props.step) {
           arr.push("is-step");
         }
-        if (props.type === "textarea" && props.clearable) {
-          arr.push("is-clearable");
-        }
         if (ToForm && ToForm.comparable || props.comparable) {
           arr.push("to-compare");
         }
@@ -329,11 +388,6 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
           obj.width = props.width + "em";
         }
       }
-      if (props.height) {
-        if (!isNaN(Number(props.height))) {
-          obj.height = props.height + "em";
-        }
-      }
       return obj;
     });
     const changed = vue.computed(() => {
@@ -363,18 +417,24 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
         return "";
       }
     });
+    const getDataLength = vue.computed(() => {
+      if (data.value || data.value === 0) {
+        return String(data.value).length;
+      } else {
+        return 0;
+      }
+    });
     const setDisabled = (f) => {
       disabled.value = f;
     };
-    const inputRef = vue.ref(null);
-    function inputKeyup() {
-      emit("keyup", data.value);
+    function inputKeyup(e) {
+      emit("keyup", data.value, e);
     }
     function inputChange() {
       emit("change", data.value);
     }
-    function inputKeydown() {
-      emit("keydown", data.value);
+    function inputKeydown(e) {
+      emit("keydown", data.value, e);
     }
     function inputCut() {
       emit("cut", data.value);
@@ -398,12 +458,17 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     function inputPaste() {
       emit("paste", data.value);
     }
-    function inputKeyPress() {
-      emit("keypress", data.value);
+    function inputKeyPress(e) {
+      emit("keypress", data.value, e);
     }
     function inputInput() {
       emit("input", data.value);
-      emit("update:modelValue", data.value);
+    }
+    function inputEnter() {
+      emit("enter", data.value);
+    }
+    function inputCtrlEnter() {
+      emit("ctrlenter", data.value);
     }
     function clear() {
       data.value = "";
@@ -419,8 +484,8 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     function addSuggestion(item) {
       data.value += item;
     }
-    function click() {
-      emit("click");
+    function click(e) {
+      emit("click", e);
     }
     function compare() {
       valueStore.value.unshift(data.value);
@@ -435,12 +500,15 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
       changed,
       setDisabled,
       errorTip,
-      errorType
+      errorType,
+      focus: focusInput
     });
     return (_ctx, _cache) => {
       const _directive_color = vue.resolveDirective("color");
       return vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", {
         id: __props.id,
+        key: vue.unref(index.langKey),
+        flex: __props.flex ? __props.flex : null,
         class: vue.normalizeClass(["to-input", setClass.value]),
         style: vue.normalizeStyle(setStyle.value),
         onClick: click
@@ -455,155 +523,277 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
           value: data.value
         }, null, 8, ["trim", "req", "desc", "rule", "value"])), [
           [vue.vShow, false]
-        ]) : vue.createCommentVNode("", true),
-        props.prefix || _ctx.$slots.prefix || props.step ? (vue.openBlock(), vue.createElementBlock("span", {
-          key: 1,
-          class: "to-input-prefix"
-        }, [
-          vue.renderSlot(_ctx.$slots, "prefix"),
-          props.prefix ? (vue.openBlock(), vue.createElementBlock("span", {
+        ]) : vue.createCommentVNode("v-if", true),
+        vue.createElementVNode("span", { class: "to-input-wrapper" }, [
+          props.step ? vue.withDirectives((vue.openBlock(), vue.createBlock(vue.unref(index$1.ToIcon), {
             key: 0,
-            class: "to-input-text"
-          }, vue.toDisplayString(props.prefix), 1)) : vue.createCommentVNode("", true),
-          props.step ? vue.withDirectives((vue.openBlock(), vue.createBlock(vue.unref(index.ToIcon), {
-            key: 1,
             class: "to-input-decrease",
-            value: props.stepIconMode ? "unfold" : "reduce",
+            value: props.stepIconMode ? "expand" : "reduce",
             link: "",
             onMousedown: reduce
           }, null, 8, ["value"])), [
             [vue.unref(dis.default), Number(data.value) === Number(props.min) || props.disabled]
-          ]) : vue.createCommentVNode("", true)
-        ])) : vue.createCommentVNode("", true),
-        props.type === "textarea" ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("textarea", {
-          key: 2,
-          ref_key: "inputRef",
-          ref: inputRef,
-          "onUpdate:modelValue": ($event) => data.value = $event,
-          class: "to-input-textarea",
-          autocomplete: props.autocomplete ? "on" : "new-password",
-          maxlength: props.maxlength,
-          placeholder: iPlaceholder.value,
-          disabled: disabled.value,
-          readonly: __props.readonly,
-          tabindex: props.tabindex,
-          onKeyup: inputKeyup,
-          onKeydown: inputKeydown,
-          onCut: inputCut,
-          onFocus: inputFocus,
-          onBlur: inputBlur,
-          onPaste: inputPaste,
-          onKeypress: inputKeyPress
-        }, null, 40, ["onUpdate:modelValue", "autocomplete", "maxlength", "placeholder", "disabled", "readonly", "tabindex"])), [
-          [vue.vModelText, data.value]
-        ]) : props.type === "html" ? (vue.openBlock(), vue.createElementBlock("span", {
-          key: 3,
-          class: "to-input-html"
-        }, [
-          vue.createTextVNode(vue.toDisplayString(props.html) + " ", 1),
-          vue.renderSlot(_ctx.$slots, "html")
-        ])) : vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
-          key: 4,
-          ref_key: "inputRef",
-          ref: inputRef,
-          "onUpdate:modelValue": ($event) => data.value = $event,
-          class: "to-input-content",
-          autocomplete: props.autocomplete ? "on" : "new-password",
-          tabindex: props.tabindex,
-          maxlength: props.maxlength,
-          placeholder: iPlaceholder.value,
-          type: itype.value,
-          disabled: disabled.value,
-          readonly: __props.readonly,
-          onKeyup: inputKeyup,
-          onKeydown: inputKeydown,
-          onCut: inputCut,
-          onFocus: inputFocus,
-          onBlur: inputBlur,
-          onPaste: inputPaste,
-          onKeypress: inputKeyPress,
-          onChange: inputChange,
-          onInput: inputInput
-        }, null, 40, ["onUpdate:modelValue", "autocomplete", "tabindex", "maxlength", "placeholder", "type", "disabled", "readonly"])), [
-          [vue.vModelDynamic, data.value]
-        ]),
-        props.clearable || props.suggestion || _ctx.$slots.default || _ctx.$slots.suffix || props.suffix || props.step ? (vue.openBlock(), vue.createElementBlock("span", {
-          key: 5,
-          class: "to-input-suffix"
-        }, [
-          !props.disabled && props.clearable ? vue.withDirectives((vue.openBlock(), vue.createBlock(vue.unref(index.ToIcon), {
-            key: 0,
-            class: "to-input-clear",
-            mode: iconMode.value,
-            link: "",
-            value: "close",
-            onClick: vue.withModifiers(clear, ["stop"])
-          }, null, 8, ["mode"])), [
-            [vue.vShow, clearVisible.value]
-          ]) : vue.createCommentVNode("", true),
-          props.step ? vue.withDirectives((vue.openBlock(), vue.createBlock(vue.unref(index.ToIcon), {
+          ]) : vue.createCommentVNode("v-if", true),
+          vue.createCommentVNode(" \u524D\u7F00 "),
+          _ctx.$slots.prefix || props.step ? (vue.openBlock(), vue.createElementBlock("span", {
             key: 1,
+            class: "to-input-prefix"
+          }, [
+            vue.renderSlot(_ctx.$slots, "prefix")
+          ])) : vue.createCommentVNode("v-if", true),
+          props.prefix ? (vue.openBlock(), vue.createElementBlock("span", {
+            key: 2,
+            class: "to-input-prefix-text"
+          }, [
+            vue.createElementVNode(
+              "span",
+              null,
+              vue.toDisplayString(props.prefix),
+              1
+              /* TEXT */
+            )
+          ])) : vue.createCommentVNode("v-if", true),
+          vue.createCommentVNode(" \u8F93\u5165\u6846\u90E8\u5206 "),
+          props.type === "textarea" ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("textarea", {
+            key: 3,
+            ref_key: "inputRef",
+            ref: inputRef,
+            "onUpdate:modelValue": ($event) => data.value = $event,
+            class: "to-input-textarea",
+            autocomplete: props.autocomplete ? "on" : "new-password",
+            maxlength: props.maxlength,
+            placeholder: iPlaceholder.value,
+            disabled: props.disabled,
+            readonly: __props.readonly,
+            tabindex: props.tabindex,
+            onKeyup: inputKeyup,
+            onKeydown: [
+              vue.withModifiers(inputKeydown, ["exact"]),
+              vue.withKeys(vue.withModifiers(inputEnter, ["exact"]), ["enter"]),
+              vue.withKeys(vue.withModifiers(inputCtrlEnter, ["ctrl", "exact"]), ["enter"]),
+              vue.withKeys(vue.withModifiers(inputCtrlEnter, ["meta", "exact"]), ["enter"])
+            ],
+            onCut: inputCut,
+            onFocus: inputFocus,
+            onBlur: inputBlur,
+            onPaste: inputPaste,
+            onKeypress: inputKeyPress,
+            onChange: inputChange,
+            onInput: inputInput
+          }, null, 40, ["onUpdate:modelValue", "autocomplete", "maxlength", "placeholder", "disabled", "readonly", "tabindex", "onKeydown"])), [
+            [vue.vModelText, data.value]
+          ]) : props.type === "html" ? (vue.openBlock(), vue.createElementBlock("span", {
+            key: 4,
+            class: "to-input-html"
+          }, [
+            vue.createTextVNode(
+              vue.toDisplayString(props.html) + " ",
+              1
+              /* TEXT */
+            ),
+            vue.renderSlot(_ctx.$slots, "html")
+          ])) : (vue.openBlock(), vue.createElementBlock("span", {
+            key: 5,
+            class: "to-input-content"
+          }, [
+            __props.icon ? (vue.openBlock(), vue.createBlock(vue.unref(index$1.ToIcon), {
+              key: 0,
+              value: __props.icon,
+              class: "to-input-icon"
+            }, null, 8, ["value"])) : vue.createCommentVNode("v-if", true),
+            vue.withDirectives(vue.createElementVNode("input", {
+              ref_key: "inputRef",
+              ref: inputRef,
+              "onUpdate:modelValue": ($event) => data.value = $event,
+              class: "to-input-box",
+              autocomplete: props.autocomplete ? "on" : "new-password",
+              tabindex: props.tabindex,
+              maxlength: props.maxlength,
+              placeholder: iPlaceholder.value,
+              type: itype.value,
+              disabled: props.disabled,
+              readonly: __props.readonly,
+              onKeyup: inputKeyup,
+              onKeydown: [
+                vue.withModifiers(inputKeydown, ["exact"]),
+                vue.withKeys(vue.withModifiers(inputEnter, ["exact"]), ["enter"]),
+                vue.withKeys(vue.withModifiers(inputCtrlEnter, ["ctrl", "exact"]), ["enter"]),
+                vue.withKeys(vue.withModifiers(inputCtrlEnter, ["meta", "exact"]), ["enter"])
+              ],
+              onCut: inputCut,
+              onFocus: inputFocus,
+              onBlur: inputBlur,
+              onPaste: inputPaste,
+              onKeypress: inputKeyPress,
+              onChange: inputChange,
+              onInput: inputInput
+            }, null, 40, ["onUpdate:modelValue", "autocomplete", "tabindex", "maxlength", "placeholder", "type", "disabled", "readonly", "onKeydown"]), [
+              [vue.vModelDynamic, data.value]
+            ])
+          ])),
+          !props.disabled && props.clearable && !props.step ? vue.withDirectives((vue.openBlock(), vue.createBlock(
+            vue.unref(index$1.ToIcon),
+            {
+              key: 6,
+              class: "to-input-clear",
+              link: "",
+              value: "close",
+              onClick: vue.withModifiers(clear, ["stop"])
+            },
+            null,
+            512
+            /* NEED_PATCH */
+          )), [
+            [vue.vShow, clearVisible.value]
+          ]) : vue.createCommentVNode("v-if", true),
+          props.maxlength !== Infinity && props.count && props.type !== "textarea" ? (vue.openBlock(), vue.createElementBlock("span", {
+            key: 7,
+            class: "to-input-count"
+          }, [
+            vue.createElementVNode(
+              "span",
+              { class: "to-input-count-text" },
+              vue.toDisplayString(getDataLength.value) + "/" + vue.toDisplayString(props.maxlength),
+              1
+              /* TEXT */
+            )
+          ])) : vue.createCommentVNode("v-if", true),
+          vue.createCommentVNode(" \u540E\u7F00\u533A "),
+          props.suffix ? (vue.openBlock(), vue.createElementBlock("span", {
+            key: 8,
+            class: "to-input-suffix-text"
+          }, [
+            vue.createElementVNode(
+              "span",
+              null,
+              vue.toDisplayString(props.suffix),
+              1
+              /* TEXT */
+            )
+          ])) : vue.createCommentVNode("v-if", true),
+          (props.suggestion || _ctx.$slots.default || _ctx.$slots.suffix || props.step) && __props.type !== "textarea" ? (vue.openBlock(), vue.createElementBlock("span", {
+            key: 9,
+            class: "to-input-suffix"
+          }, [
+            vue.renderSlot(_ctx.$slots, "default"),
+            vue.renderSlot(_ctx.$slots, "suffix")
+          ])) : vue.createCommentVNode("v-if", true),
+          props.step ? vue.withDirectives((vue.openBlock(), vue.createBlock(vue.unref(index$1.ToIcon), {
+            key: 10,
             class: "to-input-increase",
-            value: props.stepIconMode ? "fold" : "add",
+            value: props.stepIconMode ? "collapse" : "add",
             link: "",
             onMousedown: increase
           }, null, 8, ["value"])), [
             [vue.unref(dis.default), Number(data.value) === Number(props.max) || props.disabled]
-          ]) : vue.createCommentVNode("", true),
-          props.suffix ? (vue.openBlock(), vue.createElementBlock("span", {
-            key: 2,
-            class: "to-input-text"
-          }, vue.toDisplayString(props.suffix), 1)) : vue.createCommentVNode("", true),
-          vue.renderSlot(_ctx.$slots, "suffix"),
-          vue.renderSlot(_ctx.$slots, "default"),
+          ]) : vue.createCommentVNode("v-if", true)
+        ]),
+        props.type === "textarea" && (props.maxlength !== Infinity && props.count || _ctx.$slots.suffix || _ctx.$slots.default || props.suggestion) ? (vue.openBlock(), vue.createElementBlock("span", {
+          key: 1,
+          class: "to-input-suffix"
+        }, [
+          props.maxlength !== Infinity && props.count ? (vue.openBlock(), vue.createElementBlock("span", {
+            key: 0,
+            class: "to-input-count"
+          }, [
+            vue.createElementVNode(
+              "span",
+              { class: "to-input-count-text" },
+              vue.toDisplayString(getDataLength.value) + "/" + vue.toDisplayString(props.maxlength),
+              1
+              /* TEXT */
+            )
+          ])) : vue.createCommentVNode("v-if", true),
+          _ctx.$slots.suffix || _ctx.$slots.default ? (vue.openBlock(), vue.createElementBlock("span", {
+            key: 1,
+            class: "to-input-suffix-slot"
+          }, [
+            __props.type === "textarea" ? vue.renderSlot(_ctx.$slots, "default", { key: 0 }) : vue.createCommentVNode("v-if", true),
+            __props.type === "textarea" ? vue.renderSlot(_ctx.$slots, "suffix", { key: 1 }) : vue.createCommentVNode("v-if", true)
+          ])) : vue.createCommentVNode("v-if", true),
           props.suggestion ? (vue.openBlock(), vue.createElementBlock("span", {
-            key: 3,
+            key: 2,
             class: "to-input-suggestion"
           }, [
-            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(props.suggestion.split(","), (item, i) => {
-              return vue.openBlock(), vue.createBlock(vue.unref(index$1.ToButton), {
-                key: i,
-                fillet: "normal",
-                color: "info",
-                mode: "text",
-                onClick: ($event) => addSuggestion(item)
-              }, {
-                default: vue.withCtx(() => [
-                  vue.createTextVNode(vue.toDisplayString(item), 1)
-                ]),
-                _: 2
-              }, 1032, ["onClick"]);
-            }), 128))
-          ])) : vue.createCommentVNode("", true)
-        ])) : vue.createCommentVNode("", true),
+            (vue.openBlock(true), vue.createElementBlock(
+              vue.Fragment,
+              null,
+              vue.renderList(props.suggestion.split(","), (item, i) => {
+                return vue.openBlock(), vue.createBlock(vue.unref(index$2.ToButton), {
+                  key: i,
+                  color: "info",
+                  mode: "text",
+                  onClick: ($event) => addSuggestion(item)
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.createTextVNode(
+                      vue.toDisplayString(item),
+                      1
+                      /* TEXT */
+                    )
+                  ]),
+                  _: 2
+                  /* DYNAMIC */
+                }, 1032, ["onClick"]);
+              }),
+              128
+              /* KEYED_FRAGMENT */
+            ))
+          ])) : vue.createCommentVNode("v-if", true)
+        ])) : vue.createCommentVNode("v-if", true),
         errorTip.value ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", {
-          key: 6,
+          key: 2,
           class: "to-box-tip"
         }, [
-          errorType.value === "rule" ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
-            vue.createTextVNode(" \u8F93\u5165\u6709\u8BEF "),
-            vue.withDirectives(vue.createVNode(vue.unref(index.ToIcon), {
-              style: { "height": "auto" },
-              value: "help",
-              color: "danger",
-              mode: "toast",
-              fillet: "round"
-            }, null, 512), [
-              [
-                vue.unref(tip.default),
-                errorTip.value,
-                void 0,
-                { danger: true }
-              ]
-            ])
-          ], 64)) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
-            vue.createTextVNode(" \u4E0D\u80FD\u4E3A\u7A7A ")
-          ], 64))
+          errorType.value === "rule" ? (vue.openBlock(), vue.createElementBlock(
+            vue.Fragment,
+            { key: 0 },
+            [
+              vue.createTextVNode(
+                vue.toDisplayString(vue.unref(index.t)("to.input.inputError")) + " ",
+                1
+                /* TEXT */
+              ),
+              vue.withDirectives(vue.createVNode(
+                vue.unref(index$1.ToIcon),
+                {
+                  style: { "height": "auto" },
+                  value: "help",
+                  color: "danger",
+                  mode: "toast"
+                },
+                null,
+                512
+                /* NEED_PATCH */
+              ), [
+                [
+                  vue.unref(tip.default),
+                  errorTip.value,
+                  void 0,
+                  { danger: true }
+                ]
+              ])
+            ],
+            64
+            /* STABLE_FRAGMENT */
+          )) : (vue.openBlock(), vue.createElementBlock(
+            vue.Fragment,
+            { key: 1 },
+            [
+              vue.createTextVNode(
+                vue.toDisplayString(vue.unref(index.t)("to.input.required")),
+                1
+                /* TEXT */
+              )
+            ],
+            64
+            /* STABLE_FRAGMENT */
+          ))
         ])), [
           [_directive_color, "danger"]
-        ]) : vue.createCommentVNode("", true)
-      ], 14, ["id"])), [
-        [vue.unref(tip.default), changed.value ? vue.unref(index$2.t)("to.common.originalValue", valueStore.value[0]) : ""]
+        ]) : vue.createCommentVNode("v-if", true)
+      ], 14, ["id", "flex"])), [
+        [vue.unref(tip.default), changed.value ? vue.unref(index.t)("to.common.originalValue", valueStore.value[0]) : ""]
       ]);
     };
   }