vft 0.0.428 → 0.0.430

package/es/components/image-viewer/image-viewer.vue2.js

@@ -0,0 +1,299 @@
+import { defineComponent as A, ref as h, effectScope as ne, computed as w, watch as R, nextTick as oe, onMounted as ae, createBlock as se, openBlock as z, unref as e, withCtx as S, createVNode as d, Transition as ie, createElementVNode as c, normalizeStyle as V, normalizeClass as l, createElementBlock as E, createCommentVNode as le, renderSlot as re, withModifiers as ce, Fragment as H, renderList as ue, withDirectives as fe, vShow as de } from "vue";
+import { EVENT_CODE as p } from "@vft/constants";
+import { isNumber as Z } from "@vft/utils";
+import { VftIcon as v } from "../icon/index.js";
+import { useEventListener as I } from "@vueuse/core";
+import "../config-provider/hooks/use-global-config.js";
+import { throttle as T } from "lodash-es";
+import "../form/index.js";
+import { useNamespace as me } from "../../hooks/use-namespace/index.js";
+import "../../hooks/use-model-toggle/index.js";
+import "@popperjs/core";
+import { useZIndex as ve } from "../../hooks/use-z-index/index.js";
+import { VftTeleport as ge } from "../teleport/index.js";
+const ke = ["src"], be = A({
+  name: "vft-image-viewer"
+}), Ye = /* @__PURE__ */ A({
+  ...be,
+  props: {
+    urlList: { default: () => [] },
+    zIndex: {},
+    initialIndex: { default: 0 },
+    infinite: { type: Boolean, default: !0 },
+    hideOnClickModal: { type: Boolean, default: !1 },
+    teleported: { type: Boolean, default: !1 },
+    closeOnPressEscape: { type: Boolean, default: !0 },
+    zoomRate: { default: 1.2 }
+  },
+  emits: {
+    close: () => !0,
+    switch: (o) => Z(o)
+  },
+  setup(o, { expose: P, emit: W }) {
+    const s = me("image-viewer"), $ = W, { nextZIndex: j } = ve(), C = h(), X = h([]), Y = ne(), k = h(!0), m = h(o.initialIndex), i = h({
+      scale: 1,
+      deg: 0,
+      offsetX: 0,
+      offsetY: 0,
+      enableTransition: !1
+    }), q = w(() => o.urlList.length <= 1), O = w(() => m.value === 0), M = w(() => m.value === o.urlList.length - 1), G = w(() => o.urlList[m.value]), J = w(() => {
+      const { scale: n, deg: t, offsetX: a, offsetY: r, enableTransition: x } = i.value;
+      let u = a / n, f = r / n;
+      switch (t % 360) {
+        case 90:
+        case -270:
+          [u, f] = [f, -u];
+          break;
+        case 180:
+        case -180:
+          [u, f] = [-u, -f];
+          break;
+        case 270:
+        case -90:
+          [u, f] = [-f, u];
+          break;
+      }
+      const b = {
+        transform: `scale(${n}) rotate(${t}deg) translate(${u}px, ${f}px)`,
+        transition: x ? "transform .3s" : ""
+      };
+      return b.maxWidth = b.maxHeight = "100%", b;
+    }), K = w(() => Z(o.zIndex) ? o.zIndex : j());
+    function y() {
+      U(), $("close");
+    }
+    function Q() {
+      const n = T((a) => {
+        switch (a.code) {
+          // ESC
+          case p.esc:
+            o.closeOnPressEscape && y();
+            break;
+          // SPACE
+          case p.space:
+            B();
+            break;
+          // LEFT_ARROW
+          case p.left:
+            D();
+            break;
+          // UP_ARROW
+          case p.up:
+            g("zoomIn");
+            break;
+          // RIGHT_ARROW
+          case p.right:
+            F();
+            break;
+          // DOWN_ARROW
+          case p.down:
+            g("zoomOut");
+            break;
+        }
+      }), t = T((a) => {
+        const r = a.deltaY || a.deltaX;
+        g(r < 0 ? "zoomIn" : "zoomOut", {
+          zoomRate: o.zoomRate,
+          enableTransition: !1
+        });
+      });
+      Y.run(() => {
+        I(document, "keydown", n), I(document, "wheel", t);
+      });
+    }
+    function U() {
+      Y.stop();
+    }
+    function _() {
+      k.value = !1;
+    }
+    function ee(n) {
+      k.value = !1, n.target.alt = "加载失败";
+    }
+    function te(n) {
+      if (k.value || n.button !== 0 || !C.value) return;
+      i.value.enableTransition = !1;
+      const { offsetX: t, offsetY: a } = i.value, r = n.pageX, x = n.pageY, u = T((b) => {
+        i.value = {
+          ...i.value,
+          offsetX: t + b.pageX - r,
+          offsetY: a + b.pageY - x
+        };
+      }), f = I(document, "mousemove", u);
+      I(document, "mouseup", () => {
+        f();
+      }), n.preventDefault();
+    }
+    function N() {
+      i.value = {
+        scale: 1,
+        deg: 0,
+        offsetX: 0,
+        offsetY: 0,
+        enableTransition: !1
+      };
+    }
+    function B() {
+      k.value || N();
+    }
+    function L(n) {
+      const t = o.urlList.length;
+      m.value = (n + t) % t;
+    }
+    function D() {
+      O.value && !o.infinite || L(m.value - 1);
+    }
+    function F() {
+      M.value && !o.infinite || L(m.value + 1);
+    }
+    function g(n, t = {}) {
+      if (k.value) return;
+      const { rotateDeg: a, enableTransition: r } = {
+        rotateDeg: 90,
+        enableTransition: !0,
+        ...t
+      };
+      switch (n) {
+        case "zoomOut":
+          i.value.scale > 0.2 && (i.value.scale = Number.parseFloat(
+            (i.value.scale / o.zoomRate).toFixed(3)
+          ));
+          break;
+        case "zoomIn":
+          i.value.scale < 7 && (i.value.scale = Number.parseFloat(
+            (i.value.scale * o.zoomRate).toFixed(3)
+          ));
+          break;
+        case "clockwise":
+          i.value.deg += a;
+          break;
+        case "anticlockwise":
+          i.value.deg -= a;
+          break;
+      }
+      i.value.enableTransition = r;
+    }
+    return R(G, () => {
+      oe(() => {
+        X.value[0]?.complete || (k.value = !0);
+      });
+    }), R(m, (n) => {
+      N(), $("switch", n);
+    }), ae(() => {
+      Q(), C.value?.focus?.();
+    }), P({
+      /** @description manually switch image */
+      setActiveItem: L
+    }), (n, t) => (z(), se(e(ge), {
+      to: "body",
+      disabled: !o.teleported
+    }, {
+      default: S(() => [
+        d(ie, {
+          name: "viewer-fade",
+          appear: ""
+        }, {
+          default: S(() => [
+            c("div", {
+              ref_key: "wrapper",
+              ref: C,
+              tabindex: -1,
+              class: l(e(s).e("wrapper")),
+              style: V({ zIndex: K.value })
+            }, [
+              c("div", {
+                class: l(e(s).e("mask")),
+                onClick: t[0] || (t[0] = ce((a) => o.hideOnClickModal && y(), ["self"]))
+              }, null, 2),
+              c("span", {
+                class: l([e(s).e("btn"), e(s).e("close")]),
+                onClick: y
+              }, [
+                d(e(v), { icon: "icon-close" })
+              ], 2),
+              q.value ? le("", !0) : (z(), E(H, { key: 0 }, [
+                c("span", {
+                  class: l([
+                    e(s).e("btn"),
+                    e(s).e("prev"),
+                    e(s).is("disabled", !o.infinite && O.value)
+                  ]),
+                  onClick: D
+                }, [
+                  d(e(v), { icon: "icon-arrow-left" })
+                ], 2),
+                c("span", {
+                  class: l([
+                    e(s).e("btn"),
+                    e(s).e("next"),
+                    e(s).is("disabled", !o.infinite && M.value)
+                  ]),
+                  onClick: F
+                }, [
+                  d(e(v), { icon: "icon-arrow-right" })
+                ], 2)
+              ], 64)),
+              c("div", {
+                class: l([e(s).e("btn"), e(s).e("actions")])
+              }, [
+                c("div", {
+                  class: l(e(s).e("actions__inner"))
+                }, [
+                  d(e(v), {
+                    icon: "icon-zoom-out",
+                    onClick: t[1] || (t[1] = (a) => g("zoomOut"))
+                  }),
+                  d(e(v), {
+                    icon: "icon-zoom-in",
+                    onClick: t[2] || (t[2] = (a) => g("zoomIn"))
+                  }),
+                  c("i", {
+                    class: l(e(s).e("actions__divider"))
+                  }, null, 2),
+                  d(e(v), {
+                    icon: "icon-scale-to-original",
+                    onClick: B
+                  }),
+                  c("i", {
+                    class: l(e(s).e("actions__divider"))
+                  }, null, 2),
+                  d(e(v), {
+                    icon: "icon-refresh-left",
+                    onClick: t[3] || (t[3] = (a) => g("anticlockwise"))
+                  }),
+                  d(e(v), {
+                    icon: "icon-refresh-right",
+                    onClick: t[4] || (t[4] = (a) => g("clockwise"))
+                  })
+                ], 2)
+              ], 2),
+              c("div", {
+                class: l(e(s).e("canvas"))
+              }, [
+                (z(!0), E(H, null, ue(o.urlList, (a, r) => fe((z(), E("img", {
+                  ref_for: !0,
+                  ref: (x) => X.value[r] = x,
+                  key: a,
+                  src: a,
+                  style: V(J.value),
+                  class: l(e(s).e("img")),
+                  onLoad: _,
+                  onError: ee,
+                  onMousedown: te
+                }, null, 46, ke)), [
+                  [de, r === m.value]
+                ])), 128))
+              ], 2),
+              re(n.$slots, "default")
+            ], 6)
+          ]),
+          _: 3
+        })
+      ]),
+      _: 3
+    }, 8, ["disabled"]));
+  }
+});
+export {
+  Ye as default
+};

package/es/components/infinite-scroll/index.d.ts

@@ -13,4 +13,4 @@ export declare const VftInfiniteScroll: SFCWithInstall<import("vue").ObjectDirec
         onScroll: () => void;
         observer?: MutationObserver;
     };
-}, () => void, string, string>>;
+}, () => void, string, any>>;

package/es/components/input/input.vue2.js

@@ -0,0 +1,379 @@
+import { defineComponent as Oe, useAttrs as Te, useSlots as Le, computed as l, ref as S, getCurrentInstance as je, shallowRef as H, watch as U, nextTick as E, onMounted as We, withDirectives as He, createElementBlock as c, openBlock as i, mergeProps as h, Fragment as q, createCommentVNode as u, createElementVNode as w, normalizeClass as r, unref as a, renderSlot as $, createBlock as V, withKeys as Ue, withModifiers as me, toDisplayString as D, normalizeStyle as qe, vShow as Ge } from "vue";
+import "../form/index.js";
+import { VftIcon as B } from "../icon/index.js";
+import { useResizeObserver as Je, isClient as Qe } from "@vueuse/core";
+import { isString as A, singleAttrToObj as G, noop as Xe, isObject as ve } from "@vft/utils";
+import { debugWarn as J } from "../../utils/error.js";
+import "../config-provider/hooks/use-global-config.js";
+import { isNil as Ye } from "lodash-es";
+import { useNamespace as ye } from "../../hooks/use-namespace/index.js";
+import "../../hooks/use-model-toggle/index.js";
+import "@popperjs/core";
+import "../../hooks/use-z-index/index.js";
+import { UPDATE_MODEL_EVENT as Q } from "@vft/constants";
+import { useAttrs as Ze, useCursor as _e } from "@vft/use";
+import { calcTextareaHeight as he } from "./utils.js";
+import { useFormItem as et, useFormItemInputId as tt } from "../form/hooks/use-form-item.js";
+import { useFormSize as at, useFormDisabled as nt } from "../form/hooks/use-form-common-props.js";
+const ot = ["role"], lt = ["id", "type", "disabled", "formatter", "parser", "readonly", "autocomplete", "tabindex", "aria-label", "placeholder", "form"], st = ["id", "tabindex", "disabled", "readonly", "autocomplete", "aria-label", "placeholder", "form"], It = /* @__PURE__ */ Oe({
+  __name: "input",
+  props: {
+    id: {},
+    size: { default: "" },
+    disabled: { type: Boolean },
+    modelValue: {},
+    type: { default: "text" },
+    resize: {},
+    autosize: { type: [Object, Boolean], default: !1 },
+    autocomplete: { default: "off" },
+    formatter: {},
+    parser: {},
+    placeholder: {},
+    form: {},
+    readonly: { type: Boolean },
+    clearable: { type: Boolean },
+    showPassword: { type: Boolean },
+    showWordLimit: { type: Boolean },
+    suffixIcon: {},
+    prefixIcon: {},
+    clearIcon: {},
+    containerRole: {},
+    label: {},
+    tabindex: { default: 0 },
+    validateEvent: { type: Boolean, default: !0 },
+    inputStyle: { type: [Boolean, null, String, Object, Array] }
+  },
+  emits: {
+    [Q]: (e) => A(e),
+    input: (e) => A(e),
+    change: (e) => A(e),
+    suffixClick: (e) => A(e),
+    prefixClick: (e) => A(e),
+    focus: (e) => e instanceof FocusEvent,
+    blur: (e) => e instanceof FocusEvent,
+    clear: () => !0,
+    enter: () => !0,
+    mouseleave: (e) => e instanceof MouseEvent,
+    mouseenter: (e) => e instanceof MouseEvent,
+    // NOTE: when autofill by browser, the keydown event is instanceof Event, not KeyboardEvent
+    keydown: (e) => e instanceof Event,
+    compositionstart: (e) => e instanceof CompositionEvent,
+    compositionupdate: (e) => e instanceof CompositionEvent,
+    compositionend: (e) => e instanceof CompositionEvent
+  },
+  setup(e, { expose: xe, emit: pe }) {
+    const s = pe, g = Te(), m = Le(), X = l(() => {
+      const t = {};
+      return e.containerRole === "combobox" && (t["aria-haspopup"] = g["aria-haspopup"], t["aria-owns"] = g["aria-owns"], t["aria-expanded"] = g["aria-expanded"]), t;
+    }), be = l(() => [
+      e.type === "textarea" ? Z.b() : n.b(),
+      n.m(ke.value),
+      n.is("disabled", x.value),
+      n.is("exceed", Ee.value),
+      n.is("focus", v.value),
+      {
+        [n.b("group")]: m.prepend || m.append,
+        [n.bm("group", "append")]: m.append,
+        [n.bm("group", "prepend")]: m.prepend,
+        [n.m("prefix")]: m.prefix || e.prefixIcon,
+        [n.m("suffix")]: m.suffix || e.suffixIcon || e.clearable || e.showPassword,
+        [n.bm("suffix", "password-clear")]: P.value && L.value
+      },
+      g.class
+    ]), we = je(), ge = l(() => [
+      n.e("wrapper"),
+      n.is("focus", v.value)
+    ]), d = Ze({
+      excludeKeys: l(() => Object.keys(X.value))
+    }), { form: Ce, formItem: F } = et(), { inputId: Y } = tt(we.props, {
+      formItemContext: F
+    }), ke = at(), x = nt(), n = ye("input"), Z = ye("textarea"), M = H(), p = H(), v = S(!1), N = S(!1), C = S(!1), K = S(!1), _ = S(), O = H(e.inputStyle), k = l(() => M.value || p.value), T = l(() => G(e.prefixIcon, "icon", { size: 16 })), ee = l(() => G(e.suffixIcon, "icon", { size: 16 })), Ie = l(() => G(e.clearIcon, "icon", {
+      icon: "icon-circle-close",
+      size: 16
+    })), te = l(() => Ce?.statusIcon ?? !1), I = l(() => F?.validateState || ""), ae = l(
+      () => I.value && {
+        validating: "icon-loading",
+        success: "icon-circle-check",
+        error: "icon-circle-close"
+      }[I.value]
+    ), ze = l(
+      () => K.value ? { icon: "icon-view", size: 16 } : { icon: "icon-hide", size: 16 }
+    ), Se = l(() => [
+      g.style,
+      e.inputStyle
+    ]), ne = l(() => [
+      e.inputStyle,
+      O.value,
+      { resize: e.resize }
+    ]), f = l(
+      () => Ye(e.modelValue) ? "" : String(e.modelValue)
+    ), P = l(
+      () => e.clearable && !x.value && !e.readonly && !!f.value && (v.value || N.value)
+    ), L = l(
+      () => e.showPassword && !x.value && !e.readonly && !!f.value && (!!f.value || v.value)
+    ), b = l(
+      () => e.showWordLimit && !!d.value.maxlength && (e.type === "text" || e.type === "textarea") && !x.value && !e.readonly && !e.showPassword
+    ), j = l(() => Array.from(f.value).length), Ee = l(
+      () => (
+        // show exceed style if length of initial value greater then maxlength
+        !!b.value && j.value > Number(d.value.maxlength)
+      )
+    ), Ve = l(
+      () => !!m.suffix || !!e.suffixIcon || P.value || e.showPassword || b.value || !!I.value && te.value
+    ), [Be, Ae] = _e(M);
+    Je(p, (t) => {
+      if (!b.value || e.resize !== "both") return;
+      const o = t[0], { width: y } = o.contentRect;
+      _.value = {
+        /** right: 100% - width + padding(15) + right(6) */
+        right: `calc(100% - ${y + 15 + 6}px)`
+      };
+    });
+    const R = () => {
+      if (!(!Qe || e.type !== "textarea"))
+        if (e.autosize) {
+          const t = ve(e.autosize) ? e.autosize.minRows : void 0, o = ve(e.autosize) ? e.autosize.maxRows : void 0;
+          O.value = {
+            ...he(p.value, t, o)
+          };
+        } else
+          O.value = {
+            minHeight: he(p.value).minHeight
+          };
+    }, z = () => {
+      const t = k.value;
+      !t || t.value === f.value || (t.value = f.value);
+    }, W = async (t) => {
+      Be();
+      let { value: o } = t.target;
+      if (d.value.maxlength && o.length >= d.value.maxlength && (o = o.slice(0, Number(d.value.maxlength))), e.formatter && (o = e.parser ? e.parser(o) : o, o = e.formatter(o)), !C.value) {
+        if (o === f.value) {
+          z();
+          return;
+        }
+        s(Q, o), s("input", o), await E(), z(), Ae();
+      }
+    }, oe = (t) => {
+      s("change", t.target.value);
+    }, Fe = () => {
+      s("suffixClick", e.modelValue);
+    }, Me = () => {
+      s("prefixClick", e.modelValue);
+    }, le = (t) => {
+      s("compositionstart", t), C.value = !0;
+    }, Ke = (t) => /([(\uAC00-\uD7AF)|\u3130-\u318F])+/.test(t), se = (t) => {
+      s("compositionupdate", t);
+      const o = t.target?.value, y = o[o.length - 1] || "";
+      C.value = !Ke(y);
+    }, ie = (t) => {
+      s("compositionend", t), C.value && (C.value = !1, W(t));
+    }, Pe = () => {
+      K.value = !K.value, ue();
+    }, ue = async () => {
+      await E(), k.value?.focus();
+    }, Re = () => k.value?.blur(), re = (t) => {
+      v.value = !0, s("focus", t);
+    }, ce = (t) => {
+      v.value = !1, s("blur", t), e.validateEvent && F?.validate?.("blur").catch((o) => J(o));
+    }, $e = (t) => {
+      N.value = !1, s("mouseleave", t);
+    }, De = (t) => {
+      N.value = !0, s("mouseenter", t);
+    }, de = (t) => {
+      let o = t.key;
+      if (t.target.type === "number" && ["e", "+", "-0", "E"].includes(o))
+        return t.returnValue = !1, !1;
+      s("keydown", t);
+    }, Ne = () => {
+      k.value?.select();
+    }, fe = () => {
+      s(Q, ""), s("change", ""), s("clear"), s("input", "");
+    };
+    return U(
+      () => e.modelValue,
+      () => {
+        E(() => R()), e.validateEvent && F?.validate?.("change").catch((t) => J(t));
+      }
+    ), U(f, () => z()), U(
+      () => e.type,
+      async () => {
+        await E(), z(), R();
+      }
+    ), We(() => {
+      !e.formatter && e.parser && J(
+        "VftInput",
+        "If you set the parser, you also need to set the formatter."
+      ), z(), E(R);
+    }), xe({
+      /** @description HTML input element */
+      input: M,
+      /** @description HTML textarea element */
+      textarea: p,
+      /** @description HTML element, input or textarea */
+      ref: k,
+      /** @description style of textarea. */
+      textareaStyle: ne,
+      /** @description from props (used on unit test) */
+      autosize: e.autosize,
+      /** @description HTML input element native method */
+      focus: ue,
+      /** @description HTML input element native method */
+      blur: Re,
+      /** @description HTML input element native method */
+      select: Ne,
+      /** @description clear input value */
+      clear: fe,
+      /** @description resize textarea. */
+      resizeTextarea: R
+    }), (t, o) => He((i(), c("div", h(X.value, {
+      class: be.value,
+      style: Se.value,
+      role: e.containerRole,
+      onMouseenter: De,
+      onMouseleave: $e,
+      onMousewheel: o[1] || (o[1] = (y) => e.type === "number" && v.value ? y.preventDefault() : null)
+    }), [
+      e.type !== "textarea" ? (i(), c(q, { key: 0 }, [
+        t.$slots.prepend ? (i(), c("div", {
+          key: 0,
+          class: r(a(n).be("group", "prepend"))
+        }, [
+          $(t.$slots, "prepend")
+        ], 2)) : u("", !0),
+        w("div", {
+          class: r(ge.value)
+        }, [
+          t.$slots.prefix || T.value?.icon ? (i(), c("span", {
+            key: 0,
+            class: r(a(n).e("prefix"))
+          }, [
+            w("span", {
+              class: r(a(n).e("prefix-inner")),
+              onClick: Me
+            }, [
+              $(t.$slots, "prefix"),
+              T.value?.icon ? (i(), V(a(B), h({
+                key: 0,
+                pointer: ""
+              }, T.value, {
+                class: a(n).e("icon")
+              }), null, 16, ["class"])) : u("", !0)
+            ], 2)
+          ], 2)) : u("", !0),
+          w("input", h({
+            id: a(Y),
+            ref_key: "input",
+            ref: M,
+            class: a(n).e("inner")
+          }, a(d), {
+            type: e.showPassword ? K.value ? "text" : "password" : e.type,
+            disabled: a(x),
+            formatter: e.formatter,
+            parser: e.parser,
+            readonly: e.readonly,
+            autocomplete: e.autocomplete,
+            tabindex: e.tabindex,
+            "aria-label": e.label,
+            placeholder: e.placeholder,
+            style: e.inputStyle,
+            form: e.form,
+            onCompositionstart: le,
+            onCompositionupdate: se,
+            onCompositionend: ie,
+            onInput: W,
+            onFocus: re,
+            onBlur: ce,
+            onChange: oe,
+            onKeydown: de,
+            onKeyup: o[0] || (o[0] = Ue((y) => s("enter"), ["enter"]))
+          }), null, 16, lt),
+          Ve.value ? (i(), c("span", {
+            key: 1,
+            class: r(a(n).e("suffix"))
+          }, [
+            w("span", {
+              class: r(a(n).e("suffix-inner")),
+              onClick: Fe
+            }, [
+              !P.value || !L.value || !b.value ? (i(), c(q, { key: 0 }, [
+                $(t.$slots, "suffix"),
+                ee.value?.icon ? (i(), V(a(B), h({ key: 0 }, ee.value, {
+                  class: a(n).e("icon")
+                }), null, 16, ["class"])) : u("", !0)
+              ], 64)) : u("", !0),
+              P.value ? (i(), V(a(B), h({
+                key: 1,
+                pointer: "",
+                class: [a(n).e("icon"), a(n).e("clear")]
+              }, Ie.value, {
+                onMousedown: me(a(Xe), ["prevent"]),
+                onClick: me(fe, ["stop"])
+              }), null, 16, ["class", "onMousedown"])) : u("", !0),
+              L.value ? (i(), V(a(B), h({ key: 2 }, ze.value, {
+                class: [a(n).e("icon"), a(n).e("password")],
+                onClick: Pe
+              }), null, 16, ["class"])) : u("", !0),
+              b.value ? (i(), c("span", {
+                key: 3,
+                class: r(a(n).e("count"))
+              }, [
+                w("span", {
+                  class: r(a(n).e("count-inner"))
+                }, D(j.value) + " / " + D(a(d).maxlength), 3)
+              ], 2)) : u("", !0),
+              I.value && ae.value && te.value ? (i(), V(a(B), {
+                key: 4,
+                icon: ae.value,
+                class: r([
+                  a(n).e("icon"),
+                  a(n).e("validateIcon"),
+                  a(n).is("loading", I.value === "validating")
+                ])
+              }, null, 8, ["icon", "class"])) : u("", !0)
+            ], 2)
+          ], 2)) : u("", !0)
+        ], 2),
+        t.$slots.append ? (i(), c("div", {
+          key: 1,
+          class: r(a(n).be("group", "append"))
+        }, [
+          $(t.$slots, "append")
+        ], 2)) : u("", !0)
+      ], 64)) : (i(), c(q, { key: 1 }, [
+        w("textarea", h({
+          id: a(Y),
+          ref_key: "textarea",
+          ref: p,
+          class: a(Z).e("inner")
+        }, a(d), {
+          tabindex: e.tabindex,
+          disabled: a(x),
+          readonly: e.readonly,
+          autocomplete: e.autocomplete,
+          style: ne.value,
+          "aria-label": e.label,
+          placeholder: e.placeholder,
+          form: e.form,
+          onCompositionstart: le,
+          onCompositionupdate: se,
+          onCompositionend: ie,
+          onInput: W,
+          onFocus: re,
+          onBlur: ce,
+          onChange: oe,
+          onKeydown: de
+        }), null, 16, st),
+        b.value ? (i(), c("span", {
+          key: 0,
+          style: qe(_.value),
+          class: r(a(n).e("count"))
+        }, D(j.value) + " / " + D(a(d).maxlength), 7)) : u("", !0)
+      ], 64))
+    ], 16, ot)), [
+      [Ge, e.type !== "hidden"]
+    ]);
+  }
+});
+export {
+  It as default
+};