@clickpalm/react 1.3.15 → 1.3.16

package/dist/index.mjs

@@ -0,0 +1,4386 @@
+// ../tokens/dist/index.mjs
+var colors = {
+  white: "#FFF",
+  black: "#000",
+  gray_background: "#EFEFEF",
+  gray_light: "#D9D9D9",
+  gray_mid: "#C2C2C2",
+  gray_dark: "#979797",
+  clickpalm_light: "#8987E6",
+  clickpalm_mid: "#8556E5",
+  clickpalm_dark: "#854FE8",
+  clickpalm_superDark: "#4A307F",
+  ignite_light: "#78CB63",
+  ignite_dark: "#518D42",
+  success: "#84FF8A",
+  success_dark: "#3EBF4A",
+  warning: "#FCD842",
+  warning_dark: "#C9A600",
+  danger: "#FF8173",
+  danger_dark: "#C94A3F"
+};
+var space = {
+  1: "0.25rem",
+  2: "0.5rem",
+  3: "0.75rem",
+  4: "1rem",
+  5: "1.25rem",
+  6: "1.5rem",
+  7: "1.75rem",
+  8: "2rem",
+  10: "2.5rem",
+  11: "2.75rem",
+  12: "3rem",
+  14: "3.5rem",
+  16: "4rem",
+  19: "4.75rem",
+  20: "5rem",
+  22: "6rem",
+  40: "10rem",
+  64: "16rem",
+  80: "20rem"
+};
+var radii = {
+  px: "1px",
+  xs: "4px",
+  sm: "6px",
+  md: "8px",
+  lg: "16px",
+  full: "99999px"
+};
+var fonts = {
+  default: "Nunito",
+  code: "monospace"
+};
+var fontSizes = {
+  xxs: "0.625rem",
+  xs: "0.75rem",
+  sm: "0.875rem",
+  md: "1rem",
+  lg: "1.125rem",
+  xl: "1.25rem",
+  "2xl": "1.5rem",
+  "4xl": "2rem",
+  "5xl": "2.25rem",
+  "6xl": "3rem",
+  "7xl": "4rem",
+  "8xl": "4.5rem",
+  "9xl": "6rem"
+};
+var fontWeights = {
+  regular: "400",
+  medium: "500",
+  bold: "700"
+};
+var lineHeights = {
+  regular: "100%",
+  shorter: "125%",
+  short: "140%",
+  base: "160%",
+  tall: "180%"
+};
+
+// src/styles/stitches.config.ts
+import { createStitches, defaultThemeMap } from "@stitches/react";
+var {
+  styled,
+  css,
+  globalCss,
+  keyframes,
+  getCssText,
+  theme,
+  createTheme,
+  config
+} = createStitches({
+  themeMap: {
+    ...defaultThemeMap,
+    height: "space",
+    width: "space"
+  },
+  theme: {
+    colors,
+    fontSizes,
+    fontWeights,
+    fonts,
+    lineHeights,
+    radii,
+    space
+  },
+  media: {
+    sm: "(min-width: 375px)",
+    md: "(min-width: 768px)",
+    lg: "(min-width: 1024px)"
+  }
+});
+
+// src/components/Avatar/styles.ts
+import * as Avatar from "@radix-ui/react-avatar";
+var AvatarContainer = styled(Avatar.Root, {
+  borderRadius: "$full",
+  display: "inline-block",
+  overflow: "hidden",
+  borderWidth: "3px",
+  borderStyle: "solid",
+  boxSizing: "border-box",
+  variants: {
+    size: {
+      sm: { width: "$11", height: "$11" },
+      md: { width: "$14", height: "$14" },
+      lg: { width: "$19", height: "$19" },
+      xlg: { width: "$22", height: "$22" }
+    },
+    status: {
+      default: { borderColor: "$white" },
+      warning: { borderColor: "$warning" },
+      error: { borderColor: "$danger" },
+      success: { borderColor: "$success" },
+      completed: { borderColor: "$clickpalm_dark" }
+    },
+    shadow: {
+      true: { boxShadow: "0 2px 4px $colors$gray_dark" }
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    status: "default"
+  }
+});
+var AvatarImage = styled(Avatar.Image, {
+  width: "100%",
+  height: "100%",
+  objectFit: "cover",
+  borderRadius: "inherit"
+});
+var AvatarFallback = styled(Avatar.Fallback, {
+  width: "100%",
+  height: "100%",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  backgroundColor: "$gray_background",
+  color: "$black",
+  fontWeight: "$bold",
+  fontSize: "$sm"
+});
+var NotificationBadge = styled("div", {
+  position: "absolute",
+  transform: "translate(50%, 50%)",
+  backgroundColor: "$ignite_light",
+  color: "$black",
+  fontWeight: "$bold",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  borderRadius: "$full",
+  border: "1px solid $white",
+  boxSizing: "border-box",
+  zIndex: 1,
+  variants: {
+    size: {
+      sm: {
+        width: "20px",
+        height: "20px",
+        fontSize: "8px",
+        bottom: 18,
+        right: 4
+      },
+      md: {
+        width: "20px",
+        height: "20px",
+        fontSize: "10px",
+        bottom: 20,
+        right: 5
+      },
+      lg: {
+        width: "30px",
+        height: "30px",
+        fontSize: "11px",
+        bottom: 25,
+        right: 8
+      },
+      xlg: {
+        width: "30px",
+        height: "30px",
+        fontSize: "12px",
+        bottom: 25,
+        right: 8
+      }
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+
+// src/components/Avatar/index.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function Avatar2({
+  fallback,
+  className,
+  style,
+  size = "md",
+  status = "default",
+  notifications = 0,
+  shadow = false,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs("div", { style: { position: "relative", display: "inline-block" }, children: [
+    /* @__PURE__ */ jsxs(AvatarContainer, { className, style, size, status, shadow, children: [
+      /* @__PURE__ */ jsx(AvatarImage, { ...props }),
+      /* @__PURE__ */ jsx(AvatarFallback, { children: fallback })
+    ] }),
+    notifications > 0 && /* @__PURE__ */ jsx(NotificationBadge, { size, children: notifications > 99 ? "99+" : notifications })
+  ] });
+}
+Avatar2.displayName = "Avatar";
+
+// src/components/Calendar/index.tsx
+import { format } from "date-fns";
+import { ptBR } from "date-fns/locale";
+import { useEffect, useState } from "react";
+import { DayPicker } from "react-day-picker";
+import "react-day-picker/dist/style.css";
+
+// src/components/Button.tsx
+import { forwardRef } from "react";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var StyledButton = styled("button", {
+  all: "unset",
+  borderRadius: "$md",
+  fontWeight: "$bold",
+  fontFamily: "$default",
+  textAlign: "center",
+  boxSizing: "border-box",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  gap: "$2",
+  cursor: "pointer",
+  svg: {
+    width: "$4",
+    height: "$4"
+  },
+  "&:disabled": {
+    cursor: "not-allowed"
+  },
+  "&:focus": {
+    outline: "none"
+  },
+  variants: {
+    variant: {
+      primary: {
+        color: "$white",
+        backgroundImage: "linear-gradient(to bottom, $ignite_light, $ignite_dark)",
+        "&:not(:disabled):is(:hover, :focus)": {
+          background: "$ignite_dark"
+        },
+        "&:disabled": {
+          opacity: "0.6"
+        }
+      },
+      secondary: {
+        color: "$clickpalm_mid",
+        border: "2px solid $ignite_light",
+        "&:not(:disabled):is(:hover, :focus)": {
+          border: "2px solid $ignite_dark"
+        },
+        "&:disabled": {
+          opacity: "0.6"
+        }
+      },
+      tertiary: {
+        color: "$ignite_light",
+        border: "3px solid $clickpalm_mid",
+        "&:not(:disabled):is(:hover, :focus)": {
+          color: "$ignite_dark"
+        },
+        "&:disabled": {
+          opacity: "0.6"
+        },
+        svg: {
+          fill: "$ignite_light"
+        }
+      }
+    },
+    size: {
+      xs: {},
+      sm: {
+        height: 33,
+        padding: "0 $2",
+        fontSize: "$md"
+      },
+      md: {
+        height: 53,
+        padding: "0 $4",
+        fontSize: "$md"
+      },
+      lg: {
+        height: 70,
+        padding: "0 $6",
+        fontSize: "$2xl"
+      }
+    },
+    full: {
+      true: {
+        width: "100%"
+      }
+    },
+    round: {
+      md: {
+        height: 53,
+        width: 53,
+        padding: "0 $4",
+        borderRadius: "50%"
+      },
+      lg: {
+        height: 70,
+        width: 70,
+        padding: "0 $6",
+        borderRadius: "50%"
+      },
+      xlg: {
+        height: 160,
+        width: 160,
+        padding: "0 $8",
+        borderRadius: "50%"
+      }
+    }
+  },
+  defaultVariants: {
+    variant: "primary",
+    size: "md"
+  }
+});
+var Button = forwardRef(function Button2({ children, ...props }, ref) {
+  return /* @__PURE__ */ jsx2(StyledButton, { ref, ...props, children });
+});
+Button.displayName = "Button";
+
+// src/components/Icon/index.tsx
+import { forwardRef as forwardRef2 } from "react";
+
+// src/components/Icon/icons.ts
+import {
+  TriangleDownIcon as TriangleDown,
+  TriangleUpIcon as TriangleUp,
+  TriangleLeftIcon as TriangleLeft,
+  TriangleRightIcon as TriangleRight,
+  EyeClosedIcon as EyeClosed,
+  EyeOpenIcon as EyeOpen,
+  QuestionMarkIcon as QuestionMark,
+  ReloadIcon as Reload
+} from "@radix-ui/react-icons";
+
+// src/components/Icon/Svgs/Calendar.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Calendar = (props) => /* @__PURE__ */ jsx3(
+  "svg",
+  {
+    width: "18",
+    height: "21",
+    viewBox: "0 0 18 21",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    children: /* @__PURE__ */ jsx3(
+      "path",
+      {
+        d: "M6 14.6113C5.3 14.6113 4.70833 14.3697 4.225 13.8863C3.74167 13.403 3.5 12.8113 3.5 12.1113C3.5 11.4113 3.74167 10.8197 4.225 10.3363C4.70833 9.85299 5.3 9.61133 6 9.61133C6.7 9.61133 7.29167 9.85299 7.775 10.3363C8.25833 10.8197 8.5 11.4113 8.5 12.1113C8.5 12.8113 8.25833 13.403 7.775 13.8863C7.29167 14.3697 6.7 14.6113 6 14.6113ZM2 20.1113C1.45 20.1113 0.979167 19.9155 0.5875 19.5238C0.195833 19.1322 0 18.6613 0 18.1113V4.11133C0 3.56133 0.195833 3.09049 0.5875 2.69883C0.979167 2.30716 1.45 2.11133 2 2.11133H3V0.111328H5V2.11133H13V0.111328H15V2.11133H16C16.55 2.11133 17.0208 2.30716 17.4125 2.69883C17.8042 3.09049 18 3.56133 18 4.11133V18.1113C18 18.6613 17.8042 19.1322 17.4125 19.5238C17.0208 19.9155 16.55 20.1113 16 20.1113H2ZM2 18.1113H16V8.11133H2V18.1113Z",
+        fill: "currentColor"
+      }
+    )
+  }
+);
+
+// src/components/Icon/Svgs/Closed.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Closed = (props) => {
+  return /* @__PURE__ */ jsx4(
+    "svg",
+    {
+      width: "14",
+      height: "15",
+      viewBox: "0 0 14 15",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: /* @__PURE__ */ jsx4(
+        "path",
+        {
+          d: "M1.4 14.5L0 13.1L5.6 7.5L0 1.9L1.4 0.5L7 6.1L12.6 0.5L14 1.9L8.4 7.5L14 13.1L12.6 14.5L7 8.9L1.4 14.5Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+};
+
+// src/components/Icon/Svgs/Dots.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var Dots = (props) => {
+  return /* @__PURE__ */ jsx5(
+    "svg",
+    {
+      width: "16",
+      height: "5",
+      viewBox: "0 0 16 5",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: /* @__PURE__ */ jsx5(
+        "path",
+        {
+          d: "M2 4.36865C1.45 4.36865 0.979167 4.17282 0.5875 3.78115C0.195833 3.38949 0 2.91865 0 2.36865C0 1.81865 0.195833 1.34782 0.5875 0.956152C0.979167 0.564486 1.45 0.368652 2 0.368652C2.55 0.368652 3.02083 0.564486 3.4125 0.956152C3.80417 1.34782 4 1.81865 4 2.36865C4 2.91865 3.80417 3.38949 3.4125 3.78115C3.02083 4.17282 2.55 4.36865 2 4.36865ZM8 4.36865C7.45 4.36865 6.97917 4.17282 6.5875 3.78115C6.19583 3.38949 6 2.91865 6 2.36865C6 1.81865 6.19583 1.34782 6.5875 0.956152C6.97917 0.564486 7.45 0.368652 8 0.368652C8.55 0.368652 9.02083 0.564486 9.4125 0.956152C9.80417 1.34782 10 1.81865 10 2.36865C10 2.91865 9.80417 3.38949 9.4125 3.78115C9.02083 4.17282 8.55 4.36865 8 4.36865ZM14 4.36865C13.45 4.36865 12.9792 4.17282 12.5875 3.78115C12.1958 3.38949 12 2.91865 12 2.36865C12 1.81865 12.1958 1.34782 12.5875 0.956152C12.9792 0.564486 13.45 0.368652 14 0.368652C14.55 0.368652 15.0208 0.564486 15.4125 0.956152C15.8042 1.34782 16 1.81865 16 2.36865C16 2.91865 15.8042 3.38949 15.4125 3.78115C15.0208 4.17282 14.55 4.36865 14 4.36865Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+};
+
+// src/components/Icon/Svgs/Filter.tsx
+import { jsx as jsx6 } from "react/jsx-runtime";
+var Filter = (props) => {
+  return /* @__PURE__ */ jsx6(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "32",
+      height: "32",
+      fill: "currentColor",
+      viewBox: "0 0 256 256",
+      ...props,
+      children: /* @__PURE__ */ jsx6("path", { d: "M234.29,47.91A20,20,0,0,0,216,36H40A20,20,0,0,0,25.2,69.45l.12.14L92,140.75V216a20,20,0,0,0,31.1,16.64l32-21.33A20,20,0,0,0,164,194.66V140.75l66.67-71.16.12-.14A20,20,0,0,0,234.29,47.91Zm-91,79.89A12,12,0,0,0,140,136v56.52l-24,16V136a12,12,0,0,0-3.25-8.2L49.23,60H206.77Z" })
+    }
+  );
+};
+
+// src/components/Icon/Svgs/Hamburger.tsx
+import { jsx as jsx7 } from "react/jsx-runtime";
+var Hamburger = (props) => {
+  return /* @__PURE__ */ jsx7(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "32",
+      height: "32",
+      fill: "currentColor",
+      viewBox: "0 0 256 256",
+      ...props,
+      children: /* @__PURE__ */ jsx7("path", { d: "M228,128a12,12,0,0,1-12,12H40a12,12,0,0,1,0-24H216A12,12,0,0,1,228,128ZM40,76H216a12,12,0,0,0,0-24H40a12,12,0,0,0,0,24ZM216,180H40a12,12,0,0,0,0,24H216a12,12,0,0,0,0-24Z" })
+    }
+  );
+};
+
+// src/components/Icon/Svgs/Pencil.tsx
+import { jsx as jsx8 } from "react/jsx-runtime";
+var Pencil = (props) => {
+  return /* @__PURE__ */ jsx8(
+    "svg",
+    {
+      width: "18",
+      height: "19",
+      viewBox: "0 0 18 19",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: /* @__PURE__ */ jsx8(
+        "path",
+        {
+          d: "M2 16.9287H3.425L13.2 7.15371L11.775 5.72871L2 15.5037V16.9287ZM0 18.9287V14.6787L13.2 1.50371C13.4 1.32038 13.6208 1.17871 13.8625 1.07871C14.1042 0.978711 14.3583 0.928711 14.625 0.928711C14.8917 0.928711 15.15 0.978711 15.4 1.07871C15.65 1.17871 15.8667 1.32871 16.05 1.52871L17.425 2.92871C17.625 3.11204 17.7708 3.32871 17.8625 3.57871C17.9542 3.82871 18 4.07871 18 4.32871C18 4.59538 17.9542 4.84954 17.8625 5.09121C17.7708 5.33288 17.625 5.55371 17.425 5.75371L4.25 18.9287H0ZM12.475 6.45371L11.775 5.72871L13.2 7.15371L12.475 6.45371Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+};
+
+// src/components/Icon/Svgs/Photo.tsx
+import { jsx as jsx9 } from "react/jsx-runtime";
+var Photo = (props) => {
+  return /* @__PURE__ */ jsx9(
+    "svg",
+    {
+      width: "18",
+      height: "18",
+      viewBox: "0 0 18 18",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: /* @__PURE__ */ jsx9(
+        "path",
+        {
+          d: "M2 18C1.45 18 0.975 17.8083 0.575 17.425C0.191667 17.025 0 16.55 0 16V2C0 1.45 0.191667 0.983334 0.575 0.600001C0.975 0.2 1.45 0 2 0H16C16.55 0 17.0167 0.2 17.4 0.600001C17.8 0.983334 18 1.45 18 2V16C18 16.55 17.8 17.025 17.4 17.425C17.0167 17.8083 16.55 18 16 18H2ZM2 16H16V2H2V16ZM3 14H15L11.25 9L8.25 13L6 10L3 14ZM2 16V2V16Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+};
+
+// src/components/Icon/Svgs/Plus.tsx
+import { jsx as jsx10 } from "react/jsx-runtime";
+var Plus = (props) => {
+  return /* @__PURE__ */ jsx10(
+    "svg",
+    {
+      width: "20",
+      height: "20",
+      viewBox: "0 0 20 20",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: /* @__PURE__ */ jsx10(
+        "path",
+        {
+          d: "M8.58301 11.4167H0.0830078V8.58334H8.58301V0.0833435H11.4163V8.58334H19.9163V11.4167H11.4163V19.9167H8.58301V11.4167Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+};
+
+// src/components/Icon/Svgs/Search.tsx
+import { jsx as jsx11 } from "react/jsx-runtime";
+var Search = (props) => {
+  return /* @__PURE__ */ jsx11(
+    "svg",
+    {
+      width: "18",
+      height: "18",
+      viewBox: "0 0 18 18",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: /* @__PURE__ */ jsx11(
+        "path",
+        {
+          d: "M16.6 18L10.3 11.7C9.8 12.1 9.225 12.4167 8.575 12.65C7.925 12.8833 7.23333 13 6.5 13C4.68333 13 3.14583 12.3708 1.8875 11.1125C0.629167 9.85417 0 8.31667 0 6.5C0 4.68333 0.629167 3.14583 1.8875 1.8875C3.14583 0.629167 4.68333 0 6.5 0C8.31667 0 9.85417 0.629167 11.1125 1.8875C12.3708 3.14583 13 4.68333 13 6.5C13 7.23333 12.8833 7.925 12.65 8.575C12.4167 9.225 12.1 9.8 11.7 10.3L18 16.6L16.6 18ZM6.5 11C7.75 11 8.8125 10.5625 9.6875 9.6875C10.5625 8.8125 11 7.75 11 6.5C11 5.25 10.5625 4.1875 9.6875 3.3125C8.8125 2.4375 7.75 2 6.5 2C5.25 2 4.1875 2.4375 3.3125 3.3125C2.4375 4.1875 2 5.25 2 6.5C2 7.75 2.4375 8.8125 3.3125 9.6875C4.1875 10.5625 5.25 11 6.5 11Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+};
+
+// src/components/Icon/Svgs/ChevronLeft.tsx
+import { jsx as jsx12 } from "react/jsx-runtime";
+var ChevronLeft = (props) => {
+  return /* @__PURE__ */ jsx12(
+    "svg",
+    {
+      width: "8",
+      height: "12",
+      viewBox: "0 0 8 12",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: /* @__PURE__ */ jsx12(
+        "path",
+        {
+          d: "M6 12L0 6L6 0L7.4 1.4L2.8 6L7.4 10.6L6 12Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+};
+
+// src/components/Icon/Svgs/ChevronRight.tsx
+import { jsx as jsx13 } from "react/jsx-runtime";
+var ChevronRight = (props) => {
+  return /* @__PURE__ */ jsx13(
+    "svg",
+    {
+      width: "8",
+      height: "12",
+      viewBox: "0 0 8 12",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: /* @__PURE__ */ jsx13(
+        "path",
+        {
+          d: "M4.6 6L0 1.4L1.4 0L7.4 6L1.4 12L0 10.6L4.6 6Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+};
+
+// src/components/Icon/Svgs/Check.tsx
+import { jsx as jsx14 } from "react/jsx-runtime";
+var Check = (props) => {
+  return /* @__PURE__ */ jsx14(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "18",
+      height: "13",
+      viewBox: "0 0 18 13",
+      fill: "none",
+      ...props,
+      children: /* @__PURE__ */ jsx14(
+        "path",
+        {
+          d: "M6.55001 13L0.850006 7.3L2.27501 5.875L6.55001 10.15L15.725 0.975L17.15 2.4L6.55001 13Z",
+          fill: "currentColor"
+        }
+      )
+    }
+  );
+};
+
+// src/components/Icon/Svgs/Copy.tsx
+import { jsx as jsx15 } from "react/jsx-runtime";
+var Copy = (props) => {
+  return /* @__PURE__ */ jsx15(
+    "svg",
+    {
+      width: "18",
+      height: "19",
+      viewBox: "0 0 18 19",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      ...props,
+      children: /* @__PURE__ */ jsx15(
+        "path",
+        {
+          d: "M3.4 11.9547H2.6C2.17565 11.9547 1.76869 11.7861 1.46863 11.4861C1.16857 11.186 1 10.779 1 10.3547V3.15469C1 2.73034 1.16857 2.32337 1.46863 2.02332C1.76869 1.72326 2.17565 1.55469 2.6 1.55469H9.8C10.2243 1.55469 10.6313 1.72326 10.9314 2.02332C11.2314 2.32337 11.4 2.73034 11.4 3.15469V3.95469M8.2 7.15469H15.4C16.2837 7.15469 17 7.87103 17 8.75469V15.9547C17 16.8383 16.2837 17.5547 15.4 17.5547H8.2C7.31634 17.5547 6.6 16.8383 6.6 15.9547V8.75469C6.6 7.87103 7.31634 7.15469 8.2 7.15469Z",
+          stroke: "currentColor",
+          "stroke-width": "2",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round"
+        }
+      )
+    }
+  );
+};
+
+// src/components/Icon/Svgs/Download.tsx
+import { jsx as jsx16 } from "react/jsx-runtime";
+var Download = (props) => /* @__PURE__ */ jsx16(
+  "svg",
+  {
+    width: "15",
+    height: "15",
+    viewBox: "0 0 15 15",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    children: /* @__PURE__ */ jsx16(
+      "path",
+      {
+        d: "M7.50005 1.04999C7.74858 1.04999 7.95005 1.25146 7.95005 1.49999V8.41359L10.1819 6.18179C10.3576 6.00605 10.6425 6.00605 10.8182 6.18179C10.994 6.35753 10.994 6.64245 10.8182 6.81819L7.81825 9.81819C7.64251 9.99392 7.35759 9.99392 7.18185 9.81819L4.18185 6.81819C4.00611 6.64245 4.00611 6.35753 4.18185 6.18179C4.35759 6.00605 4.64251 6.00605 4.81825 6.18179L7.05005 8.41359V1.49999C7.05005 1.25146 7.25152 1.04999 7.50005 1.04999ZM2.5 10C2.77614 10 3 10.2239 3 10.5V12C3 12.5539 3.44565 13 3.99635 13H11.0012C11.5529 13 12 12.5528 12 12V10.5C12 10.2239 12.2239 10 12.5 10C12.7761 10 13 10.2239 13 10.5V12C13 13.1041 12.1062 14 11.0012 14H3.99635C2.89019 14 2 13.103 2 12V10.5C2 10.2239 2.22386 10 2.5 10Z",
+        fill: "currentColor",
+        fillRule: "evenodd",
+        clipRule: "evenodd"
+      }
+    )
+  }
+);
+
+// src/components/Icon/icons.ts
+var iconMap = {
+  TriangleDown,
+  TriangleUp,
+  TriangleLeft,
+  TriangleRight,
+  EyeClosed,
+  EyeOpen,
+  QuestionMark,
+  Reload,
+  Calendar,
+  Closed,
+  Dots,
+  Download,
+  Filter,
+  Hamburger,
+  Pencil,
+  Photo,
+  Plus,
+  Search,
+  ChevronLeft,
+  ChevronRight,
+  Check,
+  Copy
+};
+
+// src/components/Icon/index.tsx
+import { jsx as jsx17 } from "react/jsx-runtime";
+var colorMap = {
+  black: "#000000",
+  green: "#78CB63",
+  white: "#ffffff"
+};
+var Icon = forwardRef2(
+  ({ name, size = 24, color = "black", ...rest }, ref) => {
+    const IconComponent = iconMap[name];
+    if (!IconComponent) {
+      console.warn(`Icon "${name}" not found in iconMap`);
+      return null;
+    }
+    const fillColor = colorMap[color];
+    return /* @__PURE__ */ jsx17(
+      IconComponent,
+      {
+        ref,
+        width: size,
+        height: size,
+        style: { color: fillColor },
+        "aria-hidden": true,
+        ...rest
+      }
+    );
+  }
+);
+Icon.displayName = "Icon";
+
+// src/components/Calendar/styles.ts
+var calendarStyles = globalCss({
+  ".calendar-root": {
+    "--rdp-accent-color": theme.colors.clickpalm_light,
+    "--rdp-accent-background-color": theme.colors.clickpalm_light,
+    "--rdp-day-height": "45px",
+    "--rdp-day-width": "45px",
+    "--rdp-day_button-border-radius": theme.radii.md.value,
+    "--rdp-day_button-border": "2px solid transparent",
+    "--rdp-day_button-height": "40px",
+    "--rdp-day_button-width": "40px",
+    "--rdp-selected-border": "2px solid var(--rdp-accent-color)",
+    "--rdp-disabled-opacity": "0.5",
+    "--rdp-outside-opacity": "1",
+    "--rdp-today-color": theme.colors.clickpalm_light,
+    "--rdp-dropdown-gap": "0.5rem",
+    "--rdp-months-gap": "2rem",
+    "--rdp-nav_button-disabled-opacity": "0.5",
+    "--rdp-nav_button-height": "36px",
+    "--rdp-nav_button-width": "36px",
+    "--rdp-nav-height": "44px",
+    "--rdp-range_middle-background-color": "var(--rdp-accent-background-color)",
+    "--rdp-range_middle-color": "inherit",
+    "--rdp-range_start-color": "white",
+    "--rdp-range_start-background": "linear-gradient(var(--rdp-gradient-direction), transparent 50%, var(--rdp-range_middle-background-color) 50%)",
+    "--rdp-range_start-date-background-color": "var(--rdp-accent-color)",
+    "--rdp-range_end-background": "linear-gradient(var(--rdp-gradient-direction), var(--rdp-range_middle-background-color) 50%, transparent 50%)",
+    "--rdp-range_end-color": "white",
+    "--rdp-range_end-date-background-color": "var(--rdp-accent-color)",
+    "--rdp-weekday-opacity": "1",
+    "--rdp-weekday-padding": "0.5rem 0",
+    "--rdp-weekday-text-align": "center",
+    "--rdp-gradient-direction": "90deg",
+    "--rdp-animation_duration": "0.3s",
+    "--rdp-animation_timing": "cubic-bezier(0.4, 0, 0.2, 1)",
+    padding: theme.space[3],
+    border: `1px solid ${theme.colors.gray_light}`,
+    borderRadius: theme.radii.md.value,
+    maxWidth: "329px",
+    paddingLeft: "15px"
+  },
+  '.calendar-root[dir="rtl"]': {
+    "--rdp-gradient-direction": "-90deg"
+  },
+  '.calendar-root[data-broadcast-calendar="true"]': {
+    "--rdp-outside-opacity": "unset"
+  },
+  '.calendar-root[dir="rtl"] .rdp-nav .rdp-chevron': {
+    transform: "rotate(180deg)",
+    transformOrigin: "50%"
+  },
+  '.calendar-root[data-nav-layout="around"] .rdp-month': {
+    position: "relative"
+  },
+  '.calendar-root[data-nav-layout="after"] .rdp-month': {
+    position: "relative"
+  },
+  '.calendar-root[data-nav-layout="around"] .calendar-month_caption': {
+    justifyContent: "center",
+    marginInlineStart: "var(--rdp-nav_button-width)",
+    marginInlineEnd: "var(--rdp-nav_button-width)",
+    position: "relative"
+  },
+  '.calendar-root[data-nav-layout="around"] .rdp-button_previous': {
+    position: "absolute",
+    insetInlineStart: 0,
+    top: 0,
+    height: "var(--rdp-nav-height)",
+    display: "inline-flex"
+  },
+  '.calendar-root[data-nav-layout="around"] .rdp-button_next': {
+    position: "absolute",
+    insetInlineEnd: 0,
+    top: 0,
+    height: "var(--rdp-nav-height)",
+    display: "inline-flex",
+    justifyContent: "center"
+  },
+  '.calendar-root[dir="rtl"] .rdp-weeks_after_enter': {
+    animation: "rdp-slide_in_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards"
+  },
+  '.calendar-root[dir="rtl"] .rdp-weeks_before_exit': {
+    animation: "rdp-slide_out_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards"
+  },
+  '.calendar-root[dir="rtl"] .rdp-weeks_before_enter': {
+    animation: "rdp-slide_in_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards"
+  },
+  '.calendar-root[dir="rtl"] .rdp-weeks_after_exit': {
+    animation: "rdp-slide_out_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards"
+  },
+  ".calendar-month_caption": {
+    paddingLeft: "2px",
+    display: "flex",
+    alignItems: "center",
+    height: "var(--rdp-nav-height)",
+    fontWeight: "$bold",
+    fontSize: "$lg"
+  },
+  ".calendar-caption_label": {
+    paddingLeft: "$3",
+    zIndex: 1,
+    position: "relative",
+    display: "flex",
+    alignItems: "center",
+    whiteSpace: "nowrap"
+  },
+  ".calendar-root-collapsed": {
+    minWidth: "329px",
+    position: "relative"
+  },
+  ".calendar-root-collapsed .rdp-weekdays": {
+    display: "none"
+  },
+  ".calendar-root-collapsed .rdp-day": {
+    display: "none"
+  },
+  ".calendar-root-collapsed .rdp-months": {
+    minHeight: "var(--rdp-nav-height)",
+    position: "relative",
+    display: "flex",
+    flexWrap: "wrap",
+    gap: "var(--rdp-months-gap)",
+    maxWidth: "100%"
+  },
+  ".calendar-root-collapsed .rdp-nav": {
+    position: "absolute",
+    top: 0,
+    right: 0,
+    display: "flex",
+    alignItems: "center",
+    height: "var(--rdp-nav-height)"
+  },
+  ".rdp-dropdown:focus-visible ~ .calendar-caption_label": {
+    outline: "5px auto Highlight",
+    WebkitOutline: "5px auto -webkit-focus-ring-color"
+  },
+  ".rdp-nav": {
+    gap: "$1",
+    paddingRight: "6px"
+  },
+  ".rdp-weekday": {
+    fontFamily: theme.fonts.default,
+    fontWeight: theme.fontWeights.bold,
+    paddingRight: "6px"
+  },
+  ".rdp-day_button": {
+    background: theme.colors.gray_background,
+    color: theme.colors.black,
+    fontFamily: theme.fonts.default,
+    fontWeight: theme.fontWeights.bold,
+    fontSize: theme.fontSizes.md,
+    "&:hover": {
+      border: `2px solid ${theme.colors.clickpalm_light}`
+    },
+    "&:focus": {
+      border: `2px solid ${theme.colors.clickpalm_light}`,
+      outline: "none"
+    }
+  },
+  ".rdp-outside .rdp-day_button": {
+    fontFamily: theme.fonts.default,
+    background: theme.colors.gray_mid,
+    color: theme.colors.black
+  },
+  ".rdp-selected .rdp-day_button": {
+    background: theme.colors.clickpalm_light,
+    color: theme.colors.white
+  }
+});
+var StyledButton2 = styled("div", {
+  display: "flex",
+  alignItems: "center",
+  transition: "transform 0.4s ease",
+  variants: {
+    isOpen: {
+      true: {
+        transform: "rotate(180deg)"
+      },
+      false: {
+        transform: "rotate(0deg)"
+      }
+    }
+  }
+});
+var StyledLabel = styled("label", {
+  color: "$black",
+  fontFamily: "$default",
+  fontSize: "$md",
+  fontWeight: "$bold",
+  display: "flex",
+  marginBottom: "$6"
+});
+
+// src/components/Calendar/index.tsx
+import { jsx as jsx18, jsxs as jsxs2 } from "react/jsx-runtime";
+calendarStyles();
+var Calendar2 = ({ label, onChange, onMonthChange, defaultValue }) => {
+  const [selected, setSelected] = useState(defaultValue);
+  const [month, setMonth] = useState(/* @__PURE__ */ new Date());
+  const [open, setOpen] = useState(true);
+  const handleDaySelect = (date) => {
+    setSelected(date);
+    if (date) {
+      const formatted = format(date, "dd/MM/yyyy");
+      onChange(formatted);
+    }
+  };
+  const handleMonthChange = (month2) => {
+    setMonth(month2);
+    onMonthChange && onMonthChange(month2);
+  };
+  useEffect(() => {
+    if (selected) {
+      setMonth(selected);
+    }
+  }, [selected]);
+  return /* @__PURE__ */ jsxs2("div", { children: [
+    /* @__PURE__ */ jsx18(StyledLabel, { children: label }),
+    /* @__PURE__ */ jsx18(
+      DayPicker,
+      {
+        className: !open ? "calendar-root-collapsed" : "",
+        mode: "single",
+        selected,
+        onSelect: handleDaySelect,
+        month,
+        onMonthChange: handleMonthChange,
+        locale: ptBR,
+        showOutsideDays: true,
+        classNames: {
+          root: "calendar-root",
+          month_caption: "calendar-month_caption",
+          caption_label: "calendar-caption_label"
+        },
+        formatters: {
+          formatCaption: (month2, options) => {
+            const mes = format(month2, "MMMM", options).replace(/^./, (c) => c.toUpperCase());
+            const ano = format(month2, "yyyy", options);
+            return `${mes} de ${ano}`;
+          },
+          formatWeekdayName: (date, options) => {
+            const dia = format(date, "EEEEEE", options);
+            return dia.charAt(0).toUpperCase() + dia.slice(1);
+          }
+        },
+        components: {
+          MonthCaption: ({ calendarMonth, displayIndex, ...safeprops }) => {
+            const displayMonth = calendarMonth.date;
+            return /* @__PURE__ */ jsxs2("div", { ...safeprops, children: [
+              /* @__PURE__ */ jsx18("div", { children: /* @__PURE__ */ jsx18(
+                Button,
+                {
+                  variant: "secondary",
+                  size: "sm",
+                  onClick: () => setOpen(!open),
+                  children: /* @__PURE__ */ jsx18(StyledButton2, { isOpen: open, children: /* @__PURE__ */ jsx18(Icon, { name: "TriangleUp", size: 16 }) })
+                }
+              ) }),
+              /* @__PURE__ */ jsx18("div", { className: "calendar-month_caption", children: /* @__PURE__ */ jsx18("div", { className: "calendar-caption_label", role: "heading", "aria-level": 2, children: format(displayMonth, "MMMM 'de' yyyy", { locale: ptBR }).replace(/^./, (c) => c.toUpperCase()) }) })
+            ] });
+          },
+          PreviousMonthButton: (props) => /* @__PURE__ */ jsx18(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx18(Icon, { name: "TriangleLeft", size: 16 }) }),
+          NextMonthButton: (props) => /* @__PURE__ */ jsx18(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx18(Icon, { name: "TriangleRight", size: 16 }) })
+        }
+      }
+    )
+  ] });
+};
+
+// src/components/Checkbox/index.tsx
+import { forwardRef as forwardRef3 } from "react";
+
+// src/components/Checkbox/styles.ts
+import * as Checkbox from "@radix-ui/react-checkbox";
+var StyledWrapper = styled("div", {
+  display: "flex",
+  alignSelf: "flex-start",
+  alignItems: "center",
+  lineHeight: "150%",
+  variants: {
+    hasError: {
+      true: {
+        marginBottom: "0px",
+        "&:focus": {
+          border: "2px solid $danger_dark"
+        }
+      },
+      false: {
+        marginBottom: "$6"
+      }
+    }
+  }
+});
+var CheckboxContainer = styled(Checkbox.Root, {
+  all: "unset",
+  width: "$6",
+  height: "$6",
+  backgroundColor: "$white",
+  borderRadius: "$md",
+  lineHeight: 0,
+  cursor: "pointer",
+  overflow: "hidden",
+  boxSizing: "border-box",
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  borderWidth: "3px",
+  borderStyle: "solid",
+  borderColor: "$gray_mid",
+  '&[data-state="checked"]': {
+    outline: "none",
+    backgroundColor: "$clickpalm_dark",
+    borderColor: "$clickpalm_dark"
+  },
+  "&:focus": {
+    outline: "none",
+    border: "2px solid $clickpalm_light"
+  },
+  "&:disabled": {
+    opacity: 0.5,
+    cursor: "not-allowed"
+  },
+  variants: {
+    hasError: {
+      true: {
+        borderColor: "$danger_dark",
+        marginBottom: "0px",
+        "&:focus, &:hover": {
+          outline: "none",
+          border: "4px solid $danger_dark"
+        },
+        '&[data-state="checked"]': {
+          outline: "none",
+          backgroundColor: "$danger_dark",
+          borderColor: "$danger_dark"
+        }
+      }
+    }
+  }
+});
+var slideIn = keyframes({
+  from: {
+    transform: "translateY(-100%)"
+  },
+  to: {
+    transform: "translateY(0)"
+  }
+});
+var slideOut = keyframes({
+  from: {
+    transform: "translateY(0)"
+  },
+  to: {
+    transform: "translateY(-100%)"
+  }
+});
+var CheckboxIndicator = styled(Checkbox.Indicator, {
+  color: "$white",
+  width: "$4",
+  height: "$4",
+  '&[data-state="checked"]': {
+    animation: `${slideIn} 200ms ease-out`
+  },
+  '&[data-state="unchecked"]': {
+    animation: `${slideOut} 200ms ease-out`
+  }
+});
+var CheckboxLabel = styled("label", {
+  display: "flex",
+  paddingLeft: "$3",
+  fontSize: "$md",
+  lineHeight: "$base",
+  color: "$black"
+});
+var Span = styled("span", {
+  fontFamily: "$default",
+  fontWeight: "$regular",
+  fontSize: "$sm",
+  color: "$danger_dark",
+  alignSelf: "flex-start",
+  paddingLeft: "1px",
+  marginTop: "2px",
+  marginBottom: "$6"
+});
+
+// src/components/Checkbox/index.tsx
+import { jsx as jsx19, jsxs as jsxs3 } from "react/jsx-runtime";
+var Checkbox2 = forwardRef3(
+  ({ label, checked, onCheckedChange, errorMessage, ...rest }, ref) => {
+    return /* @__PURE__ */ jsxs3("div", { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" }, children: [
+      /* @__PURE__ */ jsxs3(StyledWrapper, { hasError: !!errorMessage, children: [
+        /* @__PURE__ */ jsx19(
+          CheckboxContainer,
+          {
+            ref,
+            checked: !!checked,
+            onCheckedChange,
+            hasError: !!errorMessage,
+            ...rest,
+            children: /* @__PURE__ */ jsx19(CheckboxIndicator, { children: /* @__PURE__ */ jsx19(Icon, { name: "Check", size: 16, color: "white" }) })
+          }
+        ),
+        /* @__PURE__ */ jsx19(CheckboxLabel, { children: label })
+      ] }),
+      errorMessage && /* @__PURE__ */ jsx19(Span, { children: errorMessage })
+    ] });
+  }
+);
+Checkbox2.displayName = "Checkbox";
+
+// src/components/Datepicker/index.tsx
+import { format as format2 } from "date-fns";
+import { ptBR as ptBR2 } from "date-fns/locale";
+import { forwardRef as forwardRef5, useEffect as useEffect4, useImperativeHandle, useRef as useRef4, useState as useState4 } from "react";
+import { DayPicker as DayPicker2 } from "react-day-picker";
+import "react-day-picker/dist/style.css";
+
+// src/components/Input/index.tsx
+import React, { forwardRef as forwardRef4, useRef as useRef2 } from "react";
+
+// src/components/Input/styles.ts
+var StyledWrapper2 = styled("div", {
+  display: "flex",
+  flexDirection: "column"
+});
+var Label = styled("label", {
+  fontSize: "$md",
+  fontWeight: "$regular",
+  alignSelf: "flex-start",
+  marginBottom: "$2",
+  paddingLeft: "1px",
+  color: "$black"
+});
+var TextInputContainer = styled("div", {
+  backgroundColor: "$white",
+  borderRadius: "$md",
+  boxSizing: "border-box",
+  border: "1px solid $gray_mid",
+  display: "flex",
+  alignItems: "center",
+  padding: "$4 $4",
+  marginBottom: "$6",
+  FontSize: "$md",
+  "&:has(input:focus), &:hover": {
+    border: "1px solid $clickpalm_light"
+  },
+  "&:has(input:disabled)": {
+    opacity: 0.5,
+    cursor: "not-allowed"
+  },
+  variants: {
+    hasButtonSuffix: {
+      true: {
+        paddingTop: "10px",
+        paddingBottom: "10px"
+      }
+    },
+    noMargin: {
+      true: { marginBottom: "0px" }
+    },
+    hasError: {
+      true: {
+        border: "1px solid $danger_dark",
+        marginBottom: "0px",
+        "&:has(input:focus), &:hover": {
+          border: "1px solid $danger_dark"
+        }
+      }
+    },
+    hasCounter: {
+      true: {
+        marginBottom: "0px"
+      }
+    },
+    redBorder: {
+      true: {
+        border: "1px solid $danger_dark",
+        marginBottom: "0px",
+        "&:has(input:focus), &:hover": {
+          border: "1px solid $danger_dark"
+        }
+      }
+    }
+  }
+});
+var Prefix = styled("span", {
+  fontFamily: "$default",
+  fontSize: "$sm",
+  color: "$gray_light",
+  fontWeight: "regular"
+});
+var Input = styled("input", {
+  fontFamily: "$default",
+  fontSize: "$md",
+  color: "$black",
+  fontWeight: "regular",
+  background: "transparent",
+  border: 0,
+  width: "100%",
+  "&:focus": {
+    outline: 0
+  },
+  "&:disabled": {
+    cursor: "not-allowed",
+    opacity: 0.5
+  },
+  "&::placeholder": {
+    color: "$gray_mid"
+  }
+});
+var Suffix = styled("div", {
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  marginLeft: "$2",
+  color: "$gray_light"
+});
+var Span2 = styled("span", {
+  fontFamily: "$default",
+  fontWeight: "$regular",
+  fontSize: "$sm",
+  textAlign: "left",
+  color: "$danger_dark",
+  alignSelf: "flex-start",
+  paddingLeft: "1px",
+  marginTop: "2px",
+  marginBottom: "$6",
+  flexShrink: 1,
+  wordBreak: "break-word"
+});
+var Footer = styled("div", {
+  display: "flex",
+  justifyContent: "space-between",
+  width: "100%",
+  gap: "$2"
+});
+var CharCounter = styled(Span2, {
+  fontFamily: "$default",
+  fontWeight: "$regular",
+  fontSize: "$sm",
+  color: "$gray_mid",
+  marginLeft: "auto",
+  whiteSpace: "nowrap",
+  paddingRight: "1px",
+  marginTop: "2px",
+  marginBottom: "0px",
+  variants: {
+    hasReachedMax: {
+      true: {
+        color: "$danger_dark"
+      }
+    }
+  }
+});
+
+// src/components/Input/index.tsx
+import { jsx as jsx20, jsxs as jsxs4 } from "react/jsx-runtime";
+var Input2 = forwardRef4(
+  ({ prefix, suffix, label, maxLength, showCounter = false, errorMessage, noMargin = false, redBorder, ...props }, forwardedRef) => {
+    const getDisplayValue = (value) => {
+      const stringValue = String(value || "");
+      if (prefix && stringValue.startsWith(prefix)) {
+        return stringValue.substring(prefix.length);
+      }
+      return stringValue;
+    };
+    const localInputRef = useRef2(null);
+    const inputRef = forwardedRef || localInputRef;
+    const displayValue = getDisplayValue(props.value);
+    const charCount = displayValue.length;
+    const handleChange = (e) => {
+      let currentDisplayValue = e.target.value;
+      if (prefix && currentDisplayValue.startsWith(prefix)) {
+        currentDisplayValue = currentDisplayValue.substring(prefix.length);
+      }
+      if (props.type === "number") {
+        currentDisplayValue = currentDisplayValue.replace(/[^0-9]/g, "");
+      }
+      if (props.onChange) {
+        const newEvent = {
+          ...e,
+          target: {
+            ...e.target,
+            value: currentDisplayValue
+          }
+        };
+        props.onChange(newEvent);
+      }
+    };
+    const handleContainerClick = () => {
+      inputRef?.current?.focus();
+    };
+    const isButtonElement = (node) => {
+      if (!React.isValidElement(node))
+        return false;
+      const type = node.type;
+      return type?.displayName === "Button";
+    };
+    return /* @__PURE__ */ jsxs4(StyledWrapper2, { children: [
+      label && /* @__PURE__ */ jsx20(Label, { children: label }),
+      /* @__PURE__ */ jsxs4(
+        TextInputContainer,
+        {
+          hasButtonSuffix: isButtonElement(suffix),
+          noMargin,
+          hasError: !!errorMessage,
+          hasCounter: showCounter,
+          onClick: handleContainerClick,
+          redBorder,
+          children: [
+            !!prefix && /* @__PURE__ */ jsx20(Prefix, { children: prefix }),
+            /* @__PURE__ */ jsx20(
+              Input,
+              {
+                ref: inputRef,
+                ...props,
+                type: props.type === "number" ? "text" : props.type,
+                inputMode: props.type === "number" ? "numeric" : props.inputMode,
+                value: displayValue,
+                maxLength,
+                onChange: handleChange
+              }
+            ),
+            !!suffix && /* @__PURE__ */ jsx20(Suffix, { children: suffix })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsxs4(Footer, { children: [
+        errorMessage && /* @__PURE__ */ jsx20(Span2, { children: errorMessage }),
+        showCounter && maxLength && /* @__PURE__ */ jsxs4(CharCounter, { hasReachedMax: maxLength ? charCount >= maxLength : false, children: [
+          charCount,
+          "/",
+          maxLength
+        ] })
+      ] })
+    ] });
+  }
+);
+Input2.displayName = "Input";
+
+// src/components/Datepicker/CustomSelect/index.tsx
+import { useEffect as useEffect3, useRef as useRef3, useState as useState3 } from "react";
+
+// src/components/Datepicker/CustomSelect/styles.ts
+var IconWrapper = styled("span", {
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  transition: "transform 0.3s ease"
+});
+var SelectValueButton = styled("button", {
+  position: "relative",
+  display: "flex",
+  alignItems: "center",
+  width: "100%",
+  backgroundColor: "transparent",
+  borderRadius: "8px",
+  padding: "8px",
+  fontSize: "16px",
+  fontWeight: theme.fontWeights.bold,
+  fontFamily: theme.fonts.default,
+  textAlign: "left",
+  cursor: "pointer",
+  gap: theme.space[2],
+  "&:hover, &:focus": {
+    backgroundColor: "transparent",
+    outline: "none",
+    boxShadow: "none",
+    border: `2px solid ${theme.colors.gray_mid}`
+  }
+});
+var SelectOptionsList = styled("ul", {
+  position: "absolute",
+  top: "100%",
+  left: 0,
+  right: 0,
+  backgroundColor: theme.colors.gray_background,
+  border: `2px solid ${theme.colors.white}`,
+  borderRadius: "8px",
+  boxShadow: "0 2px 8px rgba(0,0,0,0.15)",
+  listStyle: "none",
+  margin: "4px 0 0",
+  padding: "0 12px",
+  zIndex: 10,
+  maxHeight: "200px",
+  overflowY: "auto",
+  fontFamily: theme.fonts.default,
+  fontWeight: theme.fontWeights.regular,
+  textAlign: "left",
+  width: "120px",
+  overflowX: "hidden",
+  "&::-webkit-scrollbar": {
+    width: "8px"
+  },
+  "&::-webkit-scrollbar-track": {
+    background: theme.colors.gray_light,
+    borderRadius: "8px"
+  },
+  "&::-webkit-scrollbar-thumb": {
+    backgroundColor: theme.colors.clickpalm_light,
+    borderRadius: "8px"
+  }
+});
+var SelectOptionItem = styled("li", {
+  padding: "12px 0",
+  color: theme.colors.black,
+  cursor: "pointer",
+  borderBottom: `1px solid ${theme.colors.gray_mid}`,
+  "&:last-child": {
+    borderBottom: "none"
+  },
+  "&:hover": {
+    backgroundColor: theme.colors.gray_background,
+    color: theme.colors.clickpalm_mid
+  },
+  '&[aria-disabled="true"]': {
+    color: theme.colors.gray_mid,
+    cursor: "not-allowed",
+    "&:hover": {
+      backgroundColor: "transparent",
+      color: theme.colors.gray_mid
+    }
+  },
+  variants: {
+    selected: {
+      true: {
+        backgroundColor: theme.colors.gray_background,
+        color: theme.colors.clickpalm_mid
+      }
+    }
+  }
+});
+var SelectContainer = styled("div", {
+  position: "relative",
+  width: "100%",
+  maxWidth: "130px",
+  variants: {
+    isOpen: {
+      true: {
+        [`& ${IconWrapper}`]: {
+          transform: "rotate(180deg)"
+        }
+      }
+    },
+    color: {
+      white: {
+        [`& ${SelectValueButton}`]: {
+          color: theme.colors.white,
+          border: `2px solid ${theme.colors.white}`
+        },
+        [`& ${IconWrapper}`]: {
+          color: theme.colors.white
+        }
+      },
+      black: {
+        marginBottom: 0,
+        [`& ${SelectValueButton}`]: {
+          color: theme.colors.black,
+          border: "1px solid transparent"
+        },
+        [`& ${IconWrapper}`]: {
+          color: theme.colors.black
+        }
+      }
+    }
+  }
+});
+
+// src/components/Datepicker/CustomSelect/index.tsx
+import { jsx as jsx21, jsxs as jsxs5 } from "react/jsx-runtime";
+var CustomSelect = ({
+  options = [],
+  value,
+  onChange,
+  color = "white"
+}) => {
+  const [isOpen, setIsOpen] = useState3(false);
+  const selectRef = useRef3(null);
+  const handleToggle = () => setIsOpen(!isOpen);
+  const handleOptionClick = (optionValue) => {
+    if (onChange) {
+      onChange(optionValue);
+    }
+    setIsOpen(false);
+  };
+  useEffect3(() => {
+    const handleClickOutside = (event) => {
+      if (selectRef.current && !selectRef.current.contains(event.target)) {
+        setIsOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+    };
+  }, []);
+  const safeValue = value ?? "";
+  const selectedLabel = options.find((opt) => opt.value === safeValue)?.label || safeValue;
+  return /* @__PURE__ */ jsxs5(SelectContainer, { color, isOpen, ref: selectRef, children: [
+    /* @__PURE__ */ jsxs5(SelectValueButton, { onClick: handleToggle, children: [
+      selectedLabel,
+      /* @__PURE__ */ jsx21(IconWrapper, { children: /* @__PURE__ */ jsx21(Icon, { name: "TriangleDown", size: 16 }) })
+    ] }),
+    isOpen && /* @__PURE__ */ jsx21(SelectOptionsList, { onMouseDown: (e) => e.preventDefault(), children: options.map((option) => /* @__PURE__ */ jsx21(
+      SelectOptionItem,
+      {
+        selected: option.value === value,
+        onClick: () => !option.disabled && handleOptionClick(option.value),
+        "aria-disabled": option.disabled,
+        children: option.label
+      },
+      option.value
+    )) })
+  ] });
+};
+
+// src/components/Datepicker/DatePickerSelectAdapter.tsx
+import { jsx as jsx22 } from "react/jsx-runtime";
+function DatePickerSelectAdapter(props) {
+  const { options, value, onChange } = props;
+  const handleValueChange = (newValue) => {
+    if (onChange) {
+      const syntheticEvent = {
+        target: { value: newValue }
+      };
+      onChange(syntheticEvent);
+    }
+  };
+  const selectOptions = options?.map((option) => {
+    const label = typeof option.label === "string" ? option.label.charAt(0).toUpperCase() + option.label.slice(1) : option.label;
+    return {
+      label,
+      value: option.value?.toString() ?? "",
+      disabled: option.disabled
+    };
+  }) || [];
+  const isYearDropdown = options && options.length > 0 && typeof options[0].value === "number" && options[0].value > 31;
+  if (isYearDropdown) {
+    selectOptions.reverse();
+  }
+  return /* @__PURE__ */ jsx22(
+    CustomSelect,
+    {
+      color: "black",
+      options: selectOptions,
+      value: value?.toString() || "",
+      onChange: handleValueChange
+    }
+  );
+}
+
+// src/components/Datepicker/styles.ts
+var datePickerStyles = globalCss({
+  ".rdp-root": {
+    "--rdp-accent-color": theme.colors.clickpalm_light,
+    "--rdp-accent-background-color": theme.colors.clickpalm_light,
+    "--rdp-day-height": "45px",
+    "--rdp-day-width": "45px",
+    "--rdp-day_button-border-radius": theme.radii.md.value,
+    "--rdp-day_button-height": "40px",
+    "--rdp-day_button-width": "40px",
+    "--rdp-selected-border": "2px solid var(--rdp-accent-color)",
+    "--rdp-disabled-opacity": "0.5",
+    "--rdp-outside-opacity": "1",
+    "--rdp-today-color": theme.colors.clickpalm_light,
+    "--rdp-nav_button-disabled-opacity": "0.5",
+    "--rdp-nav_button-height": "36px",
+    "--rdp-nav_button-width": "36px",
+    "--rdp-nav-height": "44px",
+    "--rdp-weekday-opacity": "1",
+    "--rdp-weekday-padding": "0.5rem 0",
+    "--rdp-weekday-text-align": "center",
+    "--rdp-animation_duration": "0.3s",
+    "--rdp-animation_timing": "cubic-bezier(0.4, 0, 0.2, 1)",
+    padding: theme.space[3],
+    paddingLeft: "15px"
+  },
+  ".rdp-caption_label": {
+    paddingLeft: theme.space[1],
+    textTransform: "capitalize"
+  },
+  ".rdp-nav": {
+    gap: theme.space[1]
+  },
+  ".rdp-weekday": {
+    fontFamily: theme.fonts.default,
+    fontWeight: theme.fontWeights.bold
+  },
+  ".rdp-day_button": {
+    background: theme.colors.gray_background,
+    color: theme.colors.black,
+    fontFamily: theme.fonts.default,
+    fontWeight: theme.fontWeights.bold,
+    fontSize: theme.fontSizes.md,
+    "&:hover": {
+      border: `2px solid ${theme.colors.clickpalm_light}`
+    },
+    "&:focus": {
+      border: `2px solid ${theme.colors.clickpalm_light}`,
+      outline: "none"
+    }
+  },
+  ".rdp-outside .rdp-day_button": {
+    fontFamily: theme.fonts.default,
+    background: theme.colors.gray_mid,
+    color: theme.colors.black
+  },
+  ".rdp-selected .rdp-day_button": {
+    background: theme.colors.clickpalm_light,
+    color: theme.colors.white
+  }
+  // '.rdp-caption_dropdowns': {
+  //   display: 'flex',
+  // 	gap: theme.space[2],
+  // },
+  // '.rdp-dropdown': {
+  // 	padding: '6px 8px',
+  // 	fontFamily: theme.fonts.default,
+  // 	fontSize: theme.fontSizes.sm,
+  // 	color: theme.colors.black,
+  // 	border: `1px solid ${theme.colors.gray_light}`,
+  // 	borderRadius: theme.radii.md,
+  // 	backgroundColor: theme.colors.white,
+  // 	appearance: 'none',
+  // 	backgroundRepeat: 'no-repeat',
+  // 	backgroundPosition: `right ${theme.space[2]} center`,
+  // 	backgroundSize: '1em',
+  // 	'&:focus, &:hover': {
+  // 		outline: 'none',
+  // 		borderColor: theme.colors.clickpalm_light,
+  // 	},
+  // 	'& option:checked': {
+  // 		backgroundColor: theme.colors.clickpalm_light,
+  // 		color: theme.colors.white,
+  // 	},
+  // 	'& option:hover': {
+  // 		backgroundColor: theme.colors.gray_background,
+  // 		color: theme.colors.black,
+  // 	},
+  // },
+});
+
+// src/components/Datepicker/index.tsx
+import { jsx as jsx23, jsxs as jsxs6 } from "react/jsx-runtime";
+datePickerStyles();
+var oneYearMore = new Date((/* @__PURE__ */ new Date()).getFullYear() + 1, 11);
+var Datepicker = forwardRef5(({ label, placeholder, value, onChange, onMonthChange, errorMessage, endDate = oneYearMore }, ref) => {
+  const [selected, setSelected] = useState4(void 0);
+  const [month, setMonth] = useState4(/* @__PURE__ */ new Date());
+  const [open, setOpen] = useState4(false);
+  const inputRef = useRef4(null);
+  const calendarRef = useRef4(null);
+  useImperativeHandle(ref, () => inputRef.current);
+  const handleDaySelect = (date) => {
+    setSelected(date);
+    if (date) {
+      const formatted = format2(date, "dd/MM/yyyy");
+      onChange(formatted);
+    }
+    setOpen(false);
+  };
+  const handleMonthChange = (month2) => {
+    setMonth(month2);
+    onMonthChange && onMonthChange(month2);
+  };
+  useEffect4(() => {
+    const handleClickOutside = (event) => {
+      if (calendarRef.current && !calendarRef.current.contains(event.target) && inputRef.current && !inputRef.current.contains(event.target)) {
+        setOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, []);
+  useEffect4(() => {
+    if (!open && selected) {
+      setMonth(selected);
+    }
+  }, [open, selected]);
+  const isOpenWithError = open && errorMessage ? true : false;
+  return /* @__PURE__ */ jsxs6("div", { children: [
+    /* @__PURE__ */ jsx23(
+      Input2,
+      {
+        ref: inputRef,
+        label,
+        placeholder,
+        onFocus: () => setOpen(true),
+        value: value || "",
+        readOnly: true,
+        suffix: /* @__PURE__ */ jsx23(Icon, { name: "Calendar", size: 16 }),
+        noMargin: true,
+        errorMessage: open ? "" : errorMessage,
+        redBorder: isOpenWithError
+      }
+    ),
+    open && /* @__PURE__ */ jsx23(
+      "div",
+      {
+        ref: calendarRef,
+        style: {
+          position: "absolute",
+          marginTop: "4px",
+          zIndex: 100,
+          backgroundColor: "#fff",
+          boxShadow: "0 2px 8px rgba(0,0,0,0.15)",
+          borderRadius: "8px"
+        },
+        children: /* @__PURE__ */ jsx23(
+          DayPicker2,
+          {
+            mode: "single",
+            selected,
+            onSelect: handleDaySelect,
+            month,
+            onMonthChange: handleMonthChange,
+            locale: ptBR2,
+            showOutsideDays: true,
+            captionLayout: "dropdown",
+            startMonth: new Date(1915, 0),
+            endMonth: endDate,
+            components: {
+              PreviousMonthButton: (props) => /* @__PURE__ */ jsx23(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx23(Icon, { name: "TriangleLeft", size: 16 }) }),
+              NextMonthButton: (props) => /* @__PURE__ */ jsx23(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx23(Icon, { name: "TriangleRight", size: 16 }) }),
+              Dropdown: DatePickerSelectAdapter
+            }
+          }
+        )
+      }
+    )
+  ] });
+});
+Datepicker.displayName = "Datepicker";
+
+// src/components/Hr.tsx
+import { forwardRef as forwardRef6 } from "react";
+import { jsx as jsx24 } from "react/jsx-runtime";
+var StyledHr = styled("hr", {
+  border: "none",
+  height: "1px",
+  width: "100%",
+  variants: {
+    variant: {
+      gray: {
+        backgroundColor: "$gray_mid"
+      },
+      purple: {
+        backgroundColor: "$clickpalm_light"
+      }
+    }
+  }
+});
+var Hr = forwardRef6(function Hr2({ children, ...props }, ref) {
+  return /* @__PURE__ */ jsx24(StyledHr, { ref, ...props, children });
+});
+Hr.displayName = "Hr";
+
+// src/components/Modal/index.tsx
+import * as Dialog2 from "@radix-ui/react-dialog";
+
+// src/components/Modal/styles.ts
+import * as Dialog from "@radix-ui/react-dialog";
+var StyledOverlay = styled(Dialog.Overlay, {
+  backgroundColor: "rgba(0, 0, 0, 0.5)",
+  position: "fixed",
+  inset: 0,
+  zIndex: 101
+});
+var StyledContent = styled(Dialog.Content, {
+  position: "fixed",
+  top: "50%",
+  left: "50%",
+  display: "flex",
+  flexDirection: "column",
+  padding: "0 $4",
+  width: "90%",
+  maxWidth: "600px",
+  backgroundColor: "$white",
+  borderRadius: "$md",
+  boxShadow: "0px 10px 38px -10px rgba(22, 23, 24, 0.35), 0px 10px 20px -15px rgba(22, 23, 24, 0.2)",
+  transform: "translate(-50%, -50%)",
+  zIndex: 102,
+  fontFamily: "$default",
+  fontWeight: "$regular"
+});
+var Wrapper = styled("div", {
+  display: "flex",
+  justifyContent: "space-between",
+  alignItems: "center"
+});
+var StyledTitle = styled(Dialog.Title, {
+  fontSize: "$lg",
+  fontWeight: "bold",
+  color: "$black"
+});
+var StyledClose = styled(Dialog.Close, {
+  // position: 'absolute',
+  // top: '24px',
+  // right: '16px',
+  cursor: "pointer",
+  fontSize: "18px",
+  color: "#999",
+  "&:hover": {
+    color: "#333"
+  }
+});
+var StyledDivider = styled("hr", {
+  width: "100%",
+  border: "none",
+  borderTop: "1px solid $gray_mid",
+  margin: "0px"
+});
+var StyledDescription = styled(Dialog.Description, {
+  display: "flex",
+  fontFamily: "$default",
+  fontWeight: "$regular",
+  fontSize: "$md",
+  color: "$black",
+  marginTop: "$4",
+  marginBottom: 0
+});
+var StyledChildren = styled("div", {
+  fontFamily: "$default",
+  fontWeight: "$regular",
+  fontSize: "$md",
+  color: "$black",
+  margin: "$4 0"
+});
+
+// src/components/Modal/index.tsx
+import { jsx as jsx25, jsxs as jsxs7 } from "react/jsx-runtime";
+var Modal = ({ open, onOpenChange, title, description, children }) => {
+  return /* @__PURE__ */ jsx25(Dialog2.Root, { open, onOpenChange, modal: true, children: /* @__PURE__ */ jsxs7(Dialog2.Portal, { children: [
+    /* @__PURE__ */ jsx25(StyledOverlay, {}),
+    /* @__PURE__ */ jsxs7(StyledContent, { children: [
+      /* @__PURE__ */ jsxs7(Wrapper, { children: [
+        /* @__PURE__ */ jsx25(StyledTitle, { children: title }),
+        /* @__PURE__ */ jsx25(StyledClose, { asChild: true, "aria-label": "Close", children: /* @__PURE__ */ jsx25(Button, { variant: "secondary", size: "sm", children: /* @__PURE__ */ jsx25(Icon, { name: "Closed", size: 8 }) }) })
+      ] }),
+      /* @__PURE__ */ jsx25(StyledDivider, {}),
+      /* @__PURE__ */ jsxs7("div", { children: [
+        description && /* @__PURE__ */ jsx25(StyledDescription, { children: description }),
+        /* @__PURE__ */ jsx25(StyledChildren, { children })
+      ] })
+    ] })
+  ] }) });
+};
+
+// src/components/ProgressBar/index.tsx
+import { useEffect as useEffect5, useState as useState5 } from "react";
+
+// src/components/ProgressBar/styles.ts
+import * as Progress from "@radix-ui/react-progress";
+var StyledWrapper3 = styled("div", {
+  display: "flex",
+  flexDirection: "column",
+  gap: "$2",
+  marginBottom: "$6"
+});
+var StyledRoot = styled(Progress.Root, {
+  position: "relative",
+  overflow: "hidden",
+  background: "$gray_background",
+  borderRadius: "$md",
+  border: "1px solid $gray_dark",
+  boxSizing: "border-box",
+  transform: "translateZ(0)",
+  width: "100%",
+  height: "10px"
+});
+var StyledIndicator = styled(Progress.Indicator, {
+  backgroundColor: "$ignite_light",
+  borderRadius: "$md",
+  height: "100%",
+  transition: "transform 660ms cubic-bezier(0.65, 0, 0.35, 1)",
+  transformOrigin: "left"
+});
+
+// src/components/ProgressBar/index.tsx
+import { jsx as jsx26, jsxs as jsxs8 } from "react/jsx-runtime";
+var ProgressBar = ({ label, value = 0, max = 100, ...rest }) => {
+  const [progress2, setProgress] = useState5(0);
+  useEffect5(() => {
+    const timer = setTimeout(() => setProgress(value), 500);
+    return () => clearTimeout(timer);
+  }, [value]);
+  const valueLabel = `${Math.round(progress2 / max * 100)}%`;
+  return /* @__PURE__ */ jsxs8(StyledWrapper3, { children: [
+    /* @__PURE__ */ jsx26("label", { style: { fontSize: 16, alignSelf: "flex-start", color: "black" }, children: label }),
+    /* @__PURE__ */ jsx26(
+      StyledRoot,
+      {
+        value: progress2,
+        "aria-valuetext": valueLabel,
+        ...rest,
+        children: /* @__PURE__ */ jsx26(
+          StyledIndicator,
+          {
+            style: { transform: `translateX(-${100 - progress2}%)` }
+          }
+        )
+      }
+    )
+  ] });
+};
+ProgressBar.displayName = "ProgressBar";
+
+// src/components/Radio/index.tsx
+import { forwardRef as forwardRef7 } from "react";
+
+// src/components/Radio/styles.ts
+import * as RadioGroup from "@radix-ui/react-radio-group";
+var StyledRoot2 = styled(RadioGroup.Root, {
+  display: "flex",
+  flexDirection: "column",
+  gap: "$2",
+  cursor: "pointer",
+  variants: {
+    hasError: {
+      true: {
+        marginBottom: "0px",
+        "&:focus": {
+          border: "2px solid $danger_dark"
+        }
+      },
+      false: {
+        marginBottom: "$6"
+      }
+    }
+  }
+});
+var Wrapper2 = styled("div", {
+  display: "flex",
+  alignItems: "center"
+});
+var StyledItem = styled(RadioGroup.Item, {
+  all: "unset",
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  width: "$5",
+  height: "$5",
+  borderRadius: "50%",
+  boxSizing: "border-box",
+  backgroundColor: "$clickpalm_dark",
+  '&[data-state="checked"]': {
+    backgroundColor: "$clickpalm_dark"
+  },
+  '&[data-state="unchecked"]': {
+    backgroundColor: "$white",
+    border: "2px solid $gray_dark"
+  },
+  "&:disabled": {
+    opacity: 0.5,
+    cursor: "not-allowed"
+  },
+  "&:focus": {
+    outline: "1px solid $clickpalm_light"
+  },
+  variants: {
+    hasError: {
+      true: {
+        borderColor: "$danger_dark",
+        marginBottom: "0px",
+        "&:focus": {
+          outline: "none",
+          border: "4px solid $danger_dark"
+        },
+        '&[data-state="unchecked"]': {
+          outline: "none",
+          border: "2px solid $danger_dark"
+        },
+        '&[data-state="checked"]': {
+          backgroundColor: "$danger_dark"
+        }
+      }
+    }
+  }
+});
+var StyledIndicator2 = styled(RadioGroup.Indicator, {
+  width: "$3",
+  height: "$3",
+  borderRadius: "50%",
+  backgroundColor: "$white"
+});
+var ItemLabel = styled("label", {
+  paddingLeft: "$3",
+  color: "$black",
+  cursor: "pointer"
+});
+var Span3 = styled("span", {
+  fontFamily: "$default",
+  fontWeight: "$regular",
+  fontSize: "$sm",
+  color: "$danger_dark",
+  alignSelf: "flex-start",
+  paddingLeft: "1px",
+  marginTop: "2px",
+  marginBottom: "$6"
+});
+
+// src/components/Radio/index.tsx
+import { jsx as jsx27, jsxs as jsxs9 } from "react/jsx-runtime";
+var Radio = forwardRef7(({
+  labels,
+  value,
+  onChange,
+  disabled = false,
+  required = false,
+  errorMessage
+}, ref) => {
+  return /* @__PURE__ */ jsxs9("form", { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" }, children: [
+    /* @__PURE__ */ jsx27(
+      StyledRoot2,
+      {
+        ref,
+        value,
+        onValueChange: onChange,
+        hasError: !!errorMessage,
+        disabled,
+        required,
+        loop: true,
+        children: labels.map((label, index) => /* @__PURE__ */ jsxs9(Wrapper2, { children: [
+          /* @__PURE__ */ jsx27(
+            StyledItem,
+            {
+              value: label,
+              id: `radio-${index}`,
+              "aria-label": label,
+              hasError: !!errorMessage,
+              children: /* @__PURE__ */ jsx27(StyledIndicator2, {})
+            }
+          ),
+          /* @__PURE__ */ jsx27(ItemLabel, { htmlFor: `radio-${index}`, children: label })
+        ] }, label))
+      }
+    ),
+    errorMessage && /* @__PURE__ */ jsx27(Span3, { children: errorMessage })
+  ] });
+});
+Radio.displayName = "Radio";
+
+// src/components/Spacing.tsx
+import { jsx as jsx28 } from "react/jsx-runtime";
+var spacingMap = {
+  xs: 8,
+  sm: 12,
+  md: 16,
+  lg: 24,
+  xlg: 32,
+  xxlg: 40,
+  xxxlg: 64
+};
+var Spacing = ({ size, axis = "vertical" }) => {
+  const style = axis === "vertical" ? { height: spacingMap[size], width: "100%" } : { width: spacingMap[size], height: "100%" };
+  return /* @__PURE__ */ jsx28("div", { style, "data-testid": `spacing-${size}-${axis}` });
+};
+
+// src/components/Switch/index.tsx
+import { forwardRef as forwardRef8 } from "react";
+
+// src/components/Switch/styles.ts
+import * as Switch from "@radix-ui/react-switch";
+var Wrapper3 = styled("div", {
+  all: "unset",
+  display: "flex",
+  alignItems: "center",
+  variants: {
+    hasError: {
+      true: {
+        marginBottom: "0px"
+      },
+      false: {
+        marginBottom: "$6"
+      }
+    }
+  }
+});
+var Label2 = styled("label", {
+  paddingLeft: "$3",
+  color: "$black",
+  cursor: "pointer"
+});
+var StyledRoot3 = styled(Switch.Root, {
+  border: "none",
+  outline: "none",
+  boxShadow: "none",
+  position: "relative",
+  width: "$10",
+  height: "$5",
+  padding: "0 2px",
+  borderRadius: "30px",
+  boxSizing: "border-box",
+  WebkitTapHighlightColor: "rgba(0, 0, 0, 0)",
+  cursor: "pointer",
+  '&[data-state="checked"]': {
+    backgroundColor: "$clickpalm_dark"
+  },
+  '&[data-state="unchecked"]': {
+    backgroundColor: "$white",
+    border: "1px solid $gray_dark"
+  },
+  "&:disabled": {
+    opacity: 0.5,
+    cursor: "not-allowed"
+  },
+  "&:focus": {
+    outline: "1px solid $clickpalm_light"
+  },
+  variants: {
+    hasError: {
+      true: {
+        border: "1px solid $danger_dark",
+        marginBottom: "0px",
+        "&:focus": {
+          outline: "1px solid $danger_dark"
+        },
+        '&[data-state="unchecked"]': {
+          border: "1px solid $danger_dark"
+        }
+      }
+    }
+  }
+});
+var StyledThumb = styled(Switch.Thumb, {
+  position: "absolute",
+  top: "50%",
+  left: "2px",
+  borderRadius: "$full",
+  transition: "transform 100ms",
+  transform: "translateY(-50%)",
+  willChange: "transform",
+  '[data-state="checked"] &': {
+    width: "14px",
+    height: "14px",
+    backgroundColor: "$white",
+    transform: "translate(20px, -50%)"
+  },
+  '&[data-state="unchecked"]': {
+    width: "12px",
+    height: "12px",
+    backgroundColor: "$gray_light"
+  }
+});
+var Span4 = styled("span", {
+  fontFamily: "$default",
+  fontWeight: "$regular",
+  fontSize: "$sm",
+  color: "$danger_dark",
+  alignSelf: "flex-start",
+  paddingLeft: "1px",
+  marginTop: "2px",
+  marginBottom: "$6"
+});
+
+// src/components/Switch/index.tsx
+import { jsx as jsx29, jsxs as jsxs10 } from "react/jsx-runtime";
+var Switch2 = forwardRef8(({
+  label,
+  checked,
+  defaultChecked,
+  onCheckedChange,
+  disabled = false,
+  required = false,
+  id,
+  errorMessage
+}, ref) => {
+  return /* @__PURE__ */ jsxs10("div", { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" }, children: [
+    /* @__PURE__ */ jsxs10(Wrapper3, { hasError: !!errorMessage, children: [
+      /* @__PURE__ */ jsx29(
+        StyledRoot3,
+        {
+          ref,
+          id,
+          checked,
+          defaultChecked,
+          onCheckedChange,
+          hasError: !!errorMessage,
+          disabled,
+          required,
+          children: /* @__PURE__ */ jsx29(StyledThumb, {})
+        }
+      ),
+      label && /* @__PURE__ */ jsx29(Label2, { htmlFor: id, children: label })
+    ] }),
+    errorMessage && /* @__PURE__ */ jsx29(Span4, { children: errorMessage })
+  ] });
+});
+Switch2.displayName = "Switch";
+
+// src/components/Tabs/index.tsx
+import { Children, isValidElement, useLayoutEffect, useRef as useRef5, useState as useState6 } from "react";
+
+// src/components/Tabs/styles.ts
+import * as Tabs from "@radix-ui/react-tabs";
+var TabsRoot = styled(Tabs.Root, {
+  all: "unset",
+  display: "flex",
+  flexDirection: "column",
+  width: "100%",
+  backgroundColor: "$white"
+});
+var TabsList = styled(Tabs.List, {
+  all: "unset",
+  border: "none",
+  outline: "none",
+  boxShadow: "none",
+  display: "flex",
+  gap: "$2",
+  overflowX: "auto",
+  overflowY: "hidden",
+  whiteSpace: "nowrap",
+  "::-webkit-scrollbar": { display: "none" },
+  "-ms-overflow-style": "none",
+  "scrollbar-width": "none",
+  variants: {
+    scrollable: {
+      true: {
+        flex: 1
+      },
+      false: {
+        width: "100%",
+        flexShrink: 0,
+        flex: "0 0 auto",
+        justifyContent: "space-around"
+      }
+    }
+  }
+});
+var TabsTrigger = styled(Tabs.Trigger, {
+  all: "unset",
+  border: "none",
+  outline: "none",
+  boxShadow: "none",
+  display: "flex",
+  flex: "0 0 auto",
+  alignItems: "center",
+  justifyContent: "center",
+  padding: "0 $2",
+  height: "$11",
+  fontSize: "$md",
+  lineHeight: "$base",
+  whiteSpace: "nowrap",
+  textOverflow: "ellipsis",
+  overflow: "hidden",
+  background: "$gray100",
+  backgroundImage: "linear-gradient(to bottom, $clickpalm_mid, $clickpalm_superDark)",
+  WebkitBackgroundClip: "text",
+  WebkitTextFillColor: "transparent",
+  '&[data-state="active"]': {
+    color: "$ignite_light",
+    borderBottom: "3px solid $ignite_light",
+    outline: "none"
+  }
+});
+var TabsContent = styled(Tabs.Content, {
+  padding: "$3",
+  backgroundColor: "$white",
+  outline: "none",
+  variants: {
+    colorContent: {
+      gray: { backgroundColor: "$gray_background" },
+      white: { backgroundColor: "$white" }
+    }
+  },
+  defaultVariants: {
+    colorContent: "white"
+  }
+});
+
+// src/components/Tabs/index.tsx
+import { Fragment, jsx as jsx30, jsxs as jsxs11 } from "react/jsx-runtime";
+var TabsItem = ({ children }) => {
+  return /* @__PURE__ */ jsx30(Fragment, { children });
+};
+var Tabs2 = ({ defaultValue, colorContent, children, value, onValueChange }) => {
+  const items = [];
+  const childrenArray = Children.toArray(children);
+  childrenArray.forEach((child) => {
+    if (isValidElement(child) && child.type === TabsItem) {
+      const { value: value2, label, forceMount, children: content } = child.props;
+      items.push({ value: value2, label, forceMount, children: content });
+    }
+  });
+  const listRef = useRef5(null);
+  const rootRef = useRef5(null);
+  const hasOverflowRef = useRef5(false);
+  const [hasOverflow, setHasOverflow] = useState6(false);
+  const checkOverflow = () => {
+    const listEl = listRef.current;
+    const rootEl = rootRef.current;
+    if (listEl && rootEl) {
+      const availableWidth = rootEl.clientWidth;
+      const contentWidth = listEl.scrollWidth;
+      const overflow = contentWidth > availableWidth;
+      if (overflow !== hasOverflow) {
+        hasOverflowRef.current = overflow;
+        setHasOverflow(overflow);
+      }
+      setHasOverflow(overflow);
+    }
+  };
+  useLayoutEffect(() => {
+    checkOverflow();
+    const resizeObserver = new ResizeObserver(checkOverflow);
+    if (listRef.current) {
+      resizeObserver.observe(listRef.current);
+    }
+    return () => {
+      if (listRef.current) {
+        resizeObserver.unobserve(listRef.current);
+      }
+    };
+  }, []);
+  const scroll = (direction) => {
+    if (listRef.current) {
+      const scrollAmount = 120;
+      listRef.current.scrollBy({
+        left: direction === "left" ? -scrollAmount : scrollAmount,
+        behavior: "smooth"
+      });
+    }
+  };
+  return /* @__PURE__ */ jsxs11(
+    TabsRoot,
+    {
+      defaultValue: defaultValue || items[0]?.value,
+      ref: rootRef,
+      value,
+      onValueChange,
+      children: [
+        /* @__PURE__ */ jsxs11("div", { style: { display: "flex", alignItems: "center", gap: "8px", padding: `${hasOverflow ? "0 1rem" : ""}` }, children: [
+          hasOverflow && /* @__PURE__ */ jsx30(
+            Button,
+            {
+              variant: "secondary",
+              size: "sm",
+              onClick: () => scroll("left"),
+              children: /* @__PURE__ */ jsx30(Icon, { name: "TriangleLeft", size: 64 })
+            }
+          ),
+          /* @__PURE__ */ jsx30(
+            TabsList,
+            {
+              ref: listRef,
+              scrollable: hasOverflow,
+              children: items.map((item) => /* @__PURE__ */ jsx30(
+                TabsTrigger,
+                {
+                  value: item.value,
+                  style: !hasOverflow ? { flexGrow: 1 } : { flexGrow: "0 0 auto" },
+                  children: item.label
+                },
+                `trigger-${item.value}`
+              ))
+            }
+          ),
+          hasOverflow && /* @__PURE__ */ jsx30(
+            Button,
+            {
+              variant: "secondary",
+              size: "sm",
+              onClick: () => scroll("right"),
+              children: /* @__PURE__ */ jsx30(Icon, { name: "TriangleRight", size: 64 })
+            }
+          )
+        ] }),
+        items.map((item) => /* @__PURE__ */ jsx30(
+          TabsContent,
+          {
+            colorContent,
+            value: item.value,
+            forceMount: item.forceMount || void 0,
+            children: item.children
+          },
+          `content-${item.value}`
+        ))
+      ]
+    }
+  );
+};
+Tabs2.Item = TabsItem;
+
+// src/components/TextArea.tsx
+import { forwardRef as forwardRef9, useEffect as useEffect6, useState as useState7 } from "react";
+import { jsx as jsx31, jsxs as jsxs12 } from "react/jsx-runtime";
+var Wrapper4 = styled("div", {
+  display: "flex",
+  flexDirection: "column"
+});
+var StyledLabel2 = styled("label", {
+  fontSize: "$md",
+  fontWeight: "$regular",
+  color: "$black",
+  marginBottom: "$2",
+  paddingLeft: "1px",
+  alignSelf: "flex-start"
+});
+var TextAreaElement = styled("textarea", {
+  backgroundColor: "$white",
+  padding: "$3 $4",
+  marginBottom: "$6",
+  borderRadius: "$md",
+  boxSizing: "border-box",
+  border: "1px solid $gray_mid",
+  fontFamily: "$default",
+  fontSize: "$sm",
+  color: "$black",
+  fontWeight: "$regular",
+  resize: "vertical",
+  minHeight: "100px",
+  overflowY: "auto",
+  width: "100%",
+  "&:focus": {
+    outline: 0,
+    border: "1px solid $clickpalm_light"
+  },
+  "&:disabled": {
+    opacity: 0.5,
+    cursor: "not-allowed"
+  },
+  "&::placeholder": {
+    color: "$gray_mid"
+  },
+  "&::-webkit-scrollbar": {
+    width: "6px"
+  },
+  "&::-webkit-scrollbar-track": {
+    background: "transparent",
+    borderRadius: "$md",
+    margin: "$2"
+  },
+  "&::-webkit-scrollbar-thumb": {
+    backgroundColor: "$gray_mid",
+    borderRadius: "$md",
+    border: "2px solid $white"
+  },
+  variants: {
+    hasError: {
+      true: {
+        border: "1px solid $danger",
+        marginBottom: "0px",
+        "&:focus": {
+          border: "1px solid $danger_dark"
+        }
+      }
+    },
+    hasCounter: {
+      true: {
+        marginBottom: "0px"
+      }
+    }
+  }
+});
+var Span5 = styled("span", {
+  fontFamily: "$default",
+  fontWeight: "$regular",
+  fontSize: "$sm",
+  textAlign: "left",
+  color: "$danger_dark",
+  alignSelf: "flex-start",
+  paddingLeft: "1px",
+  marginTop: "2px",
+  marginBottom: "$6",
+  flexShrink: 1,
+  wordBreak: "break-word"
+});
+var Footer2 = styled("div", {
+  display: "flex",
+  justifyContent: "space-between",
+  width: "100%",
+  gap: "$2"
+});
+var CharCounter2 = styled(Span5, {
+  fontFamily: "$default",
+  fontWeight: "$regular",
+  fontSize: "$sm",
+  color: "$gray_mid",
+  marginLeft: "auto",
+  whiteSpace: "nowrap",
+  paddingRight: "1px",
+  marginTop: "2px",
+  marginBottom: "0px",
+  variants: {
+    hasReachedMax: {
+      true: {
+        color: "$danger_dark"
+      }
+    }
+  }
+});
+var TextArea = forwardRef9(
+  ({ label, id, htmlFor, errorMessage, maxLength, showCounter = false, ...props }, ref) => {
+    const textAreaId = id || htmlFor || `textarea-${crypto.randomUUID()}`;
+    const [charCount, setCharCount] = useState7(props.value?.toString().length || 0);
+    useEffect6(() => {
+      setCharCount(props.value?.toString().length || 0);
+    }, [props.value]);
+    return /* @__PURE__ */ jsxs12(Wrapper4, { children: [
+      label && /* @__PURE__ */ jsx31(StyledLabel2, { htmlFor: textAreaId, children: label }),
+      /* @__PURE__ */ jsx31(
+        TextAreaElement,
+        {
+          id: textAreaId,
+          ...props,
+          hasError: !!errorMessage,
+          hasCounter: showCounter,
+          ref,
+          maxLength,
+          onChange: (e) => {
+            if (props.onChange) {
+              props.onChange(e);
+            }
+            setCharCount(e.target.value.length);
+          }
+        }
+      ),
+      /* @__PURE__ */ jsxs12(Footer2, { children: [
+        errorMessage && /* @__PURE__ */ jsx31(Span5, { children: errorMessage }),
+        showCounter && maxLength && /* @__PURE__ */ jsxs12(CharCounter2, { hasReachedMax: maxLength ? charCount >= maxLength : false, children: [
+          charCount,
+          "/",
+          maxLength
+        ] })
+      ] })
+    ] });
+  }
+);
+TextArea.displayName = "TextArea";
+
+// src/components/Tooltip/index.tsx
+import * as RadixTooltip2 from "@radix-ui/react-tooltip";
+
+// src/components/Tooltip/styles.ts
+import * as RadixTooltip from "@radix-ui/react-tooltip";
+var slideUpAndFade = keyframes({
+  "0%": { opacity: 0, transform: "translateY(2px)" },
+  "100%": { opacity: 1, transform: "translateY(0)" }
+});
+var slideDownAndFade = keyframes({
+  "0%": { opacity: 0, transform: "translateY(-2px)" },
+  "100%": { opacity: 1, transform: "translateY(0)" }
+});
+var slideLeftAndFade = keyframes({
+  "0%": { opacity: 0, transform: "translateX(2px)" },
+  "100%": { opacity: 1, transform: "translateX(0)" }
+});
+var slideRightAndFade = keyframes({
+  "0%": { opacity: 0, transform: "translateX(-2px)" },
+  "100%": { opacity: 1, transform: "translateX(0)" }
+});
+var TooltipTrigger = RadixTooltip.Trigger;
+var TooltipContent = styled(RadixTooltip.Content, {
+  borderRadius: "$sm",
+  border: "2px solid $gray_background",
+  padding: "$2 $4",
+  fontSize: "$sm",
+  lineHeight: "1",
+  color: "$black",
+  backgroundColor: "$white",
+  boxShadow: "0px 4px 10px rgba(0, 0, 0, 0.2)",
+  zIndex: 50,
+  maxWidth: "200px",
+  whiteSpace: "normal",
+  wordBreak: "break-word",
+  textAlign: "left",
+  "@media (prefers-reduced-motion: no-preference)": {
+    animationDuration: "200ms",
+    animationTimingFunction: "cubic-bezier(0.16, 1, 0.3, 1)",
+    willChange: "transform, opacity",
+    '&[data-state="delayed-open"][data-side="top"]': { animationName: slideDownAndFade },
+    '&[data-state="delayed-open"][data-side="right"]': { animationName: slideLeftAndFade },
+    '&[data-state="delayed-open"][data-side="bottom"]': { animationName: slideUpAndFade },
+    '&[data-state="delayed-open"][data-side="left"]': { animationName: slideRightAndFade }
+  }
+});
+var TooltipArrow = styled(RadixTooltip.Arrow, {
+  fill: "$gray_background"
+});
+
+// src/components/Tooltip/index.tsx
+import { useState as useState8, useEffect as useEffect7 } from "react";
+import { jsx as jsx32, jsxs as jsxs13 } from "react/jsx-runtime";
+var Tooltip = ({
+  content,
+  children,
+  side = "top",
+  sideOffset = 5,
+  open: controlledOpen,
+  onOpenChange,
+  delayDuration = 100
+}) => {
+  const [uncontrolledOpen, setUncontrolledOpen] = useState8(false);
+  const [isTouchDevice, setIsTouchDevice] = useState8(false);
+  useEffect7(() => {
+    setIsTouchDevice("ontouchstart" in window || navigator.maxTouchPoints > 0);
+  }, []);
+  const open = controlledOpen ?? uncontrolledOpen;
+  const setOpen = onOpenChange ?? setUncontrolledOpen;
+  const handleClick = (event) => {
+    if (isTouchDevice) {
+      event.preventDefault();
+      setOpen(!open);
+    }
+  };
+  return /* @__PURE__ */ jsx32(RadixTooltip2.Provider, { children: /* @__PURE__ */ jsxs13(RadixTooltip2.Root, { open, onOpenChange: setOpen, delayDuration, children: [
+    /* @__PURE__ */ jsx32(TooltipTrigger, { asChild: true, onClick: handleClick, children }),
+    /* @__PURE__ */ jsxs13(TooltipContent, { side, sideOffset, children: [
+      content,
+      /* @__PURE__ */ jsx32(TooltipArrow, {})
+    ] })
+  ] }) });
+};
+Tooltip.displayName = "Tooltip";
+
+// src/components/Loader/style.ts
+var Content4 = styled("div", {
+  position: "relative",
+  height: "100%",
+  width: "100%",
+  minHeight: "inherit",
+  top: 0,
+  left: 0,
+  backgroundColor: "YellowGreen"
+});
+var Overlay2 = styled("div", {
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  backgroundColor: "rgba(255, 255, 255, 0.6)",
+  zIndex: 999,
+  transition: "opacity 0.3s ease-in-out",
+  variants: {
+    show: {
+      true: {
+        opacity: 1,
+        pointerEvents: "auto"
+      },
+      false: {
+        opacity: 0,
+        pointerEvents: "none"
+      }
+    },
+    fullscreen: {
+      true: {
+        position: "fixed",
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0
+      },
+      false: {
+        position: "absolute",
+        top: 0,
+        left: 0,
+        width: "100%",
+        height: "100%"
+      }
+    }
+  }
+});
+var SpinnerContainer = styled("div", {
+  position: "relative"
+});
+var rotation = keyframes({
+  "0%": { transform: "rotate(0deg)" },
+  "100%": { transform: "rotate(360deg)" }
+});
+var Spinner = styled("span", {
+  width: "$19",
+  height: "$19",
+  borderRadius: "50%",
+  display: "inline-block",
+  borderTop: "6px solid $ignite_light",
+  borderRight: "6px solid transparent",
+  boxSizing: "border-box",
+  animation: `${rotation} 1s linear infinite`,
+  "&::after": {
+    content: '""',
+    boxSizing: "border-box",
+    position: "absolute",
+    left: 0,
+    top: 0,
+    width: "$19",
+    height: "$19",
+    borderRadius: "50%",
+    borderLeft: "6px solid $clickpalm_light",
+    borderBottom: "6px solid transparent",
+    animation: `${rotation} 0.5s linear infinite reverse`
+  }
+});
+
+// src/components/Loader/index.tsx
+import { jsx as jsx33 } from "react/jsx-runtime";
+var Loader = ({ show, fullscreen = false }) => {
+  return /* @__PURE__ */ jsx33(Overlay2, { show, fullscreen, children: /* @__PURE__ */ jsx33(SpinnerContainer, { children: /* @__PURE__ */ jsx33(Spinner, {}) }) });
+};
+Loader.displayName = "Loader";
+
+// src/components/MaskedInput/index.tsx
+import { forwardRef as forwardRef10, useState as useState9, useRef as useRef6 } from "react";
+
+// src/components/MaskedInput/utils.ts
+var MAX_LENGTHS = {
+  cellPhone: 15,
+  homePhone: 14,
+  cep: 9,
+  cpf: 14,
+  cnpj: 18,
+  date: 10
+};
+var applyMask = (value, maskType) => {
+  const digits = value.replace(/\D/g, "");
+  const maxLength = MAX_LENGTHS[maskType];
+  if (digits.length > maxLength) {
+    return value.slice(0, -1);
+  }
+  switch (maskType) {
+    case "cellPhone":
+      if (digits.length <= 2)
+        return digits;
+      if (digits.length <= 7)
+        return `(${digits.slice(0, 2)}) ${digits.slice(2)}`;
+      return `(${digits.slice(0, 2)}) ${digits.slice(2, 7)}-${digits.slice(7, 11)}`;
+    case "homePhone":
+      if (digits.length <= 2)
+        return digits;
+      if (digits.length <= 6)
+        return `(${digits.slice(0, 2)}) ${digits.slice(2)}`;
+      return `(${digits.slice(0, 2)}) ${digits.slice(2, 6)}-${digits.slice(6, 10)}`;
+    case "cep":
+      if (digits.length <= 5)
+        return digits;
+      return `${digits.slice(0, 5)}-${digits.slice(5, 8)}`;
+    case "cpf":
+      if (digits.length <= 3)
+        return digits;
+      if (digits.length <= 6)
+        return `${digits.slice(0, 3)}.${digits.slice(3)}`;
+      if (digits.length <= 9)
+        return `${digits.slice(0, 3)}.${digits.slice(3, 6)}.${digits.slice(6)}`;
+      return `${digits.slice(0, 3)}.${digits.slice(3, 6)}.${digits.slice(6, 9)}-${digits.slice(9, 11)}`;
+    case "cnpj":
+      if (digits.length <= 2)
+        return digits;
+      if (digits.length <= 5)
+        return `${digits.slice(0, 2)}.${digits.slice(2)}`;
+      if (digits.length <= 8)
+        return `${digits.slice(0, 2)}.${digits.slice(2, 5)}.${digits.slice(5)}`;
+      if (digits.length <= 12)
+        return `${digits.slice(0, 2)}.${digits.slice(2, 5)}.${digits.slice(5, 8)}/${digits.slice(8)}`;
+      return `${digits.slice(0, 2)}.${digits.slice(2, 5)}.${digits.slice(5, 8)}/${digits.slice(8, 12)}-${digits.slice(12, 14)}`;
+    case "date":
+      if (digits.length <= 2)
+        return digits;
+      if (digits.length <= 4)
+        return `${digits.slice(0, 2)}/${digits.slice(2)}`;
+      return `${digits.slice(0, 2)}/${digits.slice(2, 4)}/${digits.slice(4, 8)}`;
+    default:
+      return value;
+  }
+};
+
+// src/components/MaskedInput/index.tsx
+import { jsx as jsx34 } from "react/jsx-runtime";
+var MaskedInput = forwardRef10(
+  ({ maskType, onChange, ...props }, ref) => {
+    const [value, setValue] = useState9("");
+    const inputRef = useRef6(null);
+    const handleChange = (e) => {
+      const { value: inputValue, selectionStart } = e.target;
+      const isBackspace = value.length > inputValue.length;
+      const rawValue = inputValue.replace(/\D/g, "");
+      const maskedValue = applyMask(rawValue, maskType);
+      setValue(maskedValue);
+      if (inputRef.current && selectionStart !== null) {
+        let newCursorPos = selectionStart;
+        if (isBackspace && value.length > 0) {
+          const prevChar = value[selectionStart || 0];
+          if (prevChar && !/\d/.test(prevChar)) {
+            newCursorPos = Math.max(0, (selectionStart || 0) - 1);
+          }
+        }
+        setTimeout(() => {
+          if (inputRef.current) {
+            inputRef.current.setSelectionRange(newCursorPos, newCursorPos);
+          }
+        }, 0);
+      }
+      if (onChange) {
+        const syntheticEvent = {
+          ...e,
+          target: {
+            ...e.target,
+            value: maskedValue,
+            rawValue
+          }
+        };
+        onChange(syntheticEvent);
+      }
+    };
+    return /* @__PURE__ */ jsx34(
+      Input2,
+      {
+        ...props,
+        ref,
+        value,
+        onChange: handleChange,
+        maxLength: MAX_LENGTHS[maskType]
+      }
+    );
+  }
+);
+MaskedInput.displayName = "MaskedInput";
+
+// src/components/Dropdown/index.tsx
+import React3, { Children as Children2, Fragment as Fragment2 } from "react";
+import * as DropdownMenu2 from "@radix-ui/react-dropdown-menu";
+
+// src/components/Dropdown/styles.ts
+import * as DropdownMenu from "@radix-ui/react-dropdown-menu";
+var slideUpAndFade2 = keyframes({
+  "0%": { opacity: 0, transform: "translateY(2px)" },
+  "100%": { opacity: 1, transform: "translateY(0)" }
+});
+var slideRightAndFade2 = keyframes({
+  "0%": { opacity: 0, transform: "translateX(-2px)" },
+  "100%": { opacity: 1, transform: "translateX(0)" }
+});
+var slideDownAndFade2 = keyframes({
+  "0%": { opacity: 0, transform: "translateY(-2px)" },
+  "100%": { opacity: 1, transform: "translateY(0)" }
+});
+var slideLeftAndFade2 = keyframes({
+  "0%": { opacity: 0, transform: "translateX(2px)" },
+  "100%": { opacity: 1, transform: "translateX(0)" }
+});
+var StyledContent2 = styled(DropdownMenu.Content, {
+  minWidth: 100,
+  backgroundColor: "$white",
+  borderRadius: "$md",
+  padding: "$2",
+  boxShadow: "0px 10px 38px -10px rgba(22, 23, 24, 0.35), 0px 10px 20px -15px rgba(22, 23, 24, 0.2)",
+  animationDuration: "400ms",
+  animationTimingFunction: "cubic-bezier(0.16, 1, 0.3, 1)",
+  willChange: "transform, opacity",
+  '&[data-state="open"]': {
+    '&[data-side="top"]': { animationName: slideDownAndFade2 },
+    '&[data-side="right"]': { animationName: slideLeftAndFade2 },
+    '&[data-side="bottom"]': { animationName: slideUpAndFade2 },
+    '&[data-side="left"]': { animationName: slideRightAndFade2 }
+  }
+});
+var itemStyles = {
+  all: "unset",
+  fontFamily: "$default",
+  fontSize: "$sm",
+  fontWeights: "$regular",
+  lineHeight: 1,
+  color: "$black",
+  borderRadius: "$sm",
+  display: "flex",
+  alignItems: "center",
+  height: 25,
+  padding: "0 $2",
+  position: "relative",
+  paddingLeft: "$5",
+  userSelect: "none",
+  "&[data-disabled]": {
+    color: "$gray_mid",
+    pointerEvents: "none"
+  },
+  "&[data-highlighted]": {
+    color: "$clickpalm_light",
+    cursor: "pointer"
+  },
+  button: {
+    all: "unset",
+    width: "100%",
+    textAlign: "left"
+  }
+};
+var StyledItem2 = styled(DropdownMenu.Item, { ...itemStyles });
+var StyledSeparator = styled(DropdownMenu.Separator, {
+  height: "1px",
+  backgroundColor: "$gray_light",
+  margin: "$2"
+});
+var IconButton = styled("button", {
+  all: "unset",
+  fontFamily: "inherit",
+  borderRadius: "100%",
+  height: 35,
+  width: 35,
+  display: "inline-flex",
+  alignItems: "center",
+  justifyContent: "center",
+  color: "$clickpalm_light",
+  backgroundColor: "transparent"
+});
+
+// src/components/Dropdown/index.tsx
+import { jsx as jsx35, jsxs as jsxs14 } from "react/jsx-runtime";
+var Dropdown = ({ children }) => {
+  const childrenArray = Children2.toArray(children);
+  return /* @__PURE__ */ jsxs14(DropdownMenu2.Root, { modal: false, children: [
+    /* @__PURE__ */ jsx35(DropdownMenu2.Trigger, { asChild: true, children: /* @__PURE__ */ jsx35(Button, { variant: "secondary", size: "sm", children: /* @__PURE__ */ jsx35(Icon, { name: "Dots", size: 16 }) }) }),
+    /* @__PURE__ */ jsx35(DropdownMenu2.Portal, { children: /* @__PURE__ */ jsx35(StyledContent2, { sideOffset: 5, align: "end", children: childrenArray.map((child, index) => /* @__PURE__ */ jsxs14(Fragment2, { children: [
+      child,
+      index < childrenArray.length - 1 && /* @__PURE__ */ jsx35(DropdownSeparator, {})
+    ] }, index)) }) })
+  ] });
+};
+var DropdownSeparator = StyledSeparator;
+var DropdownItem = React3.forwardRef(({ children, ...props }, forwardedRef) => {
+  return /* @__PURE__ */ jsx35(StyledItem2, { ...props, ref: forwardedRef, children });
+});
+Dropdown.displayName = "Dropdown";
+DropdownItem.displayName = "DropdownItem";
+DropdownSeparator.displayName = "DropdownSeparator";
+
+// src/components/Box.tsx
+import { jsx as jsx36 } from "react/jsx-runtime";
+var StyledBox = styled("div", {
+  padding: "$5",
+  borderRadius: "$md",
+  textAlign: "center",
+  marginBottom: "$6",
+  variants: {
+    variant: {
+      gray: {
+        backgroundColor: "$gray_background",
+        boxShadow: "0 1px 2px $colors$gray_dark"
+      },
+      white: {
+        backgroundColor: "$white"
+      }
+    }
+  },
+  defaultVariants: {
+    variant: "gray"
+  }
+});
+var Box = (props) => {
+  return /* @__PURE__ */ jsx36(StyledBox, { ...props });
+};
+Box.displayName = "Box";
+
+// src/components/Paragraph.tsx
+import { jsx as jsx37 } from "react/jsx-runtime";
+var StyledParagraph = styled("p", {
+  fontFamily: "$default",
+  lineHeight: "$short",
+  color: "$black",
+  margin: 0,
+  variants: {
+    size: {
+      xxs: { fontSize: "$xxs" },
+      xs: { fontSize: "$xs" },
+      sm: { fontSize: "$sm" },
+      md: { fontSize: "$md" },
+      lg: { fontSize: "$lg" },
+      xl: { fontSize: "$xl" },
+      "2xl": { fontSize: "$2xl" },
+      "4xl": { fontSize: "$4xl" },
+      "5xl": { fontSize: "$5xl" },
+      "6xl": { fontSize: "$6xl" },
+      "7xl": { fontSize: "$7xl" },
+      "8xl": { fontSize: "$8xl" },
+      "9xl": { fontSize: "$9xl" }
+    },
+    weight: {
+      regular: { fontWeight: "$regular" },
+      medium: { fontWeight: "$medium" },
+      bold: { fontWeight: "$bold" }
+    },
+    lineHeight: {
+      regular: { lineHeight: "$regular" },
+      shorter: { lineHeight: "$shorter" },
+      short: { lineHeight: "$short" },
+      base: { lineHeight: "$base" },
+      tall: { lineHeight: "$tall" }
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    weight: "regular",
+    lineHeight: "short"
+  }
+});
+var Paragraph = (props) => {
+  return /* @__PURE__ */ jsx37(StyledParagraph, { ...props });
+};
+Paragraph.displayName = "Paragraph";
+
+// src/components/Heading.tsx
+import { forwardRef as forwardRef11 } from "react";
+import { jsx as jsx38 } from "react/jsx-runtime";
+var StyledHeading = styled("h2", {
+  fontFamily: "$default",
+  lineHeight: "$shorter",
+  margin: "1px",
+  color: "$black",
+  fontWeight: "$regular",
+  variants: {
+    size: {
+      sm: { fontSize: "$xl" },
+      md: { fontSize: "$2xl" },
+      lg: { fontSize: "$4xl" },
+      "2xl": { fontSize: "$5xl" },
+      "3xl": { fontSize: "$6xl" },
+      "4xl": { fontSize: "$7xl" },
+      "5xl": { fontSize: "$8xl" },
+      "6xl": { fontSize: "$9xl" }
+    },
+    bold: {
+      true: {
+        fontWeight: "$bold"
+      },
+      false: {
+        fontWeight: "$regular"
+      }
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var Heading = forwardRef11(
+  function Heading2({ children, bold = false, ...props }, ref) {
+    return /* @__PURE__ */ jsx38(StyledHeading, { ref, bold, ...props, children });
+  }
+);
+Heading.displayName = "Heading";
+
+// src/components/Select/index.tsx
+import { TriangleDownIcon, TriangleUpIcon } from "@radix-ui/react-icons";
+import * as CustomSelect2 from "@radix-ui/react-select";
+import { forwardRef as forwardRef12, useState as useState10 } from "react";
+
+// src/components/Select/styles.ts
+import * as Select from "@radix-ui/react-select";
+var StyledWrapper4 = styled("div", {
+  display: "flex",
+  flexDirection: "column",
+  fontFamily: "$default"
+});
+var Label3 = styled("label", {
+  fontSize: "$md",
+  fontWeight: "$regular",
+  alignSelf: "flex-start",
+  marginBottom: "$2",
+  paddingLeft: "1px",
+  color: "$black"
+});
+var StyledTrigger = styled(Select.Trigger, {
+  all: "unset",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "space-between",
+  marginBottom: "$6",
+  padding: "0.92rem $4",
+  boxSizing: "border-box",
+  borderRadius: "$md",
+  border: "1px solid $gray_mid",
+  fontSize: "$md",
+  backgroundColor: "white",
+  cursor: "pointer",
+  color: "$black",
+  "&[data-placeholder]": {
+    color: "$gray_mid"
+  },
+  "&[data-highlighted], &:focus, &:hover": {
+    outline: "none",
+    border: "1px solid $clickpalm_light"
+  },
+  "&:disabled": {
+    opacity: 0.5,
+    cursor: "not-allowed"
+  },
+  variants: {
+    hasError: {
+      true: {
+        border: "1px solid $danger_dark",
+        marginBottom: "0px",
+        "&[data-highlighted], &:focus, &:hover": {
+          outline: "none",
+          border: "1px solid $danger_dark"
+        }
+      }
+    }
+  }
+});
+var StyledContent3 = styled(Select.Content, {
+  overflow: "hidden",
+  backgroundColor: "$gray_background",
+  borderRadius: "$md",
+  boxShadow: "0px 4px 6px rgba(0, 0, 0, 0.1)",
+  zIndex: 103,
+  width: "var(--radix-select-trigger-width)",
+  maxHeight: "var(--radix-select-content-available-height)",
+  fontFamily: "$default",
+  fontSize: "$md",
+  fontWeight: "$regular"
+});
+var StyledViewport = styled(Select.Viewport, {
+  padding: "4px",
+  fontFamily: "$default",
+  fontSize: "$md",
+  fontWeight: "$regular"
+});
+var StyledItem3 = styled(Select.Item, {
+  position: "relative",
+  fontFamily: "$default",
+  fontSize: "$md",
+  fontWeight: "$regular",
+  padding: "14px 12px",
+  color: "$black",
+  cursor: "pointer",
+  "&[data-highlighted], &:focus, &:hover": {
+    outline: "none",
+    color: "$clickpalm_light"
+  },
+  "&:not(:last-child)::after": {
+    content: '""',
+    position: "absolute",
+    bottom: 0,
+    left: "$3",
+    right: "$3",
+    height: "1px",
+    backgroundColor: "$gray_light"
+  }
+});
+var StyledItemText = styled(Select.ItemText, {
+  fontFamily: "$default",
+  fontSize: "$md",
+  fontWeight: "$regular"
+});
+var StyledIcon = styled(Select.Icon, {
+  display: "flex",
+  alignItems: "center",
+  color: "$black",
+  transition: "transform 0.4s ease",
+  variants: {
+    open: {
+      true: {
+        transform: "rotate(180deg)"
+      },
+      false: {
+        transform: "rotate(0deg)"
+      }
+    }
+  },
+  svg: {
+    width: 26,
+    height: 26
+  }
+});
+var Span6 = styled("span", {
+  fontFamily: "$default",
+  fontWeight: "$regular",
+  fontSize: "$sm",
+  color: "$danger_dark",
+  alignSelf: "flex-start",
+  paddingLeft: "1px",
+  marginTop: "2px",
+  marginBottom: "$6"
+});
+
+// src/components/Select/index.tsx
+import { jsx as jsx39, jsxs as jsxs15 } from "react/jsx-runtime";
+var Select2 = forwardRef12(
+  ({
+    value,
+    onValueChange,
+    items,
+    placeholder = "Selecione",
+    label,
+    errorMessage,
+    css: css2,
+    className,
+    style,
+    ...rest
+  }, ref) => {
+    const [open, setOpen] = useState10(false);
+    return /* @__PURE__ */ jsxs15(StyledWrapper4, { css: css2, className, style, children: [
+      label && /* @__PURE__ */ jsx39(Label3, { children: label }),
+      /* @__PURE__ */ jsxs15(
+        CustomSelect2.Root,
+        {
+          value,
+          onValueChange,
+          onOpenChange: setOpen,
+          ...rest,
+          children: [
+            /* @__PURE__ */ jsxs15(StyledTrigger, { "aria-label": label, hasError: !!errorMessage, ref, children: [
+              /* @__PURE__ */ jsx39(CustomSelect2.Value, { placeholder }),
+              /* @__PURE__ */ jsx39(StyledIcon, { open, children: /* @__PURE__ */ jsx39(TriangleDownIcon, {}) })
+            ] }),
+            errorMessage && /* @__PURE__ */ jsx39(Span6, { children: errorMessage }),
+            /* @__PURE__ */ jsx39(CustomSelect2.Portal, { children: /* @__PURE__ */ jsxs15(StyledContent3, { side: "bottom", align: "start", position: "popper", children: [
+              /* @__PURE__ */ jsx39(CustomSelect2.ScrollUpButton, { children: /* @__PURE__ */ jsx39(TriangleUpIcon, {}) }),
+              /* @__PURE__ */ jsx39(StyledViewport, { children: items.map((item) => /* @__PURE__ */ jsx39(StyledItem3, { value: item.value, children: /* @__PURE__ */ jsx39(StyledItemText, { children: item.label }) }, item.value)) }),
+              /* @__PURE__ */ jsx39(CustomSelect2.ScrollDownButton, { children: /* @__PURE__ */ jsx39(TriangleDownIcon, {}) })
+            ] }) })
+          ]
+        }
+      )
+    ] });
+  }
+);
+Select2.displayName = "Select";
+
+// src/components/LabelledValue/index.tsx
+import {
+  Children as Children3,
+  cloneElement,
+  isValidElement as isValidElement2
+} from "react";
+
+// src/components/LabelledValue/styles.ts
+var Container = styled("div", {
+  display: "flex",
+  fontWeight: "$regular",
+  fontSize: "$md",
+  fontFamily: "$default",
+  variants: {
+    position: {
+      vertical: {
+        flexDirection: "column",
+        gap: "$5"
+      },
+      horizontal: {
+        flexDirection: "column",
+        flexWrap: "wrap",
+        gap: "$3"
+      }
+    }
+  }
+});
+var ItemWrapper = styled("div", {
+  display: "flex",
+  alignItems: "center",
+  fontWeight: "$regular",
+  fontSize: "$md",
+  fontFamily: "$default",
+  variants: {
+    position: {
+      vertical: {
+        flexDirection: "column",
+        alignItems: "flex-start"
+      },
+      horizontal: {
+        paddingBottom: "$2",
+        flexDirection: "row",
+        alignItems: "center",
+        justifyContent: "space-between",
+        borderBottom: "1px solid $gray_mid"
+      }
+    },
+    withRow: {
+      true: {
+        paddingBottom: "$2",
+        borderBottom: "1px solid $gray_mid"
+      }
+    }
+  }
+});
+var Label4 = styled("div", {
+  fontWeight: "$regular",
+  fontSize: "$md",
+  fontFamily: "$default",
+  color: "$black",
+  whiteSpace: "nowrap"
+});
+var Value2 = styled("div", {
+  fontWeight: "$bold",
+  fontSize: "$md",
+  fontFamily: "$default",
+  color: "$black",
+  textAlign: "right",
+  wordBreak: "break-word",
+  maxWidth: "100%",
+  flex: 1
+});
+
+// src/components/LabelledValue/index.tsx
+import { jsx as jsx40, jsxs as jsxs16 } from "react/jsx-runtime";
+function LabelledValue({ position = "vertical", withRow = false, children }) {
+  return /* @__PURE__ */ jsx40(Container, { position, children: Children3.map(children, (child) => {
+    if (isValidElement2(child)) {
+      return cloneElement(child, { position, withRow });
+    }
+    return child;
+  }) });
+}
+function Item4({ label, value, position = "vertical", withRow = false }) {
+  return /* @__PURE__ */ jsxs16(ItemWrapper, { position, withRow, children: [
+    /* @__PURE__ */ jsx40(Label4, { children: label }),
+    /* @__PURE__ */ jsx40(Value2, { children: value })
+  ] });
+}
+LabelledValue.Item = Item4;
+
+// src/components/OneTimePassword/index.tsx
+import * as OneTimePasswordField2 from "@radix-ui/react-one-time-password-field";
+
+// src/components/OneTimePassword/styles.ts
+import * as OneTimePasswordField from "@radix-ui/react-one-time-password-field";
+var Container2 = styled("div", {
+  display: "flex",
+  flexDirection: "column",
+  justifyContent: "center",
+  alignItems: "center",
+  marginBottom: "$6",
+  width: "100%"
+});
+var StyledWrapper5 = styled("div", {
+  display: "flex",
+  flexDirection: "column"
+});
+var StyledRoot4 = styled(OneTimePasswordField.Root, {
+  display: "grid",
+  gap: "$2",
+  gridTemplateColumns: "repeat(var(--otp-length), 1fr)",
+  width: "100%"
+});
+var StyledLabel3 = styled(OneTimePasswordField.Root, {
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  marginBottom: "$5",
+  color: "$black"
+});
+var StyledInput = styled(OneTimePasswordField.Input, {
+  all: "unset",
+  gap: "1rem",
+  display: "inline-flex",
+  alignItems: "center",
+  justifyContent: "center",
+  textAlign: "center",
+  boxSizing: "border-box",
+  borderRadius: "$md",
+  borderStyle: "solid",
+  borderColor: "$gray_mid",
+  borderWidth: "3px",
+  fontSize: "$md",
+  color: "$black",
+  padding: "0",
+  width: "100%",
+  aspectRatio: "1 / 1",
+  maxWidth: "53px",
+  "&:hover": {
+    borderColor: "$gray_dark"
+  },
+  "&:focus": {
+    borderColor: "$clickpalm_mid"
+  }
+});
+var Span7 = styled("span", {
+  fontFamily: "$default",
+  fontWeight: "$regular",
+  fontSize: "$sm",
+  color: "$danger_dark",
+  alignSelf: "flex-start",
+  paddingLeft: "1px",
+  marginTop: "2px",
+  marginBottom: "$6"
+});
+
+// src/components/OneTimePassword/index.tsx
+import { jsx as jsx41, jsxs as jsxs17 } from "react/jsx-runtime";
+var OneTimePassword = ({ label, length, value, errorMessage, onValueChange, ...rootProps }) => {
+  return /* @__PURE__ */ jsx41(Container2, { children: /* @__PURE__ */ jsxs17(StyledWrapper5, { children: [
+    /* @__PURE__ */ jsx41(StyledLabel3, { children: label }),
+    /* @__PURE__ */ jsxs17(
+      StyledRoot4,
+      {
+        value,
+        onValueChange,
+        ...rootProps,
+        style: { "--otp-length": length },
+        children: [
+          Array.from({ length }).map((_, index) => /* @__PURE__ */ jsx41(StyledInput, {}, index)),
+          /* @__PURE__ */ jsx41(OneTimePasswordField2.HiddenInput, {})
+        ]
+      }
+    ),
+    errorMessage && /* @__PURE__ */ jsx41(Span7, { children: errorMessage })
+  ] }) });
+};
+OneTimePassword.displayName = "OneTimePasswordInput";
+
+// src/components/Toast/index.tsx
+import * as ToastPrimitive2 from "@radix-ui/react-toast";
+import * as React4 from "react";
+
+// src/components/Toast/styles.ts
+import * as ToastPrimitive from "@radix-ui/react-toast";
+var hide = keyframes({
+  from: { opacity: 1 },
+  to: { opacity: 0 }
+});
+var slideIn2 = keyframes({
+  from: { transform: "translateX(calc(100% + 25px))" },
+  to: { transform: "translateX(0)" }
+});
+var swipeOut = keyframes({
+  from: { transform: "translateX(var(--radix-toast-swipe-end-x))" },
+  to: { transform: "translateX(calc(100% + 25px))" }
+});
+var ToastRoot = styled(ToastPrimitive.Root, {
+  position: "relative",
+  display: "flex",
+  justifyContent: "space-between",
+  alignItems: "center",
+  flexWrap: "nowrap",
+  gap: "$2",
+  width: "100%",
+  boxSizing: "border-box",
+  borderRadius: "$md",
+  padding: "$4 $6",
+  color: "$black",
+  fontSize: "$md",
+  boxShadow: "0 2px 10px rgba(0,0,0,0.1)",
+  '&[data-state="open"]': {
+    animation: `${slideIn2} 150ms cubic-bezier(0.16, 1, 0.3, 1)`
+  },
+  '&[data-state="closed"]': {
+    animation: `${hide} 100ms ease-in`
+  },
+  '&[data-swipe="move"]': {
+    transform: "translateX(var(--radix-toast-swipe-move-x))"
+  },
+  '&[data-swipe="cancel"]': {
+    transform: "translateX(0)",
+    transition: "transform 200ms ease-out"
+  },
+  '&[data-swipe="end"]': {
+    animation: `${swipeOut} 100ms ease-out`
+  },
+  variants: {
+    variant: {
+      success: { backgroundColor: "$success" },
+      warning: { backgroundColor: "$warning" },
+      error: { backgroundColor: "$danger" }
+    }
+  }
+});
+var ToastAction = styled(ToastPrimitive.Action, {
+  marginLeft: "auto",
+  background: "transparent",
+  border: "none",
+  cursor: "pointer"
+});
+var ToastContent = styled("div", {
+  display: "flex",
+  flexDirection: "column",
+  gap: "$1",
+  width: "100%",
+  alignItems: "flex-start",
+  "@lg": {
+    justifyContent: "space-between",
+    alignItems: "center",
+    flexDirection: "row"
+  }
+});
+var ToastTitle = styled("strong", {
+  fontWeight: "$bold",
+  display: "block"
+});
+var ToastDescription = styled("span", {
+  marginRight: "$6",
+  display: "block"
+});
+var ToastViewport = styled(ToastPrimitive.Viewport, {
+  position: "fixed",
+  top: "110px",
+  left: "50%",
+  transform: "translateX(-50%)",
+  display: "flex",
+  flexDirection: "column",
+  justifyContent: "flex-start",
+  alignItems: "center",
+  padding: 0,
+  margin: "0 auto",
+  gap: "$2",
+  width: "79%",
+  listStyle: "none",
+  outline: "none",
+  zIndex: 9999,
+  "@lg": {
+    maxWidth: "700px"
+  }
+});
+var progress = keyframes({
+  from: { width: "100%" },
+  to: { width: "0%" }
+});
+var ToastProgress = styled("div", {
+  position: "absolute",
+  bottom: 0,
+  left: 0,
+  height: "6px",
+  width: "90%",
+  justifyContent: "center",
+  borderBottomLeftRadius: "$full",
+  borderBottomRightRadius: "$full",
+  backgroundColor: "$clickpalm_light",
+  animationTimingFunction: "linear",
+  animation: `${progress} 6s linear`,
+  animationFillMode: "forwards",
+  variants: {
+    paused: {
+      true: {
+        animationPlayState: "paused"
+      },
+      false: {
+        animationPlayState: "running"
+      }
+    },
+    variant: {
+      success: { backgroundColor: "$success_dark" },
+      warning: { backgroundColor: "$warning_dark" },
+      error: { backgroundColor: "$danger_dark" }
+    }
+  }
+});
+
+// src/components/Toast/toast.ts
+var subscribers = [];
+var toastImpl = {
+  success(title, description) {
+    publish({ id: crypto.randomUUID(), variant: "success", title, description });
+  },
+  warning(title, description) {
+    publish({ id: crypto.randomUUID(), variant: "warning", title, description });
+  },
+  error(title, description) {
+    publish({ id: crypto.randomUUID(), variant: "error", title, description });
+  },
+  _subscribe(fn) {
+    subscribers.push(fn);
+  },
+  _unsubscribe(fn) {
+    subscribers = subscribers.filter((sub) => sub !== fn);
+  }
+};
+function publish(msg) {
+  subscribers.forEach((fn) => fn(msg));
+}
+var toast = {
+  success: toastImpl.success,
+  warning: toastImpl.warning,
+  error: toastImpl.error
+};
+
+// src/components/Toast/index.tsx
+import { jsx as jsx42, jsxs as jsxs18 } from "react/jsx-runtime";
+var Toast = () => {
+  const [messages, setMessages] = React4.useState([]);
+  const [paused, setPaused] = React4.useState(false);
+  React4.useEffect(() => {
+    const handleNewToast = (msg) => {
+      setMessages((prev) => [...prev, msg]);
+    };
+    toastImpl._subscribe(handleNewToast);
+    return () => {
+      toastImpl._unsubscribe(handleNewToast);
+    };
+  }, []);
+  const removeToast = (id) => {
+    setMessages((prev) => prev.filter((msg) => msg.id !== id));
+  };
+  return /* @__PURE__ */ jsxs18(ToastPrimitive2.Provider, { swipeDirection: "right", children: [
+    messages.map((message) => /* @__PURE__ */ jsxs18(
+      ToastRoot,
+      {
+        open: true,
+        onOpenChange: (open) => {
+          if (!open)
+            removeToast(message.id);
+        },
+        variant: message.variant,
+        duration: 6e3,
+        onPause: () => setPaused(true),
+        onResume: () => setPaused(false),
+        children: [
+          /* @__PURE__ */ jsxs18(ToastContent, { children: [
+            /* @__PURE__ */ jsx42(ToastTitle, { children: message.title }),
+            message.description && /* @__PURE__ */ jsx42(ToastDescription, { children: message.description })
+          ] }),
+          /* @__PURE__ */ jsx42(ToastAction, { altText: "Fechar", asChild: true, children: /* @__PURE__ */ jsx42(
+            "button",
+            {
+              style: {
+                all: "unset",
+                display: "flex",
+                justifyContent: "space-between",
+                alignItems: "center"
+              },
+              onClick: () => removeToast(message.id),
+              children: /* @__PURE__ */ jsx42(Icon, { name: "Closed", size: 16, height: 14, width: 14 })
+            }
+          ) }),
+          /* @__PURE__ */ jsx42(ToastProgress, { paused, variant: message.variant })
+        ]
+      },
+      message.id
+    )),
+    /* @__PURE__ */ jsx42(ToastViewport, {})
+  ] });
+};
+
+// src/components/MultiStep/styles.ts
+var Wrapper5 = styled("div", {
+  display: "flex",
+  "--circle-size": "48px",
+  "--gap": "16px",
+  variants: {
+    orientation: {
+      horizontal: {
+        display: "grid",
+        gridTemplateColumns: "repeat(auto-fit, minmax(100px, 1fr))",
+        alignItems: "center",
+        gap: "var(--gap)"
+      },
+      vertical: {
+        flexDirection: "column",
+        alignItems: "flex-start"
+      }
+    }
+  }
+});
+var StepItem = styled("div", {
+  display: "flex",
+  alignItems: "center",
+  position: "relative",
+  variants: {
+    orientation: {
+      horizontal: {
+        flexDirection: "column",
+        textAlign: "center"
+      },
+      vertical: {
+        margin: "$2 0",
+        flexDirection: "row"
+      }
+    }
+  }
+});
+var StepCircle = styled("div", {
+  position: "relative",
+  width: "var(--circle-size)",
+  height: "var(--circle-size)",
+  borderRadius: "50%",
+  border: "2px solid",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  fontWeight: "$regular",
+  color: "$black",
+  variants: {
+    isActive: {
+      true: {},
+      false: {}
+    },
+    hasLeftLine: {
+      true: {}
+    },
+    hasRightLine: {
+      true: {}
+    },
+    orientation: {
+      horizontal: {},
+      vertical: {
+        "&::before": {
+          content: "",
+          position: "absolute",
+          top: 0,
+          left: "50%",
+          transform: "translate(-50%, -100%)",
+          width: "3px",
+          height: "$4",
+          backgroundColor: "$clickpalm_dark"
+        },
+        "&::after": {
+          content: "",
+          position: "absolute",
+          bottom: 0,
+          left: "50%",
+          transform: "translate(-50%, 100%)",
+          width: "3px",
+          height: "$4",
+          backgroundColor: "$clickpalm_dark"
+        }
+      }
+    },
+    variant: {
+      primary: {
+        borderColor: "$clickpalm_dark"
+      },
+      secondary: {}
+    }
+  },
+  compoundVariants: [
+    {
+      hasLeftLine: false,
+      orientation: "horizontal",
+      css: {
+        "&::before": { display: "none" }
+      }
+    },
+    {
+      hasRightLine: false,
+      orientation: "horizontal",
+      css: {
+        "&::after": { display: "none" }
+      }
+    },
+    {
+      hasLeftLine: false,
+      orientation: "vertical",
+      css: {
+        "&::before": { display: "none" }
+      }
+    },
+    {
+      hasRightLine: false,
+      orientation: "vertical",
+      css: {
+        "&::after": { display: "none" }
+      }
+    },
+    {
+      isActive: true,
+      variant: "primary",
+      css: {
+        backgroundColor: "$clickpalm_dark",
+        color: "$white"
+      }
+    },
+    {
+      isActive: false,
+      variant: "primary",
+      css: {
+        borderColor: "$clickpalm_dark"
+      }
+    },
+    {
+      isActive: true,
+      variant: "secondary",
+      css: {
+        borderColor: "$ignite_light",
+        backgroundColor: "$ignite_light"
+      }
+    },
+    {
+      isActive: false,
+      variant: "secondary",
+      css: {
+        borderColor: "$white",
+        color: "$white"
+      }
+    },
+    {
+      isActive: true,
+      variant: "primary",
+      orientation: "vertical",
+      css: {
+        "&::before": {
+          backgroundColor: "$clickpalm_dark"
+        },
+        "&::after": {
+          backgroundColor: "$clickpalm_dark"
+        }
+      }
+    },
+    {
+      isActive: false,
+      variant: "primary",
+      orientation: "vertical",
+      css: {
+        "&::before": {
+          backgroundColor: "$clickpalm_dark"
+        },
+        "&::after": {
+          backgroundColor: "$clickpalm_dark"
+        }
+      }
+    },
+    {
+      isActive: true,
+      variant: "secondary",
+      orientation: "vertical",
+      css: {
+        "&::before": {
+          backgroundColor: "$ignite_light"
+        },
+        "&::after": {
+          backgroundColor: "$ignite_light"
+        }
+      }
+    },
+    {
+      isActive: false,
+      variant: "secondary",
+      orientation: "vertical",
+      css: {
+        "&::before": {
+          backgroundColor: "$white"
+        },
+        "&::after": {
+          backgroundColor: "$white"
+        }
+      }
+    }
+  ]
+});
+var StepLabel = styled("span", {
+  fontSize: "$md",
+  whiteSpace: "nowrap",
+  overflow: "hidden",
+  textOverflow: "ellipsis",
+  variants: {
+    orientation: {
+      horizontal: {
+        marginTop: "$2"
+      },
+      vertical: {
+        marginLeft: "$3"
+      }
+    },
+    variant: {
+      primary: {
+        color: "$black"
+      },
+      secondary: {
+        color: "$white"
+      }
+    }
+  }
+});
+
+// src/components/MultiStep/index.tsx
+import { jsx as jsx43, jsxs as jsxs19 } from "react/jsx-runtime";
+var MultiStep = ({
+  steps,
+  currentStep,
+  orientation = "horizontal",
+  variant
+}) => {
+  return /* @__PURE__ */ jsx43(
+    Wrapper5,
+    {
+      orientation,
+      children: steps.map((step, index) => {
+        const isFirst = index === 0;
+        const isLast = index === steps.length - 1;
+        return /* @__PURE__ */ jsxs19(StepItem, { orientation, children: [
+          /* @__PURE__ */ jsx43(
+            StepCircle,
+            {
+              orientation,
+              variant,
+              isActive: currentStep >= index,
+              hasLeftLine: !isFirst,
+              hasRightLine: !isLast,
+              children: index + 1
+            }
+          ),
+          /* @__PURE__ */ jsx43(
+            StepLabel,
+            {
+              orientation,
+              variant,
+              children: step.label
+            }
+          )
+        ] }, index);
+      })
+    }
+  );
+};
+MultiStep.displayName = "MultiStep";
+
+// src/components/Carousel/index.tsx
+import { useState as useState12, Children as Children4, cloneElement as cloneElement2 } from "react";
+
+// src/components/Carousel/styles.ts
+var CarouselContainer = styled("div", {
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "center",
+  width: "100%",
+  maxWidth: "720px"
+});
+var Wrapper6 = styled("div", {
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "center",
+  borderRadius: "$md",
+  width: "stretch",
+  padding: "$4",
+  variants: {
+    variant: {
+      gray: {
+        backgroundColor: "$gray_background",
+        boxShadow: "0 1px 2px $colors$gray_dark"
+      },
+      purple: {
+        backgroundColor: "$clickpalm_mid",
+        color: "$white"
+      }
+    }
+  }
+});
+var CarouselHeader = styled("div", {
+  display: "flex",
+  justifyContent: "space-between",
+  alignItems: "center",
+  width: "100%",
+  color: "$black"
+});
+var Title2 = styled("h3", {
+  fontFamily: "$default",
+  fontWeight: "$bold",
+  fontSize: "$md",
+  color: "$black",
+  margin: "0px",
+  variants: {
+    variant: {
+      gray: {
+        color: "$black"
+      },
+      purple: {
+        color: "$white"
+      }
+    }
+  }
+});
+var Navigation = styled("h3", {
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  gap: "$1",
+  margin: "0px"
+});
+var CarouselContent = styled("div", {
+  width: "100%",
+  overflow: "hidden",
+  position: "relative",
+  variants: {
+    variant: {
+      gray: {
+        color: "$black"
+      },
+      purple: {
+        color: "$white",
+        "& *": {
+          color: "$white"
+        }
+      }
+    }
+  }
+});
+var DotsContainer = styled("div", {
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  width: "100%"
+});
+var Dots2 = styled("div", {
+  display: "flex",
+  gap: "$2",
+  justifyContent: "center",
+  flexWrap: "nowrap"
+});
+var DotButton = styled("button", {
+  border: "2px solid $ignite_light",
+  background: "transparent",
+  height: "9px",
+  width: "9px",
+  borderRadius: "$full",
+  padding: 0,
+  cursor: "pointer",
+  transition: "background-color 0.3s ease, border-color 0.3s ease",
+  flexShrink: 0,
+  variants: {
+    active: {
+      true: {
+        backgroundColor: "$ignite_light",
+        borderColor: "$ignite_light"
+      },
+      false: {}
+    }
+  },
+  "&:focus": {
+    outline: "none",
+    borderColor: "$ignite_dark"
+  }
+});
+var Ellipsis = styled("span", {
+  color: "$ignite_light",
+  textDecoration: "none",
+  height: "9px",
+  display: "flex",
+  alignItems: "center"
+});
+var CarouselItemContainer = styled("div", {
+  width: "100%",
+  color: "inherit"
+});
+
+// src/components/Carousel/index.tsx
+import { jsx as jsx44, jsxs as jsxs20 } from "react/jsx-runtime";
+var SWIPE_THRESHOLD = 50;
+var Carousel = ({ title, variant, children }) => {
+  const items = Children4.toArray(children);
+  const [activeIndex, setActiveIndex] = useState12(0);
+  const [touchStartX, setTouchStartX] = useState12(null);
+  const [touchEndX, setTouchEndX] = useState12(null);
+  const prev = () => {
+    setActiveIndex((prevIndex) => prevIndex === 0 ? items.length - 1 : prevIndex - 1);
+  };
+  const next = () => {
+    setActiveIndex((prevIndex) => prevIndex === items.length - 1 ? 0 : prevIndex + 1);
+  };
+  const onTouchStart = (e) => {
+    setTouchEndX(null);
+    setTouchStartX(e.targetTouches[0].clientX);
+  };
+  const onTouchMove = (e) => {
+    setTouchEndX(e.targetTouches[0].clientX);
+  };
+  const onTouchEnd = () => {
+    if (touchStartX !== null && touchEndX !== null) {
+      const distance = touchStartX - touchEndX;
+      if (Math.abs(distance) > SWIPE_THRESHOLD) {
+        if (distance > 0) {
+          next();
+        } else {
+          prev();
+        }
+      }
+    }
+    setTouchStartX(null);
+    setTouchEndX(null);
+  };
+  const activeItem = items[activeIndex];
+  const itemTitle = activeItem?.props?.title;
+  return /* @__PURE__ */ jsxs20(
+    CarouselContainer,
+    {
+      role: "region",
+      "aria-roledescription": "carousel",
+      "aria-label": "Carousel Component",
+      children: [
+        /* @__PURE__ */ jsxs20(Wrapper6, { variant, children: [
+          /* @__PURE__ */ jsxs20(CarouselHeader, { children: [
+            /* @__PURE__ */ jsx44(Title2, { variant, children: itemTitle ?? title }),
+            items.length > 0 && /* @__PURE__ */ jsxs20(Navigation, { children: [
+              /* @__PURE__ */ jsx44(
+                Button,
+                {
+                  size: "sm",
+                  variant: "secondary",
+                  "aria-label": "Previous Slide",
+                  onClick: prev,
+                  tabIndex: 0,
+                  children: /* @__PURE__ */ jsx44(Icon, { name: "TriangleLeft", size: 16, color: variant === "purple" ? "white" : "black" })
+                }
+              ),
+              /* @__PURE__ */ jsx44(
+                Button,
+                {
+                  size: "sm",
+                  variant: "secondary",
+                  "aria-label": "Next Slide",
+                  onClick: next,
+                  tabIndex: 0,
+                  children: /* @__PURE__ */ jsx44(Icon, { name: "TriangleRight", size: 16, color: variant === "purple" ? "white" : "black" })
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx44(Spacing, { size: "xs" }),
+          /* @__PURE__ */ jsx44(Hr, { variant }),
+          /* @__PURE__ */ jsx44(Spacing, { size: "xs" }),
+          /* @__PURE__ */ jsx44(
+            CarouselContent,
+            {
+              onTouchStart,
+              onTouchMove,
+              onTouchEnd,
+              variant,
+              children: items.map(
+                (child, index) => cloneElement2(child, {
+                  "aria-hidden": index !== activeIndex,
+                  style: {
+                    display: index === activeIndex ? "block" : "none"
+                  }
+                })
+              )
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx44(Spacing, { size: "md" }),
+        items.length > 0 && /* @__PURE__ */ jsx44(DotsContainer, { children: /* @__PURE__ */ jsx44(Dots2, { role: "tablist", "aria-label": "Carousel Pagination", children: getPaginationItems(items.length, activeIndex).map(
+          (page, index) => typeof page === "number" ? /* @__PURE__ */ jsx44(
+            DotButton,
+            {
+              active: page === activeIndex,
+              "aria-label": `Go to slide ${page + 1}`,
+              "aria-selected": page === activeIndex,
+              role: "tab",
+              onClick: () => setActiveIndex(page),
+              type: "button"
+            },
+            page
+          ) : /* @__PURE__ */ jsx44(Ellipsis, { children: "..." }, `ellipsis-${index}`)
+        ) }) })
+      ]
+    }
+  );
+};
+var getPaginationItems = (totalItems, activeIndex) => {
+  if (totalItems <= 10) {
+    return Array.from({ length: totalItems }, (_, i) => i);
+  }
+  if (activeIndex < 7) {
+    return [0, 1, 2, 3, 4, 5, 6, "...", totalItems - 1];
+  }
+  if (activeIndex >= totalItems - 5) {
+    return [0, "...", totalItems - 5, totalItems - 4, totalItems - 3, totalItems - 2, totalItems - 1];
+  }
+  return [0, "...", activeIndex - 2, activeIndex - 1, activeIndex, activeIndex + 1, activeIndex + 2, "...", totalItems - 1];
+};
+var CarouselItem = ({ children, style, title, ...props }) => /* @__PURE__ */ jsx44(CarouselItemContainer, { ...props, style: { ...style }, children });
+Carousel.Item = CarouselItem;
+
+// src/components/PasswordInput.tsx
+import { forwardRef as forwardRef13, useImperativeHandle as useImperativeHandle2, useRef as useRef7, useState as useState13 } from "react";
+import { jsx as jsx45 } from "react/jsx-runtime";
+var ToggleButton = styled("button", {
+  all: "unset",
+  cursor: "pointer",
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  borderRadius: "$sm",
+  padding: "2px",
+  "&:focus-visible": {
+    outline: "none",
+    boxShadow: "0 0 0 2px $colors$ignite_light",
+    borderRadius: "$sm"
+  }
+});
+var PasswordInput = forwardRef13(
+  ({ value, onChange, ...props }, ref) => {
+    const [visible, setVisible] = useState13(false);
+    const innerRef = useRef7(null);
+    useImperativeHandle2(ref, () => innerRef.current);
+    const handleToggleVisibility = () => {
+      setVisible((v) => !v);
+      setTimeout(() => {
+        if (innerRef.current) {
+          const length = innerRef.current.value.length;
+          innerRef.current.setSelectionRange(length, length);
+        }
+      }, 0);
+    };
+    return /* @__PURE__ */ jsx45(
+      Input2,
+      {
+        ...props,
+        ref: innerRef,
+        type: visible ? "text" : "password",
+        value,
+        onChange,
+        suffix: /* @__PURE__ */ jsx45(
+          ToggleButton,
+          {
+            type: "button",
+            onClick: handleToggleVisibility,
+            onMouseDown: (e) => e.preventDefault(),
+            "aria-label": visible ? "Ocultar senha" : "Mostrar senha",
+            children: visible ? /* @__PURE__ */ jsx45(Icon, { name: "EyeClosed", size: 16, color: "black" }) : /* @__PURE__ */ jsx45(Icon, { name: "EyeOpen", size: 16, color: "black" })
+          }
+        )
+      }
+    );
+  }
+);
+PasswordInput.displayName = "PasswordInput";
+
+// src/components/Accordion/index.tsx
+import * as RadixAccordion from "@radix-ui/react-accordion";
+import React6 from "react";
+
+// src/components/Accordion/styles.ts
+import * as Accordion from "@radix-ui/react-accordion";
+var AccordionContainer = styled(Accordion.Root, {
+  borderRadius: "$md",
+  width: "100%",
+  backgroundColor: "$white",
+  boxShadow: "0 1px 2px $colors$gray_mid",
+  border: "2px solid $colors$gray_mid"
+});
+var AccordionItem = styled(Accordion.Item, {
+  overflow: "hidden",
+  marginTop: "1px",
+  "&:first-child": {
+    marginTop: 0,
+    borderTopLeftRadius: "$md",
+    borderTopRightRadius: "$md"
+  },
+  "&:last-child": {
+    borderBottomLeftRadius: "$md",
+    borderBottomRightRadius: "$md"
+  }
+});
+var AccordionHeader = styled(Accordion.Header, {
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "space-between",
+  padding: "0 $5",
+  gap: "$2"
+});
+var AccordionTrigger = styled(Accordion.Trigger, {
+  all: "unset",
+  backgroundColor: "transparent",
+  display: "flex",
+  alignItems: "center",
+  fontFamily: "$default",
+  fontWeight: "$bold",
+  fontSize: "$md",
+  lineHeight: "$regular",
+  textAlign: "left",
+  color: "$black",
+  width: "100%",
+  flexWrap: "wrap",
+  wordBreak: "break-word",
+  whiteSpace: "normal",
+  "&:hover": {
+    cursor: "pointer"
+  },
+  "&:focus": {
+    cursor: "pointer",
+    outline: "none"
+  }
+});
+var AccordionChevron = styled(Icon, {
+  color: "$ignite_light",
+  transition: "transform 300ms cubic-bezier(0.87, 0, 0.13, 1)",
+  "[data-state=open] &": {
+    transform: "rotate(180deg)"
+  }
+});
+var AccordionContent = styled(Accordion.Content, {
+  overflow: "hidden",
+  fontSize: "$md",
+  color: "$black",
+  borderTop: "1px solid $colors$gray_mid",
+  '&[data-state="open"]': {
+    animation: "slideDown 300ms cubic-bezier(0.87, 0, 0.13, 1)"
+  },
+  '&[data-state="closed"]': {
+    animation: "slideUp 300ms cubic-bezier(0.87, 0, 0.13, 1)"
+  },
+  "> div": {
+    padding: "$5"
+  }
+});
+var TriggerContent = styled("div", {
+  display: "flex",
+  alignItems: "center",
+  gap: "$2"
+});
+var OptionsButton = styled(Button, {
+  marginRight: "$1"
+});
+
+// src/components/Accordion/index.tsx
+import { jsx as jsx46, jsxs as jsxs21 } from "react/jsx-runtime";
+var Accordion2 = React6.forwardRef(
+  ({ title, children, dropdownItems }, ref) => {
+    return /* @__PURE__ */ jsx46(AccordionContainer, { type: "single", collapsible: true, ref, children: /* @__PURE__ */ jsxs21(AccordionItem, { value: "item-1", children: [
+      /* @__PURE__ */ jsxs21(AccordionHeader, { children: [
+        /* @__PURE__ */ jsx46(AccordionTrigger, { children: /* @__PURE__ */ jsx46("span", { children: title }) }),
+        /* @__PURE__ */ jsxs21(TriggerContent, { children: [
+          dropdownItems && dropdownItems,
+          /* @__PURE__ */ jsx46(RadixAccordion.Trigger, { asChild: true, children: /* @__PURE__ */ jsx46(StyledButton, { as: "div", variant: "secondary", size: "sm", children: /* @__PURE__ */ jsx46(AccordionChevron, { name: "TriangleDown", size: 16, "aria-hidden": true }) }) })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx46(RadixAccordion.Content, { asChild: true, children: /* @__PURE__ */ jsx46(AccordionContent, { children }) })
+    ] }) });
+  }
+);
+Accordion2.displayName = "Accordion";
+export {
+  Accordion2 as Accordion,
+  Avatar2 as Avatar,
+  Box,
+  Button,
+  Calendar2 as Calendar,
+  Carousel,
+  Checkbox2 as Checkbox,
+  Datepicker,
+  Dropdown,
+  DropdownItem,
+  DropdownSeparator,
+  Heading,
+  Hr,
+  Icon,
+  Input2 as Input,
+  LabelledValue,
+  Loader,
+  MaskedInput,
+  Modal,
+  MultiStep,
+  OneTimePassword,
+  Paragraph,
+  PasswordInput,
+  ProgressBar,
+  Radio,
+  Select2 as Select,
+  Spacing,
+  Span5 as Span,
+  StyledHr,
+  Switch2 as Switch,
+  Tabs2 as Tabs,
+  TextArea,
+  TextAreaElement,
+  Toast,
+  Tooltip,
+  config,
+  createTheme,
+  css,
+  getCssText,
+  globalCss,
+  keyframes,
+  styled,
+  theme,
+  toast
+};