@koaris/bloom-ui 1.0.4 → 1.0.5

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
-import { DetailedHTMLProps, HTMLAttributes, ButtonHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, ReactNode, FormHTMLAttributes } from 'react';
+import { DetailedHTMLProps, HTMLAttributes, ButtonHTMLAttributes, AnchorHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, ReactNode, FormHTMLAttributes } from 'react';
 
 /**
  * Primary UI component for user interaction
@@ -28,6 +28,17 @@ interface ButtonProps extends DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonE
 }
 declare const Button: ({ className, variant, size, disabled, onClick, ...rest }: ButtonProps) => react_jsx_runtime.JSX.Element;
 
+/**
+ * Primary UI component for user interaction
+ */
+interface LinkProps extends DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> {
+    url: string;
+    newPage: boolean;
+    disabled?: boolean;
+    children: string | JSX.Element;
+}
+declare const Link: ({ className, disabled, url, newPage, onClick, ...rest }: LinkProps) => react_jsx_runtime.JSX.Element;
+
 declare const options: {
     id: number;
     value: string;
@@ -58,7 +69,7 @@ interface InputProps extends DetailedHTMLProps<InputHTMLAttributes<HTMLInputElem
     required?: boolean;
     type: 'text' | 'password' | 'date' | 'cpf' | 'phone' | 'cnpj' | 'cep';
 }
-declare const Input: ({ className, disabled, placeholder, value, validated, error, required, type, onClick, ...rest }: InputProps) => react_jsx_runtime.JSX.Element;
+declare const Input: react.ForwardRefExoticComponent<Omit<InputProps, "ref"> & react.RefAttributes<HTMLInputElement>>;
 
 interface TextInputProps extends DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> {
     disabled?: boolean;
@@ -129,4 +140,4 @@ interface MultiStepProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement
 }
 declare const MultiStep: ({ className, size, currentStep }: MultiStepProps) => react_jsx_runtime.JSX.Element;
 
-export { Avatar, type AvatarProps, Box, type BoxProps, Button, type ButtonProps, Card, type CardProps, Checkbox, type CheckboxProps, Form, type FormProps, Heading, type HeadingProps, Input, type InputProps, MultiStep, type MultiStepProps, RadioGroup, type RadioGroupProps, Text, TextArea, type TextAreaProps, TextInput, type TextInputProps, type TextProps };
+export { Avatar, type AvatarProps, Box, type BoxProps, Button, type ButtonProps, Card, type CardProps, Checkbox, type CheckboxProps, Form, type FormProps, Heading, type HeadingProps, Input, type InputProps, Link, type LinkProps, MultiStep, type MultiStepProps, RadioGroup, type RadioGroupProps, Text, TextArea, type TextAreaProps, TextInput, type TextInputProps, type TextProps };

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
-import { DetailedHTMLProps, HTMLAttributes, ButtonHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, ReactNode, FormHTMLAttributes } from 'react';
+import { DetailedHTMLProps, HTMLAttributes, ButtonHTMLAttributes, AnchorHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, ReactNode, FormHTMLAttributes } from 'react';
 
 /**
  * Primary UI component for user interaction
@@ -28,6 +28,17 @@ interface ButtonProps extends DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonE
 }
 declare const Button: ({ className, variant, size, disabled, onClick, ...rest }: ButtonProps) => react_jsx_runtime.JSX.Element;
 
+/**
+ * Primary UI component for user interaction
+ */
+interface LinkProps extends DetailedHTMLProps<AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement> {
+    url: string;
+    newPage: boolean;
+    disabled?: boolean;
+    children: string | JSX.Element;
+}
+declare const Link: ({ className, disabled, url, newPage, onClick, ...rest }: LinkProps) => react_jsx_runtime.JSX.Element;
+
 declare const options: {
     id: number;
     value: string;
@@ -58,7 +69,7 @@ interface InputProps extends DetailedHTMLProps<InputHTMLAttributes<HTMLInputElem
     required?: boolean;
     type: 'text' | 'password' | 'date' | 'cpf' | 'phone' | 'cnpj' | 'cep';
 }
-declare const Input: ({ className, disabled, placeholder, value, validated, error, required, type, onClick, ...rest }: InputProps) => react_jsx_runtime.JSX.Element;
+declare const Input: react.ForwardRefExoticComponent<Omit<InputProps, "ref"> & react.RefAttributes<HTMLInputElement>>;
 
 interface TextInputProps extends DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> {
     disabled?: boolean;
@@ -129,4 +140,4 @@ interface MultiStepProps extends DetailedHTMLProps<HTMLAttributes<HTMLDivElement
 }
 declare const MultiStep: ({ className, size, currentStep }: MultiStepProps) => react_jsx_runtime.JSX.Element;
 
-export { Avatar, type AvatarProps, Box, type BoxProps, Button, type ButtonProps, Card, type CardProps, Checkbox, type CheckboxProps, Form, type FormProps, Heading, type HeadingProps, Input, type InputProps, MultiStep, type MultiStepProps, RadioGroup, type RadioGroupProps, Text, TextArea, type TextAreaProps, TextInput, type TextInputProps, type TextProps };
+export { Avatar, type AvatarProps, Box, type BoxProps, Button, type ButtonProps, Card, type CardProps, Checkbox, type CheckboxProps, Form, type FormProps, Heading, type HeadingProps, Input, type InputProps, Link, type LinkProps, MultiStep, type MultiStepProps, RadioGroup, type RadioGroupProps, Text, TextArea, type TextAreaProps, TextInput, type TextInputProps, type TextProps };

package/dist/index.js

@@ -57,6 +57,7 @@ __export(src_exports, {
   Form: () => Form,
   Heading: () => Heading,
   Input: () => Input,
+  Link: () => Link,
   MultiStep: () => MultiStep,
   RadioGroup: () => RadioGroup,
   Text: () => Text,
@@ -425,6 +426,7 @@ var fractionRegex = /^\d+\/\d+$/;
 var stringLengths = /* @__PURE__ */ new Set(["px", "full", "screen"]);
 var tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
 var lengthUnitRegex = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/;
+var colorFunctionRegex = /^(rgba?|hsla?|hwb|(ok)?(lab|lch))\(.+\)$/;
 var shadowRegex = /^-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
 var imageRegex = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/;
 function isLength(value) {
@@ -479,7 +481,7 @@ function getIsArbitraryValue(value, label, testValue) {
   return false;
 }
 function isLengthOnly(value) {
-  return lengthUnitRegex.test(value);
+  return lengthUnitRegex.test(value) && !colorFunctionRegex.test(value);
 }
 function isNever() {
   return false;
@@ -2611,9 +2613,9 @@ var Button = (_a) => {
     "button",
     __spreadValues({
       className: twMerge(
-        "flex items-center justify-center rounded-lg px-8 py-2 text-md font-medium hover:shadow-md hover:shadow-neutral-500 w-full",
+        "flex gap-4 items-center justify-center rounded-sm px-8 py-2 text-md font-medium hover:shadow-md hover:shadow-neutral-500 w-full",
         variant === "primary" && "bg-orange-500 text-neutral hover:bg-orange-700",
-        variant === "secondary" && "bg-neutral text-orange-500 border border-orange-500 hover:bg-neutral-200",
+        variant === "secondary" && "bg-neutral text-orange-500 border border-orange-500 hover:text-orange-100 hover:bg-orange-500",
         size === "sm" && "px-6 py-1",
         typeof rest.children !== "string" && "px-4",
         disabled === true && "opacity-50 cursor-not-allowed",
@@ -2624,10 +2626,40 @@ var Button = (_a) => {
   );
 };
 
+// src/components/Link/index.tsx
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var Link = (_a) => {
+  var _b = _a, {
+    className,
+    disabled,
+    url,
+    newPage = true,
+    onClick
+  } = _b, rest = __objRest(_b, [
+    "className",
+    "disabled",
+    "url",
+    "newPage",
+    "onClick"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "a",
+    __spreadValues(__spreadValues({
+      className: twMerge(
+        "text-blue-800 font-bold",
+        typeof rest.children !== "string" && "px-4",
+        disabled === true && "opacity-50 cursor-not-allowed",
+        className
+      ),
+      href: url
+    }, newPage && { target: "_blank", rel: "noopener noreferrer" }), rest)
+  );
+};
+
 // src/components/RadioGroup/index.tsx
 var import_react = require("react");
 var import_fi = require("react-icons/fi");
-var import_jsx_runtime3 = require("react/jsx-runtime");
+var import_jsx_runtime4 = require("react/jsx-runtime");
 var RadioGroup = ({
   disabled,
   options = [
@@ -2641,8 +2673,8 @@ var RadioGroup = ({
   const handleOptionChange = (value) => {
     setSelectedOption(value);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "flex flex-col ", children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex py-2 items-center", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex flex-col ", children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex py-2 items-center", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
       "label",
       {
         htmlFor: `radio${option.id}`,
@@ -2653,7 +2685,7 @@ var RadioGroup = ({
           className
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
             "input",
             {
               type: "radio",
@@ -2667,24 +2699,24 @@ var RadioGroup = ({
               disabled
             }
           ),
-          selectedOption === option.value && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_fi.FiCheck, { color: "#FFFFFF", size: 12, style: { strokeWidth: 4 } })
+          selectedOption === option.value && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_fi.FiCheck, { color: "#FFFFFF", size: 12, style: { strokeWidth: 4 } })
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "px-2", children: option.label })
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "px-2", children: option.label })
   ] }, option.id)) });
 };
 
 // src/components/Checkbox/index.tsx
 var import_react2 = require("react");
 var import_fi2 = require("react-icons/fi");
-var import_jsx_runtime4 = require("react/jsx-runtime");
+var import_jsx_runtime5 = require("react/jsx-runtime");
 var Checkbox = ({ className, required, disabled }) => {
   const [selected, setSelected] = (0, import_react2.useState)(false);
   const handleCheckboxChange = (value) => {
     setSelected(!value);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex items-center justify-center px-2", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: "flex items-center justify-center px-2", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
     "label",
     {
       className: twMerge(
@@ -2694,7 +2726,7 @@ var Checkbox = ({ className, required, disabled }) => {
         disabled === true && "opacity-50 cursor-not-allowed"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
           "input",
           {
             type: "checkbox",
@@ -2708,7 +2740,7 @@ var Checkbox = ({ className, required, disabled }) => {
             )
           }
         ),
-        selected && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_fi2.FiCheck, { color: "#FFFFFF", size: 14, style: { strokeWidth: 4 } })
+        selected && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_fi2.FiCheck, { color: "#FFFFFF", size: 14, style: { strokeWidth: 4 } })
       ]
     }
   ) });
@@ -2780,65 +2812,102 @@ var masks = {
 var masks_default = masks;
 
 // src/components/Input/index.tsx
-var import_jsx_runtime5 = require("react/jsx-runtime");
-var Input = (_a) => {
-  var _b = _a, {
-    className,
-    disabled,
-    placeholder,
-    value,
-    validated,
-    error,
-    required,
-    type,
-    onClick
-  } = _b, rest = __objRest(_b, [
-    "className",
-    "disabled",
-    "placeholder",
-    "value",
-    "validated",
-    "error",
-    "required",
-    "type",
-    "onClick"
-  ]);
-  const [selected, setSelected] = (0, import_react3.useState)(false);
-  const [inputValue, setInputValue] = (0, import_react3.useState)(value);
-  const [hasNumber, setHasNumber] = (0, import_react3.useState)(false);
-  const [hasSpecialCharacteres, setHasSpecialCharacteres] = (0, import_react3.useState)(false);
-  const [hasEightCharacteres, setHasEightCharacteres] = (0, import_react3.useState)(false);
-  const handleFocus = () => {
-    setSelected(!selected);
-  };
-  const handleBlur = () => {
-    setSelected(false);
-  };
-  const handleInput = (event) => {
-    setInputValue(event.currentTarget.value);
-    checkPassword(event.currentTarget.value);
-  };
-  (0, import_react3.useEffect)(() => {
-    setInputValue(value);
-  }, [value]);
-  const checkPassword = (value2) => {
-    setHasSpecialCharacteres((value2 == null ? void 0 : value2.match(masks_default.password[0])) !== null);
-    setHasNumber((value2 == null ? void 0 : value2.match(masks_default.password[1])) !== null);
-    setHasEightCharacteres((value2 == null ? void 0 : value2.match(masks_default.password[2])) !== null);
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
-    type === "text" || type === "password" || type === "date" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_jsx_runtime5.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var Input = (0, import_react3.forwardRef)(
+  (_a, ref) => {
+    var _b = _a, {
+      className,
+      disabled,
+      placeholder,
+      value,
+      validated,
+      error,
+      required,
+      type,
+      onClick
+    } = _b, rest = __objRest(_b, [
+      "className",
+      "disabled",
+      "placeholder",
+      "value",
+      "validated",
+      "error",
+      "required",
+      "type",
+      "onClick"
+    ]);
+    const [selected, setSelected] = (0, import_react3.useState)(false);
+    const [inputValue, setInputValue] = (0, import_react3.useState)(value);
+    const [hasNumber, setHasNumber] = (0, import_react3.useState)(false);
+    const [hasSpecialCharacteres, setHasSpecialCharacteres] = (0, import_react3.useState)(false);
+    const [hasEightCharacteres, setHasEightCharacteres] = (0, import_react3.useState)(false);
+    const handleFocus = () => {
+      setSelected(!selected);
+    };
+    const handleBlur = () => {
+      setSelected(false);
+    };
+    const handleInput = (event) => {
+      setInputValue(event.currentTarget.value);
+      checkPassword(event.currentTarget.value);
+    };
+    (0, import_react3.useEffect)(() => {
+      setInputValue(value);
+    }, [value]);
+    const checkPassword = (value2) => {
+      setHasSpecialCharacteres((value2 == null ? void 0 : value2.match(masks_default.password[0])) !== null);
+      setHasNumber((value2 == null ? void 0 : value2.match(masks_default.password[1])) !== null);
+      setHasEightCharacteres((value2 == null ? void 0 : value2.match(masks_default.password[2])) !== null);
+    };
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+      type === "text" || type === "password" || type === "date" ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          "input",
+          __spreadValues({
+            type,
+            required,
+            ref,
+            className: twMerge(
+              "flex items-center justify-center border-2 border-neutral rounded-sm w-full px-3 py-2 text-md hover:shadow-md hover:shadow-neutral-500 focus:outline-none",
+              className,
+              disabled === true && "opacity-50 cursor-not-allowed",
+              selected === true && "border-2 border-orange-500",
+              validated === true && "border-2 border-green-900",
+              error === true && "border-2 border-red-900"
+            ),
+            onClick,
+            onFocus: handleFocus,
+            onChange: handleInput,
+            onBlur: handleBlur,
+            placeholder,
+            value: inputValue
+          }, rest)
+        ),
+        type === "password" && (!hasEightCharacteres || !hasSpecialCharacteres || !hasNumber) && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("ul", { className: "py-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("li", { className: "flex items-center px-2", children: [
+            hasEightCharacteres ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_fi3.FiCheck, {}) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_fi3.FiX, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "px-1", children: "Pelo menos 8 caracteres" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("li", { className: "flex items-center px-2", children: [
+            hasSpecialCharacteres ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_fi3.FiCheck, {}) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_fi3.FiX, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "px-1", children: "Pelo menos 1 s\xEDmbolo (@, !, $, etc)" })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("li", { className: "flex items-center px-2", children: [
+            hasNumber ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_fi3.FiCheck, {}) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_fi3.FiX, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "px-1", children: "Deve conter 1 n\xFAmero" })
+          ] })
+        ] })
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
         "input",
         __spreadValues({
           type,
           required,
+          ref,
           className: twMerge(
             "flex items-center justify-center border-2 border-neutral rounded-sm w-full px-3 py-2 text-md hover:shadow-md hover:shadow-neutral-500 focus:outline-none",
             className,
             disabled === true && "opacity-50 cursor-not-allowed",
             selected === true && "border-2 border-orange-500",
-            validated === true && "border-2 border-green-900",
             error === true && "border-2 border-red-900"
           ),
           onClick,
@@ -2849,47 +2918,15 @@ var Input = (_a) => {
           value: inputValue
         }, rest)
       ),
-      type === "password" && (!hasEightCharacteres || !hasSpecialCharacteres || !hasNumber) && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("ul", { className: "py-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("li", { className: "flex items-center px-2", children: [
-          hasEightCharacteres ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_fi3.FiCheck, {}) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_fi3.FiX, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "px-1", children: "Pelo menos 8 caracteres" })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("li", { className: "flex items-center px-2", children: [
-          hasSpecialCharacteres ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_fi3.FiCheck, {}) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_fi3.FiX, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "px-1", children: "Pelo menos 1 s\xEDmbolo (@, !, $, etc)" })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("li", { className: "flex items-center px-2", children: [
-          hasNumber ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_fi3.FiCheck, {}) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_fi3.FiX, {}),
-          /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "px-1", children: "Deve conter 1 n\xFAmero" })
-        ] })
-      ] })
-    ] }) : /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
-      "input",
-      __spreadValues({
-        type,
-        required,
-        className: twMerge(
-          "flex items-center justify-center border-2 border-neutral rounded-sm w-full px-3 py-2 text-md hover:shadow-md hover:shadow-neutral-500 focus:outline-none",
-          className,
-          disabled === true && "opacity-50 cursor-not-allowed",
-          selected === true && "border-2 border-orange-500",
-          error === true && "border-2 border-red-900"
-        ),
-        onClick,
-        onFocus: handleFocus,
-        onChange: handleInput,
-        onBlur: handleBlur,
-        placeholder,
-        value: inputValue
-      }, rest)
-    ),
-    error === true && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("label", { htmlFor: rest.id, className: "text-red-900", children: "Campo inv\xE1lido." })
-  ] });
-};
+      error === true && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("label", { htmlFor: rest.id, className: "text-red-900", children: "Campo inv\xE1lido." })
+    ] });
+  }
+);
+Input.displayName = "Input";
 
 // src/components/TextInput/index.tsx
 var import_react4 = require("react");
-var import_jsx_runtime6 = require("react/jsx-runtime");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 var TextInput = (0, import_react4.forwardRef)(
   (_a, ref) => {
     var _b = _a, {
@@ -2927,7 +2964,7 @@ var TextInput = (0, import_react4.forwardRef)(
     (0, import_react4.useEffect)(() => {
       setInputValue(value);
     }, [value]);
-    return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
       "div",
       {
         className: twMerge(
@@ -2939,8 +2976,8 @@ var TextInput = (0, import_react4.forwardRef)(
           error === true && "border-2 border-red-900"
         ),
         children: [
-          !!prefix && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-neutral-500 sm:text-sm", children: prefix }),
-          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          !!prefix && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "text-neutral-500 sm:text-sm", children: prefix }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
             "input",
             __spreadValues({
               type,
@@ -2971,7 +3008,7 @@ TextInput.displayName = "TextInput";
 
 // src/components/TextArea/index.tsx
 var import_react5 = require("react");
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 var TextArea = (_a) => {
   var _b = _a, {
     className,
@@ -3004,7 +3041,7 @@ var TextArea = (_a) => {
   (0, import_react5.useEffect)(() => {
     setInputValue(value);
   }, [value]);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
     "textarea",
     __spreadValues({
       required,
@@ -3028,7 +3065,7 @@ var TextArea = (_a) => {
 };
 
 // src/components/Text/index.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 var Text = (_a) => {
   var _b = _a, {
     children,
@@ -3060,11 +3097,11 @@ var Text = (_a) => {
     "9xl": "text-9xl"
   }[size];
   const Tag = tag;
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Tag, __spreadProps(__spreadValues({}, rest), { className: twMerge(`text-${color} ${fontSize}`, className), children }));
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Tag, __spreadProps(__spreadValues({}, rest), { className: twMerge(`text-${color} ${fontSize}`, className), children }));
 };
 
 // src/components/Heading/index.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 var Heading = ({
   children,
   color = "neutral-800",
@@ -3087,11 +3124,11 @@ var Heading = ({
     "9xl": "text-9xl"
   }[size];
   const Tag = tag;
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Tag, { className: twMerge(`text-${color} ${fontSize}`, className), children });
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Tag, { className: twMerge(`text-${color} ${fontSize}`, className), children });
 };
 
 // src/components/Box/index.tsx
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 var Box = ({
   className,
   children,
@@ -3099,7 +3136,7 @@ var Box = ({
   variant = "secondary"
 }) => {
   const Tag = tag;
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     Tag,
     {
       className: twMerge(
@@ -3114,7 +3151,7 @@ var Box = ({
 };
 
 // src/components/Form/index.tsx
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 var Form = (_a) => {
   var _b = _a, {
     className,
@@ -3127,7 +3164,7 @@ var Form = (_a) => {
     "variant",
     "orientation"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
     "form",
     __spreadProps(__spreadValues({
       className: twMerge(
@@ -3145,10 +3182,10 @@ var Form = (_a) => {
 
 // src/components/Avatar/index.tsx
 var import_fa = require("react-icons/fa");
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_jsx_runtime13 = require("react/jsx-runtime");
 var Avatar = (_a) => {
   var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
     "div",
     {
       className: twMerge(
@@ -3157,18 +3194,18 @@ var Avatar = (_a) => {
             bg-neutral-600 justify-center`,
         className
       ),
-      children: rest.src ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("img", __spreadValues({ className: "w-full h-full object-cover rounded-full" }, rest)) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_fa.FaUser, { color: "#FFFFFF", size: 24 })
+      children: rest.src ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("img", __spreadValues({ className: "w-full h-full object-cover rounded-full" }, rest)) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_fa.FaUser, { color: "#FFFFFF", size: 24 })
     }
   );
 };
 
 // src/components/MultiStep/index.tsx
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 var MultiStep = ({ className, size, currentStep }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "w-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Text, { tag: "label", color: "neutral-100", size: "xs", children: `Passo ${currentStep} de ${size}` }),
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: `grid gap-2 grid-cols-${size} grid-flow-col mt-1`, children: Array.from(Array(size).keys()).map((_, index) => {
-      return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "w-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Text, { tag: "label", color: "neutral-100", size: "xs", children: `Passo ${currentStep} de ${size}` }),
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: `grid gap-2 grid-cols-${size} grid-flow-col mt-1`, children: Array.from(Array(size).keys()).map((_, index) => {
+      return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
         "div",
         {
           className: twMerge(
@@ -3192,6 +3229,7 @@ var MultiStep = ({ className, size, currentStep }) => {
   Form,
   Heading,
   Input,
+  Link,
   MultiStep,
   RadioGroup,
   Text,

package/dist/index.mjs

@@ -390,6 +390,7 @@ var fractionRegex = /^\d+\/\d+$/;
 var stringLengths = /* @__PURE__ */ new Set(["px", "full", "screen"]);
 var tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
 var lengthUnitRegex = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/;
+var colorFunctionRegex = /^(rgba?|hsla?|hwb|(ok)?(lab|lch))\(.+\)$/;
 var shadowRegex = /^-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
 var imageRegex = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/;
 function isLength(value) {
@@ -444,7 +445,7 @@ function getIsArbitraryValue(value, label, testValue) {
   return false;
 }
 function isLengthOnly(value) {
-  return lengthUnitRegex.test(value);
+  return lengthUnitRegex.test(value) && !colorFunctionRegex.test(value);
 }
 function isNever() {
   return false;
@@ -2576,9 +2577,9 @@ var Button = (_a) => {
     "button",
     __spreadValues({
       className: twMerge(
-        "flex items-center justify-center rounded-lg px-8 py-2 text-md font-medium hover:shadow-md hover:shadow-neutral-500 w-full",
+        "flex gap-4 items-center justify-center rounded-sm px-8 py-2 text-md font-medium hover:shadow-md hover:shadow-neutral-500 w-full",
         variant === "primary" && "bg-orange-500 text-neutral hover:bg-orange-700",
-        variant === "secondary" && "bg-neutral text-orange-500 border border-orange-500 hover:bg-neutral-200",
+        variant === "secondary" && "bg-neutral text-orange-500 border border-orange-500 hover:text-orange-100 hover:bg-orange-500",
         size === "sm" && "px-6 py-1",
         typeof rest.children !== "string" && "px-4",
         disabled === true && "opacity-50 cursor-not-allowed",
@@ -2589,10 +2590,40 @@ var Button = (_a) => {
   );
 };
 
+// src/components/Link/index.tsx
+import { jsx as jsx3 } from "react/jsx-runtime";
+var Link = (_a) => {
+  var _b = _a, {
+    className,
+    disabled,
+    url,
+    newPage = true,
+    onClick
+  } = _b, rest = __objRest(_b, [
+    "className",
+    "disabled",
+    "url",
+    "newPage",
+    "onClick"
+  ]);
+  return /* @__PURE__ */ jsx3(
+    "a",
+    __spreadValues(__spreadValues({
+      className: twMerge(
+        "text-blue-800 font-bold",
+        typeof rest.children !== "string" && "px-4",
+        disabled === true && "opacity-50 cursor-not-allowed",
+        className
+      ),
+      href: url
+    }, newPage && { target: "_blank", rel: "noopener noreferrer" }), rest)
+  );
+};
+
 // src/components/RadioGroup/index.tsx
 import { useState } from "react";
 import { FiCheck } from "react-icons/fi";
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
 var RadioGroup = ({
   disabled,
   options = [
@@ -2606,7 +2637,7 @@ var RadioGroup = ({
   const handleOptionChange = (value) => {
     setSelectedOption(value);
   };
-  return /* @__PURE__ */ jsx3("div", { className: "flex flex-col ", children: options.map((option) => /* @__PURE__ */ jsxs2("div", { className: "flex py-2 items-center", children: [
+  return /* @__PURE__ */ jsx4("div", { className: "flex flex-col ", children: options.map((option) => /* @__PURE__ */ jsxs2("div", { className: "flex py-2 items-center", children: [
     /* @__PURE__ */ jsxs2(
       "label",
       {
@@ -2618,7 +2649,7 @@ var RadioGroup = ({
           className
         ),
         children: [
-          /* @__PURE__ */ jsx3(
+          /* @__PURE__ */ jsx4(
             "input",
             {
               type: "radio",
@@ -2632,24 +2663,24 @@ var RadioGroup = ({
               disabled
             }
           ),
-          selectedOption === option.value && /* @__PURE__ */ jsx3(FiCheck, { color: "#FFFFFF", size: 12, style: { strokeWidth: 4 } })
+          selectedOption === option.value && /* @__PURE__ */ jsx4(FiCheck, { color: "#FFFFFF", size: 12, style: { strokeWidth: 4 } })
         ]
       }
     ),
-    /* @__PURE__ */ jsx3("span", { className: "px-2", children: option.label })
+    /* @__PURE__ */ jsx4("span", { className: "px-2", children: option.label })
   ] }, option.id)) });
 };
 
 // src/components/Checkbox/index.tsx
 import { useState as useState2 } from "react";
 import { FiCheck as FiCheck2 } from "react-icons/fi";
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
 var Checkbox = ({ className, required, disabled }) => {
   const [selected, setSelected] = useState2(false);
   const handleCheckboxChange = (value) => {
     setSelected(!value);
   };
-  return /* @__PURE__ */ jsx4("div", { className: "flex items-center justify-center px-2", children: /* @__PURE__ */ jsxs3(
+  return /* @__PURE__ */ jsx5("div", { className: "flex items-center justify-center px-2", children: /* @__PURE__ */ jsxs3(
     "label",
     {
       className: twMerge(
@@ -2659,7 +2690,7 @@ var Checkbox = ({ className, required, disabled }) => {
         disabled === true && "opacity-50 cursor-not-allowed"
       ),
       children: [
-        /* @__PURE__ */ jsx4(
+        /* @__PURE__ */ jsx5(
           "input",
           {
             type: "checkbox",
@@ -2673,7 +2704,7 @@ var Checkbox = ({ className, required, disabled }) => {
             )
           }
         ),
-        selected && /* @__PURE__ */ jsx4(FiCheck2, { color: "#FFFFFF", size: 14, style: { strokeWidth: 4 } })
+        selected && /* @__PURE__ */ jsx5(FiCheck2, { color: "#FFFFFF", size: 14, style: { strokeWidth: 4 } })
       ]
     }
   ) });
@@ -2682,7 +2713,8 @@ var Checkbox = ({ className, required, disabled }) => {
 // src/components/Input/index.tsx
 import {
   useEffect,
-  useState as useState3
+  useState as useState3,
+  forwardRef
 } from "react";
 import { FiCheck as FiCheck3, FiX } from "react-icons/fi";
 
@@ -2748,65 +2780,102 @@ var masks = {
 var masks_default = masks;
 
 // src/components/Input/index.tsx
-import { Fragment, jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
-var Input = (_a) => {
-  var _b = _a, {
-    className,
-    disabled,
-    placeholder,
-    value,
-    validated,
-    error,
-    required,
-    type,
-    onClick
-  } = _b, rest = __objRest(_b, [
-    "className",
-    "disabled",
-    "placeholder",
-    "value",
-    "validated",
-    "error",
-    "required",
-    "type",
-    "onClick"
-  ]);
-  const [selected, setSelected] = useState3(false);
-  const [inputValue, setInputValue] = useState3(value);
-  const [hasNumber, setHasNumber] = useState3(false);
-  const [hasSpecialCharacteres, setHasSpecialCharacteres] = useState3(false);
-  const [hasEightCharacteres, setHasEightCharacteres] = useState3(false);
-  const handleFocus = () => {
-    setSelected(!selected);
-  };
-  const handleBlur = () => {
-    setSelected(false);
-  };
-  const handleInput = (event) => {
-    setInputValue(event.currentTarget.value);
-    checkPassword(event.currentTarget.value);
-  };
-  useEffect(() => {
-    setInputValue(value);
-  }, [value]);
-  const checkPassword = (value2) => {
-    setHasSpecialCharacteres((value2 == null ? void 0 : value2.match(masks_default.password[0])) !== null);
-    setHasNumber((value2 == null ? void 0 : value2.match(masks_default.password[1])) !== null);
-    setHasEightCharacteres((value2 == null ? void 0 : value2.match(masks_default.password[2])) !== null);
-  };
-  return /* @__PURE__ */ jsxs4(Fragment, { children: [
-    type === "text" || type === "password" || type === "date" ? /* @__PURE__ */ jsxs4(Fragment, { children: [
-      /* @__PURE__ */ jsx5(
+import { Fragment, jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+var Input = forwardRef(
+  (_a, ref) => {
+    var _b = _a, {
+      className,
+      disabled,
+      placeholder,
+      value,
+      validated,
+      error,
+      required,
+      type,
+      onClick
+    } = _b, rest = __objRest(_b, [
+      "className",
+      "disabled",
+      "placeholder",
+      "value",
+      "validated",
+      "error",
+      "required",
+      "type",
+      "onClick"
+    ]);
+    const [selected, setSelected] = useState3(false);
+    const [inputValue, setInputValue] = useState3(value);
+    const [hasNumber, setHasNumber] = useState3(false);
+    const [hasSpecialCharacteres, setHasSpecialCharacteres] = useState3(false);
+    const [hasEightCharacteres, setHasEightCharacteres] = useState3(false);
+    const handleFocus = () => {
+      setSelected(!selected);
+    };
+    const handleBlur = () => {
+      setSelected(false);
+    };
+    const handleInput = (event) => {
+      setInputValue(event.currentTarget.value);
+      checkPassword(event.currentTarget.value);
+    };
+    useEffect(() => {
+      setInputValue(value);
+    }, [value]);
+    const checkPassword = (value2) => {
+      setHasSpecialCharacteres((value2 == null ? void 0 : value2.match(masks_default.password[0])) !== null);
+      setHasNumber((value2 == null ? void 0 : value2.match(masks_default.password[1])) !== null);
+      setHasEightCharacteres((value2 == null ? void 0 : value2.match(masks_default.password[2])) !== null);
+    };
+    return /* @__PURE__ */ jsxs4(Fragment, { children: [
+      type === "text" || type === "password" || type === "date" ? /* @__PURE__ */ jsxs4(Fragment, { children: [
+        /* @__PURE__ */ jsx6(
+          "input",
+          __spreadValues({
+            type,
+            required,
+            ref,
+            className: twMerge(
+              "flex items-center justify-center border-2 border-neutral rounded-sm w-full px-3 py-2 text-md hover:shadow-md hover:shadow-neutral-500 focus:outline-none",
+              className,
+              disabled === true && "opacity-50 cursor-not-allowed",
+              selected === true && "border-2 border-orange-500",
+              validated === true && "border-2 border-green-900",
+              error === true && "border-2 border-red-900"
+            ),
+            onClick,
+            onFocus: handleFocus,
+            onChange: handleInput,
+            onBlur: handleBlur,
+            placeholder,
+            value: inputValue
+          }, rest)
+        ),
+        type === "password" && (!hasEightCharacteres || !hasSpecialCharacteres || !hasNumber) && /* @__PURE__ */ jsxs4("ul", { className: "py-1", children: [
+          /* @__PURE__ */ jsxs4("li", { className: "flex items-center px-2", children: [
+            hasEightCharacteres ? /* @__PURE__ */ jsx6(FiCheck3, {}) : /* @__PURE__ */ jsx6(FiX, {}),
+            /* @__PURE__ */ jsx6("span", { className: "px-1", children: "Pelo menos 8 caracteres" })
+          ] }),
+          /* @__PURE__ */ jsxs4("li", { className: "flex items-center px-2", children: [
+            hasSpecialCharacteres ? /* @__PURE__ */ jsx6(FiCheck3, {}) : /* @__PURE__ */ jsx6(FiX, {}),
+            /* @__PURE__ */ jsx6("span", { className: "px-1", children: "Pelo menos 1 s\xEDmbolo (@, !, $, etc)" })
+          ] }),
+          /* @__PURE__ */ jsxs4("li", { className: "flex items-center px-2", children: [
+            hasNumber ? /* @__PURE__ */ jsx6(FiCheck3, {}) : /* @__PURE__ */ jsx6(FiX, {}),
+            /* @__PURE__ */ jsx6("span", { className: "px-1", children: "Deve conter 1 n\xFAmero" })
+          ] })
+        ] })
+      ] }) : /* @__PURE__ */ jsx6(
         "input",
         __spreadValues({
           type,
           required,
+          ref,
           className: twMerge(
             "flex items-center justify-center border-2 border-neutral rounded-sm w-full px-3 py-2 text-md hover:shadow-md hover:shadow-neutral-500 focus:outline-none",
             className,
             disabled === true && "opacity-50 cursor-not-allowed",
             selected === true && "border-2 border-orange-500",
-            validated === true && "border-2 border-green-900",
             error === true && "border-2 border-red-900"
           ),
           onClick,
@@ -2817,52 +2886,20 @@ var Input = (_a) => {
           value: inputValue
         }, rest)
       ),
-      type === "password" && (!hasEightCharacteres || !hasSpecialCharacteres || !hasNumber) && /* @__PURE__ */ jsxs4("ul", { className: "py-1", children: [
-        /* @__PURE__ */ jsxs4("li", { className: "flex items-center px-2", children: [
-          hasEightCharacteres ? /* @__PURE__ */ jsx5(FiCheck3, {}) : /* @__PURE__ */ jsx5(FiX, {}),
-          /* @__PURE__ */ jsx5("span", { className: "px-1", children: "Pelo menos 8 caracteres" })
-        ] }),
-        /* @__PURE__ */ jsxs4("li", { className: "flex items-center px-2", children: [
-          hasSpecialCharacteres ? /* @__PURE__ */ jsx5(FiCheck3, {}) : /* @__PURE__ */ jsx5(FiX, {}),
-          /* @__PURE__ */ jsx5("span", { className: "px-1", children: "Pelo menos 1 s\xEDmbolo (@, !, $, etc)" })
-        ] }),
-        /* @__PURE__ */ jsxs4("li", { className: "flex items-center px-2", children: [
-          hasNumber ? /* @__PURE__ */ jsx5(FiCheck3, {}) : /* @__PURE__ */ jsx5(FiX, {}),
-          /* @__PURE__ */ jsx5("span", { className: "px-1", children: "Deve conter 1 n\xFAmero" })
-        ] })
-      ] })
-    ] }) : /* @__PURE__ */ jsx5(
-      "input",
-      __spreadValues({
-        type,
-        required,
-        className: twMerge(
-          "flex items-center justify-center border-2 border-neutral rounded-sm w-full px-3 py-2 text-md hover:shadow-md hover:shadow-neutral-500 focus:outline-none",
-          className,
-          disabled === true && "opacity-50 cursor-not-allowed",
-          selected === true && "border-2 border-orange-500",
-          error === true && "border-2 border-red-900"
-        ),
-        onClick,
-        onFocus: handleFocus,
-        onChange: handleInput,
-        onBlur: handleBlur,
-        placeholder,
-        value: inputValue
-      }, rest)
-    ),
-    error === true && /* @__PURE__ */ jsx5("label", { htmlFor: rest.id, className: "text-red-900", children: "Campo inv\xE1lido." })
-  ] });
-};
+      error === true && /* @__PURE__ */ jsx6("label", { htmlFor: rest.id, className: "text-red-900", children: "Campo inv\xE1lido." })
+    ] });
+  }
+);
+Input.displayName = "Input";
 
 // src/components/TextInput/index.tsx
 import {
   useEffect as useEffect2,
   useState as useState4,
-  forwardRef
+  forwardRef as forwardRef2
 } from "react";
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
-var TextInput = forwardRef(
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+var TextInput = forwardRef2(
   (_a, ref) => {
     var _b = _a, {
       className,
@@ -2911,8 +2948,8 @@ var TextInput = forwardRef(
           error === true && "border-2 border-red-900"
         ),
         children: [
-          !!prefix && /* @__PURE__ */ jsx6("span", { className: "text-neutral-500 sm:text-sm", children: prefix }),
-          /* @__PURE__ */ jsx6(
+          !!prefix && /* @__PURE__ */ jsx7("span", { className: "text-neutral-500 sm:text-sm", children: prefix }),
+          /* @__PURE__ */ jsx7(
             "input",
             __spreadValues({
               type,
@@ -2946,7 +2983,7 @@ import {
   useEffect as useEffect3,
   useState as useState5
 } from "react";
-import { jsx as jsx7 } from "react/jsx-runtime";
+import { jsx as jsx8 } from "react/jsx-runtime";
 var TextArea = (_a) => {
   var _b = _a, {
     className,
@@ -2979,7 +3016,7 @@ var TextArea = (_a) => {
   useEffect3(() => {
     setInputValue(value);
   }, [value]);
-  return /* @__PURE__ */ jsx7(
+  return /* @__PURE__ */ jsx8(
     "textarea",
     __spreadValues({
       required,
@@ -3003,7 +3040,7 @@ var TextArea = (_a) => {
 };
 
 // src/components/Text/index.tsx
-import { jsx as jsx8 } from "react/jsx-runtime";
+import { jsx as jsx9 } from "react/jsx-runtime";
 var Text = (_a) => {
   var _b = _a, {
     children,
@@ -3035,11 +3072,11 @@ var Text = (_a) => {
     "9xl": "text-9xl"
   }[size];
   const Tag = tag;
-  return /* @__PURE__ */ jsx8(Tag, __spreadProps(__spreadValues({}, rest), { className: twMerge(`text-${color} ${fontSize}`, className), children }));
+  return /* @__PURE__ */ jsx9(Tag, __spreadProps(__spreadValues({}, rest), { className: twMerge(`text-${color} ${fontSize}`, className), children }));
 };
 
 // src/components/Heading/index.tsx
-import { jsx as jsx9 } from "react/jsx-runtime";
+import { jsx as jsx10 } from "react/jsx-runtime";
 var Heading = ({
   children,
   color = "neutral-800",
@@ -3062,11 +3099,11 @@ var Heading = ({
     "9xl": "text-9xl"
   }[size];
   const Tag = tag;
-  return /* @__PURE__ */ jsx9(Tag, { className: twMerge(`text-${color} ${fontSize}`, className), children });
+  return /* @__PURE__ */ jsx10(Tag, { className: twMerge(`text-${color} ${fontSize}`, className), children });
 };
 
 // src/components/Box/index.tsx
-import { jsx as jsx10 } from "react/jsx-runtime";
+import { jsx as jsx11 } from "react/jsx-runtime";
 var Box = ({
   className,
   children,
@@ -3074,7 +3111,7 @@ var Box = ({
   variant = "secondary"
 }) => {
   const Tag = tag;
-  return /* @__PURE__ */ jsx10(
+  return /* @__PURE__ */ jsx11(
     Tag,
     {
       className: twMerge(
@@ -3089,7 +3126,7 @@ var Box = ({
 };
 
 // src/components/Form/index.tsx
-import { jsx as jsx11 } from "react/jsx-runtime";
+import { jsx as jsx12 } from "react/jsx-runtime";
 var Form = (_a) => {
   var _b = _a, {
     className,
@@ -3102,7 +3139,7 @@ var Form = (_a) => {
     "variant",
     "orientation"
   ]);
-  return /* @__PURE__ */ jsx11(
+  return /* @__PURE__ */ jsx12(
     "form",
     __spreadProps(__spreadValues({
       className: twMerge(
@@ -3120,10 +3157,10 @@ var Form = (_a) => {
 
 // src/components/Avatar/index.tsx
 import { FaUser } from "react-icons/fa";
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx13 } from "react/jsx-runtime";
 var Avatar = (_a) => {
   var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx13(
     "div",
     {
       className: twMerge(
@@ -3132,18 +3169,18 @@ var Avatar = (_a) => {
             bg-neutral-600 justify-center`,
         className
       ),
-      children: rest.src ? /* @__PURE__ */ jsx12("img", __spreadValues({ className: "w-full h-full object-cover rounded-full" }, rest)) : /* @__PURE__ */ jsx12(FaUser, { color: "#FFFFFF", size: 24 })
+      children: rest.src ? /* @__PURE__ */ jsx13("img", __spreadValues({ className: "w-full h-full object-cover rounded-full" }, rest)) : /* @__PURE__ */ jsx13(FaUser, { color: "#FFFFFF", size: 24 })
     }
   );
 };
 
 // src/components/MultiStep/index.tsx
-import { jsx as jsx13, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs6 } from "react/jsx-runtime";
 var MultiStep = ({ className, size, currentStep }) => {
   return /* @__PURE__ */ jsxs6("div", { className: "w-full", children: [
-    /* @__PURE__ */ jsx13(Text, { tag: "label", color: "neutral-100", size: "xs", children: `Passo ${currentStep} de ${size}` }),
-    /* @__PURE__ */ jsx13("div", { className: `grid gap-2 grid-cols-${size} grid-flow-col mt-1`, children: Array.from(Array(size).keys()).map((_, index) => {
-      return /* @__PURE__ */ jsx13(
+    /* @__PURE__ */ jsx14(Text, { tag: "label", color: "neutral-100", size: "xs", children: `Passo ${currentStep} de ${size}` }),
+    /* @__PURE__ */ jsx14("div", { className: `grid gap-2 grid-cols-${size} grid-flow-col mt-1`, children: Array.from(Array(size).keys()).map((_, index) => {
+      return /* @__PURE__ */ jsx14(
         "div",
         {
           className: twMerge(
@@ -3166,6 +3203,7 @@ export {
   Form,
   Heading,
   Input,
+  Link,
   MultiStep,
   RadioGroup,
   Text,

package/dist/tailwind.css

@@ -656,6 +656,10 @@ video {
   gap: 0.5rem;
 }
 
+.gap-4 {
+  gap: 1rem;
+}
+
 .overflow-hidden {
   overflow: hidden;
 }
@@ -883,6 +887,11 @@ video {
   line-height: 1.25;
 }
 
+.text-blue-800 {
+  --tw-text-opacity: 1;
+  color: rgb(30 64 175 / var(--tw-text-opacity));
+}
+
 .text-neutral {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
@@ -935,9 +944,9 @@ html {
   border-color: rgb(243 98 70 / var(--tw-border-opacity));
 }
 
-.hover\:bg-neutral-200:hover {
+.hover\:bg-orange-500:hover {
   --tw-bg-opacity: 1;
-  background-color: rgb(246 246 246 / var(--tw-bg-opacity));
+  background-color: rgb(243 98 70 / var(--tw-bg-opacity));
 }
 
 .hover\:bg-orange-700:hover {
@@ -945,6 +954,11 @@ html {
   background-color: rgb(194 65 12 / var(--tw-bg-opacity));
 }
 
+.hover\:text-orange-100:hover {
+  --tw-text-opacity: 1;
+  color: rgb(255 237 213 / var(--tw-text-opacity));
+}
+
 .hover\:shadow-md:hover {
   --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koaris/bloom-ui",
-  "version": "1.0.4",
+  "version": "1.0.5",
   "description": "Bloom-ui is a public design system from the Koaris Project developed with React, Typescript, and Tailwind.",
   "source": "./src/index.ts",
   "main": "./dist/index.js",