@opentinyvue/vue-form-item 2.21.0 → 3.21.0

package/lib/mobile-first.js

@@ -3,36 +3,40 @@ import { renderless, api } from '@opentinyvue/vue-renderless/form-item/vue';
 import LabelWrap from './label-wrap';
 import Tooltip from '@opentinyvue/vue-tooltip';
 import { IconHelpCircle } from '@opentinyvue/vue-icon';
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, createVNode, withCtx, normalizeStyle, createElementVNode, renderSlot, createTextVNode, toDisplayString, createBlock, createCommentVNode, withDirectives, vShow } from 'vue';
 
-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;
+function _createForOfIteratorHelperLoose(r, e) {
+  var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
+  if (t) return (t = t.call(r)).next.bind(t);
+  if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) {
+    t && (r = t);
+    var o = 0;
+    return function() {
+      return o >= r.length ? { done: true } : { done: false, value: r[o++] };
+    };
   }
-  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];
-    }
+  throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _unsupportedIterableToArray(r, a) {
+  if (r) {
+    if ("string" == typeof r) return _arrayLikeToArray(r, a);
+    var t = {}.toString.call(r).slice(8, -1);
+    return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
   }
-  return {
-    exports: scriptExports,
-    options
-  };
 }
+function _arrayLikeToArray(r, a) {
+  (null == a || a > r.length) && (a = r.length);
+  for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
+  return n;
+}
+var _export_sfc = function _export_sfc2(sfc, props) {
+  var target = sfc.__vccOpts || sfc;
+  for (var _iterator = _createForOfIteratorHelperLoose(props), _step; !(_step = _iterator()).done; ) {
+    var _step$value = _step.value, key = _step$value[0], val = _step$value[1];
+    target[key] = val;
+  }
+  return target;
+};
 
 function _extends() {
   return _extends = Object.assign ? Object.assign.bind() : function(n) {
@@ -47,7 +51,7 @@ var $constants = {
   FORM_NAME: "Form",
   FORM_ITEM_NAME: "FormItem"
 };
-var __vue2_script = defineComponent({
+var _sfc_main = defineComponent({
   name: $prefix + "FormItem",
   componentName: "FormItem",
   components: {
@@ -108,90 +112,107 @@ var __vue2_script = defineComponent({
     });
   }
 });
-var render = function render2() {
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _c("div", {
-    class: _vm.m("flex min-h-[theme(spacing.12)] sm:min-h-[theme(spacing.7)] mb-0 p-0 sm:mb-4 box-border after:content-[''] after:table after:clear-both before:content-['']  before:table border-b-0.5 border-color-border-separator sm:border-none", _vm.state.validateState === "error" && _vm.state.validateType === "text" ? "mb-0 sm:mb-5" : "", _vm.state.formInline ? "align-sub" : "", _vm.state.labelPosition === "top" ? "block mb-4" : "", _vm.state.validateState === "error" ? "[&_.tiny-range-editor]:border-color-error [&_[data-tag~=tiny-range-editor]]:border-color-error [&_[data-tag=tiny-numeric-main]]:border-color-error [&_input]:border-color-error [&_textarea]:border-color-error [&_input:focus]:border-color-error [&_input:hover]:border-color-error [&_textarea:focus]:border-color-error [&_textarea:hover]:border-color-error" : "", _vm.state.labelPosition === "top" && !_vm.state.hideRequiredAsterisk ? "pl-0" : "", !_vm.slots.label && !_vm.label ? "border-none" : "", _vm.state.isDisplayOnly ? "border-none py-0.5" : ""),
-    attrs: {
-      "data-tag": "tiny-form-item"
-    }
-  }, [_c("label-wrap", {
-    attrs: {
-      "is-auto-width": _vm.state.labelStyle && _vm.state.labelStyle.width === "auto",
-      "update-all": _vm.state.labelWidth === "auto",
-      "is-mobile-first": true
-    }
-  }, [_vm.slots.label || _vm.label ? _c("label", {
-    class: _vm.m("py-3 sm:py-1.5 sm:min-h-[theme(spacing.7)] relative align-bottom float-left text-sm pr-3 sm:pr-4 box-border leading-5", "overflow-hidden text-ellipsis", _vm.state.labelPosition === "top" ? "float-none inline-block text-left sm:text-left leading-none px-0 pt-0 pb-1.5 h-auto min-h-0 sm:py-0 sm:pb-1 sm:min-h-[theme(spacing.0)]" : "min-h-[theme(spacing.9)]", _vm.state.labelPosition === "right" ? "text-right sm:text-right" : "", _vm.state.labelPosition === "left" ? "text-left sm:text-left" : "", _vm.state.formInline && _vm.state.labelPosition === "top" ? "block" : "", _vm.state.isDisplayOnly ? "leading-none h-auto align-[inherit] pr-4" : "", _vm.tipContent ? "pr-5 sm:pr-7" : "", _vm.state.labelPosition === "top" && !_vm.state.hideRequiredAsterisk ? "overflow-visible relative before:absolute before:-left-2.5" : "", _vm.state.disabled ? "text-color-icon-placeholder sm:text-color-text-secondary" : "text-color-text-secondary", _vm.state.formItemSize !== "mini" ? "sm:text-sm" : "sm:text-xs"),
-    style: _vm.state.labelStyle,
-    attrs: {
-      "data-tag": "tiny-item-label",
-      "for": _vm.state.labelFor
-    }
-  }, [_c("span", {
-    class: _vm.m("max-h-[theme(spacing.10)] line-clamp-2 inline-block relative top-px leading-normal", (_vm.state.isRequired || _vm.required) && !_vm.state.hideRequiredAsterisk ? "before:content-['*'] before:text-color-error before:relative before:mr-1" : "", _vm.state.isDisplayOnly ? "pl-0 before:hidden" : "")
-  }, [_vm._t("label", function() {
-    return [_vm._v(" " + _vm._s(_vm.label + _vm.state.labelSuffix) + " ")];
-  })], 2), _vm.tipContent ? _c("tiny-tooltip", {
-    attrs: {
-      "effect": "light",
-      "content": _vm.tipContent,
-      "placement": "top"
-    }
-  }, [_c("icon-help-circle", {
-    class: [_vm.state.labelPosition === "top" ? "top-0.5 sm:top-1.5" : "top-3.5 sm:top-1.5"],
-    attrs: {
-      "custom-class": "h-4 w-4 ml-0.5 absolute right-1 sm:right-2 align-text-bottom fill-color-text-secondary"
-    }
-  })], 1) : _vm._e()], 1) : _vm._e()]), _c("div", {
-    class: _vm.m("flex-1 m-0 sm:m-auto relative sm:pt-0 sm:top-auto text-sm after:content-['']  after:table after:clear-both before:content-['']  before:table [&_button:not(:last-child)]:mr-2", "[&_[data-tag=tiny-checkbox]]:py-0 [&_[data-tag=tiny-input]]:w-full", "[&_[data-tag=tiny-input]_textarea]:px-0 sm:[&_[data-tag=tiny-input]_textarea]:px-3 [&_[data-tag=tiny-input]_textarea]:w-full [&_[data-tag=tiny-input]_textarea]:pt-1 sm:[&_[data-tag=tiny-input]_textarea]:pt-2", _vm.state.formInline ? "align-sub leading-none" : "", _vm.state.labelPosition === "top" && !_vm.state.hideRequiredAsterisk ? _vm.state.isDisplayOnly ? "pl-0" : "pl-2 sm:pl-0" : "pt-2", _vm.state.formItemSize !== "mini" ? "sm:text-sm" : "sm:text-xs"),
-    attrs: {
-      "data-tag": "tiny-form-item-inline"
-    }
-  }, [_vm.state.isDisplayOnly && _vm.state.isBasicComp ? _c("div", {
-    class: ["break-all min-h-[28px] leading-7 text-color-text-primary", _vm.state.typeName === "textarea" ? "line-clamp-3" : "line-clamp-1"],
-    attrs: {
-      "data-tag": "tiny-form-item-display-only",
-      "type-name": _vm.state.typeName
+var _hoisted_1 = ["for"];
+var _hoisted_2 = ["type-name"];
+var _hoisted_3 = ["title"];
+function _sfc_render(_ctx, _cache, $props2, $setup, $data, $options) {
+  var _component_icon_help_circle = resolveComponent("icon-help-circle");
+  var _component_tiny_tooltip = resolveComponent("tiny-tooltip");
+  var _component_label_wrap = resolveComponent("label-wrap");
+  return openBlock(), createElementBlock(
+    "div",
+    {
+      "data-tag": "tiny-form-item",
+      class: normalizeClass(_ctx.m("flex min-h-[theme(spacing.12)] sm:min-h-[theme(spacing.7)] mb-0 p-0 sm:mb-4 box-border after:content-[''] after:table after:clear-both before:content-['']  before:table border-b-0.5 border-color-border-separator sm:border-none", _ctx.state.validateState === "error" && _ctx.state.validateType === "text" ? "mb-0 sm:mb-5" : "", _ctx.state.formInline ? "align-sub" : "", _ctx.state.labelPosition === "top" ? "block mb-4" : "", _ctx.state.validateState === "error" ? "[&_.tiny-range-editor]:border-color-error [&_[data-tag~=tiny-range-editor]]:border-color-error [&_[data-tag=tiny-numeric-main]]:border-color-error [&_input]:border-color-error [&_textarea]:border-color-error [&_input:focus]:border-color-error [&_input:hover]:border-color-error [&_textarea:focus]:border-color-error [&_textarea:hover]:border-color-error" : "", _ctx.state.labelPosition === "top" && !_ctx.state.hideRequiredAsterisk ? "pl-0" : "", !_ctx.slots.label && !_ctx.label ? "border-none" : "", _ctx.state.isDisplayOnly ? "border-none py-0.5" : ""))
     },
-    on: {
-      "mouseenter": _vm.handleMouseenter,
-      "mouseleave": _vm.handleMouseleave
-    }
-  }, [_vm._v(" " + _vm._s(_vm.state.displayedValue || "-") + " ")]) : _vm._e(), _c("div", {
-    directives: [{
-      name: "show",
-      rawName: "v-show",
-      value: !(_vm.state.isDisplayOnly && _vm.state.isBasicComp),
-      expression: "!(state.isDisplayOnly && state.isBasicComp)"
-    }],
-    class: ["[&_[aria-label=checkbox-group]]:pl-0.5 sm:[&_[aria-label=checkbox-group]]:pl-0", "[&_>:first-child[data-tag=tiny-checkbox]]:pl-0.5 sm:[&_>:first-child[data-tag=tiny-checkbox]]:pl-0", "[&_[class^=tiny-autocomplete]]:w-full", "[&_[class^=tiny-cascader]]:w-full", _vm.state.isDisplayOnly ? "[&_>*:not([data-tag^=tiny-],[class^=tiny-])]:leading-8 [&_>*:not([data-tag^=tiny-],[class^=tiny-])]:sm:leading-normal" : ""],
-    attrs: {
-      "data-tag": "tiny-form-item-show"
-    }
-  }, [_vm._t("default")], 2), _vm.state.validateState === "error" && _vm.showMessage && _vm.state.showMessage ? _vm._t("error", function() {
-    return [_c("div", {
-      class: _vm.m("relative sm:absolute left-0 bottom-1 sm:-bottom-5 text-color-error text-xs leading-normal line-clamp-3 sm:line-clamp-1 break-all", typeof _vm.inlineMessage === "boolean" && _vm.inlineMessage || _vm.state.inlineMessage ? "relative top-auto left-auto inline-block" : "", _vm.state.formItemSize === "small" ? "pt-0.5" : "", _vm.state.formItemSize === "mini" ? "pt-px" : ""),
-      attrs: {
-        "title": _vm.state.validateMessage
-      }
-    }, [_vm._v(" " + _vm._s(_vm.state.validateMessage) + " ")])];
-  }, {
-    "dataTag": "tiny-form-item-error"
-  }) : _vm._e(), _vm.state.validateState !== "error" && _vm.showMessage && _vm.state.showMessage ? _vm._t("prompt") : _vm._e()], 2)], 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];
-  }
+    [createVNode(_component_label_wrap, {
+      "is-auto-width": _ctx.state.labelStyle && _ctx.state.labelStyle.width === "auto",
+      "update-all": _ctx.state.labelWidth === "auto",
+      "is-mobile-first": true
+    }, {
+      default: withCtx(function() {
+        return [_ctx.slots.label || _ctx.label ? (openBlock(), createElementBlock("label", {
+          key: 0,
+          "data-tag": "tiny-item-label",
+          class: normalizeClass(_ctx.m("py-3 sm:py-1.5 sm:min-h-[theme(spacing.7)] relative align-bottom float-left text-sm pr-3 sm:pr-4 box-border leading-5", "overflow-hidden text-ellipsis", _ctx.state.labelPosition === "top" ? "float-none inline-block text-left sm:text-left leading-none px-0 pt-0 pb-1.5 h-auto min-h-0 sm:py-0 sm:pb-1 sm:min-h-[theme(spacing.0)]" : "min-h-[theme(spacing.9)]", _ctx.state.labelPosition === "right" ? "text-right sm:text-right" : "", _ctx.state.labelPosition === "left" ? "text-left sm:text-left" : "", _ctx.state.formInline && _ctx.state.labelPosition === "top" ? "block" : "", _ctx.state.isDisplayOnly ? "leading-none h-auto align-[inherit] pr-4" : "", _ctx.tipContent ? "pr-5 sm:pr-7" : "", _ctx.state.labelPosition === "top" && !_ctx.state.hideRequiredAsterisk ? "overflow-visible relative before:absolute before:-left-2.5" : "", _ctx.state.disabled ? "text-color-icon-placeholder sm:text-color-text-secondary" : "text-color-text-secondary", _ctx.state.formItemSize !== "mini" ? "sm:text-sm" : "sm:text-xs")),
+          style: normalizeStyle(_ctx.state.labelStyle),
+          for: _ctx.state.labelFor
+        }, [createElementVNode(
+          "span",
+          {
+            class: normalizeClass(_ctx.m("max-h-[theme(spacing.10)] line-clamp-2 inline-block relative top-px leading-normal", (_ctx.state.isRequired || _ctx.required) && !_ctx.state.hideRequiredAsterisk ? "before:content-['*'] before:text-color-error before:relative before:mr-1" : "", _ctx.state.isDisplayOnly ? "pl-0 before:hidden" : ""))
+          },
+          [renderSlot(_ctx.$slots, "label", {}, function() {
+            return [createTextVNode(
+              toDisplayString(_ctx.label + _ctx.state.labelSuffix),
+              1
+              /* TEXT */
+            )];
+          })],
+          2
+          /* CLASS */
+        ), _ctx.tipContent ? (openBlock(), createBlock(_component_tiny_tooltip, {
+          key: 0,
+          effect: "light",
+          content: _ctx.tipContent,
+          placement: "top"
+        }, {
+          default: withCtx(function() {
+            return [createVNode(_component_icon_help_circle, {
+              "custom-class": "h-4 w-4 ml-0.5 absolute right-1 sm:right-2 align-text-bottom fill-color-text-secondary",
+              class: normalizeClass([_ctx.state.labelPosition === "top" ? "top-0.5 sm:top-1.5" : "top-3.5 sm:top-1.5"])
+            }, null, 8, ["class"])];
+          }),
+          _: 1
+          /* STABLE */
+        }, 8, ["content"])) : createCommentVNode("v-if", true)], 14, _hoisted_1)) : createCommentVNode("v-if", true)];
+      }),
+      _: 3
+      /* FORWARDED */
+    }, 8, ["is-auto-width", "update-all"]), createElementVNode(
+      "div",
+      {
+        "data-tag": "tiny-form-item-inline",
+        class: normalizeClass(_ctx.m("flex-1 m-0 sm:m-auto relative sm:pt-0 sm:top-auto text-sm after:content-['']  after:table after:clear-both before:content-['']  before:table [&_button:not(:last-child)]:mr-2", "[&_[data-tag=tiny-checkbox]]:py-0 [&_[data-tag=tiny-input]]:w-full", "[&_[data-tag=tiny-input]_textarea]:px-0 sm:[&_[data-tag=tiny-input]_textarea]:px-3 [&_[data-tag=tiny-input]_textarea]:w-full [&_[data-tag=tiny-input]_textarea]:pt-1 sm:[&_[data-tag=tiny-input]_textarea]:pt-2", _ctx.state.formInline ? "align-sub leading-none" : "", _ctx.state.labelPosition === "top" && !_ctx.state.hideRequiredAsterisk ? _ctx.state.isDisplayOnly ? "pl-0" : "pl-2 sm:pl-0" : "pt-2", _ctx.state.formItemSize !== "mini" ? "sm:text-sm" : "sm:text-xs"))
+      },
+      [_ctx.state.isDisplayOnly && _ctx.state.isBasicComp ? (openBlock(), createElementBlock("div", {
+        key: 0,
+        "data-tag": "tiny-form-item-display-only",
+        class: normalizeClass(["break-all min-h-[28px] leading-7 text-color-text-primary", _ctx.state.typeName === "textarea" ? "line-clamp-3" : "line-clamp-1"]),
+        "type-name": _ctx.state.typeName,
+        onMouseenter: _cache[0] || (_cache[0] = function() {
+          return _ctx.handleMouseenter && _ctx.handleMouseenter.apply(_ctx, arguments);
+        }),
+        onMouseleave: _cache[1] || (_cache[1] = function() {
+          return _ctx.handleMouseleave && _ctx.handleMouseleave.apply(_ctx, arguments);
+        })
+      }, toDisplayString(_ctx.state.displayedValue || "-"), 43, _hoisted_2)) : createCommentVNode("v-if", true), withDirectives(createElementVNode(
+        "div",
+        {
+          "data-tag": "tiny-form-item-show",
+          class: normalizeClass(["[&_[aria-label=checkbox-group]]:pl-0.5 sm:[&_[aria-label=checkbox-group]]:pl-0", "[&_>:first-child[data-tag=tiny-checkbox]]:pl-0.5 sm:[&_>:first-child[data-tag=tiny-checkbox]]:pl-0", "[&_[class^=tiny-autocomplete]]:w-full", "[&_[class^=tiny-cascader]]:w-full", _ctx.state.isDisplayOnly ? "[&_>*:not([data-tag^=tiny-],[class^=tiny-])]:leading-8 [&_>*:not([data-tag^=tiny-],[class^=tiny-])]:sm:leading-normal" : ""])
+        },
+        [renderSlot(_ctx.$slots, "default")],
+        2
+        /* CLASS */
+      ), [[vShow, !(_ctx.state.isDisplayOnly && _ctx.state.isBasicComp)]]), _ctx.state.validateState === "error" && _ctx.showMessage && _ctx.state.showMessage ? renderSlot(_ctx.$slots, "error", {
+        key: 1,
+        dataTag: "tiny-form-item-error"
+      }, function() {
+        return [createElementVNode("div", {
+          class: normalizeClass(_ctx.m("relative sm:absolute left-0 bottom-1 sm:-bottom-5 text-color-error text-xs leading-normal line-clamp-3 sm:line-clamp-1 break-all", typeof _ctx.inlineMessage === "boolean" && _ctx.inlineMessage || _ctx.state.inlineMessage ? "relative top-auto left-auto inline-block" : "", _ctx.state.formItemSize === "small" ? "pt-0.5" : "", _ctx.state.formItemSize === "mini" ? "pt-px" : "")),
+          title: _ctx.state.validateMessage
+        }, toDisplayString(_ctx.state.validateMessage), 11, _hoisted_3)];
+      }) : createCommentVNode("v-if", true), _ctx.state.validateState !== "error" && _ctx.showMessage && _ctx.state.showMessage ? renderSlot(_ctx.$slots, "prompt", {
+        key: 2
+      }) : createCommentVNode("v-if", true)],
+      2
+      /* CLASS */
+    )],
+    2
+    /* CLASS */
+  );
 }
-var mobileFirst = /* @__PURE__ */ function() {
-  return __component__.exports;
-}();
+var mobileFirst = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
 
 export { mobileFirst as default };

package/lib/pc.js

@@ -1,39 +1,3 @@
-import { defineComponent, $prefix, setup, isVue2, parseVnode, hooks, stringifyCssClass, deduplicateCssClass, $props } from '@opentinyvue/vue-common';
-import { renderless, api } from '@opentinyvue/vue-renderless/form-item/vue';
-import LabelWrap from './label-wrap';
-import Tooltip from '@opentinyvue/vue-tooltip';
-import { iconError } from '@opentinyvue/vue-icon';
-
-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
-  };
-}
-
 function _extends() {
   return _extends = Object.assign ? Object.assign.bind() : function(n) {
     for (var e = 1; e < arguments.length; e++) {
@@ -43,11 +7,17 @@ function _extends() {
     return n;
   }, _extends.apply(null, arguments);
 }
+import { createVNode } from "vue";
+import { defineComponent, $prefix, $props, setup as _setup, h, isVue2, parseVnode, hooks, stringifyCssClass, deduplicateCssClass } from "@opentinyvue/vue-common";
+import { renderless, api } from "@opentinyvue/vue-renderless/form-item/vue";
+import LabelWrap from "./label-wrap";
+import Tooltip from "@opentinyvue/vue-tooltip";
+import { iconError } from "@opentinyvue/vue-icon";
 var $constants = {
   FORM_NAME: "Form",
   FORM_ITEM_NAME: "FormItem"
 };
-var __vue2_script = defineComponent({
+var _sfc_main = /* @__PURE__ */ defineComponent({
   name: $prefix + "FormItem",
   componentName: "FormItem",
   components: {
@@ -112,8 +82,8 @@ var __vue2_script = defineComponent({
     },
     extra: String
   }),
-  setup: function setup$1(props, context) {
-    return setup({
+  setup: function setup(props, context) {
+    return _setup({
       props,
       context,
       renderless,
@@ -122,8 +92,7 @@ var __vue2_script = defineComponent({
   },
   render: function render() {
     var _state$formInstance, _state$formInstance2, _state$formInstance3, _state$formInstance4, _this = this, _class, _class2, _class3, _class4, _class5;
-    var h = arguments[0];
-    var state = this.state, required = this.required, slots = this.slots, label = this.label, scopedSlots = this.scopedSlots, showMessage = this.showMessage; this.inlineMessage; var ellipsis = this.ellipsis, vertical = this.vertical, handleLabelMouseenter = this.handleLabelMouseenter, handleMouseleave = this.handleMouseleave;
+    var state = this.state, required = this.required, slots = this.slots, label = this.label, scopedSlots = this.scopedSlots, showMessage = this.showMessage, inlineMessage = this.inlineMessage, ellipsis = this.ellipsis, vertical = this.vertical, handleLabelMouseenter = this.handleLabelMouseenter, handleMouseleave = this.handleMouseleave;
     var validateIcon = state.validateIcon, isErrorInline = state.isErrorInline, isErrorBlock = state.isErrorBlock, tooltipType = state.tooltipType;
     var isMobile = state.mode === "mobile";
     var classPrefix = isMobile ? "tiny-mobile-" : "tiny-";
@@ -214,9 +183,9 @@ var __vue2_script = defineComponent({
     var getFormItemContnet = function getFormItemContnet2() {
       if (isMobile) {
         var _validatePosition = _this.validatePosition || state.formInstance.validatePosition || "right";
-        validateMessage = state.validateMessage ? _validatePosition === "right" ? h("div", {
+        validateMessage = state.validateMessage ? _validatePosition === "right" ? createVNode("div", {
           "class": "tiny-mobile-input-form__error align-right"
-        }, [state.validateMessage]) : h("div", {
+        }, [state.validateMessage]) : createVNode("div", {
           "class": "tiny-mobile-input-form__error align-left"
         }, [state.validateMessage]) : null;
         return ItemContent;
@@ -231,7 +200,7 @@ var __vue2_script = defineComponent({
       }
     }, [validateIcon ? h(validateIcon, {
       class: "validate-icon"
-    }) : null, h("span", {
+    }) : null, createVNode("span", {
       "class": classPrefix + "form-item__validate-message"
     }, [state.validateMessage])]) : null;
     var LabelContent = h("label-wrap", {
@@ -270,12 +239,11 @@ var __vue2_script = defineComponent({
         modelValue: isShowError ? state.canShowTip : false,
         zIndex: "relative",
         renderContent: function renderContent() {
-          var h2 = this.$createElement;
           var tooltipContent;
           if (errorSlot) {
             tooltipContent = [errorSlot];
           } else {
-            tooltipContent = [validateIconNode, h2("span", {
+            tooltipContent = [validateIconNode, createVNode("span", {
               "class": classPrefix + "form-item__validate-message"
             }, [state.validateMessage])];
           }
@@ -299,16 +267,6 @@ var __vue2_script = defineComponent({
     }, [ErrorContent]), isMobile ? null : ExtraTip])]);
   }
 });
-var __vue2_render, __vue2_staticRenderFns;
-var __cssModules = {};
-var __component__ = /* @__PURE__ */ normalizeComponent(__vue2_script, __vue2_render, __vue2_staticRenderFns, false, __vue2_injectStyles);
-function __vue2_injectStyles(context) {
-  for (var o in __cssModules) {
-    this[o] = __cssModules[o];
-  }
-}
-var pc = /* @__PURE__ */ function() {
-  return __component__.exports;
-}();
-
-export { pc as default };
+export {
+  _sfc_main as default
+};

package/package.json

@@ -1,17 +1,17 @@
 {
   "name": "@opentinyvue/vue-form-item",
   "type": "module",
-  "version": "2.21.0",
+  "version": "3.21.0",
   "description": "",
   "license": "MIT",
   "sideEffects": false,
   "main": "./lib/index.js",
   "module": "./lib/index.js",
   "dependencies": {
-    "@opentinyvue/vue-common": "~2.21.0",
-    "@opentinyvue/vue-icon": "~2.21.0",
+    "@opentinyvue/vue-common": "~3.21.0",
+    "@opentinyvue/vue-icon": "~3.21.0",
     "@opentinyvue/vue-renderless": "~3.21.0",
-    "@opentinyvue/vue-tooltip": "~2.21.0"
+    "@opentinyvue/vue-tooltip": "~3.21.0"
   },
   "types": "index.d.ts",
   "scripts": {

package/src/index.d.ts

@@ -36,7 +36,7 @@ export declare const formItemProps: {
         type: BooleanConstructor;
         default: undefined;
     };
-    rules: (ArrayConstructor | ObjectConstructor)[];
+    rules: (ObjectConstructor | ArrayConstructor)[];
     showMessage: {
         type: BooleanConstructor;
         default: boolean;
@@ -65,5 +65,145 @@ export declare const formItemProps: {
     tiny_theme: StringConstructor;
     tiny_chart_theme: ObjectConstructor;
 };
-declare const _default: any;
+declare const _default: import("@vue/runtime-core").DefineComponent<{
+    _constants: {
+        type: ObjectConstructor;
+        default: () => {
+            FORM_NAME: string;
+            FORM_ITEM_NAME: string;
+        };
+    };
+    appendToBody: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    error: {
+        type: StringConstructor;
+        default: string;
+    };
+    for: StringConstructor;
+    inlineMessage: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    messageType: StringConstructor;
+    label: StringConstructor;
+    labelWidth: StringConstructor;
+    manual: BooleanConstructor;
+    popperOptions: {
+        type: ObjectConstructor;
+        default: () => {};
+    };
+    prop: StringConstructor;
+    required: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    rules: (ObjectConstructor | ArrayConstructor)[];
+    showMessage: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    size: StringConstructor;
+    tipContent: StringConstructor;
+    validateDisabled: BooleanConstructor;
+    validateDebounce: BooleanConstructor;
+    validatePosition: StringConstructor;
+    validateStatus: StringConstructor;
+    validateType: StringConstructor;
+    validateIcon: ObjectConstructor;
+    ellipsis: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    extra: StringConstructor;
+    tiny_mode: StringConstructor;
+    tiny_mode_root: BooleanConstructor;
+    tiny_template: (ObjectConstructor | FunctionConstructor)[];
+    tiny_renderless: FunctionConstructor;
+    tiny_theme: StringConstructor;
+    tiny_chart_theme: ObjectConstructor;
+}, () => import("@vue/runtime-core").VNode<import("@vue/runtime-core").RendererNode, import("@vue/runtime-core").RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, {}, string, import("@vue/runtime-core").PublicProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{
+    _constants: {
+        type: ObjectConstructor;
+        default: () => {
+            FORM_NAME: string;
+            FORM_ITEM_NAME: string;
+        };
+    };
+    appendToBody: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    error: {
+        type: StringConstructor;
+        default: string;
+    };
+    for: StringConstructor;
+    inlineMessage: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    messageType: StringConstructor;
+    label: StringConstructor;
+    labelWidth: StringConstructor;
+    manual: BooleanConstructor;
+    popperOptions: {
+        type: ObjectConstructor;
+        default: () => {};
+    };
+    prop: StringConstructor;
+    required: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    rules: (ObjectConstructor | ArrayConstructor)[];
+    showMessage: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    size: StringConstructor;
+    tipContent: StringConstructor;
+    validateDisabled: BooleanConstructor;
+    validateDebounce: BooleanConstructor;
+    validatePosition: StringConstructor;
+    validateStatus: StringConstructor;
+    validateType: StringConstructor;
+    validateIcon: ObjectConstructor;
+    ellipsis: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    extra: StringConstructor;
+    tiny_mode: StringConstructor;
+    tiny_mode_root: BooleanConstructor;
+    tiny_template: (ObjectConstructor | FunctionConstructor)[];
+    tiny_renderless: FunctionConstructor;
+    tiny_theme: StringConstructor;
+    tiny_chart_theme: ObjectConstructor;
+}>>, {
+    error: string;
+    ellipsis: boolean;
+    tiny_mode_root: boolean;
+    _constants: Record<string, any>;
+    appendToBody: boolean;
+    manual: boolean;
+    popperOptions: Record<string, any>;
+    vertical: boolean;
+    required: boolean;
+    inlineMessage: boolean;
+    showMessage: boolean;
+    validateDisabled: boolean;
+    validateDebounce: boolean;
+}, {}>;
 export default _default;

package/src/label-wrap.d.ts

@@ -1,2 +1,33 @@
-declare const _default: any;
+declare const _default: import("@vue/runtime-core").DefineComponent<{
+    isAutoWidth: BooleanConstructor;
+    updateAll: BooleanConstructor;
+    isMobile: BooleanConstructor;
+    isMobileFirst: BooleanConstructor;
+    tiny_mode: StringConstructor;
+    tiny_mode_root: BooleanConstructor;
+    tiny_template: (ObjectConstructor | FunctionConstructor)[];
+    tiny_renderless: FunctionConstructor;
+    tiny_theme: StringConstructor;
+    tiny_chart_theme: ObjectConstructor;
+}, any, unknown, {}, {
+    getLabelWidth(): number;
+    updateLabelWidth(action?: string): void;
+}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, {}, string, import("@vue/runtime-core").PublicProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{
+    isAutoWidth: BooleanConstructor;
+    updateAll: BooleanConstructor;
+    isMobile: BooleanConstructor;
+    isMobileFirst: BooleanConstructor;
+    tiny_mode: StringConstructor;
+    tiny_mode_root: BooleanConstructor;
+    tiny_template: (ObjectConstructor | FunctionConstructor)[];
+    tiny_renderless: FunctionConstructor;
+    tiny_theme: StringConstructor;
+    tiny_chart_theme: ObjectConstructor;
+}>>, {
+    tiny_mode_root: boolean;
+    isAutoWidth: boolean;
+    updateAll: boolean;
+    isMobile: boolean;
+    isMobileFirst: boolean;
+}, {}>;
 export default _default;

package/src/mobile-first.vue.d.ts

@@ -1,2 +1,110 @@
-declare const _default: any;
+import type { IFormItemApi } from '@opentinyvue/vue-renderless/types/form-item.type';
+declare const _default: import("@vue/runtime-core").DefineComponent<{
+    _constants: {
+        type: ObjectConstructor;
+        default: () => {
+            FORM_NAME: string;
+            FORM_ITEM_NAME: string;
+        };
+    };
+    appendToBody: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    error: StringConstructor;
+    for: StringConstructor;
+    inlineMessage: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: string;
+    };
+    label: StringConstructor;
+    labelWidth: StringConstructor;
+    manual: BooleanConstructor;
+    popperOptions: {
+        type: ObjectConstructor;
+        default: () => {};
+    };
+    prop: StringConstructor;
+    required: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    rules: (ObjectConstructor | ArrayConstructor)[];
+    showMessage: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    size: StringConstructor;
+    tipContent: StringConstructor;
+    validateDisabled: BooleanConstructor;
+    validateDebounce: BooleanConstructor;
+    validatePosition: StringConstructor;
+    validateStatus: StringConstructor;
+    validateType: StringConstructor;
+    tiny_mode: StringConstructor;
+    tiny_mode_root: BooleanConstructor;
+    tiny_template: (ObjectConstructor | FunctionConstructor)[];
+    tiny_renderless: FunctionConstructor;
+    tiny_theme: StringConstructor;
+    tiny_chart_theme: ObjectConstructor;
+}, IFormItemApi, unknown, {}, {}, import("@vue/runtime-core").ComponentOptionsMixin, import("@vue/runtime-core").ComponentOptionsMixin, {}, string, import("@vue/runtime-core").PublicProps, Readonly<import("@vue/runtime-core").ExtractPropTypes<{
+    _constants: {
+        type: ObjectConstructor;
+        default: () => {
+            FORM_NAME: string;
+            FORM_ITEM_NAME: string;
+        };
+    };
+    appendToBody: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    error: StringConstructor;
+    for: StringConstructor;
+    inlineMessage: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: string;
+    };
+    label: StringConstructor;
+    labelWidth: StringConstructor;
+    manual: BooleanConstructor;
+    popperOptions: {
+        type: ObjectConstructor;
+        default: () => {};
+    };
+    prop: StringConstructor;
+    required: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    rules: (ObjectConstructor | ArrayConstructor)[];
+    showMessage: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    size: StringConstructor;
+    tipContent: StringConstructor;
+    validateDisabled: BooleanConstructor;
+    validateDebounce: BooleanConstructor;
+    validatePosition: StringConstructor;
+    validateStatus: StringConstructor;
+    validateType: StringConstructor;
+    tiny_mode: StringConstructor;
+    tiny_mode_root: BooleanConstructor;
+    tiny_template: (ObjectConstructor | FunctionConstructor)[];
+    tiny_renderless: FunctionConstructor;
+    tiny_theme: StringConstructor;
+    tiny_chart_theme: ObjectConstructor;
+}>>, {
+    tiny_mode_root: boolean;
+    _constants: Record<string, any>;
+    appendToBody: boolean;
+    manual: boolean;
+    popperOptions: Record<string, any>;
+    required: boolean;
+    inlineMessage: string | boolean;
+    showMessage: boolean;
+    validateDisabled: boolean;
+    validateDebounce: boolean;
+}, {}>;
 export default _default;

package/src/pc.vue.d.ts

@@ -1,2 +1,140 @@
-declare const _default: any;
+import { hooks } from '@opentinyvue/vue-common';
+import type { IFormItemApi } from '@opentinyvue/vue-renderless/types/form-item.type';
+declare const _default: hooks.DefineComponent<{
+    _constants: {
+        type: ObjectConstructor;
+        default: () => {
+            FORM_NAME: string;
+            FORM_ITEM_NAME: string;
+        };
+    };
+    appendToBody: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    error: StringConstructor;
+    for: StringConstructor;
+    inlineMessage: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    messageType: StringConstructor;
+    label: StringConstructor;
+    labelWidth: StringConstructor;
+    manual: BooleanConstructor;
+    popperOptions: {
+        type: ObjectConstructor;
+        default: () => {};
+    };
+    prop: StringConstructor;
+    required: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    rules: (ObjectConstructor | ArrayConstructor)[];
+    showMessage: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    size: StringConstructor;
+    validateDisabled: BooleanConstructor;
+    validateDebounce: BooleanConstructor;
+    validatePosition: StringConstructor;
+    validateStatus: StringConstructor;
+    validateType: StringConstructor;
+    validateIcon: {
+        type: ObjectConstructor;
+        default: null;
+    };
+    ellipsis: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    extra: StringConstructor;
+    tiny_mode: StringConstructor;
+    tiny_mode_root: BooleanConstructor;
+    tiny_template: (ObjectConstructor | FunctionConstructor)[];
+    tiny_renderless: FunctionConstructor;
+    tiny_theme: StringConstructor;
+    tiny_chart_theme: ObjectConstructor;
+}, IFormItemApi, unknown, {}, {}, hooks.ComponentOptionsMixin, hooks.ComponentOptionsMixin, {}, string, hooks.PublicProps, Readonly<hooks.ExtractPropTypes<{
+    _constants: {
+        type: ObjectConstructor;
+        default: () => {
+            FORM_NAME: string;
+            FORM_ITEM_NAME: string;
+        };
+    };
+    appendToBody: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    error: StringConstructor;
+    for: StringConstructor;
+    inlineMessage: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    messageType: StringConstructor;
+    label: StringConstructor;
+    labelWidth: StringConstructor;
+    manual: BooleanConstructor;
+    popperOptions: {
+        type: ObjectConstructor;
+        default: () => {};
+    };
+    prop: StringConstructor;
+    required: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    rules: (ObjectConstructor | ArrayConstructor)[];
+    showMessage: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    size: StringConstructor;
+    validateDisabled: BooleanConstructor;
+    validateDebounce: BooleanConstructor;
+    validatePosition: StringConstructor;
+    validateStatus: StringConstructor;
+    validateType: StringConstructor;
+    validateIcon: {
+        type: ObjectConstructor;
+        default: null;
+    };
+    ellipsis: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    vertical: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    extra: StringConstructor;
+    tiny_mode: StringConstructor;
+    tiny_mode_root: BooleanConstructor;
+    tiny_template: (ObjectConstructor | FunctionConstructor)[];
+    tiny_renderless: FunctionConstructor;
+    tiny_theme: StringConstructor;
+    tiny_chart_theme: ObjectConstructor;
+}>>, {
+    ellipsis: boolean;
+    tiny_mode_root: boolean;
+    _constants: Record<string, any>;
+    appendToBody: boolean;
+    manual: boolean;
+    popperOptions: Record<string, any>;
+    vertical: boolean;
+    required: boolean;
+    inlineMessage: boolean;
+    showMessage: boolean;
+    validateDisabled: boolean;
+    validateDebounce: boolean;
+    validateIcon: Record<string, any>;
+}, {}>;
 export default _default;