import { Observable } from '@legendapp/state';
import { DeepMaybeObservable } from '@usels/core';
import { MaybeEventTarget } from '../../types.mjs';

interface UseElementVisibilityOptions {
    /** Initial visibility value. Default: false */
    initialValue?: boolean;
    /** Element used as the viewport for intersection. Maps to IntersectionObserver `root`. */
    scrollTarget?: MaybeEventTarget;
    /** Margin around the root. Accepts CSS-style values. Default: "0px" */
    rootMargin?: string;
    /** Threshold(s) at which to trigger. Default: 0 */
    threshold?: number | number[];
    /**
     * Stop observing after the element becomes visible for the first time. Default: false.
     * Must be set at mount time; changing dynamically has no effect.
     */
    once?: boolean;
}
/**
 * Framework-agnostic reactive element visibility tracker.
 *
 * Tracks whether a DOM element is intersecting the viewport (or a specified
 * scroll container). Returns a reactive `Observable<boolean>` that updates
 * automatically via the IntersectionObserver API.
 *
 * @param element - Element to observe (Ref$, Observable element, or raw element).
 * @param options - Optional configuration — plain, per-field Observable, or fully Observable.
 * @returns `Observable<boolean>` — true when element is intersecting.
 */
declare function createElementVisibility(element: MaybeEventTarget, options?: DeepMaybeObservable<UseElementVisibilityOptions>): Observable<boolean>;

export { type UseElementVisibilityOptions, createElementVisibility };