import { type MaybePromise } from '@augment-vir/common'; import { type PartInfo } from '../../lit-exports/all-lit-exports.js'; /** * Callback called by the {@link onIntersect} directive. * * @category Internal */ export type OnIntersectCallback = (params: { entry: IntersectionObserverEntry; allEntries: IntersectionObserverEntry[]; observer: IntersectionObserver; element: Element; }) => MaybePromise; /** * Options used for the {@link onIntersect} directive. * * @category Internal */ export type OnIntersectOptions = IntersectionObserverInit; /** * A directive that fires its listener any time the element's configured "intersection" is crossed. * This is commonly use for detecting when an element has scrolled into view. This uses the * [built-in `IntersectionObserver` * API](https://developer.mozilla.org/docs/Web/API/IntersectionObserver/IntersectionObserver), so it * is very efficient. * * @category Directives * @example * * ```ts * import {html, defineElement, onIntersect} from 'element-vir'; * * const MyElement = defineElement()({ * tagName: 'my-element', * render() { * return html` *
{ * if (entry.isIntersecting) { * console.log('is intersecting!'); * } else { * console.log('is not intersecting'); * } * })} * > * Some div *
* `; * }, * }); * ``` */ export declare const onIntersect: (options: IntersectionObserverInit, callback: OnIntersectCallback) => import("lit-html/directive.js").DirectiveResult<{ new (partInfo: PartInfo): { element: Element | undefined; options: OnIntersectOptions | undefined; intersectionObserver: undefined | IntersectionObserver; callback: OnIntersectCallback | undefined; fireCallback(entries: IntersectionObserverEntry[], observer: IntersectionObserver): void; update(partInfo: PartInfo, [options, callback,]: [OnIntersectOptions, OnIntersectCallback]): undefined; render(options: OnIntersectOptions, callback: OnIntersectCallback): undefined; get _$isConnected(): boolean; }; }>;