effectweb 0.2.2 → 0.3.0

package/dist/jsx.d.ts

@@ -1,9 +1,21 @@
+import type { HtmlAttributes } from './html-attributes.js';
+import type { SvgAttributes, SvgPresentationAttributes } from './svg-attributes.js';
+import type { SnapshotOpaque } from './snapshot.js';
 import type { EffectEventRequest } from './effectEvent.js';
 import type { CompiledContent } from './dom.js';
 import type { DomMount } from './mount.js';
+/** Nominal eligibility for compiled JSX components and compiler primitives. */
+export declare const jsxComponent: unique symbol;
 /** JSX is a compiler input. No renderer library owns its types. */
 export declare namespace JSX {
-    export type Element = Node | string | number | boolean | null | undefined | CompiledContent | Element[];
+    export interface ComponentType {
+        readonly [jsxComponent]: true;
+    }
+    export type ElementType = keyof IntrinsicElements | (ComponentType & ((props: never) => Element));
+    /** Immutable compiler input; preserve this recursive presentation type through snapshots. */
+    export interface ElementArray extends ReadonlyArray<Element>, SnapshotOpaque {
+    }
+    export type Element = string | number | boolean | null | undefined | CompiledContent | ElementArray;
     export type EventHandler<T, E extends Event> = (event: E & {
         currentTarget: T;
         target: EventTarget & globalThis.Element;
@@ -12,73 +24,193 @@ export declare namespace JSX {
     export type CSSProperties = {
         [property: string]: string | number | undefined | null;
     };
+    /** Standard event payloads not yet declared by the minimum supported TypeScript DOM library. */
+    export interface CommandEvent extends Event {
+        readonly command: string;
+        readonly source: globalThis.Element | null;
+    }
+    export interface SnapEvent extends Event {
+        readonly snapTargetBlock: Node | null;
+        readonly snapTargetInline: Node | null;
+    }
+    export interface TimeEvent extends Event {
+        readonly detail: number;
+        readonly view: Window | null;
+    }
+    /** Native element events; window/document listeners belong in an owned DOM binding. */
     export interface Events<T> {
-        onClick?: EventHandler<T, MouseEvent> | undefined;
+        onAbort?: EventHandler<T, UIEvent> | undefined;
+        onAnimationCancel?: EventHandler<T, AnimationEvent> | undefined;
+        onAnimationEnd?: EventHandler<T, AnimationEvent> | undefined;
+        onAnimationIteration?: EventHandler<T, AnimationEvent> | undefined;
+        onAnimationStart?: EventHandler<T, AnimationEvent> | undefined;
+        onAuxClick?: EventHandler<T, PointerEvent> | undefined;
+        onBeforeInput?: EventHandler<T, InputEvent> | undefined;
+        onBeforeMatch?: EventHandler<T, Event> | undefined;
+        onBeforeToggle?: EventHandler<T, ToggleEvent> | undefined;
+        onBlur?: EventHandler<T, FocusEvent> | undefined;
+        onCancel?: EventHandler<T, Event> | undefined;
+        onCanPlay?: EventHandler<T, Event> | undefined;
+        onCanPlayThrough?: EventHandler<T, Event> | undefined;
+        onChange?: EventHandler<T, Event> | undefined;
+        onClick?: EventHandler<T, PointerEvent> | undefined;
+        onClose?: EventHandler<T, Event> | undefined;
+        onCommand?: EventHandler<T, CommandEvent> | undefined;
+        onCompositionEnd?: EventHandler<T, CompositionEvent> | undefined;
+        onCompositionStart?: EventHandler<T, CompositionEvent> | undefined;
+        onCompositionUpdate?: EventHandler<T, CompositionEvent> | undefined;
+        onContentVisibilityAutoStateChange?: EventHandler<T, ContentVisibilityAutoStateChangeEvent> | undefined;
+        onContextLost?: EventHandler<T, Event> | undefined;
+        onContextMenu?: EventHandler<T, PointerEvent> | undefined;
+        onContextRestored?: EventHandler<T, Event> | undefined;
+        onCopy?: EventHandler<T, ClipboardEvent> | undefined;
+        onCueChange?: EventHandler<T, Event> | undefined;
+        onCut?: EventHandler<T, ClipboardEvent> | undefined;
         onDblClick?: EventHandler<T, MouseEvent> | undefined;
-        onContextMenu?: EventHandler<T, MouseEvent> | undefined;
+        onDrag?: EventHandler<T, DragEvent> | undefined;
+        onDragEnd?: EventHandler<T, DragEvent> | undefined;
+        onDragEnter?: EventHandler<T, DragEvent> | undefined;
+        onDragLeave?: EventHandler<T, DragEvent> | undefined;
+        onDragOver?: EventHandler<T, DragEvent> | undefined;
+        onDragStart?: EventHandler<T, DragEvent> | undefined;
+        onDrop?: EventHandler<T, DragEvent> | undefined;
+        onDurationChange?: EventHandler<T, Event> | undefined;
+        onEmptied?: EventHandler<T, Event> | undefined;
+        onEnded?: EventHandler<T, Event> | undefined;
+        onError?: EventHandler<T, Event> | undefined;
+        onFocus?: EventHandler<T, FocusEvent> | undefined;
+        onFocusIn?: EventHandler<T, FocusEvent> | undefined;
+        onFocusOut?: EventHandler<T, FocusEvent> | undefined;
+        onFormData?: EventHandler<T, FormDataEvent> | undefined;
+        onFullscreenChange?: EventHandler<T, Event> | undefined;
+        onFullscreenError?: EventHandler<T, Event> | undefined;
+        onGotPointerCapture?: EventHandler<T, PointerEvent> | undefined;
         onInput?: EventHandler<T, InputEvent> | undefined;
-        onChange?: EventHandler<T, Event> | undefined;
-        onSubmit?: EventHandler<T, SubmitEvent> | undefined;
+        onInvalid?: EventHandler<T, Event> | undefined;
         onKeyDown?: EventHandler<T, KeyboardEvent> | undefined;
+        /** @deprecated Use onKeyDown or onBeforeInput. */
+        onKeyPress?: EventHandler<T, KeyboardEvent> | undefined;
         onKeyUp?: EventHandler<T, KeyboardEvent> | undefined;
-        onPointerDown?: EventHandler<T, PointerEvent> | undefined;
-        onPointerUp?: EventHandler<T, PointerEvent> | undefined;
-        onPointerMove?: EventHandler<T, PointerEvent> | undefined;
-        onPointerEnter?: EventHandler<T, PointerEvent> | undefined;
-        onPointerLeave?: EventHandler<T, PointerEvent> | undefined;
-        onPointerCancel?: EventHandler<T, PointerEvent> | undefined;
+        onLoad?: EventHandler<T, Event> | undefined;
+        onLoadedData?: EventHandler<T, Event> | undefined;
+        onLoadedMetadata?: EventHandler<T, Event> | undefined;
+        onLoadStart?: EventHandler<T, Event> | undefined;
+        onLostPointerCapture?: EventHandler<T, PointerEvent> | undefined;
         onMouseDown?: EventHandler<T, MouseEvent> | undefined;
         onMouseEnter?: EventHandler<T, MouseEvent> | undefined;
         onMouseLeave?: EventHandler<T, MouseEvent> | undefined;
-        onFocus?: EventHandler<T, FocusEvent> | undefined;
-        onBlur?: EventHandler<T, FocusEvent> | undefined;
+        onMouseMove?: EventHandler<T, MouseEvent> | undefined;
+        onMouseOut?: EventHandler<T, MouseEvent> | undefined;
+        onMouseOver?: EventHandler<T, MouseEvent> | undefined;
+        onMouseUp?: EventHandler<T, MouseEvent> | undefined;
+        onPaste?: EventHandler<T, ClipboardEvent> | undefined;
+        onPause?: EventHandler<T, Event> | undefined;
+        onPlay?: EventHandler<T, Event> | undefined;
+        onPlaying?: EventHandler<T, Event> | undefined;
+        onPointerCancel?: EventHandler<T, PointerEvent> | undefined;
+        onPointerDown?: EventHandler<T, PointerEvent> | undefined;
+        onPointerEnter?: EventHandler<T, PointerEvent> | undefined;
+        onPointerLeave?: EventHandler<T, PointerEvent> | undefined;
+        onPointerMove?: EventHandler<T, PointerEvent> | undefined;
+        onPointerOut?: EventHandler<T, PointerEvent> | undefined;
+        onPointerOver?: EventHandler<T, PointerEvent> | undefined;
+        onPointerRawUpdate?: EventHandler<T, PointerEvent> | undefined;
+        onPointerUp?: EventHandler<T, PointerEvent> | undefined;
+        onProgress?: EventHandler<T, ProgressEvent> | undefined;
+        onRateChange?: EventHandler<T, Event> | undefined;
+        onReset?: EventHandler<T, Event> | undefined;
+        onResize?: EventHandler<T, UIEvent> | undefined;
         onScroll?: EventHandler<T, Event> | undefined;
-        onWheel?: EventHandler<T, WheelEvent> | undefined;
-        onLoad?: EventHandler<T, Event> | undefined;
-        onError?: EventHandler<T, Event> | undefined;
-        onLoadedMetadata?: EventHandler<T, Event> | undefined;
+        onScrollEnd?: EventHandler<T, Event> | undefined;
+        onScrollSnapChange?: EventHandler<T, SnapEvent> | undefined;
+        onScrollSnapChanging?: EventHandler<T, SnapEvent> | undefined;
+        onSecurityPolicyViolation?: EventHandler<T, SecurityPolicyViolationEvent> | undefined;
+        onSeeked?: EventHandler<T, Event> | undefined;
+        onSeeking?: EventHandler<T, Event> | undefined;
+        onSelect?: EventHandler<T, Event> | undefined;
+        onSelectionChange?: EventHandler<T, Event> | undefined;
+        onSelectStart?: EventHandler<T, Event> | undefined;
+        onSlotChange?: EventHandler<T, Event> | undefined;
+        onStalled?: EventHandler<T, Event> | undefined;
+        onSubmit?: EventHandler<T, SubmitEvent> | undefined;
+        onSuspend?: EventHandler<T, Event> | undefined;
         onTimeUpdate?: EventHandler<T, Event> | undefined;
-        onEnded?: EventHandler<T, Event> | undefined;
-        onPlay?: EventHandler<T, Event> | undefined;
-        onPause?: EventHandler<T, Event> | undefined;
-        onPaste?: EventHandler<T, ClipboardEvent> | undefined;
-        onDragOver?: EventHandler<T, DragEvent> | undefined;
-        onDragLeave?: EventHandler<T, DragEvent> | undefined;
-        onDrop?: EventHandler<T, DragEvent> | undefined;
+        onToggle?: EventHandler<T, ToggleEvent> | undefined;
+        onTouchCancel?: EventHandler<T, TouchEvent> | undefined;
+        onTouchEnd?: EventHandler<T, TouchEvent> | undefined;
+        onTouchMove?: EventHandler<T, TouchEvent> | undefined;
+        onTouchStart?: EventHandler<T, TouchEvent> | undefined;
+        onTransitionCancel?: EventHandler<T, TransitionEvent> | undefined;
+        onTransitionEnd?: EventHandler<T, TransitionEvent> | undefined;
+        onTransitionRun?: EventHandler<T, TransitionEvent> | undefined;
+        onTransitionStart?: EventHandler<T, TransitionEvent> | undefined;
+        onVolumeChange?: EventHandler<T, Event> | undefined;
+        onWaiting?: EventHandler<T, Event> | undefined;
+        onWheel?: EventHandler<T, WheelEvent> | undefined;
     }
+    type ElementEvents<T> = Events<T> & (T extends HTMLMediaElement ? {
+        onEncrypted?: EventHandler<T, MediaEncryptedEvent> | undefined;
+        onWaitingForKey?: EventHandler<T, Event> | undefined;
+    } : {}) & (T extends HTMLVideoElement ? {
+        onEnterPictureInPicture?: EventHandler<T, PictureInPictureEvent> | undefined;
+        onLeavePictureInPicture?: EventHandler<T, PictureInPictureEvent> | undefined;
+    } : {}) & (T extends HTMLCanvasElement ? {
+        onWebGLContextCreationError?: EventHandler<T, WebGLContextEvent> | undefined;
+        onWebGLContextLost?: EventHandler<T, WebGLContextEvent> | undefined;
+        onWebGLContextRestored?: EventHandler<T, WebGLContextEvent> | undefined;
+    } : {}) & (T extends SVGAnimationElement ? {
+        onBegin?: EventHandler<T, TimeEvent> | undefined;
+        onEnd?: EventHandler<T, TimeEvent> | undefined;
+        onRepeat?: EventHandler<T, TimeEvent> | undefined;
+    } : {});
     type Scalar = string | number | boolean;
+    type Equal<X, Y> = (<G>() => G extends X ? 1 : 2) extends <G>() => G extends Y ? 1 : 2 ? true : false;
+    type AttributeKey<K extends string> = Lowercase<K> extends keyof HtmlAttributes ? K | Lowercase<K> : K extends 'className' | 'htmlFor' | 'acceptCharset' | 'httpEquiv' ? K | Lowercase<K> : never;
     type DomAttributes<T> = {
-        [K in keyof T as K extends string ? T[K] extends Scalar | null ? K | Lowercase<K> : never : never]?: K extends 'min' | 'max' | 'step' | 'value' ? string | number | undefined : T[K] extends boolean ? boolean | undefined : T[K] extends number ? number | string | undefined : T[K] | undefined;
+        [K in keyof T as K extends string ? Equal<Pick<T, K>, {
+            -readonly [P in K]: T[P];
+        }> extends true ? T[K] extends Scalar | null ? AttributeKey<K> : never : never : never]?: K extends 'min' | 'max' | 'step' | 'value' ? string | number | undefined : T[K] extends boolean ? boolean | undefined : T[K] extends number ? number | string | undefined : T[K] | undefined;
     };
     type CaptureEvents<T> = {
-        [K in keyof Events<T> as `${K}Capture`]?: Events<T>[K];
+        [K in keyof ElementEvents<T> as `${K & string}Capture`]?: ElementEvents<T>[K];
     };
-    export type Attributes<T> = Events<T> & CaptureEvents<T> & DomAttributes<T> & {
+    export type Attributes<T> = ElementEvents<T> & CaptureEvents<T> & Omit<DomAttributes<T>, 'contenteditable' | 'contentEditable' | 'spellcheck' | 'draggable' | 'translate' | 'download'> & {
         children?: Element | undefined;
         class?: string | undefined;
         className?: string | undefined;
         classList?: Record<string, boolean | undefined> | undefined;
         style?: string | CSSProperties | undefined;
-        use?: DomMount | undefined;
+        use?: DomMount<T & globalThis.Element> | undefined;
         role?: string | undefined;
+        nonce?: string | undefined;
         tabindex?: number | undefined;
         loading?: 'lazy' | 'eager' | undefined;
         download?: string | boolean | undefined;
         autocomplete?: string | undefined;
         inputmode?: string | undefined;
-        spellcheck?: boolean | 'true' | 'false' | undefined;
-        contenteditable?: boolean | 'true' | 'false' | undefined;
+        spellcheck?: boolean | 'true' | 'false' | '' | undefined;
+        contenteditable?: boolean | 'true' | 'false' | 'plaintext-only' | 'inherit' | '' | undefined;
+        contentEditable?: boolean | 'true' | 'false' | 'plaintext-only' | 'inherit' | '' | undefined;
+        draggable?: boolean | 'true' | 'false' | undefined;
+        translate?: boolean | 'yes' | 'no' | '' | undefined;
+        part?: string | undefined;
+        exportparts?: string | undefined;
         [data: `data-${string}`]: Scalar | null | undefined;
         [aria: `aria-${string}`]: Scalar | null | undefined;
     };
-    type SvgAttributes = Partial<Record<'viewBox' | 'fill' | 'stroke' | 'stroke-width' | 'stroke-linecap' | 'stroke-linejoin' | 'stroke-dasharray' | 'stroke-dashoffset' | 'stroke-miterlimit' | 'fill-rule' | 'clip-rule' | 'fill-opacity' | 'stroke-opacity' | 'd' | 'points' | 'x' | 'y' | 'x1' | 'x2' | 'y1' | 'y2' | 'cx' | 'cy' | 'r' | 'rx' | 'ry' | 'width' | 'height' | 'xmlns' | 'transform' | 'preserveAspectRatio' | 'offset' | 'stop-color' | 'stop-opacity' | 'clip-path' | 'mask' | 'opacity' | 'pathLength', string | number | undefined>>;
+    type ApplicableAttributes<Tag extends string> = {
+        [Name in keyof HtmlAttributes]: Tag extends keyof HtmlAttributes[Name] ? Name : '*' extends keyof HtmlAttributes[Name] ? Name : never;
+    }[keyof HtmlAttributes];
+    type SharedSvgAttributes<Tag extends string> = Tag extends keyof SVGElementTagNameMap ? SvgPresentationAttributes & (Tag extends 'a' ? Pick<SvgAttributes, 'requiredExtensions' | 'systemLanguage'> : {}) & (Tag extends 'script' ? Pick<SvgAttributes, 'href'> : {}) : {};
     type Html = {
-        [Tag in keyof HTMLElementTagNameMap]: Attributes<HTMLElementTagNameMap[Tag]>;
+        [Tag in keyof HTMLElementTagNameMap]: Attributes<HTMLElementTagNameMap[Tag]> & SharedSvgAttributes<Tag> & Partial<Record<Exclude<ApplicableAttributes<Tag>, keyof Attributes<HTMLElementTagNameMap[Tag]>>, Scalar | null | undefined>>;
     };
     type Svg = {
         [Tag in Exclude<keyof SVGElementTagNameMap, keyof HTMLElementTagNameMap>]: Attributes<SVGElementTagNameMap[Tag]> & SvgAttributes;
     };
-    export type IntrinsicElements = Html & Svg;
+    /** Consumers can explicitly augment custom tags without weakening the built-in contract. */
+    export interface IntrinsicElements extends Html, Svg {
+    }
     export interface ElementChildrenAttribute {
         children: unknown;
     }

package/dist/jsx.js

@@ -1 +1,2 @@
-export {};
+/** Nominal eligibility for compiled JSX components and compiler primitives. */
+export const jsxComponent = Symbol('effectweb.component');

package/dist/lazy.d.ts

@@ -0,0 +1,23 @@
+import { Effect, type Cause } from 'effect';
+import { type View } from './dom.js';
+import { type UiRuntime } from './runtime.js';
+export interface LazyViewOptions<Model, Message, E> {
+    readonly pending?: View<Model, Message>;
+    readonly failure?: View<{
+        readonly model: Model;
+        readonly cause: Cause.Cause<E>;
+    }, Message>;
+}
+/**
+ * Mount-owned loading with current inputs and a reusable successful definition.
+ * Unresolved placements own independent requests; unmount interrupts their work.
+ */
+export declare function lazyView<Model, Message = never, E = never, R = never>(load: () => Effect.Effect<View<Model, Message>, E, R>, ...provided: [R] extends [never] ? [
+    options?: LazyViewOptions<NoInfer<Model>, NoInfer<Message>, NoInfer<E>> & {
+        readonly runtime?: UiRuntime<R>;
+    }
+] : [
+    options: LazyViewOptions<NoInfer<Model>, NoInfer<Message>, NoInfer<E>> & {
+        readonly runtime: UiRuntime<R>;
+    }
+]): View<Model, Message>;

package/dist/lazy.js

@@ -0,0 +1,58 @@
+import { Effect, Fiber } from 'effect';
+import { child, compiled, viewRegion } from './dom.js';
+import { reportSafely } from './errors.js';
+import { defaultUiRuntime } from './runtime.js';
+/**
+ * Mount-owned loading with current inputs and a reusable successful definition.
+ * Unresolved placements own independent requests; unmount interrupts their work.
+ */
+export function lazyView(load, ...provided) {
+    const options = provided[0];
+    const runtime = options?.runtime ?? defaultUiRuntime;
+    let loaded;
+    return compiled((scope, parent, before) => {
+        const render = viewRegion(scope, parent, before);
+        if (loaded) {
+            render(loaded);
+            return;
+        }
+        render(options?.pending);
+        let fiber;
+        const interrupt = () => {
+            if (fiber)
+                Effect.runFork(Fiber.interrupt(fiber));
+        };
+        scope.cleanups.push(interrupt);
+        if (scope.disposed)
+            return;
+        fiber = Effect.runFork(runtime.provide(Effect.suspend(load)));
+        if (scope.disposed) {
+            interrupt();
+            return;
+        }
+        fiber.addObserver((exit) => {
+            if (scope.disposed)
+                return;
+            try {
+                if (exit._tag === 'Success') {
+                    loaded = exit.value;
+                    render(loaded);
+                }
+                else {
+                    const failure = options?.failure;
+                    if (failure)
+                        render(compiled((scope, parent, before) => {
+                            child(scope, parent, before, failure, () => [scope.value], () => ({ model: scope.value, cause: exit.cause }), scope.send);
+                        }));
+                    else {
+                        render(undefined);
+                        reportSafely(scope.report, exit.cause);
+                    }
+                }
+            }
+            catch (error) {
+                reportSafely(scope.report, error);
+            }
+        });
+    });
+}

package/dist/load.d.ts

@@ -1,13 +1,12 @@
 import { Effect } from 'effect';
-/** Loaders stay lazy and use one error/cancellation model, whether their work is sync or async. */
 export type UiLoad<A, E = unknown, R = never> = Effect.Effect<A, E, R>;
 export declare const loadEffect: <A, E, R>(load: () => UiLoad<A, E, R>) => UiLoad<A, E, R>;
 /** Adapt Promise libraries at the integration boundary. Pass the signal to APIs that support it. */
 export declare const fromPromise: <A>(load: (signal: AbortSignal) => PromiseLike<A>) => UiLoad<A>;
 export interface UiPage<A, Cursor> {
-    items: A[];
-    totalCount?: number;
-    next: Cursor | undefined;
+    readonly items: readonly A[];
+    readonly totalCount?: number;
+    readonly next: Cursor | undefined;
 }
 /** Read a local cache when executed, then acquire missing data through the same Effect contract. */
 export declare function cachedLoad<A, E, R>(read: () => A | undefined, load: () => UiLoad<A, E, R>): UiLoad<A, E, R>;

package/dist/mount.d.ts

@@ -1,25 +1,22 @@
+import type { Snapshot } from './snapshot.js';
 import { type ReportError } from './errors.js';
 import { Effect } from 'effect';
 import { type UiRuntime } from './runtime.js';
-import type { JSX } from './jsx.js';
+export { Portal, type PortalProps } from './dom.js';
 type Work<R = never> = (() => void) | {
     dispose: () => void;
     update?: () => void;
 } | Effect.Effect<never, unknown, R>;
-export declare function Portal(_props: {
-    children?: JSX.Element;
-}): JSX.Element;
-export interface DomMount {
+export interface DomMount<T extends Element = Element> {
     readonly identity: unknown;
     readonly data: unknown;
-    readonly acquire: (element: Element, input: () => unknown) => Work;
+    readonly acquire: (element: T, input: () => unknown) => Work;
 }
 /** Element-owned work. Changed acquisition functions replace and interrupt the prior lifetime. */
-export declare function domMount<T extends Element, R = never>(start: (element: T) => Work<R>, ...provided: [R] extends [never] ? [runtime?: UiRuntime<R>] : [runtime: UiRuntime<R>]): DomMount;
+export declare function domMount<T extends Element, R = never>(start: (element: T) => Work<R>, ...provided: [R] extends [never] ? [runtime?: UiRuntime<R>] : [runtime: UiRuntime<R>]): DomMount<T>;
 /** A stable DOM lifecycle with fresh immutable inputs, for focus, measurements and native events. */
-export declare function domBinding<T extends Element, A, R = never>(data: A, acquire: (element: T, input: () => A) => Work<R>, ...provided: [R] extends [never] ? [runtime?: UiRuntime<R>] : [runtime: UiRuntime<R>]): DomMount;
-export declare function startMount(element: Element, mount: DomMount, report?: ReportError): {
-    update(next: DomMount): boolean;
+export declare function domBinding<T extends Element, A, R = never>(data: A | Snapshot<A>, acquire: (element: T, input: () => Snapshot<A>) => Work<R>, ...provided: [R] extends [never] ? [runtime?: UiRuntime<R>] : [runtime: UiRuntime<R>]): DomMount<T>;
+export declare function startMount<T extends Element>(element: T, mount: DomMount<T>, report?: ReportError): {
+    update(next: DomMount<T>): boolean;
     dispose(): void;
 };
-export {};

package/dist/mount.js

@@ -1,9 +1,7 @@
 import { reportError, reportSafely } from './errors.js';
 import { Effect, Fiber } from 'effect';
 import { defaultUiRuntime } from './runtime.js';
-export function Portal(_props) {
-    throw new Error('Portal must be compiled inside a view');
-}
+export { Portal } from './dom.js';
 /** Element-owned work. Changed acquisition functions replace and interrupt the prior lifetime. */
 export function domMount(start, ...provided) {
     const runtime = provided[0] ?? defaultUiRuntime;

package/dist/owner.d.ts

@@ -1,9 +1,9 @@
 import { type Snapshot } from './snapshot.js';
 import { Effect } from 'effect';
-import { type Program } from './program.js';
+import { type Program, type TaskPolicy, type CommandSlot } from './program.js';
 import { type ReportError } from './errors.js';
 import type { UiRuntime } from './runtime.js';
-export type TaskPolicy = 'replace' | 'drop' | 'parallel';
+export type { TaskPolicy } from './program.js';
 export interface DisposableOwner {
     readonly disposed: boolean;
     readonly own: <A extends {
@@ -13,18 +13,21 @@ export interface DisposableOwner {
 export interface ModelOwner<Model extends object, R = never> extends DisposableOwner {
     readonly source: Program<Model, never>;
     readonly read: () => Snapshot<Model>;
-    readonly patch: (changes: Partial<Model>) => void;
-    readonly edit: <K extends keyof Model>(key: K, change: (value: Snapshot<Model[K]>) => Snapshot<Model[K]>) => void;
+    /** Expose only controller-selected editable fields to a view. */
+    readonly fields: <const Keys extends readonly (keyof Model)[]>(...keys: Keys) => {
+        readonly [K in Keys[number]]: (value: Model[K] | Snapshot<Model[K]>) => void;
+    };
+    readonly patch: (changes: Partial<Model> | Partial<Snapshot<Model>>) => void;
+    readonly edit: <K extends keyof Model>(key: K, change: (value: Snapshot<Model[K]>) => Model[K] | Snapshot<Model[K]>) => void;
     /** Synchronous transaction. Reads see staged changes; a throw discards changes and work. */
     readonly transaction: <A>(work: () => A & (A extends PromiseLike<unknown> ? never : unknown)) => A;
-    readonly run: (slot: string, effect: Effect.Effect<unknown, unknown, R>, policy?: TaskPolicy) => void;
-    readonly cancel: (slot: string) => void;
-    readonly isRunning: (slot: string) => boolean;
+    readonly run: (slot: CommandSlot, effect: Effect.Effect<unknown, unknown, R>, policy: TaskPolicy) => void;
+    readonly cancel: (slot: CommandSlot) => void;
+    readonly isRunning: (slot: CommandSlot) => boolean;
     readonly awaitIdle: () => Promise<void>;
     readonly dispose: () => void;
 }
 type Options = {
-    checkSnapshots?: boolean;
     name?: string;
     onDefect?: ReportError;
 };
@@ -32,4 +35,3 @@ export declare function modelOwner<Model extends object>(initial: Model, options
 export declare function modelOwner<Model extends object, R>(initial: Model, options: Options & {
     runtime: UiRuntime<R>;
 }): ModelOwner<Model, R>;
-export {};

package/dist/owner.js

@@ -1,63 +1,44 @@
-import { protectSnapshot, checkSnapshotsByDefault } from './snapshot.js';
+import { protectSnapshot } from './snapshot.js';
 import { Effect } from 'effect';
-import { program } from './program.js';
+import { program, } from './program.js';
 import { patchModel } from './state.js';
 import { runAll, reportError } from './errors.js';
-/** Immutable model publication and task ownership, using the same program queue as components. */
 export function modelOwner(initial, options = {}) {
-    let disposed = false, nextTask = 0;
+    let disposed = false;
     let staged;
-    const groups = new Map();
     const cleanups = [];
     const source = program({
         initial,
         ...options,
-        update(model, operations) {
+        update(snapshot, operations) {
+            let model = snapshot;
             const single = operations.length === 1 ? operations[0] : undefined;
             if (single?.type === 'Patch')
                 return { model: patchModel(model, single.changes) };
-            const commands = new Map();
+            const commands = [];
             const cancel = new Set();
-            const stop = (slot) => {
-                for (const key of groups.get(slot) ?? []) {
-                    cancel.add(key);
-                    commands.delete(key);
-                }
-                groups.delete(slot);
-            };
             for (const operation of operations) {
                 if (operation.type === 'Patch')
                     model = patchModel(model, operation.changes);
-                else if (operation.type === 'Cancel')
-                    stop(operation.slot);
+                else if (operation.type === 'Cancel') {
+                    cancel.add(operation.slot);
+                    for (let index = commands.length - 1; index >= 0; index--)
+                        if (commands[index].slot === operation.slot)
+                            commands.splice(index, 1);
+                }
                 else {
                     const { slot, effect, policy } = operation;
-                    if (policy === 'drop' && groups.has(slot))
-                        continue;
-                    if (policy === 'replace')
-                        stop(slot);
-                    const key = `${slot}:${++nextTask}`;
-                    const group = groups.get(slot) ?? new Set();
-                    groups.set(slot, group);
-                    group.add(key);
-                    commands.set(key, {
-                        slot: key,
-                        action: Effect.asVoid(effect).pipe(Effect.ensuring(Effect.sync(() => {
-                            group.delete(key);
-                            if (!group.size && groups.get(slot) === group)
-                                groups.delete(slot);
-                        }))),
-                    });
+                    commands.push({ slot, policy, action: Effect.asVoid(effect) });
                 }
             }
             return {
                 model,
                 cancel: [...cancel],
-                commands: [...commands.values()].map((command) => options.runtime ? options.runtime.command(command) : command),
+                commands: commands.map((command) => options.runtime ? options.runtime.command(command) : command),
             };
         },
     });
-    const read = () => protectSnapshot(staged?.model ?? source.model(), options.checkSnapshots ?? checkSnapshotsByDefault);
+    const read = () => protectSnapshot(staged?.model ?? source.model());
     const submit = (operation) => {
         if (disposed)
             return;
@@ -75,17 +56,25 @@ export function modelOwner(initial, options = {}) {
             return;
         disposed = true;
         source.dispose();
-        groups.clear();
         runAll(cleanups.splice(0).reverse(), options.onDefect ?? reportError);
     };
     return {
         source: { model: source.model, send: source.send, subscribe: source.subscribe, dispose },
         read,
         patch,
+        fields: (...keys) => {
+            const controls = Object.create(null);
+            for (const key of keys) {
+                Object.defineProperty(controls, key, {
+                    enumerable: true,
+                    value: (value) => patch({ [key]: value }),
+                });
+            }
+            return Object.freeze(controls);
+        },
         edit: (key, change) => {
             if (!disposed) {
                 const changes = {};
-                // Readonly changes remain immutable model data; no clone is needed for a no-op.
                 changes[key] = change(read()[key]);
                 patch(changes);
             }
@@ -118,9 +107,9 @@ export function modelOwner(initial, options = {}) {
                 staged = parent;
             }
         },
-        run: (slot, effect, policy = 'replace') => submit({ type: 'Run', slot, effect, policy }),
+        run: (slot, effect, policy) => submit({ type: 'Run', slot, effect, policy }),
         cancel: (slot) => submit({ type: 'Cancel', slot }),
-        isRunning: (slot) => groups.has(slot),
+        isRunning: (slot) => source.activeSlots().includes(slot),
         awaitIdle: source.awaitIdle,
         get disposed() {
             return disposed;

package/dist/pages.d.ts

@@ -1,20 +1,23 @@
+import type { Snapshot } from './snapshot.js';
 import { Cause } from 'effect';
 import * as AsyncResult from 'effect/unstable/reactivity/AsyncResult';
 import type { UiLoad, UiPage } from './load.js';
-import { type Transition, type Send } from './program.js';
+import { type Transition, type RunningProgram } from './program.js';
 export interface PagesModel<Props, A, Cursor> {
     readonly props: Props;
     readonly key: string | undefined;
     readonly result: AsyncResult.AsyncResult<UiPage<A, Cursor>, unknown>;
     readonly append: boolean;
 }
-export type PagesMessage<A, Cursor> = {
+export type PagesRequest = {
     type: 'More';
 } | {
     type: 'Retry';
 } | {
     type: 'Refresh';
-} | {
+};
+/** Low-level reducer protocol, including completions for explicit program composition. */
+export type PagesMessage<A, Cursor> = PagesRequest | {
     type: 'Loaded';
     page: UiPage<A, Cursor>;
     append: boolean;
@@ -22,29 +25,26 @@ export type PagesMessage<A, Cursor> = {
     type: 'Failed';
     cause: Cause.Cause<unknown>;
 };
+/** An owned pagination source with immutable input updates. */
+export interface PagesProgram<Props, A, Cursor> extends RunningProgram<PagesModel<Props, A, Cursor>, PagesRequest> {
+    readonly receive: (props: Props | Snapshot<Props>) => void;
+}
+/** Reusable pagination transitions, or an independently owned source through create. */
+export interface Pagination<Props, A, Cursor> {
+    readonly init: (props: Props | Snapshot<Props>) => PagesModel<Props, A, Cursor> | Snapshot<PagesModel<Props, A, Cursor>>;
+    readonly receive: (model: PagesModel<Props, A, Cursor> | Snapshot<PagesModel<Props, A, Cursor>>, props: Props | Snapshot<Props>, options?: {
+        refresh?: boolean;
+    }) => Transition<PagesModel<Props, A, Cursor>, PagesMessage<A, Cursor>>;
+    readonly update: (model: PagesModel<Props, A, Cursor> | Snapshot<PagesModel<Props, A, Cursor>>, message: PagesMessage<A, Cursor>) => Transition<PagesModel<Props, A, Cursor>, PagesMessage<A, Cursor>>;
+    readonly create: (props: Props | Snapshot<Props>) => PagesProgram<Props, A, Cursor>;
+}
 /**
  * Pagination owns the `page` command slot. Key changes clear results and replace the request;
  * same-key refreshes keep the last success, and retries repeat the failed cursor.
  * Feed request inputs through receive; pass { refresh: true } for explicit same-key submissions.
  */
 export declare function pages<Props, A, Cursor>(definition: {
-    key: (props: Props) => string | undefined;
-    load: (props: Props, cursor: Cursor | undefined) => UiLoad<UiPage<A, Cursor>>;
-    itemKey: (item: A) => string;
-}): {
-    /** Own pagination directly in a controller; components can use the same reducer. */
-    create(props: Props): {
-        send: Send<PagesMessage<A, Cursor>>;
-        receive: (props: Props) => void;
-        activeSlots: () => readonly string[];
-        awaitIdle: (slot?: string) => Promise<void>;
-        model: () => Readonly<PagesModel<Props, A, Cursor>>;
-        subscribe: (listener: (model: Readonly<PagesModel<Props, A, Cursor>>) => void) => () => void;
-        dispose: () => void;
-    };
-    init: (props: Props) => PagesModel<Props, A, Cursor>;
-    receive(model: PagesModel<Props, A, Cursor>, props: Props, options?: {
-        refresh?: boolean;
-    }): Transition<PagesModel<Props, A, Cursor>, PagesMessage<A, Cursor>>;
-    update(model: PagesModel<Props, A, Cursor>, message: PagesMessage<A, Cursor>): Transition<PagesModel<Props, A, Cursor>, PagesMessage<A, Cursor>>;
-};
+    key: (props: Snapshot<Props>) => string | undefined;
+    load: (props: Snapshot<Props>, cursor: Snapshot<Cursor> | undefined) => UiLoad<UiPage<A, Cursor>>;
+    itemKey: (item: Snapshot<A>) => string;
+}): Pagination<Props, A, Cursor>;