import type React from 'react';
import type { ScrollEndDetail } from './types.js';
export interface ScrollAreaRef extends HTMLElement {
    /** Scrolls content to the bottom. */
    scrollToBottom(): void;
    /** Scrolls content to the top. */
    scrollToTop(): void;
    /** Recalculates scrollbar thumb size and position after dynamic content changes. */
    recalculate(): void;
}
/**
 * In React, reach the imperative methods through a ref:
 * `const api = useRef<ScrollAreaRef>(null)`, pass `ref={api}`, then `api.current?.scrollToBottom()`.
 * Available: scrollToBottom(), scrollToTop(), recalculate().
 *
 * @csspart base, new-content, thumb, track
 */
export interface ScrollAreaOwnProps {
    /**
     * Unique identifier for the element.
     * @example 'example-id'
     */
    id?: string;
    /**
     * Corner radius style. Allowed values: `sharp`, `rounded`, `pill`.
     * @example 'sharp'
     */
    shape?: 'sharp' | 'rounded' | 'pill';
    /**
     * Scrollbar track treatment: a visible track gutter, or a floating thumb over the content. Allowed values: `with-track`, `floating`.
     * @example 'with-track'
     */
    track?: 'with-track' | 'floating';
    /**
     * Scroll axis: vertical, horizontal, or both. Allowed values: `vertical`, `horizontal`, `both`.
     * @example 'vertical'
     */
    axis?: 'vertical' | 'horizontal' | 'both';
    /**
     * Component size. Allowed values: `xs`, `sm`, `md`, `lg`, `xl`.
     * @example 'xs'
     */
    size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
    /**
     * Fixed height for the scroll container.
     * @example 'h-[600px]'
     */
    height?: string;
    /**
     * Visible label text.
     * @example 'Example label'
     */
    label?: string;
    /**
     * Automatically scrolls to the bottom when new content is added. Allowed values: `off`, `bottom-stick`.
     * @example 'off'
     */
    autoScroll?: 'off' | 'bottom-stick';
    /**
     * Accessible label for the "new content" indicator button.
     * @example 'example'
     */
    newContentLabel?: string;
    /**
     * Adds role="log" for chat-style containers with live content.
     * @defaultValue false
     * @example true
     */
    logRole?: boolean;
    /**
     * Fires when the scroll container reaches its end. Detail: `ScrollEndDetail`.
     * @example (event) => console.log(event.detail)
     */
    onScrollEnd?: (event: CustomEvent<ScrollEndDetail>) => void;
    /** Default slot content.
     * @example <span>Content</span>
     */
    children?: React.ReactNode;
    /** 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 `<ScrollArea>`: the component's own API plus every standard DOM
 * attribute and native React event handler, forwarded verbatim to the
 * `<cx-scroll-area>` host — `id`, `data-*`, `aria-*`, `title`, `tabIndex`,
 * `slot`, `onMouseEnter`, and the rest. Own props always win over a
 * same-named DOM attribute.
 */
export type ScrollAreaProps = ScrollAreaOwnProps & Omit<React.HTMLAttributes<HTMLElement>, keyof ScrollAreaOwnProps | 'children' | 'dangerouslySetInnerHTML'>;
export declare const ScrollArea: React.ForwardRefExoticComponent<ScrollAreaOwnProps & Omit<React.HTMLAttributes<HTMLElement>, "dangerouslySetInnerHTML" | keyof ScrollAreaOwnProps> & React.RefAttributes<ScrollAreaRef>>;