@consumidor-positivo/aurora 0.0.62 → 0.0.64

package/dist/components/Calendar/index.es.js

@@ -1,9 +1,9 @@
 import "react/jsx-runtime";
 import "../../index-CweZ_OcN.js";
-import "../../index-olB3e5l9.js";
+import "../../index-DhUJjrgP.js";
 import "../Button/index.es.js";
 import "../PortalHolder/index.es.js";
-import { a } from "../../index-DVoyQGyf.js";
+import { a } from "../../index-lcJ0CoDo.js";
 export {
   a as DatepickerCalendar
 };

package/dist/components/CalendarHeader/index.es.js

@@ -4,7 +4,7 @@ import "../Icon/index.es.js";
 import "../icons/IconChevronLeft/index.es.js";
 import "../icons/IconChevronRight/index.es.js";
 import "../../index-BnnDZOqb.js";
-import { C } from "../../index-olB3e5l9.js";
+import { C } from "../../index-DhUJjrgP.js";
 export {
   C as CalendarHeader
 };

package/dist/components/CheckboxField/index.es.js

@@ -2,7 +2,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import { c as classNames } from "../../index-CweZ_OcN.js";
 import "../Icon/index.es.js";
 import { IconCheck } from "../icons/IconCheck/index.es.js";
-import Field from "../Field/index.es.js";
+import { F as Field } from "../../index-DY3hp3Pl.js";
 import { k as COLOR_NEUTRAL_00 } from "../../tokens-TYOJv1j5.js";
 import './styles.css';const CheckboxField = ({
   label,

package/dist/components/Datepicker/index.es.js

@@ -3,7 +3,7 @@ import "../../index-CweZ_OcN.js";
 import "../Icon/index.es.js";
 import { IconCalendar } from "../icons/IconCalendar/index.es.js";
 import { InputField } from "../InputField/index.es.js";
-import { g as getDefaultDate, D as DDMMYYYY, a as DatepickerCalendar, A as AUCalendarDate } from "../../index-DVoyQGyf.js";
+import { g as getDefaultDate, D as DDMMYYYY, a as DatepickerCalendar, A as AUCalendarDate } from "../../index-lcJ0CoDo.js";
 import { useRef, useState, useEffect } from "react";
 import { u as useOutsideClick } from "../../index-BnnDZOqb.js";
 import { B as BREAKPOINT_MD, g as COLOR_NEUTRAL_40 } from "../../tokens-TYOJv1j5.js";

package/dist/components/Field/index.es.js

@@ -1,92 +1,35 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { c as classNames } from "../../index-CweZ_OcN.js";
-import "../Icon/index.es.js";
-import { IconAlertCircle } from "../icons/IconAlertCircle/index.es.js";
-import { IconCheck } from "../icons/IconCheck/index.es.js";
-import { IconSlash } from "../icons/IconSlash/index.es.js";
-import { H as COLOR_SUCCESS_50, O as COLOR_ERROR_50, g as COLOR_NEUTRAL_40 } from "../../tokens-TYOJv1j5.js";
-import './styles.css';const FieldErrorMessage = ({ hasError, message }) => {
-  if (!hasError || !message) return null;
-  return /* @__PURE__ */ jsx("p", { className: "au-field__error-message", children: message });
-};
-const FieldInput = ({
-  inputRef,
-  customclass,
-  ...props
-}) => {
-  const inputClasses = classNames("au-field__input", customclass);
-  return /* @__PURE__ */ jsx("input", { className: inputClasses, ref: inputRef, ...props });
-};
-const FieldInputHolder = ({
-  children,
-  rightSideSlot
-}) => {
-  return /* @__PURE__ */ jsxs("div", { className: "au-field__input-holder", children: [
-    children,
-    rightSideSlot && /* @__PURE__ */ jsx("div", { className: "au-field__right-slot", children: rightSideSlot })
-  ] });
-};
-const FieldLabel = ({
-  id,
-  text,
-  required,
-  optional,
-  success,
+import './styles.css';const RadioField = ({
+  type = "radio",
+  direction = "left",
+  label,
   error,
-  disabled
-}) => {
-  if (!text) return null;
-  const states = [
-    { state: "optional", value: !!optional, icon: /* @__PURE__ */ jsx("span", { children: "(Opcional)" }) },
-    {
-      state: "success",
-      value: !!success,
-      icon: /* @__PURE__ */ jsx(IconCheck, { rawColor: COLOR_SUCCESS_50 })
-    },
-    {
-      state: "error",
-      value: !!error,
-      icon: /* @__PURE__ */ jsx(IconAlertCircle, { rawColor: COLOR_ERROR_50 })
-    },
-    {
-      state: "disabled",
-      value: !!disabled,
-      icon: /* @__PURE__ */ jsx(IconSlash, { rawColor: COLOR_NEUTRAL_40 })
-    }
-  ];
-  const currentState = states.find(({ value }) => !!value);
-  return /* @__PURE__ */ jsxs("div", { className: "au-field__header", children: [
-    /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "au-field__header-label", children: [
-      text,
-      " ",
-      required && /* @__PURE__ */ jsx("strong", { className: "au-field__header-label--required", children: "*" })
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "au-field__header-icon", children: currentState == null ? void 0 : currentState.icon })
-  ] });
-};
-const FieldRoot = ({
-  children,
+  id,
   disabled,
-  success,
-  error,
-  style,
-  customclass
+  ...props
 }) => {
-  const inputClasses = classNames("au-field", customclass, {
-    "au-field--disabled": !!disabled,
-    "au-field--success": !!success,
-    "au-field--error": !!error
+  const radioClasses = classNames("au-radio-field", {
+    "au-radio-field--left-direction": direction === "left",
+    "au-radio-field--right-direction": direction === "right",
+    "au-radio-field--disabled": !!disabled,
+    "au-radio-field--error": !!error
   });
-  return /* @__PURE__ */ jsx("div", { className: inputClasses, style, children });
-};
-const Field = {
-  Root: FieldRoot,
-  Input: FieldInput,
-  InputHolder: FieldInputHolder,
-  Label: FieldLabel,
-  ErrorMessage: FieldErrorMessage
+  return /* @__PURE__ */ jsxs("div", { className: radioClasses, children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        className: "au-radio-field__input",
+        type,
+        id,
+        disabled,
+        ...props
+      }
+    ),
+    /* @__PURE__ */ jsx("label", { className: "au-radio-field__label", htmlFor: id, children: label })
+  ] });
 };
 export {
-  Field as default
+  RadioField
 };
 //# sourceMappingURL=index.es.js.map

package/dist/components/Field/index.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Field/ErrorMessage.tsx","../../../lib/components/form/Field/Input.tsx","../../../lib/components/form/Field/InputHolder.tsx","../../../lib/components/form/Field/Label.tsx","../../../lib/components/form/Field/Root.tsx","../../../lib/components/form/Field/index.tsx"],"sourcesContent":["type ErrorMessageProps = {\n  hasError?: boolean\n  message?: string\n}\n\nexport const FieldErrorMessage = ({ hasError, message }: ErrorMessageProps) => {\n  if (!hasError || !message) return null\n\n  return <p className=\"au-field__error-message\">{message}</p>\n}\n","import classNames from 'classnames'\n\ntype FieldInputProps = React.InputHTMLAttributes<HTMLInputElement> & {\n  inputRef?: React.RefObject<HTMLInputElement>\n  customclass?: string\n}\n\nexport const FieldInput = ({\n  inputRef,\n  customclass,\n  ...props\n}: FieldInputProps) => {\n  const inputClasses = classNames('au-field__input', customclass)\n\n  return <input className={inputClasses} ref={inputRef} {...props} />\n}\n","import React from 'react'\n\ntype FieldInputHolderProps = {\n  children?: React.ReactNode\n  rightSideSlot?: React.ReactNode\n}\n\nexport const FieldInputHolder = ({\n  children,\n  rightSideSlot,\n}: FieldInputHolderProps) => {\n  return (\n    <div className=\"au-field__input-holder\">\n      {children}\n      {rightSideSlot && (\n        <div className=\"au-field__right-slot\">{rightSideSlot}</div>\n      )}\n    </div>\n  )\n}\n","import { IconAlertCircle, IconCheck, IconSlash } from '@components/icons'\nimport {\n  COLOR_ERROR_50,\n  COLOR_NEUTRAL_40,\n  COLOR_SUCCESS_50,\n} from '@core/tokens'\n\ntype FieldLabelProps = {\n  id?: string\n  text?: string\n  required?: boolean\n  optional?: boolean\n  success?: boolean\n  error?: boolean\n  disabled?: boolean\n}\n\nexport const FieldLabel = ({\n  id,\n  text,\n  required,\n  optional,\n  success,\n  error,\n  disabled,\n}: FieldLabelProps) => {\n  if (!text) return null\n\n  const states = [\n    { state: 'optional', value: !!optional, icon: <span>(Opcional)</span> },\n    {\n      state: 'success',\n      value: !!success,\n      icon: <IconCheck rawColor={COLOR_SUCCESS_50} />,\n    },\n    {\n      state: 'error',\n      value: !!error,\n      icon: <IconAlertCircle rawColor={COLOR_ERROR_50} />,\n    },\n    {\n      state: 'disabled',\n      value: !!disabled,\n      icon: <IconSlash rawColor={COLOR_NEUTRAL_40} />,\n    },\n  ]\n\n  const currentState = states.find(({ value }) => !!value)\n\n  return (\n    <div className=\"au-field__header\">\n      <label htmlFor={id} className=\"au-field__header-label\">\n        {text}{' '}\n        {required && (\n          <strong className=\"au-field__header-label--required\">*</strong>\n        )}\n      </label>\n      <div className=\"au-field__header-icon\">{currentState?.icon}</div>\n    </div>\n  )\n}\n","import classNames from 'classnames'\n\ntype FieldRootProps = {\n  children: React.ReactNode\n  disabled?: boolean\n  success?: boolean\n  error?: boolean\n  style?: React.CSSProperties\n  customclass?: string\n}\n\nexport const FieldRoot = ({\n  children,\n  disabled,\n  success,\n  error,\n  style,\n  customclass,\n}: FieldRootProps) => {\n  const inputClasses = classNames('au-field', customclass, {\n    'au-field--disabled': !!disabled,\n    'au-field--success': !!success,\n    'au-field--error': !!error,\n  })\n\n  return (\n    <div className={inputClasses} style={style}>\n      {children}\n    </div>\n  )\n}\n","import { FieldErrorMessage } from './ErrorMessage'\nimport { FieldInput } from './Input'\nimport { FieldInputHolder } from './InputHolder'\nimport { FieldLabel } from './Label'\nimport { FieldRoot } from './Root'\nimport './styles.scss'\n\nexport default {\n    Root: FieldRoot,\n    Input: FieldInput,\n    InputHolder: FieldInputHolder,\n    Label: FieldLabel,\n    ErrorMessage: FieldErrorMessage,\n}"],"names":[],"mappings":";;;;;;;AAKO,MAAM,oBAAoB,CAAC,EAAE,UAAU,cAAiC;AAC7E,MAAI,CAAC,YAAY,CAAC,QAAgB,QAAA;AAElC,SAAQ,oBAAA,KAAA,EAAE,WAAU,2BAA2B,UAAQ,QAAA,CAAA;AACzD;ACFO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAuB;AACf,QAAA,eAAe,WAAW,mBAAmB,WAAW;AAE9D,6BAAQ,SAAM,EAAA,WAAW,cAAc,KAAK,UAAW,GAAG,MAAO,CAAA;AACnE;ACRO,MAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA;AACF,MAA6B;AAEzB,SAAA,qBAAC,OAAI,EAAA,WAAU,0BACZ,UAAA;AAAA,IAAA;AAAA,IACA,iBACC,oBAAC,OAAI,EAAA,WAAU,wBAAwB,UAAc,eAAA;AAAA,EAEzD,EAAA,CAAA;AAEJ;ACFO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAuB;AACjB,MAAA,CAAC,KAAa,QAAA;AAElB,QAAM,SAAS;AAAA,IACb,EAAE,OAAO,YAAY,OAAO,CAAC,CAAC,UAAU,MAAM,oBAAC,QAAK,EAAA,UAAA,aAAU,CAAA,EAAQ;AAAA,IACtE;AAAA,MACE,OAAO;AAAA,MACP,OAAO,CAAC,CAAC;AAAA,MACT,MAAM,oBAAC,WAAU,EAAA,UAAU,iBAAkB,CAAA;AAAA,IAC/C;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,OAAO,CAAC,CAAC;AAAA,MACT,MAAM,oBAAC,iBAAgB,EAAA,UAAU,eAAgB,CAAA;AAAA,IACnD;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,OAAO,CAAC,CAAC;AAAA,MACT,MAAM,oBAAC,WAAU,EAAA,UAAU,iBAAkB,CAAA;AAAA,IAC/C;AAAA,EAAA;AAGI,QAAA,eAAe,OAAO,KAAK,CAAC,EAAE,YAAY,CAAC,CAAC,KAAK;AAGrD,SAAA,qBAAC,OAAI,EAAA,WAAU,oBACb,UAAA;AAAA,IAAA,qBAAC,SAAM,EAAA,SAAS,IAAI,WAAU,0BAC3B,UAAA;AAAA,MAAA;AAAA,MAAM;AAAA,MACN,YACC,oBAAC,UAAO,EAAA,WAAU,oCAAmC,UAAC,KAAA;AAAA,IAAA,GAE1D;AAAA,IACC,oBAAA,OAAA,EAAI,WAAU,yBAAyB,uDAAc,MAAK;AAAA,EAC7D,EAAA,CAAA;AAEJ;ACjDO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAsB;AACd,QAAA,eAAe,WAAW,YAAY,aAAa;AAAA,IACvD,sBAAsB,CAAC,CAAC;AAAA,IACxB,qBAAqB,CAAC,CAAC;AAAA,IACvB,mBAAmB,CAAC,CAAC;AAAA,EAAA,CACtB;AAED,SACG,oBAAA,OAAA,EAAI,WAAW,cAAc,OAC3B,SACH,CAAA;AAEJ;ACvBA,MAAe,QAAA;AAAA,EACX,MAAM;AAAA,EACN,OAAO;AAAA,EACP,aAAa;AAAA,EACb,OAAO;AAAA,EACP,cAAc;AAClB;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Radio/Field/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { RadioFieldProps } from '../types'\nimport './styles.scss'\n\nexport const RadioField = ({\n  type = 'radio',\n  direction = 'left',\n  label,\n  error,\n  id,\n  disabled,\n  ...props\n}: RadioFieldProps) => {\n  const radioClasses = classNames('au-radio-field', {\n    'au-radio-field--left-direction': direction === 'left',\n    'au-radio-field--right-direction': direction === 'right',\n    'au-radio-field--disabled': !!disabled,\n    'au-radio-field--error': !!error,\n  })\n  \n  return (\n    <div className={radioClasses}>\n      <input\n        className=\"au-radio-field__input\"\n        type={type}\n        id={id}\n        disabled={disabled}\n        {...props}\n      />\n      <label className=\"au-radio-field__label\" htmlFor={id}>\n        {label}\n      </label>\n    </div>\n  )\n}\n"],"names":[],"mappings":";;AAIO,MAAM,aAAa,CAAC;AAAA,EACzB,OAAO;AAAA,EACP,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAuB;AACf,QAAA,eAAe,WAAW,kBAAkB;AAAA,IAChD,kCAAkC,cAAc;AAAA,IAChD,mCAAmC,cAAc;AAAA,IACjD,4BAA4B,CAAC,CAAC;AAAA,IAC9B,yBAAyB,CAAC,CAAC;AAAA,EAAA,CAC5B;AAGC,SAAA,qBAAC,OAAI,EAAA,WAAW,cACd,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACC,GAAG;AAAA,MAAA;AAAA,IACN;AAAA,wBACC,SAAM,EAAA,WAAU,yBAAwB,SAAS,IAC/C,UACH,OAAA;AAAA,EACF,EAAA,CAAA;AAEJ;"}

package/dist/components/Field/styles.css

@@ -1 +1 @@
-.au-field{cursor:pointer;border-radius:8px}.au-field__input-holder{position:relative;height:56px}.au-field__input{background-color:#fff;border:1px solid #454a54;border-radius:8px;box-sizing:border-box;font-family:inherit;font-size:16px;line-height:22px;padding:16px;height:56px;width:100%}.au-field__input:hover{border:1px solid #16181d}.au-field__input:focus{border-color:#0048db;outline:1px solid #0048db}.au-field:focus-within:not(.au-field--error) .au-field__header-label{color:#0048db}.au-field__header{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px}.au-field__header-label{color:#454a54;cursor:pointer;font-size:14px;font-weight:600}.au-field__header-label--required{color:#991717}.au-field__header-icon span{font-size:14px;color:#454a54}.au-field__right-slot{position:absolute;right:16px;top:50%;transform:translateY(-50%)}.au-field__error-message{color:#991717;font-size:16px;font-weight:400;line-height:24px;padding-top:8px}.au-field--disabled{cursor:not-allowed}.au-field--disabled .au-field__input{background-color:#e2e4e9;border-color:#5e6573;color:#5e6573;cursor:not-allowed}.au-field--disabled .au-field__header-label{color:#5e6573;cursor:not-allowed}.au-field--error .au-field__input{background-color:#f5eff0;border-color:#991717}.au-field--error .au-field__input:focus{border-color:#0048db}.au-field--error .au-field__header-label{color:#991717}.au-field--success .au-field__input{animation:inputSuccess 2s forwards}.au-field--success .au-field__header-label{animation:labelSuccess 2s forwards}.au-field--success .au-field__header-icon .au-icon{animation:iconSucess 2s forwards}@keyframes inputSuccess{0%,70%{background-color:#f0fcf5;border-color:#10593b}}@keyframes labelSuccess{0%,70%{color:#10593b}}@keyframes iconSucess{0%,70%{opacity:1}to{opacity:0}}
+.au-radio-field{cursor:pointer;display:flex;align-items:center;gap:8px;width:max-content}.au-radio-field--left-direction{flex-direction:row}.au-radio-field--right-direction{flex-direction:row-reverse}.au-radio-field__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:50%;cursor:pointer;position:relative;height:24px;width:24px}.au-radio-field__input:after,.au-radio-field__input:before{content:"";border-radius:50%;position:absolute}.au-radio-field__input:after{background-color:#454a54;content:"";height:10px;width:10px;left:7px;top:7px;transform:scale(0);transform-origin:center;transition:transform .2s}.au-radio-field__input:before{content:"";border:2px solid #454a54;height:24px;width:24px}.au-radio-field__input:checked:before{border-color:#0048db;background-color:#0048db;transition:all .2s ease}.au-radio-field__input:checked:after{background-color:#fff;transform:scale(1)}.au-radio-field__input:focus{box-shadow:0 0 0 1px #fff,0 0 0 3px #0048db}.au-radio-field__input:hover:not(:focus){background-color:#f2f5fc;outline:2px solid #F2F5FC}.au-radio-field__label{color:#454a54;font-size:16px;line-height:24px}.au-radio-field--disabled,.au-radio-field--disabled .au-radio-field__input{cursor:not-allowed}.au-radio-field--disabled .au-radio-field__input:before{border-color:#c4c9d4}.au-radio-field--disabled .au-radio-field__input:checked:before{background-color:#c4c9d4}.au-radio-field--disabled .au-radio-field__label{cursor:not-allowed;color:#c4c9d4}.au-radio-field--error .au-radio-field__input:before{border:2px solid #991717}.au-radio-field--error .au-radio-field__input:checked:before{border-color:#0048db}

package/dist/components/Group/index.es.js

@@ -0,0 +1,58 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { c as classNames } from "../../index-CweZ_OcN.js";
+import { F as Field } from "../../index-DY3hp3Pl.js";
+import { Conditional } from "../Conditional/index.es.js";
+import { Text } from "../Text/index.es.js";
+import $dbSRa$react__default, { useState } from "react";
+import { RadioField } from "../Field/index.es.js";
+import './styles.css';const RadioGroup = ({
+  name = "",
+  defaultValue,
+  orientation = "vertical",
+  label,
+  error,
+  errorMessage,
+  children,
+  onChange,
+  onFocus
+}) => {
+  const groupClass = classNames("au-radio-group", {
+    "au-radio-group--horizontal": orientation === "horizontal"
+  });
+  const getSafeName = (name2) => {
+    return name2 ? name2 : `au-radio-group-${Math.random()}`;
+  };
+  const [safeName] = useState(getSafeName(name));
+  const childrenWithProps = $dbSRa$react__default.Children.map(children, (child) => {
+    if ($dbSRa$react__default.isValidElement(child)) {
+      const childProps = child.props;
+      return /* @__PURE__ */ jsx(
+        RadioField,
+        {
+          name: safeName,
+          error,
+          defaultChecked: defaultValue === childProps.value,
+          onChange,
+          onFocus,
+          ...child.props
+        }
+      );
+    }
+    return child;
+  });
+  return /* @__PURE__ */ jsxs("div", { className: groupClass, children: [
+    /* @__PURE__ */ jsx(
+      Conditional,
+      {
+        condition: !!label,
+        renderIf: /* @__PURE__ */ jsx(Text, { variant: "body-medium", weight: "semibold", children: label })
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: "au-radio-group__fields", children: childrenWithProps }),
+    /* @__PURE__ */ jsx(Field.ErrorMessage, { hasError: !!error, message: errorMessage })
+  ] });
+};
+export {
+  RadioGroup
+};
+//# sourceMappingURL=index.es.js.map

package/dist/components/Group/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Radio/Group/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport './styles.scss'\nimport Field from '@components/form/Field'\nimport { Conditional } from '@components/misc'\nimport { Text } from '@components/Text'\nimport React, { useState } from 'react'\nimport { RadioField } from '../Field'\nimport { RadioFieldProps, RadioGroupProps } from '../types'\n\nexport const RadioGroup = ({\n  name = '',\n  defaultValue,\n  orientation = 'vertical',\n  label,\n  error,\n  errorMessage,\n  children,\n  onChange,\n  onFocus,\n}: RadioGroupProps) => {\n  const groupClass = classNames('au-radio-group', {\n    'au-radio-group--horizontal': orientation === 'horizontal',\n  })\n\n  const getSafeName = (name: string): string => {\n    return name ? name : `au-radio-group-${Math.random()}`\n  }\n\n  const [safeName] = useState(getSafeName(name))\n\n  const childrenWithProps = React.Children.map(children, (child) => {\n    if (React.isValidElement(child)) {\n      const childProps = child.props as RadioFieldProps\n\n      return (\n        <RadioField\n          name={safeName}\n          error={error}\n          defaultChecked={defaultValue === childProps.value}\n          onChange={onChange}\n          onFocus={onFocus}\n          {...child.props}\n        />\n      )\n    }\n    return child\n  })\n\n  return (\n    <div className={groupClass}>\n      <Conditional\n        condition={!!label}\n        renderIf={\n          <Text variant=\"body-medium\" weight=\"semibold\">\n            {label}\n          </Text>\n        }\n      />\n      <div className=\"au-radio-group__fields\">{childrenWithProps}</div>\n      <Field.ErrorMessage hasError={!!error} message={errorMessage} />\n    </div>\n  )\n}\n"],"names":["name","React"],"mappings":";;;;;;;AASO,MAAM,aAAa,CAAC;AAAA,EACzB,OAAO;AAAA,EACP;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAuB;AACf,QAAA,aAAa,WAAW,kBAAkB;AAAA,IAC9C,8BAA8B,gBAAgB;AAAA,EAAA,CAC/C;AAEK,QAAA,cAAc,CAACA,UAAyB;AAC5C,WAAOA,QAAOA,QAAO,kBAAkB,KAAK,OAAQ,CAAA;AAAA,EAAA;AAGtD,QAAM,CAAC,QAAQ,IAAI,SAAS,YAAY,IAAI,CAAC;AAE7C,QAAM,oBAAoBC,sBAAM,SAAS,IAAI,UAAU,CAAC,UAAU;AAC5D,QAAAA,sBAAM,eAAe,KAAK,GAAG;AAC/B,YAAM,aAAa,MAAM;AAGvB,aAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN;AAAA,UACA,gBAAgB,iBAAiB,WAAW;AAAA,UAC5C;AAAA,UACA;AAAA,UACC,GAAG,MAAM;AAAA,QAAA;AAAA,MAAA;AAAA,IAGhB;AACO,WAAA;AAAA,EAAA,CACR;AAGC,SAAA,qBAAC,OAAI,EAAA,WAAW,YACd,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,CAAC,CAAC;AAAA,QACb,UACG,oBAAA,MAAA,EAAK,SAAQ,eAAc,QAAO,YAChC,UACH,OAAA;AAAA,MAAA;AAAA,IAEJ;AAAA,IACC,oBAAA,OAAA,EAAI,WAAU,0BAA0B,UAAkB,mBAAA;AAAA,IAC3D,oBAAC,MAAM,cAAN,EAAmB,UAAU,CAAC,CAAC,OAAO,SAAS,cAAc;AAAA,EAChE,EAAA,CAAA;AAEJ;"}

package/dist/components/Group/styles.css

@@ -0,0 +1 @@
+.au-radio-group,.au-radio-group__fields{display:flex;flex-direction:column;gap:16px}.au-radio-group--horizontal .au-radio-group__fields{flex-direction:row}

package/dist/components/InputField/index.es.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import Field from "../Field/index.es.js";
+import { F as Field } from "../../index-DY3hp3Pl.js";
 const InputField = ({
   optional,
   requiredInput,

package/dist/components/PasswordField/index.es.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import Field from "../Field/index.es.js";
+import { F as Field } from "../../index-DY3hp3Pl.js";
 import { useState } from "react";
 import './styles.css';const usePasswordField = () => {
   const [showPassword, setShowPassword] = useState(false);

package/dist/components/Radio/index.es.js

@@ -0,0 +1,14 @@
+import { RadioField } from "../Field/index.es.js";
+import { RadioGroup } from "../Group/index.es.js";
+const components = {
+  Field: RadioField,
+  Group: RadioGroup
+};
+Object.keys(components).forEach((key) => {
+  const component = components[key];
+  component.displayName = `Radio.${key}`;
+});
+export {
+  components as Radio
+};
+//# sourceMappingURL=index.es.js.map

package/dist/components/Radio/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Radio/index.tsx"],"sourcesContent":["import { RadioField } from './Field'\nimport { RadioGroup } from './Group'\nimport { RadioFieldProps, RadioGroupProps } from './types'\n\ntype Components = {\n  Field: React.FC<RadioFieldProps>\n  Group: React.FC<RadioGroupProps>\n}\n\nconst components: Components = {\n  Field: RadioField,\n  Group: RadioGroup,\n}\n\nObject.keys(components).forEach((key) => {\n  const component = components[key as keyof Components]\n  component.displayName = `Radio.${key}`\n})\n\nexport { components as Radio }\n"],"names":[],"mappings":";;AASA,MAAM,aAAyB;AAAA,EAC7B,OAAO;AAAA,EACP,OAAO;AACT;AAEA,OAAO,KAAK,UAAU,EAAE,QAAQ,CAAC,QAAQ;AACjC,QAAA,YAAY,WAAW,GAAuB;AAC1C,YAAA,cAAc,SAAS,GAAG;AACtC,CAAC;"}

package/dist/components/SelectField/index.es.js

@@ -4,7 +4,7 @@ import "../Icon/index.es.js";
 import { IconCheck } from "../icons/IconCheck/index.es.js";
 import { IconChevronDown } from "../icons/IconChevronDown/index.es.js";
 import { IconSlash } from "../icons/IconSlash/index.es.js";
-import Field from "../Field/index.es.js";
+import { F as Field } from "../../index-DY3hp3Pl.js";
 import { useState, useRef, useEffect } from "react";
 import './styles.css';const useSelectField = (options, initialValue, onChange, disabled, register, autocomplete = false) => {
   var _a;

package/dist/components/TextareaField/index.es.js

@@ -0,0 +1,71 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { Text } from "../Text/index.es.js";
+import { F as Field } from "../../index-DY3hp3Pl.js";
+const TextAreaField = ({
+  optional,
+  required,
+  success,
+  error,
+  errorMessage,
+  label,
+  id,
+  disabled,
+  style,
+  className,
+  textAreaStyle,
+  textareaRef,
+  maxLength,
+  ...props
+}) => {
+  const [charCount, setCharCount] = useState(0);
+  const handleInputChange = (e) => {
+    setCharCount(e.target.value.length);
+  };
+  return /* @__PURE__ */ jsxs(
+    Field.Root,
+    {
+      style,
+      customclass: className,
+      success,
+      error,
+      disabled,
+      children: [
+        /* @__PURE__ */ jsx(
+          Field.Label,
+          {
+            text: label,
+            id,
+            required,
+            optional,
+            success,
+            error,
+            disabled
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Field.TextArea,
+          {
+            id,
+            textareaRef,
+            disabled,
+            style: textAreaStyle,
+            maxLength,
+            onChange: handleInputChange,
+            ...props
+          }
+        ),
+        maxLength && /* @__PURE__ */ jsxs(Text, { className: "au-field__char-counter", children: [
+          charCount,
+          "/",
+          maxLength
+        ] }),
+        /* @__PURE__ */ jsx(Field.ErrorMessage, { hasError: !!error, message: errorMessage })
+      ]
+    }
+  );
+};
+export {
+  TextAreaField
+};
+//# sourceMappingURL=index.es.js.map

package/dist/components/TextareaField/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/TextareaField/index.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { Text } from '@components/Text'\nimport Field from '../Field'\n\nexport type TextAreaProps =\n  React.TextareaHTMLAttributes<HTMLTextAreaElement> & {\n    optional?: boolean\n    success?: boolean\n    error?: boolean\n    errorMessage?: string\n    label?: string\n    textAreaStyle?: React.CSSProperties\n    textareaRef?: React.RefObject<HTMLTextAreaElement>\n  }\n\nexport const TextAreaField = ({\n  optional,\n  required,\n  success,\n  error,\n  errorMessage,\n  label,\n  id,\n  disabled,\n  style,\n  className,\n  textAreaStyle,\n  textareaRef,\n  maxLength,\n  ...props\n}: TextAreaProps) => {\n  const [charCount, setCharCount] = useState(0)\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    setCharCount(e.target.value.length)\n  }\n\n  return (\n    <Field.Root\n      style={style}\n      customclass={className}\n      success={success}\n      error={error}\n      disabled={disabled}>\n      <Field.Label\n        text={label}\n        id={id}\n        required={required}\n        optional={optional}\n        success={success}\n        error={error}\n        disabled={disabled}\n      />\n      <Field.TextArea\n        id={id}\n        textareaRef={textareaRef}\n        disabled={disabled}\n        style={textAreaStyle}\n        maxLength={maxLength}\n        onChange={handleInputChange}\n        {...props}\n      />\n      {maxLength && (\n        <Text className=\"au-field__char-counter\">\n          {charCount}/{maxLength}\n        </Text>\n      )}\n      <Field.ErrorMessage hasError={!!error} message={errorMessage} />\n    </Field.Root>\n  )\n}\n"],"names":[],"mappings":";;;;AAeO,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAqB;AACnB,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,CAAC;AAEtC,QAAA,oBAAoB,CAAC,MAA8C;AAC1D,iBAAA,EAAE,OAAO,MAAM,MAAM;AAAA,EAAA;AAIlC,SAAA;AAAA,IAAC,MAAM;AAAA,IAAN;AAAA,MACC;AAAA,MACA,aAAa;AAAA,MACb;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAA;AAAA,QAAA;AAAA,UAAC,MAAM;AAAA,UAAN;AAAA,YACC,MAAM;AAAA,YACN;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,QACA;AAAA,UAAC,MAAM;AAAA,UAAN;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA,OAAO;AAAA,YACP;AAAA,YACA,UAAU;AAAA,YACT,GAAG;AAAA,UAAA;AAAA,QACN;AAAA,QACC,aACC,qBAAC,MAAK,EAAA,WAAU,0BACb,UAAA;AAAA,UAAA;AAAA,UAAU;AAAA,UAAE;AAAA,QAAA,GACf;AAAA,QAEF,oBAAC,MAAM,cAAN,EAAmB,UAAU,CAAC,CAAC,OAAO,SAAS,cAAc;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpE;"}

package/dist/components/TokenField/index.es.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import Field from "../Field/index.es.js";
+import { F as Field } from "../../index-DY3hp3Pl.js";
 import { useRef, useState, useEffect } from "react";
 import './styles.css';function inputtedValueIsValid(value) {
   const numberValue = Number(value);

package/dist/components/form/Field/TextArea.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+type FieldTextAreaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {
+    textareaRef?: React.RefObject<HTMLTextAreaElement>;
+    customclass?: string;
+};
+export declare const FieldTextArea: ({ textareaRef, customclass, ...props }: FieldTextAreaProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/form/Field/index.d.ts

@@ -29,5 +29,9 @@ declare const _default: {
         hasError?: boolean | undefined;
         message?: string | undefined;
     }) => import("react/jsx-runtime").JSX.Element | null;
+    TextArea: ({ textareaRef, customclass, ...props }: import('react').TextareaHTMLAttributes<HTMLTextAreaElement> & {
+        textareaRef?: import('react').RefObject<HTMLTextAreaElement> | undefined;
+        customclass?: string | undefined;
+    }) => import("react/jsx-runtime").JSX.Element;
 };
 export default _default;

package/dist/components/form/Radio/Field/index.d.ts

@@ -0,0 +1,3 @@
+import { RadioFieldProps } from '../types';
+
+export declare const RadioField: ({ type, direction, label, error, id, disabled, ...props }: RadioFieldProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/form/Radio/Group/index.d.ts

@@ -0,0 +1,3 @@
+import { RadioGroupProps } from '../types';
+
+export declare const RadioGroup: ({ name, defaultValue, orientation, label, error, errorMessage, children, onChange, onFocus, }: RadioGroupProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/form/Radio/index.d.ts

@@ -0,0 +1,8 @@
+import { RadioFieldProps, RadioGroupProps } from './types';
+
+type Components = {
+    Field: React.FC<RadioFieldProps>;
+    Group: React.FC<RadioGroupProps>;
+};
+declare const components: Components;
+export { components as Radio };

package/dist/components/form/Radio/types.d.ts

@@ -0,0 +1,19 @@
+import { RadioField } from './Field';
+
+export type RadioFieldProps = React.InputHTMLAttributes<HTMLInputElement> & {
+    direction?: 'left' | 'right';
+    label?: string;
+    error?: boolean;
+    type?: 'radio';
+};
+export type RadioGroupProps = {
+    children: React.ReactElement<typeof RadioField>[];
+    name?: string;
+    defaultValue?: string | number;
+    orientation?: 'horizontal' | 'vertical';
+    label?: string;
+    error?: boolean;
+    errorMessage?: string;
+    onChange?: React.ChangeEventHandler<HTMLInputElement>;
+    onFocus?: React.FocusEventHandler<HTMLInputElement>;
+};

package/dist/components/form/TextareaField/index.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+export type TextAreaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {
+    optional?: boolean;
+    success?: boolean;
+    error?: boolean;
+    errorMessage?: string;
+    label?: string;
+    textAreaStyle?: React.CSSProperties;
+    textareaRef?: React.RefObject<HTMLTextAreaElement>;
+};
+export declare const TextAreaField: ({ optional, required, success, error, errorMessage, label, id, disabled, style, className, textAreaStyle, textareaRef, maxLength, ...props }: TextAreaProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/index/styles3.css

@@ -1 +1 @@
-.au-datepicker__header{display:flex;justify-content:space-between}.au-datepicker__header-segments{display:flex;gap:8px}.au-datepicker__header-navigation-btn{cursor:pointer;outline:none;background-color:transparent;border:none}
+.au-field{cursor:pointer;border-radius:8px}.au-field__input-holder{position:relative;height:56px}.au-field__input{height:56px}.au-field__input,.au-field__textarea{background-color:#fff;border:1px solid #454a54;border-radius:8px;box-sizing:border-box;font-family:inherit;font-size:16px;line-height:22px;padding:16px;width:100%}.au-field__input:hover,.au-field__textarea:hover{border:1px solid #16181d}.au-field__input:focus,.au-field__textarea:focus{border-color:#0048db;outline:1px solid #0048db}.au-field__char-counter{text-align:right}.au-field:focus-within:not(.au-field--error) .au-field__header-label{color:#0048db}.au-field__header{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px}.au-field__header-label{color:#454a54;cursor:pointer;font-size:14px;font-weight:600}.au-field__header-label--required{color:#991717}.au-field__header-icon span{font-size:14px;color:#454a54}.au-field__right-slot{position:absolute;right:16px;top:50%;transform:translateY(-50%)}.au-field__error-message{color:#991717;font-size:16px;font-weight:400;line-height:24px;padding-top:8px}.au-field--disabled{cursor:not-allowed}.au-field--disabled .au-field__input,.au-field--disabled .au-field__textarea{background-color:#e2e4e9;border-color:#5e6573;color:#5e6573;cursor:not-allowed}.au-field--disabled .au-field__header-label{color:#5e6573;cursor:not-allowed}.au-field--error .au-field__input,.au-field--error .au-field__textarea{background-color:#f5eff0;border-color:#991717}.au-field--error .au-field__input:focus,.au-field--error .au-field__textarea:focus{border-color:#0048db}.au-field--error .au-field__header-label{color:#991717}.au-field--success .au-field__input,.au-field--success .au-field__textarea{animation:inputSuccess 2s forwards}.au-field--success .au-field__header-label{animation:labelSuccess 2s forwards}.au-field--success .au-field__header-icon .au-icon{animation:iconSucess 2s forwards}@keyframes inputSuccess{0%,70%{background-color:#f0fcf5;border-color:#10593b}}@keyframes labelSuccess{0%,70%{color:#10593b}}@keyframes iconSucess{0%,70%{opacity:1}to{opacity:0}}

package/dist/components/index/styles4.css

@@ -0,0 +1 @@
+.au-datepicker__header{display:flex;justify-content:space-between}.au-datepicker__header-segments{display:flex;gap:8px}.au-datepicker__header-navigation-btn{cursor:pointer;outline:none;background-color:transparent;border:none}

package/dist/index-DY3hp3Pl.js

@@ -0,0 +1,101 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { c as classNames } from "./index-CweZ_OcN.js";
+import "./components/Icon/index.es.js";
+import { IconAlertCircle } from "./components/icons/IconAlertCircle/index.es.js";
+import { IconCheck } from "./components/icons/IconCheck/index.es.js";
+import { IconSlash } from "./components/icons/IconSlash/index.es.js";
+import { H as COLOR_SUCCESS_50, O as COLOR_ERROR_50, g as COLOR_NEUTRAL_40 } from "./tokens-TYOJv1j5.js";
+import './components/index/styles3.css';const FieldErrorMessage = ({ hasError, message }) => {
+  if (!hasError || !message) return null;
+  return /* @__PURE__ */ jsx("p", { className: "au-field__error-message", children: message });
+};
+const FieldInput = ({
+  inputRef,
+  customclass,
+  ...props
+}) => {
+  const inputClasses = classNames("au-field__input", customclass);
+  return /* @__PURE__ */ jsx("input", { className: inputClasses, ref: inputRef, ...props });
+};
+const FieldInputHolder = ({
+  children,
+  rightSideSlot
+}) => {
+  return /* @__PURE__ */ jsxs("div", { className: "au-field__input-holder", children: [
+    children,
+    rightSideSlot && /* @__PURE__ */ jsx("div", { className: "au-field__right-slot", children: rightSideSlot })
+  ] });
+};
+const FieldLabel = ({
+  id,
+  text,
+  required,
+  optional,
+  success,
+  error,
+  disabled
+}) => {
+  if (!text) return null;
+  const states = [
+    { state: "optional", value: !!optional, icon: /* @__PURE__ */ jsx("span", { children: "(Opcional)" }) },
+    {
+      state: "success",
+      value: !!success,
+      icon: /* @__PURE__ */ jsx(IconCheck, { rawColor: COLOR_SUCCESS_50 })
+    },
+    {
+      state: "error",
+      value: !!error,
+      icon: /* @__PURE__ */ jsx(IconAlertCircle, { rawColor: COLOR_ERROR_50 })
+    },
+    {
+      state: "disabled",
+      value: !!disabled,
+      icon: /* @__PURE__ */ jsx(IconSlash, { rawColor: COLOR_NEUTRAL_40 })
+    }
+  ];
+  const currentState = states.find(({ value }) => !!value);
+  return /* @__PURE__ */ jsxs("div", { className: "au-field__header", children: [
+    /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "au-field__header-label", children: [
+      text,
+      " ",
+      required && /* @__PURE__ */ jsx("strong", { className: "au-field__header-label--required", children: "*" })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "au-field__header-icon", children: currentState == null ? void 0 : currentState.icon })
+  ] });
+};
+const FieldRoot = ({
+  children,
+  disabled,
+  success,
+  error,
+  style,
+  customclass
+}) => {
+  const inputClasses = classNames("au-field", customclass, {
+    "au-field--disabled": !!disabled,
+    "au-field--success": !!success,
+    "au-field--error": !!error
+  });
+  return /* @__PURE__ */ jsx("div", { className: inputClasses, style, children });
+};
+const FieldTextArea = ({
+  textareaRef,
+  customclass,
+  ...props
+}) => {
+  const textareaClasses = classNames("au-field__textarea", customclass);
+  return /* @__PURE__ */ jsx("textarea", { className: textareaClasses, ref: textareaRef, ...props });
+};
+const Field = {
+  Root: FieldRoot,
+  Input: FieldInput,
+  InputHolder: FieldInputHolder,
+  Label: FieldLabel,
+  ErrorMessage: FieldErrorMessage,
+  TextArea: FieldTextArea
+};
+export {
+  Field as F
+};
+//# sourceMappingURL=index-DY3hp3Pl.js.map

package/dist/index-DY3hp3Pl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index-DY3hp3Pl.js","sources":["../lib/components/form/Field/ErrorMessage.tsx","../lib/components/form/Field/Input.tsx","../lib/components/form/Field/InputHolder.tsx","../lib/components/form/Field/Label.tsx","../lib/components/form/Field/Root.tsx","../lib/components/form/Field/TextArea.tsx","../lib/components/form/Field/index.tsx"],"sourcesContent":["type ErrorMessageProps = {\n  hasError?: boolean\n  message?: string\n}\n\nexport const FieldErrorMessage = ({ hasError, message }: ErrorMessageProps) => {\n  if (!hasError || !message) return null\n\n  return <p className=\"au-field__error-message\">{message}</p>\n}\n","import classNames from 'classnames'\n\ntype FieldInputProps = React.InputHTMLAttributes<HTMLInputElement> & {\n  inputRef?: React.RefObject<HTMLInputElement>\n  customclass?: string\n}\n\nexport const FieldInput = ({\n  inputRef,\n  customclass,\n  ...props\n}: FieldInputProps) => {\n  const inputClasses = classNames('au-field__input', customclass)\n\n  return <input className={inputClasses} ref={inputRef} {...props} />\n}\n","import React from 'react'\n\ntype FieldInputHolderProps = {\n  children?: React.ReactNode\n  rightSideSlot?: React.ReactNode\n}\n\nexport const FieldInputHolder = ({\n  children,\n  rightSideSlot,\n}: FieldInputHolderProps) => {\n  return (\n    <div className=\"au-field__input-holder\">\n      {children}\n      {rightSideSlot && (\n        <div className=\"au-field__right-slot\">{rightSideSlot}</div>\n      )}\n    </div>\n  )\n}\n","import { IconAlertCircle, IconCheck, IconSlash } from '@components/icons'\nimport {\n  COLOR_ERROR_50,\n  COLOR_NEUTRAL_40,\n  COLOR_SUCCESS_50,\n} from '@core/tokens'\n\ntype FieldLabelProps = {\n  id?: string\n  text?: string\n  required?: boolean\n  optional?: boolean\n  success?: boolean\n  error?: boolean\n  disabled?: boolean\n}\n\nexport const FieldLabel = ({\n  id,\n  text,\n  required,\n  optional,\n  success,\n  error,\n  disabled,\n}: FieldLabelProps) => {\n  if (!text) return null\n\n  const states = [\n    { state: 'optional', value: !!optional, icon: <span>(Opcional)</span> },\n    {\n      state: 'success',\n      value: !!success,\n      icon: <IconCheck rawColor={COLOR_SUCCESS_50} />,\n    },\n    {\n      state: 'error',\n      value: !!error,\n      icon: <IconAlertCircle rawColor={COLOR_ERROR_50} />,\n    },\n    {\n      state: 'disabled',\n      value: !!disabled,\n      icon: <IconSlash rawColor={COLOR_NEUTRAL_40} />,\n    },\n  ]\n\n  const currentState = states.find(({ value }) => !!value)\n\n  return (\n    <div className=\"au-field__header\">\n      <label htmlFor={id} className=\"au-field__header-label\">\n        {text}{' '}\n        {required && (\n          <strong className=\"au-field__header-label--required\">*</strong>\n        )}\n      </label>\n      <div className=\"au-field__header-icon\">{currentState?.icon}</div>\n    </div>\n  )\n}\n","import classNames from 'classnames'\n\ntype FieldRootProps = {\n  children: React.ReactNode\n  disabled?: boolean\n  success?: boolean\n  error?: boolean\n  style?: React.CSSProperties\n  customclass?: string\n}\n\nexport const FieldRoot = ({\n  children,\n  disabled,\n  success,\n  error,\n  style,\n  customclass,\n}: FieldRootProps) => {\n  const inputClasses = classNames('au-field', customclass, {\n    'au-field--disabled': !!disabled,\n    'au-field--success': !!success,\n    'au-field--error': !!error,\n  })\n\n  return (\n    <div className={inputClasses} style={style}>\n      {children}\n    </div>\n  )\n}\n","import classNames from 'classnames'\n\ntype FieldTextAreaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {\n  textareaRef?: React.RefObject<HTMLTextAreaElement>\n  customclass?: string\n}\n\nexport const FieldTextArea = ({\n  textareaRef,\n  customclass,\n  ...props\n}: FieldTextAreaProps) => {\n  const textareaClasses = classNames('au-field__textarea', customclass)\n\n  return <textarea className={textareaClasses} ref={textareaRef} {...props} />\n}\n","import { FieldErrorMessage } from './ErrorMessage'\nimport { FieldInput } from './Input'\nimport { FieldInputHolder } from './InputHolder'\nimport { FieldLabel } from './Label'\nimport { FieldRoot } from './Root'\nimport { FieldTextArea } from './TextArea'\nimport './styles.scss'\n\nexport default {\n    Root: FieldRoot,\n    Input: FieldInput,\n    InputHolder: FieldInputHolder,\n    Label: FieldLabel,\n    ErrorMessage: FieldErrorMessage,\n    TextArea: FieldTextArea,\n}"],"names":[],"mappings":";;;;;;;AAKO,MAAM,oBAAoB,CAAC,EAAE,UAAU,cAAiC;AAC7E,MAAI,CAAC,YAAY,CAAC,QAAgB,QAAA;AAElC,SAAQ,oBAAA,KAAA,EAAE,WAAU,2BAA2B,UAAQ,QAAA,CAAA;AACzD;ACFO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAuB;AACf,QAAA,eAAe,WAAW,mBAAmB,WAAW;AAE9D,6BAAQ,SAAM,EAAA,WAAW,cAAc,KAAK,UAAW,GAAG,MAAO,CAAA;AACnE;ACRO,MAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA;AACF,MAA6B;AAEzB,SAAA,qBAAC,OAAI,EAAA,WAAU,0BACZ,UAAA;AAAA,IAAA;AAAA,IACA,iBACC,oBAAC,OAAI,EAAA,WAAU,wBAAwB,UAAc,eAAA;AAAA,EAEzD,EAAA,CAAA;AAEJ;ACFO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAuB;AACjB,MAAA,CAAC,KAAa,QAAA;AAElB,QAAM,SAAS;AAAA,IACb,EAAE,OAAO,YAAY,OAAO,CAAC,CAAC,UAAU,MAAM,oBAAC,QAAK,EAAA,UAAA,aAAU,CAAA,EAAQ;AAAA,IACtE;AAAA,MACE,OAAO;AAAA,MACP,OAAO,CAAC,CAAC;AAAA,MACT,MAAM,oBAAC,WAAU,EAAA,UAAU,iBAAkB,CAAA;AAAA,IAC/C;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,OAAO,CAAC,CAAC;AAAA,MACT,MAAM,oBAAC,iBAAgB,EAAA,UAAU,eAAgB,CAAA;AAAA,IACnD;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,OAAO,CAAC,CAAC;AAAA,MACT,MAAM,oBAAC,WAAU,EAAA,UAAU,iBAAkB,CAAA;AAAA,IAC/C;AAAA,EAAA;AAGI,QAAA,eAAe,OAAO,KAAK,CAAC,EAAE,YAAY,CAAC,CAAC,KAAK;AAGrD,SAAA,qBAAC,OAAI,EAAA,WAAU,oBACb,UAAA;AAAA,IAAA,qBAAC,SAAM,EAAA,SAAS,IAAI,WAAU,0BAC3B,UAAA;AAAA,MAAA;AAAA,MAAM;AAAA,MACN,YACC,oBAAC,UAAO,EAAA,WAAU,oCAAmC,UAAC,KAAA;AAAA,IAAA,GAE1D;AAAA,IACC,oBAAA,OAAA,EAAI,WAAU,yBAAyB,uDAAc,MAAK;AAAA,EAC7D,EAAA,CAAA;AAEJ;ACjDO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAsB;AACd,QAAA,eAAe,WAAW,YAAY,aAAa;AAAA,IACvD,sBAAsB,CAAC,CAAC;AAAA,IACxB,qBAAqB,CAAC,CAAC;AAAA,IACvB,mBAAmB,CAAC,CAAC;AAAA,EAAA,CACtB;AAED,SACG,oBAAA,OAAA,EAAI,WAAW,cAAc,OAC3B,SACH,CAAA;AAEJ;ACvBO,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA0B;AAClB,QAAA,kBAAkB,WAAW,sBAAsB,WAAW;AAEpE,6BAAQ,YAAS,EAAA,WAAW,iBAAiB,KAAK,aAAc,GAAG,MAAO,CAAA;AAC5E;ACPA,MAAe,QAAA;AAAA,EACX,MAAM;AAAA,EACN,OAAO;AAAA,EACP,aAAa;AAAA,EACb,OAAO;AAAA,EACP,cAAc;AAAA,EACd,UAAU;AACd;"}

package/dist/{index-olB3e5l9.js → index-DhUJjrgP.js}

@@ -11,7 +11,7 @@ createContext(null);
 createContext(null);
 createContext(null);
 createContext(null);
-import './components/index/styles3.css';const $4e85f108e88277b8$export$d688439359537581 = createContext({});
+import './components/index/styles4.css';const $4e85f108e88277b8$export$d688439359537581 = createContext({});
 const $b5e257d569688ac6$var$defaultContext = {
   prefix: String(Math.round(Math.random() * 1e10)),
   current: 0
@@ -5686,4 +5686,4 @@ export {
   $dfd62f934fc76fed$export$e11f8ba65d857bff as e,
   $dfd62f934fc76fed$export$5d847498420df57b as f
 };
-//# sourceMappingURL=index-olB3e5l9.js.map
+//# sourceMappingURL=index-DhUJjrgP.js.map