@consumidor-positivo/aurora 0.0.52 → 0.0.54

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

@@ -0,0 +1,11 @@
+import "react/jsx-runtime";
+import "../../index-CweZ_OcN.js";
+import "../../index-sZOTPBpa.js";
+import "../PortalHolder/index.es.js";
+import "../Button/index.es.js";
+import { a } from "../../index-COi2Dxq7.js";
+import "../../tokens-ijn4TwAB.js";
+export {
+  a as DatepickerCalendar
+};
+//# sourceMappingURL=index.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

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

@@ -0,0 +1,12 @@
+import "react/jsx-runtime";
+import "../../index-CweZ_OcN.js";
+import "../Icon/index.es.js";
+import "../icons/IconChevronLeft/index.es.js";
+import "../icons/IconChevronRight/index.es.js";
+import "../../index-gp5vcHlQ.js";
+import { C } from "../../index-sZOTPBpa.js";
+import "../../tokens-ijn4TwAB.js";
+export {
+  C as CalendarHeader
+};
+//# sourceMappingURL=index.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

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

@@ -1,8 +1,9 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { c as classNames } from "../../index-CweZ_OcN.js";
-import { j as COLOR_NEUTRAL_00, aK as Field } from "../../tokens-N1zNCjKI.js";
+import Field from "../Field/index.es.js";
 import "../Icon/index.es.js";
 import { IconCheck } from "../icons/IconCheck/index.es.js";
+import { j as COLOR_NEUTRAL_00 } from "../../tokens-ijn4TwAB.js";
 import '../styles/styles3.css';import '../styles/styles5.css';import '../styles/styles4.css';import '../styles/styles2.css';import '../styles/styles.css';/* empty css                    */
 /* empty css                    */
 import "../Header/index.es.js";
@@ -12,6 +13,7 @@ import "../Text/index.es.js";
 /* empty css                    */
 /* empty css                    */
 /* empty css                    */
+import "react-dom";
 const CheckboxField = ({
   label,
   error,

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

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/CheckboxField/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport Field from '../Field'\nimport { IconCheck } from '../../icons'\nimport { COLOR_NEUTRAL_00 } from '../../../main'\n\nimport './styles.scss'\n\ntype CheckboxFieldProps = React.InputHTMLAttributes<HTMLInputElement> & {\n  label: string\n  error: boolean\n  errorMessage: string\n}\n\nexport const CheckboxField = ({\n  label,\n  error,\n  errorMessage,\n  disabled,\n  id,\n  ...props\n}: CheckboxFieldProps) => {\n  const checkboxClasses = classNames('au-checkbox', {\n    'au-checkbox--error': !!error,\n    'au-checkbox--disabled': !!disabled,\n  })\n\n  return (\n    <div className={checkboxClasses}>\n      <label htmlFor={id} className=\"au-checkbox__holder\">\n        <input\n          className=\"au-checkbox__input\"\n          type=\"checkbox\"\n          id={id}\n          disabled={disabled}\n          {...props}\n        />\n        <span className=\"au-checkbox__check\">\n          <IconCheck rawColor={COLOR_NEUTRAL_00} />\n        </span>\n        <span className=\"au-checkbox__label\">\n          {label}\n        </span>\n      </label>\n      <Field.ErrorMessage hasError={!!error} message={errorMessage} />\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAaO,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA0B;AAClB,QAAA,kBAAkB,WAAW,eAAe;AAAA,IAChD,sBAAsB,CAAC,CAAC;AAAA,IACxB,yBAAyB,CAAC,CAAC;AAAA,EAAA,CAC5B;AAGC,SAAA,qBAAC,OAAI,EAAA,WAAW,iBACd,UAAA;AAAA,IAAA,qBAAC,SAAM,EAAA,SAAS,IAAI,WAAU,uBAC5B,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,MAAK;AAAA,UACL;AAAA,UACA;AAAA,UACC,GAAG;AAAA,QAAA;AAAA,MACN;AAAA,MACA,oBAAC,UAAK,WAAU,sBACd,8BAAC,WAAU,EAAA,UAAU,kBAAkB,EACzC,CAAA;AAAA,MACC,oBAAA,QAAA,EAAK,WAAU,sBACb,UACH,OAAA;AAAA,IAAA,GACF;AAAA,IACA,oBAAC,MAAM,cAAN,EAAmB,UAAU,CAAC,CAAC,OAAO,SAAS,cAAc;AAAA,EAChE,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/CheckboxField/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport Field from '../Field'\nimport { IconCheck } from '../../icons'\nimport { COLOR_NEUTRAL_00 } from '../../../main'\n\nimport './styles.scss'\n\ntype CheckboxFieldProps = React.InputHTMLAttributes<HTMLInputElement> & {\n  label: string\n  error: boolean\n  errorMessage: string\n}\n\nexport const CheckboxField = ({\n  label,\n  error,\n  errorMessage,\n  disabled,\n  id,\n  ...props\n}: CheckboxFieldProps) => {\n  const checkboxClasses = classNames('au-checkbox', {\n    'au-checkbox--error': !!error,\n    'au-checkbox--disabled': !!disabled,\n  })\n\n  return (\n    <div className={checkboxClasses}>\n      <label htmlFor={id} className=\"au-checkbox__holder\">\n        <input\n          className=\"au-checkbox__input\"\n          type=\"checkbox\"\n          id={id}\n          disabled={disabled}\n          {...props}\n        />\n        <span className=\"au-checkbox__check\">\n          <IconCheck rawColor={COLOR_NEUTRAL_00} />\n        </span>\n        <span className=\"au-checkbox__label\">\n          {label}\n        </span>\n      </label>\n      <Field.ErrorMessage hasError={!!error} message={errorMessage} />\n    </div>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAaO,MAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAA0B;AAClB,QAAA,kBAAkB,WAAW,eAAe;AAAA,IAChD,sBAAsB,CAAC,CAAC;AAAA,IACxB,yBAAyB,CAAC,CAAC;AAAA,EAAA,CAC5B;AAGC,SAAA,qBAAC,OAAI,EAAA,WAAW,iBACd,UAAA;AAAA,IAAA,qBAAC,SAAM,EAAA,SAAS,IAAI,WAAU,uBAC5B,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,MAAK;AAAA,UACL;AAAA,UACA;AAAA,UACC,GAAG;AAAA,QAAA;AAAA,MACN;AAAA,MACA,oBAAC,UAAK,WAAU,sBACd,8BAAC,WAAU,EAAA,UAAU,kBAAkB,EACzC,CAAA;AAAA,MACC,oBAAA,QAAA,EAAK,WAAU,sBACb,UACH,OAAA;AAAA,IAAA,GACF;AAAA,IACA,oBAAC,MAAM,cAAN,EAAmB,UAAU,CAAC,CAAC,OAAO,SAAS,cAAc;AAAA,EAChE,EAAA,CAAA;AAEJ;"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/misc/Conditional/index.tsx"],"sourcesContent":["export interface ConditionalProps {\n  condition: boolean\n  renderIf: any\n  renderElse?: any\n}\n\nexport const Conditional = ({\n  condition,\n  renderIf,\n  renderElse = null,\n}: ConditionalProps) => {\n  return condition ? renderIf : renderElse\n}\n"],"names":[],"mappings":"AAMO,MAAM,cAAc,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA,aAAa;AACf,MAAwB;AACtB,SAAO,YAAY,WAAW;AAChC;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/misc/Conditional/index.tsx"],"sourcesContent":["export type ConditionalProps = {\n  condition: boolean\n  renderIf: any\n  renderElse?: any\n}\n\nexport const Conditional = ({\n  condition,\n  renderIf,\n  renderElse = null,\n}: ConditionalProps) => {\n  return condition ? renderIf : renderElse\n}\n"],"names":[],"mappings":"AAMO,MAAM,cAAc,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EACA,aAAa;AACf,MAAwB;AACtB,SAAO,YAAY,WAAW;AAChC;"}

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

@@ -0,0 +1,190 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { InputField } from "../InputField/index.es.js";
+import "../../index-CweZ_OcN.js";
+import "../Icon/index.es.js";
+import { IconCalendar } from "../icons/IconCalendar/index.es.js";
+import { ah as BREAKPOINT_MD, f as COLOR_NEUTRAL_40 } from "../../tokens-ijn4TwAB.js";
+import '../styles/styles3.css';import '../styles/styles5.css';import '../styles/styles4.css';import '../styles/styles2.css';import '../styles/styles.css';/* empty css                    */
+/* empty css                    */
+import "../Header/index.es.js";
+import { useRef, useState, useEffect } from "react";
+import "../NavbarVertical/index.es.js";
+import "../Text/index.es.js";
+/* empty css                    */
+/* empty css                    */
+/* empty css                    */
+import { g as getDefaultDate, D as DDMMYYYY, a as DatepickerCalendar, A as AUCalendarDate } from "../../index-COi2Dxq7.js";
+import { u as useOutsideClick } from "../../index-gp5vcHlQ.js";
+import "react-dom";
+function useDatepicker({
+  value,
+  defaultValue = "empty",
+  onChange,
+  disabled,
+  format = DDMMYYYY,
+  placeholder,
+  onBlur,
+  minValue,
+  maxValue
+}) {
+  const rootEl = useRef(null);
+  const { listenOutsideClick } = useOutsideClick({
+    rootEl,
+    breakpoint: BREAKPOINT_MD,
+    onLoseFocusCB: handleOutsideClick
+  });
+  const [inputDate, setInputDate] = useState("");
+  const [selectedDate, setSelectedDate] = useState(
+    null
+  );
+  const [alareadySetDefaultValue, setAlreadySetDefaultValue] = useState(false);
+  const [isCalendarVisible, setIsCalendarVisible] = useState(false);
+  const inputRef = useRef(null);
+  useEffect(() => {
+    if (!!value && value.day) {
+      setSelectedDate(value);
+      setInputDate(format.toString(value));
+    }
+  }, [value]);
+  useEffect(() => {
+    if (!defaultValue || alareadySetDefaultValue) return;
+    const parsedDefaultDate = getDefaultDate(defaultValue);
+    setSelectedDate(parsedDefaultDate);
+    setInputDate(parsedDefaultDate ? format.toString(parsedDefaultDate) : "");
+    setAlreadySetDefaultValue(true);
+  }, [defaultValue]);
+  function handleInputChange(e) {
+    const maskedValue = format.maskDate(e.target.value);
+    const finishedTypingDate = format.validateFormat(maskedValue);
+    setInputDate(maskedValue);
+    if (!finishedTypingDate) return;
+    const isDateValid = format.validate(maskedValue, minValue, maxValue);
+    const newFieldValue = isDateValid ? format.toCalendarDate(maskedValue) : null;
+    setSelectedDate(newFieldValue);
+    if (onChange) onChange(newFieldValue);
+    if (!isDateValid) setInputDate("");
+  }
+  function handleInputBlur() {
+    if (onBlur) {
+      onBlur(selectedDate);
+    }
+  }
+  function toggleCalendar() {
+    if (!isCalendarVisible && disabled) return;
+    inputRef.current && inputRef.current.focus();
+    if (!isCalendarVisible) {
+      listenOutsideClick();
+    }
+    setIsCalendarVisible(!isCalendarVisible);
+  }
+  function closeCalendar() {
+    setIsCalendarVisible(false);
+  }
+  function handleOutsideClick() {
+    closeCalendar();
+  }
+  function updateDateFromCalendar(pickerDate) {
+    setSelectedDate(pickerDate);
+    setInputDate(format.toString(pickerDate));
+    if (onChange) onChange(pickerDate);
+  }
+  return {
+    inputDate,
+    handleInputChange,
+    handleInputBlur,
+    toggleCalendar,
+    closeCalendar,
+    isCalendarVisible,
+    fmtPlaceholder: placeholder || format.placeholder,
+    inputRef,
+    selectedDate,
+    setSelectedDate,
+    updateDateFromCalendar,
+    rootEl
+  };
+}
+const DatepickerField = ({
+  calendar = true,
+  placeholder,
+  disabled,
+  onChange,
+  value,
+  defaultValue,
+  onBlur,
+  withPortal = true,
+  minValue = AUCalendarDate(1, 1, 1900),
+  maxValue = AUCalendarDate(31, 12, 2100),
+  ...props
+}) => {
+  const {
+    inputDate,
+    handleInputChange,
+    handleInputBlur,
+    toggleCalendar,
+    closeCalendar,
+    isCalendarVisible,
+    fmtPlaceholder,
+    inputRef,
+    selectedDate,
+    updateDateFromCalendar,
+    rootEl
+  } = useDatepicker({
+    onChange,
+    value,
+    defaultValue,
+    placeholder,
+    minValue,
+    maxValue,
+    onBlur,
+    disabled
+  });
+  return /* @__PURE__ */ jsxs("div", { className: "au-datepicker", ref: rootEl, children: [
+    /* @__PURE__ */ jsx(
+      InputField,
+      {
+        className: "au-datepicker__input",
+        ...props,
+        maxLength: 10,
+        value: inputDate,
+        inputRef,
+        onBlur: handleInputBlur,
+        disabled,
+        onChange: handleInputChange,
+        placeholder: fmtPlaceholder,
+        rightSlot: calendar && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "au-datepicker__calendar-holder",
+            onClick: toggleCalendar,
+            children: /* @__PURE__ */ jsx(
+              IconCalendar,
+              {
+                rawColor: disabled ? COLOR_NEUTRAL_40 : void 0
+              }
+            )
+          }
+        )
+      }
+    ),
+    calendar && /* @__PURE__ */ jsx(
+      DatepickerCalendar,
+      {
+        withPortal,
+        isVisible: isCalendarVisible,
+        onClose: closeCalendar,
+        minValue,
+        maxValue,
+        value: selectedDate,
+        onChange: updateDateFromCalendar
+      }
+    )
+  ] });
+};
+const RangePicker = () => {
+  return /* @__PURE__ */ jsx("p", {});
+};
+export {
+  DatepickerField,
+  RangePicker
+};
+//# sourceMappingURL=index.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Datepicker/hook.ts","../../../lib/components/form/Datepicker/index.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react'\n\nimport {\n  AUCalendarDateShape,\n  DefaultValue,\n  EventHandler,\n  FormatAdapter,\n} from './types'\nimport { DDMMYYYY, getDefaultDate } from './helpers'\nimport { useOutsideClick } from '../../../core/hooks/useOutsideClick'\nimport { BREAKPOINT_MD } from '../../../main'\n\ntype UseDatePickerProps = {\n  onChange?: EventHandler\n  disabled?: boolean\n  value?: AUCalendarDateShape | null\n  defaultValue?: DefaultValue\n  format?: FormatAdapter\n  placeholder?: string\n  onBlur?: EventHandler\n  minValue: AUCalendarDateShape\n  maxValue: AUCalendarDateShape\n}\n\nexport function useDatepicker({\n  value,\n  defaultValue = 'empty',\n  onChange,\n  disabled,\n  format = DDMMYYYY,\n  placeholder,\n  onBlur,\n  minValue,\n  maxValue,\n}: UseDatePickerProps) {\n  const rootEl = useRef<HTMLDivElement>(null)\n  const { listenOutsideClick } = useOutsideClick({\n    rootEl,\n    breakpoint: BREAKPOINT_MD,\n    onLoseFocusCB: handleOutsideClick,\n  })\n  const [inputDate, setInputDate] = useState('')\n  const [selectedDate, setSelectedDate] = useState<AUCalendarDateShape | null>(\n    null,\n  )\n\n  const [alareadySetDefaultValue, setAlreadySetDefaultValue] = useState(false)\n  const [isCalendarVisible, setIsCalendarVisible] = useState(false)\n  const inputRef = useRef<HTMLInputElement>(null)\n\n  useEffect(() => {\n    if (!!value && value.day) {\n      setSelectedDate(value)\n      setInputDate(format.toString(value))\n    }\n  }, [value])\n\n  useEffect(() => {\n    if (!defaultValue || alareadySetDefaultValue) return\n    const parsedDefaultDate = getDefaultDate(defaultValue)\n    setSelectedDate(parsedDefaultDate)\n    setInputDate(parsedDefaultDate ? format.toString(parsedDefaultDate) : '')\n    setAlreadySetDefaultValue(true)\n  }, [defaultValue])\n\n  function handleInputChange(e: React.ChangeEvent<HTMLInputElement>) {\n    const maskedValue = format.maskDate(e.target.value)\n    const finishedTypingDate = format.validateFormat(maskedValue)\n    setInputDate(maskedValue)\n\n    if (!finishedTypingDate) return\n\n    const isDateValid = format.validate(maskedValue, minValue, maxValue)\n    const newFieldValue = isDateValid\n      ? format.toCalendarDate(maskedValue)\n      : null\n    setSelectedDate(newFieldValue)\n    if (onChange) onChange(newFieldValue)\n\n    if (!isDateValid) setInputDate('')\n  }\n\n  function handleInputBlur() {\n    if (onBlur) {\n      onBlur(selectedDate)\n    }\n  }\n\n  function toggleCalendar() {\n    if (!isCalendarVisible && disabled) return\n    inputRef.current && inputRef.current.focus()\n    if (!isCalendarVisible) {\n      listenOutsideClick()\n    }\n    setIsCalendarVisible(!isCalendarVisible)\n  }\n\n  function closeCalendar() {\n    setIsCalendarVisible(false)\n  }\n\n  function handleOutsideClick() {\n    closeCalendar()\n  }\n\n  function updateDateFromCalendar(pickerDate: AUCalendarDateShape) {\n    setSelectedDate(pickerDate)\n    setInputDate(format.toString(pickerDate))\n    if (onChange) onChange(pickerDate)\n  }\n\n  return {\n    inputDate,\n    handleInputChange,\n    handleInputBlur,\n    toggleCalendar,\n    closeCalendar,\n    isCalendarVisible,\n    fmtPlaceholder: placeholder || format.placeholder,\n    inputRef,\n    selectedDate,\n    setSelectedDate,\n    updateDateFromCalendar,\n    rootEl,\n  }\n}\n","import { InputField } from '../InputField'\nimport { InputProps } from '../InputField'\nimport { IconCalendar } from '../../icons'\nimport { COLOR_NEUTRAL_40 } from '../../../main'\nimport { DatepickerCalendar } from './Calendar'\n\nimport {\n  AUCalendarDateShape,\n  DefaultValue,\n  EventHandler,\n  FormatAdapter,\n} from './types'\n\nimport { AUCalendarDate } from './helpers'\nimport { useDatepicker } from './hook'\nimport './styles.scss'\n\ntype DatepickerFieldProps = Omit<InputProps, 'value' | 'onChange'> & {\n  /** Use calendar dialog to pick date */\n  calendar?: boolean\n  placeholder?: string\n  value?: AUCalendarDateShape | null\n  onChange?: EventHandler\n  onBlur?: EventHandler\n  /** Default date to use the datepicker as an uncontrolled component */\n  defaultValue?: DefaultValue\n  /** Adapter to modify input behavior - default to DD/MM/YYYY adapter */\n  format?: FormatAdapter\n  /** Makes the calendar dialog the top z-indexed item on page */\n  withPortal?: boolean\n  /** min allowed date, defaults to 1900-01-01 */\n  minValue?: AUCalendarDateShape\n  /** max allowed date, defaults to 2100-12-31 */\n  maxValue?: AUCalendarDateShape\n}\n\nexport const DatepickerField = ({\n  calendar = true,\n  placeholder,\n  disabled,\n  onChange,\n  value,\n  defaultValue,\n  onBlur,\n  withPortal = true,\n  minValue = AUCalendarDate(1, 1, 1900),\n  maxValue = AUCalendarDate(31, 12, 2100),\n  ...props\n}: DatepickerFieldProps) => {\n  const {\n    inputDate,\n    handleInputChange,\n    handleInputBlur,\n    toggleCalendar,\n    closeCalendar,\n    isCalendarVisible,\n    fmtPlaceholder,\n    inputRef,\n    selectedDate,\n    updateDateFromCalendar,\n    rootEl,\n  } = useDatepicker({\n    onChange,\n    value,\n    defaultValue,\n    placeholder,\n    minValue,\n    maxValue,\n    onBlur,\n    disabled,\n  })\n\n  return (\n    <div className=\"au-datepicker\" ref={rootEl}>\n      <InputField\n        className=\"au-datepicker__input\"\n        {...props}\n        maxLength={10}\n        value={inputDate}\n        inputRef={inputRef}\n        onBlur={handleInputBlur}\n        disabled={disabled}\n        onChange={handleInputChange}\n        placeholder={fmtPlaceholder}\n        rightSlot={\n          calendar && (\n            <div\n              className=\"au-datepicker__calendar-holder\"\n              onClick={toggleCalendar}>\n              <IconCalendar\n                rawColor={disabled ? COLOR_NEUTRAL_40 : undefined}\n              />\n            </div>\n          )\n        }\n      />\n      {calendar && (\n        <DatepickerCalendar\n          withPortal={withPortal}\n          isVisible={isCalendarVisible}\n          onClose={closeCalendar}\n          minValue={minValue}\n          maxValue={maxValue}\n          value={selectedDate}\n          onChange={updateDateFromCalendar}\n        />\n      )}\n    </div>\n  )\n}\n\n// TODO - implement as a different field\nexport const RangePicker = () => {\n  return <p></p>\n}\n"],"names":[],"mappings":"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"}

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

@@ -1,9 +1,9 @@
-import * as React from "react";
+import * as $dbSRa$react from "react";
 const DynamicTagComponent = ({
   children = "Dynamic tag component",
   tag = "button",
   ...props
-}) => React.createElement(tag, { ...props }, children);
+}) => $dbSRa$react.createElement(tag, { ...props }, children);
 export {
   DynamicTagComponent as default
 };

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

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/misc/DynamicTagComponent/index.tsx"],"sourcesContent":["import * as React from 'react'\n\ninterface DynamicTagComponentProps extends React.HTMLAttributes<HTMLElement> {\n  /** Html tag that this component root should have */\n  tag: string\n}\n\nconst DynamicTagComponent: React.FC<DynamicTagComponentProps> = ({\n  children = 'Dynamic tag component',\n  tag = 'button',\n  ...props\n}) => React.createElement(tag, { ...props }, children)\n\nexport default DynamicTagComponent\n"],"names":[],"mappings":";AAOA,MAAM,sBAA0D,CAAC;AAAA,EAC/D,WAAW;AAAA,EACX,MAAM;AAAA,EACN,GAAG;AACL,MAAM,MAAM,cAAc,KAAK,EAAE,GAAG,SAAS,QAAQ;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/misc/DynamicTagComponent/index.tsx"],"sourcesContent":["import * as React from 'react'\n\ntype DynamicTagComponentProps = React.HTMLAttributes<HTMLElement> & {\n  /** Html tag that this component root should have */\n  tag: string\n}\n\nconst DynamicTagComponent: React.FC<DynamicTagComponentProps> = ({\n  children = 'Dynamic tag component',\n  tag = 'button',\n  ...props\n}) => React.createElement(tag, { ...props }, children)\n\nexport default DynamicTagComponent\n"],"names":["React"],"mappings":";AAOA,MAAM,sBAA0D,CAAC;AAAA,EAC/D,WAAW;AAAA,EACX,MAAM;AAAA,EACN,GAAG;AACL,MAAMA,aAAM,cAAc,KAAK,EAAE,GAAG,SAAS,QAAQ;"}

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

@@ -1,5 +1,102 @@
-import { aK } from "../../tokens-N1zNCjKI.js";
+import { jsx, jsxs } 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 { G as COLOR_SUCCESS_50, N as COLOR_ERROR_50, f as COLOR_NEUTRAL_40 } from "../../tokens-ijn4TwAB.js";
+import '../styles/styles3.css';import '../styles/styles5.css';import '../styles/styles4.css';import '../styles/styles2.css';import '../styles/styles.css';/* empty css                    */
+/* empty css                    */
+import "../Header/index.es.js";
+import "react";
+import "../NavbarVertical/index.es.js";
+import "../Text/index.es.js";
+/* empty css                    */
+/* empty css                    */
+/* empty css                    */
+import "react-dom";
+const FieldErrorMessage = ({ hasError, message }) => {
+  if (!hasError || !message) return;
+  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;
+  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 Field = {
+  Root: FieldRoot,
+  Input: FieldInput,
+  InputHolder: FieldInputHolder,
+  Label: FieldLabel,
+  ErrorMessage: FieldErrorMessage
+};
 export {
-  aK as default
+  Field as default
 };
 //# sourceMappingURL=index.es.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"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\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 '../../icons'\nimport {\n  COLOR_ERROR_50,\n  COLOR_NEUTRAL_40,\n  COLOR_SUCCESS_50,\n} from '../../../main'\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\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;AACzE,MAAA,CAAC,YAAY,CAAC,QAAS;AAE3B,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;AACrB,MAAI,CAAC,KAAM;AAEX,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;"}

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

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { aK as Field } from "../../tokens-N1zNCjKI.js";
+import Field from "../Field/index.es.js";
 const InputField = ({
   optional,
   requiredInput,
@@ -7,11 +7,13 @@ const InputField = ({
   error,
   errorMessage,
   label,
-  ref,
   id,
   disabled,
   style,
   className,
+  inputStyle,
+  rightSlot,
+  inputRef,
   ...props
 }) => {
   return /* @__PURE__ */ jsxs(
@@ -35,7 +37,16 @@ const InputField = ({
             disabled
           }
         ),
-        /* @__PURE__ */ jsx(Field.Input, { id, ref, disabled, ...props }),
+        /* @__PURE__ */ jsx(Field.InputHolder, { rightSideSlot: rightSlot, children: /* @__PURE__ */ jsx(
+          Field.Input,
+          {
+            id,
+            inputRef,
+            disabled,
+            style: inputStyle,
+            ...props
+          }
+        ) }),
         /* @__PURE__ */ jsx(Field.ErrorMessage, { hasError: !!error, message: errorMessage })
       ]
     }

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

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/InputField/index.tsx"],"sourcesContent":["import Field from '../Field'\n\ntype InputProps = React.InputHTMLAttributes<HTMLInputElement> & {\n  optional?: boolean\n  requiredInput?: boolean\n  success?: boolean\n  error?: boolean\n  errorMessage?: string\n  label?: string\n  ref?: React.RefObject<HTMLInputElement>\n}\n\nexport const InputField = ({\n  optional,\n  requiredInput,\n  success,\n  error,\n  errorMessage,\n  label,\n  ref,\n  id,\n  disabled,\n  style,\n  className,\n  ...props\n}: InputProps) => {\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={requiredInput}\n        optional={optional}\n        success={success}\n        error={error}\n        disabled={disabled}\n      />\n      <Field.Input id={id} ref={ref} disabled={disabled} {...props} />\n      <Field.ErrorMessage hasError={!!error} message={errorMessage} />\n    </Field.Root>\n  )\n}\n"],"names":[],"mappings":";;AAYO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAkB;AAEd,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,UAAU;AAAA,YACV;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,QACA,oBAAC,MAAM,OAAN,EAAY,IAAQ,KAAU,UAAqB,GAAG,OAAO;AAAA,QAC9D,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/InputField/index.tsx"],"sourcesContent":["import Field from '../Field'\n\nexport type InputProps = React.InputHTMLAttributes<HTMLInputElement> & {\n  optional?: boolean\n  requiredInput?: boolean\n  success?: boolean\n  error?: boolean\n  errorMessage?: string\n  rightSlot?: React.ReactNode\n  label?: string\n  inputStyle?: React.CSSProperties\n  inputRef?: React.RefObject<HTMLInputElement>\n}\n\nexport const InputField = ({\n  optional,\n  requiredInput,\n  success,\n  error,\n  errorMessage,\n  label,\n  id,\n  disabled,\n  style,\n  className,\n  inputStyle,\n  rightSlot,\n  inputRef,\n  ...props\n}: InputProps) => {\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={requiredInput}\n        optional={optional}\n        success={success}\n        error={error}\n        disabled={disabled}\n      />\n      <Field.InputHolder rightSideSlot={rightSlot}>\n        <Field.Input\n          id={id}\n          inputRef={inputRef}\n          disabled={disabled}\n          style={inputStyle}\n          {...props}\n        />\n      </Field.InputHolder>\n      <Field.ErrorMessage hasError={!!error} message={errorMessage} />\n    </Field.Root>\n  )\n}\n"],"names":[],"mappings":";;AAcO,MAAM,aAAa,CAAC;AAAA,EACzB;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,MAAkB;AAGd,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,UAAU;AAAA,YACV;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,QACC,oBAAA,MAAM,aAAN,EAAkB,eAAe,WAChC,UAAA;AAAA,UAAC,MAAM;AAAA,UAAN;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA,OAAO;AAAA,YACN,GAAG;AAAA,UAAA;AAAA,QAAA,GAER;AAAA,QACA,oBAAC,MAAM,cAAN,EAAmB,UAAU,CAAC,CAAC,OAAO,SAAS,cAAc;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpE;"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/core/utils/isClient.ts","../../../lib/core/utils/isMobile.ts","../../../lib/components/IsMobile/index.tsx"],"sourcesContent":["export const isClient = () =>\n  !!(\n    typeof window !== 'undefined' &&\n    window.document &&\n    window.document.createElement\n  )\n","import { isClient } from './isClient'\n\nexport function isMobile() {\n  if (!isClient()) return\n  return !!window.matchMedia('screen and (max-width:767px)').matches\n}\n","import { isMobile } from '../../core/utils/isMobile'\nimport { Conditional } from '../misc'\nimport { ReactNode } from 'react'\n\ntype IsMobileProps = {\n  renderIf: ReactNode | string | JSX.Element | JSX.Element[]\n  renderElse: ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const IsMobile = ({ renderIf, renderElse }: IsMobileProps) => {\n  return (\n    <Conditional\n      condition={!!isMobile()}\n      renderIf={renderIf}\n      renderElse={renderElse}\n    />\n  )\n}\n"],"names":[],"mappings":";;AAAa,MAAA,WAAW,MACtB,CAAC,EACC,OAAO,WAAW,eAClB,OAAO,YACP,OAAO,SAAS;ACFb,SAAS,WAAW;AACrB,MAAA,CAAC,WAAY;AACjB,SAAO,CAAC,CAAC,OAAO,WAAW,8BAA8B,EAAE;AAC7D;ACIO,MAAM,WAAW,CAAC,EAAE,UAAU,iBAAgC;AAEjE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,CAAC,CAAC,SAAS;AAAA,MACtB;AAAA,MACA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/core/utils/isClient.ts","../../../lib/core/utils/isMobile.ts","../../../lib/components/IsMobile/index.tsx"],"sourcesContent":["export const isClient = () =>\n  !!(\n    typeof window !== 'undefined' &&\n    window.document &&\n    window.document.createElement\n  )\n","import { isClient } from './isClient'\n\n\n//TODO - match with CSS breakpoints\nexport function isMobile() {\n  if (!isClient()) return\n  return !!window.matchMedia('screen and (max-width:767px)').matches\n}\n","import { isMobile } from '../../core/utils/isMobile'\nimport { Conditional } from '../misc'\nimport { ReactNode } from 'react'\n\ntype IsMobileProps = {\n  renderIf: ReactNode | string | JSX.Element | JSX.Element[]\n  renderElse: ReactNode | string | JSX.Element | JSX.Element[]\n}\n\nexport const IsMobile = ({ renderIf, renderElse }: IsMobileProps) => {\n  return (\n    <Conditional\n      condition={!!isMobile()}\n      renderIf={renderIf}\n      renderElse={renderElse}\n    />\n  )\n}\n"],"names":[],"mappings":";;AAAa,MAAA,WAAW,MACtB,CAAC,EACC,OAAO,WAAW,eAClB,OAAO,YACP,OAAO,SAAS;ACAb,SAAS,WAAW;AACrB,MAAA,CAAC,WAAY;AACjB,SAAO,CAAC,CAAC,OAAO,WAAW,8BAA8B,EAAE;AAC7D;ACEO,MAAM,WAAW,CAAC,EAAE,UAAU,iBAAgC;AAEjE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,CAAC,CAAC,SAAS;AAAA,MACtB;AAAA,MACA;AAAA,IAAA;AAAA,EAAA;AAGN;"}

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

@@ -1,4 +1,4 @@
-import React__default, { useState, useRef, useCallback, useEffect } from "react";
+import $dbSRa$react__default, { useState, useRef, useCallback, useEffect } from "react";
 function useLazyImage({ lazy = true, src }) {
   const [imageSrc, setImageSrc] = useState(
     lazy ? void 0 : src
@@ -41,7 +41,7 @@ const LazyImage = ({
   onClick
 }) => {
   const { imgRef, imageSrc } = useLazyImage({ lazy, src });
-  return React__default.createElement("img", {
+  return $dbSRa$react__default.createElement("img", {
     ...lazy && { ref: imgRef },
     className,
     ...lazy && { loading: "lazy" },

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

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/LazyImage/hooks.ts","../../../lib/components/LazyImage/index.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react'\nimport { UseLazyImageProps } from './types'\n\nexport function useLazyImage({ lazy = true, src }: UseLazyImageProps) {\n  const [imageSrc, setImageSrc] = useState<string | undefined>(\n    lazy ? undefined : src,\n  )\n  const imgRef = useRef<HTMLImageElement>(null)\n\n  const observeIntersection = useCallback(() => {\n    const observer = new IntersectionObserver((entries) => {\n      entries.forEach((entry) => {\n        if (entry.isIntersecting) {\n          setImageSrc(src)\n\n          if (imgRef.current) observer.unobserve(imgRef.current)\n        }\n      })\n    })\n\n    if (imgRef.current) observer.observe(imgRef.current)\n\n    return () => {\n      if (observer && imgRef.current) observer.disconnect()\n    }\n  }, [src])\n\n  useEffect(() => {\n    if (src !== imageSrc && !lazy) setImageSrc(src)\n\n    const cleanupObserver = lazy ? observeIntersection() : () => {}\n\n    return () => cleanupObserver()\n  }, [observeIntersection, lazy])\n\n  return {\n    imgRef,\n    imageSrc,\n  }\n}\n","import React from 'react'\n\nimport { useLazyImage } from './hooks'\n\nimport { LazyImageProps } from './types'\n\nexport const LazyImage = ({\n  className,\n  lazy = true,\n  src,\n  alt,\n  height,\n  width,\n  draggable = false,\n  style,\n  onClick,\n}: LazyImageProps) => {\n  const { imgRef, imageSrc } = useLazyImage({ lazy, src })\n\n  return React.createElement('img', {\n    ...(lazy && { ref: imgRef }),\n\n    className,\n    ...(lazy && { loading: 'lazy' }),\n    src: imageSrc,\n    alt,\n    height,\n    width,\n    draggable,\n    style,\n    onClick,\n  })\n}\n"],"names":["React"],"mappings":";AAGO,SAAS,aAAa,EAAE,OAAO,MAAM,OAA0B;AAC9D,QAAA,CAAC,UAAU,WAAW,IAAI;AAAA,IAC9B,OAAO,SAAY;AAAA,EAAA;AAEf,QAAA,SAAS,OAAyB,IAAI;AAEtC,QAAA,sBAAsB,YAAY,MAAM;AAC5C,UAAM,WAAW,IAAI,qBAAqB,CAAC,YAAY;AAC7C,cAAA,QAAQ,CAAC,UAAU;AACzB,YAAI,MAAM,gBAAgB;AACxB,sBAAY,GAAG;AAEf,cAAI,OAAO,QAAkB,UAAA,UAAU,OAAO,OAAO;AAAA,QACvD;AAAA,MAAA,CACD;AAAA,IAAA,CACF;AAED,QAAI,OAAO,QAAkB,UAAA,QAAQ,OAAO,OAAO;AAEnD,WAAO,MAAM;AACX,UAAI,YAAY,OAAO,QAAS,UAAS,WAAW;AAAA,IAAA;AAAA,EACtD,GACC,CAAC,GAAG,CAAC;AAER,YAAU,MAAM;AACd,QAAI,QAAQ,YAAY,CAAC,kBAAkB,GAAG;AAE9C,UAAM,kBAAkB,OAAO,oBAAoB,IAAI,MAAM;AAAA,IAAA;AAE7D,WAAO,MAAM,gBAAgB;AAAA,EAAA,GAC5B,CAAC,qBAAqB,IAAI,CAAC;AAEvB,SAAA;AAAA,IACL;AAAA,IACA;AAAA,EAAA;AAEJ;ACjCO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA;AACF,MAAsB;AACd,QAAA,EAAE,QAAQ,SAAS,IAAI,aAAa,EAAE,MAAM,KAAK;AAEhD,SAAAA,eAAM,cAAc,OAAO;AAAA,IAChC,GAAI,QAAQ,EAAE,KAAK,OAAO;AAAA,IAE1B;AAAA,IACA,GAAI,QAAQ,EAAE,SAAS,OAAO;AAAA,IAC9B,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AACH;"}
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/LazyImage/hooks.ts","../../../lib/components/LazyImage/index.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react'\nimport { UseLazyImageProps } from './types'\n\nexport function useLazyImage({ lazy = true, src }: UseLazyImageProps) {\n  const [imageSrc, setImageSrc] = useState<string | undefined>(\n    lazy ? undefined : src,\n  )\n  const imgRef = useRef<HTMLImageElement>(null)\n\n  const observeIntersection = useCallback(() => {\n    const observer = new IntersectionObserver((entries) => {\n      entries.forEach((entry) => {\n        if (entry.isIntersecting) {\n          setImageSrc(src)\n\n          if (imgRef.current) observer.unobserve(imgRef.current)\n        }\n      })\n    })\n\n    if (imgRef.current) observer.observe(imgRef.current)\n\n    return () => {\n      if (observer && imgRef.current) observer.disconnect()\n    }\n  }, [src])\n\n  useEffect(() => {\n    if (src !== imageSrc && !lazy) setImageSrc(src)\n\n    const cleanupObserver = lazy ? observeIntersection() : () => {}\n\n    return () => cleanupObserver()\n  }, [observeIntersection, lazy])\n\n  return {\n    imgRef,\n    imageSrc,\n  }\n}\n","import React from 'react'\n\nimport { useLazyImage } from './hooks'\n\nimport { LazyImageProps } from './types'\n\nexport const LazyImage = ({\n  className,\n  lazy = true,\n  src,\n  alt,\n  height,\n  width,\n  draggable = false,\n  style,\n  onClick,\n}: LazyImageProps) => {\n  const { imgRef, imageSrc } = useLazyImage({ lazy, src })\n\n  return React.createElement('img', {\n    ...(lazy && { ref: imgRef }),\n\n    className,\n    ...(lazy && { loading: 'lazy' }),\n    src: imageSrc,\n    alt,\n    height,\n    width,\n    draggable,\n    style,\n    onClick,\n  })\n}\n"],"names":["React"],"mappings":";AAGO,SAAS,aAAa,EAAE,OAAO,MAAM,OAA0B;AAC9D,QAAA,CAAC,UAAU,WAAW,IAAI;AAAA,IAC9B,OAAO,SAAY;AAAA,EAAA;AAEf,QAAA,SAAS,OAAyB,IAAI;AAEtC,QAAA,sBAAsB,YAAY,MAAM;AAC5C,UAAM,WAAW,IAAI,qBAAqB,CAAC,YAAY;AAC7C,cAAA,QAAQ,CAAC,UAAU;AACzB,YAAI,MAAM,gBAAgB;AACxB,sBAAY,GAAG;AAEf,cAAI,OAAO,QAAkB,UAAA,UAAU,OAAO,OAAO;AAAA,QACvD;AAAA,MAAA,CACD;AAAA,IAAA,CACF;AAED,QAAI,OAAO,QAAkB,UAAA,QAAQ,OAAO,OAAO;AAEnD,WAAO,MAAM;AACX,UAAI,YAAY,OAAO,QAAS,UAAS,WAAW;AAAA,IAAA;AAAA,EACtD,GACC,CAAC,GAAG,CAAC;AAER,YAAU,MAAM;AACd,QAAI,QAAQ,YAAY,CAAC,kBAAkB,GAAG;AAE9C,UAAM,kBAAkB,OAAO,oBAAoB,IAAI,MAAM;AAAA,IAAA;AAE7D,WAAO,MAAM,gBAAgB;AAAA,EAAA,GAC5B,CAAC,qBAAqB,IAAI,CAAC;AAEvB,SAAA;AAAA,IACL;AAAA,IACA;AAAA,EAAA;AAEJ;ACjCO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ;AAAA,EACA;AACF,MAAsB;AACd,QAAA,EAAE,QAAQ,SAAS,IAAI,aAAa,EAAE,MAAM,KAAK;AAEhD,SAAAA,sBAAM,cAAc,OAAO;AAAA,IAChC,GAAI,QAAQ,EAAE,KAAK,OAAO;AAAA,IAE1B;AAAA,IACA,GAAI,QAAQ,EAAE,SAAS,OAAO;AAAA,IAC9B,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,CACD;AACH;"}

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

@@ -1,6 +1,7 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { aK as Field } from "../../tokens-N1zNCjKI.js";
+import Field from "../Field/index.es.js";
 import { useState } from "react";
+import "../../tokens-ijn4TwAB.js";
 const usePasswordField = () => {
   const [showPassword, setShowPassword] = useState(false);
   const fieldType = showPassword ? "text" : "password";
@@ -21,7 +22,7 @@ const PasswordField = ({
   error,
   errorMessage,
   label,
-  ref,
+  inputRef,
   id,
   disabled,
   style,
@@ -57,7 +58,7 @@ const PasswordField = ({
               customclass: "au-password-field__input",
               type: fieldType,
               id,
-              ref,
+              inputRef,
               disabled,
               ...props
             }

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

@@ -1 +1 @@
-{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/PasswordField/hook.tsx","../../../lib/components/form/PasswordField/index.tsx"],"sourcesContent":["import { useState } from 'react'\n\nexport const usePasswordField = () => {\n  const [showPassword, setShowPassword] = useState<boolean>(false)\n  const fieldType = showPassword ? 'text' : 'password'\n  const textButton = showPassword ? 'ocultar' : 'mostrar'\n\n  function changeVisibility() {\n    setShowPassword((prevState) => !prevState)\n  }\n\n  return {\n    fieldType,\n    textButton,\n    changeVisibility,\n  }\n}\n","import Field from '../Field'\nimport { usePasswordField } from './hook'\nimport './styles.scss'\n\ntype PasswordFieldProps = React.InputHTMLAttributes<HTMLInputElement> & {\n  type?: 'password'\n  optional?: boolean\n  requiredInput?: boolean\n  success?: boolean\n  error?: boolean\n  errorMessage?: string\n  label?: string\n  ref?: React.RefObject<HTMLInputElement>\n}\n\nexport const PasswordField = ({\n  optional,\n  requiredInput,\n  success,\n  error,\n  errorMessage,\n  label,\n  ref,\n  id,\n  disabled,\n  style,\n  className,\n  ...props\n}: PasswordFieldProps) => {\n  const { fieldType, textButton, changeVisibility } = usePasswordField()\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={requiredInput}\n        optional={optional}\n        success={success}\n        error={error}\n        disabled={disabled}\n      />\n      <div className=\"au-password-field__container\">\n        <Field.Input\n          customclass=\"au-password-field__input\"\n          type={fieldType}\n          id={id}\n          ref={ref}\n          disabled={disabled}\n          {...props}\n        />\n        <button\n          className=\"au-password-field__btn\"\n          onClick={changeVisibility}\n          disabled={disabled}>\n          {textButton}\n        </button>\n      </div>\n      <Field.ErrorMessage hasError={!!error} message={errorMessage} />\n    </Field.Root>\n  )\n}\n"],"names":[],"mappings":";;;AAEO,MAAM,mBAAmB,MAAM;AACpC,QAAM,CAAC,cAAc,eAAe,IAAI,SAAkB,KAAK;AACzD,QAAA,YAAY,eAAe,SAAS;AACpC,QAAA,aAAa,eAAe,YAAY;AAE9C,WAAS,mBAAmB;AACV,oBAAA,CAAC,cAAc,CAAC,SAAS;AAAA,EAC3C;AAEO,SAAA;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;ACDO,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,GAAG;AACL,MAA0B;AACxB,QAAM,EAAE,WAAW,YAAY,qBAAqB,iBAAiB;AAGnE,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,UAAU;AAAA,YACV;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,QACA,qBAAC,OAAI,EAAA,WAAU,gCACb,UAAA;AAAA,UAAA;AAAA,YAAC,MAAM;AAAA,YAAN;AAAA,cACC,aAAY;AAAA,cACZ,MAAM;AAAA,cACN;AAAA,cACA;AAAA,cACA;AAAA,cACC,GAAG;AAAA,YAAA;AAAA,UACN;AAAA,UACA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,SAAS;AAAA,cACT;AAAA,cACC,UAAA;AAAA,YAAA;AAAA,UACH;AAAA,QAAA,GACF;AAAA,QACA,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/PasswordField/hook.tsx","../../../lib/components/form/PasswordField/index.tsx"],"sourcesContent":["import { useState } from 'react'\n\nexport const usePasswordField = () => {\n  const [showPassword, setShowPassword] = useState<boolean>(false)\n  const fieldType = showPassword ? 'text' : 'password'\n  const textButton = showPassword ? 'ocultar' : 'mostrar'\n\n  function changeVisibility() {\n    setShowPassword((prevState) => !prevState)\n  }\n\n  return {\n    fieldType,\n    textButton,\n    changeVisibility,\n  }\n}\n","import Field from '../Field'\nimport { usePasswordField } from './hook'\nimport './styles.scss'\n\ntype PasswordFieldProps = React.InputHTMLAttributes<HTMLInputElement> & {\n  type?: 'password'\n  optional?: boolean\n  requiredInput?: boolean\n  success?: boolean\n  error?: boolean\n  errorMessage?: string\n  label?: string\n  inputRef?: React.RefObject<HTMLInputElement>\n}\n\nexport const PasswordField = ({\n  optional,\n  requiredInput,\n  success,\n  error,\n  errorMessage,\n  label,\n  inputRef,\n  id,\n  disabled,\n  style,\n  className,\n  ...props\n}: PasswordFieldProps) => {\n  const { fieldType, textButton, changeVisibility } = usePasswordField()\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={requiredInput}\n        optional={optional}\n        success={success}\n        error={error}\n        disabled={disabled}\n      />\n      <div className=\"au-password-field__container\">\n        <Field.Input\n          customclass=\"au-password-field__input\"\n          type={fieldType}\n          id={id}\n          inputRef={inputRef}\n          disabled={disabled}\n          {...props}\n        />\n        <button\n          className=\"au-password-field__btn\"\n          onClick={changeVisibility}\n          disabled={disabled}>\n          {textButton}\n        </button>\n      </div>\n      <Field.ErrorMessage hasError={!!error} message={errorMessage} />\n    </Field.Root>\n  )\n}\n"],"names":[],"mappings":";;;;AAEO,MAAM,mBAAmB,MAAM;AACpC,QAAM,CAAC,cAAc,eAAe,IAAI,SAAkB,KAAK;AACzD,QAAA,YAAY,eAAe,SAAS;AACpC,QAAA,aAAa,eAAe,YAAY;AAE9C,WAAS,mBAAmB;AACV,oBAAA,CAAC,cAAc,CAAC,SAAS;AAAA,EAC3C;AAEO,SAAA;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;ACDO,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,GAAG;AACL,MAA0B;AACxB,QAAM,EAAE,WAAW,YAAY,qBAAqB,iBAAiB;AAGnE,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,UAAU;AAAA,YACV;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QACF;AAAA,QACA,qBAAC,OAAI,EAAA,WAAU,gCACb,UAAA;AAAA,UAAA;AAAA,YAAC,MAAM;AAAA,YAAN;AAAA,cACC,aAAY;AAAA,cACZ,MAAM;AAAA,cACN;AAAA,cACA;AAAA,cACA;AAAA,cACC,GAAG;AAAA,YAAA;AAAA,UACN;AAAA,UACA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAU;AAAA,cACV,SAAS;AAAA,cACT;AAAA,cACC,UAAA;AAAA,YAAA;AAAA,UACH;AAAA,QAAA,GACF;AAAA,QACA,oBAAC,MAAM,cAAN,EAAmB,UAAU,CAAC,CAAC,OAAO,SAAS,cAAc;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpE;"}

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

@@ -0,0 +1,24 @@
+import { useRef, useEffect } from "react";
+import $iETbY$reactdom from "react-dom";
+const Portal = ({ children, portalId = "au-portal" }) => {
+  const portalDoor = useRef(document.createElement("div"));
+  useEffect(() => {
+    let portalRoot = document.getElementById(portalId);
+    if (!portalRoot) {
+      portalRoot = document.createElement("div");
+      portalRoot.setAttribute("id", portalId);
+      document.body.appendChild(portalRoot);
+    }
+    portalRoot.appendChild(portalDoor.current);
+    return () => {
+      if (portalRoot) {
+        portalRoot.removeChild(portalDoor.current);
+      }
+    };
+  }, [portalId]);
+  return $iETbY$reactdom.createPortal(children, portalDoor.current);
+};
+export {
+  Portal
+};
+//# sourceMappingURL=index.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/misc/Portal/index.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport ReactDOM from 'react-dom'\n\n/**\n * A helper component designed to address z-index conflicts within modals and dialogs.\n * This component ensures that the element remains fixed in its position, unaffected by other elements\n * possessing higher z-index values further up the DOM tree.\n */\n\ntype PortalProps = {\n  /** The children to be rendered into the `Portal`. */\n  children: React.ReactNode\n  /** The id of the DOM node into which the `Portal` will render. */\n  portalId?: string\n}\n\nexport const Portal = ({ children, portalId = 'au-portal' }: PortalProps) => {\n  const portalDoor = useRef(document.createElement('div'))\n\n  useEffect(() => {\n    let portalRoot = document.getElementById(portalId)\n    if (!portalRoot) {\n      portalRoot = document.createElement('div')\n      portalRoot.setAttribute('id', portalId)\n      document.body.appendChild(portalRoot)\n    }\n\n    portalRoot.appendChild(portalDoor.current)\n\n    return () => {\n      if (portalRoot) {\n        portalRoot.removeChild(portalDoor.current)\n      }\n    }\n  }, [portalId])\n\n  return ReactDOM.createPortal(children, portalDoor.current)\n}\n"],"names":["ReactDOM"],"mappings":";;AAgBO,MAAM,SAAS,CAAC,EAAE,UAAU,WAAW,kBAA+B;AAC3E,QAAM,aAAa,OAAO,SAAS,cAAc,KAAK,CAAC;AAEvD,YAAU,MAAM;AACV,QAAA,aAAa,SAAS,eAAe,QAAQ;AACjD,QAAI,CAAC,YAAY;AACF,mBAAA,SAAS,cAAc,KAAK;AAC9B,iBAAA,aAAa,MAAM,QAAQ;AAC7B,eAAA,KAAK,YAAY,UAAU;AAAA,IACtC;AAEW,eAAA,YAAY,WAAW,OAAO;AAEzC,WAAO,MAAM;AACX,UAAI,YAAY;AACH,mBAAA,YAAY,WAAW,OAAO;AAAA,MAC3C;AAAA,IAAA;AAAA,EACF,GACC,CAAC,QAAQ,CAAC;AAEb,SAAOA,gBAAS,aAAa,UAAU,WAAW,OAAO;AAC3D;"}

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

@@ -0,0 +1,24 @@
+import { jsx, Fragment } from "react/jsx-runtime";
+import { a as above } from "../../screen-DfYo7XQ_.js";
+import { ah as BREAKPOINT_MD } from "../../tokens-ijn4TwAB.js";
+import "../../index-CweZ_OcN.js";
+import "../Icon/index.es.js";
+import '../styles/styles3.css';import '../styles/styles5.css';import '../styles/styles4.css';import '../styles/styles2.css';import '../styles/styles.css';/* empty css                    */
+/* empty css                    */
+import "../Header/index.es.js";
+import "react";
+import "../NavbarVertical/index.es.js";
+import "../Text/index.es.js";
+/* empty css                    */
+/* empty css                    */
+/* empty css                    */
+import { Portal } from "../Portal/index.es.js";
+const PortalHolder = ({ withPortal, children }) => {
+  const shouldUsePortal = !above(BREAKPOINT_MD) && withPortal;
+  if (shouldUsePortal) return /* @__PURE__ */ jsx(Portal, { children });
+  return /* @__PURE__ */ jsx(Fragment, { children });
+};
+export {
+  PortalHolder
+};
+//# sourceMappingURL=index.es.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Datepicker/PortalHolder/index.tsx"],"sourcesContent":["import { above } from '../../../../core/utils/screen'\nimport { BREAKPOINT_MD } from '../../../../main'\nimport { Portal } from '../../../misc/Portal'\n\ntype PortalHolderProps = {\n  withPortal?: boolean\n  children: React.ReactNode\n}\n\nexport const PortalHolder = ({ withPortal, children }: PortalHolderProps) => {\n  const shouldUsePortal = !above(BREAKPOINT_MD) && withPortal\n\n  if (shouldUsePortal) return <Portal>{children}</Portal>\n\n  return <>{children}</>\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AASO,MAAM,eAAe,CAAC,EAAE,YAAY,eAAkC;AAC3E,QAAM,kBAAkB,CAAC,MAAM,aAAa,KAAK;AAEjD,MAAI,gBAAiB,QAAQ,oBAAA,QAAA,EAAQ,SAAS,CAAA;AAE9C,yCAAU,SAAS,CAAA;AACrB;"}