import { RefObject } from 'react';
/**
 * Options for useScrollReveal hook
 */
export interface UseScrollRevealOptions<T extends HTMLElement = HTMLElement> {
    /** Ref to the container element to scope the query (default: document.body) */
    containerRef?: RefObject<T | null>;
    /** IntersectionObserver threshold - element visibility percentage to trigger (default: 0.1) */
    threshold?: number;
    /** IntersectionObserver rootMargin - margin around root (default: '0px 0px -50px 0px') */
    rootMargin?: string;
    /** CSS class to add when element becomes visible (default: 'visible') */
    visibleClass?: string;
    /** CSS selector for elements to observe (default: '.scroll-reveal') */
    selector?: string;
}
/**
 * Hook to enable scroll reveal animations using IntersectionObserver.
 *
 * Observes elements with the specified selector and adds a visibility class
 * when they enter the viewport.
 *
 * @param options - Configuration options
 *
 * @example
 * ```tsx
 * // Usage without parameters (queries entire document.body)
 * import { useScrollReveal } from '@lark-apaas/client-toolkit/hooks/useScrollReveal';
 *
 * function MyComponent() {
 *   useScrollReveal();
 *
 *   return <div className="scroll-reveal">I will fade in on scroll!</div>;
 * }
 * ```
 *
 * @example
 * ```tsx
 * // Usage with container ref
 * import { useRef } from 'react';
 * import { useScrollReveal } from '@lark-apaas/client-toolkit/hooks/useScrollReveal';
 *
 * function MyComponent() {
 *   const containerRef = useRef<HTMLDivElement>(null);
 *   useScrollReveal({ containerRef });
 *
 *   return (
 *     <div ref={containerRef}>
 *       <div className="scroll-reveal">I will fade in on scroll!</div>
 *     </div>
 *   );
 * }
 * ```
 *
 * @example
 * ```tsx
 * // Usage with custom options
 * useScrollReveal({ threshold: 0.2, visibleClass: 'animate-in' });
 * ```
 */
export declare function useScrollReveal<T extends HTMLElement = HTMLElement>(options?: UseScrollRevealOptions<T>): void;