@bitstillery/mithril 3.0.3 → 3.1.2

package/index.ts

@@ -102,7 +102,7 @@ setSignalRedrawCallback((sig: Signal<any>) => {
 
 // Export signals API
 export {signal, computed, effect, Signal, ComputedSignal, state, watch, registerState, getRegisteredStates}
-export type {State, StateOptions, Unwatch} from './state'
+export type {State, StateOptions, StateSignals, Unwatch} from './state'
 
 // Export Store class
 export {Store} from './store'

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@bitstillery/mithril",
-    "version": "3.0.3",
+    "version": "3.1.2",
     "description": "Mithril + Signals, Store and SSR",
     "license": "MIT",
     "author": "Bitstillery",
@@ -44,6 +44,9 @@
             "default": "./htm.ts"
         }
     },
+    "publishConfig": {
+        "access": "public"
+    },
     "scripts": {
         "lint": "bun run lint:ts",
         "lint:ts": "bun run lint:ts-format && bun run lint:ts-syntax && bun run lint:ts-types",
@@ -52,7 +55,11 @@
         "lint:ts-types": "tsgo --noEmit",
         "test": "bun test",
         "prepublishOnly": "bun run lint:ts",
-        "pack:dry-run": "npm pack --dry-run"
+        "pack:dry-run": "npm pack --dry-run",
+        "release": "standard-version && npm publish",
+        "release:patch": "standard-version --release-as patch && npm publish",
+        "release:minor": "standard-version --release-as minor && npm publish",
+        "release:major": "standard-version --release-as major && npm publish"
     },
     "dependencies": {
         "htm": "^3.1.1"
@@ -71,6 +78,7 @@
         "marked-gfm-heading-id": "^4.0.0",
         "oxfmt": "^0.32.0",
         "oxlint": "^1.30.0",
+        "standard-version": "^9.5.0",
         "tippy.js": "^6.3.7"
     }
 }

package/state.ts

@@ -204,6 +204,16 @@ export function state<T extends Record<string, any>>(initial: T, name?: string,
             return stateCache.get(obj)
         }
 
+        const linkArrayParentSignal = (value: any, sig: Signal<any> | ComputedSignal<any>) => {
+            if (!value || typeof value !== 'object') return
+            if ((value as any).__isState === true && Array.isArray((value as any).__signals)) {
+                arrayParentSignalMap.set(value, sig as Signal<any>)
+                ;(value as any)._parentSignal = sig as Signal<any>
+            } else if (Array.isArray(value)) {
+                arrayParentSignalMap.set(value, sig as Signal<any>)
+            }
+        }
+
         // Handle arrays
         if (Array.isArray(obj)) {
             // Arrays don't get their own signalMap - they use the parent's
@@ -294,7 +304,19 @@ export function state<T extends Record<string, any>>(initial: T, name?: string,
                         // Search methods also need unwrapped values for comparison
                         const searchMethods = ['includes', 'indexOf', 'lastIndexOf']
                         // Methods that return new arrays or strings need unwrapped values
-                        const returnMethods = ['slice', 'concat', 'flat', 'flatMap', 'join', 'toString', 'toLocaleString']
+                        const returnMethods = [
+                            'slice',
+                            'concat',
+                            'flat',
+                            'flatMap',
+                            'join',
+                            'toString',
+                            'toLocaleString',
+                            // ES2023 copy-with-mutate methods - bind to proxy so iteration unwraps signals
+                            'toSorted',
+                            'toReversed',
+                            'toSpliced',
+                        ]
                         // Iterator methods need unwrapped values
                         const iteratorMethods = ['entries', 'keys', 'values']
                         if (
@@ -554,7 +576,41 @@ export function state<T extends Record<string, any>>(initial: T, name?: string,
         // Each nested state gets its own signalMap (unless parentSignalMap is explicitly provided)
         // This prevents nested states from sharing the parent's signalMap
         const nestedSignalMap = parentSignalMap || new Map<string, Signal<any> | ComputedSignal<any>>()
-        const wrapped = new Proxy(obj, {
+        let wrapped: any
+        const getChildContext = (): InitContext | undefined =>
+            context ? {...context, rootState: stateRootMap.get(wrapped) ?? wrapped} : undefined
+
+        const createPropertySignal = (originalValue: any): Signal<any> | ComputedSignal<any> => {
+            if (typeof originalValue === 'function') {
+                return createStateComputed(wrapped, () => originalValue.call(wrapped), !!context?.deferComputed)
+            }
+            if (isGetSetDescriptor(originalValue)) {
+                if (typeof originalValue.get === 'function') {
+                    return createStateComputed(wrapped, () => originalValue.get.call(wrapped), !!context?.deferComputed)
+                }
+                return signal(undefined)
+            }
+            if (typeof originalValue === 'object' && originalValue !== null) {
+                const nestedState = initializeSignals(originalValue, undefined, getChildContext())
+                const sig = signal(nestedState)
+                if (nestedState && (nestedState as any).__isState) {
+                    stateRootMap.set(nestedState, stateRootMap.get(wrapped) ?? wrapped)
+                }
+                linkArrayParentSignal(nestedState, sig)
+                return sig
+            }
+            return toSignal(originalValue)
+        }
+
+        const ensurePropertySignal = (target: any, prop: string | symbol, key: string) => {
+            if (!nestedSignalMap.has(key)) {
+                const originalValue = Reflect.get(target, prop)
+                if (originalValue === undefined) return undefined
+                nestedSignalMap.set(key, createPropertySignal(originalValue))
+            }
+            return nestedSignalMap.get(key)
+        }
+        wrapped = new Proxy(obj, {
             get(target, prop) {
                 if (prop === '__originalKeys') return originalKeys
                 if (prop === '__isState') return true
@@ -581,143 +637,25 @@ export function state<T extends Record<string, any>>(initial: T, name?: string,
                 if (propStr.startsWith('$') && propStr.length > 1) {
                     const key = propStr.slice(1) // Remove $ prefix
 
-                    // Ensure signal exists - initialize if needed
-                    // Use the same initialization logic as regular property access
-                    if (!nestedSignalMap.has(key)) {
-                        // First try to get from target (original object)
-                        const originalValue = Reflect.get(target, key)
-                        if (originalValue !== undefined) {
-                            if (typeof originalValue === 'function') {
-                                const computedSig = createStateComputed(
-                                    wrapped,
-                                    () => originalValue.call(wrapped),
-                                    !!context?.deferComputed,
-                                )
-                                nestedSignalMap.set(key, computedSig)
-                            } else if (isGetSetDescriptor(originalValue)) {
-                                // Get/set descriptor -> computed signal from get function
-                                if (typeof originalValue.get === 'function') {
-                                    const computedSig = createStateComputed(
-                                        wrapped,
-                                        () => originalValue.get.call(wrapped),
-                                        !!context?.deferComputed,
-                                    )
-                                    nestedSignalMap.set(key, computedSig)
-                                } else {
-                                    // Only setter, no getter - treat as regular signal with undefined initial value
-                                    const sig = signal(undefined)
-                                    nestedSignalMap.set(key, sig)
-                                }
-                            } else if (typeof originalValue === 'object' && originalValue !== null) {
-                                // Get the already-wrapped state from the wrapped object
-                                // Don't call initializeSignals again as it would create a new wrapped array
-                                const nestedState = (wrapped as any)[key]
-                                if (nestedState === undefined) {
-                                    // Fallback: initialize if not already wrapped
-                                    const childContext = context
-                                        ? {...context, rootState: stateRootMap.get(wrapped) ?? wrapped}
-                                        : undefined
-                                    const initialized = initializeSignals(originalValue, undefined, childContext)
-                                    const sig = signal(initialized)
-                                    if (Array.isArray(initialized)) {
-                                        arrayParentSignalMap.set(initialized, sig)
-                                    }
-                                    nestedSignalMap.set(key, sig)
-                                } else {
-                                    const sig = signal(nestedState)
-                                    // Store parent signal reference for arrays
-                                    if (Array.isArray(nestedState)) {
-                                        arrayParentSignalMap.set(nestedState, sig)
-                                    }
-                                    nestedSignalMap.set(key, sig)
-                                }
-                            } else {
-                                const sig = toSignal(originalValue)
-                                nestedSignalMap.set(key, sig)
-                            }
-                        } else {
-                            // Property doesn't exist - return undefined
-                            return undefined
-                        }
+                    const sig = ensurePropertySignal(target, key, key)
+                    if (!sig) return undefined
+
+                    // Re-link array-backed values so mutations (splice, push) notify subscribers.
+                    // Needed when $prop is accessed before .prop (e.g. watcher setup before render).
+                    if (sig && !(sig instanceof ComputedSignal)) {
+                        linkArrayParentSignal((sig as Signal<any>).peek(), sig)
                     }
 
                     // Return raw signal object (not the value)
-                    return nestedSignalMap.get(key)
+                    return sig
                 }
 
                 const key = propStr
 
-                // Check if we have a signal for this property
-                if (!nestedSignalMap.has(key)) {
-                    // Try to get from target first (original object properties)
-                    const originalValue = Reflect.get(target, prop)
-                    if (originalValue !== undefined) {
-                        // Initialize signal for this property
-                        if (typeof originalValue === 'function') {
-                            // Function property -> computed signal
-                            const computedSig = createStateComputed(
-                                wrapped,
-                                () => originalValue.call(wrapped),
-                                !!context?.deferComputed,
-                            )
-                            nestedSignalMap.set(key, computedSig)
-                        } else if (isGetSetDescriptor(originalValue)) {
-                            // Get/set descriptor -> computed signal from get function
-                            if (typeof originalValue.get === 'function') {
-                                const computedSig = createStateComputed(
-                                    wrapped,
-                                    () => originalValue.get.call(wrapped),
-                                    !!context?.deferComputed,
-                                )
-                                nestedSignalMap.set(key, computedSig)
-                            } else {
-                                // Only setter, no getter - treat as regular signal with undefined initial value
-                                const sig = signal(undefined)
-                                nestedSignalMap.set(key, sig)
-                            }
-                        } else if (typeof originalValue === 'object' && originalValue !== null) {
-                            // Nested object -> recursive state with its own signalMap
-                            const childContext = context
-                                ? {...context, rootState: stateRootMap.get(wrapped) ?? wrapped}
-                                : undefined
-                            const nestedState = initializeSignals(originalValue, undefined, childContext)
-                            const sig = signal(nestedState)
-                            // Store parent signal reference for arrays
-                            if (Array.isArray(nestedState)) {
-                                arrayParentSignalMap.set(nestedState, sig)
-                            }
-                            nestedSignalMap.set(key, sig)
-                        } else {
-                            // Primitive value -> signal
-                            const sig = toSignal(originalValue)
-                            nestedSignalMap.set(key, sig)
-                        }
-                    } else {
-                        // Property doesn't exist in original object
-                        // Check if it's a computed property that was added dynamically
-                        // For now, return undefined
-                    }
-                }
-
-                const sig = nestedSignalMap.get(key)
+                const sig = ensurePropertySignal(target, prop, key)
                 if (sig) {
                     // Access signal.value to track component dependency
-                    const value = sig.value
-                    // Always ensure parent signal is stored for arrays (in case it wasn't stored during initialization)
-                    // Check for wrapped arrays by looking for __isState and __signals properties
-                    // Array.isArray() may return false for Proxies, so we check __isState instead
-                    if (value && typeof value === 'object') {
-                        if ((value as any).__isState === true && Array.isArray((value as any).__signals)) {
-                            // This is a wrapped array - store parent signal
-                            arrayParentSignalMap.set(value, sig as Signal<any>)
-                            // Also store directly on the Proxy as a fallback
-                            ;(value as any)._parentSignal = sig as Signal<any>
-                        } else if (Array.isArray(value)) {
-                            // Regular array (shouldn't happen but just in case)
-                            arrayParentSignalMap.set(value, sig as Signal<any>)
-                        }
-                    }
-                    return value
+                    return sig.value
                 }
 
                 // Fallback to original property
@@ -786,47 +724,22 @@ export function state<T extends Record<string, any>>(initial: T, name?: string,
                     const sig = nestedSignalMap.get(key)
                     if (sig && !(sig instanceof ComputedSignal)) {
                         if (typeof value === 'object' && value !== null) {
-                            // Nested object -> recursive state with its own signalMap
-                            const childContext = context
-                                ? {...context, rootState: stateRootMap.get(wrapped) ?? wrapped}
-                                : undefined
-                            const nestedState = initializeSignals(value, undefined, childContext)
-                            // Store parent signal reference for arrays
-                            if (Array.isArray(nestedState)) {
-                                arrayParentSignalMap.set(nestedState, sig as Signal<any>)
+                            const nestedState = initializeSignals(value, undefined, getChildContext())
+                            if (nestedState && (nestedState as any).__isState) {
+                                stateRootMap.set(nestedState, stateRootMap.get(wrapped) ?? wrapped)
                             }
+                            linkArrayParentSignal(nestedState, sig)
                             ;(sig as Signal<any>).value = nestedState
                         } else {
                             ;(sig as Signal<any>).value = value
                         }
                     } else {
                         // Replace computed with regular signal
-                        if (typeof value === 'object' && value !== null && Array.isArray(value)) {
-                            const childContext = context
-                                ? {...context, rootState: stateRootMap.get(wrapped) ?? wrapped}
-                                : undefined
-                            const nestedState = initializeSignals(value, undefined, childContext)
-                            const sig = signal(nestedState)
-                            arrayParentSignalMap.set(nestedState, sig)
-                            nestedSignalMap.set(key, sig)
-                        } else {
-                            nestedSignalMap.set(key, toSignal(value))
-                        }
+                        nestedSignalMap.set(key, createPropertySignal(value))
                     }
                 } else {
                     // Create new signal
-                    if (typeof value === 'object' && value !== null) {
-                        const childContext = context ? {...context, rootState: stateRootMap.get(wrapped) ?? wrapped} : undefined
-                        const nestedState = initializeSignals(value, undefined, childContext)
-                        const sig = signal(nestedState)
-                        // Store parent signal reference for arrays
-                        if (Array.isArray(nestedState)) {
-                            arrayParentSignalMap.set(nestedState, sig)
-                        }
-                        nestedSignalMap.set(key, sig)
-                    } else {
-                        nestedSignalMap.set(key, toSignal(value))
-                    }
+                    nestedSignalMap.set(key, createPropertySignal(value))
                 }
 
                 return true
@@ -890,6 +803,11 @@ export function state<T extends Record<string, any>>(initial: T, name?: string,
 
         stateRootMap.set(wrapped, context?.rootState ?? wrapped)
         stateCache.set(obj, wrapped)
+        for (const key of originalKeys) {
+            if (!nestedSignalMap.has(key)) {
+                nestedSignalMap.set(key, createPropertySignal((obj as any)[key]))
+            }
+        }
         return wrapped
     }
 
@@ -900,61 +818,6 @@ export function state<T extends Record<string, any>>(initial: T, name?: string,
         stateDeferredFlags.set(wrapped, {allowed: false})
     }
 
-    // Pre-initialize all signals from the initial object so they're available immediately
-    // This ensures $s.$property works even if $s.property hasn't been accessed yet
-    if (typeof initial === 'object' && initial !== null && !Array.isArray(initial)) {
-        for (const key in initial) {
-            if (Object.prototype.hasOwnProperty.call(initial, key)) {
-                if (!signalMap.has(key)) {
-                    const value = initial[key]
-                    if (typeof value === 'function') {
-                        const computedSig = createStateComputed(wrapped, () => value.call(wrapped), deferComputed)
-                        signalMap.set(key, computedSig)
-                    } else if (isGetSetDescriptor(value)) {
-                        // Get/set descriptor -> computed signal from get function
-                        if (typeof value.get === 'function') {
-                            const computedSig = createStateComputed(wrapped, () => value.get.call(wrapped), deferComputed)
-                            signalMap.set(key, computedSig)
-                        } else {
-                            // Only setter, no getter - treat as regular signal with undefined initial value
-                            const sig = signal(undefined)
-                            signalMap.set(key, sig)
-                        }
-                    } else if (typeof value === 'object' && value !== null) {
-                        // Get the already-wrapped state from stateCache (bypass Proxy to get the actual wrapped value)
-                        // This ensures we get the same wrapped array that was created during initializeSignals
-                        const preInitContext = initContext ? {...initContext, rootState: wrapped} : undefined
-                        const nestedState = stateCache.has(value)
-                            ? stateCache.get(value)
-                            : initializeSignals(value, undefined, preInitContext)
-                        if (nestedState && (nestedState as any).__isState) stateRootMap.set(nestedState, wrapped)
-                        const sig = signal(nestedState)
-                        // Always store parent signal reference for arrays
-                        // Check for wrapped arrays by looking for __isState and __signals properties
-                        // Array.isArray() may return false for Proxies, so we check __isState instead
-                        if (
-                            nestedState &&
-                            typeof nestedState === 'object' &&
-                            (nestedState as any).__isState === true &&
-                            Array.isArray((nestedState as any).__signals)
-                        ) {
-                            arrayParentSignalMap.set(nestedState, sig)
-                            // Also store directly on the Proxy as a fallback
-                            ;(nestedState as any)._parentSignal = sig
-                        } else if (Array.isArray(nestedState)) {
-                            // Fallback for regular arrays (shouldn't happen but just in case)
-                            arrayParentSignalMap.set(nestedState, sig)
-                        }
-                        signalMap.set(key, sig)
-                    } else {
-                        const sig = toSignal(value)
-                        signalMap.set(key, sig)
-                    }
-                }
-            }
-        }
-    }
-
     // Register state for SSR serialization when name is provided (required for hydration)
     if (name && typeof name === 'string' && name.trim() !== '') {
         registerState(name, wrapped, initial)
@@ -969,7 +832,7 @@ export function state<T extends Record<string, any>>(initial: T, name?: string,
  * - Nested objects: $prop => Signal<State<T[K]>>
  * - Functions: $prop => ComputedSignal (computed from getter)
  */
-type StateSignals<T extends Record<string, any>> = {
+export type StateSignals<T extends Record<string, any>> = {
     [K in keyof T as K extends string ? `$${K}` : never]: T[K] extends (...args: any[]) => any
         ? ComputedSignal<any>
         : T[K] extends object