//#region src/slot.d.ts /** * A lightweight slot that reserves a region in the DOM using comment markers. * Content between the markers can be replaced dynamically without wrapper elements. */ declare class Slot { #private; /** * Bind a slot to an existing marker pair (server-rendered comments) instead * of creating new ones. Used by the hydrate claim pass: content between the * markers is adopted as the slot's current content. */ static claim(start: Comment, end: Comment): Slot; /** * Render the slot as a DocumentFragment. * If not yet mounted, inserts the comment markers and any default content * (`Node`s or strings — native `append()` semantics; strings become text * nodes). If already mounted, extracts and returns the current content * WITHOUT disposing it — the caller takes ownership of the returned nodes * and is responsible for their disposal. */ get(...nodes: (string | Node)[]): DocumentFragment; /** Dispose reactive children and remove all content between the markers. */ clear(): void; /** * Replace the slot's content with the given nodes/strings (native * `append()` semantics; strings become text nodes). No args clears the * slot. Buffers until mounted; no-op if the content is identical. */ set(...nodes: (string | Node)[]): void; /** * Extract and return the current slot content as a DocumentFragment. * Returns `null` if the slot is not mounted. * Content is NOT disposed — the caller takes ownership and is responsible * for disposal. */ current(): DocumentFragment | null; /** Returns the parent node if the slot is mounted, otherwise `null`. */ parent(): ParentNode | null; /** Whether the slot's comment markers are attached to the DOM. */ isMounted(): boolean; } /** * What a `@slot()` property assignment accepts — the same content the * platform's `ParentNode.append()` takes (`Node` or string, strings become * text nodes), plus arrays of it (JSX passes multiple children as an array). */ type SlotContent = Node | string | readonly (Node | string)[]; /** * Field decorator declaring a slot as a plain property backed by a * {@link Slot}. Reading returns the slot's region (`slot.get()` — a fragment * to append into any template, elements-kit JSX or not); assigning fills it * (`null` clears). Values follow native `append()` semantics — a `Node`, a * string, or an array of them. Assignment buffers before mount, so consumers * can set content before the element renders. * * The getter is EFFECTFUL: it mounts the markers on first read and extracts * current content on later reads (the re-render semantic of * {@link Slot.get}). Read it to PLACE the region, not to inspect it. * * Declare the field as {@link SlotContent} to accept the full native * `append()` surface (`Node` | string | array); narrow it to `Node` when the * slot only ever holds an element. * * @example * ```tsx * class Card extends HTMLElement { * \@slot() header!: SlotContent; * * render() { * return
{this.header}
; // or root.append(card.header) * } * } * * // consumers — any framework, or none: * card.header = document.createElement("h1"); // Node * card.header = "plain text"; // native append() content * card.header = null; // clear * ``` */ declare function slot(): (_target: unknown, context: ClassFieldDecoratorContext) => (this: This, initialValue: V) => V; //#endregion export { Slot, SlotContent, slot };