bunja 0.0.1 → 0.0.3

package/README.md

@@ -15,8 +15,8 @@ Bunja is a library designed to address these weaknesses.\
 Each state defined with Bunja has a lifetime that begins when it is first depended on somewhere in the render tree and ends when all dependencies disappear.
 
 Therefore, when writing a state to manage a WebSocket,
-you only need to create a mount handler that establishes the WebSocket connection and an unmount handler that terminates the connection.\
-The library automatically tracks the actual usage period and calls the mount and unmount handlers as needed.
+you only need to create a function that establishes the WebSocket connection and an dispose handler that terminates the connection.\
+The library automatically tracks the actual usage period and calls the init and dispose as needed.
 
 ## So, do I no longer need jotai or other state management libraries?
 
@@ -33,27 +33,27 @@ You can use `bunja` to define a state with a finite lifetime and use the `useBun
 You can define a bunja using the `bunja` function. When you access the defined bunja with the `useBunja` hook, a bunja instance is created.\
 If all components in the render tree that refer to the bunja disappear, the bunja instance is automatically destroyed.
 
-You can also register functions to be called when the dependency on the bunja starts and ends by using the `mount` and `unmount` fields in the init function's return value.
+If you want to clean up resources when the bunja's lifetime ends, you can use the `Symbol.dispose` field.
 
 ```ts
 const countBunja = bunja([], () => {
   const countAtom = atom(0);
   return {
-    value: countAtom,
-    mount: () => console.log("mounted"),
-    unmount: () => console.log("unmounted"),
+    countAtom,
+    [Symbol.dispose]() {
+      console.log("disposed");
+    },
   };
 });
 
 function MyComponent() {
-  const countAtom = useBunja(countBunja);
+  const { countAtom } = useBunja(countBunja);
   const [count, setCount] = useAtom(countAtom);
   // Your component logic here
 }
 ```
 
 This code snippet defines a bunja that creates a `countAtom`.\
-The `mount` function is logged when the bunja instance is first accessed,
-and the `unmount` function is logged when it is no longer referenced by any component in the render tree.
+The `Symbol.dispose` method is used when the bunja instance is no longer referenced by any component in the render tree, allowing you to clean up resources appropriately.
 
 TODO: context

package/bunja.ts

@@ -1,5 +1,9 @@
 import * as React from "react";
 
+disposePolyfill: {
+  (Symbol as any).dispose ??= Symbol("Symbol.dispose");
+}
+
 type Dep<T> = React.Context<T> | Bunja<T>;
 
 class Bunja<T> {
@@ -7,32 +11,24 @@ class Bunja<T> {
     public id: number,
     public deps: Dep<any>[],
     public contexts: React.Context<any>[],
-    public init: (args: any[], dispose: () => void) => BunjaInstance<T>
+    public init: (...args: any[]) => T
   ) {}
 }
 
-interface BunjaInitResult<T> {
-  value: T;
-  mount?: () => void;
-  unmount?: () => void;
-}
-
-export function bunja<T>(deps: [], init: () => BunjaInitResult<T>): Bunja<T>;
-export function bunja<T, U>(
-  deps: [Dep<U>],
-  init: (u: U) => BunjaInitResult<T>
-): Bunja<T>;
+const bunjas: Record<string, BunjaInstance<any>> = {};
+export function bunja<T>(deps: [], init: () => T): Bunja<T>;
+export function bunja<T, U>(deps: [Dep<U>], init: (u: U) => T): Bunja<T>;
 export function bunja<T, U, V>(
   deps: [Dep<U>, Dep<V>],
-  init: (u: U, v: V) => BunjaInitResult<T>
+  init: (u: U, v: V) => T
 ): Bunja<T>;
 export function bunja<T, U, V, W>(
   deps: [Dep<U>, Dep<V>, Dep<W>],
-  init: (u: U, v: V, w: W) => BunjaInitResult<T>
+  init: (u: U, v: V, w: W) => T
 ): Bunja<T>;
 export function bunja<T, const U extends any[]>(
   deps: { [K in keyof U]: Dep<U[K]> },
-  init: (...args: U) => BunjaInitResult<T>
+  init: (...args: U) => T
 ): Bunja<T> {
   const contexts = deps.filter(
     (dep) => !(dep instanceof Bunja)
@@ -41,17 +37,12 @@ export function bunja<T, const U extends any[]>(
   const dedupedContexts = Array.from(
     new Set([...contexts, ...bunjas.flatMap((def) => def.contexts)])
   );
-  return new Bunja(bunja.counter++, deps, dedupedContexts, (args, dispose) => {
-    const noop = () => {};
-    const { value, mount = noop, unmount = noop } = init(...(args as U));
-    mount();
-    return new BunjaInstance(() => (dispose(), unmount()), value);
-  });
+  return new Bunja(bunja.counter++, deps, dedupedContexts, init);
 }
 bunja.counter = 0;
 
 export function useBunja<T>(bunja: Bunja<T>): T {
-  const { id, deps, contexts } = bunja;
+  const { id, deps, contexts, init } = bunja;
   const rid = useRid();
   const tuples = contexts.map((c) => [c, React.useContext(c)] as const);
   const scopes = tuples.map(([context, value]) => getScope(context, value));
@@ -64,28 +55,21 @@ export function useBunja<T>(bunja: Bunja<T>): T {
     .map(({ id }) => id)
     .sort()
     .join(",")}`;
-  const bunjaInstance = getBunjaInstance(bunja, biid, args);
+  const instance = (bunjas[biid] ??= new BunjaInstance(biid, init(...args)));
   React.useEffect(() => {
-    bunjaInstance.reg(rid);
-    return () => bunjaInstance.dereg(rid);
-  }, [bunjaInstance]);
+    instance.reg(rid);
+    return () => instance.dereg(rid);
+  }, [instance]);
   React.useEffect(() => {
     scopes.forEach((scope) => scope.reg(rid));
     return () => scopes.forEach((scope) => scope.dereg(rid));
   }, [rid, ...scopes]);
-  return bunjaInstance.value;
+  return instance.value;
 }
 
 const useRid = () => React.useState(() => useRid.counter++)[0];
 useRid.counter = 0;
 
-const bunjas: Record<string, BunjaInstance<any>> = {};
-function getBunjaInstance<T>(bunja: Bunja<T>, biid: string, args: any[]) {
-  return (bunjas[biid] ??= bunja.init(args, () => {
-    delete bunjas[biid];
-  }));
-}
-
 const scopes = new WeakMap<React.Context<any>, Map<any, Scope>>();
 function getScope(context: React.Context<any>, value: any) {
   const m = scopes.get(context) ?? scopes.set(context, new Map()).get(context)!;
@@ -98,7 +82,6 @@ getScope.counter = 0;
 class RefCounter<T = number> {
   #disposed = false;
   refs = new Set<T>();
-  constructor(public dispose: () => void) {}
   reg(reference: T) {
     this.refs.add(reference);
   }
@@ -108,15 +91,19 @@ class RefCounter<T = number> {
       if (this.#disposed) return;
       if (this.refs.size < 1) {
         this.#disposed = true;
-        this.dispose();
+        this[Symbol.dispose]();
       }
     });
   }
 }
 
 class BunjaInstance<T> extends RefCounter {
-  constructor(dispose: () => void, public value: T) {
-    super(dispose);
+  constructor(public biid: string, public value: T) {
+    super();
+  }
+  [Symbol.dispose]() {
+    delete bunjas[this.biid];
+    this.value[Symbol.dispose]?.();
   }
 }
 
@@ -127,6 +114,7 @@ class Scope extends RefCounter {
     public value: any,
     public id: number
   ) {
-    super(dispose);
+    super();
+    this[Symbol.dispose] = dispose;
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bunja",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "description": "State Lifetime Manager for React",
   "main": "bunja.ts",
   "scripts": {},

package/tsconfig.json

@@ -0,0 +1,5 @@
+{
+  "compilerOptions": {
+    "target": "ESNext"
+  }
+}