import { TNode, Value, Signal } from '@tempots/dom';
/**
 * Configuration options for the {@link UnstyledDropZone} component.
 */
export type UnstyledDropZoneOptions = {
    /**
     * Callback invoked when files are selected, either via drag-and-drop
     * or the file picker dialog. The `via` parameter indicates the selection method.
     */
    onChange: (files: File[], via: 'dragdrop' | 'click') => void;
    /**
     * Optional external reactive file list. When provided, the drop zone
     * derives its internal file state from this value.
     */
    value?: Value<File[]>;
    /**
     * MIME type filter for accepted files (e.g., `'image/*'`, `'application/pdf'`).
     * Passed to the hidden `<input type="file">` element.
     * @default '*\/*'
     */
    accept?: Value<string>;
    /**
     * Whether clicking the drop zone opens the native file picker dialog.
     * @default true
     */
    enableClick?: Value<boolean>;
    /**
     * Render function for the drop zone content. Receives reactive state
     * and control functions to build a custom UI.
     *
     * @param options.files - Reactive signal containing the current file list.
     * @param options.clear - Clears the current file selection.
     * @param options.change - Programmatically sets the file list.
     */
    content: (options: {
        files: Signal<File[]>;
        clear: () => void;
        change: (files: File[]) => void;
    }) => TNode;
    /**
     * Whether the drop zone is disabled. Disabled zones do not accept drops or clicks.
     * @default false
     */
    disabled?: Value<boolean>;
    /**
     * Whether multiple files can be selected at once.
     */
    allowMultiple?: Value<boolean>;
};
/**
 * Renders an unstyled file drop zone that supports both drag-and-drop and
 * click-to-browse file selection. This component provides the behavior
 * and accessibility without any visual styling, allowing complete UI
 * customization through the `content` render function.
 *
 * The component:
 * - Handles `dragover`, `dragleave`, and `drop` events
 * - Opens a native file picker on click (when `enableClick` is `true`)
 * - Supports keyboard activation (Enter/Space)
 * - Applies `role="button"` and ARIA labels for accessibility
 * - Synchronizes a hidden `<input type="file">` with the reactive file state
 *
 * @param options - Configuration options for the drop zone.
 * @returns A renderable drop zone container.
 *
 * @example
 * ```typescript
 * UnstyledDropZone({
 *   accept: 'image/*',
 *   allowMultiple: true,
 *   onChange: (files, via) => {
 *     console.log(`${files.length} files selected via ${via}`)
 *   },
 *   content: ({ files, clear }) =>
 *     html.div(
 *       attr.class('drop-area'),
 *       files.map(f => f.length > 0
 *         ? html.div(
 *             `${f.length} file(s) selected`,
 *             html.button(on.click(clear), 'Clear')
 *           )
 *         : html.div('Drop files here or click to browse')
 *       )
 *     ),
 * })
 * ```
 */
export declare function UnstyledDropZone({ onChange, value, accept, enableClick, content, disabled, allowMultiple, }: UnstyledDropZoneOptions): import("@tempots/core").Renderable<import("@tempots/dom").DOMContext, typeof import("@tempots/dom").DOM_RENDERABLE_TYPE>;