@bitstillery/mithril 3.3.3 → 3.4.1

package/README.md

@@ -36,7 +36,7 @@ count(5) // Logs: 5 × 2 = 10
 
 ## Proxy State
 
-`state()` creates reactive objects. Components track which properties they read and only re-render when those change.
+`state()` creates reactive objects. Components track which properties they read and only re-render when those change. **Function properties become computed values**—they re-evaluate when their dependencies change.
 
 ```tsx
 import m, {state, MithrilComponent} from '@bitstillery/mithril'
@@ -47,7 +47,9 @@ class Counter extends MithrilComponent {
     view() {
         return (
             <div>
-                <p>{$s.count}</p>
+                <p>
+                    {$s.count} / {$s.totalTodos}
+                </p>
                 <button onclick={() => $s.count++}>+</button>
             </div>
         )
@@ -57,7 +59,9 @@ class Counter extends MithrilComponent {
 m.mount(document.body, Counter)
 ```
 
-The second argument to `state()` is a name used for SSR serialization.
+- **Computed properties**: Any function in state (e.g. `totalTodos: () => $s.todos.length`) is a computed—read it like a normal property, it updates when dependencies change.
+- **`$` prefix**: Use `$s.$count` for the raw signal (e.g. for `watch()`).
+- The second argument is a name used for SSR serialization.
 
 ## Watchers
 

package/index.ts

@@ -12,7 +12,7 @@ import censor from './util/censor'
 import nextTick from './util/next_tick'
 import domFor from './render/domFor'
 import {signal, computed, effect, Signal, ComputedSignal, setSignalRedrawCallback, getSignalComponents} from './signal'
-import {state, watch, registerState, getRegisteredStates, copyGlobalStatesToContext} from './state'
+import {state, watch, registerState, getRegisteredStates, clearStateRegistry, copyGlobalStatesToContext} from './state'
 
 import type {Vnode, Children, ComponentType} from './render/vnode'
 import type {Hyperscript} from './render/hyperscript'
@@ -101,7 +101,7 @@ setSignalRedrawCallback((sig: Signal<any>) => {
 })
 
 // Export signals API
-export {signal, computed, effect, Signal, ComputedSignal, state, watch, registerState, getRegisteredStates}
+export {signal, computed, effect, Signal, ComputedSignal, state, watch, registerState, getRegisteredStates, clearStateRegistry}
 export type {State, StateOptions, StateSignals, Unwatch} from './state'
 
 // Export Store class

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@bitstillery/mithril",
-    "version": "3.3.3",
+    "version": "3.4.1",
     "description": "Mithril + Signals, Store and SSR",
     "license": "MIT",
     "author": "Bitstillery",
@@ -54,9 +54,14 @@
         "lint:ts-syntax": "oxlint -c .oxlintrc.json",
         "lint:ts-types": "tsgo --noEmit",
         "test": "bun test",
+        "bench": "NODE_ENV=production bun run bench/index.ts",
+        "bench:hyperscript": "NODE_ENV=production bun run bench/index.ts hyperscript",
+        "bench:render": "NODE_ENV=production bun run bench/index.ts render",
+        "bench:signal": "NODE_ENV=production bun run bench/index.ts signal",
+        "bench:state": "NODE_ENV=production bun run bench/index.ts state",
+        "bench:profile": "bun --cpu-prof-md run bench/index.ts",
         "prepublishOnly": "bun run lint:ts",
         "pack:dry-run": "npm pack --dry-run",
-        "publish": "./scripts/release.sh",
         "release": "./scripts/release.sh",
         "release:patch": "./scripts/release.sh --release-as patch",
         "release:minor": "./scripts/release.sh --release-as minor",
@@ -77,6 +82,7 @@
         "codemirror": "^6.0.1",
         "marked": "^15.0.4",
         "marked-gfm-heading-id": "^4.0.0",
+        "mitata": "^1.0.34",
         "oxfmt": "^0.32.0",
         "oxlint": "^1.30.0",
         "standard-version": "^9.5.0",

package/render/ssrState.ts

@@ -100,8 +100,10 @@ export function serializeStore(state: State<any>): any {
                     continue
                 }
 
-                // For nested states, only serialize keys that belong to this state (not parent keys)
-                if (nestedOriginalKeys && !nestedOriginalKeys.has(key)) {
+                // For nested states, only serialize keys that belong to this state (not parent keys).
+                // When originalKeys is empty (e.g. lookup: {}), include all keys so dynamically
+                // added entries (e.g. $s.lookup[path] = data) are serialized.
+                if (nestedOriginalKeys && nestedOriginalKeys.size > 0 && !nestedOriginalKeys.has(key)) {
                     continue
                 }
 

package/state.ts

@@ -27,14 +27,27 @@ function createStateComputed<T>(wrapped: any, computeFn: () => T, shouldDefer: b
 function markAllComputedsDirty(stateObj: any): void {
     if (!stateObj || !(stateObj as any).__isState) return
     const signalMap = (stateObj as any).__signalMap
-    if (!signalMap || !(signalMap instanceof Map)) return
-    signalMap.forEach((sig: any) => {
-        if (sig instanceof ComputedSignal) {
-            sig.markDirty()
-        } else if (sig && typeof sig === 'object' && sig.value && (sig.value as any).__isState) {
-            markAllComputedsDirty(sig.value)
+    if (signalMap && signalMap instanceof Map) {
+        signalMap.forEach((sig: any) => {
+            if (sig instanceof ComputedSignal) {
+                sig.markDirty()
+            } else if (sig && typeof sig === 'object' && sig.value && (sig.value as any).__isState) {
+                markAllComputedsDirty(sig.value)
+            }
+        })
+    }
+    // Arrays use __signals instead of __signalMap; recurse into nested state elements
+    const signals = (stateObj as any).__signals
+    if (Array.isArray(signals)) {
+        for (const sig of signals) {
+            if (sig && typeof sig === 'object' && (sig as any).__isState) {
+                markAllComputedsDirty(sig)
+            } else if (sig && typeof sig === 'object' && !isSignal(sig)) {
+                // Array elements that are Proxies (not signals) - they're nested states
+                markAllComputedsDirty(sig)
+            }
         }
-    })
+    }
 }
 
 // Type guard to check if value is a Signal

package/store.ts

@@ -1,6 +1,5 @@
 import {state, State, updateStateRegistry} from './state'
 import {serializeStore, deserializeStore} from './render/ssrState'
-import {ComputedSignal} from './signal'
 
 // Helper function to restore computed properties (same as in ssrState.ts)
 function restoreComputedProperties(state: State<any>, initial: any): void {
@@ -374,22 +373,26 @@ export class Store<T extends Record<string, any> = Record<string, any>> {
             return
         }
 
-        // Default to saving saved/tab when no options; session is opt-in (off by default)
-        const saveSaved = options?.saved ?? options === undefined
-        const saveTab = options?.tab ?? options === undefined
-        const saveSession = options?.session === true
+        // Default: write to localStorage and sessionStorage when no options; session is opt-in
+        const writeLocalStorage = options?.saved ?? options === undefined
+        const writeSessionStorage = options?.tab ?? options === undefined
+        const writeSessionApi = options?.session === true
 
-        // Use SSR serialization which properly handles State objects and skips ComputedSignal properties
-        // This is the same mechanism used for SSR, ensuring consistency
         const statePlain = serializeStore(this.stateInstance)
 
-        // Save to localStorage (saved state)
-        if (saveSaved && this.templates.saved) {
+        // Write to localStorage (persistent across browser restarts)
+        if (writeLocalStorage && this.templates.saved) {
             this.set(this.storageKey, this.blueprint(statePlain, copy_object(this.templates.saved)))
         }
 
-        // Save to sessionStorage (tab state)
-        if (saveTab && this.templates.tab) {
+        // Lookup is always persisted to localStorage when present, regardless of writeLocalStorage.
+        // This ensures cached values (e.g. filter/sort state) are never lost when save() is called.
+        if ((statePlain as any).lookup) {
+            this.persist_lookup_to_local_storage(statePlain)
+        }
+
+        // Write to sessionStorage (tab-scoped, cleared when tab closes)
+        if (writeSessionStorage && this.templates.tab) {
             const tabState = (this.stateInstance as any).tab
             if (tabState) {
                 // Get the tab template - unwrap if it's nested under a 'tab' key
@@ -420,7 +423,7 @@ export class Store<T extends Record<string, any> = Record<string, any>> {
         // Save to session API (session state) - async by nature
         // Only save session on client side (not during SSR)
         if (
-            saveSession &&
+            writeSessionApi &&
             this.templates.session &&
             Object.keys(this.templates.session).length > 0 &&
             typeof window !== 'undefined'
@@ -441,6 +444,27 @@ export class Store<T extends Record<string, any> = Record<string, any>> {
         }
     }
 
+    /**
+     * Merge lookup from state into localStorage and write. Ensures lookup is always persisted
+     * whenever save() is called and state contains lookup.
+     */
+    private persist_lookup_to_local_storage(statePlain: Record<string, any>): void {
+        if (typeof window === 'undefined') return
+        try {
+            const existing = this.get(this.storageKey)
+            let storeData: Record<string, any> = {}
+            try {
+                storeData = JSON.parse(existing) || {}
+            } catch {
+                storeData = {}
+            }
+            storeData.lookup = copy_object(statePlain.lookup || {})
+            window.localStorage.setItem(this.storageKey, JSON.stringify(storeData))
+        } catch (err) {
+            console.error('Cannot persist lookup to Local Storage; continue without.', err)
+        }
+    }
+
     set(key: string, item: object): void {
         if (typeof window === 'undefined') return
         try {