chizu 0.2.12 → 0.2.13

package/README.md

@@ -18,19 +18,17 @@ Strongly typed React framework using generators and efficiently updated views al
 - Mostly standard JavaScript without quirky rules and exceptions.
 - Clear separation of concerns between business logic and markup.
 - First-class support for skeleton loading using generators.
-- Strongly typed throughout – styles, controllers and views.
+- Strongly typed throughout – styles, actions and views.
 - Avoid vendor lock-in with framework agnostic libraries such as [Shoelace](https://shoelace.style/).
-- Easily communicate between controllers using distributed actions.
+- Easily communicate between actions using distributed actions.
 - State is mutated sequentially ([FIFO](<https://en.wikipedia.org/wiki/FIFO_(computing_and_electronics)>)) and deeply merged for queued mutations.
 
 ## Getting started
 
-Controllers are responsible for mutating the state of the view. In the below example the `name` is dispatched from the view to the controller, the state is updated and the view is rendered once with the updated value.
-
-<kbd>Controller</kbd>
+Actions are responsible for mutating the state of the view. In the below example the `name` is dispatched from the view to the actions, the state is updated and the view is rendered with the updated value.
 
 ```tsx
-export default (function ProfileController(module) {
+export default (function Actions(module) {
   return {
     async *[Events.Name](name) {
       return module.actions.produce((draft) => {
@@ -38,33 +36,33 @@ export default (function ProfileController(module) {
       });
     },
   };
-} as Controller<Module>);
+} as Actions<Module>);
 ```
 
-<kbd>View</kbd>
-
 ```tsx
-export default (function ProfileView(module) {
+export default function Profile(props: Props): React.ReactElement {
   return (
-    <>
-      <p>Hey {module.model.name}</p>
-
-      <button
-        onClick={() => module.actions.dispatch([Events.Name, randomName()])}
-      >
-        Switch profile
-      </button>
-    </>
+    <Tree<Module> using={{ model, actions, props }}>
+      {(module) => (
+        <>
+          <p>Hey {module.model.name}</p>
+
+          <button
+            onClick={() => module.actions.dispatch([Events.Name, randomName()])}
+          >
+            Switch profile
+          </button>
+        </>
+      )}
+    </Tree>
   );
-} as View<Module>);
+}
 ```
 
-Fetching the name from an external source using an `actions.io` causes the controller event (`Events.Name`) and associated view to be invoked twice &ndash; once with a record of mutations to display a pending state, and then again with the model once it's been mutated.
-
-<kbd>Controller</kbd>
+You can perform asynchronous operations in the action which will cause the associated view to render a second time:
 
 ```tsx
-export default (function ProfileController(module) {
+export default (function Actions(module) {
   return {
     async *[Events.Name]() {
       yield module.actions.produce((draft) => {
@@ -78,31 +76,31 @@ export default (function ProfileController(module) {
       });
     },
   };
-} as Controller<Module>);
+} as Actions<Module>);
 ```
 
-<kbd>View</kbd>
-
 ```tsx
-export default (function ProfileView(module) {
+export default function Profile(props: Props): React.ReactElement {
   return (
-    <>
-      <p>Hey {module.model.name}</p>
-
-      <button onClick={() => module.actions.dispatch([Events.Name])}>
-        Switch profile
-      </button>
-    </>
+    <Tree<Module> using={{ model, actions, props }}>
+      {(module) => (
+        <>
+          <p>Hey {module.model.name}</p>
+
+          <button onClick={() => module.actions.dispatch([Events.Name])}>
+            Switch profile
+          </button>
+        </>
+      )}
+    </Tree>
   );
-} as View<Module>);
+}
 ```
 
-<!-- In the above example the name is fetched asynchronously &ndash; however there is no feedback to the user, we can improve that by using the `module.actions.state` and `module.validate` helpers: -->
-
-<kbd>Controller</kbd>
+However in the above example where the name is fetched asynchronously, there is no feedback to the user &ndash; we can improve that significantly by using the `module.actions.annotate` and `module.validate` helpers:
 
 ```tsx
-export default (function ProfileController(module) {
+export default (function Actions(module) {
   return {
     async *[Events.Name]() {
       yield module.actions.produce((draft) => {
@@ -115,49 +113,49 @@ export default (function ProfileController(module) {
       });
     },
   };
-} as Controller<Module>);
+} as Actions<Module>);
 ```
 
-<kbd>View</kbd>
-
 ```tsx
-export default (function ProfileView(module) {
+export default function ProfileView(props: Props): React.ReactElement {
   return (
-    <>
-      <p>Hey {module.model.name}</p>
-
-      {module.validate.name.pending() && <p>Switching profiles&hellip;</p>}
-
-      <button
-        disabled={module.validate.name.is(State.Op.Update)}
-        onClick={() => module.actions.dispatch([Events.Name])}
-      >
-        Switch profile
-      </button>
-    </>
+    <Tree<Module> using={{ module, actions, props }}>
+      {(module) => (
+        <>
+          <p>Hey {module.model.name}</p>
+
+          {module.validate.name.pending() && <p>Switching profiles&hellip;</p>}
+
+          <button
+            disabled={module.validate.name.is(State.Op.Update)}
+            onClick={() => module.actions.dispatch([Events.Name])}
+          >
+            Switch profile
+          </button>
+        </>
+      )}
+    </Tree>
   );
-} as View<Module>);
+}
 ```
 
 ## Handling Errors
 
-Controller actions can throw errors directly or in any of their associated `yield` actions &ndash; all unhandled errors are automatically caught and broadcast using the `Lifecycle.Error` action &ndash; you can render these [in a toast](https://github.com/fkhadra/react-toastify#readme) or similar UI.
+Actions can throw errors directly or in any of their associated `yield` actions &ndash; all unhandled errors are automatically caught and broadcast using the `Lifecycle.Error` action &ndash; you can render these [in a toast](https://github.com/fkhadra/react-toastify#readme) or similar UI.
 
 You can also customise these errors a little further with your own error `enum` which describes the error type:
 
 <kbd>Types</kbd>
 
-```tsx
+```ts
 export const enum Errors {
   UserValidation,
   IncorrectPassword,
 }
 ```
 
-<kbd>Controller</kbd>
-
 ```tsx
-export default (function ProfileController(module) {
+export default (function Actions(module) {
   return {
     *[Events.Name]() {
       yield module.actions.produce((draft) => {
@@ -173,15 +171,13 @@ export default (function ProfileController(module) {
       });
     },
   };
-}) as Controller<Module>;
+}) as Actions<Module>;
 ```
 
 However showing a toast message is not always relevant, you may want a more detailed error message such as a user not found message &ndash; although you could introduce another property for such errors in your model, you could mark the property as fallible by giving it a `Maybe` type because it then keeps everything nicely associated with the `name` property rather than creating another property:
 
-<kbd>Controller</kbd>
-
 ```tsx
-export default (function ProfileView(module) {
+export default (function Actions(module) {
   return {
     async *[Events.Name]() {
       yield module.actions.produce((draft) => {
@@ -201,5 +197,5 @@ export default (function ProfileView(module) {
       });
     },
   };
-} as View<Module>);
+} as Actions<Module>);
 ```

package/dist/chizu.js

@@ -1,28 +1,27 @@
-var q = Object.defineProperty;
-var O = (t) => {
+var T = Object.defineProperty;
+var j = (t) => {
   throw TypeError(t);
 };
-var z = (t, e, n) => e in t ? q(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
-var E = (t, e, n) => z(t, typeof e != "symbol" ? e + "" : e, n), A = (t, e, n) => e.has(t) || O("Cannot " + n);
-var R = (t, e, n) => (A(t, e, "read from private field"), n ? n.call(t) : e.get(t)), b = (t, e, n) => e.has(t) ? O("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, n), S = (t, e, n, r) => (A(t, e, "write to private field"), r ? r.call(t, n) : e.set(t, n), n);
-import { jsx as p, Fragment as F } from "react/jsx-runtime";
-import { Immer as T } from "immer";
-import v from "lodash/get";
-import x from "traverse";
+var z = (t, e, n) => e in t ? T(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
+var y = (t, e, n) => z(t, typeof e != "symbol" ? e + "" : e, n), k = (t, e, n) => e.has(t) || j("Cannot " + n);
+var w = (t, e, n) => (k(t, e, "read from private field"), n ? n.call(t) : e.get(t)), E = (t, e, n) => e.has(t) ? j("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(t) : e.set(t, n), b = (t, e, n, r) => (k(t, e, "write to private field"), r ? r.call(t, n) : e.set(t, n), n);
+import { Immer as N } from "immer";
+import p from "lodash/get";
+import R from "traverse";
+import { jsx as $ } from "react/jsx-runtime";
 import * as a from "react";
-import D from "eventemitter3";
-import * as h from "react-router-dom";
-class C {
+import M from "eventemitter3";
+class O {
   constructor(e) {
     this.value = e;
   }
 }
-class $ {
+class q {
   static Draft(e) {
-    return new C(e);
+    return new O(e);
   }
 }
-E($, "Op", {
+y(q, "Op", {
   Add: 1,
   Remove: 2,
   Update: 4,
@@ -30,240 +29,234 @@ E($, "Op", {
   Replace: 16
 });
 var m = /* @__PURE__ */ ((t) => (t.Mount = "lifecycle/mount", t.Node = "lifecycle/node", t.Derive = "lifecycle/derive", t.Error = "distributed/lifecycle/error", t.Unmount = "lifecycle/unmount", t))(m || {});
-const l = {
-  immer: new T(),
+const c = {
+  immer: new N(),
   annotations: Symbol("annotations")
 };
-l.immer.setAutoFreeze(!1);
-class M {
+c.immer.setAutoFreeze(!1);
+class S {
   constructor(e, n, r = null) {
-    E(this, "process");
+    y(this, "process");
     this.value = e, this.operations = n, this.field = r, this.process = null;
   }
   attach(e) {
     return this.process = e, this;
   }
 }
-function J(t, e = []) {
-  return new M(t, e);
+function I(t, e = []) {
+  return new S(t, e);
 }
-class k {
+class P {
   constructor(e, n = e) {
     this.stateless = e, this.stateful = n;
   }
   get validatable() {
-    return I(this.stateful);
+    return U(this.stateful);
   }
 }
-function I(t, e = []) {
+function U(t, e = []) {
   return new Proxy(t, {
     get(n, r) {
       switch (r) {
         case "is":
-          return (s) => {
-            const o = P(t, e);
-            if (!o) return !1;
+          return (o) => {
+            const s = x(t, e);
+            if (!s) return !1;
             const u = new Set(
-              o.flatMap((i) => i.operations)
+              s.flatMap((l) => l.operations)
             );
             return !!(Array.from(u).reduce(
-              (i, f) => i | (f ?? 0),
+              (l, d) => l | (d ?? 0),
               0
-            ) & s);
+            ) & o);
           };
         case "pending":
-          return () => !!P(t, e);
+          return () => !!x(t, e);
         case "draft":
           return () => {
-            const s = P(t, e);
-            if (!s) return v(t, e);
-            const o = s.flatMap((u) => u.operations).find((u) => u instanceof C);
-            return o ? o.value : v(t, e);
+            const o = x(t, e);
+            if (!o) return p(t, e);
+            const s = o.flatMap((u) => u.operations).find((u) => u instanceof O);
+            return s ? s.value : p(t, e);
           };
       }
-      return I(t, [...e, String(r)]);
+      return U(t, [...e, String(r)]);
     }
   });
 }
-function P(t, e) {
-  const r = typeof v(t, e) == "object" ? e : e.slice(0, -1), s = r.length === 0 ? t : v(t, r), o = (s == null ? void 0 : s[l.annotations]) ?? [];
-  return o.length > 0 ? o : null;
+function x(t, e) {
+  const r = typeof p(t, e) == "object" ? e : e.slice(0, -1), o = r.length === 0 ? t : p(t, r), s = (o == null ? void 0 : o[c.annotations]) ?? [];
+  return s.length > 0 ? s : null;
 }
-function Q(t, e, n) {
-  function r(o) {
-    return x(o).forEach(function() {
-      if (this.key === l.annotations) {
+function F(t, e, n) {
+  function r(s) {
+    return R(s).forEach(function() {
+      if (this.key === c.annotations) {
         this.block();
         return;
       }
-      this.node instanceof M && this.update(this.node.value);
+      this.node instanceof S && this.update(this.node.value);
     });
   }
-  function s(o) {
-    return x(o).forEach(function() {
-      if (this.key === l.annotations) {
+  function o(s) {
+    return R(s).forEach(function() {
+      if (this.key === c.annotations) {
         this.block();
         return;
       }
-      if (this.node instanceof M) {
-        const u = typeof this.node.value == "object", c = [
+      if (this.node instanceof S) {
+        const u = typeof this.node.value == "object", i = [
           ...u ? this.path : this.path.slice(0, -1),
-          l.annotations
-        ], i = v(t.stateful, c) ?? [], f = this.node.attach(e);
+          c.annotations
+        ], l = p(t.stateful, i) ?? [], d = this.node.attach(e);
         u ? this.update(
           {
             ...this.node.value,
-            [l.annotations]: [f, ...i]
+            [c.annotations]: [d, ...l]
           },
           !0
-        ) : (this.parent && (this.parent.node[l.annotations] = [f, ...i]), this.update(this.node.value, !0));
+        ) : (this.parent && (this.parent.node[c.annotations] = [d, ...l]), this.update(this.node.value, !0));
       }
     });
   }
-  return new k(
-    r(l.immer.produce(t.stateless, n)),
-    s(l.immer.produce(t.stateful, n))
+  return new P(
+    r(c.immer.produce(t.stateless, n)),
+    o(c.immer.produce(t.stateful, n))
   );
 }
-function U(t, e) {
-  const n = x(t.stateful).forEach(function() {
-    if (this.key === l.annotations) {
+function D(t, e) {
+  const n = R(t.stateful).forEach(function() {
+    if (this.key === c.annotations) {
       this.block();
       return;
     }
-    if (this.node && this.node[l.annotations]) {
-      const r = this.node[l.annotations];
+    if (this.node && this.node[c.annotations]) {
+      const r = this.node[c.annotations];
       this.update(
         {
           ...this.node,
-          [l.annotations]: r.filter(
-            (s) => s.process !== e
+          [c.annotations]: r.filter(
+            (o) => o.process !== e
           )
         },
         !0
       );
     }
   });
-  return new k(t.stateless, n);
+  return new P(t.stateless, n);
 }
-function W(t) {
-  return (e, n) => async (r = Promise.withResolvers(), s) => {
+function J(t) {
+  return (e, n) => async (r = Promise.withResolvers(), o) => {
     if (typeof n != "function") return;
-    const o = Symbol("process"), u = n(...s);
+    const s = Symbol("process"), u = n(...o);
     if (u == null)
       return void r.resolve();
     if (typeof u == "function") {
-      const c = u(t.model.current, o);
-      return t.model.current = U(c, o), t.update.rerender(), void r.resolve();
+      const i = u(t.model.current, s);
+      return t.model.current = D(i, s), t.update.rerender(), void r.resolve();
     }
     for (; ; ) {
-      const { value: c, done: i } = await u.next();
-      if (i) {
-        const N = c(t.model.current, o);
-        t.model.current = U(N, o), t.update.rerender();
+      const { value: i, done: l } = await u.next();
+      if (l) {
+        const H = i(t.model.current, s);
+        t.model.current = D(H, s), t.update.rerender();
         break;
       }
-      const f = c;
-      t.model.current = f(t.model.current, o), t.update.rerender();
+      const d = i;
+      t.model.current = d(t.model.current, s), t.update.rerender();
     }
     r.resolve();
   };
 }
-function _(t) {
+function A(t) {
   return t.startsWith("distributed");
 }
-var y, w;
-class G extends Error {
+var v, g;
+class Q extends Error {
   constructor(n, r = null) {
     super(String(r));
-    b(this, y);
-    b(this, w);
-    S(this, y, n), S(this, w, r);
+    E(this, v);
+    E(this, g);
+    b(this, v, n), b(this, g, r);
   }
   get type() {
-    return R(this, y);
+    return w(this, v);
   }
   get message() {
-    return R(this, w) || "";
+    return w(this, g) || "";
   }
 }
-y = new WeakMap(), w = new WeakMap();
-function K(t) {
+v = new WeakMap(), g = new WeakMap();
+function W(t) {
   return new Promise((e) => setTimeout(e, t));
 }
-function V(t) {
+function G(t) {
   return t ? !!(t && typeof t != "symbol") : Symbol(`pk.${Date.now()}.${crypto.randomUUID()}`);
 }
-function X(t) {
-  return t instanceof G;
+function K(t) {
+  return t instanceof Q;
 }
-function g(t) {
+function h(t) {
   return JSON.stringify(t);
 }
-const yt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+const ft = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
-  hash: g,
-  isEventError: X,
-  pk: V,
-  sleep: K
+  hash: h,
+  isEventError: K,
+  pk: G,
+  sleep: W
 }, Symbol.toStringTag, { value: "Module" }));
-function d(t, e) {
+function f(t, e) {
   const n = a.useRef(null), r = a.useRef(null);
   return a.useMemo(() => {
-    const s = g(e);
-    if (r.current !== s) {
-      r.current = s;
-      const o = t();
-      return n.current = o, o;
+    const o = h(e);
+    if (r.current !== o) {
+      r.current = o;
+      const s = t();
+      return n.current = s, s;
     }
     return n.current;
   }, e);
 }
-function j(t, e) {
+function C(t, e) {
   const n = a.useRef(null);
   a.useEffect(() => {
-    const r = g(e);
+    const r = h(e);
     if (n.current !== r)
       return n.current = r, t();
   }, e);
 }
-const B = a.createContext({
-  appEmitter: new D()
+const _ = a.createContext({
+  appEmitter: new M()
 });
-function H() {
-  return a.useContext(B);
+function B() {
+  return a.useContext(_);
 }
-function Y(t) {
+function dt({ children: t }) {
   return () => {
-    const e = d(
+    const e = f(
       () => ({
-        appEmitter: new D()
+        appEmitter: new M()
       }),
       []
     );
-    return /* @__PURE__ */ p(B.Provider, { value: e, children: /* @__PURE__ */ p(t, {}) });
+    return /* @__PURE__ */ $(_.Provider, { value: e, children: t });
   };
 }
-function Z(t) {
-  return d(
+function V(t) {
+  return f(
     () => ({
       controller: {
         get model() {
           return t.model.current.stateful;
         },
-        get props() {
-          return t.props.current;
-        },
-        get router() {
-          return t.router.current;
-        },
         queue: [],
         actions: {
           annotate(e, n) {
-            return J(e, n);
+            return I(e, n);
           },
           produce(e) {
-            return (n, r) => Q(n, r, e);
+            return (n, r) => F(n, r, e);
           },
           dispatch([e, ...n]) {
             if (e == null) return Promise.reject();
@@ -276,9 +269,6 @@ function Z(t) {
         get model() {
           return t.model.current.stateless;
         },
-        get props() {
-          return t.props.current;
-        },
         get validate() {
           return t.model.current.validatable;
         },
@@ -294,111 +284,70 @@ function Z(t) {
     []
   );
 }
-function L(t) {
-  return d(() => {
-    var r, s;
-    const e = (s = (r = t.options).controller) == null ? void 0 : s.call(r, t.actions.controller);
-    return e ? (Object.entries(e).forEach(([o, u]) => t.dispatchers.attach(o, u)), e) : void 0;
+function X(t) {
+  return f(() => {
+    const e = t.options.using.actions(t.actions.controller);
+    return Object.entries(e).forEach(([r, o]) => t.dispatchers.attach(r, o)), e;
   }, []);
 }
-function tt(t) {
-  const e = H(), n = W(t);
-  return d(() => {
-    const r = new D(), s = e.appEmitter;
+function Y(t) {
+  const e = B(), n = J(t);
+  return f(() => {
+    const r = new M(), o = e.appEmitter;
     return {
-      attach(o, u) {
-        const c = String(o);
-        _(c) ? s.on(c, n(o, u)) : r.on(c, n(o, u));
+      attach(s, u) {
+        const i = String(s);
+        A(i) ? o.on(i, n(s, u)) : r.on(i, n(s, u));
       },
-      dispatch(o, u, c) {
-        const i = String(o);
-        _(i) ? s.emit(i, c, u) : r.emit(i, c, u);
+      dispatch(s, u, i) {
+        const l = String(s);
+        A(l) ? o.emit(l, i, u) : r.emit(l, i, u);
       }
     };
   }, []);
 }
-function et() {
+function Z() {
   const t = a.useRef(null);
-  return d(() => ({ customElement: t }), []);
+  return f(() => ({ customElement: t }), []);
 }
-function nt(t) {
-  var e, n, r, s;
-  j(() => {
+function L(t) {
+  C(() => {
     t.dispatchers.dispatch(m.Derive, []);
-  }, [
-    t.options.props,
-    (e = t.router.current) == null ? void 0 : e.location,
-    (n = t.router.current) == null ? void 0 : n.params,
-    (s = (r = t.router.current) == null ? void 0 : r.search) == null ? void 0 : s[0]
-  ]), j(() => (t.dispatchers.dispatch(m.Mount, []), t.dispatchers.dispatch(m.Node, [
+  }, [t.options.using.props]), C(() => (t.dispatchers.dispatch(m.Mount, []), t.dispatchers.dispatch(m.Node, [
     t.elements.customElement.current
   ]), () => t.dispatchers.dispatch(m.Unmount, [])), []);
 }
-function rt(t) {
-  const e = d(() => t.options.model ?? {}, []);
-  return a.useRef(new k(e, e));
-}
-function ot(t) {
-  const e = a.useRef(t.options.props);
-  return j(() => {
-    e.current = t.options.props, t.update.rerender();
-  }, [t.options.props]), e;
+function tt(t) {
+  const e = f(() => t.options.using.model ?? {}, []);
+  return a.useRef(new P(e, e));
 }
-function st() {
+function et() {
   return a.useRef(/* @__PURE__ */ new Set());
 }
-function ut() {
-  return a.useRef(null);
-}
-function ct({ using: t, children: e }) {
-  return h.useInRouterContext() ? /* @__PURE__ */ p(it, { using: t, children: e }) : e();
-}
-function it({ using: t, children: e }) {
-  return t.current = {
-    navigate: h.useNavigate(),
-    location: h.useLocation(),
-    params: h.useParams(),
-    search: h.useSearchParams()
-  }, /* @__PURE__ */ p(F, { children: e() });
-}
-function at() {
+function nt() {
   const [t, e] = a.useReducer((n) => n + 1, 0);
-  return d(() => ({ hash: t, rerender: e }), [t]);
+  return f(() => ({ hash: t, rerender: e }), [t]);
 }
-function lt({
+function rt({
   options: t
 }) {
-  const e = H(), n = at(), r = st(), s = et(), o = ut(), u = ot({ options: t, update: n }), c = rt({ options: t }), i = tt({ app: e, options: t, update: n, model: c, queue: r }), f = Z({
-    app: e,
-    options: t,
-    model: c,
-    dispatchers: i,
-    router: o,
-    props: u
-  });
-  return L({ options: t, dispatchers: i, actions: f }), nt({ options: t, dispatchers: i, elements: s, router: o, update: n }), d(() => a.createElement(t.name, {
-    ref: s.customElement,
+  const e = B(), n = nt(), r = et(), o = Z(), s = tt({ options: t }), u = Y({ app: e, options: t, update: n, model: s, queue: r }), i = V({ app: e, options: t, model: s, dispatchers: u });
+  return X({ options: t, dispatchers: u, actions: i }), L({ options: t, dispatchers: u, elements: o, update: n }), f(() => a.createElement("x-chizu", {
+    ref: o.customElement,
     style: { display: "contents" },
-    children: /* @__PURE__ */ p(ct, { using: o, children: () => t.view(f.view) })
-  }), [n.hash]);
+    children: t.children(i.view)
+  }), [n.hash, h(t.using.props)]);
 }
-function ft(t) {
-  return (e) => a.memo(
-    (n) => lt({
-      options: {
-        ...e,
-        name: t.join(""),
-        props: n
-      }
-    }),
-    (n, r) => g(n) === g(r)
-  );
+function st(t) {
+  return rt({ options: t });
 }
-const wt = { app: Y, module: ft };
+const ht = a.memo(st, (t, e) => h(t) === h(e));
 export {
-  G as EventError,
+  dt as Context,
+  Q as EventError,
   m as Lifecycle,
-  $ as State,
-  wt as create,
-  yt as utils
+  q as State,
+  ht as Tree,
+  B as useContext,
+  ft as utils
 };

package/dist/chizu.umd.cjs

@@ -1 +1 @@
-(function(s,u){typeof exports=="object"&&typeof module<"u"?u(exports,require("react/jsx-runtime"),require("immer"),require("lodash/get"),require("traverse"),require("react"),require("eventemitter3"),require("react-router-dom")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","immer","lodash/get","traverse","react","eventemitter3","react-router-dom"],u):(s=typeof globalThis<"u"?globalThis:s||self,u(s.Chizu={},s.jsxRuntime,s.Immer,s.get,s.Traverse,s.React,s.EventEmitter3,s.ReactRouterDOM))})(this,function(s,u,a,p,E,$,S,J){"use strict";var pe=Object.defineProperty;var H=s=>{throw TypeError(s)};var ve=(s,u,a)=>u in s?pe(s,u,{enumerable:!0,configurable:!0,writable:!0,value:a}):s[u]=a;var D=(s,u,a)=>ve(s,typeof u!="symbol"?u+"":u,a),F=(s,u,a)=>u.has(s)||H("Cannot "+a);var _=(s,u,a)=>(F(s,u,"read from private field"),a?a.call(s):u.get(s)),x=(s,u,a)=>u.has(s)?H("Cannot add the same private member more than once"):u instanceof WeakSet?u.add(s):u.set(s,a),k=(s,u,a,p)=>(F(s,u,"write to private field"),p?p.call(s,a):u.set(s,a),a);var b,R;function q(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const d=q($),g=q(J);class T{constructor(t){this.value=t}}class A{static Draft(t){return new T(t)}}D(A,"Op",{Add:1,Remove:2,Update:4,Move:8,Replace:16});var y=(e=>(e.Mount="lifecycle/mount",e.Node="lifecycle/node",e.Derive="lifecycle/derive",e.Error="distributed/lifecycle/error",e.Unmount="lifecycle/unmount",e))(y||{});const h={immer:new a.Immer,annotations:Symbol("annotations")};h.immer.setAutoFreeze(!1);class j{constructor(t,n,r=null){D(this,"process");this.value=t,this.operations=n,this.field=r,this.process=null}attach(t){return this.process=t,this}}function Q(e,t=[]){return new j(e,t)}class P{constructor(t,n=t){this.stateless=t,this.stateful=n}get validatable(){return C(this.stateful)}}function C(e,t=[]){return new Proxy(e,{get(n,r){switch(r){case"is":return c=>{const o=O(e,t);if(!o)return!1;const i=new Set(o.flatMap(f=>f.operations));return!!(Array.from(i).reduce((f,m)=>f|(m??0),0)&c)};case"pending":return()=>!!O(e,t);case"draft":return()=>{const c=O(e,t);if(!c)return p(e,t);const o=c.flatMap(i=>i.operations).find(i=>i instanceof T);return o?o.value:p(e,t)}}return C(e,[...t,String(r)])}})}function O(e,t){const r=typeof p(e,t)=="object"?t:t.slice(0,-1),c=r.length===0?e:p(e,r),o=(c==null?void 0:c[h.annotations])??[];return o.length>0?o:null}function W(e,t,n){function r(o){return E(o).forEach(function(){if(this.key===h.annotations){this.block();return}this.node instanceof j&&this.update(this.node.value)})}function c(o){return E(o).forEach(function(){if(this.key===h.annotations){this.block();return}if(this.node instanceof j){const i=typeof this.node.value=="object",l=[...i?this.path:this.path.slice(0,-1),h.annotations],f=p(e.stateful,l)??[],m=this.node.attach(t);i?this.update({...this.node.value,[h.annotations]:[m,...f]},!0):(this.parent&&(this.parent.node[h.annotations]=[m,...f]),this.update(this.node.value,!0))}})}return new P(r(h.immer.produce(e.stateless,n)),c(h.immer.produce(e.stateful,n)))}function I(e,t){const n=E(e.stateful).forEach(function(){if(this.key===h.annotations){this.block();return}if(this.node&&this.node[h.annotations]){const r=this.node[h.annotations];this.update({...this.node,[h.annotations]:r.filter(c=>c.process!==t)},!0)}});return new P(e.stateless,n)}function G(e){return(t,n)=>async(r=Promise.withResolvers(),c)=>{if(typeof n!="function")return;const o=Symbol("process"),i=n(...c);if(i==null)return void r.resolve();if(typeof i=="function"){const l=i(e.model.current,o);return e.model.current=I(l,o),e.update.rerender(),void r.resolve()}for(;;){const{value:l,done:f}=await i.next();if(f){const me=l(e.model.current,o);e.model.current=I(me,o),e.update.rerender();break}const m=l;e.model.current=m(e.model.current,o),e.update.rerender()}r.resolve()}}function U(e){return e.startsWith("distributed")}class N extends Error{constructor(n,r=null){super(String(r));x(this,b);x(this,R);k(this,b,n),k(this,R,r)}get type(){return _(this,b)}get message(){return _(this,R)||""}}b=new WeakMap,R=new WeakMap;function K(e){return new Promise(t=>setTimeout(t,e))}function V(e){return e?!!(e&&typeof e!="symbol"):Symbol(`pk.${Date.now()}.${crypto.randomUUID()}`)}function X(e){return e instanceof N}function w(e){return JSON.stringify(e)}const Y=Object.freeze(Object.defineProperty({__proto__:null,hash:w,isEventError:X,pk:V,sleep:K},Symbol.toStringTag,{value:"Module"}));function v(e,t){const n=d.useRef(null),r=d.useRef(null);return d.useMemo(()=>{const c=w(t);if(r.current!==c){r.current=c;const o=e();return n.current=o,o}return n.current},t)}function M(e,t){const n=d.useRef(null);d.useEffect(()=>{const r=w(t);if(n.current!==r)return n.current=r,e()},t)}const z=d.createContext({appEmitter:new S});function B(){return d.useContext(z)}function Z(e){return()=>{const t=v(()=>({appEmitter:new S}),[]);return u.jsx(z.Provider,{value:t,children:u.jsx(e,{})})}}function L(e){return v(()=>({controller:{get model(){return e.model.current.stateful},get props(){return e.props.current},get router(){return e.router.current},queue:[],actions:{annotate(t,n){return Q(t,n)},produce(t){return(n,r)=>W(n,r,t)},dispatch([t,...n]){if(t==null)return Promise.reject();const r=Promise.withResolvers();return e.dispatchers.dispatch(t,n,r),r.promise}}},view:{get model(){return e.model.current.stateless},get props(){return e.props.current},get validate(){return e.model.current.validatable},actions:{dispatch([t,...n]){if(t==null)return Promise.reject();const r=Promise.withResolvers();return e.dispatchers.dispatch(t,n,r),r.promise}}}}),[])}function ee(e){return v(()=>{var r,c;const t=(c=(r=e.options).controller)==null?void 0:c.call(r,e.actions.controller);return t?(Object.entries(t).forEach(([o,i])=>e.dispatchers.attach(o,i)),t):void 0},[])}function te(e){const t=B(),n=G(e);return v(()=>{const r=new S,c=t.appEmitter;return{attach(o,i){const l=String(o);U(l)?c.on(l,n(o,i)):r.on(l,n(o,i))},dispatch(o,i,l){const f=String(o);U(f)?c.emit(f,l,i):r.emit(f,l,i)}}},[])}function ne(){const e=d.useRef(null);return v(()=>({customElement:e}),[])}function re(e){var t,n,r,c;M(()=>{e.dispatchers.dispatch(y.Derive,[])},[e.options.props,(t=e.router.current)==null?void 0:t.location,(n=e.router.current)==null?void 0:n.params,(c=(r=e.router.current)==null?void 0:r.search)==null?void 0:c[0]]),M(()=>(e.dispatchers.dispatch(y.Mount,[]),e.dispatchers.dispatch(y.Node,[e.elements.customElement.current]),()=>e.dispatchers.dispatch(y.Unmount,[])),[])}function se(e){const t=v(()=>e.options.model??{},[]);return d.useRef(new P(t,t))}function oe(e){const t=d.useRef(e.options.props);return M(()=>{t.current=e.options.props,e.update.rerender()},[e.options.props]),t}function ue(){return d.useRef(new Set)}function ce(){return d.useRef(null)}function ie({using:e,children:t}){return g.useInRouterContext()?u.jsx(ae,{using:e,children:t}):t()}function ae({using:e,children:t}){return e.current={navigate:g.useNavigate(),location:g.useLocation(),params:g.useParams(),search:g.useSearchParams()},u.jsx(u.Fragment,{children:t()})}function le(){const[e,t]=d.useReducer(n=>n+1,0);return v(()=>({hash:e,rerender:t}),[e])}function fe({options:e}){const t=B(),n=le(),r=ue(),c=ne(),o=ce(),i=oe({options:e,update:n}),l=se({options:e}),f=te({app:t,options:e,update:n,model:l,queue:r}),m=L({app:t,options:e,model:l,dispatchers:f,router:o,props:i});return ee({options:e,dispatchers:f,actions:m}),re({options:e,dispatchers:f,elements:c,router:o,update:n}),v(()=>d.createElement(e.name,{ref:c.customElement,style:{display:"contents"},children:u.jsx(ie,{using:o,children:()=>e.view(m.view)})}),[n.hash])}function de(e){return t=>d.memo(n=>fe({options:{...t,name:e.join(""),props:n}}),(n,r)=>w(n)===w(r))}const he={app:Z,module:de};s.EventError=N,s.Lifecycle=y,s.State=A,s.create=he,s.utils=Y,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});
+(function(s,u){typeof exports=="object"&&typeof module<"u"?u(exports,require("immer"),require("lodash/get"),require("traverse"),require("react/jsx-runtime"),require("react"),require("eventemitter3")):typeof define=="function"&&define.amd?define(["exports","immer","lodash/get","traverse","react/jsx-runtime","react","eventemitter3"],u):(s=typeof globalThis<"u"?globalThis:s||self,u(s.Chizu={},s.Immer,s.get,s.Traverse,s.jsxRuntime,s.React,s.EventEmitter3))})(this,function(s,u,a,p,N,I,E){"use strict";var ae=Object.defineProperty;var B=s=>{throw TypeError(s)};var le=(s,u,a)=>u in s?ae(s,u,{enumerable:!0,configurable:!0,writable:!0,value:a}):s[u]=a;var O=(s,u,a)=>le(s,typeof u!="symbol"?u+"":u,a),H=(s,u,a)=>u.has(s)||B("Cannot "+a);var M=(s,u,a)=>(H(s,u,"read from private field"),a?a.call(s):u.get(s)),P=(s,u,a)=>u.has(s)?B("Cannot add the same private member more than once"):u instanceof WeakSet?u.add(s):u.set(s,a),D=(s,u,a,p)=>(H(s,u,"write to private field"),p?p.call(s,a):u.set(s,a),a);var g,w;function $(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const f=$(I);class k{constructor(t){this.value=t}}class T{static Draft(t){return new k(t)}}O(T,"Op",{Add:1,Remove:2,Update:4,Move:8,Replace:16});var v=(e=>(e.Mount="lifecycle/mount",e.Node="lifecycle/node",e.Derive="lifecycle/derive",e.Error="distributed/lifecycle/error",e.Unmount="lifecycle/unmount",e))(v||{});const d={immer:new u.Immer,annotations:Symbol("annotations")};d.immer.setAutoFreeze(!1);class j{constructor(t,n,r=null){O(this,"process");this.value=t,this.operations=n,this.field=r,this.process=null}attach(t){return this.process=t,this}}function F(e,t=[]){return new j(e,t)}class S{constructor(t,n=t){this.stateless=t,this.stateful=n}get validatable(){return _(this.stateful)}}function _(e,t=[]){return new Proxy(e,{get(n,r){switch(r){case"is":return i=>{const o=R(e,t);if(!o)return!1;const c=new Set(o.flatMap(h=>h.operations));return!!(Array.from(c).reduce((h,b)=>h|(b??0),0)&i)};case"pending":return()=>!!R(e,t);case"draft":return()=>{const i=R(e,t);if(!i)return a(e,t);const o=i.flatMap(c=>c.operations).find(c=>c instanceof k);return o?o.value:a(e,t)}}return _(e,[...t,String(r)])}})}function R(e,t){const r=typeof a(e,t)=="object"?t:t.slice(0,-1),i=r.length===0?e:a(e,r),o=(i==null?void 0:i[d.annotations])??[];return o.length>0?o:null}function J(e,t,n){function r(o){return p(o).forEach(function(){if(this.key===d.annotations){this.block();return}this.node instanceof j&&this.update(this.node.value)})}function i(o){return p(o).forEach(function(){if(this.key===d.annotations){this.block();return}if(this.node instanceof j){const c=typeof this.node.value=="object",l=[...c?this.path:this.path.slice(0,-1),d.annotations],h=a(e.stateful,l)??[],b=this.node.attach(t);c?this.update({...this.node.value,[d.annotations]:[b,...h]},!0):(this.parent&&(this.parent.node[d.annotations]=[b,...h]),this.update(this.node.value,!0))}})}return new S(r(d.immer.produce(e.stateless,n)),i(d.immer.produce(e.stateful,n)))}function q(e,t){const n=p(e.stateful).forEach(function(){if(this.key===d.annotations){this.block();return}if(this.node&&this.node[d.annotations]){const r=this.node[d.annotations];this.update({...this.node,[d.annotations]:r.filter(i=>i.process!==t)},!0)}});return new S(e.stateless,n)}function Q(e){return(t,n)=>async(r=Promise.withResolvers(),i)=>{if(typeof n!="function")return;const o=Symbol("process"),c=n(...i);if(c==null)return void r.resolve();if(typeof c=="function"){const l=c(e.model.current,o);return e.model.current=q(l,o),e.update.rerender(),void r.resolve()}for(;;){const{value:l,done:h}=await c.next();if(h){const ce=l(e.model.current,o);e.model.current=q(ce,o),e.update.rerender();break}const b=l;e.model.current=b(e.model.current,o),e.update.rerender()}r.resolve()}}function C(e){return e.startsWith("distributed")}class A extends Error{constructor(n,r=null){super(String(r));P(this,g);P(this,w);D(this,g,n),D(this,w,r)}get type(){return M(this,g)}get message(){return M(this,w)||""}}g=new WeakMap,w=new WeakMap;function W(e){return new Promise(t=>setTimeout(t,e))}function G(e){return e?!!(e&&typeof e!="symbol"):Symbol(`pk.${Date.now()}.${crypto.randomUUID()}`)}function K(e){return e instanceof A}function y(e){return JSON.stringify(e)}const V=Object.freeze(Object.defineProperty({__proto__:null,hash:y,isEventError:K,pk:G,sleep:W},Symbol.toStringTag,{value:"Module"}));function m(e,t){const n=f.useRef(null),r=f.useRef(null);return f.useMemo(()=>{const i=y(t);if(r.current!==i){r.current=i;const o=e();return n.current=o,o}return n.current},t)}function U(e,t){const n=f.useRef(null);f.useEffect(()=>{const r=y(t);if(n.current!==r)return n.current=r,e()},t)}const z=f.createContext({appEmitter:new E});function x(){return f.useContext(z)}function X({children:e}){return()=>{const t=m(()=>({appEmitter:new E}),[]);return N.jsx(z.Provider,{value:t,children:e})}}function Y(e){return m(()=>({controller:{get model(){return e.model.current.stateful},queue:[],actions:{annotate(t,n){return F(t,n)},produce(t){return(n,r)=>J(n,r,t)},dispatch([t,...n]){if(t==null)return Promise.reject();const r=Promise.withResolvers();return e.dispatchers.dispatch(t,n,r),r.promise}}},view:{get model(){return e.model.current.stateless},get validate(){return e.model.current.validatable},actions:{dispatch([t,...n]){if(t==null)return Promise.reject();const r=Promise.withResolvers();return e.dispatchers.dispatch(t,n,r),r.promise}}}}),[])}function Z(e){return m(()=>{const t=e.options.using.actions(e.actions.controller);return Object.entries(t).forEach(([r,i])=>e.dispatchers.attach(r,i)),t},[])}function L(e){const t=x(),n=Q(e);return m(()=>{const r=new E,i=t.appEmitter;return{attach(o,c){const l=String(o);C(l)?i.on(l,n(o,c)):r.on(l,n(o,c))},dispatch(o,c,l){const h=String(o);C(h)?i.emit(h,l,c):r.emit(h,l,c)}}},[])}function ee(){const e=f.useRef(null);return m(()=>({customElement:e}),[])}function te(e){U(()=>{e.dispatchers.dispatch(v.Derive,[])},[e.options.using.props]),U(()=>(e.dispatchers.dispatch(v.Mount,[]),e.dispatchers.dispatch(v.Node,[e.elements.customElement.current]),()=>e.dispatchers.dispatch(v.Unmount,[])),[])}function ne(e){const t=m(()=>e.options.using.model??{},[]);return f.useRef(new S(t,t))}function re(){return f.useRef(new Set)}function se(){const[e,t]=f.useReducer(n=>n+1,0);return m(()=>({hash:e,rerender:t}),[e])}function oe({options:e}){const t=x(),n=se(),r=re(),i=ee(),o=ne({options:e}),c=L({app:t,options:e,update:n,model:o,queue:r}),l=Y({app:t,options:e,model:o,dispatchers:c});return Z({options:e,dispatchers:c,actions:l}),te({options:e,dispatchers:c,elements:i,update:n}),m(()=>f.createElement("x-chizu",{ref:i.customElement,style:{display:"contents"},children:e.children(l.view)}),[n.hash,y(e.using.props)])}function ue(e){return oe({options:e})}const ie=f.memo(ue,(e,t)=>y(e)===y(t));s.Context=X,s.EventError=A,s.Lifecycle=v,s.State=T,s.Tree=ie,s.useContext=x,s.utils=V,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});

package/dist/context/index.d.ts

@@ -0,0 +1,4 @@
+import { AppContext, Props } from './types.ts';
+import * as React from "react";
+export declare function useApp(): AppContext;
+export declare function AppContext({ children }: Props): React.ComponentType;

package/dist/{app → context}/types.d.ts

@@ -5,3 +5,6 @@ export type AppContext = {
     appEmitter: EventEmitter;
 };
 export type UseApp = AppContext;
+export type Props = {
+    children: React.ReactNode;
+};

package/dist/controller/types.d.ts

@@ -1,8 +1,7 @@
 import { EventError } from '../module/renderer/dispatchers/utils.ts';
 import { Models } from '../module/renderer/model/utils.ts';
 import { Head } from '../module/renderer/types.ts';
-import { Actions, Draft, Lifecycle, ModuleDefinition, Op, Query, Queue } from '../types/index.ts';
-import * as Router from "../module/renderer/router/types.ts";
+import { Actions, Draft, Lifecycle, ModuleDefinition, Op, Queue } from '../types/index.ts';
 export type ControllerActions<M extends ModuleDefinition> = {
     annotate<T>(value: T, operations?: (Op | Draft<T>)[]): T;
     produce(ƒ: (model: M["Model"]) => void): (models: Models<M["Model"]>, process: Symbol) => Models<M["Model"]>;
@@ -11,9 +10,7 @@ export type ControllerActions<M extends ModuleDefinition> = {
 export type ControllerArgs<M extends ModuleDefinition> = Readonly<{
     model: Readonly<M["Model"]>;
     queue: Readonly<Queue<M["Actions"]>>;
-    router: M["Query"] extends NonNullable<Query> ? Readonly<Router.Context<M["Query"]>> : null;
     actions: Readonly<ControllerActions<M>>;
-    props: Readonly<M["Props"]>;
 }>;
 export type ActionEvent<M extends ModuleDefinition> = (...args: M["Actions"][number]) => ActionGenerator<M>;
 type ActionEvents<M extends ModuleDefinition> = {

package/dist/index.d.ts

@@ -1,16 +1,12 @@
-import { default as app } from './app/index.tsx';
 import { ControllerDefinition } from './controller/types.ts';
-import { default as module } from './module/index.tsx';
 import { ViewArgs, ViewDefinition } from './view/types.ts';
 export { Lifecycle, State } from './types/index.ts';
 export * as utils from './utils/index.ts';
-export declare const create: {
-    app: typeof app;
-    module: typeof module;
-};
 export { EventError } from './module/renderer/dispatchers/utils.ts';
-export type * as Create from './types/index.ts';
+export { default as Tree } from './module/index.tsx';
+export { AppContext as Context, useApp as useContext, } from './context/index.tsx';
+export type * as Typed from './types/index.ts';
 export type { Pk } from './types/index.ts';
 export type { ViewDefinition as View };
 export type { ViewArgs as Within };
-export type { ControllerDefinition as Controller };
+export type { ControllerDefinition as Actions };

package/dist/module/index.d.ts

@@ -1,4 +1,6 @@
 import { ModuleDefinition } from '../types/index.ts';
-import { Options } from './types.ts';
+import { UseOptions } from './types.ts';
 import * as React from "react";
-export default function module<M extends ModuleDefinition>(name: TemplateStringsArray): (options: Options<M>) => React.ComponentType<M["Props"]>;
+declare function Tree<M extends ModuleDefinition>(options: UseOptions<M>): React.ReactNode;
+declare const _default: typeof Tree;
+export default _default;

package/dist/module/renderer/actions/types.d.ts

@@ -1,19 +1,15 @@
-import { UseApp } from '../../../app/types.ts';
+import { UseApp } from '../../../context/types.ts';
 import { ControllerArgs } from '../../../controller/types.ts';
 import { ModuleDefinition } from '../../../types/index.ts';
 import { ViewArgs } from '../../../view/types.ts';
+import { UseOptions } from '../../types.ts';
 import { UseDispatchers } from '../dispatchers/types.ts';
 import { UseModel } from '../model/types.ts';
-import { UseProps } from '../props/types.ts';
-import { UseRouter } from '../router/types.ts';
-import { UseOptions } from '../types.ts';
 export type Props<M extends ModuleDefinition> = {
     app: UseApp;
     options: UseOptions<M>;
     model: UseModel;
     dispatchers: UseDispatchers;
-    router: UseRouter;
-    props: UseProps;
 };
 export type UseActions<M extends ModuleDefinition> = {
     controller: ControllerArgs<M>;

package/dist/module/renderer/controller/index.d.ts

@@ -1,3 +1,3 @@
 import { ModuleDefinition } from '../../../types/index.ts';
 import { Props } from './types.ts';
-export default function useController<M extends ModuleDefinition>(props: Props<M>): import('../../../controller/types.ts').ControllerInstance<M> | undefined;
+export default function useController<M extends ModuleDefinition>(props: Props<M>): import('../../../controller/types.ts').ControllerInstance<M>;

package/dist/module/renderer/controller/types.d.ts

@@ -1,7 +1,7 @@
 import { ModuleDefinition } from '../../../types/index.ts';
+import { UseOptions } from '../../types.ts';
 import { UseActions } from '../actions/types.ts';
 import { UseDispatchers } from '../dispatchers/types.ts';
-import { UseOptions } from '../types.ts';
 import { default as useController } from './index.ts';
 export type Props<M extends ModuleDefinition> = {
     actions: UseActions<M>;

package/dist/module/renderer/dispatchers/types.d.ts

@@ -1,8 +1,8 @@
-import { UseApp } from '../../../app/types.ts';
+import { UseApp } from '../../../context/types.ts';
 import { ModuleDefinition } from '../../../types/index.ts';
+import { UseOptions } from '../../types.ts';
 import { UseModel } from '../model/types.ts';
 import { UseQueue } from '../queue/types.ts';
-import { UseOptions } from '../types.ts';
 import { UseUpdate } from '../update/types.ts';
 import { default as useDispatchers } from './index.ts';
 export type Props<M extends ModuleDefinition> = {

package/dist/module/renderer/lifecycles/types.d.ts

@@ -1,15 +1,13 @@
 import { ModuleDefinition } from '../../../types/index.ts';
+import { UseOptions } from '../../types.ts';
 import { UseDispatchers } from '../dispatchers/types.ts';
 import { UseElements } from '../elements/types.ts';
-import { UseRouter } from '../router/types.ts';
-import { UseOptions } from '../types.ts';
 import { UseUpdate } from '../update/types.ts';
 import { default as useLifecycles } from './index.ts';
 export type Props<M extends ModuleDefinition> = {
     options: UseOptions<M>;
     elements: UseElements;
     dispatchers: UseDispatchers;
-    router: UseRouter;
     update: UseUpdate;
 };
 export type UseLifecycles = ReturnType<typeof useLifecycles>;

package/dist/module/renderer/model/types.d.ts

@@ -1,6 +1,6 @@
 import { default as useModel } from '.';
 import { ModuleDefinition, State } from '../../../types/index.ts';
-import { UseOptions } from '../types.ts';
+import { UseOptions } from '../../types.ts';
 export type Props<M extends ModuleDefinition> = {
     options: UseOptions<M>;
 };

package/dist/module/renderer/types.d.ts

@@ -1,12 +1,8 @@
 import { ModuleDefinition } from '../../types/index.ts';
-import { Options } from '../types.ts';
+import { UseOptions } from '../types.ts';
 export type ElementName = string;
 export type Props<M extends ModuleDefinition> = {
     options: UseOptions<M>;
 };
-export type UseOptions<M extends ModuleDefinition> = Options<M> & {
-    name: ElementName;
-    props: M["Props"];
-};
 export type Head<T extends any[]> = T extends [infer X, ...any[]] ? X : never;
 export type Tail<T extends any[]> = T extends [any, ...infer XS] ? XS : never;

package/dist/module/types.d.ts

@@ -1,9 +1,11 @@
 import { ControllerDefinition } from '../controller/types.ts';
 import { ModuleDefinition } from '../types/index.ts';
-import { ViewDefinition } from '../view/types.ts';
-export type ElementName = string;
-export type Options<M extends ModuleDefinition> = {
-    model?: M["Model"];
-    view: ViewDefinition<M>;
-    controller?: ControllerDefinition<M>;
+import { ViewArgs } from '../view/types.ts';
+export type UseOptions<M extends ModuleDefinition> = {
+    using: {
+        model: M["Model"];
+        actions: ControllerDefinition<M>;
+        props?: M["Props"];
+    };
+    children(module: ViewArgs<M>): React.ReactNode;
 };

package/dist/types/index.d.ts

@@ -30,23 +30,15 @@ export declare enum Lifecycle {
 export type Model = Record<string, any>;
 export type Actions = [] | [ActionName] | [ActionName, ...ActionPayload];
 export type Props = Record<string, unknown>;
-export type Query = null | string;
-export type Module<T extends {
-    Model?: Model;
-    Actions?: Actions;
-    Props?: Props;
-    Query?: Query;
-} = {}> = {
-    Model: T["Model"] extends Model ? T["Model"] : {};
-    Actions: T["Actions"] extends Actions ? T["Actions"] : [];
-    Props: T["Props"] extends Props ? T["Props"] : {};
-    Query: T["Query"] extends Query ? T["Query"] : null;
+export type Module<M extends Model, A extends Actions = [], P extends Props = {}> = {
+    Model: M;
+    Actions: A;
+    Props: P;
 };
 export type ModuleDefinition = {
     Model: Model;
     Actions: Actions;
     Props: Props;
-    Query: Query;
 };
 export type Pk<T> = undefined | Symbol | T;
 export type Queue<A extends ModuleDefinition["Actions"]> = {

package/dist/view/types.d.ts

@@ -8,6 +8,5 @@ export type ViewArgs<M extends ModuleDefinition> = Readonly<{
     model: Readonly<M["Model"]>;
     validate: Readonly<Validatable<M["Model"]>>;
     actions: Readonly<ViewActions<M>>;
-    props: Readonly<M["Props"]>;
 }>;
 export type ViewDefinition<M extends ModuleDefinition> = (actions: ViewArgs<M>) => React.ReactNode;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chizu",
-  "version": "0.2.12",
+  "version": "0.2.13",
   "type": "module",
   "main": "./dist/chizu.js",
   "types": "./dist/index.d.ts",

package/dist/app/index.d.ts

@@ -1,4 +0,0 @@
-import { AppContext } from './types.ts';
-import * as React from "react";
-export declare function useApp(): AppContext;
-export default function app(Tree: React.ComponentType): React.ComponentType;

package/dist/module/renderer/props/index.d.ts

@@ -1,4 +0,0 @@
-import { ModuleDefinition } from '../../../types/index.ts';
-import { Props } from './types.ts';
-import * as React from "react";
-export default function useProps<M extends ModuleDefinition>(props: Props<M>): React.RefObject<Readonly<M["Props"]>>;

package/dist/module/renderer/props/types.d.ts

@@ -1,9 +0,0 @@
-import { ModuleDefinition } from '../../../types/index.ts';
-import { UseOptions } from '../types.ts';
-import { UseUpdate } from '../update/types.ts';
-import { default as useProps } from './index.ts';
-export type Props<M extends ModuleDefinition> = {
-    options: UseOptions<M>;
-    update: UseUpdate;
-};
-export type UseProps = ReturnType<typeof useProps>;

package/dist/module/renderer/router/index.d.ts

@@ -1,6 +0,0 @@
-import { Query } from '../../../types/index.ts';
-import { Context, Props } from './types.ts';
-import * as React from "react";
-export declare function useRouter(): React.RefObject<Partial<Context<Query>> | null>;
-export declare function Router({ using, children }: Props): React.ReactNode;
-export declare function Setup({ using, children }: Props): React.ReactNode;

package/dist/module/renderer/router/types.d.ts

@@ -1,15 +0,0 @@
-import { Query } from '../../../types/index.ts';
-import { useRouter } from './index.ts';
-import * as React from "react";
-import * as ReactRouterDOM from "react-router-dom";
-export type Props = {
-    using: UseRouter;
-    children(): React.ReactNode;
-};
-export type UseRouter = ReturnType<typeof useRouter>;
-export type Context<Q extends null | Query> = {
-    navigate: ReactRouterDOM.NavigateFunction;
-    location: ReactRouterDOM.Location;
-    params: Q extends NonNullable<Query> ? Readonly<ReactRouterDOM.Params<Q>> : null;
-    search: [URLSearchParams, ReactRouterDOM.SetURLSearchParams];
-};