@vlalg-nimbus/nb-buttons 2.0.3 → 2.0.5

package/dist/nb-buttons.js

@@ -1,10 +1,10 @@
-import { useCssVars as F, toRefs as M, computed as t, openBlock as T, createElementBlock as L, normalizeClass as X, normalizeStyle as B, createElementVNode as R, renderSlot as q, createTextVNode as G, createCommentVNode as A, unref as ae, withModifiers as de, toDisplayString as Q, onMounted as se, ref as ie, watch as ce } from "vue";
-const j = (e, d) => {
-  const N = e.__vccOpts || e;
-  for (const [C, b] of d)
-    N[C] = b;
-  return N;
-}, fe = ["id"], ve = { class: "component-content__text" }, be = /* @__PURE__ */ Object.assign({
+import { useCssVars as F, toRefs as M, computed as t, openBlock as D, createElementBlock as O, normalizeClass as X, normalizeStyle as N, createElementVNode as R, renderSlot as T, createTextVNode as A, createCommentVNode as L, unref as te, withModifiers as re, onMounted as de, ref as se, watch as ie } from "vue";
+const j = (e, s) => {
+  const w = e.__vccOpts || e;
+  for (const [V, b] of s)
+    w[V] = b;
+  return w;
+}, ce = ["id"], fe = { class: "component-content__text" }, ve = /* @__PURE__ */ Object.assign({
   name: "NbButtonVavaGame",
   inheritAttrs: !1
 }, {
@@ -18,8 +18,8 @@ const j = (e, d) => {
       type: String,
       default: "ib",
       validator: (e = "") => {
-        const d = e.toLowerCase();
-        return ["b", "ib"].includes(d);
+        const s = e.toLowerCase();
+        return ["b", "ib"].includes(s);
       }
     },
     textColor: {
@@ -92,103 +92,103 @@ const j = (e, d) => {
     }
   },
   emits: ["clicked"],
-  setup(e, { emit: d }) {
-    const N = e;
-    F((u) => ({
-      "4348b976": H.value,
-      "1735afec": Y.value,
-      "58e23cb0": z.value,
-      "451672cd": r.value,
-      "55b7ee16": n.value
+  setup(e, { emit: s }) {
+    const w = e;
+    F((c) => ({
+      "859731ae": n.value,
+      "101619df": Y.value,
+      "90f5dac6": z.value,
+      f0f7a800: k.value,
+      33084168: u.value
     }));
     const {
-      display: C,
+      display: V,
       textColor: b,
-      textColorHover: x,
+      textColorHover: m,
       buttonColor: p,
       buttonColorHover: y,
-      uppercase: v,
-      paddingXContent: V,
-      paddingYContent: g,
-      paddingXBorder: w,
-      paddingYBorder: s,
-      borderColor: c,
-      borderOpacity: m,
-      disabled: l,
-      fontFamily: S,
-      fontSize: $,
-      fontWeight: h
-    } = M(N), _ = t(() => {
-      const u = l.value ? "component-disabled" : "", I = C.value !== "b" ? "inline-block" : "block", D = b.value ? b.value : "#ece8e1", O = p.value ? p.value : "green", P = x.value ? x.value : "#ece8e1", E = y.value ? y.value : "cyan", J = c.value ? c.value : "#ffffff", K = !m.value || !(m.value >= 0 && m.value <= 1) ? "0.5" : m.value, U = !w.value || w.value < 0 ? 0.3 : w.value, Z = !s.value || s.value < 0 ? 0.3 : s.value, ee = !V.value || V.value < 0 ? 0.5 : V.value, oe = !g.value || g.value < 0 ? 0.5 : g.value, le = v.value ? "uppercase" : "none", ne = S.value ? S.value : "'Lato', sans-serif", ue = $.value ? $.value : "1.6em", re = !h.value || h.value < 0 ? 100 : h.value;
+      uppercase: S,
+      paddingXContent: g,
+      paddingYContent: h,
+      paddingXBorder: C,
+      paddingYBorder: f,
+      borderColor: i,
+      borderOpacity: r,
+      disabled: v,
+      fontFamily: $,
+      fontSize: B,
+      fontWeight: x
+    } = M(w), _ = t(() => {
+      const c = v.value ? "component-disabled" : "", I = V.value !== "b" ? "inline-block" : "block", P = b.value ? b.value : "#ece8e1", q = p.value ? p.value : "green", G = m.value ? m.value : "#ece8e1", E = y.value ? y.value : "cyan", J = i.value ? i.value : "#ffffff", K = !r.value || !(r.value >= 0 && r.value <= 1) ? "0.5" : r.value, Q = !C.value || C.value < 0 ? 0.3 : C.value, U = !f.value || f.value < 0 ? 0.3 : f.value, Z = !g.value || g.value < 0 ? 0.5 : g.value, ae = !h.value || h.value < 0 ? 0.5 : h.value, oe = S.value ? "uppercase" : "none", le = $.value ? $.value : "'Lato', sans-serif", ne = B.value ? B.value : "1.6em", ue = !x.value || x.value < 0 ? 100 : x.value;
       return {
-        disabled: u,
+        disabled: c,
         display: I,
-        textColor: D,
-        buttonColor: O,
-        textColorHover: P,
+        textColor: P,
+        buttonColor: q,
+        textColorHover: G,
         buttonColorHover: E,
         borderColor: J,
         borderOpacity: K,
-        paddingXBorder: U,
-        paddingYBorder: Z,
-        paddingXContent: ee,
-        paddingYContent: oe,
-        uppercase: le,
-        font: ne,
-        fontSize: ue,
-        fontWeight: re
+        paddingXBorder: Q,
+        paddingYBorder: U,
+        paddingXContent: Z,
+        paddingYContent: ae,
+        uppercase: oe,
+        font: le,
+        fontSize: ne,
+        fontWeight: ue
       };
-    }), f = t(() => _.value.disabled), i = t(() => ({
+    }), o = t(() => _.value.disabled), H = t(() => ({
       display: _.value.display
-    })), k = t(() => {
-      const u = _.value;
+    })), d = t(() => {
+      const c = _.value;
       return {
-        padding: `${u.paddingYBorder}rem ${u.paddingXBorder}rem`,
-        fontSize: u.fontSize,
-        fontWeight: u.fontWeight
+        padding: `${c.paddingYBorder}rem ${c.paddingXBorder}rem`,
+        fontSize: c.fontSize,
+        fontWeight: c.fontWeight
       };
     }), a = t(() => {
-      const u = _.value;
+      const c = _.value;
       return {
-        textTransform: u.uppercase,
-        padding: `${u.paddingYContent}rem ${u.paddingXContent}rem`,
-        backgroundColor: u.buttonColor
+        textTransform: c.uppercase,
+        padding: `${c.paddingYContent}rem ${c.paddingXContent}rem`,
+        backgroundColor: c.buttonColor
       };
-    }), o = t(() => ({
+    }), l = t(() => ({
       backgroundColor: _.value.buttonColorHover
-    })), H = t(() => _.value.font), r = t(() => _.value.borderColor), n = t(() => _.value.borderOpacity), Y = t(() => _.value.textColor), z = t(() => _.value.textColorHover), W = () => {
-      d("clicked");
+    })), n = t(() => _.value.font), k = t(() => _.value.borderColor), u = t(() => _.value.borderOpacity), Y = t(() => _.value.textColor), z = t(() => _.value.textColorHover), W = () => {
+      s("clicked");
     };
-    return (u, I) => e.nbId ? (T(), L("div", {
+    return (c, I) => e.nbId ? (D(), O("div", {
       key: 0,
-      class: X(["nb-wrapper", f.value]),
-      style: B([i.value]),
+      class: X(["nb-wrapper", o.value]),
+      style: N([H.value]),
       onClick: W
     }, [
       R("div", {
         id: e.nbId,
         class: X(["nb-reset", "component"]),
-        style: B([k.value])
+        style: N([d.value])
       }, [
         R("div", {
           class: "component-content",
-          style: B([a.value])
+          style: N([a.value])
         }, [
-          R("span", ve, [
-            q(u.$slots, "text", {}, () => [
-              G("Default Text")
+          R("span", fe, [
+            T(c.$slots, "content", {}, () => [
+              A("Default Text")
             ], !0)
           ]),
           R("span", {
             class: "component-content__mask",
-            style: B([o.value])
+            style: N([l.value])
           }, null, 4)
         ], 4)
-      ], 12, fe)
-    ], 6)) : A("", !0);
+      ], 12, ce)
+    ], 6)) : L("", !0);
   }
-}), pe = /* @__PURE__ */ j(be, [["__scopeId", "data-v-09b2bb91"]]);
-const ye = ["id"], ge = /* @__PURE__ */ Object.assign({
+}), be = /* @__PURE__ */ j(ve, [["__scopeId", "data-v-4cddc525"]]);
+const pe = ["id"], ye = /* @__PURE__ */ Object.assign({
   name: "NbButtonShowHover",
   inheritAttrs: !1
 }, {
@@ -198,10 +198,6 @@ const ye = ["id"], ge = /* @__PURE__ */ Object.assign({
       type: String,
       required: !0
     },
-    text: {
-      type: String,
-      default: "Default Text"
-    },
     textColor: {
       type: String,
       default: "#145deb"
@@ -258,81 +254,83 @@ const ye = ["id"], ge = /* @__PURE__ */ Object.assign({
     }
   },
   emits: ["clicked"],
-  setup(e, { emit: d }) {
-    const N = e;
-    F((a) => ({
-      e35bf122: i.value,
-      "122f086c": _.value,
-      "590fef9e": f.value,
-      "383cafc6": e.textColorHover,
-      66192716: ae(b)
+  setup(e, { emit: s }) {
+    const w = e;
+    F((d) => ({
+      "4b8ff329": o.value,
+      "456d13a6": x.value,
+      55665737: _.value,
+      "6b7abb00": e.textColorHover,
+      b18900c8: te(V)
     }));
     const {
-      text: C,
-      textColor: b,
-      buttonColorHover: x,
-      buttonColorOpacityHover: p,
-      paddingX: y,
-      paddingY: v,
-      disabled: V,
+      textColor: V,
+      buttonColorHover: b,
+      buttonColorOpacityHover: m,
+      paddingX: p,
+      paddingY: y,
+      disabled: S,
       borderRadius: g,
-      verticalAlign: w,
-      fontFamily: s,
-      fontSize: c,
-      fontWeight: m
-    } = M(N), l = t(() => {
-      const a = C.value ? C.value : "Default Text", o = V.value ? "component-disabled" : "", H = w.value ? w.value : "middle", r = b ? b.value : "ffffff", n = !y.value || y.value < 0 ? 1 : y.value, Y = !v.value || v.value < 0 ? 0.2 : v.value, z = !g.value || g.value < 0 ? 0 : g.value, W = x.value ? x.value : "10, 38, 184", u = !p.value || p.value < 0 ? 0.1 : p.value, I = s.value ? s.value : "'Lato', sans-serif", D = c.value ? c.value : "1.6rem", O = !m.value || m.value < 0 ? 100 : m.value;
+      verticalAlign: h,
+      fontFamily: C,
+      fontSize: f,
+      fontWeight: i
+    } = M(w), r = t(() => {
+      const d = S.value ? "component-disabled" : "", a = h.value ? h.value : "middle", l = V ? V.value : "ffffff", n = !p.value || p.value < 0 ? 1 : p.value, k = !y.value || y.value < 0 ? 0.2 : y.value, u = !g.value || g.value < 0 ? 0 : g.value, Y = b.value ? b.value : "10, 38, 184", z = !m.value || m.value < 0 ? 0.1 : m.value, W = C.value ? C.value : "'Lato', sans-serif", c = f.value ? f.value : "1.6rem", I = !i.value || i.value < 0 ? 100 : i.value;
       return {
-        disabled: o,
-        borderRadius: z,
-        textColor: r,
+        disabled: d,
+        borderRadius: u,
+        textColor: l,
         paddingX: n,
-        paddingY: Y,
-        buttonColorHover: W,
-        buttonColorOpacityHover: u,
-        font: I,
-        fontSize: D,
-        fontWeight: O,
-        text: a,
-        verticalAlign: H
+        paddingY: k,
+        buttonColorHover: Y,
+        buttonColorOpacityHover: z,
+        font: W,
+        fontSize: c,
+        fontWeight: I,
+        verticalAlign: a
       };
-    }), S = t(() => l.value.disabled), $ = t(() => ({
-      verticalAlign: l.value.verticalAlign
-    })), h = t(() => {
-      const a = l.value;
+    }), v = t(() => r.value.disabled), $ = t(() => ({
+      verticalAlign: r.value.verticalAlign
+    })), B = t(() => {
+      const d = r.value;
       return {
-        color: a.textColor,
-        padding: `${a.paddingY}rem 0`,
-        borderRadius: `${a.borderRadius}rem`,
-        fontSize: a.fontSize,
-        fontWeight: a.fontWeight
+        color: d.textColor,
+        padding: `${d.paddingY}rem 0`,
+        borderRadius: `${d.borderRadius}rem`,
+        fontSize: d.fontSize,
+        fontWeight: d.fontWeight
       };
+    }), x = t(() => {
+      const d = r.value;
+      return `${d.paddingY}rem ${d.paddingX}rem`;
     }), _ = t(() => {
-      const a = l.value;
-      return `${a.paddingY}rem ${a.paddingX}rem`;
-    }), f = t(() => {
-      const a = l.value;
-      return `rgba(${a.buttonColorHover}, ${a.buttonColorOpacityHover})`;
-    }), i = t(() => l.value.font), k = () => {
-      d("clicked");
+      const d = r.value;
+      return `rgba(${d.buttonColorHover}, ${d.buttonColorOpacityHover})`;
+    }), o = t(() => r.value.font), H = () => {
+      s("clicked");
     };
-    return (a, o) => e.nbId ? (T(), L("div", {
+    return (d, a) => e.nbId ? (D(), O("div", {
       key: 0,
-      class: X(["nb-wrapper", S.value]),
-      style: B([$.value]),
-      onClick: k
+      class: X(["nb-wrapper", v.value]),
+      style: N([$.value]),
+      onClick: H
     }, [
       R("a", {
         id: e.nbId,
         class: "nb-reset component tertiary",
-        style: B([h.value]),
-        onClick: o[0] || (o[0] = de(() => {
+        style: N([B.value]),
+        onClick: a[0] || (a[0] = re(() => {
         }, ["prevent"]))
-      }, Q(l.value.text), 13, ye)
-    ], 6)) : A("", !0);
+      }, [
+        T(d.$slots, "content", {}, () => [
+          A("Default Text")
+        ], !0)
+      ], 12, pe)
+    ], 6)) : L("", !0);
   }
-}), me = /* @__PURE__ */ j(ge, [["__scopeId", "data-v-7f17ac3f"]]);
-const Ve = ["id"], Ce = /* @__PURE__ */ Object.assign({
+}), ge = /* @__PURE__ */ j(ye, [["__scopeId", "data-v-35424129"]]);
+const me = ["id"], Ve = /* @__PURE__ */ Object.assign({
   name: "NbButtonPrevNext",
   inheritAttrs: !1
 }, {
@@ -419,99 +417,99 @@ const Ve = ["id"], Ce = /* @__PURE__ */ Object.assign({
     }
   },
   emits: ["clicked"],
-  setup(e, { emit: d }) {
-    const N = e;
+  setup(e, { emit: s }) {
+    const w = e;
     F((a) => ({
-      "2446b547": i.value,
+      "2446b547": H.value,
       a50bbbd2: e.colorPrimary,
       "0f9f603e": e.textColor,
       "748cd449": e.colorSecondary,
       "1af3ef9e": e.textColorHover
     }));
     const {
-      paddingX: C,
+      paddingX: V,
       paddingY: b,
-      marginBetween: x,
+      marginBetween: m,
       borderRadius: p,
       disabled: y,
-      disabledPreview: v,
-      disabledNext: V,
-      fontFamily: g,
-      fontSize: w,
-      fontWeight: s
-    } = M(N), c = t(() => {
-      const a = y.value ? "component-disabled" : "", o = v.value ? "component-disabled" : "", H = V.value ? "component-disabled" : "", r = !x.value || x.value < 0 ? 0 : x.value, n = !p.value || p.value < 0 ? 0 : p.value, Y = !C.value || C.value < 0 ? 1 : C.value, z = !b.value || b.value < 0 ? 10 : b.value, W = w.value ? w.value : "1.6em", u = !s.value || s.value < 0 ? 100 : s.value;
+      disabledPreview: S,
+      disabledNext: g,
+      fontFamily: h,
+      fontSize: C,
+      fontWeight: f
+    } = M(w), i = t(() => {
+      const a = y.value ? "component-disabled" : "", l = S.value ? "component-disabled" : "", n = g.value ? "component-disabled" : "", k = !m.value || m.value < 0 ? 0 : m.value, u = !p.value || p.value < 0 ? 0 : p.value, Y = !V.value || V.value < 0 ? 1 : V.value, z = !b.value || b.value < 0 ? 10 : b.value, W = C.value ? C.value : "1.6em", c = !f.value || f.value < 0 ? 100 : f.value;
       return {
         disabled: a,
-        disabledPreview: o,
-        disabledNext: H,
-        marginBetween: `${r}px`,
-        borderRadius: `${n}px`,
+        disabledPreview: l,
+        disabledNext: n,
+        marginBetween: `${k}px`,
+        borderRadius: `${u}px`,
         paddingX: `${Y}px`,
         paddingY: `${z}px`,
         fontSize: W,
-        fontWeight: u
+        fontWeight: c
       };
-    }), m = t(() => c.value.disabled), l = t(() => c.value.disabledPreview), S = t(() => c.value.disabledNext), $ = t(() => ({
-      display: c.value.display
-    })), h = t(() => {
-      const a = c.value;
+    }), r = t(() => i.value.disabled), v = t(() => i.value.disabledPreview), $ = t(() => i.value.disabledNext), B = t(() => ({
+      display: i.value.display
+    })), x = t(() => {
+      const a = i.value;
       return {
         fontSize: a.fontSize,
         fontWeight: a.fontWeight
       };
     }), _ = t(() => {
-      const a = c.value;
+      const a = i.value;
       return {
         borderRadius: `${a.borderRadius} 0px 0px ${a.borderRadius}`,
         marginRight: a.marginBetween,
         padding: `${a.paddingX} ${a.paddingY}`
       };
-    }), f = t(() => {
-      const a = c.value;
+    }), o = t(() => {
+      const a = i.value;
       return {
         borderRadius: `0px ${a.borderRadius} ${a.borderRadius} 0px`,
         marginLeft: a.marginBetween,
         padding: `${a.paddingX} ${a.paddingY}`
       };
-    }), i = t(() => `'${g.value ? g.value : "'Lato', sans-serif"}'`), k = (a) => {
-      d("clicked", a);
+    }), H = t(() => `'${h.value ? h.value : "'Lato', sans-serif"}'`), d = (a) => {
+      s("clicked", a);
     };
-    return (a, o) => e.nbId ? (T(), L("div", {
+    return (a, l) => e.nbId ? (D(), O("div", {
       key: 0,
-      class: X(["nb-wrapper", m.value]),
-      style: B([$.value])
+      class: X(["nb-wrapper", r.value]),
+      style: N([B.value])
     }, [
       R("div", {
         id: e.nbId,
         class: X(["nb-reset", "component"]),
-        style: B(h.value)
+        style: N(x.value)
       }, [
-        e.showPreview ? (T(), L("div", {
+        e.showPreview ? (D(), O("div", {
           key: 0,
-          onClick: o[0] || (o[0] = (H) => k("preview")),
-          class: X(["buttonNextPreview buttonPreview", l.value]),
-          style: B(_.value)
+          onClick: l[0] || (l[0] = (n) => d("preview")),
+          class: X(["buttonNextPreview buttonPreview", v.value]),
+          style: N(_.value)
         }, [
-          q(a.$slots, "prev", {}, () => [
-            G("← Preview")
+          T(a.$slots, "prev", {}, () => [
+            A("← Preview")
           ], !0)
-        ], 6)) : A("", !0),
-        e.showNext ? (T(), L("div", {
+        ], 6)) : L("", !0),
+        e.showNext ? (D(), O("div", {
           key: 1,
-          onClick: o[1] || (o[1] = (H) => k("next")),
-          class: X(["buttonNextPreview buttonNext", S.value]),
-          style: B(f.value)
+          onClick: l[1] || (l[1] = (n) => d("next")),
+          class: X(["buttonNextPreview buttonNext", $.value]),
+          style: N(o.value)
         }, [
-          q(a.$slots, "next", {}, () => [
-            G("Next →")
+          T(a.$slots, "next", {}, () => [
+            A("Next →")
           ], !0)
-        ], 6)) : A("", !0)
-      ], 12, Ve)
-    ], 6)) : A("", !0);
+        ], 6)) : L("", !0)
+      ], 12, me)
+    ], 6)) : L("", !0);
   }
-}), xe = /* @__PURE__ */ j(Ce, [["__scopeId", "data-v-f26b5a64"]]);
-const Se = ["id"], _e = /* @__PURE__ */ Object.assign({
+}), Ce = /* @__PURE__ */ j(Ve, [["__scopeId", "data-v-f26b5a64"]]);
+const Se = ["id"], xe = /* @__PURE__ */ Object.assign({
   name: "NbButtonMechanical",
   inheritAttrs: !1
 }, {
@@ -525,8 +523,8 @@ const Se = ["id"], _e = /* @__PURE__ */ Object.assign({
       type: String,
       default: "b",
       validator: (e = "b") => {
-        const d = e ? e.toLowerCase() : "";
-        return ["b", "ib"].includes(d);
+        const s = e ? e.toLowerCase() : "";
+        return ["b", "ib"].includes(s);
       }
     },
     textColor: {
@@ -580,78 +578,78 @@ const Se = ["id"], _e = /* @__PURE__ */ Object.assign({
     }
   },
   emits: ["clicked"],
-  setup(e, { emit: d }) {
-    const N = e;
-    F((o) => ({
-      "196eb3ca": f.value,
-      "5a845ff6": ae(b),
-      "44f25ea8": k.value,
-      "3eb45b5e": i.value
+  setup(e, { emit: s }) {
+    const w = e;
+    F((l) => ({
+      "196eb3ca": o.value,
+      "5a845ff6": te(b),
+      "44f25ea8": d.value,
+      "3eb45b5e": H.value
     }));
     const {
-      display: C,
+      display: V,
       buttonColor: b,
-      textColor: x,
+      textColor: m,
       containerColor: p,
       paddingX: y,
-      paddingY: v,
-      borderRadius: V,
-      disabled: g,
-      animationSlow: w,
-      fontFamily: s,
-      fontSize: c,
-      fontWeight: m
-    } = M(N), l = t(() => {
-      const o = g.value ? "component-disabled" : "", H = C.value !== "b" ? "inline-block" : "block", r = p.value ? p.value : "#ffffff", n = b.value ? b.value : "#bbbbbb", Y = x.value ? x.value : "#ffffff", z = !y.value || y.value < 0 ? 1 : y.value, W = !v.value || v.value < 0 ? 0.2 : v.value, u = !V.value || V.value < 0 ? 0 : V.value, I = w.value ? "" : "component-transition__no-slow", D = s.value ? s.value : "'Lato', sans-serif", O = c.value ? c.value : "1.6em", P = !m.value || m.value < 0 ? 100 : m.value;
+      paddingY: S,
+      borderRadius: g,
+      disabled: h,
+      animationSlow: C,
+      fontFamily: f,
+      fontSize: i,
+      fontWeight: r
+    } = M(w), v = t(() => {
+      const l = h.value ? "component-disabled" : "", n = V.value !== "b" ? "inline-block" : "block", k = p.value ? p.value : "#ffffff", u = b.value ? b.value : "#bbbbbb", Y = m.value ? m.value : "#ffffff", z = !y.value || y.value < 0 ? 1 : y.value, W = !S.value || S.value < 0 ? 0.2 : S.value, c = !g.value || g.value < 0 ? 0 : g.value, I = C.value ? "" : "component-transition__no-slow", P = f.value ? f.value : "'Lato', sans-serif", q = i.value ? i.value : "1.6em", G = !r.value || r.value < 0 ? 100 : r.value;
       return {
-        disabled: o,
-        display: H,
-        containerColor: r,
-        buttonColor: n,
+        disabled: l,
+        display: n,
+        containerColor: k,
+        buttonColor: u,
         textColor: Y,
         paddingX: z,
         paddingY: W,
-        borderRadius: u,
+        borderRadius: c,
         animationSlow: I,
-        font: D,
-        fontSize: O,
-        fontWeight: P
+        font: P,
+        fontSize: q,
+        fontWeight: G
       };
-    }), S = t(() => l.value.disabled), $ = t(() => ({
-      display: l.value.display
-    })), h = t(() => {
-      const o = l.value;
+    }), $ = t(() => v.value.disabled), B = t(() => ({
+      display: v.value.display
+    })), x = t(() => {
+      const l = v.value;
       return {
-        border: `2px solid ${o.containerColor}`,
-        color: o.textColor,
-        backgroundColor: o.buttonColor,
-        padding: `${o.paddingY}rem ${o.paddingX}rem`,
-        borderRadius: `${o.borderRadius}rem`,
-        fontSize: o.fontSize,
-        fontWeight: o.fontWeight
+        border: `2px solid ${l.containerColor}`,
+        color: l.textColor,
+        backgroundColor: l.buttonColor,
+        padding: `${l.paddingY}rem ${l.paddingX}rem`,
+        borderRadius: `${l.borderRadius}rem`,
+        fontSize: l.fontSize,
+        fontWeight: l.fontWeight
       };
-    }), _ = t(() => l.value.animationSlow), f = t(() => l.value.font), i = t(() => l.value.textColor), k = t(() => l.value.buttonColor), a = () => {
-      d("clicked");
+    }), _ = t(() => v.value.animationSlow), o = t(() => v.value.font), H = t(() => v.value.textColor), d = t(() => v.value.buttonColor), a = () => {
+      s("clicked");
     };
-    return (o, H) => e.nbId ? (T(), L("div", {
+    return (l, n) => e.nbId ? (D(), O("div", {
       key: 0,
-      class: X(["nb-wrapper", S.value]),
-      style: B([$.value]),
+      class: X(["nb-wrapper", $.value]),
+      style: N([B.value]),
       onClick: a
     }, [
       R("div", {
         id: e.nbId,
         class: X(["nb-reset", "component", "component-transition", _.value]),
-        style: B([h.value])
+        style: N([x.value])
       }, [
-        q(o.$slots, "content", {}, () => [
-          G("Default Text")
+        T(l.$slots, "content", {}, () => [
+          A("Default Text")
         ], !0)
       ], 14, Se)
-    ], 6)) : A("", !0);
+    ], 6)) : L("", !0);
   }
-}), he = /* @__PURE__ */ j(_e, [["__scopeId", "data-v-11d6e180"]]);
-const Ne = ["id"], we = /* @__PURE__ */ Object.assign({
+}), _e = /* @__PURE__ */ j(xe, [["__scopeId", "data-v-11d6e180"]]);
+const he = ["id"], Ne = /* @__PURE__ */ Object.assign({
   name: "NbButtonMechanical2",
   inheritAttrs: !1
 }, {
@@ -661,16 +659,12 @@ const Ne = ["id"], we = /* @__PURE__ */ Object.assign({
       type: String,
       required: !0
     },
-    text: {
-      type: String,
-      default: "Default Text"
-    },
     display: {
       type: String,
       default: "b",
       validator: (e = "b") => {
-        const d = e ? e.toLowerCase() : "";
-        return ["b", "ib"].includes(d);
+        const s = e ? e.toLowerCase() : "";
+        return ["b", "ib"].includes(s);
       }
     },
     textColor: {
@@ -720,71 +714,74 @@ const Ne = ["id"], we = /* @__PURE__ */ Object.assign({
     }
   },
   emits: ["clicked"],
-  setup(e, { emit: d }) {
-    const N = e;
-    F((i) => ({
-      ba36237e: _.value
+  setup(e, { emit: s }) {
+    const w = e;
+    F((o) => ({
+      "143d0975": x.value
     }));
     const {
-      text: C,
-      display: b,
-      buttonColor: x,
-      textColor: p,
-      paddingX: y,
-      paddingY: v,
-      borderRadius: V,
+      display: V,
+      buttonColor: b,
+      textColor: m,
+      paddingX: p,
+      paddingY: y,
+      borderRadius: S,
       shadowColor: g,
-      disabled: w,
-      fontFamily: s,
-      fontSize: c,
-      fontWeight: m
-    } = M(N), l = t(() => {
-      const i = w.value ? "component-disabled" : "", k = b.value !== "b" ? "inline-block" : "block", a = x.value ? x.value : "#bbbbbb", o = g.value ? g.value : "#002f3c", H = p.value ? p.value : "#ffffff", r = !y.value || y.value < 0 ? 1 : y.value, n = !v.value || v.value < 0 ? 1 : v.value, Y = !V.value || V.value < 0 ? 0 : V.value, z = s.value ? s.value : "'Lato', sans-serif", W = c.value ? c.value : "1.6em", u = !m.value || m.value < 0 ? 100 : m.value;
+      disabled: h,
+      fontFamily: C,
+      fontSize: f,
+      fontWeight: i
+    } = M(w), r = t(() => {
+      const o = h.value ? "component-disabled" : "", H = V.value !== "b" ? "inline-block" : "block", d = b.value ? b.value : "#bbbbbb", a = g.value ? g.value : "#002f3c", l = m.value ? m.value : "#ffffff", n = !p.value || p.value < 0 ? 1 : p.value, k = !y.value || y.value < 0 ? 1 : y.value, u = !S.value || S.value < 0 ? 0 : S.value, Y = C.value ? C.value : "'Lato', sans-serif", z = f.value ? f.value : "1.6em", W = !i.value || i.value < 0 ? 100 : i.value;
       return {
-        disabled: i,
-        display: k,
-        buttonColor: a,
-        shadowColor: o,
-        textColor: H,
-        paddingX: r,
-        paddingY: n,
-        borderRadius: Y,
-        font: z,
-        fontSize: W,
-        fontWeight: u
+        disabled: o,
+        display: H,
+        buttonColor: d,
+        shadowColor: a,
+        textColor: l,
+        paddingX: n,
+        paddingY: k,
+        borderRadius: u,
+        font: Y,
+        fontSize: z,
+        fontWeight: W
       };
-    }), S = t(() => l.value.disabled), $ = t(() => ({
-      display: l.value.display
-    })), h = t(() => {
-      const i = l.value;
+    }), v = t(() => r.value.disabled), $ = t(() => ({
+      display: r.value.display
+    })), B = t(() => {
+      const o = r.value;
       return {
-        color: i.textColor,
-        backgroundColor: i.buttonColor,
-        boxShadow: `0 0 #0000, 0 0 #0000, 3px 3px 0 ${i.shadowColor}`,
-        padding: `${i.paddingY}rem ${i.paddingX}rem`,
-        padding: `${i.paddingY}rem ${i.paddingX}rem`,
-        borderRadius: `${i.borderRadius}rem`,
-        fontSize: i.fontSize,
-        fontWeight: i.fontWeight
+        color: o.textColor,
+        backgroundColor: o.buttonColor,
+        boxShadow: `0 0 #0000, 0 0 #0000, 3px 3px 0 ${o.shadowColor}`,
+        padding: `${o.paddingY}rem ${o.paddingX}rem`,
+        padding: `${o.paddingY}rem ${o.paddingX}rem`,
+        borderRadius: `${o.borderRadius}rem`,
+        fontSize: o.fontSize,
+        fontWeight: o.fontWeight
       };
-    }), _ = t(() => l.value.font), f = () => {
-      d("clicked");
+    }), x = t(() => r.value.font), _ = () => {
+      s("clicked");
     };
-    return (i, k) => e.nbId ? (T(), L("div", {
+    return (o, H) => e.nbId ? (D(), O("div", {
       key: 0,
-      class: X(["nb-wrapper", S.value]),
-      style: B([$.value]),
-      onClick: f
+      class: X(["nb-wrapper", v.value]),
+      style: N([$.value]),
+      onClick: _
     }, [
       R("div", {
         id: e.nbId,
         class: X(["nb-reset", "component", "component-transition"]),
-        style: B([h.value])
-      }, Q(N.text), 13, Ne)
-    ], 6)) : A("", !0);
+        style: N([B.value])
+      }, [
+        T(o.$slots, "content", {}, () => [
+          A("Default Text")
+        ], !0)
+      ], 12, he)
+    ], 6)) : L("", !0);
   }
-}), Be = /* @__PURE__ */ j(we, [["__scopeId", "data-v-20a2a691"]]);
-const He = ["id"], $e = /* @__PURE__ */ Object.assign({
+}), we = /* @__PURE__ */ j(Ne, [["__scopeId", "data-v-f22590f0"]]);
+const Be = ["id"], $e = /* @__PURE__ */ Object.assign({
   name: "NbButtonHamburger",
   inheritAttrs: !1
 }, {
@@ -832,76 +829,76 @@ const He = ["id"], $e = /* @__PURE__ */ Object.assign({
     }
   },
   emits: ["clicked"],
-  setup(e, { emit: d }) {
-    const N = e;
-    F((f) => ({
-      "4f0c7280": $.value,
-      "86dec5da": h.value
-    })), se(() => {
-      C.value = b.value;
+  setup(e, { emit: s }) {
+    const w = e;
+    F((o) => ({
+      "4f0c7280": B.value,
+      "86dec5da": x.value
+    })), de(() => {
+      V.value = b.value;
     });
-    const C = ie(!1), {
+    const V = se(!1), {
       status: b,
-      color: x,
+      color: m,
       containerColor: p,
       containerColorHover: y,
-      colorHover: v,
-      paddingX: V,
-      paddingY: g,
-      disabled: w
-    } = M(N), s = t(() => {
-      const f = w.value ? "component-disabled" : "", i = C.value ? "change" : "", k = p.value ? p.value : "#333333", a = x.value ? x.value : "#ffffff", o = !V.value || V.value < 0 ? 3 : V.value, H = !g.value || g.value < 0 ? 3 : g.value, r = y.value ? y.value : "yellow", n = v.value ? v.value : "red";
+      colorHover: S,
+      paddingX: g,
+      paddingY: h,
+      disabled: C
+    } = M(w), f = t(() => {
+      const o = C.value ? "component-disabled" : "", H = V.value ? "change" : "", d = p.value ? p.value : "#333333", a = m.value ? m.value : "#ffffff", l = !g.value || g.value < 0 ? 3 : g.value, n = !h.value || h.value < 0 ? 3 : h.value, k = y.value ? y.value : "yellow", u = S.value ? S.value : "red";
       return {
-        disabled: f,
-        buttonStatus: i,
-        containerColor: k,
-        paddingX: o,
-        paddingY: H,
+        disabled: o,
+        buttonStatus: H,
+        containerColor: d,
+        paddingX: l,
+        paddingY: n,
         color: a,
-        containerColorHover: r,
-        colorHover: n
+        containerColorHover: k,
+        colorHover: u
       };
-    }), c = t(() => s.value.disabled), m = t(() => {
-      const f = s.value;
+    }), i = t(() => f.value.disabled), r = t(() => {
+      const o = f.value;
       return {
-        padding: `${f.paddingY}px ${f.paddingX}px`,
-        backgroundColor: f.containerColor
+        padding: `${o.paddingY}px ${o.paddingX}px`,
+        backgroundColor: o.containerColor
       };
-    }), l = t(() => ({
-      backgroundColor: s.value.color
-    })), S = t(() => s.value.buttonStatus), $ = t(() => s.value.containerColorHover), h = t(() => s.value.colorHover), _ = () => {
-      const f = !C.value;
-      C.value = f, d("clicked", f);
+    }), v = t(() => ({
+      backgroundColor: f.value.color
+    })), $ = t(() => f.value.buttonStatus), B = t(() => f.value.containerColorHover), x = t(() => f.value.colorHover), _ = () => {
+      const o = !V.value;
+      V.value = o, s("clicked", o);
     };
-    return ce(b, () => {
-      C.value = b.value;
-    }), (f, i) => e.nbId ? (T(), L("div", {
+    return ie(b, () => {
+      V.value = b.value;
+    }), (o, H) => e.nbId ? (D(), O("div", {
       key: 0,
-      class: X(["nb-wrapper", c.value]),
-      style: B([m.value]),
+      class: X(["nb-wrapper", i.value]),
+      style: N([r.value]),
       onClick: _
     }, [
       R("div", {
         id: e.nbId,
-        class: X(["nb-reset", "component", S.value])
+        class: X(["nb-reset", "component", $.value])
       }, [
         R("div", {
           class: "component__line-one",
-          style: B(l.value)
+          style: N(v.value)
         }, null, 4),
         R("div", {
           class: "component__line-two",
-          style: B(l.value)
+          style: N(v.value)
         }, null, 4),
         R("div", {
           class: "component__line-three",
-          style: B(l.value)
+          style: N(v.value)
         }, null, 4)
-      ], 10, He)
-    ], 6)) : A("", !0);
+      ], 10, Be)
+    ], 6)) : L("", !0);
   }
-}), ke = /* @__PURE__ */ j($e, [["__scopeId", "data-v-37573ac0"]]);
-const Ye = ["id"], Xe = /* @__PURE__ */ Object.assign({
+}), He = /* @__PURE__ */ j($e, [["__scopeId", "data-v-37573ac0"]]);
+const ke = ["id"], Ye = /* @__PURE__ */ Object.assign({
   name: "NbButtonColorOutside",
   inheritAttrs: !1
 }, {
@@ -915,14 +912,10 @@ const Ye = ["id"], Xe = /* @__PURE__ */ Object.assign({
       type: String,
       default: "b",
       validator: (e = "b") => {
-        const d = e ? e.toLowerCase() : "";
-        return ["b", "ib"].includes(d);
+        const s = e ? e.toLowerCase() : "";
+        return ["b", "ib"].includes(s);
       }
     },
-    text: {
-      type: String,
-      default: "Default Text"
-    },
     textColor: {
       type: String,
       default: "#ffffff"
@@ -970,73 +963,75 @@ const Ye = ["id"], Xe = /* @__PURE__ */ Object.assign({
     }
   },
   emits: ["clicked"],
-  setup(e, { emit: d }) {
-    const N = e;
-    F((o) => ({
-      bf6244be: f.value,
-      "3087ef32": k.value,
-      b71ed32e: _.value,
-      df6e4b52: i.value
+  setup(e, { emit: s }) {
+    const w = e;
+    F((a) => ({
+      c461ea64: _.value,
+      "39967e42": H.value,
+      ed566e48: x.value,
+      "0d683344": o.value
     }));
     const {
-      text: C,
-      display: b,
-      buttonColor: x,
-      borderColor: p,
-      textColor: y,
-      paddingX: v,
-      paddingY: V,
+      display: V,
+      buttonColor: b,
+      borderColor: m,
+      textColor: p,
+      paddingX: y,
+      paddingY: S,
       borderRadius: g,
-      disabled: w,
-      fontFamily: s,
-      fontSize: c,
-      fontWeight: m
-    } = M(N), l = t(() => {
-      const o = C.value ? C.value : "Default Text", H = w.value ? "component-disabled" : "", r = b.value !== "b" ? "inline-block" : "block", n = x.value ? x.value : "#bbbbbb", Y = p.value ? p.value : "#ffe54c", z = y.value ? y.value : "#ffffff", W = !v.value || v.value < 0 ? 1 : v.value, u = !V.value || V.value < 0 ? 0.2 : V.value, I = !g.value || g.value < 0 ? 0 : g.value, D = s.value ? s.value : "'Lato', sans-serif", O = c.value ? c.value : "1.6em", P = !m.value || m.value < 0 ? 200 : m.value;
+      disabled: h,
+      fontFamily: C,
+      fontSize: f,
+      fontWeight: i
+    } = M(w), r = t(() => {
+      const a = h.value ? "component-disabled" : "", l = V.value !== "b" ? "inline-block" : "block", n = b.value ? b.value : "#bbbbbb", k = m.value ? m.value : "#ffe54c", u = p.value ? p.value : "#ffffff", Y = !y.value || y.value < 0 ? 1 : y.value, z = !S.value || S.value < 0 ? 0.2 : S.value, W = !g.value || g.value < 0 ? 0 : g.value, c = C.value ? C.value : "'Lato', sans-serif", I = f.value ? f.value : "1.6em", P = !i.value || i.value < 0 ? 200 : i.value;
       return {
-        disabled: H,
-        display: r,
+        disabled: a,
+        display: l,
         buttonColor: n,
-        borderColor: Y,
-        textColor: z,
-        paddingX: W,
-        paddingY: u,
-        text: o,
-        borderRadius: I,
-        font: D,
-        fontSize: O,
+        borderColor: k,
+        textColor: u,
+        paddingX: Y,
+        paddingY: z,
+        borderRadius: W,
+        font: c,
+        fontSize: I,
         fontWeight: P
       };
-    }), S = t(() => l.value.disabled), $ = t(() => ({
-      display: l.value.display
-    })), h = t(() => {
-      const o = l.value;
+    }), v = t(() => r.value.disabled), $ = t(() => ({
+      display: r.value.display
+    })), B = t(() => {
+      const a = r.value;
       return {
-        border: `1px solid ${o.borderColor}`,
-        color: o.textColor,
-        padding: `${o.paddingY}rem ${o.paddingX}rem`,
-        borderRadius: _.value,
-        fontSize: o.fontSize,
-        fontWeight: o.fontWeight
+        border: `1px solid ${a.borderColor}`,
+        color: a.textColor,
+        padding: `${a.paddingY}rem ${a.paddingX}rem`,
+        borderRadius: x.value,
+        fontSize: a.fontSize,
+        fontWeight: a.fontWeight
       };
-    }), _ = t(() => `${l.value.borderRadius}rem`), f = t(() => l.value.font), i = t(() => l.value.textColor), k = t(() => l.value.buttonColor), a = () => {
-      d("clicked");
+    }), x = t(() => `${r.value.borderRadius}rem`), _ = t(() => r.value.font), o = t(() => r.value.textColor), H = t(() => r.value.buttonColor), d = () => {
+      s("clicked");
     };
-    return (o, H) => e.nbId ? (T(), L("div", {
+    return (a, l) => e.nbId ? (D(), O("div", {
       key: 0,
-      class: X(["nb-wrapper", S.value]),
-      style: B([$.value]),
-      onClick: a
+      class: X(["nb-wrapper", v.value]),
+      style: N([$.value]),
+      onClick: d
     }, [
       R("div", {
         id: e.nbId,
         class: X(["nb-reset", "component"]),
-        style: B([h.value])
-      }, Q(l.value.text), 13, Ye)
-    ], 6)) : A("", !0);
+        style: N([B.value])
+      }, [
+        T(a.$slots, "content", {}, () => [
+          A("Default Text")
+        ], !0)
+      ], 12, ke)
+    ], 6)) : L("", !0);
   }
-}), Re = /* @__PURE__ */ j(Xe, [["__scopeId", "data-v-34a3b3a9"]]);
-const ze = ["id"], We = /* @__PURE__ */ Object.assign({
+}), Xe = /* @__PURE__ */ j(Ye, [["__scopeId", "data-v-0201e93e"]]);
+const Re = ["id"], ze = /* @__PURE__ */ Object.assign({
   name: "NbButtonColorHover",
   inheritAttrs: !1
 }, {
@@ -1046,16 +1041,12 @@ const ze = ["id"], We = /* @__PURE__ */ Object.assign({
       type: String,
       required: !0
     },
-    text: {
-      type: String,
-      default: "Default Text"
-    },
     display: {
       type: String,
       default: "b",
       validator: (e = "b") => {
-        const d = e.toLowerCase();
-        return ["b", "ib"].includes(d);
+        const s = e.toLowerCase();
+        return ["b", "ib"].includes(s);
       }
     },
     textColor: {
@@ -1109,78 +1100,80 @@ const ze = ["id"], We = /* @__PURE__ */ Object.assign({
     }
   },
   emits: ["clicked"],
-  setup(e, { emit: d }) {
-    const N = e;
-    F((r) => ({
-      ea8f1624: f.value,
-      "68a00a02": a.value,
-      a1f5bb90: k.value,
-      "7c8ae57d": o.value,
-      "0ca91538": i.value
+  setup(e, { emit: s }) {
+    const w = e;
+    F((n) => ({
+      "70b0363a": _.value,
+      "2d562374": d.value,
+      "360329a3": H.value,
+      "3c24be28": a.value,
+      "7f8991ce": o.value
     }));
     const {
-      text: C,
-      display: b,
-      textColor: x,
-      paddingX: p,
-      paddingY: y,
-      borderRadius: v,
-      disabled: V,
+      display: V,
+      textColor: b,
+      paddingX: m,
+      paddingY: p,
+      borderRadius: y,
+      disabled: S,
       fontFamily: g,
-      fontSize: w,
-      fontWeight: s,
-      textColorHover: c,
-      buttonColor: m,
-      buttonColorHover: l
-    } = M(N), S = t(() => {
-      const r = C.value ? C.value : "Default Text", n = V.value ? "component-disabled" : "", Y = b.value !== "b" ? "inline-block" : "block", z = x ? x.value : "ffffff", W = !p.value || p.value < 0 ? 1 : p.value, u = !y.value || y.value < 0 ? 0.2 : y.value, I = !v.value || v.value < 0 ? 0 : v.value, D = g.value ? g.value : "'Lato', sans-serif", O = w.value ? w.value : "1.6rem", P = !s.value || s.value < 0 ? 100 : s.value, E = c.value ? c.value : "#cccccc", J = m.value ? m.value : "#bbbbbb", K = l.value ? l.value : "#959595";
+      fontSize: h,
+      fontWeight: C,
+      textColorHover: f,
+      buttonColor: i,
+      buttonColorHover: r
+    } = M(w), v = t(() => {
+      const n = S.value ? "component-disabled" : "", k = V.value !== "b" ? "inline-block" : "block", u = b ? b.value : "ffffff", Y = !m.value || m.value < 0 ? 1 : m.value, z = !p.value || p.value < 0 ? 0.2 : p.value, W = !y.value || y.value < 0 ? 0 : y.value, c = g.value ? g.value : "'Lato', sans-serif", I = h.value ? h.value : "1.6rem", P = !C.value || C.value < 0 ? 100 : C.value, q = f.value ? f.value : "#cccccc", G = i.value ? i.value : "#bbbbbb", E = r.value ? r.value : "#959595";
       return {
         disabled: n,
-        display: Y,
-        font: D,
-        fontSize: O,
+        display: k,
+        font: c,
+        fontSize: I,
         fontWeight: P,
-        text: r,
-        textColor: z,
-        paddingX: W,
-        paddingY: u,
-        borderRadius: I,
-        textColorHover: E,
-        buttonColor: J,
-        buttonColorHover: K
+        textColor: u,
+        paddingX: Y,
+        paddingY: z,
+        borderRadius: W,
+        textColorHover: q,
+        buttonColor: G,
+        buttonColorHover: E
       };
-    }), $ = t(() => S.value.disabled), h = t(() => {
-      const r = S.value;
+    }), $ = t(() => v.value.disabled), B = t(() => {
+      const n = v.value;
       return {
-        display: r.display,
-        borderRadius: `${r.borderRadius}rem`
+        display: n.display,
+        borderRadius: `${n.borderRadius}rem`
       };
-    }), _ = t(() => {
-      const r = S.value;
+    }), x = t(() => {
+      const n = v.value;
       return {
-        color: r.textColor,
-        padding: `${r.paddingY}rem ${r.paddingX}rem`,
-        borderRadius: `${r.borderRadius}rem`,
-        fontSize: r.fontSize,
-        fontWeight: r.fontWeight
+        color: n.textColor,
+        padding: `${n.paddingY}rem ${n.paddingX}rem`,
+        borderRadius: `${n.borderRadius}rem`,
+        fontSize: n.fontSize,
+        fontWeight: n.fontWeight
       };
-    }), f = t(() => S.value.font), i = t(() => S.value.textColor), k = t(() => S.value.textColorHover), a = t(() => S.value.buttonColor), o = t(() => S.value.buttonColorHover), H = () => {
-      d("clicked");
+    }), _ = t(() => v.value.font), o = t(() => v.value.textColor), H = t(() => v.value.textColorHover), d = t(() => v.value.buttonColor), a = t(() => v.value.buttonColorHover), l = () => {
+      s("clicked");
     };
-    return (r, n) => (T(), L("div", {
+    return (n, k) => (D(), O("div", {
       class: X(["nb-wrapper", $.value]),
-      style: B([h.value]),
-      onClick: H
+      style: N([B.value]),
+      onClick: l
     }, [
       R("div", {
         id: e.nbId,
         class: "nb-reset component component-transition",
-        style: B([_.value])
-      }, Q(S.value.text), 13, ze)
+        style: N([x.value])
+      }, [
+        T(n.$slots, "content", {}, () => [
+          A("Default Text")
+        ], !0)
+      ], 12, Re)
     ], 6));
   }
-}), Ie = /* @__PURE__ */ j(We, [["__scopeId", "data-v-14a4a2ac"]]);
-const De = ["id"], Oe = { class: "first-child" }, Te = { class: "last-child" }, Le = /* @__PURE__ */ Object.assign({
+}), We = /* @__PURE__ */ j(ze, [["__scopeId", "data-v-849fae4e"]]);
+const Ie = ["id"], De = { class: "first-child" }, Oe = { class: "last-child" }, Le = /* @__PURE__ */ Object.assign({
   name: "NbButtonAlternateText",
   inheritAttrs: !1
 }, {
@@ -1194,8 +1187,8 @@ const De = ["id"], Oe = { class: "first-child" }, Te = { class: "last-child" },
       type: String,
       default: "b",
       validator: (e = "b") => {
-        const d = e ? e.toLowerCase() : "";
-        return ["b", "ib"].includes(d);
+        const s = e ? e.toLowerCase() : "";
+        return ["b", "ib"].includes(s);
       }
     },
     textColor: {
@@ -1263,110 +1256,110 @@ const De = ["id"], Oe = { class: "first-child" }, Te = { class: "last-child" },
     }
   },
   emits: ["clicked"],
-  setup(e, { emit: d }) {
-    const N = e;
-    F((n) => ({
-      "17a23bbc": k.value,
-      "2cc4da9c": a.value,
-      aa259cd0: o.value,
-      f0e00666: H.value
+  setup(e, { emit: s }) {
+    const w = e;
+    F((u) => ({
+      70620026: d.value,
+      "2928e4ba": a.value,
+      "0fe93572": l.value,
+      "4dcaff7e": n.value
     }));
     const {
-      display: C,
+      display: V,
       buttonColor: b,
-      borderColor: x,
+      borderColor: m,
       buttonHoverColor: p,
       showBorder: y,
-      borderRadius: v,
-      textColor: V,
-      textHoverColor: g,
-      width: w,
-      paddingX: s,
-      paddingY: c,
-      disabled: m,
-      fontFamily: l,
-      fontSize: S,
-      fontWeight: $
-    } = M(N), h = t(() => {
-      const n = m.value ? "component-disabled" : "", Y = C.value !== "b" ? "inline-block" : "block", z = b.value ? b.value : "#ffffff", W = p.value ? p.value : "#000000", u = x.value ? x.value : "#ffe54c", I = !v.value || v.value < 0 ? 0 : v.value, D = [!1, !0].includes(y.value) ? y.value : !0, O = V.value ? V.value : "#ffffff", P = g.value ? g.value : "#000000", E = !w.value || w.value < 86 ? 86 : w.value, J = !s.value || s.value < 0 ? 1 : s.value, K = !c.value || c.value < 0 ? 0.4 : c.value, U = l.value ? l.value : "'Lato', sans-serif", Z = S.value ? S.value : "1.6em", ee = !$.value || $.value < 0 ? 200 : $.value;
+      borderRadius: S,
+      textColor: g,
+      textHoverColor: h,
+      width: C,
+      paddingX: f,
+      paddingY: i,
+      disabled: r,
+      fontFamily: v,
+      fontSize: $,
+      fontWeight: B
+    } = M(w), x = t(() => {
+      const u = r.value ? "component-disabled" : "", Y = V.value !== "b" ? "inline-block" : "block", z = b.value ? b.value : "#ffffff", W = p.value ? p.value : "#000000", c = m.value ? m.value : "#ffe54c", I = !S.value || S.value < 0 ? 0 : S.value, P = [!1, !0].includes(y.value) ? y.value : !0, q = g.value ? g.value : "#ffffff", G = h.value ? h.value : "#000000", E = !C.value || C.value < 86 ? 86 : C.value, J = !f.value || f.value < 0 ? 1 : f.value, K = !i.value || i.value < 0 ? 0.4 : i.value, Q = v.value ? v.value : "'Lato', sans-serif", U = $.value ? $.value : "1.6em", Z = !B.value || B.value < 0 ? 200 : B.value;
       return {
-        disabled: n,
+        disabled: u,
         display: Y,
         buttonColor: z,
         buttonHoverColor: W,
-        borderColor: u,
-        showBorder: D,
+        borderColor: c,
+        showBorder: P,
         borderRadius: I,
-        textColor: O,
-        textHoverColor: P,
+        textColor: q,
+        textHoverColor: G,
         width: E,
         paddingX: J,
         paddingY: K,
-        font: U,
-        fontSize: Z,
-        fontWeight: ee
+        font: Q,
+        fontSize: U,
+        fontWeight: Z
       };
-    }), _ = t(() => h.value.disabled), f = t(() => ({
-      display: h.value.display
-    })), i = t(() => {
-      const n = h.value, Y = n.display === "block" ? "auto" : `${n.width}px`;
+    }), _ = t(() => x.value.disabled), o = t(() => ({
+      display: x.value.display
+    })), H = t(() => {
+      const u = x.value, Y = u.display === "block" ? "auto" : `${u.width}px`;
       return {
-        ...n.showBorder ? { border: `1px solid ${n.borderColor}` } : {},
-        borderRadius: `${n.borderRadius}rem`,
-        background: n.buttonColor,
+        ...u.showBorder ? { border: `1px solid ${u.borderColor}` } : {},
+        borderRadius: `${u.borderRadius}rem`,
+        background: u.buttonColor,
         minWidth: "33px",
         width: Y,
-        padding: `${n.paddingY}rem ${n.paddingX}rem`,
+        padding: `${u.paddingY}rem ${u.paddingX}rem`,
         lineHeight: "1.42857143",
-        fontSize: n.fontSize,
-        fontWeight: n.fontWeight
+        fontSize: u.fontSize,
+        fontWeight: u.fontWeight
       };
-    }), k = t(() => h.value.font), a = t(() => h.value.textColor), o = t(() => h.value.textHoverColor), H = t(() => h.value.buttonHoverColor), r = () => {
-      d("clicked");
+    }), d = t(() => x.value.font), a = t(() => x.value.textColor), l = t(() => x.value.textHoverColor), n = t(() => x.value.buttonHoverColor), k = () => {
+      s("clicked");
     };
-    return (n, Y) => e.nbId ? (T(), L("div", {
+    return (u, Y) => e.nbId ? (D(), O("div", {
       key: 0,
       class: X(["nb-wrapper", _.value]),
-      style: B([f.value]),
-      onClick: r
+      style: N([o.value]),
+      onClick: k
     }, [
       R("div", {
         id: e.nbId,
         class: X(["nb-reset", "component"]),
-        style: B([i.value])
+        style: N([H.value])
       }, [
-        R("div", Oe, [
-          q(n.$slots, "content", {}, () => [
-            G("Default Text")
+        R("div", De, [
+          T(u.$slots, "content", {}, () => [
+            A("Default Text")
           ], !0)
         ]),
-        R("div", Te, [
-          q(n.$slots, "content-alternate", {}, () => [
-            G("Default Alternate Text")
+        R("div", Oe, [
+          T(u.$slots, "content", {}, () => [
+            A("Default Text")
           ], !0)
         ])
-      ], 12, De)
-    ], 6)) : A("", !0);
+      ], 12, Ie)
+    ], 6)) : L("", !0);
   }
-}), Ae = /* @__PURE__ */ j(Le, [["__scopeId", "data-v-e0ed856f"]]), te = {
-  NbButtonVavaGame: pe,
-  NbButtonShowHover: me,
-  NbButtonPrevNext: xe,
-  NbButtonMechanical: he,
-  NbButtonMechanical2: Be,
-  NbButtonHamburger: ke,
-  NbButtonColorOutside: Re,
-  NbButtonColorHover: Ie,
-  NbButtonAlternateText: Ae
-}, Fe = {
+}), Te = /* @__PURE__ */ j(Le, [["__scopeId", "data-v-fe71a891"]]), ee = {
+  NbButtonVavaGame: be,
+  NbButtonShowHover: ge,
+  NbButtonPrevNext: Ce,
+  NbButtonMechanical: _e,
+  NbButtonMechanical2: we,
+  NbButtonHamburger: He,
+  NbButtonColorOutside: Xe,
+  NbButtonColorHover: We,
+  NbButtonAlternateText: Te
+}, Pe = {
   install(e) {
-    for (const d in te)
-      if (Object.prototype.hasOwnProperty.call(te, d)) {
-        const N = te[d];
-        e.component(N.name, N);
+    for (const s in ee)
+      if (Object.prototype.hasOwnProperty.call(ee, s)) {
+        const w = ee[s];
+        e.component(w.name, w);
       }
   }
 };
 export {
-  Fe as default
+  Pe as default
 };