@koaris/bloom-ui 1.0.4 → 1.1.0

package/dist/index.js

@@ -47,8 +47,8 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/index.tsx
-var src_exports = {};
-__export(src_exports, {
+var index_exports = {};
+__export(index_exports, {
   Avatar: () => Avatar,
   Box: () => Box,
   Button: () => Button,
@@ -57,42 +57,43 @@ __export(src_exports, {
   Form: () => Form,
   Heading: () => Heading,
   Input: () => Input,
+  Link: () => Link,
   MultiStep: () => MultiStep,
   RadioGroup: () => RadioGroup,
   Text: () => Text,
   TextArea: () => TextArea,
   TextInput: () => TextInput
 });
-module.exports = __toCommonJS(src_exports);
+module.exports = __toCommonJS(index_exports);
 
 // ../../node_modules/tailwind-merge/dist/bundle-mjs.mjs
 var CLASS_PART_SEPARATOR = "-";
-function createClassUtils(config) {
+var createClassGroupUtils = (config) => {
   const classMap = createClassMap(config);
   const {
     conflictingClassGroups,
     conflictingClassGroupModifiers
   } = config;
-  function getClassGroupId(className) {
+  const getClassGroupId = (className) => {
     const classParts = className.split(CLASS_PART_SEPARATOR);
     if (classParts[0] === "" && classParts.length !== 1) {
       classParts.shift();
     }
     return getGroupRecursive(classParts, classMap) || getGroupIdForArbitraryProperty(className);
-  }
-  function getConflictingClassGroupIds(classGroupId, hasPostfixModifier) {
+  };
+  const getConflictingClassGroupIds = (classGroupId, hasPostfixModifier) => {
     const conflicts = conflictingClassGroups[classGroupId] || [];
     if (hasPostfixModifier && conflictingClassGroupModifiers[classGroupId]) {
       return [...conflicts, ...conflictingClassGroupModifiers[classGroupId]];
     }
     return conflicts;
-  }
+  };
   return {
     getClassGroupId,
     getConflictingClassGroupIds
   };
-}
-function getGroupRecursive(classParts, classPartObject) {
+};
+var getGroupRecursive = (classParts, classPartObject) => {
   var _a;
   if (classParts.length === 0) {
     return classPartObject.classGroupId;
@@ -110,9 +111,9 @@ function getGroupRecursive(classParts, classPartObject) {
   return (_a = classPartObject.validators.find(({
     validator
   }) => validator(classRest))) == null ? void 0 : _a.classGroupId;
-}
+};
 var arbitraryPropertyRegex = /^\[(.+)\]$/;
-function getGroupIdForArbitraryProperty(className) {
+var getGroupIdForArbitraryProperty = (className) => {
   if (arbitraryPropertyRegex.test(className)) {
     const arbitraryPropertyClassName = arbitraryPropertyRegex.exec(className)[1];
     const property = arbitraryPropertyClassName == null ? void 0 : arbitraryPropertyClassName.substring(0, arbitraryPropertyClassName.indexOf(":"));
@@ -120,8 +121,8 @@ function getGroupIdForArbitraryProperty(className) {
       return "arbitrary.." + property;
     }
   }
-}
-function createClassMap(config) {
+};
+var createClassMap = (config) => {
   const {
     theme,
     prefix
@@ -135,8 +136,8 @@ function createClassMap(config) {
     processClassesRecursively(classGroup, classMap, classGroupId, theme);
   });
   return classMap;
-}
-function processClassesRecursively(classGroup, classPartObject, classGroupId, theme) {
+};
+var processClassesRecursively = (classGroup, classPartObject, classGroupId, theme) => {
   classGroup.forEach((classDefinition) => {
     if (typeof classDefinition === "string") {
       const classPartObjectToEdit = classDefinition === "" ? classPartObject : getPart(classPartObject, classDefinition);
@@ -158,8 +159,8 @@ function processClassesRecursively(classGroup, classPartObject, classGroupId, th
       processClassesRecursively(classGroup2, getPart(classPartObject, key), classGroupId, theme);
     });
   });
-}
-function getPart(classPartObject, path) {
+};
+var getPart = (classPartObject, path) => {
   let currentClassPartObject = classPartObject;
   path.split(CLASS_PART_SEPARATOR).forEach((pathPart) => {
     if (!currentClassPartObject.nextPart.has(pathPart)) {
@@ -171,11 +172,9 @@ function getPart(classPartObject, path) {
     currentClassPartObject = currentClassPartObject.nextPart.get(pathPart);
   });
   return currentClassPartObject;
-}
-function isThemeGetter(func) {
-  return func.isThemeGetter;
-}
-function getPrefixedClassGroupEntries(classGroupEntries, prefix) {
+};
+var isThemeGetter = (func) => func.isThemeGetter;
+var getPrefixedClassGroupEntries = (classGroupEntries, prefix) => {
   if (!prefix) {
     return classGroupEntries;
   }
@@ -191,8 +190,8 @@ function getPrefixedClassGroupEntries(classGroupEntries, prefix) {
     });
     return [classGroupId, prefixedClassGroup];
   });
-}
-function createLruCache(maxCacheSize) {
+};
+var createLruCache = (maxCacheSize) => {
   if (maxCacheSize < 1) {
     return {
       get: () => void 0,
@@ -203,7 +202,7 @@ function createLruCache(maxCacheSize) {
   let cacheSize = 0;
   let cache = /* @__PURE__ */ new Map();
   let previousCache = /* @__PURE__ */ new Map();
-  function update(key, value) {
+  const update = (key, value) => {
     cache.set(key, value);
     cacheSize++;
     if (cacheSize > maxCacheSize) {
@@ -211,7 +210,7 @@ function createLruCache(maxCacheSize) {
       previousCache = cache;
       cache = /* @__PURE__ */ new Map();
     }
-  }
+  };
   return {
     get(key) {
       let value = cache.get(key);
@@ -231,14 +230,17 @@ function createLruCache(maxCacheSize) {
       }
     }
   };
-}
+};
 var IMPORTANT_MODIFIER = "!";
-function createSplitModifiers(config) {
-  const separator = config.separator;
+var createParseClassName = (config) => {
+  const {
+    separator,
+    experimentalParseClassName
+  } = config;
   const isSeparatorSingleCharacter = separator.length === 1;
   const firstSeparatorCharacter = separator[0];
   const separatorLength = separator.length;
-  return function splitModifiers(className) {
+  const parseClassName = (className) => {
     const modifiers = [];
     let bracketDepth = 0;
     let modifierStart = 0;
@@ -273,8 +275,15 @@ function createSplitModifiers(config) {
       maybePostfixModifierPosition
     };
   };
-}
-function sortModifiers(modifiers) {
+  if (experimentalParseClassName) {
+    return (className) => experimentalParseClassName({
+      className,
+      parseClassName
+    });
+  }
+  return parseClassName;
+};
+var sortModifiers = (modifiers) => {
   if (modifiers.length <= 1) {
     return modifiers;
   }
@@ -291,73 +300,59 @@ function sortModifiers(modifiers) {
   });
   sortedModifiers.push(...unsortedModifiers.sort());
   return sortedModifiers;
-}
-function createConfigUtils(config) {
-  return __spreadValues({
-    cache: createLruCache(config.cacheSize),
-    splitModifiers: createSplitModifiers(config)
-  }, createClassUtils(config));
-}
+};
+var createConfigUtils = (config) => __spreadValues({
+  cache: createLruCache(config.cacheSize),
+  parseClassName: createParseClassName(config)
+}, createClassGroupUtils(config));
 var SPLIT_CLASSES_REGEX = /\s+/;
-function mergeClassList(classList, configUtils) {
+var mergeClassList = (classList, configUtils) => {
   const {
-    splitModifiers,
+    parseClassName,
     getClassGroupId,
     getConflictingClassGroupIds
   } = configUtils;
-  const classGroupsInConflict = /* @__PURE__ */ new Set();
-  return classList.trim().split(SPLIT_CLASSES_REGEX).map((originalClassName) => {
+  const classGroupsInConflict = [];
+  const classNames = classList.trim().split(SPLIT_CLASSES_REGEX);
+  let result = "";
+  for (let index = classNames.length - 1; index >= 0; index -= 1) {
+    const originalClassName = classNames[index];
     const {
       modifiers,
       hasImportantModifier,
       baseClassName,
       maybePostfixModifierPosition
-    } = splitModifiers(originalClassName);
-    let classGroupId = getClassGroupId(maybePostfixModifierPosition ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
+    } = parseClassName(originalClassName);
     let hasPostfixModifier = Boolean(maybePostfixModifierPosition);
+    let classGroupId = getClassGroupId(hasPostfixModifier ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
     if (!classGroupId) {
-      if (!maybePostfixModifierPosition) {
-        return {
-          isTailwindClass: false,
-          originalClassName
-        };
+      if (!hasPostfixModifier) {
+        result = originalClassName + (result.length > 0 ? " " + result : result);
+        continue;
       }
       classGroupId = getClassGroupId(baseClassName);
       if (!classGroupId) {
-        return {
-          isTailwindClass: false,
-          originalClassName
-        };
+        result = originalClassName + (result.length > 0 ? " " + result : result);
+        continue;
       }
       hasPostfixModifier = false;
     }
     const variantModifier = sortModifiers(modifiers).join(":");
     const modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
-    return {
-      isTailwindClass: true,
-      modifierId,
-      classGroupId,
-      originalClassName,
-      hasPostfixModifier
-    };
-  }).reverse().filter((parsed) => {
-    if (!parsed.isTailwindClass) {
-      return true;
-    }
-    const {
-      modifierId,
-      classGroupId,
-      hasPostfixModifier
-    } = parsed;
     const classId = modifierId + classGroupId;
-    if (classGroupsInConflict.has(classId)) {
-      return false;
+    if (classGroupsInConflict.includes(classId)) {
+      continue;
     }
-    classGroupsInConflict.add(classId);
-    getConflictingClassGroupIds(classGroupId, hasPostfixModifier).forEach((group) => classGroupsInConflict.add(modifierId + group));
-    return true;
-  }).reverse().map((parsed) => parsed.originalClassName).join(" ");
-}
+    classGroupsInConflict.push(classId);
+    const conflictGroups = getConflictingClassGroupIds(classGroupId, hasPostfixModifier);
+    for (let i = 0; i < conflictGroups.length; ++i) {
+      const group = conflictGroups[i];
+      classGroupsInConflict.push(modifierId + group);
+    }
+    result = originalClassName + (result.length > 0 ? " " + result : result);
+  }
+  return result;
+};
 function twJoin() {
   let index = 0;
   let argument;
@@ -373,7 +368,7 @@ function twJoin() {
   }
   return string;
 }
-function toValue(mix) {
+var toValue = (mix) => {
   if (typeof mix === "string") {
     return mix;
   }
@@ -388,7 +383,7 @@ function toValue(mix) {
     }
   }
   return string;
-}
+};
 function createTailwindMerge(createConfigFirst, ...createConfigRest) {
   let configUtils;
   let cacheGet;
@@ -415,60 +410,35 @@ function createTailwindMerge(createConfigFirst, ...createConfigRest) {
     return functionToCall(twJoin.apply(null, arguments));
   };
 }
-function fromTheme(key) {
+var fromTheme = (key) => {
   const themeGetter = (theme) => theme[key] || [];
   themeGetter.isThemeGetter = true;
   return themeGetter;
-}
+};
 var arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i;
 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 shadowRegex = /^-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
+var colorFunctionRegex = /^(rgba?|hsla?|hwb|(ok)?(lab|lch))\(.+\)$/;
+var shadowRegex = /^(inset_)?-?((\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) {
-  return isNumber(value) || stringLengths.has(value) || fractionRegex.test(value);
-}
-function isArbitraryLength(value) {
-  return getIsArbitraryValue(value, "length", isLengthOnly);
-}
-function isNumber(value) {
-  return Boolean(value) && !Number.isNaN(Number(value));
-}
-function isArbitraryNumber(value) {
-  return getIsArbitraryValue(value, "number", isNumber);
-}
-function isInteger(value) {
-  return Boolean(value) && Number.isInteger(Number(value));
-}
-function isPercent(value) {
-  return value.endsWith("%") && isNumber(value.slice(0, -1));
-}
-function isArbitraryValue(value) {
-  return arbitraryValueRegex.test(value);
-}
-function isTshirtSize(value) {
-  return tshirtUnitRegex.test(value);
-}
+var isLength = (value) => isNumber(value) || stringLengths.has(value) || fractionRegex.test(value);
+var isArbitraryLength = (value) => getIsArbitraryValue(value, "length", isLengthOnly);
+var isNumber = (value) => Boolean(value) && !Number.isNaN(Number(value));
+var isArbitraryNumber = (value) => getIsArbitraryValue(value, "number", isNumber);
+var isInteger = (value) => Boolean(value) && Number.isInteger(Number(value));
+var isPercent = (value) => value.endsWith("%") && isNumber(value.slice(0, -1));
+var isArbitraryValue = (value) => arbitraryValueRegex.test(value);
+var isTshirtSize = (value) => tshirtUnitRegex.test(value);
 var sizeLabels = /* @__PURE__ */ new Set(["length", "size", "percentage"]);
-function isArbitrarySize(value) {
-  return getIsArbitraryValue(value, sizeLabels, isNever);
-}
-function isArbitraryPosition(value) {
-  return getIsArbitraryValue(value, "position", isNever);
-}
+var isArbitrarySize = (value) => getIsArbitraryValue(value, sizeLabels, isNever);
+var isArbitraryPosition = (value) => getIsArbitraryValue(value, "position", isNever);
 var imageLabels = /* @__PURE__ */ new Set(["image", "url"]);
-function isArbitraryImage(value) {
-  return getIsArbitraryValue(value, imageLabels, isImage);
-}
-function isArbitraryShadow(value) {
-  return getIsArbitraryValue(value, "", isShadow);
-}
-function isAny() {
-  return true;
-}
-function getIsArbitraryValue(value, label, testValue) {
+var isArbitraryImage = (value) => getIsArbitraryValue(value, imageLabels, isImage);
+var isArbitraryShadow = (value) => getIsArbitraryValue(value, "", isShadow);
+var isAny = () => true;
+var getIsArbitraryValue = (value, label, testValue) => {
   const result = arbitraryValueRegex.exec(value);
   if (result) {
     if (result[1]) {
@@ -477,20 +447,17 @@ function getIsArbitraryValue(value, label, testValue) {
     return testValue(result[2]);
   }
   return false;
-}
-function isLengthOnly(value) {
-  return lengthUnitRegex.test(value);
-}
-function isNever() {
-  return false;
-}
-function isShadow(value) {
-  return shadowRegex.test(value);
-}
-function isImage(value) {
-  return imageRegex.test(value);
-}
-function getDefaultConfig() {
+};
+var isLengthOnly = (value) => (
+  // `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
+  // For example, `hsl(0 0% 0%)` would be classified as a length without this check.
+  // I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
+  lengthUnitRegex.test(value) && !colorFunctionRegex.test(value)
+);
+var isNever = () => false;
+var isShadow = (value) => shadowRegex.test(value);
+var isImage = (value) => imageRegex.test(value);
+var getDefaultConfig = () => {
   const colors = fromTheme("colors");
   const spacing = fromTheme("spacing");
   const blur = fromTheme("blur");
@@ -524,11 +491,10 @@ function getDefaultConfig() {
   const getNumberWithAutoAndArbitrary = () => ["auto", isNumber, isArbitraryValue];
   const getPositions = () => ["bottom", "center", "left", "left-bottom", "left-top", "right", "right-bottom", "right-top", "top"];
   const getLineStyles = () => ["solid", "dashed", "dotted", "double", "none"];
-  const getBlendModes = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity", "plus-lighter"];
+  const getBlendModes = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"];
   const getAlign = () => ["start", "end", "center", "between", "around", "evenly", "stretch"];
   const getZeroAndEmpty = () => ["", "0", isArbitraryValue];
   const getBreaks = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"];
-  const getNumber = () => [isNumber, isArbitraryNumber];
   const getNumberAndArbitrary = () => [isNumber, isArbitraryValue];
   return {
     cacheSize: 500,
@@ -537,12 +503,12 @@ function getDefaultConfig() {
       colors: [isAny],
       spacing: [isLength, isArbitraryLength],
       blur: ["none", "", isTshirtSize, isArbitraryValue],
-      brightness: getNumber(),
+      brightness: getNumberAndArbitrary(),
       borderColor: [colors],
       borderRadius: ["none", "", "full", isTshirtSize, isArbitraryValue],
       borderSpacing: getSpacingWithArbitrary(),
       borderWidth: getLengthWithEmptyAndArbitrary(),
-      contrast: getNumber(),
+      contrast: getNumberAndArbitrary(),
       grayscale: getZeroAndEmpty(),
       hueRotate: getNumberAndArbitrary(),
       invert: getZeroAndEmpty(),
@@ -551,10 +517,10 @@ function getDefaultConfig() {
       gradientColorStopPositions: [isPercent, isArbitraryLength],
       inset: getSpacingWithAutoAndArbitrary(),
       margin: getSpacingWithAutoAndArbitrary(),
-      opacity: getNumber(),
+      opacity: getNumberAndArbitrary(),
       padding: getSpacingWithArbitrary(),
-      saturate: getNumber(),
-      scale: getNumber(),
+      saturate: getNumberAndArbitrary(),
+      scale: getNumberAndArbitrary(),
       sepia: getZeroAndEmpty(),
       skew: getNumberAndArbitrary(),
       space: getSpacingWithArbitrary(),
@@ -1255,7 +1221,7 @@ function getDefaultConfig() {
        * Font Variant Numeric
        * @see https://tailwindcss.com/docs/font-variant-numeric
        */
-      "fvn-fraction": ["diagonal-fractions", "stacked-fractons"],
+      "fvn-fraction": ["diagonal-fractions", "stacked-fractions"],
       /**
        * Letter Spacing
        * @see https://tailwindcss.com/docs/letter-spacing
@@ -1779,6 +1745,20 @@ function getDefaultConfig() {
       "border-color-y": [{
         "border-y": [borderColor]
       }],
+      /**
+       * Border Color S
+       * @see https://tailwindcss.com/docs/border-color
+       */
+      "border-color-s": [{
+        "border-s": [borderColor]
+      }],
+      /**
+       * Border Color E
+       * @see https://tailwindcss.com/docs/border-color
+       */
+      "border-color-e": [{
+        "border-e": [borderColor]
+      }],
       /**
        * Border Color Top
        * @see https://tailwindcss.com/docs/border-color
@@ -1909,7 +1889,7 @@ function getDefaultConfig() {
        * @see https://tailwindcss.com/docs/mix-blend-mode
        */
       "mix-blend": [{
-        "mix-blend": getBlendModes()
+        "mix-blend": [...getBlendModes(), "plus-lighter", "plus-darker"]
       }],
       /**
        * Background Blend Mode
@@ -2525,7 +2505,7 @@ function getDefaultConfig() {
       "border-w": ["border-w-s", "border-w-e", "border-w-t", "border-w-r", "border-w-b", "border-w-l"],
       "border-w-x": ["border-w-r", "border-w-l"],
       "border-w-y": ["border-w-t", "border-w-b"],
-      "border-color": ["border-color-t", "border-color-r", "border-color-b", "border-color-l"],
+      "border-color": ["border-color-s", "border-color-e", "border-color-t", "border-color-r", "border-color-b", "border-color-l"],
       "border-color-x": ["border-color-r", "border-color-l"],
       "border-color-y": ["border-color-t", "border-color-b"],
       "scroll-m": ["scroll-mx", "scroll-my", "scroll-ms", "scroll-me", "scroll-mt", "scroll-mr", "scroll-mb", "scroll-ml"],
@@ -2543,7 +2523,7 @@ function getDefaultConfig() {
       "font-size": ["leading"]
     }
   };
-}
+};
 var twMerge = /* @__PURE__ */ createTailwindMerge(getDefaultConfig);
 
 // src/components/Card/index.tsx
@@ -2581,10 +2561,10 @@ var Card = (_a) => {
       ),
       onClick,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", { src: rest.image, alt: rest.title, width: imageSize }),
-        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("aside", { className: twMerge(direction === "col" && "text-center"), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", { src: rest.image, alt: rest.title, width: imageSize, height: "auto" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("aside", { className: twMerge(direction === "col" && "text-center", "flex flex-col gap-2"), children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: "text-xl font-bold font-default leading-tight", children: rest.title }),
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "", children: rest.content })
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-justify", children: rest.content })
         ] })
       ]
     }
@@ -2611,9 +2591,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 max-w-[180px]",
         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 +2604,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 +2651,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 +2663,7 @@ var RadioGroup = ({
           className
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
             "input",
             {
               type: "radio",
@@ -2667,24 +2677,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", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
     "label",
     {
       className: twMerge(
@@ -2694,7 +2704,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 +2718,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 +2790,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 +2896,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 +2942,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 +2954,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,23 +2986,27 @@ 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,
     disabled,
+    reference,
     value,
     error,
     required,
     placeholder,
+    resize,
     onClick
   } = _b, rest = __objRest(_b, [
     "className",
     "disabled",
+    "reference",
     "value",
     "error",
     "required",
     "placeholder",
+    "resize",
     "onClick"
   ]);
   const [selected, setSelected] = (0, import_react5.useState)(false);
@@ -3004,10 +3023,11 @@ 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,
+      ref: reference,
       disabled,
       className: twMerge(
         "rounded-sm w-full px-3 py-2 border-2 border-neutral text-md hover:shadow-md hover:shadow-neutral-500 focus:outline-none",
@@ -3015,7 +3035,8 @@ var TextArea = (_a) => {
         className,
         disabled === true && "opacity-50 cursor-not-allowed",
         selected === true && "border-2 border-orange-500",
-        error === true && "border-2 border-red-900"
+        error === true && "border-2 border-red-900",
+        resize === false && "resize-none overflow-hidden"
       ),
       onClick,
       onFocus: handleFocus,
@@ -3028,7 +3049,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 +3081,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 +3108,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 +3120,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 +3135,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 +3148,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 +3166,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 +3178,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 +3213,7 @@ var MultiStep = ({ className, size, currentStep }) => {
   Form,
   Heading,
   Input,
+  Link,
   MultiStep,
   RadioGroup,
   Text,