import type React from 'react';
import type { ChatSubmitDetail, FileAddDetail, FileInfo, FileRejectDetail, FileRemoveDetail, FocusDetail, InputDetail, KeyboardDetail } from './types.js';
export interface ChatInputRef extends HTMLElement {
    /** Focuses the textarea. */
    focus(): void;
    /** Returns the current textarea value. */
    getValue(): string;
    /** Sets the textarea value programmatically. */
    setValue(value: string): void;
    /** Adds files programmatically to the attachment tray. */
    addFiles(files: FileList): void;
    /** Returns current attachments as FileInfo[]. */
    getAttachments(): FileInfo[];
    /** Removes all file attachments. */
    clearAttachments(): void;
}
/**
 * Value is controlled via `onInput` events (not native `onChange`).
 * Submit fires `cx-submit` with the message text — does NOT submit a native form.
 * File attachments: use `addFiles()` imperatively or enable the file button via `fileAccept` prop.
 *
 * In React, reach the imperative methods through a ref:
 * `const api = useRef<ChatInputRef>(null)`, pass `ref={api}`, then `api.current?.focus()`.
 * Available: focus(), getValue(), setValue(), +3 more.
 *
 * @csspart attachments, base
 */
export interface ChatInputOwnProps {
    /**
     * Unique identifier for the element.
     * @example 'example-id'
     */
    id?: string;
    /**
     * Corner radius style. Allowed values: `sharp`, `rounded`, `pill`.
     * @example 'sharp'
     */
    shape?: 'sharp' | 'rounded' | 'pill';
    /**
     * Component size. Allowed values: `xs`, `sm`, `md`, `lg`, `xl`.
     * @example 'xs'
     */
    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
    /**
     * Placeholder text shown when empty.
     * @example 'Enter a value'
     */
    placeholder?: string;
    /**
     * Current value of the component.
     * @example 'example'
     */
    value?: string;
    /**
     * Disables the component, preventing interaction.
     * @defaultValue false
     * @example true
     */
    disabled?: boolean;
    /**
     * Maximum number of visible rows before the input scrolls.
     * @defaultValue 0
     * @example 1
     */
    maxRows?: number;
    /**
     * Whether to display the secondary action button.
     * @defaultValue true
     * @example true
     */
    showActionButton?: boolean;
    /**
     * Accessible label for the secondary action button.
     * @example 'example'
     */
    actionLabel?: string;
    /**
     * Accessible label for the submit/send button.
     * @example 'example'
     */
    submitLabel?: string;
    /**
     * Visible or screen-reader label for the message field. May be omitted only when ariaLabel supplies the accessible name.
     * @example 'Example label'
     */
    label?: string;
    /**
     * Maximum character count. Displays a character counter when set.
     * @defaultValue 0
     * @example 1
     */
    maxLength?: number;
    /**
     * Whether to show the file attachment button.
     * @defaultValue false
     * @example true
     */
    acceptFiles?: boolean;
    /**
     * Accepted file types for the attachment button (MIME types or extensions).
     * @example 'image/*,.pdf'
     */
    accept?: string;
    /**
     * Maximum file size in bytes for attachments.
     * @defaultValue 0
     * @example 1
     */
    maxFileSize?: number;
    /**
     * Whether multiple file selection is allowed for attachments.
     * @defaultValue false
     * @example true
     */
    multipleFiles?: boolean;
    /**
     * Whether a message is currently being submitted. Disables the send button and shows a loading state.
     * @defaultValue false
     * @example true
     */
    submitting?: boolean;
    /**
     * Fires when focus enters the component. Detail: `FocusDetail`.
     * @example (event) => console.log(event.detail.relatedTarget)
     */
    onFocus?: (event: CustomEvent<FocusDetail>) => void;
    /**
     * Fires when focus leaves the component. Detail: `FocusDetail`.
     * @example (event) => console.log(event.detail.relatedTarget)
     */
    onBlur?: (event: CustomEvent<FocusDetail>) => void;
    /**
     * Fires when a key is pressed inside the component. Detail: `KeyboardDetail`.
     * @example (event) => console.log(event.detail.key)
     */
    onKeydown?: (event: CustomEvent<KeyboardDetail>) => void;
    /**
     * Fires when a key is released inside the component. Detail: `KeyboardDetail`.
     * @example (event) => console.log(event.detail.key)
     */
    onKeyup?: (event: CustomEvent<KeyboardDetail>) => void;
    /**
     * Fires when the user submits the current value. Detail: `ChatSubmitDetail`.
     * @example (event) => console.log(event.detail.value)
     */
    onSubmit?: (event: CustomEvent<ChatSubmitDetail>) => void;
    /**
     * Fires on each user edit before the value is committed. Detail: `InputDetail`.
     * @example (event) => console.log(event.detail.value)
     */
    onInput?: (event: CustomEvent<InputDetail>) => void;
    /**
     * Fires after files are accepted for attachment. Detail: `FileAddDetail`.
     * @example (event) => console.log(event.detail.files)
     */
    onFileAdd?: (event: CustomEvent<FileAddDetail>) => void;
    /**
     * Fires after an attachment is removed. Detail: `FileRemoveDetail`.
     * @example (event) => console.log(event.detail.files)
     */
    onFileRemove?: (event: CustomEvent<FileRemoveDetail>) => void;
    /**
     * Fires when files fail attachment validation. Detail: `FileRejectDetail`.
     * @example (event) => console.log(event.detail.reason)
     */
    onFileReject?: (event: CustomEvent<FileRejectDetail>) => void;
    /** CSS class applied to the Custom Element host.
     * @example 'my-component'
     */
    className?: string;
    /** Inline styles applied to the Custom Element host.
     * @example { marginTop: 8 }
     */
    style?: React.CSSProperties;
}
/**
 * Props for `<ChatInput>`: the component's own API plus every standard DOM
 * attribute and native React event handler, forwarded verbatim to the
 * `<cx-chat-input>` host — `id`, `data-*`, `aria-*`, `title`, `tabIndex`,
 * `slot`, `onMouseEnter`, and the rest. Own props always win over a
 * same-named DOM attribute.
 */
export type ChatInputProps = ChatInputOwnProps & Omit<React.HTMLAttributes<HTMLElement>, keyof ChatInputOwnProps | 'children' | 'dangerouslySetInnerHTML'>;
export declare const ChatInput: React.ForwardRefExoticComponent<ChatInputOwnProps & Omit<React.HTMLAttributes<HTMLElement>, "children" | "dangerouslySetInnerHTML" | keyof ChatInputOwnProps> & React.RefAttributes<ChatInputRef>>;