@thi.ng/rdom
Version:
Lightweight, reactive, VDOM-less UI/DOM components with async lifecycle and @thi.ng/hiccup compatible
31 lines • 1.35 kB
TypeScript
import type { Fn0, Maybe } from "@thi.ng/api";
import type { ComponentLike, IComponent, NumOrElement } from "./api.js";
import { Component } from "./component.js";
/**
* `IntersectionObserver`-based helper component for lazy
* loading/initialization. Creates an initially empty wrapper element, then only
* calls the given `inner` component factory function once the wrapper element
* intersects the viewport (as per provided IntersectionObserver options).
*
* @remarks
* The wrapper element MUST have an associated non-zero height (e.g. via CSS or
* initial content).
*
* @param tag
* @param attribs
* @param inner
* @param opts
*/
export declare const $lazy: (tag: string, attribs: any, inner: Fn0<Promise<ComponentLike>>, opts?: IntersectionObserverInit) => $Lazy;
export declare class $Lazy extends Component {
protected tag: string;
protected attribs: any;
protected ctor: Fn0<Promise<ComponentLike>>;
protected opts?: IntersectionObserverInit | undefined;
protected observer: Maybe<IntersectionObserver>;
protected inner: Maybe<IComponent>;
constructor(tag: string, attribs: any, ctor: Fn0<Promise<ComponentLike>>, opts?: IntersectionObserverInit | undefined);
mount(parent: ParentNode, index?: NumOrElement): Promise<Element>;
unmount(): Promise<void>;
}
//# sourceMappingURL=lazy.d.ts.map