@toife/vue 1.3.6 → 2.0.0

package/dist/index.es.js

@@ -1,25 +1,25 @@
-import { createElementBlock as p, openBlock as c, renderSlot as b, defineComponent as h, ref as v, computed as w, reactive as ce, watch as X, onMounted as G, Fragment as W, withDirectives as M, createCommentVNode as I, normalizeStyle as x, normalizeClass as S, vShow as H, createElementVNode as $, createVNode as U, createBlock as E, withCtx as V, toDisplayString as R, renderList as F, createTextVNode as N, createApp as j, h as K, provide as ie, unref as A, onUnmounted as se, resolveDynamicComponent as be, markRaw as he, inject as ue, useAttrs as ke, nextTick as ae } from "vue";
-import { gesture as re } from "@toife/gesture";
-import { useRouter as de, useRoute as $e } from "vue-router";
-const we = (e) => e && (e.tagName == "INPUT" || e.tagName == "TEXTAREA" || e.isContentEditable), xe = () => {
+import { createElementBlock as p, openBlock as c, renderSlot as b, defineComponent as h, ref as v, computed as w, reactive as ce, watch as X, onMounted as G, Fragment as W, withDirectives as L, createCommentVNode as z, normalizeStyle as x, normalizeClass as S, vShow as H, createElementVNode as $, createVNode as U, createBlock as E, withCtx as P, toDisplayString as V, renderList as F, createTextVNode as N, createApp as j, h as K, provide as ie, unref as A, onUnmounted as re, resolveDynamicComponent as be, markRaw as he, inject as ue, useAttrs as ke, withModifiers as $e, nextTick as oe } from "vue";
+import { gesture as ne } from "@toife/gesture";
+import { useRouter as de, useRoute as we } from "vue-router";
+const xe = (e) => e && (e.tagName == "INPUT" || e.tagName == "TEXTAREA" || e.isContentEditable), Te = () => {
   const e = document.activeElement;
   e && (e.tagName === "INPUT" || e.tagName === "TEXTAREA" || e.isContentEditable) && e.blur();
-}, Te = () => {
+}, Se = () => {
   document.addEventListener("contextmenu", (e) => e.preventDefault()), document.addEventListener("selectstart", (e) => e.preventDefault()), document.addEventListener("pointerup", (e) => {
-    !we(e.target) && xe();
+    !xe(e.target) && Te();
   });
-}, _ = (e, o) => {
+}, g = (e, o) => {
   const t = e.__vccOpts || e;
   for (const [s, r] of o)
     t[s] = r;
   return t;
-}, Se = {}, Be = { class: "t-app" };
+}, Be = {}, Ce = { class: "t-app" };
 function ze(e, o) {
-  return c(), p("div", Be, [
+  return c(), p("div", Ce, [
     b(e.$slots, "default")
   ]);
 }
-const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
+const Ie = /* @__PURE__ */ g(Be, [["render", ze]]), Ee = /* @__PURE__ */ h({
   __name: "t-present",
   props: {
     keepalive: { type: Boolean, default: !0 },
@@ -31,21 +31,21 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
   },
   emits: ["dismiss"],
   setup(e, { expose: o, emit: t }) {
-    const s = v(0), r = v(!1), l = v(), d = v(), a = e, f = t, i = w(() => r.value || a.keepalive), g = ce({
+    const s = v(0), r = v(!1), l = v(), d = v(), a = e, f = t, y = w(() => r.value || a.keepalive), u = ce({
       "--t-present-backdrop-opacity": "0.4",
       "--t-present-transition": "0.2s",
       "--t-present-content-transform": "0px",
       "--t-present-content-opacity": "1"
     }), n = (m) => {
-      a.backdrop ? m?.backdropOpacity && (g["--t-present-backdrop-opacity"] = m.backdropOpacity) : g["--t-present-backdrop-opacity"] = "0", m?.transition && (g["--t-present-transition"] = m.transition, g["--t-present-transition"] = m.transition), m?.contentTransform && (g["--t-present-content-transform"] = m.contentTransform), m?.contentOpacity && (g["--t-present-content-opacity"] = m.contentOpacity);
-    }, u = () => {
+      a.backdrop ? m?.backdropOpacity && (u["--t-present-backdrop-opacity"] = m.backdropOpacity) : u["--t-present-backdrop-opacity"] = "0", m?.transition && (u["--t-present-transition"] = m.transition, u["--t-present-transition"] = m.transition), m?.contentTransform && (u["--t-present-content-transform"] = m.contentTransform), m?.contentOpacity && (u["--t-present-content-opacity"] = m.contentOpacity);
+    }, i = () => {
       n({
         contentTransform: "0px",
         transition: "0.2s",
         backdropOpacity: "0.4",
         contentOpacity: "1"
       });
-    }, y = () => {
+    }, _ = () => {
       let m = "0px", O = "1";
       a.placement == "bottom" || a.placement == "right" ? m = "100%" : a.placement == "top" || a.placement == "left" ? m = "-100%" : a.placement == "center" && (m = "0px", O = "0"), n({
         contentTransform: m,
@@ -55,46 +55,46 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       });
     };
     X(() => a.visible, () => {
-      a.visible ? (r.value = !0, s.value = He.getNewIndex(), setTimeout(() => {
-        u();
-      }, 50)) : (y(), setTimeout(() => {
+      a.visible ? (r.value = !0, s.value = Fe.getNewIndex(), setTimeout(() => {
+        i();
+      }, 50)) : (_(), setTimeout(() => {
         r.value = !1;
       }, 200));
     }), o({
       render: n,
-      open: u,
-      close: y
+      open: i,
+      close: _
     });
     const k = (m) => {
       m.preventDefault(), f("dismiss", "backdrop");
     };
     return G(() => {
-      a.visible ? u() : y();
+      a.visible ? i() : _();
     }), (m, O) => (c(), p(W, null, [
-      i.value ? M((c(), p("div", {
+      y.value ? L((c(), p("div", {
         key: 0,
         class: S(["t-present", [{ [m.placement]: !0 }, a.class]]),
         ref_key: "present",
         ref: d,
-        style: x([g, { zIndex: s.value }, a.style])
+        style: x([u, { zIndex: s.value }, a.style])
       }, [
         b(m.$slots, "default", {}, void 0, !0)
       ], 6)), [
         [H, r.value]
-      ]) : I("", !0),
-      i.value ? M((c(), p("div", {
+      ]) : z("", !0),
+      y.value ? L((c(), p("div", {
         key: 1,
         class: "t-present-backdrop",
         onClick: k,
         ref_key: "backdrop",
         ref: l,
-        style: x([g, { zIndex: s.value - 1 }, a.style])
+        style: x([u, { zIndex: s.value - 1 }, a.style])
       }, null, 4)), [
         [H, r.value]
-      ]) : I("", !0)
+      ]) : z("", !0)
     ], 64));
   }
-}), L = /* @__PURE__ */ _(Ce, [["__scopeId", "data-v-1b25059f"]]), Ee = /* @__PURE__ */ h({
+}), q = /* @__PURE__ */ g(Ee, [["__scopeId", "data-v-1b25059f"]]), Ve = /* @__PURE__ */ h({
   __name: "t-loading-icon",
   props: {
     size: {
@@ -118,10 +118,10 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       "aria-label": "Loading..."
     }, null, 4));
   }
-}), J = /* @__PURE__ */ _(Ee, [["__scopeId", "data-v-7c463303"]]), Ve = { class: "t-button-content" }, Pe = {
+}), J = /* @__PURE__ */ g(Ve, [["__scopeId", "data-v-7c463303"]]), Pe = { class: "t-button-content" }, Re = {
   key: 0,
   class: "loader"
-}, Re = /* @__PURE__ */ h({
+}, Ae = /* @__PURE__ */ h({
   __name: "t-button",
   props: {
     color: { default: null },
@@ -178,23 +178,23 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       class: S(["t-button", { "active-background": o.activeBackground, rounded: o.rounded, block: o.block, ["size-" + o.size]: !0 }]),
       style: x(t.value)
     }, [
-      M($("span", Ve, [
+      L($("span", Pe, [
         b(s.$slots, "default", {}, void 0, !0)
       ], 512), [
         [H, !o.loading]
       ]),
-      o.loading ? (c(), p("span", Pe, [
+      o.loading ? (c(), p("span", Re, [
         U(J, {
           color: "var(--color)",
           type: o.loadingType
         }, null, 8, ["type"])
-      ])) : I("", !0)
+      ])) : z("", !0)
     ], 6));
   }
-}), Q = /* @__PURE__ */ _(Re, [["__scopeId", "data-v-185a9e49"]]), Ae = {
+}), Q = /* @__PURE__ */ g(Ae, [["__scopeId", "data-v-185a9e49"]]), De = {
   key: 0,
   class: "t-alert-header"
-}, De = { class: "t-alert-content" }, Xe = { class: "t-alert-footer" }, Oe = /* @__PURE__ */ h({
+}, Xe = { class: "t-alert-content" }, Oe = { class: "t-alert-footer" }, We = /* @__PURE__ */ h({
   __name: "t-alert",
   props: {
     title: {},
@@ -206,43 +206,43 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
   setup(e, { expose: o, emit: t }) {
     const s = e, r = v(!1), l = t, d = v(), a = v(!1), f = () => {
       r.value = !0;
-    }, i = (n) => {
+    }, y = (n) => {
       r.value = !1, n.handler && n.handler(), l("dismiss", "choose", n?.data);
-    }, g = (n) => {
+    }, u = (n) => {
       s.dismiss && s.dismiss.includes(n) ? (r.value = !1, l("dismiss", n)) : n == "backdrop" && (a.value = !0, setTimeout(() => {
         a.value = !1;
       }, 300));
     };
     return o({
       open: f
-    }), (n, u) => (c(), E(L, {
+    }), (n, i) => (c(), E(q, {
       placement: "center",
       backdrop: !0,
       keepalive: !1,
       visible: r.value,
-      onDismiss: g
+      onDismiss: u
     }, {
-      default: V(() => [
+      default: P(() => [
         $("div", {
           class: S(["t-alert", { pop: a.value }]),
           ref_key: "container",
           ref: d
         }, [
           b(n.$slots, "header", {}, () => [
-            s.title ? (c(), p("div", Ae, R(s.title), 1)) : I("", !0)
+            s.title ? (c(), p("div", De, V(s.title), 1)) : z("", !0)
           ], !0),
           b(n.$slots, "content", {}, () => [
-            $("div", De, R(s.message), 1)
+            $("div", Xe, V(s.message), 1)
           ], !0),
           b(n.$slots, "footer", {}, () => [
-            $("div", Xe, [
-              (c(!0), p(W, null, F(s.actions, (y) => (c(), E(Q, {
-                color: y.color,
-                variant: y.variant,
-                onClick: (k) => i(y)
+            $("div", Oe, [
+              (c(!0), p(W, null, F(s.actions, (_) => (c(), E(Q, {
+                color: _.color,
+                variant: _.variant,
+                onClick: (k) => y(_)
               }, {
-                default: V(() => [
-                  N(R(y.text), 1)
+                default: P(() => [
+                  N(V(_.text), 1)
                 ]),
                 _: 2
               }, 1032, ["color", "variant", "onClick"]))), 256))
@@ -253,7 +253,7 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       _: 3
     }, 8, ["visible"]));
   }
-}), pe = /* @__PURE__ */ _(Oe, [["__scopeId", "data-v-05d0c578"]]), $o = (e = {}) => ({
+}), pe = /* @__PURE__ */ g(We, [["__scopeId", "data-v-05d0c578"]]), wo = (e = {}) => ({
   open() {
     return new Promise((o) => {
       let t = document.body.querySelector(".t-app");
@@ -278,7 +278,7 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       }, 50);
     });
   }
-}), We = /* @__PURE__ */ h({
+}), Ne = /* @__PURE__ */ h({
   __name: "t-action",
   props: {
     actions: {},
@@ -289,9 +289,9 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
   setup(e, { expose: o, emit: t }) {
     const s = e, r = v(!1), l = t, d = v(), a = v(!1), f = () => {
       r.value = !0;
-    }, i = (n) => {
+    }, y = (n) => {
       r.value = !1, n.handler && n.handler(), l("dismiss", "choose", n?.data);
-    }, g = (n) => {
+    }, u = (n) => {
       s.dismiss && s.dismiss.includes(n) ? (r.value = !1, l("dismiss", n)) : n == "backdrop" && (a.value = !0, setTimeout(() => {
         a.value = !1;
       }, 300));
@@ -301,29 +301,29 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
     }), o({
       open: f,
       close
-    }), (n, u) => (c(), E(L, {
+    }), (n, i) => (c(), E(q, {
       placement: "bottom",
       backdrop: !0,
       keepalive: !1,
       visible: r.value,
-      onDismiss: g
+      onDismiss: u
     }, {
-      default: V(() => [
+      default: P(() => [
         $("div", {
           class: S(["t-action", { pop: a.value }]),
           ref_key: "container",
           ref: d
         }, [
-          (c(!0), p(W, null, F(s.actions, (y) => (c(), p("div", null, [
-            (c(!0), p(W, null, F(y, (k) => (c(), E(Q, {
+          (c(!0), p(W, null, F(s.actions, (_) => (c(), p("div", null, [
+            (c(!0), p(W, null, F(_, (k) => (c(), E(Q, {
               color: k.color,
               size: k.size,
               variant: k.variant,
-              onClick: (m) => i(k),
+              onClick: (m) => y(k),
               block: ""
             }, {
-              default: V(() => [
-                N(R(k.text), 1)
+              default: P(() => [
+                N(V(k.text), 1)
               ]),
               _: 2
             }, 1032, ["color", "size", "variant", "onClick"]))), 256))
@@ -333,7 +333,7 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       _: 1
     }, 8, ["visible"]));
   }
-}), Ne = /* @__PURE__ */ _(We, [["__scopeId", "data-v-844fb240"]]), wo = (e = {}) => ({
+}), Me = /* @__PURE__ */ g(Ne, [["__scopeId", "data-v-844fb240"]]), xo = (e = {}) => ({
   open() {
     return new Promise((o) => {
       let t = document.body.querySelector(".t-app");
@@ -342,7 +342,7 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       t.appendChild(s);
       const l = j({
         render() {
-          return K(Ne, {
+          return K(Me, {
             ...e,
             ref: r,
             onDismiss: (d, a) => {
@@ -373,13 +373,13 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       close: () => {
         r.value = !1;
       }
-    }), (a, f) => (c(), E(L, {
+    }), (a, f) => (c(), E(q, {
       placement: "center",
       backdrop: !0,
       keepalive: !1,
       visible: r.value
     }, {
-      default: V(() => [
+      default: P(() => [
         $("div", qe, [
           b(a.$slots, "default", {}, () => [
             U(J, {
@@ -391,7 +391,7 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       _: 3
     }, 8, ["visible"]));
   }
-}), Me = /* @__PURE__ */ _(Le, [["__scopeId", "data-v-8f84c14e"]]), xo = (e = {}) => {
+}), He = /* @__PURE__ */ g(Le, [["__scopeId", "data-v-8f84c14e"]]), To = (e = {}) => {
   const o = v(), t = document.body.querySelector(".t-app");
   let s = null, r = null;
   return {
@@ -399,7 +399,7 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       return new Promise((l) => {
         t && (r = document.createElement("div"), t.appendChild(r), s = j({
           render() {
-            return K(Me, {
+            return K(He, {
               ...e,
               ref: o
             });
@@ -417,112 +417,112 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       });
     }
   };
-}, le = v(1e3), He = {
+}, le = v(1e3), Fe = {
   getNewIndex() {
     return le.value += 2, le.value;
   }
-}, D = ce([]), Z = v(!0), z = v(!1), P = v(-1), B = w(() => D[P.value]), q = w(() => D[P.value + 1] || void 0), C = w(() => D[D.length - 2]), fe = w(() => !z.value && Z.value && C.value), Y = {
+}, D = ce([]), Z = v(!0), C = v(!1), R = v(-1), B = w(() => D[R.value]), M = w(() => D[R.value + 1] || void 0), I = w(() => D[D.length - 2]), fe = w(() => !C.value && Z.value && I.value), Y = {
   reset() {
-    z.value = !0;
-    const e = B.value.target, o = C.value.target;
+    C.value = !0;
+    const e = B.value.target, o = I.value.target;
     e.style.transition = "transform 0.35s ease", e.style.transform = "translateX(0px)", o.style.transition = "transform 0.35s ease", o.style.transform = "translateX(calc(var(--t-app-width) / 100 * 30 * -1)) scale(0.5) perspective(var(--t-app-width)) rotateY(30deg)", document.documentElement.style.setProperty("--t-screen-backdrop-duration", "0.35s"), document.documentElement.style.setProperty("--t-swipe-backdrop-opacity", "0.5"), setTimeout(() => {
-      z.value = !1;
+      C.value = !1;
     }, 400);
   },
   move(e) {
     if (!fe.value) return;
-    const o = window.innerWidth, t = e / o * 100, s = B.value.target, r = C.value.target;
+    const o = window.innerWidth, t = e / o * 100, s = B.value.target, r = I.value.target;
     e > 15 && e <= o && (e = e > 0 ? e : 0, s.style.transition = "transform 0s ease", s.style.transform = `translateX(${e}px)`, r.style.transition = "transform 0s ease", document.documentElement.style.setProperty("--t-screen-backdrop-duration", "0s"), r.style.transform = `translateX(calc((var(--t-app-width) / 100 * 30 * -1) + ((var(--t-app-width) / 100 * 30) / 100 * ${t}))) scale(${0.5 + 0.5 / 100 * t}) perspective(var(--t-app-width)) rotateY(${30 - 30 / 100 * t}deg)`, document.documentElement.style.setProperty("--t-swipe-backdrop-opacity", `${0.5 - 0.5 / 100 * t}`));
   },
   back(e) {
-    C.value && (B.value.target.style.transition = "transform 0.35s ease", B.value.target.style.transform = "translateX(var(--t-app-width)) scale(1)", C.value.target.style.transition = "transform 0.35s ease", C.value.target.style.transform = "translateX(0px) scale(1) perspective(var(--t-app-width)) rotateY(0deg)", document.documentElement.style.setProperty("--t-screen-backdrop-duration", "0.35s"), document.documentElement.style.setProperty("--t-swipe-backdrop-opacity", "0"), z.value = !0, setTimeout(() => {
-      ne(), z.value = !1, P.value -= 1, e && e();
+    I.value && (B.value.target.style.transition = "transform 0.35s ease", B.value.target.style.transform = "translateX(var(--t-app-width)) scale(1)", I.value.target.style.transition = "transform 0.35s ease", I.value.target.style.transform = "translateX(0px) scale(1) perspective(var(--t-app-width)) rotateY(0deg)", document.documentElement.style.setProperty("--t-screen-backdrop-duration", "0.35s"), document.documentElement.style.setProperty("--t-swipe-backdrop-opacity", "0"), C.value = !0, setTimeout(() => {
+      ae(), C.value = !1, R.value -= 1, e && e();
     }, 400));
   },
   next(e) {
-    if (!q.value) return;
-    if (P.value == -1) {
-      P.value += 1, e && e();
+    if (!M.value) return;
+    if (R.value == -1) {
+      R.value += 1, e && e();
       return;
     }
-    z.value = !0;
-    let o = q.value.target;
+    C.value = !0;
+    let o = M.value.target;
     o.style.transform = "translateX(var(--t-app-width))", o.transitionOrigin = "center", document.documentElement.style.setProperty("--t-screen-backdrop-duration", "0s"), document.documentElement.style.setProperty("--t-swipe-backdrop-opacity", "0"), setTimeout(() => {
       o.style.transition = "transform 0.35s ease", o.style.transform = "translateX(0px)", document.documentElement.style.setProperty("--t-screen-backdrop-duration", "0.35s"), document.documentElement.style.setProperty("--t-swipe-backdrop-opacity", "0.5"), B.value && (B.value.target.style.transitionOrigin = "left center", B.value.target.style.transition = "transform 0.35s ease", B.value.target.style.transform = "translateX(calc(var(--t-app-width) / 100 * 30 * -1)) scale(0.5) perspective(var(--t-app-width)) rotateY(30deg)"), setTimeout(() => {
-        z.value = !1, P.value += 1, e && e();
+        C.value = !1, R.value += 1, e && e();
       }, 400);
     }, 100);
   }
 }, ee = {
   reset() {
-    z.value = !0;
-    const e = B.value.target, o = C.value.target;
+    C.value = !0;
+    const e = B.value.target, o = I.value.target;
     e.style.transition = "transform 0.35s ease", e.style.transform = "translateX(0px)", o.style.transition = "transform 0.35s ease", o.style.transform = "translateX(calc(var(--t-app-width) / 100 * 30 * -1))", document.documentElement.style.setProperty("--t-screen-backdrop-duration", "0.35s"), document.documentElement.style.setProperty("--t-swipe-backdrop-opacity", "0.5"), setTimeout(() => {
-      z.value = !1;
+      C.value = !1;
     }, 400);
   },
   move(e) {
-    const o = window.innerWidth, t = e / o * 100, s = B.value.target, r = C.value.target;
+    const o = window.innerWidth, t = e / o * 100, s = B.value.target, r = I.value.target;
     e > 15 && e <= o && (e = e > 0 ? e : 0, s.style.transition = "transform 0s ease", s.style.transform = `translateX(${e}px)`, r.style.transition = "transform 0s ease", document.documentElement.style.setProperty("--t-screen-backdrop-duration", "0s"), r.style.transform = `translateX(calc((var(--t-app-width) / 100 * 30 * -1) + ((var(--t-app-width) / 100 * 30) / 100 * ${t})))`, document.documentElement.style.setProperty("--t-swipe-backdrop-opacity", `${0.5 - 0.5 / 100 * t}`));
   },
   back(e) {
-    C.value && (B.value.target.style.transition = "transform 0.35s ease", B.value.target.style.transform = "translateX(var(--t-app-width)) scale(1)", C.value.target.style.transition = "transform 0.35s ease", C.value.target.style.transform = "translateX(0px)", document.documentElement.style.setProperty("--t-screen-backdrop-duration", "0.35s"), document.documentElement.style.setProperty("--t-swipe-backdrop-opacity", "0"), z.value = !0, setTimeout(() => {
-      ne(), z.value = !1, P.value -= 1, e && e();
+    I.value && (B.value.target.style.transition = "transform 0.35s ease", B.value.target.style.transform = "translateX(var(--t-app-width)) scale(1)", I.value.target.style.transition = "transform 0.35s ease", I.value.target.style.transform = "translateX(0px)", document.documentElement.style.setProperty("--t-screen-backdrop-duration", "0.35s"), document.documentElement.style.setProperty("--t-swipe-backdrop-opacity", "0"), C.value = !0, setTimeout(() => {
+      ae(), C.value = !1, R.value -= 1, e && e();
     }, 400));
   },
   next(e) {
-    if (!q.value) return;
-    if (P.value == -1) {
-      P.value += 1, e && e();
+    if (!M.value) return;
+    if (R.value == -1) {
+      R.value += 1, e && e();
       return;
     }
-    z.value = !0;
-    let o = q.value.target;
+    C.value = !0;
+    let o = M.value.target;
     o.style.transform = "translateX(var(--t-app-width))", o.transitionOrigin = "center", document.documentElement.style.setProperty("--t-screen-backdrop-duration", "0s"), document.documentElement.style.setProperty("--t-swipe-backdrop-opacity", "0"), setTimeout(() => {
       o.style.transition = "transform 0.35s ease", o.style.transform = "translateX(0px)", document.documentElement.style.setProperty("--t-screen-backdrop-duration", "0.35s"), document.documentElement.style.setProperty("--t-swipe-backdrop-opacity", "0.5"), B.value && (B.value.target.style.transitionOrigin = "left center", B.value.target.style.transition = "transform 0.35s ease", B.value.target.style.transform = "translateX(calc(var(--t-app-width) / 100 * 30 * -1))"), setTimeout(() => {
-        z.value = !1, P.value += 1, e && e();
+        C.value = !1, R.value += 1, e && e();
       }, 400);
     }, 100);
   }
-}, Fe = (e) => {
+}, Ge = (e) => {
   D.push(e);
-}, Ge = (e, o) => {
+}, Ue = (e, o) => {
   D[e].target = o;
-}, ne = (e) => {
+}, ae = (e) => {
   e || D.pop();
-}, Ue = () => {
-  D.splice(0, D.length);
 }, je = () => {
-  Z.value = !1;
+  D.splice(0, D.length);
 }, Ke = () => {
+  Z.value = !1;
+}, Je = () => {
   Z.value = !0;
-}, Je = (e, o) => {
-  e == "scale" && Y.next(o), e == "transform" && ee.next(o);
 }, Qe = (e, o) => {
-  e == "scale" && Y.back(o), e == "transform" && ee.back(o);
+  e == "scale" && Y.next(o), e == "transform" && ee.next(o);
 }, Ze = (e, o) => {
+  e == "scale" && Y.back(o), e == "transform" && ee.back(o);
+}, Ye = (e, o) => {
   e == "scale" && Y.move(o), e == "transform" && ee.move(o);
-}, Ye = (e) => {
+}, et = (e) => {
   e == "scale" && Y.reset(), e == "transform" && ee.reset();
 }, T = {
-  isBusy: z,
+  isBusy: C,
   isSwipeable: fe,
-  reset: Ye,
-  next: Je,
-  back: Qe,
-  move: Ze,
+  reset: et,
+  next: Qe,
+  back: Ze,
+  move: Ye,
   screens: D,
-  addScreen: Fe,
-  addScreenEl: Ge,
-  removeScreen: ne,
-  removeAllScreen: Ue,
-  lockSwipe: je,
-  unlockSwipe: Ke,
+  addScreen: Ge,
+  addScreenEl: Ue,
+  removeScreen: ae,
+  removeAllScreen: je,
+  lockSwipe: Ke,
+  unlockSwipe: Je,
   swipeable: Z,
   currentScreen: B,
-  lastScreen: C,
-  nextScreen: q
-}, et = { class: "t-toast-content" }, tt = /* @__PURE__ */ h({
+  lastScreen: I,
+  nextScreen: M
+}, tt = { class: "t-toast-content" }, ot = /* @__PURE__ */ h({
   __name: "t-toast",
   props: {
     message: {},
@@ -538,15 +538,15 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       d.value = !0, a.value = !1, setTimeout(() => {
         l.value = !0;
       }, 10);
-    }, i = () => {
+    }, y = () => {
       a.value = !0, setTimeout(() => {
         d.value = !1, l.value = !1, r("dismiss");
       }, 300);
     };
     X(() => s.visible, (n) => {
-      n ? f() : i();
+      n ? f() : y();
     });
-    const g = w(() => {
+    const u = w(() => {
       let n;
       return s.variant == "default" && (s.color ? ["warning", "info", "danger", "primary", "secondary", "success"].includes(s.color) ? n = {
         "--border": "none",
@@ -588,18 +588,18 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
     });
     return o({
       open: f,
-      close: i
-    }), (n, u) => d.value ? (c(), p("div", {
+      close: y
+    }), (n, i) => d.value ? (c(), p("div", {
       key: 0,
       class: S(["t-toast", { [s.placement]: !0, open: l.value, closing: a.value }]),
-      style: x({ "--space": s.space, ...g.value })
+      style: x({ "--space": s.space, ...u.value })
     }, [
       b(n.$slots, "content", {}, () => [
-        $("div", et, R(s.message), 1)
+        $("div", tt, V(s.message), 1)
       ], !0)
-    ], 6)) : I("", !0);
+    ], 6)) : z("", !0);
   }
-}), me = /* @__PURE__ */ _(tt, [["__scopeId", "data-v-2802d43f"]]), To = (e = {}) => ({
+}), me = /* @__PURE__ */ g(ot, [["__scopeId", "data-v-2802d43f"]]), So = (e = {}) => ({
   open() {
     let o = document.body.querySelector(".t-app");
     if (!o) return;
@@ -624,13 +624,13 @@ const Ie = /* @__PURE__ */ _(Se, [["render", ze]]), Ce = /* @__PURE__ */ h({
       }, e.duration + 10);
     }, 50);
   }
-}), ot = v(0);
+}), st = v(0);
 function ve() {
   return {
-    height: ot
+    height: st
   };
 }
-const st = /* @__PURE__ */ h({
+const rt = /* @__PURE__ */ h({
   __name: "t-cable",
   props: {
     keyboard: { type: Boolean, default: !1 },
@@ -647,7 +647,7 @@ const st = /* @__PURE__ */ h({
       b(s.$slots, "default", {}, void 0, !0)
     ], 6));
   }
-}), rt = /* @__PURE__ */ _(st, [["__scopeId", "data-v-6cae224b"]]), nt = /* @__PURE__ */ h({
+}), nt = /* @__PURE__ */ g(rt, [["__scopeId", "data-v-6cae224b"]]), at = /* @__PURE__ */ h({
   __name: "t-card",
   props: {
     color: { default: null }
@@ -670,13 +670,13 @@ const st = /* @__PURE__ */ h({
       b(s.$slots, "default")
     ], 4));
   }
-}), at = {}, lt = { class: "t-content" };
-function ct(e, o) {
-  return c(), p("div", lt, [
+}), lt = {}, ct = { class: "t-content" };
+function it(e, o) {
+  return c(), p("div", ct, [
     b(e.$slots, "default", {}, void 0, !0)
   ]);
 }
-const ye = /* @__PURE__ */ _(at, [["render", ct], ["__scopeId", "data-v-af750e89"]]), it = /* @__PURE__ */ h({
+const ye = /* @__PURE__ */ g(lt, [["render", it], ["__scopeId", "data-v-af750e89"]]), ut = /* @__PURE__ */ h({
   __name: "t-refresher",
   props: {
     threshold: { default: 120 },
@@ -687,34 +687,34 @@ const ye = /* @__PURE__ */ _(at, [["render", ct], ["__scopeId", "data-v-af750e89
   setup(e, { emit: o }) {
     const t = o, s = e, r = v(0), l = v(!1), d = v();
     let a, f = !1;
-    const i = () => {
+    const y = () => {
       l.value = !1, r.value = 0, a && a.cancel(), f = !1;
-    }, g = () => {
-      f = !0, l.value = !0, r.value = s.threshold, t("refresh", i);
+    }, u = () => {
+      f = !0, l.value = !0, r.value = s.threshold, t("refresh", y);
     }, n = () => {
       r.value = 0, l.value = !1, f = !1, t("cancel");
     };
     return X(() => d.value, () => {
       a && a.destroy();
-      let u = d.value.closest(".t-content");
-      u && (a = re(u, {
+      let i = d.value.closest(".t-content");
+      i && (a = ne(i, {
         options: {
           minDist: 60
         },
         down() {
           l.value || f || t("start");
         },
-        move({ deltaY: y, initialDirection: k }) {
+        move({ deltaY: _, initialDirection: k }) {
           if (l.value || f || k != "down") return;
-          if (s.variant == "max" && y >= s.threshold) {
-            g();
+          if (s.variant == "max" && _ >= s.threshold) {
+            u();
             return;
           }
-          const m = y < 0 ? 0 : y;
+          const m = _ < 0 ? 0 : _;
           r.value = m, t("move", m);
         },
-        up({ deltaY: y, initialDirection: k }) {
-          l.value || f || k != "down" || (s.variant == "up" && y >= s.threshold ? g() : n());
+        up({ deltaY: _, initialDirection: k }) {
+          l.value || f || k != "down" || (s.variant == "up" && _ >= s.threshold ? u() : n());
         },
         cancel() {
           l.value || f || n();
@@ -722,14 +722,14 @@ const ye = /* @__PURE__ */ _(at, [["render", ct], ["__scopeId", "data-v-af750e89
       }, {
         passive: !1
       }));
-    }), se(() => {
+    }), re(() => {
       a && a.destroy();
-    }), (u, y) => M((c(), p("div", {
-      class: S(["t-refresher", { safe: u.safe }]),
+    }), (i, _) => L((c(), p("div", {
+      class: S(["t-refresher", { safe: i.safe }]),
       ref_key: "container",
       ref: d
     }, [
-      b(u.$slots, "default", {
+      b(i.$slots, "default", {
         offset: r.value,
         refreshing: l.value
       }, void 0, !0)
@@ -737,13 +737,13 @@ const ye = /* @__PURE__ */ _(at, [["render", ct], ["__scopeId", "data-v-af750e89
       [H, r.value > 0]
     ]);
   }
-}), ut = /* @__PURE__ */ _(it, [["__scopeId", "data-v-1d52477a"]]), dt = {}, pt = { class: "t-screen" };
-function ft(e, o) {
-  return c(), p("div", pt, [
+}), dt = /* @__PURE__ */ g(ut, [["__scopeId", "data-v-1d52477a"]]), pt = {}, ft = { class: "t-screen" };
+function mt(e, o) {
+  return c(), p("div", ft, [
     b(e.$slots, "default", {}, void 0, !0)
   ]);
 }
-const _e = /* @__PURE__ */ _(dt, [["render", ft], ["__scopeId", "data-v-c2a3436c"]]), mt = /* @__PURE__ */ h({
+const _e = /* @__PURE__ */ g(pt, [["render", mt], ["__scopeId", "data-v-c2a3436c"]]), vt = /* @__PURE__ */ h({
   __name: "t-swipe-screen",
   props: {
     variant: { default: "scale" },
@@ -755,58 +755,58 @@ const _e = /* @__PURE__ */ _(dt, [["render", ft], ["__scopeId", "data-v-c2a3436c
     let t = {};
     const s = o, r = e;
     let l;
-    const d = r.router || de(), a = r.route || $e(), f = d.getRoutes();
+    const d = r.router || de(), a = r.route || we(), f = d.getRoutes();
     for (let n of f)
       t[n.name] = n.component || n.components;
-    const i = (n) => {
+    const y = (n) => {
       n && T.addScreen({
         name: n,
         target: null,
         component: he(t[n] || null)
       });
-    }, g = (n, u) => {
-      !u || T.screens[n].target || (T.addScreenEl(n, u.$el), T.nextScreen && T.next(r.variant, () => {
+    }, u = (n, i) => {
+      !i || T.screens[n].target || (T.addScreenEl(n, i.$el), T.nextScreen && T.next(r.variant, () => {
         s("change");
       }));
     };
-    return X(() => a.name, (n, u) => {
+    return X(() => a.name, (n, i) => {
       n != T.currentScreen.value?.name && (T.lastScreen.value?.name == n ? T.back(r.variant, () => {
         s("change");
-      }) : i(a.name));
+      }) : y(a.name));
     }), G(() => {
-      i(a.name), l = re(document.body, {
+      y(a.name), l = ne(document.body, {
         beforeEvent(n) {
           return !!T.isSwipeable.value;
         },
         fast({ initialDirection: n }) {
           T.lastScreen.value && n == "right" && d.back();
         },
-        move({ deltaX: n, initialDirection: u }) {
-          u == "right" && T.move(r.variant, n);
+        move({ deltaX: n, initialDirection: i }) {
+          i == "right" && T.move(r.variant, n);
         },
-        up({ deltaX: n, initialDirection: u }) {
-          if (u != "right") {
+        up({ deltaX: n, initialDirection: i }) {
+          if (i != "right") {
             T.reset(r.variant);
             return;
           }
-          const y = window.innerWidth;
-          n / y * 100 >= 50 ? d.back() : T.reset(r.variant);
+          const _ = window.innerWidth;
+          n / _ * 100 >= 50 ? d.back() : T.reset(r.variant);
         },
         cancel() {
           T.reset(r.variant);
         }
       });
-    }), se(() => {
+    }), re(() => {
       l && l.destroy(), T.removeAllScreen();
-    }), (n, u) => (c(), p(W, null, [
-      (c(!0), p(W, null, F(A(T).screens, (y, k) => (c(), E(_e, {
+    }), (n, i) => (c(), p(W, null, [
+      (c(!0), p(W, null, F(A(T).screens, (_, k) => (c(), E(_e, {
         ref_for: !0,
-        ref: (m) => g(k, m),
+        ref: (m) => u(k, m),
         style: x({ zIndex: k + (k == A(T).screens.length - 1 ? 2 : 1) }),
         key: k
       }, {
-        default: V(() => [
-          (c(), E(be(y.component.default)))
+        default: P(() => [
+          (c(), E(be(_.component.default)))
         ]),
         _: 2
       }, 1032, ["style"]))), 128)),
@@ -816,7 +816,7 @@ const _e = /* @__PURE__ */ _(dt, [["render", ft], ["__scopeId", "data-v-c2a3436c
       }, null, 4)
     ], 64));
   }
-}), vt = /* @__PURE__ */ _(mt, [["__scopeId", "data-v-23e0cfda"]]), yt = /* @__PURE__ */ h({
+}), yt = /* @__PURE__ */ g(vt, [["__scopeId", "data-v-23e0cfda"]]), _t = /* @__PURE__ */ h({
   __name: "t-toolbar",
   props: {
     placement: { default: null },
@@ -834,7 +834,7 @@ const _e = /* @__PURE__ */ _(dt, [["render", ft], ["__scopeId", "data-v-c2a3436c
       ])
     ], 6));
   }
-}), _t = /* @__PURE__ */ _(yt, [["__scopeId", "data-v-1ee9866d"]]), gt = /* @__PURE__ */ h({
+}), gt = /* @__PURE__ */ g(_t, [["__scopeId", "data-v-1ee9866d"]]), bt = /* @__PURE__ */ h({
   __name: "t-back-button",
   props: {
     to: {},
@@ -856,9 +856,9 @@ const _e = /* @__PURE__ */ _(dt, [["render", ft], ["__scopeId", "data-v-c2a3436c
       b(l.$slots, "default", {}, () => [
         d[0] || (d[0] = $("i", { class: "ri-arrow-left-s-line" }, null, -1))
       ], !0)
-    ])) : I("", !0);
+    ])) : z("", !0);
   }
-}), bt = /* @__PURE__ */ _(gt, [["__scopeId", "data-v-dcf9d363"]]), ht = /* @__PURE__ */ h({
+}), ht = /* @__PURE__ */ g(bt, [["__scopeId", "data-v-dcf9d363"]]), kt = /* @__PURE__ */ h({
   __name: "t-text",
   props: {
     color: { default: "var(--t-color-text)" },
@@ -879,7 +879,7 @@ const _e = /* @__PURE__ */ _(dt, [["render", ft], ["__scopeId", "data-v-c2a3436c
       b(s.$slots, "default", {}, void 0, !0)
     ], 4));
   }
-}), oe = /* @__PURE__ */ _(ht, [["__scopeId", "data-v-f0f94f05"]]), kt = /* @__PURE__ */ h({
+}), se = /* @__PURE__ */ g(kt, [["__scopeId", "data-v-f0f94f05"]]), $t = /* @__PURE__ */ h({
   __name: "t-gesture-indicator",
   props: {
     placement: { default: "bottom" }
@@ -889,7 +889,7 @@ const _e = /* @__PURE__ */ _(dt, [["render", ft], ["__scopeId", "data-v-c2a3436c
       class: S(["t-gesture-indicator", { [o.placement]: !0 }])
     }, null, 2));
   }
-}), ge = /* @__PURE__ */ _(kt, [["__scopeId", "data-v-ed8f7308"]]), $t = /* @__PURE__ */ h({
+}), ge = /* @__PURE__ */ g($t, [["__scopeId", "data-v-ed8f7308"]]), wt = /* @__PURE__ */ h({
   __name: "t-sheet",
   props: {
     background: { default: "var(--t-color-surface)" },
@@ -914,51 +914,51 @@ const _e = /* @__PURE__ */ _(dt, [["render", ft], ["__scopeId", "data-v-c2a3436c
       if (t.placement == "top") return "up";
       if (t.placement == "left") return "left";
       if (t.placement == "right") return "right";
-    }), i = (n) => {
+    }), y = (n) => {
       s("dismiss", n);
-    }, g = () => {
+    }, u = () => {
       d.value = !0, setTimeout(() => {
         d.value = !1;
       }, 300);
     };
     return X(() => r.value, (n) => {
-      n && (a = re(r.value, {
+      n && (a = ne(r.value, {
         isMoving: !1,
         options: {
           minDist: 30
         },
-        beforeEvent(u) {
+        beforeEvent(i) {
           return !(d.value || !t.gesture || t.placement == "center");
         },
         down() {
           this.isMoving = !1;
         },
-        fast({ initialDirection: u }) {
-          g(), u == f.value ? s("dismiss", "gesture") : l.value.open();
+        fast({ initialDirection: i }) {
+          u(), i == f.value ? s("dismiss", "gesture") : l.value.open();
         },
-        move({ deltaY: u, deltaX: y, initialDirection: k }) {
+        move({ deltaY: i, deltaX: _, initialDirection: k }) {
           if (k != f.value) return;
           let m = 0;
-          t.placement == "bottom" || t.placement == "top" ? m = u : m = y, t.placement == "bottom" && (m = u > 0 ? u : 0), t.placement == "top" && (m = u < 0 ? u : 0), t.placement == "left" && (m = y < 0 ? y : 0), t.placement == "right" && (m = y > 0 ? y : 0), (t.placement == "bottom" && (m >= 10 || this.isMoving) || t.placement == "top" && (m <= -10 || this.isMoving) || t.placement == "left" && (m <= -10 || this.isMoving) || t.placement == "right" && (m >= 10 || this.isMoving)) && (this.isMoving = !0, l.value.render({
+          t.placement == "bottom" || t.placement == "top" ? m = i : m = _, t.placement == "bottom" && (m = i > 0 ? i : 0), t.placement == "top" && (m = i < 0 ? i : 0), t.placement == "left" && (m = _ < 0 ? _ : 0), t.placement == "right" && (m = _ > 0 ? _ : 0), (t.placement == "bottom" && (m >= 10 || this.isMoving) || t.placement == "top" && (m <= -10 || this.isMoving) || t.placement == "left" && (m <= -10 || this.isMoving) || t.placement == "right" && (m >= 10 || this.isMoving)) && (this.isMoving = !0, l.value.render({
             contentTransform: m + "px",
             transition: "0s"
           }));
         },
-        up({ deltaY: u, deltaX: y, initialDirection: k }) {
-          if (this.isMoving = !1, g(), k != f.value) {
+        up({ deltaY: i, deltaX: _, initialDirection: k }) {
+          if (this.isMoving = !1, u(), k != f.value) {
             l.value.open();
             return;
           }
           let m, O, te;
-          t.placement == "bottom" || t.placement == "top" ? (m = r.value.offsetHeight, te = u) : (m = r.value.offsetWidth, te = y), O = te / m * 100, O > 50 ? s("dismiss", "gesture") : l.value.open();
+          t.placement == "bottom" || t.placement == "top" ? (m = r.value.offsetHeight, te = i) : (m = r.value.offsetWidth, te = _), O = te / m * 100, O > 50 ? s("dismiss", "gesture") : l.value.open();
         },
         cancel() {
-          this.isMoving = !1, g(), l.value.open();
+          this.isMoving = !1, u(), l.value.open();
         }
       }));
-    }), se(() => {
+    }), re(() => {
       a && a.destroy();
-    }), (n, u) => (c(), E(L, {
+    }), (n, i) => (c(), E(q, {
       ref_key: "present",
       ref: l,
       class: S(t.class),
@@ -966,14 +966,14 @@ const _e = /* @__PURE__ */ _(dt, [["render", ft], ["__scopeId", "data-v-c2a3436c
       backdrop: n.backdrop,
       visible: t.visible,
       keepalive: t.keepalive,
-      onDismiss: i,
+      onDismiss: y,
       style: x(t.style)
     }, {
-      default: V(() => [
+      default: P(() => [
         t.gesture && t.indicator && t.placement != "center" ? (c(), E(ge, {
           key: 0,
           placement: t.placement
-        }, null, 8, ["placement"])) : I("", !0),
+        }, null, 8, ["placement"])) : z("", !0),
         $("div", {
           class: S(["t-sheet", { fullscreen: t.fullscreen, [t.placement]: !0, rounded: n.rounded, radius: t.radius }]),
           style: x({ "--background": t.background }),
@@ -986,7 +986,7 @@ const _e = /* @__PURE__ */ _(dt, [["render", ft], ["__scopeId", "data-v-c2a3436c
       _: 3
     }, 8, ["class", "placement", "backdrop", "visible", "keepalive", "style"]));
   }
-}), wt = /* @__PURE__ */ _($t, [["__scopeId", "data-v-6f7063f0"]]), xt = { class: "t-input-label" }, Tt = { class: "t-input-content" }, St = ["type", "placeholder", "value"], Bt = /* @__PURE__ */ h({
+}), xt = /* @__PURE__ */ g(wt, [["__scopeId", "data-v-6f7063f0"]]), Tt = { class: "t-input-label" }, St = { class: "t-input-content" }, Bt = ["data-placeholder"], Ct = /* @__PURE__ */ h({
   __name: "t-input",
   props: {
     size: { default: "standard" },
@@ -997,71 +997,89 @@ const _e = /* @__PURE__ */ _(dt, [["render", ft], ["__scopeId", "data-v-c2a3436c
     help: {},
     error: {},
     modelValue: { default: "" },
-    variant: { default: "default" }
+    variant: { default: "default" },
+    readonly: { type: Boolean, default: !1 }
   },
   emits: ["update:modelValue"],
   setup(e, { emit: o }) {
-    const t = e, s = o, r = v(!1), l = w(() => !(t.modelValue === "" || t.modelValue === null || t.modelValue === void 0)), d = (i) => {
-      s("update:modelValue", i.target.value);
-    }, a = () => {
-      r.value = !0;
-    }, f = () => {
+    const t = e, s = o, r = v(!1), l = v(null), d = w(
+      () => !(t.modelValue === "" || t.modelValue == null)
+    ), a = (u) => {
+      s("update:modelValue", u.target.textContent);
+    }, f = async (u) => {
+      r.value = !0, await oe();
+      const n = l.value;
+      if (n) {
+        const i = document.createRange(), _ = window.getSelection();
+        i.selectNodeContents(n), i.collapse(!1), _?.removeAllRanges(), _?.addRange(i), n.focus();
+      }
+    }, y = () => {
       r.value = !1;
     };
-    return (i, g) => (c(), p("div", {
-      class: S(["t-input", { rounded: i.rounded, ["size-" + i.size]: !0, ["variant-" + i.variant]: !0, focus: r.value, "has-value": l.value }])
+    return (u, n) => (c(), p("div", {
+      class: S(["t-input", {
+        rounded: u.rounded,
+        ["size-" + u.size]: !0,
+        ["variant-" + u.variant]: !0,
+        focus: r.value,
+        "has-value": d.value,
+        readonly: u.readonly
+      }])
     }, [
       $("label", null, [
-        $("span", xt, R(i.label), 1),
-        $("div", Tt, [
-          b(i.$slots, "start", {}, void 0, !0),
-          $("input", {
-            type: i.type,
-            placeholder: i.variant == "default" ? i.placeholder : "",
-            value: i.modelValue,
-            onInput: d,
-            onFocus: a,
-            onBlur: f
-          }, null, 40, St),
-          b(i.$slots, "end", {}, void 0, !0)
+        $("span", Tt, V(u.label), 1),
+        $("div", St, [
+          b(u.$slots, "start", {}, void 0, !0),
+          $("div", {
+            ref_key: "editable",
+            ref: l,
+            class: "t-input-editable",
+            contenteditable: "true",
+            "data-placeholder": u.placeholder,
+            onInput: a,
+            onTouchstart: $e(f, ["prevent"]),
+            onMousedown: f,
+            onBlur: y
+          }, V(u.modelValue), 41, Bt),
+          b(u.$slots, "end", {}, void 0, !0)
         ])
       ]),
-      i.error ? (c(), E(oe, {
+      u.error ? (c(), E(se, {
         key: 0,
         color: "danger"
       }, {
-        default: V(() => [
-          N(R(i.error), 1)
+        default: P(() => [
+          N(V(u.error), 1)
         ]),
         _: 1
-      })) : i.help ? (c(), E(oe, {
+      })) : u.help ? (c(), E(se, {
         key: 1,
         color: "secondary"
       }, {
-        default: V(() => [
-          N(R(i.help), 1)
+        default: P(() => [
+          N(V(u.help), 1)
         ]),
         _: 1
-      })) : I("", !0)
+      })) : z("", !0)
     ], 2));
   }
-}), zt = /* @__PURE__ */ _(Bt, [["__scopeId", "data-v-fd2173ab"]]), It = {};
-function Ct(e, o) {
+}), zt = /* @__PURE__ */ g(Ct, [["__scopeId", "data-v-d3f6bd7c"]]), It = {};
+function Et(e, o) {
   return c(), p("textarea");
 }
-const Et = /* @__PURE__ */ _(It, [["render", Ct]]), Vt = {};
-function Pt(e, o) {
+const Vt = /* @__PURE__ */ g(It, [["render", Et]]), Pt = {};
+function Rt(e, o) {
   return c(), p("div");
 }
-const Rt = /* @__PURE__ */ _(Vt, [["render", Pt]]), At = {}, Dt = { class: "t-grid" };
-function Xt(e, o) {
-  return c(), p("div", Dt);
+const At = /* @__PURE__ */ g(Pt, [["render", Rt]]), Dt = {}, Xt = { class: "t-grid" };
+function Ot(e, o) {
+  return c(), p("div", Xt);
 }
-const Ot = /* @__PURE__ */ _(At, [["render", Xt]]), Wt = {}, Nt = { class: "t-grid-item" };
+const Wt = /* @__PURE__ */ g(Dt, [["render", Ot]]), Nt = {}, Mt = { class: "t-grid-item" };
 function qt(e, o) {
-  return c(), p("div", Nt);
+  return c(), p("div", Mt);
 }
-const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
+const Lt = /* @__PURE__ */ g(Nt, [["render", qt]]), Ht = /* @__PURE__ */ h({
   __name: "t-divider",
   props: {
     direction: { default: "horizontal" }
@@ -1072,7 +1090,7 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
       class: S(["t-divider", { [o.direction]: !0 }])
     }, null, 2));
   }
-}), Ht = /* @__PURE__ */ _(Mt, [["__scopeId", "data-v-47ee8991"]]), Ft = /* @__PURE__ */ h({
+}), Ft = /* @__PURE__ */ g(Ht, [["__scopeId", "data-v-47ee8991"]]), Gt = /* @__PURE__ */ h({
   __name: "t-toggle-password",
   props: {
     color: { default: "warning" }
@@ -1080,35 +1098,35 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
   emits: ["change"],
   setup(e, { emit: o }) {
     const t = e, s = o, r = v(!1), l = v(), d = w(() => {
-      let i = t.color;
-      return ["warning", "info", "danger", "primary", "secondary", "success"].includes(t.color) && (i = `var(--t-color-status-${t.color})`), {
-        "--color": i
+      let y = t.color;
+      return ["warning", "info", "danger", "primary", "secondary", "success"].includes(t.color) && (y = `var(--t-color-status-${t.color})`), {
+        "--color": y
       };
     }), a = () => l.value?.parentElement?.querySelector?.("input");
     G(() => {
-      let i = a();
-      i && (r.value = i.type != "password", s("change", r.value));
+      let y = a();
+      y && (r.value = y.type != "password", s("change", r.value));
     });
     const f = () => {
-      let i = a();
-      i && (r.value = !r.value, r.value ? i.type = "text" : i.type = "password", s("change", r.value));
+      let y = a();
+      y && (r.value = !r.value, r.value ? y.type = "text" : y.type = "password", s("change", r.value));
     };
-    return (i, g) => (c(), p("button", {
+    return (y, u) => (c(), p("button", {
       ref_key: "toggle",
       ref: l,
       class: "t-toggle-password",
       style: x(d.value),
       onClick: f
     }, [
-      r.value ? b(i.$slots, "on", { key: 0 }, () => [
-        g[0] || (g[0] = $("i", { class: "ri-eye-line" }, null, -1))
-      ], !0) : I("", !0),
-      r.value ? I("", !0) : b(i.$slots, "off", { key: 1 }, () => [
-        g[1] || (g[1] = $("i", { class: "ri-eye-off-line" }, null, -1))
+      r.value ? b(y.$slots, "on", { key: 0 }, () => [
+        u[0] || (u[0] = $("i", { class: "ri-eye-line" }, null, -1))
+      ], !0) : z("", !0),
+      r.value ? z("", !0) : b(y.$slots, "off", { key: 1 }, () => [
+        u[1] || (u[1] = $("i", { class: "ri-eye-off-line" }, null, -1))
       ], !0)
     ], 4));
   }
-}), Gt = /* @__PURE__ */ _(Ft, [["__scopeId", "data-v-3268e9e3"]]), Ut = /* @__PURE__ */ h({
+}), Ut = /* @__PURE__ */ g(Gt, [["__scopeId", "data-v-3268e9e3"]]), jt = /* @__PURE__ */ h({
   __name: "t-avatar",
   props: {
     square: { type: Boolean, default: !1 },
@@ -1123,13 +1141,13 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
       b(s.$slots, "default", {}, void 0, !0)
     ], 6));
   }
-}), jt = /* @__PURE__ */ _(Ut, [["__scopeId", "data-v-24384c2f"]]), Kt = { class: "t-collapse-title" }, Jt = {
+}), Kt = /* @__PURE__ */ g(jt, [["__scopeId", "data-v-24384c2f"]]), Jt = { class: "t-collapse-title" }, Qt = {
   key: 0,
   class: "icon"
-}, Qt = {
+}, Zt = {
   key: 1,
   class: "icon"
-}, Zt = { class: "t-collapse-content" }, Yt = /* @__PURE__ */ h({
+}, Yt = { class: "t-collapse-content" }, eo = /* @__PURE__ */ h({
   __name: "t-collapse",
   props: {
     title: {}
@@ -1139,7 +1157,7 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
     const t = e, s = o, r = v(!1), l = v(""), d = v(), a = () => {
       r.value = !r.value, l.value = `calc(${d.value.offsetHeight}px + 2rem)`, s("change", r.value);
     };
-    return s("change", r.value), (f, i) => (c(), p("div", {
+    return s("change", r.value), (f, y) => (c(), p("div", {
       class: S(["t-collapse", { open: r.value }]),
       style: x({ "--height": l.value })
     }, [
@@ -1148,20 +1166,20 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
         onClick: a
       }, [
         b(f.$slots, "icon"),
-        $("div", Kt, [
+        $("div", Jt, [
           b(f.$slots, "title", {}, () => [
-            N(R(t.title), 1)
+            N(V(t.title), 1)
           ])
         ]),
         b(f.$slots, "toggle", {}, () => [
-          r.value ? (c(), p("div", Jt, [...i[0] || (i[0] = [
+          r.value ? (c(), p("div", Qt, [...y[0] || (y[0] = [
             $("i", { class: "ri-arrow-up-s-line" }, null, -1)
-          ])])) : (c(), p("div", Qt, [...i[1] || (i[1] = [
+          ])])) : (c(), p("div", Zt, [...y[1] || (y[1] = [
             $("i", { class: "ri-arrow-down-s-line" }, null, -1)
           ])]))
         ])
       ]),
-      $("div", Zt, [
+      $("div", Yt, [
         $("div", {
           ref_key: "content",
           ref: d
@@ -1173,7 +1191,7 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
       ])
     ], 6));
   }
-}), eo = /* @__PURE__ */ h({
+}), to = /* @__PURE__ */ h({
   __name: "t-switch",
   props: {
     modelValue: { type: Boolean },
@@ -1201,7 +1219,7 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
       $("div", { class: "t-switch-icon" }, null, -1)
     ])], 6));
   }
-}), to = /* @__PURE__ */ _(eo, [["__scopeId", "data-v-3616970e"]]), oo = /* @__PURE__ */ h({
+}), oo = /* @__PURE__ */ g(to, [["__scopeId", "data-v-3616970e"]]), so = /* @__PURE__ */ h({
   __name: "t-tab",
   props: {
     value: {}
@@ -1219,14 +1237,14 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
         size: A(t).size,
         color: s.value ? A(t).color.text : void 0
       }, {
-        default: V(() => [
+        default: P(() => [
           b(l.$slots, "default", {}, void 0, !0)
         ]),
         _: 3
       }, 8, ["size", "color"])
     ], 2));
   }
-}), so = /* @__PURE__ */ _(oo, [["__scopeId", "data-v-481e97b6"]]), ro = /* @__PURE__ */ h({
+}), ro = /* @__PURE__ */ g(so, [["__scopeId", "data-v-481e97b6"]]), no = /* @__PURE__ */ h({
   __name: "t-tabs",
   props: {
     placement: { default: "top-start" },
@@ -1241,9 +1259,9 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
   emits: ["update:modelValue"],
   setup(e, { emit: o }) {
     const t = e, s = o, r = v("0px"), l = v(0), d = v(0), a = v(), f = w(() => {
-      let n = "", u = "";
-      return t.variant == "text" && (n = "transparent", ["warning", "info", "danger", "primary", "secondary", "success"].includes(t.color) ? u = `var(--t-color-status-${t.color})` : u = t.color), t.variant == "border-under" && (u = "currentColor", ["warning", "info", "danger", "primary", "secondary", "success"].includes(t.color) ? n = `var(--t-color-status-${t.color})` : n = t.color), t.variant == "tag" && (["warning", "info", "danger", "primary", "secondary", "success"].includes(t.color) ? (n = `var(--t-color-status-${t.color})`, u = `var(--t-color-status-${t.color}-text)`) : (n = t.color, u = "currentColor")), { background: n, text: u };
-    }), i = w(() => t.variant == "border-under" ? {
+      let n = "", i = "";
+      return t.variant == "text" && (n = "transparent", ["warning", "info", "danger", "primary", "secondary", "success"].includes(t.color) ? i = `var(--t-color-status-${t.color})` : i = t.color), t.variant == "border-under" && (i = "currentColor", ["warning", "info", "danger", "primary", "secondary", "success"].includes(t.color) ? n = `var(--t-color-status-${t.color})` : n = t.color), t.variant == "tag" && (["warning", "info", "danger", "primary", "secondary", "success"].includes(t.color) ? (n = `var(--t-color-status-${t.color})`, i = `var(--t-color-status-${t.color}-text)`) : (n = t.color, i = "currentColor")), { background: n, text: i };
+    }), y = w(() => t.variant == "border-under" ? {
       "--transform": r.value,
       "--border": t.border + "px"
     } : t.variant == "tag" ? {
@@ -1253,23 +1271,23 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
       "--width": l.value - t.margin[1] * 2 + "px",
       "--transform": r.value,
       "--radius": t.radius + "px"
-    } : {}), g = () => {
+    } : {}), u = () => {
       if (t.variant == "border-under") {
         let n = a.value.querySelector(".active");
         if (n) {
           if (t.placement.startsWith("top-") || t.placement.startsWith("bottom-")) {
-            let u = n.getBoundingClientRect().left - a.value.getBoundingClientRect().left + a.value.scrollLeft, y = n.offsetWidth / 2;
-            r.value = u + y - t.border / 2 + "px";
+            let i = n.getBoundingClientRect().left - a.value.getBoundingClientRect().left + a.value.scrollLeft, _ = n.offsetWidth / 2;
+            r.value = i + _ - t.border / 2 + "px";
           } else if (t.placement.startsWith("left-") || t.placement.startsWith("right-")) {
-            let u = n.getBoundingClientRect().top - a.value.getBoundingClientRect().top + a.value.scrollTop, y = n.offsetHeight / 2;
-            r.value = u + y - t.border / 2 + "px";
+            let i = n.getBoundingClientRect().top - a.value.getBoundingClientRect().top + a.value.scrollTop, _ = n.offsetHeight / 2;
+            r.value = i + _ - t.border / 2 + "px";
           }
         }
       }
       if (t.variant == "tag") {
         let n = a.value.querySelector(".active");
         if (n) {
-          let u = n.offsetWidth, y = n.offsetHeight;
+          let i = n.offsetWidth, _ = n.offsetHeight;
           if (t.placement.startsWith("top-") || t.placement.startsWith("bottom-")) {
             let k = n.getBoundingClientRect().left - a.value.getBoundingClientRect().left + a.value.scrollLeft;
             r.value = k + "px";
@@ -1277,7 +1295,7 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
             let k = n.getBoundingClientRect().top - a.value.getBoundingClientRect().top + a.value.scrollTop;
             r.value = k + "px";
           }
-          l.value = u, d.value = y;
+          l.value = i, d.value = _;
         }
       }
     };
@@ -1290,32 +1308,32 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
         s("update:modelValue", n);
       }
     }), X(() => t.modelValue, async () => {
-      await ae(), g();
+      await oe(), u();
     }), G(async () => {
-      await ae(), g();
-    }), (n, u) => (c(), p("ul", {
+      await oe(), u();
+    }), (n, i) => (c(), p("ul", {
       ref_key: "container",
       ref: a,
       class: S(["t-tabs", { [n.placement]: !0, [`variant-${n.variant}`]: !0 }]),
-      style: x([{ "--background": f.value.background, "--color": f.value.text }, i.value])
+      style: x([{ "--background": f.value.background, "--color": f.value.text }, y.value])
     }, [
       b(n.$slots, "default", {}, void 0, !0)
     ], 6));
   }
-}), no = /* @__PURE__ */ _(ro, [["__scopeId", "data-v-8d370631"]]), ao = /* @__PURE__ */ h({
+}), ao = /* @__PURE__ */ g(no, [["__scopeId", "data-v-8d370631"]]), lo = /* @__PURE__ */ h({
   __name: "t-loading-app",
   setup(e) {
     return (o, t) => (c(), E(ye, null, {
-      default: V(() => [
+      default: P(() => [
         U(J, { type: "spinner" })
       ]),
       _: 1
     }));
   }
-}), lo = /* @__PURE__ */ _(ao, [["__scopeId", "data-v-1436aa9f"]]), co = { key: 0 }, io = {
+}), co = /* @__PURE__ */ g(lo, [["__scopeId", "data-v-1436aa9f"]]), io = { key: 0 }, uo = {
   key: 0,
   class: "t-checkbox-label"
-}, uo = /* @__PURE__ */ h({
+}, po = /* @__PURE__ */ h({
   __name: "t-checkbox",
   props: {
     label: { default: "" },
@@ -1351,26 +1369,26 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
       $("div", {
         class: S(`t-checkbox-${a.type}`)
       }, [
-        a.type == "radio" ? (c(), p("div", co)) : I("", !0),
+        a.type == "radio" ? (c(), p("div", io)) : z("", !0),
         a.type == "check" ? b(a.$slots, "icon", { key: 1 }, () => [
           f[0] || (f[0] = $("i", { class: "ri-check-line" }, null, -1))
-        ], !0) : I("", !0)
+        ], !0) : z("", !0)
       ], 2),
       b(a.$slots, "label", {}, () => [
-        a.label ? (c(), p("span", io, R(t.label), 1)) : I("", !0)
+        a.label ? (c(), p("span", uo, V(t.label), 1)) : z("", !0)
       ], !0)
     ], 6));
   }
-}), po = /* @__PURE__ */ _(uo, [["__scopeId", "data-v-0e13abc3"]]), fo = /* @__PURE__ */ h({
-  __name: "t-keyboard",
+}), fo = /* @__PURE__ */ g(po, [["__scopeId", "data-v-0e13abc3"]]), mo = /* @__PURE__ */ h({
+  __name: "t-keyboard-space",
   setup(e) {
     const { height: o } = ve();
     return (t, s) => (c(), p("div", {
-      class: "t-keyboard",
+      class: "t-keyboard-space",
       style: x({ "--height": A(o) + "px" })
     }, null, 4));
   }
-}), mo = /* @__PURE__ */ _(fo, [["__scopeId", "data-v-5d3fa1da"]]), vo = /* @__PURE__ */ h({
+}), vo = /* @__PURE__ */ g(mo, [["__scopeId", "data-v-4b06018d"]]), yo = /* @__PURE__ */ h({
   __name: "t-skeleton",
   props: {
     width: { default: "100%" },
@@ -1389,7 +1407,7 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
       style: x(t.value)
     }, null, 4));
   }
-}), yo = /* @__PURE__ */ _(vo, [["__scopeId", "data-v-877bbdb5"]]), _o = /* @__PURE__ */ h({
+}), _o = /* @__PURE__ */ g(yo, [["__scopeId", "data-v-877bbdb5"]]), go = /* @__PURE__ */ h({
   __name: "t-ripple",
   props: {
     color: { default: "primary" }
@@ -1410,20 +1428,20 @@ const Lt = /* @__PURE__ */ _(Wt, [["render", qt]]), Mt = /* @__PURE__ */ h({
       style: x(t.value)
     }, null, 4));
   }
-}), go = /* @__PURE__ */ _(_o, [["__scopeId", "data-v-42cb3d71"]]), So = () => ({
+}), bo = /* @__PURE__ */ g(go, [["__scopeId", "data-v-42cb3d71"]]), Bo = () => ({
   install: (e) => {
-    Te(), e.component("t-app", Ie), e.component("t-screen", _e), e.component("t-swipe-screen", vt), e.component("t-cable", rt), e.component("t-toolbar", _t), e.component("t-content", ye), e.component("t-card", nt), e.component("t-refresher", ut), e.component("t-button", Q), e.component("t-back-button", bt), e.component("t-present", L), e.component("t-text", oe), e.component("t-sheet", wt), e.component("t-gesture-indicator", ge), e.component("t-input", zt), e.component("t-textarea", Et), e.component("t-rich-text", Rt), e.component("t-grid", Ot), e.component("t-grid-item", Lt), e.component("t-divider", Ht), e.component("t-toggle-password", Gt), e.component("t-loading-icon", J), e.component("t-alert", pe), e.component("t-avatar", jt), e.component("t-collapse", Yt), e.component("t-toast", me), e.component("t-switch", to), e.component("t-tab", so), e.component("t-tabs", no), e.component("t-loading-app", lo), e.component("t-checkbox", po), e.component("t-keyboard", mo), e.component("t-skeleton", yo), e.component("t-ripple", go);
+    Se(), e.component("t-app", Ie), e.component("t-screen", _e), e.component("t-swipe-screen", yt), e.component("t-cable", nt), e.component("t-toolbar", gt), e.component("t-content", ye), e.component("t-card", at), e.component("t-refresher", dt), e.component("t-button", Q), e.component("t-back-button", ht), e.component("t-present", q), e.component("t-text", se), e.component("t-sheet", xt), e.component("t-gesture-indicator", ge), e.component("t-input", zt), e.component("t-textarea", Vt), e.component("t-rich-text", At), e.component("t-grid", Wt), e.component("t-grid-item", Lt), e.component("t-divider", Ft), e.component("t-toggle-password", Ut), e.component("t-loading-icon", J), e.component("t-alert", pe), e.component("t-avatar", Kt), e.component("t-collapse", eo), e.component("t-toast", me), e.component("t-switch", oo), e.component("t-tab", ro), e.component("t-tabs", ao), e.component("t-loading-app", co), e.component("t-checkbox", fo), e.component("t-keyboard-space", vo), e.component("t-skeleton", _o), e.component("t-ripple", bo);
   }
 });
 export {
-  xe as blurCurrentActive,
-  wo as createAction,
-  $o as createAlert,
-  xo as createLoading,
-  To as createToast,
-  So as createToife,
-  we as isFormElement,
-  He as presentController,
+  Te as blurCurrentActive,
+  xo as createAction,
+  wo as createAlert,
+  To as createLoading,
+  So as createToast,
+  Bo as createToife,
+  xe as isFormElement,
+  Fe as presentController,
   T as screenController,
   ve as useKeyboard
 };