elements-kit 0.20.0 → 0.22.0

package/dist/custom-elements-CdpilMDu.d.mts

@@ -0,0 +1,87 @@
+import { t as ATTRIBUTES } from "./attributes-DILeh3-s.mjs";
+
+//#region src/custom-elements.d.ts
+type RegisteredElementInstances = { [K in keyof ElementsKit.CustomElementRegistry]: ElementsKit.CustomElementRegistry[K] extends (abstract new (...args: any[]) => infer I) ? I : never };
+declare global {
+  namespace ElementsKit {
+    interface CustomElementRegistry {}
+  }
+  interface HTMLElementTagNameMap extends RegisteredElementInstances {}
+}
+type CustomElementRegistry = ElementsKit.CustomElementRegistry;
+type AnyCtor = CustomElementConstructor;
+/**
+ * @internal Public instance keys of `I`: for `HTMLElement` subclasses the
+ * inherited DOM surface is dropped; for plain classes `render` is dropped.
+ * Shared by the raw extractors here and the JSX helpers in jsx-runtime.
+ */
+type PublicPropKeys<I> = I extends HTMLElement ? Exclude<keyof I, keyof HTMLElement | symbol> : Exclude<keyof I, symbol | "render">;
+type InstanceOfCtor<C> = C extends (abstract new (...args: any[]) => infer I) ? I : C;
+/**
+ * Settable property surface of a custom-element class (or instance) — the
+ * user's public fields, all optional, without the inherited `HTMLElement`
+ * surface. Slot-backed props (`@slot()` accessors) appear here as their
+ * `Node | null` read type — assignment fills the slot.
+ *
+ * @example
+ * ```ts
+ * class XCounter extends HTMLElement { count = 0; }
+ * type P = PropertiesOf<typeof XCounter>; // { count?: number }
+ * ```
+ */
+type PropertiesOf<C> = InstanceOfCtor<C> extends infer I ? { [K in PublicPropKeys<I> & string]?: I[K] } : never;
+/**
+ * Observed attributes of a custom-element class — every key of
+ * `static [ATTRIBUTES]`, valued `string | null` (the raw HTML surface).
+ *
+ * @example
+ * ```ts
+ * type A = AttributesOf<typeof XRange>; // { min?: string | null; ... }
+ * ```
+ */
+type AttributesOf<C> = C extends {
+  [ATTRIBUTES]: infer M;
+} ? M extends Record<string, unknown> ? string extends keyof M ? {} : { [K in keyof M & string]?: string | null } : {} : {};
+/**
+ * Raw event map of a custom-element class — `static events` verbatim.
+ * Shape it however your host needs: `addEventListener` typing, framework
+ * event bindings, or an `HTMLElementEventMap` augmentation.
+ *
+ * @example
+ * ```ts
+ * type E = EventsOf<typeof XRange>; // { commit: CustomEvent<number> }
+ * declare global {
+ *   interface HTMLElementEventMap extends EventsOf<typeof XRange> {}
+ * }
+ * ```
+ */
+type EventsOf<C> = C extends {
+  events: infer E;
+} ? E extends Record<string, Event> ? E : {} : {};
+/**
+ * Register a custom element with the browser and return its class.
+ * Pair with an augmentation of `ElementsKit.CustomElementRegistry` to get typed JSX.
+ *
+ * @example
+ * ```tsx
+ * import { defineElement } from "elements-kit/custom-elements";
+ *
+ * class XCounter extends HTMLElement {}
+ *
+ * defineElement("x-counter", XCounter);
+ *
+ * declare global {
+ *   namespace ElementsKit {
+ *     interface CustomElementRegistry {
+ *       "x-counter": typeof XCounter;
+ *     }
+ *   }
+ * }
+ *
+ * // JSX now gets typed props + typed ref
+ * // <x-counter />
+ * ```
+ */
+declare function defineElement<Tag extends `${string}-${string}`, C extends AnyCtor>(tag: Tag, cls: C, options?: ElementDefinitionOptions): C;
+//#endregion
+export { PublicPropKeys as a, PropertiesOf as i, CustomElementRegistry as n, defineElement as o, EventsOf as r, AttributesOf as t };

package/dist/custom-elements.d.mts

@@ -1,2 +1,2 @@
-import { n as defineElement, t as CustomElementRegistry } from "./custom-elements-DK5VUcWA.mjs";
-export { CustomElementRegistry, defineElement };
+import { a as PublicPropKeys, i as PropertiesOf, n as CustomElementRegistry, o as defineElement, r as EventsOf, t as AttributesOf } from "./custom-elements-CdpilMDu.mjs";
+export { AttributesOf, CustomElementRegistry, EventsOf, PropertiesOf, PublicPropKeys, defineElement };

package/dist/{element-D3om9yA6.mjs → element-Di0PYFX1.mjs}

@@ -2,7 +2,7 @@ import { C as untracked, _ as onCleanup, d as effectScope, u as effect } from ".
 import "./polyfill-CdZVCxdo.mjs";
 import { isReactive, resolveProps } from "./signals/index.mjs";
 import { on } from "./utilities/event-listener.mjs";
-import { n as Slot, r as resolveNode$1, t as SLOTS } from "./slot-Dvf30O0B.mjs";
+import { Slot } from "./slot.mjs";
 //#region src/jsx-runtime/constants.ts
 /**
 * IDL properties that take precedence over the default `setAttribute` path.
@@ -267,46 +267,23 @@ const ReservedNameSpaces = new Set([
 ]);
 //#endregion
 //#region src/jsx-runtime/children.ts
-function hasSlots(node) {
-	return SLOTS in node;
+var UnsupportedChildError = class extends Error {
+	constructor(value) {
+		super(`Unsupported child type: ${typeof value}`);
+		this.name = "UnsupportedChildError";
+	}
+};
+function resolveNode$1(c) {
+	if (c instanceof Node) return c;
+	if (c === null || c === void 0 || typeof c === "boolean") return document.createComment("");
+	if (typeof c === "string" || typeof c === "number" || typeof c === "bigint" || typeof c === "symbol" || c instanceof Date || c instanceof RegExp) return document.createTextNode(String(c));
+	throw new UnsupportedChildError(c);
 }
 function isChildrenProperty(node, key) {
-	if (key === "children" && (node instanceof Element || node instanceof DocumentFragment)) return true;
-	if (hasSlots(node)) {
-		if (key.replace(/^slot:/, "") in node[SLOTS]) return true;
-	}
-	return key in node && node[key] instanceof Slot;
+	return key === "children" && (node instanceof Element || node instanceof DocumentFragment);
 }
 function applyChildren(node, key, value) {
-	if (hasSlots(node)) {
-		const slotName = key.replace(/^slot:/, "");
-		if (slotName in node[SLOTS]) {
-			applySlot(node[SLOTS][slotName], value);
-			return;
-		}
-	}
-	if (key === "children" && (node instanceof Element || node instanceof DocumentFragment)) {
-		mountChildren(node, value);
-		return;
-	}
-	if (key in node) {
-		const slot = node[key];
-		if (!(slot instanceof Slot)) return;
-		applySlot(slot, value);
-	}
-}
-function applySlot(slot, value) {
-	let dispose;
-	if (typeof value === "function") effect(() => slot.set(resolveChild(value())));
-	else {
-		const node = resolveChild(value);
-		dispose = node[Symbol.dispose];
-		slot.set(node);
-	}
-	onCleanup(() => {
-		dispose?.();
-		slot.clear();
-	});
+	if (key === "children" && (node instanceof Element || node instanceof DocumentFragment)) mountChildren(node, value);
 }
 const FRAGMENT_POOL_MAX = 4;
 const fragmentPool = [];
@@ -388,7 +365,7 @@ function mountStatic(el, list, kind) {
 function mountChild(el, child) {
 	if (typeof child === "function") {
 		const slot = new Slot();
-		el.appendChild(slot.render());
+		el.appendChild(slot.get());
 		effect(() => slot.set(resolveChild(child())));
 		onCleanup(() => slot.clear());
 		return;

package/dist/for.d.mts

@@ -1,4 +1,4 @@
-import { _ as Require, m as Props } from "./types-ncUK9rki.mjs";
+import { s as MaybeReactiveProps } from "./children-s3nFjpLA.mjs";
 
 //#region src/for.d.ts
 type KeyFn<T> = (item: T, index: number) => string | number;
@@ -13,8 +13,9 @@ interface Entry {
 }
 /**
  * Props for `<For>`, derived from its public instance fields.
- * All props are optional — the class initializes sane defaults at runtime.
- * Non-function props also accept a reactive getter.
+ * `each` and `children` are required; `by` is optional (identity keying by
+ * default). Non-function props also accept a reactive getter — `each` takes a
+ * signal of arrays.
  *
  * @example
  * ```tsx
@@ -30,7 +31,11 @@ interface Entry {
  * };
  * ```
  */
-type ForProps<T> = Require<Props<For<T>>, "each" | "children">;
+type ForProps<T> = MaybeReactiveProps<{
+  each: T[];
+  by?: KeyFn<T>;
+  children: RenderFn<T>;
+}>;
 /**
  * Keyed list renderer. See {@link ForProps} for prop details.
  *

package/dist/for.mjs

@@ -1,6 +1,6 @@
 import { C as untracked, S as trigger, _ as onCleanup, d as effectScope, u as effect, x as signal } from "./lib-DYypKhxk.mjs";
 import "./signals/index.mjs";
-import { n as disposeElement } from "./element-D3om9yA6.mjs";
+import { n as disposeElement } from "./element-Di0PYFX1.mjs";
 //#region src/for.ts
 /**
 * Keyed list renderer. See {@link ForProps} for prop details.

package/dist/{fragment-ROPRBJQd.mjs → fragment-Bvs1sGu1.mjs}

@@ -1,7 +1,7 @@
 import { _ as onCleanup, u as effect } from "./lib-DYypKhxk.mjs";
 import "./signals/index.mjs";
-import { a as mountChild } from "./element-D3om9yA6.mjs";
-import { n as Slot } from "./slot-Dvf30O0B.mjs";
+import { a as mountChild } from "./element-Di0PYFX1.mjs";
+import { Slot } from "./slot.mjs";
 //#region src/jsx-runtime/fragment.ts
 /**
 * Parse an HTML string script-inertly: markup renders, `<script>` tags are
@@ -33,7 +33,7 @@ function Fragment(props) {
 	const fragment = document.createDocumentFragment();
 	if ("html" in props && props.html) {
 		const slot = new Slot();
-		fragment.appendChild(slot.render());
+		fragment.appendChild(slot.get());
 		const source = props.children;
 		if (typeof source === "function") {
 			effect(() => {

package/dist/hydrate/index.mjs

@@ -1,2 +1,2 @@
-import { t as hydrate } from "../hydrate-6Qx4n4Su.mjs";
+import { t as hydrate } from "../hydrate-CHomBRY9.mjs";
 export { hydrate };

package/dist/{hydrate-6Qx4n4Su.mjs → hydrate-CHomBRY9.mjs}

@@ -2,10 +2,10 @@ import { C as untracked, _ as onCleanup, d as effectScope, n as CLAIM, t as ASYN
 import { isReactive, resolveProps } from "./signals/index.mjs";
 import { isReactivePromiseLike } from "./utilities/promise.mjs";
 import { flushDeferredAsyncRuns, isAsyncLike } from "./utilities/async.mjs";
-import { i as applyProps, o as resolveChild, r as setRenderer, t as createElement } from "./element-D3om9yA6.mjs";
-import { n as Slot } from "./slot-Dvf30O0B.mjs";
+import { i as applyProps, o as resolveChild, r as setRenderer, t as createElement } from "./element-Di0PYFX1.mjs";
+import { Slot } from "./slot.mjs";
 import { For, isForComponent } from "./for.mjs";
-import { n as isFragmentComponent, r as parseHtml, t as Fragment } from "./fragment-ROPRBJQd.mjs";
+import { n as isFragmentComponent, r as parseHtml, t as Fragment } from "./fragment-Bvs1sGu1.mjs";
 //#region src/hydrate/claim.ts
 let hydrationContext = null;
 function setHydrationContext(ctx) {
@@ -171,7 +171,7 @@ function claimSlot(cur, om) {
 		found: cur.node
 	});
 	const slot = new Slot();
-	cur.parent.insertBefore(slot.render(), cur.node);
+	cur.parent.insertBefore(slot.get(), cur.node);
 	return slot;
 }
 function claimMarkerRange(cur, open, close) {

package/dist/integrations/astro-client.mjs

@@ -1,6 +1,6 @@
-import { t as createElement } from "../element-D3om9yA6.mjs";
+import { t as createElement } from "../element-Di0PYFX1.mjs";
 import { render } from "../render.mjs";
-import { t as hydrate } from "../hydrate-6Qx4n4Su.mjs";
+import { t as hydrate } from "../hydrate-CHomBRY9.mjs";
 import { withSlotProps } from "./astro-slots.mjs";
 //#region src/integrations/astro-client.ts
 /**

package/dist/integrations/astro-server.mjs

@@ -1,8 +1,8 @@
 import { y as setInertEffects } from "../lib-DYypKhxk.mjs";
 import { resolveProps } from "../signals/index.mjs";
-import { r as setRenderer, t as createElement } from "../element-D3om9yA6.mjs";
+import { r as setRenderer, t as createElement } from "../element-Di0PYFX1.mjs";
 import { withSlotProps } from "./astro-slots.mjs";
-import { i as serverJsx, n as renderToString, r as SNode } from "../server-iFSng50i.mjs";
+import { i as serverJsx, n as renderToString, r as SNode } from "../server-CTkyXTV6.mjs";
 //#region src/integrations/astro-server.ts
 /**
 * Decide whether `Component` is an elements-kit component. Invoked by Astro

package/dist/integrations/astro-slots.d.mts

@@ -1,11 +1,12 @@
 //#region src/integrations/astro-slots.d.ts
 /**
  * @internal Map Astro's pre-rendered slot HTML (`Record<name, html>`) into
- * elements-kit props: the `default` slot becomes `children`, named slots
- * become `slot:<name>` props. Each value is a thunk building Astro's slot
- * wrapper element around a `<Fragment html>` region — deferred so the jsx
- * dispatches to whichever renderer is active when the component reads the
- * prop (string emission on the server, DOM on the client).
+ * elements-kit props: the `default` slot becomes `children`, each named slot
+ * becomes a plain `<name>` prop (named slots are plain properties now — the
+ * same shape `<Card header={…}>` passes). Each value is a thunk building
+ * Astro's slot wrapper element around a `<Fragment html>` region — deferred so
+ * the jsx dispatches to whichever renderer is active when the component reads
+ * the prop (string emission on the server, DOM on the client).
  */
 declare function withSlotProps(props: Record<string, unknown> | null | undefined, slots: Record<string, string> | null | undefined, staticSlot?: boolean): Record<string, unknown>;
 //#endregion

package/dist/integrations/astro-slots.mjs

@@ -1,13 +1,14 @@
-import { t as createElement } from "../element-D3om9yA6.mjs";
-import { t as Fragment } from "../fragment-ROPRBJQd.mjs";
+import { t as createElement } from "../element-Di0PYFX1.mjs";
+import { t as Fragment } from "../fragment-Bvs1sGu1.mjs";
 //#region src/integrations/astro-slots.ts
 /**
 * @internal Map Astro's pre-rendered slot HTML (`Record<name, html>`) into
-* elements-kit props: the `default` slot becomes `children`, named slots
-* become `slot:<name>` props. Each value is a thunk building Astro's slot
-* wrapper element around a `<Fragment html>` region — deferred so the jsx
-* dispatches to whichever renderer is active when the component reads the
-* prop (string emission on the server, DOM on the client).
+* elements-kit props: the `default` slot becomes `children`, each named slot
+* becomes a plain `<name>` prop (named slots are plain properties now — the
+* same shape `<Card header={…}>` passes). Each value is a thunk building
+* Astro's slot wrapper element around a `<Fragment html>` region — deferred so
+* the jsx dispatches to whichever renderer is active when the component reads
+* the prop (string emission on the server, DOM on the client).
 */
 function withSlotProps(props, slots, staticSlot = false) {
 	const base = { ...props ?? {} };
@@ -22,7 +23,7 @@ function withSlotProps(props, slots, staticSlot = false) {
 			})
 		});
 		if (name === "default") base.children = slot;
-		else base[`slot:${name}`] = slot;
+		else base[name] = slot;
 	}
 	return base;
 }

package/dist/integrations/react.d.mts

@@ -1,4 +1,4 @@
-import { y as Computed } from "../types-ncUK9rki.mjs";
+import { f as Computed } from "../children-s3nFjpLA.mjs";
 
 //#region src/integrations/react.d.ts
 /**

package/dist/integrations/react.mjs

@@ -1,6 +1,6 @@
 import { u as effect, x as signal } from "../lib-DYypKhxk.mjs";
 import "../signals/index.mjs";
-import { t as scope } from "../scope-zbEG299F.mjs";
+import { t as scope } from "../scope-C1vELXqP.mjs";
 import { useEffect, useMemo, useRef, useSyncExternalStore } from "react";
 //#region src/integrations/react.ts
 /**

package/dist/jsx-runtime/index.d.mts

@@ -1,2 +1,2 @@
-import { G as createElement, _ as Require, a as ComponentInstance, b as MaybeReactive, c as JSX, d as ComponentProps, f as ElementProps, g as ReactiveProps, h as RawProps, i as ComponentFn, l as SlotProps, m as Props, n as Component, o as PropsTarget, p as MaybeReactiveProps, r as ComponentClass, s as Attrs, t as Child, u as Fragment, v as ResolveProps } from "../types-ncUK9rki.mjs";
-export { Attrs, type Child, type Component, type ComponentClass, type ComponentFn, type ComponentInstance, type ComponentProps, type ElementProps, Fragment, JSX, type MaybeReactive, type MaybeReactiveProps, type Props, type PropsTarget, type RawProps, type ReactiveProps, type Require, type ResolveProps, SlotProps, createElement as h, createElement as jsx, createElement as jsxDEV, createElement as jsxs };
+import { a as Fragment, c as Props, d as Require, i as JSX, l as PropsOf, n as ComponentClass, o as createElement, p as MaybeReactive, r as ComponentFn, s as MaybeReactiveProps, t as Children, u as RawProps } from "../children-s3nFjpLA.mjs";
+export { type Children, ComponentClass, ComponentFn, Fragment, JSX, type MaybeReactive, type MaybeReactiveProps, type Props, type PropsOf, type RawProps, type Require, createElement as h, createElement as jsx, createElement as jsxDEV, createElement as jsxs };

package/dist/jsx-runtime/index.mjs

@@ -1,3 +1,3 @@
-import { t as createElement } from "../element-D3om9yA6.mjs";
-import { t as Fragment } from "../fragment-ROPRBJQd.mjs";
+import { t as createElement } from "../element-Di0PYFX1.mjs";
+import { t as Fragment } from "../fragment-Bvs1sGu1.mjs";
 export { Fragment, createElement as h, createElement as jsx, createElement as jsxDEV, createElement as jsxs };

package/dist/polyfill-BVNd6ogU.d.mts

@@ -0,0 +1,9 @@
+//#region src/polyfill.d.ts
+declare global {
+  interface SymbolConstructor {
+    readonly dispose: symbol;
+  }
+  interface Disposable {
+    [Symbol.dispose](): void;
+  }
+}

package/dist/render.mjs

@@ -1,4 +1,4 @@
-import { t as scope } from "./scope-zbEG299F.mjs";
+import { t as scope } from "./scope-C1vELXqP.mjs";
 //#region src/render.ts
 /**
 * Mount a node into `target` with a scoped lifetime.

package/dist/server/index.mjs

@@ -1,2 +1,2 @@
-import { n as renderToString, t as renderToStream } from "../server-iFSng50i.mjs";
+import { n as renderToString, t as renderToStream } from "../server-CTkyXTV6.mjs";
 export { renderToStream, renderToString };

package/dist/{server-iFSng50i.mjs → server-CTkyXTV6.mjs}

@@ -2,9 +2,9 @@ import { C as untracked, y as setInertEffects } from "./lib-DYypKhxk.mjs";
 import { isReactive, resolveProps } from "./signals/index.mjs";
 import { isReactivePromiseLike } from "./utilities/promise.mjs";
 import { isAsyncLike } from "./utilities/async.mjs";
-import { c as BooleanAttributes, l as ChildProperties, r as setRenderer, s as AttrAliases, u as Properties } from "./element-D3om9yA6.mjs";
+import { c as BooleanAttributes, l as ChildProperties, r as setRenderer, s as AttrAliases, u as Properties } from "./element-Di0PYFX1.mjs";
 import { isForComponent } from "./for.mjs";
-import { n as isFragmentComponent } from "./fragment-ROPRBJQd.mjs";
+import { n as isFragmentComponent } from "./fragment-Bvs1sGu1.mjs";
 //#region src/server/escape.ts
 function escapeDelim(s, delim, escDelim) {
 	let iDelim = s.indexOf(delim);

package/dist/signals/index.d.mts

@@ -1,2 +1,2 @@
-import { A as EFFECT_SCOPE, B as isSignal, C as isReactive, D as CLAIM, E as resolveProps, F as effect, H as signal, I as effectScope, L as isComputed, M as SIGNAL, N as batch, O as COMPUTED, P as computed, R as isEffect, S as Updater, T as resolve, U as trigger, V as onCleanup, W as untracked, b as MaybeReactive, j as SEED, k as EFFECT, w as reactive, x as Signal, y as Computed, z as isEffectScope } from "../types-ncUK9rki.mjs";
+import { A as isComputed, C as EFFECT_SCOPE, D as computed, E as batch, F as signal, I as trigger, L as untracked, M as isEffectScope, N as isSignal, O as effect, P as onCleanup, S as EFFECT, T as SIGNAL, _ as reactive, b as CLAIM, f as Computed, g as isReactive, h as Updater, j as isEffect, k as effectScope, m as Signal, p as MaybeReactive, v as resolve, w as SEED, x as COMPUTED, y as resolveProps } from "../children-s3nFjpLA.mjs";
 export { CLAIM, COMPUTED, Computed, EFFECT, EFFECT_SCOPE, MaybeReactive, SEED, SIGNAL, Signal, Updater, batch, computed, effect, effectScope, isComputed, isEffect, isEffectScope, isReactive, isSignal, onCleanup, reactive, resolve, resolveProps, signal, trigger, untracked };

package/dist/slot.d.mts

@@ -1,2 +1,83 @@
-import { n as Slot, t as SLOTS } from "./slot-BFWXeFRl.mjs";
-export { SLOTS, Slot };
+//#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 <header>{this.header}</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(): <This extends object, V extends SlotContent | null>(_target: unknown, context: ClassFieldDecoratorContext<This, V>) => (this: This, initialValue: V) => V;
+//#endregion
+export { Slot, SlotContent, slot };