@rocketui/vue 0.0.61 → 0.0.63

package/README.md

@@ -1,6 +1,8 @@
 ![Logo](./resources/rocket-ui-logo-light.svg#gh-light-mode-only)
 ![Logo](./resources/rocket-ui-logo-dark.svg#gh-dark-mode-only)
 
+<a href="https://npmjs.com/package/@rocketui/vue"><img src="https://img.shields.io/npm/v/@rocketui/vue?style=flat&colorA=080f12&colorB=34b2ae" alt="npm version"></a>
+
 ## Installation
 
 ```sh

package/dist/rocket-ui-vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as F, openBlock as t, createElementBlock as a, createElementVNode as Z, unref as p, reactive as J, Fragment as U, renderList as Y, normalizeClass as f, renderSlot as B, toDisplayString as y, createVNode as q, computed as k, createCommentVNode as g, mergeProps as H2, withModifiers as N, createBlock as x, watch as W, getCurrentScope as V2, onScopeDispose as L2, ref as D, onMounted as M2, withDirectives as E1, withKeys as k1, vModelText as A2, createTextVNode as _1, normalizeStyle as p1, vShow as i2, useCssVars as e2, watchEffect as d2, resolveComponent as t2, withCtx as W1, provide as a1, resolveDynamicComponent as m2, inject as Z1 } from "vue";
+import { defineComponent as F, openBlock as t, createElementBlock as a, createElementVNode as Z, unref as p, reactive as J, Fragment as U, renderList as Y, normalizeClass as f, renderSlot as B, toDisplayString as y, createVNode as q, computed as g, createCommentVNode as k, mergeProps as H2, withModifiers as N, createBlock as x, watch as W, getCurrentScope as V2, onScopeDispose as L2, ref as D, onMounted as M2, withDirectives as E1, withKeys as k1, vModelText as A2, createTextVNode as _1, normalizeStyle as p1, vShow as i2, useCssVars as e2, watchEffect as d2, resolveComponent as t2, withCtx as W1, provide as a1, resolveDynamicComponent as m2, inject as Z1 } from "vue";
 const l2 = {
   mdiAbTesting: "M4 2A2 2 0 0 0 2 4V12H4V8H6V12H8V4A2 2 0 0 0 6 2H4M4 4H6V6H4M22 15.5V14A2 2 0 0 0 20 12H16V22H20A2 2 0 0 0 22 20V18.5A1.54 1.54 0 0 0 20.5 17A1.54 1.54 0 0 0 22 15.5M20 20H18V18H20V20M20 16H18V14H20M5.79 21.61L4.21 20.39L18.21 2.39L19.79 3.61Z",
   mdiAbacus: "M5 5H7V11H5V5M10 5H8V11H10V5M5 19H7V13H5V19M10 13H8V19H10V17H15V15H10V13M2 21H4V3H2V21M20 3V7H13V5H11V11H13V9H20V15H18V13H16V19H18V17H20V21H22V3H20Z",
@@ -7380,12 +7380,12 @@ const n2 = ["data-state"], a2 = ["onClick"], Z2 = { class: "r-accordion__title"
   },
   emits: ["close"],
   setup(H, { emit: V }) {
-    const C = H, L = k(() => ({
+    const C = H, L = g(() => ({
       " r-alert": !0,
       [`r-alert--${C.variant}`]: !0,
       "r-alert--block": C.block,
       [`r-alert--${C.variant}--${C.type}`]: !0
-    })), M = k(() => ({
+    })), M = g(() => ({
       success: "mdiCheckCircle",
       error: "mdiAlertCircle",
       warning: "mdiAlert",
@@ -7407,7 +7407,7 @@ const n2 = ["data-state"], a2 = ["onClick"], Z2 = { class: "r-accordion__title"
       Z("div", s2, [
         B(i.$slots, "content", {}, () => [
           Z("p", O2, y(C.title), 1),
-          C.description ? (t(), a("p", p2, y(C.description), 1)) : g("", !0)
+          C.description ? (t(), a("p", p2, y(C.description), 1)) : k("", !0)
         ])
       ]),
       C.closable ? (t(), a("div", h2, [
@@ -7419,7 +7419,7 @@ const n2 = ["data-state"], a2 = ["onClick"], Z2 = { class: "r-accordion__title"
             onClick: A
           })
         ])
-      ])) : g("", !0)
+      ])) : k("", !0)
     ], 2));
   }
 }), B1 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjciIGhlaWdodD0iMjgiIHZpZXdCb3g9IjAgMCAyNyAyOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEzLjQ5OTMgMTRDMTcuMTgyNyAxNCAyMC4xNjYgMTEuMDE2NyAyMC4xNjYgNy4zMzMzNEMyMC4xNjYgMy42NSAxNy4xODI3IDAuNjY2NjcyIDEzLjQ5OTMgMC42NjY2NzJDOS44MTYwMiAwLjY2NjY3MiA2LjgzMjY4IDMuNjUgNi44MzI2OCA3LjMzMzM0QzYuODMyNjggMTEuMDE2NyA5LjgxNjAyIDE0IDEzLjQ5OTMgMTRaTTEzLjQ5OTMgMTcuMzMzM0M5LjA0OTM1IDE3LjMzMzMgMC4xNjYwMTYgMTkuNTY2NyAwLjE2NjAxNiAyNFYyNS42NjY3QzAuMTY2MDE2IDI2LjU4MzMgMC45MTYwMTYgMjcuMzMzMyAxLjgzMjY4IDI3LjMzMzNIMjUuMTY2QzI2LjA4MjcgMjcuMzMzMyAyNi44MzI3IDI2LjU4MzMgMjYuODMyNyAyNS42NjY3VjI0QzI2LjgzMjcgMTkuNTY2NyAxNy45NDkzIDE3LjMzMzMgMTMuNDk5MyAxNy4zMzMzWiIgZmlsbD0iIzRDNUJFMSIvPgo8L3N2Zz4K", f2 = { class: "r-avatar__wrapper" }, g2 = ["alt", "src"], u3 = /* @__PURE__ */ F({
@@ -7433,10 +7433,10 @@ const n2 = ["data-state"], a2 = ["onClick"], Z2 = { class: "r-accordion__title"
     text: { default: "" }
   },
   setup(H) {
-    const V = H, C = k(() => ({
+    const V = H, C = g(() => ({
       "r-avatar": !0,
       [`r-avatar--${V.size}`]: !0
-    })), L = k(() => V.type === "image" && !V.src), M = k(() => L.value ? B1 : V.src), A = (i) => {
+    })), L = g(() => V.type === "image" && !V.src), M = g(() => L.value ? B1 : V.src), A = (i) => {
       const e = i.split(" ");
       return e.length === 1 ? e[0].substring(0, 2) : `${e[0].charAt(0)}${e[1].charAt(0)}`;
     };
@@ -7464,7 +7464,7 @@ const n2 = ["data-state"], a2 = ["onClick"], Z2 = { class: "r-accordion__title"
           "r-avatar__online": !0,
           [`r-avatar__online--${V.size}`]: !0
         })
-      }, null, 2)) : g("", !0)
+      }, null, 2)) : k("", !0)
     ]));
   }
 }), k2 = { class: "r-badge-wrapper group" }, S3 = /* @__PURE__ */ F({
@@ -7479,7 +7479,7 @@ const n2 = ["data-state"], a2 = ["onClick"], Z2 = { class: "r-accordion__title"
   },
   emits: ["click"],
   setup(H) {
-    const V = H, C = k(() => ({
+    const V = H, C = g(() => ({
       "r-badge": !0,
       "r-badge__content": V.content,
       [`r-badge--overlap-${V.placement}`]: V.overlap,
@@ -7514,18 +7514,18 @@ const n2 = ["data-state"], a2 = ["onClick"], Z2 = { class: "r-accordion__title"
   },
   emits: ["click"],
   setup(H) {
-    const V = H, C = k(() => ({
+    const V = H, C = g(() => ({
       "r-button": !0,
       [`r-button--${V.variant}`]: !0,
       "r-button--loading": V.loading,
       [`r-button--${V.size || "medium"}`]: !0,
       "r-button--only-icon": V.onlyIcon,
       "r-button--block": V.block
-    })), L = k(() => ({
+    })), L = g(() => ({
       small: 20,
       medium: 24,
       large: 32
-    })[V.size || "medium"]), M = k(() => {
+    })[V.size || "medium"]), M = g(() => {
       const { backgroundColor: A, height: i, color: e } = V;
       return {
         backgroundColor: A,
@@ -7548,14 +7548,14 @@ const n2 = ["data-state"], a2 = ["onClick"], Z2 = { class: "r-accordion__title"
         }),
         name: V.prependIcon,
         size: p(L)
-      }, null, 8, ["class", "name", "size"])) : g("", !0),
-      V.onlyIcon ? g("", !0) : B(A.$slots, "default", { key: 1 }),
+      }, null, 8, ["class", "name", "size"])) : k("", !0),
+      V.onlyIcon ? k("", !0) : B(A.$slots, "default", { key: 1 }),
       !A.$slots["custom-icon"] && !V.onlyIcon && V.appendIcon ? (t(), x(R, {
         key: 2,
         class: "r-button__append-icon",
         name: V.appendIcon,
         size: p(L)
-      }, null, 8, ["name", "size"])) : g("", !0)
+      }, null, 8, ["name", "size"])) : k("", !0)
     ], 16, B2));
   }
 }), b2 = { class: "r-checkbox-wrapper" }, y2 = { class: "r-checkbox-container" }, w2 = ["id", "checked", "disabled", "indeterminate"], P2 = ["data-disabled"], T2 = { class: "r-checkbox-texts" }, v2 = ["data-disabled", "for"], F2 = {
@@ -7584,7 +7584,7 @@ const n2 = ["data-state"], a2 = ["onClick"], Z2 = { class: "r-accordion__title"
       checked: "mdiCheck",
       unchecked: "",
       indeterminate: "mdiMinus"
-    }, A = k(() => L.indeterminate ? M.indeterminate : L.checked ? M.checked : M.unchecked), i = k(() => ({
+    }, A = g(() => L.indeterminate ? M.indeterminate : L.checked ? M.checked : M.unchecked), i = g(() => ({
       "r-checkbox": !0,
       "r-checkbox--checked": L.checked,
       "r-checkbox--disabled": C.disabled,
@@ -7657,7 +7657,7 @@ const n2 = ["data-state"], a2 = ["onClick"], Z2 = { class: "r-accordion__title"
   },
   emits: ["click:chip", "click:close"],
   setup(H, { emit: V }) {
-    const C = H, L = k(() => ({
+    const C = H, L = g(() => ({
       "r-chip": !0,
       "r-chip--disabled": C.disabled,
       [`r-chip__${C.variant}`]: C.variant,
@@ -7681,7 +7681,7 @@ const n2 = ["data-state"], a2 = ["onClick"], Z2 = { class: "r-accordion__title"
             class: "r-chip__content__prepend-icon",
             name: C.prependIcon,
             size: 12
-          }, null, 8, ["aria-disabled", "name"])) : g("", !0)
+          }, null, 8, ["aria-disabled", "name"])) : k("", !0)
         ]),
         Z("span", x2, y(C.label), 1)
       ]),
@@ -7693,7 +7693,7 @@ const n2 = ["data-state"], a2 = ["onClick"], Z2 = { class: "r-accordion__title"
           name: C.appendIcon,
           size: 12,
           onClick: e[1] || (e[1] = (d) => A(d))
-        }, null, 8, ["aria-disabled", "name"])) : g("", !0)
+        }, null, 8, ["aria-disabled", "name"])) : k("", !0)
       ])
     ], 2));
   }
@@ -7841,7 +7841,7 @@ const G2 = {
       if (O === "")
         return;
       C.options.find((h) => h.label === O) || (M.push({ value: O, label: O }), i.value = "", (v = d.value) == null || v.focus());
-    }, c = (S) => C.multiple ? M.find((O) => O.value === S.value) : L.value === S.value, w = k(() => C.searchable ? C.options.filter((O) => O.label.toLowerCase().includes(i.value.toLowerCase())) : C.options), T = k(() => C.multiple || C.taggable || !C.searchable);
+    }, c = (S) => C.multiple ? M.find((O) => O.value === S.value) : L.value === S.value, w = g(() => C.searchable ? C.options.filter((O) => O.label.toLowerCase().includes(i.value.toLowerCase())) : C.options), T = g(() => C.multiple || C.taggable || !C.searchable);
     return M2(() => {
       C.modelValue && (C.multiple ? M.push(C.modelValue) : (L.value = C.modelValue.value, i.value = C.modelValue.label));
     }), W(M, (S) => {
@@ -7873,9 +7873,9 @@ const G2 = {
             C.prependIcon ? (t(), x(R, {
               key: 0,
               name: C.prependIcon
-            }, null, 8, ["name"])) : g("", !0)
+            }, null, 8, ["name"])) : k("", !0)
           ])
-        ], 2)) : g("", !0),
+        ], 2)) : k("", !0),
         C.taggable ? (t(), a("div", G2, [
           (t(!0), a(U, null, Y(M, (s, v) => (t(), x(D2, {
             key: v,
@@ -7885,10 +7885,10 @@ const G2 = {
             variant: "primary",
             "onClick:close": (h) => u(h, s)
           }, null, 8, ["label", "onClick:close"]))), 128))
-        ])) : g("", !0),
+        ])) : k("", !0),
         C.multiple ? (t(), a("div", z2, [
           (t(!0), a(U, null, Y(M, (s, v) => (t(), a("p", { key: v }, y(s.label + ","), 1))), 128))
-        ])) : g("", !0),
+        ])) : k("", !0),
         E1(Z("input", {
           id: C.id,
           ref_key: "input",
@@ -7920,9 +7920,9 @@ const G2 = {
             C.appendIcon ? (t(), x(R, {
               key: 0,
               name: C.appendIcon
-            }, null, 8, ["name"])) : g("", !0)
+            }, null, 8, ["name"])) : k("", !0)
           ])
-        ], 2)) : g("", !0)
+        ], 2)) : k("", !0)
       ], 2),
       Z("ul", {
         class: f({
@@ -7962,7 +7962,7 @@ const G2 = {
               "r-dropdown-options__option__append-icon--active": c(s)
             }),
             name: "mdiCheck"
-          }, null, 8, ["class"])) : g("", !0)
+          }, null, 8, ["class"])) : k("", !0)
         ], 10, $2))), 128))
       ], 2)
     ], 512));
@@ -8005,21 +8005,25 @@ const G2 = {
     icon: null,
     width: null,
     height: null,
-    outsideClick: { type: Boolean }
+    outsideClick: { type: Boolean },
+    class: null,
+    overlayClass: null,
+    style: null
   },
   emits: ["update:modelValue"],
   setup(H, { emit: V }) {
-    const C = H, L = k(() => ({
+    const C = H, L = g(() => ({
       "r-dialog": !0,
-      "r-dialog--block": C.block
-    })), M = k(() => ({
+      "r-dialog--block": C.block,
+      [`${C.class}`]: !0
+    })), M = g(() => ({
       width: C.width,
       height: C.height
     })), A = (i) => {
       C.outsideClick && i.target === i.currentTarget && V("update:modelValue", !1);
     };
     return (i, e) => E1((t(), a("div", {
-      class: "r-modal-overlay",
+      class: f(["r-modal-overlay", H.overlayClass]),
       onClick: N(A, ["stop"])
     }, [
       Z("div", {
@@ -8035,9 +8039,9 @@ const G2 = {
             q(R, {
               name: C.icon
             }, null, 8, ["name"])
-          ])) : g("", !0),
-          C.title ? (t(), a("div", C5, y(C.title), 1)) : g("", !0),
-          C.description ? (t(), a("div", H5, y(C.description), 1)) : g("", !0)
+          ])) : k("", !0),
+          C.title ? (t(), a("div", C5, y(C.title), 1)) : k("", !0),
+          C.description ? (t(), a("div", H5, y(C.description), 1)) : k("", !0)
         ]),
         Z("div", V5, [
           B(i.$slots, "default")
@@ -8046,7 +8050,7 @@ const G2 = {
           B(i.$slots, "actions")
         ])
       ], 14, Y2)
-    ], 8, q2)), [
+    ], 10, q2)), [
       [i2, H.modelValue]
     ]);
   }
@@ -8059,7 +8063,7 @@ const G2 = {
     triggerClass: null
   },
   setup(H) {
-    const V = H, C = k(() => ({
+    const V = H, C = g(() => ({
       "r-sidebar": !0
     }));
     return (L, M) => (t(), a(U, null, [
@@ -8083,7 +8087,7 @@ const G2 = {
         B(L.$slots, "trigger", {}, () => [
           d5
         ])
-      ], 10, e5)) : g("", !0)
+      ], 10, e5)) : k("", !0)
     ], 64));
   }
 }), t5 = { class: "r-snackbar__text" }, m5 = {
@@ -8114,18 +8118,18 @@ const G2 = {
         immediate: !0
       }
     );
-    const L = k(() => ({
+    const L = g(() => ({
       "r-snackbar": !0,
       [`r-snackbar--${C.variant}`]: !0,
       [C.left ? "r-snackbar__left" : "r-snackbar__right"]: !0,
       [C.modelValue ? "r-snackbar--shown" : "r-snackbar--hidden"]: !0,
       [C.top ? "r-snackbar__top" : "r-snackbar__bottom"]: !0
-    })), M = {
+    })), M = g(() => ({
       success: "mdiCheckCircle",
       error: "mdiAlertCircle",
       warning: "mdiAlert",
       info: "mdiInformation"
-    }[C.variant || "info"];
+    })[C.variant || "info"]);
     return (A, i) => (t(), a("div", {
       class: f(p(L))
     }, [
@@ -8134,7 +8138,7 @@ const G2 = {
           key: 0,
           class: "r-snackbar__icon",
           name: p(M)
-        }, null, 8, ["name"])) : g("", !0)
+        }, null, 8, ["name"])) : k("", !0)
       ]),
       Z("div", t5, y(C.text), 1),
       B(A.$slots, "action"),
@@ -8146,7 +8150,7 @@ const G2 = {
             onClick: i[0] || (i[0] = N((e) => A.$emit("update:modelValue", !1), ["stop"]))
           })
         ])
-      ])) : g("", !0)
+      ])) : k("", !0)
     ], 2));
   }
 }), l5 = { class: "r-switch-container" }, o5 = ["id", "checked"], r5 = /* @__PURE__ */ Z("span", { class: "slider round" }, null, -1), n5 = ["id", "for"], a5 = {
@@ -8170,7 +8174,7 @@ const G2 = {
   setup(H, { emit: V }) {
     const C = H, L = J({
       checked: !1
-    }), M = k(() => ({
+    }), M = g(() => ({
       "r-switch": !0,
       "r-switch--disabled": C.disabled,
       [`r-switch--${C.size}`]: C.size,
@@ -8237,12 +8241,12 @@ const u5 = ["aria-disabled", "aria-selected", "disabled"], S5 = {
   },
   emits: ["update:modelValue", "click:icon"],
   setup(H, { emit: V }) {
-    const C = H, L = k(() => ({
+    const C = H, L = g(() => ({
       "r-tab-item": !0,
       [`r-tab-item--${C.variant}`]: !0,
       "r-tab-item--tile": C.tile,
       "r-tab-item--block": C.block
-    })), M = k(() => ({
+    })), M = g(() => ({
       color: C.color
     }));
     function A(e) {
@@ -8265,9 +8269,9 @@ const u5 = ["aria-disabled", "aria-selected", "disabled"], S5 = {
           class: "r-tab-item__prepend-icon",
           name: C.prependIcon,
           size: 16
-        }, null, 8, ["name"])) : g("", !0)
+        }, null, 8, ["name"])) : k("", !0)
       ]),
-      C.variant !== p(V1).ICON ? (t(), a("span", S5, y(C.label), 1)) : g("", !0),
+      C.variant !== p(V1).ICON ? (t(), a("span", S5, y(C.label), 1)) : k("", !0),
       B(e.$slots, "append", {}, () => [
         C.variant !== p(V1).TEXT && C.appendIcon ? (t(), x(R, {
           key: 0,
@@ -8275,7 +8279,7 @@ const u5 = ["aria-disabled", "aria-selected", "disabled"], S5 = {
           name: C.appendIcon,
           size: 16,
           onClick: N(i, ["stop"])
-        }, null, 8, ["name", "onClick"])) : g("", !0)
+        }, null, 8, ["name", "onClick"])) : k("", !0)
       ])
     ], 14, u5));
   }
@@ -8289,7 +8293,7 @@ const u5 = ["aria-disabled", "aria-selected", "disabled"], S5 = {
   },
   emits: ["update:modelValue", "click:icon"],
   setup(H, { emit: V }) {
-    const C = H, L = D(C.modelValue || C.tabs[0].id), M = k(() => ({
+    const C = H, L = D(C.modelValue || C.tabs[0].id), M = g(() => ({
       "r-tabs": !0,
       "r-tabs--block": C.block,
       "r-tabs--tile": C.tile
@@ -8365,7 +8369,7 @@ const u5 = ["aria-disabled", "aria-selected", "disabled"], S5 = {
         class: "r-textarea__label",
         for: "textarea",
         text: C.label
-      }, null, 8, ["text"])) : g("", !0),
+      }, null, 8, ["text"])) : k("", !0),
       Z("textarea", {
         id: C.id,
         class: f(["r-textarea", {
@@ -8426,7 +8430,7 @@ const u5 = ["aria-disabled", "aria-selected", "disabled"], S5 = {
       url: "mdiLink",
       number: "mdiNumeric",
       text: ""
-    }, e = D(!1), d = k(() => !!M.value), m = k(() => {
+    }, e = D(!1), d = g(() => !!M.value), m = g(() => {
       const { disabled: h, loading: P, clearable: E, errorMsg: _ } = C;
       return {
         "r-textfield": !0,
@@ -8437,21 +8441,21 @@ const u5 = ["aria-disabled", "aria-selected", "disabled"], S5 = {
         "r-textfield--focus": e.value,
         "r-textfield--filled": d.value
       };
-    }), o = k(() => ({
+    }), o = g(() => ({
       "r-textfield__prepend-icon": !0,
       "r-textfield__prepend-icon--loading": C.loading,
       "r-textfield__prepend-icon--error": r.value && d.value
-    })), l = k(() => ({
+    })), l = g(() => ({
       "r-textfield__append-icon": !0,
       "r-textfield__append-icon--clear": u.value,
       "r-textfield__append-icon--error": r.value
-    })), n = k(() => M.value.length > 0), r = k(() => {
+    })), n = g(() => M.value.length > 0), r = g(() => {
       var h;
       return (h = C.errorMsg) == null ? void 0 : h.length;
-    }), u = k(() => C.clearable && n.value), b = k(() => {
+    }), u = g(() => C.clearable && n.value), b = g(() => {
       const { prependIcon: h, type: P } = C;
       return h === "none" ? "" : h || i[P];
-    }), c = k(() => {
+    }), c = g(() => {
       const { appendIcon: h, type: P } = C;
       return h === "none" ? "" : r.value ? "mdiAlertCircleOutline" : u.value && ["text", "email"].includes(P) ? "mdiClose" : P === "password" && A.value === "password" ? "mdiEyeOutline" : P === "password" && A.value === "text" ? "mdiEyeOffOutline" : h;
     }), w = (h) => {
@@ -8504,7 +8508,7 @@ const u5 = ["aria-disabled", "aria-selected", "disabled"], S5 = {
           for: C.id,
           text: C.label,
           onClick: v
-        }, null, 8, ["id", "for", "text"])) : g("", !0),
+        }, null, 8, ["id", "for", "text"])) : k("", !0),
         Z("div", g5, [
           Z("div", {
             class: f(p(m))
@@ -8515,7 +8519,7 @@ const u5 = ["aria-disabled", "aria-selected", "disabled"], S5 = {
               class: f(p(o)),
               name: p(b),
               size: 20
-            }, null, 8, ["class", "name"])) : g("", !0),
+            }, null, 8, ["class", "name"])) : k("", !0),
             Z("input", {
               id: C.id,
               ref_key: "inputRef",
@@ -8537,10 +8541,10 @@ const u5 = ["aria-disabled", "aria-selected", "disabled"], S5 = {
               name: `${p(c)}`,
               size: 20,
               onClick: O
-            }, null, 8, ["class", "name"])) : g("", !0)
+            }, null, 8, ["class", "name"])) : k("", !0)
           ], 2),
-          C.errorMsg ? (t(), a("div", B5, y(C.errorMsg), 1)) : g("", !0),
-          !C.errorMsg && C.hint ? (t(), a("div", b5, y(C.hint), 1)) : g("", !0)
+          C.errorMsg ? (t(), a("div", B5, y(C.errorMsg), 1)) : k("", !0),
+          !C.errorMsg && C.hint ? (t(), a("div", b5, y(C.hint), 1)) : k("", !0)
         ])
       ])
     ]));
@@ -8993,7 +8997,7 @@ const z5 = ["aria-disabled", "onClick", "onMouseenter", "onMouseleave", "onMouse
     }, r = () => {
       const { placement: c, offset: w, padding: T, disabled: S } = C;
       S || C.triggers === z.Hover && S1(L, M, A, c, w, T);
-    }, u = k(() => ({
+    }, u = g(() => ({
       tooltip: !0,
       "tooltip--dark": C.dark,
       "tooltip--light": C.light
@@ -9008,7 +9012,7 @@ const z5 = ["aria-disabled", "onClick", "onMouseenter", "onMouseleave", "onMouse
       { flush: "post" }
       // this is important to avoid infinite loop & for fire on mounted
     );
-    const b = k(() => `${C.showDelay}ms`);
+    const b = g(() => `${C.showDelay}ms`);
     return (c, w) => (t(), a(U, null, [
       Z("div", {
         ref_key: "trigger",
@@ -9021,7 +9025,7 @@ const z5 = ["aria-disabled", "onClick", "onMouseenter", "onMouseleave", "onMouse
         onMousemove: N(r, ["stop"])
       }, [
         B(c.$slots, "trigger", {}, void 0, !0),
-        c.$slots.trigger ? g("", !0) : (t(), a("div", {
+        c.$slots.trigger ? k("", !0) : (t(), a("div", {
           key: 0,
           innerHTML: C.triggerContent
         }, null, 8, U5))
@@ -9034,7 +9038,7 @@ const z5 = ["aria-disabled", "onClick", "onMouseenter", "onMouseleave", "onMouse
         role: "tooltip"
       }, [
         B(c.$slots, "content", {}, void 0, !0),
-        c.$slots.content ? g("", !0) : (t(), a("div", {
+        c.$slots.content ? k("", !0) : (t(), a("div", {
           key: 0,
           class: f({
             tooltip__content: !0,
@@ -9042,7 +9046,7 @@ const z5 = ["aria-disabled", "onClick", "onMouseenter", "onMouseleave", "onMouse
             "tooltip__content--light": C.light
           })
         }, y(C.text), 3)),
-        c.$slots.content ? g("", !0) : (t(), a("div", {
+        c.$slots.content ? k("", !0) : (t(), a("div", {
           key: 1,
           id: "arrow",
           ref_key: "arrowElement",
@@ -9089,9 +9093,9 @@ const K5 = (H, V) => {
                 A.icon ? (t(), x(R, {
                   key: 0,
                   name: A.icon
-                }, null, 8, ["name"])) : g("", !0)
+                }, null, 8, ["name"])) : k("", !0)
               ]),
-              A.onlyIcon ? g("", !0) : (t(), a("span", q5, y(A.title), 1))
+              A.onlyIcon ? k("", !0) : (t(), a("span", q5, y(A.title), 1))
             ]),
             _: 2
           }, 1032, ["to"]),
@@ -9100,7 +9104,7 @@ const K5 = (H, V) => {
               key: 0,
               class: "r-breadcrumb__separator",
               name: V.seperator
-            }, null, 8, ["name"])) : g("", !0)
+            }, null, 8, ["name"])) : k("", !0)
           ])
         ]))), 128))
       ]);
@@ -9132,12 +9136,12 @@ const K5 = (H, V) => {
   },
   emits: ["update:page"],
   setup(H, { emit: V }) {
-    const C = H, L = k(() => Math.ceil(C.totalItems / C.perPage)), M = (A) => {
+    const C = H, L = g(() => Math.ceil(C.totalItems / C.perPage)), M = (A) => {
       A < 1 || A > L.value || V("update:page", A);
     };
     return (A, i) => (t(), a("div", Y5, [
       Z("div", X5, [
-        H.slash ? g("", !0) : (t(), a("span", J5, y(C.pageText), 1)),
+        H.slash ? k("", !0) : (t(), a("span", J5, y(C.pageText), 1)),
         Z("span", C3, y(C.page), 1),
         Z("span", null, y(H.slash ? "/" : C.ofText), 1),
         Z("span", H3, y(p(L)), 1)
@@ -9228,7 +9232,7 @@ const K5 = (H, V) => {
   },
   emits: ["update:modelValue"],
   setup(H, { emit: V }) {
-    const C = H, L = "rocket-ui:r-item-group", M = D(C.as ?? "div"), A = D(C.modelValue ?? []), i = k(() => C.selectedClass);
+    const C = H, L = "rocket-ui:r-item-group", M = D(C.as ?? "div"), A = D(C.modelValue ?? []), i = g(() => C.selectedClass);
     a1(`${L}:selectedClass`, i.value);
     const e = (m) => A.value.includes(m);
     a1(`${L}:isSelected`, e);
@@ -9254,7 +9258,7 @@ const K5 = (H, V) => {
     selectedClass: { default: "" }
   },
   setup(H) {
-    const V = H, C = "rocket-ui:r-item-group", L = Z1(`${C}:isSelected`), M = Z1(`${C}:selectedClass`, ""), A = k(() => L(V.value) && [M, V.selectedClass]), i = Z1(`${C}:select`), e = () => {
+    const V = H, C = "rocket-ui:r-item-group", L = Z1(`${C}:isSelected`), M = Z1(`${C}:selectedClass`, ""), A = g(() => L(V.value) && [M, V.selectedClass]), i = Z1(`${C}:select`), e = () => {
       V.disabled || i(V.value, !L(V.value));
     }, d = () => {
       V.disabled || i(V.value, !0);