@expressive/mvc 0.88.0 → 0.90.0

package/README.md

@@ -11,9 +11,9 @@
 
 ---
 
-The core of [Expressive MVC](https://github.com/gabeklein/expressive-mvc): reactive primitives built around plain classes, with no framework dependency. Provides the `State` model, instructions, context, and the renderer-agnostic `Component` that adapters like [`@expressive/react`](https://www.npmjs.com/package/@expressive/react) build on.
+The core of [Expressive MVC](https://github.com/gabeklein/expressive-mvc): reactive primitives built around plain classes, with no framework dependency. Provides the `Model` class, instructions, context, and the renderer-agnostic `Component` that adapters like [`@expressive/react`](https://www.npmjs.com/package/@expressive/react) build on.
 
-> **Building a React app?** Install [`@expressive/react`](https://www.npmjs.com/package/@expressive/react) alongside this package - the adapter declares `@expressive/mvc` as a peer dependency, so both belong in your `package.json`. Import `State`, `Component`, and every instruction from this package, and import the adapter once from your entry so the host registers. The same holds for [`@expressive/dom`](https://www.npmjs.com/package/@expressive/dom), the renderer without React.
+> **Building a React app?** Install [`@expressive/react`](https://www.npmjs.com/package/@expressive/react) alongside this package - the adapter declares `@expressive/mvc` as a peer dependency, so both belong in your `package.json`. Import `Model`, `Component`, and every instruction from this package, and import the adapter once from your entry so the host registers. The same holds for [`@expressive/dom`](https://www.npmjs.com/package/@expressive/dom), the renderer without React.
 
 Installed alone, it serves host-agnostic code - a shared domain package, a Node service, or a new adapter:
 
@@ -21,14 +21,14 @@ Installed alone, it serves host-agnostic code - a shared domain package, a Node
 npm install @expressive/mvc
 ```
 
-## State
+## Model
 
-A `State` is a class whose fields are reactive - read to subscribe, assign to update. Getters are cached computed values.
+A `Model` is a class whose fields are reactive - read to subscribe, assign to update. Getters are cached computed values.
 
 ```ts
-import { State } from '@expressive/mvc';
+import { Model } from '@expressive/mvc';
 
-class Counter extends State {
+class Counter extends Model {
   count = 0;
   increment = () => this.count++;
 
@@ -47,7 +47,7 @@ counter.get(({ count }) => {
 counter.increment();           // -> "count is 1"
 ```
 
-Models run and test anywhere - no renderer required.
+Instances run and test anywhere - no renderer required.
 
 ## Instructions
 
@@ -57,14 +57,14 @@ Field initializers that change how a property behaves:
 |---|---|
 | `ref()` | a mutable reference (e.g. a DOM node) that's still reactive |
 | `set()` | computed values, smart setters, side-effects on assignment |
-| `get()` | dependency injection - pull another `State` from context |
+| `get()` | dependency injection - pull another `Model` from context |
 | `map()` | a shallow-reactive Map |
 | `has()` | an owned reactive collection - an ordered list or a spawned pool |
 
 ```ts
-import { State, set, has, map } from '@expressive/mvc';
+import { Model, set, has, map } from '@expressive/mvc';
 
-class Cart extends State {
+class Cart extends Model {
   items = has<Item>();                      // reactive collection
   products = map<string, Product>();        // reactive keyed collection
   coupon = set('', code => apply(code));    // side-effect on assignment
@@ -74,7 +74,7 @@ class Cart extends State {
 ## Lifecycle
 
 ```ts
-class Timer extends State {
+class Timer extends Model {
   seconds = 0;
 
   new() {                              // runs once on activation
@@ -89,22 +89,22 @@ timer.set(null);             // destroy - runs cleanup, freezes state
 
 ## Context & composition
 
-States find each other through context, and compose by holding one another:
+Instances find each other through context, and compose by holding one another:
 
 ```ts
-import { State, get } from '@expressive/mvc';
+import { Model, get } from '@expressive/mvc';
 
-class Session extends State {
+class Session extends Model {
   user = 'guest';
 }
 
-class Profile extends State {
+class Profile extends Model {
   session = get(Session);    // injected from the nearest provider
-  address = new Address();   // nested state - its changes bubble up
+  address = new Address();   // nested instance - its changes bubble up
 }
 ```
 
-An adapter (e.g. [`@expressive/react`](https://www.npmjs.com/package/@expressive/react)) supplies the provider that places a `State` in a tree; `get()` pulls it back out.
+An adapter (e.g. [`@expressive/react`](https://www.npmjs.com/package/@expressive/react)) supplies the provider that places a `Model` in a tree; `get()` pulls it back out.
 
 ## Events
 
@@ -130,7 +130,7 @@ off();                                                // stop listening
 }
 ```
 
-`Component` - a `State` that renders - lives here as the agnostic base. For using it in an app (rendering, props, subcomponents, suspense), see **[`@expressive/react`](https://www.npmjs.com/package/@expressive/react)**.
+`Component` - a `Model` usable in JSX - lives here as the agnostic base. For using it in an app (rendering, props, subcomponents, suspense), see **[`@expressive/react`](https://www.npmjs.com/package/@expressive/react)**.
 
 ---
 

package/dist/component.d.ts

@@ -1,21 +1,21 @@
-import { State } from "./state.js";
+import { Model } from "./state.js";
 import { Host } from "./jsx-runtime.js";
 
 //#region src/component.d.ts
 type IfEquals<X, Y, A, B> = (<T>() => T extends X ? 1 : 2) extends (<T>() => T extends Y ? 1 : 2) ? A : B;
 /** Keys of T which are settable (excludes get-only accessors and `readonly`). */
 type Acceptable<T> = { [P in keyof T]-?: IfEquals<{ [Q in P]: T[P] }, { -readonly [Q in P]: T[P] }, P, never> }[keyof T];
-type ForProps<T extends State> = {
+type ForProps<T extends Model> = {
   children?: Component.Node;
   fallback?: Component.Node | false;
   catch?: (error: Error, instance: Component) => Promise<void> | void;
 } & ({
-  for: State.Extends<T>;
+  for: Model.Extends<T>;
   is?: (instance: T) => void;
 } | {
   for: T | undefined;
   is?: never;
-}) & { [K in Exclude<keyof T, keyof State> & Acceptable<T>]?: T[K] };
+}) & { [K in Exclude<keyof T, keyof Model> & Acceptable<T>]?: T[K] };
 declare namespace Component {
   /**
    * Host element type produced by `Component.render`. Delegates to the
@@ -49,22 +49,24 @@ declare namespace Component {
      */
     catch?(error: Error, instance: T): Promise<void> | void;
   }
-  type StateProps<T extends State> = { [K in Exclude<keyof T, keyof Component> & Acceptable<T>]?: T[K] };
+  type ModelProps<T extends Model> = { [K in Exclude<keyof T, keyof Component> & Acceptable<T>]?: T[K] };
+  /** @deprecated Renamed to `ModelProps`. */
+  type StateProps<T extends Model> = ModelProps<T>;
   type RenderProps<T> = [T] extends [(props: infer P) => any] ? [keyof NonNullable<P>] extends [never] ? {
     children?: Component.Node;
   } : NonNullable<P> : {
     children?: Component.Node;
   };
-  type Props<T extends Component<any>> = StateProps<T> & BaseProps<T> & RenderProps<T['render']>;
+  type Props<T extends Component<any>> = ModelProps<T> & BaseProps<T> & RenderProps<T['render']>;
 }
-declare class Component<P = unknown> extends State {
+declare class Component<P = unknown> extends Model {
   /**
    * All JSX attributes passed to this component.
    * Includes state-derived props, render props, and built-in props like `is` and `fallback`.
    *
    * Will incorperate extra props you declare as props parameter in `render` method.
    */
-  readonly props: [P] extends [State] ? ForProps<P> : Component.Props<this>;
+  readonly props: [P] extends [Model] ? ForProps<P> : Component.Props<this>;
   /** Stable identity used when this instance is rendered in a collection. */
   readonly key: string;
   /**
@@ -86,8 +88,6 @@ declare class Component<P = unknown> extends State {
    * props from JSX, beyond those merged to state properties; declare its shape
    * via `props = {} as { ... }`. Without a parameter (the default below),
    * children pass through.
-   *
-   * The constructor installs a composed `render` per instance.
    */
   render(props?: {}): Component.Node;
   /**
@@ -101,14 +101,6 @@ declare class Component<P = unknown> extends State {
    */
   catch?(error: Error, instance: this): Promise<void> | void;
 }
-/**
- * Render `this` through its class's composed content render: content renders
- * up the prototype chain, each base layer receiving the subclass's as a lazy
- * `children` getter. Falls back to passing `children` through.
- */
-declare function compose(this: State, props?: {}): any;
-/** Drop composed renders, so each is rebuilt from current prototypes. */
-declare function rechain(): void;
 //#endregion
-export { Component, compose, rechain };
+export { Component };
 //# sourceMappingURL=component.d.ts.map

package/dist/component.js

@@ -1,12 +1,10 @@
-import { State, adopt, trailing, unbind } from "./state.js";
+import { Model, adopt, trailing } from "./state.js";
 import { Context } from "./context.js";
 import { set } from "./field/set.js";
 
 //#region src/component.ts
 const PENDING = /* @__PURE__ */ new WeakMap();
-/** Per-class composed content render. */
-let CHAIN = /* @__PURE__ */ new WeakMap();
-var Component = class Component extends State {
+var Component = class Component extends Model {
 	/**
 	* Content to display while this component or its children are suspended.
 	* Will cover suspense by pending properties in `this.render` as well.
@@ -50,11 +48,6 @@ var Component = class Component extends State {
 		this.set("props", () => {
 			this.set(merge(this.props));
 		});
-		Object.defineProperty(this, "render", {
-			writable: true,
-			configurable: true,
-			value: compose
-		});
 	}
 	/**
 	* Output for this component. Override to define custom JSX.
@@ -64,8 +57,6 @@ var Component = class Component extends State {
 	* props from JSX, beyond those merged to state properties; declare its shape
 	* via `props = {} as { ... }`. Without a parameter (the default below),
 	* children pass through.
-	*
-	* The constructor installs a composed `render` per instance.
 	*/
 	render(props) {
 		const { children } = props || this.props;
@@ -120,7 +111,7 @@ function provide(self) {
 		if (next !== input) {
 			input = next;
 			unmount();
-			if (State.is(next)) {
+			if (Model.is(next)) {
 				adopt(self, "for", target = new next(rest));
 				owned = target;
 				is?.(target);
@@ -128,51 +119,14 @@ function provide(self) {
 				return;
 			}
 			owned = void 0;
-			adopt(self, "for", target = next instanceof State ? next : void 0);
+			adopt(self, "for", target = next instanceof Model ? next : void 0);
 		}
 		target?.set(rest);
 	}
 	sync();
 	self.set("props", sync);
 }
-/**
-* Render `this` through its class's composed content render: content renders
-* up the prototype chain, each base layer receiving the subclass's as a lazy
-* `children` getter. Falls back to passing `children` through.
-*/
-function compose(props) {
-	const type = this.constructor;
-	let render = CHAIN.get(type);
-	if (!render) {
-		for (let T = type; T !== Component && T !== State; T = Object.getPrototypeOf(T)) {
-			const next = method(T);
-			if (next) render = render ? wrap(next, render) : next;
-		}
-		if (!render) render = method(Component);
-		CHAIN.set(type, render);
-	}
-	return render.call(this, props);
-}
-function method(from) {
-	const desc = Object.getOwnPropertyDescriptor(from.prototype, "render");
-	if (desc) return unbind(desc.get || desc.value);
-}
-function wrap(outer, inner) {
-	return function(props) {
-		const self = this;
-		return outer.call(self, {
-			...props,
-			get children() {
-				return inner.call(self, props);
-			}
-		});
-	};
-}
-/** Drop composed renders, so each is rebuilt from current prototypes. */
-function rechain() {
-	CHAIN = /* @__PURE__ */ new WeakMap();
-}
 
 //#endregion
-export { Component, compose, rechain };
+export { Component };
 //# sourceMappingURL=component.js.map

package/dist/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","names":[],"sources":["../src/component.ts"],"sourcesContent":["import { Context } from './context';\nimport { set } from './field/set';\nimport { State, adopt, trailing, unbind } from './state';\n\nimport type { Host } from './jsx-runtime';\n\nconst PENDING = new WeakMap<object, Component<any>>();\n\n/** Per-class composed content render. */\nlet CHAIN = new WeakMap<Function, Function>();\n\ntype IfEquals<X, Y, A, B> =\n  (<T>() => T extends X ? 1 : 2) extends\n  (<T>() => T extends Y ? 1 : 2) ? A : B;\n\n/** Keys of T which are settable (excludes get-only accessors and `readonly`). */\ntype Acceptable<T> = {\n  [P in keyof T]-?: IfEquals<\n    { [Q in P]: T[P] },\n    { -readonly [Q in P]: T[P] },\n    P, never\n  >;\n}[keyof T];\n\ntype ForProps<T extends State> = {\n  children?: Component.Node;\n  fallback?: Component.Node | false;\n  catch?: (error: Error, instance: Component) => Promise<void> | void;\n} & (\n  | { for: State.Extends<T>; is?: (instance: T) => void }\n  | { for: T | undefined; is?: never }\n) & { [K in Exclude<keyof T, keyof State> & Acceptable<T>]?: T[K] };\n\ndeclare namespace Component {\n  /**\n   * Host element type produced by `Component.render`. Delegates to the\n   * {@link Host} manifest on the jsx-runtime entry; falls back to `any`\n   * until an adapter augments it with `node`. `any` (not `unknown`) so an\n   * un-annotated `render` override in a host-agnostic package still emits a\n   * JSX-valid return - `any` is assignable to every host's node type, where\n   * `unknown` is assignable to none.\n   */\n  type Node = Host extends { node: infer T } ? T : any;\n\n  interface BaseProps<T extends Component<any>> {\n    /**\n     * Callback for newly created instance. Only called once.\n     *\n     * Runs after props apply but **before** the `new()` lifecycle hook - so it\n     * may configure state that `new()` then observes. To react to a fully\n     * initialized instance instead, use `watch` or an effect.\n     */\n    is?(instance: T): void;\n\n    /**\n     * Fallback to show when suspended or in error recovery.\n     * Pass `false` to opt out of the component's own suspense boundary,\n     * letting suspension bubble to an ancestor.\n     */\n    fallback?: Component.Node;\n\n    /**\n     * Called when this element's content throws, in place of the class's own\n     * `catch`. A returned promise retries once settled.\n     */\n    catch?(error: Error, instance: T): Promise<void> | void;\n  }\n\n  type StateProps<T extends State> = {\n    [K in Exclude<keyof T, keyof Component> & Acceptable<T>]?: T[K];\n  };\n\n  type RenderProps<T> = [T] extends [(props: infer P) => any]\n    ? [keyof NonNullable<P>] extends [never]\n    ? { children?: Component.Node }\n    : NonNullable<P>\n    : { children?: Component.Node };\n\n  type Props<T extends Component<any>> =\n    & StateProps<T>\n    & BaseProps<T>\n    & RenderProps<T['render']>;\n}\n\nclass Component<P = unknown> extends State {\n  /**\n   * All JSX attributes passed to this component.\n   * Includes state-derived props, render props, and built-in props like `is` and `fallback`.\n   *\n   * Will incorperate extra props you declare as props parameter in `render` method.\n   */\n  declare readonly props: [P] extends [State] ? ForProps<P> : Component.Props<this>;\n\n  /** Stable identity used when this instance is rendered in a collection. */\n  declare readonly key: string;\n\n  /**\n   * Content to display while this component or its children are suspended.\n   * Will cover suspense by pending properties in `this.render` as well.\n   * Can be set as a class property or overridden via the `fallback` JSX prop.\n   *\n   * Defaults to null - nothing will be rendered.\n   * Set `false` to opt out of having a boundary at all - suspension then\n   * bubbles to the nearest ancestor boundary.\n   */\n  fallback: Component.Node = set(null);\n\n  constructor(props?: any, ...rest: any[]) {\n    if (props == null) props = {};\n\n    const seen = {} as Record<string, undefined>;\n    const twin = PENDING.get(props);\n    const provider = new.target === Component && 'for' in props;\n\n    if (typeof props == 'object') merge(props);\n\n    function merge(props: {}) {\n      for (const k in props) seen[k] = undefined;\n      return { ...seen, ...props };\n    }\n\n    super([\n      props,\n      rest.filter((x) => !(x instanceof Context)),\n      () => {\n        const other = twin || PENDING.get(props)!;\n\n        if (other !== this) {\n          trailing(other).forEach((orphan) => orphan.set(null));\n          other.set(null);\n        }\n\n        if (provider) provide(this);\n        else props.is?.(this);\n\n        Object.defineProperty(this, 'props', { enumerable: false });\n        PENDING.delete(props);\n      }\n    ]);\n\n    PENDING.set(props, this);\n\n    this.props = props;\n    this.set('props', () => {\n      this.set(merge(this.props));\n    });\n\n    Object.defineProperty(this, 'render', {\n      writable: true,\n      configurable: true,\n      value: compose\n    });\n  }\n\n  /**\n   * Output for this component. Override to define custom JSX.\n   *\n   * Properties accessed via `this` are reactive and trigger a render when they\n   * change, in addition to props. Accepts an optional parameter to receive extra\n   * props from JSX, beyond those merged to state properties; declare its shape\n   * via `props = {} as { ... }`. Without a parameter (the default below),\n   * children pass through.\n   *\n   * The constructor installs a composed `render` per instance.\n   */\n  render(props?: {}): Component.Node {\n    const { children } = (props || this.props) as { children?: Component.Node };\n    return children || null;\n  }\n\n  /**\n   * Called when a child component throws during render.\n   * While this is pending, `fallback` is displayed.\n   * When resolved, the error boundary resets and `render` is called again.\n   *\n   * Override to handle errors - set `this.fallback` for error-specific UI,\n   * await async recovery, or await user interaction before retrying. If you\n   * assign a fallback within catch, it will be reverted after resolved.\n   */\n  catch?(error: Error, instance: this): Promise<void> | void;\n}\n\n/**\n * Default `key` accessor. The get/set pair keeps it off observed state.\n */\nObject.defineProperty(Component.prototype, 'key', {\n  configurable: true,\n  get() {\n    return String(this);\n  },\n  set(value) {\n    Object.defineProperty(this, 'key', { value });\n  }\n});\n\nComponent.on({\n  setup(self) {\n    const key = Object.getOwnPropertyDescriptor(self, 'key');\n\n    if (key?.configurable)\n      Object.defineProperty(self, 'key', {\n        enumerable: false,\n        writable: false\n      });\n  }\n});\n\nfunction provide(self: Component<any>) {\n  let input: unknown;\n  let target: State | undefined;\n  let owned: { mount?(): unknown } | undefined;\n  let mounted = false;\n  let release: unknown;\n\n  function unmount() {\n    if (typeof release == 'function') release();\n    release = undefined;\n  }\n\n  const inherited = (self as { mount?(): unknown }).mount;\n\n  Object.defineProperty(self, 'mount', {\n    configurable: true,\n    value() {\n      const done = inherited?.call(self);\n\n      mounted = true;\n      release = owned?.mount?.();\n\n      return () => {\n        mounted = false;\n        unmount();\n        if (typeof done == 'function') done();\n      };\n    }\n  });\n\n  function sync() {\n    const { for: next, is, children, fallback, catch: _catch, ...rest } = self.props as Record<string, any>;\n\n    if (fallback === undefined) self.fallback = false;\n\n    if (next !== input) {\n      input = next;\n      unmount();\n\n      if (State.is(next)) {\n        adopt(self, 'for', (target = new (next as State.Type)(rest)));\n        owned = target as typeof owned;\n        is?.(target);\n        if (mounted) release = owned!.mount?.();\n        return;\n      }\n\n      owned = undefined;\n      adopt(self, 'for', (target = next instanceof State ? next : undefined));\n    }\n\n    target?.set(rest);\n  }\n\n  sync();\n  self.set('props', sync);\n}\n\n/**\n * Render `this` through its class's composed content render: content renders\n * up the prototype chain, each base layer receiving the subclass's as a lazy\n * `children` getter. Falls back to passing `children` through.\n */\nfunction compose(this: State, props?: {}) {\n  const type = this.constructor;\n  let render = CHAIN.get(type);\n\n  if (!render) {\n    for (let T = type; T !== Component && T !== State; T = Object.getPrototypeOf(T)) {\n      const next = method(T);\n\n      if (next) render = render ? wrap(next, render) : next;\n    }\n\n    if (!render) render = method(Component)!;\n\n    CHAIN.set(type, render);\n  }\n\n  return render.call(this, props);\n}\n\nfunction method(from: Function) {\n  const desc = Object.getOwnPropertyDescriptor(from.prototype, 'render');\n  if (desc) return unbind(desc.get || desc.value) as Function;\n}\n\nfunction wrap(outer: Function, inner: Function): Function {\n  return function (this: State, props?: {}) {\n    const self = this;\n    return outer.call(self, {\n      ...props,\n      get children() {\n        return inner.call(self, props);\n      }\n    });\n  };\n}\n\n/** Drop composed renders, so each is rebuilt from current prototypes. */\nfunction rechain() {\n  CHAIN = new WeakMap();\n}\n\nexport { Component, compose, rechain };\n"],"mappings":"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"}
+{"version":3,"file":"component.js","names":[],"sources":["../src/component.ts"],"sourcesContent":["import { Context } from './context';\nimport { set } from './field/set';\nimport { Model, adopt, trailing } from './state';\n\nimport type { Host } from './jsx-runtime';\n\nconst PENDING = new WeakMap<object, Component<any>>();\n\ntype IfEquals<X, Y, A, B> =\n  (<T>() => T extends X ? 1 : 2) extends\n  (<T>() => T extends Y ? 1 : 2) ? A : B;\n\n/** Keys of T which are settable (excludes get-only accessors and `readonly`). */\ntype Acceptable<T> = {\n  [P in keyof T]-?: IfEquals<\n    { [Q in P]: T[P] },\n    { -readonly [Q in P]: T[P] },\n    P, never\n  >;\n}[keyof T];\n\ntype ForProps<T extends Model> = {\n  children?: Component.Node;\n  fallback?: Component.Node | false;\n  catch?: (error: Error, instance: Component) => Promise<void> | void;\n} & (\n  | { for: Model.Extends<T>; is?: (instance: T) => void }\n  | { for: T | undefined; is?: never }\n) & { [K in Exclude<keyof T, keyof Model> & Acceptable<T>]?: T[K] };\n\ndeclare namespace Component {\n  /**\n   * Host element type produced by `Component.render`. Delegates to the\n   * {@link Host} manifest on the jsx-runtime entry; falls back to `any`\n   * until an adapter augments it with `node`. `any` (not `unknown`) so an\n   * un-annotated `render` override in a host-agnostic package still emits a\n   * JSX-valid return - `any` is assignable to every host's node type, where\n   * `unknown` is assignable to none.\n   */\n  type Node = Host extends { node: infer T } ? T : any;\n\n  interface BaseProps<T extends Component<any>> {\n    /**\n     * Callback for newly created instance. Only called once.\n     *\n     * Runs after props apply but **before** the `new()` lifecycle hook - so it\n     * may configure state that `new()` then observes. To react to a fully\n     * initialized instance instead, use `watch` or an effect.\n     */\n    is?(instance: T): void;\n\n    /**\n     * Fallback to show when suspended or in error recovery.\n     * Pass `false` to opt out of the component's own suspense boundary,\n     * letting suspension bubble to an ancestor.\n     */\n    fallback?: Component.Node;\n\n    /**\n     * Called when this element's content throws, in place of the class's own\n     * `catch`. A returned promise retries once settled.\n     */\n    catch?(error: Error, instance: T): Promise<void> | void;\n  }\n\n  type ModelProps<T extends Model> = {\n    [K in Exclude<keyof T, keyof Component> & Acceptable<T>]?: T[K];\n  };\n\n  /** @deprecated Renamed to `ModelProps`. */\n  type StateProps<T extends Model> = ModelProps<T>;\n\n  type RenderProps<T> = [T] extends [(props: infer P) => any]\n    ? [keyof NonNullable<P>] extends [never]\n    ? { children?: Component.Node }\n    : NonNullable<P>\n    : { children?: Component.Node };\n\n  type Props<T extends Component<any>> =\n    & ModelProps<T>\n    & BaseProps<T>\n    & RenderProps<T['render']>;\n}\n\nclass Component<P = unknown> extends Model {\n  /**\n   * All JSX attributes passed to this component.\n   * Includes state-derived props, render props, and built-in props like `is` and `fallback`.\n   *\n   * Will incorperate extra props you declare as props parameter in `render` method.\n   */\n  declare readonly props: [P] extends [Model] ? ForProps<P> : Component.Props<this>;\n\n  /** Stable identity used when this instance is rendered in a collection. */\n  declare readonly key: string;\n\n  /**\n   * Content to display while this component or its children are suspended.\n   * Will cover suspense by pending properties in `this.render` as well.\n   * Can be set as a class property or overridden via the `fallback` JSX prop.\n   *\n   * Defaults to null - nothing will be rendered.\n   * Set `false` to opt out of having a boundary at all - suspension then\n   * bubbles to the nearest ancestor boundary.\n   */\n  fallback: Component.Node = set(null);\n\n  constructor(props?: any, ...rest: any[]) {\n    if (props == null) props = {};\n\n    const seen = {} as Record<string, undefined>;\n    const twin = PENDING.get(props);\n    const provider = new.target === Component && 'for' in props;\n\n    if (typeof props == 'object') merge(props);\n\n    function merge(props: {}) {\n      for (const k in props) seen[k] = undefined;\n      return { ...seen, ...props };\n    }\n\n    super([\n      props,\n      rest.filter((x) => !(x instanceof Context)),\n      () => {\n        const other = twin || PENDING.get(props)!;\n\n        if (other !== this) {\n          trailing(other).forEach((orphan) => orphan.set(null));\n          other.set(null);\n        }\n\n        if (provider) provide(this);\n        else props.is?.(this);\n\n        Object.defineProperty(this, 'props', { enumerable: false });\n        PENDING.delete(props);\n      }\n    ]);\n\n    PENDING.set(props, this);\n\n    this.props = props;\n    this.set('props', () => {\n      this.set(merge(this.props));\n    });\n  }\n\n  /**\n   * Output for this component. Override to define custom JSX.\n   *\n   * Properties accessed via `this` are reactive and trigger a render when they\n   * change, in addition to props. Accepts an optional parameter to receive extra\n   * props from JSX, beyond those merged to state properties; declare its shape\n   * via `props = {} as { ... }`. Without a parameter (the default below),\n   * children pass through.\n   */\n  render(props?: {}): Component.Node {\n    const { children } = (props || this.props) as { children?: Component.Node };\n    return children || null;\n  }\n\n  /**\n   * Called when a child component throws during render.\n   * While this is pending, `fallback` is displayed.\n   * When resolved, the error boundary resets and `render` is called again.\n   *\n   * Override to handle errors - set `this.fallback` for error-specific UI,\n   * await async recovery, or await user interaction before retrying. If you\n   * assign a fallback within catch, it will be reverted after resolved.\n   */\n  catch?(error: Error, instance: this): Promise<void> | void;\n}\n\n/**\n * Default `key` accessor. The get/set pair keeps it off observed state.\n */\nObject.defineProperty(Component.prototype, 'key', {\n  configurable: true,\n  get() {\n    return String(this);\n  },\n  set(value) {\n    Object.defineProperty(this, 'key', { value });\n  }\n});\n\nComponent.on({\n  setup(self) {\n    const key = Object.getOwnPropertyDescriptor(self, 'key');\n\n    if (key?.configurable)\n      Object.defineProperty(self, 'key', {\n        enumerable: false,\n        writable: false\n      });\n  }\n});\n\nfunction provide(self: Component<any>) {\n  let input: unknown;\n  let target: Model | undefined;\n  let owned: { mount?(): unknown } | undefined;\n  let mounted = false;\n  let release: unknown;\n\n  function unmount() {\n    if (typeof release == 'function') release();\n    release = undefined;\n  }\n\n  const inherited = (self as { mount?(): unknown }).mount;\n\n  Object.defineProperty(self, 'mount', {\n    configurable: true,\n    value() {\n      const done = inherited?.call(self);\n\n      mounted = true;\n      release = owned?.mount?.();\n\n      return () => {\n        mounted = false;\n        unmount();\n        if (typeof done == 'function') done();\n      };\n    }\n  });\n\n  function sync() {\n    const { for: next, is, children, fallback, catch: _catch, ...rest } = self.props as Record<string, any>;\n\n    if (fallback === undefined) self.fallback = false;\n\n    if (next !== input) {\n      input = next;\n      unmount();\n\n      if (Model.is(next)) {\n        adopt(self, 'for', (target = new (next as Model.Type)(rest)));\n        owned = target as typeof owned;\n        is?.(target);\n        if (mounted) release = owned!.mount?.();\n        return;\n      }\n\n      owned = undefined;\n      adopt(self, 'for', (target = next instanceof Model ? next : undefined));\n    }\n\n    target?.set(rest);\n  }\n\n  sync();\n  self.set('props', sync);\n}\n\nexport { Component };\n"],"mappings":";;;;;AAMA,MAAM,0BAAU,IAAI,SAAiC;AA8ErD,IAAM,YAAN,MAAM,kBAA+B,MAAM;;;;;;;;;;CAqBzC,WAA2B,IAAI,KAAK;CAEpC,YAAY,OAAa,GAAG,MAAa;AACvC,MAAI,SAAS,KAAM,SAAQ,EAAE;EAE7B,MAAM,OAAO,EAAE;EACf,MAAM,OAAO,QAAQ,IAAI,MAAM;EAC/B,MAAM,WAAW,IAAI,WAAW,aAAa,SAAS;AAEtD,MAAI,OAAO,SAAS,SAAU,OAAM,MAAM;EAE1C,SAAS,MAAM,OAAW;AACxB,QAAK,MAAM,KAAK,MAAO,MAAK,KAAK;AACjC,UAAO;IAAE,GAAG;IAAM,GAAG;IAAO;;AAG9B,QAAM;GACJ;GACA,KAAK,QAAQ,MAAM,EAAE,aAAa,SAAS;SACrC;IACJ,MAAM,QAAQ,QAAQ,QAAQ,IAAI,MAAM;AAExC,QAAI,UAAU,MAAM;AAClB,cAAS,MAAM,CAAC,SAAS,WAAW,OAAO,IAAI,KAAK,CAAC;AACrD,WAAM,IAAI,KAAK;;AAGjB,QAAI,SAAU,SAAQ,KAAK;QACtB,OAAM,KAAK,KAAK;AAErB,WAAO,eAAe,MAAM,SAAS,EAAE,YAAY,OAAO,CAAC;AAC3D,YAAQ,OAAO,MAAM;;GAExB,CAAC;AAEF,UAAQ,IAAI,OAAO,KAAK;AAExB,OAAK,QAAQ;AACb,OAAK,IAAI,eAAe;AACtB,QAAK,IAAI,MAAM,KAAK,MAAM,CAAC;IAC3B;;;;;;;;;;;CAYJ,OAAO,OAA4B;EACjC,MAAM,EAAE,aAAc,SAAS,KAAK;AACpC,SAAO,YAAY;;;;;;AAkBvB,OAAO,eAAe,UAAU,WAAW,OAAO;CAChD,cAAc;CACd,MAAM;AACJ,SAAO,OAAO,KAAK;;CAErB,IAAI,OAAO;AACT,SAAO,eAAe,MAAM,OAAO,EAAE,OAAO,CAAC;;CAEhD,CAAC;AAEF,UAAU,GAAG,EACX,MAAM,MAAM;AAGV,KAFY,OAAO,yBAAyB,MAAM,MAAM,EAE/C,aACP,QAAO,eAAe,MAAM,OAAO;EACjC,YAAY;EACZ,UAAU;EACX,CAAC;GAEP,CAAC;AAEF,SAAS,QAAQ,MAAsB;CACrC,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI,UAAU;CACd,IAAI;CAEJ,SAAS,UAAU;AACjB,MAAI,OAAO,WAAW,WAAY,UAAS;AAC3C,YAAU;;CAGZ,MAAM,YAAa,KAA+B;AAElD,QAAO,eAAe,MAAM,SAAS;EACnC,cAAc;EACd,QAAQ;GACN,MAAM,OAAO,WAAW,KAAK,KAAK;AAElC,aAAU;AACV,aAAU,OAAO,SAAS;AAE1B,gBAAa;AACX,cAAU;AACV,aAAS;AACT,QAAI,OAAO,QAAQ,WAAY,OAAM;;;EAG1C,CAAC;CAEF,SAAS,OAAO;EACd,MAAM,EAAE,KAAK,MAAM,IAAI,UAAU,UAAU,OAAO,QAAQ,GAAG,SAAS,KAAK;AAE3E,MAAI,aAAa,OAAW,MAAK,WAAW;AAE5C,MAAI,SAAS,OAAO;AAClB,WAAQ;AACR,YAAS;AAET,OAAI,MAAM,GAAG,KAAK,EAAE;AAClB,UAAM,MAAM,OAAQ,SAAS,IAAK,KAAoB,KAAK,CAAE;AAC7D,YAAQ;AACR,SAAK,OAAO;AACZ,QAAI,QAAS,WAAU,MAAO,SAAS;AACvC;;AAGF,WAAQ;AACR,SAAM,MAAM,OAAQ,SAAS,gBAAgB,QAAQ,OAAO,OAAW;;AAGzE,UAAQ,IAAI,KAAK;;AAGnB,OAAM;AACN,MAAK,IAAI,SAAS,KAAK"}

package/dist/context.d.ts

@@ -1,56 +1,43 @@
-import { State } from "./state.js";
+import { Model } from "./state.js";
 
 //#region src/context.d.ts
-type Accept<T extends State = State> = T | State.Type<T> | Record<string | number, T | State.Type<T>>;
-type Expect<T extends State = State> = (state: T, downstream: boolean) => (() => void) | void;
+type Accept<T extends Model = Model> = T | Model.Type<T> | Record<string | number, T | Model.Type<T>>;
+type Expect<T extends Model = Model> = (state: T, downstream: boolean) => (() => void) | void;
 declare namespace Context {
   export { Accept, Expect };
 }
 declare class Context {
   static get root(): Context;
-  /** Get the context for a State. Adapters may override to provide framework context. */
-  static get(state?: State): Context;
+  /** Get the context for a Model. Adapters may override to provide framework context. */
+  static get(state?: Model): Context;
   id: string;
   parent?: Context;
   scope: Set<Context>;
-  consume: Map<State.Extends<State>, Set<[Expect<State>, boolean | undefined]> | null>;
-  provide: Map<State.Extends<State>, Set<[State, boolean]> | null>;
-  protected inputs: Record<string | number, State | State.Extends>;
-  private cleanup;
+  consume: Map<Model.Extends<Model>, Set<[Expect<Model>, boolean | undefined]> | null>;
+  provide: Map<Model.Extends<Model>, Set<[Model, boolean]> | null>;
   constructor(arg?: Context | Accept);
   private traverse;
   private register;
   /** Find specified type upstream. Throws if not found. */
-  get<T extends State>(Type: State.Extends<T>, required?: true): T;
+  get<T extends Model>(Type: Model.Extends<T>, required?: true): T;
   /** Find specified type upstream. Returns undefined if not found. */
-  get<T extends State>(Type: State.Extends<T>, required?: boolean): T | undefined;
+  get<T extends Model>(Type: Model.Extends<T>, required?: boolean): T | undefined;
   /** Subscribe to a type becoming available in context. */
-  get<T extends State>(Type: State.Extends<T>, callback: Expect<T>, downstream?: boolean): () => void;
-  /** Lookup excluding a specific instance (used by State.prototype.get for upstream-of-self semantics). */
-  get<T extends State>(Type: State.Extends<T>, arg: boolean | Expect<T> | undefined, downstream: boolean | undefined, skip: State): T | undefined | (() => void);
+  get<T extends Model>(Type: Model.Extends<T>, callback: Expect<T>, downstream?: boolean): () => void;
+  /** Lookup excluding a specific instance (used by Model.prototype.get for upstream-of-self semantics). */
+  get<T extends Model>(Type: Model.Extends<T>, arg: boolean | Expect<T> | undefined, downstream: boolean | undefined, skip: Model): T | undefined | (() => void);
+  add(I: Model, explicit?: boolean): () => void;
   /**
-   * Register one or more States to this context.
+   * Create a child context, optionally registering Models to it.
    *
-   * Context will add or remove States as needed to keep with provided input.
-   *
-   * @param inputs State, State class, or map of States / State classes to register.
-   * @param forEach Optional callback to run for each State registered. Receives
-   *   whether this context created the State - and so will destroy it - as
-   *   opposed to it having been provided already active. May return a callback
-   *   to run before that entry is dropped.
-   */
-  set<T extends State>(inputs: Accept<T>, forEach?: (state: T, owned: boolean) => (() => void) | void): this;
-  add(I: State, explicit?: boolean): () => void;
-  /**
-   * Create a child context, optionally registering one or more States to it.
-   *
-   * @param inputs State, State class, or map of States / State classes to register.
+   * @param input Model instance to adopt, Model class to create - and destroy when the context pops - or an object of them, all registered before any activates.
+   * @param cleanup Called once when the context pops, before its Models are removed.
    */
-  push(inputs?: Accept): Context;
+  push(input?: Accept, cleanup?: () => void): Context;
   /**
-   * Remove all States from this context.
+   * Remove all Models from this context.
    *
-   * Will also run any cleanup callbacks registered when States were added.
+   * Will also run any cleanup callbacks registered when Models were added.
    */
   pop(): void;
 }
@@ -58,9 +45,9 @@ declare class Context {
  * Add `value` to the context `state` was added to. A context-less `state` holds
  * it instead - every context adding `state` later adds its held children too.
  */
-declare function join(state: State, value: State): () => void;
-/** The State a host mounted `state` under - the one its nearest enclosing context was set up for. */
-declare function host(state: State): State | undefined;
+declare function join(state: Model, value: Model): () => void;
+/** The Model a host mounted `state` under - the one its nearest enclosing context was set up for. */
+declare function host(state: Model): Model | undefined;
 //#endregion
 export { Context, host, join };
 //# sourceMappingURL=context.d.ts.map

package/dist/context.js

@@ -1,16 +1,17 @@
 import { event, listener } from "./observable.js";
-import { State, uid } from "./state.js";
+import { Model, uid } from "./state.js";
 
 //#region src/context.ts
 const LOOKUP = /* @__PURE__ */ new WeakMap();
 const HELD = /* @__PURE__ */ new WeakMap();
 const HOST = /* @__PURE__ */ new WeakMap();
+const CLEANUP = /* @__PURE__ */ new WeakMap();
 let ROOT;
 var Context = class Context {
 	static get root() {
 		return ROOT ??= new Context();
 	}
-	/** Get the context for a State. Adapters may override to provide framework context. */
+	/** Get the context for a Model. Adapters may override to provide framework context. */
 	static get(state) {
 		return state && LOOKUP.get(state.is) || Context.root;
 	}
@@ -19,13 +20,12 @@ var Context = class Context {
 	scope = /* @__PURE__ */ new Set();
 	consume = /* @__PURE__ */ new Map();
 	provide = /* @__PURE__ */ new Map();
-	inputs = {};
-	cleanup = /* @__PURE__ */ new Map();
 	constructor(arg) {
+		CLEANUP.set(this, /* @__PURE__ */ new Set());
 		if (arg instanceof Context) {
 			this.parent = arg;
 			arg.scope.add(this);
-		} else if (arg) this.set(arg);
+		} else if (arg) insert(this, arg);
 	}
 	traverse(accept) {
 		const queue = [...this.scope];
@@ -78,58 +78,8 @@ var Context = class Context {
 		if (found === null) return null;
 		if (arg !== false) throw new Error(`Could not find ${Type} in context.`);
 	}
-	/**
-	* Register one or more States to this context.
-	*
-	* Context will add or remove States as needed to keep with provided input.
-	*
-	* @param inputs State, State class, or map of States / State classes to register.
-	* @param forEach Optional callback to run for each State registered. Receives
-	*   whether this context created the State - and so will destroy it - as
-	*   opposed to it having been provided already active. May return a callback
-	*   to run before that entry is dropped.
-	*/
-	set(inputs, forEach) {
-		const init = /* @__PURE__ */ new Set();
-		const { cleanup } = this;
-		const single = typeof inputs == "function" || inputs instanceof State;
-		if (typeof inputs == "function" || inputs instanceof State) inputs = { [0]: inputs };
-		for (const K of Object.keys({
-			...this.inputs,
-			...inputs
-		})) {
-			const V = inputs[K];
-			const E = this.inputs[K];
-			if (E === V) continue;
-			if (E) {
-				cleanup.get(K)?.();
-				cleanup.delete(K);
-			}
-			if (!V) continue;
-			const owned = State.is(V);
-			if (!(owned || V instanceof State)) {
-				const as = K == "0" || K == String(V) ? V : `${V} (as '${K}')`;
-				throw new Error(`Context can only include an instance or class of State but got ${as}.`);
-			}
-			const state = owned ? new V() : V.is;
-			const remove = this.add(state, true);
-			if (single && this !== ROOT) HOST.set(this, state);
-			init.add(() => {
-				event(state);
-				const dispose = forEach?.(state, owned);
-				cleanup.set(K, () => {
-					if (typeof dispose == "function") dispose();
-					remove();
-					if (owned) event(state, null);
-				});
-			});
-		}
-		for (const i of init) i();
-		this.inputs = inputs;
-		return this;
-	}
 	add(I, explicit = false) {
-		const { cleanup, provide } = this;
+		const { provide } = this;
 		const root = this === Context.root;
 		const TT = [];
 		function conflict(T) {
@@ -138,7 +88,7 @@ var Context = class Context {
 				for (const entry of entries) if (!entry[1] && entry[0] !== I) return entries.delete(entry);
 			}
 		}
-		for (let T = I.constructor; T !== State; T = Object.getPrototypeOf(T)) if (explicit || !root || !conflict(T)) TT.push(T);
+		for (let T = I.constructor; T !== Model; T = Object.getPrototypeOf(T)) if (explicit || !root || !conflict(T)) TT.push(T);
 		const expects = /* @__PURE__ */ new Map();
 		const onDone = /* @__PURE__ */ new Set();
 		for (const T of TT) onDone.add(this.register(T, [I, explicit]));
@@ -169,6 +119,7 @@ var Context = class Context {
 			onDone.forEach((r) => r());
 			onDone.clear();
 		}
+		const cleanup = CLEANUP.get(this);
 		const held = Array.from(HELD.get(I) || [], ([child, added]) => {
 			const done = this.add(child);
 			added.add(done);
@@ -181,30 +132,32 @@ var Context = class Context {
 			held.forEach((done) => done());
 			flush();
 		}
-		cleanup.set(remove, remove);
+		cleanup.add(remove);
 		return remove;
 	}
 	/**
-	* Create a child context, optionally registering one or more States to it.
+	* Create a child context, optionally registering Models to it.
 	*
-	* @param inputs State, State class, or map of States / State classes to register.
+	* @param input Model instance to adopt, Model class to create - and destroy when the context pops - or an object of them, all registered before any activates.
+	* @param cleanup Called once when the context pops, before its Models are removed.
 	*/
-	push(inputs) {
+	push(input, cleanup) {
 		const next = new Context(this);
-		if (inputs) next.set(inputs);
+		if (cleanup) CLEANUP.get(next).add(cleanup);
+		if (input) insert(next, input);
 		return next;
 	}
 	/**
-	* Remove all States from this context.
+	* Remove all Models from this context.
 	*
-	* Will also run any cleanup callbacks registered when States were added.
+	* Will also run any cleanup callbacks registered when Models were added.
 	*/
 	pop() {
-		this.inputs = {};
 		this.scope.forEach((x) => x.pop());
 		this.scope.clear();
-		this.cleanup.forEach((cb) => cb());
-		this.cleanup.clear();
+		const cleanup = CLEANUP.get(this);
+		cleanup.forEach((cb) => cb());
+		cleanup.clear();
 		this.consume.clear();
 		this.provide.clear();
 		if (this.parent) this.parent.scope.delete(this);
@@ -231,13 +184,34 @@ function join(state, value) {
 		});
 	};
 }
-/** The State a host mounted `state` under - the one its nearest enclosing context was set up for. */
+/** The Model a host mounted `state` under - the one its nearest enclosing context was set up for. */
 function host(state) {
 	for (let ctx = LOOKUP.get(state); ctx; ctx = ctx.parent) {
 		const found = HOST.get(ctx);
 		if (found && found !== state) return found;
 	}
 }
+function insert(into, input) {
+	const single = typeof input == "function" || input instanceof Model;
+	const entries = Object.entries(single ? { input } : input);
+	const init = [];
+	const owns = [];
+	for (const [K, V] of entries) {
+		const owned = Model.is(V);
+		if (!(owned || V instanceof Model)) {
+			const as = single || K == String(V) ? V : `${V} (as '${K}')`;
+			throw new Error(`Context can only include an instance or class of Model but got ${as}.`);
+		}
+		const state = owned ? new V() : V.is;
+		into.add(state, true);
+		init.push(state);
+		if (single) HOST.set(into, state);
+		if (owned) owns.push(state);
+	}
+	const cleanup = CLEANUP.get(into);
+	for (const state of owns) cleanup.add(() => event(state, null));
+	for (const state of init) event(state);
+}
 
 //#endregion
 export { Context, host, join };