@vlalg-nimbus/nb-selects 1.0.0

package/dist/nb-selects.js

@@ -0,0 +1,1984 @@
+import { useCssVars as Ue, unref as t, onMounted as Ge, onUnmounted as _t, toRefs as Je, ref as J, computed as o, watch as pe, openBlock as T, createElementBlock as _, normalizeClass as R, normalizeStyle as Re, createElementVNode as I, mergeProps as Qe, createTextVNode as nt, toDisplayString as le, createCommentVNode as ke, withModifiers as m, withKeys as D, Fragment as vt, renderList as ct, renderSlot as pt, nextTick as Y, withDirectives as lt, vModelCheckbox as at } from "vue";
+const Ze = (e, S) => {
+  const y = e.__vccOpts || e;
+  for (const [ae, V] of S)
+    y[ae] = V;
+  return y;
+}, Vt = ["id"], wt = ["for"], Ht = {
+  key: 0,
+  class: "component__label--required"
+}, $t = ["tabindex"], Dt = {
+  key: 0,
+  class: "component__dropdown-placeholder"
+}, It = {
+  key: 1,
+  class: "component__dropdown-selected"
+}, At = ["tabindex", "aria-selected"], Nt = { class: "component__option-label" }, Et = ["data-option-index-single", "tabindex", "aria-selected", "onClick", "onKeydown"], zt = { class: "component__option-label" }, Rt = ["tabindex"], Wt = {
+  key: 0,
+  class: "component__dropdown-placeholder"
+}, Lt = {
+  key: 1,
+  class: "component__dropdown-selected"
+}, Kt = ["data-option-index-multiple", "tabindex", "aria-selected", "onClick", "onKeydown"], Ft = ["value", "checked", "disabled"], jt = { class: "component__checkbox-label" }, Xt = /* @__PURE__ */ Object.assign({
+  name: "NbSelect",
+  inheritAttrs: !1
+}, {
+  __name: "NbSelect",
+  props: {
+    nbId: {
+      type: String,
+      required: !0
+    },
+    display: {
+      type: String,
+      default: "b",
+      validator: (e = "b") => {
+        const S = e.toLowerCase();
+        return ["b", "ib"].includes(S);
+      }
+    },
+    textColor: {
+      type: String,
+      default: "#ffffff"
+    },
+    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
+    },
+    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
+    },
+    textAlign: {
+      type: String,
+      default: "left",
+      validator: (e) => ["center", "left", "right"].indexOf(e) !== -1
+    },
+    selectWidth: {
+      type: Number,
+      default: 200
+    },
+    inputStyle: {
+      type: String,
+      default: "background",
+      validator: (e) => ["background", "line", "border"].indexOf(e) !== -1
+    },
+    selectName: {
+      type: String,
+      default: "selectX"
+    },
+    required: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    options: {
+      type: Array,
+      default: () => []
+    },
+    selectedOptionOnly: {
+      type: [String, Number, Boolean],
+      default: ""
+    },
+    selectedOptionMultiple: {
+      type: Array,
+      default: () => [],
+      validator: (e) => e === null || Array.isArray(e)
+    },
+    textKey: {
+      type: String,
+      default: "text"
+    },
+    valueKey: {
+      type: String,
+      default: "value"
+    },
+    multiple: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    hasEmptyOption: {
+      type: Boolean,
+      default: !0,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    emptyOptionText: {
+      type: String,
+      default: "Selecione uma opção"
+    },
+    emptyOptionValue: {
+      type: [String, Number],
+      default: null
+    },
+    dropdownScrollClass: {
+      type: String,
+      default: ""
+    },
+    hasLabel: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    labelText: {
+      type: String,
+      default: "Select: "
+    },
+    // 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"
+    },
+    lightDisabledBorderColor: {
+      type: String,
+      default: "rgba(53, 55, 52, 0.3)"
+    },
+    lightOptionTextColor: {
+      type: String,
+      default: "#000000"
+    },
+    lightOptionTextColorSelected: {
+      type: String,
+      default: "#000000"
+    },
+    lightOptionBgColorSelected: {
+      type: String,
+      default: "#e0e0e0"
+    },
+    lightPlaceholderColor: {
+      type: String,
+      default: "#999999"
+    },
+    // 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"
+    },
+    darkDisabledBorderColor: {
+      type: String,
+      default: "rgba(68, 71, 90, 0.3)"
+    },
+    darkOptionTextColor: {
+      type: String,
+      default: "#ffffff"
+    },
+    darkOptionTextColorSelected: {
+      type: String,
+      default: "#ffffff"
+    },
+    darkOptionBgColorSelected: {
+      type: String,
+      default: "#3d3d3d"
+    },
+    darkPlaceholderColor: {
+      type: String,
+      default: "#999999"
+    },
+    tabindex: {
+      type: [String, Number],
+      default: 0
+    },
+    tabIndex: {
+      type: Number,
+      default: 0
+    },
+    hasTabIndexEnter: {
+      type: Boolean,
+      default: !0
+    },
+    hasTabIndexSpace: {
+      type: Boolean,
+      default: !0
+    },
+    ariaLabel: {
+      type: String,
+      default: "Select"
+    },
+    ariaAttrs: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  emits: ["clicked", "changed", "user-changed"],
+  setup(e, { emit: S }) {
+    Ue((a) => ({
+      v65344439: Ye.value,
+      v710765ac: t(E),
+      v7ca0dd96: t(Be),
+      cae33bdc: t(ue),
+      v675d52d0: t(_e),
+      v6299e2f0: t(Te),
+      v9c37df88: t(Ve),
+      v2be47de6: t($),
+      v03aa8eea: t(he),
+      v6fff1a94: t(i),
+      f8a7447e: t(z),
+      f6930ac4: t(we),
+      f324ebb8: t($e),
+      v0677637c: t(U),
+      v2f80d530: t(De),
+      v3df1dcda: t(He),
+      v2388a9d2: t(Oe),
+      v39084b0d: t(Ce),
+      v92b5dffe: t(me),
+      cf5f9c6c: a.styleButtonColor,
+      v7c1e3a22: Me.value,
+      v45dc07f6: t(de),
+      v5caacc6f: t(v),
+      v07d8d482: t(h),
+      v031672fb: t(O)
+    })), Ge(() => {
+      ee.value ? A.value = q.value || [] : f.value = M.value, document.addEventListener("click", ut), document.addEventListener("nbselect:close-all", st), Ne.value = !0;
+    }), _t(() => {
+      document.removeEventListener("click", ut), document.removeEventListener("nbselect:close-all", st);
+    });
+    const y = S, ae = e, {
+      display: V,
+      textColor: Q,
+      theme: ge,
+      hasBorderRadius: ie,
+      borderRadius: be,
+      disabled: u,
+      fontFamily: C,
+      fontSize: fe,
+      fontWeight: oe,
+      textAlign: ne,
+      selectWidth: ve,
+      inputStyle: Z,
+      selectName: ye,
+      required: re,
+      options: k,
+      selectedOptionOnly: M,
+      selectedOptionMultiple: q,
+      textKey: w,
+      valueKey: c,
+      multiple: ee,
+      hasEmptyOption: N,
+      emptyOptionValue: B,
+      dropdownScrollClass: H,
+      hasLabel: x,
+      labelText: K,
+      emptyOptionText: F,
+      lightBgColor: ue,
+      lightBgColorFocus: $,
+      lightBorderColor: he,
+      lightBorderColorFocus: Ce,
+      lightDisabledBgColor: de,
+      lightTextColor: E,
+      lightDisabledBorderColor: v,
+      lightOptionTextColor: Be,
+      lightOptionTextColorSelected: Te,
+      lightOptionBgColorSelected: _e,
+      lightPlaceholderColor: Ve,
+      darkBgColor: we,
+      darkBgColorFocus: He,
+      darkBorderColor: Oe,
+      darkBorderColorFocus: me,
+      darkDisabledBgColor: h,
+      darkTextColor: i,
+      darkDisabledBorderColor: O,
+      darkOptionTextColor: z,
+      darkOptionTextColorSelected: U,
+      darkOptionBgColorSelected: $e,
+      darkPlaceholderColor: De,
+      tabindex: Se,
+      tabIndex: ce,
+      hasTabIndexEnter: G,
+      hasTabIndexSpace: se,
+      ariaLabel: l,
+      ariaAttrs: p
+    } = Je(ae), f = J(null), A = J([]), Ne = J(!1), b = J(!1), g = J(!1), Ee = J(null), Ie = J(!1), W = J(null), X = J(null), L = J(-1), P = J(-1), te = o({
+      get: () => Array.isArray(A.value) ? A.value : [],
+      set: (a) => {
+        A.value = Array.isArray(a) ? a : [];
+      }
+    }), xe = o(() => {
+      const a = u.value ? "component-disabled" : "", n = V.value !== "b" ? "inline-block" : "block", r = Q.value ? Q.value : "#ffffff", s = C.value ? C.value : "'Lato', sans-serif", d = fe.value ? fe.value : "1.6rem", j = !oe.value || oe.value < 0 ? 100 : oe.value, Ot = ve.value ? ve.value : 200, St = !be.value || be.value < 0 ? 0 : be.value, kt = ie.value ? ie.value : !1, Bt = !ne.value || !["center", "left", "right"].includes(ne.value) ? "left" : ne.value, Tt = !Z.value || !["background", "line", "border"].includes(Z.value) ? "background" : Z.value;
+      return {
+        disabled: a,
+        display: n,
+        font: s,
+        fontSize: d,
+        fontWeight: j,
+        textColor: r,
+        selectWidth: Ot,
+        borderRadius: St,
+        hasBorderRadius: kt,
+        textAlign: Bt,
+        inputStyle: Tt
+      };
+    }), Fe = o(() => xe.value.disabled), je = o(() => ({
+      display: xe.value.display
+    })), Xe = o(() => {
+      const a = xe.value;
+      return {
+        color: a.textColor,
+        fontSize: a.fontSize,
+        fontWeight: a.fontWeight,
+        textAlign: a.textAlign
+      };
+    }), Ye = o(() => xe.value.font), Me = o(() => xe.value.textColor), We = o(() => {
+      const a = xe.value;
+      return a.display === "block" ? { width: "100%" } : {
+        width: `${a.selectWidth}px`
+      };
+    }), ze = o(() => {
+      const a = xe.value;
+      return a.inputStyle !== "line" && a.hasBorderRadius ? { borderRadius: `${a.borderRadius}rem` } : {};
+    }), qe = o(() => {
+      switch (ge.value) {
+        case "dark":
+          return "component__theme--dark";
+        default:
+          return "component__theme--light";
+      }
+    }), Pe = o(() => {
+      switch (Z.value) {
+        case "line":
+          return "component__input--line";
+        case "border":
+          return "component__input--border";
+        default:
+          return "component__input--background";
+      }
+    }), Ae = (a) => {
+      const n = k.value.map((d, j) => ({
+        value: d[c.value],
+        disabled: d.disabled || u.value,
+        index: j
+      }));
+      if (n.filter((d) => !d.disabled).length === 0)
+        return;
+      let s = P.value;
+      if (s < 0 && k.value.length > 0 && (s = 0), a === "down") {
+        let d = (s + 1) % n.length, j = 0;
+        for (; n[d].disabled && j < n.length; )
+          d = (d + 1) % n.length, j++;
+        n[d].disabled || (s = d);
+      } else if (a === "up") {
+        let d = s <= 0 ? n.length - 1 : s - 1, j = 0;
+        for (; n[d].disabled && j < n.length; )
+          d = d <= 0 ? n.length - 1 : d - 1, j++;
+        n[d].disabled || (s = d);
+      }
+      P.value = s, Y(() => {
+        const d = document.querySelector(`[data-option-index-multiple="${s}"]`);
+        d && d.focus();
+      });
+    }, et = (a) => {
+      if (!u.value) {
+        a.stopPropagation();
+        const n = b.value;
+        b.value = !b.value, !n && b.value ? (dt(), k.value.length > 0 && (P.value = 0, Y(() => {
+          const r = document.querySelector(`[data-option-index-multiple="${P.value}"]`);
+          r && r.focus();
+        }))) : b.value || (P.value = -1);
+      }
+    }, ut = (a) => {
+      a.target.closest(".component__dropdown") || (b.value = !1, g.value = !1);
+    }, gt = (a) => {
+      var n;
+      (b.value || g.value) && !((n = Ee.value) != null && n.contains(a.relatedTarget)) && setTimeout(() => {
+        var r;
+        Ie.value || (r = Ee.value) != null && r.contains(document.activeElement) || (b.value && (b.value = !1, P.value = -1, Y(() => {
+          X.value && X.value.focus();
+        })), g.value && (g.value = !1, L.value = -1, Y(() => {
+          W.value && W.value.focus();
+        })));
+      }, 100);
+    }, dt = () => {
+      document.dispatchEvent(new CustomEvent("nbselect:close-all", {
+        detail: { excludeId: ae.nbId }
+      }));
+    }, st = (a) => {
+      var n;
+      ((n = a.detail) == null ? void 0 : n.excludeId) !== ae.nbId && (b.value && (b.value = !1), g.value && (g.value = !1));
+    }, Le = (a) => {
+      const n = [];
+      if (N.value && n.push({ value: B.value, disabled: u.value, index: 0 }), n.push(...k.value.map((d, j) => ({
+        value: d[c.value],
+        disabled: d.disabled || u.value,
+        index: N.value ? j + 1 : j
+      }))), n.filter((d) => !d.disabled).length === 0)
+        return;
+      let s = L.value;
+      if (s < 0 && (s = N.value || k.value.length > 0 ? 0 : -1), a === "down") {
+        let d = (s + 1) % n.length, j = 0;
+        for (; n[d].disabled && j < n.length; )
+          d = (d + 1) % n.length, j++;
+        n[d].disabled || (s = d);
+      } else if (a === "up") {
+        let d = s <= 0 ? n.length - 1 : s - 1, j = 0;
+        for (; n[d].disabled && j < n.length; )
+          d = d <= 0 ? n.length - 1 : d - 1, j++;
+        n[d].disabled || (s = d);
+      }
+      L.value = s, Y(() => {
+        const d = document.querySelector(`[data-option-index-single="${s}"]`);
+        d && d.focus();
+      });
+    }, it = () => {
+      !u.value && g.value && (g.value = !1, L.value = -1, Y(() => {
+        W.value && W.value.focus();
+      }));
+    }, bt = () => {
+      !u.value && b.value && (b.value = !1, P.value = -1, Y(() => {
+        X.value && X.value.focus();
+      }));
+    }, tt = (a) => {
+      if (!u.value) {
+        a.stopPropagation();
+        const n = g.value;
+        g.value = !g.value, !n && g.value ? (dt(), L.value = N.value ? 0 : -1, !N.value && k.value.length > 0 && (L.value = 0), Y(() => {
+          const r = document.querySelector(`[data-option-index-single="${L.value}"]`);
+          r && r.focus();
+        })) : g.value || (L.value = -1);
+      }
+    }, Ke = (a) => {
+      u.value || (Ie.value = !0, f.value = a, g.value = !1, L.value = -1, ft(a), setTimeout(() => {
+        Ie.value = !1, Y(() => {
+          W.value && W.value.focus();
+        });
+      }, 150));
+    }, yt = () => {
+      if (!f.value || f.value === B.value)
+        return F.value;
+      const a = k.value.find(
+        (n) => n[c.value] === f.value
+      );
+      return a ? a[w.value] : F.value;
+    }, ht = () => {
+      const a = k.value.filter(
+        (n) => te.value.includes(n[c.value])
+      );
+      return a.length === 0 ? F.value : a.length === 1 ? a[0][w.value] : `${a.length} itens selecionados`;
+    }, ot = (a) => {
+      if (u.value)
+        return;
+      Ie.value = !0;
+      const n = [...te.value];
+      if (n.includes(a)) {
+        const r = n.filter((s) => s !== a);
+        te.value = r;
+      } else
+        te.value = [...n, a];
+      ft(te.value), setTimeout(() => {
+        Ie.value = !1;
+      }, 150);
+    }, ft = (a) => {
+      y("user-changed", a);
+    }, Ct = o(() => {
+      const a = {};
+      p.value && Object.keys(p.value).forEach((s) => a[`aria-${s}`] = p.value[s]);
+      const n = {
+        "aria-label": l.value,
+        "aria-disabled": u.value,
+        ...a
+      };
+      return Object.fromEntries(
+        Object.entries(n).filter(([r, s]) => s != null)
+      );
+    }), mt = (a) => {
+      if (!u.value) {
+        if (g.value)
+          switch (a.key) {
+            case "ArrowDown":
+              a.preventDefault(), Le("down");
+              return;
+            case "ArrowUp":
+              a.preventDefault(), Le("up");
+              return;
+          }
+        switch (a.key) {
+          case "Enter":
+            G.value && (a.preventDefault(), g.value ? (g.value = !1, L.value = -1, Y(() => {
+              W.value && W.value.focus();
+            })) : tt(a));
+            break;
+          case " ":
+            se.value && (a.preventDefault(), g.value ? (g.value = !1, L.value = -1, Y(() => {
+              W.value && W.value.focus();
+            })) : tt(a));
+            break;
+          case "Escape":
+            g.value && (a.preventDefault(), g.value = !1, L.value = -1, Y(() => {
+              W.value && W.value.focus();
+            }));
+            break;
+          case "ArrowDown":
+            a.preventDefault(), g.value || tt(a);
+            break;
+          case "ArrowUp":
+            a.preventDefault(), g.value && (g.value = !1, L.value = -1, Y(() => {
+              W.value && W.value.focus();
+            }));
+            break;
+        }
+      }
+    }, xt = (a) => {
+      if (!u.value) {
+        if (b.value)
+          switch (a.key) {
+            case "ArrowDown":
+              a.preventDefault(), Ae("down");
+              return;
+            case "ArrowUp":
+              a.preventDefault(), Ae("up");
+              return;
+          }
+        switch (a.key) {
+          case "Enter":
+            G.value && (a.preventDefault(), b.value ? (b.value = !1, P.value = -1, Y(() => {
+              X.value && X.value.focus();
+            })) : et(a));
+            break;
+          case " ":
+            se.value && (a.preventDefault(), b.value ? (b.value = !1, P.value = -1, Y(() => {
+              X.value && X.value.focus();
+            })) : et(a));
+            break;
+          case "Escape":
+            b.value && (a.preventDefault(), b.value = !1, P.value = -1, Y(() => {
+              X.value && X.value.focus();
+            }));
+            break;
+          case "ArrowDown":
+            a.preventDefault(), b.value || et(a);
+            break;
+          case "ArrowUp":
+            a.preventDefault(), b.value && (b.value = !1, P.value = -1, Y(() => {
+              X.value && X.value.focus();
+            }));
+            break;
+        }
+      }
+    };
+    return pe(f, (a, n) => {
+      Ne.value && a !== n && y("changed", a);
+    }), pe(M, (a, n) => {
+      a !== n && (f.value = a);
+    }), pe(A, (a, n) => {
+      Ne.value && a !== n && y("changed", a);
+    }), pe(q, (a, n) => {
+      a !== n && (A.value = a || []);
+    }), (a, n) => e.nbId ? (T(), _("div", {
+      key: 0,
+      ref_key: "wrapperRef",
+      ref: Ee,
+      class: R(["nb-wrapper", Fe.value]),
+      style: Re([je.value, We.value]),
+      onFocusout: gt
+    }, [
+      I("div", Qe({
+        id: e.nbId,
+        ref: e.nbId,
+        class: ["nb-reset", "component", qe.value, Pe.value],
+        style: [Xe.value, We.value, ze.value]
+      }, Ct.value), [
+        t(x) ? (T(), _("label", {
+          key: 0,
+          for: t(ye),
+          class: "component__label"
+        }, [
+          nt(le(t(K)), 1),
+          t(re) ? (T(), _("span", Ht, "*")) : ke("", !0)
+        ], 8, wt)) : ke("", !0),
+        t(ee) ? (T(), _("div", {
+          key: 2,
+          class: R(["component__dropdown", { open: b.value, disabled: t(u) }])
+        }, [
+          I("div", {
+            ref_key: "dropdownFieldMultipleRef",
+            ref: X,
+            class: R(["component__dropdown-field", { "has-selection": te.value.length > 0 }]),
+            style: Re([ze.value]),
+            tabindex: t(u) ? -1 : t(ce) >= 0 ? t(ce) : t(Se),
+            onClick: et,
+            onKeydown: xt
+          }, [
+            te.value.length === 0 ? (T(), _("span", Wt, le(t(F)), 1)) : (T(), _("span", Lt, le(ht()), 1)),
+            I("span", {
+              class: R(["component__dropdown-arrow", { open: b.value }])
+            }, "▼", 2)
+          ], 46, Rt),
+          b.value ? (T(), _("div", {
+            key: 0,
+            class: R(["component__checkbox-group", t(H)]),
+            role: "listbox"
+          }, [
+            (T(!0), _(vt, null, ct(t(k), (r, s) => (T(), _("label", {
+              key: s,
+              "data-option-index-multiple": s,
+              class: R(["component__checkbox-option", {
+                disabled: r.disabled || t(u),
+                selected: te.value.includes(r[t(c)])
+              }]),
+              tabindex: r.disabled || t(u) ? -1 : P.value === s ? 0 : -1,
+              role: "option",
+              "aria-selected": te.value.includes(r[t(c)]),
+              onClick: m((d) => !r.disabled && !t(u) && ot(r[t(c)]), ["prevent"]),
+              onKeydown: [
+                D(m((d) => !r.disabled && !t(u) && t(G) && ot(r[t(c)]), ["prevent"]), ["enter"]),
+                D(m((d) => !r.disabled && !t(u) && t(se) && ot(r[t(c)]), ["prevent"]), ["space"]),
+                D(m((d) => !r.disabled && !t(u) && Ae("down"), ["prevent"]), ["arrow-down"]),
+                D(m((d) => !r.disabled && !t(u) && Ae("up"), ["prevent"]), ["arrow-up"]),
+                D(m((d) => !r.disabled && !t(u) && bt(), ["prevent"]), ["escape"])
+              ]
+            }, [
+              I("input", {
+                type: "checkbox",
+                value: r[t(c)],
+                checked: te.value.includes(r[t(c)]),
+                disabled: r.disabled || t(u),
+                onClick: n[6] || (n[6] = m(() => {
+                }, ["stop"]))
+              }, null, 8, Ft),
+              I("span", jt, [
+                pt(a.$slots, "slot-select-item", {
+                  propRow: r,
+                  propIndex: s
+                }, () => [
+                  nt(le(r[t(w)]), 1)
+                ], !0)
+              ])
+            ], 42, Kt))), 128))
+          ], 2)) : ke("", !0)
+        ], 2)) : (T(), _("div", {
+          key: 1,
+          class: R(["component__dropdown", { open: g.value, disabled: t(u) }])
+        }, [
+          I("div", {
+            ref_key: "dropdownFieldSingleRef",
+            ref: W,
+            class: R(["component__dropdown-field", { "has-selection": f.value !== null && f.value !== t(B) }]),
+            style: Re([ze.value]),
+            tabindex: t(u) ? -1 : t(ce) >= 0 ? t(ce) : t(Se),
+            onClick: tt,
+            onKeydown: mt
+          }, [
+            !f.value || f.value === t(B) ? (T(), _("span", Dt, le(t(F)), 1)) : (T(), _("span", It, le(yt()), 1)),
+            I("span", {
+              class: R(["component__dropdown-arrow", { open: g.value }])
+            }, "▼", 2)
+          ], 46, $t),
+          g.value ? (T(), _("div", {
+            key: 0,
+            class: R(["component__option-group", t(H)]),
+            role: "listbox"
+          }, [
+            t(N) ? (T(), _("div", {
+              key: 0,
+              "data-option-index-single": "0",
+              class: R(["component__option-item", {
+                disabled: t(u),
+                selected: !f.value || f.value === t(B)
+              }]),
+              tabindex: t(u) ? -1 : L.value === 0 ? 0 : -1,
+              role: "option",
+              "aria-selected": !f.value || f.value === t(B),
+              onClick: n[0] || (n[0] = m((r) => !t(u) && Ke(t(B)), ["prevent"])),
+              onKeydown: [
+                n[1] || (n[1] = D(m((r) => !t(u) && t(G) && Ke(t(B)), ["prevent"]), ["enter"])),
+                n[2] || (n[2] = D(m((r) => !t(u) && t(se) && Ke(t(B)), ["prevent"]), ["space"])),
+                n[3] || (n[3] = D(m((r) => !t(u) && Le("down"), ["prevent"]), ["arrow-down"])),
+                n[4] || (n[4] = D(m((r) => !t(u) && Le("up"), ["prevent"]), ["arrow-up"])),
+                n[5] || (n[5] = D(m((r) => !t(u) && it(), ["prevent"]), ["escape"]))
+              ]
+            }, [
+              I("span", Nt, le(t(F)), 1)
+            ], 42, At)) : ke("", !0),
+            (T(!0), _(vt, null, ct(t(k), (r, s) => (T(), _("div", {
+              key: s,
+              "data-option-index-single": t(N) ? s + 1 : s,
+              class: R(["component__option-item", {
+                disabled: r.disabled || t(u),
+                selected: f.value === r[t(c)]
+              }]),
+              tabindex: r.disabled || t(u) ? -1 : L.value === (t(N) ? s + 1 : s) ? 0 : -1,
+              role: "option",
+              "aria-selected": f.value === r[t(c)],
+              onClick: m((d) => !r.disabled && !t(u) && Ke(r[t(c)]), ["prevent"]),
+              onKeydown: [
+                D(m((d) => !r.disabled && !t(u) && t(G) && Ke(r[t(c)]), ["prevent"]), ["enter"]),
+                D(m((d) => !r.disabled && !t(u) && t(se) && Ke(r[t(c)]), ["prevent"]), ["space"]),
+                D(m((d) => !r.disabled && !t(u) && Le("down"), ["prevent"]), ["arrow-down"]),
+                D(m((d) => !r.disabled && !t(u) && Le("up"), ["prevent"]), ["arrow-up"]),
+                D(m((d) => !r.disabled && !t(u) && it(), ["prevent"]), ["escape"])
+              ]
+            }, [
+              I("span", zt, [
+                pt(a.$slots, "slot-select-item", {
+                  propRow: r,
+                  propIndex: s
+                }, () => [
+                  nt(le(r[t(w)]), 1)
+                ], !0)
+              ])
+            ], 42, Et))), 128))
+          ], 2)) : ke("", !0)
+        ], 2))
+      ], 16, Vt)
+    ], 38)) : ke("", !0);
+  }
+}), Yt = /* @__PURE__ */ Ze(Xt, [["__scopeId", "data-v-7feeaa38"]]);
+const Mt = ["tabIndex"], qt = ["id"], Pt = ["id", "disabled"], Ut = ["for"], Gt = {
+  key: 0,
+  class: "component-label-text"
+}, Jt = {
+  key: 1,
+  class: "component-label-text"
+}, Qt = /* @__PURE__ */ Object.assign({
+  name: "NbToggleLight",
+  inheritAttrs: !1
+}, {
+  __name: "NbToggleLight",
+  props: {
+    nbId: {
+      type: String,
+      required: !0
+    },
+    value: {
+      type: Boolean,
+      default: !1
+    },
+    tabIndex: {
+      type: Number,
+      default: 0
+    },
+    hasTabIndexEnter: {
+      type: Boolean,
+      default: !0
+    },
+    hasTabIndexSpace: {
+      type: Boolean,
+      default: !0
+    },
+    ariaLabel: {
+      type: String,
+      default: "Alternate Text Button"
+    },
+    ariaAttrs: {
+      type: Object,
+      default: () => ({})
+    },
+    theme: {
+      type: String,
+      default: "light",
+      validator: (e) => {
+        const S = e ? e.toLowerCase() : "";
+        return ["light", "dark"].includes(S);
+      }
+    },
+    // Cores do tema light
+    lightTextColor: {
+      type: String,
+      default: "#8e8e8e"
+    },
+    lightButtonColor: {
+      type: String,
+      default: "#eaeaea"
+    },
+    lightTextBgColor: {
+      type: String,
+      default: "#f8f8f2"
+    },
+    // Cores do tema dark
+    darkTextColor: {
+      type: String,
+      default: "#e0e0e0"
+    },
+    darkButtonColor: {
+      type: String,
+      default: "#2d2d2d"
+    },
+    darkTextBgColor: {
+      type: String,
+      default: "#3d3d3d"
+    },
+    borderRadius: {
+      type: Number,
+      default: 0
+    },
+    width: {
+      type: Number,
+      default: 55,
+      validator: (e) => e || 55
+    },
+    paddingX: {
+      type: Number,
+      default: 1,
+      validator: (e) => e || 1
+    },
+    paddingY: {
+      type: Number,
+      default: 0.2,
+      validator: (e) => e || 0.2
+    },
+    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: 200,
+      validator: (e) => e || 200
+    },
+    hasAnimation: {
+      type: Boolean,
+      default: !1,
+      validator: (e) => typeof e == "boolean" && [!0, !1].includes(e)
+    },
+    textEnable: {
+      type: String,
+      default: "On"
+    },
+    textDisable: {
+      type: String,
+      default: "Off"
+    },
+    buttonSize: {
+      type: Number,
+      default: 30
+    }
+  },
+  emits: ["clicked", "current-value"],
+  setup(e, { emit: S }) {
+    Ue((i) => ({
+      v3531e937: he.value,
+      v22553608: Ve.value,
+      v30d9bc4b: we.value,
+      v6310c7e9: de.value,
+      v710ac044: E.value,
+      c5a0b5b8: v.value,
+      v40a22417: Be.value,
+      v2fb5c8f2: Te.value,
+      v5bdaadd2: _e.value
+    }));
+    const y = S;
+    Ge(() => {
+      h();
+    });
+    const ae = e, {
+      nbId: V,
+      value: Q,
+      textEnable: ge,
+      textDisable: ie,
+      hasAnimation: be,
+      ariaLabel: u,
+      ariaAttrs: C,
+      theme: fe,
+      lightTextColor: oe,
+      lightButtonColor: ne,
+      lightTextBgColor: ve,
+      darkTextColor: Z,
+      darkButtonColor: ye,
+      darkTextBgColor: re,
+      borderRadius: k,
+      width: M,
+      paddingX: q,
+      paddingY: w,
+      disabled: c,
+      fontFamily: ee,
+      fontSize: N,
+      fontWeight: B,
+      buttonSize: H
+    } = Je(ae), x = J(!1), K = o(() => {
+      const i = c.value ? "component-disabled" : "", O = "inline-block", z = !k.value || k.value < 0 ? 0 : k.value, U = !M.value || M.value < 55 ? 55 : M.value, $e = !q.value || q.value < 0 ? 1 : q.value, De = !w.value || w.value < 0 ? 0.2 : w.value, Se = ee.value ? ee.value : "'Lato', sans-serif", ce = N.value ? N.value : "1.6em", G = !B.value || B.value < 0 ? 200 : B.value, se = !H.value || H.value < 0 || H.value > 50 ? 30 : H.value;
+      return {
+        disabled: i,
+        display: O,
+        borderRadius: z,
+        width: U,
+        paddingX: $e,
+        paddingY: De,
+        font: Se,
+        fontSize: ce,
+        fontWeight: G,
+        buttonSize: se
+      };
+    }), F = o(() => K.value.disabled), ue = o(() => ({
+      display: K.value.display
+    })), $ = o(() => {
+      const i = K.value;
+      return {
+        minWidth: "33px",
+        width: `${i.width}px`,
+        // padding: `${defaultValues.paddingY}rem ${defaultValues.paddingX}rem`,
+        lineHeight: "1.42857143",
+        fontSize: i.fontSize,
+        fontWeight: i.fontWeight
+      };
+    }), he = o(() => K.value.font), Ce = o(() => fe.value === "dark" ? "component__theme--dark" : "component__theme--light"), de = o(() => oe.value), E = o(() => ne.value), v = o(() => ve.value), Be = o(() => Z.value), Te = o(() => ye.value), _e = o(() => re.value), Ve = o(() => `${K.value.buttonSize}%`), we = o(() => `${K.value.borderRadius}rem`), He = o(() => {
+      const i = {};
+      C.value && Object.keys(C.value).forEach((U) => i[`aria-${U}`] = C.value[U]);
+      const O = {
+        "aria-label": u.value,
+        "aria-checked": x.value,
+        "aria-disabled": c.value,
+        ...i
+      };
+      return Object.fromEntries(
+        Object.entries(O).filter(([z, U]) => U != null)
+      );
+    }), Oe = () => {
+      c.value || y("clicked");
+    }, me = () => {
+      c.value || (x.value = !x.value, y("clicked"));
+    }, h = () => {
+      const i = Q.value;
+      x.value = i, y("current-value", i);
+    };
+    return pe(x, (i) => {
+      y("current-value", i);
+    }), pe(Q, () => {
+      h();
+    }), (i, O) => t(V) ? (T(), _("div", Qe({
+      key: 0,
+      class: ["nb-wrapper", F.value],
+      style: [ue.value],
+      tabIndex: t(c) ? -1 : e.tabIndex,
+      role: "button"
+    }, He.value, {
+      onKeydown: [
+        O[1] || (O[1] = D(m((z) => !t(c) && e.hasTabIndexEnter && me(), ["prevent"]), ["enter"])),
+        O[2] || (O[2] = D(m((z) => !t(c) && e.hasTabIndexSpace && me(), ["prevent"]), ["space"]))
+      ]
+    }), [
+      I("div", {
+        id: t(V),
+        class: R(["nb-reset", "component", Ce.value]),
+        style: Re([$.value])
+      }, [
+        lt(I("input", {
+          id: `${t(V)}-input`,
+          "onUpdate:modelValue": O[0] || (O[0] = (z) => x.value = z),
+          type: "checkbox",
+          disabled: t(c),
+          class: "component-input",
+          onChange: Oe
+        }, null, 40, Pt), [
+          [at, x.value]
+        ]),
+        I("label", {
+          for: `${t(V)}-input`,
+          class: R(["component-label", [
+            x.value ? "component-button--left" : "component-button--right",
+            t(be) ? "component-label-text-animation" : ""
+          ]])
+        }, [
+          O[3] || (O[3] = I("div", { class: "component-label-button" }, null, -1)),
+          x.value ? (T(), _("span", Gt, le(t(ge)), 1)) : (T(), _("span", Jt, le(t(ie)), 1))
+        ], 10, Ut)
+      ], 14, qt)
+    ], 16, Mt)) : ke("", !0);
+  }
+}), Zt = /* @__PURE__ */ Ze(Qt, [["__scopeId", "data-v-e7c5d5fc"]]);
+const el = ["tabIndex"], tl = ["id"], ll = ["id", "disabled"], al = ["for"], ol = {
+  key: 0,
+  class: "component-label-text"
+}, nl = {
+  key: 1,
+  class: "component-label-text"
+}, rl = /* @__PURE__ */ Object.assign({
+  name: "NbTest",
+  inheritAttrs: !1
+}, {
+  __name: "NbToggleSlim",
+  props: {
+    nbId: {
+      type: String,
+      required: !0
+    },
+    value: {
+      type: Boolean,
+      default: !1
+    },
+    tabIndex: {
+      type: Number,
+      default: 0
+    },
+    hasTabIndexEnter: {
+      type: Boolean,
+      default: !0
+    },
+    hasTabIndexSpace: {
+      type: Boolean,
+      default: !0
+    },
+    ariaLabel: {
+      type: String,
+      default: "Alternate Text Button"
+    },
+    ariaAttrs: {
+      type: Object,
+      default: () => ({})
+    },
+    theme: {
+      type: String,
+      default: "light",
+      validator: (e) => {
+        const S = e ? e.toLowerCase() : "";
+        return ["light", "dark"].includes(S);
+      }
+    },
+    // Cores do tema light
+    lightTextColor: {
+      type: String,
+      default: "#8e8e8e"
+    },
+    lightButtonColor: {
+      type: String,
+      default: "#eaeaea"
+    },
+    lightTextBgColor: {
+      type: String,
+      default: "#f8f8f2"
+    },
+    // Cores do tema dark
+    darkTextColor: {
+      type: String,
+      default: "#e0e0e0"
+    },
+    darkButtonColor: {
+      type: String,
+      default: "#2d2d2d"
+    },
+    darkTextBgColor: {
+      type: String,
+      default: "#3d3d3d"
+    },
+    borderRadius: {
+      type: Number,
+      default: 0
+    },
+    width: {
+      type: Number,
+      default: 55,
+      validator: (e) => e || 55
+    },
+    paddingX: {
+      type: Number,
+      default: 1,
+      validator: (e) => e || 1
+    },
+    paddingY: {
+      type: Number,
+      default: 0.2,
+      validator: (e) => e || 0.2
+    },
+    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: 200,
+      validator: (e) => e || 200
+    },
+    textEnable: {
+      type: String,
+      default: "On"
+    },
+    textDisable: {
+      type: String,
+      default: "Off"
+    },
+    buttonSize: {
+      type: Number,
+      default: 30
+    }
+  },
+  emits: ["clicked", "current-value"],
+  setup(e, { emit: S }) {
+    Ue((h) => ({
+      v7d859b54: $.value,
+      ae83a282: _e.value,
+      v13b7214e: Ve.value,
+      v0428f82c: Ce.value,
+      v2cd7ebc7: de.value,
+      v58fcd0a7: E.value,
+      v8d1d4118: v.value,
+      v9cb8bde2: Be.value,
+      v446ef422: Te.value
+    }));
+    const y = S;
+    Ge(() => {
+      me();
+    });
+    const ae = e, {
+      nbId: V,
+      value: Q,
+      textEnable: ge,
+      textDisable: ie,
+      ariaLabel: be,
+      ariaAttrs: u,
+      theme: C,
+      lightTextColor: fe,
+      lightButtonColor: oe,
+      lightTextBgColor: ne,
+      darkTextColor: ve,
+      darkButtonColor: Z,
+      darkTextBgColor: ye,
+      borderRadius: re,
+      width: k,
+      paddingX: M,
+      paddingY: q,
+      disabled: w,
+      fontFamily: c,
+      fontSize: ee,
+      fontWeight: N,
+      buttonSize: B
+    } = Je(ae), H = J(!1), x = o(() => {
+      const h = w.value ? "component-disabled" : "", i = "inline-block", O = !re.value || re.value < 0 ? 0 : re.value, z = !k.value || k.value < 55 ? 55 : k.value, U = !M.value || M.value < 0 ? 1 : M.value, $e = !q.value || q.value < 0 ? 0.2 : q.value, De = c.value ? c.value : "'Lato', sans-serif", Se = ee.value ? ee.value : "1.6em", ce = !N.value || N.value < 0 ? 200 : N.value, G = !B.value || B.value < 0 || B.value > 50 ? 30 : B.value;
+      return {
+        disabled: h,
+        display: i,
+        borderRadius: O,
+        width: z,
+        paddingX: U,
+        paddingY: $e,
+        font: De,
+        fontSize: Se,
+        fontWeight: ce,
+        buttonSize: G
+      };
+    }), K = o(() => x.value.disabled), F = o(() => ({
+      display: x.value.display
+    })), ue = o(() => {
+      const h = x.value;
+      return {
+        minWidth: "33px",
+        width: `${h.width}px`,
+        // padding: `${defaultValues.paddingY}rem ${defaultValues.paddingX}rem`,
+        lineHeight: "1.42857143",
+        fontSize: h.fontSize,
+        fontWeight: h.fontWeight
+      };
+    }), $ = o(() => x.value.font), he = o(() => C.value === "dark" ? "component__theme--dark" : "component__theme--light"), Ce = o(() => fe.value), de = o(() => oe.value), E = o(() => ne.value), v = o(() => ve.value), Be = o(() => Z.value), Te = o(() => ye.value), _e = o(() => `${x.value.buttonSize}%`), Ve = o(() => `${x.value.borderRadius}rem`), we = o(() => {
+      const h = {};
+      u.value && Object.keys(u.value).forEach((z) => h[`aria-${z}`] = u.value[z]);
+      const i = {
+        "aria-label": be.value,
+        "aria-checked": H.value,
+        "aria-disabled": w.value,
+        ...h
+      };
+      return Object.fromEntries(
+        Object.entries(i).filter(([O, z]) => z != null)
+      );
+    }), He = () => {
+      w.value || y("clicked");
+    }, Oe = () => {
+      w.value || (H.value = !H.value, y("clicked"));
+    }, me = () => {
+      const h = Q.value;
+      H.value = h, y("current-value", h);
+    };
+    return pe(H, (h) => {
+      y("current-value", h);
+    }), pe(Q, () => {
+      me();
+    }), (h, i) => t(V) ? (T(), _("div", Qe({
+      key: 0,
+      class: ["nb-wrapper", K.value],
+      style: [F.value],
+      tabIndex: t(w) ? -1 : e.tabIndex,
+      role: "button"
+    }, we.value, {
+      onKeydown: [
+        i[1] || (i[1] = D(m((O) => !t(w) && e.hasTabIndexEnter && Oe(), ["prevent"]), ["enter"])),
+        i[2] || (i[2] = D(m((O) => !t(w) && e.hasTabIndexSpace && Oe(), ["prevent"]), ["space"]))
+      ]
+    }), [
+      I("div", {
+        id: t(V),
+        class: R(["nb-reset", "component", he.value]),
+        style: Re([ue.value])
+      }, [
+        lt(I("input", {
+          id: `${t(V)}-input`,
+          "onUpdate:modelValue": i[0] || (i[0] = (O) => H.value = O),
+          type: "checkbox",
+          disabled: t(w),
+          class: "component-input",
+          onChange: He
+        }, null, 40, ll), [
+          [at, H.value]
+        ]),
+        I("label", {
+          for: `${t(V)}-input`,
+          class: R(["component-label", [
+            H.value ? "component-button--left" : "component-button--right"
+          ]])
+        }, [
+          i[3] || (i[3] = I("div", { class: "component-label-button" }, null, -1)),
+          H.value ? (T(), _("span", ol, le(t(ge)), 1)) : (T(), _("span", nl, le(t(ie)), 1))
+        ], 10, al)
+      ], 14, tl)
+    ], 16, el)) : ke("", !0);
+  }
+}), ul = /* @__PURE__ */ Ze(rl, [["__scopeId", "data-v-d3eeac20"]]);
+const dl = ["tabIndex"], sl = ["id"], il = ["id", "disabled"], fl = ["for", "data-tg-off", "data-tg-on"], vl = /* @__PURE__ */ Object.assign({
+  name: "NbToggleFlip",
+  inheritAttrs: !1
+}, {
+  __name: "NbToggleFlip",
+  props: {
+    nbId: {
+      type: String,
+      required: !0
+    },
+    value: {
+      type: Boolean,
+      default: !1
+    },
+    tabIndex: {
+      type: Number,
+      default: 0
+    },
+    hasTabIndexEnter: {
+      type: Boolean,
+      default: !0
+    },
+    hasTabIndexSpace: {
+      type: Boolean,
+      default: !0
+    },
+    ariaLabel: {
+      type: String,
+      default: "Alternate Text Button"
+    },
+    ariaAttrs: {
+      type: Object,
+      default: () => ({})
+    },
+    theme: {
+      type: String,
+      default: "light",
+      validator: (e) => {
+        const S = e ? e.toLowerCase() : "";
+        return ["light", "dark"].includes(S);
+      }
+    },
+    // Cores do tema light
+    lightTextColorOn: {
+      type: String,
+      default: "#4a4a4a"
+    },
+    lightTextColorOnHover: {
+      type: String,
+      default: "#3a3a3a"
+    },
+    lightTextColorOff: {
+      type: String,
+      default: "#585858"
+    },
+    lightTextColorOffHover: {
+      type: String,
+      default: "#707070"
+    },
+    lightButtonColorOn: {
+      type: String,
+      default: "#f8f8f2"
+    },
+    lightButtonColorOnHover: {
+      type: String,
+      default: "#e8e8e2"
+    },
+    lightButtonColorOff: {
+      type: String,
+      default: "#d5d5d5"
+    },
+    lightButtonColorOffHover: {
+      type: String,
+      default: "#c0c0c0"
+    },
+    // Cores do tema dark
+    darkTextColorOn: {
+      type: String,
+      default: "#f8f8f8"
+    },
+    darkTextColorOnHover: {
+      type: String,
+      default: "#ffffff"
+    },
+    darkTextColorOff: {
+      type: String,
+      default: "#909090"
+    },
+    darkTextColorOffHover: {
+      type: String,
+      default: "#b0b0b0"
+    },
+    darkButtonColorOn: {
+      type: String,
+      default: "#3d3d3d"
+    },
+    darkButtonColorOnHover: {
+      type: String,
+      default: "#4d4d4d"
+    },
+    darkButtonColorOff: {
+      type: String,
+      default: "#2c2c2c"
+    },
+    darkButtonColorOffHover: {
+      type: String,
+      default: "#2d2d2d"
+    },
+    borderRadius: {
+      type: Number,
+      default: 0
+    },
+    width: {
+      type: Number,
+      default: 86,
+      validator: (e) => e || 86
+    },
+    paddingX: {
+      type: Number,
+      default: 1,
+      validator: (e) => e || 1
+    },
+    paddingY: {
+      type: Number,
+      default: 0.2,
+      validator: (e) => e || 0.2
+    },
+    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 || 200
+    },
+    textEnable: {
+      type: String,
+      default: "On"
+    },
+    textDisable: {
+      type: String,
+      default: "Off"
+    }
+  },
+  emits: ["clicked", "current-value"],
+  setup(e, { emit: S }) {
+    Ue((l) => ({
+      ac6aa1d0: Ve.value,
+      v4696e6e9: Oe.value,
+      cc154ff4: He.value,
+      v6b4169e8: z.value,
+      v64b0c7af: i.value,
+      v32476034: $e.value,
+      v89819b8a: O.value,
+      bf08ab54: De.value,
+      v21ae018d: me.value,
+      v14122f81: h.value,
+      v06285af4: U.value
+    }));
+    const y = S;
+    Ge(() => {
+      se();
+    });
+    const ae = e, {
+      nbId: V,
+      value: Q,
+      textEnable: ge,
+      textDisable: ie,
+      ariaLabel: be,
+      ariaAttrs: u,
+      theme: C,
+      lightButtonColorOn: fe,
+      lightButtonColorOff: oe,
+      lightButtonColorOnHover: ne,
+      lightButtonColorOffHover: ve,
+      lightTextColorOn: Z,
+      lightTextColorOff: ye,
+      lightTextColorOnHover: re,
+      lightTextColorOffHover: k,
+      darkButtonColorOn: M,
+      darkButtonColorOff: q,
+      darkButtonColorOnHover: w,
+      darkButtonColorOffHover: c,
+      darkTextColorOn: ee,
+      darkTextColorOff: N,
+      darkTextColorOnHover: B,
+      darkTextColorOffHover: H,
+      borderRadius: x,
+      width: K,
+      paddingX: F,
+      paddingY: ue,
+      disabled: $,
+      fontFamily: he,
+      fontSize: Ce,
+      fontWeight: de
+    } = Je(ae), E = J(!1), v = o(() => {
+      const l = $.value ? "component-disabled" : "", p = "inline-block", f = !x.value || x.value < 0 ? 0 : x.value, A = !K.value || K.value < 86 ? 86 : K.value, Ne = !F.value || F.value < 0 ? 1 : F.value, b = !ue.value || ue.value < 0 ? 0.2 : ue.value, g = he.value ? he.value : "'Lato', sans-serif", Ee = Ce.value ? Ce.value : "1.6em", Ie = !de.value || de.value < 0 ? 200 : de.value, W = fe.value ? fe.value : "#f8f8f2", X = oe.value ? oe.value : "#d5d5d5", L = ne.value ? ne.value : "#e8e8e2", P = ve.value ? ve.value : "#c0c0c0", te = Z.value ? Z.value : "#4a4a4a", xe = ye.value ? ye.value : "#909090", Fe = re.value ? re.value : "#3a3a3a", je = k.value ? k.value : "#707070", Xe = M.value ? M.value : "#3d3d3d", Ye = q.value ? q.value : "#1d1d1d", Me = w.value ? w.value : "#4d4d4d", We = c.value ? c.value : "#2d2d2d", ze = ee.value ? ee.value : "#f8f8f8", qe = N.value ? N.value : "#909090", Pe = B.value ? B.value : "#ffffff", Ae = H.value ? H.value : "#b0b0b0";
+      return {
+        disabled: l,
+        display: p,
+        lightButtonColorOn: W,
+        lightButtonColorOff: X,
+        lightButtonColorOnHover: L,
+        lightButtonColorOffHover: P,
+        lightTextColorOn: te,
+        lightTextColorOff: xe,
+        lightTextColorOnHover: Fe,
+        lightTextColorOffHover: je,
+        darkButtonColorOn: Xe,
+        darkButtonColorOff: Ye,
+        darkButtonColorOnHover: Me,
+        darkButtonColorOffHover: We,
+        darkTextColorOn: ze,
+        darkTextColorOff: qe,
+        darkTextColorOnHover: Pe,
+        darkTextColorOffHover: Ae,
+        borderRadius: f,
+        width: A,
+        paddingX: Ne,
+        paddingY: b,
+        font: g,
+        fontSize: Ee,
+        fontWeight: Ie
+      };
+    }), Be = o(() => v.value.disabled), Te = o(() => ({
+      display: v.value.display
+    })), _e = o(() => {
+      const l = v.value;
+      return {
+        minWidth: "33px",
+        width: l.display === "block" ? "auto" : `${l.width}px`,
+        lineHeight: "1.42857143",
+        fontSize: l.fontSize,
+        fontWeight: l.fontWeight
+      };
+    }), Ve = o(() => v.value.font), we = o(() => C.value === "dark" ? "component__theme--dark" : "component__theme--light"), He = o(() => `${v.value.borderRadius}rem`), Oe = o(() => {
+      const l = v.value;
+      return `${l.paddingY}rem ${l.paddingX}rem`;
+    }), me = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightTextColorOn : l.darkTextColorOn;
+    }), h = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightTextColorOff : l.darkTextColorOff;
+    }), i = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightTextColorOnHover : l.darkTextColorOnHover;
+    }), O = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightTextColorOffHover : l.darkTextColorOffHover;
+    }), z = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightButtonColorOn : l.darkButtonColorOn;
+    }), U = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightButtonColorOff : l.darkButtonColorOff;
+    }), $e = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightButtonColorOnHover : l.darkButtonColorOnHover;
+    }), De = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightButtonColorOffHover : l.darkButtonColorOffHover;
+    }), Se = o(() => {
+      const l = {};
+      u.value && Object.keys(u.value).forEach((A) => l[`aria-${A}`] = u.value[A]);
+      const p = {
+        "aria-label": be.value,
+        "aria-disabled": $.value,
+        ...l
+      };
+      return Object.fromEntries(
+        Object.entries(p).filter(([f, A]) => A != null)
+      );
+    }), ce = () => {
+      $.value || y("clicked");
+    }, G = () => {
+      $.value || (E.value = !E.value, y("clicked"));
+    }, se = () => {
+      const l = Q.value;
+      E.value = l, y("current-value", l);
+    };
+    return pe(E, (l) => {
+      y("current-value", l);
+    }), pe(Q, () => {
+      se();
+    }), (l, p) => t(V) ? (T(), _("div", Qe({
+      key: 0,
+      class: ["nb-wrapper", Be.value],
+      style: [Te.value],
+      tabIndex: t($) ? -1 : e.tabIndex,
+      role: "button"
+    }, Se.value, {
+      onClick: p[1] || (p[1] = (...f) => l.interacted && l.interacted(...f)),
+      onKeydown: [
+        p[2] || (p[2] = D(m((f) => !t($) && e.hasTabIndexEnter && G(), ["prevent"]), ["enter"])),
+        p[3] || (p[3] = D(m((f) => !t($) && e.hasTabIndexSpace && G(), ["prevent"]), ["space"]))
+      ]
+    }), [
+      I("div", {
+        id: t(V),
+        class: R(["nb-reset", "component", we.value]),
+        style: Re([_e.value])
+      }, [
+        lt(I("input", {
+          id: `${t(V)}-input`,
+          "onUpdate:modelValue": p[0] || (p[0] = (f) => E.value = f),
+          type: "checkbox",
+          disabled: t($),
+          class: R(["component__input", "component__input--flip"]),
+          onChange: ce
+        }, null, 40, il), [
+          [at, E.value]
+        ]),
+        I("label", {
+          for: `${t(V)}-input`,
+          class: "component__button",
+          "data-tg-off": t(ie),
+          "data-tg-on": t(ge)
+        }, le(E.value ? t(ge) : t(ie)), 9, fl)
+      ], 14, sl)
+    ], 16, dl)) : ke("", !0);
+  }
+}), cl = /* @__PURE__ */ Ze(vl, [["__scopeId", "data-v-9684280d"]]);
+const pl = ["tabIndex"], gl = ["id"], bl = ["id", "disabled"], yl = ["for", "data-tg-off", "data-tg-on"], hl = /* @__PURE__ */ Object.assign({
+  name: "NbToggleSkewed",
+  inheritAttrs: !1
+}, {
+  __name: "NbToggleSkewed",
+  props: {
+    nbId: {
+      type: String,
+      required: !0
+    },
+    value: {
+      type: Boolean,
+      default: !1
+    },
+    tabIndex: {
+      type: Number,
+      default: 0
+    },
+    hasTabIndexEnter: {
+      type: Boolean,
+      default: !0
+    },
+    hasTabIndexSpace: {
+      type: Boolean,
+      default: !0
+    },
+    ariaLabel: {
+      type: String,
+      default: "Alternate Text Button"
+    },
+    ariaAttrs: {
+      type: Object,
+      default: () => ({})
+    },
+    theme: {
+      type: String,
+      default: "light",
+      validator: (e) => {
+        const S = e ? e.toLowerCase() : "";
+        return ["light", "dark"].includes(S);
+      }
+    },
+    // Cores do tema light
+    lightTextColorOn: {
+      type: String,
+      default: "#4a4a4a"
+    },
+    lightTextColorOnHover: {
+      type: String,
+      default: "#3a3a3a"
+    },
+    lightTextColorOff: {
+      type: String,
+      default: "#585858"
+    },
+    lightTextColorOffHover: {
+      type: String,
+      default: "#707070"
+    },
+    lightButtonColorOn: {
+      type: String,
+      default: "#f8f8f2"
+    },
+    lightButtonColorOnHover: {
+      type: String,
+      default: "#e8e8e2"
+    },
+    lightButtonColorOff: {
+      type: String,
+      default: "#d5d5d5"
+    },
+    lightButtonColorOffHover: {
+      type: String,
+      default: "#c0c0c0"
+    },
+    // Cores do tema dark
+    darkTextColorOn: {
+      type: String,
+      default: "#f8f8f8"
+    },
+    darkTextColorOnHover: {
+      type: String,
+      default: "#ffffff"
+    },
+    darkTextColorOff: {
+      type: String,
+      default: "#909090"
+    },
+    darkTextColorOffHover: {
+      type: String,
+      default: "#b0b0b0"
+    },
+    darkButtonColorOn: {
+      type: String,
+      default: "#3d3d3d"
+    },
+    darkButtonColorOnHover: {
+      type: String,
+      default: "#4d4d4d"
+    },
+    darkButtonColorOff: {
+      type: String,
+      default: "#2c2c2c"
+    },
+    darkButtonColorOffHover: {
+      type: String,
+      default: "#2d2d2d"
+    },
+    borderRadius: {
+      type: Number,
+      default: 0
+    },
+    width: {
+      type: Number,
+      default: 86,
+      validator: (e) => e || 86
+    },
+    paddingX: {
+      type: Number,
+      default: 1,
+      validator: (e) => e || 1
+    },
+    paddingY: {
+      type: Number,
+      default: 0.2,
+      validator: (e) => e || 0.2
+    },
+    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 || 200
+    },
+    textEnable: {
+      type: String,
+      default: "On"
+    },
+    textDisable: {
+      type: String,
+      default: "Off"
+    }
+  },
+  emits: ["clicked", "current-value"],
+  setup(e, { emit: S }) {
+    Ue((l) => ({
+      v53ee1386: Ve.value,
+      v84fb8de4: Oe.value,
+      v2b1ed5fe: He.value,
+      v2a2dcc4d: z.value,
+      v63bc9622: $e.value,
+      v5aff0f2a: i.value,
+      v1b8bbcc1: U.value,
+      v648d6c7c: h.value,
+      v7febecfb: De.value,
+      e28c4bc0: O.value,
+      v9eac8d9c: me.value
+    }));
+    const y = S;
+    Ge(() => {
+      se();
+    });
+    const ae = e, {
+      nbId: V,
+      value: Q,
+      textEnable: ge,
+      textDisable: ie,
+      ariaLabel: be,
+      ariaAttrs: u,
+      theme: C,
+      lightButtonColorOn: fe,
+      lightButtonColorOff: oe,
+      lightButtonColorOnHover: ne,
+      lightButtonColorOffHover: ve,
+      lightTextColorOn: Z,
+      lightTextColorOff: ye,
+      lightTextColorOnHover: re,
+      lightTextColorOffHover: k,
+      darkButtonColorOn: M,
+      darkButtonColorOff: q,
+      darkButtonColorOnHover: w,
+      darkButtonColorOffHover: c,
+      darkTextColorOn: ee,
+      darkTextColorOff: N,
+      darkTextColorOnHover: B,
+      darkTextColorOffHover: H,
+      borderRadius: x,
+      width: K,
+      paddingX: F,
+      paddingY: ue,
+      disabled: $,
+      fontFamily: he,
+      fontSize: Ce,
+      fontWeight: de
+    } = Je(ae), E = J(!1), v = o(() => {
+      const l = $.value ? "component-disabled" : "", p = "inline-block", f = !x.value || x.value < 0 ? 0 : x.value, A = !K.value || K.value < 86 ? 86 : K.value, Ne = !F.value || F.value < 0 ? 1 : F.value, b = !ue.value || ue.value < 0 ? 0.2 : ue.value, g = he.value ? he.value : "'Lato', sans-serif", Ee = Ce.value ? Ce.value : "1.6em", Ie = !de.value || de.value < 0 ? 200 : de.value, W = fe.value ? fe.value : "#f8f8f2", X = oe.value ? oe.value : "#d5d5d5", L = ne.value ? ne.value : "#e8e8e2", P = ve.value ? ve.value : "#c0c0c0", te = Z.value ? Z.value : "#4a4a4a", xe = ye.value ? ye.value : "#909090", Fe = re.value ? re.value : "#3a3a3a", je = k.value ? k.value : "#707070", Xe = M.value ? M.value : "#3d3d3d", Ye = q.value ? q.value : "#1d1d1d", Me = w.value ? w.value : "#4d4d4d", We = c.value ? c.value : "#2d2d2d", ze = ee.value ? ee.value : "#f8f8f8", qe = N.value ? N.value : "#909090", Pe = B.value ? B.value : "#ffffff", Ae = H.value ? H.value : "#b0b0b0";
+      return {
+        disabled: l,
+        display: p,
+        lightButtonColorOn: W,
+        lightButtonColorOff: X,
+        lightButtonColorOnHover: L,
+        lightButtonColorOffHover: P,
+        lightTextColorOn: te,
+        lightTextColorOff: xe,
+        lightTextColorOnHover: Fe,
+        lightTextColorOffHover: je,
+        darkButtonColorOn: Xe,
+        darkButtonColorOff: Ye,
+        darkButtonColorOnHover: Me,
+        darkButtonColorOffHover: We,
+        darkTextColorOn: ze,
+        darkTextColorOff: qe,
+        darkTextColorOnHover: Pe,
+        darkTextColorOffHover: Ae,
+        borderRadius: f,
+        width: A,
+        paddingX: Ne,
+        paddingY: b,
+        font: g,
+        fontSize: Ee,
+        fontWeight: Ie
+      };
+    }), Be = o(() => v.value.disabled), Te = o(() => ({
+      display: v.value.display
+    })), _e = o(() => {
+      const l = v.value;
+      return {
+        minWidth: "33px",
+        width: l.display === "block" ? "auto" : `${l.width}px`,
+        lineHeight: "1.42857143",
+        fontSize: l.fontSize,
+        fontWeight: l.fontWeight
+      };
+    }), Ve = o(() => v.value.font), we = o(() => C.value === "dark" ? "component__theme--dark" : "component__theme--light"), He = o(() => `${v.value.borderRadius}rem`), Oe = o(() => {
+      const l = v.value;
+      return `${l.paddingY}rem ${l.paddingX}rem`;
+    }), me = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightTextColorOn : l.darkTextColorOn;
+    }), h = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightTextColorOff : l.darkTextColorOff;
+    }), i = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightTextColorOnHover : l.darkTextColorOnHover;
+    }), O = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightTextColorOffHover : l.darkTextColorOffHover;
+    }), z = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightButtonColorOn : l.darkButtonColorOn;
+    }), U = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightButtonColorOff : l.darkButtonColorOff;
+    }), $e = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightButtonColorOnHover : l.darkButtonColorOnHover;
+    }), De = o(() => {
+      const l = v.value;
+      return C.value === "light" ? l.lightButtonColorOffHover : l.darkButtonColorOffHover;
+    }), Se = o(() => {
+      const l = {};
+      u.value && Object.keys(u.value).forEach((A) => l[`aria-${A}`] = u.value[A]);
+      const p = {
+        "aria-label": be.value,
+        "aria-disabled": $.value,
+        ...l
+      };
+      return Object.fromEntries(
+        Object.entries(p).filter(([f, A]) => A != null)
+      );
+    }), ce = () => {
+      $.value || y("clicked");
+    }, G = () => {
+      $.value || (E.value = !E.value, y("clicked"));
+    }, se = () => {
+      const l = Q.value;
+      E.value = l, y("current-value", l);
+    };
+    return pe(E, (l) => {
+      y("current-value", l);
+    }), pe(Q, () => {
+      se();
+    }), (l, p) => t(V) ? (T(), _("div", Qe({
+      key: 0,
+      class: ["nb-wrapper", Be.value],
+      style: [Te.value],
+      tabIndex: t($) ? -1 : e.tabIndex,
+      role: "button"
+    }, Se.value, {
+      onClick: p[1] || (p[1] = (...f) => l.interacted && l.interacted(...f)),
+      onKeydown: [
+        p[2] || (p[2] = D(m((f) => !t($) && e.hasTabIndexEnter && G(), ["prevent"]), ["enter"])),
+        p[3] || (p[3] = D(m((f) => !t($) && e.hasTabIndexSpace && G(), ["prevent"]), ["space"]))
+      ]
+    }), [
+      I("div", {
+        id: t(V),
+        class: R(["nb-reset", "component", we.value]),
+        style: Re([_e.value])
+      }, [
+        lt(I("input", {
+          id: `${t(V)}-input`,
+          "onUpdate:modelValue": p[0] || (p[0] = (f) => E.value = f),
+          type: "checkbox",
+          disabled: t($),
+          class: R(["component__input", "component__input--skewed"]),
+          onChange: ce
+        }, null, 40, bl), [
+          [at, E.value]
+        ]),
+        I("label", {
+          for: `${t(V)}-input`,
+          class: "component__button",
+          "data-tg-off": t(ie),
+          "data-tg-on": t(ge)
+        }, le(E.value ? t(ge) : t(ie)), 9, yl)
+      ], 14, gl)
+    ], 16, pl)) : ke("", !0);
+  }
+}), Cl = /* @__PURE__ */ Ze(hl, [["__scopeId", "data-v-f356669c"]]), rt = { NbSelect: Yt, NbToggleLight: Zt, NbToggleSlim: ul, NbToggleFlip: cl, NbToggleSkewed: Cl }, xl = {
+  install(e) {
+    for (const S in rt)
+      if (Object.prototype.hasOwnProperty.call(rt, S)) {
+        const y = rt[S];
+        e.component(y.name, y);
+      }
+  }
+};
+export {
+  xl as default
+};