@jhits/plugin-images 0.0.13 → 0.0.15

package/src/views/ImageManager/components/ImageManagerToolbar.tsx

@@ -0,0 +1,60 @@
+'use client';
+
+import React from 'react';
+import { Search, Grid3x3, List } from 'lucide-react';
+
+interface ImageManagerToolbarProps {
+    search: string;
+    setSearch: (value: string) => void;
+    viewMode: 'grid' | 'list';
+    setViewMode: (mode: 'grid' | 'list') => void;
+}
+
+export function ImageManagerToolbar({
+    search,
+    setSearch,
+    viewMode,
+    setViewMode
+}: ImageManagerToolbarProps) {
+    return (
+        <div className="px-4">
+            <div className="flex flex-col sm:flex-row items-center gap-4 p-2 bg-dashboard-card/30 backdrop-blur-xl border border-dashboard-border/40 rounded-2xl shadow-sm">
+                <div className="relative flex-1 group w-full">
+                    <Search className="absolute left-4 top-1/2 -translate-y-1/2 text-dashboard-text-secondary/40 group-focus-within:text-primary transition-colors duration-300" size={18} />
+                    <input
+                        type="text"
+                        placeholder="Search assets by filename..."
+                        value={search}
+                        onChange={(e) => setSearch(e.target.value)}
+                        className="w-full pl-12 pr-6 py-3 bg-transparent border-none outline-none text-sm font-semibold text-dashboard-text placeholder:text-dashboard-text-secondary/30"
+                    />
+                </div>
+
+                <div className="flex items-center gap-1.5 p-1.5 bg-dashboard-bg/50 rounded-xl border border-dashboard-border/40">
+                    <button
+                        onClick={() => setViewMode('grid')}
+                        className={`p-2.5 rounded-lg transition-all ${
+                            viewMode === 'grid'
+                                ? 'bg-primary text-white shadow-lg shadow-primary/20'
+                                : 'text-dashboard-text-secondary hover:text-primary hover:bg-primary/5'
+                        }`}
+                        title="Grid View"
+                    >
+                        <Grid3x3 size={18} />
+                    </button>
+                    <button
+                        onClick={() => setViewMode('list')}
+                        className={`p-2.5 rounded-lg transition-all ${
+                            viewMode === 'list'
+                                ? 'bg-primary text-white shadow-lg shadow-primary/20'
+                                : 'text-dashboard-text-secondary hover:text-primary hover:bg-primary/5'
+                        }`}
+                        title="List View"
+                    >
+                        <List size={18} />
+                    </button>
+                </div>
+            </div>
+        </div>
+    );
+}

package/src/views/ImageManager/components/ImageTable.tsx

@@ -0,0 +1,120 @@
+'use client';
+
+import React from 'react';
+import Image from 'next/image';
+import { Eye, Trash2, Activity, Circle, CheckCircle2 } from 'lucide-react';
+import { ImageMetadata } from '../types';
+
+interface ImageTableProps {
+    images: ImageMetadata[];
+    isImageInUse: (filename: string) => boolean;
+    getImageUsage: (filename: string) => any[];
+    formatFileSize: (bytes: number) => string;
+    formatDate: (date: string) => string;
+    onViewFull: (url: string) => void;
+    onDelete: (image: ImageMetadata) => void;
+}
+
+export function ImageTable({
+    images,
+    isImageInUse,
+    getImageUsage,
+    formatFileSize,
+    formatDate,
+    onViewFull,
+    onDelete
+}: ImageTableProps) {
+    return (
+        <div className="bg-dashboard-card/40 rounded-2xl overflow-hidden border border-dashboard-border/40 shadow-sm">
+            <table className="w-full text-left border-collapse">
+                <thead>
+                    <tr className="text-[10px] font-bold text-dashboard-text-secondary uppercase tracking-widest border-b border-dashboard-border/40 bg-dashboard-bg/20">
+                        <th className="px-8 py-5">Asset Reference</th>
+                        <th className="px-8 py-5">File Size</th>
+                        <th className="px-8 py-5">Uploaded</th>
+                        <th className="px-8 py-5">Usage Status</th>
+                        <th className="px-8 py-5 text-right">Actions</th>
+                    </tr>
+                </thead>
+                <tbody className="divide-y divide-dashboard-border/30">
+                    {images.map((image) => {
+                        const usage = getImageUsage(image.filename);
+                        const inUse = isImageInUse(image.filename);
+                        
+                        return (
+                            <tr key={image.id} className="group hover:bg-primary/[0.03] transition-colors">
+                                <td className="px-8 py-4">
+                                    <div className="flex items-center gap-4">
+                                        <div className={`size-12 relative bg-dashboard-bg/50 rounded-xl overflow-hidden border transition-all ${
+                                            inUse ? 'border-primary/30' : 'border-dashboard-border/60'
+                                        }`}>
+                                            <Image
+                                                src={image.url}
+                                                alt={image.filename}
+                                                fill
+                                                className="object-cover"
+                                                unoptimized
+                                            />
+                                        </div>
+                                        <div className="min-w-0">
+                                            <p className="font-bold text-dashboard-text text-sm tracking-tight group-hover:text-primary transition-colors truncate max-w-[250px]" title={image.filename}>
+                                                {image.filename}
+                                            </p>
+                                            <p className="text-[9px] font-medium text-dashboard-text-secondary opacity-60 uppercase tracking-widest">Media Asset</p>
+                                        </div>
+                                    </div>
+                                </td>
+                                <td className="px-8 py-4">
+                                    <span className="text-xs font-semibold text-dashboard-text/70">
+                                        {formatFileSize(image.size)}
+                                    </span>
+                                </td>
+                                <td className="px-8 py-4">
+                                    <span className="text-xs font-semibold text-dashboard-text/70">
+                                        {formatDate(image.uploadedAt)}
+                                    </span>
+                                </td>
+                                <td className="px-8 py-4">
+                                    {inUse ? (
+                                        <span className="inline-flex items-center gap-2 px-3 py-1 bg-emerald-500/10 text-emerald-600 border border-emerald-500/20 rounded-full text-[9px] font-bold uppercase tracking-wider">
+                                            <CheckCircle2 size={10} />
+                                            Active{usage.length > 0 ? ` (${usage.length})` : ''}
+                                        </span>
+                                    ) : (
+                                        <span className="inline-flex items-center gap-2 px-3 py-1 bg-dashboard-bg/50 border border-dashboard-border/60 text-dashboard-text-secondary/60 rounded-full text-[9px] font-bold uppercase tracking-wider">
+                                            <Circle size={10} />
+                                            Unlinked
+                                        </span>
+                                    )}
+                                </td>
+                                <td className="px-8 py-4 text-right">
+                                    <div className="flex items-center justify-end gap-1.5">
+                                        <button
+                                            onClick={() => onViewFull(image.url)}
+                                            className="p-2.5 text-dashboard-text-secondary hover:text-primary hover:bg-primary/10 rounded-lg transition-all active:scale-90"
+                                            title="View Image"
+                                        >
+                                            <Eye size={18} />
+                                        </button>
+                                        <button
+                                            onClick={() => onDelete(image)}
+                                            className={`p-2.5 rounded-lg transition-all active:scale-90 ${
+                                                inUse 
+                                                    ? 'text-neutral-300 cursor-not-allowed opacity-20' 
+                                                    : 'text-dashboard-text-secondary hover:text-red-500 hover:bg-red-500/10'
+                                            }`}
+                                            disabled={inUse}
+                                            title="Delete Image"
+                                        >
+                                            <Trash2 size={18} />
+                                        </button>
+                                    </div>
+                                </td>
+                            </tr>
+                        );
+                    })}
+                </tbody>
+            </table>
+        </div>
+    );
+}

package/src/views/ImageManager/types.ts

@@ -0,0 +1,27 @@
+export interface ImageMetadata {
+    id: string;
+    filename: string;
+    url: string;
+    size: number;
+    mimeType: string;
+    uploadedAt: string;
+}
+
+export interface ImageUsage {
+    imageId: string;
+    filename: string;
+    usage: Array<{
+        plugin: string;
+        type: string;
+        title: string;
+        id: string;
+        url?: string;
+    }>;
+}
+
+export interface StorageStats {
+    totalImages: number;
+    totalSize: number;
+    usedImages: number;
+    availableImages: number;
+}

package/src/views/ImageManager.tsx

@@ -1,30 +1,325 @@
 /**
  * Image Manager View
- * Main view for managing uploaded images
+ * Refactored modular interface for media management
  */
 
 'use client';
 
-import React from 'react';
+import React, { useState, useEffect, useMemo, useCallback } from 'react';
+import { 
+    ImageIcon, 
+    Loader2
+} from 'lucide-react';
+
+// Components
+import { ImageManagerHeader } from './ImageManager/components/ImageManagerHeader';
+import { ImageManagerStats } from './ImageManager/components/ImageManagerStats';
+import { ImageManagerToolbar } from './ImageManager/components/ImageManagerToolbar';
+import { ImageGrid } from './ImageManager/components/ImageGrid';
+import { ImageTable } from './ImageManager/components/ImageTable';
+import { DeleteImageModal } from './ImageManager/components/DeleteImageModal';
+import { CleanupLibraryModal } from './ImageManager/components/CleanupLibraryModal';
+
+// Types
+import { ImageMetadata, ImageUsage, StorageStats } from './ImageManager/types';
 
 export interface ImageManagerViewProps {
     siteId: string;
     locale: string;
 }
 
+function formatFileSize(bytes: number): string {
+    if (bytes === 0) return '0 B';
+    const k = 1024;
+    const sizes = ['B', 'KB', 'MB', 'GB'];
+    const i = Math.floor(Math.log(bytes) / Math.log(k));
+    return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
+}
+
+function formatDate(dateString: string): string {
+    const date = new Date(dateString);
+    return date.toLocaleDateString(undefined, {
+        year: 'numeric',
+        month: 'short',
+        day: 'numeric'
+    });
+}
+
 export function ImageManagerView({ siteId, locale }: ImageManagerViewProps) {
+    const [images, setImages] = useState<ImageMetadata[]>([]);
+    const [usageData, setUsageData] = useState<Record<string, ImageUsage['usage']>>({});
+    const [stats, setStats] = useState<StorageStats | null>(null);
+    const [mappedImages, setMappedImages] = useState<Set<string>>(new Set());
+    const [loading, setLoading] = useState(true);
+    const [search, setSearch] = useState('');
+    const [viewMode, setViewMode] = useState<'grid' | 'list'>('grid');
+    const [uploading, setUploading] = useState(false);
+    const [selectedImage, setSelectedImage] = useState<ImageMetadata | null>(null);
+    const [showDeleteModal, setShowDeleteModal] = useState(false);
+    const [showCleanupModal, setShowCleanupModal] = useState(false);
+    const [deleting, setDeleting] = useState(false);
+    const [cleaning, setCleaning] = useState(false);
+    const [refreshKey, setRefreshKey] = useState(0);
+
+    const fetchImages = useCallback(async () => {
+        try {
+            setLoading(true);
+            const response = await fetch('/api/plugin-images/list');
+            const data = await response.json();
+            
+            if (data.images) {
+                setImages(data.images);
+                setStats(data.stats || null);
+                setMappedImages(new Set(data.mappedImages || []));
+            }
+        } catch (error) {
+            console.error('Failed to fetch images:', error);
+        } finally {
+            setLoading(false);
+        }
+    }, []);
+
+    const fetchUsageData = useCallback(async () => {
+        try {
+            const response = await fetch('/api/plugin-images/usage');
+            const data = await response.json();
+            
+            if (data.images) {
+                const usageMap: Record<string, ImageUsage['usage']> = {};
+                data.images.forEach((img: ImageUsage) => {
+                    usageMap[img.filename] = img.usage;
+                });
+                setUsageData(usageMap);
+            }
+        } catch (error) {
+            console.error('Failed to fetch usage data:', error);
+        }
+    }, []);
+
+    useEffect(() => {
+        fetchImages();
+        fetchUsageData();
+    }, [fetchImages, fetchUsageData, refreshKey]);
+
+    const handleUpload = async (e: React.ChangeEvent<HTMLInputElement>) => {
+        const files = e.target.files;
+        if (!files || files.length === 0) return;
+
+        setUploading(true);
+        
+        try {
+            for (const file of Array.from(files)) {
+                const formData = new FormData();
+                formData.append('file', file);
+
+                const response = await fetch('/api/plugin-images/upload', {
+                    method: 'POST',
+                    body: formData,
+                });
+
+                const data = await response.json();
+                
+                if (data.success && data.image) {
+                    setImages(prev => [data.image, ...prev]);
+                }
+            }
+            handleRefresh();
+        } catch (error) {
+            console.error('Upload failed:', error);
+        } finally {
+            setUploading(false);
+            if (e.target) e.target.value = '';
+        }
+    };
+
+    const handleDelete = async () => {
+        if (!selectedImage) return;
+
+        setDeleting(true);
+        
+        try {
+            const response = await fetch(`/api/plugin-images/uploads/${selectedImage.filename}`, {
+                method: 'DELETE',
+            });
+
+            if (response.ok) {
+                setImages(prev => prev.filter(img => img.id !== selectedImage.id));
+                setShowDeleteModal(false);
+                setSelectedImage(null);
+                handleRefresh();
+            } else {
+                const error = await response.json();
+                alert(error.error || 'Failed to delete image');
+            }
+        } catch (error) {
+            console.error('Delete failed:', error);
+            alert('Failed to delete image');
+        } finally {
+            setDeleting(false);
+        }
+    };
+
+    const handleCleanup = async () => {
+        setCleaning(true);
+        
+        try {
+            const unusedImages = images.filter(img => !isImageInUse(img.filename));
+            let deletedCount = 0;
+            let failedCount = 0;
+
+            for (const image of unusedImages) {
+                try {
+                    const response = await fetch(`/api/plugin-images/uploads/${image.filename}`, {
+                        method: 'DELETE',
+                    });
+                    if (response.ok) {
+                        deletedCount++;
+                    } else {
+                        failedCount++;
+                    }
+                } catch {
+                    failedCount++;
+                }
+            }
+
+            if (deletedCount > 0) {
+                setImages(prev => prev.filter(img => isImageInUse(img.filename)));
+                handleRefresh();
+            }
+
+            setShowCleanupModal(false);
+            
+            if (failedCount > 0) {
+                alert(`Deleted ${deletedCount} images. ${failedCount} failed.`);
+            } else {
+                alert(`Successfully deleted ${deletedCount} unused assets.`);
+            }
+        } catch (error) {
+            console.error('Cleanup failed:', error);
+            alert('Failed to cleanup assets');
+        } finally {
+            setCleaning(false);
+        }
+    };
+
+    const getUnusedImagesCount = (): number => {
+        return images.filter(img => !isImageInUse(img.filename)).length;
+    };
+
+    const handleRefresh = () => {
+        setRefreshKey(prev => prev + 1);
+    };
+
+    const filteredImages = useMemo(() => {
+        return images.filter(img => 
+            search === '' || 
+            img.filename.toLowerCase().includes(search.toLowerCase())
+        );
+    }, [images, search]);
+
+    const getImageUsage = (filename: string): ImageUsage['usage'] => {
+        return usageData[filename] || [];
+    };
+
+    const isImageMapped = (filename: string): boolean => {
+        return mappedImages.has(filename);
+    };
+
+    const isImageInUse = (filename: string): boolean => {
+        return isImageMapped(filename) || getImageUsage(filename).length > 0;
+    };
+
     return (
-        <div className="min-h-screen bg-dashboard-bg p-8">
-            <div className="max-w-7xl mx-auto">
-                <h1 className="text-4xl font-black uppercase tracking-tighter text-dashboard-text mb-8">
-                    Image Manager
-                </h1>
-                <p className="text-sm text-neutral-600 dark:text-neutral-400 mb-8">
-                    This plugin provides image upload and management functionality. 
-                    Use the ImagePicker component in other plugins to select images.
-                </p>
+        <div className="w-full flex flex-col space-y-8 px-6 lg:px-10 py-6 lg:py-10 pb-10 bg-transparent">
+            <ImageManagerHeader 
+                uploading={uploading}
+                unusedCount={getUnusedImagesCount()}
+                onUpload={handleUpload}
+                onRefresh={handleRefresh}
+                onShowCleanup={() => setShowCleanupModal(true)}
+            />
+
+            {stats && <ImageManagerStats stats={stats} formatFileSize={formatFileSize} />}
+
+            <ImageManagerToolbar 
+                search={search}
+                setSearch={setSearch}
+                viewMode={viewMode}
+                setViewMode={setViewMode}
+            />
+
+            <div className="flex-1 px-4 min-h-[400px]">
+                {loading ? (
+                    <div className="h-full flex items-center justify-center py-20">
+                        <div className="flex flex-col items-center gap-4">
+                            <Loader2 size={40} className="animate-spin text-primary opacity-40" />
+                            <p className="text-[10px] font-bold text-primary uppercase tracking-widest animate-pulse">Syncing Library</p>
+                        </div>
+                    </div>
+                ) : filteredImages.length === 0 ? (
+                    <div className="h-full flex flex-col items-center justify-center py-32 text-center">
+                        <div className="size-24 bg-dashboard-card/40 rounded-3xl border border-dashed border-dashboard-border/50 flex items-center justify-center mb-6 relative">
+                            <ImageIcon size={40} className="text-dashboard-text-secondary opacity-20" />
+                            <div className="absolute inset-0 bg-primary/5 rounded-3xl animate-pulse" />
+                        </div>
+                        <h3 className="text-xl font-bold text-dashboard-text tracking-tight opacity-40 mb-1.5">
+                            {search ? 'Reference Not Found' : 'Repository Empty'}
+                        </h3>
+                        <p className="text-xs text-dashboard-text-secondary font-medium opacity-60">
+                            {search ? 'Try refining your search parameters' : 'Upload your first image to begin building your library'}
+                        </p>
+                    </div>
+                ) : viewMode === 'grid' ? (
+                    <ImageGrid 
+                        images={filteredImages}
+                        isImageInUse={isImageInUse}
+                        getImageUsage={getImageUsage}
+                        formatFileSize={formatFileSize}
+                        onViewFull={(url) => window.open(url, '_blank')}
+                        onDelete={(img) => {
+                            setSelectedImage(img);
+                            setShowDeleteModal(true);
+                        }}
+                    />
+                ) : (
+                    <ImageTable 
+                        images={filteredImages}
+                        isImageInUse={isImageInUse}
+                        getImageUsage={getImageUsage}
+                        formatFileSize={formatFileSize}
+                        formatDate={formatDate}
+                        onViewFull={(url) => window.open(url, '_blank')}
+                        onDelete={(img) => {
+                            setSelectedImage(img);
+                            setShowDeleteModal(true);
+                        }}
+                    />
+                )}
             </div>
+
+            <DeleteImageModal 
+                isOpen={showDeleteModal}
+                image={selectedImage}
+                inUse={selectedImage ? isImageInUse(selectedImage.filename) : false}
+                usage={selectedImage ? getImageUsage(selectedImage.filename) : []}
+                isDeleting={deleting}
+                formatFileSize={formatFileSize}
+                formatDate={formatDate}
+                onClose={() => {
+                    setShowDeleteModal(false);
+                    setSelectedImage(null);
+                }}
+                onConfirm={handleDelete}
+            />
+
+            <CleanupLibraryModal 
+                isOpen={showCleanupModal}
+                stats={stats}
+                unusedCount={getUnusedImagesCount()}
+                isCleaning={cleaning}
+                onClose={() => setShowCleanupModal(false)}
+                onConfirm={handleCleanup}
+            />
         </div>
     );
 }
-

package/src/components/BackgroundImage.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-export interface BackgroundImageProps {
-    id: string;
-    className?: string;
-    style?: React.CSSProperties;
-    children?: React.ReactNode;
-    backgroundSize?: 'cover' | 'contain' | 'auto' | string;
-    backgroundPosition?: string;
-}
-export declare function BackgroundImage({ id, className, style, children, backgroundSize, backgroundPosition, }: BackgroundImageProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=BackgroundImage.d.ts.map

package/src/components/BackgroundImage.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"BackgroundImage.d.ts","sourceRoot":"","sources":["BackgroundImage.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAInD,MAAM,WAAW,oBAAoB;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,cAAc,CAAC,EAAE,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;IACvD,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,wBAAgB,eAAe,CAAC,EAC5B,EAAE,EACF,SAAc,EACd,KAAU,EACV,QAAQ,EACR,cAAwB,EACxB,kBAA6B,GAChC,EAAE,oBAAoB,2CAqEtB"}

package/src/components/GlobalImageEditor/config.d.ts

@@ -1,9 +0,0 @@
-/**
- * Configuration utilities for GlobalImageEditor
- */
-import type { PluginConfig } from './types';
-/**
- * Read plugin configuration from window global
- */
-export declare function getPluginConfig(): PluginConfig;
-//# sourceMappingURL=config.d.ts.map

package/src/components/GlobalImageEditor/config.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["config.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C;;GAEG;AACH,wBAAgB,eAAe,IAAI,YAAY,CAW9C"}

package/src/components/GlobalImageEditor/eventHandlers.d.ts

@@ -1,20 +0,0 @@
-/**
- * Event handlers for image changes and effects
- */
-import type { SelectedImage } from './types';
-import type { ImageMetadata } from '../../types';
-/**
- * Apply image changes to DOM and save to API
- */
-export declare function handleImageChange(image: ImageMetadata | null, selectedImage: SelectedImage, onClose: () => void): Promise<void>;
-/**
- * Handle brightness change
- * @param saveImmediately - If true, save to API immediately. If false, only update state/DOM (for editor preview)
- */
-export declare function handleBrightnessChange(brightness: number, selectedImage: SelectedImage, setSelectedImage: (image: SelectedImage) => void, saveImmediately?: boolean): Promise<void>;
-/**
- * Handle blur change
- * @param saveImmediately - If true, save to API immediately. If false, only update state/DOM (for editor preview)
- */
-export declare function handleBlurChange(blur: number, selectedImage: SelectedImage, setSelectedImage: (image: SelectedImage) => void, saveImmediately?: boolean): Promise<void>;
-//# sourceMappingURL=eventHandlers.d.ts.map

package/src/components/GlobalImageEditor/eventHandlers.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"eventHandlers.d.ts","sourceRoot":"","sources":["eventHandlers.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAGjD;;GAEG;AACH,wBAAsB,iBAAiB,CACnC,KAAK,EAAE,aAAa,GAAG,IAAI,EAC3B,aAAa,EAAE,aAAa,EAC5B,OAAO,EAAE,MAAM,IAAI,GACpB,OAAO,CAAC,IAAI,CAAC,CAiDf;AAoID;;;GAGG;AACH,wBAAsB,sBAAsB,CACxC,UAAU,EAAE,MAAM,EAClB,aAAa,EAAE,aAAa,EAC5B,gBAAgB,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,EAChD,eAAe,GAAE,OAAc,GAChC,OAAO,CAAC,IAAI,CAAC,CAyBf;AAED;;;GAGG;AACH,wBAAsB,gBAAgB,CAClC,IAAI,EAAE,MAAM,EACZ,aAAa,EAAE,aAAa,EAC5B,gBAAgB,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,EAChD,eAAe,GAAE,OAAc,GAChC,OAAO,CAAC,IAAI,CAAC,CAyBf"}

package/src/components/GlobalImageEditor/imageDetection.d.ts

@@ -1,16 +0,0 @@
-/**
- * Image detection and parsing utilities
- */
-import type { SelectedImage } from './types';
-/**
- * Extract image source from element (handles Next.js Image wrapper)
- */
-export declare function getImageSource(element: HTMLElement, isBackground: boolean): {
-    currentSrc: string;
-    actualImgElement: HTMLImageElement | null;
-};
-/**
- * Parse image data from element to create SelectedImage
- */
-export declare function parseImageData(element: HTMLElement, id: string, currentBrightness?: number, currentBlur?: number): SelectedImage | null;
-//# sourceMappingURL=imageDetection.d.ts.map

package/src/components/GlobalImageEditor/imageDetection.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"imageDetection.d.ts","sourceRoot":"","sources":["imageDetection.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAI7C;;GAEG;AACH,wBAAgB,cAAc,CAAC,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,OAAO,GAAG;IACzE,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,gBAAgB,GAAG,IAAI,CAAC;CAC7C,CAmCA;AAED;;GAEG;AACH,wBAAgB,cAAc,CAC1B,OAAO,EAAE,WAAW,EACpB,EAAE,EAAE,MAAM,EACV,iBAAiB,CAAC,EAAE,MAAM,EAC1B,WAAW,CAAC,EAAE,MAAM,GACrB,aAAa,GAAG,IAAI,CAoGtB"}

package/src/components/GlobalImageEditor/imageSetup.d.ts

@@ -1,9 +0,0 @@
-/**
- * Image setup and click handlers
- */
-import type { SelectedImage } from './types';
-/**
- * Setup click handlers and hover effects for all images
- */
-export declare function setupImageHandlers(onImageClick: (image: SelectedImage) => void): () => void;
-//# sourceMappingURL=imageSetup.d.ts.map

package/src/components/GlobalImageEditor/imageSetup.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"imageSetup.d.ts","sourceRoot":"","sources":["imageSetup.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAK7C;;GAEG;AACH,wBAAgB,kBAAkB,CAC9B,YAAY,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,GAC7C,MAAM,IAAI,CAmSZ"}

package/src/components/GlobalImageEditor/saveLogic.d.ts

@@ -1,26 +0,0 @@
-/**
- * Save logic for image transforms and effects
- */
-import type { SelectedImage, PendingTransform } from './types';
-/**
- * Normalize position values - convert -50% (centering value) to 0
- */
-export declare function normalizePosition(position: number): number;
-/**
- * Get filename from element or API
- */
-export declare function getFilename(semanticId: string, selectedImage: SelectedImage): Promise<string | null>;
-/**
- * Save image transform to API
- */
-export declare function saveTransformToAPI(semanticId: string, filename: string, scale: number, positionX: number, positionY: number, brightness: number, blur: number): Promise<boolean>;
-/**
- * Flush pending save immediately
- */
-export declare function flushPendingSave(pending: PendingTransform, selectedImage: SelectedImage): Promise<void>;
-/**
- * Save image transform with debouncing support
- * This is a wrapper that handles the debouncing logic
- */
-export declare function saveImageTransform(semanticId: string, filename: string, scale: number, positionX: number, positionY: number, brightness: number, blur: number): Promise<void>;
-//# sourceMappingURL=saveLogic.d.ts.map