@expressive/mvc 0.87.0 → 0.89.0

package/README.md

@@ -11,24 +11,24 @@
 
 ---
 
-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) instead - it depends on this package, so you get the whole core through it and should **not** list `@expressive/mvc` in your `package.json` as well. Import `State`, `Component`, and every instruction from the adapter.
+> **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.
 
-Install this package directly only for host-agnostic code that must not depend on a UI adapter - a shared domain package, a Node service, or a new adapter:
+Installed alone, it serves host-agnostic code - a shared domain package, a Node service, or a new adapter:
 
 ```bash
 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,10 +1,21 @@
-import { State } from "./state.js";
-import { Host } from "./runtime.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 Model> = {
+  children?: Component.Node;
+  fallback?: Component.Node | false;
+  catch?: (error: Error, instance: Component) => Promise<void> | void;
+} & ({
+  for: Model.Extends<T>;
+  is?: (instance: T) => void;
+} | {
+  for: T | undefined;
+  is?: never;
+}) & { [K in Exclude<keyof T, keyof Model> & Acceptable<T>]?: T[K] };
 declare namespace Component {
   /**
    * Host element type produced by `Component.render`. Delegates to the
@@ -17,7 +28,7 @@ declare namespace Component {
   type Node = Host extends {
     node: infer T;
   } ? T : any;
-  interface BaseProps<T extends Component> {
+  interface BaseProps<T extends Component<any>> {
     /**
      * Callback for newly created instance. Only called once.
      *
@@ -25,30 +36,37 @@ declare namespace Component {
      * may configure state that `new()` then observes. To react to a fully
      * initialized instance instead, use `watch` or an effect.
      */
-    is?: (instance: T) => void;
+    is?(instance: T): void;
     /**
      * Fallback to show when suspended or in error recovery.
      * Pass `false` to opt out of the component's own suspense boundary,
      * letting suspension bubble to an ancestor.
      */
     fallback?: Component.Node;
+    /**
+     * Called when this element's content throws, in place of the class's own
+     * `catch`. A returned promise retries once settled.
+     */
+    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> = StateProps<T> & BaseProps<T> & RenderProps<T['render']>;
+  type Props<T extends Component<any>> = ModelProps<T> & BaseProps<T> & RenderProps<T['render']>;
 }
-declare class Component 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: 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;
   /**
@@ -70,10 +88,6 @@ declare 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; the bootstrap
-   * `type` pass seals this and any override non-configurable, keeping it the
-   * content-render seam the chain reads.
    */
   render(props?: {}): Component.Node;
   /**
@@ -85,10 +99,8 @@ declare class Component extends State {
    * await async recovery, or await user interaction before retrying. If you
    * assign a fallback within catch, it will be reverted after resolved.
    */
-  catch?(error: Error): Promise<void> | void;
+  catch?(error: Error, instance: this): Promise<void> | void;
 }
-/** Drop composed renders, so each is rebuilt from current prototypes. */
-declare function rechain(): void;
 //#endregion
-export { Component, rechain };
+export { Component };
 //# sourceMappingURL=component.d.ts.map

package/dist/component.js

@@ -1,12 +1,10 @@
-import { State, 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 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.
@@ -21,6 +19,7 @@ var Component = class extends State {
 		if (props == null) props = {};
 		const seen = {};
 		const twin = PENDING.get(props);
+		const provider = new.target === Component && "for" in props;
 		if (typeof props == "object") merge(props);
 		function merge(props) {
 			for (const k in props) seen[k] = void 0;
@@ -38,7 +37,8 @@ var Component = class extends State {
 					trailing(other).forEach((orphan) => orphan.set(null));
 					other.set(null);
 				}
-				props.is?.(this);
+				if (provider) provide(this);
+				else props.is?.(this);
 				Object.defineProperty(this, "props", { enumerable: false });
 				PENDING.delete(props);
 			}
@@ -48,14 +48,6 @@ var Component = class extends State {
 		this.set("props", () => {
 			this.set(merge(this.props));
 		});
-		const self = this;
-		Object.defineProperty(this, "render", {
-			writable: true,
-			configurable: true,
-			value(props) {
-				return render(self).call(this, props);
-			}
-		});
 	}
 	/**
 	* Output for this component. Override to define custom JSX.
@@ -65,10 +57,6 @@ var Component = class 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; the bootstrap
-	* `type` pass seals this and any override non-configurable, keeping it the
-	* content-render seam the chain reads.
 	*/
 	render(props) {
 		const { children } = props || this.props;
@@ -87,65 +75,58 @@ Object.defineProperty(Component.prototype, "key", {
 		Object.defineProperty(this, "key", { value });
 	}
 });
-/**
-* Seal each class's own `render` non-configurable at bootstrap so member
-* classification leaves it unbound - it stays the content-render seam the chain
-* reads (and which adapters like preact detect as the class-component marker).
-*/
-Component.on({
-	before(self) {
-		if (Object.getOwnPropertyDescriptor(self, "key")?.configurable) Object.defineProperty(self, "key", {
-			enumerable: false,
-			writable: false
-		});
-	},
-	type(type) {
-		const desc = Object.getOwnPropertyDescriptor(type.prototype, "render");
-		if (desc && typeof desc.value == "function") Object.defineProperty(type.prototype, "render", {
-			...desc,
-			configurable: false
-		});
+Component.on({ setup(self) {
+	if (Object.getOwnPropertyDescriptor(self, "key")?.configurable) Object.defineProperty(self, "key", {
+		enumerable: false,
+		writable: false
+	});
+} });
+function provide(self) {
+	let input;
+	let target;
+	let owned;
+	let mounted = false;
+	let release;
+	function unmount() {
+		if (typeof release == "function") release();
+		release = void 0;
 	}
-});
-/**
-* Build (or fetch the cached) composed content render for an instance's class.
-* Walks the prototype chain for content renders strictly below Component - the
-* default render on Component.prototype is excluded and serves as the fallback
-* when a class authors none.
-*/
-function render(target) {
-	const cached = CHAIN.get(target.constructor);
-	if (cached) return cached;
-	let render;
-	let proto = target;
-	while ((proto = Object.getPrototypeOf(proto)) !== Component.prototype) {
-		const desc = Object.getOwnPropertyDescriptor(proto, "render");
-		if (desc) {
-			const layer = unbind(desc.get || desc.value);
-			render = render ? compose(layer, render) : layer;
+	const inherited = self.mount;
+	Object.defineProperty(self, "mount", {
+		configurable: true,
+		value() {
+			const done = inherited?.call(self);
+			mounted = true;
+			release = owned?.mount?.();
+			return () => {
+				mounted = false;
+				unmount();
+				if (typeof done == "function") done();
+			};
 		}
-	}
-	if (!render) render = Component.prototype.render;
-	CHAIN.set(target.constructor, render);
-	return render;
-}
-/** Wrap an outer render so it receives `inner` as a lazy `children` getter. */
-function compose(outer, inner) {
-	return function(props) {
-		const self = this;
-		return outer.call(self, {
-			...props,
-			get children() {
-				return inner.call(self, props);
+	});
+	function sync() {
+		const { for: next, is, children, fallback, catch: _catch, ...rest } = self.props;
+		if (fallback === void 0) self.fallback = false;
+		if (next !== input) {
+			input = next;
+			unmount();
+			if (Model.is(next)) {
+				adopt(self, "for", target = new next(rest));
+				owned = target;
+				is?.(target);
+				if (mounted) release = owned.mount?.();
+				return;
 			}
-		});
-	};
-}
-/** Drop composed renders, so each is rebuilt from current prototypes. */
-function rechain() {
-	CHAIN = /* @__PURE__ */ new WeakMap();
+			owned = void 0;
+			adopt(self, "for", target = next instanceof Model ? next : void 0);
+		}
+		target?.set(rest);
+	}
+	sync();
+	self.set("props", sync);
 }
 
 //#endregion
-export { Component, 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, trailing, unbind } from './state';\n\nimport type { Host } from './runtime';\n\nconst PENDING = new WeakMap<object, Component>();\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\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> {\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  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> =\n    & StateProps<T>\n    & BaseProps<T>\n    & RenderProps<T['render']>;\n}\n\nclass Component 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: 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\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        props.is?.(this);\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    const self = this;\n\n    Object.defineProperty(this, 'render', {\n      writable: true,\n      configurable: true,\n      value(this: Component, props?: {}) {\n        return render(self).call(this, props);\n      }\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; the bootstrap\n   * `type` pass seals this and any override non-configurable, keeping it the\n   * content-render seam the chain reads.\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): 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\n/**\n * Seal each class's own `render` non-configurable at bootstrap so member\n * classification leaves it unbound - it stays the content-render seam the chain\n * reads (and which adapters like preact detect as the class-component marker).\n */\nComponent.on({\n  before(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  type(type) {\n    const desc = Object.getOwnPropertyDescriptor(type.prototype, 'render');\n\n    if (desc && typeof desc.value == 'function')\n      Object.defineProperty(type.prototype, 'render', {\n        ...desc,\n        configurable: false\n      });\n  }\n});\n\n/**\n * Build (or fetch the cached) composed content render for an instance's class.\n * Walks the prototype chain for content renders strictly below Component - the\n * default render on Component.prototype is excluded and serves as the fallback\n * when a class authors none.\n */\nfunction render(target: Component) {\n  const cached = CHAIN.get(target.constructor);\n\n  if (cached) return cached;\n\n  let render: Function | undefined;\n  let proto = target;\n\n  while ((proto = Object.getPrototypeOf(proto)) !== Component.prototype) {\n    const desc = Object.getOwnPropertyDescriptor(proto, 'render');\n\n    if (desc) {\n      const layer = unbind(desc.get || desc.value);\n      render = render ? compose(layer, render) : layer;\n    }\n  }\n\n  if (!render)\n    render = Component.prototype.render;\n\n  CHAIN.set(target.constructor, render);\n\n  return render;\n}\n\n/** Wrap an outer render so it receives `inner` as a lazy `children` getter. */\nfunction compose(outer: Function, inner: Function): Function {\n  return function (this: Component, 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, rechain };\n"],"mappings":";;;;;AAMA,MAAM,0BAAU,IAAI,SAA4B;;AAGhD,IAAI,wBAAQ,IAAI,SAA6B;AA4D7C,IAAM,YAAN,cAAwB,MAAM;;;;;;;;;;CAqB5B,WAA2B,IAAI,KAAK;CAEpC,YAAY,OAAa,GAAG,MAAa;AACvC,MAAI,SAAS,KAAM,SAAQ,EAAE;EAE7B,MAAM,OAAO,EAAE;EACf,MAAM,OAAO,QAAQ,IAAI,MAAM;AAE/B,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,UAAM,KAAK,KAAK;AAChB,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;EAEF,MAAM,OAAO;AAEb,SAAO,eAAe,MAAM,UAAU;GACpC,UAAU;GACV,cAAc;GACd,MAAuB,OAAY;AACjC,WAAO,OAAO,KAAK,CAAC,KAAK,MAAM,MAAM;;GAExC,CAAC;;;;;;;;;;;;;;;CAgBJ,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;;;;;;AAOF,UAAU,GAAG;CACX,OAAO,MAAM;AAGX,MAFY,OAAO,yBAAyB,MAAM,MAAM,EAE/C,aACP,QAAO,eAAe,MAAM,OAAO;GACjC,YAAY;GACZ,UAAU;GACX,CAAC;;CAEN,KAAK,MAAM;EACT,MAAM,OAAO,OAAO,yBAAyB,KAAK,WAAW,SAAS;AAEtE,MAAI,QAAQ,OAAO,KAAK,SAAS,WAC/B,QAAO,eAAe,KAAK,WAAW,UAAU;GAC9C,GAAG;GACH,cAAc;GACf,CAAC;;CAEP,CAAC;;;;;;;AAQF,SAAS,OAAO,QAAmB;CACjC,MAAM,SAAS,MAAM,IAAI,OAAO,YAAY;AAE5C,KAAI,OAAQ,QAAO;CAEnB,IAAI;CACJ,IAAI,QAAQ;AAEZ,SAAQ,QAAQ,OAAO,eAAe,MAAM,MAAM,UAAU,WAAW;EACrE,MAAM,OAAO,OAAO,yBAAyB,OAAO,SAAS;AAE7D,MAAI,MAAM;GACR,MAAM,QAAQ,OAAO,KAAK,OAAO,KAAK,MAAM;AAC5C,YAAS,SAAS,QAAQ,OAAO,OAAO,GAAG;;;AAI/C,KAAI,CAAC,OACH,UAAS,UAAU,UAAU;AAE/B,OAAM,IAAI,OAAO,aAAa,OAAO;AAErC,QAAO;;;AAIT,SAAS,QAAQ,OAAiB,OAA2B;AAC3D,QAAO,SAA2B,OAAY;EAC5C,MAAM,OAAO;AACb,SAAO,MAAM,KAAK,MAAM;GACtB,GAAG;GACH,IAAI,WAAW;AACb,WAAO,MAAM,KAAK,MAAM,MAAM;;GAEjC,CAAC;;;;AAKN,SAAS,UAAU;AACjB,yBAAQ,IAAI,SAAS"}
+{"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,56 @@
-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>;
+  consume: Map<Model.Extends<Model>, Set<[Expect<Model>, boolean | undefined]> | null>;
+  provide: Map<Model.Extends<Model>, Set<[Model, boolean]> | null>;
+  protected inputs: Record<string | number, Model | Model.Extends>;
   private cleanup;
   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);
   /**
-   * Register one or more States to this context.
+   * Register one or more Models to this context.
    *
-   * Context will add or remove States as needed to keep with provided input.
+   * Context will add or remove Models 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
+   * @param inputs Model, Model class, or map of Models / Model classes to register.
+   * @param forEach Optional callback to run for each Model registered. Receives
+   *   whether this context created the Model - 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;
+  set<T extends Model>(inputs: Accept<T>, forEach?: (state: T, owned: boolean) => (() => void) | void): this;
+  add(I: Model, explicit?: boolean): () => void;
   /**
-   * Create a child context, optionally registering one or more States to it.
+   * Create a child context, optionally registering one or more Models to it.
    *
-   * @param inputs State, State class, or map of States / State classes to register.
+   * @param inputs Model, Model class, or map of Models / Model classes to register.
    */
   push(inputs?: Accept): 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,7 +58,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;
+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, join };
+export { Context, host, join };
 //# sourceMappingURL=context.d.ts.map