@fictjs/runtime 0.0.3 → 0.0.5

package/dist/index.d.cts

@@ -9,12 +9,22 @@ interface SignalAccessor<T> {
  * Computed accessor - function to get computed value
  */
 type ComputedAccessor<T> = () => T;
+/**
+ * Effect scope disposer - function to dispose an effect scope
+ */
+type EffectScopeDisposer = () => void;
 /**
  * Create a reactive signal
  * @param initialValue - The initial value
  * @returns A signal accessor function
  */
 declare function signal<T>(initialValue: T): SignalAccessor<T>;
+/**
+ * Create a reactive effect scope
+ * @param fn - The scope function
+ * @returns An effect scope disposer function
+ */
+declare function effectScope(fn: () => void): EffectScopeDisposer;
 declare const $state: <T>(value: T) => T;
 /**
  * Create a selector signal that efficiently updates only when the selected key matches.
@@ -106,468 +116,787 @@ declare function createEffect(fn: Effect): () => void;
 declare const $effect: typeof createEffect;
 declare function createRenderEffect(fn: Effect): () => void;
 
-interface HookContext {
-    slots: unknown[];
-    cursor: number;
-}
-declare function __fictUseContext(): HookContext;
-declare function __fictPushContext(): HookContext;
-declare function __fictPopContext(): void;
-declare function __fictResetContext(): void;
-declare function __fictUseSignal<T>(ctx: HookContext, initial: T, slot?: number): SignalAccessor<T>;
-declare function __fictUseMemo<T>(ctx: HookContext, fn: () => T, slot?: number): ComputedAccessor<T>;
-declare function __fictUseEffect(ctx: HookContext, fn: () => void, slot?: number): void;
-declare function __fictRender<T>(ctx: HookContext, fn: () => T): T;
-
-interface VersionedSignalOptions<T> {
-    equals?: (prev: T, next: T) => boolean;
-}
-interface VersionedSignal<T> {
-    /** Reactive read that tracks both the value and version counter */
-    read: () => T;
-    /** Write a new value, forcing a version bump when value is equal */
-    write: (next: T) => void;
-    /** Force a version bump without changing the value */
-    force: () => void;
-    /** Read the current version without creating a dependency */
-    peekVersion: () => number;
-    /** Read the current value without tracking */
-    peekValue: () => T;
-}
 /**
- * Create a signal wrapper that forces subscribers to update when the same reference is written.
+ * Fict Reactive DOM Binding System
  *
- * Useful for compiler-generated keyed list items where updates may reuse the same object reference.
+ * This module provides the core mechanisms for reactive DOM updates.
+ * It bridges the gap between Fict's reactive system (signals, effects)
+ * and the DOM, enabling fine-grained updates without a virtual DOM.
+ *
+ * Design Philosophy:
+ * - Values wrapped in functions `() => T` are treated as reactive
+ * - Static values are applied once without tracking
+ * - The compiler transforms JSX expressions to use these primitives
  */
-declare function createVersionedSignal<T>(initialValue: T, options?: VersionedSignalOptions<T>): VersionedSignal<T>;
 
+/** A reactive value that can be either static or a getter function */
+type MaybeReactive<T> = T | (() => T);
+/** Internal type for createElement function reference */
+type CreateElementFn = (node: FictNode) => Node;
+/** Handle returned by conditional/list bindings for cleanup */
+interface BindingHandle {
+    /** Marker node(s) used for positioning */
+    marker: Comment | DocumentFragment;
+    /** Flush pending content - call after markers are inserted into DOM */
+    flush?: () => void;
+    /** Dispose function to clean up the binding */
+    dispose: Cleanup;
+}
 /**
- * @internal
- * Marks a zero-arg getter so props proxy can lazily evaluate it.
- * Users normally never call this directly; the compiler injects it.
+ * Check if a value is reactive (a getter function)
+ * Note: Event handlers (functions that take arguments) are NOT reactive values
  */
-declare function __fictProp<T>(getter: () => T): () => T;
-declare function createPropsProxy<T extends Record<string, unknown>>(props: T): T;
+declare function isReactive(value: unknown): value is () => unknown;
 /**
- * Create a rest-like props object while preserving prop getters.
- * Excludes the specified keys from the returned object.
+ * Unwrap a potentially reactive value to get the actual value
  */
-declare function __fictPropsRest<T extends Record<string, unknown>>(props: T, exclude: (string | number | symbol)[]): Record<string, unknown>;
+declare function unwrap<T>(value: MaybeReactive<T>): T;
 /**
- * Merge multiple props-like objects while preserving lazy getters.
- * Later sources override earlier ones.
- *
- * Uses lazy lookup strategy - properties are only accessed when read,
- * avoiding upfront iteration of all keys.
+ * Invoke an event handler or handler accessor in a safe way.
+ * Supports handlers that return another handler and handlers that expect an
+ * optional data payload followed by the event.
  */
-type MergeSource<T extends Record<string, unknown>> = T | (() => T);
-declare function mergeProps<T extends Record<string, unknown>>(...sources: (MergeSource<T> | null | undefined)[]): Record<string, unknown>;
-type PropGetter<T> = (() => T) & {
-    __fictProp: true;
-};
+declare function callEventHandler(handler: EventListenerOrEventListenerObject | null | undefined, event: Event, node?: EventTarget | null, data?: unknown): void;
 /**
- * Memoize a prop getter to cache expensive computations.
- * Use when prop expressions involve heavy calculations.
+ * Unwrap a primitive proxy value to get the raw primitive value.
+ * This is primarily useful for advanced scenarios where you need the actual
+ * primitive type (e.g., for typeof checks or strict equality comparisons).
  *
- * @example
- * ```tsx
- * // Without useProp - recomputes on every access
- * <Child data={expensiveComputation(list, filter)} />
+ * @param value - A potentially proxied primitive value
+ * @returns The raw primitive value
  *
- * // With useProp - cached until dependencies change, auto-unwrapped by props proxy
- * const memoizedData = useProp(() => expensiveComputation(list, filter))
- * <Child data={memoizedData} />
+ * @example
+ * ```ts
+ * createList(
+ *   () => [1, 2, 3],
+ *   (item) => {
+ *     const raw = unwrapPrimitive(item)
+ *     typeof raw === 'number'  // true
+ *     raw === 1  // true (for first item)
+ *   },
+ *   item => item
+ * )
  * ```
  */
-declare function useProp<T>(getter: () => T): PropGetter<T>;
-
-type LifecycleFn = () => void | Cleanup;
-interface RootContext {
-    parent?: RootContext | undefined;
-    onMountCallbacks?: LifecycleFn[];
-    cleanups: Cleanup[];
-    destroyCallbacks: Cleanup[];
-    errorHandlers?: ErrorHandler[];
-    suspenseHandlers?: SuspenseHandler[];
-}
-type ErrorHandler = (err: unknown, info?: ErrorInfo) => boolean | void;
-type SuspenseHandler = (token: SuspenseToken | PromiseLike<unknown>) => boolean | void;
-declare function onMount(fn: LifecycleFn): void;
-declare function onDestroy(fn: LifecycleFn): void;
-declare function onCleanup(fn: Cleanup): void;
-declare function createRoot<T>(fn: () => T): {
-    dispose: () => void;
-    value: T;
-};
-
+declare function unwrapPrimitive<T>(value: T): T;
 /**
- * Create a ref object for DOM element references.
- *
- * @returns A ref object with a `current` property initialized to `null`
+ * Create a text node that reactively updates when the value changes.
  *
  * @example
- * ```tsx
- * import { createRef } from 'fict'
- *
- * function Component() {
- *   const inputRef = createRef<HTMLInputElement>()
- *
- *   $effect(() => {
- *     inputRef.current?.focus()
- *   })
+ * ```ts
+ * // Static text
+ * createTextBinding("Hello")
  *
- *   return <input ref={inputRef} />
- * }
+ * // Reactive text (compiler output)
+ * createTextBinding(() => $count())
  * ```
  */
-declare function createRef<T extends HTMLElement = HTMLElement>(): RefObject<T>;
-
+declare function createTextBinding(value: MaybeReactive<unknown>): Text;
 /**
- * Execute a function with low-priority scheduling.
- * Updates triggered inside the callback will be processed after any high-priority updates.
- * This keeps the UI responsive during expensive operations.
- *
- * @param fn - The function to execute in transition context
- *
- * @example
- * ```tsx
- * const handleInput = (e) => {
- *   query = e.target.value  // High priority: immediate
- *   startTransition(() => {
- *     // Low priority: processed after high priority updates
- *     filteredItems = allItems.filter(x => x.includes(query))
- *   })
- * }
- * ```
+ * Bind a reactive value to an existing text node.
+ * This is a convenience function for binding to existing DOM nodes.
  */
-declare function startTransition(fn: () => void): void;
+declare function bindText(textNode: Text, getValue: () => unknown): Cleanup;
+/** Attribute setter function type */
+type AttributeSetter = (el: HTMLElement, key: string, value: unknown) => void;
 /**
- * React-style useTransition hook.
- * Returns a pending signal and a startTransition function.
- *
- * @returns A tuple of [isPending accessor, startTransition function]
+ * Create a reactive attribute binding on an element.
  *
  * @example
- * ```tsx
- * function SearchComponent() {
- *   let query = $state('')
- *   const [isPending, start] = useTransition()
- *
- *   const handleChange = (e) => {
- *     query = e.target.value
- *     start(() => {
- *       // Expensive filtering happens in low priority
- *       filteredResults = expensiveFilter(allData, query)
- *     })
- *   }
+ * ```ts
+ * // Static attribute
+ * createAttributeBinding(button, 'disabled', false, setAttribute)
  *
- *   return (
- *     <>
- *       <input value={query} onInput={handleChange} />
- *       {isPending() && <Spinner />}
- *       <Results items={filteredResults} />
- *     </>
- *   )
- * }
+ * // Reactive attribute (compiler output)
+ * createAttributeBinding(button, 'disabled', () => !$isValid(), setAttribute)
  * ```
  */
-declare function useTransition(): [() => boolean, (fn: () => void) => void];
+declare function createAttributeBinding(el: HTMLElement, key: string, value: MaybeReactive<unknown>, setter: AttributeSetter): void;
 /**
- * Creates a deferred version of a value that updates with low priority.
- * The returned accessor will lag behind the source value during rapid updates,
- * allowing high-priority work to complete first.
+ * Bind a reactive value to an element's attribute.
+ */
+declare function bindAttribute(el: HTMLElement, key: string, getValue: () => unknown): Cleanup;
+/**
+ * Bind a reactive value to an element's property.
+ */
+declare function bindProperty(el: HTMLElement, key: string, getValue: () => unknown): Cleanup;
+/**
+ * Apply styles to an element, supporting reactive style objects/strings.
+ */
+declare function createStyleBinding(el: HTMLElement, value: MaybeReactive<string | Record<string, string | number> | null | undefined>): void;
+/**
+ * Bind a reactive style value to an existing element.
+ */
+declare function bindStyle(el: HTMLElement, getValue: () => string | Record<string, string | number> | null | undefined): Cleanup;
+/**
+ * Apply class to an element, supporting reactive class values.
+ */
+declare function createClassBinding(el: HTMLElement, value: MaybeReactive<string | Record<string, boolean> | null | undefined>): void;
+/**
+ * Bind a reactive class value to an existing element.
+ */
+declare function bindClass(el: HTMLElement, getValue: () => string | Record<string, boolean> | null | undefined): Cleanup;
+/**
+ * Exported classList function for direct use (compatible with dom-expressions)
+ */
+declare function classList(node: HTMLElement, value: Record<string, boolean> | null | undefined, prev?: Record<string, boolean>): Record<string, boolean>;
+/**
+ * Insert reactive content into a parent element.
+ * This is a simpler API than createChildBinding for basic cases.
  *
- * @param getValue - Accessor function that returns the source value
- * @returns Accessor function that returns the deferred value
+ * @param parent - The parent element to insert into
+ * @param getValue - Function that returns the value to render
+ * @param markerOrCreateElement - Optional marker node to insert before, or createElementFn
+ * @param createElementFn - Optional function to create DOM elements (when marker is provided)
+ */
+declare function insert(parent: HTMLElement | DocumentFragment, getValue: () => FictNode, markerOrCreateElement?: Node | CreateElementFn, createElementFn?: CreateElementFn): Cleanup;
+/**
+ * Create a reactive child binding that updates when the child value changes.
+ * This is used for dynamic expressions like `{show && <Modal />}` or `{items.map(...)}`.
  *
  * @example
- * ```tsx
- * function SearchResults({ query }) {
- *   const deferredQuery = useDeferredValue(() => query)
+ * ```ts
+ * // Reactive child (compiler output for {count})
+ * createChildBinding(parent, () => $count(), createElement)
  *
- *   // deferredQuery lags behind query during rapid typing
- *   const results = expensiveSearch(deferredQuery())
+ * // Reactive conditional (compiler output for {show && <Modal />})
+ * createChildBinding(parent, () => $show() && jsx(Modal, {}), createElement)
+ * ```
+ */
+declare function createChildBinding(parent: HTMLElement | DocumentFragment, getValue: () => FictNode, createElementFn: CreateElementFn): BindingHandle;
+declare global {
+    interface HTMLElement {
+        _$host?: HTMLElement;
+        [key: `$$${string}`]: EventListener | [EventListener, unknown] | undefined;
+        [key: `$$${string}Data`]: unknown;
+    }
+    interface Document extends Record<string, unknown> {
+    }
+}
+/**
+ * Initialize event delegation for a set of event names.
+ * Events will be handled at the document level and dispatched to the appropriate handlers.
  *
- *   return <ResultList items={results} />
- * }
+ * @param eventNames - Array of event names to delegate
+ * @param doc - The document to attach handlers to (default: window.document)
+ *
+ * @example
+ * ```ts
+ * // Called automatically by the compiler for delegated events
+ * delegateEvents(['click', 'input', 'keydown'])
  * ```
  */
-declare function useDeferredValue<T>(getValue: () => T): () => T;
+declare function delegateEvents(eventNames: string[], doc?: Document): void;
+/**
+ * Clear all delegated event handlers from a document.
+ *
+ * @param doc - The document to clear handlers from (default: window.document)
+ */
+declare function clearDelegatedEvents(doc?: Document): void;
+/**
+ * Add an event listener to an element.
+ * If the event is in DelegatedEvents, it uses event delegation for better performance.
+ *
+ * @param node - The element to add the listener to
+ * @param name - The event name (lowercase)
+ * @param handler - The event handler or [handler, data] tuple
+ * @param delegate - Whether to use delegation (auto-detected based on event name)
+ */
+declare function addEventListener(node: HTMLElement, name: string, handler: EventListener | [EventListener, unknown] | null | undefined, delegate?: boolean): void;
+/**
+ * Bind an event listener to an element.
+ * Uses event delegation for better performance when applicable.
+ *
+ * @example
+ * ```ts
+ * // Static event
+ * bindEvent(button, 'click', handleClick)
+ *
+ * // Reactive event (compiler output)
+ * bindEvent(button, 'click', () => $handler())
+ *
+ * // With modifiers
+ * bindEvent(button, 'click', handler, { capture: true, passive: true, once: true })
+ * ```
+ */
+declare function bindEvent(el: HTMLElement, eventName: string, handler: EventListenerOrEventListenerObject | null | undefined, options?: boolean | AddEventListenerOptions): Cleanup;
+/**
+ * Bind a ref to an element.
+ * Supports both callback refs and ref objects.
+ *
+ * @param el - The element to bind the ref to
+ * @param ref - Either a callback function, a ref object, or a reactive getter
+ * @returns Cleanup function
+ *
+ * @example
+ * ```ts
+ * // Callback ref
+ * bindRef(el, (element) => { store.input = element })
+ *
+ * // Ref object
+ * const inputRef = createRef()
+ * bindRef(el, inputRef)
+ *
+ * // Reactive ref (compiler output)
+ * bindRef(el, () => props.ref)
+ * ```
+ */
+declare function bindRef(el: HTMLElement, ref: unknown): Cleanup;
+/**
+ * Apply spread props to an element with reactive updates.
+ * This handles dynamic spread like `<div {...props}>`.
+ *
+ * @param node - The element to apply props to
+ * @param props - The props object (may have reactive getters)
+ * @param isSVG - Whether this is an SVG element
+ * @param skipChildren - Whether to skip children handling
+ * @returns The previous props for tracking changes
+ *
+ * @example
+ * ```ts
+ * // Compiler output for <div {...props} />
+ * spread(el, props, false, false)
+ * ```
+ */
+declare function spread(node: HTMLElement, props?: Record<string, unknown>, isSVG?: boolean, skipChildren?: boolean): Record<string, unknown>;
+/**
+ * Assign props to a node, tracking previous values for efficient updates.
+ * This is the core prop assignment logic used by spread.
+ *
+ * @param node - The element to assign props to
+ * @param props - New props object
+ * @param isSVG - Whether this is an SVG element
+ * @param skipChildren - Whether to skip children handling
+ * @param prevProps - Previous props for comparison
+ * @param skipRef - Whether to skip ref handling
+ */
+declare function assign(node: HTMLElement, props: Record<string, unknown>, isSVG?: boolean, skipChildren?: boolean, prevProps?: Record<string, unknown>, skipRef?: boolean): void;
+/**
+ * Create a conditional rendering binding.
+ * Efficiently renders one of two branches based on a condition.
+ *
+ * This is an optimized version for `{condition ? <A /> : <B />}` patterns
+ * where both branches are known statically.
+ *
+ * @example
+ * ```ts
+ * // Compiler output for {show ? <A /> : <B />}
+ * createConditional(
+ *   () => $show(),
+ *   () => jsx(A, {}),
+ *   () => jsx(B, {}),
+ *   createElement
+ * )
+ * ```
+ */
+declare function createConditional(condition: () => boolean, renderTrue: () => FictNode, createElementFn: CreateElementFn, renderFalse?: () => FictNode): BindingHandle;
+/** Key extractor function type */
+type KeyFn<T> = (item: T, index: number) => string | number;
+/**
+ * Create a reactive list rendering binding with optional keying.
+ */
+declare function createList<T>(items: () => T[], renderItem: (item: T, index: number) => FictNode, createElementFn: CreateElementFn, getKey?: KeyFn<T>): BindingHandle;
+/**
+ * Create a show/hide binding that uses CSS display instead of DOM manipulation.
+ * More efficient than conditional when the content is expensive to create.
+ *
+ * @example
+ * ```ts
+ * createShow(container, () => $visible())
+ * ```
+ */
+declare function createShow(el: HTMLElement, condition: () => boolean, displayValue?: string): void;
+/**
+ * Create a portal that renders content into a different DOM container.
+ *
+ * @example
+ * ```ts
+ * createPortal(
+ *   document.body,
+ *   () => jsx(Modal, { children: 'Hello' }),
+ *   createElement
+ * )
+ * ```
+ */
+declare function createPortal(container: HTMLElement, render: () => FictNode, createElementFn: CreateElementFn): BindingHandle;
 
-declare function batch<T>(fn: () => T): T;
-declare function untrack<T>(fn: () => T): T;
+interface ReactiveScope {
+    run<T>(fn: () => T): T;
+    stop(): void;
+}
+/**
+ * Create an explicit reactive scope that can contain effects/memos and be stopped manually.
+ * The scope registers with the current root for cleanup.
+ */
+declare function createScope(): ReactiveScope;
+/**
+ * Run a block of reactive code inside a managed scope that follows a boolean flag.
+ * When the flag turns false, the scope is disposed and all contained effects/memos are cleaned up.
+ */
+declare function runInScope(flag: MaybeReactive<boolean>, fn: () => void): void;
 
-interface CycleProtectionOptions {
-    maxFlushCyclesPerMicrotask?: number;
-    maxEffectRunsPerFlush?: number;
-    windowSize?: number;
-    highUsageRatio?: number;
-    maxRootReentrantDepth?: number;
-    enableWindowWarning?: boolean;
-    devMode?: boolean;
+interface HookContext {
+    slots: unknown[];
+    cursor: number;
 }
-declare function setCycleProtectionOptions(opts: CycleProtectionOptions): void;
+declare function __fictUseContext(): HookContext;
+declare function __fictPushContext(): HookContext;
+declare function __fictPopContext(): void;
+declare function __fictResetContext(): void;
+declare function __fictUseSignal<T>(ctx: HookContext, initial: T, slot?: number): SignalAccessor<T>;
+declare function __fictUseMemo<T>(ctx: HookContext, fn: () => T, slot?: number): ComputedAccessor<T>;
+declare function __fictUseEffect(ctx: HookContext, fn: () => void, slot?: number): void;
+declare function __fictRender<T>(ctx: HookContext, fn: () => T): T;
 
-declare const Fragment: unique symbol;
-declare namespace JSX {
-    type Element = FictNode;
-    interface IntrinsicElements {
-        html: HTMLAttributes<HTMLHtmlElement>;
-        head: HTMLAttributes<HTMLHeadElement>;
-        body: HTMLAttributes<HTMLBodyElement>;
-        title: HTMLAttributes<HTMLTitleElement>;
-        meta: MetaHTMLAttributes<HTMLMetaElement>;
-        link: LinkHTMLAttributes<HTMLLinkElement>;
-        style: StyleHTMLAttributes<HTMLStyleElement>;
-        script: ScriptHTMLAttributes<HTMLScriptElement>;
-        noscript: HTMLAttributes<HTMLElement>;
-        div: HTMLAttributes<HTMLDivElement>;
-        span: HTMLAttributes<HTMLSpanElement>;
-        main: HTMLAttributes<HTMLElement>;
-        header: HTMLAttributes<HTMLElement>;
-        footer: HTMLAttributes<HTMLElement>;
-        section: HTMLAttributes<HTMLElement>;
-        article: HTMLAttributes<HTMLElement>;
-        aside: HTMLAttributes<HTMLElement>;
-        nav: HTMLAttributes<HTMLElement>;
-        address: HTMLAttributes<HTMLElement>;
-        h1: HTMLAttributes<HTMLHeadingElement>;
-        h2: HTMLAttributes<HTMLHeadingElement>;
-        h3: HTMLAttributes<HTMLHeadingElement>;
-        h4: HTMLAttributes<HTMLHeadingElement>;
-        h5: HTMLAttributes<HTMLHeadingElement>;
-        h6: HTMLAttributes<HTMLHeadingElement>;
-        hgroup: HTMLAttributes<HTMLElement>;
-        p: HTMLAttributes<HTMLParagraphElement>;
-        blockquote: BlockquoteHTMLAttributes<HTMLQuoteElement>;
-        pre: HTMLAttributes<HTMLPreElement>;
-        figure: HTMLAttributes<HTMLElement>;
-        figcaption: HTMLAttributes<HTMLElement>;
-        hr: HTMLAttributes<HTMLHRElement>;
-        br: HTMLAttributes<HTMLBRElement>;
-        wbr: HTMLAttributes<HTMLElement>;
-        a: AnchorHTMLAttributes<HTMLAnchorElement>;
-        abbr: HTMLAttributes<HTMLElement>;
-        b: HTMLAttributes<HTMLElement>;
-        bdi: HTMLAttributes<HTMLElement>;
-        bdo: HTMLAttributes<HTMLElement>;
-        cite: HTMLAttributes<HTMLElement>;
-        code: HTMLAttributes<HTMLElement>;
-        data: DataHTMLAttributes<HTMLDataElement>;
-        dfn: HTMLAttributes<HTMLElement>;
-        em: HTMLAttributes<HTMLElement>;
-        i: HTMLAttributes<HTMLElement>;
-        kbd: HTMLAttributes<HTMLElement>;
-        mark: HTMLAttributes<HTMLElement>;
-        q: QuoteHTMLAttributes<HTMLQuoteElement>;
-        rp: HTMLAttributes<HTMLElement>;
-        rt: HTMLAttributes<HTMLElement>;
-        ruby: HTMLAttributes<HTMLElement>;
-        s: HTMLAttributes<HTMLElement>;
-        samp: HTMLAttributes<HTMLElement>;
-        small: HTMLAttributes<HTMLElement>;
-        strong: HTMLAttributes<HTMLElement>;
-        sub: HTMLAttributes<HTMLElement>;
-        sup: HTMLAttributes<HTMLElement>;
-        time: TimeHTMLAttributes<HTMLTimeElement>;
-        u: HTMLAttributes<HTMLElement>;
-        var: HTMLAttributes<HTMLElement>;
-        ul: HTMLAttributes<HTMLUListElement>;
-        ol: OlHTMLAttributes<HTMLOListElement>;
-        li: LiHTMLAttributes<HTMLLIElement>;
-        dl: HTMLAttributes<HTMLDListElement>;
-        dt: HTMLAttributes<HTMLElement>;
-        dd: HTMLAttributes<HTMLElement>;
-        menu: HTMLAttributes<HTMLMenuElement>;
-        table: TableHTMLAttributes<HTMLTableElement>;
-        caption: HTMLAttributes<HTMLTableCaptionElement>;
-        colgroup: ColgroupHTMLAttributes<HTMLTableColElement>;
-        col: ColHTMLAttributes<HTMLTableColElement>;
-        thead: HTMLAttributes<HTMLTableSectionElement>;
-        tbody: HTMLAttributes<HTMLTableSectionElement>;
-        tfoot: HTMLAttributes<HTMLTableSectionElement>;
-        tr: HTMLAttributes<HTMLTableRowElement>;
-        th: ThHTMLAttributes<HTMLTableCellElement>;
-        td: TdHTMLAttributes<HTMLTableCellElement>;
-        form: FormHTMLAttributes<HTMLFormElement>;
-        fieldset: FieldsetHTMLAttributes<HTMLFieldSetElement>;
-        legend: HTMLAttributes<HTMLLegendElement>;
-        label: LabelHTMLAttributes<HTMLLabelElement>;
-        input: InputHTMLAttributes<HTMLInputElement>;
-        button: ButtonHTMLAttributes<HTMLButtonElement>;
-        select: SelectHTMLAttributes<HTMLSelectElement>;
-        datalist: HTMLAttributes<HTMLDataListElement>;
-        optgroup: OptgroupHTMLAttributes<HTMLOptGroupElement>;
-        option: OptionHTMLAttributes<HTMLOptionElement>;
-        textarea: TextareaHTMLAttributes<HTMLTextAreaElement>;
-        output: OutputHTMLAttributes<HTMLOutputElement>;
-        progress: ProgressHTMLAttributes<HTMLProgressElement>;
-        meter: MeterHTMLAttributes<HTMLMeterElement>;
-        details: DetailsHTMLAttributes<HTMLDetailsElement>;
-        summary: HTMLAttributes<HTMLElement>;
-        dialog: DialogHTMLAttributes<HTMLDialogElement>;
-        img: ImgHTMLAttributes<HTMLImageElement>;
-        picture: HTMLAttributes<HTMLPictureElement>;
-        source: SourceHTMLAttributes<HTMLSourceElement>;
-        audio: AudioVideoHTMLAttributes<HTMLAudioElement>;
-        video: AudioVideoHTMLAttributes<HTMLVideoElement>;
-        track: TrackHTMLAttributes<HTMLTrackElement>;
-        map: MapHTMLAttributes<HTMLMapElement>;
-        area: AreaHTMLAttributes<HTMLAreaElement>;
-        iframe: IframeHTMLAttributes<HTMLIFrameElement>;
-        embed: EmbedHTMLAttributes<HTMLEmbedElement>;
-        object: ObjectHTMLAttributes<HTMLObjectElement>;
-        param: ParamHTMLAttributes<HTMLParamElement>;
-        canvas: CanvasHTMLAttributes<HTMLCanvasElement>;
-        svg: SVGAttributes<SVGSVGElement>;
-        path: SVGAttributes<SVGPathElement>;
-        circle: SVGAttributes<SVGCircleElement>;
-        rect: SVGAttributes<SVGRectElement>;
-        line: SVGAttributes<SVGLineElement>;
-        polyline: SVGAttributes<SVGPolylineElement>;
-        polygon: SVGAttributes<SVGPolygonElement>;
-        ellipse: SVGAttributes<SVGEllipseElement>;
-        g: SVGAttributes<SVGGElement>;
-        defs: SVGAttributes<SVGDefsElement>;
-        use: SVGAttributes<SVGUseElement>;
-        text: SVGAttributes<SVGTextElement>;
-        tspan: SVGAttributes<SVGTSpanElement>;
-        template: HTMLAttributes<HTMLTemplateElement>;
-        slot: SlotHTMLAttributes<HTMLSlotElement>;
-        portal: HTMLAttributes<HTMLElement>;
-    }
-    interface ElementChildrenAttribute {
-        children: unknown;
-    }
+interface VersionedSignalOptions<T> {
+    equals?: (prev: T, next: T) => boolean;
 }
-interface HTMLAttributes<T> {
-    children?: FictNode | FictNode[];
-    key?: string | number;
-    id?: string;
-    class?: string;
-    style?: string | Record<string, string | number>;
-    title?: string;
-    lang?: string;
-    dir?: 'ltr' | 'rtl' | 'auto';
-    hidden?: boolean | 'hidden' | 'until-found';
-    tabIndex?: number;
-    draggable?: boolean | 'true' | 'false';
-    contentEditable?: boolean | 'true' | 'false' | 'inherit';
-    spellCheck?: boolean | 'true' | 'false';
-    translate?: 'yes' | 'no';
-    inert?: boolean;
-    popover?: 'auto' | 'manual';
-    autofocus?: boolean;
-    slot?: string;
-    accessKey?: string;
-    onClick?: (e: MouseEvent) => void;
-    onDblClick?: (e: MouseEvent) => void;
-    onMouseDown?: (e: MouseEvent) => void;
-    onMouseUp?: (e: MouseEvent) => void;
-    onMouseMove?: (e: MouseEvent) => void;
-    onMouseEnter?: (e: MouseEvent) => void;
-    onMouseLeave?: (e: MouseEvent) => void;
-    onMouseOver?: (e: MouseEvent) => void;
-    onMouseOut?: (e: MouseEvent) => void;
-    onContextMenu?: (e: MouseEvent) => void;
-    onInput?: (e: InputEvent) => void;
-    onChange?: (e: Event) => void;
-    onSubmit?: (e: SubmitEvent) => void;
-    onReset?: (e: Event) => void;
-    onKeyDown?: (e: KeyboardEvent) => void;
-    onKeyUp?: (e: KeyboardEvent) => void;
-    onKeyPress?: (e: KeyboardEvent) => void;
-    onFocus?: (e: FocusEvent) => void;
-    onBlur?: (e: FocusEvent) => void;
-    onScroll?: (e: Event) => void;
-    onWheel?: (e: WheelEvent) => void;
-    onLoad?: (e: Event) => void;
-    onError?: (e: Event) => void;
-    onDrag?: (e: DragEvent) => void;
-    onDragStart?: (e: DragEvent) => void;
-    onDragEnd?: (e: DragEvent) => void;
-    onDragEnter?: (e: DragEvent) => void;
-    onDragLeave?: (e: DragEvent) => void;
-    onDragOver?: (e: DragEvent) => void;
-    onDrop?: (e: DragEvent) => void;
-    onTouchStart?: (e: TouchEvent) => void;
-    onTouchMove?: (e: TouchEvent) => void;
-    onTouchEnd?: (e: TouchEvent) => void;
-    onTouchCancel?: (e: TouchEvent) => void;
-    onAnimationStart?: (e: AnimationEvent) => void;
-    onAnimationEnd?: (e: AnimationEvent) => void;
-    onAnimationIteration?: (e: AnimationEvent) => void;
-    onTransitionEnd?: (e: TransitionEvent) => void;
-    onPointerDown?: (e: PointerEvent) => void;
-    onPointerUp?: (e: PointerEvent) => void;
-    onPointerMove?: (e: PointerEvent) => void;
-    onPointerEnter?: (e: PointerEvent) => void;
-    onPointerLeave?: (e: PointerEvent) => void;
-    onPointerOver?: (e: PointerEvent) => void;
-    onPointerOut?: (e: PointerEvent) => void;
-    onPointerCancel?: (e: PointerEvent) => void;
-    ref?: ((el: T | null) => void) | {
-        current: T | null;
-    };
-    role?: string;
-    'aria-hidden'?: boolean | 'true' | 'false';
-    'aria-label'?: string;
-    'aria-labelledby'?: string;
-    'aria-describedby'?: string;
-    'aria-live'?: 'off' | 'polite' | 'assertive';
-    'aria-atomic'?: boolean | 'true' | 'false';
-    'aria-busy'?: boolean | 'true' | 'false';
-    'aria-current'?: boolean | 'true' | 'false' | 'page' | 'step' | 'location' | 'date' | 'time';
-    'aria-disabled'?: boolean | 'true' | 'false';
-    'aria-expanded'?: boolean | 'true' | 'false';
-    'aria-haspopup'?: boolean | 'true' | 'false' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog';
-    'aria-pressed'?: boolean | 'true' | 'false' | 'mixed';
-    'aria-selected'?: boolean | 'true' | 'false';
-    'aria-checked'?: boolean | 'true' | 'false' | 'mixed';
-    'aria-controls'?: string;
-    'aria-owns'?: string;
-    'aria-activedescendant'?: string;
-    'aria-valuemin'?: number;
-    'aria-valuemax'?: number;
-    'aria-valuenow'?: number;
-    'aria-valuetext'?: string;
-    'aria-orientation'?: 'horizontal' | 'vertical';
-    'aria-readonly'?: boolean | 'true' | 'false';
-    'aria-required'?: boolean | 'true' | 'false';
-    'aria-invalid'?: boolean | 'true' | 'false' | 'grammar' | 'spelling';
-    'aria-errormessage'?: string;
-    'aria-modal'?: boolean | 'true' | 'false';
-    'aria-placeholder'?: string;
-    'aria-sort'?: 'none' | 'ascending' | 'descending' | 'other';
-    'aria-colcount'?: number;
-    'aria-colindex'?: number;
-    'aria-colspan'?: number;
-    'aria-rowcount'?: number;
-    'aria-rowindex'?: number;
-    'aria-rowspan'?: number;
-    'aria-setsize'?: number;
-    'aria-posinset'?: number;
-    'aria-level'?: number;
-    'aria-multiselectable'?: boolean | 'true' | 'false';
-    'aria-autocomplete'?: 'none' | 'inline' | 'list' | 'both';
-    'aria-details'?: string;
-    'aria-keyshortcuts'?: string;
-    'aria-roledescription'?: string;
-    [key: `data-${string}`]: string | number | boolean | undefined;
+interface VersionedSignal<T> {
+    /** Reactive read that tracks both the value and version counter */
+    read: () => T;
+    /** Write a new value, forcing a version bump when value is equal */
+    write: (next: T) => void;
+    /** Force a version bump without changing the value */
+    force: () => void;
+    /** Read the current version without creating a dependency */
+    peekVersion: () => number;
+    /** Read the current value without tracking */
+    peekValue: () => T;
 }
-interface AnchorHTMLAttributes<T> extends HTMLAttributes<T> {
-    href?: string;
-    target?: '_self' | '_blank' | '_parent' | '_top' | string;
-    rel?: string;
-    download?: boolean | string;
-    hreflang?: string;
-    type?: string;
-    referrerPolicy?: ReferrerPolicy;
-    ping?: string;
+/**
+ * Create a signal wrapper that forces subscribers to update when the same reference is written.
+ *
+ * Useful for compiler-generated keyed list items where updates may reuse the same object reference.
+ */
+declare function createVersionedSignal<T>(initialValue: T, options?: VersionedSignalOptions<T>): VersionedSignal<T>;
+
+/**
+ * @internal
+ * Marks a zero-arg getter so props proxy can lazily evaluate it.
+ * Users normally never call this directly; the compiler injects it.
+ */
+declare function __fictProp<T>(getter: () => T): () => T;
+declare function createPropsProxy<T extends Record<string, unknown>>(props: T): T;
+/**
+ * Create a rest-like props object while preserving prop getters.
+ * Excludes the specified keys from the returned object.
+ */
+declare function __fictPropsRest<T extends Record<string, unknown>>(props: T, exclude: (string | number | symbol)[]): Record<string, unknown>;
+/**
+ * Merge multiple props-like objects while preserving lazy getters.
+ * Later sources override earlier ones.
+ *
+ * Uses lazy lookup strategy - properties are only accessed when read,
+ * avoiding upfront iteration of all keys.
+ */
+type MergeSource<T extends Record<string, unknown>> = T | (() => T);
+declare function mergeProps<T extends Record<string, unknown>>(...sources: (MergeSource<T> | null | undefined)[]): Record<string, unknown>;
+type PropGetter<T> = (() => T) & {
+    __fictProp: true;
+};
+/**
+ * Memoize a prop getter to cache expensive computations.
+ * Use when prop expressions involve heavy calculations.
+ *
+ * @example
+ * ```tsx
+ * // Without useProp - recomputes on every access
+ * <Child data={expensiveComputation(list, filter)} />
+ *
+ * // With useProp - cached until dependencies change, auto-unwrapped by props proxy
+ * const memoizedData = useProp(() => expensiveComputation(list, filter))
+ * <Child data={memoizedData} />
+ * ```
+ */
+declare function useProp<T>(getter: () => T): PropGetter<T>;
+
+type LifecycleFn = () => void | Cleanup;
+interface RootContext {
+    parent?: RootContext | undefined;
+    onMountCallbacks?: LifecycleFn[];
+    cleanups: Cleanup[];
+    destroyCallbacks: Cleanup[];
+    errorHandlers?: ErrorHandler[];
+    suspenseHandlers?: SuspenseHandler[];
 }
-interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
-    type?: 'button' | 'submit' | 'reset';
-    disabled?: boolean;
+type ErrorHandler = (err: unknown, info?: ErrorInfo) => boolean | void;
+type SuspenseHandler = (token: SuspenseToken | PromiseLike<unknown>) => boolean | void;
+declare function onMount(fn: LifecycleFn): void;
+declare function onDestroy(fn: LifecycleFn): void;
+declare function onCleanup(fn: Cleanup): void;
+declare function createRoot<T>(fn: () => T): {
+    dispose: () => void;
+    value: T;
+};
+
+/**
+ * Create a ref object for DOM element references.
+ *
+ * @returns A ref object with a `current` property initialized to `null`
+ *
+ * @example
+ * ```tsx
+ * import { createRef } from 'fict'
+ *
+ * function Component() {
+ *   const inputRef = createRef<HTMLInputElement>()
+ *
+ *   $effect(() => {
+ *     inputRef.current?.focus()
+ *   })
+ *
+ *   return <input ref={inputRef} />
+ * }
+ * ```
+ */
+declare function createRef<T extends HTMLElement = HTMLElement>(): RefObject<T>;
+
+/**
+ * Execute a function with low-priority scheduling.
+ * Updates triggered inside the callback will be processed after any high-priority updates.
+ * This keeps the UI responsive during expensive operations.
+ *
+ * @param fn - The function to execute in transition context
+ *
+ * @example
+ * ```tsx
+ * const handleInput = (e) => {
+ *   query = e.target.value  // High priority: immediate
+ *   startTransition(() => {
+ *     // Low priority: processed after high priority updates
+ *     filteredItems = allItems.filter(x => x.includes(query))
+ *   })
+ * }
+ * ```
+ */
+declare function startTransition(fn: () => void): void;
+/**
+ * React-style useTransition hook.
+ * Returns a pending signal and a startTransition function.
+ *
+ * @returns A tuple of [isPending accessor, startTransition function]
+ *
+ * @example
+ * ```tsx
+ * function SearchComponent() {
+ *   let query = $state('')
+ *   const [isPending, start] = useTransition()
+ *
+ *   const handleChange = (e) => {
+ *     query = e.target.value
+ *     start(() => {
+ *       // Expensive filtering happens in low priority
+ *       filteredResults = expensiveFilter(allData, query)
+ *     })
+ *   }
+ *
+ *   return (
+ *     <>
+ *       <input value={query} onInput={handleChange} />
+ *       {isPending() && <Spinner />}
+ *       <Results items={filteredResults} />
+ *     </>
+ *   )
+ * }
+ * ```
+ */
+declare function useTransition(): [() => boolean, (fn: () => void) => void];
+/**
+ * Creates a deferred version of a value that updates with low priority.
+ * The returned accessor will lag behind the source value during rapid updates,
+ * allowing high-priority work to complete first.
+ *
+ * @param getValue - Accessor function that returns the source value
+ * @returns Accessor function that returns the deferred value
+ *
+ * @example
+ * ```tsx
+ * function SearchResults({ query }) {
+ *   const deferredQuery = useDeferredValue(() => query)
+ *
+ *   // deferredQuery lags behind query during rapid typing
+ *   const results = expensiveSearch(deferredQuery())
+ *
+ *   return <ResultList items={results} />
+ * }
+ * ```
+ */
+declare function useDeferredValue<T>(getValue: () => T): () => T;
+
+declare function batch<T>(fn: () => T): T;
+declare function untrack<T>(fn: () => T): T;
+
+interface CycleProtectionOptions {
+    maxFlushCyclesPerMicrotask?: number;
+    maxEffectRunsPerFlush?: number;
+    windowSize?: number;
+    highUsageRatio?: number;
+    maxRootReentrantDepth?: number;
+    enableWindowWarning?: boolean;
+    devMode?: boolean;
+}
+declare function setCycleProtectionOptions(opts: CycleProtectionOptions): void;
+
+declare const Fragment: unique symbol;
+declare namespace JSX {
+    type Element = FictNode;
+    interface IntrinsicElements {
+        html: HTMLAttributes<HTMLHtmlElement>;
+        head: HTMLAttributes<HTMLHeadElement>;
+        body: HTMLAttributes<HTMLBodyElement>;
+        title: HTMLAttributes<HTMLTitleElement>;
+        meta: MetaHTMLAttributes<HTMLMetaElement>;
+        link: LinkHTMLAttributes<HTMLLinkElement>;
+        style: StyleHTMLAttributes<HTMLStyleElement>;
+        script: ScriptHTMLAttributes<HTMLScriptElement>;
+        noscript: HTMLAttributes<HTMLElement>;
+        div: HTMLAttributes<HTMLDivElement>;
+        span: HTMLAttributes<HTMLSpanElement>;
+        main: HTMLAttributes<HTMLElement>;
+        header: HTMLAttributes<HTMLElement>;
+        footer: HTMLAttributes<HTMLElement>;
+        section: HTMLAttributes<HTMLElement>;
+        article: HTMLAttributes<HTMLElement>;
+        aside: HTMLAttributes<HTMLElement>;
+        nav: HTMLAttributes<HTMLElement>;
+        address: HTMLAttributes<HTMLElement>;
+        h1: HTMLAttributes<HTMLHeadingElement>;
+        h2: HTMLAttributes<HTMLHeadingElement>;
+        h3: HTMLAttributes<HTMLHeadingElement>;
+        h4: HTMLAttributes<HTMLHeadingElement>;
+        h5: HTMLAttributes<HTMLHeadingElement>;
+        h6: HTMLAttributes<HTMLHeadingElement>;
+        hgroup: HTMLAttributes<HTMLElement>;
+        p: HTMLAttributes<HTMLParagraphElement>;
+        blockquote: BlockquoteHTMLAttributes<HTMLQuoteElement>;
+        pre: HTMLAttributes<HTMLPreElement>;
+        figure: HTMLAttributes<HTMLElement>;
+        figcaption: HTMLAttributes<HTMLElement>;
+        hr: HTMLAttributes<HTMLHRElement>;
+        br: HTMLAttributes<HTMLBRElement>;
+        wbr: HTMLAttributes<HTMLElement>;
+        a: AnchorHTMLAttributes<HTMLAnchorElement>;
+        abbr: HTMLAttributes<HTMLElement>;
+        b: HTMLAttributes<HTMLElement>;
+        bdi: HTMLAttributes<HTMLElement>;
+        bdo: HTMLAttributes<HTMLElement>;
+        cite: HTMLAttributes<HTMLElement>;
+        code: HTMLAttributes<HTMLElement>;
+        data: DataHTMLAttributes<HTMLDataElement>;
+        dfn: HTMLAttributes<HTMLElement>;
+        em: HTMLAttributes<HTMLElement>;
+        i: HTMLAttributes<HTMLElement>;
+        kbd: HTMLAttributes<HTMLElement>;
+        mark: HTMLAttributes<HTMLElement>;
+        q: QuoteHTMLAttributes<HTMLQuoteElement>;
+        rp: HTMLAttributes<HTMLElement>;
+        rt: HTMLAttributes<HTMLElement>;
+        ruby: HTMLAttributes<HTMLElement>;
+        s: HTMLAttributes<HTMLElement>;
+        samp: HTMLAttributes<HTMLElement>;
+        small: HTMLAttributes<HTMLElement>;
+        strong: HTMLAttributes<HTMLElement>;
+        sub: HTMLAttributes<HTMLElement>;
+        sup: HTMLAttributes<HTMLElement>;
+        time: TimeHTMLAttributes<HTMLTimeElement>;
+        u: HTMLAttributes<HTMLElement>;
+        var: HTMLAttributes<HTMLElement>;
+        ul: HTMLAttributes<HTMLUListElement>;
+        ol: OlHTMLAttributes<HTMLOListElement>;
+        li: LiHTMLAttributes<HTMLLIElement>;
+        dl: HTMLAttributes<HTMLDListElement>;
+        dt: HTMLAttributes<HTMLElement>;
+        dd: HTMLAttributes<HTMLElement>;
+        menu: HTMLAttributes<HTMLMenuElement>;
+        table: TableHTMLAttributes<HTMLTableElement>;
+        caption: HTMLAttributes<HTMLTableCaptionElement>;
+        colgroup: ColgroupHTMLAttributes<HTMLTableColElement>;
+        col: ColHTMLAttributes<HTMLTableColElement>;
+        thead: HTMLAttributes<HTMLTableSectionElement>;
+        tbody: HTMLAttributes<HTMLTableSectionElement>;
+        tfoot: HTMLAttributes<HTMLTableSectionElement>;
+        tr: HTMLAttributes<HTMLTableRowElement>;
+        th: ThHTMLAttributes<HTMLTableCellElement>;
+        td: TdHTMLAttributes<HTMLTableCellElement>;
+        form: FormHTMLAttributes<HTMLFormElement>;
+        fieldset: FieldsetHTMLAttributes<HTMLFieldSetElement>;
+        legend: HTMLAttributes<HTMLLegendElement>;
+        label: LabelHTMLAttributes<HTMLLabelElement>;
+        input: InputHTMLAttributes<HTMLInputElement>;
+        button: ButtonHTMLAttributes<HTMLButtonElement>;
+        select: SelectHTMLAttributes<HTMLSelectElement>;
+        datalist: HTMLAttributes<HTMLDataListElement>;
+        optgroup: OptgroupHTMLAttributes<HTMLOptGroupElement>;
+        option: OptionHTMLAttributes<HTMLOptionElement>;
+        textarea: TextareaHTMLAttributes<HTMLTextAreaElement>;
+        output: OutputHTMLAttributes<HTMLOutputElement>;
+        progress: ProgressHTMLAttributes<HTMLProgressElement>;
+        meter: MeterHTMLAttributes<HTMLMeterElement>;
+        details: DetailsHTMLAttributes<HTMLDetailsElement>;
+        summary: HTMLAttributes<HTMLElement>;
+        dialog: DialogHTMLAttributes<HTMLDialogElement>;
+        img: ImgHTMLAttributes<HTMLImageElement>;
+        picture: HTMLAttributes<HTMLPictureElement>;
+        source: SourceHTMLAttributes<HTMLSourceElement>;
+        audio: AudioVideoHTMLAttributes<HTMLAudioElement>;
+        video: AudioVideoHTMLAttributes<HTMLVideoElement>;
+        track: TrackHTMLAttributes<HTMLTrackElement>;
+        map: MapHTMLAttributes<HTMLMapElement>;
+        area: AreaHTMLAttributes<HTMLAreaElement>;
+        iframe: IframeHTMLAttributes<HTMLIFrameElement>;
+        embed: EmbedHTMLAttributes<HTMLEmbedElement>;
+        object: ObjectHTMLAttributes<HTMLObjectElement>;
+        param: ParamHTMLAttributes<HTMLParamElement>;
+        canvas: CanvasHTMLAttributes<HTMLCanvasElement>;
+        svg: SVGAttributes<SVGSVGElement>;
+        path: SVGAttributes<SVGPathElement>;
+        circle: SVGAttributes<SVGCircleElement>;
+        rect: SVGAttributes<SVGRectElement>;
+        line: SVGAttributes<SVGLineElement>;
+        polyline: SVGAttributes<SVGPolylineElement>;
+        polygon: SVGAttributes<SVGPolygonElement>;
+        ellipse: SVGAttributes<SVGEllipseElement>;
+        g: SVGAttributes<SVGGElement>;
+        defs: SVGAttributes<SVGDefsElement>;
+        use: SVGAttributes<SVGUseElement>;
+        text: SVGAttributes<SVGTextElement>;
+        tspan: SVGAttributes<SVGTSpanElement>;
+        template: HTMLAttributes<HTMLTemplateElement>;
+        slot: SlotHTMLAttributes<HTMLSlotElement>;
+        portal: HTMLAttributes<HTMLElement>;
+    }
+    interface ElementChildrenAttribute {
+        children: unknown;
+    }
+}
+interface HTMLAttributes<T> {
+    children?: FictNode | FictNode[];
+    key?: string | number;
+    id?: string;
+    class?: string;
+    style?: string | Record<string, string | number>;
+    title?: string;
+    lang?: string;
+    dir?: 'ltr' | 'rtl' | 'auto';
+    hidden?: boolean | 'hidden' | 'until-found';
+    tabIndex?: number;
+    draggable?: boolean | 'true' | 'false';
+    contentEditable?: boolean | 'true' | 'false' | 'inherit';
+    spellCheck?: boolean | 'true' | 'false';
+    translate?: 'yes' | 'no';
+    inert?: boolean;
+    popover?: 'auto' | 'manual';
+    autofocus?: boolean;
+    slot?: string;
+    accessKey?: string;
+    onClick?: (e: MouseEvent) => void;
+    onDblClick?: (e: MouseEvent) => void;
+    onMouseDown?: (e: MouseEvent) => void;
+    onMouseUp?: (e: MouseEvent) => void;
+    onMouseMove?: (e: MouseEvent) => void;
+    onMouseEnter?: (e: MouseEvent) => void;
+    onMouseLeave?: (e: MouseEvent) => void;
+    onMouseOver?: (e: MouseEvent) => void;
+    onMouseOut?: (e: MouseEvent) => void;
+    onContextMenu?: (e: MouseEvent) => void;
+    onInput?: (e: InputEvent) => void;
+    onChange?: (e: Event) => void;
+    onSubmit?: (e: SubmitEvent) => void;
+    onReset?: (e: Event) => void;
+    onKeyDown?: (e: KeyboardEvent) => void;
+    onKeyUp?: (e: KeyboardEvent) => void;
+    onKeyPress?: (e: KeyboardEvent) => void;
+    onFocus?: (e: FocusEvent) => void;
+    onBlur?: (e: FocusEvent) => void;
+    onScroll?: (e: Event) => void;
+    onWheel?: (e: WheelEvent) => void;
+    onLoad?: (e: Event) => void;
+    onError?: (e: Event) => void;
+    onDrag?: (e: DragEvent) => void;
+    onDragStart?: (e: DragEvent) => void;
+    onDragEnd?: (e: DragEvent) => void;
+    onDragEnter?: (e: DragEvent) => void;
+    onDragLeave?: (e: DragEvent) => void;
+    onDragOver?: (e: DragEvent) => void;
+    onDrop?: (e: DragEvent) => void;
+    onTouchStart?: (e: TouchEvent) => void;
+    onTouchMove?: (e: TouchEvent) => void;
+    onTouchEnd?: (e: TouchEvent) => void;
+    onTouchCancel?: (e: TouchEvent) => void;
+    onAnimationStart?: (e: AnimationEvent) => void;
+    onAnimationEnd?: (e: AnimationEvent) => void;
+    onAnimationIteration?: (e: AnimationEvent) => void;
+    onTransitionEnd?: (e: TransitionEvent) => void;
+    onPointerDown?: (e: PointerEvent) => void;
+    onPointerUp?: (e: PointerEvent) => void;
+    onPointerMove?: (e: PointerEvent) => void;
+    onPointerEnter?: (e: PointerEvent) => void;
+    onPointerLeave?: (e: PointerEvent) => void;
+    onPointerOver?: (e: PointerEvent) => void;
+    onPointerOut?: (e: PointerEvent) => void;
+    onPointerCancel?: (e: PointerEvent) => void;
+    ref?: ((el: T | null) => void) | {
+        current: T | null;
+    };
+    role?: string;
+    'aria-hidden'?: boolean | 'true' | 'false';
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
+    'aria-describedby'?: string;
+    'aria-live'?: 'off' | 'polite' | 'assertive';
+    'aria-atomic'?: boolean | 'true' | 'false';
+    'aria-busy'?: boolean | 'true' | 'false';
+    'aria-current'?: boolean | 'true' | 'false' | 'page' | 'step' | 'location' | 'date' | 'time';
+    'aria-disabled'?: boolean | 'true' | 'false';
+    'aria-expanded'?: boolean | 'true' | 'false';
+    'aria-haspopup'?: boolean | 'true' | 'false' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog';
+    'aria-pressed'?: boolean | 'true' | 'false' | 'mixed';
+    'aria-selected'?: boolean | 'true' | 'false';
+    'aria-checked'?: boolean | 'true' | 'false' | 'mixed';
+    'aria-controls'?: string;
+    'aria-owns'?: string;
+    'aria-activedescendant'?: string;
+    'aria-valuemin'?: number;
+    'aria-valuemax'?: number;
+    'aria-valuenow'?: number;
+    'aria-valuetext'?: string;
+    'aria-orientation'?: 'horizontal' | 'vertical';
+    'aria-readonly'?: boolean | 'true' | 'false';
+    'aria-required'?: boolean | 'true' | 'false';
+    'aria-invalid'?: boolean | 'true' | 'false' | 'grammar' | 'spelling';
+    'aria-errormessage'?: string;
+    'aria-modal'?: boolean | 'true' | 'false';
+    'aria-placeholder'?: string;
+    'aria-sort'?: 'none' | 'ascending' | 'descending' | 'other';
+    'aria-colcount'?: number;
+    'aria-colindex'?: number;
+    'aria-colspan'?: number;
+    'aria-rowcount'?: number;
+    'aria-rowindex'?: number;
+    'aria-rowspan'?: number;
+    'aria-setsize'?: number;
+    'aria-posinset'?: number;
+    'aria-level'?: number;
+    'aria-multiselectable'?: boolean | 'true' | 'false';
+    'aria-autocomplete'?: 'none' | 'inline' | 'list' | 'both';
+    'aria-details'?: string;
+    'aria-keyshortcuts'?: string;
+    'aria-roledescription'?: string;
+    [key: `data-${string}`]: string | number | boolean | undefined;
+}
+interface AnchorHTMLAttributes<T> extends HTMLAttributes<T> {
+    href?: string;
+    target?: '_self' | '_blank' | '_parent' | '_top' | string;
+    rel?: string;
+    download?: boolean | string;
+    hreflang?: string;
+    type?: string;
+    referrerPolicy?: ReferrerPolicy;
+    ping?: string;
+}
+interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
+    type?: 'button' | 'submit' | 'reset';
+    disabled?: boolean;
     name?: string;
     value?: string;
     form?: string;
@@ -809,454 +1138,156 @@ interface ObjectHTMLAttributes<T> extends HTMLAttributes<T> {
     type?: string;
     name?: string;
     width?: number | string;
-    height?: number | string;
-    form?: string;
-    useMap?: string;
-}
-interface ParamHTMLAttributes<T> extends HTMLAttributes<T> {
-    name?: string;
-    value?: string;
-}
-interface CanvasHTMLAttributes<T> extends HTMLAttributes<T> {
-    width?: number | string;
-    height?: number | string;
-}
-interface MapHTMLAttributes<T> extends HTMLAttributes<T> {
-    name?: string;
-}
-interface AreaHTMLAttributes<T> extends HTMLAttributes<T> {
-    alt?: string;
-    coords?: string;
-    href?: string;
-    hreflang?: string;
-    download?: boolean | string;
-    rel?: string;
-    shape?: 'rect' | 'circle' | 'poly' | 'default';
-    target?: string;
-    referrerPolicy?: ReferrerPolicy;
-    ping?: string;
-}
-interface DetailsHTMLAttributes<T> extends HTMLAttributes<T> {
-    open?: boolean;
-    onToggle?: (e: Event) => void;
-}
-interface DialogHTMLAttributes<T> extends HTMLAttributes<T> {
-    open?: boolean;
-    onClose?: (e: Event) => void;
-    onCancel?: (e: Event) => void;
-}
-interface BlockquoteHTMLAttributes<T> extends HTMLAttributes<T> {
-    cite?: string;
-}
-interface QuoteHTMLAttributes<T> extends HTMLAttributes<T> {
-    cite?: string;
-}
-interface TimeHTMLAttributes<T> extends HTMLAttributes<T> {
-    dateTime?: string;
-}
-interface DataHTMLAttributes<T> extends HTMLAttributes<T> {
-    value?: string;
-}
-interface MetaHTMLAttributes<T> extends HTMLAttributes<T> {
-    name?: string;
-    content?: string;
-    httpEquiv?: string;
-    charSet?: string;
-    property?: string;
-}
-interface LinkHTMLAttributes<T> extends HTMLAttributes<T> {
-    href?: string;
-    rel?: string;
-    type?: string;
-    media?: string;
-    as?: string;
-    crossOrigin?: 'anonymous' | 'use-credentials';
-    referrerPolicy?: ReferrerPolicy;
-    sizes?: string;
-    hreflang?: string;
-    integrity?: string;
-    fetchPriority?: 'auto' | 'high' | 'low';
-    disabled?: boolean;
+    height?: number | string;
+    form?: string;
+    useMap?: string;
 }
-interface StyleHTMLAttributes<T> extends HTMLAttributes<T> {
-    media?: string;
-    nonce?: string;
-    blocking?: string;
+interface ParamHTMLAttributes<T> extends HTMLAttributes<T> {
+    name?: string;
+    value?: string;
 }
-interface ScriptHTMLAttributes<T> extends HTMLAttributes<T> {
-    src?: string;
-    type?: string;
-    async?: boolean;
-    defer?: boolean;
-    crossOrigin?: 'anonymous' | 'use-credentials';
-    integrity?: string;
-    noModule?: boolean;
-    nonce?: string;
-    referrerPolicy?: ReferrerPolicy;
-    fetchPriority?: 'auto' | 'high' | 'low';
-    blocking?: string;
+interface CanvasHTMLAttributes<T> extends HTMLAttributes<T> {
+    width?: number | string;
+    height?: number | string;
 }
-interface SlotHTMLAttributes<T> extends HTMLAttributes<T> {
+interface MapHTMLAttributes<T> extends HTMLAttributes<T> {
     name?: string;
-    onSlotchange?: (e: Event) => void;
 }
-interface SVGAttributes<T> extends HTMLAttributes<T> {
-    viewBox?: string;
-    xmlns?: string;
-    xmlnsXlink?: string;
-    fill?: string;
-    stroke?: string;
-    strokeWidth?: string | number;
-    strokeLinecap?: 'butt' | 'round' | 'square';
-    strokeLinejoin?: 'miter' | 'round' | 'bevel';
-    strokeDasharray?: string;
-    strokeDashoffset?: string | number;
-    strokeOpacity?: string | number;
-    fillOpacity?: string | number;
-    opacity?: string | number;
-    transform?: string;
-    transformOrigin?: string;
-    clipPath?: string;
-    mask?: string;
-    filter?: string;
-    d?: string;
-    cx?: string | number;
-    cy?: string | number;
-    r?: string | number;
-    rx?: string | number;
-    ry?: string | number;
-    x?: string | number;
-    y?: string | number;
-    x1?: string | number;
-    y1?: string | number;
-    x2?: string | number;
-    y2?: string | number;
-    width?: string | number;
-    height?: string | number;
-    points?: string;
-    pathLength?: string | number;
-    textAnchor?: 'start' | 'middle' | 'end';
-    dominantBaseline?: string;
-    dx?: string | number;
-    dy?: string | number;
-    fontSize?: string | number;
-    fontFamily?: string;
-    fontWeight?: string | number;
+interface AreaHTMLAttributes<T> extends HTMLAttributes<T> {
+    alt?: string;
+    coords?: string;
     href?: string;
-    xlinkHref?: string;
-    gradientUnits?: 'userSpaceOnUse' | 'objectBoundingBox';
-    gradientTransform?: string;
-    spreadMethod?: 'pad' | 'reflect' | 'repeat';
-    offset?: string | number;
-    stopColor?: string;
-    stopOpacity?: string | number;
-    clipPathUnits?: 'userSpaceOnUse' | 'objectBoundingBox';
-    maskUnits?: 'userSpaceOnUse' | 'objectBoundingBox';
-    maskContentUnits?: 'userSpaceOnUse' | 'objectBoundingBox';
-    preserveAspectRatio?: string;
-    markerStart?: string;
-    markerMid?: string;
-    markerEnd?: string;
-    vectorEffect?: string;
+    hreflang?: string;
+    download?: boolean | string;
+    rel?: string;
+    shape?: 'rect' | 'circle' | 'poly' | 'default';
+    target?: string;
+    referrerPolicy?: ReferrerPolicy;
+    ping?: string;
 }
-
-/**
- * Fict Reactive DOM Binding System
- *
- * This module provides the core mechanisms for reactive DOM updates.
- * It bridges the gap between Fict's reactive system (signals, effects)
- * and the DOM, enabling fine-grained updates without a virtual DOM.
- *
- * Design Philosophy:
- * - Values wrapped in functions `() => T` are treated as reactive
- * - Static values are applied once without tracking
- * - The compiler transforms JSX expressions to use these primitives
- */
-
-/** A reactive value that can be either static or a getter function */
-type MaybeReactive<T> = T | (() => T);
-/** Internal type for createElement function reference */
-type CreateElementFn = (node: FictNode) => Node;
-/** Handle returned by conditional/list bindings for cleanup */
-interface BindingHandle {
-    /** Marker node(s) used for positioning */
-    marker: Comment | DocumentFragment;
-    /** Flush pending content - call after markers are inserted into DOM */
-    flush?: () => void;
-    /** Dispose function to clean up the binding */
-    dispose: Cleanup;
+interface DetailsHTMLAttributes<T> extends HTMLAttributes<T> {
+    open?: boolean;
+    onToggle?: (e: Event) => void;
 }
-/**
- * Check if a value is reactive (a getter function)
- * Note: Event handlers (functions that take arguments) are NOT reactive values
- */
-declare function isReactive(value: unknown): value is () => unknown;
-/**
- * Unwrap a potentially reactive value to get the actual value
- */
-declare function unwrap<T>(value: MaybeReactive<T>): T;
-/**
- * Unwrap a primitive proxy value to get the raw primitive value.
- * This is primarily useful for advanced scenarios where you need the actual
- * primitive type (e.g., for typeof checks or strict equality comparisons).
- *
- * @param value - A potentially proxied primitive value
- * @returns The raw primitive value
- *
- * @example
- * ```ts
- * createList(
- *   () => [1, 2, 3],
- *   (item) => {
- *     const raw = unwrapPrimitive(item)
- *     typeof raw === 'number'  // true
- *     raw === 1  // true (for first item)
- *   },
- *   item => item
- * )
- * ```
- */
-declare function unwrapPrimitive<T>(value: T): T;
-/**
- * Create a text node that reactively updates when the value changes.
- *
- * @example
- * ```ts
- * // Static text
- * createTextBinding("Hello")
- *
- * // Reactive text (compiler output)
- * createTextBinding(() => $count())
- * ```
- */
-declare function createTextBinding(value: MaybeReactive<unknown>): Text;
-/**
- * Bind a reactive value to an existing text node.
- * This is a convenience function for binding to existing DOM nodes.
- */
-declare function bindText(textNode: Text, getValue: () => unknown): Cleanup;
-/** Attribute setter function type */
-type AttributeSetter = (el: HTMLElement, key: string, value: unknown) => void;
-/**
- * Create a reactive attribute binding on an element.
- *
- * @example
- * ```ts
- * // Static attribute
- * createAttributeBinding(button, 'disabled', false, setAttribute)
- *
- * // Reactive attribute (compiler output)
- * createAttributeBinding(button, 'disabled', () => !$isValid(), setAttribute)
- * ```
- */
-declare function createAttributeBinding(el: HTMLElement, key: string, value: MaybeReactive<unknown>, setter: AttributeSetter): void;
-/**
- * Bind a reactive value to an element's attribute.
- */
-declare function bindAttribute(el: HTMLElement, key: string, getValue: () => unknown): Cleanup;
-/**
- * Bind a reactive value to an element's property.
- */
-declare function bindProperty(el: HTMLElement, key: string, getValue: () => unknown): Cleanup;
-/**
- * Apply styles to an element, supporting reactive style objects/strings.
- */
-declare function createStyleBinding(el: HTMLElement, value: MaybeReactive<string | Record<string, string | number> | null | undefined>): void;
-/**
- * Bind a reactive style value to an existing element.
- */
-declare function bindStyle(el: HTMLElement, getValue: () => string | Record<string, string | number> | null | undefined): Cleanup;
-/**
- * Apply class to an element, supporting reactive class values.
- */
-declare function createClassBinding(el: HTMLElement, value: MaybeReactive<string | Record<string, boolean> | null | undefined>): void;
-/**
- * Bind a reactive class value to an existing element.
- */
-declare function bindClass(el: HTMLElement, getValue: () => string | Record<string, boolean> | null | undefined): Cleanup;
-/**
- * Exported classList function for direct use (compatible with dom-expressions)
- */
-declare function classList(node: HTMLElement, value: Record<string, boolean> | null | undefined, prev?: Record<string, boolean>): Record<string, boolean>;
-/**
- * Insert reactive content into a parent element.
- * This is a simpler API than createChildBinding for basic cases.
- *
- * @param parent - The parent element to insert into
- * @param getValue - Function that returns the value to render
- * @param markerOrCreateElement - Optional marker node to insert before, or createElementFn
- * @param createElementFn - Optional function to create DOM elements (when marker is provided)
- */
-declare function insert(parent: HTMLElement | DocumentFragment, getValue: () => FictNode, markerOrCreateElement?: Node | CreateElementFn, createElementFn?: CreateElementFn): Cleanup;
-/**
- * Create a reactive child binding that updates when the child value changes.
- * This is used for dynamic expressions like `{show && <Modal />}` or `{items.map(...)}`.
- *
- * @example
- * ```ts
- * // Reactive child (compiler output for {count})
- * createChildBinding(parent, () => $count(), createElement)
- *
- * // Reactive conditional (compiler output for {show && <Modal />})
- * createChildBinding(parent, () => $show() && jsx(Modal, {}), createElement)
- * ```
- */
-declare function createChildBinding(parent: HTMLElement | DocumentFragment, getValue: () => FictNode, createElementFn: CreateElementFn): BindingHandle;
-declare global {
-    interface HTMLElement {
-        _$host?: HTMLElement;
-        [key: `$$${string}`]: EventListener | [EventListener, unknown] | undefined;
-        [key: `$$${string}Data`]: unknown;
-    }
-    interface Document extends Record<string, unknown> {
-    }
+interface DialogHTMLAttributes<T> extends HTMLAttributes<T> {
+    open?: boolean;
+    onClose?: (e: Event) => void;
+    onCancel?: (e: Event) => void;
+}
+interface BlockquoteHTMLAttributes<T> extends HTMLAttributes<T> {
+    cite?: string;
+}
+interface QuoteHTMLAttributes<T> extends HTMLAttributes<T> {
+    cite?: string;
+}
+interface TimeHTMLAttributes<T> extends HTMLAttributes<T> {
+    dateTime?: string;
+}
+interface DataHTMLAttributes<T> extends HTMLAttributes<T> {
+    value?: string;
+}
+interface MetaHTMLAttributes<T> extends HTMLAttributes<T> {
+    name?: string;
+    content?: string;
+    httpEquiv?: string;
+    charSet?: string;
+    property?: string;
+}
+interface LinkHTMLAttributes<T> extends HTMLAttributes<T> {
+    href?: string;
+    rel?: string;
+    type?: string;
+    media?: string;
+    as?: string;
+    crossOrigin?: 'anonymous' | 'use-credentials';
+    referrerPolicy?: ReferrerPolicy;
+    sizes?: string;
+    hreflang?: string;
+    integrity?: string;
+    fetchPriority?: 'auto' | 'high' | 'low';
+    disabled?: boolean;
+}
+interface StyleHTMLAttributes<T> extends HTMLAttributes<T> {
+    media?: string;
+    nonce?: string;
+    blocking?: string;
+}
+interface ScriptHTMLAttributes<T> extends HTMLAttributes<T> {
+    src?: string;
+    type?: string;
+    async?: boolean;
+    defer?: boolean;
+    crossOrigin?: 'anonymous' | 'use-credentials';
+    integrity?: string;
+    noModule?: boolean;
+    nonce?: string;
+    referrerPolicy?: ReferrerPolicy;
+    fetchPriority?: 'auto' | 'high' | 'low';
+    blocking?: string;
+}
+interface SlotHTMLAttributes<T> extends HTMLAttributes<T> {
+    name?: string;
+    onSlotchange?: (e: Event) => void;
+}
+interface SVGAttributes<T> extends HTMLAttributes<T> {
+    viewBox?: string;
+    xmlns?: string;
+    xmlnsXlink?: string;
+    fill?: string;
+    stroke?: string;
+    strokeWidth?: string | number;
+    strokeLinecap?: 'butt' | 'round' | 'square';
+    strokeLinejoin?: 'miter' | 'round' | 'bevel';
+    strokeDasharray?: string;
+    strokeDashoffset?: string | number;
+    strokeOpacity?: string | number;
+    fillOpacity?: string | number;
+    opacity?: string | number;
+    transform?: string;
+    transformOrigin?: string;
+    clipPath?: string;
+    mask?: string;
+    filter?: string;
+    d?: string;
+    cx?: string | number;
+    cy?: string | number;
+    r?: string | number;
+    rx?: string | number;
+    ry?: string | number;
+    x?: string | number;
+    y?: string | number;
+    x1?: string | number;
+    y1?: string | number;
+    x2?: string | number;
+    y2?: string | number;
+    width?: string | number;
+    height?: string | number;
+    points?: string;
+    pathLength?: string | number;
+    textAnchor?: 'start' | 'middle' | 'end';
+    dominantBaseline?: string;
+    dx?: string | number;
+    dy?: string | number;
+    fontSize?: string | number;
+    fontFamily?: string;
+    fontWeight?: string | number;
+    href?: string;
+    xlinkHref?: string;
+    gradientUnits?: 'userSpaceOnUse' | 'objectBoundingBox';
+    gradientTransform?: string;
+    spreadMethod?: 'pad' | 'reflect' | 'repeat';
+    offset?: string | number;
+    stopColor?: string;
+    stopOpacity?: string | number;
+    clipPathUnits?: 'userSpaceOnUse' | 'objectBoundingBox';
+    maskUnits?: 'userSpaceOnUse' | 'objectBoundingBox';
+    maskContentUnits?: 'userSpaceOnUse' | 'objectBoundingBox';
+    preserveAspectRatio?: string;
+    markerStart?: string;
+    markerMid?: string;
+    markerEnd?: string;
+    vectorEffect?: string;
 }
-/**
- * Initialize event delegation for a set of event names.
- * Events will be handled at the document level and dispatched to the appropriate handlers.
- *
- * @param eventNames - Array of event names to delegate
- * @param doc - The document to attach handlers to (default: window.document)
- *
- * @example
- * ```ts
- * // Called automatically by the compiler for delegated events
- * delegateEvents(['click', 'input', 'keydown'])
- * ```
- */
-declare function delegateEvents(eventNames: string[], doc?: Document): void;
-/**
- * Clear all delegated event handlers from a document.
- *
- * @param doc - The document to clear handlers from (default: window.document)
- */
-declare function clearDelegatedEvents(doc?: Document): void;
-/**
- * Add an event listener to an element.
- * If the event is in DelegatedEvents, it uses event delegation for better performance.
- *
- * @param node - The element to add the listener to
- * @param name - The event name (lowercase)
- * @param handler - The event handler or [handler, data] tuple
- * @param delegate - Whether to use delegation (auto-detected based on event name)
- */
-declare function addEventListener(node: HTMLElement, name: string, handler: EventListener | [EventListener, unknown] | null | undefined, delegate?: boolean): void;
-/**
- * Bind an event listener to an element.
- * Uses event delegation for better performance when applicable.
- *
- * @example
- * ```ts
- * // Static event
- * bindEvent(button, 'click', handleClick)
- *
- * // Reactive event (compiler output)
- * bindEvent(button, 'click', () => $handler())
- *
- * // With modifiers
- * bindEvent(button, 'click', handler, { capture: true, passive: true, once: true })
- * ```
- */
-declare function bindEvent(el: HTMLElement, eventName: string, handler: EventListenerOrEventListenerObject | null | undefined, options?: boolean | AddEventListenerOptions): Cleanup;
-/**
- * Bind a ref to an element.
- * Supports both callback refs and ref objects.
- *
- * @param el - The element to bind the ref to
- * @param ref - Either a callback function, a ref object, or a reactive getter
- * @returns Cleanup function
- *
- * @example
- * ```ts
- * // Callback ref
- * bindRef(el, (element) => { store.input = element })
- *
- * // Ref object
- * const inputRef = createRef()
- * bindRef(el, inputRef)
- *
- * // Reactive ref (compiler output)
- * bindRef(el, () => props.ref)
- * ```
- */
-declare function bindRef(el: HTMLElement, ref: unknown): Cleanup;
-/**
- * Apply spread props to an element with reactive updates.
- * This handles dynamic spread like `<div {...props}>`.
- *
- * @param node - The element to apply props to
- * @param props - The props object (may have reactive getters)
- * @param isSVG - Whether this is an SVG element
- * @param skipChildren - Whether to skip children handling
- * @returns The previous props for tracking changes
- *
- * @example
- * ```ts
- * // Compiler output for <div {...props} />
- * spread(el, props, false, false)
- * ```
- */
-declare function spread(node: HTMLElement, props?: Record<string, unknown>, isSVG?: boolean, skipChildren?: boolean): Record<string, unknown>;
-/**
- * Assign props to a node, tracking previous values for efficient updates.
- * This is the core prop assignment logic used by spread.
- *
- * @param node - The element to assign props to
- * @param props - New props object
- * @param isSVG - Whether this is an SVG element
- * @param skipChildren - Whether to skip children handling
- * @param prevProps - Previous props for comparison
- * @param skipRef - Whether to skip ref handling
- */
-declare function assign(node: HTMLElement, props: Record<string, unknown>, isSVG?: boolean, skipChildren?: boolean, prevProps?: Record<string, unknown>, skipRef?: boolean): void;
-/**
- * Create a conditional rendering binding.
- * Efficiently renders one of two branches based on a condition.
- *
- * This is an optimized version for `{condition ? <A /> : <B />}` patterns
- * where both branches are known statically.
- *
- * @example
- * ```ts
- * // Compiler output for {show ? <A /> : <B />}
- * createConditional(
- *   () => $show(),
- *   () => jsx(A, {}),
- *   () => jsx(B, {}),
- *   createElement
- * )
- * ```
- */
-declare function createConditional(condition: () => boolean, renderTrue: () => FictNode, createElementFn: CreateElementFn, renderFalse?: () => FictNode): BindingHandle;
-/** Key extractor function type */
-type KeyFn<T> = (item: T, index: number) => string | number;
-/**
- * Create a reactive list rendering binding with optional keying.
- */
-declare function createList<T>(items: () => T[], renderItem: (item: T, index: number) => FictNode, createElementFn: CreateElementFn, getKey?: KeyFn<T>): BindingHandle;
-/**
- * Create a show/hide binding that uses CSS display instead of DOM manipulation.
- * More efficient than conditional when the content is expensive to create.
- *
- * @example
- * ```ts
- * createShow(container, () => $visible())
- * ```
- */
-declare function createShow(el: HTMLElement, condition: () => boolean, displayValue?: string): void;
-/**
- * Create a portal that renders content into a different DOM container.
- *
- * @example
- * ```ts
- * createPortal(
- *   document.body,
- *   () => jsx(Modal, { children: 'Hello' }),
- *   createElement
- * )
- * ```
- */
-declare function createPortal(container: HTMLElement, render: () => FictNode, createElementFn: CreateElementFn): BindingHandle;
 
 /**
  * Fict DOM Rendering System
@@ -1569,4 +1600,4 @@ declare function isNodeBetweenMarkers(node: Node, startMarker: Comment, endMarke
  */
 declare function createKeyedList<T>(getItems: () => T[], keyFn: (item: T, index: number) => string | number, renderItem: FineGrainedRenderItem<T>, needsIndex?: boolean): KeyedListBinding;
 
-export { $effect, $memo, $state, Aliases, type AttributeSetter, type BaseProps, type BindingHandle, BooleanAttributes, ChildProperties, type ClassProp, type Cleanup, type Component, type CreateElementFn, type DOMElement, DelegatedEvents, type Effect, ErrorBoundary, type ErrorInfo, type EventHandler, type FictDevtoolsHook, type FictNode, type FictVNode, Fragment, JSX, type KeyFn, type KeyedBlock, type KeyedListBinding, type KeyedListContainer, type MarkerBlock, type MaybeReactive, type Memo, Properties, type PropsWithChildren, type Ref, type RefCallback, type RefObject, SVGElements, SVGNamespace, type SignalAccessor as Signal, type Store, type StyleProp, Suspense, type SuspenseToken, UnitlessStyles, type VersionedSignal, type VersionedSignalOptions, __fictPopContext, __fictProp, __fictPropsRest, __fictPushContext, __fictRender, __fictResetContext, __fictUseContext, __fictUseEffect, __fictUseMemo, __fictUseSignal, addEventListener, assign, batch, bindAttribute, bindClass, bindEvent, bindProperty, bindRef, bindStyle, bindText, classList, clearDelegatedEvents, createAttributeBinding, createChildBinding, createClassBinding, createConditional, createEffect, createElement, createKeyedBlock, createKeyedList, createKeyedListContainer, createList, createMemo, createPortal, createPropsProxy, createRef, createRenderEffect, createRoot, createSelector, createShow, signal as createSignal, createStore, createStyleBinding, createSuspenseToken, createTextBinding, createVersionedSignal, delegateEvents, destroyMarkerBlock, getDevtoolsHook, getFirstNodeAfter, getPropAlias, insert, insertNodesBefore, isNodeBetweenMarkers, isReactive, mergeProps, moveMarkerBlock, moveNodesBefore, onCleanup, onDestroy, onMount, __fictProp as prop, reconcileArrays, removeNodes, render, setCycleProtectionOptions, spread, startTransition, template, toNodeArray, untrack, unwrap, unwrapPrimitive, useDeferredValue, useProp, useTransition };
+export { $effect, $memo, $state, Aliases, type AttributeSetter, type BaseProps, type BindingHandle, BooleanAttributes, ChildProperties, type ClassProp, type Cleanup, type Component, type CreateElementFn, type DOMElement, DelegatedEvents, type Effect, ErrorBoundary, type ErrorInfo, type EventHandler, type FictDevtoolsHook, type FictNode, type FictVNode, Fragment, JSX, type KeyFn, type KeyedBlock, type KeyedListBinding, type KeyedListContainer, type MarkerBlock, type MaybeReactive, type Memo, Properties, type PropsWithChildren, type ReactiveScope, type Ref, type RefCallback, type RefObject, SVGElements, SVGNamespace, type SignalAccessor as Signal, type Store, type StyleProp, Suspense, type SuspenseToken, UnitlessStyles, type VersionedSignal, type VersionedSignalOptions, __fictPopContext, __fictProp, __fictPropsRest, __fictPushContext, __fictRender, __fictResetContext, __fictUseContext, __fictUseEffect, __fictUseMemo, __fictUseSignal, addEventListener, assign, batch, bindAttribute, bindClass, bindEvent, bindProperty, bindRef, bindStyle, bindText, callEventHandler, classList, clearDelegatedEvents, createAttributeBinding, createChildBinding, createClassBinding, createConditional, createEffect, createElement, createKeyedBlock, createKeyedList, createKeyedListContainer, createList, createMemo, createPortal, createPropsProxy, createRef, createRenderEffect, createRoot, createScope, createSelector, createShow, signal as createSignal, createStore, createStyleBinding, createSuspenseToken, createTextBinding, createVersionedSignal, delegateEvents, destroyMarkerBlock, effectScope, getDevtoolsHook, getFirstNodeAfter, getPropAlias, insert, insertNodesBefore, isNodeBetweenMarkers, isReactive, mergeProps, moveMarkerBlock, moveNodesBefore, onCleanup, onDestroy, onMount, __fictProp as prop, reconcileArrays, removeNodes, render, runInScope, setCycleProtectionOptions, spread, startTransition, template, toNodeArray, untrack, unwrap, unwrapPrimitive, useDeferredValue, useProp, useTransition };