@pipelinesolucoes/form 1.2.0-beta.1 → 1.2.0-beta.12

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 (69) hide show
  1. package/dist/components/NotificationSnackbar.d.ts +1 -2
  2. package/dist/components/NotificationSnackbar.js +1 -1
  3. package/dist/components/NotificationSnackbar.js.map +1 -1
  4. package/dist/components/SelectField.d.ts +73 -0
  5. package/dist/components/SelectField.js +141 -0
  6. package/dist/components/SelectField.js.map +1 -0
  7. package/dist/components/TextFieldPassword.d.ts +144 -76
  8. package/dist/components/TextFieldPassword.js +163 -102
  9. package/dist/components/TextFieldPassword.js.map +1 -1
  10. package/dist/components/TextFieldValidate.d.ts +88 -43
  11. package/dist/components/TextFieldValidate.js +100 -93
  12. package/dist/components/TextFieldValidate.js.map +1 -1
  13. package/dist/components/login/ClickResult.d.ts +11 -0
  14. package/dist/components/login/ClickResult.js +2 -0
  15. package/dist/components/login/ClickResult.js.map +1 -0
  16. package/dist/components/login/FormLogin.d.ts +113 -124
  17. package/dist/components/login/FormLogin.js +137 -124
  18. package/dist/components/login/FormLogin.js.map +1 -1
  19. package/dist/components/login/FormPasswordRecovery.d.ts +97 -110
  20. package/dist/components/login/FormPasswordRecovery.js +132 -105
  21. package/dist/components/login/FormPasswordRecovery.js.map +1 -1
  22. package/dist/components/login/FormSignUp.d.ts +114 -127
  23. package/dist/components/login/FormSignUp.js +138 -134
  24. package/dist/components/login/FormSignUp.js.map +1 -1
  25. package/dist/components/login/GoogleButton.d.ts +1 -4
  26. package/dist/components/login/GoogleButton.js.map +1 -1
  27. package/dist/components/login/StyleLogin.d.ts +14 -0
  28. package/dist/components/login/StyleLogin.js +57 -0
  29. package/dist/components/login/StyleLogin.js.map +1 -0
  30. package/dist/components/{FormStyled.d.ts → recaptcha/FormStyled.d.ts} +0 -7
  31. package/dist/components/{FormStyled.js → recaptcha/FormStyled.js} +0 -13
  32. package/dist/components/recaptcha/FormStyled.js.map +1 -0
  33. package/dist/components/recaptcha/RecaptchaForm.js +1 -1
  34. package/dist/components/recaptcha/RecaptchaForm.js.map +1 -1
  35. package/dist/constant.d.ts +9 -0
  36. package/dist/constant.js +10 -0
  37. package/dist/constant.js.map +1 -0
  38. package/dist/index.d.ts +1 -4
  39. package/dist/index.js +1 -0
  40. package/dist/index.js.map +1 -1
  41. package/dist/style/ButtonFormStyled.js +22 -0
  42. package/dist/style/ButtonFormStyled.js.map +1 -0
  43. package/dist/style/LinkFormStyled.d.ts +7 -0
  44. package/dist/style/LinkFormStyled.js +15 -0
  45. package/dist/style/LinkFormStyled.js.map +1 -0
  46. package/dist/style/TextFieldStyle.d.ts +16 -0
  47. package/dist/style/TextFieldStyle.js +57 -0
  48. package/dist/style/TextFieldStyle.js.map +1 -0
  49. package/dist/theme.js +46 -18
  50. package/dist/theme.js.map +1 -1
  51. package/dist/tsconfig.tsbuildinfo +1 -1
  52. package/dist/types/FieldProps.d.ts +4 -0
  53. package/package.json +5 -3
  54. package/dist/components/ButtonFormStyled.js +0 -22
  55. package/dist/components/ButtonFormStyled.js.map +0 -1
  56. package/dist/components/FormStyled.js.map +0 -1
  57. package/dist/types/BorderProps.d.ts +0 -6
  58. package/dist/types/BorderProps.js +0 -2
  59. package/dist/types/BorderProps.js.map +0 -1
  60. package/dist/types/ColorProps.d.ts +0 -9
  61. package/dist/types/ColorProps.js +0 -2
  62. package/dist/types/ColorProps.js.map +0 -1
  63. package/dist/types/LayoutProps.d.ts +0 -7
  64. package/dist/types/LayoutProps.js +0 -2
  65. package/dist/types/LayoutProps.js.map +0 -1
  66. package/dist/types/TextProps.d.ts +0 -5
  67. package/dist/types/TextProps.js +0 -2
  68. package/dist/types/TextProps.js.map +0 -1
  69. /package/dist/{components → style}/ButtonFormStyled.d.ts +0 -0
@@ -1,112 +1,160 @@
1
1
  'use client';
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
3
  import React from 'react';
4
- import TextField from '@mui/material/TextField';
5
4
  import InputAdornment from '@mui/material/InputAdornment';
6
5
  import IconButton from '@mui/material/IconButton';
7
6
  import VisibilityIcon from '@mui/icons-material/Visibility';
8
7
  import VisibilityOffIcon from '@mui/icons-material/VisibilityOff';
9
- import { styled } from '@mui/material/styles';
10
- const StyledTextField = styled(TextField, {
11
- shouldForwardProp: (prop) => ![
12
- 'background',
13
- 'borderRadius',
14
- 'boxShadow',
15
- 'borderColor',
16
- 'colorFocused',
17
- 'backgroundDisabled',
18
- 'colorDisabled',
19
- 'padding',
20
- 'colorText',
21
- ].includes(prop),
22
- })(({ theme, background, backgroundDisabled, colorText, borderRadius, boxShadow, borderColor, colorFocused, colorDisabled, padding, }) => {
23
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
24
- const field = (_b = (_a = theme.pipelinesolucoes) === null || _a === void 0 ? void 0 : _a.forms) === null || _b === void 0 ? void 0 : _b.field;
25
- const bg = (_c = background !== null && background !== void 0 ? background : field === null || field === void 0 ? void 0 : field.background) !== null && _c !== void 0 ? _c : 'transparent';
26
- const bgDisabled = (_d = backgroundDisabled !== null && backgroundDisabled !== void 0 ? backgroundDisabled : field === null || field === void 0 ? void 0 : field.backgroundDisabled) !== null && _d !== void 0 ? _d : bg;
27
- const txt = (_e = colorText !== null && colorText !== void 0 ? colorText : field === null || field === void 0 ? void 0 : field.color) !== null && _e !== void 0 ? _e : theme.palette.text.primary;
28
- const txtDisabled = (_f = colorDisabled !== null && colorDisabled !== void 0 ? colorDisabled : field === null || field === void 0 ? void 0 : field.colorDisabled) !== null && _f !== void 0 ? _f : theme.palette.text.disabled;
29
- const br = (_g = borderRadius !== null && borderRadius !== void 0 ? borderRadius : field === null || field === void 0 ? void 0 : field.borderRadius) !== null && _g !== void 0 ? _g : '8px';
30
- const sh = (_h = boxShadow !== null && boxShadow !== void 0 ? boxShadow : field === null || field === void 0 ? void 0 : field.boxShadow) !== null && _h !== void 0 ? _h : 'none';
31
- const bd = (_j = borderColor !== null && borderColor !== void 0 ? borderColor : field === null || field === void 0 ? void 0 : field.borderColor) !== null && _j !== void 0 ? _j : theme.palette.divider;
32
- const bdFocused = (_k = colorFocused !== null && colorFocused !== void 0 ? colorFocused : field === null || field === void 0 ? void 0 : field.colorFocused) !== null && _k !== void 0 ? _k : theme.palette.primary.main;
33
- const pad = padding !== null && padding !== void 0 ? padding : field === null || field === void 0 ? void 0 : field.padding;
34
- return {
35
- background: bg,
36
- borderRadius: br,
37
- boxShadow: sh,
38
- paddingRight: '16px',
39
- '& .MuiInputBase-root': {
40
- color: txt,
41
- },
42
- '& .MuiOutlinedInput-root': Object.assign(Object.assign({ borderRadius: br, boxShadow: sh }, (pad ? { padding: pad } : {})), { '& .MuiOutlinedInput-notchedOutline': {
43
- borderColor: bd,
44
- }, '&:hover .MuiOutlinedInput-notchedOutline': {
45
- borderColor: bd,
46
- }, '&.Mui-focused .MuiOutlinedInput-notchedOutline': {
47
- borderColor: bdFocused,
48
- }, '&.Mui-disabled': {
49
- background: bgDisabled,
50
- color: txtDisabled,
51
- '& .MuiOutlinedInput-notchedOutline': {
52
- borderColor: bd,
53
- },
54
- }, '& input.Mui-disabled': {
55
- WebkitTextFillColor: txtDisabled,
56
- } }),
57
- '& .MuiInputLabel-root': {
58
- color: txt,
59
- },
60
- '& .MuiInputLabel-root.Mui-focused': {
61
- color: bdFocused,
62
- },
63
- '& .MuiInputLabel-root.Mui-disabled': {
64
- color: txtDisabled,
65
- },
66
- };
67
- });
8
+ import { useTheme } from '@mui/material/styles';
9
+ import { TextFieldStyled } from '../style/TextFieldStyle';
10
+ import { fbbackground, fbbackgroundDisabled, fbborderColor, fbborderRadius, fbboxShadow, fbcolor, fbcolorDisabled, fbcolorFocused, fbpadding } from '@/constant';
68
11
  /**
69
12
  * Componente de campo de senha baseado no TextField do Material UI, com botão para alternar
70
- * entre mostrar/ocultar a senha. O componente:
71
- * - Retorna somente a senha digitada via `onPasswordChange`
72
- * - Valida obrigatório + formato (regex) e exibe mensagens de erro automaticamente
73
- * - Dispara um "evento" de validação via `onValidationChange`
74
- *
75
- * @param {string} [id] ID do input.
76
- * @param {string} [label] Label do campo.
77
- * @param {string} [placeholder] Placeholder do input.
78
- * @param {string} [value] Valor controlado do campo.
79
- * @param {boolean} [required=true] Se true, valida senha obrigatória.
80
- * @param {RegExp} [passwordPattern=/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[^A-Za-z0-9]).{8,}$/] Regex para validar formato.
81
- * @param {string} [requiredMessage='Senha obrigatória'] Mensagem para campo vazio.
82
- * @param {string} [invalidMessage='Senha inválida'] Mensagem para formato inválido.
83
- * @param {'blur' | 'change' | 'both'} [validateOn='blur'] Quando validar.
84
- * @param {(password: string) => void} [onPasswordChange] Retorna somente a senha digitada.
85
- * @param {(result: PasswordValidationResult) => void} [onValidationChange] Evento com resultado completo da validação.
86
- * @param {(event: React.ChangeEvent<HTMLInputElement>) => void} [onChange] onChange nativo (opcional).
87
- * @param {(event: React.FocusEvent<HTMLInputElement>) => void} [onBlur] onBlur nativo (opcional).
13
+ * entre mostrar e ocultar a senha.
14
+ *
15
+ * O componente oferece:
16
+ * - Retorno apenas do valor da senha digitada via `onPasswordChange`
17
+ * - Validação automática de obrigatoriedade e formato (Regex)
18
+ * - Exibição controlada de mensagens de erro
19
+ * - Evento de validação completo via `onValidationChange`
20
+ * - Estilização via props com fallback para tokens do theme da Pipeline
21
+ *
22
+ * ---
23
+ *
24
+ * ### Tokens de estilo (ordem de prioridade)
25
+ *
26
+ * Para propriedades visuais, o componente resolve os valores nesta ordem:
27
+ * 1. **Props do componente**
28
+ * 2. **Theme da Pipeline** (`theme.pipelinesolucoes.forms.field`)
29
+ * 3. **Fallback interno** (valores padrão do componente)
30
+ *
31
+ * ---
32
+ *
33
+ * ### Tipografia
34
+ *
35
+ * A tipografia do texto digitado e do placeholder pode ser definida de duas formas:
36
+ *
37
+ * 1. **Material UI**
38
+ * Ao informar `textVariant`, o componente utiliza `theme.typography[textVariant]`.
39
+ *
40
+ * 2. **Theme da Pipeline**
41
+ * Quando `textVariant` não é informado, utiliza `theme.pipelinesolucoes.forms.field.typography`.
42
+ *
43
+ * **Ordem de prioridade (tipografia):**
44
+ * 1. `textVariant` (prop do componente)
45
+ * 2. `theme.typography[textVariant]` (Material UI)
46
+ * 3. `theme.pipelinesolucoes.forms.field.typography` (Pipeline)
47
+ * 4. Fallback interno (`theme.typography.body1`)
48
+ *
49
+ * ---
50
+ *
51
+ * @param {string} [id]
52
+ * ID do input.
53
+ *
54
+ * @param {string} [label]
55
+ * Label exibido no campo.
56
+ *
57
+ * @param {string} [placeholder]
58
+ * Texto de placeholder do input.
59
+ *
60
+ * @param {string} [value]
61
+ * Valor controlado do campo.
62
+ *
63
+ * @param {import('@mui/material/styles').TypographyVariant} [textVariant]
64
+ * Variante de tipografia do Material UI aplicada ao texto digitado e ao placeholder.
65
+ * Quando omitida, utiliza a tipografia do theme da Pipeline (`theme.pipelinesolucoes.forms.field.typography`).
66
+ *
67
+ * ---
68
+ * ### Estilo / Aparência
69
+ *
70
+ * @param {string} [background]
71
+ * Cor de fundo do campo.
72
+ * Ordem: `background` → `theme.pipelinesolucoes.forms.field.background` → `#fff`.
73
+ *
74
+ * @param {string} [backgroundDisabled]
75
+ * Cor de fundo do campo quando desabilitado.
76
+ * Ordem: `backgroundDisabled` → `theme.pipelinesolucoes.forms.field.backgroundDisabled` → `#E5E7EB`.
77
+ *
78
+ * @param {string} [color]
79
+ * Cor do texto do campo (texto digitado e label).
80
+ * Ordem: `color` → `theme.pipelinesolucoes.forms.field.color` → `#000`.
81
+ *
82
+ * @param {string} [colorFocused]
83
+ * Cor aplicada ao estado focado (usada como cor de borda no focus).
84
+ * Ordem: `colorFocused` → `theme.pipelinesolucoes.forms.field.colorFocused` → `#1976d2`.
85
+ *
86
+ * @param {string} [colorDisabled]
87
+ * Cor do texto do campo quando desabilitado.
88
+ * Ordem: `colorDisabled` → `theme.pipelinesolucoes.forms.field.colorDisabled` → `#9CA3AF`.
89
+ *
90
+ * @param {string} [borderRadius]
91
+ * Raio da borda do campo.
92
+ * Ordem: `borderRadius` → `theme.pipelinesolucoes.forms.field.borderRadius` → `"0"`.
93
+ *
94
+ * @param {string} [boxShadow]
95
+ * Sombra do campo.
96
+ * Ordem: `boxShadow` → `theme.pipelinesolucoes.forms.field.boxShadow` → `"none"`.
97
+ *
98
+ * @param {string} [borderColor]
99
+ * Cor da borda do campo (estado padrão/hover).
100
+ * Ordem: `borderColor` → `theme.pipelinesolucoes.forms.field.borderColor` → `#ccc`.
101
+ *
102
+ * @param {string} [padding]
103
+ * Espaçamento interno do input (aplicado no texto e textarea).
104
+ * Ordem: `padding` → `theme.pipelinesolucoes.forms.field.padding` → `"4px 8px"`.
105
+ *
106
+ * ---
107
+ * ### Validação
108
+ *
109
+ * @param {boolean} [required=true]
110
+ * Define se o campo é obrigatório.
111
+ *
112
+ * @param {RegExp} [pattern=/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[^A-Za-z0-9]).{8,}$/]
113
+ * Expressão regular usada para validar o formato da senha.
114
+ *
115
+ * @param {string} [requiredMessage='Senha obrigatória']
116
+ * Mensagem exibida quando o campo obrigatório está vazio.
117
+ *
118
+ * @param {string} [patternMessage]
119
+ * Mensagem exibida quando a senha não atende ao formato definido.
120
+ *
121
+ * @param {'blur' | 'change' | 'both'} [showErrorOn='blur']
122
+ * Define quando a validação e exibição de erros deve ocorrer.
123
+ *
124
+ * @param {boolean} [disabled=false]
125
+ * Desabilita o campo.
126
+ *
127
+ * ---
128
+ * ### Eventos
129
+ *
130
+ * @param {(password: string) => void} [onPasswordChange]
131
+ * Callback que retorna apenas o valor da senha digitada.
132
+ *
133
+ * @param {(result: PasswordValidationResult) => void} [onValidationChange]
134
+ * Callback disparado sempre que a validação é executada, contendo o resultado completo.
135
+ *
136
+ * @param {(event: React.ChangeEvent<HTMLInputElement>) => void} [onChange]
137
+ * Evento `onChange` nativo do input (opcional).
138
+ *
139
+ * @param {(event: React.FocusEvent<HTMLInputElement>) => void} [onBlur]
140
+ * Evento `onBlur` nativo do input (opcional).
141
+ *
142
+ * ---
88
143
  *
89
144
  * @example
90
145
  * ```tsx
91
- * import React from 'react';
92
- * import { TextFieldPassword } from '@/components/TextFieldPassword';
93
- *
94
- * const Example = () => {
95
- * const [password, setPassword] = React.useState('');
96
- *
97
- * return (
98
- * <TextFieldPassword
99
- * label="Senha"
100
- * value={password}
101
- * onPasswordChange={(p) => setPassword(p)}
102
- * onValidationChange={(r) => console.log(r)}
103
- * validateOn="both"
104
- * />
105
- * );
106
- * };
146
+ * <TextFieldPassword
147
+ * label="Senha"
148
+ * background="#fff"
149
+ * borderRadius="10px"
150
+ * textVariant="body2"
151
+ * showErrorOn="both"
152
+ * onPasswordChange={(password) => console.log(password)}
153
+ * />
107
154
  * ```
108
155
  */
109
- const TextFieldPassword = ({ id, label, placeholder, value, onPasswordChange, onValidationChange, required = true, passwordPattern = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[^A-Za-z0-9]).{8,}$/, requiredMessage = 'Senha obrigatória', invalidMessage = 'Senha inválida', validateOn = 'blur', background = '#fff', backgroundDisabled = '#E5E7EB', color = '#000', colorFocused = '#1976d2', colorDisabled = '#9CA3AF', borderRadius = '0', boxShadow = 'none', borderColor = '#ccc', disabled = false, padding = '4px 8px', onChange, onBlur, }) => {
156
+ const TextFieldPassword = ({ id, label, placeholder, value, onPasswordChange, onValidationChange, disabled = false, required = true, pattern = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[^A-Za-z0-9]).{8,}$/, requiredMessage = 'Senha obrigatória', patternMessage = 'A senha deve ter no mínimo 8 caracteres, com ao menos uma letra maiúscula, uma letra minúscula, um número e um caractere especial.', showErrorOn = 'blur', background, backgroundDisabled, color, colorFocused, colorDisabled, borderRadius, boxShadow, borderColor, padding, textVariant, onChange, onBlur, }) => {
157
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
110
158
  const [showPassword, setShowPassword] = React.useState(false);
111
159
  const [touched, setTouched] = React.useState(false);
112
160
  // fallback interno caso o usuário não use `value`
@@ -121,15 +169,15 @@ const TextFieldPassword = ({ id, label, placeholder, value, onPasswordChange, on
121
169
  if (required && trimmed.length === 0) {
122
170
  return { isValid: false, status: 'required', message: requiredMessage, value: nextValue };
123
171
  }
124
- if (trimmed.length > 0 && passwordPattern && !passwordPattern.test(trimmed)) {
125
- return { isValid: false, status: 'invalid', message: invalidMessage, value: nextValue };
172
+ if (trimmed.length > 0 && pattern && !pattern.test(trimmed)) {
173
+ return { isValid: false, status: 'invalid', message: patternMessage, value: nextValue };
126
174
  }
127
175
  // se não é required e está vazio, consideramos "idle" (sem erro)
128
176
  if (!required && trimmed.length === 0) {
129
177
  return { isValid: true, status: 'idle', message: '', value: nextValue };
130
178
  }
131
179
  return { isValid: true, status: 'valid', message: '', value: nextValue };
132
- }, [invalidMessage, passwordPattern, required, requiredMessage]);
180
+ }, [patternMessage, pattern, required, requiredMessage]);
133
181
  const emitValidation = React.useCallback((nextValue) => {
134
182
  const result = computeValidation(nextValue);
135
183
  if (onValidationChange)
@@ -137,8 +185,8 @@ const TextFieldPassword = ({ id, label, placeholder, value, onPasswordChange, on
137
185
  return result;
138
186
  }, [computeValidation, onValidationChange]);
139
187
  const [validation, setValidation] = React.useState(() => computeValidation(currentValue));
140
- const shouldValidateOnChange = validateOn === 'change' || validateOn === 'both';
141
- const shouldValidateOnBlur = validateOn === 'blur' || validateOn === 'both';
188
+ const shouldValidateOnChange = showErrorOn === 'change' || showErrorOn === 'both';
189
+ const shouldValidateOnBlur = showErrorOn === 'blur' || showErrorOn === 'both';
142
190
  const handleChange = (event) => {
143
191
  const nextValue = event.target.value;
144
192
  // atualiza interno caso não seja controlado
@@ -167,9 +215,22 @@ const TextFieldPassword = ({ id, label, placeholder, value, onPasswordChange, on
167
215
  };
168
216
  const shouldShowError = touched && !validation.isValid && validation.status !== 'idle';
169
217
  const helperText = shouldShowError ? validation.message : ' ';
170
- return (_jsx(StyledTextField, { type: showPassword ? 'text' : 'password', id: id, label: label, placeholder: placeholder, value: currentValue, background: background, backgroundDisabled: backgroundDisabled, colorText: color, colorFocused: colorFocused, colorDisabled: colorDisabled, borderRadius: borderRadius, boxShadow: boxShadow, borderColor: borderColor, padding: padding, disabled: disabled, required: required, fullWidth: true, error: shouldShowError, helperText: helperText, slotProps: {
218
+ const theme = useTheme();
219
+ const field = (_b = (_a = theme.pipelinesolucoes) === null || _a === void 0 ? void 0 : _a.forms) === null || _b === void 0 ? void 0 : _b.field;
220
+ // props -> tokens -> fallback
221
+ const bg = (_c = background !== null && background !== void 0 ? background : field === null || field === void 0 ? void 0 : field.background) !== null && _c !== void 0 ? _c : fbbackground;
222
+ const bgDisabled = (_d = backgroundDisabled !== null && backgroundDisabled !== void 0 ? backgroundDisabled : field === null || field === void 0 ? void 0 : field.backgroundDisabled) !== null && _d !== void 0 ? _d : fbbackgroundDisabled;
223
+ const txt = (_e = color !== null && color !== void 0 ? color : field === null || field === void 0 ? void 0 : field.color) !== null && _e !== void 0 ? _e : fbcolor;
224
+ const txtDisabled = (_f = colorDisabled !== null && colorDisabled !== void 0 ? colorDisabled : field === null || field === void 0 ? void 0 : field.colorDisabled) !== null && _f !== void 0 ? _f : fbcolorDisabled;
225
+ const br = (_g = borderRadius !== null && borderRadius !== void 0 ? borderRadius : field === null || field === void 0 ? void 0 : field.borderRadius) !== null && _g !== void 0 ? _g : fbborderRadius;
226
+ const sh = (_h = boxShadow !== null && boxShadow !== void 0 ? boxShadow : field === null || field === void 0 ? void 0 : field.boxShadow) !== null && _h !== void 0 ? _h : fbboxShadow;
227
+ const bd = (_j = borderColor !== null && borderColor !== void 0 ? borderColor : field === null || field === void 0 ? void 0 : field.borderColor) !== null && _j !== void 0 ? _j : fbborderColor;
228
+ const bdFocused = (_k = colorFocused !== null && colorFocused !== void 0 ? colorFocused : field === null || field === void 0 ? void 0 : field.colorFocused) !== null && _k !== void 0 ? _k : fbcolorFocused;
229
+ const pad = (_l = padding !== null && padding !== void 0 ? padding : field === null || field === void 0 ? void 0 : field.padding) !== null && _l !== void 0 ? _l : fbpadding;
230
+ const typo = (_o = (_m = (textVariant && theme.typography[textVariant])) !== null && _m !== void 0 ? _m : field === null || field === void 0 ? void 0 : field.typography) !== null && _o !== void 0 ? _o : theme.typography.body1;
231
+ return (_jsx(TextFieldStyled, { type: showPassword ? 'text' : 'password', id: id, typo: typo, label: label, placeholder: placeholder, value: currentValue, background: bg, backgroundDisabled: bgDisabled, colorText: txt, colorFocused: bdFocused, colorDisabled: txtDisabled, borderRadius: br, boxShadow: sh, borderColor: bd, padding: pad, disabled: disabled, required: required, fullWidth: true, error: shouldShowError, helperText: helperText, slotProps: {
171
232
  input: {
172
- endAdornment: (_jsx(InputAdornment, { position: "end", children: _jsx(IconButton, { onClick: () => setShowPassword((prev) => !prev), edge: "end", "aria-label": showPassword ? 'Ocultar senha' : 'Mostrar senha', children: showPassword ? _jsx(VisibilityOffIcon, {}) : _jsx(VisibilityIcon, {}) }) })),
233
+ endAdornment: (_jsx(InputAdornment, { position: "end", children: _jsx(IconButton, { onClick: () => setShowPassword((prev) => !prev), edge: "end", "aria-label": showPassword ? 'Ocultar senha' : 'Mostrar senha', sx: { margin: '0 16px 0 0' }, children: showPassword ? _jsx(VisibilityOffIcon, {}) : _jsx(VisibilityIcon, {}) }) })),
173
234
  },
174
235
  }, onChange: handleChange, onBlur: handleBlur }));
175
236
  };
@@ -1 +1 @@
1
- {"version":3,"file":"TextFieldPassword.js","sourceRoot":"","sources":["../../src/components/TextFieldPassword.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"TextFieldPassword.js","sourceRoot":"","sources":["../../src/components/TextFieldPassword.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,cAAc,MAAM,8BAA8B,CAAC;AAC1D,OAAO,UAAU,MAAM,0BAA0B,CAAC;AAClD,OAAO,cAAc,MAAM,gCAAgC,CAAC;AAC5D,OAAO,iBAAiB,MAAM,mCAAmC,CAAC;AAClE,OAAO,EAAqB,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAEnE,OAAO,EAAE,eAAe,EAAE,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,oBAAoB,EAAE,aAAa,EAAE,cAAc,EAAE,WAAW,EAAE,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AA2CjK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgJG;AAEH,MAAM,iBAAiB,GAAqC,CAAC,EAC3D,EAAE,EACF,KAAK,EACL,WAAW,EAEX,KAAK,EACL,gBAAgB,EAChB,kBAAkB,EAElB,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,IAAI,EAEf,OAAO,GAAG,yDAAyD,EACnE,eAAe,GAAG,mBAAmB,EACrC,cAAc,GAAG,oIAAoI,EACrJ,WAAW,GAAG,MAAM,EAEpB,UAAU,EACV,kBAAkB,EAClB,KAAK,EACL,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,SAAS,EACT,WAAW,EACX,OAAO,EACP,WAAW,EAEX,QAAQ,EACR,MAAM,GACP,EAAE,EAAE;;IACH,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAU,KAAK,CAAC,CAAC;IACvE,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAU,KAAK,CAAC,CAAC;IAE7D,kDAAkD;IAClD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAS,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,EAAE,CAAC,CAAC;IACxE,MAAM,YAAY,GAAG,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,UAAU,CAAC;IAEzC,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,OAAO,KAAK,KAAK,QAAQ;YAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IACtD,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAW,CACzC,CAAC,SAAiB,EAA4B,EAAE;QAC9C,MAAM,OAAO,GAAG,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,EAAE,CAAC;QAEhC,IAAI,QAAQ,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YACrC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,eAAe,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC;QAC5F,CAAC;QAED,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,OAAO,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC;YAC5D,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,cAAc,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC;QAC1F,CAAC;QAED,iEAAiE;QACjE,IAAI,CAAC,QAAQ,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YACtC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC;QAC1E,CAAC;QAED,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,CAAC;IAC3E,CAAC,EACD,CAAC,cAAc,EAAE,OAAO,EAAE,QAAQ,EAAE,eAAe,CAAC,CACrD,CAAC;IAEF,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,CACtC,CAAC,SAAiB,EAAE,EAAE;QACpB,MAAM,MAAM,GAAG,iBAAiB,CAAC,SAAS,CAAC,CAAC;QAC5C,IAAI,kBAAkB;YAAE,kBAAkB,CAAC,MAAM,CAAC,CAAC;QACnD,OAAO,MAAM,CAAC;IAChB,CAAC,EACD,CAAC,iBAAiB,EAAE,kBAAkB,CAAC,CACxC,CAAC;IAEF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,KAAK,CAAC,QAAQ,CAA2B,GAAG,EAAE,CAChF,iBAAiB,CAAC,YAAY,CAAC,CAChC,CAAC;IAEF,MAAM,sBAAsB,GAAG,WAAW,KAAK,QAAQ,IAAI,WAAW,KAAK,MAAM,CAAC;IAClF,MAAM,oBAAoB,GAAG,WAAW,KAAK,MAAM,IAAI,WAAW,KAAK,MAAM,CAAC;IAE9E,MAAM,YAAY,GAAG,CAAC,KAA0C,EAAE,EAAE;QAClE,MAAM,SAAS,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QAErC,4CAA4C;QAC5C,IAAI,OAAO,KAAK,KAAK,QAAQ;YAAE,aAAa,CAAC,SAAS,CAAC,CAAC;QAExD,kCAAkC;QAClC,IAAI,gBAAgB;YAAE,gBAAgB,CAAC,SAAS,CAAC,CAAC;QAElD,2CAA2C;QAC3C,IAAI,QAAQ;YAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;QAE9B,IAAI,sBAAsB,EAAE,CAAC;YAC3B,MAAM,MAAM,GAAG,cAAc,CAAC,SAAS,CAAC,CAAC;YACzC,aAAa,CAAC,MAAM,CAAC,CAAC;QACxB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,CAAC,KAAyC,EAAE,EAAE;QAC/D,IAAI,CAAC,OAAO;YAAE,UAAU,CAAC,IAAI,CAAC,CAAC;QAE/B,IAAI,MAAM;YAAE,MAAM,CAAC,KAAK,CAAC,CAAC;QAE1B,IAAI,oBAAoB,EAAE,CAAC;YACzB,MAAM,MAAM,GAAG,cAAc,CAAC,YAAY,CAAC,CAAC;YAC5C,aAAa,CAAC,MAAM,CAAC,CAAC;QACxB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,OAAO,IAAI,CAAC,UAAU,CAAC,OAAO,IAAI,UAAU,CAAC,MAAM,KAAK,MAAM,CAAC;IACvF,MAAM,UAAU,GAAG,eAAe,CAAC,CAAC,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,CAAC;IAE9D,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IACzB,MAAM,KAAK,GAAG,MAAA,MAAA,KAAK,CAAC,gBAAgB,0CAAE,KAAK,0CAAE,KAAK,CAAC;IAEnD,8BAA8B;IAC9B,MAAM,EAAE,GAAG,MAAA,UAAU,aAAV,UAAU,cAAV,UAAU,GAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,UAAU,mCAAI,YAAY,CAAC;IAC3D,MAAM,UAAU,GAAG,MAAA,kBAAkB,aAAlB,kBAAkB,cAAlB,kBAAkB,GAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,kBAAkB,mCAAI,oBAAoB,CAAC;IAC3F,MAAM,GAAG,GAAG,MAAA,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,mCAAI,OAAO,CAAC;IAC7C,MAAM,WAAW,GAAG,MAAA,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,aAAa,mCAAI,eAAe,CAAC;IAC7E,MAAM,EAAE,GAAG,MAAA,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,YAAY,mCAAI,cAAc,CAAC;IACjE,MAAM,EAAE,GAAG,MAAA,SAAS,aAAT,SAAS,cAAT,SAAS,GAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,SAAS,mCAAI,WAAW,CAAC;IACxD,MAAM,EAAE,GAAG,MAAA,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,WAAW,mCAAI,aAAa,CAAC;IAC9D,MAAM,SAAS,GAAG,MAAA,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,YAAY,mCAAI,cAAc,CAAC;IACxE,MAAM,GAAG,GAAG,MAAA,OAAO,aAAP,OAAO,cAAP,OAAO,GAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,OAAO,mCAAI,SAAS,CAAC;IACnD,MAAM,IAAI,GACR,MAAA,MAAA,CAAC,WAAW,IAAI,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,mCAC9C,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,UAAU,mCACjB,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC;IAEzB,OAAO,CACL,KAAC,eAAe,IACd,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,UAAU,EACxC,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,YAAY,EAEnB,UAAU,EAAE,EAAE,EACd,kBAAkB,EAAE,UAAU,EAE9B,SAAS,EAAE,GAAG,EACd,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,WAAW,EAE1B,YAAY,EAAE,EAAE,EAChB,SAAS,EAAE,EAAE,EACb,WAAW,EAAE,EAAE,EAEf,OAAO,EAAE,GAAG,EAEZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,SAAS,QACT,KAAK,EAAE,eAAe,EACtB,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE;YACT,KAAK,EAAE;gBACL,YAAY,EAAE,CACZ,KAAC,cAAc,IAAC,QAAQ,EAAC,KAAK,YAC5B,KAAC,UAAU,IACT,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,EAC/C,IAAI,EAAC,KAAK,gBACE,YAAY,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,eAAe,EAC5D,EAAE,EAAE,EAAC,MAAM,EAAE,YAAY,EAAC,YAEzB,YAAY,CAAC,CAAC,CAAC,KAAC,iBAAiB,KAAG,CAAC,CAAC,CAAC,KAAC,cAAc,KAAG,GAC/C,GACE,CAClB;aACF;SACF,EACD,QAAQ,EAAE,YAAY,EACtB,MAAM,EAAE,UAAU,GAClB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,iBAAiB,CAAC,WAAW,GAAG,mBAAmB,CAAC;AAEpD,eAAe,iBAAiB,CAAC"}
@@ -1,78 +1,122 @@
1
1
  import React from 'react';
2
- import { BorderProps } from '../types/BorderProps';
3
- import { ColorProps } from '../types/ColorProps';
4
- import { LayoutProps } from '../types/LayoutProps';
2
+ import { TypographyVariant } from '@mui/material/styles';
3
+ import { BorderProps, ColorProps, LayoutProps } from '@pipelinesolucoes/theme';
5
4
  interface TextFieldValidateProps extends BorderProps, ColorProps, LayoutProps {
6
5
  id?: string;
7
6
  label?: string;
8
7
  placeholder?: string;
9
8
  value?: string;
10
- background?: string;
11
- backgroundDisabled?: string;
12
- color?: string;
13
- colorFocused?: string;
14
- colorDisabled?: string;
15
- borderRadius?: string;
16
- boxShadow?: string;
17
- borderColor?: string;
18
- padding?: string;
9
+ textVariant?: TypographyVariant;
19
10
  disabled?: boolean;
20
- multiline?: boolean;
21
- rows?: number;
22
11
  required?: boolean;
23
12
  requiredMessage?: string;
24
13
  pattern?: RegExp | string;
25
14
  patternMessage?: string;
26
- validate?: (value: string) => string | null | undefined;
27
15
  showErrorOn?: 'change' | 'blur';
28
16
  minLength?: number;
29
17
  maxLength?: number;
18
+ multiline?: boolean;
19
+ rows?: number;
20
+ validate?: (value: string) => string | null | undefined;
30
21
  onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
31
22
  onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
32
23
  }
33
24
  /**
34
- * Componente de campo de texto com validação, baseado no TextField do Material UI.
35
- * Permite personalização visual via `styled` e suporte a validações comuns
36
- * (obrigatório, tamanho mínimo, regex) e validação customizada.
25
+ * Campo de texto com suporte a validações comuns e customizadas, construído
26
+ * sobre o TextField do Material UI e estilizado via Design System da Pipeline.
27
+ *
28
+ * Funcionalidades principais:
29
+ * - Suporte a modo controlado (`value`)
30
+ * - Validações nativas (obrigatório, tamanho mínimo, regex)
31
+ * - Validação customizada via função
32
+ * - Controle de momento de exibição do erro (`change` ou `blur`)
33
+ * - Suporte a campo multilinha
34
+ * - Customização visual via props e tokens de theme
37
35
  *
38
- * O erro pode ser exibido durante a digitação ou apenas após o campo perder o foco.
36
+ * Tokens de estilo (ordem de prioridade):
37
+ * - `prop` do componente
38
+ * - `theme.pipelinesolucoes.forms.field`
39
+ * - Fallback interno (constantes `fb*`)
40
+ *
41
+ * Tipografia:
42
+ * - Suporte à tipografia do Material UI via `textVariant`
43
+ * - Fallback para `theme.pipelinesolucoes.forms.field.typography`
44
+ * - Fallback final para `theme.typography.body1`
45
+ *
46
+ * @param {string} [id] Identificador do campo, repassado ao input do Material UI.
47
+ * @param {string} [label] Texto do rótulo exibido acima do campo.
48
+ * @param {string} [placeholder] Texto exibido quando o campo está vazio.
49
+ * @param {string} [value] Valor atual do campo (modo controlado).
39
50
  *
40
- * @param {string} [id] Id do campo (replicado no input do MUI).
41
- * @param {string} [label] Rótulo exibido acima do campo.
42
- * @param {string} [placeholder] Placeholder exibido quando o campo está vazio.
43
- * @param {string} [value=''] Valor atual do campo (modo controlado).
44
51
  * @param {boolean} [disabled=false] Define se o campo está desabilitado.
45
52
  *
46
- * @param {string} [background='#fff'] Cor de fundo do campo.
47
- * @param {string} [backgroundDisabled='#E5E7EB'] Cor de fundo do campo quando o campo está desabilitado.
48
- * @param {string} [color='#000'] Cor do texto e do label.
49
- * @param {string} [colorFocused='#1976d2'] Cor da borda quando o campo está focado.
50
- * @param {string} [colorDisabled='#9CA3AF'] Cor do texto e do label quando o campo está focado.
51
- * @param {string} [borderColor='#ccc'] Cor da borda no estado normal e hover.
52
- * @param {string} [borderRadius='0'] Raio da borda do campo.
53
- * @param {string} [boxShadow='none'] Sombra aplicada ao campo.
54
- * @param {string} [padding='4px 8px'] Espaçamento interno do input.
53
+ * @param {number} [minLength] Número mínimo de caracteres permitidos.
54
+ * @param {number} [maxLength] Número máximo de caracteres permitidos.
55
+ *
56
+ * @param {boolean} [multiline=false] Define se o campo aceita múltiplas linhas.
57
+ * @param {number} [rows=3] Quantidade de linhas visíveis quando `multiline` está ativo.
58
+ *
59
+ *
60
+ * ### Estilo / Aparência
61
+ *
62
+ * @param {import('@mui/material/styles').TypographyVariant} [textVariant] Variante tipográfica do Material UI aplicada ao texto e placeholder.
55
63
  *
56
- * @param {boolean} [multiline=false] Define se o campo é multilinha.
57
- * @param {number} [rows=3] Número de linhas quando `multiline` está ativo.
64
+ * @param {string} [background]
65
+ * Cor de fundo do campo.
66
+ * Ordem: `background` → `theme.pipelinesolucoes.forms.field.background` → `#fff`.
67
+ *
68
+ * @param {string} [backgroundDisabled]
69
+ * Cor de fundo do campo quando desabilitado.
70
+ * Ordem: `backgroundDisabled` → `theme.pipelinesolucoes.forms.field.backgroundDisabled` → `#E5E7EB`.
71
+ *
72
+ * @param {string} [color]
73
+ * Cor do texto do campo (texto digitado e label).
74
+ * Ordem: `color` → `theme.pipelinesolucoes.forms.field.color` → `#000`.
75
+ *
76
+ * @param {string} [colorFocused]
77
+ * Cor aplicada ao estado focado (usada como cor de borda no focus).
78
+ * Ordem: `colorFocused` → `theme.pipelinesolucoes.forms.field.colorFocused` → `#1976d2`.
79
+ *
80
+ * @param {string} [colorDisabled]
81
+ * Cor do texto do campo quando desabilitado.
82
+ * Ordem: `colorDisabled` → `theme.pipelinesolucoes.forms.field.colorDisabled` → `#9CA3AF`.
83
+ *
84
+ * @param {string} [borderRadius]
85
+ * Raio da borda do campo.
86
+ * Ordem: `borderRadius` → `theme.pipelinesolucoes.forms.field.borderRadius` → `"0"`.
87
+ *
88
+ * @param {string} [boxShadow]
89
+ * Sombra do campo.
90
+ * Ordem: `boxShadow` → `theme.pipelinesolucoes.forms.field.boxShadow` → `"none"`.
91
+ *
92
+ * @param {string} [borderColor]
93
+ * Cor da borda do campo (estado padrão/hover).
94
+ * Ordem: `borderColor` → `theme.pipelinesolucoes.forms.field.borderColor` → `#ccc`.
95
+ *
96
+ * @param {string} [padding]
97
+ * Espaçamento interno do input (aplicado no texto e textarea).
98
+ * Ordem: `padding` → `theme.pipelinesolucoes.forms.field.padding` → `"4px 8px"`.
99
+ *
100
+ * ---
101
+ * ### Validação
58
102
  *
59
103
  * @param {boolean} [required=false] Indica se o campo é obrigatório.
60
- * @param {string} [requiredMessage='Campo obrigatório'] Mensagem exibida quando o campo obrigatório está vazio.
61
- * @param {number} [minLength] Número mínimo de caracteres.
62
- * @param {RegExp | string} [pattern] Expressão regular para validação do valor.
63
- * @param {string} [patternMessage='Formato inválido'] Mensagem exibida quando o pattern não é atendido.
104
+ * @param {string} [requiredMessage] Mensagem exibida quando o campo obrigatório está vazio.
105
+ * @param {RegExp | string} [pattern] Expressão regular utilizada para validação do valor.
106
+ * @param {string} [patternMessage] Mensagem exibida quando o valor não atende ao pattern.
107
+ * @param {'change' | 'blur'} [showErrorOn='blur'] Define quando o erro será exibido.
64
108
  * @param {(value: string) => string | null | undefined} [validate] Função de validação customizada.
65
- * @param {'change' | 'blur'} [showErrorOn='blur'] Momento em que o erro deve ser exibido.
66
109
  *
67
- * @param {number} [maxLength] Limite máximo de caracteres permitido no input.
110
+ * ---
111
+ * ### Eventos
112
+ *
68
113
  * @param {(event: React.ChangeEvent<HTMLInputElement>) => void} [onChange] Callback disparado ao alterar o valor.
69
114
  * @param {(event: React.FocusEvent<HTMLInputElement>) => void} [onBlur] Callback disparado ao perder o foco.
70
115
  *
116
+ * ---
117
+ *
71
118
  * @example
72
119
  * ```tsx
73
- * import React from 'react';
74
- * import TextFieldValidate from '@/components/TextFieldValidate';
75
- *
76
120
  * const Example = () => {
77
121
  * const [email, setEmail] = React.useState('');
78
122
  *
@@ -88,6 +132,7 @@ interface TextFieldValidateProps extends BorderProps, ColorProps, LayoutProps {
88
132
  * showErrorOn="blur"
89
133
  * maxLength={120}
90
134
  * borderRadius="6px"
135
+ * textVariant="subtitle2"
91
136
  * />
92
137
  * );
93
138
  * };