@lets-events/react 12.2.10 → 12.2.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 (90) 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.css +171 -0
  5. package/dist/index.d.mts +377 -3
  6. package/dist/index.d.ts +377 -3
  7. package/dist/index.js +73 -27
  8. package/dist/index.mjs +72 -27
  9. package/package.json +1 -1
  10. package/src/components/Alert.tsx +303 -303
  11. package/src/components/Avatar.tsx +55 -55
  12. package/src/components/Badge.tsx +125 -125
  13. package/src/components/Box.tsx +3 -3
  14. package/src/components/Button/index.tsx +16 -16
  15. package/src/components/Button/styledComponents.ts +300 -300
  16. package/src/components/ButtonGroup.tsx +484 -484
  17. package/src/components/Calendar/index.tsx +148 -148
  18. package/src/components/Calendar/styledComponents.ts +250 -250
  19. package/src/components/Card.tsx +48 -48
  20. package/src/components/CheckboxGroup.tsx +176 -176
  21. package/src/components/Container.tsx +39 -39
  22. package/src/components/Divider.tsx +7 -0
  23. package/src/components/Drawer/index.tsx +148 -138
  24. package/src/components/Drawer/styledComponents.ts +52 -52
  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/EmailFormField.tsx +27 -27
  39. package/src/components/FormFields/Form.tsx +39 -39
  40. package/src/components/FormFields/IdentityDocumentNumberFormField.tsx +32 -32
  41. package/src/components/FormFields/MultiSelectFormField.tsx +64 -64
  42. package/src/components/FormFields/PhoneFormField.tsx +40 -40
  43. package/src/components/FormFields/RadioGroupFormField.tsx +84 -84
  44. package/src/components/FormFields/RichEditorFormField.tsx +103 -103
  45. package/src/components/FormFields/SelectFormField.tsx +93 -93
  46. package/src/components/FormFields/SwitchFormField.tsx +46 -46
  47. package/src/components/FormFields/TextAreaFormField.tsx +57 -57
  48. package/src/components/FormFields/TextFormField.tsx +112 -112
  49. package/src/components/FormFields/TimePickerFormField.tsx +88 -88
  50. package/src/components/FormFields/subComponents/ErrorFormMessage.tsx +36 -36
  51. package/src/components/FormFields/subComponents/FormLabel.tsx +29 -29
  52. package/src/components/FormFields/utils/validation.ts +23 -23
  53. package/src/components/Grid.tsx +137 -137
  54. package/src/components/Icon.tsx +47 -47
  55. package/src/components/MenuDropdown/index.tsx +38 -38
  56. package/src/components/MenuDropdown/styledComponents.ts +31 -31
  57. package/src/components/Modal.tsx +107 -90
  58. package/src/components/MultiSelect/index.tsx +243 -243
  59. package/src/components/MultiSelect/styledComponents.ts +160 -160
  60. package/src/components/RadioGroup.tsx +210 -210
  61. package/src/components/RichEditor/QuillComponent.tsx +457 -457
  62. package/src/components/RichEditor/RichEditor.tsx +49 -49
  63. package/src/components/RichEditor/index.ts +2 -2
  64. package/src/components/RichEditor/styledComponents.ts +1151 -1151
  65. package/src/components/Section.tsx +33 -33
  66. package/src/components/Step.tsx +164 -164
  67. package/src/components/Switch.tsx +108 -108
  68. package/src/components/Text.tsx +38 -38
  69. package/src/components/TextField.tsx +372 -372
  70. package/src/components/TextareaField.tsx +127 -127
  71. package/src/components/TimePicker.tsx +328 -328
  72. package/src/components/Toast/components/ToastItem.tsx +41 -41
  73. package/src/components/Toast/components/ToastProvider.tsx +63 -63
  74. package/src/components/Toast/hooks/useToast.ts +12 -12
  75. package/src/components/Toast/index.tsx +5 -5
  76. package/src/components/Toast/styles/index.ts +135 -135
  77. package/src/components/Toast/types/index.ts +46 -46
  78. package/src/components/Tooltip/index.tsx +66 -66
  79. package/src/components/Tooltip/styles.ts +77 -77
  80. package/src/hooks/useCountries.ts +41 -41
  81. package/src/hooks/useImageUpload.ts +139 -139
  82. package/src/hooks/useOnClickOutside.tsx +42 -42
  83. package/src/index.tsx +69 -68
  84. package/src/styles/index.ts +38 -38
  85. package/src/types/typographyValues.ts +178 -178
  86. package/src/utils/getNestedValue.ts +3 -3
  87. package/src/utils/states.ts +29 -29
  88. package/src/utils/uploadService.ts +180 -180
  89. package/tsconfig.json +3 -3
  90. 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
+ };