@consumidor-positivo/aurora 0.0.68 → 0.0.70

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

@@ -1,9 +1,9 @@
 import "react/jsx-runtime";
 import "../../index-CweZ_OcN.js";
-import "../../index-BuHGuwbT.js";
+import "../../index-C8RdzVRj.js";
 import "../Button/index.es.js";
 import "../PortalHolder/index.es.js";
-import { a } from "../../index-EAEcmr1o.js";
+import { a } from "../../index-CK85YRoz.js";
 export {
   a as DatepickerCalendar
 };

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

@@ -3,8 +3,8 @@ import "../../index-CweZ_OcN.js";
 import "../Icon/index.es.js";
 import "../icons/IconChevronLeft/index.es.js";
 import "../icons/IconChevronRight/index.es.js";
-import "../../index-CLq9qZyb.js";
-import { C } from "../../index-BuHGuwbT.js";
+import "../../index-CP-KKFUb.js";
+import { C } from "../../index-C8RdzVRj.js";
 export {
   C as CalendarHeader
 };

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

@@ -2,8 +2,8 @@ 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 { k as COLOR_NEUTRAL_00 } from "../../tokens-TYOJv1j5.js";
-import { F as Field } from "../../index-DY3hp3Pl.js";
+import { F as Field } from "../../index-DfksciAR.js";
+import { m as COLOR_NEUTRAL_00 } from "../../tokens-DGTtjw-_.js";
 import './styles.css';const CheckboxField = ({
   label,
   error,

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

@@ -1,13 +1,13 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { B as BREAKPOINT_MD, g as COLOR_NEUTRAL_40 } from "../../tokens-TYOJv1j5.js";
 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-EAEcmr1o.js";
+import { g as getDefaultDate, D as DDMMYYYY, a as DatepickerCalendar, A as AUCalendarDate } from "../../index-CK85YRoz.js";
 import { useRef, useState, useMemo, useEffect } from "react";
 import { a as above } from "../../screen-DfYo7XQ_.js";
-import { u as useOutsideClick } from "../../index-CLq9qZyb.js";
+import { u as useOutsideClick } from "../../index-CP-KKFUb.js";
+import { B as BREAKPOINT_MD, b as COLOR_NEUTRAL_40 } from "../../tokens-DGTtjw-_.js";
 import './styles.css';function useDatepicker({
   value,
   defaultValue = "empty",

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

@@ -0,0 +1,9 @@
+import { jsx } from "react/jsx-runtime";
+const FieldErrorMessage = ({ hasError, message }) => {
+  if (!hasError || !message) return null;
+  return /* @__PURE__ */ jsx("p", { className: "au-field__error-message", children: message });
+};
+export {
+  FieldErrorMessage
+};
+//# sourceMappingURL=index.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Field/ErrorMessage/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"],"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;"}

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

@@ -1,6 +1,6 @@
 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 { F as Field } from "../../index-DfksciAR.js";
 import { Conditional } from "../Conditional/index.es.js";
 import { Text } from "../Text/index.es.js";
 import $dbSRa$react__default, { useState } from "react";

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

@@ -0,0 +1,14 @@
+import { jsx } from "react/jsx-runtime";
+import { c as classNames } from "../../index-CweZ_OcN.js";
+const FieldInput = ({
+  inputRef,
+  customclass,
+  ...props
+}) => {
+  const inputClasses = classNames("au-field__input", customclass);
+  return /* @__PURE__ */ jsx("input", { className: inputClasses, ref: inputRef, ...props });
+};
+export {
+  FieldInput
+};
+//# sourceMappingURL=index.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Field/Input/index.tsx"],"sourcesContent":["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"],"names":[],"mappings":";;AAOO,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;"}

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

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

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

@@ -0,0 +1,14 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+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 })
+  ] });
+};
+export {
+  FieldInputHolder
+};
+//# sourceMappingURL=index.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Field/InputHolder/index.tsx"],"sourcesContent":["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"],"names":[],"mappings":";AAOO,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;"}

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

@@ -0,0 +1,49 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import "../../index-CweZ_OcN.js";
+import "../Icon/index.es.js";
+import { IconAlertOctagon } from "../icons/IconAlertOctagon/index.es.js";
+import { IconCheck } from "../icons/IconCheck/index.es.js";
+import { IconSlash } from "../icons/IconSlash/index.es.js";
+import { C as COLOR_SUCCESS_50, a as COLOR_ERROR_50, b as COLOR_NEUTRAL_40 } from "../../tokens-DGTtjw-_.js";
+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(IconAlertOctagon, { 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 })
+  ] });
+};
+export {
+  FieldLabel
+};
+//# sourceMappingURL=index.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Field/Label/index.tsx"],"sourcesContent":["import { IconAlertOctagon, 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: <IconAlertOctagon 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"],"names":[],"mappings":";;;;;;;AAiBO,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,kBAAiB,EAAA,UAAU,eAAgB,CAAA;AAAA,IACpD;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;"}

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

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

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

@@ -1,7 +1,7 @@
 import { jsx, Fragment } from "react/jsx-runtime";
 import { a as above } from "../../screen-DfYo7XQ_.js";
-import { B as BREAKPOINT_MD } from "../../tokens-TYOJv1j5.js";
 import { Portal } from "../Portal/index.es.js";
+import { B as BREAKPOINT_MD } from "../../tokens-DGTtjw-_.js";
 const PortalHolder = ({ withPortal, children }) => {
   const shouldUsePortal = !above(BREAKPOINT_MD) && withPortal;
   if (shouldUsePortal) return /* @__PURE__ */ jsx(Portal, { children });

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

@@ -0,0 +1,21 @@
+import { jsx } from "react/jsx-runtime";
+import { c as classNames } from "../../index-CweZ_OcN.js";
+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 });
+};
+export {
+  FieldRoot
+};
+//# sourceMappingURL=index.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Field/Root/index.tsx"],"sourcesContent":["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"],"names":[],"mappings":";;AAWO,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;"}

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

@@ -4,7 +4,7 @@ import "../Icon/index.es.js";
 import "../icons/IconChevronDown/index.es.js";
 import "../icons/IconChevronLeft/index.es.js";
 import "../icons/IconX/index.es.js";
-import { S } from "../../index-CLq9qZyb.js";
+import { S } from "../../index-CP-KKFUb.js";
 export {
   S as Segment
 };

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 { F as Field } from "../../index-DY3hp3Pl.js";
+import { F as Field } from "../../index-DfksciAR.js";
 import { useState, useRef, useEffect } from "react";
 import './styles.css';const useSelectField = (options, initialValue, onChange, disabled, register, autocomplete = false) => {
   var _a;

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

@@ -0,0 +1,139 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { c as classNames } from "../../index-CweZ_OcN.js";
+import { Text } from "../Text/index.es.js";
+import { useState, useRef, useEffect } from "react";
+const useFieldTextArea = ({
+  rows = 3,
+  cols,
+  horizontalResize = false,
+  onChange
+}) => {
+  const [dimensions, setDimensions] = useState({
+    width: cols ? cols * 10 : "100%",
+    height: rows * 26
+  });
+  const [charCount, setCharCount] = useState(0);
+  const isResizing = useRef(false);
+  const lastMousePosition = useRef({ x: 0, y: 0 });
+  useEffect(() => {
+    setDimensions({
+      width: cols ? cols * 10 : "100%",
+      height: rows * 26
+    });
+  }, [rows, cols]);
+  const handleMouseDown = (e) => {
+    isResizing.current = true;
+    lastMousePosition.current = { x: e.clientX, y: e.clientY };
+    if (dimensions.width === "100%") {
+      const container = e.currentTarget.closest(
+        ".au-field__textarea-container"
+      );
+      setDimensions((prev) => ({
+        ...prev,
+        width: container ? container.offsetWidth : 300
+      }));
+    }
+    window.addEventListener("mousemove", handleMouseMove);
+    window.addEventListener("mouseup", handleMouseUp);
+  };
+  const handleMouseMove = (e) => {
+    if (!isResizing.current) return;
+    const deltaX = e.clientX - lastMousePosition.current.x;
+    const deltaY = e.clientY - lastMousePosition.current.y;
+    setDimensions((prev) => {
+      let currentWidth = typeof prev.width === "number" ? prev.width : 100;
+      const target = e.currentTarget;
+      if (target) {
+        const container = target.closest(
+          ".textarea-container"
+        );
+        currentWidth = container ? container.offsetWidth : currentWidth;
+      }
+      return {
+        width: horizontalResize ? Math.max(100, currentWidth + deltaX) : prev.width,
+        height: Math.max(50, prev.height + deltaY)
+      };
+    });
+    lastMousePosition.current = { x: e.clientX, y: e.clientY };
+  };
+  const handleMouseUp = () => {
+    isResizing.current = false;
+    window.removeEventListener("mousemove", handleMouseMove);
+    window.removeEventListener("mouseup", handleMouseUp);
+  };
+  const handleInputChange = (e) => {
+    setCharCount(e.target.value.length);
+    if (onChange) {
+      onChange(e);
+    }
+  };
+  return {
+    dimensions,
+    charCount,
+    handleMouseDown,
+    handleInputChange
+  };
+};
+const FieldTextArea = ({
+  textareaRef,
+  customClass,
+  rows = 3,
+  cols,
+  horizontalResize = false,
+  maxLength,
+  ...props
+}) => {
+  const { dimensions, charCount, handleMouseDown, handleInputChange } = useFieldTextArea({ rows, cols, horizontalResize, onChange: props.onChange });
+  const textareaClasses = classNames("au-field__textarea", customClass);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "au-field__textarea-container",
+      style: {
+        width: typeof dimensions.width === "number" ? `${dimensions.width}px` : dimensions.width,
+        height: `${dimensions.height}px`
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          "textarea",
+          {
+            ref: textareaRef,
+            className: textareaClasses,
+            style: { width: "100%", height: "100%", resize: "none" },
+            onChange: handleInputChange,
+            maxLength,
+            ...props
+          }
+        ),
+        maxLength && /* @__PURE__ */ jsxs(Text, { variant: "caption", className: "au-field__char-counter", children: [
+          charCount,
+          "/",
+          maxLength
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "custom-resize", onMouseDown: handleMouseDown, children: /* @__PURE__ */ jsx(
+          "svg",
+          {
+            xmlns: "http://www.w3.org/2000/svg",
+            width: "9",
+            height: "9",
+            viewBox: "0 0 9 9",
+            fill: "none",
+            children: /* @__PURE__ */ jsx(
+              "path",
+              {
+                fillRule: "evenodd",
+                clipRule: "evenodd",
+                d: "M0.146447 8.14645C-0.0488155 8.34171 -0.0488155 8.65829 0.146447 8.85355C0.341709 9.04882 0.658291 9.04882 0.853553 8.85355L8.85355 0.853553C9.04882 0.658291 9.04882 0.341708 8.85355 0.146446C8.65829 -0.0488159 8.34171 -0.0488157 8.14645 0.146446L0.146447 8.14645ZM4.14645 8.14645C3.95118 8.34171 3.95118 8.65829 4.14645 8.85355C4.34171 9.04882 4.65829 9.04882 4.85355 8.85355L8.85355 4.85355C9.04882 4.65829 9.04882 4.34171 8.85355 4.14645C8.65829 3.95118 8.34171 3.95118 8.14645 4.14645L4.14645 8.14645Z",
+                fill: "#454A54"
+              }
+            )
+          }
+        ) })
+      ]
+    }
+  );
+};
+export {
+  FieldTextArea
+};
+//# sourceMappingURL=index.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Field/TextArea/hook.ts","../../../lib/components/form/Field/TextArea/index.tsx"],"sourcesContent":["import { useState, useEffect, useRef } from 'react'\n\ntype UseFieldTextAreaProps = {\n  rows?: number\n  cols?: number\n  horizontalResize?: boolean\n  onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void\n}\n\nexport const useFieldTextArea = ({\n  rows = 3,\n  cols,\n  horizontalResize = false,\n  onChange,\n}: UseFieldTextAreaProps) => {\n  const [dimensions, setDimensions] = useState({\n    width: cols ? cols * 10 : '100%',\n    height: rows * 26,\n  })\n  const [charCount, setCharCount] = useState(0)\n  const isResizing = useRef(false)\n  const lastMousePosition = useRef({ x: 0, y: 0 })\n\n  useEffect(() => {\n    setDimensions({\n      width: cols ? cols * 10 : '100%',\n      height: rows * 26,\n    })\n  }, [rows, cols])\n\n  const handleMouseDown = (e: React.MouseEvent) => {\n    isResizing.current = true\n    lastMousePosition.current = { x: e.clientX, y: e.clientY }\n\n    if (dimensions.width === '100%') {\n      const container = e.currentTarget.closest(\n        '.au-field__textarea-container',\n      ) as HTMLElement\n      setDimensions((prev) => ({\n        ...prev,\n        width: container ? container.offsetWidth : 300,\n      }))\n    }\n\n    window.addEventListener('mousemove', handleMouseMove)\n    window.addEventListener('mouseup', handleMouseUp)\n  }\n\n  const handleMouseMove = (e: MouseEvent) => {\n    if (!isResizing.current) return\n    const deltaX = e.clientX - lastMousePosition.current.x\n    const deltaY = e.clientY - lastMousePosition.current.y\n\n    setDimensions((prev) => {\n      let currentWidth = typeof prev.width === 'number' ? prev.width : 100\n      const target = e.currentTarget as HTMLElement | null\n      if (target) {\n        const container = target.closest(\n          '.textarea-container',\n        ) as HTMLElement | null\n        currentWidth = container ? container.offsetWidth : currentWidth\n      }\n\n      return {\n        width: horizontalResize\n          ? Math.max(100, currentWidth + deltaX)\n          : prev.width,\n        height: Math.max(50, prev.height + deltaY),\n      }\n    })\n\n    lastMousePosition.current = { x: e.clientX, y: e.clientY }\n  }\n\n  const handleMouseUp = () => {\n    isResizing.current = false\n    window.removeEventListener('mousemove', handleMouseMove)\n    window.removeEventListener('mouseup', handleMouseUp)\n  }\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n    setCharCount(e.target.value.length)\n    if (onChange) {\n      onChange(e)\n    }\n  }\n\n  return {\n    dimensions,\n    charCount,\n    handleMouseDown,\n    handleInputChange,\n  }\n}\n","import React from 'react'\nimport classNames from 'classnames'\nimport { Text } from '@components/Text'\nimport { useFieldTextArea } from './hook'\n\ntype FieldTextAreaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {\n  textareaRef?: React.RefObject<HTMLTextAreaElement>\n  customClass?: string\n  horizontalResize?: boolean\n  maxLength?: number\n}\n\nexport const FieldTextArea = ({\n  textareaRef,\n  customClass,\n  rows = 3,\n  cols,\n  horizontalResize = false,\n  maxLength,\n  ...props\n}: FieldTextAreaProps) => {\n  const { dimensions, charCount, handleMouseDown, handleInputChange } =\n    useFieldTextArea({ rows, cols, horizontalResize, onChange: props.onChange })\n\n  const textareaClasses = classNames('au-field__textarea', customClass)\n\n  return (\n    <div\n      className=\"au-field__textarea-container\"\n      style={{\n        width:\n          typeof dimensions.width === 'number'\n            ? `${dimensions.width}px`\n            : dimensions.width,\n        height: `${dimensions.height}px`,\n      }}>\n      <textarea\n        ref={textareaRef}\n        className={textareaClasses}\n        style={{ width: '100%', height: '100%', resize: 'none' }}\n        onChange={handleInputChange}\n        maxLength={maxLength}\n        {...props}\n      />\n      {maxLength && (\n        <Text variant=\"caption\" className=\"au-field__char-counter\">\n          {charCount}/{maxLength}\n        </Text>\n      )}\n      <div className=\"custom-resize\" onMouseDown={handleMouseDown}>\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"9\"\n          height=\"9\"\n          viewBox=\"0 0 9 9\"\n          fill=\"none\">\n          <path\n            fillRule=\"evenodd\"\n            clipRule=\"evenodd\"\n            d=\"M0.146447 8.14645C-0.0488155 8.34171 -0.0488155 8.65829 0.146447 8.85355C0.341709 9.04882 0.658291 9.04882 0.853553 8.85355L8.85355 0.853553C9.04882 0.658291 9.04882 0.341708 8.85355 0.146446C8.65829 -0.0488159 8.34171 -0.0488157 8.14645 0.146446L0.146447 8.14645ZM4.14645 8.14645C3.95118 8.34171 3.95118 8.65829 4.14645 8.85355C4.34171 9.04882 4.65829 9.04882 4.85355 8.85355L8.85355 4.85355C9.04882 4.65829 9.04882 4.34171 8.85355 4.14645C8.65829 3.95118 8.34171 3.95118 8.14645 4.14645L4.14645 8.14645Z\"\n            fill=\"#454A54\"\n          />\n        </svg>\n      </div>\n    </div>\n  )\n}\n"],"names":[],"mappings":"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"}

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

@@ -1,7 +1,5 @@
 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";
+import { F as Field } from "../../index-DfksciAR.js";
 const TextAreaField = ({
   optional,
   required,
@@ -16,12 +14,9 @@ const TextAreaField = ({
   textAreaStyle,
   textareaRef,
   maxLength,
+  horizontalResize,
   ...props
 }) => {
-  const [charCount, setCharCount] = useState(0);
-  const handleInputChange = (e) => {
-    setCharCount(e.target.value.length);
-  };
   return /* @__PURE__ */ jsxs(
     Field.Root,
     {
@@ -51,15 +46,10 @@ const TextAreaField = ({
             disabled,
             style: textAreaStyle,
             maxLength,
-            onChange: handleInputChange,
+            horizontalResize,
             ...props
           }
         ),
-        maxLength && /* @__PURE__ */ jsxs(Text, { className: "au-field__char-counter", children: [
-          charCount,
-          "/",
-          maxLength
-        ] }),
         /* @__PURE__ */ jsx(Field.ErrorMessage, { hasError: !!error, message: errorMessage })
       ]
     }

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

@@ -1 +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;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/TextareaField/index.tsx"],"sourcesContent":["import 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    horizontalResize?: boolean\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  horizontalResize,\n  ...props\n}: TextAreaProps) => {\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        horizontalResize={horizontalResize}\n        {...props}\n      />\n      <Field.ErrorMessage hasError={!!error} message={errorMessage} />\n    </Field.Root>\n  )\n}\n"],"names":[],"mappings":";;AAcO,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;AAAA,EACA,GAAG;AACL,MAAqB;AAEjB,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;AAAA,YACC,GAAG;AAAA,UAAA;AAAA,QACN;AAAA,QACA,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 { F as Field } from "../../index-DY3hp3Pl.js";
+import { F as Field } from "../../index-DfksciAR.js";
 import { useRef, useState, useEffect } from "react";
 import './styles.css';function inputtedValueIsValid(value) {
   const numberValue = Number(value);

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

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+type UseFieldTextAreaProps = {
+    rows?: number;
+    cols?: number;
+    horizontalResize?: boolean;
+    onChange?: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
+};
+export declare const useFieldTextArea: ({ rows, cols, horizontalResize, onChange, }: UseFieldTextAreaProps) => {
+    dimensions: {
+        width: string | number;
+        height: number;
+    };
+    charCount: number;
+    handleMouseDown: (e: React.MouseEvent) => void;
+    handleInputChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
+};
+export {};

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

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+
+type FieldTextAreaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {
+    textareaRef?: React.RefObject<HTMLTextAreaElement>;
+    customClass?: string;
+    horizontalResize?: boolean;
+    maxLength?: number;
+};
+export declare const FieldTextArea: ({ textareaRef, customClass, rows, cols, horizontalResize, maxLength, ...props }: FieldTextAreaProps) => import("react/jsx-runtime").JSX.Element;
+export {};

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

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

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

@@ -7,5 +7,6 @@ export type TextAreaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> &
     label?: string;
     textAreaStyle?: React.CSSProperties;
     textareaRef?: React.RefObject<HTMLTextAreaElement>;
+    horizontalResize?: boolean;
 };
-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;
+export declare const TextAreaField: ({ optional, required, success, error, errorMessage, label, id, disabled, style, className, textAreaStyle, textareaRef, maxLength, horizontalResize, ...props }: TextAreaProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/index/styles.css

@@ -1 +1 @@
-.au-datepicker__calendar{visibility:hidden;opacity:0;position:fixed;z-index:1000;top:0;right:0;bottom:0;left:0;transition:opacity .2s,visibility .2s}@media (min-width: 600px){.au-datepicker__calendar{width:414px;position:absolute;top:calc(100% + 90px);left:0;right:auto;bottom:auto;transition:opacity .2s,visibility .2s,transform .2s ease-in-out}}.au-datepicker__calendar--visible,.au-datepicker__calendar--visible .au-datepicker__calendar-backdrop{visibility:visible;opacity:1}.au-datepicker__calendar--visible .au-datepicker__calendar-card{transform:translateY(0)}@media (min-width: 600px){.au-datepicker__calendar--visible{transform:translateY(-74px)}}.au-datepicker__calendar-backdrop{background-color:#16181dcc;cursor:pointer;position:absolute;width:100%;height:100%;visibility:0;z-index:1;-webkit-tap-highlight-color:transparent;opacity:0;transition:visibility .2s,opacity .2s}@media (min-width: 600px){.au-datepicker__calendar-backdrop{display:none}}.au-datepicker__calendar-card{width:100%;padding:16px;position:absolute;border-radius:16px 16px 0 0;border:1px solid #e2e4e9;background:#fff;bottom:0;z-index:2;transform:translateY(500px);transition:transform .2s ease-in-out}@media (min-width: 600px){.au-datepicker__calendar-card{position:relative;height:auto;transform:none;bottom:auto;transition:none;border-radius:16px}}.au-datepicker__calendar-base{width:100%}.au-datepicker__calendar-grid{width:100%;margin-top:16px}.au-datepicker__calendar-weekday,.au-datepicker__calendar-day{width:48px;height:48px;font-size:16px;font-weight:400;text-align:center;color:#16181d}@media (max-width: 320px){.au-datepicker__calendar-weekday,.au-datepicker__calendar-day{width:30px;height:30px}}.au-datepicker__calendar-day{cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid transparent;transition:border .2s ease-in-out,color .2s ease-in-out,background-color .2s ease-in-out}.au-datepicker__calendar-day:hover{border:1px solid #0048db}.au-datepicker__calendar-day[data-disabled]{cursor:default;color:#5e6573}.au-datepicker__calendar-day[data-disabled]:hover{border:1px solid transparent}.au-datepicker__calendar-day[data-selected]{background-color:#0048db;color:#fff}.au-datepicker__calendar-actions-dock{display:flex;gap:8px;padding-top:16px}@media (min-width: 600px){.au-datepicker__calendar-actions-dock{display:none}}.au-datepicker__calendar-cancel{max-width:125px}
+.au-field{cursor:pointer;border-radius:8px}.au-field__input-holder{position:relative;height:56px}.au-field__input{height:56px}.au-field__textarea{padding:10px;box-sizing:border-box;resize:none;border:none;outline:none;width:100%;height:100%}.au-field__textarea-container{position:relative;display:inline-block;box-sizing:border-box;resize:none}.au-field__textarea-container .custom-resize{width:9px;height:9px;position:absolute;cursor:nwse-resize;display:block;display:flex;bottom:5px;right:5px}.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;color:#454a54}.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/styles2.css

@@ -1 +1 @@
-@media (min-width: 600px){.au-datepicker__segment{position:relative}}.au-datepicker__segment--open .au-datepicker__segment-input .au-icon{transform:rotate(180deg)}.au-datepicker__segment--open .au-datepicker__segment-list-holder{transform:translate(0);visibility:visible}@media (min-width: 600px){.au-datepicker__segment--open .au-datepicker__segment-list-holder{opacity:1;transform:none}}.au-datepicker__segment-input{padding:8px;gap:8px;display:flex;border-radius:8px;cursor:pointer;border:1px solid #e2e4e9}.au-datepicker__segment-list-holder{background:#fff;border-radius:16px 16px 0 0;position:absolute;top:0;right:0;bottom:0;left:0;visibility:hidden;opacity:1;display:flex;flex-direction:column;transform:translate(100%);transition:visibility .2s,transform .2s}@media (min-width: 600px){.au-datepicker__segment-list-holder{inset:unset;left:0;opacity:0;top:calc(100% + 8px);height:224px;border-radius:16px;border:1px solid #e2e4e9;transform:none;transition:opacity .2s,visibility .2s,transform .2s}}.au-datepicker__segment-list-header{padding:24px 16px;display:flex;align-items:center;justify-content:space-between}@media (min-width: 600px){.au-datepicker__segment-list-header{display:none}}.au-datepicker__segment-list{overflow-x:scroll;flex:1}.au-datepicker__segment-list-item{padding:16px 24px;font-size:16px;line-height:150%;cursor:pointer}.au-datepicker__segment-list-item:hover,.au-datepicker__segment-list-item--active{background-color:#f6f7fa}.au-datepicker__segment-list-item:not(:last-of-type){border-bottom:1px solid #e2e4e9}@media (min-width: 600px){.au-datepicker__segment-list-item:not(:last-of-type){border-bottom:none}}.au-datepicker__segment-title{font-family:"Source Sans 3",sans-serif;font-size:16px;font-weight:600}
+.au-datepicker__calendar{visibility:hidden;opacity:0;position:fixed;z-index:1000;top:0;right:0;bottom:0;left:0;transition:opacity .2s,visibility .2s}@media (min-width: 600px){.au-datepicker__calendar{width:414px;position:absolute;top:calc(100% + 90px);left:0;right:auto;bottom:auto;transition:opacity .2s,visibility .2s,transform .2s ease-in-out}}.au-datepicker__calendar--visible,.au-datepicker__calendar--visible .au-datepicker__calendar-backdrop{visibility:visible;opacity:1}.au-datepicker__calendar--visible .au-datepicker__calendar-card{transform:translateY(0)}@media (min-width: 600px){.au-datepicker__calendar--visible{transform:translateY(-74px)}}.au-datepicker__calendar-backdrop{background-color:#16181dcc;cursor:pointer;position:absolute;width:100%;height:100%;visibility:0;z-index:1;-webkit-tap-highlight-color:transparent;opacity:0;transition:visibility .2s,opacity .2s}@media (min-width: 600px){.au-datepicker__calendar-backdrop{display:none}}.au-datepicker__calendar-card{width:100%;padding:16px;position:absolute;border-radius:16px 16px 0 0;border:1px solid #e2e4e9;background:#fff;bottom:0;z-index:2;transform:translateY(500px);transition:transform .2s ease-in-out}@media (min-width: 600px){.au-datepicker__calendar-card{position:relative;height:auto;transform:none;bottom:auto;transition:none;border-radius:16px}}.au-datepicker__calendar-base{width:100%}.au-datepicker__calendar-grid{width:100%;margin-top:16px}.au-datepicker__calendar-weekday,.au-datepicker__calendar-day{width:48px;height:48px;font-size:16px;font-weight:400;text-align:center;color:#16181d}@media (max-width: 320px){.au-datepicker__calendar-weekday,.au-datepicker__calendar-day{width:30px;height:30px}}.au-datepicker__calendar-day{cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid transparent;transition:border .2s ease-in-out,color .2s ease-in-out,background-color .2s ease-in-out}.au-datepicker__calendar-day:hover{border:1px solid #0048db}.au-datepicker__calendar-day[data-disabled]{cursor:default;color:#5e6573}.au-datepicker__calendar-day[data-disabled]:hover{border:1px solid transparent}.au-datepicker__calendar-day[data-selected]{background-color:#0048db;color:#fff}.au-datepicker__calendar-actions-dock{display:flex;gap:8px;padding-top:16px}@media (min-width: 600px){.au-datepicker__calendar-actions-dock{display:none}}.au-datepicker__calendar-cancel{max-width:125px}

package/dist/components/index/styles3.css

@@ -1 +1 @@
-.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}}
+@media (min-width: 600px){.au-datepicker__segment{position:relative}}.au-datepicker__segment--open .au-datepicker__segment-input .au-icon{transform:rotate(180deg)}.au-datepicker__segment--open .au-datepicker__segment-list-holder{transform:translate(0);visibility:visible}@media (min-width: 600px){.au-datepicker__segment--open .au-datepicker__segment-list-holder{opacity:1;transform:none}}.au-datepicker__segment-input{padding:8px;gap:8px;display:flex;border-radius:8px;cursor:pointer;border:1px solid #e2e4e9}.au-datepicker__segment-list-holder{background:#fff;border-radius:16px 16px 0 0;position:absolute;top:0;right:0;bottom:0;left:0;visibility:hidden;opacity:1;display:flex;flex-direction:column;transform:translate(100%);transition:visibility .2s,transform .2s}@media (min-width: 600px){.au-datepicker__segment-list-holder{inset:unset;left:0;opacity:0;top:calc(100% + 8px);height:224px;border-radius:16px;border:1px solid #e2e4e9;transform:none;transition:opacity .2s,visibility .2s,transform .2s}}.au-datepicker__segment-list-header{padding:24px 16px;display:flex;align-items:center;justify-content:space-between}@media (min-width: 600px){.au-datepicker__segment-list-header{display:none}}.au-datepicker__segment-list{overflow-x:scroll;flex:1}.au-datepicker__segment-list-item{padding:16px 24px;font-size:16px;line-height:150%;cursor:pointer}.au-datepicker__segment-list-item:hover,.au-datepicker__segment-list-item--active{background-color:#f6f7fa}.au-datepicker__segment-list-item:not(:last-of-type){border-bottom:1px solid #e2e4e9}@media (min-width: 600px){.au-datepicker__segment-list-item:not(:last-of-type){border-bottom:none}}.au-datepicker__segment-title{font-family:"Source Sans 3",sans-serif;font-size:16px;font-weight:600}

package/dist/{index-BuHGuwbT.js → index-C8RdzVRj.js}

@@ -3,7 +3,7 @@ import "./index-CweZ_OcN.js";
 import "./components/Icon/index.es.js";
 import { IconChevronLeft } from "./components/icons/IconChevronLeft/index.es.js";
 import { IconChevronRight } from "./components/icons/IconChevronRight/index.es.js";
-import { S as Segment } from "./index-CLq9qZyb.js";
+import { S as Segment } from "./index-CP-KKFUb.js";
 import $dbSRa$react__default, { createContext, useContext, useState, useRef, useCallback, useEffect, useMemo, forwardRef } from "react";
 import "react-dom";
 createContext(null);
@@ -5686,4 +5686,4 @@ export {
   $dfd62f934fc76fed$export$e11f8ba65d857bff as e,
   $dfd62f934fc76fed$export$5d847498420df57b as f
 };
-//# sourceMappingURL=index-BuHGuwbT.js.map
+//# sourceMappingURL=index-C8RdzVRj.js.map