@vlalg-nimbus/nb-buttons 5.0.6 → 6.0.0

package/dist/nb-buttons.js

@@ -1,9 +1,9 @@
-import { useCssVars as xe, toRefs as Be, computed as t, openBlock as fe, createElementBlock as ve, mergeProps as Se, withKeys as W, withModifiers as L, unref as o, createElementVNode as de, normalizeClass as pe, normalizeStyle as se, renderSlot as he, createTextVNode as Ce, createCommentVNode as ye, onMounted as Ee, ref as Te, watch as yt, toDisplayString as We, nextTick as Oe, onUnmounted as mt, Fragment as ht, renderList as Ct } from "vue";
-const ke = (e, l) => {
-  const j = e.__vccOpts || e;
-  for (const [ae, Q] of l)
-    j[ae] = Q;
-  return j;
+import { useCssVars as Se, toRefs as xe, computed as t, openBlock as ce, createElementBlock as fe, mergeProps as Ce, withKeys as A, withModifiers as D, unref as n, createElementVNode as ne, normalizeClass as be, normalizeStyle as ie, renderSlot as me, createTextVNode as he, createCommentVNode as ge, onMounted as Ee, ref as Te, watch as yt, toDisplayString as Le, nextTick as Ae, onUnmounted as mt, Fragment as ht, renderList as Ct } from "vue";
+const Be = (e, l) => {
+  const E = e.__vccOpts || e;
+  for (const [te, U] of l)
+    E[te] = U;
+  return E;
 }, St = ["tabIndex"], xt = ["id"], Bt = { class: "component-content__text" }, kt = /* @__PURE__ */ Object.assign({
   name: "NbButtonVavaGame",
   inheritAttrs: !1
@@ -151,130 +151,130 @@ const ke = (e, l) => {
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((D) => ({
-      "45d3f656": I.value,
-      "731cf8ea": S.value,
-      "38923b1c": r.value,
-      "444f744b": n.value,
-      "15533dd5": P.value,
-      a26295f6: i.value,
-      "4bcd7f37": d.value,
-      d8896214: A.value,
-      "4b1873e6": oe.value,
-      "929f1152": J.value,
-      "212fb811": ie.value,
-      "611083ab": be.value,
-      "2fbce3b6": c.value,
-      "96e4fe7c": p.value
+    Se((v) => ({
+      "45d3f656": H.value,
+      "731cf8ea": h.value,
+      "38923b1c": d.value,
+      "444f744b": s.value,
+      "15533dd5": K.value,
+      a26295f6: o.value,
+      "4bcd7f37": r.value,
+      d8896214: ee.value,
+      "4b1873e6": re.value,
+      "929f1152": ue.value,
+      "212fb811": ve.value,
+      "611083ab": oe.value,
+      "2fbce3b6": k.value,
+      "96e4fe7c": T.value
     }));
-    const j = l, ae = e, {
-      display: Q,
-      ariaLabel: Z,
-      ariaAttrs: h,
-      theme: R,
-      lightTextColor: E,
-      lightTextColorHover: ee,
-      lightButtonColor: X,
-      lightButtonColorHover: K,
-      lightBorderColor: M,
+    const E = l, te = e, {
+      display: U,
+      ariaLabel: J,
+      ariaAttrs: g,
+      theme: O,
+      lightTextColor: F,
+      lightTextColorHover: G,
+      lightButtonColor: Y,
+      lightButtonColorHover: M,
+      lightBorderColor: Q,
       lightDisabledBgColor: q,
-      darkTextColor: te,
-      darkTextColorHover: O,
-      darkButtonColor: T,
-      darkButtonColorHover: C,
-      darkBorderColor: B,
-      darkDisabledBgColor: v,
-      uppercase: m,
-      paddingXContent: f,
+      darkTextColor: P,
+      darkTextColorHover: L,
+      darkButtonColor: S,
+      darkButtonColorHover: V,
+      darkBorderColor: y,
+      darkDisabledBgColor: c,
+      uppercase: f,
+      paddingXContent: m,
       paddingYContent: b,
-      paddingXBorder: u,
-      paddingYBorder: V,
-      borderOpacity: k,
-      disabled: N,
-      fontFamily: U,
-      fontSize: F,
-      fontWeight: w
-    } = Be(ae), $ = t(() => {
-      const D = N.value ? "component-disabled" : "", _ = Q.value !== "b" ? "inline-block" : "block", ue = !k.value || !(k.value >= 0 && k.value <= 1) ? "0.5" : k.value, ne = u.value !== 0 && !u.value || u.value < 0 ? 0.5 : u.value, me = V.value !== 0 && !V.value || V.value < 0 ? 0.5 : V.value, ge = f.value !== 0 && !f.value || f.value < 0 ? 0.5 : f.value, Ie = b.value !== 0 && !b.value || b.value < 0 ? 0.5 : b.value, _e = m.value ? "uppercase" : "none", De = U.value ? U.value : "'Lato', sans-serif", Ne = F.value ? F.value : "1.6em", Re = w.value !== 0 && !w.value || w.value < 0 ? 100 : w.value;
+      paddingXBorder: i,
+      paddingYBorder: x,
+      borderOpacity: B,
+      disabled: _,
+      fontFamily: Z,
+      fontSize: R,
+      fontWeight: I
+    } = xe(te), w = t(() => {
+      const v = _.value ? "component-disabled" : "", z = U.value !== "b" ? "inline-block" : "block", pe = !B.value || !(B.value >= 0 && B.value <= 1) ? "0.5" : B.value, ae = i.value !== 0 && !i.value || i.value < 0 ? 0.5 : i.value, Ve = x.value !== 0 && !x.value || x.value < 0 ? 0.5 : x.value, ye = m.value !== 0 && !m.value || m.value < 0 ? 0.5 : m.value, we = b.value !== 0 && !b.value || b.value < 0 ? 0.5 : b.value, _e = f.value ? "uppercase" : "none", Oe = Z.value ? Z.value : "'Lato', sans-serif", Re = R.value ? R.value : "1.6em", We = I.value !== 0 && !I.value || I.value < 0 ? 100 : I.value;
       return {
-        disabled: D,
-        display: _,
-        borderOpacity: ue,
-        paddingXBorder: ne,
-        paddingYBorder: me,
-        paddingXContent: ge,
-        paddingYContent: Ie,
+        disabled: v,
+        display: z,
+        borderOpacity: pe,
+        paddingXBorder: ae,
+        paddingYBorder: Ve,
+        paddingXContent: ye,
+        paddingYContent: we,
         uppercase: _e,
-        font: De,
-        fontSize: Ne,
-        fontWeight: Re
+        font: Oe,
+        fontSize: Re,
+        fontWeight: We
       };
-    }), z = t(() => $.value.disabled), G = t(() => ({
-      display: $.value.display
-    })), g = t(() => {
-      const D = $.value;
+    }), W = t(() => w.value.disabled), X = t(() => ({
+      display: w.value.display
+    })), u = t(() => {
+      const v = w.value;
       return {
-        padding: `${D.paddingYBorder}rem ${D.paddingXBorder}rem`,
-        fontSize: D.fontSize,
-        fontWeight: D.fontWeight
+        padding: `${v.paddingYBorder}rem ${v.paddingXBorder}rem`,
+        fontSize: v.fontSize,
+        fontWeight: v.fontWeight
       };
-    }), s = t(() => R.value === "dark" ? "component__theme--dark" : "component__theme--light"), H = t(() => {
-      const D = $.value;
+    }), $ = t(() => O.value === "dark" ? "component__theme--dark" : "component__theme--light"), j = t(() => {
+      const v = w.value;
       return {
-        textTransform: D.uppercase,
-        padding: `${D.paddingYContent}rem ${D.paddingXContent}rem`
+        textTransform: v.uppercase,
+        padding: `${v.paddingYContent}rem ${v.paddingXContent}rem`
       };
-    }), Y = t(() => ({})), I = t(() => $.value.font), P = t(() => $.value.borderOpacity), S = t(() => E.value), r = t(() => ee.value), i = t(() => X.value), d = t(() => K.value), n = t(() => M.value), c = t(() => q.value), A = t(() => te.value), oe = t(() => O.value), ie = t(() => T.value), be = t(() => C.value), J = t(() => B.value), p = t(() => v.value), y = t(() => {
-      const D = {};
-      h.value && Object.keys(h.value).forEach((ne) => D[`aria-${ne}`] = h.value[ne]);
-      const _ = {
-        "aria-label": Z.value,
-        "aria-disabled": N.value,
-        ...D
+    }), N = t(() => ({})), H = t(() => w.value.font), K = t(() => w.value.borderOpacity), h = t(() => F.value), d = t(() => G.value), o = t(() => Y.value), r = t(() => M.value), s = t(() => Q.value), k = t(() => q.value), ee = t(() => P.value), re = t(() => L.value), ve = t(() => S.value), oe = t(() => V.value), ue = t(() => y.value), T = t(() => c.value), p = t(() => {
+      const v = {};
+      g.value && Object.keys(g.value).forEach((ae) => v[`aria-${ae}`] = g.value[ae]);
+      const z = {
+        "aria-label": J.value,
+        "aria-disabled": _.value,
+        ...v
       };
       return Object.fromEntries(
-        Object.entries(_).filter(([ue, ne]) => ne != null)
+        Object.entries(z).filter(([pe, ae]) => ae != null)
       );
-    }), le = () => {
-      j("clicked");
+    }), de = () => {
+      E("clicked");
     };
-    return (D, _) => e.nbId ? (fe(), ve("div", Se({
+    return (v, z) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", z.value],
-      style: [G.value],
+      class: ["nb-wrapper", W.value],
+      style: [X.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, y.value, {
-      onClick: le,
+    }, p.value, {
+      onClick: de,
       onKeydown: [
-        _[0] || (_[0] = W(L((ue) => !o(N) && e.hasTabIndexEnter && le(), ["prevent"]), ["enter"])),
-        _[1] || (_[1] = W(L((ue) => !o(N) && e.hasTabIndexSpace && le(), ["prevent"]), ["space"]))
+        z[0] || (z[0] = A(D((pe) => !n(_) && e.hasTabIndexEnter && de(), ["prevent"]), ["enter"])),
+        z[1] || (z[1] = A(D((pe) => !n(_) && e.hasTabIndexSpace && de(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset", "component", s.value]),
-        style: se([g.value])
+        class: be(["nb-reset", "component", $.value]),
+        style: ie([u.value])
       }, [
-        de("div", {
+        ne("div", {
           class: "component-content",
-          style: se([H.value])
+          style: ie([j.value])
         }, [
-          de("span", Bt, [
-            he(D.$slots, "content", {}, () => [
-              _[2] || (_[2] = Ce("Default Text"))
+          ne("span", Bt, [
+            me(v.$slots, "content", {}, () => [
+              z[2] || (z[2] = he("Default Text"))
             ], !0)
           ]),
-          de("span", {
+          ne("span", {
             class: "component-content__mask",
-            style: se([Y.value])
+            style: ie([N.value])
           }, null, 4)
         ], 4)
       ], 14, xt)
-    ], 16, St)) : ye("", !0);
+    ], 16, St)) : ge("", !0);
   }
-}), Vt = /* @__PURE__ */ ke(kt, [["__scopeId", "data-v-cdb0df77"]]);
-const Tt = ["tabIndex"], wt = ["id"], $t = /* @__PURE__ */ Object.assign({
+}), Vt = /* @__PURE__ */ Be(kt, [["__scopeId", "data-v-cdb0df77"]]);
+const Tt = ["tabIndex"], It = ["id"], $t = /* @__PURE__ */ Object.assign({
   name: "NbButtonShowHover",
   inheritAttrs: !1
 }, {
@@ -395,108 +395,108 @@ const Tt = ["tabIndex"], wt = ["id"], $t = /* @__PURE__ */ Object.assign({
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((r) => ({
-      "764d74ba": I.value,
-      "45cf85fd": z.value,
-      a495d4c0: $.value,
-      "2848a6c4": g.value,
-      a7feed82: G.value,
-      ba6d58fa: s.value,
-      bc089304: Y.value,
-      "38c83f79": H.value
+    Se((d) => ({
+      "764d74ba": H.value,
+      "45cf85fd": W.value,
+      a495d4c0: w.value,
+      "2848a6c4": u.value,
+      a7feed82: X.value,
+      ba6d58fa: $.value,
+      bc089304: N.value,
+      "38c83f79": j.value
     }));
-    const j = l, ae = e, {
-      ariaLabel: Q,
-      ariaAttrs: Z,
-      theme: h,
-      lightTextColor: R,
-      lightTextColorHover: E,
-      lightButtonColorHover: ee,
-      lightButtonColorOpacityHover: X,
-      lightDisabledBgColor: K,
-      darkTextColor: M,
+    const E = l, te = e, {
+      ariaLabel: U,
+      ariaAttrs: J,
+      theme: g,
+      lightTextColor: O,
+      lightTextColorHover: F,
+      lightButtonColorHover: G,
+      lightButtonColorOpacityHover: Y,
+      lightDisabledBgColor: M,
+      darkTextColor: Q,
       darkTextColorHover: q,
-      darkButtonColorHover: te,
-      darkButtonColorOpacityHover: O,
-      darkDisabledBgColor: T,
-      paddingX: C,
-      paddingY: B,
-      disabled: v,
-      borderRadius: m,
-      verticalAlign: f,
+      darkButtonColorHover: P,
+      darkButtonColorOpacityHover: L,
+      darkDisabledBgColor: S,
+      paddingX: V,
+      paddingY: y,
+      disabled: c,
+      borderRadius: f,
+      verticalAlign: m,
       fontFamily: b,
-      fontSize: u,
-      fontWeight: V
-    } = Be(ae), k = t(() => {
-      const r = v.value ? "component-disabled" : "", i = f.value ? f.value : "middle", d = C.value !== 0 && !C.value || C.value < 0 ? 1 : C.value, n = B.value !== 0 && !B.value || B.value < 0 ? 0.2 : B.value, c = m.value !== 0 && !m.value || m.value < 0 ? 0 : m.value, A = b.value ? b.value : "'Lato', sans-serif", oe = u.value ? u.value : "1.6rem", ie = V.value !== 0 && !V.value || V.value < 0 ? 100 : V.value;
+      fontSize: i,
+      fontWeight: x
+    } = xe(te), B = t(() => {
+      const d = c.value ? "component-disabled" : "", o = m.value ? m.value : "middle", r = V.value !== 0 && !V.value || V.value < 0 ? 1 : V.value, s = y.value !== 0 && !y.value || y.value < 0 ? 0.2 : y.value, k = f.value !== 0 && !f.value || f.value < 0 ? 0 : f.value, ee = b.value ? b.value : "'Lato', sans-serif", re = i.value ? i.value : "1.6rem", ve = x.value !== 0 && !x.value || x.value < 0 ? 100 : x.value;
       return {
-        disabled: r,
-        borderRadius: c,
-        paddingX: d,
-        paddingY: n,
-        font: A,
-        fontSize: oe,
-        fontWeight: ie,
-        verticalAlign: i
+        disabled: d,
+        borderRadius: k,
+        paddingX: r,
+        paddingY: s,
+        font: ee,
+        fontSize: re,
+        fontWeight: ve,
+        verticalAlign: o
       };
-    }), N = t(() => k.value.disabled), U = t(() => ({
-      verticalAlign: k.value.verticalAlign
-    })), F = t(() => h.value === "dark" ? "component__theme--dark" : "component__theme--light"), w = t(() => {
-      const r = k.value;
+    }), _ = t(() => B.value.disabled), Z = t(() => ({
+      verticalAlign: B.value.verticalAlign
+    })), R = t(() => g.value === "dark" ? "component__theme--dark" : "component__theme--light"), I = t(() => {
+      const d = B.value;
       return {
-        padding: `${r.paddingY}rem 0`,
-        borderRadius: `${r.borderRadius}rem`,
-        fontSize: r.fontSize,
-        fontWeight: r.fontWeight
+        padding: `${d.paddingY}rem 0`,
+        borderRadius: `${d.borderRadius}rem`,
+        fontSize: d.fontSize,
+        fontWeight: d.fontWeight
       };
-    }), $ = t(() => {
-      const r = k.value;
-      return `${r.paddingY}rem ${r.paddingX}rem`;
-    }), z = t(() => R.value), G = t(() => E.value), g = t(() => `rgba(${ee.value}, ${X.value})`);
-    t(() => K.value);
-    const s = t(() => M.value), H = t(() => q.value), Y = t(() => `rgba(${te.value}, ${O.value})`);
-    t(() => T.value);
-    const I = t(() => k.value.font), P = t(() => {
-      const r = {};
-      Z.value && Object.keys(Z.value).forEach((n) => r[`aria-${n}`] = Z.value[n]);
-      const i = {
-        "aria-label": Q.value,
-        "aria-disabled": v.value,
-        ...r
+    }), w = t(() => {
+      const d = B.value;
+      return `${d.paddingY}rem ${d.paddingX}rem`;
+    }), W = t(() => O.value), X = t(() => F.value), u = t(() => `rgba(${G.value}, ${Y.value})`);
+    t(() => M.value);
+    const $ = t(() => Q.value), j = t(() => q.value), N = t(() => `rgba(${P.value}, ${L.value})`);
+    t(() => S.value);
+    const H = t(() => B.value.font), K = t(() => {
+      const d = {};
+      J.value && Object.keys(J.value).forEach((s) => d[`aria-${s}`] = J.value[s]);
+      const o = {
+        "aria-label": U.value,
+        "aria-disabled": c.value,
+        ...d
       };
       return Object.fromEntries(
-        Object.entries(i).filter(([d, n]) => n != null)
+        Object.entries(o).filter(([r, s]) => s != null)
       );
-    }), S = () => {
-      j("clicked");
+    }), h = () => {
+      E("clicked");
     };
-    return (r, i) => e.nbId ? (fe(), ve("div", Se({
+    return (d, o) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", N.value],
-      style: [U.value],
+      class: ["nb-wrapper", _.value],
+      style: [Z.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, P.value, {
-      onClick: S,
+    }, K.value, {
+      onClick: h,
       onKeydown: [
-        i[1] || (i[1] = W(L((d) => !o(v) && e.hasTabIndexEnter && S(), ["prevent"]), ["enter"])),
-        i[2] || (i[2] = W(L((d) => !o(v) && e.hasTabIndexSpace && S(), ["prevent"]), ["space"]))
+        o[1] || (o[1] = A(D((r) => !n(c) && e.hasTabIndexEnter && h(), ["prevent"]), ["enter"])),
+        o[2] || (o[2] = A(D((r) => !n(c) && e.hasTabIndexSpace && h(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("a", {
+      ne("a", {
         id: e.nbId,
-        class: pe(["nb-reset component tertiary", [F.value]]),
-        style: se([w.value]),
-        onClick: i[0] || (i[0] = L(() => {
+        class: be(["nb-reset component tertiary", [R.value]]),
+        style: ie([I.value]),
+        onClick: o[0] || (o[0] = D(() => {
         }, ["prevent"]))
       }, [
-        he(r.$slots, "content", {}, () => [
-          i[3] || (i[3] = Ce("Default Text"))
+        me(d.$slots, "content", {}, () => [
+          o[3] || (o[3] = he("Default Text"))
         ], !0)
-      ], 14, wt)
-    ], 16, Tt)) : ye("", !0);
+      ], 14, It)
+    ], 16, Tt)) : ge("", !0);
   }
-}), It = /* @__PURE__ */ ke($t, [["__scopeId", "data-v-9f86c7ed"]]);
+}), wt = /* @__PURE__ */ Be($t, [["__scopeId", "data-v-9f86c7ed"]]);
 const _t = ["id"], Dt = ["tabIndex"], Nt = ["tabIndex"], Ht = /* @__PURE__ */ Object.assign({
   name: "NbButtonPrevNext",
   inheritAttrs: !1
@@ -651,156 +651,156 @@ const _t = ["id"], Dt = ["tabIndex"], Nt = ["tabIndex"], Ht = /* @__PURE__ */ Ob
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((p) => ({
-      "21ad11ea": oe.value,
-      "0a9f5140": P.value,
-      "7f8d50d6": r.value,
-      "4d0adb52": S.value,
-      "191c12b2": i.value,
-      "58fb0f6c": d.value,
-      "0192eeeb": c.value,
-      "39d869bc": n.value,
-      "3f80f5de": A.value
+    Se((T) => ({
+      "21ad11ea": re.value,
+      "0a9f5140": K.value,
+      "7f8d50d6": d.value,
+      "4d0adb52": h.value,
+      "191c12b2": o.value,
+      "58fb0f6c": r.value,
+      "0192eeeb": k.value,
+      "39d869bc": s.value,
+      "3f80f5de": ee.value
     }));
-    const j = l, ae = e, {
-      ariaLabelPrev: Q,
-      ariaAttrsPrev: Z,
-      ariaLabelNext: h,
-      ariaAttrsNext: R,
-      theme: E,
-      lightColorPrimary: ee,
-      lightColorSecondary: X,
-      lightTextColor: K,
-      lightTextColorHover: M,
+    const E = l, te = e, {
+      ariaLabelPrev: U,
+      ariaAttrsPrev: J,
+      ariaLabelNext: g,
+      ariaAttrsNext: O,
+      theme: F,
+      lightColorPrimary: G,
+      lightColorSecondary: Y,
+      lightTextColor: M,
+      lightTextColorHover: Q,
       lightDisabledBgColor: q,
-      darkColorPrimary: te,
-      darkColorSecondary: O,
-      darkTextColor: T,
-      darkTextColorHover: C,
-      darkDisabledBgColor: B,
-      paddingX: v,
-      paddingY: m,
-      marginBetween: f,
+      darkColorPrimary: P,
+      darkColorSecondary: L,
+      darkTextColor: S,
+      darkTextColorHover: V,
+      darkDisabledBgColor: y,
+      paddingX: c,
+      paddingY: f,
+      marginBetween: m,
       borderRadius: b,
-      disabled: u,
-      disabledPreview: V,
-      disabledNext: k,
-      fontFamily: N,
-      fontSize: U,
-      fontWeight: F
-    } = Be(ae), w = t(() => {
-      const p = u.value ? "component-disabled" : "", y = V.value ? "component-disabled" : "", le = k.value ? "component-disabled" : "", D = f.value !== 0 && !f.value || f.value < 0 ? 0 : f.value, _ = b.value !== 0 && !b.value || b.value < 0 ? 0 : b.value, ue = v.value !== 0 && !v.value || v.value < 0 ? 1 : v.value, ne = m.value !== 0 && !m.value || m.value < 0 ? 10 : m.value, me = U.value ? U.value : "1.6em", ge = F.value !== 0 && !F.value || F.value < 0 ? 100 : F.value;
+      disabled: i,
+      disabledPreview: x,
+      disabledNext: B,
+      fontFamily: _,
+      fontSize: Z,
+      fontWeight: R
+    } = xe(te), I = t(() => {
+      const T = i.value ? "component-disabled" : "", p = x.value ? "component-disabled" : "", de = B.value ? "component-disabled" : "", v = m.value !== 0 && !m.value || m.value < 0 ? 0 : m.value, z = b.value !== 0 && !b.value || b.value < 0 ? 0 : b.value, pe = c.value !== 0 && !c.value || c.value < 0 ? 1 : c.value, ae = f.value !== 0 && !f.value || f.value < 0 ? 10 : f.value, Ve = Z.value ? Z.value : "1.6em", ye = R.value !== 0 && !R.value || R.value < 0 ? 100 : R.value;
       return {
-        disabled: p,
-        disabledPreview: y,
-        disabledNext: le,
-        marginBetween: `${D}px`,
-        borderRadius: `${_}px`,
-        paddingX: `${ue}px`,
-        paddingY: `${ne}px`,
-        fontSize: me,
-        fontWeight: ge
+        disabled: T,
+        disabledPreview: p,
+        disabledNext: de,
+        marginBetween: `${v}px`,
+        borderRadius: `${z}px`,
+        paddingX: `${pe}px`,
+        paddingY: `${ae}px`,
+        fontSize: Ve,
+        fontWeight: ye
       };
-    }), $ = t(() => w.value.disabled), z = t(() => w.value.disabledPreview), G = t(() => w.value.disabledNext), g = t(() => ({
-      display: w.value.display
-    })), s = t(() => {
-      const p = w.value;
+    }), w = t(() => I.value.disabled), W = t(() => I.value.disabledPreview), X = t(() => I.value.disabledNext), u = t(() => ({
+      display: I.value.display
+    })), $ = t(() => {
+      const T = I.value;
       return {
-        fontSize: p.fontSize,
-        fontWeight: p.fontWeight
+        fontSize: T.fontSize,
+        fontWeight: T.fontWeight
       };
-    }), H = t(() => {
-      const p = w.value;
+    }), j = t(() => {
+      const T = I.value;
       return {
-        borderRadius: `${p.borderRadius} 0px 0px ${p.borderRadius}`,
-        marginRight: p.marginBetween,
-        padding: `${p.paddingX} ${p.paddingY}`
+        borderRadius: `${T.borderRadius} 0px 0px ${T.borderRadius}`,
+        marginRight: T.marginBetween,
+        padding: `${T.paddingX} ${T.paddingY}`
       };
-    }), Y = t(() => {
-      const p = w.value;
+    }), N = t(() => {
+      const T = I.value;
       return {
-        borderRadius: `0px ${p.borderRadius} ${p.borderRadius} 0px`,
-        marginLeft: p.marginBetween,
-        padding: `${p.paddingX} ${p.paddingY}`
+        borderRadius: `0px ${T.borderRadius} ${T.borderRadius} 0px`,
+        marginLeft: T.marginBetween,
+        padding: `${T.paddingX} ${T.paddingY}`
       };
-    }), I = t(() => E.value === "dark" ? "component__theme--dark" : "component__theme--light"), P = t(() => ee.value), S = t(() => X.value), r = t(() => K.value), i = t(() => M.value);
+    }), H = t(() => F.value === "dark" ? "component__theme--dark" : "component__theme--light"), K = t(() => G.value), h = t(() => Y.value), d = t(() => M.value), o = t(() => Q.value);
     t(() => q.value);
-    const d = t(() => te.value), n = t(() => O.value), c = t(() => T.value), A = t(() => C.value);
-    t(() => B.value);
-    const oe = t(() => `'${N.value ? N.value : "'Lato', sans-serif"}'`), ie = t(() => {
-      const p = {};
-      Z.value && Object.keys(Z.value).forEach((D) => p[`aria-${D}`] = Z.value[D]);
-      const y = {
-        "aria-label": Q.value,
-        "aria-disabled": z.value,
-        ...p
+    const r = t(() => P.value), s = t(() => L.value), k = t(() => S.value), ee = t(() => V.value);
+    t(() => y.value);
+    const re = t(() => `'${_.value ? _.value : "'Lato', sans-serif"}'`), ve = t(() => {
+      const T = {};
+      J.value && Object.keys(J.value).forEach((v) => T[`aria-${v}`] = J.value[v]);
+      const p = {
+        "aria-label": U.value,
+        "aria-disabled": W.value,
+        ...T
       };
       return Object.fromEntries(
-        Object.entries(y).filter(([le, D]) => D != null)
+        Object.entries(p).filter(([de, v]) => v != null)
       );
-    }), be = t(() => {
-      const p = {};
-      R.value && Object.keys(R.value).forEach((D) => p[`aria-${D}`] = R.value[D]);
-      const y = {
-        "aria-label": h.value,
-        "aria-disabled": G.value,
-        ...p
+    }), oe = t(() => {
+      const T = {};
+      O.value && Object.keys(O.value).forEach((v) => T[`aria-${v}`] = O.value[v]);
+      const p = {
+        "aria-label": g.value,
+        "aria-disabled": X.value,
+        ...T
       };
       return Object.fromEntries(
-        Object.entries(y).filter(([le, D]) => D != null)
+        Object.entries(p).filter(([de, v]) => v != null)
       );
-    }), J = (p) => {
-      j("clicked", p);
+    }), ue = (T) => {
+      E("clicked", T);
     };
-    return (p, y) => e.nbId ? (fe(), ve("div", {
+    return (T, p) => e.nbId ? (ce(), fe("div", {
       key: 0,
-      class: pe(["nb-wrapper", $.value]),
-      style: se([g.value])
+      class: be(["nb-wrapper", w.value]),
+      style: ie([u.value])
     }, [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset", "component", I.value]),
-        style: se(s.value)
+        class: be(["nb-reset", "component", H.value]),
+        style: ie($.value)
       }, [
-        e.showPreview ? (fe(), ve("div", Se({
+        e.showPreview ? (ce(), fe("div", Ce({
           key: 0,
-          class: ["buttonNextPreview buttonPreview", z.value],
-          style: H.value,
+          class: ["buttonNextPreview buttonPreview", W.value],
+          style: j.value,
           tabIndex: e.tabIndexPrev,
           role: "button"
-        }, ie.value, {
-          onClick: y[0] || (y[0] = (le) => J("preview")),
+        }, ve.value, {
+          onClick: p[0] || (p[0] = (de) => ue("preview")),
           onKeydown: [
-            y[1] || (y[1] = W(L((le) => !o(u) && e.hasTabIndexEnter && J("preview"), ["prevent"]), ["enter"])),
-            y[2] || (y[2] = W(L((le) => !o(u) && e.hasTabIndexSpace && J("preview"), ["prevent"]), ["space"]))
+            p[1] || (p[1] = A(D((de) => !n(i) && e.hasTabIndexEnter && ue("preview"), ["prevent"]), ["enter"])),
+            p[2] || (p[2] = A(D((de) => !n(i) && e.hasTabIndexSpace && ue("preview"), ["prevent"]), ["space"]))
           ]
         }), [
-          he(p.$slots, "prev", {}, () => [
-            y[6] || (y[6] = Ce("← Preview"))
+          me(T.$slots, "prev", {}, () => [
+            p[6] || (p[6] = he("← Preview"))
           ], !0)
-        ], 16, Dt)) : ye("", !0),
-        e.showNext ? (fe(), ve("div", Se({
+        ], 16, Dt)) : ge("", !0),
+        e.showNext ? (ce(), fe("div", Ce({
           key: 1,
-          class: ["buttonNextPreview buttonNext", G.value],
-          style: Y.value,
+          class: ["buttonNextPreview buttonNext", X.value],
+          style: N.value,
           tabIndex: e.tabIndexNext,
           role: "button"
-        }, be.value, {
-          onClick: y[3] || (y[3] = (le) => J("next")),
+        }, oe.value, {
+          onClick: p[3] || (p[3] = (de) => ue("next")),
           onKeydown: [
-            y[4] || (y[4] = W(L((le) => !o(u) && e.hasTabIndexEnter && J("next"), ["prevent"]), ["enter"])),
-            y[5] || (y[5] = W(L((le) => !o(u) && e.hasTabIndexSpace && J("next"), ["prevent"]), ["space"]))
+            p[4] || (p[4] = A(D((de) => !n(i) && e.hasTabIndexEnter && ue("next"), ["prevent"]), ["enter"])),
+            p[5] || (p[5] = A(D((de) => !n(i) && e.hasTabIndexSpace && ue("next"), ["prevent"]), ["space"]))
           ]
         }), [
-          he(p.$slots, "next", {}, () => [
-            y[7] || (y[7] = Ce("Next →"))
+          me(T.$slots, "next", {}, () => [
+            p[7] || (p[7] = he("Next →"))
           ], !0)
-        ], 16, Nt)) : ye("", !0)
+        ], 16, Nt)) : ge("", !0)
       ], 14, _t)
-    ], 6)) : ye("", !0);
+    ], 6)) : ge("", !0);
   }
-}), At = /* @__PURE__ */ ke(Ht, [["__scopeId", "data-v-4c99460e"]]);
-const Lt = ["tabIndex"], Ot = ["id"], Wt = /* @__PURE__ */ Object.assign({
+}), At = /* @__PURE__ */ Be(Ht, [["__scopeId", "data-v-4c99460e"]]);
+const Lt = ["tabIndex"], Ot = ["id"], Rt = /* @__PURE__ */ Object.assign({
   name: "NbButtonMechanical",
   inheritAttrs: !1
 }, {
@@ -920,102 +920,102 @@ const Lt = ["tabIndex"], Ot = ["id"], Wt = /* @__PURE__ */ Object.assign({
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((S) => ({
-      "11f48348": $.value,
-      "70882b98": g.value,
-      "588d6424": z.value,
-      "0c5d8c82": G.value,
-      "6d039e48": Y.value,
-      "6153947c": s.value,
-      "2c6697d2": H.value
+    Se((h) => ({
+      "11f48348": w.value,
+      "70882b98": u.value,
+      "588d6424": W.value,
+      "0c5d8c82": X.value,
+      "6d039e48": N.value,
+      "6153947c": $.value,
+      "2c6697d2": j.value
     }));
-    const j = l, ae = e, {
-      display: Q,
-      ariaLabel: Z,
-      ariaAttrs: h,
-      theme: R,
-      lightTextColor: E,
-      lightButtonColor: ee,
-      lightContainerColor: X,
-      lightDisabledBgColor: K,
-      darkTextColor: M,
+    const E = l, te = e, {
+      display: U,
+      ariaLabel: J,
+      ariaAttrs: g,
+      theme: O,
+      lightTextColor: F,
+      lightButtonColor: G,
+      lightContainerColor: Y,
+      lightDisabledBgColor: M,
+      darkTextColor: Q,
       darkButtonColor: q,
-      darkContainerColor: te,
-      darkDisabledBgColor: O,
-      paddingX: T,
-      paddingY: C,
-      borderRadius: B,
-      disabled: v,
-      animationSlow: m,
-      fontFamily: f,
+      darkContainerColor: P,
+      darkDisabledBgColor: L,
+      paddingX: S,
+      paddingY: V,
+      borderRadius: y,
+      disabled: c,
+      animationSlow: f,
+      fontFamily: m,
       fontSize: b,
-      fontWeight: u
-    } = Be(ae), V = t(() => {
-      const S = v.value ? "component-disabled" : "", r = Q.value !== "b" ? "inline-block" : "block", i = T.value !== 0 && !T.value || T.value < 0 ? 1 : T.value, d = C.value !== 0 && !C.value || C.value < 0 ? 0.2 : C.value, n = B.value !== 0 && !B.value || B.value < 0 ? 0 : B.value, c = m.value ? "" : "component-transition__no-slow", A = f.value ? f.value : "'Lato', sans-serif", oe = b.value ? b.value : "1.6em", ie = u.value !== 0 && !u.value || u.value < 0 ? 100 : u.value;
+      fontWeight: i
+    } = xe(te), x = t(() => {
+      const h = c.value ? "component-disabled" : "", d = U.value !== "b" ? "inline-block" : "block", o = S.value !== 0 && !S.value || S.value < 0 ? 1 : S.value, r = V.value !== 0 && !V.value || V.value < 0 ? 0.2 : V.value, s = y.value !== 0 && !y.value || y.value < 0 ? 0 : y.value, k = f.value ? "" : "component-transition__no-slow", ee = m.value ? m.value : "'Lato', sans-serif", re = b.value ? b.value : "1.6em", ve = i.value !== 0 && !i.value || i.value < 0 ? 100 : i.value;
       return {
-        disabled: S,
-        display: r,
-        paddingX: i,
-        paddingY: d,
-        borderRadius: n,
-        animationSlow: c,
-        font: A,
-        fontSize: oe,
-        fontWeight: ie
+        disabled: h,
+        display: d,
+        paddingX: o,
+        paddingY: r,
+        borderRadius: s,
+        animationSlow: k,
+        font: ee,
+        fontSize: re,
+        fontWeight: ve
       };
-    }), k = t(() => V.value.disabled), N = t(() => ({
-      display: V.value.display
-    })), U = t(() => R.value === "dark" ? "component__theme--dark" : "component__theme--light"), F = t(() => {
-      const S = V.value;
+    }), B = t(() => x.value.disabled), _ = t(() => ({
+      display: x.value.display
+    })), Z = t(() => O.value === "dark" ? "component__theme--dark" : "component__theme--light"), R = t(() => {
+      const h = x.value;
       return {
-        padding: `${S.paddingY}rem ${S.paddingX}rem`,
-        borderRadius: `${S.borderRadius}rem`,
-        fontSize: S.fontSize,
-        fontWeight: S.fontWeight
+        padding: `${h.paddingY}rem ${h.paddingX}rem`,
+        borderRadius: `${h.borderRadius}rem`,
+        fontSize: h.fontSize,
+        fontWeight: h.fontWeight
       };
-    }), w = t(() => V.value.animationSlow), $ = t(() => V.value.font), z = t(() => E.value), G = t(() => ee.value), g = t(() => X.value);
-    t(() => K.value);
-    const s = t(() => M.value), H = t(() => q.value), Y = t(() => te.value);
-    t(() => O.value);
-    const I = t(() => {
-      const S = {};
-      h.value && Object.keys(h.value).forEach((d) => S[`aria-${d}`] = h.value[d]);
-      const r = {
-        "aria-label": Z.value,
-        "aria-disabled": v.value,
-        ...S
+    }), I = t(() => x.value.animationSlow), w = t(() => x.value.font), W = t(() => F.value), X = t(() => G.value), u = t(() => Y.value);
+    t(() => M.value);
+    const $ = t(() => Q.value), j = t(() => q.value), N = t(() => P.value);
+    t(() => L.value);
+    const H = t(() => {
+      const h = {};
+      g.value && Object.keys(g.value).forEach((r) => h[`aria-${r}`] = g.value[r]);
+      const d = {
+        "aria-label": J.value,
+        "aria-disabled": c.value,
+        ...h
       };
       return Object.fromEntries(
-        Object.entries(r).filter(([i, d]) => d != null)
+        Object.entries(d).filter(([o, r]) => r != null)
       );
-    }), P = () => {
-      j("clicked");
+    }), K = () => {
+      E("clicked");
     };
-    return (S, r) => e.nbId ? (fe(), ve("div", Se({
+    return (h, d) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", k.value],
-      style: [N.value],
+      class: ["nb-wrapper", B.value],
+      style: [_.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, I.value, {
-      onClick: P,
+    }, H.value, {
+      onClick: K,
       onKeydown: [
-        r[0] || (r[0] = W(L((i) => !o(v) && e.hasTabIndexEnter && P(), ["prevent"]), ["enter"])),
-        r[1] || (r[1] = W(L((i) => !o(v) && e.hasTabIndexSpace && P(), ["prevent"]), ["space"]))
+        d[0] || (d[0] = A(D((o) => !n(c) && e.hasTabIndexEnter && K(), ["prevent"]), ["enter"])),
+        d[1] || (d[1] = A(D((o) => !n(c) && e.hasTabIndexSpace && K(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset", "component", "component-transition", w.value, U.value]),
-        style: se([F.value])
+        class: be(["nb-reset", "component", "component-transition", I.value, Z.value]),
+        style: ie([R.value])
       }, [
-        he(S.$slots, "content", {}, () => [
-          r[2] || (r[2] = Ce("Default Text"))
+        me(h.$slots, "content", {}, () => [
+          d[2] || (d[2] = he("Default Text"))
         ], !0)
       ], 14, Ot)
-    ], 16, Lt)) : ye("", !0);
+    ], 16, Lt)) : ge("", !0);
   }
-}), Rt = /* @__PURE__ */ ke(Wt, [["__scopeId", "data-v-6b8bbb23"]]);
+}), Wt = /* @__PURE__ */ Be(Rt, [["__scopeId", "data-v-6b8bbb23"]]);
 const zt = ["tabIndex"], Yt = ["id"], Xt = /* @__PURE__ */ Object.assign({
   name: "NbButtonMechanical2",
   inheritAttrs: !1
@@ -1132,100 +1132,100 @@ const zt = ["tabIndex"], Yt = ["id"], Xt = /* @__PURE__ */ Object.assign({
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((I) => ({
-      ebbdb8f2: s.value,
-      "3c1ba399": F.value,
-      "32cd6ff4": w.value,
-      "3e7722c6": $.value,
-      dc15db32: z.value,
-      78066342: G.value,
-      f89fd3d8: g.value
+    Se((H) => ({
+      ebbdb8f2: $.value,
+      "3c1ba399": R.value,
+      "32cd6ff4": I.value,
+      "3e7722c6": w.value,
+      dc15db32: W.value,
+      78066342: X.value,
+      f89fd3d8: u.value
     }));
-    const j = l, ae = e, {
-      display: Q,
-      ariaLabel: Z,
-      ariaAttrs: h,
-      theme: R,
-      lightTextColor: E,
-      lightButtonColor: ee,
-      lightShadowColor: X,
-      lightDisabledBgColor: K,
-      darkTextColor: M,
+    const E = l, te = e, {
+      display: U,
+      ariaLabel: J,
+      ariaAttrs: g,
+      theme: O,
+      lightTextColor: F,
+      lightButtonColor: G,
+      lightShadowColor: Y,
+      lightDisabledBgColor: M,
+      darkTextColor: Q,
       darkButtonColor: q,
-      darkShadowColor: te,
-      darkDisabledBgColor: O,
-      paddingX: T,
-      paddingY: C,
-      borderRadius: B,
-      disabled: v,
-      fontFamily: m,
-      fontSize: f,
+      darkShadowColor: P,
+      darkDisabledBgColor: L,
+      paddingX: S,
+      paddingY: V,
+      borderRadius: y,
+      disabled: c,
+      fontFamily: f,
+      fontSize: m,
       fontWeight: b
-    } = Be(ae), u = t(() => {
-      const I = v.value ? "component-disabled" : "", P = Q.value !== "b" ? "inline-block" : "block", S = T.value !== 0 && !T.value || T.value < 0 ? 1 : T.value, r = C.value !== 0 && !C.value || C.value < 0 ? 1 : C.value, i = B.value !== 0 && !B.value || B.value < 0 ? 0 : B.value, d = m.value ? m.value : "'Lato', sans-serif", n = f.value ? f.value : "1.6em", c = b.value !== 0 && !b.value || b.value < 0 ? 100 : b.value;
+    } = xe(te), i = t(() => {
+      const H = c.value ? "component-disabled" : "", K = U.value !== "b" ? "inline-block" : "block", h = S.value !== 0 && !S.value || S.value < 0 ? 1 : S.value, d = V.value !== 0 && !V.value || V.value < 0 ? 1 : V.value, o = y.value !== 0 && !y.value || y.value < 0 ? 0 : y.value, r = f.value ? f.value : "'Lato', sans-serif", s = m.value ? m.value : "1.6em", k = b.value !== 0 && !b.value || b.value < 0 ? 100 : b.value;
       return {
-        disabled: I,
-        display: P,
-        paddingX: S,
-        paddingY: r,
-        borderRadius: i,
-        font: d,
-        fontSize: n,
-        fontWeight: c
+        disabled: H,
+        display: K,
+        paddingX: h,
+        paddingY: d,
+        borderRadius: o,
+        font: r,
+        fontSize: s,
+        fontWeight: k
       };
-    }), V = t(() => u.value.disabled), k = t(() => ({
-      display: u.value.display
-    })), N = t(() => R.value === "dark" ? "component__theme--dark" : "component__theme--light"), U = t(() => {
-      const I = u.value;
+    }), x = t(() => i.value.disabled), B = t(() => ({
+      display: i.value.display
+    })), _ = t(() => O.value === "dark" ? "component__theme--dark" : "component__theme--light"), Z = t(() => {
+      const H = i.value;
       return {
-        padding: `${I.paddingY}rem ${I.paddingX}rem`,
-        borderRadius: `${I.borderRadius}rem`,
-        fontSize: I.fontSize,
-        fontWeight: I.fontWeight
+        padding: `${H.paddingY}rem ${H.paddingX}rem`,
+        borderRadius: `${H.borderRadius}rem`,
+        fontSize: H.fontSize,
+        fontWeight: H.fontWeight
       };
-    }), F = t(() => E.value), w = t(() => ee.value), $ = t(() => X.value);
-    t(() => K.value);
-    const z = t(() => M.value), G = t(() => q.value), g = t(() => te.value);
-    t(() => O.value);
-    const s = t(() => u.value.font), H = t(() => {
-      const I = {};
-      h.value && Object.keys(h.value).forEach((r) => I[`aria-${r}`] = h.value[r]);
-      const P = {
-        "aria-label": Z.value,
-        "aria-disabled": v.value,
-        ...I
+    }), R = t(() => F.value), I = t(() => G.value), w = t(() => Y.value);
+    t(() => M.value);
+    const W = t(() => Q.value), X = t(() => q.value), u = t(() => P.value);
+    t(() => L.value);
+    const $ = t(() => i.value.font), j = t(() => {
+      const H = {};
+      g.value && Object.keys(g.value).forEach((d) => H[`aria-${d}`] = g.value[d]);
+      const K = {
+        "aria-label": J.value,
+        "aria-disabled": c.value,
+        ...H
       };
       return Object.fromEntries(
-        Object.entries(P).filter(([S, r]) => r != null)
+        Object.entries(K).filter(([h, d]) => d != null)
       );
-    }), Y = () => {
-      j("clicked");
+    }), N = () => {
+      E("clicked");
     };
-    return (I, P) => e.nbId ? (fe(), ve("div", Se({
+    return (H, K) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", V.value],
-      style: [k.value],
+      class: ["nb-wrapper", x.value],
+      style: [B.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, H.value, {
-      onClick: Y,
+    }, j.value, {
+      onClick: N,
       onKeydown: [
-        P[0] || (P[0] = W(L((S) => !o(v) && e.hasTabIndexEnter && Y(), ["prevent"]), ["enter"])),
-        P[1] || (P[1] = W(L((S) => !o(v) && e.hasTabIndexSpace && Y(), ["prevent"]), ["space"]))
+        K[0] || (K[0] = A(D((h) => !n(c) && e.hasTabIndexEnter && N(), ["prevent"]), ["enter"])),
+        K[1] || (K[1] = A(D((h) => !n(c) && e.hasTabIndexSpace && N(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset", "component", "component-transition", N.value]),
-        style: se([U.value])
+        class: be(["nb-reset", "component", "component-transition", _.value]),
+        style: ie([Z.value])
       }, [
-        he(I.$slots, "content", {}, () => [
-          P[2] || (P[2] = Ce("Default Text"))
+        me(H.$slots, "content", {}, () => [
+          K[2] || (K[2] = he("Default Text"))
         ], !0)
       ], 14, Yt)
-    ], 16, zt)) : ye("", !0);
+    ], 16, zt)) : ge("", !0);
   }
-}), jt = /* @__PURE__ */ ke(Xt, [["__scopeId", "data-v-56612ee8"]]);
+}), jt = /* @__PURE__ */ Be(Xt, [["__scopeId", "data-v-56612ee8"]]);
 const Et = ["tabIndex"], Ft = ["id"], Pt = /* @__PURE__ */ Object.assign({
   name: "NbButtonHamburger",
   inheritAttrs: !1
@@ -1329,103 +1329,103 @@ const Et = ["tabIndex"], Ft = ["id"], Pt = /* @__PURE__ */ Object.assign({
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((r) => ({
-      e49369fc: $.value,
-      "016d7e4e": H.value,
-      d1d5c14c: z.value,
-      "3ee44f39": w.value,
-      "66961b8e": Y.value,
-      b51deef6: s.value,
-      "3bd26bc3": F.value,
-      ca9bda12: g.value,
-      "716c3462": G.value,
-      "749b6a96": I.value
+    Se((d) => ({
+      e49369fc: w.value,
+      "016d7e4e": j.value,
+      d1d5c14c: W.value,
+      "3ee44f39": I.value,
+      "66961b8e": N.value,
+      b51deef6: $.value,
+      "3bd26bc3": R.value,
+      ca9bda12: u.value,
+      "716c3462": X.value,
+      "749b6a96": H.value
     }));
-    const j = l, ae = e;
+    const E = l, te = e;
     Ee(() => {
-      Q.value = E.value;
+      U.value = F.value;
     });
-    const Q = Te(!1), {
-      ariaLabel: Z,
-      ariaAttrs: h,
-      theme: R,
-      status: E,
-      lightColor: ee,
-      lightColorHover: X,
-      lightContainerColor: K,
-      lightContainerColorHover: M,
+    const U = Te(!1), {
+      ariaLabel: J,
+      ariaAttrs: g,
+      theme: O,
+      status: F,
+      lightColor: G,
+      lightColorHover: Y,
+      lightContainerColor: M,
+      lightContainerColorHover: Q,
       lightDisabledBgColor: q,
-      darkColor: te,
-      darkColorHover: O,
-      darkContainerColor: T,
-      darkContainerColorHover: C,
-      darkDisabledBgColor: B,
-      paddingX: v,
-      paddingY: m,
-      disabled: f
-    } = Be(ae), b = t(() => {
-      const r = f.value ? "component-disabled" : "", i = Q.value ? "change" : "", d = v.value !== 0 && !v.value || v.value < 0 ? 3 : v.value, n = m.value !== 0 && !m.value || m.value < 0 ? 3 : m.value;
+      darkColor: P,
+      darkColorHover: L,
+      darkContainerColor: S,
+      darkContainerColorHover: V,
+      darkDisabledBgColor: y,
+      paddingX: c,
+      paddingY: f,
+      disabled: m
+    } = xe(te), b = t(() => {
+      const d = m.value ? "component-disabled" : "", o = U.value ? "change" : "", r = c.value !== 0 && !c.value || c.value < 0 ? 3 : c.value, s = f.value !== 0 && !f.value || f.value < 0 ? 3 : f.value;
       return {
-        disabled: r,
-        buttonStatus: i,
-        paddingX: d,
-        paddingY: n
+        disabled: d,
+        buttonStatus: o,
+        paddingX: r,
+        paddingY: s
       };
-    }), u = t(() => b.value.disabled), V = t(() => R.value === "dark" ? "component__theme--dark" : "component__theme--light"), k = t(() => {
-      const r = b.value;
+    }), i = t(() => b.value.disabled), x = t(() => O.value === "dark" ? "component__theme--dark" : "component__theme--light"), B = t(() => {
+      const d = b.value;
       return {
-        padding: `${r.paddingY}px ${r.paddingX}px`
+        padding: `${d.paddingY}px ${d.paddingX}px`
       };
-    }), N = t(() => ({})), U = t(() => b.value.buttonStatus), F = t(() => ee.value), w = t(() => X.value), $ = t(() => K.value), z = t(() => M.value), G = t(() => q.value), g = t(() => te.value), s = t(() => O.value), H = t(() => T.value), Y = t(() => C.value), I = t(() => B.value), P = t(() => {
-      const r = {};
-      h.value && Object.keys(h.value).forEach((n) => r[`aria-${n}`] = h.value[n]);
-      const i = {
-        "aria-label": Z.value,
-        "aria-disabled": f.value,
-        ...r
+    }), _ = t(() => ({})), Z = t(() => b.value.buttonStatus), R = t(() => G.value), I = t(() => Y.value), w = t(() => M.value), W = t(() => Q.value), X = t(() => q.value), u = t(() => P.value), $ = t(() => L.value), j = t(() => S.value), N = t(() => V.value), H = t(() => y.value), K = t(() => {
+      const d = {};
+      g.value && Object.keys(g.value).forEach((s) => d[`aria-${s}`] = g.value[s]);
+      const o = {
+        "aria-label": J.value,
+        "aria-disabled": m.value,
+        ...d
       };
       return Object.fromEntries(
-        Object.entries(i).filter(([d, n]) => n != null)
+        Object.entries(o).filter(([r, s]) => s != null)
       );
-    }), S = () => {
-      const r = !Q.value;
-      Q.value = r, j("clicked", r);
+    }), h = () => {
+      const d = !U.value;
+      U.value = d, E("clicked", d);
     };
-    return yt(E, () => {
-      Q.value = E.value;
-    }), (r, i) => e.nbId ? (fe(), ve("div", Se({
+    return yt(F, () => {
+      U.value = F.value;
+    }), (d, o) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", u.value],
-      style: [k.value],
+      class: ["nb-wrapper", i.value],
+      style: [B.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, P.value, {
-      onClick: S,
+    }, K.value, {
+      onClick: h,
       onKeydown: [
-        i[0] || (i[0] = W(L((d) => !o(f) && e.hasTabIndexEnter && S(), ["prevent"]), ["enter"])),
-        i[1] || (i[1] = W(L((d) => !o(f) && e.hasTabIndexSpace && S(), ["prevent"]), ["space"]))
+        o[0] || (o[0] = A(D((r) => !n(m) && e.hasTabIndexEnter && h(), ["prevent"]), ["enter"])),
+        o[1] || (o[1] = A(D((r) => !n(m) && e.hasTabIndexSpace && h(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset", "component", U.value, V.value])
+        class: be(["nb-reset", "component", Z.value, x.value])
       }, [
-        de("div", {
+        ne("div", {
           class: "component__line-one",
-          style: se(N.value)
+          style: ie(_.value)
         }, null, 4),
-        de("div", {
+        ne("div", {
           class: "component__line-two",
-          style: se(N.value)
+          style: ie(_.value)
         }, null, 4),
-        de("div", {
+        ne("div", {
           class: "component__line-three",
-          style: se(N.value)
+          style: ie(_.value)
         }, null, 4)
       ], 10, Ft)
-    ], 16, Et)) : ye("", !0);
+    ], 16, Et)) : ge("", !0);
   }
-}), Kt = /* @__PURE__ */ ke(Pt, [["__scopeId", "data-v-bfc7656d"]]);
+}), Kt = /* @__PURE__ */ Be(Pt, [["__scopeId", "data-v-bfc7656d"]]);
 const Mt = ["tabIndex"], qt = ["id"], Ut = /* @__PURE__ */ Object.assign({
   name: "NbButtonColorOutside",
   inheritAttrs: !1
@@ -1542,109 +1542,109 @@ const Mt = ["tabIndex"], qt = ["id"], Ut = /* @__PURE__ */ Object.assign({
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((i) => ({
-      "6d1b36a9": w.value,
-      "65506e61": F.value,
-      e28eaf92: z.value,
-      "3086f750": g.value,
-      "523bc512": G.value,
-      "2113fbee": H.value,
-      "0e8ab1aa": I.value,
-      "7909f264": Y.value,
-      "36d92543": s.value,
-      "75674cd6": P.value
+    Se((o) => ({
+      "6d1b36a9": I.value,
+      "65506e61": R.value,
+      e28eaf92: W.value,
+      "3086f750": u.value,
+      "523bc512": X.value,
+      "2113fbee": j.value,
+      "0e8ab1aa": H.value,
+      "7909f264": N.value,
+      "36d92543": $.value,
+      "75674cd6": K.value
     }));
-    const j = l, ae = e, {
-      display: Q,
-      ariaLabel: Z,
-      ariaAttrs: h,
-      theme: R,
-      lightTextColor: E,
-      lightButtonColor: ee,
-      lightBorderColor: X,
-      lightDisabledBgColor: K,
-      darkTextColor: M,
+    const E = l, te = e, {
+      display: U,
+      ariaLabel: J,
+      ariaAttrs: g,
+      theme: O,
+      lightTextColor: F,
+      lightButtonColor: G,
+      lightBorderColor: Y,
+      lightDisabledBgColor: M,
+      darkTextColor: Q,
       darkButtonColor: q,
-      darkBorderColor: te,
-      darkDisabledBgColor: O,
-      paddingX: T,
-      paddingY: C,
-      borderRadius: B,
-      disabled: v,
-      fontFamily: m,
-      fontSize: f,
+      darkBorderColor: P,
+      darkDisabledBgColor: L,
+      paddingX: S,
+      paddingY: V,
+      borderRadius: y,
+      disabled: c,
+      fontFamily: f,
+      fontSize: m,
       fontWeight: b
-    } = Be(ae), u = t(() => {
-      const i = v.value ? "component-disabled" : "", d = Q.value !== "b" ? "inline-block" : "block", n = T.value !== 0 && !T.value || T.value < 0 ? 1 : T.value, c = C.value !== 0 && !C.value || C.value < 0 ? 0.2 : C.value, A = B.value !== 0 && !B.value || B.value < 0 ? 0 : B.value, oe = m.value ? m.value : "'Lato', sans-serif", ie = f.value ? f.value : "1.6em", be = b.value !== 0 && !b.value || b.value < 0 ? 200 : b.value;
+    } = xe(te), i = t(() => {
+      const o = c.value ? "component-disabled" : "", r = U.value !== "b" ? "inline-block" : "block", s = S.value !== 0 && !S.value || S.value < 0 ? 1 : S.value, k = V.value !== 0 && !V.value || V.value < 0 ? 0.2 : V.value, ee = y.value !== 0 && !y.value || y.value < 0 ? 0 : y.value, re = f.value ? f.value : "'Lato', sans-serif", ve = m.value ? m.value : "1.6em", oe = b.value !== 0 && !b.value || b.value < 0 ? 200 : b.value;
       return {
-        disabled: i,
-        display: d,
-        paddingX: n,
-        paddingY: c,
-        borderRadius: A,
-        font: oe,
-        fontSize: ie,
-        fontWeight: be
+        disabled: o,
+        display: r,
+        paddingX: s,
+        paddingY: k,
+        borderRadius: ee,
+        font: re,
+        fontSize: ve,
+        fontWeight: oe
       };
-    }), V = t(() => u.value.disabled), k = t(() => ({
-      display: u.value.display
-    })), N = t(() => {
-      const i = u.value;
+    }), x = t(() => i.value.disabled), B = t(() => ({
+      display: i.value.display
+    })), _ = t(() => {
+      const o = i.value;
       return {
-        fontSize: i.fontSize,
-        fontWeight: i.fontWeight
+        fontSize: o.fontSize,
+        fontWeight: o.fontWeight
       };
-    }), U = t(() => {
-      const i = u.value;
+    }), Z = t(() => {
+      const o = i.value;
       return {
-        padding: `${i.paddingY}rem ${i.paddingX}rem`,
-        borderRadius: F.value
+        padding: `${o.paddingY}rem ${o.paddingX}rem`,
+        borderRadius: R.value
       };
-    }), F = t(() => `${u.value.borderRadius}rem`), w = t(() => u.value.font), $ = t(() => R.value === "dark" ? "component__theme--dark" : "component__theme--light"), z = t(() => E.value), G = t(() => ee.value), g = t(() => X.value), s = t(() => K.value), H = t(() => M.value), Y = t(() => q.value), I = t(() => te.value), P = t(() => O.value), S = t(() => {
-      const i = {};
-      h.value && Object.keys(h.value).forEach((c) => i[`aria-${c}`] = h.value[c]);
-      const d = {
-        "aria-label": Z.value,
-        "aria-disabled": v.value,
-        ...i
+    }), R = t(() => `${i.value.borderRadius}rem`), I = t(() => i.value.font), w = t(() => O.value === "dark" ? "component__theme--dark" : "component__theme--light"), W = t(() => F.value), X = t(() => G.value), u = t(() => Y.value), $ = t(() => M.value), j = t(() => Q.value), N = t(() => q.value), H = t(() => P.value), K = t(() => L.value), h = t(() => {
+      const o = {};
+      g.value && Object.keys(g.value).forEach((k) => o[`aria-${k}`] = g.value[k]);
+      const r = {
+        "aria-label": J.value,
+        "aria-disabled": c.value,
+        ...o
       };
       return Object.fromEntries(
-        Object.entries(d).filter(([n, c]) => c != null)
+        Object.entries(r).filter(([s, k]) => k != null)
       );
-    }), r = () => {
-      j("clicked");
+    }), d = () => {
+      E("clicked");
     };
-    return (i, d) => e.nbId ? (fe(), ve("div", Se({
+    return (o, r) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", V.value],
-      style: [k.value],
+      class: ["nb-wrapper", x.value],
+      style: [B.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, S.value, {
-      onClick: r,
+    }, h.value, {
+      onClick: d,
       onKeydown: [
-        d[0] || (d[0] = W(L((n) => !o(v) && e.hasTabIndexEnter && r(), ["prevent"]), ["enter"])),
-        d[1] || (d[1] = W(L((n) => !o(v) && e.hasTabIndexSpace && r(), ["prevent"]), ["space"]))
+        r[0] || (r[0] = A(D((s) => !n(c) && e.hasTabIndexEnter && d(), ["prevent"]), ["enter"])),
+        r[1] || (r[1] = A(D((s) => !n(c) && e.hasTabIndexSpace && d(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset", "component", $.value]),
-        style: se([N.value])
+        class: be(["nb-reset", "component", w.value]),
+        style: ie([_.value])
       }, [
-        de("div", {
+        ne("div", {
           class: "component-content",
-          style: se([U.value])
+          style: ie([Z.value])
         }, [
-          he(i.$slots, "content", {}, () => [
-            d[2] || (d[2] = Ce("Default Text"))
+          me(o.$slots, "content", {}, () => [
+            r[2] || (r[2] = he("Default Text"))
           ], !0)
         ], 4),
-        d[3] || (d[3] = de("div", { class: "component-shadow" }, null, -1))
+        r[3] || (r[3] = ne("div", { class: "component-shadow" }, null, -1))
       ], 14, qt)
-    ], 16, Mt)) : ye("", !0);
+    ], 16, Mt)) : ge("", !0);
   }
-}), Gt = /* @__PURE__ */ ke(Ut, [["__scopeId", "data-v-da1579ab"]]);
+}), Gt = /* @__PURE__ */ Be(Ut, [["__scopeId", "data-v-da1579ab"]]);
 const Jt = ["tabIndex"], Qt = ["id"], Zt = /* @__PURE__ */ Object.assign({
   name: "NbButtonColorHover",
   inheritAttrs: !1
@@ -1766,114 +1766,114 @@ const Jt = ["tabIndex"], Qt = ["id"], Zt = /* @__PURE__ */ Object.assign({
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((g) => ({
-      "33f9338a": w.value,
-      "69aa72f4": o(b),
-      "37e5d48f": o(m),
-      "3d961ea8": o(u),
-      aa62f426: o(f),
-      "5b1254ac": o(C),
-      "6edc2847": o(O),
-      "40ee8ff0": o(B),
-      "39cfc535": o(T),
-      "11c52e40": o(V),
-      "797ae5f8": o(v)
+    Se((u) => ({
+      "33f9338a": I.value,
+      "69aa72f4": n(b),
+      "37e5d48f": n(f),
+      "3d961ea8": n(i),
+      aa62f426: n(m),
+      "5b1254ac": n(V),
+      "6edc2847": n(L),
+      "40ee8ff0": n(y),
+      "39cfc535": n(S),
+      "11c52e40": n(x),
+      "797ae5f8": n(c)
     }));
-    const j = l, ae = e, {
-      display: Q,
-      ariaLabel: Z,
-      ariaAttrs: h,
-      paddingX: R,
-      paddingY: E,
-      borderRadius: ee,
-      disabled: X,
-      fontFamily: K,
-      fontSize: M,
+    const E = l, te = e, {
+      display: U,
+      ariaLabel: J,
+      ariaAttrs: g,
+      paddingX: O,
+      paddingY: F,
+      borderRadius: G,
+      disabled: Y,
+      fontFamily: M,
+      fontSize: Q,
       fontWeight: q,
-      theme: te,
-      lightButtonColor: O,
-      lightButtonColorHover: T,
-      lightTextColor: C,
-      lightTextColorHover: B,
-      lightDisabledBgColor: v,
-      darkButtonColor: m,
-      darkButtonColorHover: f,
+      theme: P,
+      lightButtonColor: L,
+      lightButtonColorHover: S,
+      lightTextColor: V,
+      lightTextColorHover: y,
+      lightDisabledBgColor: c,
+      darkButtonColor: f,
+      darkButtonColorHover: m,
       darkTextColor: b,
-      darkTextColorHover: u,
-      darkDisabledBgColor: V
-    } = Be(ae), k = t(() => {
-      const g = X.value ? "component-disabled" : "", s = Q.value !== "b" ? "inline-block" : "block", H = R.value !== 0 && !R.value || R.value < 0 ? 1 : R.value, Y = E.value !== 0 && !E.value || E.value < 0 ? 0.2 : E.value, I = ee.value !== 0 && !ee.value || ee.value < 0 ? 0 : ee.value, P = K.value ? K.value : "'Lato', sans-serif", S = M.value ? M.value : "1.6rem", r = q.value !== 0 && !q.value || q.value < 0 ? 100 : q.value, i = te.value ? te.value : "light";
+      darkTextColorHover: i,
+      darkDisabledBgColor: x
+    } = xe(te), B = t(() => {
+      const u = Y.value ? "component-disabled" : "", $ = U.value !== "b" ? "inline-block" : "block", j = O.value !== 0 && !O.value || O.value < 0 ? 1 : O.value, N = F.value !== 0 && !F.value || F.value < 0 ? 0.2 : F.value, H = G.value !== 0 && !G.value || G.value < 0 ? 0 : G.value, K = M.value ? M.value : "'Lato', sans-serif", h = Q.value ? Q.value : "1.6rem", d = q.value !== 0 && !q.value || q.value < 0 ? 100 : q.value, o = P.value ? P.value : "light";
       return {
-        disabled: g,
-        display: s,
-        font: P,
-        fontSize: S,
-        fontWeight: r,
-        paddingX: H,
-        paddingY: Y,
-        borderRadius: I,
-        theme: i
+        disabled: u,
+        display: $,
+        font: K,
+        fontSize: h,
+        fontWeight: d,
+        paddingX: j,
+        paddingY: N,
+        borderRadius: H,
+        theme: o
       };
-    }), N = t(() => k.value.disabled), U = t(() => {
-      const g = k.value;
+    }), _ = t(() => B.value.disabled), Z = t(() => {
+      const u = B.value;
       return {
-        display: g.display,
-        borderRadius: `${g.borderRadius}rem`
+        display: u.display,
+        borderRadius: `${u.borderRadius}rem`
       };
-    }), F = t(() => {
-      const g = k.value;
+    }), R = t(() => {
+      const u = B.value;
       return {
-        padding: `${g.paddingY}rem ${g.paddingX}rem`,
-        borderRadius: `${g.borderRadius}rem`,
-        fontSize: g.fontSize,
-        fontWeight: g.fontWeight
+        padding: `${u.paddingY}rem ${u.paddingX}rem`,
+        borderRadius: `${u.borderRadius}rem`,
+        fontSize: u.fontSize,
+        fontWeight: u.fontWeight
       };
-    }), w = t(() => k.value.font), $ = t(() => {
-      switch (k.value.theme) {
+    }), I = t(() => B.value.font), w = t(() => {
+      switch (B.value.theme) {
         case "dark":
           return "component__theme--dark";
         default:
           return "component__theme--light";
       }
-    }), z = t(() => {
-      const g = {};
-      h.value && Object.keys(h.value).forEach((Y) => g[`aria-${Y}`] = h.value[Y]);
-      const s = {
-        "aria-label": Z.value,
-        "aria-disabled": X.value,
-        ...g
+    }), W = t(() => {
+      const u = {};
+      g.value && Object.keys(g.value).forEach((N) => u[`aria-${N}`] = g.value[N]);
+      const $ = {
+        "aria-label": J.value,
+        "aria-disabled": Y.value,
+        ...u
       };
       return Object.fromEntries(
-        Object.entries(s).filter(([H, Y]) => Y != null)
+        Object.entries($).filter(([j, N]) => N != null)
       );
-    }), G = () => {
-      j("clicked");
+    }), X = () => {
+      E("clicked");
     };
-    return (g, s) => e.nbId ? (fe(), ve("div", Se({
+    return (u, $) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", N.value],
-      style: [U.value],
+      class: ["nb-wrapper", _.value],
+      style: [Z.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, z.value, {
-      onClick: G,
+    }, W.value, {
+      onClick: X,
       onKeydown: [
-        s[0] || (s[0] = W(L((H) => !o(X) && e.hasTabIndexEnter && G(), ["prevent"]), ["enter"])),
-        s[1] || (s[1] = W(L((H) => !o(X) && e.hasTabIndexSpace && G(), ["prevent"]), ["space"]))
+        $[0] || ($[0] = A(D((j) => !n(Y) && e.hasTabIndexEnter && X(), ["prevent"]), ["enter"])),
+        $[1] || ($[1] = A(D((j) => !n(Y) && e.hasTabIndexSpace && X(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset component component-transition", [$.value]]),
-        style: se([F.value])
+        class: be(["nb-reset component component-transition", [w.value]]),
+        style: ie([R.value])
       }, [
-        he(g.$slots, "content", {}, () => [
-          s[2] || (s[2] = Ce("Default Text"))
+        me(u.$slots, "content", {}, () => [
+          $[2] || ($[2] = he("Default Text"))
         ], !0)
       ], 14, Qt)
-    ], 16, Jt)) : ye("", !0);
+    ], 16, Jt)) : ge("", !0);
   }
-}), ea = /* @__PURE__ */ ke(Zt, [["__scopeId", "data-v-3023dc70"]]);
+}), ea = /* @__PURE__ */ Be(Zt, [["__scopeId", "data-v-3023dc70"]]);
 const ta = ["tabIndex"], aa = ["id"], la = { class: "first-child" }, oa = { class: "last-child" }, na = /* @__PURE__ */ Object.assign({
   name: "NbButtonAlternateText",
   inheritAttrs: !1
@@ -1979,11 +1979,6 @@ const ta = ["tabIndex"], aa = ["id"], la = { class: "first-child" }, oa = { clas
       type: Number,
       default: 0.375
     },
-    width: {
-      type: Number,
-      default: 86,
-      validator: (e) => e || 86
-    },
     paddingX: {
       type: Number,
       default: 1,
@@ -2016,120 +2011,116 @@ const ta = ["tabIndex"], aa = ["id"], la = { class: "first-child" }, oa = { clas
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((J) => ({
-      "60c258fb": g.value,
-      cf915e00: I.value,
-      "2db81046": S.value,
-      cf3b50b6: H.value,
-      "2f92fed2": Y.value,
-      "2ede281c": P.value,
-      b6d39e94: n.value,
-      "3a16effc": A.value,
-      "417ca64a": i.value,
-      "7cc9fd21": d.value,
-      "26f6abb4": c.value,
-      "899deb9e": r.value,
-      "8de5c232": oe.value
+    Se((oe) => ({
+      a6ea190a: X.value,
+      60670680: N.value,
+      14307474: K.value,
+      "67fd25b6": $.value,
+      "5fae49d2": j.value,
+      "38b83ac8": H.value,
+      "364c6994": r.value,
+      "7a5a8a7c": k.value,
+      "4eac314a": d.value,
+      "103b5abe": o.value,
+      "02dd9fa6": s.value,
+      "5cec009e": h.value,
+      be010d32: ee.value
     }));
-    const j = l, ae = e, {
-      display: Q,
-      ariaLabel: Z,
-      ariaAttrs: h,
-      theme: R,
-      lightTextColor: E,
-      lightTextColorHover: ee,
-      lightButtonColor: X,
-      lightButtonColorHover: K,
-      lightBorderColor: M,
+    const E = l, te = e, {
+      display: U,
+      ariaLabel: J,
+      ariaAttrs: g,
+      theme: O,
+      lightTextColor: F,
+      lightTextColorHover: G,
+      lightButtonColor: Y,
+      lightButtonColorHover: M,
+      lightBorderColor: Q,
       lightDisabledBgColor: q,
-      darkTextColor: te,
-      darkTextColorHover: O,
-      darkButtonColor: T,
-      darkButtonColorHover: C,
-      darkBorderColor: B,
-      darkDisabledBgColor: v,
-      showBorder: m,
-      borderRadius: f,
-      width: b,
-      paddingX: u,
-      paddingY: V,
-      disabled: k,
-      fontFamily: N,
-      fontSize: U,
-      fontWeight: F
-    } = Be(ae), w = t(() => {
-      const J = k.value ? "component-disabled" : "", p = Q.value !== "b" ? "inline-block" : "block", y = f.value !== 0 && !f.value || f.value < 0 ? 0 : f.value, le = [!1, !0].includes(m.value) ? m.value : !0, D = !b.value || b.value < 86 ? 86 : b.value, _ = u.value !== 0 && !u.value || u.value < 0 ? 1 : u.value, ue = V.value !== 0 && !V.value || V.value < 0 ? 0.4 : V.value, ne = N.value ? N.value : "'Lato', sans-serif", me = U.value ? U.value : "1.6em", ge = F.value !== 0 && !F.value || F.value < 0 ? 200 : F.value;
+      darkTextColor: P,
+      darkTextColorHover: L,
+      darkButtonColor: S,
+      darkButtonColorHover: V,
+      darkBorderColor: y,
+      darkDisabledBgColor: c,
+      showBorder: f,
+      borderRadius: m,
+      paddingX: b,
+      paddingY: i,
+      disabled: x,
+      fontFamily: B,
+      fontSize: _,
+      fontWeight: Z
+    } = xe(te), R = t(() => {
+      const oe = x.value ? "component-disabled" : "", ue = U.value !== "b" ? "inline-block" : "block", T = m.value !== 0 && !m.value || m.value < 0 ? 0 : m.value, p = [!1, !0].includes(f.value) ? f.value : !0, de = b.value !== 0 && !b.value || b.value < 0 ? 1 : b.value, v = i.value !== 0 && !i.value || i.value < 0 ? 0.4 : i.value, z = B.value ? B.value : "'Lato', sans-serif", pe = _.value ? _.value : "1.6em", ae = Z.value !== 0 && !Z.value || Z.value < 0 ? 200 : Z.value;
       return {
-        disabled: J,
-        display: p,
-        showBorder: le,
-        borderRadius: y,
-        width: D,
-        paddingX: _,
-        paddingY: ue,
-        font: ne,
-        fontSize: me,
-        fontWeight: ge
+        disabled: oe,
+        display: ue,
+        showBorder: p,
+        borderRadius: T,
+        paddingX: de,
+        paddingY: v,
+        font: z,
+        fontSize: pe,
+        fontWeight: ae
       };
-    }), $ = t(() => w.value.disabled), z = t(() => ({
-      display: w.value.display
-    })), G = t(() => {
-      const J = w.value, p = J.display === "block" ? "auto" : `${J.width}px`;
+    }), I = t(() => R.value.disabled), w = t(() => ({
+      display: R.value.display
+    })), W = t(() => {
+      const oe = R.value;
       return {
-        borderRadius: `${J.borderRadius}rem`,
-        minWidth: "33px",
-        width: p,
-        padding: `${J.paddingY}rem ${J.paddingX}rem`,
+        borderRadius: `${oe.borderRadius}rem`,
+        padding: `${oe.paddingY}rem ${oe.paddingX}rem`,
         lineHeight: "1.42857143",
-        fontSize: J.fontSize,
-        fontWeight: J.fontWeight
+        fontSize: oe.fontSize,
+        fontWeight: oe.fontWeight
       };
-    }), g = t(() => w.value.font), s = t(() => R.value === "dark" ? "component__theme--dark" : "component__theme--light"), H = t(() => E.value), Y = t(() => ee.value), I = t(() => X.value), P = t(() => K.value), S = t(() => M.value), r = t(() => q.value), i = t(() => te.value), d = t(() => O.value), n = t(() => T.value), c = t(() => C.value), A = t(() => B.value), oe = t(() => v.value), ie = t(() => {
-      const J = {};
-      h.value && Object.keys(h.value).forEach((le) => J[`aria-${le}`] = h.value[le]);
-      const p = {
-        "aria-label": Z.value,
-        "aria-disabled": k.value,
-        ...J
+    }), X = t(() => R.value.font), u = t(() => O.value === "dark" ? "component__theme--dark" : "component__theme--light"), $ = t(() => F.value), j = t(() => G.value), N = t(() => Y.value), H = t(() => M.value), K = t(() => Q.value), h = t(() => q.value), d = t(() => P.value), o = t(() => L.value), r = t(() => S.value), s = t(() => V.value), k = t(() => y.value), ee = t(() => c.value), re = t(() => {
+      const oe = {};
+      g.value && Object.keys(g.value).forEach((p) => oe[`aria-${p}`] = g.value[p]);
+      const ue = {
+        "aria-label": J.value,
+        "aria-disabled": x.value,
+        ...oe
       };
       return Object.fromEntries(
-        Object.entries(p).filter(([y, le]) => le != null)
+        Object.entries(ue).filter(([T, p]) => p != null)
       );
-    }), be = () => {
-      j("clicked");
+    }), ve = () => {
+      E("clicked");
     };
-    return (J, p) => e.nbId ? (fe(), ve("div", Se({
+    return (oe, ue) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", $.value],
-      style: [z.value],
+      class: ["nb-wrapper", I.value],
+      style: [w.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, ie.value, {
-      onClick: be,
+    }, re.value, {
+      onClick: ve,
       onKeydown: [
-        p[0] || (p[0] = W(L((y) => !o(k) && e.hasTabIndexEnter && be(), ["prevent"]), ["enter"])),
-        p[1] || (p[1] = W(L((y) => !o(k) && e.hasTabIndexSpace && be(), ["prevent"]), ["space"]))
+        ue[0] || (ue[0] = A(D((T) => !n(x) && e.hasTabIndexEnter && ve(), ["prevent"]), ["enter"])),
+        ue[1] || (ue[1] = A(D((T) => !n(x) && e.hasTabIndexSpace && ve(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset", "component", s.value, { "component--no-border": !o(m) }]),
-        style: se([G.value])
+        class: be(["nb-reset", "component", u.value, { "component--no-border": !n(f) }]),
+        style: ie([W.value])
       }, [
-        de("div", la, [
-          he(J.$slots, "content", {}, () => [
-            p[2] || (p[2] = Ce("Default Text"))
+        ne("div", la, [
+          me(oe.$slots, "content", {}, () => [
+            ue[2] || (ue[2] = he("Default Text"))
           ], !0)
         ]),
-        de("div", oa, [
-          he(J.$slots, "content", {}, () => [
-            p[3] || (p[3] = Ce("Default Text"))
+        ne("div", oa, [
+          me(oe.$slots, "content", {}, () => [
+            ue[3] || (ue[3] = he("Default Text"))
           ], !0)
         ])
       ], 14, aa)
-    ], 16, ta)) : ye("", !0);
+    ], 16, ta)) : ge("", !0);
   }
-}), ra = /* @__PURE__ */ ke(na, [["__scopeId", "data-v-71fb35fd"]]);
+}), ra = /* @__PURE__ */ Be(na, [["__scopeId", "data-v-a54b79c5"]]);
 const ua = ["tabIndex"], da = ["id"], ia = /* @__PURE__ */ Object.assign({
   name: "NbButtonBack",
   inheritAttrs: !1
@@ -2220,96 +2211,96 @@ const ua = ["tabIndex"], da = ["id"], ia = /* @__PURE__ */ Object.assign({
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe(($) => ({
-      "016c20ce": k.value,
+    Se((w) => ({
+      "016c20ce": B.value,
       "8168e11c": b.value,
-      a95ce2c2: f.value,
-      "439bc76e": V.value,
-      "70d5b6ca": u.value
+      a95ce2c2: m.value,
+      "439bc76e": x.value,
+      "70d5b6ca": i.value
     })), Ee(() => {
-      F();
+      R();
     });
-    const j = l, ae = e, {
-      ariaLabel: Q,
-      ariaAttrs: Z,
-      theme: h,
-      lightColor: R,
-      lightTextColor: E,
-      lightDisabledBgColor: ee,
-      darkColor: X,
-      darkTextColor: K,
-      darkDisabledBgColor: M,
+    const E = l, te = e, {
+      ariaLabel: U,
+      ariaAttrs: J,
+      theme: g,
+      lightColor: O,
+      lightTextColor: F,
+      lightDisabledBgColor: G,
+      darkColor: Y,
+      darkTextColor: M,
+      darkDisabledBgColor: Q,
       disabled: q,
-      fontFamily: te,
-      fontSize: O,
-      fontWeight: T
-    } = Be(ae), C = t(() => {
-      const $ = q.value ? "component-disabled" : "", z = te.value ? te.value : "'Lato', sans-serif", G = O.value ? O.value : "1.6em", g = T.value !== 0 && !T.value || T.value < 0 ? 400 : T.value;
+      fontFamily: P,
+      fontSize: L,
+      fontWeight: S
+    } = xe(te), V = t(() => {
+      const w = q.value ? "component-disabled" : "", W = P.value ? P.value : "'Lato', sans-serif", X = L.value ? L.value : "1.6em", u = S.value !== 0 && !S.value || S.value < 0 ? 400 : S.value;
       return {
-        font: z,
-        fontSize: G,
-        fontWeight: g,
-        disabled: $
+        font: W,
+        fontSize: X,
+        fontWeight: u,
+        disabled: w
       };
-    }), B = t(() => ({})), v = t(() => {
-      const $ = C.value;
+    }), y = t(() => ({})), c = t(() => {
+      const w = V.value;
       return {
-        fontSize: $.fontSize,
-        fontWeight: $.fontWeight
+        fontSize: w.fontSize,
+        fontWeight: w.fontWeight
       };
-    }), m = t(() => h.value === "dark" ? "component__theme--dark" : "component__theme--light"), f = t(() => R.value), b = t(() => E.value);
-    t(() => ee.value);
-    const u = t(() => X.value), V = t(() => K.value);
-    t(() => M.value);
-    const k = t(() => C.value.font), N = t(() => C.value.disabled), U = t(() => {
-      const $ = {};
-      Z.value && Object.keys(Z.value).forEach((g) => $[`aria-${g}`] = Z.value[g]);
-      const z = {
-        "aria-label": Q.value,
+    }), f = t(() => g.value === "dark" ? "component__theme--dark" : "component__theme--light"), m = t(() => O.value), b = t(() => F.value);
+    t(() => G.value);
+    const i = t(() => Y.value), x = t(() => M.value);
+    t(() => Q.value);
+    const B = t(() => V.value.font), _ = t(() => V.value.disabled), Z = t(() => {
+      const w = {};
+      J.value && Object.keys(J.value).forEach((u) => w[`aria-${u}`] = J.value[u]);
+      const W = {
+        "aria-label": U.value,
         "aria-disabled": q.value,
-        ...$
+        ...w
       };
       return Object.fromEntries(
-        Object.entries(z).filter(([G, g]) => g != null)
+        Object.entries(W).filter(([X, u]) => u != null)
       );
-    }), F = () => {
-    }, w = () => {
-      j("clicked");
+    }), R = () => {
+    }, I = () => {
+      E("clicked");
     };
-    return ($, z) => e.nbId ? (fe(), ve("div", Se({
+    return (w, W) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", N.value],
-      style: [B.value],
+      class: ["nb-wrapper", _.value],
+      style: [y.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, U.value, {
-      onClick: w,
+    }, Z.value, {
+      onClick: I,
       onKeydown: [
-        z[0] || (z[0] = W(L((G) => !o(q) && e.hasTabIndexEnter && w(), ["prevent"]), ["enter"])),
-        z[1] || (z[1] = W(L((G) => !o(q) && e.hasTabIndexSpace && w(), ["prevent"]), ["space"]))
+        W[0] || (W[0] = A(D((X) => !n(q) && e.hasTabIndexEnter && I(), ["prevent"]), ["enter"])),
+        W[1] || (W[1] = A(D((X) => !n(q) && e.hasTabIndexSpace && I(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset", "component", m.value]),
-        style: se([v.value])
+        class: be(["nb-reset", "component", f.value]),
+        style: ie([c.value])
       }, [
-        z[2] || (z[2] = de("svg", {
+        W[2] || (W[2] = ne("svg", {
           xmlns: "http://www.w3.org/2000/svg",
           width: "1em",
           height: "1em",
           viewBox: "0 0 16 16"
         }, [
-          de("path", {
+          ne("path", {
             d: "M14 8a.75.75 0 01-.75.75H4.56l1.22 1.22a.75.75 0 11-1.06 1.06l-2.5-2.5a.75.75 0 010-1.06l2.5-2.5a.75.75 0 111.06 1.06L4.56 7.25h8.69A.75.75 0 0114 8z",
             "clip-rule": "evenodd"
           })
         ], -1)),
-        de("span", null, We(e.text), 1)
+        ne("span", null, Le(e.text), 1)
       ], 14, da)
-    ], 16, ua)) : ye("", !0);
+    ], 16, ua)) : ge("", !0);
   }
-}), sa = /* @__PURE__ */ ke(ia, [["__scopeId", "data-v-20a30e37"]]);
+}), sa = /* @__PURE__ */ Be(ia, [["__scopeId", "data-v-20a30e37"]]);
 const ca = ["tabIndex"], fa = ["id"], va = /* @__PURE__ */ Object.assign({
   name: "NbButtonGradientBorderToBackground",
   inheritAttrs: !1
@@ -2377,11 +2368,6 @@ const ca = ["tabIndex"], fa = ["id"], va = /* @__PURE__ */ Object.assign({
       type: Number,
       default: 0.375
     },
-    width: {
-      type: Number,
-      default: 86,
-      validator: (e) => e || 86
-    },
     paddingX: {
       type: Number,
       default: 1,
@@ -2414,105 +2400,101 @@ const ca = ["tabIndex"], fa = ["id"], va = /* @__PURE__ */ Object.assign({
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((s) => ({
-      "928e066e": k.value,
-      "1a34925a": $.value,
-      "1f94277f": F.value,
-      "5fc491f5": U.value,
-      c38e18cc: N.value,
-      ac76d62a: w.value,
-      "30d4a1fc": z.value
+    Se((u) => ({
+      "70139a7c": x.value,
+      "85ad88e6": I.value,
+      "6410fd1c": Z.value,
+      "1b650f22": _.value,
+      "01802e4d": B.value,
+      "018b0a50": R.value,
+      "91ac64a2": w.value
     }));
-    const j = l, ae = e, {
-      display: Q,
-      ariaLabel: Z,
-      ariaAttrs: h,
-      buttonColor: R,
-      borderColor: E,
-      buttonHoverColor: ee,
-      showBorder: X,
-      borderRadius: K,
-      textColor: M,
+    const E = l, te = e, {
+      display: U,
+      ariaLabel: J,
+      ariaAttrs: g,
+      buttonColor: O,
+      borderColor: F,
+      buttonHoverColor: G,
+      showBorder: Y,
+      borderRadius: M,
+      textColor: Q,
       textHoverColor: q,
-      width: te,
-      paddingX: O,
-      paddingY: T,
-      disabled: C,
-      fontFamily: B,
-      fontSize: v,
-      fontWeight: m
-    } = Be(ae), f = t(() => {
-      const s = C.value ? "component-disabled" : "", H = Q.value !== "b" ? "inline-block" : "block", Y = R.value ? R.value : "#ffffff", I = ee.value ? ee.value : "#000000", P = E.value ? E.value : "#ffe54c", S = K.value !== 0 && !K.value || K.value < 0 ? 0 : K.value, r = [!1, !0].includes(X.value) ? X.value : !0, i = M.value ? M.value : "#ffffff", d = q.value ? q.value : "#000000", n = !te.value || te.value < 86 ? 86 : te.value, c = O.value !== 0 && !O.value || O.value < 0 ? 1 : O.value, A = T.value !== 0 && !T.value || T.value < 0 ? 0.2 : T.value, oe = B.value ? B.value : "'Lato', sans-serif", ie = v.value ? v.value : "1.6em", be = m.value !== 0 && !m.value || m.value < 0 ? 200 : m.value;
+      paddingX: P,
+      paddingY: L,
+      disabled: S,
+      fontFamily: V,
+      fontSize: y,
+      fontWeight: c
+    } = xe(te), f = t(() => {
+      const u = S.value ? "component-disabled" : "", $ = U.value !== "b" ? "inline-block" : "block", j = O.value ? O.value : "#ffffff", N = G.value ? G.value : "#000000", H = F.value ? F.value : "#ffe54c", K = M.value !== 0 && !M.value || M.value < 0 ? 0 : M.value, h = [!1, !0].includes(Y.value) ? Y.value : !0, d = Q.value ? Q.value : "#ffffff", o = q.value ? q.value : "#000000", r = P.value !== 0 && !P.value || P.value < 0 ? 1 : P.value, s = L.value !== 0 && !L.value || L.value < 0 ? 0.2 : L.value, k = V.value ? V.value : "'Lato', sans-serif", ee = y.value ? y.value : "1.6em", re = c.value !== 0 && !c.value || c.value < 0 ? 200 : c.value;
       return {
-        disabled: s,
-        display: H,
-        buttonColor: Y,
-        buttonHoverColor: I,
-        borderColor: P,
-        showBorder: r,
-        borderRadius: S,
-        textColor: i,
-        textHoverColor: d,
-        width: n,
-        paddingX: c,
-        paddingY: A,
-        font: oe,
-        fontSize: ie,
-        fontWeight: be
+        disabled: u,
+        display: $,
+        buttonColor: j,
+        buttonHoverColor: N,
+        borderColor: H,
+        showBorder: h,
+        borderRadius: K,
+        textColor: d,
+        textHoverColor: o,
+        paddingX: r,
+        paddingY: s,
+        font: k,
+        fontSize: ee,
+        fontWeight: re
       };
-    }), b = t(() => f.value.disabled), u = t(() => ({
+    }), m = t(() => f.value.disabled), b = t(() => ({
       display: f.value.display
-    })), V = t(() => {
-      const s = f.value;
+    })), i = t(() => {
+      const u = f.value;
       return {
-        minWidth: "33px",
-        width: s.display === "block" ? "auto" : `${s.width}px`,
         lineHeight: "1.42857143",
-        fontSize: s.fontSize,
-        fontWeight: s.fontWeight
+        fontSize: u.fontSize,
+        fontWeight: u.fontWeight
       };
-    }), k = t(() => f.value.font), N = t(() => {
-      const s = f.value;
-      return `${s.paddingY}rem ${s.paddingX}rem`;
-    }), U = t(() => `${f.value.borderRadius}rem`), F = t(() => f.value.textColor), w = t(() => f.value.textHoverColor), $ = t(() => f.value.buttonColor), z = t(() => f.value.buttonHoverColor), G = t(() => {
-      const s = {};
-      h.value && Object.keys(h.value).forEach((I) => s[`aria-${I}`] = h.value[I]);
-      const H = {
-        "aria-label": Z.value,
-        "aria-disabled": C.value,
-        ...s
+    }), x = t(() => f.value.font), B = t(() => {
+      const u = f.value;
+      return `${u.paddingY}rem ${u.paddingX}rem`;
+    }), _ = t(() => `${f.value.borderRadius}rem`), Z = t(() => f.value.textColor), R = t(() => f.value.textHoverColor), I = t(() => f.value.buttonColor), w = t(() => f.value.buttonHoverColor), W = t(() => {
+      const u = {};
+      g.value && Object.keys(g.value).forEach((N) => u[`aria-${N}`] = g.value[N]);
+      const $ = {
+        "aria-label": J.value,
+        "aria-disabled": S.value,
+        ...u
       };
       return Object.fromEntries(
-        Object.entries(H).filter(([Y, I]) => I != null)
+        Object.entries($).filter(([j, N]) => N != null)
       );
-    }), g = () => {
-      j("clicked");
+    }), X = () => {
+      E("clicked");
     };
-    return (s, H) => e.nbId ? (fe(), ve("div", Se({
+    return (u, $) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", b.value],
-      style: [u.value],
+      class: ["nb-wrapper", m.value],
+      style: [b.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, G.value, {
-      onClick: g,
+    }, W.value, {
+      onClick: X,
       onKeydown: [
-        H[0] || (H[0] = W(L((Y) => !o(C) && e.hasTabIndexEnter && g(), ["prevent"]), ["enter"])),
-        H[1] || (H[1] = W(L((Y) => !o(C) && e.hasTabIndexSpace && g(), ["prevent"]), ["space"]))
+        $[0] || ($[0] = A(D((j) => !n(S) && e.hasTabIndexEnter && X(), ["prevent"]), ["enter"])),
+        $[1] || ($[1] = A(D((j) => !n(S) && e.hasTabIndexSpace && X(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
         class: "nb-reset component",
-        style: se([V.value])
+        style: ie([i.value])
       }, [
-        he(s.$slots, "content", {}, () => [
-          H[2] || (H[2] = Ce("Default Text"))
+        me(u.$slots, "content", {}, () => [
+          $[2] || ($[2] = he("Default Text"))
         ], !0)
       ], 12, fa)
-    ], 16, ca)) : ye("", !0);
+    ], 16, ca)) : ge("", !0);
   }
-}), pa = /* @__PURE__ */ ke(va, [["__scopeId", "data-v-7ea19f81"]]);
+}), pa = /* @__PURE__ */ Be(va, [["__scopeId", "data-v-92801766"]]);
 const ba = ["tabIndex"], ga = ["id"], ya = /* @__PURE__ */ Object.assign({
   name: "NbButtonNormal",
   inheritAttrs: !1
@@ -2560,11 +2542,6 @@ const ba = ["tabIndex"], ga = ["id"], ya = /* @__PURE__ */ Object.assign({
       type: Number,
       default: 0.375
     },
-    width: {
-      type: Number,
-      default: 86,
-      validator: (e) => e || 86
-    },
     paddingX: {
       type: Number,
       default: 1,
@@ -2674,135 +2651,131 @@ const ba = ["tabIndex"], ga = ["id"], ya = /* @__PURE__ */ Object.assign({
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((n) => ({
-      c45340ec: P.value,
-      "554c8b64": S.value,
-      "2fc98285": o(w),
-      "1b017840": o(U),
-      effff9b4: o(z),
-      "02f721b7": o($),
-      c809fd88: o(F),
-      "48e64494": o(G),
-      "58d5373b": o(b),
-      "0770a316": o(m),
-      c61d3b48: o(V),
-      "27adeec1": o(u),
-      "6e32b3c6": o(f),
-      a476df80: o(k),
-      "0ef6e5de": o(g),
-      "6aa76147": o(N)
+    Se((r) => ({
+      cd04d0ca: H.value,
+      d2ea5dc2: K.value,
+      acbc64d8: n(R),
+      "5771072f": n(_),
+      "261c7316": n(w),
+      "052e6808": n(I),
+      "250c1166": n(Z),
+      "2d0bd3c7": n(W),
+      "1a064e0c": n(m),
+      "40b749a7": n(c),
+      "538fee26": n(i),
+      "6c5f7290": n(b),
+      "4c927fd5": n(f),
+      e7b74762: n(x),
+      "3d3610e0": n(X),
+      "87b35150": n(B)
     }));
-    const j = l, ae = e, {
-      display: Q,
-      ariaLabel: Z,
-      ariaAttrs: h,
-      showBorder: R,
-      borderRadius: E,
-      width: ee,
-      paddingX: X,
-      paddingY: K,
+    const E = l, te = e, {
+      display: U,
+      ariaLabel: J,
+      ariaAttrs: g,
+      showBorder: O,
+      borderRadius: F,
+      paddingX: G,
+      paddingY: Y,
       disabled: M,
-      fontFamily: q,
-      fontSize: te,
-      fontWeight: O,
-      hasAnimation: T,
-      animationDuration: C,
-      animationDurationType: B,
-      theme: v,
-      lightButtonColor: m,
+      fontFamily: Q,
+      fontSize: q,
+      fontWeight: P,
+      hasAnimation: L,
+      animationDuration: S,
+      animationDurationType: V,
+      theme: y,
+      lightButtonColor: c,
       lightButtonColorHover: f,
-      lightTextColor: b,
-      lightTextColorHover: u,
-      lightBorderColor: V,
-      lightBorderColorHover: k,
-      lightDisabledBgColor: N,
-      darkButtonColor: U,
-      darkButtonColorHover: F,
-      darkTextColor: w,
-      darkTextColorHover: $,
-      darkBorderColor: z,
-      darkBorderColorHover: G,
-      darkDisabledBgColor: g
-    } = Be(ae), s = t(() => {
-      const n = M.value ? "component-disabled" : "", c = Q.value !== "b" ? "inline-block" : "block", A = E.value !== 0 && !E.value || E.value < 0 ? 0 : E.value, oe = [!1, !0].includes(R.value) ? R.value : !0, ie = !ee.value || ee.value < 86 ? 86 : ee.value, be = X.value !== 0 && !X.value || X.value < 0 ? 1 : X.value, J = K.value !== 0 && !K.value || K.value < 0 ? 0.2 : K.value, p = q.value ? q.value : "'Lato', sans-serif", y = te.value ? te.value : "1.6em", le = O.value !== 0 && !O.value || O.value < 0 ? 200 : O.value, D = T.value ? "component-transition" : "", _ = C.value !== 0 && !C.value || C.value < 0 ? 0.3 : C.value, ue = B.value ? B.value : "ms", ne = v.value ? v.value : "light";
+      lightTextColor: m,
+      lightTextColorHover: b,
+      lightBorderColor: i,
+      lightBorderColorHover: x,
+      lightDisabledBgColor: B,
+      darkButtonColor: _,
+      darkButtonColorHover: Z,
+      darkTextColor: R,
+      darkTextColorHover: I,
+      darkBorderColor: w,
+      darkBorderColorHover: W,
+      darkDisabledBgColor: X
+    } = xe(te), u = t(() => {
+      const r = M.value ? "component-disabled" : "", s = U.value !== "b" ? "inline-block" : "block", k = F.value !== 0 && !F.value || F.value < 0 ? 0 : F.value, ee = [!1, !0].includes(O.value) ? O.value : !0, re = G.value !== 0 && !G.value || G.value < 0 ? 1 : G.value, ve = Y.value !== 0 && !Y.value || Y.value < 0 ? 0.2 : Y.value, oe = Q.value ? Q.value : "'Lato', sans-serif", ue = q.value ? q.value : "1.6em", T = P.value !== 0 && !P.value || P.value < 0 ? 200 : P.value, p = L.value ? "component-transition" : "", de = S.value !== 0 && !S.value || S.value < 0 ? 0.3 : S.value, v = V.value ? V.value : "ms", z = y.value ? y.value : "light";
       return {
-        disabled: n,
-        display: c,
-        showBorder: oe,
-        borderRadius: A,
-        width: ie,
-        paddingX: be,
-        paddingY: J,
-        font: p,
-        fontSize: y,
-        fontWeight: le,
-        hasAnimation: D,
-        animationDuration: _,
-        animationDurationType: ue,
-        theme: ne
+        disabled: r,
+        display: s,
+        showBorder: ee,
+        borderRadius: k,
+        paddingX: re,
+        paddingY: ve,
+        font: oe,
+        fontSize: ue,
+        fontWeight: T,
+        hasAnimation: p,
+        animationDuration: de,
+        animationDurationType: v,
+        theme: z
       };
-    }), H = t(() => s.value.disabled), Y = t(() => ({
-      display: s.value.display
-    })), I = t(() => {
-      const n = s.value, c = n.display === "block" ? "auto" : `${n.width}px`;
+    }), $ = t(() => u.value.disabled), j = t(() => ({
+      display: u.value.display
+    })), N = t(() => {
+      const r = u.value;
       return {
-        borderRadius: `${n.borderRadius}rem`,
-        minWidth: "33px",
-        width: c,
-        padding: `${n.paddingY}rem ${n.paddingX}rem`,
+        borderRadius: `${r.borderRadius}rem`,
+        padding: `${r.paddingY}rem ${r.paddingX}rem`,
         lineHeight: "1.42857143",
-        fontSize: n.fontSize,
-        fontWeight: n.fontWeight
+        fontSize: r.fontSize,
+        fontWeight: r.fontWeight
       };
-    }), P = t(() => s.value.font), S = t(() => {
-      const n = s.value;
-      return n.hasAnimation ? `all ${n.animationDuration}${n.animationDurationType} ease-in-out` : "";
-    }), r = t(() => {
-      switch (s.value.theme) {
+    }), H = t(() => u.value.font), K = t(() => {
+      const r = u.value;
+      return r.hasAnimation ? `all ${r.animationDuration}${r.animationDurationType} ease-in-out` : "";
+    }), h = t(() => {
+      switch (u.value.theme) {
         case "dark":
           return "component__theme--dark";
         default:
           return "component__theme--light";
       }
-    }), i = t(() => {
-      const n = {};
-      h.value && Object.keys(h.value).forEach((oe) => n[`aria-${oe}`] = h.value[oe]);
-      const c = {
-        "aria-label": Z.value,
+    }), d = t(() => {
+      const r = {};
+      g.value && Object.keys(g.value).forEach((ee) => r[`aria-${ee}`] = g.value[ee]);
+      const s = {
+        "aria-label": J.value,
         "aria-disabled": M.value,
-        ...n
+        ...r
       };
       return Object.fromEntries(
-        Object.entries(c).filter(([A, oe]) => oe != null)
+        Object.entries(s).filter(([k, ee]) => ee != null)
       );
-    }), d = () => {
-      j("clicked");
+    }), o = () => {
+      E("clicked");
     };
-    return (n, c) => e.nbId ? (fe(), ve("div", Se({
+    return (r, s) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", H.value],
-      style: [Y.value],
+      class: ["nb-wrapper", $.value],
+      style: [j.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, i.value, {
-      onClick: d,
+    }, d.value, {
+      onClick: o,
       onKeydown: [
-        c[0] || (c[0] = W(L((A) => !o(M) && e.hasTabIndexEnter && d(), ["prevent"]), ["enter"])),
-        c[1] || (c[1] = W(L((A) => !o(M) && e.hasTabIndexSpace && d(), ["prevent"]), ["space"]))
+        s[0] || (s[0] = A(D((k) => !n(M) && e.hasTabIndexEnter && o(), ["prevent"]), ["enter"])),
+        s[1] || (s[1] = A(D((k) => !n(M) && e.hasTabIndexSpace && o(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset component", [{ "component-transition": o(T), "component--no-border": !o(R) }, r.value]]),
-        style: se([I.value])
+        class: be(["nb-reset component", [{ "component-transition": n(L), "component--no-border": !n(O) }, h.value]]),
+        style: ie([N.value])
       }, [
-        he(n.$slots, "content", {}, () => [
-          c[2] || (c[2] = Ce("Default Text"))
+        me(r.$slots, "content", {}, () => [
+          s[2] || (s[2] = he("Default Text"))
         ], !0)
       ], 14, ga)
-    ], 16, ba)) : ye("", !0);
+    ], 16, ba)) : ge("", !0);
   }
-}), ma = /* @__PURE__ */ ke(ya, [["__scopeId", "data-v-52762902"]]);
+}), ma = /* @__PURE__ */ Be(ya, [["__scopeId", "data-v-74515101"]]);
 const ha = ["tabIndex"], Ca = ["id"], Sa = /* @__PURE__ */ Object.assign({
   name: "NbButtonShadow",
   inheritAttrs: !1
@@ -2948,117 +2921,113 @@ const ha = ["tabIndex"], Ca = ["id"], Sa = /* @__PURE__ */ Object.assign({
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((_) => ({
-      "3ec9f221": s.value,
-      "06dc689a": P.value,
-      "9686e482": Y.value,
-      c745b040: d.value,
-      "7148a3cc": r.value,
-      "6599c0c2": S.value,
-      "73a7ea86": I.value,
-      "956c297c": i.value,
-      "1382bddc": oe.value,
-      c3c968fe: c.value,
-      adf905bc: p.value,
-      "548989dc": be.value,
-      "657f3680": ie.value,
-      "52f0d38a": A.value,
-      "5c9918c0": J.value,
-      c826766a: n.value,
-      d1faade6: y.value
+    Se((v) => ({
+      be370cfa: u.value,
+      "0a195178": H.value,
+      "3d8bd3c6": j.value,
+      c0cbde84: o.value,
+      "1a1c0f10": h.value,
+      "6701b2a4": K.value,
+      d969e5c2: N.value,
+      "3e796ba4": d.value,
+      "76b6413e": ee.value,
+      "65bc3f63": s.value,
+      "0c370084": ue.value,
+      "55f17bbe": ve.value,
+      b7fca2c4: re.value,
+      "03a480ce": k.value,
+      "35b1f7c4": oe.value,
+      "72ae0ea9": r.value,
+      "6421ab6f": T.value
     }));
-    const j = l, ae = e, {
-      display: Q,
-      ariaLabel: Z,
-      ariaAttrs: h,
-      theme: R,
-      lightTextColor: E,
-      lightTextColorHover: ee,
-      lightButtonColor: X,
-      lightButtonColorHover: K,
-      lightButtonShadowColor: M,
+    const E = l, te = e, {
+      display: U,
+      ariaLabel: J,
+      ariaAttrs: g,
+      theme: O,
+      lightTextColor: F,
+      lightTextColorHover: G,
+      lightButtonColor: Y,
+      lightButtonColorHover: M,
+      lightButtonShadowColor: Q,
       lightBorderColor: q,
-      lightDisabledBgColor: te,
-      darkTextColor: O,
-      darkTextColorHover: T,
-      darkButtonColor: C,
-      darkButtonColorHover: B,
-      darkButtonShadowColor: v,
-      darkBorderColor: m,
-      darkDisabledBgColor: f,
+      lightDisabledBgColor: P,
+      darkTextColor: L,
+      darkTextColorHover: S,
+      darkButtonColor: V,
+      darkButtonColorHover: y,
+      darkButtonShadowColor: c,
+      darkBorderColor: f,
+      darkDisabledBgColor: m,
       borderRadius: b,
-      width: u,
-      paddingX: V,
-      paddingY: k,
-      disabled: N,
-      fontFamily: U,
-      fontSize: F,
-      fontWeight: w
-    } = Be(ae), $ = t(() => {
-      const _ = N.value ? "component-disabled" : "", ue = Q.value !== "b" ? "inline-block" : "block", ne = b.value !== 0 && !b.value || b.value < 0 ? 0 : b.value, me = !u.value || u.value < 86 ? 86 : u.value, ge = V.value !== 0 && !V.value || V.value < 0 ? 1 : V.value, Ie = k.value !== 0 && !k.value || k.value < 0 ? 0.2 : k.value, _e = U.value ? U.value : "'Lato', sans-serif", De = F.value ? F.value : "1.6em", Ne = w.value !== 0 && !w.value || w.value < 0 ? 200 : w.value;
+      paddingX: i,
+      paddingY: x,
+      disabled: B,
+      fontFamily: _,
+      fontSize: Z,
+      fontWeight: R
+    } = xe(te), I = t(() => {
+      const v = B.value ? "component-disabled" : "", z = U.value !== "b" ? "inline-block" : "block", pe = b.value !== 0 && !b.value || b.value < 0 ? 0 : b.value, ae = i.value !== 0 && !i.value || i.value < 0 ? 1 : i.value, Ve = x.value !== 0 && !x.value || x.value < 0 ? 0.2 : x.value, ye = _.value ? _.value : "'Lato', sans-serif", we = Z.value ? Z.value : "1.6em", _e = R.value !== 0 && !R.value || R.value < 0 ? 200 : R.value;
       return {
-        disabled: _,
-        display: ue,
-        borderRadius: ne,
-        width: me,
-        paddingX: ge,
-        paddingY: Ie,
-        font: _e,
-        fontSize: De,
-        fontWeight: Ne
+        disabled: v,
+        display: z,
+        borderRadius: pe,
+        paddingX: ae,
+        paddingY: Ve,
+        font: ye,
+        fontSize: we,
+        fontWeight: _e
       };
-    }), z = t(() => $.value.disabled), G = t(() => ({
-      display: $.value.display
-    })), g = t(() => {
-      const _ = $.value, ue = _.display === "block" ? "auto" : `${_.width}px`;
+    }), w = t(() => I.value.disabled), W = t(() => ({
+      display: I.value.display
+    })), X = t(() => {
+      const v = I.value;
       return {
-        borderRadius: `${_.borderRadius}rem`,
-        minWidth: "33px",
-        width: ue,
-        padding: `${_.paddingY}rem ${_.paddingX}rem`,
+        borderRadius: `${v.borderRadius}rem`,
+        padding: `${v.paddingY}rem ${v.paddingX}rem`,
         lineHeight: "1.42857143",
-        fontSize: _.fontSize,
-        fontWeight: _.fontWeight
+        fontSize: v.fontSize,
+        fontWeight: v.fontWeight
       };
-    }), s = t(() => $.value.font), H = t(() => R.value === "dark" ? "component__theme--dark" : "component__theme--light"), Y = t(() => E.value), I = t(() => ee.value), P = t(() => X.value), S = t(() => K.value), r = t(() => `3px 3px 0 -1px ${M.value}, 3px 3px 0 ${M.value}`), i = t(() => `0 0 0 -1px ${M.value}, 0 0 0 ${M.value}`), d = t(() => q.value), n = t(() => te.value), c = t(() => O.value), A = t(() => T.value), oe = t(() => C.value), ie = t(() => B.value), be = t(() => `3px 3px 0 -1px ${v.value}, 3px 3px 0 ${v.value}`), J = t(() => `0 0 0 -1px ${v.value}, 0 0 0 ${v.value}`), p = t(() => m.value), y = t(() => f.value), le = t(() => {
-      const _ = {};
-      h.value && Object.keys(h.value).forEach((me) => _[`aria-${me}`] = h.value[me]);
-      const ue = {
-        "aria-label": Z.value,
-        "aria-disabled": N.value,
-        ..._
+    }), u = t(() => I.value.font), $ = t(() => O.value === "dark" ? "component__theme--dark" : "component__theme--light"), j = t(() => F.value), N = t(() => G.value), H = t(() => Y.value), K = t(() => M.value), h = t(() => `3px 3px 0 -1px ${Q.value}, 3px 3px 0 ${Q.value}`), d = t(() => `0 0 0 -1px ${Q.value}, 0 0 0 ${Q.value}`), o = t(() => q.value), r = t(() => P.value), s = t(() => L.value), k = t(() => S.value), ee = t(() => V.value), re = t(() => y.value), ve = t(() => `3px 3px 0 -1px ${c.value}, 3px 3px 0 ${c.value}`), oe = t(() => `0 0 0 -1px ${c.value}, 0 0 0 ${c.value}`), ue = t(() => f.value), T = t(() => m.value), p = t(() => {
+      const v = {};
+      g.value && Object.keys(g.value).forEach((ae) => v[`aria-${ae}`] = g.value[ae]);
+      const z = {
+        "aria-label": J.value,
+        "aria-disabled": B.value,
+        ...v
       };
       return Object.fromEntries(
-        Object.entries(ue).filter(([ne, me]) => me != null)
+        Object.entries(z).filter(([pe, ae]) => ae != null)
       );
-    }), D = () => {
-      j("clicked");
+    }), de = () => {
+      E("clicked");
     };
-    return (_, ue) => e.nbId ? (fe(), ve("div", Se({
+    return (v, z) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", z.value],
-      style: [G.value],
+      class: ["nb-wrapper", w.value],
+      style: [W.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, le.value, {
-      onClick: D,
+    }, p.value, {
+      onClick: de,
       onKeydown: [
-        ue[0] || (ue[0] = W(L((ne) => !o(N) && e.hasTabIndexEnter && D(), ["prevent"]), ["enter"])),
-        ue[1] || (ue[1] = W(L((ne) => !o(N) && e.hasTabIndexSpace && D(), ["prevent"]), ["space"]))
+        z[0] || (z[0] = A(D((pe) => !n(B) && e.hasTabIndexEnter && de(), ["prevent"]), ["enter"])),
+        z[1] || (z[1] = A(D((pe) => !n(B) && e.hasTabIndexSpace && de(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset component", [H.value]]),
-        style: se([g.value])
+        class: be(["nb-reset component", [$.value]]),
+        style: ie([X.value])
       }, [
-        he(_.$slots, "content", {}, () => [
-          ue[2] || (ue[2] = Ce("Default Text"))
+        me(v.$slots, "content", {}, () => [
+          z[2] || (z[2] = he("Default Text"))
         ], !0)
       ], 14, Ca)
-    ], 16, ha)) : ye("", !0);
+    ], 16, ha)) : ge("", !0);
   }
-}), xa = /* @__PURE__ */ ke(Sa, [["__scopeId", "data-v-af8ef341"]]);
+}), xa = /* @__PURE__ */ Be(Sa, [["__scopeId", "data-v-53ce7533"]]);
 const Ba = ["tabIndex"], ka = ["id"], Va = /* @__PURE__ */ Object.assign({
   name: "NbButtonUnderlineExpand",
   inheritAttrs: !1
@@ -3152,11 +3121,6 @@ const Ba = ["tabIndex"], ka = ["id"], Va = /* @__PURE__ */ Object.assign({
       default: 1.5,
       validator: (e) => e || 1.5
     },
-    width: {
-      type: Number,
-      default: 86,
-      validator: (e) => e || 86
-    },
     paddingX: {
       type: Number,
       default: 1,
@@ -3194,116 +3158,112 @@ const Ba = ["tabIndex"], ka = ["id"], Va = /* @__PURE__ */ Object.assign({
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((c) => ({
-      "1a3aa9a1": z.value,
-      "08b2ae9c": i.value,
-      cc543382: g.value,
-      befb3f40: H.value,
-      "2d96023d": s.value,
-      "4c149688": Y.value,
-      "7c34e301": I.value,
-      "671534a2": S.value,
-      "6640aebb": P.value,
-      dab18c8c: r.value
+    Se((s) => ({
+      "6590a483": w.value,
+      "7f22ed10": d.value,
+      "2f528b1d": X.value,
+      "6d2d7484": $.value,
+      "09988fc2": u.value,
+      "92050bc4": j.value,
+      "68412a63": N.value,
+      fda5a8f8: K.value,
+      "1df896ce": H.value,
+      "78c04018": h.value
     }));
-    const j = l, ae = e, {
-      display: Q,
-      ariaLabel: Z,
-      ariaAttrs: h,
-      theme: R,
-      lightTextColor: E,
-      lightTextColorHover: ee,
-      lightBorderColor: X,
-      lightBorderColorHover: K,
-      lightDisabledBgColor: M,
+    const E = l, te = e, {
+      display: U,
+      ariaLabel: J,
+      ariaAttrs: g,
+      theme: O,
+      lightTextColor: F,
+      lightTextColorHover: G,
+      lightBorderColor: Y,
+      lightBorderColorHover: M,
+      lightDisabledBgColor: Q,
       darkTextColor: q,
-      darkTextColorHover: te,
-      darkBorderColor: O,
-      darkBorderColorHover: T,
-      darkDisabledBgColor: C,
-      borderHeight: B,
-      width: v,
-      paddingX: m,
+      darkTextColorHover: P,
+      darkBorderColor: L,
+      darkBorderColorHover: S,
+      darkDisabledBgColor: V,
+      borderHeight: y,
+      paddingX: c,
       paddingY: f,
-      disabled: b,
-      fontFamily: u,
-      fontSize: V,
-      fontWeight: k,
-      textAlign: N
-    } = Be(ae), U = t(() => {
-      const c = b.value ? "component-disabled" : "", A = Q.value !== "b" ? "inline-block" : "block", oe = B.value !== 0 && !B.value || B.value < 0 ? 1.5 : B.value, ie = !v.value || v.value < 86 ? 86 : v.value, be = m.value !== 0 && !m.value || m.value < 0 ? 1 : m.value, J = f.value !== 0 && !f.value || f.value < 0 ? 0.2 : f.value, p = u.value ? u.value : "'Lato', sans-serif", y = V.value ? V.value : "1.6em", le = k.value !== 0 && !k.value || k.value < 0 ? 200 : k.value, D = N.value ? N.value : "center";
+      disabled: m,
+      fontFamily: b,
+      fontSize: i,
+      fontWeight: x,
+      textAlign: B
+    } = xe(te), _ = t(() => {
+      const s = m.value ? "component-disabled" : "", k = U.value !== "b" ? "inline-block" : "block", ee = y.value !== 0 && !y.value || y.value < 0 ? 1.5 : y.value, re = c.value !== 0 && !c.value || c.value < 0 ? 1 : c.value, ve = f.value !== 0 && !f.value || f.value < 0 ? 0.2 : f.value, oe = b.value ? b.value : "'Lato', sans-serif", ue = i.value ? i.value : "1.6em", T = x.value !== 0 && !x.value || x.value < 0 ? 200 : x.value, p = B.value ? B.value : "center";
       return {
-        disabled: c,
-        display: A,
-        borderHeight: oe,
-        width: ie,
-        paddingX: be,
-        paddingY: J,
-        font: p,
-        fontSize: y,
-        fontWeight: le,
-        textAlign: D
+        disabled: s,
+        display: k,
+        borderHeight: ee,
+        paddingX: re,
+        paddingY: ve,
+        font: oe,
+        fontSize: ue,
+        fontWeight: T,
+        textAlign: p
       };
-    }), F = t(() => U.value.disabled), w = t(() => {
-      const c = U.value;
+    }), Z = t(() => _.value.disabled), R = t(() => {
+      const s = _.value;
       return {
-        display: c.display,
-        textAlign: c.textAlign
+        display: s.display,
+        textAlign: s.textAlign
       };
-    }), $ = t(() => {
-      const c = U.value;
+    }), I = t(() => {
+      const s = _.value;
       return {
-        minWidth: "33px",
-        width: c.display === "block" ? "auto" : `${c.width}px`,
-        padding: `${c.paddingY}rem ${c.paddingX}rem`,
+        padding: `${s.paddingY}rem ${s.paddingX}rem`,
         lineHeight: "1.42857143",
-        fontSize: c.fontSize,
-        fontWeight: c.fontWeight
+        fontSize: s.fontSize,
+        fontWeight: s.fontWeight
       };
-    }), z = t(() => U.value.font), G = t(() => R.value === "dark" ? "component__theme--dark" : "component__theme--light"), g = t(() => E.value), s = t(() => ee.value), H = t(() => X.value), Y = t(() => K.value);
-    t(() => M.value);
-    const I = t(() => q.value), P = t(() => te.value), S = t(() => O.value), r = t(() => T.value);
-    t(() => C.value);
-    const i = t(() => `${U.value.borderHeight}px`), d = t(() => {
-      const c = {};
-      h.value && Object.keys(h.value).forEach((ie) => c[`aria-${ie}`] = h.value[ie]);
-      const A = {
-        "aria-label": Z.value,
-        "aria-disabled": b.value,
-        ...c
+    }), w = t(() => _.value.font), W = t(() => O.value === "dark" ? "component__theme--dark" : "component__theme--light"), X = t(() => F.value), u = t(() => G.value), $ = t(() => Y.value), j = t(() => M.value);
+    t(() => Q.value);
+    const N = t(() => q.value), H = t(() => P.value), K = t(() => L.value), h = t(() => S.value);
+    t(() => V.value);
+    const d = t(() => `${_.value.borderHeight}px`), o = t(() => {
+      const s = {};
+      g.value && Object.keys(g.value).forEach((re) => s[`aria-${re}`] = g.value[re]);
+      const k = {
+        "aria-label": J.value,
+        "aria-disabled": m.value,
+        ...s
       };
       return Object.fromEntries(
-        Object.entries(A).filter(([oe, ie]) => ie != null)
+        Object.entries(k).filter(([ee, re]) => re != null)
       );
-    }), n = () => {
-      j("clicked");
+    }), r = () => {
+      E("clicked");
     };
-    return (c, A) => e.nbId ? (fe(), ve("div", Se({
+    return (s, k) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", F.value],
-      style: [w.value],
+      class: ["nb-wrapper", Z.value],
+      style: [R.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, d.value, {
-      onClick: n,
+    }, o.value, {
+      onClick: r,
       onKeydown: [
-        A[0] || (A[0] = W(L((oe) => !o(b) && e.hasTabIndexEnter && n(), ["prevent"]), ["enter"])),
-        A[1] || (A[1] = W(L((oe) => !o(b) && e.hasTabIndexSpace && n(), ["prevent"]), ["space"]))
+        k[0] || (k[0] = A(D((ee) => !n(m) && e.hasTabIndexEnter && r(), ["prevent"]), ["enter"])),
+        k[1] || (k[1] = A(D((ee) => !n(m) && e.hasTabIndexSpace && r(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset component", [G.value]]),
-        style: se([$.value])
+        class: be(["nb-reset component", [W.value]]),
+        style: ie([I.value])
       }, [
-        he(c.$slots, "content", {}, () => [
-          A[2] || (A[2] = Ce("Default Text"))
+        me(s.$slots, "content", {}, () => [
+          k[2] || (k[2] = he("Default Text"))
         ], !0)
       ], 14, ka)
-    ], 16, Ba)) : ye("", !0);
+    ], 16, Ba)) : ge("", !0);
   }
-}), Ta = /* @__PURE__ */ ke(Va, [["__scopeId", "data-v-910f5abd"]]);
-const wa = ["tabIndex"], $a = ["id"], Ia = /* @__PURE__ */ Object.assign({
+}), Ta = /* @__PURE__ */ Be(Va, [["__scopeId", "data-v-e157e203"]]);
+const Ia = ["tabIndex"], $a = ["id"], wa = /* @__PURE__ */ Object.assign({
   name: "NbButtonUnderlineFill",
   inheritAttrs: !1
 }, {
@@ -3391,11 +3351,6 @@ const wa = ["tabIndex"], $a = ["id"], Ia = /* @__PURE__ */ Object.assign({
       type: String,
       default: "rgba(40, 42, 54, 1)"
     },
-    width: {
-      type: Number,
-      default: 86,
-      validator: (e) => e || 86
-    },
     paddingX: {
       type: Number,
       default: 1,
@@ -3433,116 +3388,112 @@ const wa = ["tabIndex"], $a = ["id"], Ia = /* @__PURE__ */ Object.assign({
   },
   emits: ["clicked"],
   setup(e, { emit: l }) {
-    xe((d) => ({
-      "3f2443ee": $.value,
-      "17204a6d": s.value,
-      "7e24c852": G.value,
-      "61a90acf": H.value,
-      dc9f17ec: g.value,
-      "7721d5a9": P.value,
-      "5a47f28e": Y.value,
-      72492513: S.value,
-      "354b6164": I.value
+    Se((o) => ({
+      "71c6e3de": I.value,
+      ed11aaac: u.value,
+      "084093cf": W.value,
+      ca946e9c: $.value,
+      "5d894ead": X.value,
+      "307f79cc": H.value,
+      "45f64371": j.value,
+      "218b9ed0": K.value,
+      "1d7a144b": N.value
     }));
-    const j = l, ae = e, {
-      display: Q,
-      ariaLabel: Z,
-      ariaAttrs: h,
-      theme: R,
-      lightTextColor: E,
-      lightTextColorHover: ee,
-      lightButtonColor: X,
-      lightButtonColorHover: K,
-      lightDisabledBgColor: M,
+    const E = l, te = e, {
+      display: U,
+      ariaLabel: J,
+      ariaAttrs: g,
+      theme: O,
+      lightTextColor: F,
+      lightTextColorHover: G,
+      lightButtonColor: Y,
+      lightButtonColorHover: M,
+      lightDisabledBgColor: Q,
       darkTextColor: q,
-      darkTextColorHover: te,
-      darkButtonColor: O,
-      darkButtonColorHover: T,
-      darkDisabledBgColor: C,
-      width: B,
-      paddingX: v,
-      paddingY: m,
+      darkTextColorHover: P,
+      darkButtonColor: L,
+      darkButtonColorHover: S,
+      darkDisabledBgColor: V,
+      paddingX: y,
+      paddingY: c,
       disabled: f,
-      fontFamily: b,
-      fontSize: u,
-      fontWeight: V,
-      textAlign: k
-    } = Be(ae), N = t(() => {
-      const d = f.value ? "component-disabled" : "", n = Q.value !== "b" ? "inline-block" : "block", c = !B.value || B.value < 86 ? 86 : B.value, A = v.value !== 0 && !v.value || v.value < 0 ? 1 : v.value, oe = m.value !== 0 && !m.value || m.value < 0 ? 0.2 : m.value, ie = b.value ? b.value : "'Lato', sans-serif", be = u.value ? u.value : "1.6em", J = V.value !== 0 && !V.value || V.value < 0 ? 200 : V.value, p = k.value ? k.value : "center";
+      fontFamily: m,
+      fontSize: b,
+      fontWeight: i,
+      textAlign: x
+    } = xe(te), B = t(() => {
+      const o = f.value ? "component-disabled" : "", r = U.value !== "b" ? "inline-block" : "block", s = y.value !== 0 && !y.value || y.value < 0 ? 1 : y.value, k = c.value !== 0 && !c.value || c.value < 0 ? 0.2 : c.value, ee = m.value ? m.value : "'Lato', sans-serif", re = b.value ? b.value : "1.6em", ve = i.value !== 0 && !i.value || i.value < 0 ? 200 : i.value, oe = x.value ? x.value : "center";
       return {
-        disabled: d,
-        display: n,
-        width: c,
-        paddingX: A,
-        paddingY: oe,
-        font: ie,
-        fontSize: be,
-        fontWeight: J,
-        textAlign: p
+        disabled: o,
+        display: r,
+        paddingX: s,
+        paddingY: k,
+        font: ee,
+        fontSize: re,
+        fontWeight: ve,
+        textAlign: oe
       };
-    }), U = t(() => N.value.disabled), F = t(() => {
-      const d = N.value;
+    }), _ = t(() => B.value.disabled), Z = t(() => {
+      const o = B.value;
       return {
-        display: d.display,
-        textAlign: d.textAlign
+        display: o.display,
+        textAlign: o.textAlign
       };
-    }), w = t(() => {
-      const d = N.value;
+    }), R = t(() => {
+      const o = B.value;
       return {
-        minWidth: "33px",
-        width: d.display === "block" ? "auto" : `${d.width}px`,
-        padding: `${d.paddingY}rem ${d.paddingX}rem`,
+        padding: `${o.paddingY}rem ${o.paddingX}rem`,
         lineHeight: "1.42857143",
-        fontSize: d.fontSize,
-        fontWeight: d.fontWeight
+        fontSize: o.fontSize,
+        fontWeight: o.fontWeight
       };
-    }), $ = t(() => N.value.font), z = t(() => R.value === "dark" ? "component__theme--dark" : "component__theme--light"), G = t(() => E.value), g = t(() => ee.value), s = t(() => `linear-gradient(${X.value}, ${X.value}) center bottom / 1px 1px repeat-x`), H = t(() => `linear-gradient(${K.value}, ${K.value}) center bottom / 100% 100% repeat-x`);
-    t(() => M.value);
-    const Y = t(() => q.value), I = t(() => te.value), P = t(() => `linear-gradient(${O.value}, ${O.value}) center bottom / 1px 1px repeat-x`), S = t(() => `linear-gradient(${T.value}, ${T.value}) center bottom / 100% 100% repeat-x`);
-    t(() => C.value);
-    const r = t(() => {
-      const d = {};
-      h.value && Object.keys(h.value).forEach((A) => d[`aria-${A}`] = h.value[A]);
-      const n = {
-        "aria-label": Z.value,
+    }), I = t(() => B.value.font), w = t(() => O.value === "dark" ? "component__theme--dark" : "component__theme--light"), W = t(() => F.value), X = t(() => G.value), u = t(() => `linear-gradient(${Y.value}, ${Y.value}) center bottom / 1px 1px repeat-x`), $ = t(() => `linear-gradient(${M.value}, ${M.value}) center bottom / 100% 100% repeat-x`);
+    t(() => Q.value);
+    const j = t(() => q.value), N = t(() => P.value), H = t(() => `linear-gradient(${L.value}, ${L.value}) center bottom / 1px 1px repeat-x`), K = t(() => `linear-gradient(${S.value}, ${S.value}) center bottom / 100% 100% repeat-x`);
+    t(() => V.value);
+    const h = t(() => {
+      const o = {};
+      g.value && Object.keys(g.value).forEach((k) => o[`aria-${k}`] = g.value[k]);
+      const r = {
+        "aria-label": J.value,
         "aria-disabled": f.value,
-        ...d
+        ...o
       };
       return Object.fromEntries(
-        Object.entries(n).filter(([c, A]) => A != null)
+        Object.entries(r).filter(([s, k]) => k != null)
       );
-    }), i = () => {
-      j("clicked");
+    }), d = () => {
+      E("clicked");
     };
-    return (d, n) => e.nbId ? (fe(), ve("div", Se({
+    return (o, r) => e.nbId ? (ce(), fe("div", Ce({
       key: 0,
-      class: ["nb-wrapper", U.value],
-      style: [F.value],
+      class: ["nb-wrapper", _.value],
+      style: [Z.value],
       tabIndex: e.tabIndex,
       role: "button"
-    }, r.value, {
-      onClick: i,
+    }, h.value, {
+      onClick: d,
       onKeydown: [
-        n[0] || (n[0] = W(L((c) => !o(f) && e.hasTabIndexEnter && i(), ["prevent"]), ["enter"])),
-        n[1] || (n[1] = W(L((c) => !o(f) && e.hasTabIndexSpace && i(), ["prevent"]), ["space"]))
+        r[0] || (r[0] = A(D((s) => !n(f) && e.hasTabIndexEnter && d(), ["prevent"]), ["enter"])),
+        r[1] || (r[1] = A(D((s) => !n(f) && e.hasTabIndexSpace && d(), ["prevent"]), ["space"]))
       ]
     }), [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset component", [z.value]]),
-        style: se([w.value])
+        class: be(["nb-reset component", [w.value]]),
+        style: ie([R.value])
       }, [
-        he(d.$slots, "content", {}, () => [
-          n[2] || (n[2] = Ce("Default Text"))
+        me(o.$slots, "content", {}, () => [
+          r[2] || (r[2] = he("Default Text"))
         ], !0)
       ], 14, $a)
-    ], 16, wa)) : ye("", !0);
+    ], 16, Ia)) : ge("", !0);
   }
-}), _a = /* @__PURE__ */ ke(Ia, [["__scopeId", "data-v-5a8db575"]]);
+}), _a = /* @__PURE__ */ Be(wa, [["__scopeId", "data-v-83708b7e"]]);
 const Da = ["id"], Na = ["disabled", "aria-label", "aria-haspopup", "aria-expanded", "tabindex"], Ha = ["aria-expanded", "title", "tabindex"], Aa = ["disabled", "tabindex", "onClick", "onKeydown"], La = {
   key: 0,
   class: "split-button__menu-item-icon"
-}, Oa = { class: "split-button__menu-item-text" }, Wa = /* @__PURE__ */ Object.assign({
+}, Oa = { class: "split-button__menu-item-text" }, Ra = /* @__PURE__ */ Object.assign({
   name: "NbButtonSplitDropdown",
   inheritAttrs: !1
 }, {
@@ -3770,74 +3721,74 @@ const Da = ["id"], Na = ["disabled", "aria-label", "aria-haspopup", "aria-expand
   },
   emits: ["clicked", "main-clicked", "menu-item-clicked"],
   setup(e, { emit: l }) {
-    xe((a) => ({
-      "8f9d7e60": ge.value.font,
-      "5798d4ef": o(J),
-      "5274eb26": o(S),
-      "6b8b8e3e": o(n),
-      a05be326: o(p),
-      "0c7b4c5f": o(g),
-      c5ebe92a: o(r)
+    Se((a) => ({
+      "8f9d7e60": ye.value.font,
+      "5798d4ef": n(ue),
+      "5274eb26": n(h),
+      "6b8b8e3e": n(s),
+      a05be326: n(T),
+      "0c7b4c5f": n(u),
+      c5ebe92a: n(d)
     }));
-    const j = l, ae = e, {
-      display: Q,
-      mainButtonText: Z,
-      mainButtonAriaLabel: h,
-      menuItems: R,
-      popupButtonTitle: E,
-      ariaLabel: ee,
-      ariaAttrs: X,
-      menuItemFocusOutlineColor: K,
-      menuItemFocusOutlineWidth: M,
+    const E = l, te = e, {
+      display: U,
+      mainButtonText: J,
+      mainButtonAriaLabel: g,
+      menuItems: O,
+      popupButtonTitle: F,
+      ariaLabel: G,
+      ariaAttrs: Y,
+      menuItemFocusOutlineColor: M,
+      menuItemFocusOutlineWidth: Q,
       menuItemFocusOutlineOffset: q,
-      showBorder: te,
-      showPopupButton: O,
-      borderRadius: T,
-      popupBorderRadius: C,
-      width: B,
-      paddingX: v,
-      paddingY: m,
-      popupPaddingX: f,
+      showBorder: P,
+      showPopupButton: L,
+      borderRadius: S,
+      popupBorderRadius: V,
+      width: y,
+      paddingX: c,
+      paddingY: f,
+      popupPaddingX: m,
       popupPaddingY: b,
-      disabled: u,
-      fontFamily: V,
-      fontSize: k,
-      fontWeight: N,
-      popupFontFamily: U,
-      popupFontSize: F,
-      popupFontWeight: w,
-      theme: $,
-      lightButtonColor: z,
-      lightButtonColorHover: G,
-      lightTextColor: g,
-      lightTextColorHover: s,
-      lightBorderColor: H,
-      lightBorderColorHover: Y,
-      lightPopupBgColor: I,
-      lightMenuItemHoverColor: P,
-      lightMenuItemTextColor: S,
-      lightDisabledBgColor: r,
-      darkButtonColor: i,
-      darkButtonColorHover: d,
-      darkTextColor: n,
-      darkTextColorHover: c,
-      darkBorderColor: A,
-      darkBorderColorHover: oe,
-      darkPopupBgColor: ie,
-      darkMenuItemHoverColor: be,
-      darkMenuItemTextColor: J,
-      darkDisabledBgColor: p
-    } = Be(ae), y = Te(!1), le = Te(null), D = Te(null), _ = Te(null), ue = Te(null), ne = Te(-1), me = Te(!1), ge = t(() => {
-      const a = u.value ? "component-disabled" : "", x = Q.value !== "b" ? "inline-block" : "block", re = T.value !== 0 && !T.value || T.value < 0 ? 0 : T.value, ce = C.value !== null && C.value !== void 0 ? C.value < 0 ? 0 : C.value : re, Ve = [!1, !0].includes(te.value) ? te.value : !0, we = [!1, !0].includes(O.value) ? O.value : !0, $e = K.value || "currentColor", He = M.value || "2px", Xe = q.value || "-2px", Ke = v.value !== 0 && !v.value || v.value < 0 ? 1 : v.value, Me = m.value !== 0 && !m.value || m.value < 0 ? 0.32 : m.value, ct = f.value !== null && f.value !== void 0 ? f.value < 0 ? 1 : f.value : Ke, ft = b.value !== null && b.value !== void 0 ? b.value < 0 ? 0.2 : b.value : Me, qe = V.value ? V.value : "'Lato', sans-serif", Ue = k.value ? k.value : "1.6em", Ge = N.value !== 0 && !N.value || N.value < 0 ? 400 : N.value, vt = U.value || qe, pt = F.value || Ue, bt = w.value !== null && w.value !== void 0 ? w.value < 0 ? 400 : w.value : Ge, gt = $.value ? $.value : "light";
+      disabled: i,
+      fontFamily: x,
+      fontSize: B,
+      fontWeight: _,
+      popupFontFamily: Z,
+      popupFontSize: R,
+      popupFontWeight: I,
+      theme: w,
+      lightButtonColor: W,
+      lightButtonColorHover: X,
+      lightTextColor: u,
+      lightTextColorHover: $,
+      lightBorderColor: j,
+      lightBorderColorHover: N,
+      lightPopupBgColor: H,
+      lightMenuItemHoverColor: K,
+      lightMenuItemTextColor: h,
+      lightDisabledBgColor: d,
+      darkButtonColor: o,
+      darkButtonColorHover: r,
+      darkTextColor: s,
+      darkTextColorHover: k,
+      darkBorderColor: ee,
+      darkBorderColorHover: re,
+      darkPopupBgColor: ve,
+      darkMenuItemHoverColor: oe,
+      darkMenuItemTextColor: ue,
+      darkDisabledBgColor: T
+    } = xe(te), p = Te(!1), de = Te(null), v = Te(null), z = Te(null), pe = Te(null), ae = Te(-1), Ve = Te(!1), ye = t(() => {
+      const a = i.value ? "component-disabled" : "", C = U.value !== "b" ? "inline-block" : "block", le = S.value !== 0 && !S.value || S.value < 0 ? 0 : S.value, se = V.value !== null && V.value !== void 0 ? V.value < 0 ? 0 : V.value : le, ke = [!1, !0].includes(P.value) ? P.value : !0, Ie = [!1, !0].includes(L.value) ? L.value : !0, $e = M.value || "currentColor", De = Q.value || "2px", Xe = q.value || "-2px", Ke = c.value !== 0 && !c.value || c.value < 0 ? 1 : c.value, Me = f.value !== 0 && !f.value || f.value < 0 ? 0.32 : f.value, ct = m.value !== null && m.value !== void 0 ? m.value < 0 ? 1 : m.value : Ke, ft = b.value !== null && b.value !== void 0 ? b.value < 0 ? 0.2 : b.value : Me, qe = x.value ? x.value : "'Lato', sans-serif", Ue = B.value ? B.value : "1.6em", Ge = _.value !== 0 && !_.value || _.value < 0 ? 400 : _.value, vt = Z.value || qe, pt = R.value || Ue, bt = I.value !== null && I.value !== void 0 ? I.value < 0 ? 400 : I.value : Ge, gt = w.value ? w.value : "light";
       return {
         disabled: a,
-        display: x,
-        showBorder: Ve,
-        showPopupButton: we,
-        borderRadius: re,
-        popupBorderRadius: ce,
+        display: C,
+        showBorder: ke,
+        showPopupButton: Ie,
+        borderRadius: le,
+        popupBorderRadius: se,
         menuItemFocusOutlineColor: $e,
-        menuItemFocusOutlineWidth: He,
+        menuItemFocusOutlineWidth: De,
         menuItemFocusOutlineOffset: Xe,
         paddingX: Ke,
         paddingY: Me,
@@ -3851,93 +3802,93 @@ const Da = ["id"], Na = ["disabled", "aria-label", "aria-haspopup", "aria-expand
         popupFontWeight: bt,
         theme: gt
       };
-    }), Ie = t(() => {
-      switch (ge.value.theme) {
+    }), we = t(() => {
+      switch (ye.value.theme) {
         case "dark":
           return "component__theme--dark";
         default:
           return "component__theme--light";
       }
-    }), _e = t(() => ge.value.disabled), De = t(() => ({
-      display: ge.value.display
-    })), Ne = t(() => {
-      const a = ge.value, x = a.display === "block" ? {} : { width: B.value ? `${B.value}px` : "auto" };
+    }), _e = t(() => ye.value.disabled), Oe = t(() => ({
+      display: ye.value.display
+    })), Re = t(() => {
+      const a = ye.value, C = a.display === "block" ? {} : { width: y.value ? `${y.value}px` : "auto" };
       return {
         borderRadius: `${a.borderRadius}rem`,
         overflow: "visible",
         position: "relative",
-        ...x
+        ...C
       };
-    }), Re = t(() => {
-      const a = ge.value, x = B.value ? `${B.value}px` : "auto", re = a.showPopupButton ? {
+    }), We = t(() => {
+      const a = ye.value, C = y.value ? `${y.value}px` : "auto", le = a.showPopupButton ? {
         borderTopLeftRadius: `${a.borderRadius}rem`,
         borderBottomLeftRadius: `${a.borderRadius}rem`,
         borderTopRightRadius: "0",
         borderBottomRightRadius: "0"
       } : {
         borderRadius: `${a.borderRadius}rem`
-      }, ce = a.showBorder ? a.showPopupButton ? {
-        borderTop: `1px solid ${a.theme === "dark" ? A.value : H.value}`,
-        borderBottom: `1px solid ${a.theme === "dark" ? A.value : H.value}`,
-        borderLeft: `1px solid ${a.theme === "dark" ? A.value : H.value}`,
+      }, se = a.showBorder ? a.showPopupButton ? {
+        borderTop: `1px solid ${a.theme === "dark" ? ee.value : j.value}`,
+        borderBottom: `1px solid ${a.theme === "dark" ? ee.value : j.value}`,
+        borderLeft: `1px solid ${a.theme === "dark" ? ee.value : j.value}`,
         borderRight: "none"
       } : {
-        border: `1px solid ${a.theme === "dark" ? A.value : H.value}`
-      } : { border: "none" }, Ve = a.theme === "dark" ? i.value : z.value, we = a.theme === "dark" ? n.value : g.value, $e = a.theme === "dark" ? d.value : G.value, He = a.theme === "dark" ? c.value : s.value, Xe = a.theme === "dark" ? oe.value : Y.value;
+        border: `1px solid ${a.theme === "dark" ? ee.value : j.value}`
+      } : { border: "none" }, ke = a.theme === "dark" ? o.value : W.value, Ie = a.theme === "dark" ? s.value : u.value, $e = a.theme === "dark" ? r.value : X.value, De = a.theme === "dark" ? k.value : $.value, Xe = a.theme === "dark" ? re.value : N.value;
       return {
-        color: we,
-        backgroundColor: Ve,
+        color: Ie,
+        backgroundColor: ke,
         padding: `${a.paddingY}rem ${a.paddingX}rem`,
         lineHeight: "1.42857143",
         fontSize: a.fontSize,
         fontWeight: a.fontWeight,
         fontFamily: a.font,
-        ...ce,
-        ...re,
-        minWidth: x === "auto" ? "33px" : x,
+        ...se,
+        ...le,
+        minWidth: C === "auto" ? "33px" : C,
         "--main-button-hover-color": $e,
         "--main-button-active-color": $e,
-        "--main-text-hover-color": He,
+        "--main-text-hover-color": De,
         "--main-border-hover-color": Xe
       };
     }), Je = t(() => {
-      const a = ge.value, x = a.theme === "dark" ? A.value : H.value, re = a.showBorder ? {
-        borderTop: `1px solid ${x}`,
-        borderBottom: `1px solid ${x}`,
-        borderRight: `1px solid ${x}`,
-        borderLeft: `1px solid ${x}`
-      } : { border: "none" }, ce = a.theme === "dark" ? i.value : z.value, Ve = a.theme === "dark" ? n.value : g.value, we = a.theme === "dark" ? d.value : G.value, $e = a.theme === "dark" ? c.value : s.value, He = a.theme === "dark" ? oe.value : Y.value;
+      const a = ye.value, C = a.theme === "dark" ? ee.value : j.value, le = a.showBorder ? {
+        borderTop: `1px solid ${C}`,
+        borderBottom: `1px solid ${C}`,
+        borderRight: `1px solid ${C}`,
+        borderLeft: `1px solid ${C}`
+      } : { border: "none" }, se = a.theme === "dark" ? o.value : W.value, ke = a.theme === "dark" ? s.value : u.value, Ie = a.theme === "dark" ? r.value : X.value, $e = a.theme === "dark" ? k.value : $.value, De = a.theme === "dark" ? re.value : N.value;
       return {
-        color: Ve,
-        backgroundColor: ce,
+        color: ke,
+        backgroundColor: se,
         padding: `${a.paddingY}rem ${a.paddingX * 0.5}rem`,
         fontSize: a.fontSize,
         fontWeight: a.fontWeight,
         fontFamily: a.font,
-        ...re,
+        ...le,
         borderTopRightRadius: `${a.borderRadius}rem`,
         borderBottomRightRadius: `${a.borderRadius}rem`,
         borderTopLeftRadius: "0",
         borderBottomLeftRadius: "0",
-        "--popup-button-hover-color": we,
-        "--popup-button-active-color": we,
+        "--popup-button-hover-color": Ie,
+        "--popup-button-active-color": Ie,
         "--popup-text-hover-color": $e,
-        "--popup-border-hover-color": He
+        "--popup-border-hover-color": De
       };
     }), Qe = t(() => {
-      const a = ge.value, x = a.theme === "dark" ? ie.value : I.value, re = a.theme === "dark" ? J.value : S.value, ce = a.theme === "dark" ? be.value : P.value;
+      const a = ye.value, C = a.theme === "dark" ? ve.value : H.value, le = a.theme === "dark" ? ue.value : h.value, se = a.theme === "dark" ? oe.value : K.value;
       return {
-        backgroundColor: x,
-        color: re,
+        backgroundColor: C,
+        color: le,
         borderRadius: `${a.popupBorderRadius}rem`,
         boxShadow: "0 2px 8px rgba(0, 0, 0, 0.15)",
-        minHeight: R.value.length === 0 ? "40px" : "auto",
-        "--menu-item-hover-color": ce,
+        minHeight: O.value.length === 0 ? "40px" : "auto",
+        "--menu-item-hover-color": se,
         "--menu-item-focus-outline-color": a.menuItemFocusOutlineColor,
         "--menu-item-focus-outline-width": a.menuItemFocusOutlineWidth,
         "--menu-item-focus-outline-offset": a.menuItemFocusOutlineOffset
       };
-    }), Ze = t(() => ge.value.popupFont), et = t(() => ge.value.popupFontSize), tt = t(() => ge.value.popupFontWeight), at = t(() => ge.value.popupPaddingX), lt = t(() => ge.value.popupPaddingY), ot = t(() => ({
+    }), Ze = t(() => ye.value.popupFont), et = t(() => ye.value.popupFontSize), tt = t(() => ye.value.popupFontWeight), at = t(() => ye.value.popupPaddingX), lt = t(() => ye.value.popupPaddingY), ot = t(() => ({
       fontSize: et.value,
       fontWeight: tt.value,
       fontFamily: Ze.value,
@@ -3945,187 +3896,187 @@ const Da = ["id"], Na = ["disabled", "aria-label", "aria-haspopup", "aria-expand
     }));
     t(() => {
       const a = {};
-      X.value && Object.keys(X.value).forEach((ce) => a[`aria-${ce}`] = X.value[ce]);
-      const x = {
-        "aria-label": ee.value,
-        "aria-disabled": u.value,
+      Y.value && Object.keys(Y.value).forEach((se) => a[`aria-${se}`] = Y.value[se]);
+      const C = {
+        "aria-label": G.value,
+        "aria-disabled": i.value,
         ...a
       };
       return Object.fromEntries(
-        Object.entries(x).filter(([re, ce]) => ce != null)
+        Object.entries(C).filter(([le, se]) => se != null)
       );
     });
     const nt = () => {
       document.dispatchEvent(new CustomEvent("splitbutton:close-all", {
-        detail: { excludeId: ae.nbId }
+        detail: { excludeId: te.nbId }
       }));
     }, Fe = (a) => {
-      var x;
-      ((x = a.detail) == null ? void 0 : x.excludeId) !== ae.nbId && y.value && (y.value = !1, ne.value = -1, _.value && _.value.setAttribute("aria-expanded", "false"));
-    }, Ae = () => {
-      u.value || (y.value || nt(), me.value = !0, y.value = !y.value, y.value ? Oe(() => {
-        if (ue.value) {
-          const a = ue.value.querySelectorAll("button:not([disabled])");
+      var C;
+      ((C = a.detail) == null ? void 0 : C.excludeId) !== te.nbId && p.value && (p.value = !1, ae.value = -1, z.value && z.value.setAttribute("aria-expanded", "false"));
+    }, Ne = () => {
+      i.value || (p.value || nt(), Ve.value = !0, p.value = !p.value, p.value ? Ae(() => {
+        if (pe.value) {
+          const a = pe.value.querySelectorAll("button:not([disabled])");
           if (a && a.length > 0) {
-            const x = document.activeElement;
-            (x === _.value || x === D.value) && a[0].focus(), ne.value = 0;
+            const C = document.activeElement;
+            (C === z.value || C === v.value) && a[0].focus(), ae.value = 0;
           }
         }
         setTimeout(() => {
-          me.value = !1;
+          Ve.value = !1;
         }, 10);
-      }) : (ne.value = -1, me.value = !1));
+      }) : (ae.value = -1, Ve.value = !1));
     }, ze = () => {
-      if (!u.value) {
-        if (!O.value && R.value.length > 0) {
-          Ae();
+      if (!i.value) {
+        if (!L.value && O.value.length > 0) {
+          Ne();
           return;
         }
-        j("main-clicked"), j("clicked", { type: "main" });
+        E("main-clicked"), E("clicked", { type: "main" });
       }
-    }, Ye = (a, x) => {
-      a.disabled || u.value || (j("menu-item-clicked", { item: a, index: x }), j("clicked", { type: "menu-item", item: a, index: x }), y.value = !1, ne.value = -1);
+    }, Ye = (a, C) => {
+      a.disabled || i.value || (E("menu-item-clicked", { item: a, index: C }), E("clicked", { type: "menu-item", item: a, index: C }), p.value = !1, ae.value = -1);
     }, rt = () => {
-      _.value && _.value.setAttribute("aria-expanded", "true");
+      z.value && z.value.setAttribute("aria-expanded", "true");
     }, ut = (a) => {
-      var x;
-      ue.value && !ue.value.contains(a.relatedTarget) && !((x = le.value) != null && x.contains(a.relatedTarget)) && (_.value && _.value.setAttribute("aria-expanded", "false"), y.value = !1, ne.value = -1);
+      var C;
+      pe.value && !pe.value.contains(a.relatedTarget) && !((C = de.value) != null && C.contains(a.relatedTarget)) && (z.value && z.value.setAttribute("aria-expanded", "false"), p.value = !1, ae.value = -1);
     }, dt = (a) => {
-      var x;
-      y.value && !((x = le.value) != null && x.contains(a.relatedTarget)) && (y.value = !1, ne.value = -1, _.value && _.value.setAttribute("aria-expanded", "false"));
-    }, Le = (a) => {
-      (a.code === "Escape" || a.code === "Backspace") && y.value && (y.value = !1, ne.value = -1, !O.value && D.value ? D.value.focus() : _.value && _.value.focus());
+      var C;
+      p.value && !((C = de.value) != null && C.contains(a.relatedTarget)) && (p.value = !1, ae.value = -1, z.value && z.value.setAttribute("aria-expanded", "false"));
+    }, He = (a) => {
+      (a.code === "Escape" || a.code === "Backspace") && p.value && (p.value = !1, ae.value = -1, !L.value && v.value ? v.value.focus() : z.value && z.value.focus());
     }, it = (a) => {
-      a > 0 && (ne.value = a - 1, Oe(() => {
-        var re;
-        const x = (re = ue.value) == null ? void 0 : re.querySelectorAll("button:not([disabled])");
-        x && x[ne.value] && x[ne.value].focus();
+      a > 0 && (ae.value = a - 1, Ae(() => {
+        var le;
+        const C = (le = pe.value) == null ? void 0 : le.querySelectorAll("button:not([disabled])");
+        C && C[ae.value] && C[ae.value].focus();
       }));
     }, st = (a) => {
-      var re;
-      const x = (re = ue.value) == null ? void 0 : re.querySelectorAll("button:not([disabled])");
-      x && a < x.length - 1 && (ne.value = a + 1, Oe(() => {
-        x[ne.value] && x[ne.value].focus();
+      var le;
+      const C = (le = pe.value) == null ? void 0 : le.querySelectorAll("button:not([disabled])");
+      C && a < C.length - 1 && (ae.value = a + 1, Ae(() => {
+        C[ae.value] && C[ae.value].focus();
       }));
     }, Pe = (a) => {
-      var ce, Ve;
-      if (me.value || !y.value || (ce = le.value) != null && ce.contains(a.target))
+      var se, ke;
+      if (Ve.value || !p.value || (se = de.value) != null && se.contains(a.target))
         return;
-      const x = a.target;
-      ((Ve = x.closest) == null ? void 0 : Ve.call(x, ".nb-split-button")) !== le.value && (y.value = !1, ne.value = -1, _.value && _.value.setAttribute("aria-expanded", "false"));
+      const C = a.target;
+      ((ke = C.closest) == null ? void 0 : ke.call(C, ".nb-split-button")) !== de.value && (p.value = !1, ae.value = -1, z.value && z.value.setAttribute("aria-expanded", "false"));
     };
     return Ee(() => {
-      Oe(() => {
+      Ae(() => {
         document.addEventListener("click", Pe, !1), document.addEventListener("splitbutton:close-all", Fe);
       });
     }), mt(() => {
       document.removeEventListener("click", Pe, !1), document.removeEventListener("splitbutton:close-all", Fe);
-    }), (a, x) => e.nbId ? (fe(), ve("div", {
+    }), (a, C) => e.nbId ? (ce(), fe("div", {
       key: 0,
       ref_key: "wrapperRef",
-      ref: le,
-      class: pe(["nb-wrapper", "nb-split-button", _e.value]),
-      style: se([De.value]),
+      ref: de,
+      class: be(["nb-wrapper", "nb-split-button", _e.value]),
+      style: ie([Oe.value]),
       onFocusout: dt
     }, [
-      de("div", {
+      ne("div", {
         id: e.nbId,
-        class: pe(["nb-reset", "component", { "component--block": o(Q) === "b" }, Ie.value]),
-        style: se([Ne.value])
+        class: be(["nb-reset", "component", { "component--block": n(U) === "b" }, we.value]),
+        style: ie([Re.value])
       }, [
-        de("button", {
+        ne("button", {
           ref_key: "mainButtonRef",
-          ref: D,
-          class: pe(["split-button__main", { "split-button__main--disabled": o(u) }]),
-          style: se([Re.value]),
-          disabled: o(u),
-          "aria-label": o(h),
-          "aria-haspopup": !o(O) && o(R).length > 0,
-          "aria-expanded": o(O) ? void 0 : y.value,
-          tabindex: o(u) ? -1 : 0,
-          onClick: L(ze, ["stop"]),
+          ref: v,
+          class: be(["split-button__main", { "split-button__main--disabled": n(i) }]),
+          style: ie([We.value]),
+          disabled: n(i),
+          "aria-label": n(g),
+          "aria-haspopup": !n(L) && n(O).length > 0,
+          "aria-expanded": n(L) ? void 0 : p.value,
+          tabindex: n(i) ? -1 : 0,
+          onClick: D(ze, ["stop"]),
           onKeydown: [
-            x[0] || (x[0] = W(L((re) => !o(u) && e.hasTabIndexEnter && ze(), ["prevent"]), ["enter"])),
-            x[1] || (x[1] = W(L((re) => !o(u) && e.hasTabIndexSpace && ze(), ["prevent"]), ["space"]))
+            C[0] || (C[0] = A(D((le) => !n(i) && e.hasTabIndexEnter && ze(), ["prevent"]), ["enter"])),
+            C[1] || (C[1] = A(D((le) => !n(i) && e.hasTabIndexSpace && ze(), ["prevent"]), ["space"]))
           ]
         }, [
-          he(a.$slots, "main-content", {}, () => [
-            Ce(We(o(Z)), 1)
+          me(a.$slots, "main-content", {}, () => [
+            he(Le(n(J)), 1)
           ], !0)
         ], 46, Na),
-        o(O) ? (fe(), ve("span", {
+        n(L) ? (ce(), fe("span", {
           key: 0,
           ref_key: "popupButtonRef",
-          ref: _,
-          class: pe(["split-button__popup-button", { "split-button__popup-button--open": y.value }]),
-          style: se([Je.value]),
+          ref: z,
+          class: be(["split-button__popup-button", { "split-button__popup-button--open": p.value }]),
+          style: ie([Je.value]),
           "aria-haspopup": !0,
-          "aria-expanded": y.value,
-          title: o(E),
-          tabindex: o(u) ? -1 : 0,
-          onClick: L(Ae, ["stop"]),
+          "aria-expanded": p.value,
+          title: n(F),
+          tabindex: n(i) ? -1 : 0,
+          onClick: D(Ne, ["stop"]),
           onFocusin: rt,
           onFocusout: ut,
           onKeydown: [
-            x[2] || (x[2] = W(L((re) => !o(u) && Ae(), ["prevent"]), ["enter"])),
-            x[3] || (x[3] = W(L((re) => !o(u) && Ae(), ["prevent"]), ["space"]))
+            C[2] || (C[2] = A(D((le) => !n(i) && Ne(), ["prevent"]), ["enter"])),
+            C[3] || (C[3] = A(D((le) => !n(i) && Ne(), ["prevent"]), ["space"]))
           ],
           onKeyup: [
-            W(Le, ["escape"]),
-            W(Le, ["backspace"])
+            A(He, ["escape"]),
+            A(He, ["backspace"])
           ]
         }, [
-          he(a.$slots, "popup-icon", {}, () => [
-            (fe(), ve("svg", {
-              class: pe(["split-button__icon", { "split-button__icon--open": y.value }]),
+          me(a.$slots, "popup-icon", {}, () => [
+            (ce(), fe("svg", {
+              class: be(["split-button__icon", { "split-button__icon--open": p.value }]),
               viewBox: "0 0 24 24",
               fill: "none",
               stroke: "currentColor",
               "stroke-width": "2"
-            }, x[4] || (x[4] = [
-              de("polyline", { points: "6 9 12 15 18 9" }, null, -1)
+            }, C[4] || (C[4] = [
+              ne("polyline", { points: "6 9 12 15 18 9" }, null, -1)
             ]), 2))
           ], !0)
-        ], 46, Ha)) : ye("", !0),
-        y.value ? (fe(), ve("div", {
+        ], 46, Ha)) : ge("", !0),
+        p.value ? (ce(), fe("div", {
           key: 1,
           ref_key: "popupRef",
-          ref: ue,
-          class: pe(["split-button__popup", { "split-button__popup--open": y.value }]),
-          style: se([Qe.value])
+          ref: pe,
+          class: be(["split-button__popup", { "split-button__popup--open": p.value }]),
+          style: ie([Qe.value])
         }, [
-          (fe(!0), ve(ht, null, Ct(o(R), (re, ce) => (fe(), ve("button", {
-            key: ce,
-            class: pe(["split-button__menu-item", { "split-button__menu-item--disabled": re.disabled }]),
-            style: se([ot.value]),
-            disabled: re.disabled || o(u),
-            tabindex: re.disabled || o(u) ? -1 : 0,
-            onClick: L((Ve) => Ye(re, ce), ["stop"]),
+          (ce(!0), fe(ht, null, Ct(n(O), (le, se) => (ce(), fe("button", {
+            key: se,
+            class: be(["split-button__menu-item", { "split-button__menu-item--disabled": le.disabled }]),
+            style: ie([ot.value]),
+            disabled: le.disabled || n(i),
+            tabindex: le.disabled || n(i) ? -1 : 0,
+            onClick: D((ke) => Ye(le, se), ["stop"]),
             onKeydown: [
-              W(L((Ve) => !re.disabled && !o(u) && Ye(re, ce), ["prevent"]), ["enter"]),
-              W(L((Ve) => !re.disabled && !o(u) && Ye(re, ce), ["prevent"]), ["space"]),
-              W(L((Ve) => it(ce), ["prevent"]), ["arrow-up"]),
-              W(L((Ve) => st(ce), ["prevent"]), ["arrow-down"]),
-              W(L(Le, ["prevent"]), ["escape"]),
-              W(L(Le, ["prevent"]), ["backspace"])
+              A(D((ke) => !le.disabled && !n(i) && Ye(le, se), ["prevent"]), ["enter"]),
+              A(D((ke) => !le.disabled && !n(i) && Ye(le, se), ["prevent"]), ["space"]),
+              A(D((ke) => it(se), ["prevent"]), ["arrow-up"]),
+              A(D((ke) => st(se), ["prevent"]), ["arrow-down"]),
+              A(D(He, ["prevent"]), ["escape"]),
+              A(D(He, ["prevent"]), ["backspace"])
             ]
           }, [
-            re.icon ? (fe(), ve("span", La, [
-              he(a.$slots, `item-icon-${ce}`, { item: re }, () => [
-                Ce(We(re.icon), 1)
+            le.icon ? (ce(), fe("span", La, [
+              me(a.$slots, `item-icon-${se}`, { item: le }, () => [
+                he(Le(le.icon), 1)
               ], !0)
-            ])) : ye("", !0),
-            de("span", Oa, We(re.label), 1)
+            ])) : ge("", !0),
+            ne("span", Oa, Le(le.label), 1)
           ], 46, Aa))), 128))
-        ], 6)) : ye("", !0)
+        ], 6)) : ge("", !0)
       ], 14, Da)
-    ], 38)) : ye("", !0);
+    ], 38)) : ge("", !0);
   }
-}), Ra = /* @__PURE__ */ ke(Wa, [["__scopeId", "data-v-06da0798"]]), je = {
+}), Wa = /* @__PURE__ */ Be(Ra, [["__scopeId", "data-v-06da0798"]]), je = {
   NbButtonVavaGame: Vt,
-  NbButtonShowHover: It,
+  NbButtonShowHover: wt,
   NbButtonPrevNext: At,
-  NbButtonMechanical: Rt,
+  NbButtonMechanical: Wt,
   NbButtonMechanical2: jt,
   NbButtonHamburger: Kt,
   NbButtonColorOutside: Gt,
@@ -4137,13 +4088,13 @@ const Da = ["id"], Na = ["disabled", "aria-label", "aria-haspopup", "aria-expand
   NbButtonUnderlineExpand: Ta,
   NbButtonUnderlineFill: _a,
   NbButtonGradientBorderToBackground: pa,
-  NbButtonSplitDropdown: Ra
+  NbButtonSplitDropdown: Wa
 }, Ya = {
   install(e) {
     for (const l in je)
       if (Object.prototype.hasOwnProperty.call(je, l)) {
-        const j = je[l];
-        e.component(j.name, j);
+        const E = je[l];
+        e.component(E.name, E);
       }
   }
 };