@e280/strata 0.0.0-6 → 0.0.0-7

package/README.md

@@ -4,12 +4,11 @@
 <br/>
 
 # ⛏️ strata
-📦 `npm install @e280/strata`  
-🫩 probably my tenth state management library, lol  
-
-<br/>
 
 ### get in loser, we're managing state
+📦 `npm install @e280/strata`  
+🧙‍♂️ probably my tenth state management library, lol  
+
 🚦 **signals** — ephemeral view-level state  
 🌳 **tree** — persistent app-level state  
 🪄 **tracker** — reactivity integration hub  
@@ -23,46 +22,66 @@
 <br/>
 
 ## 🚦 signals — *ephemeral view-level state*
-- `@e280/strata/signals`
+```ts
+import {signal, effect, computed} from "@e280/strata"
+```
+
+### each signal holds a value
+- **create a signal**
   ```ts
-  import {signal, effect, computed} from "@e280/strata"
+  const count = signal(0)
   ```
-- **signals are little bundles of joy**
+- **read a signal**
   ```ts
-  const count = signal(0)
-
-  console.log(count.get())
-    // 0
-
-  count.set(1)
+  count() // 0
+  ```
+- **set a signal**
+  ```ts
+  count(1)
+  ```
+- **set a signal, and await effect propagation**
+  ```ts
+  await count(2)
+  ```
+- **signals are for auto rerendering your ui.**  
+  components/views will auto rerender when relevant signals change  
+  — well only if your ui lib is cool and integrates `tracker`.
 
-  console.log(count.value)
-    // 1
+### pick your poison
+- **signals hipster fn syntax**
+  ```ts
+  count() // get
+  await count(2) // set
+  ```
+- **signals get/set syntax**
+  ```ts
+  count.get() // get
+  await count.set(2) // set
+  ```
+- **signals .value accessor syntax**
+  ```ts
+  count.value // get
+  count.value = 2 // set
   ```
-  - components/views will auto rerender when relevant signals change  
-    (if your component/view library is cool an integrates with `tracker`)
-  - three ways to get it
-    ```ts
-    count() // 1
-    count.get() // 1
-    count.value // 1
-    ```
-  - three ways to set it
-    ```ts
-    await count(2)
-    await count.set(2)
-    count.value = 2
-    ```
-  - using `await` here allows you to wait for downstream effects to finish
-- **effects are run when the relevant signals change**
+  value pattern is nice for this vibe
+  ```ts
+  count.value++
+  count.value += 1
+  ```
+
+### effects
+- **effects run when the relevant signals change**
   ```ts
   effect(() => console.log(count()))
-    // 2
+    // 1
+    // the system detects 'count' is relevant
 
   count.value++
-    // 3
+    // 2
+    // when count is changed, the effect fn is run
   ```
-- **computed signals are super lazy**
+- **computed signals are super lazy**  
+  they only run if and when you get the value
   ```ts
   const tenly = computed(() => {
     console.log("recomputed!")
@@ -71,23 +90,23 @@
 
   console.log(tenly())
     // "recomputed!"
-    // 30
+    // 20
 
-  await count(4)
+  await count(3)
 
   console.log(tenly.value)
     // "recomputed!"
-    // 40
+    // 30
   ```
 
 <br/>
 
 ## 🌳 tree — *persistent app-level state*
-- `@e280/strata/tree`
 - single-source-of-truth state tree
 - immutable except for `mutate(fn)` calls
 - undo/redo history, cross-tab sync, localStorage persistence
 - no spooky-dookie proxy magic — just god's honest javascript
+- separate but compatible with signals
 
 #### `Trunk` is your app's state tree root
 - better stick to json-friendly serializable data
@@ -186,7 +205,7 @@
   })
   ```
   - *big-brain moment:* the whole chronicle *itself* is stored in the state.. serializable.. think persistence — user can close their project, reopen, and their undo/redo history is still chillin' — *brat girl summer*
-- second, make a `Chronobranch` which is like a branch
+- second, make a `Chronobranch` which is like a branch, but is concerned with history
   ```ts
   const snacks = trunk.chronobranch(64, s => s.snacks)
     //                               \
@@ -207,13 +226,15 @@
   snacks.undoable // 2
   snacks.redoable // 1
   ```
-- chronobranch can have its own branch — all their mutations advance history
+- chronobranch can have its own branches — all their mutations advance history
 - plz pinky-swear right now, that you won't create a chronobranch under a branch under another chronobranch 💀
 
 <br/>
 
 ## 🪄 tracker — integrations
-- `@e280/strata/tracker`
+- ```ts
+  import {tracker} from "@e280/strata/tracker"
+  ```
 - all reactivity is orchestrated by the `tracker`
 - if you are integrating a new state object, or a new view layer that needs to react to state changes, just read [tracker.ts](./s/tracker/tracker.ts)
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@e280/strata",
-	"version": "0.0.0-6",
+	"version": "0.0.0-7",
 	"description": "state management",
 	"license": "MIT",
 	"author": "Chase Moskal <chasemoskal@gmail.com>",

package/s/tree/parts/utils/setup.ts

@@ -2,39 +2,39 @@
 import {debounce} from "@e280/stz"
 
 import {Trunk} from "../trunk.js"
-import {Treestate, SetupOptions} from "../types.js"
 import {localPersistence} from "../persistence.js"
+import {Treestate, SetupOptions} from "../types.js"
 
 export async function trunkSetup<S extends Treestate>(options: SetupOptions<S>) {
 	const {
 		version,
 		initialState,
 		saveDebounceTime = 500,
-		persistence = localPersistence("strata"),
+		persistence = localPersistence("strataTree"),
 	} = options
 
-	const strata = new Trunk<S>(initialState)
+	const trunk = new Trunk<S>(initialState)
 
 	async function load() {
 		const pickle = await persistence.store.get()
 		if (pickle && pickle.version === version)
-			await strata.overwrite(pickle.state)
+			await trunk.overwrite(pickle.state)
 	}
 
 	const save = debounce(saveDebounceTime, async() => persistence.store.set({
 		version,
-		state: strata.state,
+		state: trunk.state,
 	}))
 
 	// persistence: initial load from store
 	await load()
 
 	// persistence: save to store
-	strata.watch(save)
+	trunk.watch(save)
 
 	// cross-tab sync
 	const dispose = persistence.onChange(load)
 
-	return {strata, load, save, dispose}
+	return {trunk, load, save, dispose}
 }
 

package/x/tree/parts/utils/setup.d.ts

@@ -1,7 +1,7 @@
 import { Trunk } from "../trunk.js";
 import { Treestate, SetupOptions } from "../types.js";
 export declare function trunkSetup<S extends Treestate>(options: SetupOptions<S>): Promise<{
-    strata: Trunk<S>;
+    trunk: Trunk<S>;
     load: () => Promise<void>;
     save: import("@e280/stz").DebounceReturn<() => Promise<void>>;
     dispose: () => void;

package/x/tree/parts/utils/setup.js

@@ -2,23 +2,23 @@ import { debounce } from "@e280/stz";
 import { Trunk } from "../trunk.js";
 import { localPersistence } from "../persistence.js";
 export async function trunkSetup(options) {
-    const { version, initialState, saveDebounceTime = 500, persistence = localPersistence("strata"), } = options;
-    const strata = new Trunk(initialState);
+    const { version, initialState, saveDebounceTime = 500, persistence = localPersistence("strataTree"), } = options;
+    const trunk = new Trunk(initialState);
     async function load() {
         const pickle = await persistence.store.get();
         if (pickle && pickle.version === version)
-            await strata.overwrite(pickle.state);
+            await trunk.overwrite(pickle.state);
     }
     const save = debounce(saveDebounceTime, async () => persistence.store.set({
         version,
-        state: strata.state,
+        state: trunk.state,
     }));
     // persistence: initial load from store
     await load();
     // persistence: save to store
-    strata.watch(save);
+    trunk.watch(save);
     // cross-tab sync
     const dispose = persistence.onChange(load);
-    return { strata, load, save, dispose };
+    return { trunk, load, save, dispose };
 }
 //# sourceMappingURL=setup.js.map

package/x/tree/parts/utils/setup.js.map

@@ -1 +1 @@
-{"version":3,"file":"setup.js","sourceRoot":"","sources":["../../../../s/tree/parts/utils/setup.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,QAAQ,EAAC,MAAM,WAAW,CAAA;AAElC,OAAO,EAAC,KAAK,EAAC,MAAM,aAAa,CAAA;AAEjC,OAAO,EAAC,gBAAgB,EAAC,MAAM,mBAAmB,CAAA;AAElD,MAAM,CAAC,KAAK,UAAU,UAAU,CAAsB,OAAwB;IAC7E,MAAM,EACL,OAAO,EACP,YAAY,EACZ,gBAAgB,GAAG,GAAG,EACtB,WAAW,GAAG,gBAAgB,CAAC,QAAQ,CAAC,GACxC,GAAG,OAAO,CAAA;IAEX,MAAM,MAAM,GAAG,IAAI,KAAK,CAAI,YAAY,CAAC,CAAA;IAEzC,KAAK,UAAU,IAAI;QAClB,MAAM,MAAM,GAAG,MAAM,WAAW,CAAC,KAAK,CAAC,GAAG,EAAE,CAAA;QAC5C,IAAI,MAAM,IAAI,MAAM,CAAC,OAAO,KAAK,OAAO;YACvC,MAAM,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;IACtC,CAAC;IAED,MAAM,IAAI,GAAG,QAAQ,CAAC,gBAAgB,EAAE,KAAK,IAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC;QACxE,OAAO;QACP,KAAK,EAAE,MAAM,CAAC,KAAK;KACnB,CAAC,CAAC,CAAA;IAEH,uCAAuC;IACvC,MAAM,IAAI,EAAE,CAAA;IAEZ,6BAA6B;IAC7B,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAA;IAElB,iBAAiB;IACjB,MAAM,OAAO,GAAG,WAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;IAE1C,OAAO,EAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAC,CAAA;AACrC,CAAC"}
+{"version":3,"file":"setup.js","sourceRoot":"","sources":["../../../../s/tree/parts/utils/setup.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,QAAQ,EAAC,MAAM,WAAW,CAAA;AAElC,OAAO,EAAC,KAAK,EAAC,MAAM,aAAa,CAAA;AACjC,OAAO,EAAC,gBAAgB,EAAC,MAAM,mBAAmB,CAAA;AAGlD,MAAM,CAAC,KAAK,UAAU,UAAU,CAAsB,OAAwB;IAC7E,MAAM,EACL,OAAO,EACP,YAAY,EACZ,gBAAgB,GAAG,GAAG,EACtB,WAAW,GAAG,gBAAgB,CAAC,YAAY,CAAC,GAC5C,GAAG,OAAO,CAAA;IAEX,MAAM,KAAK,GAAG,IAAI,KAAK,CAAI,YAAY,CAAC,CAAA;IAExC,KAAK,UAAU,IAAI;QAClB,MAAM,MAAM,GAAG,MAAM,WAAW,CAAC,KAAK,CAAC,GAAG,EAAE,CAAA;QAC5C,IAAI,MAAM,IAAI,MAAM,CAAC,OAAO,KAAK,OAAO;YACvC,MAAM,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;IACrC,CAAC;IAED,MAAM,IAAI,GAAG,QAAQ,CAAC,gBAAgB,EAAE,KAAK,IAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,GAAG,CAAC;QACxE,OAAO;QACP,KAAK,EAAE,KAAK,CAAC,KAAK;KAClB,CAAC,CAAC,CAAA;IAEH,uCAAuC;IACvC,MAAM,IAAI,EAAE,CAAA;IAEZ,6BAA6B;IAC7B,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAA;IAEjB,iBAAiB;IACjB,MAAM,OAAO,GAAG,WAAW,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAA;IAE1C,OAAO,EAAC,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAC,CAAA;AACpC,CAAC"}