beth-clarity 1.2.1 → 1.2.3

package/dist/clarity-design-system.es.js

@@ -1,1829 +1,2406 @@
-import { jsx as a, jsxs as _, Fragment as Ze } from "react/jsx-runtime";
-import B, { useState as x, useRef as P, useEffect as O, forwardRef as Ke, isValidElement as Z, createContext as U, cloneElement as W, useContext as q, useMemo as Y, useCallback as le, useLayoutEffect as et } from "react";
-import tt from "react-dom";
-const xt = ({
-  variant: e = "primary",
-  product: t,
-  tone: s,
-  size: n = "medium",
-  bgColor: l,
-  textColor: i,
-  children: d,
-  className: c = "",
-  rounded: r = !1,
-  outlined: o = !1,
-  ...u
+import { jsx as e, jsxs as w, Fragment as jt } from "react/jsx-runtime";
+import I, { useState as D, useRef as et, useEffect as J, useLayoutEffect as Lt, forwardRef as be, isValidElement as ot, createContext as ct, cloneElement as rt, useContext as dt, useMemo as vt, useCallback as _t, Children as _e } from "react";
+import we, { createPortal as Ne } from "react-dom";
+const Ke = ({
+  variant: t = "primary",
+  size: a = "medium",
+  bgColor: r,
+  textColor: l,
+  children: n,
+  className: o = "",
+  rounded: s = !1,
+  outlined: c = !1,
+  ...d
 }) => {
-  const v = "clarity-badge", m = !!l, f = t && s && !m;
-  let p = "";
-  m ? p = `${v}--custom-bg` : f ? p = `${v}--custom` : p = `${v}--${e}`;
-  const h = [
-    v,
-    p,
-    `${v}--${n}`,
-    r ? `${v}--rounded` : "",
-    o ? `${v}--outlined` : "",
-    c
-  ].filter(Boolean).join(" "), y = {};
-  m && (y.backgroundColor = l, i && (y.color = i));
-  const b = f && t && s ? {
-    "--custom-bg-color": `var(--clarity-${t}-${s})`,
-    "--custom-text-color": s && parseInt(s) >= 500 ? "white" : `var(--clarity-${t}-800)`
-  } : {};
-  return /* @__PURE__ */ a(
+  const i = "clarity-badge", u = !!r;
+  let f = "";
+  u ? f = `${i}--custom-bg` : f = `${i}--${t}`;
+  const p = [
+    i,
+    f,
+    `${i}--${a}`,
+    s ? `${i}--rounded` : "",
+    c ? `${i}--outlined` : "",
+    o
+  ].filter(Boolean).join(" "), h = {};
+  return u && (h.backgroundColor = r, l && (h.color = l)), /* @__PURE__ */ e(
     "span",
     {
-      className: h,
-      style: {
-        ...y,
-        ...b
-      },
-      ...u,
-      children: d
+      className: p,
+      style: h,
+      ...d,
+      children: n
     }
   );
-}, Tt = ({
-  variant: e = "primary",
-  size: t = "medium",
-  disabled: s = !1,
-  loading: n = !1,
-  children: l,
-  onClick: i,
-  type: d = "button",
+}, Bt = {
+  fontFamily: {
+    sans: ["Inter", "system-ui", "sans-serif"],
+    mono: ["Fira Code", "monospace"]
+  },
+  fontSize: {
+    xs: "12px",
+    sm: "14px",
+    base: "16px",
+    lg: "18px",
+    xl: "20px",
+    "2xl": "24px",
+    "3xl": "30px"
+  },
+  fontWeight: {
+    normal: 400,
+    medium: 500,
+    semibold: 600,
+    bold: 700
+  },
+  letterSpacing: {
+    tighter: "-0.05em",
+    tight: "-0.025em",
+    normal: "0em",
+    wide: "0.025em",
+    wider: "0.05em"
+  }
+}, Ct = (t) => {
+  if (t) {
+    if (t.startsWith("#") || t.startsWith("rgb") || t.startsWith("hsl") || t === "transparent")
+      return t;
+    if (t.includes(".")) {
+      const [a, r] = t.split(".");
+      return `var(--clarity-${a}-${r})`;
+    }
+    return `var(--clarity-${t})`;
+  }
+}, nt = (t) => t !== void 0 ? `var(--clarity-spacing-${t})` : void 0, Ce = I.forwardRef(
+  (t, a) => {
+    const {
+      children: r,
+      className: l,
+      display: n,
+      position: o,
+      flexDirection: s,
+      alignItems: c,
+      justifyContent: d,
+      gap: i,
+      m: u,
+      mt: f,
+      mr: p,
+      mb: h,
+      ml: g,
+      mx: b,
+      my: N,
+      p: m,
+      pt: y,
+      pr: _,
+      pb: x,
+      pl: E,
+      px: C,
+      py: B,
+      bg: R,
+      color: $,
+      fontSize: k,
+      fontWeight: A,
+      textAlign: H,
+      lineHeight: S,
+      letterSpacing: z,
+      borderRadius: M,
+      borderTopLeftRadius: F,
+      borderTopRightRadius: j,
+      borderBottomLeftRadius: U,
+      borderBottomRightRadius: L,
+      boxShadow: K,
+      borderWidth: P,
+      borderTopWidth: Z,
+      borderRightWidth: q,
+      borderBottomWidth: tt,
+      borderLeftWidth: O,
+      borderXWidth: X,
+      borderYWidth: V,
+      borderColor: Y,
+      overflow: lt,
+      ...v
+    } = t, W = (G, Q) => {
+      if (G === void 0 || G === 0) return;
+      const at = `var(--clarity-border-width-${G})`, it = Q ? Ct(Q) : "currentColor";
+      return `${at} solid ${it}`;
+    }, T = I.useMemo(() => ({
+      display: n,
+      position: o,
+      flexDirection: s,
+      alignItems: c,
+      justifyContent: d,
+      gap: nt(i),
+      marginTop: nt(f ?? N ?? u),
+      marginRight: nt(p ?? b ?? u),
+      marginBottom: nt(h ?? N ?? u),
+      marginLeft: nt(g ?? b ?? u),
+      paddingTop: nt(y ?? B ?? m),
+      paddingRight: nt(_ ?? C ?? m),
+      paddingBottom: nt(x ?? B ?? m),
+      paddingLeft: nt(E ?? C ?? m),
+      backgroundColor: R ? Ct(R) : void 0,
+      color: $ ? Ct($) : void 0,
+      fontSize: k ? `var(--clarity-font-size-${k})` : void 0,
+      fontWeight: A ? Bt.fontWeight[A] : void 0,
+      textAlign: H,
+      lineHeight: S,
+      letterSpacing: z ? Bt.letterSpacing[z] : void 0,
+      borderRadius: M ? `var(--clarity-radius-${M})` : void 0,
+      borderTopLeftRadius: F ? `var(--clarity-radius-${F})` : void 0,
+      borderTopRightRadius: j ? `var(--clarity-radius-${j})` : void 0,
+      borderBottomLeftRadius: U ? `var(--clarity-radius-${U})` : void 0,
+      borderBottomRightRadius: L ? `var(--clarity-radius-${L})` : void 0,
+      boxShadow: K ? `var(--clarity-shadow-${K})` : void 0,
+      border: W(P, Y),
+      borderTop: W(Z ?? V),
+      borderRight: W(q ?? X),
+      borderBottom: W(tt ?? V),
+      borderLeft: W(O ?? X),
+      overflow: lt
+    }), [
+      n,
+      o,
+      s,
+      c,
+      d,
+      i,
+      u,
+      f,
+      p,
+      h,
+      g,
+      b,
+      N,
+      m,
+      y,
+      _,
+      x,
+      E,
+      C,
+      B,
+      R,
+      $,
+      k,
+      A,
+      H,
+      S,
+      z,
+      M,
+      F,
+      j,
+      U,
+      L,
+      K,
+      P,
+      Z,
+      q,
+      tt,
+      O,
+      X,
+      V,
+      Y,
+      lt
+    ]);
+    return /* @__PURE__ */ e("div", { ref: a, className: `clarity-box ${l || ""}`.trim(), style: T, ...v, children: r });
+  }
+);
+Ce.displayName = "Box";
+const Pe = ({
+  variant: t = "primary",
+  size: a = "medium",
+  disabled: r = !1,
+  loading: l = !1,
+  children: n,
+  onClick: o,
+  type: s = "button",
   className: c = "",
-  title: r,
-  customColor: o,
+  title: d,
+  customColor: i,
   customColorHover: u,
-  ...v
+  ...f
 }) => {
-  const m = "clarity-button", f = [
-    m,
-    !o && `${m}--${e}`,
-    `${m}--${t}`,
-    n && `${m}--loading`,
-    s && `${m}--disabled`,
+  const p = "clarity-button", h = [
+    p,
+    !i && `${p}--${t}`,
+    `${p}--${a}`,
+    l && `${p}--loading`,
+    r && `${p}--disabled`,
     c
-  ].filter(Boolean).join(" "), p = {};
-  return o && (p["--button-bg"] = o, p["--button-hover-bg"] = u || `${o}E6`, p["--button-border"] = o, p["--button-hover-border"] = u || `${o}E6`, p["--button-fg"] = "#fff"), /* @__PURE__ */ _(
+  ].filter(Boolean).join(" "), g = {};
+  return i && (g["--button-bg"] = i, g["--button-hover-bg"] = u || `${i}E6`, g["--button-border"] = i, g["--button-hover-border"] = u || `${i}E6`, g["--button-fg"] = "#fff"), /* @__PURE__ */ w(
     "button",
     {
-      className: f,
-      style: p,
-      disabled: s || n,
-      onClick: i,
-      type: d,
-      title: r,
-      ...v,
+      className: h,
+      style: g,
+      disabled: r || l,
+      onClick: o,
+      type: s,
+      title: d,
+      ...f,
       children: [
-        n && /* @__PURE__ */ a("div", { className: `${m}__spinner` }),
-        l
+        l && /* @__PURE__ */ e("div", { className: `${p}__spinner` }),
+        n
       ]
     }
   );
-}, Bt = ({
-  variant: e = "primary",
-  size: t = "medium",
-  filled: s = !0,
-  items: n,
-  value: l,
-  multiple: i = !1,
-  disabled: d = !1,
+}, ta = ({
+  variant: t = "primary",
+  size: a = "medium",
+  filled: r = !0,
+  items: l,
+  value: n,
+  multiple: o = !1,
+  disabled: s = !1,
   onChange: c,
-  className: r = "",
-  ...o
+  className: d = "",
+  ...i
 }) => {
-  const u = "clarity-button-group", v = `${u}--${e}`, m = [
+  const u = "clarity-button-group", f = `${u}--${t}`, p = [
     u,
-    v,
-    `${u}--${t}`,
-    !s && `${u}--outline`,
-    d && `${u}--disabled`,
-    r
-  ].filter(Boolean).join(" "), f = (h) => {
-    if (d || !c) return;
-    const y = n.find((b) => b.id === h);
-    if (!(y != null && y.disabled))
-      if (i) {
-        const b = Array.isArray(l) ? l : [], C = b.includes(h) ? b.filter((j) => j !== h) : [...b, h];
-        c(C);
+    f,
+    `${u}--${a}`,
+    !r && `${u}--outline`,
+    s && `${u}--disabled`,
+    d
+  ].filter(Boolean).join(" "), h = (b) => {
+    if (s || !c) return;
+    const N = l.find((m) => m.id === b);
+    if (!(N != null && N.disabled))
+      if (o) {
+        const m = Array.isArray(n) ? n : [], y = m.includes(b) ? m.filter((_) => _ !== b) : [...m, b];
+        c(y);
       } else
-        c(h);
-  }, p = (h) => i ? Array.isArray(l) && l.includes(h) : l === h;
-  return /* @__PURE__ */ a(
+        c(b);
+  }, g = (b) => o ? Array.isArray(n) && n.includes(b) : n === b;
+  return /* @__PURE__ */ e(
     "div",
     {
-      className: m,
+      className: p,
       role: "group",
-      ...o,
-      children: n.map((h, y) => {
-        const b = p(h.id), C = [
+      ...i,
+      children: l.map((b, N) => {
+        const m = g(b.id), y = [
           `${u}__item`,
-          b && `${u}__item--selected`,
-          h.disabled && `${u}__item--disabled`,
-          y === 0 && `${u}__item--first`,
-          y === n.length - 1 && `${u}__item--last`
+          m && `${u}__item--selected`,
+          b.disabled && `${u}__item--disabled`,
+          N === 0 && `${u}__item--first`,
+          N === l.length - 1 && `${u}__item--last`
         ].filter(Boolean).join(" ");
-        return /* @__PURE__ */ _(
+        return /* @__PURE__ */ w(
           "button",
           {
-            className: C,
-            onClick: () => f(h.id),
-            disabled: d || h.disabled,
+            className: y,
+            onClick: () => h(b.id),
+            disabled: s || b.disabled,
             type: "button",
-            "aria-pressed": b,
+            "aria-pressed": m,
             children: [
-              h.icon && /* @__PURE__ */ a("span", { className: `${u}__item-icon`, children: h.icon }),
-              /* @__PURE__ */ a("span", { className: `${u}__item-label`, children: h.label })
+              b.icon && /* @__PURE__ */ e("span", { className: `${u}__item-icon`, children: b.icon }),
+              /* @__PURE__ */ e("span", { className: `${u}__item-label`, children: b.label })
             ]
           },
-          h.id
+          b.id
         );
       })
     }
   );
-}, st = B.forwardRef(({
-  variant: e,
-  size: t = "medium",
-  label: s,
-  helperText: n,
-  error: l = !1,
-  errorMessage: i,
-  startIcon: d,
+};
+var Et = {
+  color: void 0,
+  size: void 0,
+  className: void 0,
+  style: void 0,
+  attr: void 0
+}, Tt = I.createContext && I.createContext(Et), st = function() {
+  return st = Object.assign || function(t) {
+    for (var a, r = 1, l = arguments.length; r < l; r++) {
+      a = arguments[r];
+      for (var n in a) Object.prototype.hasOwnProperty.call(a, n) && (t[n] = a[n]);
+    }
+    return t;
+  }, st.apply(this, arguments);
+}, $e = function(t, a) {
+  var r = {};
+  for (var l in t) Object.prototype.hasOwnProperty.call(t, l) && a.indexOf(l) < 0 && (r[l] = t[l]);
+  if (t != null && typeof Object.getOwnPropertySymbols == "function") for (var n = 0, l = Object.getOwnPropertySymbols(t); n < l.length; n++)
+    a.indexOf(l[n]) < 0 && Object.prototype.propertyIsEnumerable.call(t, l[n]) && (r[l[n]] = t[l[n]]);
+  return r;
+};
+function St(t) {
+  return t && t.map(function(a, r) {
+    return I.createElement(a.tag, st({
+      key: r
+    }, a.attr), St(a.child));
+  });
+}
+function xe(t) {
+  return function(a) {
+    return I.createElement(ke, st({
+      attr: st({}, t.attr)
+    }, a), St(t.child));
+  };
+}
+function ke(t) {
+  var a = function(r) {
+    var l = t.attr, n = t.size, o = t.title, s = $e(t, ["attr", "size", "title"]), c = n || r.size || "1em", d;
+    return r.className && (d = r.className), t.className && (d = (d ? d + " " : "") + t.className), I.createElement("svg", st({
+      stroke: "currentColor",
+      fill: "currentColor",
+      strokeWidth: "0"
+    }, r.attr, l, s, {
+      className: d,
+      style: st(st({
+        color: t.color || r.color
+      }, r.style), t.style),
+      height: c,
+      width: c,
+      xmlns: "http://www.w3.org/2000/svg"
+    }), o && I.createElement("title", null, o), t.children);
+  };
+  return Tt !== void 0 ? I.createElement(Tt.Consumer, null, function(r) {
+    return a(r);
+  }) : a(Et);
+}
+function Be(t) {
+  return xe({ attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { d: "M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM11 15V17H13V15H11ZM11 7V13H13V7H11Z" } }] })(t);
+}
+const pt = ({
+  content: t,
+  position: a = "top",
+  variant: r = "primary",
+  bgColor: l,
+  textColor: n,
+  plain: o = !1,
+  children: s,
+  className: c = "",
+  disabled: d = !1,
+  delay: i = 200,
+  hideDelay: u = 100,
+  trigger: f = "hover",
+  arrow: p = !0,
+  ...h
+}) => {
+  const [g, b] = D(!1), [N, m] = D(a), [y, _] = D({ top: 0, left: 0 }), [x, E] = D(null), C = et(null), B = et(null), R = "clarity-tooltip", $ = 8, k = !!l || o;
+  let A = "";
+  k ? A = `${R}__content--custom-bg` : A = `${R}__content--${r}`;
+  const H = [
+    R,
+    `${R}--${N}`,
+    c
+  ].filter(Boolean).join(" "), S = [
+    `${R}__content`,
+    A,
+    p && `${R}__content--arrow`
+  ].filter(Boolean).join(" "), z = {}, M = {};
+  k && (M["--tooltip-bg-color"] = l || "#FFFFFF"), (n || o) && (M["--tooltip-text-color"] = n || "var(--clarity-gray-900)");
+  const F = {
+    ...z,
+    ...Object.keys(M).length > 0 ? M : {},
+    top: y.top,
+    left: y.left,
+    // Resetar estilos que vêm do CSS para posicionamento relativo
+    position: "absolute",
+    bottom: "auto",
+    right: "auto",
+    margin: 0,
+    transform: "none",
+    zIndex: 99999
+    // Garantir que fique acima de modais (geralmente 1000-2000)
+  }, j = () => {
+    if (d) return;
+    x && clearTimeout(x);
+    const O = setTimeout(() => {
+      b(!0);
+    }, i);
+    E(O);
+  }, U = () => {
+    x && clearTimeout(x);
+    const O = setTimeout(() => {
+      b(!1);
+    }, u);
+    E(O);
+  }, L = () => {
+    d || (g ? U() : j());
+  }, K = () => {
+    d || j();
+  }, P = () => {
+    U();
+  };
+  J(() => () => {
+    x && clearTimeout(x);
+  }, [x]);
+  const Z = () => {
+    if (!g || !B.current || !C.current) return;
+    const O = B.current.getBoundingClientRect(), X = C.current.getBoundingClientRect(), V = window.scrollX, Y = window.scrollY, lt = window.innerWidth, v = window.innerHeight, W = {
+      top: {
+        top: O.top + Y - X.height - $,
+        left: O.left + V + (O.width - X.width) / 2
+      },
+      bottom: {
+        top: O.bottom + Y + $,
+        left: O.left + V + (O.width - X.width) / 2
+      },
+      left: {
+        top: O.top + Y + (O.height - X.height) / 2,
+        left: O.left + V - X.width - $
+      },
+      right: {
+        top: O.top + Y + (O.height - X.height) / 2,
+        left: O.right + V + $
+      },
+      "top-left": {
+        top: O.top + Y - X.height - $,
+        left: O.left + V
+      },
+      "top-right": {
+        top: O.top + Y - X.height - $,
+        left: O.right + V - X.width
+      },
+      "bottom-left": {
+        top: O.bottom + Y + $,
+        left: O.left + V
+      },
+      "bottom-right": {
+        top: O.bottom + Y + $,
+        left: O.right + V - X.width
+      }
+    };
+    let T = a;
+    const G = (Q) => {
+      const at = W[Q], it = at.top - Y, ft = at.left - V;
+      return it >= 0 && it + X.height <= v && ft >= 0 && ft + X.width <= lt;
+    };
+    if (!G(T)) {
+      const at = {
+        top: "bottom",
+        bottom: "top",
+        left: "right",
+        right: "left",
+        "top-left": "bottom-left",
+        "top-right": "bottom-right",
+        "bottom-left": "top-left",
+        "bottom-right": "top-right"
+      }[T];
+      at && G(at) && (T = at);
+    }
+    if (m(T), _(W[T]), C.current) {
+      const Q = Math.round(O.width / 2);
+      C.current.style.setProperty("--tooltip-arrow-offset", `${Q}px`);
+    }
+  };
+  Lt(() => {
+    if (g)
+      return Z(), window.addEventListener("scroll", Z, !0), window.addEventListener("resize", Z), () => {
+        window.removeEventListener("scroll", Z, !0), window.removeEventListener("resize", Z);
+      };
+  }, [g, a, t]);
+  const q = {};
+  let tt = f;
+  if (typeof window < "u") {
+    const O = "ontouchstart" in window || navigator.maxTouchPoints > 0 || window.matchMedia && window.matchMedia("(pointer: coarse)").matches;
+    f === "hover" && O && (tt = "focus");
+  }
+  return tt === "hover" ? (q.onMouseEnter = j, q.onMouseLeave = U) : tt === "click" ? q.onClick = L : tt === "focus" && (q.onFocus = K, q.onBlur = P), /* @__PURE__ */ w(jt, { children: [
+    /* @__PURE__ */ e(
+      "div",
+      {
+        ref: B,
+        className: `${R}__trigger`,
+        ...q,
+        ...h,
+        children: s
+      }
+    ),
+    g && Ne(
+      /* @__PURE__ */ e(
+        "div",
+        {
+          ref: C,
+          className: H,
+          style: F,
+          role: "tooltip",
+          "aria-hidden": !g,
+          children: /* @__PURE__ */ e("div", { className: S, children: t })
+        }
+      ),
+      document.body
+    )
+  ] });
+}, Te = I.forwardRef(({
+  variant: t = "primary",
+  size: a = "medium",
+  label: r,
+  ariaLabel: l,
+  error: n = !1,
+  errorMessage: o,
+  startIcon: s,
   endIcon: c,
-  className: r = "",
-  disabled: o = !1,
-  value: u,
-  defaultValue: v,
-  onFocus: m,
-  onBlur: f,
-  ...p
-}, h) => {
-  const [y, b] = x(!1), [C, j] = x(!1), T = P(null);
-  B.useImperativeHandle(h, () => T.current), O(() => {
-    const k = T.current;
-    k && j(k.value.length > 0);
-  }, [u, v]);
-  const w = (k) => {
-    b(!0), m == null || m(k);
-  }, $ = (k) => {
-    b(!1), j(k.target.value.length > 0), f == null || f(k);
+  helper: d = !1,
+  helperPosition: i = "top-right",
+  className: u = "",
+  disabled: f = !1,
+  value: p,
+  defaultValue: h,
+  onFocus: g,
+  onBlur: b,
+  ...N
+}, m) => {
+  const [y, _] = D(!1), [x, E] = D(!1), C = et(null), B = N.id || `input-${Math.random().toString(36).substr(2, 9)}`, R = et(null), [$, k] = D(!1);
+  I.useImperativeHandle(m, () => C.current), J(() => {
+    const j = C.current;
+    j && E(j.value.length > 0);
+  }, [p, h]), J(() => {
+    const j = R.current;
+    if (!j) return;
+    const U = () => {
+      const K = j.scrollWidth > j.clientWidth;
+      k((P) => P !== K ? K : P);
+    };
+    U();
+    const L = new ResizeObserver(() => U());
+    return L.observe(j), () => L.disconnect();
+  }, [r, y, x, a, s, c]);
+  const A = (j) => {
+    _(!0), g == null || g(j);
+  }, H = (j) => {
+    _(!1), E(j.target.value.length > 0), b == null || b(j);
   }, S = [
     "clarity-input",
     "clarity-input--outlined",
-    `clarity-input--${t}`,
-    e && `clarity-input--${e}`,
-    l && "clarity-input--error",
-    o && "clarity-input--disabled",
+    `clarity-input--${a}`,
+    t && `clarity-input--${t}`,
+    n && "clarity-input--error",
+    f && "clarity-input--disabled",
     y && "clarity-input--focused",
-    C && "clarity-input--has-value",
-    d && "clarity-input--with-start-icon",
+    x && "clarity-input--has-value",
+    s && "clarity-input--with-start-icon",
     c && "clarity-input--with-end-icon",
-    r
-  ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _("div", { className: "clarity-input-wrapper", children: [
-    /* @__PURE__ */ _("div", { className: S, children: [
-      d && /* @__PURE__ */ a("div", { className: "clarity-input__start-icon", children: d }),
-      /* @__PURE__ */ _("div", { className: "clarity-input__field", children: [
-        /* @__PURE__ */ a(
+    u
+  ].filter(Boolean).join(" "), z = [
+    "clarity-input__label",
+    $ && "clarity-input__label--truncate"
+  ].filter(Boolean).join(" "), M = i != null && i.endsWith("left") ? "left" : "right", F = (j, U) => {
+    if (!d) return null;
+    const L = typeof d == "object" ? d : void 0, K = (L == null ? void 0 : L.content) ?? "Ajuda", P = (L == null ? void 0 : L.plain) === !0, Z = L == null ? void 0 : L.variant, q = L == null ? void 0 : L.bgColor, tt = L == null ? void 0 : L.textColor;
+    return /* @__PURE__ */ e(
+      pt,
+      {
+        content: K,
+        position: j === "middle" ? U === "left" ? "left" : "right" : j === "top" ? U === "left" ? "top-left" : "top-right" : U === "left" ? "bottom-left" : "bottom-right",
+        trigger: "hover",
+        variant: Z || t,
+        plain: P,
+        bgColor: q,
+        textColor: tt,
+        children: /* @__PURE__ */ e("button", { type: "button", className: "clarity-input__helper-icon", "aria-label": "Helper", children: /* @__PURE__ */ e(Be, { size: j === "middle" ? 20 : 16 }) })
+      }
+    );
+  };
+  return /* @__PURE__ */ w("div", { className: "clarity-input-wrapper", children: [
+    d && (i == null ? void 0 : i.startsWith("top")) && /* @__PURE__ */ e("div", { className: `clarity-input__helper-row clarity-input__helper-row--top clarity-input__helper-row--${M}`, children: F("top", M) }),
+    d && (i != null && i.startsWith("middle")) ? /* @__PURE__ */ w("div", { className: `clarity-input__middle-row clarity-input__middle-row--${M}`, children: [
+      M === "left" && F("middle", M),
+      /* @__PURE__ */ w("div", { className: S, children: [
+        s && /* @__PURE__ */ e("div", { className: "clarity-input__start-icon", children: s }),
+        /* @__PURE__ */ w("div", { className: "clarity-input__field", children: [
+          /* @__PURE__ */ e(
+            "input",
+            {
+              ref: C,
+              id: B,
+              className: "clarity-input__element",
+              disabled: f,
+              value: p,
+              defaultValue: h,
+              onFocus: A,
+              onBlur: H,
+              "aria-label": l,
+              ...N
+            }
+          ),
+          r && /* @__PURE__ */ e("label", { ref: R, className: z, htmlFor: B, children: r })
+        ] }),
+        c && /* @__PURE__ */ e("div", { className: "clarity-input__end-icon", children: c })
+      ] }),
+      M === "right" && F("middle", M)
+    ] }) : /* @__PURE__ */ w("div", { className: S, children: [
+      s && /* @__PURE__ */ e("div", { className: "clarity-input__start-icon", children: s }),
+      /* @__PURE__ */ w("div", { className: "clarity-input__field", children: [
+        /* @__PURE__ */ e(
           "input",
           {
-            ref: T,
+            ref: C,
+            id: B,
             className: "clarity-input__element",
-            disabled: o,
-            value: u,
-            defaultValue: v,
-            onFocus: w,
-            onBlur: $,
-            ...p
+            disabled: f,
+            value: p,
+            defaultValue: h,
+            onFocus: A,
+            onBlur: H,
+            "aria-label": l,
+            ...N
           }
         ),
-        s && /* @__PURE__ */ a("label", { className: "clarity-input__label", children: s })
+        r && /* @__PURE__ */ e("label", { ref: R, className: z, htmlFor: B, children: r })
       ] }),
-      c && /* @__PURE__ */ a("div", { className: "clarity-input__end-icon", children: c })
+      c && /* @__PURE__ */ e("div", { className: "clarity-input__end-icon", children: c })
     ] }),
-    (n || l && i) && /* @__PURE__ */ a("div", { className: "clarity-input__helper-text", children: l && i ? i : n })
+    d && (i == null ? void 0 : i.startsWith("bottom")) && /* @__PURE__ */ e("div", { className: `clarity-input__helper-row clarity-input__helper-row--bottom clarity-input__helper-row--${M}`, children: F("bottom", M) }),
+    n && o && /* @__PURE__ */ e("div", { className: "clarity-input__helper-text", children: o })
   ] });
 });
-st.displayName = "Input";
-const at = B.forwardRef(({
-  variant: e,
-  size: t = "medium",
-  label: s,
-  helperText: n,
-  error: l = !1,
-  errorMessage: i,
-  startIcon: d,
-  endIcon: c,
-  className: r = "",
-  disabled: o = !1,
-  value: u,
-  defaultValue: v,
-  onFocus: m,
-  onBlur: f,
-  rows: p = 3,
-  minHeight: h,
-  maxHeight: y,
-  resizable: b = !0,
-  ...C
-}, j) => {
-  const [T, w] = x(!1), [$, S] = x(!1), k = P(null);
-  B.useImperativeHandle(j, () => k.current), O(() => {
-    const g = k.current;
-    g && S(g.value.length > 0);
-  }, [u, v]);
-  const E = (g) => {
-    w(!0), m == null || m(g);
-  }, R = (g) => {
-    w(!1), S(g.target.value.length > 0), f == null || f(g);
-  }, A = [
+Te.displayName = "Input";
+const je = I.forwardRef(({
+  variant: t = "primary",
+  size: a = "medium",
+  label: r,
+  helper: l = !1,
+  helperPosition: n = "middle-right",
+  error: o = !1,
+  errorMessage: s,
+  startIcon: c,
+  endIcon: d,
+  className: i = "",
+  disabled: u = !1,
+  value: f,
+  defaultValue: p,
+  onFocus: h,
+  onBlur: g,
+  rows: b = 3,
+  minHeight: N,
+  maxHeight: m,
+  resizable: y = !0,
+  ..._
+}, x) => {
+  const [E, C] = D(!1), [B, R] = D(!1), $ = et(null);
+  I.useImperativeHandle(x, () => $.current), J(() => {
+    const j = $.current;
+    j && R(j.value.length > 0);
+  }, [f, p]);
+  const k = (j) => {
+    C(!0), h == null || h(j);
+  }, A = (j) => {
+    C(!1), R(j.target.value.length > 0), g == null || g(j);
+  }, H = [
     "clarity-textarea",
     "clarity-textarea--outlined",
-    `clarity-textarea--${t}`,
-    e && `clarity-textarea--${e}`,
-    l && "clarity-textarea--error",
-    o && "clarity-textarea--disabled",
-    T && "clarity-textarea--focused",
-    $ && "clarity-textarea--has-value",
-    d && "clarity-textarea--with-start-icon",
-    c && "clarity-textarea--with-end-icon",
-    r
-  ].filter(Boolean).join(" "), I = {
-    resize: b ? "vertical" : "none",
-    minHeight: h ? `${h}px` : void 0,
-    maxHeight: y ? `${y}px` : void 0
-  };
-  return /* @__PURE__ */ _("div", { className: "clarity-textarea-wrapper", children: [
-    /* @__PURE__ */ _("div", { className: A, children: [
-      d && /* @__PURE__ */ a("div", { className: "clarity-textarea__start-icon", children: d }),
-      /* @__PURE__ */ _("div", { className: "clarity-textarea__field", children: [
-        /* @__PURE__ */ a(
+    `clarity-textarea--${a}`,
+    t && `clarity-textarea--${t}`,
+    o && "clarity-textarea--error",
+    u && "clarity-textarea--disabled",
+    E && "clarity-textarea--focused",
+    B && "clarity-textarea--has-value",
+    c && "clarity-textarea--with-start-icon",
+    d && "clarity-textarea--with-end-icon",
+    i
+  ].filter(Boolean).join(" "), S = {
+    resize: y ? "vertical" : "none",
+    minHeight: N ? `${N}px` : void 0,
+    maxHeight: m ? `${m}px` : void 0
+  }, z = n != null && n.endsWith("left") ? "left" : "right", M = (j, U) => {
+    if (!l) return null;
+    const L = typeof l == "object" ? l : void 0, K = (L == null ? void 0 : L.content) ?? "Ajuda", P = (L == null ? void 0 : L.plain) === !0, Z = L == null ? void 0 : L.variant, q = L == null ? void 0 : L.bgColor, tt = L == null ? void 0 : L.textColor, O = j === "middle" ? 20 : 16;
+    return /* @__PURE__ */ e(
+      pt,
+      {
+        content: K,
+        position: j === "middle" ? U === "left" ? "left" : "right" : j === "top" ? U === "left" ? "top-left" : "top-right" : U === "left" ? "bottom-left" : "bottom-right",
+        trigger: "hover",
+        variant: Z || t,
+        plain: P,
+        bgColor: q,
+        textColor: tt,
+        children: /* @__PURE__ */ e("button", { type: "button", className: "clarity-textarea__helper-icon", "aria-label": "Helper", children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: O, height: O, fill: "currentColor", children: /* @__PURE__ */ e("path", { d: "M12.866 3l9.526 16.5a1 1 0 0 1-.866 1.5H2.474a1 1 0 0 1-.866-1.5L11.134 3a1 1 0 0 1 1.732 0zM11 16v2h2v-2h-2zm0-7v5h2V9h-2z" }) }) })
+      }
+    );
+  }, F = /* @__PURE__ */ w("div", { className: "clarity-textarea-wrapper", children: [
+    /* @__PURE__ */ w("div", { className: H, children: [
+      c && /* @__PURE__ */ e("div", { className: "clarity-textarea__start-icon", children: c }),
+      /* @__PURE__ */ w("div", { className: "clarity-textarea__field", children: [
+        /* @__PURE__ */ e(
           "textarea",
           {
-            ref: k,
+            ref: $,
             className: "clarity-textarea__element",
-            disabled: o,
-            value: u,
-            defaultValue: v,
-            onFocus: E,
-            onBlur: R,
-            rows: p,
-            style: I,
-            ...C
+            disabled: u,
+            value: f,
+            defaultValue: p,
+            onFocus: k,
+            onBlur: A,
+            rows: b,
+            style: S,
+            ..._
           }
         ),
-        s && /* @__PURE__ */ a("label", { className: "clarity-textarea__label", children: s })
+        r && /* @__PURE__ */ e("label", { className: "clarity-textarea__label", children: r })
       ] }),
-      c && /* @__PURE__ */ a("div", { className: "clarity-textarea__end-icon", children: c })
+      d && /* @__PURE__ */ e("div", { className: "clarity-textarea__end-icon", children: d })
     ] }),
-    (n || l && i) && /* @__PURE__ */ a("div", { className: "clarity-textarea__helper-text", children: l && i ? i : n })
+    o && s && /* @__PURE__ */ e("div", { className: "clarity-textarea__helper-text", children: s })
+  ] });
+  return /* @__PURE__ */ w("div", { className: "clarity-textarea-container", children: [
+    l && (n == null ? void 0 : n.startsWith("top")) && /* @__PURE__ */ e("div", { className: `clarity-textarea__helper-row clarity-textarea__helper-row--top clarity-textarea__helper-row--${z}`, children: M("top", z) }),
+    l && (n != null && n.startsWith("middle")) ? /* @__PURE__ */ w("div", { className: `clarity-textarea__middle-row clarity-textarea__middle-row--${z}`, children: [
+      z === "left" && M("middle", z),
+      F,
+      z === "right" && M("middle", z)
+    ] }) : F,
+    l && (n == null ? void 0 : n.startsWith("bottom")) && /* @__PURE__ */ e("div", { className: `clarity-textarea__helper-row clarity-textarea__helper-row--bottom clarity-textarea__helper-row--${z}`, children: M("bottom", z) })
   ] });
 });
-at.displayName = "Textarea";
-const nt = B.forwardRef(({
-  variant: e,
-  size: t = "medium",
-  label: s,
-  helperText: n,
-  error: l = !1,
-  errorMessage: i,
-  startIcon: d,
-  endIcon: c,
-  className: r = "",
-  disabled: o = !1,
-  value: u,
-  defaultValue: v,
-  onFocus: m,
-  onBlur: f,
-  onChange: p,
-  options: h,
-  placeholder: y = "Selecione uma opção",
-  isClearable: b = !1,
-  isSearchable: C = !1,
-  ...j
-}, T) => {
-  const [w, $] = x(!1), [S, k] = x(!1), [E, R] = x(u || v || ""), [A, I] = x(""), g = P(null), H = P(null);
-  B.useImperativeHandle(T, () => g.current), O(() => {
-    u !== void 0 && R(u);
-  }, [u]), O(() => {
-    const N = (L) => {
-      g.current && !g.current.contains(L.target) && ($(!1), k(!1), f == null || f());
+je.displayName = "Textarea";
+const Le = I.forwardRef(({
+  variant: t = "primary",
+  size: a = "medium",
+  label: r,
+  helper: l = !1,
+  helperPosition: n = "top-right",
+  error: o = !1,
+  errorMessage: s,
+  startIcon: c,
+  endIcon: d,
+  className: i = "",
+  disabled: u = !1,
+  value: f,
+  defaultValue: p,
+  onFocus: h,
+  onBlur: g,
+  onChange: b,
+  options: N = [],
+  placeholder: m = "Selecione uma opção",
+  isClearable: y = !1,
+  isSearchable: _ = !1,
+  ...x
+}, E) => {
+  const [C, B] = D(!1), [R, $] = D(!1), [k, A] = D(f || p || ""), [H, S] = D(""), z = et(null), M = et(null), F = Array.isArray(N) ? N : [];
+  I.useImperativeHandle(E, () => z.current), J(() => {
+    f !== void 0 && A(f);
+  }, [f]), J(() => {
+    const v = (W) => {
+      z.current && !z.current.contains(W.target) && (B(!1), $(!1), g == null || g());
     };
-    return document.addEventListener("mousedown", N), () => document.removeEventListener("mousedown", N);
-  }, [f]);
-  const V = C && A ? h.filter(
-    (N) => N.label.toLowerCase().includes(A.toLowerCase())
-  ) : h, F = () => {
-    o || ($(!w), k(!w), w ? (f == null || f(), C && I("")) : (m == null || m(), C && setTimeout(() => {
-      var N;
-      (N = H.current) == null || N.focus();
+    return document.addEventListener("mousedown", v), () => document.removeEventListener("mousedown", v);
+  }, [g]);
+  const j = _ && H ? F.filter(
+    (v) => v.label.toLowerCase().includes(H.toLowerCase())
+  ) : F, U = () => {
+    u || (B(!C), $(!C), C ? (g == null || g(), _ && S("")) : (h == null || h(), _ && setTimeout(() => {
+      var v;
+      (v = M.current) == null || v.focus();
     }, 0)));
-  }, X = (N, L) => {
-    N.disabled || (R(N.value), $(!1), k(!1), I(""), p == null || p(N, L), f == null || f());
-  }, te = (N) => {
-    I(N.target.value);
-  }, G = (N) => {
-    N.key === "Escape" ? ($(!1), k(!1), I("")) : N.key === "Enter" && V.length > 0 && V[0] && X(V[0], N);
-  }, M = h.find((N) => N.value === E), ne = E !== "" && E !== void 0, ie = (N) => {
-    N.stopPropagation(), R("");
-    const L = { value: "", label: "" };
-    p == null || p(L, N);
-  }, re = ne || S || y || C && A, ce = [
+  }, L = (v, W) => {
+    v.disabled || (A(v.value), B(!1), $(!1), S(""), b == null || b(v, W), g == null || g());
+  }, K = (v) => {
+    S(v.target.value);
+  }, P = (v) => {
+    v.key === "Escape" ? (B(!1), $(!1), S("")) : v.key === "Enter" && j.length > 0 && j[0] && L(j[0], v);
+  }, Z = F.find((v) => v.value === k), q = k !== "" && k !== void 0, tt = (v) => {
+    v.stopPropagation(), A("");
+    const W = { value: "", label: "" };
+    b == null || b(W, v);
+  }, O = q || R || m || _ && H, X = [
     "clarity-select",
     "clarity-select--outlined",
-    `clarity-select--${t}`,
-    e && `clarity-select--${e}`,
-    l && "clarity-select--error",
-    o && "clarity-select--disabled",
-    (S || w) && "clarity-select--focused",
-    re && "clarity-select--label-up",
-    w && "clarity-select--open",
-    C && "clarity-select--searchable",
-    d && "clarity-select--with-start-icon",
-    (c || b) && "clarity-select--with-end-icon",
-    r
-  ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _("div", { className: "clarity-select-wrapper", children: [
-    /* @__PURE__ */ _(
-      "div",
+    `clarity-select--${a}`,
+    t && `clarity-select--${t}`,
+    o && "clarity-select--error",
+    u && "clarity-select--disabled",
+    (R || C) && "clarity-select--focused",
+    O && "clarity-select--label-up",
+    C && "clarity-select--open",
+    _ && "clarity-select--searchable",
+    c && "clarity-select--with-start-icon",
+    (d || y) && "clarity-select--with-end-icon",
+    i
+  ].filter(Boolean).join(" "), V = n != null && n.endsWith("left") ? "left" : "right", Y = (v, W) => {
+    if (!l) return null;
+    const T = typeof l == "object" ? l : void 0, G = (T == null ? void 0 : T.content) ?? "Ajuda", Q = (T == null ? void 0 : T.plain) === !0, at = T == null ? void 0 : T.variant, it = T == null ? void 0 : T.bgColor, ft = T == null ? void 0 : T.textColor, gt = v === "middle" ? 20 : 16;
+    return /* @__PURE__ */ e(
+      pt,
       {
-        ref: g,
-        className: ce,
-        onClick: C ? void 0 : F,
-        role: "combobox",
-        "aria-expanded": w,
-        "aria-haspopup": "listbox",
-        tabIndex: o || C ? -1 : 0,
-        ...j,
-        children: [
-          d && /* @__PURE__ */ a("div", { className: "clarity-select__start-icon", children: d }),
-          /* @__PURE__ */ _("div", { className: "clarity-select__field", children: [
-            C ? /* @__PURE__ */ a(
-              "input",
-              {
-                ref: H,
-                type: "text",
-                className: "clarity-select__search-input",
-                value: w ? A : M ? M.label : "",
-                onChange: te,
-                onKeyDown: G,
-                onFocus: () => {
-                  w || ($(!0), k(!0), m == null || m());
-                },
-                placeholder: M ? M.label : y,
-                disabled: o,
-                readOnly: !w
-              }
-            ) : /* @__PURE__ */ a("div", { className: "clarity-select__display", children: M ? M.label : y }),
-            s && /* @__PURE__ */ a("label", { className: "clarity-select__label", children: s })
-          ] }),
-          b && ne && /* @__PURE__ */ a(
-            "button",
-            {
-              type: "button",
-              className: "clarity-select__clear-button",
-              onClick: ie,
-              "aria-label": "Limpar seleção",
-              children: /* @__PURE__ */ a(
-                "svg",
-                {
-                  width: "16",
-                  height: "16",
-                  viewBox: "0 0 16 16",
-                  fill: "none",
-                  children: /* @__PURE__ */ a(
-                    "path",
-                    {
-                      d: "M12 4L4 12M4 4L12 12",
-                      stroke: "currentColor",
-                      strokeWidth: "1.5",
-                      strokeLinecap: "round",
-                      strokeLinejoin: "round"
-                    }
-                  )
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ a(
-            "div",
+        content: G,
+        position: v === "middle" ? W === "left" ? "left" : "right" : v === "top" ? W === "left" ? "top-left" : "top-right" : W === "left" ? "bottom-left" : "bottom-right",
+        trigger: "hover",
+        variant: at || t,
+        plain: Q,
+        bgColor: it,
+        textColor: ft,
+        children: /* @__PURE__ */ e("button", { type: "button", className: "clarity-select__helper-icon", "aria-label": "Helper", children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: gt, height: gt, fill: "currentColor", children: /* @__PURE__ */ e("path", { d: "M12.866 3l9.526 16.5a1 1 0 0 1-.866 1.5H2.474a1 1 0 0 1-.866-1.5L11.134 3a1 1 0 0 1 1.732 0zM11 16v2h2v-2h-2zm0-7v5h2V9h-2z" }) }) })
+      }
+    );
+  }, lt = /* @__PURE__ */ w(
+    "div",
+    {
+      ref: z,
+      className: X,
+      onClick: _ ? void 0 : U,
+      role: "combobox",
+      "aria-expanded": C,
+      "aria-haspopup": "listbox",
+      tabIndex: u || _ ? -1 : 0,
+      ...x,
+      children: [
+        c && /* @__PURE__ */ e("div", { className: "clarity-select__start-icon", children: c }),
+        /* @__PURE__ */ w("div", { className: "clarity-select__field", children: [
+          _ ? /* @__PURE__ */ e(
+            "input",
             {
-              className: "clarity-select__end-icon",
-              onClick: C ? F : void 0,
-              children: c || /* @__PURE__ */ a(
-                "svg",
-                {
-                  className: "clarity-select__arrow",
-                  width: "16",
-                  height: "16",
-                  viewBox: "0 0 16 16",
-                  fill: "none",
-                  children: /* @__PURE__ */ a(
-                    "path",
-                    {
-                      d: "M4 6L8 10L12 6",
-                      stroke: "currentColor",
-                      strokeWidth: "1.5",
-                      strokeLinecap: "round",
-                      strokeLinejoin: "round"
-                    }
-                  )
-                }
-              )
+              ref: M,
+              type: "text",
+              className: "clarity-select__search-input",
+              value: C ? H : Z ? Z.label : "",
+              onChange: K,
+              onKeyDown: P,
+              onFocus: () => {
+                C || (B(!0), $(!0), h == null || h());
+              },
+              placeholder: Z ? Z.label : m,
+              disabled: u,
+              readOnly: !C
             }
-          ),
-          w && /* @__PURE__ */ a("div", { className: "clarity-select__dropdown", children: /* @__PURE__ */ a("ul", { className: "clarity-select__options", role: "listbox", children: V.length > 0 ? V.map((N) => /* @__PURE__ */ a(
-            "li",
-            {
-              className: [
-                "clarity-select__option",
-                N.disabled && "clarity-select__option--disabled",
-                E === N.value && "clarity-select__option--selected"
-              ].filter(Boolean).join(" "),
-              onClick: (L) => X(N, L),
-              role: "option",
-              "aria-selected": E === N.value,
-              children: N.label
-            },
-            N.value
-          )) : /* @__PURE__ */ a("li", { className: "clarity-select__option clarity-select__option--no-results", children: "Nenhum resultado encontrado" }) }) })
-        ]
-      }
-    ),
-    (n || l && i) && /* @__PURE__ */ a("div", { className: "clarity-select__helper-text", children: l && i ? i : n })
+          ) : /* @__PURE__ */ e("div", { className: "clarity-select__display", children: Z ? Z.label : m }),
+          r && /* @__PURE__ */ e("label", { className: "clarity-select__label", children: r })
+        ] }),
+        y && q && /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            className: "clarity-select__clear-button",
+            onClick: tt,
+            "aria-label": "Limpar seleção",
+            children: /* @__PURE__ */ e(
+              "svg",
+              {
+                width: "16",
+                height: "16",
+                viewBox: "0 0 16 16",
+                fill: "none",
+                children: /* @__PURE__ */ e(
+                  "path",
+                  {
+                    d: "M12 4L4 12M4 4L12 12",
+                    stroke: "currentColor",
+                    strokeWidth: "1.5",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round"
+                  }
+                )
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ e(
+          "div",
+          {
+            className: "clarity-select__end-icon",
+            onClick: _ ? U : void 0,
+            children: d || /* @__PURE__ */ e(
+              "svg",
+              {
+                className: "clarity-select__arrow",
+                width: "16",
+                height: "16",
+                viewBox: "0 0 16 16",
+                fill: "none",
+                children: /* @__PURE__ */ e(
+                  "path",
+                  {
+                    d: "M4 6L8 10L12 6",
+                    stroke: "currentColor",
+                    strokeWidth: "1.5",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round"
+                  }
+                )
+              }
+            )
+          }
+        ),
+        C && /* @__PURE__ */ e("div", { className: "clarity-select__dropdown", children: /* @__PURE__ */ e("ul", { className: "clarity-select__options", role: "listbox", children: j.length > 0 ? j.map((v) => /* @__PURE__ */ e(
+          "li",
+          {
+            className: [
+              "clarity-select__option",
+              v.disabled && "clarity-select__option--disabled",
+              k === v.value && "clarity-select__option--selected"
+            ].filter(Boolean).join(" "),
+            onClick: (W) => L(v, W),
+            role: "option",
+            "aria-selected": k === v.value,
+            children: v.label
+          },
+          v.value
+        )) : /* @__PURE__ */ e("li", { className: "clarity-select__option clarity-select__option--no-results", children: "Nenhum resultado encontrado" }) }) })
+      ]
+    }
+  );
+  return /* @__PURE__ */ w("div", { className: "clarity-select-wrapper", children: [
+    l && (n == null ? void 0 : n.startsWith("top")) && /* @__PURE__ */ e("div", { className: `clarity-select__helper-row clarity-select__helper-row--top clarity-select__helper-row--${V}`, children: Y("top", V) }),
+    l && (n != null && n.startsWith("middle")) ? /* @__PURE__ */ w("div", { className: `clarity-select__middle-row clarity-select__middle-row--${V}`, children: [
+      V === "left" && Y("middle", V),
+      lt,
+      V === "right" && Y("middle", V)
+    ] }) : lt,
+    l && (n == null ? void 0 : n.startsWith("bottom")) && /* @__PURE__ */ e("div", { className: `clarity-select__helper-row clarity-select__helper-row--bottom clarity-select__helper-row--${V}`, children: Y("bottom", V) }),
+    o && s && /* @__PURE__ */ e("div", { className: "clarity-select__helper-text", children: s })
   ] });
 });
-nt.displayName = "Select";
-const lt = Ke(({
-  options: e = [],
-  value: t = [],
-  onChange: s,
-  placeholder: n = "Selecione opções",
-  label: l,
-  helperText: i,
-  error: d = !1,
-  errorMessage: c,
-  disabled: r = !1,
-  variant: o = "primary",
-  size: u = "medium",
-  maxSelectedLabels: v = 3,
-  selectionLimit: m,
-  className: f = "",
-  id: p,
-  name: h,
-  required: y = !1,
-  "data-testid": b,
-  ...C
-}, j) => {
-  const [T, w] = x(!1), [$, S] = x(""), [k, E] = x(!1), R = P(null), A = P(null), I = P(null), g = (N) => {
-    R.current = N, j && (typeof j == "function" ? j(N) : j.current = N);
+Le.displayName = "Select";
+const Ee = be(({
+  options: t = [],
+  value: a = [],
+  onChange: r,
+  placeholder: l = "Selecione opções",
+  label: n,
+  helper: o = !1,
+  helperPosition: s = "top-right",
+  error: c = !1,
+  errorMessage: d,
+  disabled: i = !1,
+  variant: u = "primary",
+  size: f = "medium",
+  maxSelectedLabels: p = 3,
+  selectionLimit: h,
+  className: g = "",
+  id: b,
+  name: N,
+  required: m = !1,
+  "data-testid": y,
+  ..._
+}, x) => {
+  const [E, C] = D(!1), [B, R] = D(""), [$, k] = D(!1), A = et(null), H = et(null), S = et(null), z = Array.isArray(t) ? t : [], M = (v) => {
+    A.current = v, x && (typeof x == "function" ? x(v) : x.current = v);
   };
-  O(() => {
-    const N = (L) => {
-      R.current && !R.current.contains(L.target) && (w(!1), E(!1), S(""));
+  J(() => {
+    const v = (W) => {
+      A.current && !A.current.contains(W.target) && (C(!1), k(!1), R(""));
     };
-    return document.addEventListener("click", N), () => document.removeEventListener("click", N);
+    return document.addEventListener("click", v), () => document.removeEventListener("click", v);
   }, []);
-  const H = e.filter(
-    (N) => N.label.toLowerCase().includes($.toLowerCase())
-  ), V = () => {
-    r || (w(!T), E(!T), T ? S("") : setTimeout(() => {
-      var N;
-      (N = A.current) == null || N.focus();
+  const F = z.filter(
+    (v) => v.label.toLowerCase().includes(B.toLowerCase())
+  ), j = () => {
+    i || (C(!E), k(!E), E ? R("") : setTimeout(() => {
+      var v;
+      (v = H.current) == null || v.focus();
     }, 100));
-  }, F = (N, L) => {
-    if (r)
+  }, U = (v, W) => {
+    if (i)
       return;
-    L && (L.stopPropagation(), L.preventDefault());
-    const z = t.includes(N);
-    let D;
-    z ? D = t.filter((se) => se !== N) : D = [...t, N], s && s(D);
-  }, X = (N, L) => {
-    if (L.stopPropagation(), r) return;
-    const z = t.filter((D) => D !== N);
-    s == null || s(z);
-  }, te = (N) => {
-    N.stopPropagation(), !r && (s == null || s([]));
-  }, G = (N) => {
-    S(N.target.value);
-  }, M = (N) => {
-    N.key === "Escape" && (w(!1), E(!1), S(""));
-  }, ne = k || T || t.length > 0, ie = () => {
-    if (t.length === 0) return null;
-    const N = t.map(
-      (D) => e.find((se) => se.value === D)
-    ).filter(Boolean), L = N.slice(0, v), z = N.length - v;
-    return /* @__PURE__ */ _("div", { className: "clarity-multiselect__chips", children: [
-      L.map((D) => /* @__PURE__ */ _("div", { className: "clarity-multiselect__chip", children: [
-        /* @__PURE__ */ a("span", { className: "clarity-multiselect__chip-label", children: D.label }),
-        !r && /* @__PURE__ */ a(
+    W && (W.stopPropagation(), W.preventDefault());
+    const T = a.includes(v);
+    let G;
+    T ? G = a.filter((Q) => Q !== v) : G = [...a, v], r && r(G);
+  }, L = (v, W) => {
+    if (W.stopPropagation(), i) return;
+    const T = a.filter((G) => G !== v);
+    r == null || r(T);
+  }, K = (v) => {
+    v.stopPropagation(), !i && (r == null || r([]));
+  }, P = (v) => {
+    R(v.target.value);
+  }, Z = (v) => {
+    v.key === "Escape" && (C(!1), k(!1), R(""));
+  }, q = $ || E || a.length > 0, tt = () => {
+    if (a.length === 0) return null;
+    const v = a.map(
+      (G) => z.find((Q) => Q.value === G)
+    ).filter(Boolean), W = v.slice(0, p), T = v.length - p;
+    return /* @__PURE__ */ w("div", { className: "clarity-multiselect__chips", children: [
+      W.map((G) => /* @__PURE__ */ w("div", { className: "clarity-multiselect__chip", children: [
+        /* @__PURE__ */ e("span", { className: "clarity-multiselect__chip-label", children: G.label }),
+        !i && /* @__PURE__ */ e(
           "button",
           {
             type: "button",
             className: "clarity-multiselect__chip-remove",
-            onClick: (se) => X(D.value, se),
-            "aria-label": `Remover ${D.label}`,
+            onClick: (Q) => L(G.value, Q),
+            "aria-label": `Remover ${G.label}`,
             children: "×"
           }
         )
-      ] }, D.value)),
-      z > 0 && /* @__PURE__ */ _("div", { className: "clarity-multiselect__chip clarity-multiselect__chip--count", children: [
+      ] }, G.value)),
+      T > 0 && /* @__PURE__ */ w("div", { className: "clarity-multiselect__chip clarity-multiselect__chip--count", children: [
         "+",
-        z,
+        T,
         " mais"
       ] })
     ] });
-  }, re = [
+  }, O = [
     "clarity-multiselect-wrapper",
-    f
-  ].filter(Boolean).join(" "), ce = [
+    g
+  ].filter(Boolean).join(" "), X = [
     "clarity-multiselect",
-    `clarity-multiselect--${o}`,
     `clarity-multiselect--${u}`,
-    T && "clarity-multiselect--open",
-    k && "clarity-multiselect--focused",
-    ne && "clarity-multiselect--label-up",
-    d && "clarity-multiselect--error",
-    r && "clarity-multiselect--disabled",
-    t.length > 0 && "clarity-multiselect--has-value"
-  ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _("div", { className: re, children: [
-    /* @__PURE__ */ _(
-      "div",
+    `clarity-multiselect--${f}`,
+    E && "clarity-multiselect--open",
+    $ && "clarity-multiselect--focused",
+    q && "clarity-multiselect--label-up",
+    c && "clarity-multiselect--error",
+    i && "clarity-multiselect--disabled",
+    a.length > 0 && "clarity-multiselect--has-value"
+  ].filter(Boolean).join(" "), V = s != null && s.endsWith("left") ? "left" : "right", Y = (v, W) => {
+    if (!o) return null;
+    const T = typeof o == "object" ? o : void 0, G = (T == null ? void 0 : T.content) ?? "Ajuda", Q = (T == null ? void 0 : T.plain) === !0, at = T == null ? void 0 : T.variant, it = T == null ? void 0 : T.bgColor, ft = T == null ? void 0 : T.textColor, gt = v === "middle" ? 20 : 16;
+    return /* @__PURE__ */ e(
+      pt,
       {
-        ref: g,
-        className: ce,
-        "data-testid": b,
-        ...C,
-        children: [
-          /* @__PURE__ */ _(
-            "div",
+        content: G,
+        position: v === "middle" ? W === "left" ? "left" : "right" : v === "top" ? W === "left" ? "top-left" : "top-right" : W === "left" ? "bottom-left" : "bottom-right",
+        trigger: "hover",
+        variant: at || u,
+        plain: Q,
+        bgColor: it,
+        textColor: ft,
+        children: /* @__PURE__ */ e("button", { type: "button", className: "clarity-multiselect__helper-icon", "aria-label": "Helper", children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: gt, height: gt, fill: "currentColor", children: /* @__PURE__ */ e("path", { d: "M12.866 3l9.526 16.5a1 1 0 0 1-.866 1.5H2.474a1 1 0 0 1-.866-1.5L11.134 3a1 1 0 0 1 1.732 0zM11 16v2h2v-2h-2zm0-7v5h2V9h-2z" }) }) })
+      }
+    );
+  }, lt = /* @__PURE__ */ w(
+    "div",
+    {
+      ref: M,
+      className: X,
+      "data-testid": y,
+      ..._,
+      children: [
+        /* @__PURE__ */ w(
+          "div",
+          {
+            className: "clarity-multiselect__field",
+            onClick: j,
+            children: [
+              n && /* @__PURE__ */ w("label", { className: "clarity-multiselect__label", children: [
+                n,
+                m && /* @__PURE__ */ e("span", { className: "clarity-multiselect__required", children: "*" })
+              ] }),
+              /* @__PURE__ */ e("div", { className: "clarity-multiselect__content", children: a.length > 0 ? tt() : /* @__PURE__ */ e("span", { className: "clarity-multiselect__placeholder", children: l }) }),
+              /* @__PURE__ */ w("div", { className: "clarity-multiselect__icons", children: [
+                a.length > 0 && !i && /* @__PURE__ */ e(
+                  "button",
+                  {
+                    type: "button",
+                    className: "clarity-multiselect__clear-button",
+                    onClick: K,
+                    "aria-label": "Limpar seleção",
+                    children: "×"
+                  }
+                ),
+                /* @__PURE__ */ e("div", { className: "clarity-multiselect__dropdown-icon", children: /* @__PURE__ */ e("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ e(
+                  "path",
+                  {
+                    d: "M4 6L8 10L12 6",
+                    stroke: "currentColor",
+                    strokeWidth: "1.5",
+                    strokeLinecap: "round",
+                    strokeLinejoin: "round"
+                  }
+                ) }) })
+              ] })
+            ]
+          }
+        ),
+        E && /* @__PURE__ */ w("div", { ref: S, className: "clarity-multiselect__dropdown", children: [
+          /* @__PURE__ */ e("div", { className: "clarity-multiselect__search", children: /* @__PURE__ */ e(
+            "input",
             {
-              className: "clarity-multiselect__field",
-              onClick: V,
-              children: [
-                l && /* @__PURE__ */ _("label", { className: "clarity-multiselect__label", children: [
-                  l,
-                  y && /* @__PURE__ */ a("span", { className: "clarity-multiselect__required", children: "*" })
-                ] }),
-                /* @__PURE__ */ a("div", { className: "clarity-multiselect__content", children: t.length > 0 ? ie() : /* @__PURE__ */ a("span", { className: "clarity-multiselect__placeholder", children: n }) }),
-                /* @__PURE__ */ _("div", { className: "clarity-multiselect__icons", children: [
-                  t.length > 0 && !r && /* @__PURE__ */ a(
-                    "button",
-                    {
-                      type: "button",
-                      className: "clarity-multiselect__clear-button",
-                      onClick: te,
-                      "aria-label": "Limpar seleção",
-                      children: "×"
-                    }
-                  ),
-                  /* @__PURE__ */ a("div", { className: "clarity-multiselect__dropdown-icon", children: /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ a(
+              ref: H,
+              type: "text",
+              className: "clarity-multiselect__search-input",
+              placeholder: "Buscar opções...",
+              value: B,
+              onChange: P,
+              onKeyDown: Z
+            }
+          ) }),
+          /* @__PURE__ */ e("ul", { className: "clarity-multiselect__options", children: F.length > 0 ? F.map((v) => {
+            const W = a.includes(v.value), T = v.disabled || i;
+            return /* @__PURE__ */ w(
+              "li",
+              {
+                className: [
+                  "clarity-multiselect__option",
+                  W && "clarity-multiselect__option--selected",
+                  T && "clarity-multiselect__option--disabled"
+                ].filter(Boolean).join(" "),
+                onClick: (G) => !T && U(v.value, G),
+                children: [
+                  /* @__PURE__ */ e("div", { className: "clarity-multiselect__option-checkbox", children: /* @__PURE__ */ e("div", { className: [
+                    "clarity-multiselect__checkbox",
+                    W && "clarity-multiselect__checkbox--checked"
+                  ].filter(Boolean).join(" "), children: W && /* @__PURE__ */ e("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ e(
                     "path",
                     {
-                      d: "M4 6L8 10L12 6",
+                      d: "M2 6L5 9L10 3",
                       stroke: "currentColor",
-                      strokeWidth: "1.5",
+                      strokeWidth: "2",
                       strokeLinecap: "round",
                       strokeLinejoin: "round"
                     }
-                  ) }) })
-                ] })
-              ]
-            }
-          ),
-          T && /* @__PURE__ */ _("div", { ref: I, className: "clarity-multiselect__dropdown", children: [
-            /* @__PURE__ */ a("div", { className: "clarity-multiselect__search", children: /* @__PURE__ */ a(
-              "input",
-              {
-                ref: A,
-                type: "text",
-                className: "clarity-multiselect__search-input",
-                placeholder: "Buscar opções...",
-                value: $,
-                onChange: G,
-                onKeyDown: M
-              }
-            ) }),
-            /* @__PURE__ */ a("ul", { className: "clarity-multiselect__options", children: H.length > 0 ? H.map((N) => {
-              const L = t.includes(N.value), z = N.disabled || r;
-              return /* @__PURE__ */ _(
-                "li",
-                {
-                  className: [
-                    "clarity-multiselect__option",
-                    L && "clarity-multiselect__option--selected",
-                    z && "clarity-multiselect__option--disabled"
-                  ].filter(Boolean).join(" "),
-                  onClick: (D) => !z && F(N.value, D),
-                  children: [
-                    /* @__PURE__ */ a("div", { className: "clarity-multiselect__option-checkbox", children: /* @__PURE__ */ a("div", { className: [
-                      "clarity-multiselect__checkbox",
-                      L && "clarity-multiselect__checkbox--checked"
-                    ].filter(Boolean).join(" "), children: L && /* @__PURE__ */ a("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ a(
-                      "path",
-                      {
-                        d: "M2 6L5 9L10 3",
-                        stroke: "currentColor",
-                        strokeWidth: "2",
-                        strokeLinecap: "round",
-                        strokeLinejoin: "round"
-                      }
-                    ) }) }) }),
-                    /* @__PURE__ */ a("span", { className: "clarity-multiselect__option-label", children: N.label })
-                  ]
-                },
-                N.value
-              );
-            }) : /* @__PURE__ */ a("li", { className: "clarity-multiselect__option clarity-multiselect__option--no-results", children: "Nenhum resultado encontrado" }) })
-          ] })
-        ]
-      }
-    ),
-    (i || d && c) && /* @__PURE__ */ a("div", { className: "clarity-multiselect__helper", children: d && c ? /* @__PURE__ */ a("span", { className: "clarity-multiselect__error-message", children: c }) : i && /* @__PURE__ */ a("span", { className: "clarity-multiselect__helper-text", children: i }) })
+                  ) }) }) }),
+                  /* @__PURE__ */ e("span", { className: "clarity-multiselect__option-label", children: v.label })
+                ]
+              },
+              v.value
+            );
+          }) : /* @__PURE__ */ e("li", { className: "clarity-multiselect__option clarity-multiselect__option--no-results", children: "Nenhum resultado encontrado" }) })
+        ] })
+      ]
+    }
+  );
+  return /* @__PURE__ */ w("div", { className: O, children: [
+    o && (s == null ? void 0 : s.startsWith("top")) && /* @__PURE__ */ e("div", { className: `clarity-multiselect__helper-row clarity-multiselect__helper-row--top clarity-multiselect__helper-row--${V}`, children: Y("top", V) }),
+    o && (s != null && s.startsWith("middle")) ? /* @__PURE__ */ w("div", { className: `clarity-multiselect__middle-row clarity-multiselect__middle-row--${V}`, children: [
+      V === "left" && Y("middle", V),
+      lt,
+      V === "right" && Y("middle", V)
+    ] }) : lt,
+    o && (s == null ? void 0 : s.startsWith("bottom")) && /* @__PURE__ */ e("div", { className: `clarity-multiselect__helper-row clarity-multiselect__helper-row--bottom clarity-multiselect__helper-row--${V}`, children: Y("bottom", V) }),
+    c && d && /* @__PURE__ */ e("div", { className: "clarity-multiselect__helper", children: /* @__PURE__ */ e("span", { className: "clarity-multiselect__error-message", children: d }) })
   ] });
 });
-lt.displayName = "MultiSelect";
-const pe = U(null), fe = () => {
-  const e = q(pe);
-  if (!e)
+Ee.displayName = "MultiSelect";
+const Rt = ct(null), Ot = () => {
+  const t = dt(Rt);
+  if (!t)
     throw new Error("useModal must be used within a Modal provider");
-  return e;
-}, he = ({
-  children: e,
-  className: t = "",
-  title: s
+  return t;
+}, Wt = ({
+  children: t,
+  className: a = "",
+  title: r
 }) => {
-  const { onClose: n, variant: l, showCloseButton: i } = fe(), d = [
+  const { onClose: l, variant: n, showCloseButton: o } = Ot(), s = [
     "clarity-modal-header",
-    t,
-    l && `clarity-modal-header--${l}`
+    a,
+    n && `clarity-modal-header--${n}`
   ].filter(Boolean).join(" "), c = [
     "clarity-modal-close",
-    l && `clarity-modal-close--${l}`
+    n && `clarity-modal-close--${n}`
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _("div", { className: d, children: [
-    s && /* @__PURE__ */ a("h2", { className: "clarity-modal-title", children: s }),
-    e,
-    i && /* @__PURE__ */ a("button", { className: c, onClick: (r) => {
-      r.stopPropagation(), n();
+  return /* @__PURE__ */ w("div", { className: s, children: [
+    r && /* @__PURE__ */ e("h2", { className: "clarity-modal-title", children: r }),
+    t,
+    o && /* @__PURE__ */ e("button", { className: c, onClick: (d) => {
+      d.stopPropagation(), l();
     }, children: "×" })
   ] });
 };
-he.displayName = "Modal.Header";
-const ye = ({ children: e, className: t = "" }) => /* @__PURE__ */ a("div", { className: `clarity-modal-content ${t}`, children: e });
-ye.displayName = "Modal.Content";
-const ve = ({ children: e, className: t = "" }) => /* @__PURE__ */ _("div", { className: `clarity-modal-footer ${t}`, children: [
-  /* @__PURE__ */ a("div", { className: "clarity-modal-scroll-indicator" }),
-  e
+Wt.displayName = "Modal.Header";
+const It = ({ children: t, className: a = "" }) => /* @__PURE__ */ e("div", { className: `clarity-modal-content ${a}`, children: t });
+It.displayName = "Modal.Content";
+const Ht = ({ children: t, className: a = "" }) => /* @__PURE__ */ w("div", { className: `clarity-modal-footer ${a}`, children: [
+  /* @__PURE__ */ e("div", { className: "clarity-modal-scroll-indicator" }),
+  t
 ] });
-ve.displayName = "Modal.Footer";
-const Ne = ({ children: e, onClick: t }) => W(e, {
-  onClick: (s) => {
-    var n, l;
-    t == null || t(), (l = (n = e.props).onClick) == null || l.call(n, s);
+Ht.displayName = "Modal.Footer";
+const Mt = ({ children: t, onClick: a }) => rt(t, {
+  onClick: (r) => {
+    var l, n;
+    a == null || a(), (n = (l = t.props).onClick) == null || n.call(l, r);
   }
 });
-Ne.displayName = "Modal.Trigger";
-const be = ({ children: e }) => {
-  const { onClose: t } = fe();
-  return W(e, {
-    onClick: (s) => {
-      var n, l;
-      t(), (l = (n = e.props).onClick) == null || l.call(n, s);
+Mt.displayName = "Modal.Trigger";
+const Vt = ({ children: t }) => {
+  const { onClose: a } = Ot();
+  return rt(t, {
+    onClick: (r) => {
+      var l, n;
+      a(), (n = (l = t.props).onClick) == null || n.call(l, r);
     }
   });
 };
-be.displayName = "Modal.Close";
-const J = ({
-  isOpen: e,
-  onClose: t,
-  onOpen: s,
-  children: n,
-  className: l = "",
-  variant: i,
-  size: d = "medium",
+Vt.displayName = "Modal.Close";
+const mt = ({
+  isOpen: t,
+  onClose: a,
+  onOpen: r,
+  children: l,
+  className: n = "",
+  variant: o,
+  size: s = "medium",
   showCloseButton: c = !0,
-  closeOnOverlayClick: r = !0
+  closeOnOverlayClick: d = !0
 }) => {
-  const [o, u] = x(!1), m = e !== void 0 ? e : o, f = t || (() => {
-    u(!1);
-  });
-  O(() => {
-    m && (s == null || s());
-  }, [m, s]), O(() => {
-    const C = (j) => {
-      j.key === "Escape" && f();
+  const [i, u] = D(!1), p = t !== void 0 ? t : i, h = I.useCallback(() => {
+    a ? a() : u(!1);
+  }, [a]);
+  J(() => {
+    p && (r == null || r());
+  }, [p, r]), J(() => {
+    const y = (_) => {
+      _.key === "Escape" && h();
     };
-    return m ? (document.addEventListener("keydown", C), document.body.style.overflow = "hidden") : document.body.style.overflow = "unset", () => {
-      document.removeEventListener("keydown", C), document.body.style.overflow = "unset";
+    return p ? (document.addEventListener("keydown", y), document.body.style.overflow = "hidden") : document.body.style.overflow = "unset", () => {
+      document.removeEventListener("keydown", y), document.body.style.overflow = "unset";
     };
-  }, [m, f]);
-  const p = (C) => {
-    r && C.target === C.currentTarget && f();
-  }, h = B.Children.toArray(n).find(
-    (C) => Z(C) && C.type.displayName === "Modal.Trigger"
-  ), y = B.Children.toArray(n).filter(
-    (C) => Z(C) && C.type.displayName !== "Modal.Trigger"
-  ), b = ["clarity-modal", l, `clarity-modal--${d}`].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _(pe.Provider, { value: { onClose: f, variant: i, showCloseButton: c }, children: [
-    h && W(h, { onClick: () => u(!0) }),
-    m && /* @__PURE__ */ a("div", { className: "clarity-modal-overlay", onClick: p, children: /* @__PURE__ */ a("div", { className: b, children: y }) })
+  }, [p, h]);
+  const g = (y) => {
+    d && y.target === y.currentTarget && h();
+  }, b = I.Children.toArray(l).find(
+    (y) => ot(y) && y.type.displayName === "Modal.Trigger"
+  ), N = I.Children.toArray(l).filter(
+    (y) => ot(y) && y.type.displayName !== "Modal.Trigger"
+  ), m = ["clarity-modal", n, `clarity-modal--${s}`].filter(Boolean).join(" ");
+  return /* @__PURE__ */ w(Rt.Provider, { value: { onClose: h, variant: o, showCloseButton: c }, children: [
+    b && rt(b, { onClick: () => u(!0) }),
+    p && /* @__PURE__ */ e("div", { className: "clarity-modal-overlay", onClick: g, children: /* @__PURE__ */ e("div", { className: m, children: N }) })
   ] });
 };
-J.Header = he;
-J.Content = ye;
-J.Footer = ve;
-J.Trigger = Ne;
-J.Close = be;
-J.displayName = "Modal";
-const Ce = U(void 0), jt = () => {
-  const e = q(Ce);
-  if (!e)
+mt.Header = Wt;
+mt.Content = It;
+mt.Footer = Ht;
+mt.Trigger = Mt;
+mt.Close = Vt;
+mt.displayName = "Modal";
+const zt = ct(void 0), ea = () => {
+  const t = dt(zt);
+  if (!t)
     throw new Error("useToast must be used within a ToastProvider");
-  return e;
-}, it = ({ id: e, message: t, variant: s, duration: n, onClose: l, invertColors: i }) => {
-  const [d, c] = x("entering");
-  O(() => {
-    const o = setTimeout(() => {
+  return t;
+}, Se = ({ id: t, message: a, variant: r, duration: l, onClose: n, invertColors: o }) => {
+  const [s, c] = D("entering");
+  J(() => {
+    const i = setTimeout(() => {
       c("visible");
     }, 10), u = setTimeout(() => {
       c("exiting");
-    }, n * 1e3 - 300), v = setTimeout(() => {
-      l(e);
-    }, n * 1e3);
+    }, l * 1e3 - 300), f = setTimeout(() => {
+      n(t);
+    }, l * 1e3);
     return () => {
-      clearTimeout(o), clearTimeout(u), clearTimeout(v);
+      clearTimeout(i), clearTimeout(u), clearTimeout(f);
     };
-  }, [e, n, l]);
-  const r = [
+  }, [t, l, n]);
+  const d = [
     "cl-toast",
-    s,
-    i ? "colored-background" : "",
-    `cl-toast-${d}`
+    r,
+    o ? "colored-background" : "",
+    `cl-toast-${s}`
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _("div", { className: r, children: [
-    /* @__PURE__ */ a("div", { className: "cl-toast-message", children: t }),
-    /* @__PURE__ */ a("button", { onClick: () => c("exiting"), className: "cl-toast-close-button", children: "×" }),
-    /* @__PURE__ */ a(
+  return /* @__PURE__ */ w("div", { className: d, children: [
+    /* @__PURE__ */ e("div", { className: "cl-toast-message", children: a }),
+    /* @__PURE__ */ e("button", { onClick: () => c("exiting"), className: "cl-toast-close-button", children: "×" }),
+    /* @__PURE__ */ e(
       "div",
       {
         className: "cl-toast-progress-bar",
-        style: { animationDuration: `${n}s` }
+        style: { animationDuration: `${l}s` }
       }
     )
   ] });
-}, Et = ({ children: e }) => {
-  const [t, s] = x([]), n = Y(() => {
+}, aa = ({ children: t }) => {
+  const [a, r] = D([]), l = vt(() => {
     if (typeof document < "u") {
-      const r = document.createElement("div");
-      return r.id = "toast-portal-root", r;
+      const d = document.createElement("div");
+      return d.id = "toast-portal-root", d;
     }
     return null;
   }, []);
-  O(() => {
-    if (n)
-      return document.body.appendChild(n), () => {
-        document.body.removeChild(n);
+  J(() => {
+    if (l)
+      return document.body.appendChild(l), () => {
+        document.body.removeChild(l);
       };
-  }, [n]);
-  const l = le((r) => {
+  }, [l]);
+  const n = _t((d) => {
     const u = {
       id: (/* @__PURE__ */ new Date()).toISOString() + Math.random(),
       // duration: 5,
       // position: 'right-top',
-      ...r
+      ...d
     };
-    s((v) => {
-      const m = [u, ...v];
-      return m.length > 4 ? m.slice(0, 4) : m;
+    r((f) => {
+      const p = [u, ...f];
+      return p.length > 4 ? p.slice(0, 4) : p;
     });
-  }, []), i = le((r) => {
-    s((o) => o.filter((u) => u.id !== r));
-  }, []), d = Y(() => t.reduce((r, o) => (r[o.position] || (r[o.position] = []), r[o.position].push(o), r), {}), [t]), c = Y(() => ({ show: l }), [l]);
-  return /* @__PURE__ */ _(Ce.Provider, { value: c, children: [
-    e,
-    n && tt.createPortal(
-      Object.entries(d).map(([r, o]) => /* @__PURE__ */ a("div", { className: `cl-toast-container ${r}`, children: o.map((u) => /* @__PURE__ */ a(it, { ...u, onClose: i }, u.id)) }, r)),
-      n
+  }, []), o = _t((d) => {
+    r((i) => i.filter((u) => u.id !== d));
+  }, []), s = vt(() => a.reduce((d, i) => (d[i.position] || (d[i.position] = []), d[i.position].push(i), d), {}), [a]), c = vt(() => ({ show: n }), [n]);
+  return /* @__PURE__ */ w(zt.Provider, { value: c, children: [
+    t,
+    l && we.createPortal(
+      Object.entries(s).map(([d, i]) => /* @__PURE__ */ e("div", { className: `cl-toast-container ${d}`, children: i.map((u) => /* @__PURE__ */ e(Se, { ...u, onClose: o }, u.id)) }, d)),
+      l
     )
   ] });
-}, _e = U(null), we = () => {
-  const e = q(_e);
-  if (!e)
+}, Dt = ct(null), At = () => {
+  const t = dt(Dt);
+  if (!t)
     throw new Error("useOffcanvas must be used within an Offcanvas provider");
-  return e;
-}, ge = ({
-  children: e,
-  className: t = ""
+  return t;
+}, Ft = ({
+  children: t,
+  className: a = ""
 }) => {
-  const { onClose: s, variant: n, showCloseButton: l, title: i } = we(), d = [
+  const { onClose: r, variant: l, showCloseButton: n, title: o } = At(), s = [
     "clarity-offcanvas-header",
-    t
+    a
   ].filter(Boolean).join(" "), c = [
     "clarity-offcanvas-close",
-    n && `clarity-offcanvas-close--${n}`
-  ].filter(Boolean).join(" "), r = [
+    l && `clarity-offcanvas-close--${l}`
+  ].filter(Boolean).join(" "), d = [
     "clarity-offcanvas-title",
-    n && `clarity-offcanvas-title--${n}`
+    l && `clarity-offcanvas-title--${l}`
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _("div", { className: d, children: [
-    i && /* @__PURE__ */ a("h2", { className: r, children: i }),
-    e,
-    l && /* @__PURE__ */ a("button", { className: c, onClick: (o) => {
-      o.stopPropagation(), s();
+  return /* @__PURE__ */ w("div", { className: s, children: [
+    o && /* @__PURE__ */ e("h2", { className: d, children: o }),
+    t,
+    n && /* @__PURE__ */ e("button", { className: c, onClick: (i) => {
+      i.stopPropagation(), r();
     }, children: "×" })
   ] });
 };
-ge.displayName = "Offcanvas.Header";
-const $e = ({ children: e, className: t = "" }) => /* @__PURE__ */ a("div", { className: `clarity-offcanvas-content ${t}`, children: e });
-$e.displayName = "Offcanvas.Content";
-const ke = ({ children: e, onClick: t, variant: s }) => W(e, {
-  onClick: (n) => {
-    var l, i;
-    t == null || t(), (i = (l = e.props).onClick) == null || i.call(l, n);
+Ft.displayName = "Offcanvas.Header";
+const Gt = ({ children: t, className: a = "" }) => /* @__PURE__ */ e("div", { className: `clarity-offcanvas-content ${a}`, children: t });
+Gt.displayName = "Offcanvas.Content";
+const Ut = ({ children: t, onClick: a, variant: r }) => rt(t, {
+  onClick: (l) => {
+    var n, o;
+    a == null || a(), (o = (n = t.props).onClick) == null || o.call(n, l);
   },
-  variant: s
+  variant: r
 });
-ke.displayName = "Offcanvas.Trigger";
-const oe = ({ children: e, className: t = "" }) => /* @__PURE__ */ a("div", { className: `clarity-offcanvas-footer ${t}`, children: e });
-oe.displayName = "Offcanvas.Footer";
-const xe = ({ children: e }) => {
-  const { onClose: t } = we();
-  return W(e, {
-    onClick: (s) => {
-      var n, l;
-      t(), (l = (n = e.props).onClick) == null || l.call(n, s);
+Ut.displayName = "Offcanvas.Trigger";
+const $t = ({ children: t, className: a = "" }) => /* @__PURE__ */ e("div", { className: `clarity-offcanvas-footer ${a}`, children: t });
+$t.displayName = "Offcanvas.Footer";
+const Xt = ({ children: t }) => {
+  const { onClose: a } = At();
+  return rt(t, {
+    onClick: (r) => {
+      var l, n;
+      a(), (n = (l = t.props).onClick) == null || n.call(l, r);
     }
   });
 };
-xe.displayName = "Offcanvas.Close";
-const K = ({
-  isOpen: e,
-  onClose: t,
-  onOpen: s,
-  children: n,
-  className: l = "",
-  variant: i,
-  placement: d = "right",
+Xt.displayName = "Offcanvas.Close";
+const ht = ({
+  isOpen: t,
+  onClose: a,
+  onOpen: r,
+  children: l,
+  className: n = "",
+  variant: o,
+  placement: s = "right",
   closeOnOverlayClick: c = !0,
-  showCloseButton: r = !0,
-  title: o
+  showCloseButton: d = !0,
+  title: i
 }) => {
-  const [u, v] = x(!1), [m, f] = x(!1), [p, h] = x(!1), y = e !== void 0, b = y ? e : u, C = le(() => {
-    t ? t() : v(!1);
-  }, [t]), j = le(() => {
-    y || v(!0), s == null || s();
-  }, [y, s]);
-  O(() => {
-    if (b) {
-      h(!0);
-      const g = setTimeout(() => {
-        f(!0);
+  const [u, f] = D(!1), [p, h] = D(!1), [g, b] = D(!1), N = t !== void 0, m = N ? t : u, y = _t(() => {
+    a ? a() : f(!1);
+  }, [a]), _ = _t(() => {
+    N || f(!0), r == null || r();
+  }, [N, r]);
+  J(() => {
+    if (m) {
+      b(!0);
+      const S = setTimeout(() => {
+        h(!0);
       }, 50);
-      return () => clearTimeout(g);
+      return () => clearTimeout(S);
     } else {
-      f(!1);
-      const g = setTimeout(() => {
-        h(!1);
+      h(!1);
+      const S = setTimeout(() => {
+        b(!1);
       }, 300);
-      return () => clearTimeout(g);
+      return () => clearTimeout(S);
     }
-  }, [b]), O(() => {
-    const g = (H) => {
-      H.key === "Escape" && C();
+  }, [m]), J(() => {
+    const S = (z) => {
+      z.key === "Escape" && y();
     };
-    return b ? (document.addEventListener("keydown", g), document.body.style.overflow = "hidden") : (document.removeEventListener("keydown", g), document.body.style.overflow = "unset"), () => {
-      document.removeEventListener("keydown", g), document.body.style.overflow = "unset";
+    return m ? (document.addEventListener("keydown", S), document.body.style.overflow = "hidden") : (document.removeEventListener("keydown", S), document.body.style.overflow = "unset"), () => {
+      document.removeEventListener("keydown", S), document.body.style.overflow = "unset";
     };
-  }, [b, C]);
-  const T = (g) => {
-    c && g.target === g.currentTarget && C();
-  }, w = B.Children.toArray(n);
-  let $, S, k, E, R;
-  w.forEach((g) => {
-    if (Z(g))
-      if (g.type.displayName === "Offcanvas.Trigger")
-        $ = g;
-      else if (g.type.displayName === "Offcanvas.Header")
-        S = g;
-      else if (g.type.displayName === "Offcanvas.Content") {
-        k = g;
-        const V = B.Children.toArray(k.props.children).filter((F) => Z(F) && F.type.displayName === "Offcanvas.Close" ? (R = F, !1) : !0);
-        k = W(k, { children: V });
-      } else g.type.displayName === "Offcanvas.Footer" && (E = g);
-  }), R && (E ? E = W(E, {
-    children: /* @__PURE__ */ _(Ze, { children: [
-      E.props.children,
-      R
+  }, [m, y]);
+  const x = (S) => {
+    c && S.target === S.currentTarget && y();
+  }, E = I.Children.toArray(l);
+  let C, B, R, $, k;
+  E.forEach((S) => {
+    if (ot(S))
+      if (S.type.displayName === "Offcanvas.Trigger")
+        C = S;
+      else if (S.type.displayName === "Offcanvas.Header")
+        B = S;
+      else if (S.type.displayName === "Offcanvas.Content") {
+        R = S;
+        const M = I.Children.toArray(R.props.children).filter((F) => ot(F) && F.type.displayName === "Offcanvas.Close" ? (k = F, !1) : !0);
+        R = rt(R, { children: M });
+      } else S.type.displayName === "Offcanvas.Footer" && ($ = S);
+  }), k && ($ ? $ = rt($, {
+    children: /* @__PURE__ */ w(jt, { children: [
+      $.props.children,
+      k
     ] })
-  }) : E = /* @__PURE__ */ a(oe, { children: R }));
+  }) : $ = /* @__PURE__ */ e($t, { children: k }));
   const A = [
     "clarity-offcanvas",
-    l,
-    `clarity-offcanvas--${d}`,
-    i && `clarity-offcanvas--${i}`,
-    m ? "clarity-offcanvas--open" : "clarity-offcanvas--closed"
-  ].filter(Boolean).join(" "), I = [
+    n,
+    `clarity-offcanvas--${s}`,
+    o && `clarity-offcanvas--${o}`,
+    p ? "clarity-offcanvas--open" : "clarity-offcanvas--closed"
+  ].filter(Boolean).join(" "), H = [
     "clarity-offcanvas-overlay",
-    m ? "clarity-offcanvas-overlay--visible" : ""
+    p ? "clarity-offcanvas-overlay--visible" : ""
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _(_e.Provider, { value: { onClose: C, variant: i, showCloseButton: r, placement: d, title: o }, children: [
-    $ && W($, { onClick: j, variant: i }),
-    p && // Only render if shouldRender is true
-    /* @__PURE__ */ a("div", { className: I, onClick: T, children: /* @__PURE__ */ _("div", { className: A, children: [
-      S,
-      k,
-      E && /* @__PURE__ */ a("div", { className: "clarity-offcanvas-scroll-indicator" }),
+  return /* @__PURE__ */ w(Dt.Provider, { value: { onClose: y, variant: o, showCloseButton: d, placement: s, title: i }, children: [
+    C && rt(C, { onClick: _, variant: o }),
+    g && // Only render if shouldRender is true
+    /* @__PURE__ */ e("div", { className: H, onClick: x, children: /* @__PURE__ */ w("div", { className: A, children: [
+      B,
+      R,
+      $ && /* @__PURE__ */ e("div", { className: "clarity-offcanvas-scroll-indicator" }),
       " ",
-      E
+      $
     ] }) })
   ] });
 };
-K.Header = ge;
-K.Content = $e;
-K.Footer = oe;
-K.Trigger = ke;
-K.Close = xe;
-K.displayName = "Offcanvas";
-const rt = B.forwardRef(({
-  type: e,
-  variant: t = "primary",
-  size: s = "medium",
-  label: n,
-  helperText: l,
-  error: i = !1,
+ht.Header = Ft;
+ht.Content = Gt;
+ht.Footer = $t;
+ht.Trigger = Ut;
+ht.Close = Xt;
+ht.displayName = "Offcanvas";
+const Re = I.forwardRef(({
+  type: t,
+  variant: a = "primary",
+  size: r = "medium",
+  label: l,
+  helperText: n,
+  helper: o = !1,
+  helperPosition: s = "middle-right",
+  error: c = !1,
   errorMessage: d,
-  labelPosition: c = "right",
-  className: r = "",
-  disabled: o = !1,
-  checked: u,
-  id: v,
-  ...m
-}, f) => {
-  const p = v || `check-input-${Math.random().toString(36).substr(2, 9)}`, h = [
+  labelPosition: i = "right",
+  className: u = "",
+  disabled: f = !1,
+  checked: p,
+  id: h,
+  ...g
+}, b) => {
+  const N = h || `check-input-${Math.random().toString(36).substr(2, 9)}`, m = [
     "clarity-check-input-wrapper",
-    `clarity-check-input-wrapper--${c}`,
-    o && "clarity-check-input-wrapper--disabled",
-    i && "clarity-check-input-wrapper--error"
+    `clarity-check-input-wrapper--${i}`,
+    f && "clarity-check-input-wrapper--disabled",
+    c && "clarity-check-input-wrapper--error"
   ].filter(Boolean).join(" "), y = [
     "clarity-check-input",
-    `clarity-check-input--${e}`,
-    `clarity-check-input--${s}`,
-    t && `clarity-check-input--${t}`,
-    i && "clarity-check-input--error",
-    o && "clarity-check-input--disabled",
-    r
-  ].filter(Boolean).join(" "), b = [
+    `clarity-check-input--${t}`,
+    `clarity-check-input--${r}`,
+    a && `clarity-check-input--${a}`,
+    c && "clarity-check-input--error",
+    f && "clarity-check-input--disabled",
+    u
+  ].filter(Boolean).join(" "), _ = [
     "clarity-check-input__label",
-    `clarity-check-input__label--${s}`,
-    o && "clarity-check-input__label--disabled"
-  ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _("div", { className: "clarity-check-input-container", children: [
-    /* @__PURE__ */ _("label", { className: h, htmlFor: p, children: [
-      /* @__PURE__ */ a(
-        "input",
+    `clarity-check-input__label--${r}`,
+    f && "clarity-check-input__label--disabled"
+  ].filter(Boolean).join(" "), x = s != null && s.endsWith("left") ? "left" : "right", E = (B, R) => {
+    if (!o) return null;
+    const $ = typeof o == "object" ? o : void 0, k = ($ == null ? void 0 : $.content) ?? "Ajuda", A = ($ == null ? void 0 : $.plain) === !0, H = $ == null ? void 0 : $.variant, S = $ == null ? void 0 : $.bgColor, z = $ == null ? void 0 : $.textColor, M = B === "middle" ? 20 : 16;
+    return /* @__PURE__ */ e(
+      pt,
+      {
+        content: k,
+        position: B === "middle" ? R === "left" ? "left" : "right" : B === "top" ? R === "left" ? "top-left" : "top-right" : R === "left" ? "bottom-left" : "bottom-right",
+        trigger: "hover",
+        variant: H || a,
+        plain: A,
+        bgColor: S,
+        textColor: z,
+        children: /* @__PURE__ */ e("button", { type: "button", className: "clarity-check-input__helper-icon", "aria-label": "Helper", children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: M, height: M, fill: "currentColor", children: /* @__PURE__ */ e("path", { d: "M12.866 3l9.526 16.5a1 1 0 0 1-.866 1.5H2.474a1 1 0 0 1-.866-1.5L11.134 3a1 1 0 0 1 1.732 0zM11 16v2h2v-2h-2zm0-7v5h2V9h-2z" }) }) })
+      }
+    );
+  }, C = /* @__PURE__ */ w("label", { className: m, htmlFor: N, children: [
+    /* @__PURE__ */ e(
+      "input",
+      {
+        ref: b,
+        id: N,
+        type: t,
+        className: y,
+        disabled: f,
+        checked: p,
+        ...g
+      }
+    ),
+    /* @__PURE__ */ w("div", { className: "clarity-check-input__custom", children: [
+      t === "checkbox" && /* @__PURE__ */ e(
+        "svg",
         {
-          ref: f,
-          id: p,
-          type: e,
-          className: y,
-          disabled: o,
-          checked: u,
-          ...m
+          className: "clarity-check-input__icon",
+          viewBox: "0 0 16 16",
+          fill: "none",
+          xmlns: "http://www.w3.org/2000/svg",
+          children: /* @__PURE__ */ e(
+            "path",
+            {
+              d: "M13.5 4.5L6 12L2.5 8.5",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
+            }
+          )
         }
       ),
-      /* @__PURE__ */ _("div", { className: "clarity-check-input__custom", children: [
-        e === "checkbox" && /* @__PURE__ */ a(
-          "svg",
-          {
-            className: "clarity-check-input__icon",
-            viewBox: "0 0 16 16",
-            fill: "none",
-            xmlns: "http://www.w3.org/2000/svg",
-            children: /* @__PURE__ */ a(
-              "path",
-              {
-                d: "M13.5 4.5L6 12L2.5 8.5",
-                stroke: "currentColor",
-                strokeWidth: "2",
-                strokeLinecap: "round",
-                strokeLinejoin: "round"
-              }
-            )
-          }
-        ),
-        e === "radio" && /* @__PURE__ */ a("div", { className: "clarity-check-input__radio-dot" })
-      ] }),
-      n && /* @__PURE__ */ a("span", { className: b, children: n })
+      t === "radio" && /* @__PURE__ */ e("div", { className: "clarity-check-input__radio-dot" })
     ] }),
-    (l || i && d) && /* @__PURE__ */ a("div", { className: "clarity-check-input__helper-text", children: i && d ? d : l })
+    l && /* @__PURE__ */ e("span", { className: _, children: l })
+  ] });
+  return /* @__PURE__ */ w("div", { className: "clarity-check-input-container", children: [
+    o && (s == null ? void 0 : s.startsWith("top")) && /* @__PURE__ */ e("div", { className: `clarity-check-input__helper-row clarity-check-input__helper-row--top clarity-check-input__helper-row--${x}`, children: E("top", x) }),
+    o && (s != null && s.startsWith("middle")) ? /* @__PURE__ */ w("div", { className: `clarity-check-input__middle-row clarity-check-input__middle-row--${x}`, children: [
+      x === "left" && E("middle", x),
+      C,
+      x === "right" && E("middle", x)
+    ] }) : C,
+    o && (s == null ? void 0 : s.startsWith("bottom")) && /* @__PURE__ */ e("div", { className: `clarity-check-input__helper-row clarity-check-input__helper-row--bottom clarity-check-input__helper-row--${x}`, children: E("bottom", x) }),
+    (n || c && d) && /* @__PURE__ */ e("div", { className: "clarity-check-input__helper-text", children: c && d ? d : n })
   ] });
 });
-rt.displayName = "CheckInput";
-const ct = B.forwardRef(({
-  variant: e = "primary",
-  size: t = "medium",
-  label: s,
-  helperText: n,
-  error: l = !1,
-  errorMessage: i,
-  labelPosition: d = "right",
-  className: c = "",
-  disabled: r = !1,
-  checked: o,
-  id: u,
-  ...v
-}, m) => {
-  const f = u || `input-switch-${Math.random().toString(36).substr(2, 9)}`, p = [
+Re.displayName = "CheckInput";
+const Oe = I.forwardRef(({
+  variant: t = "primary",
+  size: a = "medium",
+  label: r,
+  helper: l = !1,
+  helperPosition: n = "middle-right",
+  error: o = !1,
+  errorMessage: s,
+  labelPosition: c = "right",
+  className: d = "",
+  disabled: i = !1,
+  checked: u,
+  id: f,
+  ...p
+}, h) => {
+  const g = f || `input-switch-${Math.random().toString(36).substr(2, 9)}`, b = [
     "clarity-input-switch-wrapper",
-    `clarity-input-switch-wrapper--${d}`,
-    r && "clarity-input-switch-wrapper--disabled",
-    l && "clarity-input-switch-wrapper--error"
-  ].filter(Boolean).join(" "), h = [
+    `clarity-input-switch-wrapper--${c}`,
+    i && "clarity-input-switch-wrapper--disabled",
+    o && "clarity-input-switch-wrapper--error"
+  ].filter(Boolean).join(" "), N = [
     "clarity-input-switch",
-    `clarity-input-switch--${t}`,
-    e && `clarity-input-switch--${e}`,
-    l && "clarity-input-switch--error",
-    r && "clarity-input-switch--disabled",
-    c
-  ].filter(Boolean).join(" "), y = [
+    `clarity-input-switch--${a}`,
+    t && `clarity-input-switch--${t}`,
+    o && "clarity-input-switch--error",
+    i && "clarity-input-switch--disabled",
+    d
+  ].filter(Boolean).join(" "), m = [
     "clarity-input-switch__label",
-    `clarity-input-switch__label--${t}`,
-    r && "clarity-input-switch__label--disabled"
-  ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _("div", { className: "clarity-input-switch-container", children: [
-    /* @__PURE__ */ _("label", { className: p, htmlFor: f, children: [
-      /* @__PURE__ */ a(
-        "input",
-        {
-          ref: m,
-          id: f,
-          type: "checkbox",
-          className: h,
-          disabled: r,
-          checked: o,
-          ...v
-        }
-      ),
-      /* @__PURE__ */ a("div", { className: "clarity-input-switch__track", children: /* @__PURE__ */ a("div", { className: "clarity-input-switch__thumb" }) }),
-      s && /* @__PURE__ */ a("span", { className: y, children: s })
-    ] }),
-    (n || l && i) && /* @__PURE__ */ a("div", { className: "clarity-input-switch__helper-text", children: l && i ? i : n })
+    `clarity-input-switch__label--${a}`,
+    t && `clarity-input-switch__label--${t}`,
+    i && "clarity-input-switch__label--disabled"
+  ].filter(Boolean).join(" "), y = n != null && n.endsWith("left") ? "left" : "right", _ = (E, C) => {
+    if (!l) return null;
+    const B = typeof l == "object" ? l : void 0, R = (B == null ? void 0 : B.content) ?? "Ajuda", $ = (B == null ? void 0 : B.plain) === !0, k = B == null ? void 0 : B.variant, A = B == null ? void 0 : B.bgColor, H = B == null ? void 0 : B.textColor, S = E === "middle" ? 20 : 16;
+    return /* @__PURE__ */ e(
+      pt,
+      {
+        content: R,
+        position: E === "middle" ? C === "left" ? "left" : "right" : E === "top" ? C === "left" ? "top-left" : "top-right" : C === "left" ? "bottom-left" : "bottom-right",
+        trigger: "hover",
+        variant: k || t,
+        plain: $,
+        bgColor: A,
+        textColor: H,
+        children: /* @__PURE__ */ e("button", { type: "button", className: "clarity-input-switch__helper-icon", "aria-label": "Helper", children: /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: S, height: S, fill: "currentColor", children: /* @__PURE__ */ e("path", { d: "M12.866 3l9.526 16.5a1 1 0 0 1-.866 1.5H2.474a1 1 0 0 1-.866-1.5L11.134 3a1 1 0 0 1 1.732 0zM11 16v2h2v-2h-2zm0-7v5h2V9h-2z" }) }) })
+      }
+    );
+  }, x = /* @__PURE__ */ w("label", { className: b, htmlFor: g, children: [
+    /* @__PURE__ */ e(
+      "input",
+      {
+        ref: h,
+        id: g,
+        type: "checkbox",
+        className: N,
+        disabled: i,
+        checked: u,
+        ...p
+      }
+    ),
+    /* @__PURE__ */ e("div", { className: "clarity-input-switch__track", children: /* @__PURE__ */ e("div", { className: "clarity-input-switch__thumb" }) }),
+    r && /* @__PURE__ */ e("span", { className: m, children: r })
+  ] });
+  return /* @__PURE__ */ w("div", { className: "clarity-input-switch-container", children: [
+    l && (n == null ? void 0 : n.startsWith("top")) && /* @__PURE__ */ e("div", { className: `clarity-input-switch__helper-row clarity-input-switch__helper-row--top clarity-input-switch__helper-row--${y}`, children: _("top", y) }),
+    l && (n != null && n.startsWith("middle")) ? /* @__PURE__ */ w("div", { className: `clarity-input-switch__middle-row clarity-input-switch__middle-row--${y}`, children: [
+      y === "left" && _("middle", y),
+      x,
+      y === "right" && _("middle", y)
+    ] }) : x,
+    l && (n == null ? void 0 : n.startsWith("bottom")) && /* @__PURE__ */ e("div", { className: `clarity-input-switch__helper-row clarity-input-switch__helper-row--bottom clarity-input-switch__helper-row--${y}`, children: _("bottom", y) }),
+    o && s && /* @__PURE__ */ e("div", { className: "clarity-input-switch__error-text", children: s })
   ] });
 });
-ct.displayName = "InputSwitch";
-const Te = U(null), de = () => {
-  const e = q(Te);
-  if (!e)
+Oe.displayName = "InputSwitch";
+const Yt = ct(null), wt = () => {
+  const t = dt(Yt);
+  if (!t)
     throw new Error("useConfirmationDialog must be used within a ConfirmationDialog provider");
-  return e;
-}, Be = ({ children: e, className: t = "" }) => {
-  const { variant: s } = de(), n = `clarity-confirmation-dialog-header ${t} clarity-confirmation-dialog-header--${s}`;
-  return /* @__PURE__ */ a("div", { className: n, children: e });
+  return t;
+}, Zt = ({ children: t, className: a = "" }) => {
+  const { variant: r } = wt(), l = `clarity-confirmation-dialog-header ${a} clarity-confirmation-dialog-header--${r}`;
+  return /* @__PURE__ */ e("div", { className: l, children: t });
 };
-Be.displayName = "ConfirmationDialog.Header";
-const je = ({ children: e, className: t = "" }) => /* @__PURE__ */ a("div", { className: `clarity-confirmation-dialog-content ${t}`, children: e });
-je.displayName = "ConfirmationDialog.Content";
-const Ee = ({ children: e, className: t = "" }) => /* @__PURE__ */ a("div", { className: `clarity-confirmation-dialog-footer ${t}`, children: e });
-Ee.displayName = "ConfirmationDialog.Footer";
-const Le = ({ children: e }) => W(e, {
-  onClick: (t) => {
-    var s, n;
-    (n = (s = e.props).onClick) == null || n.call(s, t);
-  }
-});
-Le.displayName = "ConfirmationDialog.Trigger";
-const Se = ({ children: e }) => {
-  const { onClose: t } = de();
-  return W(e, {
-    onClick: (s) => {
-      var n, l;
-      t(), (l = (n = e.props).onClick) == null || l.call(n, s);
+Zt.displayName = "ConfirmationDialog.Header";
+const qt = ({ children: t, className: a = "" }) => /* @__PURE__ */ e("div", { className: `clarity-confirmation-dialog-content ${a}`, children: t });
+qt.displayName = "ConfirmationDialog.Content";
+const Jt = ({ children: t, className: a = "" }) => /* @__PURE__ */ e("div", { className: `clarity-confirmation-dialog-footer ${a}`, children: t });
+Jt.displayName = "ConfirmationDialog.Footer";
+const Qt = ({ children: t }) => {
+  const { onOpen: a } = wt();
+  return rt(t, {
+    onClick: (r) => {
+      var l, n;
+      a(), (n = (l = t.props).onClick) == null || n.call(l, r);
+    }
+  });
+};
+Qt.displayName = "ConfirmationDialog.Trigger";
+const Kt = ({ children: t }) => {
+  const { onClose: a } = wt();
+  return rt(t, {
+    onClick: (r) => {
+      var l, n;
+      a(), (n = (l = t.props).onClick) == null || n.call(l, r);
     }
   });
 };
-Se.displayName = "ConfirmationDialog.Close";
-const Oe = ({ children: e }) => {
-  const { onConfirm: t } = de();
-  return W(e, {
-    onClick: (s) => {
-      var n, l;
-      t(), (l = (n = e.props).onClick) == null || l.call(n, s);
+Kt.displayName = "ConfirmationDialog.Close";
+const Pt = ({ children: t }) => {
+  const { onConfirm: a } = wt();
+  return rt(t, {
+    onClick: (r) => {
+      var l, n;
+      a(), (n = (l = t.props).onClick) == null || n.call(l, r);
     }
   });
 };
-Oe.displayName = "ConfirmationDialog.Confirm";
-const Q = ({
-  isOpen: e,
-  onClose: t,
-  onConfirm: s,
-  variant: n = "clarity-primary",
-  children: l
+Pt.displayName = "ConfirmationDialog.Confirm";
+const ut = ({
+  isOpen: t,
+  onClose: a,
+  onConfirm: r,
+  variant: l = "primary",
+  children: n,
+  blockScroll: o = !0
 }) => {
-  const [i, d] = x(!1), c = e !== void 0, r = c ? e : i, o = () => {
-    c || d(!0);
-  }, u = () => {
-    t ? t() : d(!1);
-  }, v = () => {
-    s && s(), u();
+  const [s, c] = D(!1), d = t !== void 0, i = d ? t : s, u = () => {
+    d || c(!0);
+  }, f = I.useCallback(() => {
+    a ? a() : c(!1);
+  }, [a]), p = () => {
+    r && r(), f();
   };
-  O(() => {
-    const h = (y) => {
-      y.key === "Escape" && u();
+  J(() => {
+    const N = (m) => {
+      m.key === "Escape" && f();
     };
-    return r ? (document.addEventListener("keydown", h), document.body.style.overflow = "hidden") : document.body.style.overflow = "unset", () => {
-      document.removeEventListener("keydown", h), document.body.style.overflow = "unset";
+    return i ? (document.addEventListener("keydown", N), o && (document.body.style.overflow = "hidden")) : document.body.style.overflow = "unset", () => {
+      document.removeEventListener("keydown", N), document.body.style.overflow = "unset";
     };
-  }, [r, u]);
-  const m = B.Children.toArray(l).find(
-    (h) => Z(h) && h.type.displayName === "ConfirmationDialog.Trigger"
-  ), f = B.Children.toArray(l).filter(
-    (h) => Z(h) && h.type.displayName !== "ConfirmationDialog.Trigger"
-  ), p = `clarity-confirmation-dialog clarity-confirmation-dialog--${n}`;
-  return /* @__PURE__ */ _(Te.Provider, { value: { variant: n, onClose: u, onConfirm: v, onOpen: o }, children: [
-    m,
-    r && /* @__PURE__ */ a("div", { className: "clarity-modal-overlay", children: /* @__PURE__ */ a("div", { className: p, children: f }) })
+  }, [i, f, o]);
+  const h = I.Children.toArray(n).find(
+    (N) => ot(N) && N.type.displayName === "ConfirmationDialog.Trigger"
+  ), g = I.Children.toArray(n).filter(
+    (N) => ot(N) && N.type.displayName !== "ConfirmationDialog.Trigger"
+  ), b = `clarity-confirmation-dialog clarity-confirmation-dialog--${l}`;
+  return /* @__PURE__ */ w(Yt.Provider, { value: { variant: l, onClose: f, onConfirm: p, onOpen: u }, children: [
+    h,
+    i && /* @__PURE__ */ e("div", { className: "clarity-modal-overlay", children: /* @__PURE__ */ e("div", { className: b, children: g }) })
   ] });
 };
-Q.Header = Be;
-Q.Content = je;
-Q.Footer = Ee;
-Q.Trigger = Le;
-Q.Close = Se;
-Q.Confirm = Oe;
-Q.displayName = "ConfirmationDialog";
-const Lt = ({
-  variant: e = "primary",
-  size: t = "medium",
-  disabled: s = !1,
-  loading: n = !1,
-  children: l,
-  onClick: i,
-  type: d = "button",
+ut.Header = Zt;
+ut.Content = qt;
+ut.Footer = Jt;
+ut.Trigger = Qt;
+ut.Close = Kt;
+ut.Confirm = Pt;
+ut.displayName = "ConfirmationDialog";
+const ra = ({
+  variant: t = "primary",
+  size: a = "medium",
+  disabled: r = !1,
+  loading: l = !1,
+  children: n,
+  onClick: o,
+  type: s = "button",
   className: c = "",
-  "aria-label": r,
-  title: o,
+  "aria-label": d,
+  title: i,
   customColor: u,
-  customColorHover: v,
-  ...m
+  customColorHover: f,
+  ...p
 }) => {
-  const f = "clarity-button-icon", p = [
-    f,
-    !u && `${f}--${e}`,
-    `${f}--${t}`,
-    n && `${f}--loading`,
-    s && `${f}--disabled`,
+  const h = "clarity-button-icon", g = [
+    h,
+    !u && `${h}--${t}`,
+    `${h}--${a}`,
+    l && `${h}--loading`,
+    r && `${h}--disabled`,
     c
-  ].filter(Boolean).join(" "), h = {};
-  return u && (h["--button-icon-bg"] = u, h["--button-icon-hover-bg"] = v || `${u}E6`), /* @__PURE__ */ _(
+  ].filter(Boolean).join(" "), b = {};
+  return u && (b["--button-icon-bg"] = u, b["--button-icon-hover-bg"] = f || `${u}E6`), /* @__PURE__ */ w(
     "button",
     {
-      className: p,
-      disabled: s || n,
-      onClick: i,
-      type: d,
-      "aria-label": r,
-      title: o,
-      style: h,
-      ...m,
+      className: g,
+      disabled: r || l,
+      onClick: o,
+      type: s,
+      "aria-label": d,
+      title: i,
+      style: b,
+      ...p,
       children: [
-        n && /* @__PURE__ */ a("div", { className: `${f}__spinner` }),
-        !n && l
+        l && /* @__PURE__ */ e("div", { className: `${h}__spinner` }),
+        !l && n
       ]
     }
   );
-}, St = ({
-  variant: e = "primary",
-  product: t,
-  tone: s,
-  hoverTone: n,
-  size: l = "medium",
-  disabled: i = !1,
-  children: d,
+}, la = ({
+  variant: t = "primary",
+  product: a,
+  tone: r,
+  hoverTone: l,
+  size: n = "medium",
+  disabled: o = !1,
+  children: s,
   onClick: c,
-  href: r,
-  target: o,
+  href: d,
+  target: i,
   rel: u,
-  className: v = "",
-  ...m
+  className: f = "",
+  ...p
 }) => {
-  const f = "clarity-button-link", p = t && s, h = p ? `${f}--custom` : `${f}--${e}`, y = [
-    f,
+  const h = "clarity-button-link", g = a && r, b = g ? `${h}--custom` : `${h}--${t}`, N = [
     h,
-    `${f}--${l}`,
-    i && `${f}--disabled`,
-    v
-  ].filter(Boolean).join(" "), b = (j) => {
-    const T = parseInt(j);
-    return T >= 800 ? "900" : T >= 700 ? "800" : T >= 600 ? "700" : T >= 500 ? "600" : T >= 400 ? "500" : T >= 300 ? "400" : T >= 200 ? "300" : "200";
-  }, C = p ? {
-    "--custom-color": `var(--clarity-${t}-${s})`,
-    "--custom-hover-color": `var(--clarity-${t}-${n || b(s)})`
+    b,
+    `${h}--${n}`,
+    o && `${h}--disabled`,
+    f
+  ].filter(Boolean).join(" "), m = (_) => {
+    const x = parseInt(_);
+    return x >= 800 ? "900" : x >= 700 ? "800" : x >= 600 ? "700" : x >= 500 ? "600" : x >= 400 ? "500" : x >= 300 ? "400" : x >= 200 ? "300" : "200";
+  }, y = g ? {
+    "--custom-color": `var(--clarity-${a}-${r})`,
+    "--custom-hover-color": `var(--clarity-${a}-${l || m(r)})`
   } : {};
-  return r ? /* @__PURE__ */ a(
+  return d ? /* @__PURE__ */ e(
     "a",
     {
-      href: r,
-      target: o,
-      rel: u || (o === "_blank" ? "noopener noreferrer" : void 0),
-      className: y,
-      style: C,
-      onClick: i ? void 0 : c,
-      ...m,
-      children: d
+      href: d,
+      target: i,
+      rel: u || (i === "_blank" ? "noopener noreferrer" : void 0),
+      className: N,
+      style: y,
+      onClick: o ? void 0 : c,
+      ...p,
+      children: s
     }
-  ) : /* @__PURE__ */ a(
+  ) : /* @__PURE__ */ e(
     "button",
     {
-      className: y,
-      style: C,
-      disabled: i,
+      className: N,
+      style: y,
+      disabled: o,
       onClick: c,
-      ...m,
-      children: d
+      ...p,
+      children: s
     }
   );
-}, Ie = U(void 0), Re = () => {
-  const e = q(Ie);
-  if (!e)
+}, te = ct(void 0), ee = () => {
+  const t = dt(te);
+  if (!t)
     throw new Error("Accordion components must be used within an Accordion");
-  return e;
-}, ot = ({
-  variant: e = "primary",
-  product: t,
-  tone: s,
-  hoverTone: n,
-  defaultActiveKey: l,
-  alwaysOpen: i = !1,
-  flush: d = !1,
+  return t;
+}, We = ({
+  variant: t = "primary",
+  product: a,
+  tone: r,
+  hoverTone: l,
+  defaultActiveKey: n,
+  alwaysOpen: o = !1,
+  flush: s = !1,
   className: c = "",
-  children: r,
-  onSelect: o,
+  children: d,
+  onSelect: i,
   ...u
 }) => {
-  const [v, m] = x(() => l ? Array.isArray(l) ? l : [l] : []), f = (w) => {
-    let $;
-    i ? $ = v.includes(w) ? v.filter((S) => S !== w) : [...v, w] : $ = v.includes(w) ? [] : [w], m($), o && o(v.includes(w) ? null : w, {});
-  }, p = "clarity-accordion", h = t && s, y = h ? `${p}--custom` : `${p}--${e}`, b = [
-    p,
-    y,
-    d && `${p}--flush`,
+  const [f, p] = D(() => n ? Array.isArray(n) ? n : [n] : []), h = (E) => {
+    let C;
+    o ? C = f.includes(E) ? f.filter((B) => B !== E) : [...f, E] : C = f.includes(E) ? [] : [E], p(C), i && i(f.includes(E) ? null : E, {});
+  }, g = "clarity-accordion", b = a && r, N = b ? `${g}--custom` : `${g}--${t}`, m = [
+    g,
+    N,
+    s && `${g}--flush`,
     c
-  ].filter(Boolean).join(" "), C = (w) => {
-    const $ = parseInt(w);
-    return $ >= 800 ? "900" : $ >= 700 ? "800" : $ >= 600 ? "700" : $ >= 500 ? "600" : $ >= 400 ? "500" : $ >= 300 ? "400" : $ >= 200 ? "300" : "200";
-  }, j = h ? {
-    "--custom-border-color": `var(--clarity-${t}-${s})`,
-    "--custom-header-color": `var(--clarity-${t}-${s})`,
-    "--custom-hover-color": `var(--clarity-${t}-${n || C(s)})`
-  } : {}, T = {
-    activeKeys: v,
-    toggleItem: f,
-    alwaysOpen: i,
-    variant: e,
-    product: t,
-    tone: s,
-    hoverTone: n,
-    flush: d
+  ].filter(Boolean).join(" "), y = (E) => {
+    const C = parseInt(E);
+    return C >= 800 ? "900" : C >= 700 ? "800" : C >= 600 ? "700" : C >= 500 ? "600" : C >= 400 ? "500" : C >= 300 ? "400" : C >= 200 ? "300" : "200";
+  }, _ = b ? {
+    "--custom-border-color": `var(--clarity-${a}-${r})`,
+    "--custom-header-color": `var(--clarity-${a}-${r})`,
+    "--custom-hover-color": `var(--clarity-${a}-${l || y(r)})`
+  } : {}, x = {
+    activeKeys: f,
+    toggleItem: h,
+    alwaysOpen: o,
+    variant: t,
+    product: a,
+    tone: r,
+    hoverTone: l,
+    flush: s
   };
-  return /* @__PURE__ */ a(Ie.Provider, { value: T, children: /* @__PURE__ */ a("div", { className: b, style: j, ...u, children: r }) });
-}, dt = ({
-  eventKey: e,
-  disabled: t = !1,
-  className: s = "",
-  children: n,
-  ...l
+  return /* @__PURE__ */ e(te.Provider, { value: x, children: /* @__PURE__ */ e("div", { className: m, style: _, ...u, children: d }) });
+}, Ie = ({
+  eventKey: t,
+  disabled: a = !1,
+  className: r = "",
+  children: l,
+  ...n
 }) => {
-  const { activeKeys: i } = Re(), d = "clarity-accordion", c = i.includes(e), r = [
-    `${d}__item`,
-    c && `${d}__item--active`,
-    t && `${d}__item--disabled`,
-    s
+  const { activeKeys: o } = ee(), s = "clarity-accordion", c = o.includes(t), d = [
+    `${s}__item`,
+    c && `${s}__item--active`,
+    a && `${s}__item--disabled`,
+    r
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ a("div", { className: r, ...l, children: B.Children.map(n, (o) => B.isValidElement(o) ? B.cloneElement(o, {
-    ...o.props,
-    eventKey: e,
-    disabled: t,
+  return /* @__PURE__ */ e("div", { className: d, ...n, children: I.Children.map(l, (i) => I.isValidElement(i) ? I.cloneElement(i, {
+    ...i.props,
+    eventKey: t,
+    disabled: a,
     isActive: c
-  }) : o) });
-}, mt = ({
-  className: e = "",
-  children: t,
-  onClick: s,
-  eventKey: n,
-  disabled: l = !1,
-  isActive: i = !1,
-  ...d
+  }) : i) });
+}, He = ({
+  className: t = "",
+  children: a,
+  onClick: r,
+  eventKey: l,
+  disabled: n = !1,
+  isActive: o = !1,
+  ...s
 }) => {
-  const { toggleItem: c } = Re(), r = "clarity-accordion", o = (u) => {
-    !l && n && c(n), s == null || s(u);
+  const { toggleItem: c } = ee(), d = "clarity-accordion", i = (u) => {
+    !n && l && c(l), r == null || r(u);
   };
-  return /* @__PURE__ */ _(
+  return /* @__PURE__ */ w(
     "button",
     {
-      className: [`${r}__header`, e].filter(Boolean).join(" "),
-      onClick: o,
-      disabled: l,
-      "aria-expanded": i,
-      "aria-controls": n ? `${r}-collapse-${n}` : void 0,
-      ...d,
+      className: [`${d}__header`, t].filter(Boolean).join(" "),
+      onClick: i,
+      disabled: n,
+      "aria-expanded": o,
+      "aria-controls": l ? `${d}-collapse-${l}` : void 0,
+      ...s,
       children: [
-        /* @__PURE__ */ a("span", { className: `${r}__title`, children: t }),
-        /* @__PURE__ */ a("span", { className: `${r}__icon`, children: /* @__PURE__ */ a(
+        /* @__PURE__ */ e("span", { className: `${d}__title`, children: a }),
+        /* @__PURE__ */ e("span", { className: `${d}__icon`, children: /* @__PURE__ */ e(
           "svg",
           {
             width: "16",
             height: "16",
             viewBox: "0 0 16 16",
             fill: "currentColor",
-            className: i ? `${r}__icon--rotated` : "",
-            children: /* @__PURE__ */ a("path", { d: "M4.646 6.646a.5.5 0 0 1 .708 0L8 9.293l2.646-2.647a.5.5 0 0 1 .708.708l-3 3a.5.5 0 0 1-.708 0l-3-3a.5.5 0 0 1 0-.708z" })
+            className: o ? `${d}__icon--rotated` : "",
+            children: /* @__PURE__ */ e("path", { d: "M4.646 6.646a.5.5 0 0 1 .708 0L8 9.293l2.646-2.647a.5.5 0 0 1 .708.708l-3 3a.5.5 0 0 1-.708 0l-3-3a.5.5 0 0 1 0-.708z" })
           }
         ) })
       ]
     }
   );
-}, ut = ({
-  className: e = "",
-  children: t,
-  eventKey: s,
-  isActive: n = !1,
-  ...l
+}, Me = ({
+  className: t = "",
+  children: a,
+  eventKey: r,
+  isActive: l = !1,
+  ...n
 }) => {
-  const i = "clarity-accordion";
-  return /* @__PURE__ */ a(
+  const o = "clarity-accordion";
+  return /* @__PURE__ */ e(
     "div",
     {
-      id: s ? `${i}-collapse-${s}` : void 0,
+      id: r ? `${o}-collapse-${r}` : void 0,
       className: [
-        `${i}__collapse`,
-        n && `${i}__collapse--show`
+        `${o}__collapse`,
+        l && `${o}__collapse--show`
       ].filter(Boolean).join(" "),
-      children: /* @__PURE__ */ a("div", { className: [`${i}__body`, e].filter(Boolean).join(" "), ...l, children: t })
+      children: /* @__PURE__ */ e("div", { className: [`${o}__body`, t].filter(Boolean).join(" "), ...n, children: a })
     }
   );
-}, Ot = Object.assign(ot, {
-  Item: dt,
-  Header: mt,
-  Body: ut
-}), De = U(
+}, na = Object.assign(We, {
+  Item: Ie,
+  Header: He,
+  Body: Me
+}), ae = ct(
   void 0
-), Ae = () => {
-  const e = q(De);
-  if (!e)
+), re = () => {
+  const t = dt(ae);
+  if (!t)
     throw new Error("useDropdown must be used within a DropdownProvider");
-  return e;
-}, pt = ({ children: e }) => {
-  const { setIsOpen: t, triggerRef: s } = Ae();
-  return /* @__PURE__ */ a(
+  return t;
+}, Ve = ({ children: t }) => {
+  const { setIsOpen: a, triggerRef: r } = re();
+  return /* @__PURE__ */ e(
     "button",
     {
       type: "button",
-      ref: s,
+      ref: r,
       className: "dropdown__trigger",
-      onClick: () => t((n) => !n),
+      onClick: () => a((l) => !l),
       "aria-haspopup": "true",
-      children: e
+      children: t
     }
   );
-}, ft = ({ children: e }) => {
-  const { isOpen: t, contentRef: s, styles: n } = Ae();
-  return t ? /* @__PURE__ */ a("div", { ref: s, className: "dropdown__content", style: n, children: e }) : null;
-}, ht = ({ children: e }) => /* @__PURE__ */ a("div", { className: "dropdown__menu", children: e }), yt = ({ as: e, children: t, ...s }) => /* @__PURE__ */ a(e || "a", { ...s, className: "dropdown__item", children: t }), vt = () => /* @__PURE__ */ a("hr", { className: "dropdown__separator" }), ae = ({ title: e, position: t = "bottom", children: s }) => {
-  const [n, l] = x(!1), [i, d] = x({}), c = P(null), r = P(null), o = P(null);
-  return et(() => {
-    if (n) {
-      const u = r.current, v = o.current;
-      if (!u || !v) return;
-      const m = u.getBoundingClientRect(), f = v.getBoundingClientRect(), p = window.innerHeight, h = window.innerWidth;
-      let y = t;
-      t === "bottom" && m.bottom + f.height > p && (y = "top"), t === "top" && m.top - f.height < 0 && (y = "bottom"), t === "right" && m.right + f.width > h && (y = "left"), t === "left" && m.left - f.width < 0 && (y = "right");
-      const b = {};
-      switch (y) {
+}, ze = ({ children: t }) => {
+  const { isOpen: a, contentRef: r, styles: l } = re();
+  return a ? /* @__PURE__ */ e("div", { ref: r, className: "dropdown__content", style: l, children: t }) : null;
+}, De = ({ children: t }) => /* @__PURE__ */ e("div", { className: "dropdown__menu", children: t }), Ae = ({ as: t, children: a, ...r }) => /* @__PURE__ */ e(t || "a", { ...r, className: "dropdown__item", children: a }), Fe = () => /* @__PURE__ */ e("hr", { className: "dropdown__separator" }), bt = ({ title: t, position: a = "bottom", children: r }) => {
+  const [l, n] = D(!1), [o, s] = D({}), c = et(null), d = et(null), i = et(null);
+  return Lt(() => {
+    if (l) {
+      const u = d.current, f = i.current;
+      if (!u || !f) return;
+      const p = u.getBoundingClientRect(), h = f.getBoundingClientRect(), g = window.innerHeight, b = window.innerWidth;
+      let N = a;
+      a === "bottom" && p.bottom + h.height > g && (N = "top"), a === "top" && p.top - h.height < 0 && (N = "bottom"), a === "right" && p.right + h.width > b && (N = "left"), a === "left" && p.left - h.width < 0 && (N = "right");
+      const m = {};
+      switch (N) {
         case "top":
-          b.bottom = m.height + 4, b.left = m.width / 2 - f.width / 2;
+          m.bottom = p.height + 4, m.left = p.width / 2 - h.width / 2;
           break;
         case "right":
-          b.left = m.width + 4, b.top = m.height / 2 - f.height / 2;
+          m.left = p.width + 4, m.top = p.height / 2 - h.height / 2;
           break;
         case "left":
-          b.right = m.width + 4, b.top = m.height / 2 - f.height / 2;
+          m.right = p.width + 4, m.top = p.height / 2 - h.height / 2;
           break;
         case "bottom":
         default:
-          b.top = m.height + 4, b.left = m.width / 2 - f.width / 2;
+          m.top = p.height + 4, m.left = p.width / 2 - h.width / 2;
           break;
       }
-      d(b);
+      s(m);
     }
-  }, [n, t]), O(() => {
-    const u = (v) => {
-      c.current && !c.current.contains(v.target) && l(!1);
+  }, [l, a]), J(() => {
+    const u = (f) => {
+      c.current && !c.current.contains(f.target) && n(!1);
     };
     return document.addEventListener("mousedown", u), () => {
       document.removeEventListener("mousedown", u);
     };
-  }, []), /* @__PURE__ */ a(De.Provider, { value: { isOpen: n, setIsOpen: l, triggerRef: r, contentRef: o, styles: i }, children: /* @__PURE__ */ a(
+  }, []), /* @__PURE__ */ e(ae.Provider, { value: { isOpen: l, setIsOpen: n, triggerRef: d, contentRef: i, styles: o }, children: /* @__PURE__ */ e(
     "div",
     {
       ref: c,
       className: "dropdown",
-      title: e,
-      children: s
+      title: t,
+      children: r
     }
   ) });
 };
-ae.Trigger = pt;
-ae.Content = ft;
-ae.Menu = ht;
-ae.Item = yt;
-ae.Separator = vt;
-const Pe = U(null), Ve = () => {
-  const e = q(Pe);
-  if (!e)
-    throw new Error("useTabs must be used within a Tabs provider");
-  return e;
-}, Me = ({ id: e, label: t, className: s = "" }) => {
-  const { activeTab: n, setActiveTab: l, variant: i, orientation: d } = Ve(), c = n === e, r = [
+bt.Trigger = Ve;
+bt.Content = ze;
+bt.Menu = De;
+bt.Item = Ae;
+bt.Separator = Fe;
+const xt = ({
+  as: t = "button",
+  id: a,
+  children: r,
+  className: l = "",
+  isActive: n,
+  onClick: o,
+  variant: s,
+  orientation: c,
+  ...d
+}) => {
+  const i = [
     "clarity-tab",
-    s,
-    c ? "active" : "",
-    c ? `variant-${i}` : "",
-    `orientation-${d}`
+    l,
+    n ? "active" : "",
+    n ? `variant-${s}` : "",
+    `orientation-${c}`
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ a(
-    "button",
+  return /* @__PURE__ */ e(
+    t,
     {
-      className: r,
-      onClick: () => l(e),
+      ...t === "button" ? { type: "button" } : {},
+      ...d,
+      className: i,
+      onClick: () => {
+        o == null || o(a);
+      },
       role: "tab",
-      "aria-selected": c,
-      children: /* @__PURE__ */ a("span", { className: "clarity-tab-label", children: t })
+      "aria-selected": n,
+      children: r
     }
   );
 };
-Me.displayName = "Tabs.Tab";
-const He = ({ id: e, children: t, className: s = "" }) => {
-  const { activeTab: n } = Ve(), l = n === e, i = {
-    visibility: l ? "visible" : "hidden",
-    gridArea: "1 / 1"
-  };
-  return l || (i.pointerEvents = "none"), /* @__PURE__ */ a("div", { className: `clarity-tab-content ${s}`, role: "tabpanel", style: i, children: t });
-};
-He.displayName = "Tabs.Content";
-const me = ({
-  children: e,
-  defaultTab: t,
-  variant: s = "primary",
+xt.displayName = "Tabs.Tab";
+const le = ({
+  children: t,
+  activeTab: a,
+  onTabChange: r,
+  variant: l = "primary",
   orientation: n = "horizontal",
-  className: l = "",
-  useUrl: i = !1
+  align: o = "left",
+  className: s = ""
 }) => {
-  const d = () => window.location.hash.replace("#", ""), [c, r] = x(() => i && d() || t);
-  O(() => {
-    if (i) {
-      const m = () => {
-        const f = d();
-        f && r(f);
-      };
-      return window.addEventListener("hashchange", m), () => {
-        window.removeEventListener("hashchange", m);
-      };
-    }
-  }, [i]);
-  const o = (m) => {
-    i && (window.location.hash = String(m)), r(m);
-  }, u = Y(() => ({
-    activeTab: c,
-    setActiveTab: o,
-    variant: s,
-    orientation: n
-  }), [c, s, n]), v = [
+  let c = "";
+  o === "center" ? c = "clarity-tabs-align-center" : o === "right" && (c = "clarity-tabs-align-right");
+  const d = [
     "clarity-tabs-container",
-    l,
-    `orientation-${n}`
-  ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ a(Pe.Provider, { value: u, children: /* @__PURE__ */ a("div", { className: v, children: e }) });
+    s,
+    `orientation-${n}`,
+    n === "horizontal" ? c : ""
+  ].filter(Boolean).join(" "), i = [], u = [];
+  return _e.forEach(t, (f) => {
+    ot(f) && f.type === xt ? i.push(f) : u.push(f);
+  }), /* @__PURE__ */ w("div", { className: d, children: [
+    /* @__PURE__ */ e("div", { className: "clarity-tab-list", role: "tablist", children: i.map(
+      (f) => rt(f, {
+        isActive: I.isValidElement(f) && f.props.id === a,
+        onClick: r,
+        variant: l,
+        orientation: n
+      })
+    ) }),
+    u
+  ] });
 };
-me.Tab = Me;
-me.Content = He;
-me.displayName = "Tabs";
-const It = ({
-  content: e,
-  position: t = "top",
-  variant: s = "primary",
-  product: n,
-  tone: l,
-  bgColor: i,
-  textColor: d,
-  children: c,
-  className: r = "",
-  disabled: o = !1,
-  delay: u = 200,
-  hideDelay: v = 100,
-  trigger: m = "hover",
-  arrow: f = !0,
-  ...p
-}) => {
-  const [h, y] = x(!1), [b, C] = x(null), j = P(null), T = P(null), w = "clarity-tooltip", $ = !!i, S = n && l && !$;
-  let k = "";
-  $ ? k = `${w}__content--custom-bg` : S ? k = `${w}__content--custom` : k = `${w}__content--${s}`;
-  const E = [
-    w,
-    `${w}--${t}`,
-    r
-  ].filter(Boolean).join(" "), R = [
-    `${w}__content`,
-    k,
-    f && `${w}__content--arrow`
-  ].filter(Boolean).join(" "), A = {}, I = {};
-  $ && i && (I["--tooltip-bg-color"] = i), d && (I["--tooltip-text-color"] = d), S && n && l && (I["--tooltip-product"] = n, I["--tooltip-tone"] = l);
-  const g = {
-    ...A,
-    ...Object.keys(I).length > 0 ? I : {}
-  }, H = () => {
-    if (o) return;
-    b && clearTimeout(b);
-    const M = setTimeout(() => {
-      y(!0);
-    }, u);
-    C(M);
-  }, V = () => {
-    b && clearTimeout(b);
-    const M = setTimeout(() => {
-      y(!1);
-    }, v);
-    C(M);
-  }, F = () => {
-    o || y(!h);
-  }, X = () => {
-    o || H();
-  }, te = () => {
-    V();
-  };
-  O(() => () => {
-    b && clearTimeout(b);
-  }, [b]);
-  const G = {};
-  return m === "hover" ? (G.onMouseEnter = H, G.onMouseLeave = V) : m === "click" ? G.onClick = F : m === "focus" && (G.onFocus = X, G.onBlur = te), /* @__PURE__ */ _(
-    "div",
-    {
-      ref: T,
-      className: `${w}__trigger`,
-      ...G,
-      ...p,
-      children: [
-        c,
-        h && /* @__PURE__ */ a(
-          "div",
-          {
-            ref: j,
-            className: E,
-            style: g,
-            role: "tooltip",
-            "aria-hidden": !h,
-            children: /* @__PURE__ */ a("div", { className: R, children: e })
-          }
-        )
-      ]
-    }
-  );
-}, We = U(null), ee = () => {
-  const e = q(We);
-  if (!e)
+le.Tab = xt;
+le.displayName = "Tabs";
+const ne = ct(null), yt = () => {
+  const t = dt(ne);
+  if (!t)
     throw new Error("useCommand must be used within a Command provider");
-  return e;
-}, Fe = ({
-  children: e,
-  className: t = "",
-  variant: s = "secondary",
-  emptyText: n = "No results found.",
-  inputPlaceholder: l = "Search...",
-  ...i
+  return t;
+}, ie = ({
+  children: t,
+  className: a = "",
+  variant: r = "secondary",
+  emptyText: l = "No results found.",
+  inputPlaceholder: n = "Search...",
+  ...o
 }) => {
-  const [d, c] = x(""), [r, o] = x(null), [u, v] = x(!1), m = [
+  const [s, c] = D(""), [d, i] = D(null), [u, f] = D(!1), p = [
     "clarity-command",
-    `clarity-command--${s}`,
-    t
-  ].filter(Boolean).join(" "), f = Y(() => ({
-    searchTerm: d,
+    `clarity-command--${r}`,
+    a
+  ].filter(Boolean).join(" "), h = vt(() => ({
+    searchTerm: s,
     setSearchTerm: c,
-    value: r,
-    setValue: o,
-    variant: s,
+    value: d,
+    setValue: i,
+    variant: r,
     texts: {
-      empty: n,
-      inputPlaceholder: l
+      empty: l,
+      inputPlaceholder: n
     },
     isOpen: u,
-    setIsOpen: v
-  }), [d, r, s, n, l, u]);
-  return /* @__PURE__ */ a(We.Provider, { value: f, children: /* @__PURE__ */ a("div", { className: m, ...i, children: e }) });
+    setIsOpen: f
+  }), [s, d, r, l, n, u]);
+  return /* @__PURE__ */ e(ne.Provider, { value: h, children: /* @__PURE__ */ e("div", { className: p, ...o, children: t }) });
 };
-Fe.displayName = "Command";
-const Ge = ({ placeholder: e = "Search...", variant: t, onClick: s }) => {
-  const { setIsOpen: n, variant: l } = ee(), [i, d] = x(!1);
-  O(() => {
-    d(/Mac|iPod|iPhone|iPad/.test(navigator.platform));
+ie.displayName = "Command";
+const se = ({ placeholder: t = "Search...", variant: a, onClick: r }) => {
+  const { setIsOpen: l, variant: n } = yt(), [o, s] = D(!1);
+  J(() => {
+    s(/Mac|iPod|iPhone|iPad/.test(navigator.platform));
   }, []);
-  const r = [
+  const d = [
     "clarity-command-button",
-    `clarity-command-button--${t || l}`
+    `clarity-command-button--${a || n}`
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _("button", { className: r, onClick: (u) => {
-    n(!0), s == null || s(u);
+  return /* @__PURE__ */ w("button", { className: d, onClick: (u) => {
+    l(!0), r == null || r(u);
   }, children: [
-    /* @__PURE__ */ a("span", { children: e }),
-    /* @__PURE__ */ _("kbd", { className: "clarity-command-shortcut", children: [
-      i ? "⌘" : "Ctrl+",
+    /* @__PURE__ */ e("span", { children: t }),
+    /* @__PURE__ */ w("kbd", { className: "clarity-command-shortcut", children: [
+      o ? "⌘" : "Ctrl+",
       "K"
     ] })
   ] });
 };
-Ge.displayName = "Command.Button";
-const ze = ({ children: e, ...t }) => {
-  const { isOpen: s, setIsOpen: n, variant: l } = ee();
-  return O(() => {
-    const i = (d) => {
-      d.key === "k" && (d.metaKey || d.ctrlKey) && (d.preventDefault(), n(!s));
+se.displayName = "Command.Button";
+const oe = ({ children: t }) => {
+  const { isOpen: a, setIsOpen: r, variant: l } = yt();
+  return J(() => {
+    const n = (o) => {
+      o.key === "k" && (o.metaKey || o.ctrlKey) && (o.preventDefault(), r(!a));
     };
-    return document.addEventListener("keydown", i), () => document.removeEventListener("keydown", i);
-  }, [s, n]), /* @__PURE__ */ a(J, { isOpen: s, onClose: () => n(!1), size: "large", closeOnOverlayClick: !0, children: /* @__PURE__ */ a("div", { className: `clarity-command--${l}`, children: e }) });
+    return document.addEventListener("keydown", n), () => document.removeEventListener("keydown", n);
+  }, [a, r]), /* @__PURE__ */ e(mt, { isOpen: a, onClose: () => r(!1), size: "large", closeOnOverlayClick: !0, children: /* @__PURE__ */ e("div", { className: `clarity-command--${l}`, children: t }) });
 };
-ze.displayName = "Command.Dialog";
-const Ue = ({ className: e = "", ...t }) => {
-  const { searchTerm: s, setSearchTerm: n, variant: l, texts: i, isOpen: d } = ee(), c = P(null);
-  O(() => {
-    var o;
-    d && ((o = c.current) == null || o.focus());
-  }, [d]);
-  const r = [
+oe.displayName = "Command.Dialog";
+const ce = ({ className: t = "", ...a }) => {
+  const { searchTerm: r, setSearchTerm: l, variant: n, texts: o, isOpen: s } = yt(), c = et(null);
+  J(() => {
+    var i;
+    s && ((i = c.current) == null || i.focus());
+  }, [s]);
+  const d = [
     "clarity-command-input",
-    `clarity-command-input--${l}`,
-    e
+    `clarity-command-input--${n}`,
+    t
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ a("div", { className: "clarity-command-input__wrapper", children: /* @__PURE__ */ a(
+  return /* @__PURE__ */ e("div", { className: "clarity-command-input__wrapper", children: /* @__PURE__ */ e(
     "input",
     {
       ref: c,
-      className: r,
-      value: s,
-      onChange: (o) => n(o.target.value),
-      placeholder: t.placeholder || i.inputPlaceholder,
-      ...t
+      className: d,
+      value: r,
+      onChange: (i) => l(i.target.value),
+      placeholder: a.placeholder || o.inputPlaceholder,
+      ...a
     }
   ) });
 };
-Ue.displayName = "Command.Input";
-const qe = ({ children: e, className: t = "", ...s }) => {
-  const { searchTerm: n } = ee();
-  let l = !1;
-  const i = (r) => B.Children.toArray(r).map((o) => {
-    var v;
-    if (!B.isValidElement(o)) return o;
-    const u = o.type.displayName;
+ce.displayName = "Command.Input";
+const de = ({ children: t, className: a = "", ...r }) => {
+  const { searchTerm: l } = yt();
+  let n = !1;
+  const o = (d) => I.Children.toArray(d).map((i) => {
+    var f;
+    if (!I.isValidElement(i)) return i;
+    const u = i.type.displayName;
     if (u === "Command.Empty")
       return null;
     if (u === "Command.Item")
-      return (((v = o.props.children) == null ? void 0 : v.toString().toLowerCase()) || "").includes(n.toLowerCase()) ? (l = !0, o) : null;
+      return (((f = i.props.children) == null ? void 0 : f.toString().toLowerCase()) || "").includes(l.toLowerCase()) ? (n = !0, i) : null;
     if (u === "Command.Group") {
-      const m = i(o.props.children);
-      return B.Children.toArray(m).some((p) => B.isValidElement(p) && p.type.displayName === "Command.Item") ? B.cloneElement(o, { ...o.props, children: m }) : null;
+      const p = o(i.props.children);
+      return I.Children.toArray(p).some((g) => I.isValidElement(g) && g.type.displayName === "Command.Item") ? I.cloneElement(i, { ...i.props, children: p }) : null;
     }
-    return o;
-  }).filter(Boolean), d = i(e), c = ["clarity-command-list", t].filter(Boolean).join(" ");
-  return /* @__PURE__ */ _("div", { className: c, ...s, children: [
-    d,
-    !l && /* @__PURE__ */ a(ue, {})
+    return i;
+  }).filter(Boolean), s = o(t), c = ["clarity-command-list", a].filter(Boolean).join(" ");
+  return /* @__PURE__ */ w("div", { className: c, ...r, children: [
+    s,
+    !n && /* @__PURE__ */ e(kt, {})
   ] });
 };
-qe.displayName = "Command.List";
-const ue = ({ children: e, className: t = "", ...s }) => {
-  const { texts: n } = ee(), l = ["clarity-command-empty", t].filter(Boolean).join(" ");
-  return /* @__PURE__ */ a("div", { className: l, ...s, children: e || s.emptyText || n.empty });
+de.displayName = "Command.List";
+const kt = ({ children: t, className: a = "", ...r }) => {
+  const { texts: l } = yt(), n = ["clarity-command-empty", a].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("div", { className: n, ...r, children: t || r.emptyText || l.empty });
 };
-ue.displayName = "Command.Empty";
-const Je = ({ children: e, className: t = "", ...s }) => {
-  const n = ["clarity-command-group", t].filter(Boolean).join(" ");
-  return /* @__PURE__ */ a("div", { className: n, ...s, children: e });
+kt.displayName = "Command.Empty";
+const me = ({ children: t, className: a = "", ...r }) => {
+  const l = ["clarity-command-group", a].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("div", { className: l, ...r, children: t });
 };
-Je.displayName = "Command.Group";
-const Qe = ({ children: e, className: t = "", ...s }) => {
-  const { setValue: n, variant: l } = ee(), i = ["clarity-command-item", `clarity-command-item--${l}`, t].filter(Boolean).join(" ");
-  return /* @__PURE__ */ a("div", { className: i, onClick: () => n((e == null ? void 0 : e.toString()) || ""), ...s, children: e });
+me.displayName = "Command.Group";
+const ue = ({ children: t, className: a = "", ...r }) => {
+  const { setValue: l, variant: n } = yt(), o = ["clarity-command-item", `clarity-command-item--${n}`, a].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("div", { className: o, onClick: () => l((t == null ? void 0 : t.toString()) || ""), ...r, children: t });
 };
-Qe.displayName = "Command.Item";
-const Xe = ({ className: e = "", ...t }) => {
-  const s = ["clarity-command-separator", e].filter(Boolean).join(" ");
-  return /* @__PURE__ */ a("hr", { className: s, ...t });
+ue.displayName = "Command.Item";
+const fe = ({ className: t = "", ...a }) => {
+  const r = ["clarity-command-separator", t].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("hr", { className: r, ...a });
 };
-Xe.displayName = "Command.Separator";
-const Ye = ({ children: e, className: t = "", ...s }) => {
-  const n = ["clarity-command-shortcut", t].filter(Boolean).join(" ");
-  return /* @__PURE__ */ a("span", { className: n, ...s, children: e });
+fe.displayName = "Command.Separator";
+const pe = ({ children: t, className: a = "", ...r }) => {
+  const l = ["clarity-command-shortcut", a].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("span", { className: l, ...r, children: t });
 };
-Ye.displayName = "Command.Shortcut";
-const Rt = Object.assign(Fe, {
-  Button: Ge,
-  Dialog: ze,
-  Input: Ue,
-  List: qe,
-  Empty: ue,
-  Group: Je,
-  Item: Qe,
-  Separator: Xe,
-  Shortcut: Ye
-}), Nt = ({ columns: e, viewMode: t }) => {
-  const s = Array.from({ length: 5 }, (n, l) => l);
-  return t === "card" ? /* @__PURE__ */ _("div", { className: "card-view-wrapper is-loading", children: [
-    /* @__PURE__ */ a("div", { className: "skeleton card-view-header" }),
-    /* @__PURE__ */ a("div", { className: "card-view-body", children: s.map((n) => /* @__PURE__ */ a("div", { className: "skeleton card-view-row" }, n)) })
-  ] }) : /* @__PURE__ */ a("div", { className: "table-wrapper is-loading", children: /* @__PURE__ */ _("table", { children: [
-    /* @__PURE__ */ a("thead", { children: /* @__PURE__ */ a("tr", { className: "table-row", children: e.map((n) => /* @__PURE__ */ a("th", { className: "table-header-cell", children: /* @__PURE__ */ a("div", { className: "skeleton skeleton-text" }) }, n.key)) }) }),
-    /* @__PURE__ */ a("tbody", { children: s.map((n) => /* @__PURE__ */ a("tr", { className: "table-row", children: e.map((l) => /* @__PURE__ */ a("td", { className: "table-cell", children: /* @__PURE__ */ a("div", { className: "skeleton skeleton-text" }) }, l.key)) }, n)) })
+pe.displayName = "Command.Shortcut";
+const ia = Object.assign(ie, {
+  Button: se,
+  Dialog: oe,
+  Input: ce,
+  List: de,
+  Empty: kt,
+  Group: me,
+  Item: ue,
+  Separator: fe,
+  Shortcut: pe
+}), Ge = ({ columns: t, viewMode: a }) => {
+  const r = Array.from({ length: 5 }, (l, n) => n);
+  return a === "card" ? /* @__PURE__ */ w("div", { className: "card-view-wrapper is-loading", children: [
+    /* @__PURE__ */ e("div", { className: "skeleton card-view-header" }),
+    /* @__PURE__ */ e("div", { className: "card-view-body", children: r.map((l) => /* @__PURE__ */ e("div", { className: "skeleton card-view-row" }, l)) })
+  ] }) : /* @__PURE__ */ e("div", { className: "table-wrapper is-loading", children: /* @__PURE__ */ w("table", { children: [
+    /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e("tr", { className: "table-row", children: t.map((l) => /* @__PURE__ */ e("th", { className: "table-header-cell", children: /* @__PURE__ */ e("div", { className: "skeleton skeleton-text" }) }, l.key)) }) }),
+    /* @__PURE__ */ e("tbody", { children: r.map((l) => /* @__PURE__ */ e("tr", { className: "table-row", children: t.map((n) => /* @__PURE__ */ e("td", { className: "table-cell", children: /* @__PURE__ */ e("div", { className: "skeleton skeleton-text" }) }, n.key)) }, l)) })
   ] }) });
-}, Dt = ({
-  variant: e = "secondary",
-  columns: t,
-  data: s,
-  viewMode: n = "table",
-  isScrollable: l = !1,
-  isLoading: i = !1
+}, sa = ({
+  variant: t = "secondary",
+  columns: a,
+  data: r,
+  viewMode: l = "table",
+  isScrollable: n = !1,
+  isLoading: o = !1,
+  pagination: s
 }) => {
-  const [d, c] = x(null), [r, o] = x("none"), u = (p) => {
-    p.sortable && (d === p.key ? o((h) => h === "asc" ? "desc" : h === "desc" ? "none" : "asc") : (c(p.key), o("asc")));
-  }, v = Y(() => r === "none" || !d ? s : [...s].sort((p, h) => {
-    const y = p[d], b = h[d];
-    return y < b ? r === "asc" ? -1 : 1 : y > b ? r === "asc" ? 1 : -1 : 0;
-  }), [s, d, r]), m = (p) => p.sortable ? d !== p.key || r === "none" ? /* @__PURE__ */ a("span", { className: "sort-icon", children: "↕" }) : r === "asc" ? /* @__PURE__ */ a("span", { className: "sort-icon", children: "↑" }) : /* @__PURE__ */ a("span", { className: "sort-icon", children: "↓" }) : null;
-  if (i)
-    return /* @__PURE__ */ a(Nt, { columns: t, viewMode: n });
-  const f = `table-variant-${e} ${l ? "is-scrollable" : ""}`;
-  return n === "card" ? /* @__PURE__ */ _("div", { className: `card-view-wrapper ${f}`, children: [
-    /* @__PURE__ */ a("div", { className: `card-view-header table-header-cell-${e}`, children: t.map((p) => /* @__PURE__ */ _(
+  const [c, d] = D(null), [i, u] = D("none"), f = (m) => {
+    m.sortable && (c === m.key ? u((y) => y === "asc" ? "desc" : y === "desc" ? "none" : "asc") : (d(m.key), u("asc")));
+  }, p = vt(() => i === "none" || !c ? r : [...r].sort((m, y) => {
+    const _ = m[c], x = y[c];
+    return _ < x ? i === "asc" ? -1 : 1 : _ > x ? i === "asc" ? 1 : -1 : 0;
+  }), [r, c, i]), h = (m) => m.sortable ? c !== m.key || i === "none" ? /* @__PURE__ */ e("span", { className: "sort-icon", children: "↕" }) : i === "asc" ? /* @__PURE__ */ e("span", { className: "sort-icon", children: "↑" }) : /* @__PURE__ */ e("span", { className: "sort-icon", children: "↓" }) : null;
+  if (o)
+    return /* @__PURE__ */ e(Ge, { columns: a, viewMode: l });
+  const g = `table-variant-${t} ${n ? "is-scrollable" : ""}`, b = () => {
+    if (!s) return null;
+    const {
+      currentPage: m,
+      totalPages: y,
+      onPageChange: _,
+      totalItems: x,
+      itemsPerPage: E,
+      position: C = "right"
+    } = s;
+    if (typeof y != "number" || typeof m != "number")
+      return console.warn("Table Pagination: Invalid pagination props", s), null;
+    if (x <= E)
+      return null;
+    const B = (m - 1) * E + 1, R = Math.min(m * E, x), $ = () => {
+      const k = [];
+      if (y <= 5)
+        for (let H = 1; H <= y; H++) k.push(H);
+      else if (m <= 3) {
+        for (let H = 1; H <= 4; H++) k.push(H);
+        k.push("..."), k.push(y);
+      } else if (m >= y - 2) {
+        k.push(1), k.push("...");
+        for (let H = y - 3; H <= y; H++) k.push(H);
+      } else
+        k.push(1), k.push("..."), k.push(m - 1), k.push(m), k.push(m + 1), k.push("..."), k.push(y);
+      return k;
+    };
+    return /* @__PURE__ */ w("div", { className: `table-pagination align-${C}`, children: [
+      /* @__PURE__ */ w("div", { className: "pagination-info", children: [
+        "Exibindo ",
+        B,
+        " a ",
+        R,
+        " de ",
+        x,
+        " resultados"
+      ] }),
+      /* @__PURE__ */ w("div", { className: "pagination-controls", children: [
+        /* @__PURE__ */ e(
+          "button",
+          {
+            className: "pagination-button",
+            onClick: () => _(1),
+            disabled: m === 1,
+            "aria-label": "Primeira página",
+            children: "«"
+          }
+        ),
+        /* @__PURE__ */ e(
+          "button",
+          {
+            className: "pagination-button",
+            onClick: () => _(m - 1),
+            disabled: m === 1,
+            "aria-label": "Página anterior",
+            children: "‹"
+          }
+        ),
+        $().map((k, A) => /* @__PURE__ */ e(
+          "button",
+          {
+            className: `pagination-button ${k === m ? "active" : ""}`,
+            onClick: () => typeof k == "number" && _(k),
+            disabled: typeof k != "number",
+            children: k
+          },
+          A
+        )),
+        /* @__PURE__ */ e(
+          "button",
+          {
+            className: "pagination-button",
+            onClick: () => _(m + 1),
+            disabled: m === y,
+            "aria-label": "Próxima página",
+            children: "›"
+          }
+        ),
+        /* @__PURE__ */ e(
+          "button",
+          {
+            className: "pagination-button",
+            onClick: () => _(y),
+            disabled: m === y,
+            "aria-label": "Última página",
+            children: "»"
+          }
+        )
+      ] })
+    ] });
+  }, N = /* @__PURE__ */ w("div", { className: `table-wrapper ${g}`, children: [
+    /* @__PURE__ */ w("table", { children: [
+      /* @__PURE__ */ e("thead", { className: "table-header", children: /* @__PURE__ */ e("tr", { className: "table-row", children: a.map((m) => /* @__PURE__ */ w(
+        "th",
+        {
+          className: `table-header-cell ${m.sortable ? "sortable" : ""} table-header-cell-${t}`,
+          onClick: () => f(m),
+          style: { minWidth: m.minWidth },
+          children: [
+            m.header,
+            h(m)
+          ]
+        },
+        m.key
+      )) }) }),
+      /* @__PURE__ */ e("tbody", { children: p.length === 0 ? /* @__PURE__ */ e("tr", { className: "table-row", children: /* @__PURE__ */ e("td", { colSpan: a.length, className: "table-cell", style: { textAlign: "center", padding: "2rem" }, children: "Nenhum resultado encontrado" }) }) : p.map((m, y) => /* @__PURE__ */ e("tr", { className: `table-row table-row-${t}`, children: a.map((_) => /* @__PURE__ */ e("td", { className: `table-cell ${_.align ? `table-cell-align-${_.align}` : ""}`, style: { minWidth: _.minWidth }, children: _.render ? _.render(m) : m[_.key] }, _.key)) }, y)) })
+    ] }),
+    b()
+  ] });
+  return l === "card" ? /* @__PURE__ */ w("div", { className: `card-view-wrapper ${g}`, children: [
+    /* @__PURE__ */ e("div", { className: `card-view-header table-header-cell-${t}`, children: a.map((m) => /* @__PURE__ */ w(
       "div",
       {
-        className: `card-view-header-cell ${p.sortable ? "sortable" : ""}`,
-        onClick: () => u(p),
-        style: { minWidth: p.minWidth },
+        className: `card-view-header-cell ${m.sortable ? "sortable" : ""}`,
+        onClick: () => f(m),
+        style: { minWidth: m.minWidth },
         children: [
-          p.header,
-          m(p)
+          m.header,
+          h(m)
         ]
       },
-      p.key
+      m.key
     )) }),
-    /* @__PURE__ */ a("div", { className: "card-view-body", children: v.map((p, h) => /* @__PURE__ */ a("div", { className: `card-view-row table-row-${e}`, children: t.map((y) => /* @__PURE__ */ a("div", { className: `card-view-cell ${y.align ? `table-cell-align-${y.align}` : ""}`, style: { minWidth: y.minWidth }, children: y.render ? y.render(p) : p[y.key] }, y.key)) }, h)) })
-  ] }) : /* @__PURE__ */ a("div", { className: `table-wrapper ${f}`, children: /* @__PURE__ */ _("table", { children: [
-    /* @__PURE__ */ a("thead", { className: "table-header", children: /* @__PURE__ */ a("tr", { className: "table-row", children: t.map((p) => /* @__PURE__ */ _(
-      "th",
-      {
-        className: `table-header-cell ${p.sortable ? "sortable" : ""} table-header-cell-${e}`,
-        onClick: () => u(p),
-        style: { minWidth: p.minWidth },
-        children: [
-          p.header,
-          m(p)
-        ]
-      },
-      p.key
-    )) }) }),
-    /* @__PURE__ */ a("tbody", { children: v.map((p, h) => /* @__PURE__ */ a("tr", { className: `table-row table-row-${e}`, children: t.map((y) => /* @__PURE__ */ a("td", { className: `table-cell ${y.align ? `table-cell-align-${y.align}` : ""}`, style: { minWidth: y.minWidth }, children: y.render ? y.render(p) : p[y.key] }, y.key)) }, h)) })
-  ] }) });
-}, At = ({
-  variant: e = "primary",
-  product: t,
-  tone: s,
-  size: n = "medium",
-  color: l,
-  className: i = "",
-  "aria-label": d = "Carregando...",
-  ...c
+    /* @__PURE__ */ e("div", { className: "card-view-body", children: p.length === 0 ? /* @__PURE__ */ e("div", { className: `card-view-row table-row-${t}`, style: { justifyContent: "center", padding: "2rem" }, children: "Nenhum resultado encontrado" }) : p.map((m, y) => /* @__PURE__ */ e("div", { className: `card-view-row table-row-${t}`, children: a.map((_) => /* @__PURE__ */ e("div", { className: `card-view-cell ${_.align ? `table-cell-align-${_.align}` : ""}`, style: { minWidth: _.minWidth }, children: _.render ? _.render(m) : m[_.key] }, _.key)) }, y)) }),
+    b()
+  ] }) : N;
+}, oa = ({
+  variant: t = "primary",
+  size: a = "medium",
+  color: r,
+  className: l = "",
+  "aria-label": n = "Carregando...",
+  ...o
 }) => {
-  const r = "clarity-spinner", v = l ? `${r}--custom` : t && s ? `${r}--custom` : `${r}--${e}`, m = [
-    r,
-    `${r}--${n}`,
-    v,
-    i
-  ].filter(Boolean).join(" "), f = {};
-  return l ? f["--spinner-color"] = l : t && s && (f["--spinner-color"] = `var(--clarity-${t}-${s})`), /* @__PURE__ */ a(
+  const s = "clarity-spinner", d = r ? `${s}--custom` : `${s}--${t}`, i = [
+    s,
+    `${s}--${a}`,
+    d,
+    l
+  ].filter(Boolean).join(" "), u = {};
+  return r && (u["--spinner-color"] = r), /* @__PURE__ */ e(
     "div",
     {
-      className: m,
-      style: f,
+      className: i,
+      style: u,
       role: "status",
-      "aria-label": d,
-      ...c,
-      children: /* @__PURE__ */ a("div", { className: `${r}__container`, children: /* @__PURE__ */ a(
+      "aria-label": n,
+      ...o,
+      children: /* @__PURE__ */ e("div", { className: `${s}__container`, children: /* @__PURE__ */ e(
         "svg",
         {
-          className: `${r}__svg`,
+          className: `${s}__svg`,
           viewBox: "0 0 50 50",
           xmlns: "http://www.w3.org/2000/svg",
-          children: /* @__PURE__ */ a(
+          children: /* @__PURE__ */ e(
             "circle",
             {
-              className: `${r}__circle`,
+              className: `${s}__circle`,
               cx: "25",
               cy: "25",
               r: "20",
@@ -1835,54 +2412,68 @@ const Rt = Object.assign(Fe, {
       ) })
     }
   );
-}, bt = ({
-  className: e = "",
-  noGutters: t,
-  justify: s,
-  align: n,
-  children: l,
-  as: i = "div",
-  ...d
+}, Ue = ({
+  className: t = "",
+  noGutters: a,
+  justify: r,
+  align: l,
+  children: n,
+  as: o = "div",
+  ...s
 }) => {
   const c = [
     "clarity-row",
-    t ? "clarity-row--no-gutters" : "",
-    s ? `clarity-row--justify-${s}` : "",
-    n ? `clarity-row--align-${n}` : "",
-    e
+    a ? "clarity-row--no-gutters" : "",
+    r ? `clarity-row--justify-${r}` : "",
+    l ? `clarity-row--align-${l}` : "",
+    t
   ].filter(Boolean).join(" ");
-  return B.createElement(i, { className: c, ...d }, l);
+  return I.createElement(o, { className: c, ...s }, n);
 };
-bt.displayName = "Row";
-const Ct = (e) => `${e / 12 * 100}%`, _t = (e) => `${e / 12 * 100}%`, wt = ({
-  className: e = "",
-  xs: t,
-  sm: s,
-  md: n,
-  lg: l,
-  xl: i,
-  xxl: d,
+Ue.displayName = "Row";
+const Xe = (t) => `${t / 12 * 100}%`, Ye = (t) => `${t / 12 * 100}%`, Ze = ({
+  className: t = "",
+  xs: a,
+  sm: r,
+  md: l,
+  lg: n,
+  xl: o,
+  xxl: s,
   offset: c,
-  children: r,
-  as: o = "div",
+  children: d,
+  as: i = "div",
   style: u,
-  ...v
+  ...f
 }) => {
-  const m = { ...u }, f = (y, b) => {
-    if (b === void 0) return;
-    const C = `--clarity-col-width-${y}`;
-    m[C] = typeof b == "number" ? Ct(b) : "auto";
-  }, p = (y, b) => {
-    if (b === void 0) return;
-    const C = `--clarity-col-offset-${y}`;
-    m[C] = _t(b);
+  const p = { ...u }, h = (N, m) => {
+    if (m === void 0) return;
+    const y = `--clarity-col-width-${N}`;
+    p[y] = typeof m == "number" ? Xe(m) : "auto";
+  }, g = (N, m) => {
+    if (m === void 0) return;
+    const y = `--clarity-col-offset-${N}`;
+    p[y] = Ye(m);
   };
-  f("xs", t), f("sm", s), f("md", n), f("lg", l), f("xl", i), f("xxl", d), p("xs", c == null ? void 0 : c.xs), p("sm", c == null ? void 0 : c.sm), p("md", c == null ? void 0 : c.md), p("lg", c == null ? void 0 : c.lg), p("xl", c == null ? void 0 : c.xl), p("xxl", c == null ? void 0 : c.xxl);
-  const h = ["clarity-col", e].filter(Boolean).join(" ");
-  return B.createElement(o, { className: h, style: m, ...v }, r);
+  h("xs", a), h("sm", r), h("md", l), h("lg", n), h("xl", o), h("xxl", s), g("xs", c == null ? void 0 : c.xs), g("sm", c == null ? void 0 : c.sm), g("md", c == null ? void 0 : c.md), g("lg", c == null ? void 0 : c.lg), g("xl", c == null ? void 0 : c.xl), g("xxl", c == null ? void 0 : c.xxl);
+  const b = ["clarity-col", t].filter(Boolean).join(" ");
+  return I.createElement(i, { className: b, style: p, ...f }, d);
+};
+Ze.displayName = "Col";
+const he = ({ children: t, className: a, ...r }) => /* @__PURE__ */ e("div", { className: `clarity-card__header ${a || ""}`, ...r, children: t });
+he.displayName = "Card.Header";
+const ye = ({ children: t, className: a, ...r }) => /* @__PURE__ */ e("div", { className: `clarity-card__content ${a || ""}`, ...r, children: t });
+ye.displayName = "Card.Content";
+const ge = ({ children: t, className: a, align: r = "left", ...l }) => {
+  const n = r ? `clarity-card__footer--align-${r}` : "";
+  return /* @__PURE__ */ e("div", { className: `clarity-card__footer ${n} ${a || ""}`, ...l, children: t });
 };
-wt.displayName = "Col";
-const Pt = {
+ge.displayName = "Card.Footer";
+const Nt = ({ children: t, className: a, ...r }) => /* @__PURE__ */ e("div", { className: `clarity-card ${a || ""}`, ...r, children: t });
+Nt.Header = he;
+Nt.Content = ye;
+Nt.Footer = ge;
+Nt.displayName = "Card";
+const ca = {
   primary: {
     50: "#f0f9ff",
     100: "#e0f2fe",
@@ -1931,7 +2522,7 @@ const Pt = {
     800: "#065f46",
     900: "#064e3b"
   }
-}, Vt = {
+}, da = {
   xs: "4px",
   sm: "8px",
   md: "16px",
@@ -1939,56 +2530,38 @@ const Pt = {
   xl: "32px",
   "2xl": "48px",
   "3xl": "64px"
-}, Mt = {
-  fontFamily: {
-    sans: ["Inter", "system-ui", "sans-serif"],
-    mono: ["Fira Code", "monospace"]
-  },
-  fontSize: {
-    xs: "12px",
-    sm: "14px",
-    base: "16px",
-    lg: "18px",
-    xl: "20px",
-    "2xl": "24px",
-    "3xl": "30px"
-  },
-  fontWeight: {
-    normal: 400,
-    medium: 500,
-    semibold: 600,
-    bold: 700
-  }
-}, Ht = (...e) => e.filter(Boolean).join(" "), Wt = () => Math.random().toString(36).substr(2, 9);
+}, ma = (...t) => t.filter(Boolean).join(" "), ua = () => Math.random().toString(36).substr(2, 9);
 export {
-  Ot as Accordion,
-  xt as Badge,
-  Tt as Button,
-  Bt as ButtonGroup,
-  Lt as ButtonIcon,
-  St as ButtonLink,
-  rt as CheckInput,
-  wt as Col,
-  Rt as Command,
-  Q as ConfirmationDialog,
-  ae as Dropdown,
-  st as Input,
-  ct as InputSwitch,
-  J as Modal,
-  lt as MultiSelect,
-  K as Offcanvas,
-  bt as Row,
-  nt as Select,
-  At as Spinner,
-  Dt as Table,
-  me as Tabs,
-  at as Textarea,
-  Et as ToastProvider,
-  It as Tooltip,
-  Ht as cn,
-  Pt as colors,
-  Wt as generateId,
-  Vt as spacing,
-  Mt as typography,
-  jt as useToast
+  na as Accordion,
+  Ke as Badge,
+  Ce as Box,
+  Pe as Button,
+  ta as ButtonGroup,
+  ra as ButtonIcon,
+  la as ButtonLink,
+  Nt as Card,
+  Re as CheckInput,
+  Ze as Col,
+  ia as Command,
+  ut as ConfirmationDialog,
+  bt as Dropdown,
+  Te as Input,
+  Oe as InputSwitch,
+  mt as Modal,
+  Ee as MultiSelect,
+  ht as Offcanvas,
+  Ue as Row,
+  Le as Select,
+  oa as Spinner,
+  sa as Table,
+  le as Tabs,
+  je as Textarea,
+  aa as ToastProvider,
+  pt as Tooltip,
+  ma as cn,
+  ca as colors,
+  ua as generateId,
+  da as spacing,
+  Bt as typography,
+  ea as useToast
 };