@lets-events/react 12.3.10 → 12.4.1

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 (91) hide show
  1. package/.eslintrc.json +2 -2
  2. package/.turbo/turbo-build.log +19 -21
  3. package/CHANGELOG.md +12 -0
  4. package/dist/index.d.mts +35 -3
  5. package/dist/index.d.ts +35 -3
  6. package/dist/index.js +562 -344
  7. package/dist/index.mjs +535 -319
  8. package/package.json +1 -1
  9. package/src/components/Alert.tsx +303 -303
  10. package/src/components/Avatar.tsx +55 -55
  11. package/src/components/Badge.tsx +125 -125
  12. package/src/components/Box.tsx +3 -3
  13. package/src/components/Button/index.tsx +45 -45
  14. package/src/components/Button/styledComponents.ts +313 -313
  15. package/src/components/ButtonGroup.tsx +484 -484
  16. package/src/components/Calendar/index.tsx +148 -148
  17. package/src/components/Calendar/styledComponents.ts +259 -250
  18. package/src/components/Card.tsx +67 -67
  19. package/src/components/CheckboxGroup.tsx +176 -176
  20. package/src/components/Container.tsx +39 -39
  21. package/src/components/Divider.tsx +7 -7
  22. package/src/components/DoubleCalendar/index.tsx +166 -0
  23. package/src/components/Drawer/index.tsx +98 -98
  24. package/src/components/Drawer/styledComponents.ts +103 -103
  25. package/src/components/Dropdown.tsx +302 -302
  26. package/src/components/Filter.tsx +164 -164
  27. package/src/components/Flex.tsx +118 -118
  28. package/src/components/FormFields/AddressFormFields/CityFormField.tsx +111 -111
  29. package/src/components/FormFields/AddressFormFields/CountryFormField.tsx +33 -33
  30. package/src/components/FormFields/AddressFormFields/PostalCodeFormField.tsx +39 -39
  31. package/src/components/FormFields/AddressFormFields/StateFormField.tsx +32 -32
  32. package/src/components/FormFields/AddressFormFields/index.tsx +141 -141
  33. package/src/components/FormFields/BirthDateFormField.tsx +84 -84
  34. package/src/components/FormFields/CNPJFormField.tsx +87 -87
  35. package/src/components/FormFields/CPFFormField.tsx +78 -78
  36. package/src/components/FormFields/CalendarFormField.tsx +95 -95
  37. package/src/components/FormFields/CheckboxGroupFormField.tsx +91 -91
  38. package/src/components/FormFields/DoubleCalendarFormField.tsx +90 -0
  39. package/src/components/FormFields/EmailFormField.tsx +27 -27
  40. package/src/components/FormFields/Form.tsx +39 -39
  41. package/src/components/FormFields/IdentityDocumentNumberFormField.tsx +32 -32
  42. package/src/components/FormFields/MultiSelectFormField.tsx +64 -64
  43. package/src/components/FormFields/PhoneFormField.tsx +40 -40
  44. package/src/components/FormFields/RadioGroupFormField.tsx +84 -84
  45. package/src/components/FormFields/RichEditorFormField.tsx +103 -103
  46. package/src/components/FormFields/SelectFormField.tsx +93 -93
  47. package/src/components/FormFields/SwitchFormField.tsx +46 -46
  48. package/src/components/FormFields/TextAreaFormField.tsx +59 -57
  49. package/src/components/FormFields/TextFormField.tsx +112 -112
  50. package/src/components/FormFields/TimePickerFormField.tsx +88 -88
  51. package/src/components/FormFields/subComponents/ErrorFormMessage.tsx +36 -36
  52. package/src/components/FormFields/subComponents/FormLabel.tsx +29 -29
  53. package/src/components/FormFields/utils/validation.ts +23 -23
  54. package/src/components/Grid.tsx +137 -137
  55. package/src/components/Icon.tsx +47 -47
  56. package/src/components/MenuDropdown/index.tsx +38 -38
  57. package/src/components/MenuDropdown/styledComponents.ts +31 -31
  58. package/src/components/Modal.tsx +110 -110
  59. package/src/components/MultiSelect/index.tsx +243 -243
  60. package/src/components/MultiSelect/styledComponents.ts +160 -160
  61. package/src/components/RadioGroup.tsx +210 -210
  62. package/src/components/RichEditor/QuillComponent.tsx +457 -457
  63. package/src/components/RichEditor/RichEditor.tsx +49 -49
  64. package/src/components/RichEditor/index.ts +2 -2
  65. package/src/components/RichEditor/styledComponents.ts +1151 -1151
  66. package/src/components/Section.tsx +33 -33
  67. package/src/components/Step.tsx +164 -164
  68. package/src/components/Switch.tsx +108 -108
  69. package/src/components/Text.tsx +38 -38
  70. package/src/components/TextField.tsx +372 -372
  71. package/src/components/TextareaField.tsx +138 -127
  72. package/src/components/TimePicker.tsx +328 -328
  73. package/src/components/Toast/components/ToastItem.tsx +41 -41
  74. package/src/components/Toast/components/ToastProvider.tsx +63 -63
  75. package/src/components/Toast/hooks/useToast.ts +12 -12
  76. package/src/components/Toast/index.tsx +5 -5
  77. package/src/components/Toast/styles/index.ts +135 -135
  78. package/src/components/Toast/types/index.ts +46 -46
  79. package/src/components/Tooltip/index.tsx +66 -66
  80. package/src/components/Tooltip/styles.ts +77 -77
  81. package/src/hooks/useCountries.ts +41 -41
  82. package/src/hooks/useImageUpload.ts +139 -139
  83. package/src/hooks/useOnClickOutside.tsx +42 -42
  84. package/src/index.tsx +71 -69
  85. package/src/styles/index.ts +41 -41
  86. package/src/types/typographyValues.ts +178 -178
  87. package/src/utils/getNestedValue.ts +3 -3
  88. package/src/utils/states.ts +29 -29
  89. package/src/utils/uploadService.ts +180 -180
  90. package/tsconfig.json +3 -3
  91. package/tsup.config.ts +38 -38
@@ -1,67 +1,67 @@
1
- import * as React from 'react'
2
- import * as TooltipPrimitive from '@radix-ui/react-tooltip'
3
- import { styled } from '../../styles'
4
- import { Text } from '../Text'
5
-
6
- const TooltipProvider = TooltipPrimitive.Provider
7
- const TooltipRoot = TooltipPrimitive.Root
8
- const TooltipTrigger = TooltipPrimitive.Trigger
9
-
10
- const TooltipContent = styled(TooltipPrimitive.Content, {
11
- backgroundColor: '$dark800',
12
- color: '$neutral50',
13
- borderRadius: '4px',
14
- padding: '10px 15px',
15
- fontSize: '14px',
16
- lineHeight: 1,
17
- zIndex: 100,
18
- boxShadow: '0 2px 10px rgba(0, 0, 0, 0.1)',
19
- userSelect: 'none',
20
- animationDuration: '400ms',
21
- animationTimingFunction: 'cubic-bezier(0.16, 1, 0.3, 1)',
22
- willChange: 'transform, opacity',
23
- '&[data-state="delayed-open"][data-side="top"]': {
24
- animationName: 'slideDownAndFade',
25
- },
26
- '&[data-state="delayed-open"][data-side="right"]': {
27
- animationName: 'slideLeftAndFade',
28
- },
29
- '&[data-state="delayed-open"][data-side="bottom"]': {
30
- animationName: 'slideUpAndFade',
31
- },
32
- '&[data-state="delayed-open"][data-side="left"]': {
33
- animationName: 'slideRightAndFade',
34
- },
35
- })
36
-
37
- const TooltipArrow = styled(TooltipPrimitive.Arrow, {
38
- fill: '$dark800',
39
- })
40
-
41
- export interface TooltipProps {
42
- children: React.ReactNode
43
- content: React.ReactNode
44
- delayDuration?: number
45
- side?: 'top' | 'right' | 'bottom' | 'left'
46
- }
47
-
48
- export function Tooltip({
49
- children,
50
- content,
51
- delayDuration = 200,
52
- side = 'top',
53
- }: TooltipProps) {
54
- return (
55
- <TooltipProvider>
56
- <TooltipRoot delayDuration={delayDuration}>
57
- <TooltipTrigger asChild>{children}</TooltipTrigger>
58
- <TooltipContent side={side} sideOffset={5}>
59
- {typeof content === 'string' ? <Text typography={'tooltip'}>{content}</Text>:(content)}
60
- <TooltipArrow />
61
- </TooltipContent>
62
- </TooltipRoot>
63
- </TooltipProvider>
64
- )
65
- }
66
-
1
+ import * as React from 'react'
2
+ import * as TooltipPrimitive from '@radix-ui/react-tooltip'
3
+ import { styled } from '../../styles'
4
+ import { Text } from '../Text'
5
+
6
+ const TooltipProvider = TooltipPrimitive.Provider
7
+ const TooltipRoot = TooltipPrimitive.Root
8
+ const TooltipTrigger = TooltipPrimitive.Trigger
9
+
10
+ const TooltipContent = styled(TooltipPrimitive.Content, {
11
+ backgroundColor: '$dark800',
12
+ color: '$neutral50',
13
+ borderRadius: '4px',
14
+ padding: '10px 15px',
15
+ fontSize: '14px',
16
+ lineHeight: 1,
17
+ zIndex: 100,
18
+ boxShadow: '0 2px 10px rgba(0, 0, 0, 0.1)',
19
+ userSelect: 'none',
20
+ animationDuration: '400ms',
21
+ animationTimingFunction: 'cubic-bezier(0.16, 1, 0.3, 1)',
22
+ willChange: 'transform, opacity',
23
+ '&[data-state="delayed-open"][data-side="top"]': {
24
+ animationName: 'slideDownAndFade',
25
+ },
26
+ '&[data-state="delayed-open"][data-side="right"]': {
27
+ animationName: 'slideLeftAndFade',
28
+ },
29
+ '&[data-state="delayed-open"][data-side="bottom"]': {
30
+ animationName: 'slideUpAndFade',
31
+ },
32
+ '&[data-state="delayed-open"][data-side="left"]': {
33
+ animationName: 'slideRightAndFade',
34
+ },
35
+ })
36
+
37
+ const TooltipArrow = styled(TooltipPrimitive.Arrow, {
38
+ fill: '$dark800',
39
+ })
40
+
41
+ export interface TooltipProps {
42
+ children: React.ReactNode
43
+ content: React.ReactNode
44
+ delayDuration?: number
45
+ side?: 'top' | 'right' | 'bottom' | 'left'
46
+ }
47
+
48
+ export function Tooltip({
49
+ children,
50
+ content,
51
+ delayDuration = 200,
52
+ side = 'top',
53
+ }: TooltipProps) {
54
+ return (
55
+ <TooltipProvider>
56
+ <TooltipRoot delayDuration={delayDuration}>
57
+ <TooltipTrigger asChild>{children}</TooltipTrigger>
58
+ <TooltipContent side={side} sideOffset={5}>
59
+ {typeof content === 'string' ? <Text typography={'tooltip'}>{content}</Text>:(content)}
60
+ <TooltipArrow />
61
+ </TooltipContent>
62
+ </TooltipRoot>
63
+ </TooltipProvider>
64
+ )
65
+ }
66
+
67
67
  export { TooltipProvider, TooltipRoot, TooltipTrigger, TooltipContent }
@@ -1,78 +1,78 @@
1
- import { keyframes } from '@stitches/react'
2
- import { styled } from '../../styles'
3
-
4
- const slideUpAndFade = keyframes({
5
- from: {
6
- opacity: 0,
7
- transform: 'translateY(2px)',
8
- },
9
- to: {
10
- opacity: 1,
11
- transform: 'translateY(0)',
12
- },
13
- })
14
-
15
- const slideRightAndFade = keyframes({
16
- from: {
17
- opacity: 0,
18
- transform: 'translateX(-2px)',
19
- },
20
- to: {
21
- opacity: 1,
22
- transform: 'translateX(0)',
23
- },
24
- })
25
-
26
- const slideDownAndFade = keyframes({
27
- from: {
28
- opacity: 0,
29
- transform: 'translateY(-2px)',
30
- },
31
- to: {
32
- opacity: 1,
33
- transform: 'translateY(0)',
34
- },
35
- })
36
-
37
- const slideLeftAndFade = keyframes({
38
- from: {
39
- opacity: 0,
40
- transform: 'translateX(2px)',
41
- },
42
- to: {
43
- opacity: 1,
44
- transform: 'translateX(0)',
45
- },
46
- })
47
-
48
- export const TooltipContentStyled = styled('div', {
49
- fontFamily: '$default',
50
- backgroundColor: '$dark700',
51
- color: '$dark50',
52
- borderRadius: '$sm',
53
- padding: '$10 $14',
54
- fontSize: '$13',
55
- lineHeight: '$base',
56
- boxShadow: '0px 4px 4px 0px rgba(35, 53, 67, 0.08)',
57
- userSelect: 'none',
58
- animationDuration: '400ms',
59
- animationTimingFunction: 'cubic-bezier(0.16, 1, 0.3, 1)',
60
- willChange: 'transform, opacity',
61
-
62
- '&[data-state="delayed-open"][data-side="top"]': {
63
- animationName: `${slideDownAndFade}`,
64
- },
65
- '&[data-state="delayed-open"][data-side="right"]': {
66
- animationName: `${slideLeftAndFade}`,
67
- },
68
- '&[data-state="delayed-open"][data-side="bottom"]': {
69
- animationName: `${slideUpAndFade}`,
70
- },
71
- '&[data-state="delayed-open"][data-side="left"]': {
72
- animationName: `${slideRightAndFade}`,
73
- },
74
- })
75
-
76
- export const TooltipArrow = styled('div', {
77
- fill: '$dark700',
1
+ import { keyframes } from '@stitches/react'
2
+ import { styled } from '../../styles'
3
+
4
+ const slideUpAndFade = keyframes({
5
+ from: {
6
+ opacity: 0,
7
+ transform: 'translateY(2px)',
8
+ },
9
+ to: {
10
+ opacity: 1,
11
+ transform: 'translateY(0)',
12
+ },
13
+ })
14
+
15
+ const slideRightAndFade = keyframes({
16
+ from: {
17
+ opacity: 0,
18
+ transform: 'translateX(-2px)',
19
+ },
20
+ to: {
21
+ opacity: 1,
22
+ transform: 'translateX(0)',
23
+ },
24
+ })
25
+
26
+ const slideDownAndFade = keyframes({
27
+ from: {
28
+ opacity: 0,
29
+ transform: 'translateY(-2px)',
30
+ },
31
+ to: {
32
+ opacity: 1,
33
+ transform: 'translateY(0)',
34
+ },
35
+ })
36
+
37
+ const slideLeftAndFade = keyframes({
38
+ from: {
39
+ opacity: 0,
40
+ transform: 'translateX(2px)',
41
+ },
42
+ to: {
43
+ opacity: 1,
44
+ transform: 'translateX(0)',
45
+ },
46
+ })
47
+
48
+ export const TooltipContentStyled = styled('div', {
49
+ fontFamily: '$default',
50
+ backgroundColor: '$dark700',
51
+ color: '$dark50',
52
+ borderRadius: '$sm',
53
+ padding: '$10 $14',
54
+ fontSize: '$13',
55
+ lineHeight: '$base',
56
+ boxShadow: '0px 4px 4px 0px rgba(35, 53, 67, 0.08)',
57
+ userSelect: 'none',
58
+ animationDuration: '400ms',
59
+ animationTimingFunction: 'cubic-bezier(0.16, 1, 0.3, 1)',
60
+ willChange: 'transform, opacity',
61
+
62
+ '&[data-state="delayed-open"][data-side="top"]': {
63
+ animationName: `${slideDownAndFade}`,
64
+ },
65
+ '&[data-state="delayed-open"][data-side="right"]': {
66
+ animationName: `${slideLeftAndFade}`,
67
+ },
68
+ '&[data-state="delayed-open"][data-side="bottom"]': {
69
+ animationName: `${slideUpAndFade}`,
70
+ },
71
+ '&[data-state="delayed-open"][data-side="left"]': {
72
+ animationName: `${slideRightAndFade}`,
73
+ },
74
+ })
75
+
76
+ export const TooltipArrow = styled('div', {
77
+ fill: '$dark700',
78
78
  })
@@ -1,41 +1,41 @@
1
- import countries from "i18n-iso-countries";
2
- import pt from "i18n-iso-countries/langs/pt.json";
3
- import en from "i18n-iso-countries/langs/en.json";
4
- import es from "i18n-iso-countries/langs/es.json";
5
-
6
- type Language = "pt-BR" | "en" | "es";
7
-
8
- type Option = {
9
- value: string;
10
- label: string;
11
- };
12
-
13
- export function useCountries(language: Language = "pt-BR"): Option[] {
14
- countries.registerLocale(pt);
15
- countries.registerLocale(en);
16
- countries.registerLocale(es);
17
-
18
- const langMap = {
19
- "pt-BR": "pt",
20
- en: "en",
21
- es: "es",
22
- } as const;
23
-
24
- const langCode = langMap[language];
25
-
26
- const namesPT = countries.getNames("pt", { select: "official" });
27
- const namesLang = countries.getNames(langCode, { select: "official" });
28
-
29
- return Object.entries(namesPT).map(([_, namePT]) => {
30
- const nameTranslated =
31
- Object.entries(namesLang).find(([, name]) => namePT === name) ??
32
- Object.entries(namesPT).find(([, name]) => name === namePT);
33
-
34
- const label = nameTranslated?.[1] || namePT;
35
-
36
- return {
37
- value: namePT,
38
- label,
39
- };
40
- });
41
- }
1
+ import countries from "i18n-iso-countries";
2
+ import pt from "i18n-iso-countries/langs/pt.json";
3
+ import en from "i18n-iso-countries/langs/en.json";
4
+ import es from "i18n-iso-countries/langs/es.json";
5
+
6
+ type Language = "pt-BR" | "en" | "es";
7
+
8
+ type Option = {
9
+ value: string;
10
+ label: string;
11
+ };
12
+
13
+ export function useCountries(language: Language = "pt-BR"): Option[] {
14
+ countries.registerLocale(pt);
15
+ countries.registerLocale(en);
16
+ countries.registerLocale(es);
17
+
18
+ const langMap = {
19
+ "pt-BR": "pt",
20
+ en: "en",
21
+ es: "es",
22
+ } as const;
23
+
24
+ const langCode = langMap[language];
25
+
26
+ const namesPT = countries.getNames("pt", { select: "official" });
27
+ const namesLang = countries.getNames(langCode, { select: "official" });
28
+
29
+ return Object.entries(namesPT).map(([_, namePT]) => {
30
+ const nameTranslated =
31
+ Object.entries(namesLang).find(([, name]) => namePT === name) ??
32
+ Object.entries(namesPT).find(([, name]) => name === namePT);
33
+
34
+ const label = nameTranslated?.[1] || namePT;
35
+
36
+ return {
37
+ value: namePT,
38
+ label,
39
+ };
40
+ });
41
+ }
@@ -1,139 +1,139 @@
1
- import { useState, useCallback } from "react";
2
- import { UploadService, UploadConfig } from "../utils/uploadService";
3
-
4
- interface UploadProgress {
5
- amount: number;
6
- message: string;
7
- }
8
-
9
- interface UploadedFile {
10
- url: string;
11
- filename: string;
12
- size: number;
13
- type: string;
14
- }
15
-
16
- interface UseImageUploadOptions {
17
- onSuccess?: (file: UploadedFile) => void;
18
- onError?: (error: string) => void;
19
- onProgress?: (progress: UploadProgress) => void;
20
- maxFileSize?: number;
21
- allowedTypes?: string[];
22
- uploadConfig: UploadConfig;
23
- }
24
-
25
- export const useImageUpload = (options: UseImageUploadOptions) => {
26
- const [isUploading, setIsUploading] = useState(false);
27
- const [progress, setProgress] = useState<UploadProgress | null>(null);
28
- const [error, setError] = useState<string | null>(null);
29
-
30
- const {
31
- onSuccess,
32
- onError,
33
- onProgress,
34
- maxFileSize = 5 * 1024 * 1024, // 5MB default
35
- allowedTypes = ["image/jpeg", "image/png", "image/gif", "image/webp"],
36
- uploadConfig,
37
- } = options;
38
-
39
- const validateFile = useCallback(
40
- (file: File): boolean => {
41
- if (!allowedTypes.includes(file.type)) {
42
- const errorMsg = "Tipo de arquivo não suportado";
43
- setError(errorMsg);
44
- onError?.(errorMsg);
45
- return false;
46
- }
47
-
48
- if (file.size > maxFileSize) {
49
- const errorMsg = `Arquivo muito grande. Máximo: ${(
50
- maxFileSize /
51
- 1024 /
52
- 1024
53
- ).toFixed(1)}MB`;
54
- setError(errorMsg);
55
- onError?.(errorMsg);
56
- return false;
57
- }
58
-
59
- return true;
60
- },
61
- [allowedTypes, maxFileSize, onError]
62
- );
63
-
64
- const uploadFile = useCallback(
65
- async (file: File): Promise<UploadedFile | null> => {
66
- if (!validateFile(file)) {
67
- return null;
68
- }
69
-
70
- setIsUploading(true);
71
- setError(null);
72
- setProgress(null);
73
-
74
- try {
75
- // Tenta upload via S3 com URL pré-assinada primeiro
76
- const uploadedFile = await UploadService.uploadToS3(
77
- file,
78
- uploadConfig,
79
- (progress) => {
80
- setProgress(progress);
81
- onProgress?.(progress);
82
- }
83
- );
84
-
85
- setIsUploading(false);
86
- setProgress(null);
87
- onSuccess?.(uploadedFile);
88
- return uploadedFile;
89
- } catch (error) {
90
- console.error("Erro no upload S3:", error);
91
-
92
- // Fallback para upload via API tradicional
93
- try {
94
- setProgress({
95
- amount: 0,
96
- message: "Tentando método alternativo...",
97
- });
98
-
99
- const uploadedFile = await UploadService.uploadViaAPI(
100
- file,
101
- uploadConfig,
102
- (progress) => {
103
- setProgress(progress);
104
- onProgress?.(progress);
105
- }
106
- );
107
-
108
- setIsUploading(false);
109
- setProgress(null);
110
- onSuccess?.(uploadedFile);
111
- return uploadedFile;
112
- } catch (fallbackError) {
113
- console.error("Erro no fallback:", fallbackError);
114
- const errorMsg = "Falha no upload da imagem. Tente novamente.";
115
- setError(errorMsg);
116
- setIsUploading(false);
117
- setProgress(null);
118
- onError?.(errorMsg);
119
- return null;
120
- }
121
- }
122
- },
123
- [validateFile, onSuccess, onError, onProgress]
124
- );
125
-
126
- const reset = useCallback(() => {
127
- setIsUploading(false);
128
- setProgress(null);
129
- setError(null);
130
- }, []);
131
-
132
- return {
133
- uploadFile,
134
- isUploading,
135
- progress,
136
- error,
137
- reset,
138
- };
139
- };
1
+ import { useState, useCallback } from "react";
2
+ import { UploadService, UploadConfig } from "../utils/uploadService";
3
+
4
+ interface UploadProgress {
5
+ amount: number;
6
+ message: string;
7
+ }
8
+
9
+ interface UploadedFile {
10
+ url: string;
11
+ filename: string;
12
+ size: number;
13
+ type: string;
14
+ }
15
+
16
+ interface UseImageUploadOptions {
17
+ onSuccess?: (file: UploadedFile) => void;
18
+ onError?: (error: string) => void;
19
+ onProgress?: (progress: UploadProgress) => void;
20
+ maxFileSize?: number;
21
+ allowedTypes?: string[];
22
+ uploadConfig: UploadConfig;
23
+ }
24
+
25
+ export const useImageUpload = (options: UseImageUploadOptions) => {
26
+ const [isUploading, setIsUploading] = useState(false);
27
+ const [progress, setProgress] = useState<UploadProgress | null>(null);
28
+ const [error, setError] = useState<string | null>(null);
29
+
30
+ const {
31
+ onSuccess,
32
+ onError,
33
+ onProgress,
34
+ maxFileSize = 5 * 1024 * 1024, // 5MB default
35
+ allowedTypes = ["image/jpeg", "image/png", "image/gif", "image/webp"],
36
+ uploadConfig,
37
+ } = options;
38
+
39
+ const validateFile = useCallback(
40
+ (file: File): boolean => {
41
+ if (!allowedTypes.includes(file.type)) {
42
+ const errorMsg = "Tipo de arquivo não suportado";
43
+ setError(errorMsg);
44
+ onError?.(errorMsg);
45
+ return false;
46
+ }
47
+
48
+ if (file.size > maxFileSize) {
49
+ const errorMsg = `Arquivo muito grande. Máximo: ${(
50
+ maxFileSize /
51
+ 1024 /
52
+ 1024
53
+ ).toFixed(1)}MB`;
54
+ setError(errorMsg);
55
+ onError?.(errorMsg);
56
+ return false;
57
+ }
58
+
59
+ return true;
60
+ },
61
+ [allowedTypes, maxFileSize, onError]
62
+ );
63
+
64
+ const uploadFile = useCallback(
65
+ async (file: File): Promise<UploadedFile | null> => {
66
+ if (!validateFile(file)) {
67
+ return null;
68
+ }
69
+
70
+ setIsUploading(true);
71
+ setError(null);
72
+ setProgress(null);
73
+
74
+ try {
75
+ // Tenta upload via S3 com URL pré-assinada primeiro
76
+ const uploadedFile = await UploadService.uploadToS3(
77
+ file,
78
+ uploadConfig,
79
+ (progress) => {
80
+ setProgress(progress);
81
+ onProgress?.(progress);
82
+ }
83
+ );
84
+
85
+ setIsUploading(false);
86
+ setProgress(null);
87
+ onSuccess?.(uploadedFile);
88
+ return uploadedFile;
89
+ } catch (error) {
90
+ console.error("Erro no upload S3:", error);
91
+
92
+ // Fallback para upload via API tradicional
93
+ try {
94
+ setProgress({
95
+ amount: 0,
96
+ message: "Tentando método alternativo...",
97
+ });
98
+
99
+ const uploadedFile = await UploadService.uploadViaAPI(
100
+ file,
101
+ uploadConfig,
102
+ (progress) => {
103
+ setProgress(progress);
104
+ onProgress?.(progress);
105
+ }
106
+ );
107
+
108
+ setIsUploading(false);
109
+ setProgress(null);
110
+ onSuccess?.(uploadedFile);
111
+ return uploadedFile;
112
+ } catch (fallbackError) {
113
+ console.error("Erro no fallback:", fallbackError);
114
+ const errorMsg = "Falha no upload da imagem. Tente novamente.";
115
+ setError(errorMsg);
116
+ setIsUploading(false);
117
+ setProgress(null);
118
+ onError?.(errorMsg);
119
+ return null;
120
+ }
121
+ }
122
+ },
123
+ [validateFile, onSuccess, onError, onProgress]
124
+ );
125
+
126
+ const reset = useCallback(() => {
127
+ setIsUploading(false);
128
+ setProgress(null);
129
+ setError(null);
130
+ }, []);
131
+
132
+ return {
133
+ uploadFile,
134
+ isUploading,
135
+ progress,
136
+ error,
137
+ reset,
138
+ };
139
+ };