@sigep/react 1.1.0 → 1.1.2

package/dist/index.mjs

@@ -1,8 +1,51 @@
-// src/components/Button/index.tsx
+// src/components/Avatar/index.tsx
 import { forwardRef } from "react";
 import { tv } from "tailwind-variants";
 import { jsx } from "react/jsx-runtime";
-var button = tv({
+var avatar = tv({
+  base: "inline-flex items-center justify-center rounded-full font-medium select-none overflow-hidden",
+  variants: {
+    size: {
+      sm: "h-8 w-8 text-xs",
+      md: "h-10 w-10 text-sm",
+      lg: "h-12 w-12 text-base",
+      xl: "h-16 w-16 text-lg"
+    },
+    variant: {
+      primary: "bg-blue-600 text-white",
+      secondary: "bg-gray-200 text-gray-700",
+      outline: "bg-white text-blue-600 ring-2 ring-blue-600 ring-offset-2"
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    variant: "primary"
+  }
+});
+function getInitials(name) {
+  const parts = name.trim().split(/\s+/);
+  if (parts.length === 1) return parts[0].charAt(0).toUpperCase();
+  return (parts[0].charAt(0) + parts[parts.length - 1].charAt(0)).toUpperCase();
+}
+var Avatar = forwardRef(
+  ({ name, src, alt, size, variant, className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx("div", { ref, className: avatar({ size, variant, className }), ...props, children: src ? /* @__PURE__ */ jsx(
+      "img",
+      {
+        src,
+        alt: alt || name || "avatar",
+        className: "h-full w-full object-cover"
+      }
+    ) : /* @__PURE__ */ jsx("span", { children: name ? getInitials(name) : "?" }) });
+  }
+);
+Avatar.displayName = "Avatar";
+
+// src/components/Button/index.tsx
+import { forwardRef as forwardRef2 } from "react";
+import { tv as tv2 } from "tailwind-variants";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var button = tv2({
   base: "inline-flex items-center justify-center gap-2 rounded-md font-medium transition-colors focus-visible:outline-2 focus-visible:outline-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
   variants: {
     variant: {
@@ -22,9 +65,9 @@ var button = tv({
     size: "md"
   }
 });
-var Button = forwardRef(
+var Button = forwardRef2(
   ({ variant, size, className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx2(
       "button",
       {
         ref,
@@ -36,20 +79,326 @@ var Button = forwardRef(
 );
 Button.displayName = "Button";
 
+// src/components/Card/index.tsx
+import { forwardRef as forwardRef3 } from "react";
+import { tv as tv3 } from "tailwind-variants";
+import { jsx as jsx3, jsxs } from "react/jsx-runtime";
+var card = tv3({
+  base: "rounded-lg bg-white text-gray-900 overflow-hidden",
+  variants: {
+    variant: {
+      elevated: "shadow-md",
+      outlined: "border border-gray-200",
+      filled: "bg-gray-50"
+    },
+    padding: {
+      none: "",
+      sm: "p-3",
+      md: "p-5",
+      lg: "p-8"
+    }
+  },
+  defaultVariants: {
+    variant: "elevated",
+    padding: "md"
+  }
+});
+var Card = forwardRef3(
+  ({ variant, padding, header, footer, className, children, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs("div", { ref, className: card({ variant, padding: header || footer ? "none" : padding, className }), ...props, children: [
+      header && /* @__PURE__ */ jsx3("div", { className: "border-b border-gray-200 px-5 py-3 font-semibold text-sm", children: header }),
+      header || footer ? /* @__PURE__ */ jsx3("div", { className: card({ padding, className: "rounded-none shadow-none border-none bg-transparent" }), children }) : children,
+      footer && /* @__PURE__ */ jsx3("div", { className: "border-t border-gray-200 px-5 py-3 text-sm", children: footer })
+    ] });
+  }
+);
+Card.displayName = "Card";
+
+// src/components/Modal/index.tsx
+import { forwardRef as forwardRef4, useEffect, useCallback } from "react";
+import { tv as tv4 } from "tailwind-variants";
+import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
+var overlay = tv4({
+  base: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 transition-opacity"
+});
+var modal = tv4({
+  base: "relative flex flex-col rounded-lg bg-white text-gray-900 shadow-xl overflow-hidden",
+  variants: {
+    size: {
+      sm: "w-[30vw] max-h-[40vh]",
+      md: "w-[50vw] max-h-[60vh]",
+      lg: "w-[70vw] max-h-[80vh]",
+      full: "w-[95vw] max-h-[90vh]"
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var Modal = forwardRef4(
+  ({ isOpen, onClose, title, footer, size, className, children, ...props }, ref) => {
+    const handleKeyDown = useCallback(
+      (e) => {
+        if (e.key === "Escape") onClose();
+      },
+      [onClose]
+    );
+    useEffect(() => {
+      if (!isOpen) return;
+      document.addEventListener("keydown", handleKeyDown);
+      document.body.style.overflow = "hidden";
+      return () => {
+        document.removeEventListener("keydown", handleKeyDown);
+        document.body.style.overflow = "";
+      };
+    }, [isOpen, handleKeyDown]);
+    if (!isOpen) return null;
+    return /* @__PURE__ */ jsx4("div", { className: overlay(), onClick: onClose, children: /* @__PURE__ */ jsxs2(
+      "div",
+      {
+        ref,
+        className: modal({ size, className }),
+        onClick: (e) => e.stopPropagation(),
+        role: "dialog",
+        "aria-modal": "true",
+        ...props,
+        children: [
+          title && /* @__PURE__ */ jsxs2("div", { className: "flex items-center justify-between border-b border-gray-200 bg-gray-50 px-5 py-3", children: [
+            /* @__PURE__ */ jsx4("span", { className: "text-sm font-semibold text-gray-900", children: title }),
+            /* @__PURE__ */ jsx4(
+              "button",
+              {
+                type: "button",
+                className: "inline-flex h-7 w-7 items-center justify-center rounded-md text-gray-500 hover:bg-gray-200 hover:text-gray-700 transition-colors",
+                onClick: onClose,
+                "aria-label": "Fechar",
+                children: "\u2715"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx4("div", { className: "flex-1 overflow-y-auto p-5", children }),
+          footer && /* @__PURE__ */ jsx4("div", { className: "flex items-center justify-end gap-2 border-t border-gray-200 px-5 py-3", children: footer })
+        ]
+      }
+    ) });
+  }
+);
+Modal.displayName = "Modal";
+
+// src/components/Tooltip/index.tsx
+import {
+  forwardRef as forwardRef5,
+  useCallback as useCallback2,
+  useEffect as useEffect2,
+  useLayoutEffect,
+  useRef,
+  useState
+} from "react";
+import { createPortal } from "react-dom";
+import { tv as tv5 } from "tailwind-variants";
+import { Fragment, jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+var tooltip = tv5({
+  base: "fixed z-[999999] pointer-events-none",
+  variants: {
+    variant: {
+      dark: "",
+      light: ""
+    }
+  },
+  defaultVariants: {
+    variant: "dark"
+  }
+});
+var tooltipContent = tv5({
+  base: "inline-flex items-center justify-center rounded px-2.5 py-1 text-xs font-medium whitespace-nowrap",
+  variants: {
+    variant: {
+      dark: "bg-gray-900 text-white",
+      light: "bg-white text-gray-900 shadow-md border border-gray-200"
+    }
+  },
+  defaultVariants: {
+    variant: "dark"
+  }
+});
+var tooltipArrow = tv5({
+  base: "absolute h-1.5 w-1.5 rotate-45",
+  variants: {
+    variant: {
+      dark: "bg-gray-900",
+      light: "bg-white border border-gray-200"
+    }
+  },
+  defaultVariants: {
+    variant: "dark"
+  }
+});
+var arrowPlacementStyles = {
+  top: "bottom-[-3px] left-1/2 -translate-x-1/2",
+  bottom: "top-[-3px] left-1/2 -translate-x-1/2",
+  left: "right-[-3px] top-1/2 -translate-y-1/2",
+  right: "left-[-3px] top-1/2 -translate-y-1/2"
+};
+var Tooltip = forwardRef5(
+  ({
+    content,
+    placement = "top",
+    offset: offsetPx = 8,
+    variant,
+    disabled,
+    delayShow = 100,
+    delayHide = 100,
+    children,
+    className,
+    ...props
+  }, ref) => {
+    const wrapperRef = useRef(null);
+    const tipRef = useRef(null);
+    const [visible, setVisible] = useState(false);
+    const [coords, setCoords] = useState(null);
+    const [activePlacement, setActivePlacement] = useState(placement);
+    const showTimer = useRef(null);
+    const hideTimer = useRef(null);
+    function clearTimers() {
+      if (showTimer.current !== null) window.clearTimeout(showTimer.current);
+      if (hideTimer.current !== null) window.clearTimeout(hideTimer.current);
+      showTimer.current = null;
+      hideTimer.current = null;
+    }
+    function scheduleShow() {
+      if (disabled) return;
+      clearTimers();
+      showTimer.current = window.setTimeout(() => setVisible(true), delayShow);
+    }
+    function scheduleHide() {
+      clearTimers();
+      hideTimer.current = window.setTimeout(() => setVisible(false), delayHide);
+    }
+    const computePosition = useCallback2(() => {
+      const anchor = wrapperRef.current;
+      const tip = tipRef.current;
+      if (!anchor || !tip) return;
+      const rect = anchor.getBoundingClientRect();
+      const tipW = tip.offsetWidth;
+      const tipH = tip.offsetHeight;
+      const vw = window.innerWidth;
+      const vh = window.innerHeight;
+      const calc = (p2) => {
+        switch (p2) {
+          case "top":
+            return { top: rect.top - tipH - offsetPx, left: rect.left + rect.width / 2 - tipW / 2 };
+          case "bottom":
+            return { top: rect.bottom + offsetPx, left: rect.left + rect.width / 2 - tipW / 2 };
+          case "left":
+            return { top: rect.top + rect.height / 2 - tipH / 2, left: rect.left - tipW - offsetPx };
+          case "right":
+            return { top: rect.top + rect.height / 2 - tipH / 2, left: rect.right + offsetPx };
+        }
+      };
+      let pos = calc(placement);
+      let p = placement;
+      const fits = (c) => c.top >= 0 && c.left >= 0 && c.top + tipH <= vh && c.left + tipW <= vw;
+      if (!fits(pos)) {
+        const fallbacks = {
+          top: ["bottom", "right", "left"],
+          bottom: ["top", "right", "left"],
+          left: ["right", "top", "bottom"],
+          right: ["left", "top", "bottom"]
+        };
+        for (const candidate of fallbacks[placement]) {
+          const c = calc(candidate);
+          if (fits(c)) {
+            pos = c;
+            p = candidate;
+            break;
+          }
+        }
+      }
+      pos.top = Math.max(4, Math.min(vh - tipH - 4, pos.top));
+      pos.left = Math.max(4, Math.min(vw - tipW - 4, pos.left));
+      setActivePlacement(p);
+      setCoords(pos);
+    }, [placement, offsetPx]);
+    useLayoutEffect(() => {
+      if (!visible) return;
+      let raf1 = 0;
+      let raf2 = 0;
+      raf1 = requestAnimationFrame(() => {
+        raf2 = requestAnimationFrame(computePosition);
+      });
+      return () => {
+        cancelAnimationFrame(raf1);
+        cancelAnimationFrame(raf2);
+      };
+    }, [visible, computePosition]);
+    useEffect2(() => {
+      if (!visible) return;
+      const handler = () => computePosition();
+      window.addEventListener("scroll", handler, true);
+      window.addEventListener("resize", handler);
+      return () => {
+        window.removeEventListener("scroll", handler, true);
+        window.removeEventListener("resize", handler);
+      };
+    }, [visible, computePosition]);
+    return /* @__PURE__ */ jsxs3(Fragment, { children: [
+      /* @__PURE__ */ jsx5(
+        "span",
+        {
+          ref: (el) => {
+            wrapperRef.current = el;
+            if (typeof ref === "function") ref(el);
+            else if (ref) ref.current = el;
+          },
+          onMouseEnter: scheduleShow,
+          onMouseLeave: scheduleHide,
+          onFocus: scheduleShow,
+          onBlur: scheduleHide,
+          style: { display: "contents" },
+          className,
+          ...props,
+          children
+        }
+      ),
+      visible && createPortal(
+        /* @__PURE__ */ jsxs3(
+          "div",
+          {
+            ref: tipRef,
+            role: "tooltip",
+            className: tooltip({ variant }),
+            style: {
+              top: coords?.top ?? -99999,
+              left: coords?.left ?? -99999,
+              visibility: coords ? "visible" : "hidden"
+            },
+            children: [
+              /* @__PURE__ */ jsx5("div", { className: tooltipContent({ variant }), children: content }),
+              /* @__PURE__ */ jsx5("div", { className: `${tooltipArrow({ variant })} ${arrowPlacementStyles[activePlacement]}` })
+            ]
+          }
+        ),
+        document.body
+      )
+    ] });
+  }
+);
+Tooltip.displayName = "Tooltip";
+
 // src/components/Input/InputString.tsx
-import { forwardRef as forwardRef3, useState } from "react";
+import { forwardRef as forwardRef7, useState as useState2 } from "react";
 
 // src/components/Input/InputWrapper.tsx
-import { forwardRef as forwardRef2 } from "react";
-import { tv as tv2 } from "tailwind-variants";
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
-var wrapper = tv2({
+import { forwardRef as forwardRef6 } from "react";
+import { tv as tv6 } from "tailwind-variants";
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+var wrapper = tv6({
   base: "flex w-full flex-col gap-1"
 });
-var labelStyle = tv2({
+var labelStyle = tv6({
   base: "text-xs text-gray-700 flex items-start gap-0.5"
 });
-var containerStyle = tv2({
+var containerStyle = tv6({
   base: "flex items-center w-full rounded-md border bg-white transition-colors",
   variants: {
     size: {
@@ -70,26 +419,26 @@ var containerStyle = tv2({
     error: false
   }
 });
-var errorStyle = tv2({
+var errorStyle = tv6({
   base: "text-xs text-red-500 mt-0.5"
 });
-var InputWrapper = forwardRef2(
+var InputWrapper = forwardRef6(
   ({ label, error, errorMessage, required, disabled, size, children, className, classContainer, htmlFor }, ref) => {
-    return /* @__PURE__ */ jsxs("div", { ref, className: wrapper({ className }), children: [
-      label && /* @__PURE__ */ jsxs("label", { htmlFor, className: labelStyle(), children: [
-        /* @__PURE__ */ jsx2("span", { children: label }),
-        required && /* @__PURE__ */ jsx2("span", { className: "text-red-500 text-[10px] leading-none mt-0.5", children: "*" })
+    return /* @__PURE__ */ jsxs4("div", { ref, className: wrapper({ className }), children: [
+      label && /* @__PURE__ */ jsxs4("label", { htmlFor, className: labelStyle(), children: [
+        /* @__PURE__ */ jsx6("span", { children: label }),
+        required && /* @__PURE__ */ jsx6("span", { className: "text-red-500 text-[10px] leading-none mt-0.5", children: "*" })
       ] }),
-      /* @__PURE__ */ jsx2("div", { className: containerStyle({ size, error: !!error, disabled: !!disabled, className: classContainer }), children }),
-      error && errorMessage && /* @__PURE__ */ jsx2("span", { className: errorStyle(), children: errorMessage })
+      /* @__PURE__ */ jsx6("div", { className: containerStyle({ size, error: !!error, disabled: !!disabled, className: classContainer }), children }),
+      error && errorMessage && /* @__PURE__ */ jsx6("span", { className: errorStyle(), children: errorMessage })
     ] });
   }
 );
 InputWrapper.displayName = "InputWrapper";
 
 // src/components/Input/InputString.tsx
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-var InputString = forwardRef3(
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+var InputString = forwardRef7(
   ({
     label,
     error,
@@ -107,14 +456,14 @@ var InputString = forwardRef3(
     name,
     ...props
   }, ref) => {
-    const [hovered, setHovered] = useState(false);
-    return /* @__PURE__ */ jsx3(
+    const [hovered, setHovered] = useState2(false);
+    return /* @__PURE__ */ jsx7(
       "div",
       {
         onMouseEnter: () => setHovered(true),
         onMouseLeave: () => setHovered(false),
         className: "w-full",
-        children: /* @__PURE__ */ jsxs2(
+        children: /* @__PURE__ */ jsxs5(
           InputWrapper,
           {
             label,
@@ -126,8 +475,8 @@ var InputString = forwardRef3(
             classContainer,
             htmlFor: name,
             children: [
-              leftIcon && /* @__PURE__ */ jsx3("span", { className: "pl-2.5 text-gray-400", children: leftIcon }),
-              /* @__PURE__ */ jsx3(
+              leftIcon && /* @__PURE__ */ jsx7("span", { className: "pl-2.5 text-gray-400", children: leftIcon }),
+              /* @__PURE__ */ jsx7(
                 "input",
                 {
                   ref,
@@ -142,7 +491,7 @@ var InputString = forwardRef3(
                   ...props
                 }
               ),
-              showClearButton && hovered && value && !disabled && !required && /* @__PURE__ */ jsx3(
+              showClearButton && hovered && value && !disabled && !required && /* @__PURE__ */ jsx7(
                 "button",
                 {
                   type: "button",
@@ -151,7 +500,7 @@ var InputString = forwardRef3(
                   className: "px-2 text-gray-400 hover:text-gray-600",
                   onMouseDown: (e) => e.preventDefault(),
                   onClick: () => onChange?.(""),
-                  children: /* @__PURE__ */ jsxs2(
+                  children: /* @__PURE__ */ jsxs5(
                     "svg",
                     {
                       width: "14",
@@ -163,14 +512,14 @@ var InputString = forwardRef3(
                       strokeLinecap: "round",
                       strokeLinejoin: "round",
                       children: [
-                        /* @__PURE__ */ jsx3("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-                        /* @__PURE__ */ jsx3("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+                        /* @__PURE__ */ jsx7("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+                        /* @__PURE__ */ jsx7("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
                       ]
                     }
                   )
                 }
               ),
-              rightIcon && /* @__PURE__ */ jsx3("span", { className: "pr-2.5 text-gray-400", children: rightIcon })
+              rightIcon && /* @__PURE__ */ jsx7("span", { className: "pr-2.5 text-gray-400", children: rightIcon })
             ]
           }
         )
@@ -181,11 +530,11 @@ var InputString = forwardRef3(
 InputString.displayName = "InputString";
 
 // src/components/Input/InputEmail.tsx
-import { forwardRef as forwardRef4 } from "react";
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-var InputEmail = forwardRef4(
+import { forwardRef as forwardRef8 } from "react";
+import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+var InputEmail = forwardRef8(
   ({ label, error, errorMessage, required, size, leftIcon, rightIcon, classContainer, classInput, value, onChange, disabled, name, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs3(
+    return /* @__PURE__ */ jsxs6(
       InputWrapper,
       {
         label,
@@ -197,8 +546,8 @@ var InputEmail = forwardRef4(
         classContainer,
         htmlFor: name,
         children: [
-          leftIcon && /* @__PURE__ */ jsx4("span", { className: "pl-2.5 text-gray-400", children: leftIcon }),
-          /* @__PURE__ */ jsx4(
+          leftIcon && /* @__PURE__ */ jsx8("span", { className: "pl-2.5 text-gray-400", children: leftIcon }),
+          /* @__PURE__ */ jsx8(
             "input",
             {
               ref,
@@ -214,7 +563,7 @@ var InputEmail = forwardRef4(
               ...props
             }
           ),
-          rightIcon && /* @__PURE__ */ jsx4("span", { className: "pr-2.5 text-gray-400", children: rightIcon })
+          rightIcon && /* @__PURE__ */ jsx8("span", { className: "pr-2.5 text-gray-400", children: rightIcon })
         ]
       }
     );
@@ -223,20 +572,20 @@ var InputEmail = forwardRef4(
 InputEmail.displayName = "InputEmail";
 
 // src/components/Input/InputPassword.tsx
-import { forwardRef as forwardRef5, useState as useState2 } from "react";
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
-var EyeIcon = () => /* @__PURE__ */ jsxs4("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-  /* @__PURE__ */ jsx5("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }),
-  /* @__PURE__ */ jsx5("circle", { cx: "12", cy: "12", r: "3" })
+import { forwardRef as forwardRef9, useState as useState3 } from "react";
+import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+var EyeIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ jsx9("path", { d: "M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" }),
+  /* @__PURE__ */ jsx9("circle", { cx: "12", cy: "12", r: "3" })
 ] });
-var EyeOffIcon = () => /* @__PURE__ */ jsxs4("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
-  /* @__PURE__ */ jsx5("path", { d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" }),
-  /* @__PURE__ */ jsx5("line", { x1: "1", y1: "1", x2: "23", y2: "23" })
+var EyeOffIcon = () => /* @__PURE__ */ jsxs7("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: [
+  /* @__PURE__ */ jsx9("path", { d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24" }),
+  /* @__PURE__ */ jsx9("line", { x1: "1", y1: "1", x2: "23", y2: "23" })
 ] });
-var InputPassword = forwardRef5(
+var InputPassword = forwardRef9(
   ({ label, error, errorMessage, required, size, classContainer, classInput, value, onChange, disabled, name, ...props }, ref) => {
-    const [visible, setVisible] = useState2(false);
-    return /* @__PURE__ */ jsxs4(
+    const [visible, setVisible] = useState3(false);
+    return /* @__PURE__ */ jsxs7(
       InputWrapper,
       {
         label,
@@ -248,7 +597,7 @@ var InputPassword = forwardRef5(
         classContainer,
         htmlFor: name,
         children: [
-          /* @__PURE__ */ jsx5(
+          /* @__PURE__ */ jsx9(
             "input",
             {
               ref,
@@ -264,7 +613,7 @@ var InputPassword = forwardRef5(
               ...props
             }
           ),
-          /* @__PURE__ */ jsx5(
+          /* @__PURE__ */ jsx9(
             "button",
             {
               type: "button",
@@ -272,7 +621,7 @@ var InputPassword = forwardRef5(
               "aria-label": visible ? "Ocultar senha" : "Mostrar senha",
               className: "px-2.5 text-gray-400 hover:text-gray-600",
               onClick: () => setVisible(!visible),
-              children: visible ? /* @__PURE__ */ jsx5(EyeOffIcon, {}) : /* @__PURE__ */ jsx5(EyeIcon, {})
+              children: visible ? /* @__PURE__ */ jsx9(EyeOffIcon, {}) : /* @__PURE__ */ jsx9(EyeIcon, {})
             }
           )
         ]
@@ -283,10 +632,10 @@ var InputPassword = forwardRef5(
 InputPassword.displayName = "InputPassword";
 
 // src/components/Input/InputNumber.tsx
-import { forwardRef as forwardRef6 } from "react";
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+import { forwardRef as forwardRef10 } from "react";
+import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
 var allowedKeys = ["Backspace", "Delete", "Tab", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End"];
-var InputNumber = forwardRef6(
+var InputNumber = forwardRef10(
   ({ label, error, errorMessage, required, size, leftIcon, rightIcon, classContainer, classInput, value, onChange, disabled, name, min = 0, max, ...props }, ref) => {
     function handleKeyDown(e) {
       if (e.ctrlKey || e.metaKey) return;
@@ -306,7 +655,7 @@ var InputNumber = forwardRef6(
       if (max !== void 0 && num > max) return;
       onChange?.(num);
     }
-    return /* @__PURE__ */ jsxs5(
+    return /* @__PURE__ */ jsxs8(
       InputWrapper,
       {
         label,
@@ -318,8 +667,8 @@ var InputNumber = forwardRef6(
         classContainer,
         htmlFor: name,
         children: [
-          leftIcon && /* @__PURE__ */ jsx6("span", { className: "pl-2.5 text-gray-400", children: leftIcon }),
-          /* @__PURE__ */ jsx6(
+          leftIcon && /* @__PURE__ */ jsx10("span", { className: "pl-2.5 text-gray-400", children: leftIcon }),
+          /* @__PURE__ */ jsx10(
             "input",
             {
               ref,
@@ -336,7 +685,7 @@ var InputNumber = forwardRef6(
               ...props
             }
           ),
-          rightIcon && /* @__PURE__ */ jsx6("span", { className: "pr-2.5 text-gray-400", children: rightIcon })
+          rightIcon && /* @__PURE__ */ jsx10("span", { className: "pr-2.5 text-gray-400", children: rightIcon })
         ]
       }
     );
@@ -345,7 +694,7 @@ var InputNumber = forwardRef6(
 InputNumber.displayName = "InputNumber";
 
 // src/components/Input/InputCPF.tsx
-import { forwardRef as forwardRef7 } from "react";
+import { forwardRef as forwardRef11 } from "react";
 
 // src/components/Input/masks.ts
 function maskCPF(value) {
@@ -379,14 +728,14 @@ function unmaskCurrency(value) {
 }
 
 // src/components/Input/InputCPF.tsx
-import { jsx as jsx7 } from "react/jsx-runtime";
-var InputCPF = forwardRef7(
+import { jsx as jsx11 } from "react/jsx-runtime";
+var InputCPF = forwardRef11(
   ({ label, error, errorMessage, required, size, classContainer, classInput, value, onChange, disabled, name, ...props }, ref) => {
     function handleChange(raw) {
       const digits = unmask(raw);
       onChange?.(digits);
     }
-    return /* @__PURE__ */ jsx7(
+    return /* @__PURE__ */ jsx11(
       InputWrapper,
       {
         label,
@@ -397,7 +746,7 @@ var InputCPF = forwardRef7(
         size,
         classContainer,
         htmlFor: name,
-        children: /* @__PURE__ */ jsx7(
+        children: /* @__PURE__ */ jsx11(
           "input",
           {
             ref,
@@ -422,15 +771,15 @@ var InputCPF = forwardRef7(
 InputCPF.displayName = "InputCPF";
 
 // src/components/Input/InputCNPJ.tsx
-import { forwardRef as forwardRef8 } from "react";
-import { jsx as jsx8 } from "react/jsx-runtime";
-var InputCNPJ = forwardRef8(
+import { forwardRef as forwardRef12 } from "react";
+import { jsx as jsx12 } from "react/jsx-runtime";
+var InputCNPJ = forwardRef12(
   ({ label, error, errorMessage, required, size, classContainer, classInput, value, onChange, disabled, name, ...props }, ref) => {
     function handleChange(raw) {
       const digits = unmask(raw);
       onChange?.(digits);
     }
-    return /* @__PURE__ */ jsx8(
+    return /* @__PURE__ */ jsx12(
       InputWrapper,
       {
         label,
@@ -441,7 +790,7 @@ var InputCNPJ = forwardRef8(
         size,
         classContainer,
         htmlFor: name,
-        children: /* @__PURE__ */ jsx8(
+        children: /* @__PURE__ */ jsx12(
           "input",
           {
             ref,
@@ -466,15 +815,15 @@ var InputCNPJ = forwardRef8(
 InputCNPJ.displayName = "InputCNPJ";
 
 // src/components/Input/InputPhone.tsx
-import { forwardRef as forwardRef9 } from "react";
-import { jsx as jsx9 } from "react/jsx-runtime";
-var InputPhone = forwardRef9(
+import { forwardRef as forwardRef13 } from "react";
+import { jsx as jsx13 } from "react/jsx-runtime";
+var InputPhone = forwardRef13(
   ({ label, error, errorMessage, required, size, classContainer, classInput, value, onChange, disabled, name, ...props }, ref) => {
     function handleChange(raw) {
       const digits = unmask(raw);
       onChange?.(digits);
     }
-    return /* @__PURE__ */ jsx9(
+    return /* @__PURE__ */ jsx13(
       InputWrapper,
       {
         label,
@@ -485,7 +834,7 @@ var InputPhone = forwardRef9(
         size,
         classContainer,
         htmlFor: name,
-        children: /* @__PURE__ */ jsx9(
+        children: /* @__PURE__ */ jsx13(
           "input",
           {
             ref,
@@ -510,8 +859,8 @@ var InputPhone = forwardRef9(
 InputPhone.displayName = "InputPhone";
 
 // src/components/Input/InputCurrency.tsx
-import { forwardRef as forwardRef10 } from "react";
-import { jsx as jsx10 } from "react/jsx-runtime";
+import { forwardRef as forwardRef14 } from "react";
+import { jsx as jsx14 } from "react/jsx-runtime";
 function formatCurrency(value, prefix, decimalScale) {
   const fixed = Math.abs(value).toFixed(decimalScale);
   const [intPart, decPart] = fixed.split(".");
@@ -519,7 +868,7 @@ function formatCurrency(value, prefix, decimalScale) {
   const sign = value < 0 ? "-" : "";
   return `${sign}${prefix}${formatted},${decPart}`;
 }
-var InputCurrency = forwardRef10(
+var InputCurrency = forwardRef14(
   ({ label, error, errorMessage, required, size, classContainer, classInput, value, onChange, disabled, name, prefix = "R$ ", decimalScale = 2, allowNegative = false, ...props }, ref) => {
     function handleChange(e) {
       const raw = e.target.value;
@@ -528,7 +877,7 @@ var InputCurrency = forwardRef10(
       onChange?.(isNaN(num) ? void 0 : num);
     }
     const displayValue = value !== void 0 && value !== null ? formatCurrency(value, prefix, decimalScale) : "";
-    return /* @__PURE__ */ jsx10(
+    return /* @__PURE__ */ jsx14(
       InputWrapper,
       {
         label,
@@ -539,7 +888,7 @@ var InputCurrency = forwardRef10(
         size,
         classContainer,
         htmlFor: name,
-        children: /* @__PURE__ */ jsx10(
+        children: /* @__PURE__ */ jsx14(
           "input",
           {
             ref,
@@ -563,15 +912,15 @@ var InputCurrency = forwardRef10(
 InputCurrency.displayName = "InputCurrency";
 
 // src/components/Input/InputCep.tsx
-import { forwardRef as forwardRef11 } from "react";
-import { jsx as jsx11 } from "react/jsx-runtime";
-var InputCep = forwardRef11(
+import { forwardRef as forwardRef15 } from "react";
+import { jsx as jsx15 } from "react/jsx-runtime";
+var InputCep = forwardRef15(
   ({ label, error, errorMessage, required, size, classContainer, classInput, value, onChange, disabled, name, ...props }, ref) => {
     function handleChange(raw) {
       const digits = unmask(raw);
       onChange?.(digits);
     }
-    return /* @__PURE__ */ jsx11(
+    return /* @__PURE__ */ jsx15(
       InputWrapper,
       {
         label,
@@ -582,7 +931,7 @@ var InputCep = forwardRef11(
         size,
         classContainer,
         htmlFor: name,
-        children: /* @__PURE__ */ jsx11(
+        children: /* @__PURE__ */ jsx15(
           "input",
           {
             ref,
@@ -608,10 +957,10 @@ var InputCep = forwardRef11(
 InputCep.displayName = "InputCep";
 
 // src/components/Input/InputCheckbox.tsx
-import { forwardRef as forwardRef12 } from "react";
-import { tv as tv3 } from "tailwind-variants";
-import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
-var checkboxContainer = tv3({
+import { forwardRef as forwardRef16 } from "react";
+import { tv as tv7 } from "tailwind-variants";
+import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
+var checkboxContainer = tv7({
   base: "inline-flex items-center justify-center w-[18px] h-[18px] rounded border cursor-pointer transition-colors",
   variants: {
     checked: {
@@ -629,15 +978,15 @@ var checkboxContainer = tv3({
     checked: false
   }
 });
-var CheckIcon = () => /* @__PURE__ */ jsx12("svg", { width: "10", height: "10", viewBox: "0 0 24 24", fill: "none", stroke: "white", strokeWidth: "4", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx12("polyline", { points: "20 6 9 17 4 12" }) });
-var IndeterminateIcon = () => /* @__PURE__ */ jsx12("div", { className: "w-2 h-2 rounded-sm bg-gray-300" });
-var InputCheckbox = forwardRef12(
+var CheckIcon = () => /* @__PURE__ */ jsx16("svg", { width: "10", height: "10", viewBox: "0 0 24 24", fill: "none", stroke: "white", strokeWidth: "4", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx16("polyline", { points: "20 6 9 17 4 12" }) });
+var IndeterminateIcon = () => /* @__PURE__ */ jsx16("div", { className: "w-2 h-2 rounded-sm bg-gray-300" });
+var InputCheckbox = forwardRef16(
   ({ label, checked = false, indeterminate = false, onChange, disabled, error, labelPosition = "right", className, name, required }, ref) => {
     function handleClick() {
       if (disabled) return;
       onChange?.(!checked);
     }
-    const box = /* @__PURE__ */ jsxs6(
+    const box = /* @__PURE__ */ jsxs9(
       "button",
       {
         ref,
@@ -650,27 +999,27 @@ var InputCheckbox = forwardRef12(
         onClick: handleClick,
         disabled,
         children: [
-          checked && !indeterminate && /* @__PURE__ */ jsx12(CheckIcon, {}),
-          indeterminate && /* @__PURE__ */ jsx12(IndeterminateIcon, {})
+          checked && !indeterminate && /* @__PURE__ */ jsx16(CheckIcon, {}),
+          indeterminate && /* @__PURE__ */ jsx16(IndeterminateIcon, {})
         ]
       }
     );
-    if (!label) return /* @__PURE__ */ jsx12("div", { className, children: box });
-    return /* @__PURE__ */ jsxs6("div", { className: `flex items-center gap-2 ${className ?? ""}`, children: [
-      labelPosition === "left" && /* @__PURE__ */ jsx12("label", { htmlFor: name, className: "text-sm text-gray-700 cursor-pointer select-none", children: label }),
+    if (!label) return /* @__PURE__ */ jsx16("div", { className, children: box });
+    return /* @__PURE__ */ jsxs9("div", { className: `flex items-center gap-2 ${className ?? ""}`, children: [
+      labelPosition === "left" && /* @__PURE__ */ jsx16("label", { htmlFor: name, className: "text-sm text-gray-700 cursor-pointer select-none", children: label }),
       box,
-      labelPosition === "right" && /* @__PURE__ */ jsx12("label", { htmlFor: name, className: "text-sm text-gray-700 cursor-pointer select-none", children: label }),
-      required && /* @__PURE__ */ jsx12("span", { className: "text-red-500 text-[10px]", children: "*" })
+      labelPosition === "right" && /* @__PURE__ */ jsx16("label", { htmlFor: name, className: "text-sm text-gray-700 cursor-pointer select-none", children: label }),
+      required && /* @__PURE__ */ jsx16("span", { className: "text-red-500 text-[10px]", children: "*" })
     ] });
   }
 );
 InputCheckbox.displayName = "InputCheckbox";
 
 // src/components/Input/InputRadio.tsx
-import { forwardRef as forwardRef13 } from "react";
-import { tv as tv4 } from "tailwind-variants";
-import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
-var radioButton = tv4({
+import { forwardRef as forwardRef17 } from "react";
+import { tv as tv8 } from "tailwind-variants";
+import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
+var radioButton = tv8({
   base: "inline-flex items-center justify-center w-[18px] h-[18px] rounded-full border cursor-pointer transition-colors",
   variants: {
     selected: {
@@ -688,14 +1037,14 @@ var radioButton = tv4({
     selected: false
   }
 });
-var InputRadio = forwardRef13(
+var InputRadio = forwardRef17(
   ({ label, options, value, onChange, disabled, error, required, name, className, direction = "horizontal" }, ref) => {
-    return /* @__PURE__ */ jsxs7("div", { ref, className: `flex w-full flex-col gap-1 ${className ?? ""}`, children: [
-      label && /* @__PURE__ */ jsxs7("span", { className: "text-xs text-gray-700 flex items-start gap-0.5", children: [
-        /* @__PURE__ */ jsx13("span", { children: label }),
-        required && /* @__PURE__ */ jsx13("span", { className: "text-red-500 text-[10px] leading-none mt-0.5", children: "*" })
+    return /* @__PURE__ */ jsxs10("div", { ref, className: `flex w-full flex-col gap-1 ${className ?? ""}`, children: [
+      label && /* @__PURE__ */ jsxs10("span", { className: "text-xs text-gray-700 flex items-start gap-0.5", children: [
+        /* @__PURE__ */ jsx17("span", { children: label }),
+        required && /* @__PURE__ */ jsx17("span", { className: "text-red-500 text-[10px] leading-none mt-0.5", children: "*" })
       ] }),
-      /* @__PURE__ */ jsx13(
+      /* @__PURE__ */ jsx17(
         "div",
         {
           role: "radiogroup",
@@ -704,12 +1053,12 @@ var InputRadio = forwardRef13(
           children: options.map((option) => {
             const isSelected = value === option.value;
             const isDisabled = disabled || option.disabled;
-            return /* @__PURE__ */ jsxs7(
+            return /* @__PURE__ */ jsxs10(
               "label",
               {
                 className: `flex items-center gap-2 cursor-pointer select-none ${isDisabled ? "opacity-50 cursor-not-allowed" : ""}`,
                 children: [
-                  /* @__PURE__ */ jsx13(
+                  /* @__PURE__ */ jsx17(
                     "button",
                     {
                       type: "button",
@@ -718,10 +1067,10 @@ var InputRadio = forwardRef13(
                       className: radioButton({ selected: isSelected, disabled: !!isDisabled, error: !!error }),
                       onClick: () => !isDisabled && onChange?.(option.value),
                       disabled: isDisabled,
-                      children: isSelected && /* @__PURE__ */ jsx13("div", { className: "w-[10px] h-[10px] rounded-full bg-blue-600" })
+                      children: isSelected && /* @__PURE__ */ jsx17("div", { className: "w-[10px] h-[10px] rounded-full bg-blue-600" })
                     }
                   ),
-                  /* @__PURE__ */ jsx13("span", { className: "text-sm text-gray-700", children: option.label })
+                  /* @__PURE__ */ jsx17("span", { className: "text-sm text-gray-700", children: option.label })
                 ]
               },
               String(option.value)
@@ -729,17 +1078,17 @@ var InputRadio = forwardRef13(
           })
         }
       ),
-      error && /* @__PURE__ */ jsx13("span", { className: "text-xs text-red-500 mt-0.5", children: "Selecione uma op\xE7\xE3o" })
+      error && /* @__PURE__ */ jsx17("span", { className: "text-xs text-red-500 mt-0.5", children: "Selecione uma op\xE7\xE3o" })
     ] });
   }
 );
 InputRadio.displayName = "InputRadio";
 
 // src/components/Input/Textarea.tsx
-import { forwardRef as forwardRef14 } from "react";
-import { tv as tv5 } from "tailwind-variants";
-import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
-var textareaStyle = tv5({
+import { forwardRef as forwardRef18 } from "react";
+import { tv as tv9 } from "tailwind-variants";
+import { jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
+var textareaStyle = tv9({
   base: "w-full rounded-md border bg-white px-2.5 py-2 text-sm text-gray-900 outline-none placeholder:text-gray-400 resize-vertical transition-colors",
   variants: {
     error: {
@@ -754,14 +1103,14 @@ var textareaStyle = tv5({
     error: false
   }
 });
-var Textarea = forwardRef14(
+var Textarea = forwardRef18(
   ({ label, error, errorMessage, required, size, classInput, value, onChange, disabled, name, rows = 4, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs8("div", { className: "flex w-full flex-col gap-1", children: [
-      label && /* @__PURE__ */ jsxs8("label", { htmlFor: name, className: "text-xs text-gray-700 flex items-start gap-0.5", children: [
-        /* @__PURE__ */ jsx14("span", { children: label }),
-        required && /* @__PURE__ */ jsx14("span", { className: "text-red-500 text-[10px] leading-none mt-0.5", children: "*" })
+    return /* @__PURE__ */ jsxs11("div", { className: "flex w-full flex-col gap-1", children: [
+      label && /* @__PURE__ */ jsxs11("label", { htmlFor: name, className: "text-xs text-gray-700 flex items-start gap-0.5", children: [
+        /* @__PURE__ */ jsx18("span", { children: label }),
+        required && /* @__PURE__ */ jsx18("span", { className: "text-red-500 text-[10px] leading-none mt-0.5", children: "*" })
       ] }),
-      /* @__PURE__ */ jsx14(
+      /* @__PURE__ */ jsx18(
         "textarea",
         {
           ref,
@@ -776,13 +1125,15 @@ var Textarea = forwardRef14(
           ...props
         }
       ),
-      error && errorMessage && /* @__PURE__ */ jsx14("span", { className: "text-xs text-red-500 mt-0.5", children: errorMessage })
+      error && errorMessage && /* @__PURE__ */ jsx18("span", { className: "text-xs text-red-500 mt-0.5", children: errorMessage })
     ] });
   }
 );
 Textarea.displayName = "Textarea";
 export {
+  Avatar,
   Button,
+  Card,
   InputCNPJ,
   InputCPF,
   InputCep,
@@ -795,13 +1146,19 @@ export {
   InputRadio,
   InputString,
   InputWrapper,
+  Modal,
   Textarea,
+  Tooltip,
+  avatar,
   button,
+  card,
   maskCEP,
   maskCNPJ,
   maskCPF,
   maskCurrency,
   maskPhone,
+  modal,
+  tooltip,
   unmask,
   unmaskCurrency
 };