goobs-frontend/dist/components/FileDropzone/index.d.ts

A comprehensive React-based libary for building modern web applications

import { default as React, ReactNode } from 'react';
import { FieldTheme } from '../Field/Shell/types';
export type FileDropzoneVariant = 'image' | 'document';
export interface FileDropzoneProps {
    /**
     * Current value identifier — typically the uploaded asset URL / filename.
     * Drives the "Upload" vs "Change" button label and the cleared-input reset.
     * Presentation-only: the dropzone never fetches it, it's just a signal that
     * a value exists.
     */
    value?: string;
    /** Called with the picked `File` whenever the user drops or browses one. */
    onFileSelect: (file: File) => void;
    /**
     * `accept` attribute for the hidden file input. Defaults are derived from
     * `variant` (`'image/*'` for image, all files for document) when omitted.
     */
    accept?: string;
    /**
     * Preview node rendered in the leading preview tile (e.g. a Next.js
     * `<Image>` for image uploads, a doc icon + filename for documents). When
     * omitted, a variant-appropriate placeholder glyph renders.
     */
    preview?: ReactNode;
    /** Host-controlled uploading flag — disables the control + shows progress copy. */
    uploading?: boolean;
    /** Host-controlled error string — rendered in the FieldShell error region. */
    error?: string;
    /** Visible field label. Forwarded to `<FieldShell>`. */
    label?: ReactNode;
    /** Marks the field required (FieldShell renders the required indicator). */
    required?: boolean;
    /** Stable test selector — forwarded to FieldShell as `data-field-name`. */
    name?: string;
    /**
     * Layout / copy variant. `'image'` shows a square preview tile; `'document'`
     * shows a wide drop strip. Default `'image'`.
     */
    variant?: FileDropzoneVariant;
    /** Optional remove handler. When set, a "Remove" control renders while a value exists. */
    onRemove?: () => void;
    /** Theming. Default `'sacred'`. */
    styles?: {
        theme?: FieldTheme;
    };
}
/**
 * Drag-drop + click-to-browse file picker with a preview slot, generalized
 * from the ThothOS Cloudflare image-upload field into a presentation-only
 * primitive: the host app owns the upload transport, receives the picked
 * `File` via `onFileSelect`, and controls `uploading` / `error` / `preview`.
 * Label, required, and error wiring is delegated to the shared `<FieldShell>`
 * so the dropzone announces to assistive tech like every other goobs field.
 * The drop surface is a real `<button>` that opens a hidden
 * `<input type="file">` and doubles as a native drag-drop target; the input
 * resets after each pick so the same file can be re-selected. Emits
 * `data-component="FileDropzone"` plus a `file.select` diagnostics beacon on
 * every pick.
 */
declare const FileDropzone: React.FC<FileDropzoneProps>;
export default FileDropzone;
//# sourceMappingURL=index.d.ts.map