@vlalg-nimbus/nb-inputs 6.0.8 → 7.0.0

package/dist/nb-inputs.js

@@ -1,10 +1,10 @@
-import { useCssVars as oe, unref as H, onMounted as ue, ref as ne, toRefs as re, computed as l, watch as D, openBlock as E, createElementBlock as N, normalizeClass as C, normalizeStyle as F, createElementVNode as f, Fragment as se, renderList as ce, withDirectives as ie, vModelRadio as Se, toDisplayString as de, createCommentVNode as fe, vModelCheckbox as Ce } from "vue";
-const ve = (e, o) => {
-  const s = e.__vccOpts || e;
-  for (const [d, c] of o)
-    s[d] = c;
-  return s;
-}, He = ["id"], Ee = ["id", "disabled", "value", "name"], Ne = ["for"], Ge = /* @__PURE__ */ Object.assign({
+import { useCssVars as Ge, unref as l, onMounted as Ke, ref as Q, toRefs as Ue, computed as t, watch as K, openBlock as h, createElementBlock as C, normalizeClass as X, normalizeStyle as se, createElementVNode as V, mergeProps as Qe, Fragment as St, renderList as kt, withDirectives as Xe, vModelRadio as ya, withKeys as Re, withModifiers as qe, toDisplayString as Oe, createCommentVNode as ie, vModelCheckbox as ga, onUnmounted as ba, renderSlot as Me, createTextVNode as Vt, vModelDynamic as ma, vModelText as ha } from "vue";
+const Ye = (e, i) => {
+  const r = e.__vccOpts || e;
+  for (const [B, y] of i)
+    r[B] = y;
+  return r;
+}, Ca = ["id"], Va = ["id", "disabled", "value", "name"], xa = ["for", "tabindex"], Sa = /* @__PURE__ */ Object.assign({
   name: "NbInputRadio",
   inheritAttrs: !1
 }, {
@@ -18,10 +18,31 @@ const ve = (e, o) => {
       type: String,
       default: "b",
       validator: (e = "b") => {
-        const o = e ? e.toLowerCase() : "";
-        return ["b", "ib"].includes(o);
+        const i = e ? e.toLowerCase() : "";
+        return ["b", "ib"].includes(i);
       }
     },
+    tabIndex: {
+      type: [Number, Array],
+      default: 0,
+      validator: (e, i) => Array.isArray(e) ? e.length === i.options.length : !0
+    },
+    hasTabIndexEnter: {
+      type: Boolean,
+      default: !0
+    },
+    hasTabIndexSpace: {
+      type: Boolean,
+      default: !0
+    },
+    ariaLabel: {
+      type: String,
+      default: "Alternate Text Button"
+    },
+    ariaAttrs: {
+      type: Object,
+      default: () => ({})
+    },
     groupName: {
       type: String,
       default: "",
@@ -35,12 +56,12 @@ const ve = (e, o) => {
       validator: (e) => {
         if (!e.length)
           return !1;
-        let o = !1;
-        for (const s of e) {
-          const d = Object.keys(s);
-          d.length !== 2 && (o = !0), d.every((v) => ["value", "text"].includes(v)) || (o = !0);
+        let i = !1;
+        for (const r of e) {
+          const B = Object.keys(r);
+          B.length !== 2 && (i = !0), B.every((W) => ["value", "text"].includes(W)) || (i = !0);
         }
-        if (!o)
+        if (!i)
           return e;
       }
     },
@@ -107,123 +128,146 @@ const ve = (e, o) => {
       validator: (e) => e || 200
     }
   },
-  emits: ["current-value", "changed"],
-  setup(e, { emit: o }) {
-    oe((a) => ({
-      "5b350e6b": P.value,
-      "091c7c57": Z.value,
-      "288498b0": X.value,
-      "2482ccb5": H(p),
-      "7cafd2be": J.value,
-      "71206dfc": Y.value,
-      "6c28f48e": Q.value,
-      "4091f564": K.value
-    })), ue(() => {
-      j();
+  emits: ["current-value", "changed", "clicked"],
+  setup(e, { emit: i }) {
+    Ge((u) => ({
+      "2ff4bfca": ee.value,
+      "29d66636": he.value,
+      "1c590c29": ue.value,
+      "032c8a58": l(I),
+      "541cdd40": ce.value,
+      "6d04505b": fe.value,
+      "284d01cf": me.value,
+      "8cc41926": ne.value
+    })), Ke(() => {
+      pe();
     });
-    const s = o, d = e, c = ne(null), {
-      currentOption: v,
-      valueType: G,
-      display: k,
-      options: g,
-      textColor: x,
-      color: I,
-      hoverEffect: z,
-      activeHoverEffect: A,
-      colorHover: p,
-      itemGap: b,
-      internalGap: y,
-      scale: h,
-      disabled: O,
-      fontFamily: $,
-      fontSize: B,
-      fontWeight: _
-    } = re(d), i = l(() => {
-      const a = O.value ? "component-disabled" : "", n = k.value !== "b" ? "inline-block" : "block", V = $.value ? $.value : "'Lato', sans-serif", R = B.value ? B.value : "1.6em", w = !_.value || _.value < 0 ? 200 : _.value, te = x.value ? x.value : "black", q = I.value ? I.value : "#767676", t = [!1, !0].includes(z.value) ? z.value : !1, r = [!1, !0].includes(A.value) ? A.value : !1, m = p.value ? p.value : "#a6a6a6", L = !b.value || b.value < 0 ? 15 : b.value, W = !y.value || y.value < 0 ? 6 : y.value, ae = !h.value || h.value < 0 ? 1 : h.value;
+    const r = i, B = e, y = Q(null), {
+      ariaLabel: W,
+      ariaAttrs: _,
+      currentOption: H,
+      valueType: oe,
+      display: x,
+      options: F,
+      textColor: j,
+      color: U,
+      hoverEffect: P,
+      activeHoverEffect: T,
+      colorHover: I,
+      itemGap: S,
+      internalGap: k,
+      scale: w,
+      disabled: E,
+      fontFamily: Y,
+      fontSize: N,
+      fontWeight: D
+    } = Ue(B), v = t(() => {
+      const u = E.value ? "component-disabled" : "", c = x.value !== "b" ? "inline-block" : "block", $ = Y.value ? Y.value : "'Lato', sans-serif", b = N.value ? N.value : "1.6em", q = !D.value || D.value < 0 ? 200 : D.value, ve = j.value ? j.value : "black", Se = U.value ? U.value : "#767676", o = [!1, !0].includes(P.value) ? P.value : !1, d = [!1, !0].includes(T.value) ? T.value : !1, z = I.value ? I.value : "#a6a6a6", m = !S.value || S.value < 0 ? 15 : S.value, G = !k.value || k.value < 0 ? 6 : k.value, re = !w.value || w.value < 0 ? 1 : w.value;
       return {
-        disabled: a,
-        display: n,
-        textColor: te,
-        color: q,
-        hoverEffect: t,
-        activeHoverEffect: r,
-        colorHover: m,
-        itemGap: L,
-        internalGap: W,
-        scale: ae,
-        font: V,
-        fontSize: R,
-        fontWeight: w
+        disabled: u,
+        display: c,
+        textColor: ve,
+        color: Se,
+        hoverEffect: o,
+        activeHoverEffect: d,
+        colorHover: z,
+        itemGap: m,
+        internalGap: G,
+        scale: re,
+        font: $,
+        fontSize: b,
+        fontWeight: q
       };
-    }), S = l(() => i.value.disabled), u = l(() => ({
-      display: i.value.display
-    })), T = l(() => i.value.display === "inline-block" ? "component-radio__item--display-inline" : "component-radio__item--display-block"), M = l(() => {
-      const a = i.value;
+    }), J = t(() => v.value.disabled), p = t(() => ({
+      display: v.value.display
+    })), Z = t(() => v.value.display === "inline-block" ? "component-radio__item--display-inline" : "component-radio__item--display-block"), de = t(() => {
+      const u = v.value;
       return {
-        fontSize: a.fontSize,
-        fontWeight: a.fontWeight
+        fontSize: u.fontSize,
+        fontWeight: u.fontWeight
       };
-    }), U = l(() => Array.isArray(g.value) && g.value.constructor === Array && g.value.length > 0), P = l(() => i.value.font), J = l(() => i.value.textColor), K = l(() => i.value.color), Q = l(() => {
-      const a = i.value;
-      return a.hoverEffect ? a.colorHover : a.color;
-    }), X = l(() => {
-      const a = i.value;
-      return a.activeHoverEffect ? a.colorHover : a.color;
-    }), Y = l(() => {
-      const n = i.value.internalGap;
-      return !n || n < 0 ? 0 : `${n}px`;
-    }), Z = l(() => {
-      const n = i.value.itemGap;
-      return !n || n < 0 ? 0 : `${n}px`;
-    }), ee = l(() => ({
-      zoom: i.value.scale
-    })), j = () => {
-      const a = v.value;
-      a && ["string"].includes(G.value) ? c.value = a.toString().toLowerCase() : c.value = a;
+    }), R = t(() => Array.isArray(F.value) && F.value.constructor === Array && F.value.length > 0), ee = t(() => v.value.font), ce = t(() => v.value.textColor), ne = t(() => v.value.color), me = t(() => {
+      const u = v.value;
+      return u.hoverEffect ? u.colorHover : u.color;
+    }), ue = t(() => {
+      const u = v.value;
+      return u.activeHoverEffect ? u.colorHover : u.color;
+    }), fe = t(() => {
+      const c = v.value.internalGap;
+      return !c || c < 0 ? 0 : `${c}px`;
+    }), he = t(() => {
+      const c = v.value.itemGap;
+      return !c || c < 0 ? 0 : `${c}px`;
+    }), Ce = t(() => ({
+      zoom: v.value.scale
+    })), Ve = t(() => {
+      const u = {};
+      _.value && Object.keys(_.value).forEach((b) => u[`aria-${b}`] = _.value[b]);
+      const c = {
+        "aria-label": W.value,
+        "aria-disabled": E.value,
+        ...u
+      };
+      return Object.fromEntries(
+        Object.entries(c).filter(([$, b]) => b != null)
+      );
+    }), pe = () => {
+      const u = H.value;
+      u && ["string"].includes(oe.value) ? y.value = u.toString().toLowerCase() : y.value = u;
+    }, xe = () => {
+      r("clicked");
     };
-    return D(v, (a, n) => {
-      a !== n && j();
-    }), D(c, (a, n) => {
-      a !== n && (s("current-value", a), s("changed", a));
-    }), (a, n) => e.nbId && U.value ? (E(), N("div", {
+    return K(H, (u, c) => {
+      u !== c && pe();
+    }), K(y, (u, c) => {
+      u !== c && (r("current-value", u), r("changed", u));
+    }), (u, c) => e.nbId && R.value ? (h(), C("div", {
       key: 0,
-      class: C(["nb-wrapper", S.value]),
-      style: F([u.value, ee.value])
+      class: X(["nb-wrapper", J.value]),
+      style: se([p.value, Ce.value])
     }, [
-      f("div", {
+      V("div", Qe({
         id: e.nbId,
-        class: C(["nb-reset", "component", T.value])
-      }, [
-        (E(!0), N(se, null, ce(H(g), (V, R) => (E(), N("div", {
-          key: R,
+        role: "radiogroup"
+      }, Ve.value, {
+        class: ["nb-reset", "component", Z.value]
+      }), [
+        (h(!0), C(St, null, kt(l(F), ($, b) => (h(), C("div", {
+          key: b,
           class: "component-radio__item"
         }, [
-          ie(f("input", {
-            id: `${e.nbId}-${V.value}`,
-            "onUpdate:modelValue": n[0] || (n[0] = (w) => c.value = w),
+          Xe(V("input", {
+            id: `${e.nbId}-${$.value}`,
+            "onUpdate:modelValue": c[0] || (c[0] = (q) => y.value = q),
             type: "radio",
             class: "component-radio__item--input",
-            disabled: H(O),
-            value: V.value,
-            name: e.groupName
-          }, null, 8, Ee), [
-            [Se, c.value]
+            disabled: l(E),
+            value: $.value,
+            name: e.groupName,
+            onClick: xe
+          }, null, 8, Va), [
+            [ya, y.value]
           ]),
-          f("label", {
-            for: `${e.nbId}-${V.value}`,
-            class: "component-radio__item--label"
+          V("label", {
+            for: `${e.nbId}-${$.value}`,
+            tabindex: l(E) ? -1 : Array.isArray(e.tabIndex) ? e.tabIndex[b] : e.tabIndex >= 0 ? e.tabIndex : b + 1,
+            class: "component-radio__item--label",
+            onKeydown: [
+              c[1] || (c[1] = Re(qe((q) => !l(E) && e.hasTabIndexEnter && q.target.click(), ["prevent"]), ["enter"])),
+              c[2] || (c[2] = Re(qe((q) => !l(E) && e.hasTabIndexSpace && q.target.click(), ["prevent"]), ["space"]))
+            ]
           }, [
-            n[1] || (n[1] = f("div", null, null, -1)),
-            f("span", {
-              style: F([M.value])
-            }, de(V.text), 5)
-          ], 8, Ne)
+            c[3] || (c[3] = V("div", null, null, -1)),
+            V("span", {
+              style: se([de.value])
+            }, Oe($.text), 5)
+          ], 40, xa)
         ]))), 128))
-      ], 10, He)
-    ], 6)) : fe("", !0);
+      ], 16, Ca)
+    ], 6)) : ie("", !0);
   }
-}), Ie = /* @__PURE__ */ ve(Ge, [["__scopeId", "data-v-8ea32fd7"]]);
-const ze = ["id"], Ae = ["id", "disabled", "value", "name"], Oe = ["for"], $e = /* @__PURE__ */ Object.assign({
+}), ka = /* @__PURE__ */ Ye(Sa, [["__scopeId", "data-v-7b02a5bf"]]);
+const Ba = ["id"], _a = ["id", "disabled", "value", "name"], Ia = ["for", "tabindex"], Aa = /* @__PURE__ */ Object.assign({
   name: "NbInputCheckbox",
   inheritAttrs: !1
 }, {
@@ -237,10 +281,31 @@ const ze = ["id"], Ae = ["id", "disabled", "value", "name"], Oe = ["for"], $e =
       type: String,
       default: "b",
       validator: (e = "b") => {
-        const o = e ? e.toLowerCase() : "";
-        return ["b", "ib"].includes(o);
+        const i = e ? e.toLowerCase() : "";
+        return ["b", "ib"].includes(i);
       }
     },
+    tabIndex: {
+      type: [Number, Array],
+      default: 0,
+      validator: (e, i) => Array.isArray(e) ? e.length === i.options.length : !0
+    },
+    hasTabIndexEnter: {
+      type: Boolean,
+      default: !0
+    },
+    hasTabIndexSpace: {
+      type: Boolean,
+      default: !0
+    },
+    ariaLabel: {
+      type: String,
+      default: "Alternate Text Button"
+    },
+    ariaAttrs: {
+      type: Object,
+      default: () => ({})
+    },
     groupName: {
       type: String,
       default: "",
@@ -254,12 +319,12 @@ const ze = ["id"], Ae = ["id", "disabled", "value", "name"], Oe = ["for"], $e =
       validator: (e) => {
         if (!e.length)
           return !1;
-        let o = !1;
-        for (const s of e) {
-          const d = Object.keys(s);
-          d.length !== 2 && (o = !0), d.every((v) => ["value", "text"].includes(v)) || (o = !0);
+        let i = !1;
+        for (const r of e) {
+          const B = Object.keys(r);
+          B.length !== 2 && (i = !0), B.every((W) => ["value", "text"].includes(W)) || (i = !0);
         }
-        if (!o)
+        if (!i)
           return e;
       }
     },
@@ -335,153 +400,1398 @@ const ze = ["id"], Ae = ["id", "disabled", "value", "name"], Oe = ["for"], $e =
       validator: (e) => e || 200
     }
   },
-  emits: ["current-value", "changed"],
-  setup(e, { emit: o }) {
-    oe((t) => ({
-      "10898a25": K.value,
-      "780ee9de": R.value,
-      "1ae639a4": Z.value,
-      ced3d622: H(p),
-      c43a725a: ee.value,
-      "53ca4d88": X.value,
-      "532c43b4": V.value,
-      "23ee9c4a": Q.value,
-      "2d828fb6": n.value,
-      "68487ed8": Y.value,
-      "51e3aafa": a.value
-    })), ue(() => {
-      q();
+  emits: ["current-value", "changed", "clicked"],
+  setup(e, { emit: i }) {
+    Ge((o) => ({
+      "22160a8e": ne.value,
+      "410caefa": c.value,
+      "3b6621e5": he.value,
+      "2130e298": l(I),
+      "156733ca": Ce.value,
+      "4735c99e": ue.value,
+      "204a4b1d": u.value,
+      "287af9f8": me.value,
+      "0abed1c2": xe.value,
+      f547d6ea: fe.value,
+      "5546b8ec": pe.value
+    })), Ke(() => {
+      ve();
     });
-    const s = o, d = e, c = ne(null), {
-      currentOption: v,
-      display: G,
-      options: k,
-      textColor: g,
-      boxRadius: x,
-      color: I,
-      hoverEffect: z,
-      activeHoverEffect: A,
-      colorHover: p,
-      itemGap: b,
-      internalGap: y,
-      scale: h,
-      type: O,
-      background: $,
-      disabled: B,
-      fontFamily: _,
-      fontSize: i,
-      fontWeight: S
-    } = re(d), u = l(() => {
-      const t = B.value ? "component-disabled" : "", r = G.value !== "b" ? "inline-block" : "block", m = _.value ? _.value : "'Lato', sans-serif", L = i.value ? i.value : "1.6em", W = S.value !== 0 && !S.value || S.value < 0 ? 200 : S.value, ae = g.value ? g.value : "black", pe = x.value !== 0 && !x.value || x.value < 0 ? 0 : x.value, be = I.value ? I.value : "#767676", ye = [!1, !0].includes(z.value) ? z.value : !1, Ve = [!1, !0].includes(A.value) ? A.value : !1, me = p.value ? p.value : "#a6a6a6", ge = b.value !== 0 && !b.value || b.value < 0 ? 15 : b.value, xe = y.value !== 0 && !y.value || y.value < 0 ? 6 : y.value, he = ["box", "circle"].includes(O.value) ? O.value : "box", ke = !h.value || h.value < 0 ? 1 : h.value, _e = [!1, !0].includes($.value) ? $.value : !1;
+    const r = i, B = e, y = Q(null), {
+      ariaLabel: W,
+      ariaAttrs: _,
+      currentOption: H,
+      display: oe,
+      options: x,
+      textColor: F,
+      boxRadius: j,
+      color: U,
+      hoverEffect: P,
+      activeHoverEffect: T,
+      colorHover: I,
+      itemGap: S,
+      internalGap: k,
+      scale: w,
+      type: E,
+      background: Y,
+      disabled: N,
+      fontFamily: D,
+      fontSize: v,
+      fontWeight: J
+    } = Ue(B), p = t(() => {
+      const o = N.value ? "component-disabled" : "", d = oe.value !== "b" ? "inline-block" : "block", z = D.value ? D.value : "'Lato', sans-serif", m = v.value ? v.value : "1.6em", G = J.value !== 0 && !J.value || J.value < 0 ? 200 : J.value, re = F.value ? F.value : "black", ke = j.value !== 0 && !j.value || j.value < 0 ? 0 : j.value, Te = U.value ? U.value : "#767676", M = [!1, !0].includes(P.value) ? P.value : !1, Be = [!1, !0].includes(T.value) ? T.value : !1, te = I.value ? I.value : "#a6a6a6", we = S.value !== 0 && !S.value || S.value < 0 ? 15 : S.value, Ee = k.value !== 0 && !k.value || k.value < 0 ? 6 : k.value, Ne = ["box", "circle"].includes(E.value) ? E.value : "box", A = !w.value || w.value < 0 ? 1 : w.value, ye = [!1, !0].includes(Y.value) ? Y.value : !1;
       return {
-        disabled: t,
-        display: r,
-        textColor: ae,
-        boxRadius: pe,
-        color: be,
-        hoverEffect: ye,
-        activeHoverEffect: Ve,
-        colorHover: me,
-        itemGap: ge,
-        internalGap: xe,
-        scale: ke,
-        type: he,
-        font: m,
-        background: _e,
-        fontSize: L,
-        fontWeight: W
+        disabled: o,
+        display: d,
+        textColor: re,
+        boxRadius: ke,
+        color: Te,
+        hoverEffect: M,
+        activeHoverEffect: Be,
+        colorHover: te,
+        itemGap: we,
+        internalGap: Ee,
+        scale: A,
+        type: Ne,
+        font: z,
+        background: ye,
+        fontSize: m,
+        fontWeight: G
       };
-    }), T = l(() => u.value.disabled), M = l(() => ({
-      display: u.value.display
-    })), U = l(() => u.value.display === "inline-block" ? "component-checkbox__item--display-inline" : "component-checkbox__item--display-block"), P = l(() => {
-      const t = u.value;
+    }), Z = t(() => p.value.disabled), de = t(() => ({
+      display: p.value.display
+    })), R = t(() => p.value.display === "inline-block" ? "component-checkbox__item--display-inline" : "component-checkbox__item--display-block"), ee = t(() => {
+      const o = p.value;
       return {
-        fontSize: t.fontSize,
-        fontWeight: t.fontWeight
+        fontSize: o.fontSize,
+        fontWeight: o.fontWeight
       };
-    }), J = l(() => Array.isArray(k.value) && k.value.constructor === Array && k.value.length > 0), K = l(() => u.value.font), Q = l(() => u.value.textColor), X = l(() => u.value.color), Y = l(() => {
-      const t = u.value;
-      return t.hoverEffect ? t.colorHover : t.color;
-    }), Z = l(() => {
-      const t = u.value;
-      return t.activeHoverEffect ? t.colorHover : t.color;
-    }), ee = l(() => {
-      const t = u.value;
-      return t.activeHoverEffect && t.background ? `${t.colorHover}80` : p.value;
-    }), j = l(() => u.value.background ? "component-checkbox__item--with-background" : "component-checkbox__item--without-background"), a = l(() => {
-      const t = u.value;
-      return t.background ? "#ffffff" : t.textColor;
+    }), ce = t(() => Array.isArray(x.value) && x.value.constructor === Array && x.value.length > 0), ne = t(() => p.value.font), me = t(() => p.value.textColor), ue = t(() => p.value.color), fe = t(() => {
+      const o = p.value;
+      return o.hoverEffect ? o.colorHover : o.color;
+    }), he = t(() => {
+      const o = p.value;
+      return o.activeHoverEffect ? o.colorHover : o.color;
+    }), Ce = t(() => {
+      const o = p.value;
+      return o.activeHoverEffect && o.background ? `${o.colorHover}80` : I.value;
+    }), Ve = t(() => p.value.background ? "component-checkbox__item--with-background" : "component-checkbox__item--without-background"), pe = t(() => {
+      const o = p.value;
+      return o.background ? "#ffffff" : o.textColor;
     });
-    l(() => u.value.background ? "19px" : "auto");
-    const n = l(() => {
-      const r = u.value.internalGap;
-      return !r || r < 0 ? 0 : `${r}px`;
-    }), V = l(() => {
-      const t = u.value;
-      return `${t.boxRadius > 7 ? 7 : t.boxRadius}px`;
-    }), R = l(() => {
-      const r = u.value.itemGap;
-      return !r || r < 0 ? 0 : `${r}px`;
-    }), w = l(() => u.value.type === "circle" ? "custom-checkbox__input--type-circle" : ""), te = l(() => ({
-      zoom: u.value.scale
-    })), q = () => {
-      c.value = v.value;
+    t(() => p.value.background ? "19px" : "auto");
+    const xe = t(() => {
+      const d = p.value.internalGap;
+      return !d || d < 0 ? 0 : `${d}px`;
+    }), u = t(() => {
+      const o = p.value;
+      return `${o.boxRadius > 7 ? 7 : o.boxRadius}px`;
+    }), c = t(() => {
+      const d = p.value.itemGap;
+      return !d || d < 0 ? 0 : `${d}px`;
+    }), $ = t(() => p.value.type === "circle" ? "custom-checkbox__input--type-circle" : ""), b = t(() => ({
+      zoom: p.value.scale
+    })), q = t(() => {
+      const o = {};
+      _.value && Object.keys(_.value).forEach((m) => o[`aria-${m}`] = _.value[m]);
+      const d = {
+        "aria-label": W.value,
+        "aria-disabled": N.value,
+        ...o
+      };
+      return Object.fromEntries(
+        Object.entries(d).filter(([z, m]) => m != null)
+      );
+    }), ve = () => {
+      y.value = H.value;
+    }, Se = () => {
+      r("clicked");
     };
-    return D(v, (t, r) => {
-      t !== r && q();
-    }), D(c, (t, r) => {
-      t !== r && (s("current-value", t), s("changed", t));
-    }), (t, r) => e.nbId && J.value ? (E(), N("div", {
+    return K(H, (o, d) => {
+      o !== d && ve();
+    }), K(y, (o, d) => {
+      o !== d && (r("current-value", o), r("changed", o));
+    }), (o, d) => e.nbId && ce.value ? (h(), C("div", {
       key: 0,
-      class: C(["nb-wrapper", T.value]),
-      style: F([M.value, te.value])
+      class: X(["nb-wrapper", Z.value]),
+      style: se([de.value, b.value])
     }, [
-      f("div", {
+      V("div", Qe({
         id: e.nbId,
-        class: C(["nb-reset", "component", U.value])
-      }, [
-        (E(!0), N(se, null, ce(H(k), (m, L) => (E(), N("div", {
-          key: L,
+        role: "group"
+      }, q.value, {
+        class: ["nb-reset", "component", R.value]
+      }), [
+        (h(!0), C(St, null, kt(l(x), (z, m) => (h(), C("div", {
+          key: m,
           class: "component-checkbox__item"
         }, [
-          ie(f("input", {
-            id: `${e.nbId}-${m.value}`,
-            "onUpdate:modelValue": r[0] || (r[0] = (W) => c.value = W),
+          Xe(V("input", {
+            id: `${e.nbId}-${z.value}`,
+            "onUpdate:modelValue": d[0] || (d[0] = (G) => y.value = G),
             type: "checkbox",
             class: "component-checkbox__item--input",
-            disabled: H(B),
-            value: m.value,
-            name: e.groupName
-          }, null, 8, Ae), [
-            [Ce, c.value]
+            disabled: l(N),
+            value: z.value,
+            name: e.groupName,
+            onClick: Se
+          }, null, 8, _a), [
+            [ga, y.value]
           ]),
-          f("label", {
-            for: `${e.nbId}-${m.value}`,
-            class: C([[w.value], "component-checkbox__item--label"])
+          V("label", {
+            for: `${e.nbId}-${z.value}`,
+            class: X([[$.value], "component-checkbox__item--label"]),
+            tabindex: l(N) ? -1 : Array.isArray(e.tabIndex) ? e.tabIndex[m] : e.tabIndex >= 0 ? e.tabIndex : m + 1,
+            onKeydown: [
+              d[1] || (d[1] = Re(qe((G) => !l(N) && e.hasTabIndexEnter && G.target.click(), ["prevent"]), ["enter"])),
+              d[2] || (d[2] = Re(qe((G) => !l(N) && e.hasTabIndexSpace && G.target.click(), ["prevent"]), ["space"]))
+            ]
           }, [
-            f("div", {
-              class: C([j.value])
+            V("div", {
+              class: X([Ve.value])
             }, null, 2),
-            f("span", {
-              style: F([P.value])
-            }, de(m.text), 5)
-          ], 10, Oe)
+            V("span", {
+              style: se([ee.value])
+            }, Oe(z.text), 5)
+          ], 42, Ia)
         ]))), 128))
-      ], 10, ze)
-    ], 6)) : fe("", !0);
+      ], 16, Ba)
+    ], 6)) : ie("", !0);
+  }
+}), Ta = /* @__PURE__ */ Ye(Aa, [["__scopeId", "data-v-80f01756"]]);
+const wa = ["id"], Ea = {
+  class: /* @__PURE__ */ X(["component__eye-icon", "fas"])
+}, Na = { key: 0 }, Da = { key: 1 }, Ra = ["id", "name", "type", "placeholder", "disabled", "required", "readonly", "autocomplete", "tabindex"], $a = ["for"], za = /* @__PURE__ */ Object.assign({
+  name: "NbInput",
+  inheritAttrs: !1
+}, {
+  __name: "NbInput",
+  props: {
+    nbId: {
+      type: String,
+      required: !0
+    },
+    display: {
+      type: String,
+      default: "b",
+      validator: (e = "b") => {
+        const i = e.toLowerCase();
+        return ["b", "ib"].includes(i);
+      }
+    },
+    tabIndex: {
+      type: Number,
+      default: 0
+    },
+    hasTabIndexEnter: {
+      type: Boolean,
+      default: !0
+    },
+    ariaLabel: {
+      type: String,
+      default: "Alternate Text Button"
+    },
+    ariaAttrs: {
+      type: Object,
+      default: () => ({})
+    },
+    textColor: {
+      // TESTAR AINDA
+      type: String,
+      default: "#ffffff"
+    },
+    caretColor: {
+      type: String,
+      default: "",
+      validator: (e) => !e || typeof e == "string"
+    },
+    selectionBgColor: {
+      type: String,
+      default: "",
+      validator: (e) => !e || typeof e == "string"
+    },
+    selectionTextColor: {
+      type: String,
+      default: "",
+      validator: (e) => !e || typeof e == "string"
+    },
+    theme: {
+      type: String,
+      default: "light",
+      validator: (e) => ["dark", "light"].indexOf(e) !== -1
+    },
+    hasBorderRadius: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    borderRadius: {
+      type: Number,
+      default: 0.5
+      // 0.375
+    },
+    disabled: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    fontFamily: {
+      type: String,
+      default: "'Lato', sans-serif"
+    },
+    fontSize: {
+      type: String,
+      default: null
+    },
+    fontWeight: {
+      type: Number,
+      default: 400,
+      validator: (e) => e || 700
+    },
+    fontFamilyMsg: {
+      type: String,
+      default: "'Lato', sans-serif"
+    },
+    fontSizeMsg: {
+      type: String,
+      default: "1em",
+      validator: (e) => e || "1em"
+    },
+    fontWeightMsg: {
+      type: Number,
+      default: 400,
+      validator: (e) => e || 700
+    },
+    textMessageColor: {
+      type: String,
+      default: "#f15574"
+    },
+    textAlign: {
+      type: String,
+      default: "left",
+      validator: (e) => ["center", "left", "right"].indexOf(e) !== -1
+    },
+    inputText: {
+      type: String,
+      default: ""
+    },
+    inputType: {
+      type: String,
+      default: "text",
+      validator: (e) => ["text", "number", "email", "password"].indexOf(e) !== -1
+    },
+    hasTrim: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    inputName: {
+      type: String,
+      required: !0
+    },
+    inputPlaceholder: {
+      type: String,
+      default: ""
+    },
+    showInputEye: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    inputEyeIcon: {
+      type: String,
+      default: "🫣"
+    },
+    inputEyeIconHidden: {
+      type: String,
+      default: "😎"
+    },
+    inputEyeCustomIcon: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    activeTextStyle: {
+      type: String,
+      default: "normal",
+      validator: (e) => ["normal", "italic", "oblique"].indexOf(e) !== -1
+    },
+    sizeMediaQuery: {
+      type: String,
+      default: "sm",
+      validator: (e) => ["xs", "sm", "md", "lg"].indexOf(e) !== -1
+    },
+    required: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    inputReadonly: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    inputAutocomplete: {
+      type: String,
+      default: "on",
+      validator: (e) => ["on", "off"].indexOf(e) !== -1
+    },
+    inputUppercase: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    inputWidth: {
+      type: Number,
+      default: 200
+    },
+    inputStyle: {
+      type: String,
+      default: "background",
+      validator: (e) => ["background", "line", "border"].indexOf(e) !== -1
+    },
+    // Cores do tema light
+    lightBgColor: {
+      type: String,
+      default: "#f8f8f2"
+    },
+    lightBgColorFocus: {
+      type: String,
+      default: "#eaeaea"
+    },
+    lightEyeBgColor: {
+      type: String,
+      default: "#353734"
+    },
+    lightEyeBgColorActive: {
+      type: String,
+      default: "#272936"
+    },
+    lightDisabledBgColor: {
+      type: String,
+      default: "#dfdfd9"
+    },
+    lightTextColor: {
+      type: String,
+      default: "#000000"
+    },
+    // Cores do tema dark
+    darkBgColor: {
+      type: String,
+      default: "#353734"
+    },
+    darkBgColorFocus: {
+      type: String,
+      default: "#272936"
+    },
+    darkEyeBgColor: {
+      type: String,
+      default: "#353734"
+    },
+    darkEyeBgColorActive: {
+      type: String,
+      default: "#272936"
+    },
+    darkDisabledBgColor: {
+      type: String,
+      default: "rgba(40, 42, 54, 1)"
+    },
+    darkTextColor: {
+      type: String,
+      default: "#000000"
+    },
+    darkDisabledEyeBgColor: {
+      type: String,
+      default: "rgba(68, 71, 90, 0.3)"
+    },
+    lightDisabledEyeBgColor: {
+      type: String,
+      default: "rgba(53, 55, 52, 0.3)"
+    },
+    tabindex: {
+      type: [String, Number],
+      default: 0
+    },
+    showMsg: {
+      // Se mostrado o erro
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    hasMsg: {
+      // Se tem erro
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    message: {
+      type: String,
+      default: "Default message text"
+    },
+    hasCustomMsg: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    hasIcon: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    iconWidth: {
+      type: Number,
+      default: 32
+    },
+    iconDirection: {
+      type: String,
+      default: "left",
+      validator: (e) => ["left", "right"].includes(e)
+    },
+    iconPadding: {
+      type: String,
+      default: "5px 10px",
+      validator: (e) => typeof e == "string" && e.split(" ").length === 2
+    },
+    iconPaddingInput: {
+      type: Number,
+      default: 35
+    },
+    iconMargin: {
+      type: String,
+      default: "0"
+    },
+    iconLightTextColor: {
+      type: String,
+      default: "#f8f8f2"
+    },
+    iconDarkTextColor: {
+      type: String,
+      default: "#f8f8f2"
+    },
+    iconLightBgColor: {
+      type: String,
+      default: "#353734"
+    },
+    iconLightBgColorActive: {
+      type: String,
+      default: "#272936"
+    },
+    iconDarkBgColor: {
+      type: String,
+      default: "#353734"
+    },
+    iconDarkBgColorActive: {
+      type: String,
+      default: "#272936"
+    },
+    iconDarkDisabledBgColor: {
+      type: String,
+      default: "rgba(68, 71, 90, 0.3)"
+    },
+    iconLightDisabledBgColor: {
+      type: String,
+      default: "rgba(53, 55, 52, 0.3)"
+    },
+    iconBorderRadius: {
+      type: Number,
+      default: 0
+    },
+    iconSize: {
+      type: Number,
+      default: 1
+    }
+  },
+  emits: [
+    "current-value",
+    "changed",
+    "focused",
+    "blurred",
+    "show-input-eye",
+    "clicked",
+    "entered"
+  ],
+  setup(e, { emit: i }) {
+    Ge((a) => ({
+      "7db11dc6": lt.value,
+      "465ec593": Fe.value,
+      "0bd0a5e4": l(b),
+      "490fdeba": n.value,
+      "09c697b5": g.value,
+      "497da60d": L.value,
+      "5e478652": l(z),
+      "65dc7d59": l(ye),
+      "7caea4a6": l(m),
+      "7d9d18e5": l(Ze),
+      "40dc79c4": l(d),
+      "3febb3de": l(Se),
+      55340077: l(o),
+      "6cbaee7c": Tt.value,
+      ccb4758c: l(q),
+      "3734d3be": l(ve),
+      "35bcd232": l(A),
+      "86db4b1e": l(G),
+      eebf601a: l(Je),
+      "6540ecda": l($),
+      83825256: l(u),
+      f52be38a: l(c),
+      "23886af6": l(pe),
+      "5b006382": l(xe),
+      "3eca0d2c": Bt.value,
+      b46ea296: It.value,
+      "21492e8a": At.value,
+      "01e48fba": wt.value,
+      "0f7f0fdd": Ct.value,
+      "060b01ca": l(re),
+      "21c08896": bt.value,
+      "8b25c7ac": ot.value,
+      "5b17912e": nt.value,
+      "6f485452": ut.value,
+      "501e5a2c": je.value,
+      dcd9aea4: a.styleButtonColor,
+      "16e77a5a": rt.value
+    })), Ke(() => {
+      ae.value = ue.value;
+    }), ba(() => {
+      Nt();
+    });
+    const r = i, B = e, {
+      display: y,
+      hasTabIndexEnter: W,
+      ariaLabel: _,
+      ariaAttrs: H,
+      textColor: oe,
+      caretColor: x,
+      selectionBgColor: F,
+      selectionTextColor: j,
+      hasBorderRadius: U,
+      borderRadius: P,
+      disabled: T,
+      fontFamily: I,
+      fontSize: S,
+      fontWeight: k,
+      fontFamilyMsg: w,
+      fontSizeMsg: E,
+      fontWeightMsg: Y,
+      textMessageColor: N,
+      inputWidth: D,
+      inputStyle: v,
+      activeTextStyle: J,
+      sizeMediaQuery: p,
+      inputReadonly: Z,
+      showInputEye: de,
+      inputType: R,
+      hasTrim: ee,
+      inputUppercase: ce,
+      inputName: ne,
+      inputPlaceholder: me,
+      inputText: ue,
+      theme: fe,
+      inputEyeIcon: he,
+      tabindex: Ce,
+      inputEyeIconHidden: Ve,
+      lightBgColor: pe,
+      lightBgColorFocus: xe,
+      lightEyeBgColor: u,
+      lightEyeBgColorActive: c,
+      lightDisabledBgColor: $,
+      lightTextColor: b,
+      darkBgColor: q,
+      darkBgColorFocus: ve,
+      darkEyeBgColor: Se,
+      darkEyeBgColorActive: o,
+      darkDisabledBgColor: d,
+      darkTextColor: z,
+      darkDisabledEyeBgColor: m,
+      lightDisabledEyeBgColor: G,
+      textAlign: re,
+      showMsg: ke,
+      hasMsg: Te,
+      hasIcon: M,
+      iconDirection: Be,
+      iconPadding: te,
+      iconPaddingInput: we,
+      iconMargin: Ee,
+      iconBorderRadius: Ne,
+      iconLightTextColor: A,
+      iconDarkTextColor: ye,
+      iconLightBgColor: O,
+      iconDarkBgColor: Le,
+      iconLightBgColorActive: We,
+      iconDarkBgColorActive: He,
+      iconLightDisabledBgColor: Je,
+      iconDarkDisabledBgColor: Ze,
+      iconWidth: $e,
+      iconSize: ze
+    } = Ue(B), ae = Q(""), _e = Q(""), ge = Q(!1), Ie = Q(!1), s = t(() => {
+      const a = T.value ? "component-disabled" : "", f = y.value !== "b" ? "inline-block" : "block", be = oe ? oe.value : "ffffff", Ae = x.value ? x.value : "", zt = F.value ? F.value : "", Mt = j.value ? j.value : "", Ot = U.value ? U.value : !1, Lt = !P.value || P.value < 0 ? 0 : P.value, Wt = I.value ? I.value : "'Lato', sans-serif", Ht = S.value && S.value >= 0 ? S.value : null, Ft = !k.value || k.value < 0 ? 100 : k.value, jt = w.value ? w.value : "'Lato', sans-serif", Pt = E.value ? E.value : "1em", qt = !Y.value || Y.value < 0 ? 100 : Y.value, Gt = N.value ? N.value : "#f15574", Kt = D.value ? D.value : 200, Ut = J.value ? J.value : "normal", Qt = p.value ? p.value : "xs", Xt = Z.value ? Z.value : !1, Yt = de.value ? de.value : !1, Jt = R.value ? R.value : "text", Zt = ce.value ? ce.value : !1, ea = fe.value ? fe.value : "normal", ta = re.value ? re.value : "left", aa = v.value ? v.value : "background", la = te.value ? te.value : "5px 10px", oa = Ee.value ? Ee.value : "0", na = we.value ? we.value : 10, ua = A.value ? A.value : "#000000", ra = ye.value ? ye.value : "#000000", ia = O.value ? O.value : "transparent", sa = Le.value ? Le.value : "transparent", da = Ne.value ? Ne.value : 0, ca = We.value ? We.value : "transparent", fa = He.value ? He.value : "transparent", pa = $e.value ? $e.value : 32, va = ze.value ? ze.value : 1;
+      return {
+        disabled: a,
+        display: f,
+        font: Wt,
+        fontSize: Ht,
+        fontWeight: Ft,
+        fontFamilyMsg: jt,
+        fontSizeMsg: Pt,
+        fontWeightMsg: qt,
+        textMessageColor: Gt,
+        textColor: be,
+        caretColor: Ae,
+        selectionBgColor: zt,
+        selectionTextColor: Mt,
+        hasBorderRadius: Ot,
+        borderRadius: Lt,
+        textAlign: ta,
+        inputWidth: Kt,
+        activeTextStyle: Ut,
+        sizeMediaQuery: Qt,
+        inputReadonly: Xt,
+        showInputEye: Yt,
+        inputType: Jt,
+        inputUppercase: Zt,
+        theme: ea,
+        inputStyle: aa,
+        iconPadding: la,
+        iconMargin: oa,
+        iconPaddingInput: na,
+        iconLightTextColor: ua,
+        iconDarkTextColor: ra,
+        iconLightBgColor: ia,
+        iconDarkBgColor: sa,
+        iconBorderRadius: da,
+        iconLightBgColorActive: ca,
+        iconDarkBgColorActive: fa,
+        iconWidth: pa,
+        iconSize: va
+      };
+    }), et = t(() => s.value.disabled), tt = t(() => ({
+      display: s.value.display
+    })), Fe = t(() => {
+      const a = s.value;
+      if (a.fontSize)
+        return `${a.fontSize}em`;
+      let f = "";
+      switch (a.sizeMediaQuery) {
+        case "sm":
+          return "1.2em";
+        case "md":
+          return "1.6em";
+        case "lg":
+          return "2em";
+        default:
+          f = "1.2em";
+      }
+      return f;
+    }), at = t(() => {
+      const a = s.value;
+      return {
+        fontSize: Fe.value,
+        fontWeight: a.fontWeight
+      };
+    }), De = t(() => {
+      const a = s.value;
+      return a.inputStyle !== "line" && a.hasBorderRadius ? { borderRadius: `${a.borderRadius}rem` } : {};
+    }), lt = t(() => s.value.font), ot = t(() => s.value.fontFamilyMsg), nt = t(() => s.value.fontSizeMsg), ut = t(() => s.value.fontWeightMsg), rt = t(() => s.value.textColor), je = t(() => s.value.textMessageColor), n = t(() => {
+      const a = s.value;
+      return a.caretColor || (a.theme === "dark" ? "#00d4ff" : "#007bff");
+    }), g = t(() => {
+      const a = s.value;
+      return a.selectionBgColor || (a.theme === "dark" ? "#00d4ff" : "#007bff");
+    }), L = t(() => {
+      const a = s.value;
+      return a.selectionTextColor || (a.theme === "dark" ? "#000000" : "#ffffff");
+    }), le = t(() => {
+      const a = s.value;
+      return a.display === "block" ? { width: "100%" } : {
+        width: `${a.inputWidth}px`
+      };
+    }), it = t(() => {
+      switch (v.value) {
+        case "line":
+          return "component__input--line";
+        case "border":
+          return "component__input--border";
+        default:
+          return "component__input--background";
+      }
+    }), st = t(() => {
+      switch (s.value.activeTextStyle) {
+        case "italic":
+          return "component__input--active--italic";
+        case "oblique":
+          return "component__input--active--oblique";
+        default:
+          return "component__input--active--normal";
+      }
+    }), dt = t(() => {
+      switch (s.value.sizeMediaQuery) {
+        case "sm":
+          return "component__sm";
+        case "md":
+          return "component__md";
+        case "lg":
+          return "component__lg";
+        default:
+          return "";
+      }
+    }), ct = t(() => {
+      switch (s.value.theme) {
+        case "dark":
+          return "component__theme--dark";
+        default:
+          return "component__theme--light";
+      }
+    }), ft = t(() => s.value.inputReadonly ? "component__input--read-only" : ""), pt = t(() => s.value.inputUppercase ? "component__input--uppercase" : ""), Pe = t(() => {
+      const a = s.value;
+      return !!(a.showInputEye && a.inputType === "password");
+    }), vt = t(() => ge.value ? he.value : Ve.value), yt = t(() => s.value.inputType === "password" ? "component__input__eye-default--hidden" : ""), gt = t(() => Ie.value ? "component__input--active" : "component__input--no-active"), bt = t(() => Pe.value ? "6px 50px 6px 10px" : "6px 10px"), mt = t(() => !!(ke.value && Te.value)), ht = t(() => {
+      const a = {};
+      H.value && Object.keys(H.value).forEach((Ae) => a[`aria-${Ae}`] = H.value[Ae]);
+      const f = {
+        "aria-label": _.value,
+        "aria-disabled": T.value,
+        ...a
+      };
+      return Object.fromEntries(
+        Object.entries(f).filter(([be, Ae]) => Ae != null)
+      );
+    }), Ct = t(() => M.value ? `${ze.value}rem` : "0"), Bt = t(() => M.value ? `${$e.value}px` : "0"), _t = t(() => M.value ? `component__icon--${Be.value}` : ""), It = t(() => {
+      const a = s.value;
+      return M.value ? a.iconPadding : "0";
+    }), At = t(() => {
+      const a = s.value;
+      return M.value ? a.iconMargin : "0";
+    }), Tt = t(() => {
+      const a = s.value;
+      return M.value ? a.theme === "dark" ? a.iconDarkBgColor : a.iconLightBgColor : "transparent";
+    }), wt = t(() => {
+      const a = s.value;
+      return M.value ? `${a.iconBorderRadius}rem` : "0";
+    }), Et = t(() => {
+      const a = s.value;
+      return M.value ? Be.value === "left" ? { paddingLeft: `${a.iconPaddingInput}px` } : { paddingRight: `${a.iconPaddingInput}px` } : {};
+    }), Nt = () => {
+      ae.value = ue.value, _e.value = R.value;
+    }, Dt = () => {
+      const a = s.value;
+      if (a.inputReadonly || a.disabled)
+        return;
+      const f = !ge.value;
+      f ? _e.value = "text" : _e.value = R.value, ge.value = f;
+    }, Rt = () => {
+      r("clicked");
+    }, $t = () => {
+      T.value || s.value.inputReadonly || !W.value || r("entered", ae.value);
+    };
+    return K(R, (a) => {
+      _e.value = a;
+    }, { immediate: !0 }), K(ue, (a) => {
+      a !== ae.value && (ae.value = a);
+    }, { immediate: !0 }), K(ae, (a) => {
+      ee.value && (a = a.trim()), r("changed", a);
+    }), K(Ie, (a) => {
+      r(a ? "focused" : "blurred");
+    }), K(ge, (a) => {
+      r("show-input-eye", a);
+    }, { immediate: !0 }), K(ae, (a) => {
+      ee.value && (a = a.trim()), r("current-value", a);
+    }), K(R, (a) => {
+      a === "password" && nextTick(() => {
+        const f = document.getElementById(ne.value);
+        f && (f.type = "password", f.removeAttribute("autocomplete"));
+      });
+    }), (a, f) => e.nbId ? (h(), C("div", Qe({
+      key: 0,
+      class: ["nb-wrapper", et.value],
+      style: [tt.value, le.value, De.value],
+      role: "input"
+    }, ht.value), [
+      V("div", {
+        id: e.nbId,
+        class: X(["nb-reset", "component", dt.value, ct.value, ft.value, it.value]),
+        style: se([at.value, le.value, De.value]),
+        onClick: Rt
+      }, [
+        Pe.value ? (h(), C("div", {
+          key: 0,
+          class: X(["component__eye", gt.value]),
+          style: se([De.value]),
+          onClick: Dt
+        }, [
+          V("span", Ea, [
+            e.inputEyeCustomIcon ? (h(), C("span", Da, [
+              ge.value ? Me(a.$slots, "eye-icon-show", { key: 0 }, () => [
+                f[4] || (f[4] = Vt("show"))
+              ], !0) : Me(a.$slots, "eye-icon-hidden", { key: 1 }, () => [
+                f[5] || (f[5] = Vt("hidden"))
+              ], !0)
+            ])) : (h(), C("span", Na, Oe(vt.value), 1))
+          ])
+        ], 6)) : ie("", !0),
+        Xe(V("input", {
+          "onUpdate:modelValue": f[0] || (f[0] = (be) => ae.value = be),
+          id: l(ne),
+          name: l(ne),
+          type: _e.value,
+          class: X(["component__input", [
+            pt.value,
+            yt.value,
+            st.value
+          ]]),
+          placeholder: l(me),
+          disabled: l(T) || l(Z),
+          required: e.required,
+          readonly: l(Z),
+          autocomplete: e.inputAutocomplete,
+          tabindex: l(T) || l(Z) ? -1 : l(Ce),
+          role: "input",
+          style: se([De.value, Et.value]),
+          onFocus: f[1] || (f[1] = (be) => Ie.value = !0),
+          onBlur: f[2] || (f[2] = (be) => Ie.value = !1),
+          onKeydown: f[3] || (f[3] = Re((be) => !l(T) && l(W) && $t(), ["enter"]))
+        }, null, 46, Ra), [
+          [ma, ae.value]
+        ]),
+        l(M) ? (h(), C("label", {
+          key: 1,
+          for: l(ne),
+          class: X(["component__icon", _t.value])
+        }, [
+          Me(a.$slots, "icon", {}, () => [
+            f[6] || (f[6] = V("span", null, "♥", -1))
+          ], !0)
+        ], 10, $a)) : ie("", !0)
+      ], 14, wa),
+      mt.value ? (h(), C("div", {
+        key: 0,
+        class: X(["component__message", e.hasCustomMsg ? "component__message--custom" : "component__message--default"])
+      }, [
+        Me(a.$slots, "message", {}, () => [
+          Vt(Oe(e.message), 1)
+        ], !0)
+      ], 2)) : ie("", !0)
+    ], 16)) : ie("", !0);
+  }
+}), Ma = /* @__PURE__ */ Ye(za, [["__scopeId", "data-v-d689f281"]]);
+const Oa = ["id"], La = { class: "chip-text" }, Wa = ["onClick"], Ha = ["name", "placeholder", "readonly", "autocomplete", "required", "tabindex"], Fa = /* @__PURE__ */ Object.assign({
+  name: "NbInputChip",
+  inheritAttrs: !1
+}, {
+  __name: "NbInputChip",
+  props: {
+    nbId: {
+      type: String,
+      required: !0
+    },
+    display: {
+      type: String,
+      default: "b",
+      validator: (e = "b") => {
+        const i = e.toLowerCase();
+        return ["b", "ib"].includes(i);
+      }
+    },
+    tabIndex: {
+      type: Number,
+      default: 0
+    },
+    hasTabIndexEnter: {
+      type: Boolean,
+      default: !0
+    },
+    ariaLabel: {
+      type: String,
+      default: "Input Chip"
+    },
+    ariaAttrs: {
+      type: Object,
+      default: () => ({})
+    },
+    caretColor: {
+      type: String,
+      default: "",
+      validator: (e) => !e || typeof e == "string"
+    },
+    width: {
+      type: Number,
+      default: 185,
+      validator: (e) => e || 185
+    },
+    textColor: {
+      type: String,
+      default: "#ffffff"
+    },
+    selectionBgColor: {
+      type: String,
+      default: "",
+      validator: (e) => !e || typeof e == "string"
+    },
+    selectionTextColor: {
+      type: String,
+      default: "",
+      validator: (e) => !e || typeof e == "string"
+    },
+    paddingX: {
+      type: Number,
+      default: 0.2,
+      validator: (e) => e || 1
+    },
+    paddingY: {
+      type: Number,
+      default: 0.2,
+      validator: (e) => e || 0.2
+    },
+    hasBorderRadius: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    borderRadius: {
+      type: Number,
+      default: 0.375
+    },
+    disabled: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    fontFamily: {
+      type: String,
+      default: "'Lato', sans-serif"
+    },
+    fontSize: {
+      type: String,
+      default: "1.6em",
+      validator: (e) => e || "1.6em"
+    },
+    fontWeight: {
+      type: Number,
+      default: 400,
+      validator: (e) => e || 700
+    },
+    currentList: {
+      type: Array,
+      default: () => [],
+      validator: (e) => Array.isArray(e)
+    },
+    allowDuplicates: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    minChips: {
+      type: Number,
+      default: 0
+    },
+    maxChips: {
+      type: Number,
+      default: 10
+    },
+    inputPosition: {
+      type: String,
+      default: "bottom",
+      validator: (e) => ["top", "bottom"].includes(e)
+    },
+    inputName: {
+      type: String,
+      default: ""
+    },
+    inputPlaceholder: {
+      type: String,
+      default: "Type and press Enter"
+    },
+    inputUppercase: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    inputReadonly: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    inputAutocomplete: {
+      type: String,
+      default: "on",
+      validator: (e) => ["on", "off"].indexOf(e) !== -1
+    },
+    required: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    textAlign: {
+      type: String,
+      default: "left",
+      validator: (e) => ["center", "left", "right"].indexOf(e) !== -1
+    },
+    activeTextStyle: {
+      type: String,
+      default: "normal",
+      validator: (e) => ["normal", "italic", "oblique"].indexOf(e) !== -1
+    },
+    theme: {
+      type: String,
+      default: "light",
+      validator: (e) => ["dark", "light"].indexOf(e) !== -1
+    },
+    inputStyle: {
+      type: String,
+      default: "background",
+      validator: (e) => ["background", "line", "border"].indexOf(e) !== -1
+    },
+    // Cores do tema light
+    lightBgColor: {
+      type: String,
+      default: "#f8f8f2"
+    },
+    lightBgColorFocus: {
+      type: String,
+      default: "#eaeaea"
+    },
+    lightBorderColor: {
+      type: String,
+      default: "#353734"
+    },
+    lightBorderColorFocus: {
+      type: String,
+      default: "#272936"
+    },
+    lightDisabledBgColor: {
+      type: String,
+      default: "#dfdfd9"
+    },
+    lightTextColor: {
+      type: String,
+      default: "#000000"
+    },
+    lightChipBgColor: {
+      type: String,
+      default: "#e0e0e0"
+    },
+    lightChipTextColor: {
+      type: String,
+      default: "#000000"
+    },
+    lightChipRemoveColor: {
+      type: String,
+      default: "#f44336"
+    },
+    lightDisabledBorderColor: {
+      type: String,
+      default: "rgba(53, 55, 52, 0.3)"
+    },
+    // Cores do tema dark
+    darkBgColor: {
+      type: String,
+      default: "#353734"
+    },
+    darkBgColorFocus: {
+      type: String,
+      default: "#272936"
+    },
+    darkBorderColor: {
+      type: String,
+      default: "#44475a"
+    },
+    darkBorderColorFocus: {
+      type: String,
+      default: "rgba(68, 71, 90, 0.4)"
+    },
+    darkDisabledBgColor: {
+      type: String,
+      default: "rgba(40, 42, 54, 1)"
+    },
+    darkTextColor: {
+      type: String,
+      default: "#ffffff"
+    },
+    darkChipBgColor: {
+      type: String,
+      default: "#44475a"
+    },
+    darkChipTextColor: {
+      type: String,
+      default: "#ffffff"
+    },
+    darkChipRemoveColor: {
+      type: String,
+      default: "#f44336"
+    },
+    darkDisabledBorderColor: {
+      type: String,
+      default: "rgba(68, 71, 90, 0.3)"
+    }
+  },
+  emits: ["clicked", "changed", "removed", "added", "input-changed", "focused", "blurred"],
+  setup(e, { emit: i }) {
+    Ge((n) => ({
+      "1549ffc9": $e.value,
+      "73ec4a48": ae.value,
+      "1eee568c": l(he),
+      "6d90e4bc": l(ce),
+      "16339c1b": l(me),
+      "56fd01b6": l(Ce),
+      "22c193ce": l(Ve),
+      "5f1758d7": l(pe),
+      "6e7cb926": l(ve),
+      "6d719d0e": l(u),
+      "327fd4f2": l($),
+      "27897b22": l(Se),
+      "0215623a": l(o),
+      "8e9d877a": l(d),
+      "37cf217d": l(ue),
+      "1171ab91": l(b),
+      "99a84312": ge.value,
+      "3b55b689": Ie.value,
+      "53c05fe1": s.value,
+      "9f4dd54c": n.styleButtonColor,
+      "2a052b02": ze.value,
+      beaeb8f4: l(fe),
+      "019f1fff": l(xe),
+      "0b7af21c": l(q),
+      "6b816d6b": l(z)
+    })), Ke(() => {
+      P.value.length > 0 && (A.value = P.value);
+    });
+    const r = i, B = e, {
+      display: y,
+      textColor: W,
+      paddingX: _,
+      paddingY: H,
+      borderRadius: oe,
+      disabled: x,
+      fontFamily: F,
+      fontSize: j,
+      fontWeight: U,
+      currentList: P,
+      allowDuplicates: T,
+      minChips: I,
+      maxChips: S,
+      inputPosition: k,
+      width: w,
+      inputName: E,
+      inputPlaceholder: Y,
+      inputUppercase: N,
+      inputReadonly: D,
+      inputAutocomplete: v,
+      required: J,
+      textAlign: p,
+      hasBorderRadius: Z,
+      activeTextStyle: de,
+      theme: R,
+      inputStyle: ee,
+      lightBgColor: ce,
+      lightBgColorFocus: ne,
+      lightBorderColor: me,
+      lightBorderColorFocus: ue,
+      lightDisabledBgColor: fe,
+      lightTextColor: he,
+      lightChipBgColor: Ce,
+      lightChipTextColor: Ve,
+      lightChipRemoveColor: pe,
+      lightDisabledBorderColor: xe,
+      darkBgColor: u,
+      darkBgColorFocus: c,
+      darkBorderColor: $,
+      darkBorderColorFocus: b,
+      darkDisabledBgColor: q,
+      darkTextColor: ve,
+      darkChipBgColor: Se,
+      darkChipTextColor: o,
+      darkChipRemoveColor: d,
+      darkDisabledBorderColor: z,
+      tabIndex: m,
+      hasTabIndexEnter: G,
+      ariaLabel: re,
+      ariaAttrs: ke,
+      caretColor: Te,
+      selectionBgColor: M,
+      selectionTextColor: Be
+    } = Ue(B), te = Q(""), we = Q(null), Ee = Q(null), Ne = Q(null), A = Q([]), ye = Q(!1), O = t(() => {
+      const n = x.value ? "component-disabled" : "", g = y.value !== "b" ? "inline-block" : "block", L = !w.value || w.value < 185 ? 185 : w.value, le = W ? W.value : "ffffff", it = Te.value ? Te.value : "", st = M.value ? M.value : "", dt = Be.value ? Be.value : "", ct = !_.value || _.value < 0 ? 1 : _.value, ft = !H.value || H.value < 0 ? 0.2 : H.value, pt = !oe.value || oe.value < 0 ? 0 : oe.value, Pe = F.value ? F.value : "'Lato', sans-serif", vt = j.value ? j.value : "1.6rem", yt = !U.value || U.value < 0 ? 100 : U.value, gt = !I.value || I.value < 0 ? 0 : I.value, bt = !S.value || S.value < 0 ? 10 : S.value, mt = !k.value || !["top", "bottom"].includes(k.value) ? "bottom" : k.value, ht = !ee.value || !["background", "line", "border"].includes(ee.value) ? "background" : ee.value, Ct = R.value ? R.value : "light";
+      return {
+        disabled: n,
+        display: g,
+        width: L,
+        font: Pe,
+        fontSize: vt,
+        fontWeight: yt,
+        textColor: le,
+        caretColor: it,
+        selectionBgColor: st,
+        selectionTextColor: dt,
+        paddingX: ct,
+        paddingY: ft,
+        borderRadius: pt,
+        minChips: gt,
+        maxChips: bt,
+        inputPosition: mt,
+        inputStyle: ht,
+        theme: Ct
+      };
+    }), Le = t(() => O.value.disabled), We = t(() => ({
+      display: O.value.display
+    })), He = t(() => {
+      const n = O.value;
+      return {
+        color: n.textColor,
+        padding: `${n.paddingY}rem ${n.paddingX}rem`,
+        fontSize: n.fontSize,
+        fontWeight: n.fontWeight,
+        textAlign: p.value
+      };
+    }), Je = t(() => {
+      switch (de.value) {
+        case "italic":
+          return "component__text--italic";
+        case "oblique":
+          return "component__text--oblique";
+        default:
+          return "component__text--normal";
+      }
+    }), Ze = t(() => {
+      const n = O.value;
+      return n.inputStyle !== "line" && Z.value ? { borderRadius: `${n.borderRadius}rem` } : {};
+    }), $e = t(() => O.value.font), ze = t(() => O.value.textColor), ae = t(() => O.value.inputPosition === "top" ? "column" : "column-reverse"), _e = t(() => {
+      const n = {};
+      ke.value && Object.keys(ke.value).forEach((le) => n[`aria-${le}`] = ke.value[le]);
+      const g = {
+        "aria-label": re.value,
+        "aria-disabled": x.value,
+        ...n
+      };
+      return Object.fromEntries(
+        Object.entries(g).filter(([L, le]) => le != null)
+      );
+    }), ge = t(() => {
+      const n = O.value;
+      return n.caretColor || (n.theme === "dark" ? "#00d4ff" : "#007bff");
+    }), Ie = t(() => {
+      const n = O.value;
+      return n.selectionBgColor || (n.theme === "dark" ? "#00d4ff" : "#007bff");
+    }), s = t(() => {
+      const n = O.value;
+      return n.selectionTextColor || (n.theme === "dark" ? "#000000" : "#ffffff");
+    }), et = t(() => ({
+      caretColor: ge.value
+    })), tt = t(() => ({
+      "--selection-bg-color": Ie.value,
+      "--selection-text-color": s.value
+    })), Fe = t(() => {
+      const n = O.value, g = {
+        width: `${n.width}px`
+      };
+      return n.display === "block" ? { width: "auto" } : g;
+    }), at = t(() => {
+      switch (R.value) {
+        case "dark":
+          return "component__theme--dark";
+        default:
+          return "component__theme--light";
+      }
+    }), De = t(() => {
+      switch (ee.value) {
+        case "line":
+          return "component__input--line";
+        case "border":
+          return "component__input--border";
+        default:
+          return "component__input--background";
+      }
+    }), lt = () => {
+      r("clicked");
+    }, ot = () => {
+      ye.value = !0, r("focused");
+    }, nt = () => {
+      ye.value = !1, r("blurred");
+    }, ut = (n) => {
+      if (!(x.value || D.value) && n.key === "Enter" && te.value.trim() !== "") {
+        n.preventDefault();
+        let g = te.value.trim();
+        N.value && (g = g.toUpperCase()), (T.value || !A.value.includes(g)) && rt(g), te.value = "";
+      }
+    }, rt = (n) => {
+      A.value.push(n), r("added", n);
+    }, je = (n) => {
+      A.value = A.value.filter((g) => g !== n), r("removed", n);
+    };
+    return K(P, (n) => {
+      A.value = n, r("changed", n);
+    }), K(te, (n) => {
+      r("input-changed", n);
+    }), (n, g) => e.nbId ? (h(), C("div", Qe({
+      key: 0,
+      class: ["nb-wrapper", Le.value],
+      style: [We.value],
+      role: "input"
+    }, _e.value, { onClick: lt }), [
+      V("div", {
+        id: e.nbId,
+        ref_key: "chipsContainer",
+        ref: we,
+        class: X(["nb-reset", "component", at.value, De.value]),
+        style: se([He.value, Fe.value, Ze.value])
+      }, [
+        A.value.length > 0 ? (h(), C("div", {
+          key: 0,
+          ref_key: "chips",
+          ref: Ne,
+          class: "chips"
+        }, [
+          (h(!0), C(St, null, kt(A.value, (L) => (h(), C("div", {
+            key: L,
+            class: "chip"
+          }, [
+            Me(n.$slots, "chip", {
+              chips: A.value,
+              chip: L,
+              removeChip: je
+            }, () => [
+              V("span", La, Oe(L), 1),
+              !l(x) && !l(D) ? (h(), C("span", {
+                key: 0,
+                class: "chip-remove",
+                onClick: (le) => je(L)
+              }, "×", 8, Wa)) : ie("", !0)
+            ], !0)
+          ]))), 128))
+        ], 512)) : ie("", !0),
+        Xe(V("input", {
+          ref_key: "chipInput",
+          ref: Ee,
+          type: "text",
+          "onUpdate:modelValue": g[0] || (g[0] = (L) => te.value = L),
+          name: l(E),
+          placeholder: l(Y),
+          readonly: l(D),
+          autocomplete: l(v),
+          required: l(J),
+          tabindex: l(x) || l(D) ? -1 : l(m),
+          class: X(["chips-input", Je.value]),
+          style: se([et.value, tt.value]),
+          onKeydown: g[1] || (g[1] = Re((L) => !l(x) && l(G) && ut(L), ["enter"])),
+          onFocus: ot,
+          onBlur: nt
+        }, null, 46, Ha), [
+          [ha, te.value]
+        ])
+      ], 14, Oa)
+    ], 16)) : ie("", !0);
   }
-}), Be = /* @__PURE__ */ ve($e, [["__scopeId", "data-v-c62d0c08"]]), le = {
-  NbInputRadio: Ie,
-  NbInputCheckbox: Be
-}, we = {
+}), ja = /* @__PURE__ */ Ye(Fa, [["__scopeId", "data-v-4af4ff9b"]]), xt = {
+  NbInputRadio: ka,
+  NbInputCheckbox: Ta,
+  NbInput: Ma,
+  NbInputChip: ja
+}, qa = {
   install(e) {
-    for (const o in le)
-      if (Object.prototype.hasOwnProperty.call(le, o)) {
-        const s = le[o];
-        e.component(s.name, s);
+    for (const i in xt)
+      if (Object.prototype.hasOwnProperty.call(xt, i)) {
+        const r = xt[i];
+        e.component(r.name, r);
       }
   }
 };
 export {
-  we as default
+  qa as default
 };