@consumidor-positivo/aurora 0.0.62 → 0.0.63

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/dist/components/Calendar/index.es.js +2 -2
  2. package/dist/components/CalendarHeader/index.es.js +1 -1
  3. package/dist/components/CheckboxField/index.es.js +1 -1
  4. package/dist/components/Datepicker/index.es.js +1 -1
  5. package/dist/components/Field/index.es.js +26 -83
  6. package/dist/components/Field/index.es.js.map +1 -1
  7. package/dist/components/Field/styles.css +1 -1
  8. package/dist/components/Group/index.es.js +58 -0
  9. package/dist/components/Group/index.es.js.map +1 -0
  10. package/dist/components/Group/styles.css +1 -0
  11. package/dist/components/InputField/index.es.js +1 -1
  12. package/dist/components/PasswordField/index.es.js +1 -1
  13. package/dist/components/Radio/index.es.js +14 -0
  14. package/dist/components/Radio/index.es.js.map +1 -0
  15. package/dist/components/SelectField/index.es.js +1 -1
  16. package/dist/components/TokenField/index.es.js +1 -1
  17. package/dist/components/form/Radio/Field/index.d.ts +3 -0
  18. package/dist/components/form/Radio/Group/index.d.ts +3 -0
  19. package/dist/components/form/Radio/index.d.ts +8 -0
  20. package/dist/components/form/Radio/types.d.ts +19 -0
  21. package/dist/components/index/styles3.css +1 -1
  22. package/dist/components/index/styles4.css +1 -0
  23. package/dist/{index-olB3e5l9.js → index-DhUJjrgP.js} +2 -2
  24. package/dist/{index-olB3e5l9.js.map → index-DhUJjrgP.js.map} +1 -1
  25. package/dist/{index-DVoyQGyf.js → index-lcJ0CoDo.js} +2 -2
  26. package/dist/{index-DVoyQGyf.js.map → index-lcJ0CoDo.js.map} +1 -1
  27. package/dist/index-sLk4K3iM.js +92 -0
  28. package/dist/index-sLk4K3iM.js.map +1 -0
  29. package/dist/main.d.ts +1 -0
  30. package/dist/main.es.js +2 -0
  31. package/dist/main.es.js.map +1 -1
  32. package/package.json +1 -1
@@ -1,9 +1,9 @@
1
1
  import "react/jsx-runtime";
2
2
  import "../../index-CweZ_OcN.js";
3
- import "../../index-olB3e5l9.js";
3
+ import "../../index-DhUJjrgP.js";
4
4
  import "../Button/index.es.js";
5
5
  import "../PortalHolder/index.es.js";
6
- import { a } from "../../index-DVoyQGyf.js";
6
+ import { a } from "../../index-lcJ0CoDo.js";
7
7
  export {
8
8
  a as DatepickerCalendar
9
9
  };
@@ -4,7 +4,7 @@ import "../Icon/index.es.js";
4
4
  import "../icons/IconChevronLeft/index.es.js";
5
5
  import "../icons/IconChevronRight/index.es.js";
6
6
  import "../../index-BnnDZOqb.js";
7
- import { C } from "../../index-olB3e5l9.js";
7
+ import { C } from "../../index-DhUJjrgP.js";
8
8
  export {
9
9
  C as CalendarHeader
10
10
  };
@@ -2,7 +2,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import { c as classNames } from "../../index-CweZ_OcN.js";
3
3
  import "../Icon/index.es.js";
4
4
  import { IconCheck } from "../icons/IconCheck/index.es.js";
5
- import Field from "../Field/index.es.js";
5
+ import { F as Field } from "../../index-sLk4K3iM.js";
6
6
  import { k as COLOR_NEUTRAL_00 } from "../../tokens-TYOJv1j5.js";
7
7
  import './styles.css';const CheckboxField = ({
8
8
  label,
@@ -3,7 +3,7 @@ import "../../index-CweZ_OcN.js";
3
3
  import "../Icon/index.es.js";
4
4
  import { IconCalendar } from "../icons/IconCalendar/index.es.js";
5
5
  import { InputField } from "../InputField/index.es.js";
6
- import { g as getDefaultDate, D as DDMMYYYY, a as DatepickerCalendar, A as AUCalendarDate } from "../../index-DVoyQGyf.js";
6
+ import { g as getDefaultDate, D as DDMMYYYY, a as DatepickerCalendar, A as AUCalendarDate } from "../../index-lcJ0CoDo.js";
7
7
  import { useRef, useState, useEffect } from "react";
8
8
  import { u as useOutsideClick } from "../../index-BnnDZOqb.js";
9
9
  import { B as BREAKPOINT_MD, g as COLOR_NEUTRAL_40 } from "../../tokens-TYOJv1j5.js";
@@ -1,92 +1,35 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
2
  import { c as classNames } from "../../index-CweZ_OcN.js";
3
- import "../Icon/index.es.js";
4
- import { IconAlertCircle } from "../icons/IconAlertCircle/index.es.js";
5
- import { IconCheck } from "../icons/IconCheck/index.es.js";
6
- import { IconSlash } from "../icons/IconSlash/index.es.js";
7
- import { H as COLOR_SUCCESS_50, O as COLOR_ERROR_50, g as COLOR_NEUTRAL_40 } from "../../tokens-TYOJv1j5.js";
8
- import './styles.css';const FieldErrorMessage = ({ hasError, message }) => {
9
- if (!hasError || !message) return null;
10
- return /* @__PURE__ */ jsx("p", { className: "au-field__error-message", children: message });
11
- };
12
- const FieldInput = ({
13
- inputRef,
14
- customclass,
15
- ...props
16
- }) => {
17
- const inputClasses = classNames("au-field__input", customclass);
18
- return /* @__PURE__ */ jsx("input", { className: inputClasses, ref: inputRef, ...props });
19
- };
20
- const FieldInputHolder = ({
21
- children,
22
- rightSideSlot
23
- }) => {
24
- return /* @__PURE__ */ jsxs("div", { className: "au-field__input-holder", children: [
25
- children,
26
- rightSideSlot && /* @__PURE__ */ jsx("div", { className: "au-field__right-slot", children: rightSideSlot })
27
- ] });
28
- };
29
- const FieldLabel = ({
30
- id,
31
- text,
32
- required,
33
- optional,
34
- success,
3
+ import './styles.css';const RadioField = ({
4
+ type = "radio",
5
+ direction = "left",
6
+ label,
35
7
  error,
36
- disabled
37
- }) => {
38
- if (!text) return null;
39
- const states = [
40
- { state: "optional", value: !!optional, icon: /* @__PURE__ */ jsx("span", { children: "(Opcional)" }) },
41
- {
42
- state: "success",
43
- value: !!success,
44
- icon: /* @__PURE__ */ jsx(IconCheck, { rawColor: COLOR_SUCCESS_50 })
45
- },
46
- {
47
- state: "error",
48
- value: !!error,
49
- icon: /* @__PURE__ */ jsx(IconAlertCircle, { rawColor: COLOR_ERROR_50 })
50
- },
51
- {
52
- state: "disabled",
53
- value: !!disabled,
54
- icon: /* @__PURE__ */ jsx(IconSlash, { rawColor: COLOR_NEUTRAL_40 })
55
- }
56
- ];
57
- const currentState = states.find(({ value }) => !!value);
58
- return /* @__PURE__ */ jsxs("div", { className: "au-field__header", children: [
59
- /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "au-field__header-label", children: [
60
- text,
61
- " ",
62
- required && /* @__PURE__ */ jsx("strong", { className: "au-field__header-label--required", children: "*" })
63
- ] }),
64
- /* @__PURE__ */ jsx("div", { className: "au-field__header-icon", children: currentState == null ? void 0 : currentState.icon })
65
- ] });
66
- };
67
- const FieldRoot = ({
68
- children,
8
+ id,
69
9
  disabled,
70
- success,
71
- error,
72
- style,
73
- customclass
10
+ ...props
74
11
  }) => {
75
- const inputClasses = classNames("au-field", customclass, {
76
- "au-field--disabled": !!disabled,
77
- "au-field--success": !!success,
78
- "au-field--error": !!error
12
+ const radioClasses = classNames("au-radio-field", {
13
+ "au-radio-field--left-direction": direction === "left",
14
+ "au-radio-field--right-direction": direction === "right",
15
+ "au-radio-field--disabled": !!disabled,
16
+ "au-radio-field--error": !!error
79
17
  });
80
- return /* @__PURE__ */ jsx("div", { className: inputClasses, style, children });
81
- };
82
- const Field = {
83
- Root: FieldRoot,
84
- Input: FieldInput,
85
- InputHolder: FieldInputHolder,
86
- Label: FieldLabel,
87
- ErrorMessage: FieldErrorMessage
18
+ return /* @__PURE__ */ jsxs("div", { className: radioClasses, children: [
19
+ /* @__PURE__ */ jsx(
20
+ "input",
21
+ {
22
+ className: "au-radio-field__input",
23
+ type,
24
+ id,
25
+ disabled,
26
+ ...props
27
+ }
28
+ ),
29
+ /* @__PURE__ */ jsx("label", { className: "au-radio-field__label", htmlFor: id, children: label })
30
+ ] });
88
31
  };
89
32
  export {
90
- Field as default
33
+ RadioField
91
34
  };
92
35
  //# sourceMappingURL=index.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Field/ErrorMessage.tsx","../../../lib/components/form/Field/Input.tsx","../../../lib/components/form/Field/InputHolder.tsx","../../../lib/components/form/Field/Label.tsx","../../../lib/components/form/Field/Root.tsx","../../../lib/components/form/Field/index.tsx"],"sourcesContent":["type ErrorMessageProps = {\n hasError?: boolean\n message?: string\n}\n\nexport const FieldErrorMessage = ({ hasError, message }: ErrorMessageProps) => {\n if (!hasError || !message) return null\n\n return <p className=\"au-field__error-message\">{message}</p>\n}\n","import classNames from 'classnames'\n\ntype FieldInputProps = React.InputHTMLAttributes<HTMLInputElement> & {\n inputRef?: React.RefObject<HTMLInputElement>\n customclass?: string\n}\n\nexport const FieldInput = ({\n inputRef,\n customclass,\n ...props\n}: FieldInputProps) => {\n const inputClasses = classNames('au-field__input', customclass)\n\n return <input className={inputClasses} ref={inputRef} {...props} />\n}\n","import React from 'react'\n\ntype FieldInputHolderProps = {\n children?: React.ReactNode\n rightSideSlot?: React.ReactNode\n}\n\nexport const FieldInputHolder = ({\n children,\n rightSideSlot,\n}: FieldInputHolderProps) => {\n return (\n <div className=\"au-field__input-holder\">\n {children}\n {rightSideSlot && (\n <div className=\"au-field__right-slot\">{rightSideSlot}</div>\n )}\n </div>\n )\n}\n","import { IconAlertCircle, IconCheck, IconSlash } from '@components/icons'\nimport {\n COLOR_ERROR_50,\n COLOR_NEUTRAL_40,\n COLOR_SUCCESS_50,\n} from '@core/tokens'\n\ntype FieldLabelProps = {\n id?: string\n text?: string\n required?: boolean\n optional?: boolean\n success?: boolean\n error?: boolean\n disabled?: boolean\n}\n\nexport const FieldLabel = ({\n id,\n text,\n required,\n optional,\n success,\n error,\n disabled,\n}: FieldLabelProps) => {\n if (!text) return null\n\n const states = [\n { state: 'optional', value: !!optional, icon: <span>(Opcional)</span> },\n {\n state: 'success',\n value: !!success,\n icon: <IconCheck rawColor={COLOR_SUCCESS_50} />,\n },\n {\n state: 'error',\n value: !!error,\n icon: <IconAlertCircle rawColor={COLOR_ERROR_50} />,\n },\n {\n state: 'disabled',\n value: !!disabled,\n icon: <IconSlash rawColor={COLOR_NEUTRAL_40} />,\n },\n ]\n\n const currentState = states.find(({ value }) => !!value)\n\n return (\n <div className=\"au-field__header\">\n <label htmlFor={id} className=\"au-field__header-label\">\n {text}{' '}\n {required && (\n <strong className=\"au-field__header-label--required\">*</strong>\n )}\n </label>\n <div className=\"au-field__header-icon\">{currentState?.icon}</div>\n </div>\n )\n}\n","import classNames from 'classnames'\n\ntype FieldRootProps = {\n children: React.ReactNode\n disabled?: boolean\n success?: boolean\n error?: boolean\n style?: React.CSSProperties\n customclass?: string\n}\n\nexport const FieldRoot = ({\n children,\n disabled,\n success,\n error,\n style,\n customclass,\n}: FieldRootProps) => {\n const inputClasses = classNames('au-field', customclass, {\n 'au-field--disabled': !!disabled,\n 'au-field--success': !!success,\n 'au-field--error': !!error,\n })\n\n return (\n <div className={inputClasses} style={style}>\n {children}\n </div>\n )\n}\n","import { FieldErrorMessage } from './ErrorMessage'\nimport { FieldInput } from './Input'\nimport { FieldInputHolder } from './InputHolder'\nimport { FieldLabel } from './Label'\nimport { FieldRoot } from './Root'\nimport './styles.scss'\n\nexport default {\n Root: FieldRoot,\n Input: FieldInput,\n InputHolder: FieldInputHolder,\n Label: FieldLabel,\n ErrorMessage: FieldErrorMessage,\n}"],"names":[],"mappings":";;;;;;;AAKO,MAAM,oBAAoB,CAAC,EAAE,UAAU,cAAiC;AAC7E,MAAI,CAAC,YAAY,CAAC,QAAgB,QAAA;AAElC,SAAQ,oBAAA,KAAA,EAAE,WAAU,2BAA2B,UAAQ,QAAA,CAAA;AACzD;ACFO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAuB;AACf,QAAA,eAAe,WAAW,mBAAmB,WAAW;AAE9D,6BAAQ,SAAM,EAAA,WAAW,cAAc,KAAK,UAAW,GAAG,MAAO,CAAA;AACnE;ACRO,MAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA;AACF,MAA6B;AAEzB,SAAA,qBAAC,OAAI,EAAA,WAAU,0BACZ,UAAA;AAAA,IAAA;AAAA,IACA,iBACC,oBAAC,OAAI,EAAA,WAAU,wBAAwB,UAAc,eAAA;AAAA,EAEzD,EAAA,CAAA;AAEJ;ACFO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAuB;AACjB,MAAA,CAAC,KAAa,QAAA;AAElB,QAAM,SAAS;AAAA,IACb,EAAE,OAAO,YAAY,OAAO,CAAC,CAAC,UAAU,MAAM,oBAAC,QAAK,EAAA,UAAA,aAAU,CAAA,EAAQ;AAAA,IACtE;AAAA,MACE,OAAO;AAAA,MACP,OAAO,CAAC,CAAC;AAAA,MACT,MAAM,oBAAC,WAAU,EAAA,UAAU,iBAAkB,CAAA;AAAA,IAC/C;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,OAAO,CAAC,CAAC;AAAA,MACT,MAAM,oBAAC,iBAAgB,EAAA,UAAU,eAAgB,CAAA;AAAA,IACnD;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,OAAO,CAAC,CAAC;AAAA,MACT,MAAM,oBAAC,WAAU,EAAA,UAAU,iBAAkB,CAAA;AAAA,IAC/C;AAAA,EAAA;AAGI,QAAA,eAAe,OAAO,KAAK,CAAC,EAAE,YAAY,CAAC,CAAC,KAAK;AAGrD,SAAA,qBAAC,OAAI,EAAA,WAAU,oBACb,UAAA;AAAA,IAAA,qBAAC,SAAM,EAAA,SAAS,IAAI,WAAU,0BAC3B,UAAA;AAAA,MAAA;AAAA,MAAM;AAAA,MACN,YACC,oBAAC,UAAO,EAAA,WAAU,oCAAmC,UAAC,KAAA;AAAA,IAAA,GAE1D;AAAA,IACC,oBAAA,OAAA,EAAI,WAAU,yBAAyB,uDAAc,MAAK;AAAA,EAC7D,EAAA,CAAA;AAEJ;ACjDO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAsB;AACd,QAAA,eAAe,WAAW,YAAY,aAAa;AAAA,IACvD,sBAAsB,CAAC,CAAC;AAAA,IACxB,qBAAqB,CAAC,CAAC;AAAA,IACvB,mBAAmB,CAAC,CAAC;AAAA,EAAA,CACtB;AAED,SACG,oBAAA,OAAA,EAAI,WAAW,cAAc,OAC3B,SACH,CAAA;AAEJ;ACvBA,MAAe,QAAA;AAAA,EACX,MAAM;AAAA,EACN,OAAO;AAAA,EACP,aAAa;AAAA,EACb,OAAO;AAAA,EACP,cAAc;AAClB;"}
1
+ {"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Radio/Field/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport { RadioFieldProps } from '../types'\nimport './styles.scss'\n\nexport const RadioField = ({\n type = 'radio',\n direction = 'left',\n label,\n error,\n id,\n disabled,\n ...props\n}: RadioFieldProps) => {\n const radioClasses = classNames('au-radio-field', {\n 'au-radio-field--left-direction': direction === 'left',\n 'au-radio-field--right-direction': direction === 'right',\n 'au-radio-field--disabled': !!disabled,\n 'au-radio-field--error': !!error,\n })\n \n return (\n <div className={radioClasses}>\n <input\n className=\"au-radio-field__input\"\n type={type}\n id={id}\n disabled={disabled}\n {...props}\n />\n <label className=\"au-radio-field__label\" htmlFor={id}>\n {label}\n </label>\n </div>\n )\n}\n"],"names":[],"mappings":";;AAIO,MAAM,aAAa,CAAC;AAAA,EACzB,OAAO;AAAA,EACP,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAuB;AACf,QAAA,eAAe,WAAW,kBAAkB;AAAA,IAChD,kCAAkC,cAAc;AAAA,IAChD,mCAAmC,cAAc;AAAA,IACjD,4BAA4B,CAAC,CAAC;AAAA,IAC9B,yBAAyB,CAAC,CAAC;AAAA,EAAA,CAC5B;AAGC,SAAA,qBAAC,OAAI,EAAA,WAAW,cACd,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV;AAAA,QACA;AAAA,QACA;AAAA,QACC,GAAG;AAAA,MAAA;AAAA,IACN;AAAA,wBACC,SAAM,EAAA,WAAU,yBAAwB,SAAS,IAC/C,UACH,OAAA;AAAA,EACF,EAAA,CAAA;AAEJ;"}
@@ -1 +1 @@
1
- .au-field{cursor:pointer;border-radius:8px}.au-field__input-holder{position:relative;height:56px}.au-field__input{background-color:#fff;border:1px solid #454a54;border-radius:8px;box-sizing:border-box;font-family:inherit;font-size:16px;line-height:22px;padding:16px;height:56px;width:100%}.au-field__input:hover{border:1px solid #16181d}.au-field__input:focus{border-color:#0048db;outline:1px solid #0048db}.au-field:focus-within:not(.au-field--error) .au-field__header-label{color:#0048db}.au-field__header{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px}.au-field__header-label{color:#454a54;cursor:pointer;font-size:14px;font-weight:600}.au-field__header-label--required{color:#991717}.au-field__header-icon span{font-size:14px;color:#454a54}.au-field__right-slot{position:absolute;right:16px;top:50%;transform:translateY(-50%)}.au-field__error-message{color:#991717;font-size:16px;font-weight:400;line-height:24px;padding-top:8px}.au-field--disabled{cursor:not-allowed}.au-field--disabled .au-field__input{background-color:#e2e4e9;border-color:#5e6573;color:#5e6573;cursor:not-allowed}.au-field--disabled .au-field__header-label{color:#5e6573;cursor:not-allowed}.au-field--error .au-field__input{background-color:#f5eff0;border-color:#991717}.au-field--error .au-field__input:focus{border-color:#0048db}.au-field--error .au-field__header-label{color:#991717}.au-field--success .au-field__input{animation:inputSuccess 2s forwards}.au-field--success .au-field__header-label{animation:labelSuccess 2s forwards}.au-field--success .au-field__header-icon .au-icon{animation:iconSucess 2s forwards}@keyframes inputSuccess{0%,70%{background-color:#f0fcf5;border-color:#10593b}}@keyframes labelSuccess{0%,70%{color:#10593b}}@keyframes iconSucess{0%,70%{opacity:1}to{opacity:0}}
1
+ .au-radio-field{cursor:pointer;display:flex;align-items:center;gap:8px;width:max-content}.au-radio-field--left-direction{flex-direction:row}.au-radio-field--right-direction{flex-direction:row-reverse}.au-radio-field__input{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:50%;cursor:pointer;position:relative;height:24px;width:24px}.au-radio-field__input:after,.au-radio-field__input:before{content:"";border-radius:50%;position:absolute}.au-radio-field__input:after{background-color:#454a54;content:"";height:10px;width:10px;left:7px;top:7px;transform:scale(0);transform-origin:center;transition:transform .2s}.au-radio-field__input:before{content:"";border:2px solid #454a54;height:24px;width:24px}.au-radio-field__input:checked:before{border-color:#0048db;background-color:#0048db;transition:all .2s ease}.au-radio-field__input:checked:after{background-color:#fff;transform:scale(1)}.au-radio-field__input:focus{box-shadow:0 0 0 1px #fff,0 0 0 3px #0048db}.au-radio-field__input:hover:not(:focus){background-color:#f2f5fc;outline:2px solid #F2F5FC}.au-radio-field__label{color:#454a54;font-size:16px;line-height:24px}.au-radio-field--disabled,.au-radio-field--disabled .au-radio-field__input{cursor:not-allowed}.au-radio-field--disabled .au-radio-field__input:before{border-color:#c4c9d4}.au-radio-field--disabled .au-radio-field__input:checked:before{background-color:#c4c9d4}.au-radio-field--disabled .au-radio-field__label{cursor:not-allowed;color:#c4c9d4}.au-radio-field--error .au-radio-field__input:before{border:2px solid #991717}.au-radio-field--error .au-radio-field__input:checked:before{border-color:#0048db}
@@ -0,0 +1,58 @@
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
+ import { c as classNames } from "../../index-CweZ_OcN.js";
3
+ import { F as Field } from "../../index-sLk4K3iM.js";
4
+ import { Conditional } from "../Conditional/index.es.js";
5
+ import { Text } from "../Text/index.es.js";
6
+ import $dbSRa$react__default, { useState } from "react";
7
+ import { RadioField } from "../Field/index.es.js";
8
+ import './styles.css';const RadioGroup = ({
9
+ name = "",
10
+ defaultValue,
11
+ orientation = "vertical",
12
+ label,
13
+ error,
14
+ errorMessage,
15
+ children,
16
+ onChange,
17
+ onFocus
18
+ }) => {
19
+ const groupClass = classNames("au-radio-group", {
20
+ "au-radio-group--horizontal": orientation === "horizontal"
21
+ });
22
+ const getSafeName = (name2) => {
23
+ return name2 ? name2 : `au-radio-group-${Math.random()}`;
24
+ };
25
+ const [safeName] = useState(getSafeName(name));
26
+ const childrenWithProps = $dbSRa$react__default.Children.map(children, (child) => {
27
+ if ($dbSRa$react__default.isValidElement(child)) {
28
+ const childProps = child.props;
29
+ return /* @__PURE__ */ jsx(
30
+ RadioField,
31
+ {
32
+ name: safeName,
33
+ error,
34
+ defaultChecked: defaultValue === childProps.value,
35
+ onChange,
36
+ onFocus,
37
+ ...child.props
38
+ }
39
+ );
40
+ }
41
+ return child;
42
+ });
43
+ return /* @__PURE__ */ jsxs("div", { className: groupClass, children: [
44
+ /* @__PURE__ */ jsx(
45
+ Conditional,
46
+ {
47
+ condition: !!label,
48
+ renderIf: /* @__PURE__ */ jsx(Text, { variant: "body-medium", weight: "semibold", children: label })
49
+ }
50
+ ),
51
+ /* @__PURE__ */ jsx("div", { className: "au-radio-group__fields", children: childrenWithProps }),
52
+ /* @__PURE__ */ jsx(Field.ErrorMessage, { hasError: !!error, message: errorMessage })
53
+ ] });
54
+ };
55
+ export {
56
+ RadioGroup
57
+ };
58
+ //# sourceMappingURL=index.es.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Radio/Group/index.tsx"],"sourcesContent":["import classNames from 'classnames'\nimport './styles.scss'\nimport Field from '@components/form/Field'\nimport { Conditional } from '@components/misc'\nimport { Text } from '@components/Text'\nimport React, { useState } from 'react'\nimport { RadioField } from '../Field'\nimport { RadioFieldProps, RadioGroupProps } from '../types'\n\nexport const RadioGroup = ({\n name = '',\n defaultValue,\n orientation = 'vertical',\n label,\n error,\n errorMessage,\n children,\n onChange,\n onFocus,\n}: RadioGroupProps) => {\n const groupClass = classNames('au-radio-group', {\n 'au-radio-group--horizontal': orientation === 'horizontal',\n })\n\n const getSafeName = (name: string): string => {\n return name ? name : `au-radio-group-${Math.random()}`\n }\n\n const [safeName] = useState(getSafeName(name))\n\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n const childProps = child.props as RadioFieldProps\n\n return (\n <RadioField\n name={safeName}\n error={error}\n defaultChecked={defaultValue === childProps.value}\n onChange={onChange}\n onFocus={onFocus}\n {...child.props}\n />\n )\n }\n return child\n })\n\n return (\n <div className={groupClass}>\n <Conditional\n condition={!!label}\n renderIf={\n <Text variant=\"body-medium\" weight=\"semibold\">\n {label}\n </Text>\n }\n />\n <div className=\"au-radio-group__fields\">{childrenWithProps}</div>\n <Field.ErrorMessage hasError={!!error} message={errorMessage} />\n </div>\n )\n}\n"],"names":["name","React"],"mappings":";;;;;;;AASO,MAAM,aAAa,CAAC;AAAA,EACzB,OAAO;AAAA,EACP;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAuB;AACf,QAAA,aAAa,WAAW,kBAAkB;AAAA,IAC9C,8BAA8B,gBAAgB;AAAA,EAAA,CAC/C;AAEK,QAAA,cAAc,CAACA,UAAyB;AAC5C,WAAOA,QAAOA,QAAO,kBAAkB,KAAK,OAAQ,CAAA;AAAA,EAAA;AAGtD,QAAM,CAAC,QAAQ,IAAI,SAAS,YAAY,IAAI,CAAC;AAE7C,QAAM,oBAAoBC,sBAAM,SAAS,IAAI,UAAU,CAAC,UAAU;AAC5D,QAAAA,sBAAM,eAAe,KAAK,GAAG;AAC/B,YAAM,aAAa,MAAM;AAGvB,aAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN;AAAA,UACA,gBAAgB,iBAAiB,WAAW;AAAA,UAC5C;AAAA,UACA;AAAA,UACC,GAAG,MAAM;AAAA,QAAA;AAAA,MAAA;AAAA,IAGhB;AACO,WAAA;AAAA,EAAA,CACR;AAGC,SAAA,qBAAC,OAAI,EAAA,WAAW,YACd,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,CAAC,CAAC;AAAA,QACb,UACG,oBAAA,MAAA,EAAK,SAAQ,eAAc,QAAO,YAChC,UACH,OAAA;AAAA,MAAA;AAAA,IAEJ;AAAA,IACC,oBAAA,OAAA,EAAI,WAAU,0BAA0B,UAAkB,mBAAA;AAAA,IAC3D,oBAAC,MAAM,cAAN,EAAmB,UAAU,CAAC,CAAC,OAAO,SAAS,cAAc;AAAA,EAChE,EAAA,CAAA;AAEJ;"}
@@ -0,0 +1 @@
1
+ .au-radio-group,.au-radio-group__fields{display:flex;flex-direction:column;gap:16px}.au-radio-group--horizontal .au-radio-group__fields{flex-direction:row}
@@ -1,5 +1,5 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
- import Field from "../Field/index.es.js";
2
+ import { F as Field } from "../../index-sLk4K3iM.js";
3
3
  const InputField = ({
4
4
  optional,
5
5
  requiredInput,
@@ -1,5 +1,5 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
- import Field from "../Field/index.es.js";
2
+ import { F as Field } from "../../index-sLk4K3iM.js";
3
3
  import { useState } from "react";
4
4
  import './styles.css';const usePasswordField = () => {
5
5
  const [showPassword, setShowPassword] = useState(false);
@@ -0,0 +1,14 @@
1
+ import { RadioField } from "../Field/index.es.js";
2
+ import { RadioGroup } from "../Group/index.es.js";
3
+ const components = {
4
+ Field: RadioField,
5
+ Group: RadioGroup
6
+ };
7
+ Object.keys(components).forEach((key) => {
8
+ const component = components[key];
9
+ component.displayName = `Radio.${key}`;
10
+ });
11
+ export {
12
+ components as Radio
13
+ };
14
+ //# sourceMappingURL=index.es.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.es.js","sources":["../../../lib/components/form/Radio/index.tsx"],"sourcesContent":["import { RadioField } from './Field'\nimport { RadioGroup } from './Group'\nimport { RadioFieldProps, RadioGroupProps } from './types'\n\ntype Components = {\n Field: React.FC<RadioFieldProps>\n Group: React.FC<RadioGroupProps>\n}\n\nconst components: Components = {\n Field: RadioField,\n Group: RadioGroup,\n}\n\nObject.keys(components).forEach((key) => {\n const component = components[key as keyof Components]\n component.displayName = `Radio.${key}`\n})\n\nexport { components as Radio }\n"],"names":[],"mappings":";;AASA,MAAM,aAAyB;AAAA,EAC7B,OAAO;AAAA,EACP,OAAO;AACT;AAEA,OAAO,KAAK,UAAU,EAAE,QAAQ,CAAC,QAAQ;AACjC,QAAA,YAAY,WAAW,GAAuB;AAC1C,YAAA,cAAc,SAAS,GAAG;AACtC,CAAC;"}
@@ -4,7 +4,7 @@ import "../Icon/index.es.js";
4
4
  import { IconCheck } from "../icons/IconCheck/index.es.js";
5
5
  import { IconChevronDown } from "../icons/IconChevronDown/index.es.js";
6
6
  import { IconSlash } from "../icons/IconSlash/index.es.js";
7
- import Field from "../Field/index.es.js";
7
+ import { F as Field } from "../../index-sLk4K3iM.js";
8
8
  import { useState, useRef, useEffect } from "react";
9
9
  import './styles.css';const useSelectField = (options, initialValue, onChange, disabled, register, autocomplete = false) => {
10
10
  var _a;
@@ -1,5 +1,5 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
- import Field from "../Field/index.es.js";
2
+ import { F as Field } from "../../index-sLk4K3iM.js";
3
3
  import { useRef, useState, useEffect } from "react";
4
4
  import './styles.css';function inputtedValueIsValid(value) {
5
5
  const numberValue = Number(value);
@@ -0,0 +1,3 @@
1
+ import { RadioFieldProps } from '../types';
2
+
3
+ export declare const RadioField: ({ type, direction, label, error, id, disabled, ...props }: RadioFieldProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,3 @@
1
+ import { RadioGroupProps } from '../types';
2
+
3
+ export declare const RadioGroup: ({ name, defaultValue, orientation, label, error, errorMessage, children, onChange, onFocus, }: RadioGroupProps) => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,8 @@
1
+ import { RadioFieldProps, RadioGroupProps } from './types';
2
+
3
+ type Components = {
4
+ Field: React.FC<RadioFieldProps>;
5
+ Group: React.FC<RadioGroupProps>;
6
+ };
7
+ declare const components: Components;
8
+ export { components as Radio };
@@ -0,0 +1,19 @@
1
+ import { RadioField } from './Field';
2
+
3
+ export type RadioFieldProps = React.InputHTMLAttributes<HTMLInputElement> & {
4
+ direction?: 'left' | 'right';
5
+ label?: string;
6
+ error?: boolean;
7
+ type?: 'radio';
8
+ };
9
+ export type RadioGroupProps = {
10
+ children: React.ReactElement<typeof RadioField>[];
11
+ name?: string;
12
+ defaultValue?: string | number;
13
+ orientation?: 'horizontal' | 'vertical';
14
+ label?: string;
15
+ error?: boolean;
16
+ errorMessage?: string;
17
+ onChange?: React.ChangeEventHandler<HTMLInputElement>;
18
+ onFocus?: React.FocusEventHandler<HTMLInputElement>;
19
+ };
@@ -1 +1 @@
1
- .au-datepicker__header{display:flex;justify-content:space-between}.au-datepicker__header-segments{display:flex;gap:8px}.au-datepicker__header-navigation-btn{cursor:pointer;outline:none;background-color:transparent;border:none}
1
+ .au-field{cursor:pointer;border-radius:8px}.au-field__input-holder{position:relative;height:56px}.au-field__input{background-color:#fff;border:1px solid #454a54;border-radius:8px;box-sizing:border-box;font-family:inherit;font-size:16px;line-height:22px;padding:16px;height:56px;width:100%}.au-field__input:hover{border:1px solid #16181d}.au-field__input:focus{border-color:#0048db;outline:1px solid #0048db}.au-field:focus-within:not(.au-field--error) .au-field__header-label{color:#0048db}.au-field__header{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px}.au-field__header-label{color:#454a54;cursor:pointer;font-size:14px;font-weight:600}.au-field__header-label--required{color:#991717}.au-field__header-icon span{font-size:14px;color:#454a54}.au-field__right-slot{position:absolute;right:16px;top:50%;transform:translateY(-50%)}.au-field__error-message{color:#991717;font-size:16px;font-weight:400;line-height:24px;padding-top:8px}.au-field--disabled{cursor:not-allowed}.au-field--disabled .au-field__input{background-color:#e2e4e9;border-color:#5e6573;color:#5e6573;cursor:not-allowed}.au-field--disabled .au-field__header-label{color:#5e6573;cursor:not-allowed}.au-field--error .au-field__input{background-color:#f5eff0;border-color:#991717}.au-field--error .au-field__input:focus{border-color:#0048db}.au-field--error .au-field__header-label{color:#991717}.au-field--success .au-field__input{animation:inputSuccess 2s forwards}.au-field--success .au-field__header-label{animation:labelSuccess 2s forwards}.au-field--success .au-field__header-icon .au-icon{animation:iconSucess 2s forwards}@keyframes inputSuccess{0%,70%{background-color:#f0fcf5;border-color:#10593b}}@keyframes labelSuccess{0%,70%{color:#10593b}}@keyframes iconSucess{0%,70%{opacity:1}to{opacity:0}}
@@ -0,0 +1 @@
1
+ .au-datepicker__header{display:flex;justify-content:space-between}.au-datepicker__header-segments{display:flex;gap:8px}.au-datepicker__header-navigation-btn{cursor:pointer;outline:none;background-color:transparent;border:none}
@@ -11,7 +11,7 @@ createContext(null);
11
11
  createContext(null);
12
12
  createContext(null);
13
13
  createContext(null);
14
- import './components/index/styles3.css';const $4e85f108e88277b8$export$d688439359537581 = createContext({});
14
+ import './components/index/styles4.css';const $4e85f108e88277b8$export$d688439359537581 = createContext({});
15
15
  const $b5e257d569688ac6$var$defaultContext = {
16
16
  prefix: String(Math.round(Math.random() * 1e10)),
17
17
  current: 0
@@ -5686,4 +5686,4 @@ export {
5686
5686
  $dfd62f934fc76fed$export$e11f8ba65d857bff as e,
5687
5687
  $dfd62f934fc76fed$export$5d847498420df57b as f
5688
5688
  };
5689
- //# sourceMappingURL=index-olB3e5l9.js.map
5689
+ //# sourceMappingURL=index-DhUJjrgP.js.map