@bitstillery/mithril 3.0.0-AA

package/render/ssrState.ts

@@ -0,0 +1,366 @@
+import {ComputedSignal} from '../signal'
+import {getRegisteredStates} from '../state'
+import {logger} from '../server/ssrLogger'
+
+import type {State} from '../state'
+
+/**
+ * Check if a value is a state (has __isState flag)
+ */
+function isState(value: any): boolean {
+    return value && typeof value === 'object' && (value as any).__isState === true
+}
+
+/**
+ * Serialize a single state to plain object
+ * Extracts signal values by accessing state properties directly
+ */
+export function serializeStore(state: State<any>): any {
+    if (!isState(state)) {
+        throw new Error('Value is not a state')
+    }
+
+    const result: Record<string, any> = {}
+    const visited = new WeakSet<object>()
+
+    // Add the root state to visited first to detect circular refs
+    visited.add(state)
+
+    // Check if signalMap exists and is a Map - if not, this is an error case
+    const signalMap = (state as any).__signalMap
+    if (!signalMap || !(signalMap instanceof Map)) {
+        // Throw error so serializeAllStates can catch it and skip this state
+        throw new Error('State signalMap is null, undefined, or not a Map instance')
+    }
+
+    function serializeValue(value: any): any {
+        // Handle null/undefined
+        if (value === null || value === undefined) {
+            return value
+        }
+
+        // Handle primitives
+        if (typeof value !== 'object') {
+            return value
+        }
+
+        // Handle circular references
+        // Check before adding to visited to avoid false positives
+        if (visited.has(value)) {
+            return null // Circular reference - serialize as null
+        }
+
+        // Mark as visited BEFORE processing to detect circular refs
+        visited.add(value)
+
+        // Handle states (nested states and arrays)
+        if (isState(value)) {
+            // Check if this is an array state
+            const signals = (value as any).__signals
+            if (signals && Array.isArray(signals)) {
+                // Array state - serialize each element
+                const arrayResult = signals
+                    .map((signal: any) => {
+                        if (signal instanceof ComputedSignal) {
+                            return undefined
+                        }
+                        // Get the actual value from the signal
+                        // If it's a Signal instance, get its value; otherwise it's already the value (could be a state)
+                        let sigValue: any
+                        // Check if it's a Signal instance (has value property and is an instance of Signal/ComputedSignal)
+                        if (signal && typeof signal === 'object' && 'value' in signal && !isState(signal)) {
+                            sigValue = signal.value
+                        } else {
+                            // It's either a primitive or a state (nested object)
+                            sigValue = signal
+                        }
+                        // If sigValue is a state (nested object in array), serialize it
+                        // This will use __originalKeys to filter parent keys
+                        const serialized = serializeValue(sigValue)
+                        // If circular reference was detected, it returns null - keep it
+                        return serialized
+                    })
+                    .filter((item: any) => item !== undefined)
+                return arrayResult
+            }
+
+            // Object state - serialize by accessing properties directly through proxy
+            // Use originalKeys to filter out parent state keys
+            const nestedResult: Record<string, any> = {}
+            const nestedOriginalKeys = (value as any).__originalKeys as Set<string> | undefined
+
+            for (const key in value) {
+                if (
+                    key.startsWith('$') ||
+                    key === '__isState' ||
+                    key === '__signalMap' ||
+                    key === '__signals' ||
+                    key === '__originalKeys'
+                ) {
+                    continue
+                }
+
+                // For nested states, only serialize keys that belong to this state (not parent keys)
+                if (nestedOriginalKeys && !nestedOriginalKeys.has(key)) {
+                    continue
+                }
+
+                try {
+                    // Check if this is a ComputedSignal by accessing $key
+                    const signal = (value as any)['$' + key]
+                    if (signal instanceof ComputedSignal) {
+                        // Skip computed signals
+                        continue
+                    }
+
+                    const propValue = (value as any)[key]
+                    const serialized = serializeValue(propValue)
+                    // Include null values (they might be circular ref markers)
+                    nestedResult[key] = serialized
+                } catch {
+                    // Skip if access fails
+                    continue
+                }
+            }
+            // Don't delete from visited here - it will be cleaned up when we finish serializing this value
+            return nestedResult
+        }
+
+        // Handle plain arrays
+        if (Array.isArray(value)) {
+            const arrayResult = value.map((item) => serializeValue(item))
+            return arrayResult
+        }
+
+        // Handle plain objects
+        const objResult: Record<string, any> = {}
+        for (const key in value) {
+            if (Object.prototype.hasOwnProperty.call(value, key)) {
+                const serialized = serializeValue(value[key])
+                // Include null values (they might be circular ref markers)
+                objResult[key] = serialized
+            }
+        }
+        // Don't delete from visited - let it be cleaned up naturally
+        return objResult
+    }
+
+    // Serialize by iterating over state properties directly
+    // For top-level state, serialize all keys (including dynamically added ones)
+    // Use $ prefix to check if property is a ComputedSignal
+    for (const key in state) {
+        if (
+            key.startsWith('$') ||
+            key === '__isState' ||
+            key === '__signalMap' ||
+            key === '__signals' ||
+            key === '__originalKeys'
+        ) {
+            continue
+        }
+
+        try {
+            // Check if this is a ComputedSignal by accessing $key
+            const signal = (state as any)['$' + key]
+            if (signal instanceof ComputedSignal) {
+                // Skip computed signals (they're functions, recreated on client)
+                continue
+            }
+
+            const value = (state as any)[key]
+            result[key] = serializeValue(value)
+        } catch {
+            // Skip if access fails
+            continue
+        }
+    }
+
+    return result
+}
+
+/**
+ * Deserialize state into a state
+ * Restores signal values from serialized data
+ */
+export function deserializeStore(state: State<any>, serialized: any): void {
+    if (!isState(state)) {
+        throw new Error('Value is not a state')
+    }
+
+    if (!serialized || typeof serialized !== 'object') {
+        return
+    }
+
+    const signalMap = (state as any).__signalMap as Map<string, any>
+    if (!signalMap || !(signalMap instanceof Map)) {
+        // Throw error so deserializeAllStates can catch it and skip this state
+        throw new Error('State signalMap is null, undefined, or not a Map instance')
+    }
+
+    function deserializeValue(value: any): any {
+        // Handle null/undefined
+        if (value === null || value === undefined) {
+            return value
+        }
+
+        // Handle primitives
+        if (typeof value !== 'object') {
+            return value
+        }
+
+        // Handle arrays
+        if (Array.isArray(value)) {
+            return value.map((item) => deserializeValue(item))
+        }
+
+        // Handle plain objects (could be nested states)
+        // Check if this looks like a serialized state (has state-like structure)
+        // For now, treat all objects as plain objects - nested states will be handled
+        // when they're assigned to state properties
+        const objResult: Record<string, any> = {}
+        for (const key in value) {
+            if (Object.prototype.hasOwnProperty.call(value, key)) {
+                objResult[key] = deserializeValue(value[key])
+            }
+        }
+        return objResult
+    }
+
+    // Deserialize each key in serialized data
+    for (const key in serialized) {
+        if (Object.prototype.hasOwnProperty.call(serialized, key)) {
+            const serializedValue = serialized[key]
+            const deserializedValue = deserializeValue(serializedValue)
+
+            // Check if signal exists in state
+            if (signalMap && signalMap.has(key)) {
+                const signal = signalMap.get(key)
+                // Don't update ComputedSignal (they're read-only)
+                if (signal && !(signal instanceof ComputedSignal)) {
+                    signal.value = deserializedValue
+                }
+            } else {
+                // Signal doesn't exist - use proxy setter to create it
+                // But only if signalMap exists (error case: signalMap is null)
+                // If signalMap is null, we can't create new signals, so skip
+                if (signalMap) {
+                    ;(state as any)[key] = deserializedValue
+                }
+                // If signalMap is null, skip this key (error case)
+            }
+        }
+    }
+}
+
+/**
+ * Serialize all registered states
+ * Returns a Record mapping state names to serialized state
+ */
+export function serializeAllStates(): Record<string, any> {
+    const registeredStates = getRegisteredStates()
+    const result: Record<string, any> = {}
+
+    for (const [name, entry] of registeredStates.entries()) {
+        try {
+            result[name] = serializeStore(entry.state)
+        } catch (error) {
+            // Log error but continue with other states
+            logger.error(`error serializing state`, error, {stateName: name})
+        }
+    }
+
+    return result
+}
+
+/**
+ * Deserialize all states from serialized data
+ * Restores state into registered states
+ */
+/**
+ * Restore computed properties from initial state
+ * Extracts function properties and sets them on state instance
+ * State proxy will automatically convert them to ComputedSignal instances
+ */
+function restoreComputedProperties(state: State<any>, initial: any): void {
+    if (!initial || typeof initial !== 'object') {
+        return
+    }
+
+    function isObject(v: any): boolean {
+        return v && typeof v === 'object' && !Array.isArray(v)
+    }
+
+    function restore(obj: any, target: any, prefix: string = ''): void {
+        for (const key in obj) {
+            if (Object.prototype.hasOwnProperty.call(obj, key)) {
+                const value = obj[key]
+
+                if (typeof value === 'function') {
+                    // Set function property - state proxy will convert to ComputedSignal
+                    const keys = prefix ? prefix.split('.').filter((k) => k) : []
+                    let targetState = target
+                    for (let i = 0; i < keys.length; i++) {
+                        if (!targetState[keys[i]]) {
+                            // Nested state doesn't exist yet, skip
+                            return
+                        }
+                        targetState = targetState[keys[i]]
+                    }
+                    // Clear any existing signal in signalMap so function is re-initialized as ComputedSignal
+                    if (targetState && typeof targetState === 'object' && (targetState as any).__isState) {
+                        const signalMap = (targetState as any).__signalMap
+                        if (signalMap && signalMap instanceof Map) {
+                            signalMap.delete(key)
+                        }
+                    }
+                    targetState[key] = value
+                } else if (isObject(value)) {
+                    // Recursively restore nested computed properties
+                    const nestedPrefix = prefix ? `${prefix}.${key}` : key
+                    restore(value, target, nestedPrefix)
+                }
+            }
+        }
+    }
+
+    restore(initial, state)
+}
+
+export function deserializeAllStates(serialized: Record<string, any>): void {
+    if (!serialized || typeof serialized !== 'object') {
+        return
+    }
+
+    const registeredStates = getRegisteredStates()
+
+    // First, deserialize all states
+    for (const [name, serializedState] of Object.entries(serialized)) {
+        const entry = registeredStates.get(name)
+
+        if (!entry) {
+            // State not registered on client - warn in development
+            if (typeof process !== 'undefined' && process.env?.NODE_ENV !== 'production') {
+                logger.warn(`state not found in registry. skipping deserialization.`, {stateName: name})
+            }
+            continue
+        }
+
+        try {
+            deserializeStore(entry.state, serializedState)
+        } catch (error) {
+            // Log error but continue with other states
+            logger.error(`error deserializing state`, error, {stateName: name})
+        }
+    }
+
+    // After deserializing, restore computed properties from original initial states
+    // This ensures computed properties work after SSR deserialization
+    for (const [name, entry] of registeredStates.entries()) {
+        try {
+            restoreComputedProperties(entry.state, entry.initial)
+        } catch (error) {
+            // Log error but continue with other states
+            logger.error(`error restoring computed properties for state`, error, {stateName: name})
+        }
+    }
+}

package/render/trust.ts

@@ -0,0 +1,6 @@
+import Vnode from './vnode'
+
+export default function trust(html: string | null | undefined): any {
+    if (html == null) html = ''
+    return Vnode('<', undefined, undefined, html, undefined, undefined)
+}

package/render/vnode.ts

@@ -0,0 +1,131 @@
+// Type definitions for Mithril components and vnodes
+
+export interface Vnode<Attrs = Record<string, any>, State = any> {
+    tag: string | Component<Attrs, State> | (() => Component<Attrs, State>)
+    key?: string | number | null
+    attrs?: Attrs
+    children?: Children
+    text?: string | number
+    dom?: Node | null
+    is?: string
+    domSize?: number
+    state?: State
+    events?: Record<string, any>
+    instance?: any
+}
+
+/** Single child - Vnode/Element, primitives, or null/undefined */
+export type Child = Vnode | string | number | boolean | null | undefined
+/** Children: single child, array of children, or primitives. Arrays may contain false (conditionally hidden). */
+export type Children = Child | Child[]
+
+/** Vnode with dom guaranteed (oncreate/onupdate lifecycle) */
+export type VnodeDOM<Attrs = Record<string, any>, State = any> = ComponentVnode<Attrs, State> & {dom: Element}
+
+/**
+ * Vnode passed to component lifecycle methods - attrs is always defined (Mithril passes at least {}).
+ * Use this so vnode.attrs is never undefined in view/oninit/oncreate etc.
+ */
+export type ComponentVnode<Attrs = Record<string, any>, State = any> = Omit<Vnode<Attrs, State>, 'attrs'> & {attrs: Attrs}
+
+export interface Component<Attrs = Record<string, any>, State = any> {
+    oninit?: (vnode: ComponentVnode<Attrs, State>) => void
+    oncreate?: (vnode: ComponentVnode<Attrs, State>) => void
+    onbeforeupdate?: (vnode: ComponentVnode<Attrs, State>, old: ComponentVnode<Attrs, State>) => boolean | void
+    onupdate?: (vnode: ComponentVnode<Attrs, State>) => void
+    onbeforeremove?: (vnode: ComponentVnode<Attrs, State>) => Promise<any> | void
+    onremove?: (vnode: ComponentVnode<Attrs, State>) => void
+    view: (vnode: ComponentVnode<Attrs, State>) => Children | Vnode | null
+}
+
+export interface ComponentFactory<Attrs = Record<string, any>, State = any> {
+    (...args: any[]): Component<Attrs, State>
+    view?: (vnode: ComponentVnode<Attrs, State>) => Children | Vnode | null
+}
+
+export type ComponentType<Attrs = Record<string, any>, State = any> =
+    | Component<Attrs, State>
+    | ComponentFactory<Attrs, State>
+    | (() => Component<Attrs, State>)
+    | (new (...args: any[]) => MithrilComponent<Attrs>)
+
+/**
+ * Abstract base class for TSX/JSX class-based components.
+ * Assign view as a property so TypeScript infers vnode from the template: view = (vnode) => { ... }
+ */
+export abstract class MithrilComponent<Attrs = Record<string, any>> {
+    /** Required for JSX attribute type-checking - do not use directly */
+    private readonly __tsx_attrs!: (unknown extends Attrs ? Record<string, any> : Attrs) & {key?: string | number}
+
+    oninit?(vnode: ComponentVnode<Attrs>): void
+    oncreate?(vnode: ComponentVnode<Attrs>): void
+    onbeforeupdate?(vnode: ComponentVnode<Attrs>, old: ComponentVnode<Attrs>): boolean | void
+    onupdate?(vnode: ComponentVnode<Attrs>): void
+    onbeforeremove?(vnode: ComponentVnode<Attrs>): Promise<any> | void
+    onremove?(vnode: ComponentVnode<Attrs>): void
+    /** Implement in subclass: view(vnode) { ... } - annotate vnode as m.Vnode<Attrs> */
+    abstract view(vnode: ComponentVnode<Attrs>): Children | Vnode | null
+}
+
+/** Helper type for Vnode of a component - use when this['Vnode'] is not available */
+export type VnodeOf<T> = T extends MithrilComponent<infer A> ? ComponentVnode<A> : never
+
+function Vnode(
+    tag: any,
+    key: string | number | null | undefined,
+    attrs: Record<string, any> | null | undefined,
+    children: Children | null | undefined,
+    text: string | number | null | undefined,
+    dom: Node | null | undefined,
+): Vnode {
+    return {
+        tag: tag,
+        key: key ?? undefined,
+        attrs: attrs ?? undefined,
+        children: children ?? undefined,
+        text: text ?? undefined,
+        dom: dom ?? undefined,
+        is: undefined,
+        domSize: undefined,
+        state: undefined,
+        events: undefined,
+        instance: undefined,
+    }
+}
+const normalize = function (node: any): Vnode | null {
+    if (Array.isArray(node)) return Vnode('[', undefined, undefined, normalizeChildren(node) as Children, undefined, undefined)
+    if (node == null || typeof node === 'boolean') return null
+    if (typeof node === 'object') return node
+    return Vnode('#', undefined, undefined, String(node), undefined, undefined)
+}
+
+const normalizeChildren = function (input: any[]): (Vnode | null)[] {
+    // Preallocate the array length (initially holey) and fill every index immediately in order.
+    // Benchmarking shows better performance on V8.
+    const children = Array.from({length: input.length}) as (Vnode | null)[]
+    // Count the number of keyed normalized vnodes for consistency check.
+    // Note: this is a perf-sensitive check.
+    // Fun fact: merging the loop like this is somehow faster than splitting
+    // the check within updateNodes(), noticeably so.
+    let numKeyed = 0
+    for (let i = 0; i < input.length; i++) {
+        children[i] = normalize(input[i])
+        if (children[i] !== null && children[i]!.key != null) numKeyed++
+    }
+    if (numKeyed !== 0 && numKeyed !== input.length) {
+        throw new TypeError(
+            children.includes(null)
+                ? 'In fragments, vnodes must either all have keys or none have keys. You may wish to consider using an explicit keyed empty fragment, m.fragment({key: ...}), instead of a hole.'
+                : 'In fragments, vnodes must either all have keys or none have keys.',
+        )
+    }
+    return children
+}
+
+;(Vnode as any).normalize = normalize
+;(Vnode as any).normalizeChildren = normalizeChildren
+
+export default Vnode as typeof Vnode & {
+    normalize: typeof normalize
+    normalizeChildren: typeof normalizeChildren
+}

package/route.ts

@@ -0,0 +1,11 @@
+import mountRedraw from './api/mount-redraw'
+import routerFactory from './api/router'
+import renderFactory from './render/render'
+
+const mountRedrawInstance = mountRedraw(
+    renderFactory(),
+    typeof requestAnimationFrame !== 'undefined' ? requestAnimationFrame.bind(window) : setTimeout,
+    console,
+)
+
+export default routerFactory(typeof window !== 'undefined' ? window : null, mountRedrawInstance)