@lets-events/react 12.10.17 → 12.11.0

package/src/hooks/useImageUpload.ts

@@ -1,139 +1,139 @@
-import { useState, useCallback } from "react";
-import { UploadService, UploadConfig } from "../utils/uploadService";
-
-interface UploadProgress {
-  amount: number;
-  message: string;
-}
-
-interface UploadedFile {
-  url: string;
-  filename: string;
-  size: number;
-  type: string;
-}
-
-interface UseImageUploadOptions {
-  onSuccess?: (file: UploadedFile) => void;
-  onError?: (error: string) => void;
-  onProgress?: (progress: UploadProgress) => void;
-  maxFileSize?: number;
-  allowedTypes?: string[];
-  uploadConfig: UploadConfig;
-}
-
-export const useImageUpload = (options: UseImageUploadOptions) => {
-  const [isUploading, setIsUploading] = useState(false);
-  const [progress, setProgress] = useState<UploadProgress | null>(null);
-  const [error, setError] = useState<string | null>(null);
-
-  const {
-    onSuccess,
-    onError,
-    onProgress,
-    maxFileSize = 5 * 1024 * 1024, // 5MB default
-    allowedTypes = ["image/jpeg", "image/png", "image/gif", "image/webp"],
-    uploadConfig,
-  } = options;
-
-  const validateFile = useCallback(
-    (file: File): boolean => {
-      if (!allowedTypes.includes(file.type)) {
-        const errorMsg = "Tipo de arquivo não suportado";
-        setError(errorMsg);
-        onError?.(errorMsg);
-        return false;
-      }
-
-      if (file.size > maxFileSize) {
-        const errorMsg = `Arquivo muito grande. Máximo: ${(
-          maxFileSize /
-          1024 /
-          1024
-        ).toFixed(1)}MB`;
-        setError(errorMsg);
-        onError?.(errorMsg);
-        return false;
-      }
-
-      return true;
-    },
-    [allowedTypes, maxFileSize, onError]
-  );
-
-  const uploadFile = useCallback(
-    async (file: File): Promise<UploadedFile | null> => {
-      if (!validateFile(file)) {
-        return null;
-      }
-
-      setIsUploading(true);
-      setError(null);
-      setProgress(null);
-
-      try {
-        // Tenta upload via S3 com URL pré-assinada primeiro
-        const uploadedFile = await UploadService.uploadToS3(
-          file,
-          uploadConfig,
-          (progress) => {
-            setProgress(progress);
-            onProgress?.(progress);
-          }
-        );
-
-        setIsUploading(false);
-        setProgress(null);
-        onSuccess?.(uploadedFile);
-        return uploadedFile;
-      } catch (error) {
-        console.error("Erro no upload S3:", error);
-
-        // Fallback para upload via API tradicional
-        try {
-          setProgress({
-            amount: 0,
-            message: "Tentando método alternativo...",
-          });
-
-          const uploadedFile = await UploadService.uploadViaAPI(
-            file,
-            uploadConfig,
-            (progress) => {
-              setProgress(progress);
-              onProgress?.(progress);
-            }
-          );
-
-          setIsUploading(false);
-          setProgress(null);
-          onSuccess?.(uploadedFile);
-          return uploadedFile;
-        } catch (fallbackError) {
-          console.error("Erro no fallback:", fallbackError);
-          const errorMsg = "Falha no upload da imagem. Tente novamente.";
-          setError(errorMsg);
-          setIsUploading(false);
-          setProgress(null);
-          onError?.(errorMsg);
-          return null;
-        }
-      }
-    },
-    [validateFile, onSuccess, onError, onProgress]
-  );
-
-  const reset = useCallback(() => {
-    setIsUploading(false);
-    setProgress(null);
-    setError(null);
-  }, []);
-
-  return {
-    uploadFile,
-    isUploading,
-    progress,
-    error,
-    reset,
-  };
-};
+import { useState, useCallback } from "react";
+import { UploadService, UploadConfig } from "../utils/uploadService";
+
+interface UploadProgress {
+  amount: number;
+  message: string;
+}
+
+interface UploadedFile {
+  url: string;
+  filename: string;
+  size: number;
+  type: string;
+}
+
+interface UseImageUploadOptions {
+  onSuccess?: (file: UploadedFile) => void;
+  onError?: (error: string) => void;
+  onProgress?: (progress: UploadProgress) => void;
+  maxFileSize?: number;
+  allowedTypes?: string[];
+  uploadConfig: UploadConfig;
+}
+
+export const useImageUpload = (options: UseImageUploadOptions) => {
+  const [isUploading, setIsUploading] = useState(false);
+  const [progress, setProgress] = useState<UploadProgress | null>(null);
+  const [error, setError] = useState<string | null>(null);
+
+  const {
+    onSuccess,
+    onError,
+    onProgress,
+    maxFileSize = 5 * 1024 * 1024, // 5MB default
+    allowedTypes = ["image/jpeg", "image/png", "image/gif", "image/webp"],
+    uploadConfig,
+  } = options;
+
+  const validateFile = useCallback(
+    (file: File): boolean => {
+      if (!allowedTypes.includes(file.type)) {
+        const errorMsg = "Tipo de arquivo não suportado";
+        setError(errorMsg);
+        onError?.(errorMsg);
+        return false;
+      }
+
+      if (file.size > maxFileSize) {
+        const errorMsg = `Arquivo muito grande. Máximo: ${(
+          maxFileSize /
+          1024 /
+          1024
+        ).toFixed(1)}MB`;
+        setError(errorMsg);
+        onError?.(errorMsg);
+        return false;
+      }
+
+      return true;
+    },
+    [allowedTypes, maxFileSize, onError]
+  );
+
+  const uploadFile = useCallback(
+    async (file: File): Promise<UploadedFile | null> => {
+      if (!validateFile(file)) {
+        return null;
+      }
+
+      setIsUploading(true);
+      setError(null);
+      setProgress(null);
+
+      try {
+        // Tenta upload via S3 com URL pré-assinada primeiro
+        const uploadedFile = await UploadService.uploadToS3(
+          file,
+          uploadConfig,
+          (progress) => {
+            setProgress(progress);
+            onProgress?.(progress);
+          }
+        );
+
+        setIsUploading(false);
+        setProgress(null);
+        onSuccess?.(uploadedFile);
+        return uploadedFile;
+      } catch (error) {
+        console.error("Erro no upload S3:", error);
+
+        // Fallback para upload via API tradicional
+        try {
+          setProgress({
+            amount: 0,
+            message: "Tentando método alternativo...",
+          });
+
+          const uploadedFile = await UploadService.uploadViaAPI(
+            file,
+            uploadConfig,
+            (progress) => {
+              setProgress(progress);
+              onProgress?.(progress);
+            }
+          );
+
+          setIsUploading(false);
+          setProgress(null);
+          onSuccess?.(uploadedFile);
+          return uploadedFile;
+        } catch (fallbackError) {
+          console.error("Erro no fallback:", fallbackError);
+          const errorMsg = "Falha no upload da imagem. Tente novamente.";
+          setError(errorMsg);
+          setIsUploading(false);
+          setProgress(null);
+          onError?.(errorMsg);
+          return null;
+        }
+      }
+    },
+    [validateFile, onSuccess, onError, onProgress]
+  );
+
+  const reset = useCallback(() => {
+    setIsUploading(false);
+    setProgress(null);
+    setError(null);
+  }, []);
+
+  return {
+    uploadFile,
+    isUploading,
+    progress,
+    error,
+    reset,
+  };
+};

package/src/hooks/useMediaQuery.ts

@@ -0,0 +1,19 @@
+import { useEffect, useState } from "react";
+
+export function useMediaQuery(query: string): boolean {
+  const [matches, setMatches] = useState(() =>
+    typeof window !== "undefined" ? window.matchMedia(query).matches : false
+  );
+
+  useEffect(() => {
+    const media = window.matchMedia(query);
+    const listener = (event: MediaQueryListEvent) => setMatches(event.matches);
+
+    setMatches(media.matches);
+    media.addEventListener("change", listener);
+
+    return () => media.removeEventListener("change", listener);
+  }, [query]);
+
+  return matches;
+}

package/src/hooks/useOnClickOutside.tsx

@@ -1,42 +1,42 @@
-import { useEffect } from "react";
-
-export function useOnClickOutside(
-  ref: any,
-  handler: (event?: MouseEvent | TouchEvent) => void
-) {
-  useEffect(() => {
-    const listener = (event: MouseEvent | TouchEvent) => {
-      if (!ref?.current || !event.target) {
-        return;
-      }
-
-      const target = event.target as Element;
-      const currentTarget = event.currentTarget as Element;
-
-      if (ref.current.contains(target) || ref.current.contains(currentTarget)) {
-        return;
-      }
-
-      if (target.tagName === "HTML" || target.tagName === "BODY") {
-        const elementAtPoint = document.elementFromPoint(
-          (event as MouseEvent).clientX,
-          (event as MouseEvent).clientY
-        );
-
-        if (elementAtPoint && ref.current.contains(elementAtPoint)) {
-          return;
-        }
-      }
-
-      handler(event);
-    };
-
-    document.addEventListener("mousedown", listener);
-    document.addEventListener("touchstart", listener);
-
-    return () => {
-      document.removeEventListener("mousedown", listener);
-      document.removeEventListener("touchstart", listener);
-    };
-  }, [ref, handler]);
-}
+import { useEffect } from "react";
+
+export function useOnClickOutside(
+  ref: any,
+  handler: (event?: MouseEvent | TouchEvent) => void
+) {
+  useEffect(() => {
+    const listener = (event: MouseEvent | TouchEvent) => {
+      if (!ref?.current || !event.target) {
+        return;
+      }
+
+      const target = event.target as Element;
+      const currentTarget = event.currentTarget as Element;
+
+      if (ref.current.contains(target) || ref.current.contains(currentTarget)) {
+        return;
+      }
+
+      if (target.tagName === "HTML" || target.tagName === "BODY") {
+        const elementAtPoint = document.elementFromPoint(
+          (event as MouseEvent).clientX,
+          (event as MouseEvent).clientY
+        );
+
+        if (elementAtPoint && ref.current.contains(elementAtPoint)) {
+          return;
+        }
+      }
+
+      handler(event);
+    };
+
+    document.addEventListener("mousedown", listener);
+    document.addEventListener("touchstart", listener);
+
+    return () => {
+      document.removeEventListener("mousedown", listener);
+      document.removeEventListener("touchstart", listener);
+    };
+  }, [ref, handler]);
+}

package/src/index.tsx

@@ -1,72 +1,72 @@
-// Icon
-export * from "./components/Icon";
-
-// Text
-export * from "./components/Text";
-
-// Components
-export * from "./components/Button";
-export * from "./components/ButtonGroup";
-export * from "./components/Avatar";
-export * from "./components/TextField";
-export * from "./components/RadioGroup";
-export * from "./components/CheckboxGroup";
-export * from "./components/Filter";
-export * from "./components/Dropdown";
-export * from "./components/Badge";
-export * from "./components/Modal";
-export * from "./components/MenuDropdown";
-export * from "./components/Calendar";
-export * from "./components/DoubleCalendar";
-export * from "./components/Drawer";
-export * from "./components/TimePicker";
-export * from "./components/Alert";
-export * from "./components/Switch";
-export * from "./components/Step";
-export * from "./components/Card";
-export * from "./components/TextareaField";
-export * from "./components/Toast";
-export * from "./components/Tooltip";
-export * from "./components/MultiSelect";
-export * from "./components/Divider";
-export * from "./components/ToggleElement";
-// Layouts
-export * from "./components/Flex";
-export * from "./components/Box";
-export * from "./components/Grid";
-export * from "./components/Container";
-export * from "./components/Section";
-
-//Form
-export * from "./components/FormFields/subComponents/ErrorFormMessage";
-export * from "./components/FormFields/subComponents/FormLabel";
-export * from "./components/FormFields/TextAreaFormField";
-export * from "./components/FormFields/TextFormField";
-export * from "./components/FormFields/Form";
-export * from "./components/FormFields/MultiSelectFormField";
-export * from "./components/FormFields/PhoneFormField";
-export * from "./components/FormFields/CPFFormField";
-export * from "./components/FormFields/CNPJFormField";
-export * from "./components/FormFields/BirthDateFormField";
-export * from "./components/FormFields/IdentityDocumentNumberFormField";
-export * from "./components/FormFields/AddressFormFields/index";
-export * from "./components/FormFields/RadioGroupFormField";
-export * from "./components/FormFields/CheckboxGroupFormField";
-export * from "./components/FormFields/AddressFormFields/CountryFormField";
-export * from "./components/FormFields/SelectFormField";
-export * from "./components/FormFields/SwitchFormField";
-export * from "./components/FormFields/EmailFormField";
-export * from "./components/FormFields/RichEditorFormField";
-export * from "./components/FormFields/CalendarFormField";
-export * from "./components/FormFields/DoubleCalendarFormField";
-export * from "./components/FormFields/TimePickerFormField";
-export * from "./components/FormFields/DateAndTimeFormField";
-
-// Rich Editor
-export * from "./components/RichEditor";
-
-// Hooks
-export * from "./hooks/useImageUpload";
-
-// Utils
-export * from "./utils/uploadService";
+// Icon
+export * from "./components/Icon";
+
+// Text
+export * from "./components/Text";
+
+// Components
+export * from "./components/Button";
+export * from "./components/ButtonGroup";
+export * from "./components/Avatar";
+export * from "./components/TextField";
+export * from "./components/RadioGroup";
+export * from "./components/CheckboxGroup";
+export * from "./components/Filter";
+export * from "./components/Dropdown";
+export * from "./components/Badge";
+export * from "./components/Modal";
+export * from "./components/MenuDropdown";
+export * from "./components/Calendar";
+export * from "./components/DoubleCalendar";
+export * from "./components/Drawer";
+export * from "./components/TimePicker";
+export * from "./components/Alert";
+export * from "./components/Switch";
+export * from "./components/Step";
+export * from "./components/Card";
+export * from "./components/TextareaField";
+export * from "./components/Toast";
+export * from "./components/Tooltip";
+export * from "./components/MultiSelect";
+export * from "./components/Divider";
+export * from "./components/ToggleElement";
+// Layouts
+export * from "./components/Flex";
+export * from "./components/Box";
+export * from "./components/Grid";
+export * from "./components/Container";
+export * from "./components/Section";
+
+//Form
+export * from "./components/FormFields/subComponents/ErrorFormMessage";
+export * from "./components/FormFields/subComponents/FormLabel";
+export * from "./components/FormFields/TextAreaFormField";
+export * from "./components/FormFields/TextFormField";
+export * from "./components/FormFields/Form";
+export * from "./components/FormFields/MultiSelectFormField";
+export * from "./components/FormFields/PhoneFormField";
+export * from "./components/FormFields/CPFFormField";
+export * from "./components/FormFields/CNPJFormField";
+export * from "./components/FormFields/BirthDateFormField";
+export * from "./components/FormFields/IdentityDocumentNumberFormField";
+export * from "./components/FormFields/AddressFormFields/index";
+export * from "./components/FormFields/RadioGroupFormField";
+export * from "./components/FormFields/CheckboxGroupFormField";
+export * from "./components/FormFields/AddressFormFields/CountryFormField";
+export * from "./components/FormFields/SelectFormField";
+export * from "./components/FormFields/SwitchFormField";
+export * from "./components/FormFields/EmailFormField";
+export * from "./components/FormFields/RichEditorFormField";
+export * from "./components/FormFields/CalendarFormField";
+export * from "./components/FormFields/DoubleCalendarFormField";
+export * from "./components/FormFields/TimePickerFormField";
+export * from "./components/FormFields/DateAndTimeFormField";
+
+// Rich Editor
+export * from "./components/RichEditor";
+
+// Hooks
+export * from "./hooks/useImageUpload";
+
+// Utils
+export * from "./utils/uploadService";

package/src/styles/index.ts

@@ -1,41 +1,41 @@
-import {
-  colors,
-  fontSizes,
-  fontWeights,
-  fonts,
-  lineHeights,
-  radii,
-  space,
-} from "@lets-events/tokens";
-
-import { createStitches, defaultThemeMap } from "@stitches/react";
-
-export const {
-  styled,
-  css,
-  globalCss,
-  keyframes,
-  getCssText,
-  theme,
-  createTheme,
-  config,
-} = createStitches({
-  themeMap: {
-    ...defaultThemeMap,
-    height: "space",
-    width: "space",
-    gap: "space",
-  },
-  theme: {
-    colors,
-    fontSizes,
-    fonts,
-    fontWeights,
-    lineHeights,
-    radii,
-    space,
-  },
-  media: {
-    md: "(max-width: 690px)",
-  },
-});
+import {
+  colors,
+  fontSizes,
+  fontWeights,
+  fonts,
+  lineHeights,
+  radii,
+  space,
+} from "@lets-events/tokens";
+
+import { createStitches, defaultThemeMap } from "@stitches/react";
+
+export const {
+  styled,
+  css,
+  globalCss,
+  keyframes,
+  getCssText,
+  theme,
+  createTheme,
+  config,
+} = createStitches({
+  themeMap: {
+    ...defaultThemeMap,
+    height: "space",
+    width: "space",
+    gap: "space",
+  },
+  theme: {
+    colors,
+    fontSizes,
+    fonts,
+    fontWeights,
+    lineHeights,
+    radii,
+    space,
+  },
+  media: {
+    md: "(max-width: 690px)",
+  },
+});