@fictjs/runtime 0.1.0 → 0.2.1

package/src/signal.ts

@@ -1,6 +1,13 @@
 import { beginFlushGuard, beforeEffectRunGuard, endFlushGuard } from './cycle-guard'
 import { getDevtoolsHook } from './devtools'
-import { registerRootCleanup } from './lifecycle'
+import {
+  getCurrentRoot,
+  handleError,
+  handleSuspend,
+  registerRootCleanup,
+  type RootContext,
+} from './lifecycle'
+import type { SuspenseToken } from './types'
 
 const isDev =
   typeof __DEV__ !== 'undefined'
@@ -103,6 +110,8 @@ export interface EffectNode extends BaseNode {
   depsTail: Link | undefined
   /** Optional cleanup runner to be called before checkDirty */
   runCleanup?: () => void
+  /** Root context for error/suspense handling */
+  root?: RootContext
   /** Devtools ID */
   __id?: number | undefined
 }
@@ -808,7 +817,25 @@ function runEffect(e: EffectNode): void {
         inCleanup = false
       }
     }
-    if (checkDirty(e.deps, e)) {
+    let isDirty = false
+    try {
+      isDirty = checkDirty(e.deps, e)
+    } catch (err) {
+      if (handleSuspend(err as SuspenseToken, e.root)) {
+        if (e.flags !== 0) {
+          e.flags = Watching
+        }
+        return
+      }
+      if (handleError(err, { source: 'effect' }, e.root)) {
+        if (e.flags !== 0) {
+          e.flags = Watching
+        }
+        return
+      }
+      throw err
+    }
+    if (isDirty) {
       ++cycle
       effectRunDevtools(e)
       e.depsTail = undefined
@@ -1031,7 +1058,7 @@ function computedOper<T>(this: ComputedNode<T>): T {
  * @returns An effect disposer function
  */
 export function effect(fn: () => void): EffectDisposer {
-  const e = {
+  const e: EffectNode = {
     fn,
     subs: undefined,
     subsTail: undefined,
@@ -1040,6 +1067,10 @@ export function effect(fn: () => void): EffectDisposer {
     flags: WatchingRunning,
     __id: undefined as number | undefined,
   }
+  const root = getCurrentRoot()
+  if (root) {
+    e.root = root
+  }
 
   registerEffectDevtools(e)
 
@@ -1066,9 +1097,14 @@ export function effect(fn: () => void): EffectDisposer {
  * cleanup functions to access the previous values of signals.
  * @param fn - The effect function
  * @param cleanupRunner - Function to run cleanups before signal value commit
+ * @param root - Root context for error/suspense handling (defaults to current root)
  * @returns An effect disposer function
  */
-export function effectWithCleanup(fn: () => void, cleanupRunner: () => void): EffectDisposer {
+export function effectWithCleanup(
+  fn: () => void,
+  cleanupRunner: () => void,
+  root?: RootContext,
+): EffectDisposer {
   const e: EffectNode = {
     fn,
     subs: undefined,
@@ -1079,6 +1115,10 @@ export function effectWithCleanup(fn: () => void, cleanupRunner: () => void): Ef
     runCleanup: cleanupRunner,
     __id: undefined as number | undefined,
   }
+  const resolvedRoot = root ?? getCurrentRoot()
+  if (resolvedRoot) {
+    e.root = resolvedRoot
+  }
 
   registerEffectDevtools(e)
 

package/src/store.ts

@@ -35,17 +35,17 @@ export function createStore<T extends object>(
 }
 
 // Map of target object -> Proxy
-const proxyCache = new WeakMap<object, any>()
+const proxyCache = new WeakMap<object, unknown>()
 // Map of target object -> Map<key, Signal>
-const signalCache = new WeakMap<object, Map<string | symbol, SignalAccessor<any>>>()
+const signalCache = new WeakMap<object, Map<string | symbol, SignalAccessor<unknown>>>()
 
 function wrap<T>(value: T): T {
   if (value === null || typeof value !== 'object') return value
-  if ((value as any)[PROXY]) return value
+  if (Reflect.get(value, PROXY)) return value
 
-  if (proxyCache.has(value)) return proxyCache.get(value)
+  if (proxyCache.has(value)) return proxyCache.get(value) as T
 
-  const handler: ProxyHandler<any> = {
+  const handler: ProxyHandler<object> = {
     get(target, prop, receiver) {
       if (prop === PROXY) return true
       if (prop === TARGET) return target
@@ -74,6 +74,8 @@ function wrap<T>(value: T): T {
     set(target, prop, value, receiver) {
       if (prop === PROXY || prop === TARGET) return false
 
+      const isArrayLength = Array.isArray(target) && prop === 'length'
+      const oldLength = isArrayLength ? target.length : undefined
       const hadKey = Object.prototype.hasOwnProperty.call(target, prop)
       const oldValue = Reflect.get(target, prop, receiver)
       if (oldValue === value) return true
@@ -84,6 +86,23 @@ function wrap<T>(value: T): T {
         if (!hadKey) {
           trigger(target, ITERATE_KEY)
         }
+        if (isArrayLength) {
+          const nextLength = target.length
+          if (typeof oldLength === 'number' && nextLength < oldLength) {
+            const signals = signalCache.get(target)
+            if (signals) {
+              for (const key of signals.keys()) {
+                if (typeof key !== 'string') continue
+                const index = Number(key)
+                if (!Number.isInteger(index) || String(index) !== key) continue
+                if (index >= nextLength && index < oldLength) {
+                  trigger(target, key)
+                }
+              }
+            }
+          }
+          trigger(target, ITERATE_KEY)
+        }
       }
       return result
     },
@@ -106,8 +125,8 @@ function wrap<T>(value: T): T {
 }
 
 function unwrap<T>(value: T): T {
-  if (value && typeof value === 'object' && (value as any)[PROXY]) {
-    return (value as any)[TARGET]
+  if (value && typeof value === 'object' && Reflect.get(value, PROXY)) {
+    return Reflect.get(value, TARGET) as T
   }
   return value
 }
@@ -143,14 +162,14 @@ function trigger(target: object, prop: string | symbol) {
   }
 }
 
-function getLastValue(target: any, prop: string | symbol) {
-  return target[prop]
+function getLastValue(target: object, prop: string | symbol) {
+  return Reflect.get(target, prop)
 }
 
 /**
  * Reconcile a store path with a new value (shallow merge/diff)
  */
-function reconcile(target: any, value: any) {
+function reconcile(target: object, value: unknown) {
   if (target === value) return
   if (value === null || typeof value !== 'object') {
     throw new Error(
@@ -165,16 +184,19 @@ function reconcile(target: any, value: any) {
 
   const keys = new Set([...Object.keys(realTarget), ...Object.keys(realValue)])
   for (const key of keys) {
-    if (realValue[key] === undefined && realTarget[key] !== undefined) {
+    const rTarget = realTarget as Record<string, unknown>
+    const rValue = realValue as Record<string, unknown>
+
+    if (rValue[key] === undefined && rTarget[key] !== undefined) {
       // deleted
-      delete target[key] // Triggers proxy trap
-    } else if (realTarget[key] !== realValue[key]) {
-      target[key] = realValue[key] // Triggers proxy trap
+      delete (target as Record<string, unknown>)[key] // Triggers proxy trap
+    } else if (rTarget[key] !== rValue[key]) {
+      ;(target as Record<string, unknown>)[key] = rValue[key] // Triggers proxy trap
     }
   }
 
   // Fix array length if needed
-  if (Array.isArray(target) && target.length !== realValue.length) {
+  if (Array.isArray(target) && Array.isArray(realValue) && target.length !== realValue.length) {
     target.length = realValue.length
   }
 }
@@ -190,13 +212,13 @@ function reconcile(target: any, value: any) {
  */
 export function createDiffingSignal<T extends object>(initialValue: T) {
   let currentValue = unwrap(initialValue)
-  const signals = new Map<string | symbol, SignalAccessor<any>>()
+  const signals = new Map<string | symbol, SignalAccessor<unknown>>()
   let iterateSignal: SignalAccessor<number> | undefined
 
   const getPropSignal = (prop: string | symbol) => {
     let s = signals.get(prop)
     if (!s) {
-      s = signal((currentValue as any)[prop])
+      s = signal(Reflect.get(currentValue as object, prop))
       signals.set(prop, s)
     }
     return s
@@ -250,7 +272,7 @@ export function createDiffingSignal<T extends object>(initialValue: T) {
       // Same ref update: re-evaluate all tracked signals
       // This is necessary for in-place mutations
       for (const [prop, s] of signals) {
-        const newVal = (next as any)[prop]
+        const newVal = Reflect.get(next as object, prop)
         s(newVal)
       }
       updateIterate(next)
@@ -261,8 +283,8 @@ export function createDiffingSignal<T extends object>(initialValue: T) {
     // We only trigger signals for properties that exist in our cache (tracked)
     // and have changed.
     for (const [prop, s] of signals) {
-      const oldVal = (prev as any)[prop]
-      const newVal = (next as any)[prop]
+      const oldVal = Reflect.get(prev as object, prop)
+      const newVal = Reflect.get(next as object, prop)
       if (oldVal !== newVal) {
         s(newVal)
       }

package/src/suspense.ts

@@ -49,7 +49,6 @@ const isThenable = (value: unknown): value is PromiseLike<unknown> =>
   typeof (value as PromiseLike<unknown>).then === 'function'
 
 export function Suspense(props: SuspenseProps): FictNode {
-  const currentView = createSignal<FictNode | null>(props.children ?? null)
   const pending = createSignal(0)
   let resolvedOnce = false
   let epoch = 0
@@ -60,11 +59,6 @@ export function Suspense(props: SuspenseProps): FictNode {
       ? (props.fallback as (e?: unknown) => FictNode)(err)
       : props.fallback
 
-  const switchView = (view: FictNode | null) => {
-    currentView(view)
-    renderView(view)
-  }
-
   const renderView = (view: FictNode | null) => {
     if (cleanup) {
       cleanup()
@@ -88,8 +82,9 @@ export function Suspense(props: SuspenseProps): FictNode {
       // Suspended view: child threw a suspense token and was handled upstream.
       // Avoid replacing existing fallback content; tear down this attempt.
       const suspendedAttempt =
-        nodes.length > 0 &&
-        nodes.every(node => node instanceof Comment && (node as Comment).data === 'fict:suspend')
+        root.suspended ||
+        (nodes.length > 0 &&
+          nodes.every(node => node instanceof Comment && (node as Comment).data === 'fict:suspend'))
       if (suspendedAttempt) {
         popRoot(prev)
         destroyRoot(root)
@@ -101,7 +96,6 @@ export function Suspense(props: SuspenseProps): FictNode {
       }
     } catch (err) {
       popRoot(prev)
-      flushOnMount(root)
       destroyRoot(root)
       if (!handleError(err, { source: 'render' }, hostRoot)) {
         throw err
@@ -134,7 +128,9 @@ export function Suspense(props: SuspenseProps): FictNode {
   registerSuspenseHandler(token => {
     const tokenEpoch = epoch
     pending(pending() + 1)
-    switchView(toFallback())
+    // Directly render fallback instead of using switchView to avoid
+    // triggering the effect which would cause duplicate renders
+    renderView(toFallback())
 
     const thenable = (token as SuspenseToken).then
       ? (token as SuspenseToken)
@@ -157,7 +153,8 @@ export function Suspense(props: SuspenseProps): FictNode {
           const newPending = Math.max(0, pending() - 1)
           pending(newPending)
           if (newPending === 0) {
-            switchView(props.children ?? null)
+            // Directly render children instead of using switchView
+            renderView(props.children ?? null)
             onResolveMaybe()
           }
         },
@@ -180,9 +177,10 @@ export function Suspense(props: SuspenseProps): FictNode {
     return false
   })
 
-  createEffect(() => {
-    renderView(currentView())
-  })
+  // Initial render - render children directly
+  // Note: This will be called synchronously during component creation.
+  // If children suspend, the handler above will be called and switch to fallback.
+  renderView(props.children ?? null)
 
   if (props.resetKeys !== undefined) {
     const isGetter =
@@ -195,7 +193,8 @@ export function Suspense(props: SuspenseProps): FictNode {
         prev = next
         epoch++
         pending(0)
-        switchView(props.children ?? null)
+        // Directly render children instead of using switchView
+        renderView(props.children ?? null)
       }
     })
   }