img-upload-kit 1.1.1 → 2.0.0

package/dist/{index-FVXXKf2v.d.cts → index-DHINe-rA.d.cts}

@@ -1,80 +1,7 @@
 import * as react from 'react';
 import { ReactNode, HTMLAttributes, CSSProperties, DragEvent, InputHTMLAttributes, Ref, ReactElement } from 'react';
-
-type UploadLocale = 'en' | 'ar';
-type ImageOutputFormat = 'avif' | 'webp' | 'jpeg' | 'png' | 'svg';
-type ExplicitOutputFormat = 'avif' | 'webp' | 'jpeg' | 'png';
-type QualityLevel = 'low' | 'medium' | 'high' | 'maximum';
-interface ImageDimensions {
-    width: number;
-    height: number;
-}
-
-/**
- * Universal visual role presets (project-agnostic).
- * Consumers can define their own presets via `defineUploadPresets` / `createImageUploader({ presets })`
- * or augment `UploadKitRegister` for global type-safety.
- */
-type StandardPresetName = 'thumbnail' | 'avatar' | 'card' | 'cover' | 'hero' | 'logo' | 'original';
-/**
- * Module augmentation hook for global preset autocomplete across a project:
- * ```ts
- * declare module 'img-upload-kit' {
- *   interface UploadKitRegister {
- *     presets: 'product-main' | 'product-thumb' | 'user-avatar';
- *   }
- * }
- * ```
- */
-interface UploadKitRegister {
-}
-type UploadPresetName = UploadKitRegister extends {
-    presets: infer TCustom extends string;
-} ? TCustom : StandardPresetName | (string & {});
-
-interface UploadedImageData {
-    url: string;
-    blurDataUrl: string;
-    blurColor: string;
-    blurHash?: string;
-    altText?: string;
-    width: number;
-    height: number;
-    format: ImageOutputFormat;
-    size: number;
-    originalSize?: number;
-    contentHash: string;
-    storagePath?: string;
-    bucket?: string;
-    preset?: string;
-    folder?: string;
-    metadata?: Record<string, string>;
-    uploadedAt: string;
-}
-
-type BlurPlaceholderType = 'default' | 'hero' | 'card' | 'thumbnail';
-type BlurSize = 'small' | 'medium';
-interface BlurManifestEntry {
-    hash: string;
-    variants: {
-        small: string;
-        medium?: string;
-        [key: string]: string | undefined;
-    };
-    color: string;
-    width?: number;
-    height?: number;
-    metadata?: Record<string, string>;
-}
-interface BlurManifestData {
-    version: string;
-    generatedAt: string;
-    totalImages: number;
-    processedImages?: number;
-    cachedImages?: number;
-    failedImages?: number;
-    hashes: Record<string, BlurManifestEntry>;
-}
+import { U as UploadLocale, Q as QualityLevel, m as UploadedImageData, l as UploadPresetName, E as ExplicitOutputFormat, b as ImageDimensions } from './upload-C5Trd6Dh.cjs';
+import { f as BlurPlaceholderType } from './types-yShGNQnW.cjs';
 
 interface BlurModalTranslations {
     title: string;
@@ -119,9 +46,20 @@ interface UploadTranslations {
     deselectAll: string;
     removeSelected: string;
     uploading: string;
+    uploadingCount: string;
     someUploadsFailed: string;
     retryFailedUploads: string;
     needsAltBeforeSave: string;
+    networkError: string;
+    invalidUploadResponse: string;
+    uploadAborted: string;
+    uploadStartedLive: string;
+    uploadProgressLive: string;
+    uploadCompleteLive: string;
+    qualityTitle: string;
+    qualityLevelAria: string;
+    qualitySaved: string;
+    qualityRecommended: string;
     selectFilesAria: string;
     selectMoreFilesAria: string;
     selectFolderAria: string;
@@ -164,6 +102,11 @@ interface UploadTranslations {
     adjustBlurColorAria: string;
     adjustBlurColorTitle: string;
     removeImageAria: string;
+    pasteHint: string;
+    cancelUpload: string;
+    retryUpload: string;
+    minImagesError: string;
+    requiredFieldError: string;
     blurModal: BlurModalTranslations;
 }
 
@@ -206,6 +149,7 @@ interface SinglePreviewRenderContext {
     disabled: boolean;
     openFileDialog: () => void;
     remove: () => void;
+    cancel: () => void;
     openAltTextModal: () => void;
     openBlurInspector: () => void;
     download: () => Promise<void>;
@@ -249,6 +193,8 @@ interface MultiTileRenderContext {
     disabled: boolean;
     toggleSelect: () => void;
     remove: () => void;
+    cancel: () => void;
+    retry: () => void;
     openAltTextModal: () => void;
     setAltText: (altText: string) => void;
     setBlurColor: (hex: string) => void;
@@ -301,9 +247,18 @@ interface ClientUploadRequestParams {
     quality?: number;
     maxDimensions?: ImageDimensions;
     metadata?: Record<string, string>;
+    signal?: AbortSignal;
     onUploadProgress?: (percent: number) => void;
 }
 type CustomUploaderFn = (file: File, params: ClientUploadRequestParams) => Promise<UploadedImageData>;
+interface ImageUploadHandle {
+    /** Move keyboard focus to the upload dropzone or primary trigger */
+    focus: () => void;
+    /** Programmatically open the native file picker dialog */
+    open: () => void;
+    /** Clear the currently selected / uploaded image(s) */
+    clear: () => void;
+}
 interface BaseImageUploadProps<TPreset extends string = UploadPresetName> {
     /** Optional named preset (e.g. 'avatar', 'hero', or a custom project preset) */
     preset?: TPreset;
@@ -381,6 +336,18 @@ interface BaseImageUploadProps<TPreset extends string = UploadPresetName> {
     quality?: number;
     /** Custom filename target in storage */
     customFilename?: string;
+    /** Camera capture attribute forwarded to `<input type="file" capture={...} />` on mobile devices */
+    capture?: 'user' | 'environment';
+    /** Enable pasting images from the clipboard (defaults to `true`) */
+    enablePaste?: boolean;
+    /** Scope for clipboard paste events: focused `'dropzone'` (default) or global `'document'` */
+    pasteTarget?: 'dropzone' | 'document';
+    /** Form field name; when set, renders a synchronized `<input type="hidden" name={name} />` */
+    name?: string;
+    /** Serialization format for the hidden form input (`'url'` default for single, `'json'` default for multi) */
+    formValue?: 'url' | 'json';
+    /** Blur callback invoked when focus leaves the uploader (e.g. for react-hook-form `field.onBlur`) */
+    onBlur?: () => void;
 }
 interface SingleImageUploadProps<TPreset extends string = UploadPresetName> extends BaseImageUploadProps<TPreset>, SingleCustomRenderers {
     mode?: 'single';
@@ -397,8 +364,16 @@ interface MultiImageUploadProps<TPreset extends string = UploadPresetName> exten
     value?: UploadedImageData[];
     onChange: (images: UploadedImageData[]) => void;
     maxImages?: number;
+    /** Minimum required uploaded images before form submission / modal save */
+    minImages?: number;
     allowFolder?: boolean;
     maxParallelUploads?: number;
+    /** Invoked when a batch or retry upload begins */
+    onUploadStart?: (files: File[]) => void;
+    /** Invoked when a batch or retry upload finishes with the newly uploaded items */
+    onUploadComplete?: (results: UploadedImageData[]) => void;
+    /** Invoked when an in-flight tile upload is cancelled */
+    onUploadCancel?: (id: string) => void;
     /** Per-slot custom CSS classes (Tailwind, CSS Modules, BEM) for MultiImageUpload */
     classNames?: MultiUploadClassNames;
     /** Per-slot inline CSS styles for MultiImageUpload */
@@ -435,7 +410,7 @@ interface ImageUploadContextValue {
     uploader?: CustomUploaderFn;
     headers?: Record<string, string>;
     withCredentials?: boolean;
-    locale: UploadLocale;
+    locale?: UploadLocale;
     translations?: Partial<UploadTranslations>;
     renderImage?: CustomImageRenderer;
     storageKeyPrefix: string;
@@ -480,70 +455,6 @@ interface ImageUploadProviderProps {
 declare function ImageUploadProvider({ children, endpoint, uploader, headers, withCredentials, locale, translations, renderImage, storageKeyPrefix, requireAltText, unstyled, singleClassNames, singleStyles, multiClassNames, multiStyles, }: ImageUploadProviderProps): react.JSX.Element;
 declare function useImageUploadContext(): ImageUploadContextValue;
 
-interface NormalizePathOptions {
-    cdnPatterns?: RegExp[];
-    stripPrefixes?: string[];
-}
-
-interface BlurServiceOptions {
-    cacheSize?: number;
-    manifest?: BlurManifestData | Record<string, BlurManifestEntry>;
-    pathOptions?: NormalizePathOptions;
-}
-declare class BlurService {
-    private blurData;
-    private readonly cache;
-    private readonly pathOptions?;
-    private metadata;
-    private metrics;
-    constructor(options?: BlurServiceOptions);
-    /**
-     * Hydrate the service with a generated `blur-hashes.json` manifest or hash map.
-     */
-    loadManifest(manifest: BlurManifestData | Record<string, BlurManifestEntry>): void;
-    /**
-     * Register or update a single image's blur data at runtime.
-     */
-    registerEntry(imagePath: string, entry: BlurManifestEntry): void;
-    getDefaultPlaceholder(type?: BlurPlaceholderType): string;
-    private findBlurDataByPath;
-    getDominantColor(imageSrc: string): string;
-    getBlurDataURL(imageSrc: string, options?: {
-        type?: BlurPlaceholderType;
-        size?: BlurSize;
-    }): string;
-    getBulkBlurData(imageSrcs: string[], options?: {
-        type?: BlurPlaceholderType;
-        size?: BlurSize;
-    }): Record<string, string>;
-    getProgressiveData(imageSrc: string, size?: BlurSize): {
-        color: string;
-        blur: string;
-        hasBlur: boolean;
-    };
-    hasBlurHash(imageSrc: string): boolean;
-    getMetadata(): {
-        cacheSize: number;
-        metrics: {
-            cacheHitRate: string;
-            totalRequests: number;
-            cacheHits: number;
-            cacheMisses: number;
-            errors: number;
-        };
-        version: string;
-        generatedAt: string;
-        totalImages: number;
-    };
-    clearCache(): void;
-    getBlurHash(imageSrc: string): string | null;
-    preloadBlurData(imageSrcs: string[], size?: BlurSize): void;
-    fetchBlurDataForImage(imageSrc: string, type?: BlurPlaceholderType): Promise<string>;
-    getAvailableKeys(): string[];
-    findMatchingKeys(searchTerm: string): string[];
-}
-declare const blurService: BlurService;
-
 interface UseDragAndDropOptions {
     disabled?: boolean;
     onDrop: (files: FileList) => void;
@@ -558,10 +469,19 @@ declare function useDragAndDrop({ disabled, onDrop }: UseDragAndDropOptions): {
     };
 };
 
-declare function useFilePreview(): {
+interface UseFilePreviewOptions {
+    errorLabel?: string;
+}
+declare function useFilePreview(options?: UseFilePreviewOptions): {
     createPreview: (file: File) => Promise<string>;
+    revokePreview: (url?: string | null) => void;
+    revokeAllPreviews: () => void;
 };
 
+interface UploadCallOptions {
+    uploadId?: string;
+    signal?: AbortSignal;
+}
 interface UseImageUploadOptions {
     preset?: string;
     folder?: string;
@@ -578,25 +498,20 @@ interface UseImageUploadOptions {
     headers?: Record<string, string>;
     withCredentials?: boolean;
     locale?: UploadLocale;
-    onSuccess?: (data: UploadedImageData, file?: File) => void;
-    onError?: (error: string, file?: File) => void;
-    onProgress?: (progress: number, message: string, file?: File) => void;
+    onSuccess?: (data: UploadedImageData, file?: File, uploadId?: string) => void;
+    onError?: (error: string, file?: File, uploadId?: string) => void;
+    onProgress?: (progress: number, message: string, file?: File, uploadId?: string) => void;
 }
 declare function useImageUpload({ preset, folder, bucket, metadata, altText, outputFormat, quality, maxDimensions, customFilename: defaultCustomFilename, endpoint: propEndpoint, uploader: propUploader, headers: propHeaders, withCredentials: propWithCredentials, locale: propLocale, onSuccess, onError, onProgress, }?: UseImageUploadOptions): {
-    uploadImage: (file: File, customAltText?: string, overrideCustomFilename?: string) => Promise<UploadedImageData | null>;
+    uploadImage: (file: File, customAltText?: string, overrideCustomFilename?: string, callOptions?: UploadCallOptions) => Promise<UploadedImageData | null>;
+    abortUpload: (idOrFile: string | File) => boolean;
+    abortAll: () => void;
     isUploading: boolean;
     progress: number;
     uploadMessage: string;
     reset: () => void;
 };
 
-declare global {
-    interface Window {
-        blurService?: typeof blurService;
-    }
-}
-declare function BlurServiceDebugger(): null;
-
 interface MultiUploadStats {
     total: number;
     completed: number;
@@ -638,6 +553,8 @@ interface SingleUploadController {
     openFileDialog: () => void;
     selectFiles: (files: FileList) => Promise<void>;
     remove: () => void;
+    cancel: () => void;
+    cancelUpload: () => void;
     save: () => void;
     download: () => Promise<void>;
     setQualityLevel: (level: QualityLevel) => void;
@@ -674,6 +591,12 @@ interface MultiUploadController {
     selectFiles: (files: FileList) => Promise<void>;
     remove: (id: string) => void;
     removeSelected: () => void;
+    clear: () => void;
+    cancel: (id: string) => void;
+    cancelUpload: (id: string) => void;
+    retry: (id: string) => Promise<void>;
+    retryUpload: (id: string) => Promise<void>;
+    retryAll: () => Promise<void>;
     toggleSelect: (id: string) => void;
     selectAll: () => void;
     clearSelection: () => void;
@@ -709,4 +632,4 @@ declare function HeadlessSingleUpload<TPreset extends string = UploadPresetName>
  */
 declare function HeadlessMultiUpload<TPreset extends string = UploadPresetName>(props: HeadlessMultiUploadProps<TPreset>): ReactElement;
 
-export { blurService as $, type MultiUploadController as A, type BlurPlaceholderType as B, type CustomImageRenderer as C, type MultiUploadSlot as D, type ExplicitOutputFormat as E, type MultiUploadStats as F, type MultiUploadStyles as G, type HeadlessDropzoneProps as H, type ImageDimensions as I, type SingleCustomRenderers as J, type SingleDropzoneRenderContext as K, type SinglePreviewRenderContext as L, type MultiImageUploadProps as M, type SingleUploadClassNames as N, type SingleUploadController as O, type SingleUploadSlot as P, type QualityLevel as Q, type RenderImageProps as R, type SingleImageUploadProps as S, type SingleUploadStyles as T, type UploadTranslations as U, type SizeInfo as V, type UploadStatus as W, type UseDragAndDropOptions as X, type UseImageUploadOptions as Y, type UseMultiUploadOptions as Z, type UseSingleUploadOptions as _, type UploadLocale as a, useDragAndDrop as a0, useFilePreview as a1, useImageUpload as a2, useImageUploadContext as a3, useMultiUpload as a4, useSingleUpload as a5, type UploadVisualState as b, type BlurSize as c, type UploadedImageData as d, type UploadPresetName as e, type ImageUploadProps as f, type ImagePreview as g, type BaseImageUploadProps as h, type BlurModalTranslations as i, BlurServiceDebugger as j, type ClientUploadRequestParams as k, type CustomUploaderFn as l, type HeadlessFileInputProps as m, HeadlessMultiUpload as n, type HeadlessMultiUploadProps as o, HeadlessSingleUpload as p, type HeadlessSingleUploadProps as q, type ImageUploadContextValue as r, ImageUploadProvider as s, type ImageUploadProviderProps as t, type MultiAddMoreRenderContext as u, type MultiCustomRenderers as v, type MultiEmptyRenderContext as w, type MultiHeaderRenderContext as x, type MultiTileRenderContext as y, type MultiUploadClassNames as z };
+export { type SinglePreviewRenderContext as A, type BaseImageUploadProps as B, type CustomImageRenderer as C, type SingleUploadClassNames as D, type SingleUploadController as E, type SingleUploadSlot as F, type SingleUploadStyles as G, type HeadlessDropzoneProps as H, type ImageUploadProps as I, type SizeInfo as J, type UploadCallOptions as K, type UploadStatus as L, type MultiImageUploadProps as M, type UseDragAndDropOptions as N, type UseFilePreviewOptions as O, type UseImageUploadOptions as P, type UseMultiUploadOptions as Q, type RenderImageProps as R, type SingleImageUploadProps as S, type UseSingleUploadOptions as T, type UploadTranslations as U, useDragAndDrop as V, useFilePreview as W, useImageUpload as X, useImageUploadContext as Y, useMultiUpload as Z, useSingleUpload as _, type UploadVisualState as a, type ImageUploadHandle as b, type ImagePreview as c, type BlurModalTranslations as d, type ClientUploadRequestParams as e, type CustomUploaderFn as f, type HeadlessFileInputProps as g, HeadlessMultiUpload as h, type HeadlessMultiUploadProps as i, HeadlessSingleUpload as j, type HeadlessSingleUploadProps as k, type ImageUploadContextValue as l, ImageUploadProvider as m, type ImageUploadProviderProps as n, type MultiAddMoreRenderContext as o, type MultiCustomRenderers as p, type MultiEmptyRenderContext as q, type MultiHeaderRenderContext as r, type MultiTileRenderContext as s, type MultiUploadClassNames as t, type MultiUploadController as u, type MultiUploadSlot as v, type MultiUploadStats as w, type MultiUploadStyles as x, type SingleCustomRenderers as y, type SingleDropzoneRenderContext as z };