import type { TemplateResult } from "lit-html";
import type { DirectiveResult } from "lit-html/directive.js";
/**
 * Lifecycle object returned from the `htmlHook` mount callback.
 *
 * - `onUpdate`  — called on every re-render after the initial mount,
 *                 receiving the latest args passed at the call site.
 * - `onCleanup` — called when the element is disconnected from the DOM.
 *
 * @template A - Tuple of user-supplied argument types.
 */
export type HtmlHookLifecycle<A extends any[] = []> = {
    /** Called on every re-render after the initial mount with the latest args. */
    onUpdate?: (...args: A) => void;
    /** Called when the element is disconnected from the DOM. */
    onCleanup?: () => void;
};
/**
 * The render function passed to the `htmlHook` mount callback.
 * Call this to push a lit-html template into the child part slot.
 * Can be called synchronously during mount, or asynchronously later
 * (from timers, fetch callbacks, observers, etc.).
 */
export type HtmlHookRenderFn = (template: TemplateResult) => void;
/**
 * The mount callback signature for `htmlHook()`.
 *
 * The first argument `render` is always injected automatically — it pushes
 * templates into the child slot. Any additional arguments are the
 * user-supplied values passed at the template call site.
 *
 * Return an `HtmlHookLifecycle` object to handle updates and cleanup,
 * or return nothing if the mount body is all you need.
 *
 * @template A - Tuple of user-supplied argument types.
 */
export type HtmlHookMountFn<A extends any[] = []> = (render: HtmlHookRenderFn, ...args: A) => HtmlHookLifecycle<A> | void;
/**
 * `htmlHook()` — create a reusable child-part directive that lets you
 * render HTML templates into a slot.
 *
 * Returns a **function** that accepts user-supplied arguments and produces
 * a lit-html directive result. Define the hook once, use it anywhere.
 *
 * The first argument to the mount callback (`render`) is always injected —
 * it pushes a `TemplateResult` into the child slot. Any extra parameters
 * you define become the arguments the returned function accepts at the
 * call site, and they flow through to `onUpdate` on every re-render.
 *
 * The `render` function can be called:
 * - **Synchronously** during mount (content appears immediately)
 * - **Asynchronously** from timers, fetch callbacks, observers, etc.
 *
 * While the mount callback or lifecycle methods are executing,
 * `componentRunningStatus.isHookRunning` is set to `true`.
 *
 * @example
 * ```ts
 * // ── No args ──────────────────────────────────────────────────────
 * const greeting = htmlHook((render) => {
 *   render(html`<h1>Hello, World!</h1>`);
 * });
 * html`<div>${greeting()}</div>`
 *
 * // ── With args ────────────────────────────────────────────────────
 * const userCard = htmlHook((render, name: string, role: string) => {
 *   render(html`<div class="card">${name} — ${role}</div>`);
 *   return {
 *     onUpdate(nextName, nextRole) {
 *       render(html`<div class="card">${nextName} — ${nextRole}</div>`);
 *     },
 *   };
 * });
 * html`<section>${userCard(user.name, user.role)}</section>`
 *
 * // ── Async usage ──────────────────────────────────────────────────
 * const asyncData = htmlHook((render, url: string) => {
 *   render(html`<p>Loading...</p>`);
 *   fetch(url)
 *     .then(r => r.json())
 *     .then(data => render(html`<pre>${JSON.stringify(data)}</pre>`));
 *   return {
 *     onUpdate(nextUrl) {
 *       render(html`<p>Loading...</p>`);
 *       fetch(nextUrl)
 *         .then(r => r.json())
 *         .then(data => render(html`<pre>${JSON.stringify(data)}</pre>`));
 *     },
 *     onCleanup() { /* cancel in-flight requests *​/ },
 *   };
 * });
 * html`<div>${asyncData(currentUrl.val)}</div>`
 * ```
 *
 * @template A - Tuple of user-supplied argument types.
 * @param mountFn - Called once on first mount. Receives `render()` followed
 *                  by the user-supplied args.
 * @returns A function that accepts the user args and produces a directive result.
 */
export declare function htmlHook<A extends any[] = []>(mountFn: HtmlHookMountFn<A>): (...args: A) => DirectiveResult;
//# sourceMappingURL=htmlHook.d.ts.map