mitre-form-component 0.0.38 → 0.0.39

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.
package/dist/index.cjs CHANGED
@@ -85,7 +85,7 @@ var FormContainer = import_styled_components.default.div`
85
85
  overflow-x: hidden;
86
86
  overflow-y: auto;
87
87
 
88
- background: ${(props) => props.$backgroundColor || " #cecece"};
88
+ background: ${(props) => props.$backgroundColor || "var(--gray-180)"};
89
89
 
90
90
  padding: ${(props) => props.$innerPadding || "1rem"};
91
91
 
@@ -128,7 +128,6 @@ var Form = import_styled_components.default.form`
128
128
  }
129
129
 
130
130
  input {
131
- background: white;
132
131
  margin-bottom: 0.75rem;
133
132
  }
134
133
 
@@ -196,6 +195,7 @@ var GlobalStyles = import_styled_components2.createGlobalStyle`
196
195
  --gray-60: #8F8F8F;
197
196
  --gray-100: #B6B6B6;
198
197
  --gray-150: #B9B9B9;
198
+ --gray-180: #CECECE;
199
199
  --gray-200: #D2D2D2;
200
200
  --gray-300: #EBEBEB;
201
201
  --gray-400: #ECECEC;
@@ -208,6 +208,8 @@ var GlobalStyles = import_styled_components2.createGlobalStyle`
208
208
  --green:#57C06E;
209
209
  --green-2:#2DCE68;
210
210
  --blue:#007BFF;
211
+
212
+ --transparent: transparent;
211
213
  }
212
214
 
213
215
  * {
@@ -394,33 +396,33 @@ var Input = import_styled_components3.default.input`
394
396
  font-weight: 500;
395
397
  font-size: 1rem;
396
398
  line-height: 1.5rem;
397
- background: var(--gray-500);
398
- color: var(--black);
399
+ background: ${(props) => props.$backgroundColor || "var(--white)"};
400
+ color: ${(props) => props.$textColor || "var(--black)"};
399
401
  padding: 0.5rem;
400
402
  border-radius: 0.125rem;
401
- border: 1px solid transparent;
403
+ border: 1px solid ${(props) => props.$borderColor || "transparent"};
402
404
  display: block;
403
405
  height: 3.125rem;
404
406
  width: 100%;
405
407
 
406
408
  &:focus {
407
409
  border-radius: 0.125rem;
408
- border: 2px solid ${(props) => props.$bordercolor || "var(--yellow-500)"};
410
+ border: 2px solid ${(props) => props.$focusBorderColor || "var(--yellow-500)"};
409
411
  outline: none;
410
412
  }
411
413
 
412
414
  &::placeholder {
413
415
  font-size: 1rem;
414
416
  line-height: 1.5rem;
415
- color: #b6b6b6;
417
+ color: ${(props) => props.$placeholderColor || "var(--gray-100)"};
416
418
  font-weight: 800;
417
419
  }
418
420
 
419
421
  /* Autofill styles */
420
422
  &:-webkit-autofill {
421
- background: var(--gray-500) !important;
422
- color: var(--black) !important;
423
- -webkit-text-fill-color: var(--black) !important;
423
+ background: ${(props) => props.$backgroundColor || "var(--white)"} !important;
424
+ color: ${(props) => props.$textColor || "var(--black)"} !important;
425
+ -webkit-text-fill-color: ${(props) => props.$textColor || "var(--black)"} !important;
424
426
  transition: background-color 5000s ease-in-out 0s; /* Prevent flashing */
425
427
  }
426
428
 
@@ -466,7 +468,21 @@ var FormControl = import_styled_components3.default.div.withConfig({
466
468
 
467
469
  // src/components/Input/index.tsx
468
470
  var import_jsx_runtime = require("react/jsx-runtime");
469
- var InputBase = ({ id, label, error, showErrorMessage = true, borderColor, textColor, mask = "", type = "text", ...rest }, ref) => {
471
+ var InputBase = ({
472
+ id,
473
+ label,
474
+ error,
475
+ showErrorMessage = true,
476
+ labelTextColor,
477
+ backgroundColor,
478
+ borderColor,
479
+ focusBorderColor,
480
+ inputPlaceholderColor,
481
+ inputTextColor,
482
+ mask = "",
483
+ type = "text",
484
+ ...rest
485
+ }, ref) => {
470
486
  const handleKeyUp = (0, import_react3.useCallback)(
471
487
  (e) => {
472
488
  if (mask === "cep") cep(e);
@@ -477,16 +493,20 @@ var InputBase = ({ id, label, error, showErrorMessage = true, borderColor, textC
477
493
  [mask]
478
494
  );
479
495
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(FormControl, { isInvalid: !!error, children: [
480
- !!label && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FormLabel, { htmlFor: id, $textColor: textColor, children: label }),
496
+ !!label && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FormLabel, { htmlFor: id, $textColor: labelTextColor, children: label }),
481
497
  !mask ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
482
498
  Input,
483
499
  {
484
500
  id,
485
501
  ref,
486
502
  type,
487
- $bordercolor: borderColor,
488
503
  "aria-invalid": !!error && showErrorMessage ? "true" : "false",
489
504
  autoComplete: rest.autoComplete || "on",
505
+ $backgroundColor: backgroundColor,
506
+ $borderColor: borderColor,
507
+ $focusBorderColor: focusBorderColor,
508
+ $placeholderColor: inputPlaceholderColor,
509
+ $textColor: inputTextColor,
490
510
  ...rest
491
511
  }
492
512
  ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -495,10 +515,14 @@ var InputBase = ({ id, label, error, showErrorMessage = true, borderColor, textC
495
515
  id,
496
516
  ref,
497
517
  type,
498
- $bordercolor: borderColor,
499
518
  "aria-invalid": !!error && showErrorMessage ? "true" : "false",
500
- onKeyUp: handleKeyUp,
501
519
  autoComplete: rest.autoComplete || "on",
520
+ onKeyUp: handleKeyUp,
521
+ $backgroundColor: backgroundColor,
522
+ $borderColor: borderColor,
523
+ $focusBorderColor: focusBorderColor,
524
+ $placeholderColor: inputPlaceholderColor,
525
+ $textColor: inputTextColor,
502
526
  ...rest
503
527
  }
504
528
  ),
@@ -639,7 +663,7 @@ function Button2({
639
663
  isSubmitting = false,
640
664
  submittingMessage = "",
641
665
  disabled = false,
642
- color = "#2F2F2F",
666
+ color = "var(--black)",
643
667
  ...rest
644
668
  }) {
645
669
  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
@@ -814,13 +838,19 @@ var FormLabel2 = import_styled_components6.default.label`
814
838
  var StyledPhoneInput = (0, import_styled_components6.default)(import_react_international_phone.PhoneInput)`
815
839
  width: 100%;
816
840
  height: 3.125rem;
817
- background: var(--gray-500);
841
+ background: ${(props) => props.$backgroundColor || "var(--white)"};
818
842
  font-family: "Montserrat", sans-serif;
843
+ border: 1px solid ${(props) => props.$borderColor || "transparent"};
844
+ border-radius: 0.125rem;
819
845
 
820
846
  &:focus-within {
821
847
  border-radius: 0.125rem;
822
- border: 2px solid ${(props) => props.$bordercolor || "var(--yellow-500)"};
848
+ border: 2px solid ${(props) => props.$focusBorderColor || "var(--yellow-500)"};
823
849
  outline: none;
850
+
851
+ .react-international-phone-country-selector-button {
852
+ border-right: 1px solid ${(props) => props.$focusBorderColor || "var(--yellow-500)"};
853
+ }
824
854
  }
825
855
 
826
856
  /* Style for the inner phone input container */
@@ -833,14 +863,14 @@ var StyledPhoneInput = (0, import_styled_components6.default)(import_react_inter
833
863
  font-family: "Montserrat", sans-serif;
834
864
  font-size: 1rem;
835
865
  font-weight: 500;
836
- color: var(--black);
837
- background: var(--white);
866
+ color: ${(props) => props.$textColor || "var(--black)"};
867
+ background: ${(props) => props.$backgroundColor || "var(--white)"};
838
868
  }
839
869
 
840
870
  /* Style for the country selector button */
841
871
  .react-international-phone-country-selector-button {
842
872
  height: 100%;
843
- background: var(--white);
873
+ background: ${(props) => props.$backgroundColor || "var(--white)"};
844
874
  display: flex;
845
875
  align-items: center;
846
876
  justify-content: center;
@@ -850,7 +880,7 @@ var StyledPhoneInput = (0, import_styled_components6.default)(import_react_inter
850
880
  cursor: pointer;
851
881
  outline: none;
852
882
  border: none;
853
- border-right: 2px solid var(--gray-300);
883
+ border-right: 1px solid ${(props) => props.$borderColor || "var(--transparent)"};
854
884
  }
855
885
 
856
886
  /* Style for the input itself */
@@ -859,13 +889,13 @@ var StyledPhoneInput = (0, import_styled_components6.default)(import_react_inter
859
889
  height: 100%;
860
890
  padding: 0 0.5rem;
861
891
  margin: 0;
862
- background: var(--white);
892
+ background: ${(props) => props.$backgroundColor || "var(--white)"};
863
893
  font-family: "Montserrat", sans-serif;
864
894
  font-style: normal;
865
895
  font-weight: 500;
866
896
  font-size: 1rem;
867
897
  line-height: 1.5rem;
868
- color: var(--black);
898
+ color: ${(props) => props.$textColor || "var(--black)"};
869
899
  outline: none;
870
900
  border: none;
871
901
  border-radius: 0.125rem;
@@ -873,13 +903,13 @@ var StyledPhoneInput = (0, import_styled_components6.default)(import_react_inter
873
903
  &::placeholder {
874
904
  font-size: 1rem;
875
905
  line-height: 1.5rem;
876
- color: #b6b6b6;
906
+ color: ${(props) => props.$placeholderColor || "var(--gray-100)"};
877
907
  font-weight: 800;
878
908
  }
879
909
 
880
910
  &:-webkit-autofill {
881
- background: var(--gray-500) !important;
882
- -webkit-text-fill-color: var(--black) !important;
911
+ background: ${(props) => props.$backgroundColor || "var(--white)"} !important;
912
+ -webkit-text-fill-color: ${(props) => props.$textColor || "var(--black)"} !important;
883
913
  transition: background-color 5000s ease-in-out 0s;
884
914
  }
885
915
 
@@ -926,14 +956,33 @@ var FormControl2 = import_styled_components6.default.div.withConfig({
926
956
  }
927
957
  `};
928
958
  }
959
+
960
+ .react-international-phone-country-selector-button {
961
+ ${(props) => props.isInvalid && import_styled_components6.css`
962
+ border-right: 1px solid var(--red);
963
+ `};
964
+ }
929
965
  }
930
966
  `;
931
967
 
932
968
  // src/components/PhoneInput/index.tsx
933
969
  var import_jsx_runtime4 = require("react/jsx-runtime");
934
- var PhoneInputBase = ({ id, label, error, showErrorMessage = true, borderColor, textColor, value, ...rest }, ref) => {
970
+ var PhoneInputBase = ({
971
+ id,
972
+ label,
973
+ error,
974
+ showErrorMessage = true,
975
+ labelTextColor,
976
+ backgroundColor,
977
+ borderColor,
978
+ focusBorderColor,
979
+ inputPlaceholderColor,
980
+ inputTextColor,
981
+ value,
982
+ ...rest
983
+ }, ref) => {
935
984
  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(FormControl2, { isInvalid: !!error, children: [
936
- !!label && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FormLabel2, { htmlFor: id, $textColor: textColor, children: label }),
985
+ !!label && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FormLabel2, { htmlFor: id, $textColor: labelTextColor, children: label }),
937
986
  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
938
987
  StyledPhoneInput,
939
988
  {
@@ -942,7 +991,6 @@ var PhoneInputBase = ({ id, label, error, showErrorMessage = true, borderColor,
942
991
  disableCountryGuess: true,
943
992
  disableDialCodeAndPrefix: true,
944
993
  showDisabledDialCodeAndPrefix: false,
945
- $bordercolor: borderColor,
946
994
  placeholder: rest.placeholder,
947
995
  "aria-invalid": !!error && showErrorMessage ? "true" : "false",
948
996
  value: String(value),
@@ -961,7 +1009,12 @@ var PhoneInputBase = ({ id, label, error, showErrorMessage = true, borderColor,
961
1009
  required: rest.required,
962
1010
  autoFocus: rest.autoFocus,
963
1011
  autoComplete: rest.autoComplete || "tel"
964
- }
1012
+ },
1013
+ $backgroundColor: backgroundColor,
1014
+ $borderColor: borderColor,
1015
+ $focusBorderColor: focusBorderColor,
1016
+ $placeholderColor: inputPlaceholderColor,
1017
+ $textColor: inputTextColor
965
1018
  }
966
1019
  ),
967
1020
  !!error && showErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(FormErrorMessage2, { "data-testid": "error-message", children: typeof error === "string" ? error : error?.message })
@@ -1005,10 +1058,16 @@ var MitreFormComponent = import_react6.default.forwardRef(({
1005
1058
  utm_campaign,
1006
1059
  utm_term,
1007
1060
  showHeader = true,
1008
- colorPrimary = "#F6C76B",
1009
- textColor = "#2F2F2F",
1010
- backgroundColor = "#CECECE",
1011
- innerPadding = "1rem"
1061
+ backgroundColor = "var(--gray-180)",
1062
+ textColor = "var(--black)",
1063
+ buttonBackgroundColor = "#F6C76B",
1064
+ buttonTextColor = "var(--black)",
1065
+ innerPadding = "1rem",
1066
+ inputBackgroundColor = "var(--white)",
1067
+ inputBorderColor = "var(--transparent)",
1068
+ inputFocusBorderColor = "var(--yellow-500)",
1069
+ inputPlaceholderColor = "var(--gray-100)",
1070
+ inputTextColor = "var(--black)"
1012
1071
  }, ref) => {
1013
1072
  const [loading, setIsLoading] = (0, import_react6.useState)(false);
1014
1073
  const { error, handleError, clearError } = useError();
@@ -1112,11 +1171,15 @@ var MitreFormComponent = import_react6.default.forwardRef(({
1112
1171
  label: "Nome *",
1113
1172
  placeholder: "Digite seu nome",
1114
1173
  ...register("name"),
1115
- borderColor: colorPrimary,
1116
- textColor,
1117
1174
  error: errors.name?.message,
1118
1175
  autoComplete: "name",
1119
- required: true
1176
+ required: true,
1177
+ labelTextColor: textColor,
1178
+ backgroundColor: inputBackgroundColor,
1179
+ borderColor: inputBorderColor,
1180
+ focusBorderColor: inputFocusBorderColor,
1181
+ inputPlaceholderColor,
1182
+ inputTextColor
1120
1183
  }
1121
1184
  ),
1122
1185
  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
@@ -1127,11 +1190,15 @@ var MitreFormComponent = import_react6.default.forwardRef(({
1127
1190
  type: "email",
1128
1191
  placeholder: "exemplo@email.com",
1129
1192
  ...register("email"),
1130
- borderColor: colorPrimary,
1131
- textColor,
1132
1193
  error: errors.email?.message,
1133
1194
  autoComplete: "email",
1134
- required: true
1195
+ required: true,
1196
+ labelTextColor: textColor,
1197
+ backgroundColor: inputBackgroundColor,
1198
+ borderColor: inputBorderColor,
1199
+ focusBorderColor: inputFocusBorderColor,
1200
+ inputPlaceholderColor,
1201
+ inputTextColor
1135
1202
  }
1136
1203
  ),
1137
1204
  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
@@ -1149,13 +1216,17 @@ var MitreFormComponent = import_react6.default.forwardRef(({
1149
1216
  id: "phone",
1150
1217
  label: "Telefone *",
1151
1218
  placeholder: "(11) 00000-0000",
1152
- borderColor: colorPrimary,
1153
- textColor,
1154
1219
  error: errorMsg,
1155
1220
  required: true,
1156
1221
  value: field.value.phone,
1157
1222
  onChange: field.onChange,
1158
- name: field.name
1223
+ name: field.name,
1224
+ labelTextColor: textColor,
1225
+ backgroundColor: inputBackgroundColor,
1226
+ borderColor: inputBorderColor,
1227
+ focusBorderColor: inputFocusBorderColor,
1228
+ inputPlaceholderColor,
1229
+ inputTextColor
1159
1230
  }
1160
1231
  );
1161
1232
  }
@@ -1163,7 +1234,7 @@ var MitreFormComponent = import_react6.default.forwardRef(({
1163
1234
  formKey
1164
1235
  ),
1165
1236
  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("h6", { children: "* Campos de preenchimento obrigat\xF3rio." }),
1166
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ButtonContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Button2, { bgColor: colorPrimary, color: textColor, type: "submit", isSubmitting: loading, children: "Enviar mensagem" }) }),
1237
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ButtonContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Button2, { bgColor: buttonBackgroundColor, color: buttonTextColor, type: "submit", isSubmitting: loading, children: "Enviar mensagem" }) }),
1167
1238
  /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("p", { children: [
1168
1239
  "A Mitre Realty respeita a sua privacidade e utiliza os seus dados pessoais para contat\xE1-lo por e-mail ou telefone aqui registrados. Para saber mais, acesse a nossa",
1169
1240
  " ",
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/components/Form/index.tsx","../src/components/hooks/useError.ts","../src/components/styles/utils.ts","../src/components/Form/styles.ts","../src/components/styles/global.ts","../src/components/Input/index.tsx","../src/components/Input/masks.ts","../src/components/Input/styles.ts","../src/components/Button/styles.ts","../src/components/Button/index.tsx","../src/components/Alert/index.tsx","../src/components/Alert/styles.ts","../src/components/PhoneInput/index.tsx","../src/components/PhoneInput/styles.ts"],"sourcesContent":["export { default as MitreFormComponent } from \"./components/Form\";\nexport type { MitreFormComponentProps } from \"./components/Form\";\n","import React, { useState } from \"react\";\nimport { useError } from \"../hooks/useError\";\nimport { useForm, SubmitHandler, Controller } from \"react-hook-form\";\nimport { yupResolver } from \"@hookform/resolvers/yup\";\nimport * as yup from \"yup\";\n\nimport { PhoneNumberUtil } from 'google-libphonenumber';\nconst phoneUtil = PhoneNumberUtil.getInstance();\n\nimport { \n FormContainer, \n HeaderContainer, \n ButtonContainer, \n Form, \n Title, \n Text \n} from \"./styles\";\nimport FontLoader, { GlobalStyles } from \"../styles/global\";\n\nimport { Input } from \"../Input\";\nimport { Button } from \"../Button\";\nimport { Alert } from \"../Alert\";\nimport { PhoneInput } from \"../PhoneInput\";\n\nexport interface MitreFormComponentProps {\n productId: string;\n apiUrl: string;\n apiToken: string;\n utm_source: string;\n utm_medium?: string;\n utm_campaign?: string;\n utm_term?: string;\n showHeader?: boolean;\n colorPrimary?: string;\n textColor?: string;\n backgroundColor?: string;\n innerPadding?: string;\n}\n\ninterface RequestBody {\n name: string;\n email: string;\n phone: string;\n message: string;\n productId: string;\n utm_source: string;\n utm_medium?: string;\n utm_campaign?: string;\n utm_term?: string;\n}\n\nconst isPhoneValid = (phone: string) => {\n try {\n return phoneUtil.isValidNumber(phoneUtil.parseAndKeepRawInput(phone));\n } catch (error) {\n console.log('erro ao validar telefone = ' + error)\n return false;\n }\n};\n\nconst schema = yup.object().shape({\n name: yup.string().required(\"Nome é obrigatório\"),\n email: yup.string().required(\"Email é obrigatório\").email(\"Email inválido\"),\n phone: yup.object().shape({\n phone: yup.string().required(\"Telefone é obrigatório!\")\n .test(\n 'is-valid-phone',\n 'Número de telefone inválido!',\n function (value) { \n const digitsOnly = value?.replace(/\\D/g, '') || '';\n return digitsOnly.length >= 8 && isPhoneValid(value)\n }),\n inputValue: yup.string().required(\"Telefone é obrigatório!\"),\n dialCode: yup.string().required(\"Código de país é obrigatório\")\n }),\n});\n\nconst MitreFormComponent = React.forwardRef<HTMLDivElement, MitreFormComponentProps>(({\n productId,\n apiUrl,\n apiToken,\n utm_source,\n utm_medium,\n utm_campaign,\n utm_term,\n showHeader = true,\n colorPrimary = \"#F6C76B\",\n textColor = \"#2F2F2F\",\n backgroundColor = \"#CECECE\",\n innerPadding = \"1rem\",\n}, ref) => {\n const [loading, setIsLoading] = useState(false);\n const { error, handleError, clearError } = useError();\n const [successMessage, setSuccessMessage] = useState('');\n const [formKey, setFormKey] = useState(0);\n\n const { control, register, handleSubmit, formState: { errors }, reset, clearErrors } = useForm({\n resolver: yupResolver(schema),\n mode: 'onSubmit',\n });\n\n const resetForm = () => {\n reset({\n name: \"\",\n email: \"\",\n phone: { phone: \"\", inputValue: \"\", dialCode: \"\" },\n }, {\n keepErrors: false,\n keepDirty: false,\n keepTouched: false,\n keepIsSubmitted: false,\n keepSubmitCount: false,\n keepValues: false,\n keepDefaultValues: false,\n });\n clearErrors();\n setFormKey(k => k + 1); // Force remount\n };\n\n const sendMessage: SubmitHandler<{ name: string; email: string; phone: { phone: string; inputValue: string; dialCode: string; }; }> = async (data) => { \n const { name, email, phone } = data;\n \n const phoneValue = phone.inputValue;\n const phoneDigitsOnly = phoneValue?.replace(/\\D/g, '') || '';\n\n const message = \"Gostaria de mais informações sobre o produto\";\n\n try {\n setIsLoading(true);\n\n if (!productId || !utm_source || !apiToken) {\n throw new Error(\"Parâmetros obrigatórios não informados\");\n }\n\n const requestBody: RequestBody = {\n name,\n email,\n phone: phoneDigitsOnly,\n message,\n productId,\n utm_source,\n };\n\n if (utm_medium) requestBody.utm_medium = utm_medium;\n if (utm_campaign) requestBody.utm_campaign = utm_campaign;\n if (utm_term) requestBody.utm_term = utm_term;\n\n const response = await fetch(`${apiUrl}/leads`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n Authorization: `Basic ${apiToken}`,\n },\n body: JSON.stringify(requestBody),\n });\n\n if (!response.ok) {\n console.log('response = ' + JSON.stringify(response))\n throw new Error(\"Falha ao enviar a mensagem!\");\n }\n\n setSuccessMessage(\"Mensagem enviada com sucesso!\");\n resetForm();\n } catch (err) {\n handleError(err);\n } finally {\n setIsLoading(false);\n }\n };\n\n return (\n <>\n <FontLoader />\n <GlobalStyles />\n\n {error && (\n <Alert \n type=\"error\" \n dismissible\n onDismiss={clearError}\n autoDismiss={5000}\n >\n {error!.message}\n </Alert>\n )}\n\n {successMessage && (\n <Alert \n type=\"success\"\n dismissible\n onDismiss={() => setSuccessMessage('')}\n autoDismiss={5000}\n >\n {successMessage}\n </Alert>\n )}\n\n <FormContainer $backgroundColor={backgroundColor} $innerPadding={innerPadding} ref={ref} >\n {showHeader && \n <HeaderContainer>\n <Title $textColor={textColor}>Atendimento por mensagem</Title>\n\n <Text $textColor={textColor}>Informe seus dados e retornaremos a mensagem.</Text>\n </HeaderContainer>\n }\n\n <Form $textColor={textColor} onSubmit={handleSubmit(sendMessage)} noValidate>\n <Input\n id=\"name\"\n label=\"Nome *\"\n placeholder=\"Digite seu nome\"\n {...register(\"name\")}\n borderColor={colorPrimary}\n textColor={textColor}\n error={errors.name?.message}\n autoComplete=\"name\"\n required\n />\n\n <Input\n id=\"email\"\n label=\"Email *\"\n type=\"email\"\n placeholder=\"exemplo@email.com\"\n {...register(\"email\")}\n borderColor={colorPrimary}\n textColor={textColor}\n error={errors.email?.message}\n autoComplete=\"email\"\n required\n />\n\n <Controller\n key={formKey}\n name=\"phone\"\n control={control}\n defaultValue={{ phone: \"\", inputValue: \"\", dialCode: \"\" }}\n shouldUnregister={true}\n render={({ field }) => {\n const errorMsg =\n errors.phone?.inputValue?.message ||\n errors.phone?.phone?.message ||\n errors.phone?.message;\n\n return (\n <PhoneInput\n id=\"phone\"\n label=\"Telefone *\"\n placeholder=\"(11) 00000-0000\"\n borderColor={colorPrimary}\n textColor={textColor}\n error={errorMsg}\n required\n value={field.value.phone}\n onChange={field.onChange}\n name={field.name}\n />\n );\n }}\n />\n\n <h6>* Campos de preenchimento obrigatório.</h6>\n\n <ButtonContainer>\n <Button bgColor={colorPrimary} color={textColor} type=\"submit\" isSubmitting={loading}>\n Enviar mensagem\n </Button>\n </ButtonContainer>\n\n <p>A Mitre Realty respeita a sua privacidade e utiliza os seus dados pessoais para contatá-lo por e-mail ou telefone aqui registrados. Para saber mais, acesse a nossa{ ' '}\n <a\n href=\"https://www.mitrerealty.com.br/politica-de-privacidade\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n Política de Privacidade\n </a>. Ao clicar em {'\"'}enviar{'\"'}, você concorda em permitir que a Mitre Realty, armazene e processe os dados pessoais fornecidos por você para finalidade informada</p>\n\n </Form>\n </FormContainer>\n </>\n );\n});\n\nMitreFormComponent.displayName = \"MitreFormComponent\";\n\nexport default MitreFormComponent;\n","import { useState } from \"react\";\n\nexport function useError() {\n const [error, setError] = useState<Error | null>(null);\n\n const handleError = (err: unknown) => {\n const errorObj = err instanceof Error ? err : new Error(String(err));\n setError(errorObj);\n console.error(errorObj);\n };\n\n const clearError = () => setError(null);\n\n return { error, handleError, clearError };\n}\n","type directionType = \"column\" | \"row\";\ntype alignItemsType = \"center\" | \"flex-start\";\n\ntype jutifyContentType = \"center\" | \"space-between\";\n\nexport function flex(\n direction: directionType = \"row\",\n alignItems?: alignItemsType,\n justifyContent?: jutifyContentType\n) {\n return `\n align-items:${alignItems || null};\n display:flex;\n flex-direction:${direction};\n justify-content:${justifyContent || null};\n `;\n}\n\nexport const alignX = `\n left:50%;\n transform:translateX(-50%);\n`;\n\nexport const alignXAndY = `\n left:50%;\n top:50%;\n transform:translate(-50%, -50%);\n`;\n\nexport const darkEffect = `\n &:hover {\n cursor:pointer;\n filter:brightness(98%);\n }\n\n &:active {\n filter:brightness(95%);\n }\n`;\n\nexport const opacityEffect = `\n &:hover {\n cursor:pointer;\n opacity:.9;\n }\n\n &:active {\n opacity:.7;\n }\n`;\n\nexport const modalZIndex = 9999;\n\nexport const breakpoints = {\n tablet: \"1024px\",\n};\n","import { flex, opacityEffect } from \"../styles/utils\";\nimport styled from \"styled-components\";\n\nexport const FormContainer = styled.div<{\n $backgroundColor: string;\n $innerPadding: string;\n}>`\n ${flex(\"column\")}\n align-items: stretch;\n justify-content: flex-start;\n overflow-x: hidden;\n overflow-y: auto;\n\n background: ${(props) => props.$backgroundColor || \" #cecece\"};\n\n padding: ${(props) => props.$innerPadding || \"1rem\"};\n\n /* Hide scrollbars for WebKit browsers */\n ::-webkit-scrollbar {\n display: none;\n }\n\n /* Hide scrollbars for Firefox */\n scrollbar-width: none;\n\n box-sizing: border-box;\n height: 100%;\n`;\n\nexport const HeaderContainer = styled.div`\n margin-bottom: 1rem;\n`;\n\nexport const ButtonContainer = styled.div`\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: 100%;\n margin-top: 0.75rem;\n\n button {\n ${opacityEffect}\n color: var(--black);\n font-weight: 600;\n border: none;\n border-radius: 8px;\n width: 60%;\n margin-top: 10px;\n margin-bottom: 10px;\n }\n`;\n\nexport const Form = styled.form<{ $textColor: string }>`\n label {\n font-weight: 700;\n }\n\n input {\n background: white;\n margin-bottom: 0.75rem;\n }\n\n p {\n font-family: \"Montserrat\", sans-serif;\n font-style: italic;\n font-weight: 200;\n font-size: 0.8rem;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n text-align: start;\n }\n\n a {\n font-family: \"Montserrat\", sans-serif;\n font-style: italic;\n font-weight: 200;\n font-size: 0.8rem;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n }\n\n h6 {\n text-align: start;\n margin-left: 10px;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n }\n\n & > div {\n margin-bottom: 10px;,\n }\n`;\n\nexport const Title = styled.h2<{ $textColor: string }>`\n font-size: 1.25rem;\n font-weight: 700;\n line-height: 24px;\n letter-spacing: 0em;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n`;\n\nexport const Text = styled.p<{ $textColor: string }>`\n font-size: 1rem;\n font-weight: 400;\n line-height: 23px;\n letter-spacing: 0em;\n margin-top: 10px;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n`;\n","import { createGlobalStyle } from \"styled-components\";\nimport React, { useEffect } from \"react\";\n\nexport const GlobalStyles = createGlobalStyle`\n :root {\n --red: #e52e4d;\n --white: #FFF;\n --black: #2F2F2F;\n --black-2:#1E1E1E;\n --alphaBlack: #000000;\n --black-2:#1E1E1E;\n --black-3:#353535;\n\n --yellow-400:#FFD789;\n --yellow-500: #F6C76B;\n --gray-40:#F0F0F0;\n --gray-45:#767676;\n --gray-50: #686A69;\n --gray-60: #8F8F8F;\n --gray-100: #B6B6B6;\n --gray-150: #B9B9B9;\n --gray-200: #D2D2D2;\n --gray-300: #EBEBEB;\n --gray-400: #ECECEC;\n --gray-500: #F4F4F4;\n --gray-550:#6F6F6F;\n --gray-600:#686868;\n --gray-700: #535353;\n --gray-800:#9D9D9D;\n --shadow-500: 0px 4px 8px rgba(91, 91, 91, 0.2);\n --green:#57C06E;\n --green-2:#2DCE68;\n --blue:#007BFF;\n }\n\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n html {\n scroll-behavior: smooth;\n\n @media (max-width: 1080px) {\n font-size: 93.75%;\n }\n @media (max-width: 720px) {\n font-size: 87.5%;\n }\n }\n\n body {\n background: var(--white);\n -webkit-font-smoothing: antialiased;\n }\n\n body, input, textarea, select, button {\n font-family: \"Montserrat\", sans-serif;\n font-weight: 400;\n } \n\n h1, h2, h3, h4, h5, h6, strong {\n font-weight: 600;\n }\n\n button {\n cursor: pointer;\n }\n\n [disabled] {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n .hidden {\n overflow: hidden;\n }\n\n ::-webkit-scrollbar {\n -webkit-appearance: none;\n background: var(--gray-500);\n width: 6px;\n height: 10px;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: var(--gray-50);\n }\n\n .aligncenter {\n text-align: center;\n }\n\n .width-190px {\n width:190px;\n }\n\n .hidden-content {\n display:none !important;\n }\n\n .global-margin-bottom {\n margin-bottom:20px;\n }\n\n .background-light-gray {\n background:#F4F4F4;\n }\n\n .full-width-and-height {\n height:100%;\n width:100%;\n }\n\n .flex-direction-column {\n flex-direction:column;\n }\n\n .bold {\n font-weight:700;\n }\n\n .margin-center-x {\n margin:0 auto;\n }\n\n .border-none {\n border:none;\n }\n\n .text-center {\n text-align:center;\n }\n\n .relative {\n position:relative;\n }\n\n /* accessibility */\n body ._access-menu p._text-center{\n font-family: \"Montserrat\", sans-serif;\n font-style: italic;\n font-size: 1.2rem!important;\n margin-top: 6px;\n margin-bottom: 3px;\n } \n\n`;\n\nconst FontLoader: React.FC = () => {\n useEffect(() => {\n const link = document.createElement(\"link\");\n link.href =\n \"https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap\";\n link.rel = \"stylesheet\";\n document.head.appendChild(link);\n }, []);\n\n return null;\n};\n\nexport default FontLoader;\n","import {\n FormEvent,\n forwardRef,\n ForwardRefRenderFunction,\n InputHTMLAttributes,\n useCallback,\n} from \"react\";\nimport { FieldError } from \"react-hook-form\";\nimport { cep, cpf, currency, date } from \"./masks\";\n\nimport {\n FormControl,\n FormErrorMessage,\n FormLabel,\n Input as FormInput,\n} from \"./styles\";\n\ntype InputType =\n | \"text\"\n | \"email\"\n | \"password\"\n | \"number\"\n | \"tel\"\n | \"url\"\n | \"date\"\n | \"time\"\n | \"datetime-local\";\n\ninterface InputProps extends InputHTMLAttributes<HTMLInputElement> {\n id: string;\n label?: string;\n error?: string | FieldError;\n showErrorMessage?: boolean;\n borderColor: string;\n textColor?: string;\n\n mask?: \"cep\" | \"currency\" | \"cpf\" | \"phone\" | \"date\";\n type?: InputType;\n}\n\nconst InputBase: ForwardRefRenderFunction<HTMLInputElement, InputProps> = (\n { id, label, error, showErrorMessage = true, borderColor, textColor, mask = \"\", type = \"text\", ...rest },\n ref\n) => {\n const handleKeyUp = useCallback(\n (e: FormEvent<HTMLInputElement>) => {\n if (mask === \"cep\") cep(e);\n if (mask === \"currency\") currency(e);\n if (mask === \"cpf\") cpf(e);\n if (mask === \"date\") date(e);\n },\n [mask]\n );\n\n return (\n <FormControl isInvalid={!!error}>\n {!!label && <FormLabel htmlFor={id} $textColor={textColor}>{label}</FormLabel>}\n\n {!mask ? (\n <FormInput\n id={id}\n ref={ref}\n type={type} \n $bordercolor={borderColor}\n aria-invalid={!!error && showErrorMessage ? \"true\" : \"false\"}\n autoComplete={rest.autoComplete || \"on\"}\n {...rest}\n />\n ) : (\n <FormInput\n id={id}\n ref={ref}\n type={type} \n $bordercolor={borderColor}\n aria-invalid={!!error && showErrorMessage ? \"true\" : \"false\"}\n onKeyUp={handleKeyUp}\n autoComplete={rest.autoComplete || \"on\"}\n {...rest}\n />\n )}\n\n {!!error && showErrorMessage && (\n <FormErrorMessage data-testid=\"error-message\">\n {typeof error === 'string' ? error : error.message}\n </FormErrorMessage>\n )}\n </FormControl>\n );\n};\n\nexport const Input = forwardRef(InputBase);\n","import { FormEvent } from \"react\";\n\nexport function cep(e: FormEvent<HTMLInputElement>) {\n e.currentTarget.maxLength = 9;\n let value = e.currentTarget.value;\n value = value.replace(/\\D/g, \"\");\n value = value.replace(/^(\\d{5})(\\d)/, \"$1-$2\");\n e.currentTarget.value = value;\n return e;\n}\n\nexport function currency(e: FormEvent<HTMLInputElement>) {\n let value = e.currentTarget.value;\n value = value.replace(/\\D/g, \"\");\n value = value.replace(/(\\d)(\\d{2})$/, \"$1,$2\");\n value = value.replace(/(?=(\\d{3})+(\\D))\\B/g, \".\");\n\n e.currentTarget.value = value;\n return e;\n}\n\nexport function cpf(e: FormEvent<HTMLInputElement>) {\n e.currentTarget.maxLength = 14;\n let value = e.currentTarget.value;\n if (!value.match(/^(\\d{3}).(\\d{3}).(\\d{3})-(\\d{2})$/)) {\n value = value.replace(/\\D/g, \"\");\n value = value.replace(/(\\d{3})(\\d)/, \"$1.$2\");\n value = value.replace(/(\\d{3})(\\d)/, \"$1.$2\");\n value = value.replace(/(\\d{3})(\\d{2})$/, \"$1-$2\");\n\n e.currentTarget.value = value;\n }\n return e;\n}\n\nexport function date(e: FormEvent<HTMLInputElement>) {\n let value = e.currentTarget.value;\n value = value.replace(/\\D/g, \"\");\n value = value.replace(/(\\d{2})(\\d)/, \"$1/$2\");\n value = value.replace(/(\\d{2})(\\d)/, \"$1/$2\");\n e.currentTarget.value = value;\n return e;\n}\n\nexport function phone(e: FormEvent<HTMLInputElement>) {\n let value = e.currentTarget.value;\n value = value.replace(/\\D/g, \"\");\n value = value.replace(/(\\d{2})(\\d)/, \"$1/$2\");\n value = value.replace(/(\\d{2})(\\d)/, \"$1/$2\");\n e.currentTarget.value = value;\n return e;\n}\n","import { InputHTMLAttributes } from \"react\";\nimport styled, { css } from \"styled-components\";\n\nexport const FormLabel = styled.label<{ $textColor?: string }>`\n font-family: \"Montserrat\", sans-serif;\n font-style: normal;\n font-weight: 500;\n font-size: 1rem;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n display: block;\n margin-bottom: 0.5rem;\n text-align: left;\n`;\n\nexport const Input = styled.input<\n InputHTMLAttributes<HTMLInputElement> & { $bordercolor?: string }\n>`\n font-family: \"Montserrat\", sans-serif;\n font-style: normal;\n font-weight: 500;\n font-size: 1rem;\n line-height: 1.5rem;\n background: var(--gray-500);\n color: var(--black);\n padding: 0.5rem;\n border-radius: 0.125rem;\n border: 1px solid transparent;\n display: block;\n height: 3.125rem;\n width: 100%;\n\n &:focus {\n border-radius: 0.125rem;\n border: 2px solid ${(props) => props.$bordercolor || \"var(--yellow-500)\"};\n outline: none;\n }\n\n &::placeholder {\n font-size: 1rem;\n line-height: 1.5rem;\n color: #b6b6b6;\n font-weight: 800;\n }\n\n /* Autofill styles */\n &:-webkit-autofill {\n background: var(--gray-500) !important;\n color: var(--black) !important;\n -webkit-text-fill-color: var(--black) !important;\n transition: background-color 5000s ease-in-out 0s; /* Prevent flashing */\n }\n\n &:-webkit-autofill::first-line {\n font-family: \"Montserrat\", sans-serif;\n font-size: 1rem;\n font-weight: 500;\n }\n`;\n\nexport const FormErrorMessage = styled.small`\n font-size: 0.75rem;\n line-height: 1.125rem;\n color: var(--red);\n margin-top: 0.25rem;\n display: block;\n`;\n\nexport const FormControl = styled.div.withConfig({\n shouldForwardProp: (prop) => ![\"isInvalid\"].includes(prop),\n})<{ isInvalid?: boolean; $bordercolor?: string }>`\n ${FormLabel} {\n ${(props) =>\n props.isInvalid &&\n css`\n color: var(--red);\n `};\n }\n\n ${Input} {\n ${(props) =>\n props.isInvalid &&\n css`\n border: 1px solid var(--red);\n\n &:not(:focus)::placeholder {\n color: var(--red);\n font-weight: 600;\n }\n `};\n\n &:focus {\n ${(props) =>\n props.isInvalid &&\n css`\n border: 1px solid var(--red);\n `};\n }\n }\n`;\n","import { darken } from \"polished\";\nimport styled, { css } from \"styled-components\";\n\ntype ButtonProps = {\n hasIcon?: boolean;\n isSubmitting?: boolean;\n hasSubmittingMessage?: boolean;\n bgColor?: string;\n bordercolor?: string;\n color?: string;\n height?: string;\n};\n\nexport const Icon = styled.span`\n font-size: 0;\n line-height: 0;\n transition: all 0.25s ease;\n\n transform: translate3d(-30px, 0px, 0px);\n visibility: hidden;\n opacity: 0;\n margin-right: 0.625rem;\n`;\n\nexport const Text = styled.span`\n font-family: \"Montserrat\", sans-serif;\n font-size: 1rem;\n line-height: 1.5rem;\n margin-bottom: -2px;\n\n transition: all 0.25s ease;\n`;\n\nexport const TextSubmitting = styled.span`\n font-family: \"Montserrat\", sans-serif;\n font-weight: 400;\n font-size: 1rem;\n\n transition: all 0.25s ease;\n`;\n\nexport const LoadingIcon = styled.span.withConfig({\n shouldForwardProp: (prop) => prop !== \"hasText\",\n})<{ hasText?: boolean }>`\n display: block;\n\n width: 1rem;\n height: 1rem;\n border: 0.125rem solid var(--white);\n border-radius: 50%;\n animation: loadingAnimation 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n border-color: var(--white) transparent transparent transparent;\n\n margin-right: ${(props) => (props.hasText ? \"0.625rem\" : \"0\")};\n\n @keyframes loadingAnimation {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n }\n`;\n\nexport const Button = styled.button.withConfig({\n shouldForwardProp: (prop) =>\n ![\n \"hasIcon\",\n \"isSubmitting\",\n \"hasSubmittingMessage\",\n \"bgColor\",\n \"bordercolor\",\n \"color\",\n \"height\",\n ].includes(prop),\n})<ButtonProps>`\n background: ${(props) => darken(0.1, props?.bgColor || \"#F6C76B\")};\n color: ${(props) => props?.color || \"#2F2F2F\"};\n border: 1px solid ${(props) => darken(0.1, props?.bordercolor || \"#F6C76B\")};\n border-radius: 2px;\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 0 0.75rem;\n height: ${(props) => props?.height || \"3.125rem\"};\n position: relative;\n font-size: 0;\n line-height: 0;\n\n transition: all 0.25s;\n\n ${Icon} {\n display: ${(props) => (props?.hasIcon ? \"block\" : \"\")};\n }\n\n ${Text} {\n transform: ${(props) =>\n props?.hasIcon ? \"translate3d(-4.5px, 0px, 0px)\" : \"unset\"};\n\n @media print, screen and (min-width: 40em) {\n transform: ${(props) =>\n props?.hasIcon ? \"translate3d(-14.5px, 0px, 0px)\" : \"unset\"};\n }\n\n color: ${(props) => props?.color || \"#2F2F2F\"};\n }\n\n &:hover {\n background: ${(props) => darken(0.2, props?.bgColor || \"#F6C76B\")};\n border-color: ${(props) => darken(0.2, props?.bordercolor || \"#F6C76B\")};\n\n ${Icon} {\n opacity: 1;\n visibility: visible;\n transform: translate3d(0px, 0px, 0px);\n }\n\n ${Text} {\n transform: ${(props) =>\n props?.hasIcon ? \"translate3d(-5px, 0px, 0px)\" : \"unset\"};\n }\n }\n\n ${Text} {\n ${(props) =>\n props.isSubmitting &&\n !props.hasSubmittingMessage &&\n css`\n transform: unset;\n opacity: 0;\n `}\n }\n\n ${LoadingIcon} {\n ${(props) =>\n props.isSubmitting &&\n !props.hasSubmittingMessage &&\n css`\n display: flex;\n -webkit-box-align: center;\n align-items: center;\n position: absolute;\n `}\n }\n`;\n","import { ButtonHTMLAttributes, ReactElement, ReactNode } from \"react\";\n\nimport {\n Button as ButtonComponent,\n Icon,\n LoadingIcon,\n Text,\n TextSubmitting,\n} from \"./styles\";\n\ntype ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n children: ReactNode;\n icon?: ReactElement;\n isSubmitting?: boolean;\n submittingMessage?: string;\n bgColor?: string;\n bordercolor?: string;\n color?: string;\n height?: string;\n};\n\nexport function Button({\n children,\n icon,\n isSubmitting = false,\n submittingMessage = \"\",\n disabled = false,\n color = \"#2F2F2F\",\n ...rest\n}: ButtonProps) {\n return (\n <ButtonComponent\n isSubmitting={isSubmitting}\n hasSubmittingMessage={submittingMessage.length > 0}\n disabled={isSubmitting || disabled}\n aria-disabled={isSubmitting || disabled}\n hasIcon={!!icon}\n color={color}\n {...rest}\n >\n {icon && !isSubmitting && <Icon data-testid=\"button-icon\">{icon}</Icon>}\n {isSubmitting && <LoadingIcon hasText={submittingMessage.length > 0} />}\n {(!isSubmitting || submittingMessage.length === 0) && (\n <Text className=\"text\">{children}</Text>\n )}\n {isSubmitting && submittingMessage.length > 0 && (\n <TextSubmitting>{submittingMessage}</TextSubmitting>\n )}\n </ButtonComponent>\n );\n}\n","import React, { useEffect, useState, useCallback } from 'react';\nimport { AlertContainer, DismissButton } from './styles';\nimport { AlertType } from './styles';\n\nimport { HiX } from 'react-icons/hi';\n\ninterface AlertProps {\n type?: AlertType;\n children: React.ReactNode;\n className?: string;\n dismissible?: boolean;\n onDismiss?: () => void;\n autoDismiss?: number;\n}\n\nexport const Alert = ({\n type = 'info',\n children,\n className,\n dismissible = false,\n onDismiss,\n autoDismiss\n}: AlertProps) => {\n const [isClosing, setIsClosing] = useState(false);\n\n const handleDismiss = useCallback(() => {\n setIsClosing(true);\n setTimeout(() => onDismiss?.(), 300);\n }, [onDismiss]);\n\n useEffect(() => {\n if (autoDismiss) {\n const timer = setTimeout(handleDismiss, autoDismiss);\n return () => clearTimeout(timer);\n }\n }, [autoDismiss, handleDismiss]);\n\n return (\n <AlertContainer\n $type={type}\n $dismissible={dismissible}\n $isClosing={isClosing}\n className={className}\n role=\"alert\"\n >\n {children}\n {dismissible && (\n <DismissButton \n onClick={handleDismiss} \n aria-label=\"Dismiss alert\"\n >\n <HiX /> \n </DismissButton>\n )}\n </AlertContainer>\n );\n};","import styled, { css, keyframes } from \"styled-components\";\n\nexport type AlertType = \"error\" | \"warning\" | \"info\" | \"success\";\n\nconst fadeIn = keyframes`\n from { opacity: 0; transform: translateY(-10px); }\n to { opacity: 1; transform: translateY(0); }\n`;\n\nconst fadeOut = keyframes`\n from { opacity: 1; transform: translateY(0); }\n to { opacity: 0; transform: translateY(-10px); }\n`;\n\ninterface AlertContainerProps {\n $type: AlertType;\n $dismissible?: boolean;\n $isClosing: boolean;\n}\n\nconst typeStyles = {\n error: css`\n background-color: var(--red);\n border: 1px solid var(--red);\n color: var(--white);\n svg {\n color: var(--white);\n }\n `,\n warning: css`\n background-color: var(--yellow-500);\n border: 1px solid var(--yellow-400);\n color: var(--black);\n svg {\n color: var(--black);\n }\n `,\n info: css`\n background-color: var(--blue);\n border: 1px solid var(--blue);\n color: var(--white);\n svg {\n color: var(--white);\n }\n `,\n success: css`\n background-color: var(--green);\n border: 1px solid var(--green-2);\n color: var(--white);\n svg {\n color: var(--white);\n }\n `,\n};\n\nexport const AlertContainer = styled.div<AlertContainerProps>`\n position: fixed;\n width: 500px;\n top: 15px;\n right: 15px;\n padding: 1rem ${({ $dismissible }) => ($dismissible ? \"2.5rem\" : \"1rem\")} 1rem\n 1rem;\n margin-bottom: 1rem;\n animation: ${({ $isClosing }) => ($isClosing ? fadeOut : fadeIn)} 0.3s\n ease-out;\n animation-fill-mode: forwards;\n align-items: center;\n gap: 0.5rem;\n box-shadow: var(--shadow-500);\n border-radius: 0.5rem;\n font-size: 1rem;\n font-weight: 500;\n\n ${({ $type }) => typeStyles[$type]}\n`;\n\nexport const DismissButton = styled.button`\n position: absolute;\n background: transparent;\n right: 10px;\n border: none;\n cursor: pointer;\n color: inherit;\n opacity: 1;\n transition: opacity 0.2s;\n\n &:hover {\n opacity: 0.7;\n }\n\n svg {\n width: 1rem;\n height: 1rem;\n }\n`;\n","import {\n forwardRef,\n ForwardRefRenderFunction,\n InputHTMLAttributes,\n} from \"react\";\nimport { FieldError } from \"react-hook-form\";\nimport { StyledPhoneInput, FormControl, FormLabel, FormErrorMessage } from \"./styles\";\nimport { PhoneInputRefType, ParsedCountry } from \"react-international-phone\";\n\ninterface PhoneInputChange {\n phone: string;\n dialCode: string;\n inputValue: string;\n}\n\ninterface PhoneInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'value'> {\n id: string;\n label?: string;\n error?: string | FieldError;\n showErrorMessage?: boolean;\n borderColor: string;\n textColor?: string;\n value: string;\n onChange?: (value: PhoneInputChange) => void;\n}\n\nconst PhoneInputBase: ForwardRefRenderFunction<PhoneInputRefType, PhoneInputProps> = (\n { id, label, error, showErrorMessage = true, borderColor, textColor, value, ...rest },\n ref\n) => {\n return (\n <FormControl isInvalid={!!error} >\n {!!label && <FormLabel htmlFor={id} $textColor={textColor}>{label}</FormLabel>}\n <StyledPhoneInput\n ref={ref}\n defaultCountry=\"br\"\n disableCountryGuess={true}\n disableDialCodeAndPrefix={true}\n showDisabledDialCodeAndPrefix={false}\n $bordercolor={borderColor}\n placeholder={rest.placeholder}\n aria-invalid={!!error && showErrorMessage ? \"true\" : \"false\"}\n value={String(value)}\n onChange={(phone: string, meta: { country: ParsedCountry; inputValue: string }) => {\n if (typeof rest.onChange === \"function\") {\n rest.onChange({\n phone,\n dialCode: meta.country.dialCode,\n inputValue: meta.inputValue,\n });\n }\n }}\n inputProps={{\n id,\n name: rest.name || 'phone',\n required: rest.required,\n autoFocus: rest.autoFocus,\n autoComplete: rest.autoComplete || \"tel\",\n }}\n />\n {!!error && showErrorMessage && (\n <FormErrorMessage data-testid=\"error-message\">\n {typeof error === 'string' ? error : error?.message}\n </FormErrorMessage>\n )}\n </FormControl>\n );\n};\n\nexport const PhoneInput = forwardRef(PhoneInputBase);\n","import styled, { css } from \"styled-components\";\nimport { PhoneInput } from \"react-international-phone\";\nimport \"react-international-phone/style.css\";\n\n// Styled label for the form\nexport const FormLabel = styled.label<{ $textColor?: string }>`\n font-family: \"Montserrat\", sans-serif;\n font-style: normal;\n font-weight: 500;\n font-size: 1rem;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n display: block;\n margin-bottom: 0.5rem;\n text-align: left;\n`;\n\n// Styled PhoneInput component\nexport const StyledPhoneInput = styled(PhoneInput)<{ $bordercolor?: string }>`\n width: 100%;\n height: 3.125rem;\n background: var(--gray-500);\n font-family: \"Montserrat\", sans-serif;\n\n &:focus-within {\n border-radius: 0.125rem;\n border: 2px solid ${(props) => props.$bordercolor || \"var(--yellow-500)\"};\n outline: none;\n }\n\n /* Style for the inner phone input container */\n .react-international-phone-input-container {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n overflow: hidden;\n font-family: \"Montserrat\", sans-serif;\n font-size: 1rem;\n font-weight: 500;\n color: var(--black);\n background: var(--white);\n }\n\n /* Style for the country selector button */\n .react-international-phone-country-selector-button {\n height: 100%;\n background: var(--white);\n display: flex;\n align-items: center;\n justify-content: center;\n font-family: \"Montserrat\", sans-serif;\n font-size: 1rem;\n font-weight: 500;\n cursor: pointer;\n outline: none;\n border: none;\n border-right: 2px solid var(--gray-300);\n }\n\n /* Style for the input itself */\n input.react-international-phone-input {\n flex: 1;\n height: 100%;\n padding: 0 0.5rem;\n margin: 0;\n background: var(--white);\n font-family: \"Montserrat\", sans-serif;\n font-style: normal;\n font-weight: 500;\n font-size: 1rem;\n line-height: 1.5rem;\n color: var(--black);\n outline: none;\n border: none;\n border-radius: 0.125rem;\n\n &::placeholder {\n font-size: 1rem;\n line-height: 1.5rem;\n color: #b6b6b6;\n font-weight: 800;\n }\n\n &:-webkit-autofill {\n background: var(--gray-500) !important;\n -webkit-text-fill-color: var(--black) !important;\n transition: background-color 5000s ease-in-out 0s;\n }\n\n &:-webkit-autofill::first-line {\n font-family: \"Montserrat\", sans-serif;\n font-size: 1rem;\n font-weight: 500;\n }\n }\n`;\n\nexport const FormErrorMessage = styled.small`\n font-size: 0.75rem;\n line-height: 1.125rem;\n color: var(--red);\n margin-top: 0.25rem;\n display: block;\n`;\n\nexport const FormControl = styled.div.withConfig({\n shouldForwardProp: (prop) => ![\"isInvalid\"].includes(prop),\n})<{ isInvalid?: boolean }>`\n ${FormLabel} {\n ${(props) =>\n props.isInvalid &&\n css`\n color: var(--red);\n `};\n }\n\n ${StyledPhoneInput} {\n ${(props) =>\n props.isInvalid &&\n css`\n border: 1px solid var(--red);\n\n &:not(:focus)::placeholder {\n color: var(--red);\n font-weight: 600;\n }\n `};\n\n .react-international-phone-input-container {\n ${(props) =>\n props.isInvalid &&\n css`\n border: 1px solid var(--red);\n\n &:not(:focus)::placeholder {\n color: var(--red);\n font-weight: 600;\n }\n `};\n }\n }\n`;\n"],"mappings":"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","names":["import_react","styled","import_styled_components","import_react","import_react","import_styled_components","styled","Input","import_styled_components","styled","Text","import_jsx_runtime","Button","Text","import_react","import_styled_components","styled","import_jsx_runtime","import_react","import_styled_components","FormLabel","styled","FormErrorMessage","FormControl","import_jsx_runtime","FormControl","FormLabel","FormErrorMessage","PhoneInput","import_jsx_runtime","React","Input","PhoneInput","Button"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/components/Form/index.tsx","../src/components/hooks/useError.ts","../src/components/styles/utils.ts","../src/components/Form/styles.ts","../src/components/styles/global.ts","../src/components/Input/index.tsx","../src/components/Input/masks.ts","../src/components/Input/styles.ts","../src/components/Button/styles.ts","../src/components/Button/index.tsx","../src/components/Alert/index.tsx","../src/components/Alert/styles.ts","../src/components/PhoneInput/index.tsx","../src/components/PhoneInput/styles.ts"],"sourcesContent":["export { default as MitreFormComponent } from \"./components/Form\";\nexport type { MitreFormComponentProps } from \"./components/Form\";\n","import React, { useState } from \"react\";\nimport { useError } from \"../hooks/useError\";\nimport { useForm, SubmitHandler, Controller } from \"react-hook-form\";\nimport { yupResolver } from \"@hookform/resolvers/yup\";\nimport * as yup from \"yup\";\n\nimport { PhoneNumberUtil } from 'google-libphonenumber';\nconst phoneUtil = PhoneNumberUtil.getInstance();\n\nimport {\n FormContainer,\n HeaderContainer,\n ButtonContainer,\n Form,\n Title,\n Text\n} from \"./styles\";\nimport FontLoader, { GlobalStyles } from \"../styles/global\";\n\nimport { Input } from \"../Input\";\nimport { Button } from \"../Button\";\nimport { Alert } from \"../Alert\";\nimport { PhoneInput } from \"../PhoneInput\";\n\nexport interface MitreFormComponentProps {\n productId: string;\n apiUrl: string;\n apiToken: string;\n utm_source: string;\n utm_medium?: string;\n utm_campaign?: string;\n utm_term?: string;\n showHeader?: boolean;\n backgroundColor?: string;\n buttonBackgroundColor?: string;\n buttonTextColor?: string;\n textColor?: string;\n innerPadding?: string;\n inputBackgroundColor?: string;\n inputFocusBorderColor?: string;\n inputBorderColor?: string;\n inputTextColor?: string;\n inputPlaceholderColor?: string;\n}\n\ninterface RequestBody {\n name: string;\n email: string;\n phone: string;\n message: string;\n productId: string;\n utm_source: string;\n utm_medium?: string;\n utm_campaign?: string;\n utm_term?: string;\n}\n\nconst isPhoneValid = (phone: string) => {\n try {\n return phoneUtil.isValidNumber(phoneUtil.parseAndKeepRawInput(phone));\n } catch (error) {\n console.log('erro ao validar telefone = ' + error)\n return false;\n }\n};\n\nconst schema = yup.object().shape({\n name: yup.string().required(\"Nome é obrigatório\"),\n email: yup.string().required(\"Email é obrigatório\").email(\"Email inválido\"),\n phone: yup.object().shape({\n phone: yup.string().required(\"Telefone é obrigatório!\")\n .test(\n 'is-valid-phone',\n 'Número de telefone inválido!',\n function (value) {\n const digitsOnly = value?.replace(/\\D/g, '') || '';\n return digitsOnly.length >= 8 && isPhoneValid(value)\n }),\n inputValue: yup.string().required(\"Telefone é obrigatório!\"),\n dialCode: yup.string().required(\"Código de país é obrigatório\")\n }),\n});\n\nconst MitreFormComponent = React.forwardRef<HTMLDivElement, MitreFormComponentProps>(({\n productId,\n apiUrl,\n apiToken,\n utm_source,\n utm_medium,\n utm_campaign,\n utm_term,\n showHeader = true,\n backgroundColor = \"var(--gray-180)\",\n textColor = \"var(--black)\",\n buttonBackgroundColor = \"#F6C76B\",\n buttonTextColor = \"var(--black)\",\n innerPadding = \"1rem\",\n inputBackgroundColor = \"var(--white)\",\n inputBorderColor = \"var(--transparent)\",\n inputFocusBorderColor = \"var(--yellow-500)\",\n inputPlaceholderColor = \"var(--gray-100)\",\n inputTextColor = \"var(--black)\",\n}, ref) => {\n const [loading, setIsLoading] = useState(false);\n const { error, handleError, clearError } = useError();\n const [successMessage, setSuccessMessage] = useState('');\n const [formKey, setFormKey] = useState(0);\n\n const { control, register, handleSubmit, formState: { errors }, reset, clearErrors } = useForm({\n resolver: yupResolver(schema),\n mode: 'onSubmit',\n });\n\n const resetForm = () => {\n reset({\n name: \"\",\n email: \"\",\n phone: { phone: \"\", inputValue: \"\", dialCode: \"\" },\n }, {\n keepErrors: false,\n keepDirty: false,\n keepTouched: false,\n keepIsSubmitted: false,\n keepSubmitCount: false,\n keepValues: false,\n keepDefaultValues: false,\n });\n clearErrors();\n setFormKey(k => k + 1); // Force remount\n };\n\n const sendMessage: SubmitHandler<{\n name: string;\n email: string;\n phone: { phone: string; inputValue: string; dialCode: string; };\n }> = async (data) => {\n const { name, email, phone } = data;\n\n const phoneValue = phone.inputValue;\n const phoneDigitsOnly = phoneValue?.replace(/\\D/g, '') || '';\n\n const message = \"Gostaria de mais informações sobre o produto\";\n\n try {\n setIsLoading(true);\n\n if (!productId || !utm_source || !apiToken) {\n throw new Error(\"Parâmetros obrigatórios não informados\");\n }\n\n const requestBody: RequestBody = {\n name,\n email,\n phone: phoneDigitsOnly,\n message,\n productId,\n utm_source,\n };\n\n if (utm_medium) requestBody.utm_medium = utm_medium;\n if (utm_campaign) requestBody.utm_campaign = utm_campaign;\n if (utm_term) requestBody.utm_term = utm_term;\n\n const response = await fetch(`${apiUrl}/leads`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n Authorization: `Basic ${apiToken}`,\n },\n body: JSON.stringify(requestBody),\n });\n\n if (!response.ok) {\n console.log('response = ' + JSON.stringify(response))\n throw new Error(\"Falha ao enviar a mensagem!\");\n }\n\n setSuccessMessage(\"Mensagem enviada com sucesso!\");\n resetForm();\n } catch (err) {\n handleError(err);\n } finally {\n setIsLoading(false);\n }\n };\n\n return (\n <>\n <FontLoader />\n <GlobalStyles />\n\n {error && (\n <Alert\n type=\"error\"\n dismissible\n onDismiss={clearError}\n autoDismiss={5000}\n >\n {error!.message}\n </Alert>\n )}\n\n {successMessage && (\n <Alert\n type=\"success\"\n dismissible\n onDismiss={() => setSuccessMessage('')}\n autoDismiss={5000}\n >\n {successMessage}\n </Alert>\n )}\n\n <FormContainer $backgroundColor={backgroundColor} $innerPadding={innerPadding} ref={ref} >\n {showHeader &&\n <HeaderContainer>\n <Title $textColor={textColor}>Atendimento por mensagem</Title>\n\n <Text $textColor={textColor}>Informe seus dados e retornaremos a mensagem.</Text>\n </HeaderContainer>\n }\n\n <Form $textColor={textColor} onSubmit={handleSubmit(sendMessage)} noValidate>\n <Input\n id=\"name\"\n label=\"Nome *\"\n placeholder=\"Digite seu nome\"\n {...register(\"name\")}\n error={errors.name?.message}\n autoComplete=\"name\"\n required\n labelTextColor={textColor}\n backgroundColor={inputBackgroundColor}\n borderColor={inputBorderColor}\n focusBorderColor={inputFocusBorderColor}\n inputPlaceholderColor={inputPlaceholderColor}\n inputTextColor={inputTextColor}\n />\n\n <Input\n id=\"email\"\n label=\"Email *\"\n type=\"email\"\n placeholder=\"exemplo@email.com\"\n {...register(\"email\")}\n error={errors.email?.message}\n autoComplete=\"email\"\n required\n labelTextColor={textColor}\n backgroundColor={inputBackgroundColor}\n borderColor={inputBorderColor}\n focusBorderColor={inputFocusBorderColor}\n inputPlaceholderColor={inputPlaceholderColor}\n inputTextColor={inputTextColor}\n />\n\n <Controller\n key={formKey}\n name=\"phone\"\n control={control}\n defaultValue={{ phone: \"\", inputValue: \"\", dialCode: \"\" }}\n shouldUnregister={true}\n render={({ field }) => {\n const errorMsg =\n errors.phone?.inputValue?.message ||\n errors.phone?.phone?.message ||\n errors.phone?.message;\n\n return (\n <PhoneInput\n id=\"phone\"\n label=\"Telefone *\"\n placeholder=\"(11) 00000-0000\"\n error={errorMsg}\n required\n value={field.value.phone}\n onChange={field.onChange}\n name={field.name}\n labelTextColor={textColor}\n backgroundColor={inputBackgroundColor}\n borderColor={inputBorderColor}\n focusBorderColor={inputFocusBorderColor}\n inputPlaceholderColor={inputPlaceholderColor}\n inputTextColor={inputTextColor}\n />\n );\n }}\n />\n\n <h6>* Campos de preenchimento obrigatório.</h6>\n\n <ButtonContainer>\n <Button bgColor={buttonBackgroundColor} color={buttonTextColor} type=\"submit\" isSubmitting={loading}>\n Enviar mensagem\n </Button>\n </ButtonContainer>\n\n <p>A Mitre Realty respeita a sua privacidade e utiliza os seus dados pessoais para contatá-lo por e-mail ou telefone aqui registrados. Para saber mais, acesse a nossa{' '}\n <a\n href=\"https://www.mitrerealty.com.br/politica-de-privacidade\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n >\n Política de Privacidade\n </a>. Ao clicar em {'\"'}enviar{'\"'}, você concorda em permitir que a Mitre Realty, armazene e processe os dados pessoais fornecidos por você para finalidade informada</p>\n\n </Form>\n </FormContainer>\n </>\n );\n});\n\nMitreFormComponent.displayName = \"MitreFormComponent\";\n\nexport default MitreFormComponent;\n","import { useState } from \"react\";\n\nexport function useError() {\n const [error, setError] = useState<Error | null>(null);\n\n const handleError = (err: unknown) => {\n const errorObj = err instanceof Error ? err : new Error(String(err));\n setError(errorObj);\n console.error(errorObj);\n };\n\n const clearError = () => setError(null);\n\n return { error, handleError, clearError };\n}\n","type directionType = \"column\" | \"row\";\ntype alignItemsType = \"center\" | \"flex-start\";\n\ntype jutifyContentType = \"center\" | \"space-between\";\n\nexport function flex(\n direction: directionType = \"row\",\n alignItems?: alignItemsType,\n justifyContent?: jutifyContentType\n) {\n return `\n align-items:${alignItems || null};\n display:flex;\n flex-direction:${direction};\n justify-content:${justifyContent || null};\n `;\n}\n\nexport const alignX = `\n left:50%;\n transform:translateX(-50%);\n`;\n\nexport const alignXAndY = `\n left:50%;\n top:50%;\n transform:translate(-50%, -50%);\n`;\n\nexport const darkEffect = `\n &:hover {\n cursor:pointer;\n filter:brightness(98%);\n }\n\n &:active {\n filter:brightness(95%);\n }\n`;\n\nexport const opacityEffect = `\n &:hover {\n cursor:pointer;\n opacity:.9;\n }\n\n &:active {\n opacity:.7;\n }\n`;\n\nexport const modalZIndex = 9999;\n\nexport const breakpoints = {\n tablet: \"1024px\",\n};\n","import { flex, opacityEffect } from \"../styles/utils\";\nimport styled from \"styled-components\";\n\nexport const FormContainer = styled.div<{\n $backgroundColor: string;\n $innerPadding: string;\n}>`\n ${flex(\"column\")}\n align-items: stretch;\n justify-content: flex-start;\n overflow-x: hidden;\n overflow-y: auto;\n\n background: ${(props) => props.$backgroundColor || \"var(--gray-180)\"};\n\n padding: ${(props) => props.$innerPadding || \"1rem\"};\n\n /* Hide scrollbars for WebKit browsers */\n ::-webkit-scrollbar {\n display: none;\n }\n\n /* Hide scrollbars for Firefox */\n scrollbar-width: none;\n\n box-sizing: border-box;\n height: 100%;\n`;\n\nexport const HeaderContainer = styled.div`\n margin-bottom: 1rem;\n`;\n\nexport const ButtonContainer = styled.div`\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: 100%;\n margin-top: 0.75rem;\n\n button {\n ${opacityEffect}\n color: var(--black);\n font-weight: 600;\n border: none;\n border-radius: 8px;\n width: 60%;\n margin-top: 10px;\n margin-bottom: 10px;\n }\n`;\n\nexport const Form = styled.form<{ $textColor: string }>`\n label {\n font-weight: 700;\n }\n\n input {\n margin-bottom: 0.75rem;\n }\n\n p {\n font-family: \"Montserrat\", sans-serif;\n font-style: italic;\n font-weight: 200;\n font-size: 0.8rem;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n text-align: start;\n }\n\n a {\n font-family: \"Montserrat\", sans-serif;\n font-style: italic;\n font-weight: 200;\n font-size: 0.8rem;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n }\n\n h6 {\n text-align: start;\n margin-left: 10px;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n }\n\n & > div {\n margin-bottom: 10px;,\n }\n`;\n\nexport const Title = styled.h2<{ $textColor: string }>`\n font-size: 1.25rem;\n font-weight: 700;\n line-height: 24px;\n letter-spacing: 0em;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n`;\n\nexport const Text = styled.p<{ $textColor: string }>`\n font-size: 1rem;\n font-weight: 400;\n line-height: 23px;\n letter-spacing: 0em;\n margin-top: 10px;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n`;\n","import { createGlobalStyle } from \"styled-components\";\nimport React, { useEffect } from \"react\";\n\nexport const GlobalStyles = createGlobalStyle`\n :root {\n --red: #e52e4d;\n --white: #FFF;\n --black: #2F2F2F;\n --black-2:#1E1E1E;\n --alphaBlack: #000000;\n --black-2:#1E1E1E;\n --black-3:#353535;\n\n --yellow-400:#FFD789;\n --yellow-500: #F6C76B;\n --gray-40:#F0F0F0;\n --gray-45:#767676;\n --gray-50: #686A69;\n --gray-60: #8F8F8F;\n --gray-100: #B6B6B6;\n --gray-150: #B9B9B9;\n --gray-180: #CECECE;\n --gray-200: #D2D2D2;\n --gray-300: #EBEBEB;\n --gray-400: #ECECEC;\n --gray-500: #F4F4F4;\n --gray-550:#6F6F6F;\n --gray-600:#686868;\n --gray-700: #535353;\n --gray-800:#9D9D9D;\n --shadow-500: 0px 4px 8px rgba(91, 91, 91, 0.2);\n --green:#57C06E;\n --green-2:#2DCE68;\n --blue:#007BFF;\n\n --transparent: transparent;\n }\n\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n html {\n scroll-behavior: smooth;\n\n @media (max-width: 1080px) {\n font-size: 93.75%;\n }\n @media (max-width: 720px) {\n font-size: 87.5%;\n }\n }\n\n body {\n background: var(--white);\n -webkit-font-smoothing: antialiased;\n }\n\n body, input, textarea, select, button {\n font-family: \"Montserrat\", sans-serif;\n font-weight: 400;\n } \n\n h1, h2, h3, h4, h5, h6, strong {\n font-weight: 600;\n }\n\n button {\n cursor: pointer;\n }\n\n [disabled] {\n opacity: 0.6;\n cursor: not-allowed;\n }\n\n .hidden {\n overflow: hidden;\n }\n\n ::-webkit-scrollbar {\n -webkit-appearance: none;\n background: var(--gray-500);\n width: 6px;\n height: 10px;\n }\n\n ::-webkit-scrollbar-thumb {\n background-color: var(--gray-50);\n }\n\n .aligncenter {\n text-align: center;\n }\n\n .width-190px {\n width:190px;\n }\n\n .hidden-content {\n display:none !important;\n }\n\n .global-margin-bottom {\n margin-bottom:20px;\n }\n\n .background-light-gray {\n background:#F4F4F4;\n }\n\n .full-width-and-height {\n height:100%;\n width:100%;\n }\n\n .flex-direction-column {\n flex-direction:column;\n }\n\n .bold {\n font-weight:700;\n }\n\n .margin-center-x {\n margin:0 auto;\n }\n\n .border-none {\n border:none;\n }\n\n .text-center {\n text-align:center;\n }\n\n .relative {\n position:relative;\n }\n\n /* accessibility */\n body ._access-menu p._text-center{\n font-family: \"Montserrat\", sans-serif;\n font-style: italic;\n font-size: 1.2rem!important;\n margin-top: 6px;\n margin-bottom: 3px;\n } \n\n`;\n\nconst FontLoader: React.FC = () => {\n useEffect(() => {\n const link = document.createElement(\"link\");\n link.href =\n \"https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap\";\n link.rel = \"stylesheet\";\n document.head.appendChild(link);\n }, []);\n\n return null;\n};\n\nexport default FontLoader;\n","import {\n FormEvent,\n forwardRef,\n ForwardRefRenderFunction,\n InputHTMLAttributes,\n useCallback,\n} from \"react\";\nimport { FieldError } from \"react-hook-form\";\nimport { cep, cpf, currency, date } from \"./masks\";\n\nimport {\n FormControl,\n FormErrorMessage,\n FormLabel,\n Input as FormInput,\n} from \"./styles\";\n\ntype InputType =\n | \"text\"\n | \"email\"\n | \"password\"\n | \"number\"\n | \"tel\"\n | \"url\"\n | \"date\"\n | \"time\"\n | \"datetime-local\";\n\ninterface InputProps extends InputHTMLAttributes<HTMLInputElement> {\n id: string;\n label?: string;\n error?: string | FieldError;\n showErrorMessage?: boolean;\n labelTextColor?: string;\n backgroundColor?: string;\n borderColor?: string;\n focusBorderColor?: string;\n inputTextColor?: string;\n inputPlaceholderColor?: string;\n mask?: \"cep\" | \"currency\" | \"cpf\" | \"phone\" | \"date\";\n type?: InputType;\n}\n\nconst InputBase: ForwardRefRenderFunction<HTMLInputElement, InputProps> = (\n { id,\n label,\n error,\n showErrorMessage = true,\n labelTextColor,\n backgroundColor,\n borderColor,\n focusBorderColor,\n inputPlaceholderColor,\n inputTextColor,\n mask = \"\",\n type = \"text\",\n ...rest\n },\n ref\n) => {\n const handleKeyUp = useCallback(\n (e: FormEvent<HTMLInputElement>) => {\n if (mask === \"cep\") cep(e);\n if (mask === \"currency\") currency(e);\n if (mask === \"cpf\") cpf(e);\n if (mask === \"date\") date(e);\n },\n [mask]\n );\n\n return (\n <FormControl isInvalid={!!error}>\n {!!label && <FormLabel htmlFor={id} $textColor={labelTextColor}>{label}</FormLabel>}\n\n {!mask ? (\n <FormInput\n id={id}\n ref={ref}\n type={type}\n aria-invalid={!!error && showErrorMessage ? \"true\" : \"false\"}\n autoComplete={rest.autoComplete || \"on\"}\n $backgroundColor={backgroundColor}\n $borderColor={borderColor}\n $focusBorderColor={focusBorderColor}\n $placeholderColor={inputPlaceholderColor}\n $textColor={inputTextColor}\n {...rest}\n />\n ) : (\n <FormInput\n id={id}\n ref={ref}\n type={type}\n aria-invalid={!!error && showErrorMessage ? \"true\" : \"false\"}\n autoComplete={rest.autoComplete || \"on\"}\n onKeyUp={handleKeyUp}\n $backgroundColor={backgroundColor}\n $borderColor={borderColor}\n $focusBorderColor={focusBorderColor}\n $placeholderColor={inputPlaceholderColor}\n $textColor={inputTextColor}\n {...rest}\n />\n )}\n\n {!!error && showErrorMessage && (\n <FormErrorMessage data-testid=\"error-message\">\n {typeof error === 'string' ? error : error.message}\n </FormErrorMessage>\n )}\n </FormControl>\n );\n};\n\nexport const Input = forwardRef(InputBase);\n","import { FormEvent } from \"react\";\n\nexport function cep(e: FormEvent<HTMLInputElement>) {\n e.currentTarget.maxLength = 9;\n let value = e.currentTarget.value;\n value = value.replace(/\\D/g, \"\");\n value = value.replace(/^(\\d{5})(\\d)/, \"$1-$2\");\n e.currentTarget.value = value;\n return e;\n}\n\nexport function currency(e: FormEvent<HTMLInputElement>) {\n let value = e.currentTarget.value;\n value = value.replace(/\\D/g, \"\");\n value = value.replace(/(\\d)(\\d{2})$/, \"$1,$2\");\n value = value.replace(/(?=(\\d{3})+(\\D))\\B/g, \".\");\n\n e.currentTarget.value = value;\n return e;\n}\n\nexport function cpf(e: FormEvent<HTMLInputElement>) {\n e.currentTarget.maxLength = 14;\n let value = e.currentTarget.value;\n if (!value.match(/^(\\d{3}).(\\d{3}).(\\d{3})-(\\d{2})$/)) {\n value = value.replace(/\\D/g, \"\");\n value = value.replace(/(\\d{3})(\\d)/, \"$1.$2\");\n value = value.replace(/(\\d{3})(\\d)/, \"$1.$2\");\n value = value.replace(/(\\d{3})(\\d{2})$/, \"$1-$2\");\n\n e.currentTarget.value = value;\n }\n return e;\n}\n\nexport function date(e: FormEvent<HTMLInputElement>) {\n let value = e.currentTarget.value;\n value = value.replace(/\\D/g, \"\");\n value = value.replace(/(\\d{2})(\\d)/, \"$1/$2\");\n value = value.replace(/(\\d{2})(\\d)/, \"$1/$2\");\n e.currentTarget.value = value;\n return e;\n}\n\nexport function phone(e: FormEvent<HTMLInputElement>) {\n let value = e.currentTarget.value;\n value = value.replace(/\\D/g, \"\");\n value = value.replace(/(\\d{2})(\\d)/, \"$1/$2\");\n value = value.replace(/(\\d{2})(\\d)/, \"$1/$2\");\n e.currentTarget.value = value;\n return e;\n}\n","import { InputHTMLAttributes } from \"react\";\nimport styled, { css } from \"styled-components\";\n\nexport const FormLabel = styled.label<{ $textColor?: string }>`\n font-family: \"Montserrat\", sans-serif;\n font-style: normal;\n font-weight: 500;\n font-size: 1rem;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n display: block;\n margin-bottom: 0.5rem;\n text-align: left;\n`;\n\nexport const Input = styled.input<\n InputHTMLAttributes<HTMLInputElement> & { \n $backgroundColor?: string, \n $borderColor?: string, \n $focusBorderColor?: string, \n $placeholderColor?: string\n $textColor?: string,\n }\n>`\n font-family: \"Montserrat\", sans-serif;\n font-style: normal;\n font-weight: 500;\n font-size: 1rem;\n line-height: 1.5rem;\n background: ${(props) => props.$backgroundColor || \"var(--white)\"};\n color: ${(props) => props.$textColor || \"var(--black)\"};\n padding: 0.5rem;\n border-radius: 0.125rem;\n border: 1px solid ${(props) => props.$borderColor || \"transparent\"};\n display: block;\n height: 3.125rem;\n width: 100%;\n\n &:focus {\n border-radius: 0.125rem;\n border: 2px solid ${(props) => props.$focusBorderColor || \"var(--yellow-500)\"};\n outline: none;\n }\n\n &::placeholder {\n font-size: 1rem;\n line-height: 1.5rem;\n color: ${(props) => props.$placeholderColor || \"var(--gray-100)\"};\n font-weight: 800;\n }\n\n /* Autofill styles */\n &:-webkit-autofill {\n background: ${(props) => props.$backgroundColor || \"var(--white)\"} !important;\n color: ${(props) => props.$textColor || \"var(--black)\"} !important;\n -webkit-text-fill-color: ${(props) => props.$textColor || \"var(--black)\"} !important;\n transition: background-color 5000s ease-in-out 0s; /* Prevent flashing */\n }\n\n &:-webkit-autofill::first-line {\n font-family: \"Montserrat\", sans-serif;\n font-size: 1rem;\n font-weight: 500;\n }\n`;\n\nexport const FormErrorMessage = styled.small`\n font-size: 0.75rem;\n line-height: 1.125rem;\n color: var(--red);\n margin-top: 0.25rem;\n display: block;\n`;\n\nexport const FormControl = styled.div.withConfig({\n shouldForwardProp: (prop) => ![\"isInvalid\"].includes(prop),\n})<{ isInvalid?: boolean }>`\n ${FormLabel} {\n ${(props) =>\n props.isInvalid &&\n css`\n color: var(--red);\n `};\n }\n\n ${Input} {\n ${(props) =>\n props.isInvalid &&\n css`\n border: 1px solid var(--red);\n\n &:not(:focus)::placeholder {\n color: var(--red);\n font-weight: 600;\n }\n `};\n\n &:focus {\n ${(props) =>\n props.isInvalid &&\n css`\n border: 1px solid var(--red);\n `};\n }\n }\n`;\n","import { darken } from \"polished\";\nimport styled, { css } from \"styled-components\";\n\ntype ButtonProps = {\n hasIcon?: boolean;\n isSubmitting?: boolean;\n hasSubmittingMessage?: boolean;\n bgColor?: string;\n bordercolor?: string;\n color?: string;\n height?: string;\n};\n\nexport const Icon = styled.span`\n font-size: 0;\n line-height: 0;\n transition: all 0.25s ease;\n\n transform: translate3d(-30px, 0px, 0px);\n visibility: hidden;\n opacity: 0;\n margin-right: 0.625rem;\n`;\n\nexport const Text = styled.span`\n font-family: \"Montserrat\", sans-serif;\n font-size: 1rem;\n line-height: 1.5rem;\n margin-bottom: -2px;\n\n transition: all 0.25s ease;\n`;\n\nexport const TextSubmitting = styled.span`\n font-family: \"Montserrat\", sans-serif;\n font-weight: 400;\n font-size: 1rem;\n\n transition: all 0.25s ease;\n`;\n\nexport const LoadingIcon = styled.span.withConfig({\n shouldForwardProp: (prop) => prop !== \"hasText\",\n})<{ hasText?: boolean }>`\n display: block;\n\n width: 1rem;\n height: 1rem;\n border: 0.125rem solid var(--white);\n border-radius: 50%;\n animation: loadingAnimation 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n border-color: var(--white) transparent transparent transparent;\n\n margin-right: ${(props) => (props.hasText ? \"0.625rem\" : \"0\")};\n\n @keyframes loadingAnimation {\n 0% {\n transform: rotate(0deg);\n }\n 100% {\n transform: rotate(360deg);\n }\n }\n`;\n\nexport const Button = styled.button.withConfig({\n shouldForwardProp: (prop) =>\n ![\n \"hasIcon\",\n \"isSubmitting\",\n \"hasSubmittingMessage\",\n \"bgColor\",\n \"bordercolor\",\n \"color\",\n \"height\",\n ].includes(prop),\n})<ButtonProps>`\n background: ${(props) => darken(0.1, props?.bgColor || \"#F6C76B\")};\n color: ${(props) => props?.color || \"#2F2F2F\"};\n border: 1px solid ${(props) => darken(0.1, props?.bordercolor || \"#F6C76B\")};\n border-radius: 2px;\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n padding: 0 0.75rem;\n height: ${(props) => props?.height || \"3.125rem\"};\n position: relative;\n font-size: 0;\n line-height: 0;\n\n transition: all 0.25s;\n\n ${Icon} {\n display: ${(props) => (props?.hasIcon ? \"block\" : \"\")};\n }\n\n ${Text} {\n transform: ${(props) =>\n props?.hasIcon ? \"translate3d(-4.5px, 0px, 0px)\" : \"unset\"};\n\n @media print, screen and (min-width: 40em) {\n transform: ${(props) =>\n props?.hasIcon ? \"translate3d(-14.5px, 0px, 0px)\" : \"unset\"};\n }\n\n color: ${(props) => props?.color || \"#2F2F2F\"};\n }\n\n &:hover {\n background: ${(props) => darken(0.2, props?.bgColor || \"#F6C76B\")};\n border-color: ${(props) => darken(0.2, props?.bordercolor || \"#F6C76B\")};\n\n ${Icon} {\n opacity: 1;\n visibility: visible;\n transform: translate3d(0px, 0px, 0px);\n }\n\n ${Text} {\n transform: ${(props) =>\n props?.hasIcon ? \"translate3d(-5px, 0px, 0px)\" : \"unset\"};\n }\n }\n\n ${Text} {\n ${(props) =>\n props.isSubmitting &&\n !props.hasSubmittingMessage &&\n css`\n transform: unset;\n opacity: 0;\n `}\n }\n\n ${LoadingIcon} {\n ${(props) =>\n props.isSubmitting &&\n !props.hasSubmittingMessage &&\n css`\n display: flex;\n -webkit-box-align: center;\n align-items: center;\n position: absolute;\n `}\n }\n`;\n","import { ButtonHTMLAttributes, ReactElement, ReactNode } from \"react\";\n\nimport {\n Button as ButtonComponent,\n Icon,\n LoadingIcon,\n Text,\n TextSubmitting,\n} from \"./styles\";\n\ntype ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n children: ReactNode;\n icon?: ReactElement;\n isSubmitting?: boolean;\n submittingMessage?: string;\n bgColor?: string;\n bordercolor?: string;\n color?: string;\n height?: string;\n};\n\nexport function Button({\n children,\n icon,\n isSubmitting = false,\n submittingMessage = \"\",\n disabled = false,\n color = \"var(--black)\",\n ...rest\n}: ButtonProps) {\n return (\n <ButtonComponent\n isSubmitting={isSubmitting}\n hasSubmittingMessage={submittingMessage.length > 0}\n disabled={isSubmitting || disabled}\n aria-disabled={isSubmitting || disabled}\n hasIcon={!!icon}\n color={color}\n {...rest}\n >\n {icon && !isSubmitting && <Icon data-testid=\"button-icon\">{icon}</Icon>}\n {isSubmitting && <LoadingIcon hasText={submittingMessage.length > 0} />}\n {(!isSubmitting || submittingMessage.length === 0) && (\n <Text className=\"text\">{children}</Text>\n )}\n {isSubmitting && submittingMessage.length > 0 && (\n <TextSubmitting>{submittingMessage}</TextSubmitting>\n )}\n </ButtonComponent>\n );\n}\n","import React, { useEffect, useState, useCallback } from 'react';\nimport { AlertContainer, DismissButton } from './styles';\nimport { AlertType } from './styles';\n\nimport { HiX } from 'react-icons/hi';\n\ninterface AlertProps {\n type?: AlertType;\n children: React.ReactNode;\n className?: string;\n dismissible?: boolean;\n onDismiss?: () => void;\n autoDismiss?: number;\n}\n\nexport const Alert = ({\n type = 'info',\n children,\n className,\n dismissible = false,\n onDismiss,\n autoDismiss\n}: AlertProps) => {\n const [isClosing, setIsClosing] = useState(false);\n\n const handleDismiss = useCallback(() => {\n setIsClosing(true);\n setTimeout(() => onDismiss?.(), 300);\n }, [onDismiss]);\n\n useEffect(() => {\n if (autoDismiss) {\n const timer = setTimeout(handleDismiss, autoDismiss);\n return () => clearTimeout(timer);\n }\n }, [autoDismiss, handleDismiss]);\n\n return (\n <AlertContainer\n $type={type}\n $dismissible={dismissible}\n $isClosing={isClosing}\n className={className}\n role=\"alert\"\n >\n {children}\n {dismissible && (\n <DismissButton \n onClick={handleDismiss} \n aria-label=\"Dismiss alert\"\n >\n <HiX /> \n </DismissButton>\n )}\n </AlertContainer>\n );\n};","import styled, { css, keyframes } from \"styled-components\";\n\nexport type AlertType = \"error\" | \"warning\" | \"info\" | \"success\";\n\nconst fadeIn = keyframes`\n from { opacity: 0; transform: translateY(-10px); }\n to { opacity: 1; transform: translateY(0); }\n`;\n\nconst fadeOut = keyframes`\n from { opacity: 1; transform: translateY(0); }\n to { opacity: 0; transform: translateY(-10px); }\n`;\n\ninterface AlertContainerProps {\n $type: AlertType;\n $dismissible?: boolean;\n $isClosing: boolean;\n}\n\nconst typeStyles = {\n error: css`\n background-color: var(--red);\n border: 1px solid var(--red);\n color: var(--white);\n svg {\n color: var(--white);\n }\n `,\n warning: css`\n background-color: var(--yellow-500);\n border: 1px solid var(--yellow-400);\n color: var(--black);\n svg {\n color: var(--black);\n }\n `,\n info: css`\n background-color: var(--blue);\n border: 1px solid var(--blue);\n color: var(--white);\n svg {\n color: var(--white);\n }\n `,\n success: css`\n background-color: var(--green);\n border: 1px solid var(--green-2);\n color: var(--white);\n svg {\n color: var(--white);\n }\n `,\n};\n\nexport const AlertContainer = styled.div<AlertContainerProps>`\n position: fixed;\n width: 500px;\n top: 15px;\n right: 15px;\n padding: 1rem ${({ $dismissible }) => ($dismissible ? \"2.5rem\" : \"1rem\")} 1rem\n 1rem;\n margin-bottom: 1rem;\n animation: ${({ $isClosing }) => ($isClosing ? fadeOut : fadeIn)} 0.3s\n ease-out;\n animation-fill-mode: forwards;\n align-items: center;\n gap: 0.5rem;\n box-shadow: var(--shadow-500);\n border-radius: 0.5rem;\n font-size: 1rem;\n font-weight: 500;\n\n ${({ $type }) => typeStyles[$type]}\n`;\n\nexport const DismissButton = styled.button`\n position: absolute;\n background: transparent;\n right: 10px;\n border: none;\n cursor: pointer;\n color: inherit;\n opacity: 1;\n transition: opacity 0.2s;\n\n &:hover {\n opacity: 0.7;\n }\n\n svg {\n width: 1rem;\n height: 1rem;\n }\n`;\n","import {\n forwardRef,\n ForwardRefRenderFunction,\n InputHTMLAttributes,\n} from \"react\";\nimport { FieldError } from \"react-hook-form\";\nimport { StyledPhoneInput, FormControl, FormLabel, FormErrorMessage } from \"./styles\";\nimport { PhoneInputRefType, ParsedCountry } from \"react-international-phone\";\n\ninterface PhoneInputChange {\n phone: string;\n dialCode: string;\n inputValue: string;\n}\n\ninterface PhoneInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'value'> {\n id: string;\n label?: string;\n error?: string | FieldError;\n showErrorMessage?: boolean;\n value: string;\n onChange?: (value: PhoneInputChange) => void;\n labelTextColor?: string;\n backgroundColor?: string;\n borderColor?: string;\n focusBorderColor: string;\n inputPlaceholderColor?: string;\n inputTextColor?: string;\n}\n\nconst PhoneInputBase: ForwardRefRenderFunction<PhoneInputRefType, PhoneInputProps> = (\n { id,\n label,\n error,\n showErrorMessage = true,\n labelTextColor,\n backgroundColor,\n borderColor,\n focusBorderColor,\n inputPlaceholderColor,\n inputTextColor,\n value,\n ...rest\n },\n ref\n) => {\n return (\n <FormControl isInvalid={!!error} >\n {!!label && <FormLabel htmlFor={id} $textColor={labelTextColor}>{label}</FormLabel>}\n <StyledPhoneInput\n ref={ref}\n defaultCountry=\"br\"\n disableCountryGuess={true}\n disableDialCodeAndPrefix={true}\n showDisabledDialCodeAndPrefix={false}\n placeholder={rest.placeholder}\n aria-invalid={!!error && showErrorMessage ? \"true\" : \"false\"}\n value={String(value)}\n onChange={(phone: string, meta: { country: ParsedCountry; inputValue: string }) => {\n if (typeof rest.onChange === \"function\") {\n rest.onChange({\n phone,\n dialCode: meta.country.dialCode,\n inputValue: meta.inputValue,\n });\n }\n }}\n inputProps={{\n id,\n name: rest.name || 'phone',\n required: rest.required,\n autoFocus: rest.autoFocus,\n autoComplete: rest.autoComplete || \"tel\",\n }}\n $backgroundColor={backgroundColor}\n $borderColor={borderColor}\n $focusBorderColor={focusBorderColor}\n $placeholderColor={inputPlaceholderColor}\n $textColor={inputTextColor}\n />\n {!!error && showErrorMessage && (\n <FormErrorMessage data-testid=\"error-message\">\n {typeof error === 'string' ? error : error?.message}\n </FormErrorMessage>\n )}\n </FormControl>\n );\n};\n\nexport const PhoneInput = forwardRef(PhoneInputBase);\n","import styled, { css } from \"styled-components\";\nimport { PhoneInput } from \"react-international-phone\";\nimport \"react-international-phone/style.css\";\n\nexport const FormLabel = styled.label<{ $textColor?: string }>`\n font-family: \"Montserrat\", sans-serif;\n font-style: normal;\n font-weight: 500;\n font-size: 1rem;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n display: block;\n margin-bottom: 0.5rem;\n text-align: left;\n`;\n\nexport const StyledPhoneInput = styled(PhoneInput)<{ \n $backgroundColor?: string, \n $borderColor?: string, \n $focusBorderColor?: string, \n $placeholderColor?: string\n $textColor?: string,\n}>`\n width: 100%;\n height: 3.125rem;\n background: ${(props) => props.$backgroundColor || \"var(--white)\"};\n font-family: \"Montserrat\", sans-serif;\n border: 1px solid ${(props) => props.$borderColor || \"transparent\"};\n border-radius: 0.125rem;\n\n &:focus-within {\n border-radius: 0.125rem;\n border: 2px solid ${(props) => props.$focusBorderColor || \"var(--yellow-500)\"};\n outline: none;\n\n .react-international-phone-country-selector-button {\n border-right: 1px solid ${(props) => props.$focusBorderColor || \"var(--yellow-500)\"};\n }\n }\n\n /* Style for the inner phone input container */\n .react-international-phone-input-container {\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n overflow: hidden;\n font-family: \"Montserrat\", sans-serif;\n font-size: 1rem;\n font-weight: 500;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n background: ${(props) => props.$backgroundColor || \"var(--white)\"};\n }\n\n /* Style for the country selector button */\n .react-international-phone-country-selector-button {\n height: 100%;\n background: ${(props) => props.$backgroundColor || \"var(--white)\"};\n display: flex;\n align-items: center;\n justify-content: center;\n font-family: \"Montserrat\", sans-serif;\n font-size: 1rem;\n font-weight: 500;\n cursor: pointer;\n outline: none;\n border: none;\n border-right: 1px solid ${(props) => props.$borderColor || \"var(--transparent)\"};\n }\n\n /* Style for the input itself */\n input.react-international-phone-input {\n flex: 1;\n height: 100%;\n padding: 0 0.5rem;\n margin: 0;\n background: ${(props) => props.$backgroundColor || \"var(--white)\"};\n font-family: \"Montserrat\", sans-serif;\n font-style: normal;\n font-weight: 500;\n font-size: 1rem;\n line-height: 1.5rem;\n color: ${(props) => props.$textColor || \"var(--black)\"};\n outline: none;\n border: none;\n border-radius: 0.125rem;\n\n &::placeholder {\n font-size: 1rem;\n line-height: 1.5rem;\n color: ${(props) => props.$placeholderColor || \"var(--gray-100)\"};\n font-weight: 800;\n }\n\n &:-webkit-autofill {\n background: ${(props) => props.$backgroundColor || \"var(--white)\"} !important;\n -webkit-text-fill-color: ${(props) => props.$textColor || \"var(--black)\"} !important;\n transition: background-color 5000s ease-in-out 0s;\n }\n\n &:-webkit-autofill::first-line {\n font-family: \"Montserrat\", sans-serif;\n font-size: 1rem;\n font-weight: 500;\n }\n }\n`;\n\nexport const FormErrorMessage = styled.small`\n font-size: 0.75rem;\n line-height: 1.125rem;\n color: var(--red);\n margin-top: 0.25rem;\n display: block;\n`;\n\nexport const FormControl = styled.div.withConfig({\n shouldForwardProp: (prop) => ![\"isInvalid\"].includes(prop),\n})<{ isInvalid?: boolean }>`\n ${FormLabel} {\n ${(props) =>\n props.isInvalid &&\n css`\n color: var(--red);\n `};\n }\n\n ${StyledPhoneInput} {\n ${(props) =>\n props.isInvalid &&\n css`\n border: 1px solid var(--red);\n\n &:not(:focus)::placeholder {\n color: var(--red);\n font-weight: 600;\n }\n `};\n\n .react-international-phone-input-container {\n ${(props) =>\n props.isInvalid &&\n css`\n border: 1px solid var(--red);\n\n &:not(:focus)::placeholder {\n color: var(--red);\n font-weight: 600;\n }\n `};\n }\n\n .react-international-phone-country-selector-button {\n ${(props) =>\n props.isInvalid &&\n css`\n border-right: 1px solid var(--red);\n `};\n }\n }\n`;\n"],"mappings":"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","names":["import_react","styled","import_styled_components","import_react","import_react","import_styled_components","styled","Input","import_styled_components","styled","Text","import_jsx_runtime","Button","Text","import_react","import_styled_components","styled","import_jsx_runtime","import_react","import_styled_components","FormLabel","styled","FormErrorMessage","FormControl","import_jsx_runtime","FormControl","FormLabel","FormErrorMessage","PhoneInput","import_jsx_runtime","React","Input","PhoneInput","Button"]}