img-upload-kit 0.0.0-stage → 2.0.0

package/dist/react.d.cts

@@ -0,0 +1,476 @@
+import { U as UploadTranslations, a as UploadVisualState, C as CustomImageRenderer, I as ImageUploadProps, b as ImageUploadHandle, M as MultiImageUploadProps, c as ImagePreview, S as SingleImageUploadProps } from './index-DHINe-rA.cjs';
+export { B as BaseImageUploadProps, d as BlurModalTranslations, e as ClientUploadRequestParams, f as CustomUploaderFn, H as HeadlessDropzoneProps, g as HeadlessFileInputProps, h as HeadlessMultiUpload, i as HeadlessMultiUploadProps, j as HeadlessSingleUpload, k as HeadlessSingleUploadProps, l as ImageUploadContextValue, m as ImageUploadProvider, n as ImageUploadProviderProps, o as MultiAddMoreRenderContext, p as MultiCustomRenderers, q as MultiEmptyRenderContext, r as MultiHeaderRenderContext, s as MultiTileRenderContext, t as MultiUploadClassNames, u as MultiUploadController, v as MultiUploadSlot, w as MultiUploadStats, x as MultiUploadStyles, R as RenderImageProps, y as SingleCustomRenderers, z as SingleDropzoneRenderContext, A as SinglePreviewRenderContext, D as SingleUploadClassNames, E as SingleUploadController, F as SingleUploadSlot, G as SingleUploadStyles, J as SizeInfo, K as UploadCallOptions, L as UploadStatus, N as UseDragAndDropOptions, N as UseDropzoneOptions, O as UseFilePreviewOptions, P as UseImageUploadOptions, Q as UseMultiUploadOptions, T as UseSingleUploadOptions, V as useDragAndDrop, V as useDropzone, W as useFilePreview, X as useImageUpload, Y as useImageUploadContext, Z as useMultiUpload, _ as useSingleUpload } from './index-DHINe-rA.cjs';
+import * as react from 'react';
+import { CSSProperties, ClipboardEvent, RefObject, ImgHTMLAttributes, ReactNode, ElementType, HTMLAttributes, SyntheticEvent, Ref, ReactElement, ButtonHTMLAttributes } from 'react';
+import { U as UploadLocale, E as ExplicitOutputFormat, b as ImageDimensions, m as UploadedImageData, e as ImageVariant, l as UploadPresetName, i as StandardPresetName, Q as QualityLevel } from './upload-C5Trd6Dh.cjs';
+import { f as BlurPlaceholderType, i as BlurSize } from './types-yShGNQnW.cjs';
+export { D as DEFAULT_PLACEHOLDERS } from './placeholders-x_3rt65M.cjs';
+export { b as blurService } from './blurService-DacwylJx.cjs';
+
+declare const arTranslations: UploadTranslations;
+
+declare const enTranslations: UploadTranslations;
+
+declare const DEFAULT_UPLOAD_TRANSLATIONS: UploadTranslations;
+declare const ARABIC_UPLOAD_TRANSLATIONS: UploadTranslations;
+
+declare function normalizeUploadLocale(locale?: string): UploadLocale;
+declare function selectPluralCategory(locale: UploadLocale, count: number): Intl.LDMLPluralRule;
+declare function formatUploadingCount(ui: UploadTranslations, count: number, locale: UploadLocale, overrides?: Partial<UploadTranslations>): string;
+declare function formatNeedsAltMessage(ui: UploadTranslations, count: number, locale: UploadLocale): string;
+declare function formatSkippedImagesMessage(ui: UploadTranslations, imageCount: number, skippedCount: number, locale: UploadLocale): string;
+declare const uploadText: Record<UploadLocale, UploadTranslations>;
+declare function resolveTranslations(locale?: UploadLocale, overrides?: Partial<UploadTranslations>): UploadTranslations;
+
+/**
+ * Inline style applied to `<input type="file">` when `unstyled` mode is active
+ * so hidden file inputs remain invisible even when `image-upload-kit/styles.css` is not imported.
+ */
+declare const HIDDEN_INPUT_STYLE: CSSProperties;
+/**
+ * Joins truthy CSS class names cleanly.
+ */
+declare function cx(...classes: Array<string | false | null | undefined>): string;
+/**
+ * Resolves a component slot's final `className`:
+ * - When `unstyled` is `false` (default): includes `defaultClass` followed by provider & prop overrides.
+ * - When `unstyled` is `true`: strips `defaultClass` (`iuk-*`) and applies only user-supplied classes.
+ */
+declare function resolveSlotClass(defaultClass: string | undefined, unstyled: boolean | undefined, ...customClasses: Array<string | false | null | undefined>): string | undefined;
+/**
+ * Merges multiple optional inline `CSSProperties` objects for a slot.
+ */
+declare function resolveSlotStyle(...styles: Array<CSSProperties | undefined>): CSSProperties | undefined;
+/**
+ * Computes a deterministic semantic state string for `data-state="..."` styling
+ * (e.g. Tailwind `data-[state=dragging]:border-indigo-500` or CSS `[data-state="uploading"]`).
+ */
+declare function resolveUploadDataState(flags: {
+    disabled?: boolean;
+    hasError?: boolean;
+    isUploading?: boolean;
+    isDragging?: boolean;
+    hasContent?: boolean;
+}): UploadVisualState;
+
+declare function useBlurDataURL(imageSrc: string | undefined, options?: {
+    type?: BlurPlaceholderType;
+    size?: BlurSize;
+}): string;
+declare function useBulkBlurData(imageSrcs: string[], options?: {
+    type?: BlurPlaceholderType;
+    size?: BlurSize;
+}): Record<string, string>;
+declare function useProgressiveBlur(imageSrc: string | undefined, size?: BlurSize): {
+    color: string;
+    blur: string;
+    hasBlur: boolean;
+};
+declare function useHasBlurHash(imageSrc: string | undefined): boolean;
+declare function useDominantColor(imageSrc: string | undefined): string;
+declare function useBlurMetadata(): {
+    cacheSize: number;
+    metrics: {
+        cacheHitRate: string;
+        totalRequests: number;
+        cacheHits: number;
+        cacheMisses: number;
+        errors: number;
+    };
+    version: string;
+    generatedAt: string;
+    totalImages: number;
+};
+declare function useBlurHash(imageSrc: string | undefined): string | null;
+declare function useBlurDataWithColor(imageSrc: string | undefined, size?: BlurSize): {
+    blurDataUrl: string;
+    blurColor: string;
+    hasBlur: boolean;
+};
+declare function useBlurVariant(imageSrc: string | undefined, size?: BlurSize, type?: BlurPlaceholderType): string;
+
+type PasteTargetMode = 'dropzone' | 'document';
+interface UseClipboardPasteOptions {
+    /** Enable clipboard image paste handling (defaults to `true`) */
+    enabled?: boolean;
+    /** Listen on the focused dropzone (`'dropzone'`) or globally on `document` (`'document'`). Defaults to `'dropzone'`. */
+    pasteTarget?: PasteTargetMode;
+    /** Disable paste handling when the uploader is disabled */
+    disabled?: boolean;
+    /** Allow pasting multiple images at once (defaults to `false` for single upload, `true` for multi upload) */
+    multiple?: boolean;
+    /** Callback invoked when one or more image files are pasted */
+    onPasteFiles: (files: FileList) => void;
+}
+declare function extractClipboardImageFiles(clipboardData: DataTransfer | null | undefined, multiple: boolean): File[];
+declare function toFileListLike(files: File[]): FileList;
+declare function useClipboardPaste({ enabled, pasteTarget, disabled, multiple, onPasteFiles, }: UseClipboardPasteOptions): {
+    onPaste: (event: ClipboardEvent<HTMLElement>) => void;
+};
+
+interface UseDialogOptions {
+    isOpen: boolean;
+    onClose?: () => void;
+    initialFocusRef?: RefObject<HTMLElement | null>;
+    lockScroll?: boolean;
+}
+declare function useDialog({ isOpen, onClose, initialFocusRef, lockScroll, }: UseDialogOptions): {
+    dialogRef: RefObject<HTMLDivElement | null>;
+    titleId: string;
+    descriptionId: string;
+};
+
+interface XhrUploadOptions {
+    headers?: Record<string, string>;
+    withCredentials?: boolean;
+    signal?: AbortSignal;
+    fallbackErrorLabel?: string;
+    networkErrorLabel?: string;
+    invalidResponseLabel?: string;
+    abortedErrorLabel?: string;
+    onUploadProgress?: (percent: number) => void;
+}
+interface UploadFormFields {
+    preset?: string;
+    folder?: string;
+    bucket?: string;
+    altText?: string;
+    customFilename?: string;
+    outputFormat?: ExplicitOutputFormat;
+    quality?: number;
+    maxDimensions?: ImageDimensions;
+    metadata?: Record<string, string>;
+}
+declare function createUploadAbortError(message?: string): Error;
+declare function isUploadAbortError(err: unknown): boolean;
+declare function parseErrorPayload(status: number, rawBody: string, fallbackLabel?: string): string;
+declare function buildUploadFormData(file: File | Blob, fields?: UploadFormFields): FormData;
+declare function uploadViaXhr(endpoint: string, formData: FormData, options?: XhrUploadOptions): Promise<UploadedImageData>;
+
+declare const useProgressiveImage: typeof useProgressiveBlur;
+declare function useBlurPreload(imageSrcs: string[], size?: BlurSize): void;
+
+interface AltTextInputProps {
+    value: string;
+    onChange: (value: string) => void;
+    disabled?: boolean;
+    placeholder?: string;
+    maxLength?: number;
+    label?: string;
+    showHint?: boolean;
+    locale?: UploadLocale;
+    translations?: Partial<UploadTranslations>;
+    unstyled?: boolean;
+}
+declare function AltTextInput({ value, onChange, disabled, placeholder, maxLength, label, showHint, locale: propLocale, translations, unstyled: propUnstyled, }: AltTextInputProps): react.JSX.Element;
+
+interface AltTextModalProps {
+    imageUrl: string;
+    initialAltText?: string;
+    onSave: (altText: string) => void;
+    onClose: () => void;
+    locale?: UploadLocale;
+    translations?: Partial<UploadTranslations>;
+    renderImage?: CustomImageRenderer;
+    unstyled?: boolean;
+}
+declare function AltTextModal({ imageUrl, initialAltText, onSave, onClose, locale: propLocale, translations, renderImage, unstyled: propUnstyled, }: AltTextModalProps): react.JSX.Element;
+
+type AnimatedImageObjectFit = 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
+type AnimatedImageColorPlaceholder = 'flat' | 'gradient';
+interface AnimatedImageSource {
+    url: string;
+    altText?: string | null;
+    blurDataUrl?: string | null;
+    blurHash?: string | null;
+    blurColor?: string | null;
+    width?: number;
+    height?: number;
+    variants?: ImageVariant[];
+    srcSet?: string;
+}
+interface AnimatedImageErrorContext {
+    src: string;
+    retry: () => void;
+}
+interface AnimatedImageBaseProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, 'src' | 'alt' | 'onLoad' | 'onError' | 'placeholder'> {
+    /** LQIP data URL (e.g. `UploadedImageData.blurDataUrl`). Highest priority placeholder. */
+    blurDataUrl?: string | null;
+    /** BlurHash string, decoded client-side when no `blurDataUrl` is given. */
+    blurHash?: string | null;
+    /** Dominant color or CSS variable (e.g. `'#3b82f6'` or `'var(--background-card)'`) used as wrapper background. */
+    blurColor?: string | null;
+    /**
+     * Placeholder behavior when only `blurColor` is available (no `blurDataUrl` or `blurHash`):
+     * - `'flat'` (default): uses flat `blurColor` wrapper background with no extra placeholder `<img>` layer (Imagine-Global parity).
+     * - `'gradient'`: mounts an inline SVG gradient placeholder `<img>`.
+     */
+    colorPlaceholder?: AnimatedImageColorPlaceholder;
+    /**
+     * Neutral colors ignored by `resolveBackgroundColor` / `resolveMeaningfulColor`.
+     * Defaults to `DEFAULT_NEUTRAL_COLORS`. Pass `[]` to allow all colors (including `#000000` / `#ffffff`).
+     */
+    neutralColors?: readonly string[];
+    /** Absolutely fill the nearest positioned parent (like `next/image` `fill`). */
+    fill?: boolean;
+    /**
+     * Mark image as high-priority above-the-fold content:
+     * - Native `<img>`: sets `loading="eager"` and `fetchPriority="high"`.
+     * - Custom `as={Image}`: forwards `priority={true}` and omits default `loading="lazy"`.
+     */
+    priority?: boolean;
+    /**
+     * Image quality hint (1–100) forwarded only when `as` is provided (e.g. `next/image`).
+     * Never rendered as a DOM attribute on a native `<img>`.
+     */
+    quality?: number;
+    objectFit?: AnimatedImageObjectFit;
+    objectPosition?: CSSProperties['objectPosition'];
+    /** Show an animated shimmer while loading. Unmounted once loaded. Default `false`. */
+    showShimmer?: boolean;
+    /** Reveal transition duration in ms. Default `600`. */
+    animationDuration?: number;
+    /** Initial scale of the image before reveal (`scale(revealScale) -> scale(1)`). Default `1.02` (`1` = pure fade). */
+    revealScale?: number;
+    /** Optional fallback image URL tried once if the primary `src` fails to load. */
+    fallbackSrc?: string;
+    /** Optional custom error overlay rendered when image loading fails. */
+    renderError?: (ctx: AnimatedImageErrorContext) => ReactNode;
+    /** Render a custom image component (e.g. `next/image`, Gatsby, Astro). Receives all img props. */
+    as?: ElementType;
+    /** Extra props forwarded only to the `as` component. */
+    imageComponentProps?: Record<string, unknown>;
+    /** Strip all default `iuk-animated-image*` classes (bring your own CSS). */
+    unstyled?: boolean;
+    wrapperClassName?: string;
+    wrapperStyle?: CSSProperties;
+    wrapperProps?: HTMLAttributes<HTMLDivElement>;
+    placeholderClassName?: string;
+    /** Called after the image is decoded and the fade-in starts. */
+    onLoad?: (img: HTMLImageElement | null) => void;
+    onError?: (event: SyntheticEvent<HTMLImageElement, Event>) => void;
+}
+type AnimatedImageProps = AnimatedImageBaseProps & ({
+    /** Direct `UploadedImageData` object returned by `<SingleImageUpload>` or `<MultiImageUpload>`. */
+    image: AnimatedImageSource;
+    src?: string;
+    alt?: string;
+} | {
+    image?: undefined;
+    /** Image URL. */
+    src: string;
+    /** Accessible alt text (use `""` for decorative images). */
+    alt: string;
+});
+
+/**
+ * Blur-up image with a smooth, GPU-friendly crossfade and subtle zoom reveal.
+ * Matches the Imagine-Global reference design while remaining pure React,
+ * SSR-safe, and framework-agnostic — plug in `next/image` via `as`.
+ */
+declare function AnimatedImage({ image, src: srcProp, alt: altProp, blurDataUrl: blurDataUrlProp, blurHash: blurHashProp, blurColor: blurColorProp, colorPlaceholder, neutralColors, width: widthProp, height: heightProp, fill, priority, quality, objectFit, objectPosition, showShimmer, animationDuration, revealScale, fallbackSrc, renderError, as: ImageComponent, imageComponentProps, unstyled, wrapperClassName, wrapperStyle, wrapperProps, placeholderClassName, className, style, loading: loadingProp, decoding, draggable, onLoad, onError, ...imgProps }: AnimatedImageProps): react.JSX.Element;
+
+/**
+ * Default neutral colors that carry no real information about the image (common
+ * DB defaults or "empty" values). Ignored by default so placeholders never
+ * flash pitch-black or stark white unless `neutralColors={[]}` is passed.
+ */
+declare const DEFAULT_NEUTRAL_COLORS: readonly ["#1a1a1a", "#121212", "#000000", "#000", "#e5e7eb", "#ffffff", "#fff"];
+/**
+ * Returns a safe, meaningful literal color (`#hex`, `rgb(...)`, `hsl(...)`, `oklch(...)`)
+ * suitable for inline SVG embedding, or `undefined` when empty/neutral/invalid.
+ * Rejects CSS variables (`var(--*)`) because SVG data URLs cannot resolve host DOM tokens.
+ */
+declare function resolveMeaningfulColor(color?: string | null, neutralColors?: readonly string[]): string | undefined;
+/**
+ * Returns a safe CSS background-color value for the wrapper element.
+ * Accepts literal colors AND safe CSS custom property expressions (`var(--token)`),
+ * while rejecting neutral defaults and CSS injection payloads.
+ */
+declare function resolveBackgroundColor(color?: string | null, neutralColors?: readonly string[]): string | undefined;
+/**
+ * Inline SVG data URL that renders a soft gradient placeholder.
+ * Uses the dominant color when provided, otherwise a neutral slate gradient.
+ */
+declare function createFallbackBlurSvg(color?: string | null, neutralColors?: readonly string[]): string;
+interface PlaceholderSources {
+    blurDataUrl?: string | null;
+    blurHash?: string | null;
+    blurColor?: string | null;
+    neutralColors?: readonly string[];
+}
+/**
+ * Resolves an intrinsic image placeholder (`blurDataUrl` or decoded `blurHash`)
+ * without falling back to an SVG gradient. Returns `undefined` when neither is present.
+ */
+declare function resolveIntrinsicPlaceholderUrl({ blurDataUrl, blurHash, }: Pick<PlaceholderSources, 'blurDataUrl' | 'blurHash'>): string | undefined;
+/**
+ * Resolves the best available placeholder URL in priority order:
+ * 1. `blurDataUrl` (LQIP data URL / remote URL)
+ * 2. `blurHash` (decoded client-side; browser only)
+ * 3. Gradient SVG derived from `blurColor` (or neutral fallback)
+ */
+declare function resolvePlaceholderUrl({ blurDataUrl, blurHash, blurColor, neutralColors, }: PlaceholderSources): string;
+
+interface UseImageRevealOptions {
+    /** Identity of the primary source; a change resets the reveal state. */
+    srcKey: string;
+    /** Optional fallback URL tried once if `srcKey` fails to load. */
+    fallbackSrc?: string;
+    /** Crossfade duration in ms. */
+    animationDuration: number;
+    onLoad?: (img: HTMLImageElement | null) => void;
+}
+interface ImageRevealState {
+    /** Active image URL (`srcKey` initially, or `fallbackSrc` after primary failure). */
+    activeSrc: string;
+    /** Monotonic counter incremented when `retry()` is invoked. */
+    retryKey: number;
+    /** True once the sharp image is decoded and ready to fade in. */
+    isLoaded: boolean;
+    /** Whether the placeholder layer is still mounted (kept until fade completes, or on error). */
+    showPlaceholder: boolean;
+    /** True when the image (and optional `fallbackSrc`) failed to load. */
+    hasError: boolean;
+    /** Callback ref to attach to the underlying `<img>` element. */
+    imgRef: (node: HTMLImageElement | null) => void;
+    handleLoad: (img?: HTMLImageElement | null) => void;
+    /** Returns `true` if the error is terminal, or `false` if switching to `fallbackSrc`. */
+    handleError: () => boolean;
+    /** Resets error state and retries loading from the primary `srcKey`. */
+    retry: () => void;
+}
+/**
+ * Framework-agnostic reveal state machine for blur-up images:
+ * - resets synchronously when `srcKey` changes (no stale 1-frame flash)
+ * - pre-decodes via `HTMLImageElement.decode()` before crossfading
+ * - detects already-cached images after the first paint
+ * - unmounts placeholder after crossfade (`animationDuration + 50ms`)
+ * - on error: tries `fallbackSrc` once if provided; on terminal error keeps placeholder visible
+ */
+declare function useImageReveal({ srcKey, fallbackSrc, animationDuration, onLoad, }: UseImageRevealOptions): ImageRevealState;
+
+interface BlurImageProps {
+    src: string;
+    alt: string;
+    blurDataUrl?: string | null;
+    blurColor?: string | null;
+    blurHash?: string | null;
+    objectFit?: CSSProperties['objectFit'];
+    className?: string;
+    imageClassName?: string;
+    style?: CSSProperties;
+    renderImage?: CustomImageRenderer;
+    onImageLoad?: (img: HTMLImageElement | null) => void;
+}
+declare function BlurImage({ src, alt, blurDataUrl, blurColor, blurHash, objectFit, className, imageClassName, style, renderImage: propRenderImage, onImageLoad, }: BlurImageProps): react.JSX.Element;
+
+/**
+ * Development helper: exposes the shared `blurService` singleton as
+ * `window.blurService` while mounted, for inspection in the browser console.
+ * Does not augment the global `Window` type of consuming apps.
+ */
+declare function BlurServiceDebugger(): null;
+
+interface BlurVisualizationModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    imageUrl: string;
+    blurDataUrl?: string;
+    blurColor?: string;
+    altText?: string;
+    originalSize?: number;
+    optimizedSize?: number | null;
+    detectedColor?: string;
+    onChangeColor?: (hex: string) => void;
+    onUseDetectedColor?: () => void;
+    onChangeAltText?: (altText: string) => void;
+    locale?: UploadLocale;
+    translations?: Partial<UploadTranslations>;
+    renderImage?: CustomImageRenderer;
+    unstyled?: boolean;
+}
+declare function BlurVisualizationModal({ isOpen, onClose, imageUrl, blurDataUrl, blurColor, altText, originalSize, optimizedSize, detectedColor, onChangeColor, onUseDetectedColor, onChangeAltText, locale: propLocale, translations, renderImage, unstyled: propUnstyled, }: BlurVisualizationModalProps): react.ReactPortal | null;
+
+declare const ImageUpload: <TPreset extends string = UploadPresetName>(props: ImageUploadProps<TPreset> & {
+    ref?: Ref<ImageUploadHandle>;
+}) => ReactElement | null;
+declare const UnifiedImageUpload: <TPreset extends string = StandardPresetName | (string & {})>(props: ImageUploadProps<TPreset> & {
+    ref?: Ref<ImageUploadHandle>;
+}) => ReactElement | null;
+
+declare const MultiImageUpload: <TPreset extends string = UploadPresetName>(props: MultiImageUploadProps<TPreset> & {
+    ref?: Ref<ImageUploadHandle>;
+}) => ReactElement | null;
+
+interface PreviewTileProps {
+    preview: ImagePreview;
+    onRemove: (id: string) => void;
+    onCancel?: (id: string) => void;
+    onRetry?: (id: string) => void;
+    disabled?: boolean;
+    blurType?: BlurPlaceholderType;
+    isSelected?: boolean;
+    onToggleSelect?: (id: string) => void;
+    onEditAltText?: (id: string) => void;
+    showCheckbox?: boolean;
+    onAdjustColor?: (id: string) => void;
+    onChangeColor?: (id: string, color: string) => void;
+    onChangeAltText?: (id: string, altText: string) => void;
+    appendCacheBuster?: boolean;
+    locale?: UploadLocale;
+    translations?: Partial<UploadTranslations>;
+    renderImage?: CustomImageRenderer;
+    unstyled?: boolean;
+    className?: string;
+    style?: CSSProperties;
+}
+declare function PreviewTile({ preview, onRemove, onCancel, onRetry, disabled, blurType, isSelected, onToggleSelect, onEditAltText, showCheckbox, onAdjustColor, onChangeColor, onChangeAltText, appendCacheBuster: appendBuster, locale: propLocale, translations, renderImage, unstyled: propUnstyled, className, style, }: PreviewTileProps): react.JSX.Element;
+
+interface QualitySelectorProps {
+    value: QualityLevel;
+    onChange: (level: QualityLevel) => void;
+    preset?: string;
+    recommendedLevel?: QualityLevel;
+    recommendationNote?: {
+        en: string;
+        ar?: string;
+    };
+    originalFileSize?: number;
+    locale?: UploadLocale;
+    translations?: Partial<UploadTranslations>;
+    disabled?: boolean;
+    unstyled?: boolean;
+}
+declare function QualitySelector({ value, onChange, preset, recommendedLevel, recommendationNote, originalFileSize, locale, translations, disabled, unstyled, }: QualitySelectorProps): react.JSX.Element;
+
+interface SaveButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    icon?: ReactNode;
+    unstyled?: boolean;
+    children: ReactNode;
+}
+declare function SaveButton({ icon, unstyled, children, className, type, ...rest }: SaveButtonProps): react.JSX.Element;
+
+declare const SingleImageUpload: <TPreset extends string = UploadPresetName>(props: SingleImageUploadProps<TPreset> & {
+    ref?: Ref<ImageUploadHandle>;
+}) => ReactElement | null;
+
+interface UploadItem {
+    id: string;
+    url: string;
+    fileName?: string;
+    message?: string;
+    progress?: number;
+}
+interface UploadProgressPanelProps {
+    items: UploadItem[];
+    completedCount: number;
+    totalCount: number;
+    locale?: UploadLocale;
+    translations?: Partial<UploadTranslations>;
+    renderImage?: CustomImageRenderer;
+    unstyled?: boolean;
+}
+declare function UploadProgressPanel({ items, completedCount, totalCount, locale: propLocale, translations, renderImage, unstyled: propUnstyled, }: UploadProgressPanelProps): react.JSX.Element | null;
+
+export { ARABIC_UPLOAD_TRANSLATIONS, AltTextInput, type AltTextInputProps, AltTextModal, type AltTextModalProps, AnimatedImage, type AnimatedImageBaseProps, type AnimatedImageColorPlaceholder, type AnimatedImageErrorContext, type AnimatedImageObjectFit, type AnimatedImageProps, type AnimatedImageSource, BlurImage, type BlurImageProps, BlurPlaceholderType, BlurServiceDebugger, BlurSize, BlurVisualizationModal, type BlurVisualizationModalProps, CustomImageRenderer, DEFAULT_NEUTRAL_COLORS, DEFAULT_UPLOAD_TRANSLATIONS, HIDDEN_INPUT_STYLE, ImagePreview, type ImageRevealState, ImageUpload, ImageUploadHandle, ImageUploadProps, MultiImageUpload, MultiImageUploadProps, type PasteTargetMode, type PlaceholderSources, PreviewTile, type PreviewTileProps, QualitySelector, type QualitySelectorProps, SaveButton, type SaveButtonProps, SingleImageUpload, SingleImageUploadProps, UnifiedImageUpload, type UploadFormFields, type UploadItem, UploadLocale, UploadProgressPanel, type UploadProgressPanelProps, UploadTranslations, UploadVisualState, type UseClipboardPasteOptions, type UseDialogOptions, type UseImageRevealOptions, type XhrUploadOptions, arTranslations, buildUploadFormData, createFallbackBlurSvg, createUploadAbortError, cx, enTranslations, extractClipboardImageFiles, formatNeedsAltMessage, formatSkippedImagesMessage, formatUploadingCount, isUploadAbortError, normalizeUploadLocale, parseErrorPayload, resolveBackgroundColor, resolveIntrinsicPlaceholderUrl, resolveMeaningfulColor, resolvePlaceholderUrl, resolveSlotClass, resolveSlotStyle, resolveTranslations, resolveUploadDataState, selectPluralCategory, toFileListLike, uploadText, uploadViaXhr, useBlurDataURL, useBlurDataWithColor, useBlurHash, useBlurMetadata, useBlurPreload, useBlurVariant, useBulkBlurData, useClipboardPaste, useDialog, useDominantColor, useHasBlurHash, useImageReveal, useProgressiveBlur, useProgressiveImage };