kitunga-web 0.1.78

package/dist/features/uploads/components/ImageUpload/ImageUpload.js

@@ -0,0 +1,178 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useRef, useCallback, useEffect } from 'react';
+import { X, Pause, Check, Image as ImageIcon, ArrowLeft, ArrowRight, AlertCircle } from 'lucide-react';
+import styles from './ImageUpload.module.css';
+import TextInput from '@/features/inputs/components/Inputs/TextInput';
+import Button from '@/features/buttons/components/Btns/Button';
+import axios from 'axios';
+const API_URL = process.env.NEXT_PUBLIC_API_URL;
+const ImageUpload = ({ value = '', onChange, onKeyChange, accept = 'image/png,image/jpeg,image/jpg,image/webp,image/avif', uploadUrl, tokenStorageKey, }) => {
+    const [isDragging, setIsDragging] = useState(false);
+    const [isUploading, setIsUploading] = useState(false);
+    const [uploadProgress, setUploadProgress] = useState(0);
+    const [uploadedFile, setUploadedFile] = useState(null);
+    const [urlInput, setUrlInput] = useState('');
+    const fileInputRef = useRef(null);
+    const dragCounterRef = useRef(0);
+    const [error, setError] = useState(null);
+    // Limpar estado quando o value for vazio (quando a imagem é removida)
+    useEffect(() => {
+        if (!value || (typeof value === 'string' && value.trim().length === 0)) {
+            setUploadedFile(null);
+            setUploadProgress(0);
+            setIsUploading(false);
+            setIsDragging(false);
+            setError(null);
+            dragCounterRef.current = 0;
+            if (fileInputRef.current) {
+                fileInputRef.current.value = '';
+            }
+        }
+    }, [value]);
+    // Auto-clear error after 3000ms
+    useEffect(() => {
+        if (error) {
+            const timer = setTimeout(() => {
+                setError(null);
+            }, 3000);
+            return () => clearTimeout(timer);
+        }
+    }, [error]);
+    const formatFileSize = (bytes) => {
+        if (bytes < 1024)
+            return `${bytes} B`;
+        if (bytes < 1024 * 1024)
+            return `${(bytes / 1024).toFixed(1)} KB`;
+        return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+    };
+    const handleFileSelect = async (file) => {
+        var _a, _b;
+        setError(null);
+        if (!file.type.startsWith('image/')) {
+            setError('Apenas imagens são permitidas');
+            return;
+        }
+        setUploadedFile({ name: file.name, size: file.size });
+        setIsUploading(true);
+        setUploadProgress(0);
+        try {
+            const formData = new FormData();
+            formData.append('file', file);
+            const token = (typeof window !== 'undefined' && tokenStorageKey) ? localStorage.getItem(tokenStorageKey) : null;
+            if (!uploadUrl) {
+                throw new Error('uploadUrl é obrigatório para ImageUpload');
+            }
+            const uploadEndpoint = uploadUrl.startsWith('http')
+                ? uploadUrl
+                : `${API_URL}${uploadUrl}`;
+            const response = await axios.post(uploadEndpoint, formData, {
+                headers: Object.assign({ 'Content-Type': 'multipart/form-data' }, (token ? { Authorization: `Bearer ${token}` } : {})),
+                onUploadProgress: (progressEvent) => {
+                    if (progressEvent.total) {
+                        const percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total);
+                        setUploadProgress(percentCompleted);
+                    }
+                },
+            });
+            const imageUrl = response.data.url;
+            const objectKey = response.data.key;
+            setIsUploading(false);
+            setUploadProgress(100); // Garante 100% ao finalizar
+            if (typeof objectKey === 'string' && objectKey.trim().length > 0) {
+                onKeyChange === null || onKeyChange === void 0 ? void 0 : onKeyChange(objectKey);
+            }
+            onChange(imageUrl);
+        }
+        catch (error) {
+            const uploadError = error;
+            console.warn('Erro ao fazer upload do ficheiro:', uploadError.message); // Usar warn para evitar overlay de erro no Next.js
+            // Extrair mensagem de erro amigável
+            const backendMessage = (_b = (_a = uploadError.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.message;
+            // Se for array (NestJS default validation), pega o primeiro
+            const message = Array.isArray(backendMessage) ? backendMessage[0] : backendMessage;
+            setError(message || 'Erro ao fazer upload');
+            setIsUploading(false);
+            setUploadedFile(null);
+            setUploadProgress(0);
+        }
+    };
+    const handleDragEnter = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        dragCounterRef.current++;
+        if (e.dataTransfer.items && e.dataTransfer.items.length > 0) {
+            setIsDragging(true);
+        }
+    }, []);
+    const handleDragLeave = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        dragCounterRef.current--;
+        if (dragCounterRef.current === 0) {
+            setIsDragging(false);
+        }
+    }, []);
+    const handleDragOver = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+    }, []);
+    const handleDrop = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        setIsDragging(false);
+        dragCounterRef.current = 0;
+        if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {
+            handleFileSelect(e.dataTransfer.files[0]);
+        }
+    }, []);
+    const handleFileInputChange = (e) => {
+        if (e.target.files && e.target.files.length > 0) {
+            handleFileSelect(e.target.files[0]);
+        }
+    };
+    const handleUrlUpload = () => {
+        setError(null);
+        if (urlInput.trim()) {
+            onKeyChange === null || onKeyChange === void 0 ? void 0 : onKeyChange('');
+            onChange(urlInput.trim());
+            setUrlInput('');
+        }
+    };
+    const handleRemove = () => {
+        if (value && value.startsWith('blob:')) {
+            URL.revokeObjectURL(value);
+        }
+        onKeyChange === null || onKeyChange === void 0 ? void 0 : onKeyChange('');
+        onChange('');
+        setUploadedFile(null);
+        setUploadProgress(0);
+        setIsUploading(false);
+        setError(null);
+        if (fileInputRef.current) {
+            fileInputRef.current.value = '';
+        }
+    };
+    const handlePause = () => {
+        // Implementar pausa de upload se necessário
+        console.log('Pausar upload');
+    };
+    const handleBrowseClick = () => {
+        var _a;
+        (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click();
+    };
+    // Verificar se há uma imagem válida (não vazia, não null, não undefined)
+    const hasImage = Boolean(value && typeof value === 'string' && value.trim().length > 0 && !isUploading);
+    return (_jsxs("div", { className: styles.imageUploadContainer, children: [!hasImage && !isUploading && (_jsxs(_Fragment, { children: [_jsxs("div", { className: `${styles.dropZone} ${isDragging ? styles.dragging : ''} ${error ? styles.dropZoneError : ''}`, onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop, onClick: handleBrowseClick, children: [_jsx("div", { className: styles.dropZoneContent, children: error ? (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.errorIcon, children: _jsx(AlertCircle, { size: 48, color: "#ef4444" }) }), _jsx("p", { className: styles.errorMessageText, style: { color: '#ef4444' }, children: error })] })) : isDragging ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: styles.dragIcons, children: [_jsx(ArrowLeft, { size: 24 }), _jsx(ArrowRight, { size: 24 })] }), _jsx("p", { className: styles.dropText, children: "Solte seus arquivos aqui" })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.uploadIcon, children: _jsx(ImageIcon, { size: 48 }) }), _jsx("p", { className: styles.dropText, children: "Arraste sua imagem aqui, ou clique para procurar" }), _jsx("p", { className: styles.supportedFormats, children: "Suporta: PNG, JPG, JPEG, WEBP, AVIF" })] })) }), _jsx("input", { ref: fileInputRef, type: "file", accept: accept, onChange: handleFileInputChange, className: styles.fileInput, disabled: !!error })] }), _jsx("div", { className: styles.divider, children: _jsx("span", { children: "ou" }) }), _jsxs("div", { className: styles.urlUpload, children: [_jsx(TextInput, { value: urlInput, onChange: (value) => setUrlInput(value), placeholder: "Adicione URL do arquivo", onKeyPress: (e) => {
+                                    if (e.key === 'Enter') {
+                                        handleUrlUpload();
+                                    }
+                                } }), _jsx(Button, { onClick: handleUrlUpload, disabled: !urlInput.trim(), children: "Upload" })] })] })), isUploading && uploadedFile && (_jsxs("div", { className: styles.uploadProgress, children: [_jsxs("div", { className: styles.fileInfo, children: [_jsx(ImageIcon, { size: 20 }), _jsxs("div", { className: styles.fileDetails, children: [_jsx("span", { className: styles.fileName, children: uploadedFile.name }), _jsx("span", { className: styles.fileSize, children: formatFileSize(uploadedFile.size) })] })] }), _jsxs("div", { className: styles.progressBarContainer, children: [_jsx("div", { className: styles.progressBar, children: _jsx("div", { className: styles.progressFill, style: { width: `${uploadProgress}%` } }) }), _jsxs("span", { className: styles.progressText, children: [uploadProgress, "%"] }), _jsx("button", { type: "button", onClick: handlePause, className: styles.pauseButton, title: "Pausar", children: _jsx(Pause, { size: 16 }) }), _jsx("button", { type: "button", onClick: handleRemove, className: styles.removeButton, title: "Cancelar", children: _jsx(X, { size: 16 }) })] })] })), hasImage && value && value.trim().length > 0 && (_jsxs("div", { className: styles.imagePreview, children: [_jsxs("div", { className: styles.previewContainer, children: [_jsx("img", { src: value, alt: "Preview", className: styles.previewImage, onError: (e) => {
+                                    // Se a imagem falhar ao carregar, limpar o valor
+                                    const target = e.target;
+                                    target.style.display = 'none';
+                                    onChange('');
+                                } }, value), _jsx("button", { type: "button", onClick: handleRemove, className: styles.removeImageButton, title: "Remover imagem", children: _jsx(X, { size: 20 }) })] }), uploadedFile && (_jsxs("div", { className: styles.fileInfo, children: [_jsx(ImageIcon, { size: 16 }), _jsx("span", { className: styles.fileName, children: uploadedFile.name }), _jsx("span", { className: styles.fileSize, children: formatFileSize(uploadedFile.size) }), _jsx(Check, { size: 16, className: styles.checkIcon })] }))] }))] }));
+};
+export default ImageUpload;
+//# sourceMappingURL=ImageUpload.js.map

package/dist/features/uploads/components/ImageUpload/ImageUpload.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageUpload.js","sourceRoot":"","sources":["../../../../../src/features/uploads/components/ImageUpload/ImageUpload.tsx"],"names":[],"mappings":"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"}

package/dist/features/uploads/components/ImageUpload/ImageUpload.module.css

@@ -0,0 +1,254 @@
+.imageUploadContainer {
+  display: flex;
+  flex-direction: column;
+  gap: 0;
+}
+
+.label {
+  display: block;
+  margin-bottom: 0.5rem;
+  font-weight: 500;
+  color: var(--text-primary);
+  font-size: 0.9rem;
+}
+
+.dropZone {
+  border: 2px dashed var(--border-divider);
+  border-radius: var(--radius-sm);
+  padding: var(--spacing-xl);
+  text-align: center;
+  cursor: pointer;
+  transition: all var(--transition-fast);
+  background-color: var(--bg-secondary);
+  min-height: 180px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.dropZone:hover {
+  border-color: var(--color-primary);
+  background-color: var(--bg-primary);
+}
+
+.dropZone.dragging {
+  border-color: var(--color-primary);
+  background-color: var(--color-primary-light, rgba(59, 130, 246, 0.1));
+  border-style: solid;
+}
+
+.dropZoneContent {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--spacing-md);
+}
+
+.uploadIcon {
+  color: var(--text-secondary);
+  margin-bottom: var(--spacing-sm);
+}
+
+.dragIcons {
+  display: flex;
+  gap: var(--spacing-md);
+  color: var(--color-primary);
+  margin-bottom: var(--spacing-sm);
+}
+
+.dropText {
+  font-size: 0.95rem;
+  color: var(--text-primary);
+  margin: 0;
+  font-weight: 500;
+}
+
+.supportedFormats {
+  font-size: 0.85rem;
+  color: var(--text-secondary);
+  margin: 0;
+}
+
+.fileInput {
+  display: none;
+}
+
+.divider {
+  display: flex;
+  align-items: center;
+  text-align: center;
+  margin: var(--spacing-md) 0;
+  position: relative;
+}
+
+.divider::before,
+.divider::after {
+  content: '';
+  flex: 1;
+  border-bottom: 1px solid var(--border-divider);
+}
+
+.divider span {
+  padding: 0 var(--spacing-md);
+  color: var(--text-secondary);
+  font-size: 0.875rem;
+  background-color: var(--bg-primary);
+}
+
+.urlUpload {
+  display: flex;
+  gap: var(--spacing-sm);
+}
+
+.uploadProgress {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-md);
+  padding: var(--spacing-md);
+  background-color: var(--bg-secondary);
+  border-radius: var(--radius-sm);
+  border: 1px solid var(--border-color);
+}
+
+.fileInfo {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-sm);
+  color: var(--text-primary);
+}
+
+.fileDetails {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  gap: 0.25rem;
+}
+
+.fileName {
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: var(--text-primary);
+}
+
+.fileSize {
+  font-size: 0.75rem;
+  color: var(--text-secondary);
+}
+
+.progressBarContainer {
+  display: flex;
+  align-items: center;
+  gap: var(--spacing-sm);
+}
+
+.progressBar {
+  flex: 1;
+  height: 8px;
+  background-color: var(--bg-primary);
+  border-radius: 999px;
+  overflow: hidden;
+}
+
+.progressFill {
+  height: 100%;
+  background-color: var(--color-primary);
+  transition: width 0.3s ease;
+  border-radius: 999px;
+}
+
+.progressText {
+  font-size: 0.75rem;
+  font-weight: 600;
+  color: var(--text-secondary);
+  min-width: 40px;
+  text-align: right;
+}
+
+.pauseButton,
+.removeButton {
+  background: transparent;
+  border: none;
+  color: var(--text-secondary);
+  cursor: pointer;
+  padding: 0.25rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: color var(--transition-fast);
+  border-radius: var(--radius-sm);
+}
+
+.pauseButton:hover,
+.removeButton:hover {
+  color: var(--text-primary);
+  background-color: var(--bg-primary);
+}
+
+.imagePreview {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-md);
+}
+
+.previewContainer {
+  position: relative;
+  width: 100%;
+  height: 200px;
+  max-height: 200px;
+  border-radius: var(--radius-lg);
+  overflow: hidden;
+  border: 1px solid var(--border-color);
+  background-color: var(--bg-secondary);
+}
+
+.previewImage {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  display: block;
+}
+
+.removeImageButton {
+  position: absolute;
+  top: var(--spacing-sm);
+  right: var(--spacing-sm);
+  background-color: rgba(0, 0, 0, 0.7);
+  color: white;
+  border: none;
+  border-radius: 50%;
+  width: 32px;
+  height: 32px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  transition: all var(--transition-fast);
+}
+
+.removeImageButton:hover {
+  background-color: rgba(0, 0, 0, 0.9);
+  transform: scale(1.1);
+}
+
+.checkIcon {
+  color: var(--color-success, #10b981);
+  margin-left: auto;
+}
+
+.dropZoneError {
+  border-color: #ef4444;
+  background-color: rgba(239, 68, 68, 0.05); /* slightly red bg */
+}
+
+.errorIcon {
+  color: #ef4444;
+  margin-bottom: var(--spacing-sm);
+}
+
+.errorMessageText {
+  font-size: 0.95rem;
+  color: #ef4444;
+  margin: 0;
+  font-weight: 500;
+  text-align: center;
+}

package/dist/features/uploads/components/VideoUpload/VideoUpload.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+interface VideoUploadProps {
+    value?: string;
+    onChange: (url: string) => void;
+    onKeyChange?: (key: string) => void;
+    accept?: string;
+    uploadUrl?: string;
+    tokenStorageKey?: string;
+}
+declare const VideoUpload: React.FC<VideoUploadProps>;
+export default VideoUpload;
+//# sourceMappingURL=VideoUpload.d.ts.map

package/dist/features/uploads/components/VideoUpload/VideoUpload.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VideoUpload.d.ts","sourceRoot":"","sources":["../../../../../src/features/uploads/components/VideoUpload/VideoUpload.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmD,MAAM,OAAO,CAAC;AASxE,UAAU,gBAAgB;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAyU3C,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/features/uploads/components/VideoUpload/VideoUpload.js

@@ -0,0 +1,183 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useRef, useCallback, useEffect } from 'react';
+import { X, Pause, Check, Video, ArrowLeft, ArrowRight, AlertCircle, Play, PauseIcon } from 'lucide-react';
+import styles from './VideoUpload.module.css';
+import TextInput from '@/features/inputs/components/Inputs/TextInput';
+import Button from '@/features/buttons/components/Btns/Button';
+import axios from 'axios';
+const API_URL = process.env.NEXT_PUBLIC_API_URL;
+const VideoUpload = ({ value = '', onChange, onKeyChange, accept = 'video/mp4,video/webm,video/ogg,video/quicktime', uploadUrl, tokenStorageKey, }) => {
+    const [isDragging, setIsDragging] = useState(false);
+    const [isUploading, setIsUploading] = useState(false);
+    const [uploadProgress, setUploadProgress] = useState(0);
+    const [uploadedFile, setUploadedFile] = useState(null);
+    const [urlInput, setUrlInput] = useState('');
+    const [isPlaying, setIsPlaying] = useState(false);
+    const fileInputRef = useRef(null);
+    const videoRef = useRef(null);
+    const dragCounterRef = useRef(0);
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        if (!value || (typeof value === 'string' && value.trim().length === 0)) {
+            setUploadedFile(null);
+            setUploadProgress(0);
+            setIsUploading(false);
+            setIsDragging(false);
+            setIsPlaying(false);
+            setError(null);
+            dragCounterRef.current = 0;
+            if (fileInputRef.current) {
+                fileInputRef.current.value = '';
+            }
+        }
+    }, [value]);
+    useEffect(() => {
+        if (error) {
+            const timer = setTimeout(() => setError(null), 3000);
+            return () => clearTimeout(timer);
+        }
+    }, [error]);
+    const formatFileSize = (bytes) => {
+        if (bytes < 1024)
+            return `${bytes} B`;
+        if (bytes < 1024 * 1024)
+            return `${(bytes / 1024).toFixed(1)} KB`;
+        return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+    };
+    const handleFileSelect = async (file) => {
+        var _a, _b;
+        setError(null);
+        if (!file.type.startsWith('video/')) {
+            setError('Apenas videos sao permitidos');
+            return;
+        }
+        setUploadedFile({ name: file.name, size: file.size });
+        setIsUploading(true);
+        setUploadProgress(0);
+        try {
+            const formData = new FormData();
+            formData.append('file', file);
+            const token = (typeof window !== 'undefined' && tokenStorageKey) ? localStorage.getItem(tokenStorageKey) : null;
+            if (!uploadUrl) {
+                throw new Error('uploadUrl e obrigatorio para VideoUpload');
+            }
+            const uploadEndpoint = uploadUrl.startsWith('http')
+                ? uploadUrl
+                : `${API_URL}${uploadUrl}`;
+            const response = await axios.post(uploadEndpoint, formData, {
+                headers: Object.assign({ 'Content-Type': 'multipart/form-data' }, (token ? { Authorization: `Bearer ${token}` } : {})),
+                onUploadProgress: (progressEvent) => {
+                    if (progressEvent.total) {
+                        const percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total);
+                        setUploadProgress(percentCompleted);
+                    }
+                },
+            });
+            const videoUrl = response.data.url;
+            const objectKey = response.data.key;
+            setIsUploading(false);
+            setUploadProgress(100);
+            if (typeof objectKey === 'string' && objectKey.trim().length > 0) {
+                onKeyChange === null || onKeyChange === void 0 ? void 0 : onKeyChange(objectKey);
+            }
+            onChange(videoUrl);
+        }
+        catch (error) {
+            const uploadError = error;
+            console.warn('Erro ao fazer upload do video:', uploadError.message);
+            const backendMessage = (_b = (_a = uploadError.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.message;
+            const message = Array.isArray(backendMessage) ? backendMessage[0] : backendMessage;
+            setError(message || 'Erro ao fazer upload do video');
+            setIsUploading(false);
+            setUploadedFile(null);
+            setUploadProgress(0);
+        }
+    };
+    const handleDragEnter = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        dragCounterRef.current++;
+        if (e.dataTransfer.items && e.dataTransfer.items.length > 0) {
+            setIsDragging(true);
+        }
+    }, []);
+    const handleDragLeave = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        dragCounterRef.current--;
+        if (dragCounterRef.current === 0) {
+            setIsDragging(false);
+        }
+    }, []);
+    const handleDragOver = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+    }, []);
+    const handleDrop = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        setIsDragging(false);
+        dragCounterRef.current = 0;
+        if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {
+            handleFileSelect(e.dataTransfer.files[0]);
+        }
+    }, []);
+    const handleFileInputChange = (e) => {
+        if (e.target.files && e.target.files.length > 0) {
+            handleFileSelect(e.target.files[0]);
+        }
+    };
+    const handleUrlUpload = () => {
+        setError(null);
+        if (urlInput.trim()) {
+            onKeyChange === null || onKeyChange === void 0 ? void 0 : onKeyChange('');
+            onChange(urlInput.trim());
+            setUrlInput('');
+        }
+    };
+    const handleRemove = () => {
+        if (value && value.startsWith('blob:')) {
+            URL.revokeObjectURL(value);
+        }
+        onKeyChange === null || onKeyChange === void 0 ? void 0 : onKeyChange('');
+        onChange('');
+        setUploadedFile(null);
+        setUploadProgress(0);
+        setIsUploading(false);
+        setIsPlaying(false);
+        setError(null);
+        if (fileInputRef.current) {
+            fileInputRef.current.value = '';
+        }
+    };
+    const handlePause = () => {
+        console.log('Pausar upload');
+    };
+    const handleBrowseClick = () => {
+        var _a;
+        (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click();
+    };
+    const togglePlayPause = (e) => {
+        e.stopPropagation();
+        if (!videoRef.current)
+            return;
+        if (isPlaying) {
+            videoRef.current.pause();
+        }
+        else {
+            videoRef.current.play();
+        }
+        setIsPlaying(!isPlaying);
+    };
+    const handleVideoPlay = () => setIsPlaying(true);
+    const handleVideoPause = () => setIsPlaying(false);
+    const handleVideoEnded = () => setIsPlaying(false);
+    const hasVideo = Boolean(value && typeof value === 'string' && value.trim().length > 0 && !isUploading);
+    return (_jsxs("div", { className: styles.videoUploadContainer, children: [!hasVideo && !isUploading && (_jsxs(_Fragment, { children: [_jsxs("div", { className: `${styles.dropZone} ${isDragging ? styles.dragging : ''} ${error ? styles.dropZoneError : ''}`, onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop, onClick: handleBrowseClick, children: [_jsx("div", { className: styles.dropZoneContent, children: error ? (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.errorIcon, children: _jsx(AlertCircle, { size: 48, color: "#ef4444" }) }), _jsx("p", { className: styles.errorMessageText, style: { color: '#ef4444' }, children: error })] })) : isDragging ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: styles.dragIcons, children: [_jsx(ArrowLeft, { size: 24 }), _jsx(ArrowRight, { size: 24 })] }), _jsx("p", { className: styles.dropText, children: "Solte seus videos aqui" })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: styles.uploadIcon, children: _jsx(Video, { size: 48 }) }), _jsx("p", { className: styles.dropText, children: "Arraste seu video aqui, ou clique para procurar" }), _jsx("p", { className: styles.supportedFormats, children: "Suporta: MP4, WebM, OGG, MOV" })] })) }), _jsx("input", { ref: fileInputRef, type: "file", accept: accept, onChange: handleFileInputChange, className: styles.fileInput, disabled: !!error })] }), _jsx("div", { className: styles.divider, children: _jsx("span", { children: "ou" }) }), _jsxs("div", { className: styles.urlUpload, children: [_jsx(TextInput, { value: urlInput, onChange: (value) => setUrlInput(value), placeholder: "Adicione URL do video", onKeyPress: (e) => {
+                                    if (e.key === 'Enter')
+                                        handleUrlUpload();
+                                } }), _jsx(Button, { onClick: handleUrlUpload, disabled: !urlInput.trim(), children: "Upload" })] })] })), isUploading && uploadedFile && (_jsxs("div", { className: styles.uploadProgress, children: [_jsxs("div", { className: styles.fileInfo, children: [_jsx(Video, { size: 20 }), _jsxs("div", { className: styles.fileDetails, children: [_jsx("span", { className: styles.fileName, children: uploadedFile.name }), _jsx("span", { className: styles.fileSize, children: formatFileSize(uploadedFile.size) })] })] }), _jsxs("div", { className: styles.progressBarContainer, children: [_jsx("div", { className: styles.progressBar, children: _jsx("div", { className: styles.progressFill, style: { width: `${uploadProgress}%` } }) }), _jsxs("span", { className: styles.progressText, children: [uploadProgress, "%"] }), _jsx("button", { type: "button", onClick: handlePause, className: styles.pauseButton, title: "Pausar", children: _jsx(Pause, { size: 16 }) }), _jsx("button", { type: "button", onClick: handleRemove, className: styles.removeButton, title: "Cancelar", children: _jsx(X, { size: 16 }) })] })] })), hasVideo && value && value.trim().length > 0 && (_jsxs("div", { className: styles.videoPreview, children: [_jsxs("div", { className: styles.previewContainer, children: [_jsx("video", { ref: videoRef, src: value, className: styles.previewVideo, onPlay: handleVideoPlay, onPause: handleVideoPause, onEnded: handleVideoEnded, onError: () => onChange('') }, value), _jsx("button", { type: "button", onClick: togglePlayPause, className: styles.playPauseButton, title: isPlaying ? 'Pausar' : 'Reproduzir', children: isPlaying ? _jsx(PauseIcon, { size: 32 }) : _jsx(Play, { size: 32 }) }), _jsx("button", { type: "button", onClick: handleRemove, className: styles.removeVideoButton, title: "Remover video", children: _jsx(X, { size: 20 }) })] }), uploadedFile && (_jsxs("div", { className: styles.fileInfo, children: [_jsx(Video, { size: 16 }), _jsx("span", { className: styles.fileName, children: uploadedFile.name }), _jsx("span", { className: styles.fileSize, children: formatFileSize(uploadedFile.size) }), _jsx(Check, { size: 16, className: styles.checkIcon })] }))] }))] }));
+};
+export default VideoUpload;
+//# sourceMappingURL=VideoUpload.js.map