@opentinyvue/vue-input 2.21.0 → 2.22.0

package/lib/index.js

@@ -7,9 +7,8 @@ function _extends() {
     return n;
   }, _extends.apply(null, arguments);
 }
-import { defineComponent, $prefix, $setup, $props } from "@opentinyvue/vue-common";
+import { defineComponent, $props, $setup, $prefix } from "@opentinyvue/vue-common";
 import PcTemplate from "./pc.js";
-import MobileTemplate from "./mobile.js";
 import MobileFirstTemplate from "./mobile-first.js";
 var template = function template2(mode) {
   var _process$env;
@@ -17,9 +16,6 @@ var template = function template2(mode) {
   if ("pc" === (tinyMode || mode)) {
     return PcTemplate;
   }
-  if ("mobile" === (tinyMode || mode)) {
-    return MobileTemplate;
-  }
   if ("mobile-first" === (tinyMode || mode)) {
     return MobileFirstTemplate;
   }
@@ -198,7 +194,7 @@ var Input = defineComponent({
     });
   }
 });
-var version = "2.21.0";
+var version = "2.22.0";
 Input.model = {
   prop: "modelValue",
   event: "update:modelValue"

package/lib/mobile-first.js

@@ -301,6 +301,7 @@ var render = function render2() {
       "effect": "light",
       "content": _vm.state.displayOnlyTooltip,
       "placement": "top",
+      "pre": "",
       "popper-class": _vm.state.tooltipConfig.popperClass || "",
       "popper-options": {
         bubbling: true
@@ -312,7 +313,7 @@ var render = function render2() {
       }
     }
   }, [_c("div", {
-    staticClass: "flex"
+    staticClass: "inline-flex"
   }, [_c("span", {
     ref: "textBox",
     staticClass: "text-box max-w-full break-words line-clamp-5 text-sm text-color-text-primary before:content-[''] before:float-right before:h-full before:-mb-4",
@@ -350,7 +351,9 @@ var render = function render2() {
       },
       proxy: true
     }], null, false, 2786811157)
-  }, [_c("div", [_vm._v(_vm._s(_vm.state.displayOnlyText))])]) : _vm._e(), _c("textarea", _vm._b({
+  }, [_c("pre", {
+    staticClass: "font-[inherit]"
+  }, [_vm._v(_vm._s(_vm.state.displayOnlyText))])]) : _vm._e(), _c("textarea", _vm._b({
     ref: "textarea",
     staticClass: "block w-full border-0 sm:border-solid sm:border-color-border sm:hover:border-color-border-hover sm:focus:border-color-brand-focus sm:disabled:border-color-border-separator outline-0 rounded placeholder:text-color-text-placeholder placeholder:text-sm sm:disabled:placeholder:text-color-text-disabled text-sm text-color-text-primary bg-color-bg-1 disabled:cursor-not-allowed disabled:text-color-text-disabled sm:disabled:text-color-text-disabled sm:disabled:bg-color-bg-6",
     class: [_vm.readonly ? "sm:border-0 px-0 py-0" : "sm:border px-3 ", _vm.state.isDisplayOnly ? "hidden" : "", _vm.state.inputSizeMf !== "mini" ? "sm:placeholder:text-sm sm:text-sm" : "sm:placeholder:text-xs sm:text-xs", _vm.hoverExpand && "min-w-40 absolute h-7 z-[2000] top-0 left-0", _vm.hoverExpand && _vm.state.enteredTextarea ? "py-2 leading-normal" : "py-0 leading-[1.625rem]", _vm.hoverExpand && !_vm.state.enteredTextarea && "min-h-7 px-2 leading-7 overflow-hidden"],

package/lib/pc.js

@@ -1,6 +1,6 @@
 import { renderless as renderless$1, api as api$1 } from '@opentinyvue/vue-renderless/input/vue';
 import { defineComponent, $prefix, setup, directive, props } from '@opentinyvue/vue-common';
-import Clickoutside from '@opentinyvue/vue-renderless/common/deps/clickoutside';
+import { Clickoutside } from '@opentinyvue/vue-directive';
 import { renderless, api } from '@opentinyvue/vue-renderless/tall-storage/vue';
 import '@opentinyvue/vue-theme/tall-storage/index.css';
 import { IconClose, IconEyeopen, IconEyeclose } from '@opentinyvue/vue-icon';
@@ -323,7 +323,7 @@ var render = function render2() {
       },
       proxy: true
     }], null, false, 2786811157)
-  }, [_c("div", [_vm._v(_vm._s(_vm.state.displayOnlyText))])]) : _vm._e(), _c("textarea", _vm._b({
+  }, [_c("pre", [_vm._v(_vm._s(_vm.state.displayOnlyText))])]) : _vm._e(), _c("textarea", _vm._b({
     directives: [{
       name: "clickoutside",
       rawName: "v-clickoutside.mouseup",

package/package.json

@@ -1,23 +1,22 @@
 {
   "name": "@opentinyvue/vue-input",
-  "version": "2.21.0",
+  "type": "module",
+  "version": "2.22.0",
   "description": "",
+  "license": "MIT",
+  "sideEffects": false,
   "main": "./lib/index.js",
   "module": "./lib/index.js",
-  "sideEffects": false,
-  "type": "module",
   "dependencies": {
-    "@opentinyvue/vue-action-sheet": "~2.21.0",
-    "@opentinyvue/vue-common": "~2.21.0",
-    "@opentinyvue/vue-icon": "~2.21.0",
-    "@opentinyvue/vue-tooltip": "~2.21.0",
-    "@opentinyvue/vue-button": "~2.21.0",
-    "@opentinyvue/vue-dialog-box": "~2.21.0",
-    "@opentinyvue/vue-renderless": "~3.21.0",
-    "@opentinyvue/vue-theme-mobile": "~3.21.0",
-    "@opentinyvue/vue-theme": "~3.21.0"
+    "@opentinyvue/vue-directive": "~2.22.0",
+    "@opentinyvue/vue-button": "~2.22.0",
+    "@opentinyvue/vue-common": "~2.22.0",
+    "@opentinyvue/vue-dialog-box": "~2.22.0",
+    "@opentinyvue/vue-icon": "~2.22.0",
+    "@opentinyvue/vue-renderless": "~3.22.0",
+    "@opentinyvue/vue-theme": "~3.22.0",
+    "@opentinyvue/vue-tooltip": "~2.22.0"
   },
-  "license": "MIT",
   "types": "index.d.ts",
   "scripts": {
     "build": "pnpm -w build:ui $npm_package_name",

package/lib/mobile.js

@@ -1,247 +0,0 @@
-import { renderless, api } from '@opentinyvue/vue-renderless/input/vue';
-import { defineComponent, props, setup } from '@opentinyvue/vue-common';
-import { iconClose, iconChevronRight, iconEyeopen, iconEyeclose } from '@opentinyvue/vue-icon';
-import ActionSheet from '@opentinyvue/vue-action-sheet';
-import '@opentinyvue/vue-theme-mobile/input/index.css';
-
-function normalizeComponent(scriptExports, render, staticRenderFns, functionalTemplate, injectStyles, scopeId, moduleIdentifier, shadowMode) {
-  var options = typeof scriptExports === "function" ? scriptExports.options : scriptExports;
-  if (render) {
-    options.render = render;
-    options.staticRenderFns = staticRenderFns;
-    options._compiled = true;
-  }
-  var hook;
-  if (injectStyles) {
-    hook = injectStyles;
-  }
-  if (hook) {
-    if (options.functional) {
-      options._injectStyles = hook;
-      var originalRender = options.render;
-      options.render = function renderWithStyleInjection(h, context) {
-        hook.call(context);
-        return originalRender(h, context);
-      };
-    } else {
-      var existing = options.beforeCreate;
-      options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
-    }
-  }
-  return {
-    exports: scriptExports,
-    options
-  };
-}
-
-var __vue2_script = defineComponent({
-  emits: ["update:modelValue", "change", "clear", "focus", "blur", "keyup", "keydown", "paste", "mouseenter", "mouseleave", "input"],
-  components: {
-    IconClose: iconClose(),
-    IconChevronRight: iconChevronRight(),
-    IconEyeopen: iconEyeopen(),
-    IconEyeclose: iconEyeclose(),
-    TinyActionSheet: ActionSheet
-  },
-  props: [].concat(props, ["name", "selectMenu", "ellipsis", "contentStyle", "labelWidth", "tips", "isSelect", "type", "label", "modelValue", "disabled", "readonly", "clearable", "suffixIcon", "prefixIcon", "autocomplete", "showPassword", "validateEvent", "showWordLimit", "title", "counter", "autosize", "tabindex", "width", "textAlign", "resize"]),
-  setup: function setup$1(props2, context) {
-    return setup({
-      props: props2,
-      context,
-      renderless,
-      api
-    });
-  }
-});
-var render = function render2() {
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _c("div", {
-    class: [_vm.type === "textarea" ? "tiny-mobile-textarea" : "tiny-mobile-input", _vm.state.inputSize ? "tiny-mobile-input-" + _vm.state.inputSize : "", {
-      "is-focus": _vm.state.focused,
-      "is-disabled": _vm.state.inputDisabled,
-      "is-exceed": _vm.state.inputExceed,
-      "is-showlimit": _vm.state.isWordLimitVisible && _vm.type === "textarea",
-      "tiny-mobile-input-group": _vm.slots.prepend || _vm.slots.append,
-      "tiny-mobile-input-group-append": _vm.slots.append,
-      "tiny-mobile-input-group-prepend": _vm.slots.prepend
-    }],
-    style: _vm.$attrs.style,
-    on: {
-      "mouseenter": function mouseenter($event) {
-        _vm.state.hovering = true;
-      },
-      "mouseleave": function mouseleave($event) {
-        _vm.state.hovering = false;
-      }
-    }
-  }, [_vm.slots.title || _vm.title ? _c("div", {
-    staticClass: "tiny-mobile-input__title"
-  }, [_vm._t("title", function() {
-    return [_vm._v(_vm._s(_vm.title))];
-  })], 2) : _vm._e(), _vm.type !== "textarea" ? _c("div", {
-    staticClass: "tiny-mobile-input__wrapper"
-  }, [_vm.isSelect ? _c("div", {
-    staticClass: "tiny-mobile-input__select",
-    on: {
-      "click": _vm.showBox
-    }
-  }, [_c("input", _vm._b({
-    staticClass: "tiny-mobile-input__inner",
-    style: _vm.state.inputStyle,
-    attrs: {
-      "type": "text",
-      "readonly": "",
-      "disabled": _vm.state.inputDisabled,
-      "name": _vm.name,
-      "aria-label": _vm.label,
-      "tabindex": _vm.tabindex
-    },
-    domProps: {
-      "value": _vm.state.checkedLabel
-    },
-    on: {
-      "input": _vm.handleInput,
-      "change": _vm.handleChange
-    }
-  }, "input", _vm.a(_vm.$attrs, ["size", "class", "style", "^on[A-Z]"]), false)), _c("div", {
-    staticClass: "tiny-mobile-input__select-icon",
-    style: {
-      transform: _vm.state.boxVisibility ? "rotate(90deg)" : "none"
-    }
-  }, [_c("IconChevronRight")], 1)]) : [_vm.type !== "textarea" ? _c("input", _vm._b({
-    ref: "input",
-    staticClass: "tiny-mobile-input__inner",
-    style: _vm.state.inputStyle,
-    attrs: {
-      "name": _vm.name,
-      "tabindex": _vm.tabindex,
-      "type": _vm.showPassword ? _vm.state.passwordVisible ? "text" : "password" : _vm.type,
-      "disabled": _vm.state.inputDisabled,
-      "readonly": _vm.readonly,
-      "autocomplete": _vm.autocomplete,
-      "aria-label": _vm.label
-    },
-    on: {
-      "compositionstart": _vm.handleCompositionStart,
-      "compositionupdate": _vm.handleCompositionUpdate,
-      "compositionend": _vm.handleCompositionEnd,
-      "input": _vm.handleInput,
-      "focus": _vm.handleFocus,
-      "blur": _vm.handleBlur,
-      "change": _vm.handleChange
-    }
-  }, "input", _vm.a(_vm.$attrs, ["size", "class", "style", "^on[A-Z]"]), false)) : _vm._e(), _vm.slots.prepend ? _c("div", {
-    staticClass: "tiny-mobile-input-group__prepend"
-  }, [_c("span", [_vm._t("prepend")], 2)]) : _vm._e(), _vm.slots.prefix || _vm.prefixIcon ? _c("div", {
-    staticClass: "tiny-mobile-input__prefix"
-  }, [_vm._t("prefix"), _vm.prefixIcon ? _c(_vm.prefixIcon, {
-    tag: "component",
-    staticClass: "tiny-mobile-input__icon"
-  }) : _vm._e()], 2) : _vm._e(), _vm.getSuffixVisible() ? _c("span", {
-    staticClass: "tiny-mobile-input__suffix"
-  }, [!_vm.state.showClear || !_vm.state.showPwdVisible || !_vm.state.isWordLimitVisible ? [_vm._t("suffix"), _vm.suffixIcon ? _c(_vm.suffixIcon, {
-    tag: "component",
-    staticClass: "tiny-mobile-input__icon"
-  }) : _vm._e()] : _vm._e(), _vm.state.showClear ? _c("icon-close", {
-    staticClass: "tiny-mobile-input__icon tiny-mobile-input__clear",
-    on: {
-      "mousedown": function mousedown($event) {
-        $event.preventDefault();
-      },
-      "click": _vm.clear
-    }
-  }) : _vm._e(), _vm.state.showPwdVisible ? _c(_vm.state.passwordVisible ? "icon-eyeopen" : "icon-eyeclose", {
-    tag: "component",
-    staticClass: "tiny-mobile-input__icon",
-    on: {
-      "click": _vm.handlePasswordVisible
-    }
-  }) : _vm._e(), _vm.state.isWordLimitVisible ? _c("span", {
-    staticClass: "tiny-mobile-input__count"
-  }, [_c("span", {
-    staticClass: "tiny-mobile-input__count-inner"
-  }, [_vm._v(_vm._s(_vm.state.showWordLimit ? _vm.state.textLength + "/" + _vm.state.upperLimit : _vm.state.textLength))])]) : _vm._e(), _vm.state.validateState ? _c("i", {
-    staticClass: "tiny-mobile-input__icon",
-    class: ["tiny-mobile-input__validateIcon", _vm.validateIcon]
-  }) : _vm._e()], 2) : _vm._e(), _vm.slots.append ? _c("div", {
-    staticClass: "tiny-mobile-input-group__append"
-  }, [_vm._t("append")], 2) : _vm._e()]], 2) : _c("div", {
-    staticClass: "tiny-mobile-textarea__wrapper"
-  }, [_c("textarea", _vm._b({
-    ref: "textarea",
-    class: ["tiny-mobile-textarea__inner", {
-      "is-focus": _vm.state.focused,
-      "is-autosize": _vm.autosize
-    }],
-    style: Object.assign({}, _vm.state.textareaStyle, {
-      width: _vm.$attrs.cols ? "auto" : "100%",
-      height: _vm.$attrs.cols || _vm.autosize ? "auto" : ""
-    }),
-    attrs: {
-      "name": _vm.name,
-      "tabindex": _vm.tabindex,
-      "disabled": _vm.state.inputDisabled,
-      "readonly": _vm.readonly,
-      "autocomplete": _vm.autocomplete,
-      "aria-label": _vm.label
-    },
-    on: {
-      "focus": _vm.handleFocus,
-      "blur": _vm.handleBlur,
-      "change": _vm.handleChange,
-      "compositionstart": _vm.handleCompositionStart,
-      "compositionupdate": _vm.handleCompositionUpdate,
-      "compositionend": _vm.handleCompositionEnd,
-      "input": _vm.handleInput,
-      "keyup": function keyup($event) {
-        return _vm.$emit("keyup", $event);
-      },
-      "keydown": function keydown($event) {
-        return _vm.$emit("keydown", $event);
-      },
-      "paste": function paste($event) {
-        return _vm.$emit("paste", $event);
-      }
-    }
-  }, "textarea", _vm.a(_vm.$attrs, ["type", "class", "style", "^on[A-Z]"]), false))]), _vm.state.isWordLimitVisible && _vm.type === "textarea" ? _c("span", {
-    staticClass: "tiny-mobile-textarea__count"
-  }, [_vm._v(_vm._s(_vm.state.showWordLimit ? _vm.state.textLength + "/" + _vm.state.upperLimit : _vm.state.textLength))]) : _vm._e(), _vm.slots.tips || _vm.tips ? _c("div", {
-    staticClass: "tiny-mobile-input__tips"
-  }, [_vm._t("tips", function() {
-    return [_vm._v(_vm._s(_vm.tips))];
-  })], 2) : _vm._e(), _c("tiny-action-sheet", {
-    attrs: {
-      "menus": _vm.selectMenu,
-      "ellipsis": _vm.ellipsis,
-      "content-style": _vm.contentStyle,
-      "visible": _vm.state.boxVisibility
-    },
-    on: {
-      "update:visible": function updateVisible($event) {
-        _vm.state.boxVisibility = $event;
-      }
-    },
-    model: {
-      value: _vm.state.sheetvalue,
-      callback: function callback($$v) {
-        _vm.$set(_vm.state, "sheetvalue", $$v);
-      },
-      expression: "state.sheetvalue"
-    }
-  })], 1);
-};
-var staticRenderFns = [];
-var __cssModules = {};
-var __component__ = /* @__PURE__ */ normalizeComponent(__vue2_script, render, staticRenderFns, false, __vue2_injectStyles);
-function __vue2_injectStyles(context) {
-  for (var o in __cssModules) {
-    this[o] = __cssModules[o];
-  }
-}
-var mobile = /* @__PURE__ */ function() {
-  return __component__.exports;
-}();
-
-export { mobile as default };

package/src/mobile.vue.d.ts

@@ -1,2 +0,0 @@
-declare const _default: any;
-export default _default;