@fictjs/runtime 0.0.12 → 0.0.13

package/src/cycle-guard.ts

@@ -1,5 +1,10 @@
 import { getDevtoolsHook } from './devtools'
 
+const isDev =
+  typeof __DEV__ !== 'undefined'
+    ? __DEV__
+    : typeof process === 'undefined' || process.env?.NODE_ENV !== 'production'
+
 export interface CycleProtectionOptions {
   maxFlushCyclesPerMicrotask?: number
   maxEffectRunsPerFlush?: number
@@ -15,120 +20,142 @@ interface CycleWindowEntry {
   budget: number
 }
 
-const defaultOptions = {
-  maxFlushCyclesPerMicrotask: 10_000,
-  maxEffectRunsPerFlush: 20_000,
-  windowSize: 5,
-  highUsageRatio: 0.8,
-  maxRootReentrantDepth: 10,
-  enableWindowWarning: true,
-  devMode: false,
-}
+let setCycleProtectionOptions: (opts: CycleProtectionOptions) => void = () => {}
+let resetCycleProtectionStateForTests: () => void = () => {}
+let beginFlushGuard: () => void = () => {}
+let beforeEffectRunGuard: () => boolean = () => true
+let endFlushGuard: () => void = () => {}
+let enterRootGuard: (root: object) => boolean = () => true
+let exitRootGuard: (root: object) => void = () => {}
 
-let options: Required<CycleProtectionOptions> = {
-  ...defaultOptions,
-} as Required<CycleProtectionOptions>
+if (isDev) {
+  const defaultOptions = {
+    maxFlushCyclesPerMicrotask: 10_000,
+    maxEffectRunsPerFlush: 20_000,
+    windowSize: 5,
+    highUsageRatio: 0.8,
+    maxRootReentrantDepth: 10,
+    enableWindowWarning: true,
+    devMode: false,
+  }
 
-let effectRunsThisFlush = 0
-let windowUsage: CycleWindowEntry[] = []
-let rootDepth = new WeakMap<object, number>()
-let flushWarned = false
-let rootWarned = false
-let windowWarned = false
+  let options: Required<CycleProtectionOptions> = {
+    ...defaultOptions,
+  } as Required<CycleProtectionOptions>
 
-export function setCycleProtectionOptions(opts: CycleProtectionOptions): void {
-  options = { ...options, ...opts }
-}
+  let effectRunsThisFlush = 0
+  let windowUsage: CycleWindowEntry[] = []
+  let rootDepth = new WeakMap<object, number>()
+  let flushWarned = false
+  let rootWarned = false
+  let windowWarned = false
 
-export function resetCycleProtectionStateForTests(): void {
-  options = { ...defaultOptions } as Required<CycleProtectionOptions>
-  effectRunsThisFlush = 0
-  windowUsage = []
-  rootDepth = new WeakMap<object, number>()
-  flushWarned = false
-  rootWarned = false
-  windowWarned = false
-}
+  setCycleProtectionOptions = opts => {
+    options = { ...options, ...opts }
+  }
 
-export function beginFlushGuard(): void {
-  effectRunsThisFlush = 0
-  flushWarned = false
-  windowWarned = false
-}
+  resetCycleProtectionStateForTests = () => {
+    options = { ...defaultOptions } as Required<CycleProtectionOptions>
+    effectRunsThisFlush = 0
+    windowUsage = []
+    rootDepth = new WeakMap<object, number>()
+    flushWarned = false
+    rootWarned = false
+    windowWarned = false
+  }
 
-export function beforeEffectRunGuard(): boolean {
-  const next = ++effectRunsThisFlush
-  if (next > options.maxFlushCyclesPerMicrotask || next > options.maxEffectRunsPerFlush) {
-    const message = `[fict] cycle protection triggered: flush-budget-exceeded`
-    if (options.devMode) {
-      throw new Error(message)
-    }
-    if (!flushWarned) {
-      flushWarned = true
-      console.warn(message, { effectRuns: next })
+  beginFlushGuard = () => {
+    effectRunsThisFlush = 0
+    flushWarned = false
+    windowWarned = false
+  }
+
+  beforeEffectRunGuard = () => {
+    const next = ++effectRunsThisFlush
+    if (next > options.maxFlushCyclesPerMicrotask || next > options.maxEffectRunsPerFlush) {
+      const message = `[fict] cycle protection triggered: flush-budget-exceeded`
+      if (options.devMode) {
+        throw new Error(message)
+      }
+      if (!flushWarned) {
+        flushWarned = true
+        console.warn(message, { effectRuns: next })
+      }
+      return false
     }
-    return false
+    return true
   }
-  return true
-}
 
-export function endFlushGuard(): void {
-  recordWindowUsage(effectRunsThisFlush, options.maxFlushCyclesPerMicrotask)
-  effectRunsThisFlush = 0
-}
+  endFlushGuard = () => {
+    recordWindowUsage(effectRunsThisFlush, options.maxFlushCyclesPerMicrotask)
+    effectRunsThisFlush = 0
+  }
 
-export function enterRootGuard(root: object): boolean {
-  const depth = (rootDepth.get(root) ?? 0) + 1
-  if (depth > options.maxRootReentrantDepth) {
-    const message = `[fict] cycle protection triggered: root-reentry`
-    if (options.devMode) {
-      throw new Error(message)
+  enterRootGuard = root => {
+    const depth = (rootDepth.get(root) ?? 0) + 1
+    if (depth > options.maxRootReentrantDepth) {
+      const message = `[fict] cycle protection triggered: root-reentry`
+      if (options.devMode) {
+        throw new Error(message)
+      }
+      if (!rootWarned) {
+        rootWarned = true
+        console.warn(message, { depth })
+      }
+      return false
     }
-    if (!rootWarned) {
-      rootWarned = true
-      console.warn(message, { depth })
-    }
-    return false
+    rootDepth.set(root, depth)
+    return true
   }
-  rootDepth.set(root, depth)
-  return true
-}
 
-export function exitRootGuard(root: object): void {
-  const depth = rootDepth.get(root)
-  if (depth === undefined) return
-  if (depth <= 1) {
-    rootDepth.delete(root)
-  } else {
-    rootDepth.set(root, depth - 1)
+  exitRootGuard = root => {
+    const depth = rootDepth.get(root)
+    if (depth === undefined) return
+    if (depth <= 1) {
+      rootDepth.delete(root)
+    } else {
+      rootDepth.set(root, depth - 1)
+    }
   }
-}
 
-function recordWindowUsage(used: number, budget: number): void {
-  if (!options.enableWindowWarning) return
-  const entry = { used, budget }
-  windowUsage.push(entry)
-  if (windowUsage.length > options.windowSize) {
-    windowUsage.shift()
+  const recordWindowUsage = (used: number, budget: number): void => {
+    if (!options.enableWindowWarning) return
+    const entry = { used, budget }
+    windowUsage.push(entry)
+    if (windowUsage.length > options.windowSize) {
+      windowUsage.shift()
+    }
+    if (windowWarned) return
+    if (
+      windowUsage.length >= options.windowSize &&
+      windowUsage.every(
+        item => item.budget > 0 && item.used / item.budget >= options.highUsageRatio,
+      )
+    ) {
+      windowWarned = true
+      reportCycle('high-usage-window', {
+        windowSize: options.windowSize,
+        ratio: options.highUsageRatio,
+      })
+    }
   }
-  if (windowWarned) return
-  if (
-    windowUsage.length >= options.windowSize &&
-    windowUsage.every(item => item.budget > 0 && item.used / item.budget >= options.highUsageRatio)
-  ) {
-    windowWarned = true
-    reportCycle('high-usage-window', {
-      windowSize: options.windowSize,
-      ratio: options.highUsageRatio,
-    })
+
+  const reportCycle = (
+    reason: string,
+    detail: Record<string, unknown> | undefined = undefined,
+  ): void => {
+    const hook = getDevtoolsHook()
+    hook?.cycleDetected?.(detail ? { reason, detail } : { reason })
+    console.warn(`[fict] cycle protection triggered: ${reason}`, detail ?? '')
   }
 }
 
-function reportCycle(
-  reason: string,
-  detail: Record<string, unknown> | undefined = undefined,
-): void {
-  const hook = getDevtoolsHook()
-  hook?.cycleDetected?.(detail ? { reason, detail } : { reason })
-  console.warn(`[fict] cycle protection triggered: ${reason}`, detail ?? '')
+export {
+  setCycleProtectionOptions,
+  resetCycleProtectionStateForTests,
+  beginFlushGuard,
+  beforeEffectRunGuard,
+  endFlushGuard,
+  enterRootGuard,
+  exitRootGuard,
 }

package/src/dom.ts

@@ -20,19 +20,11 @@ import {
   createChildBinding,
   bindEvent,
   isReactive,
-  PRIMITIVE_PROXY,
   type MaybeReactive,
   type AttributeSetter,
   type BindingHandle,
 } from './binding'
-import {
-  Properties,
-  ChildProperties,
-  Aliases,
-  getPropAlias,
-  SVGElements,
-  SVGNamespace,
-} from './constants'
+import { Properties, ChildProperties, getPropAlias, SVGElements, SVGNamespace } from './constants'
 import { __fictPushContext, __fictPopContext } from './hooks'
 import { Fragment } from './jsx'
 import {
@@ -128,7 +120,7 @@ function resolveNamespace(tagName: string, namespace: NamespaceContext): Namespa
   if (tagName === 'math') return 'mathml'
   if (namespace === 'mathml') return 'mathml'
   if (namespace === 'svg') return 'svg'
-  if (SVGElements.has(tagName)) return 'svg'
+  if (isDev && SVGElements.has(tagName)) return 'svg'
   return null
 }
 
@@ -143,9 +135,8 @@ function createElementWithContext(node: FictNode, namespace: NamespaceContext):
     return document.createTextNode('')
   }
 
-  // Primitive proxy produced by keyed list binding
   if (typeof node === 'object' && node !== null && !(node instanceof Node)) {
-    // Handle BindingHandle (createList, createConditional, etc)
+    // Handle BindingHandle (list/conditional bindings, etc)
     if ('marker' in node) {
       const handle = node as { marker: unknown; dispose?: () => void; flush?: () => void }
       // Register dispose cleanup if available
@@ -164,14 +155,6 @@ function createElementWithContext(node: FictNode, namespace: NamespaceContext):
       }
       return createElement(handle.marker as FictNode)
     }
-
-    const nodeRecord = node as unknown as Record<PropertyKey, unknown>
-    if (nodeRecord[PRIMITIVE_PROXY]) {
-      const primitiveGetter = nodeRecord[Symbol.toPrimitive]
-      const value =
-        typeof primitiveGetter === 'function' ? primitiveGetter.call(node, 'default') : node
-      return document.createTextNode(value == null || value === false ? '' : String(value))
-    }
   }
 
   // Array - create fragment
@@ -559,7 +542,13 @@ function applyProps(el: Element, props: Record<string, unknown>, isSVG = false):
     }
 
     // Child properties (innerHTML, textContent, etc.)
-    if (ChildProperties.has(key)) {
+    if (
+      (isDev && ChildProperties.has(key)) ||
+      key === 'innerHTML' ||
+      key === 'textContent' ||
+      key === 'innerText' ||
+      key === 'children'
+    ) {
       createAttributeBinding(el, key, value as MaybeReactive<unknown>, setProperty)
       continue
     }
@@ -583,13 +572,18 @@ function applyProps(el: Element, props: Record<string, unknown>, isSVG = false):
     }
 
     // Check for property alias (element-specific mappings)
-    const propAlias = !isSVG ? getPropAlias(key, tagName) : undefined
+    const propAlias = !isSVG && isDev ? getPropAlias(key, tagName) : undefined
+    const isProperty = !isSVG
+      ? isDev
+        ? Properties.has(key)
+        : key in (el as unknown as Record<string, unknown>)
+      : false
 
     // Handle properties and element-specific attributes
-    if (propAlias || (!isSVG && Properties.has(key)) || (isCE && !isSVG)) {
+    if (propAlias || isProperty || (isCE && !isSVG)) {
       const propName = propAlias || key
       // Custom elements use toPropertyName conversion
-      if (isCE && !Properties.has(key)) {
+      if (isCE && !isProperty && !propAlias) {
         createAttributeBinding(
           el,
           toPropertyName(propName),
@@ -616,7 +610,7 @@ function applyProps(el: Element, props: Record<string, unknown>, isSVG = false):
 
     // Regular attributes (potentially reactive)
     // Apply alias mapping (className -> class, htmlFor -> for)
-    const attrName = Aliases[key] || key
+    const attrName = key === 'htmlFor' ? 'for' : key
     createAttributeBinding(el, attrName, value as MaybeReactive<unknown>, setAttribute)
   }
 }

package/src/effect.ts

@@ -8,6 +8,10 @@ import {
 import { effectWithCleanup } from './signal'
 import type { Cleanup } from './types'
 
+/**
+ * Effect callback run synchronously; async callbacks are not tracked after the first await.
+ * TypeScript will reject `async () => {}` here—split async work or read signals before awaiting.
+ */
 export type Effect = () => void | Cleanup
 
 export function createEffect(fn: Effect): () => void {

package/src/hooks.ts

@@ -2,6 +2,11 @@ import { createEffect } from './effect'
 import { createMemo } from './memo'
 import { createSignal, type SignalAccessor, type ComputedAccessor } from './signal'
 
+const isDev =
+  typeof __DEV__ !== 'undefined'
+    ? __DEV__
+    : typeof process === 'undefined' || process.env?.NODE_ENV !== 'production'
+
 interface HookContext {
   slots: unknown[]
   cursor: number
@@ -12,7 +17,10 @@ const ctxStack: HookContext[] = []
 
 function assertRenderContext(ctx: HookContext, hookName: string): void {
   if (!ctx.rendering) {
-    throw new Error(`${hookName} can only be used during render execution`)
+    const message = isDev
+      ? `${hookName} can only be used during render execution`
+      : 'FICT:E_HOOK_RENDER'
+    throw new Error(message)
   }
 }
 

package/src/index.ts

@@ -101,12 +101,10 @@ export {
   isReactive,
   // Advanced bindings
   createConditional,
-  createList,
   createPortal,
   createShow,
   // Utility functions
   unwrap,
-  unwrapPrimitive,
 } from './binding'
 
 // Constants for DOM handling
@@ -129,13 +127,7 @@ export { default as reconcileArrays } from './reconcile'
 // Types
 // ============================================================================
 
-export type {
-  MaybeReactive,
-  BindingHandle,
-  KeyFn,
-  CreateElementFn,
-  AttributeSetter,
-} from './binding'
+export type { MaybeReactive, BindingHandle, CreateElementFn, AttributeSetter } from './binding'
 
 export type {
   FictNode,
@@ -167,21 +159,11 @@ export {
   moveNodesBefore,
   removeNodes,
   insertNodesBefore,
-  moveMarkerBlock,
-  destroyMarkerBlock,
-  // Keyed list container
-  createKeyedListContainer,
-  // Block creation
-  createKeyedBlock,
   // High-level list binding (for compiler-generated code)
   createKeyedList,
   // Utilities
   toNodeArray,
-  getFirstNodeAfter,
   isNodeBetweenMarkers,
   // Types
-  type KeyedBlock,
-  type KeyedListContainer,
   type KeyedListBinding,
-  type MarkerBlock,
 } from './list-helpers'

package/src/lifecycle.ts

@@ -1,6 +1,11 @@
 import { enterRootGuard, exitRootGuard } from './cycle-guard'
 import type { Cleanup, ErrorInfo, SuspenseToken } from './types'
 
+const isDev =
+  typeof __DEV__ !== 'undefined'
+    ? __DEV__
+    : typeof process === 'undefined' || process.env?.NODE_ENV !== 'production'
+
 type LifecycleFn = () => void | Cleanup
 
 export interface RootContext {
@@ -169,7 +174,10 @@ function runLifecycle(fn: LifecycleFn): void {
 
 export function registerErrorHandler(fn: ErrorHandler): void {
   if (!currentRoot) {
-    throw new Error('registerErrorHandler must be called within a root')
+    const message = isDev
+      ? 'registerErrorHandler must be called within a root'
+      : 'FICT:E_ROOT_HANDLER'
+    throw new Error(message)
   }
   if (!currentRoot.errorHandlers) {
     currentRoot.errorHandlers = []
@@ -185,7 +193,10 @@ export function registerErrorHandler(fn: ErrorHandler): void {
 
 export function registerSuspenseHandler(fn: SuspenseHandler): void {
   if (!currentRoot) {
-    throw new Error('registerSuspenseHandler must be called within a root')
+    const message = isDev
+      ? 'registerSuspenseHandler must be called within a root'
+      : 'FICT:E_ROOT_SUSPENSE'
+    throw new Error(message)
   }
   if (!currentRoot.suspenseHandlers) {
     currentRoot.suspenseHandlers = []

package/src/list-helpers.ts

@@ -37,7 +37,7 @@ const isDev =
 /**
  * A keyed block represents a single item in a list with its associated DOM nodes and state
  */
-export interface KeyedBlock<T = unknown> {
+interface KeyedBlock<T = unknown> {
   /** Unique key for this block */
   key: string | number
   /** DOM nodes belonging to this block */
@@ -57,7 +57,7 @@ export interface KeyedBlock<T = unknown> {
 /**
  * Container for managing keyed list blocks
  */
-export interface KeyedListContainer<T = unknown> {
+interface KeyedListContainer<T = unknown> {
   /** Start marker comment node */
   startMarker: Comment
   /** End marker comment node */
@@ -102,15 +102,6 @@ type FineGrainedRenderItem<T> = (
   key: string | number,
 ) => Node[]
 
-/**
- * A block identified by start/end comment markers.
- */
-export interface MarkerBlock {
-  start: Comment
-  end: Comment
-  root?: RootContext
-}
-
 // ============================================================================
 // DOM Manipulation Primitives
 // ============================================================================
@@ -129,7 +120,8 @@ export function moveNodesBefore(parent: Node, nodes: Node[], anchor: Node | null
   for (let i = nodes.length - 1; i >= 0; i--) {
     const node = nodes[i]!
     if (!node || !(node instanceof Node)) {
-      throw new Error('Invalid node in moveNodesBefore')
+      const message = isDev ? 'Invalid node in moveNodesBefore' : 'FICT:E_NODE'
+      throw new Error(message)
     }
     // Only move if not already in correct position
     if (node.nextSibling !== anchor) {
@@ -162,50 +154,6 @@ export function moveNodesBefore(parent: Node, nodes: Node[], anchor: Node | null
  *
  * @param nodes - Array of nodes to remove
  */
-/**
- * Move an entire marker-delimited block (including markers) before the anchor.
- */
-export function moveMarkerBlock(parent: Node, block: MarkerBlock, anchor: Node | null): void {
-  const nodes = collectBlockNodes(block)
-  if (nodes.length === 0) return
-  moveNodesBefore(parent, nodes, anchor)
-}
-
-/**
- * Destroy a marker-delimited block, removing nodes and destroying the associated root.
- */
-export function destroyMarkerBlock(block: MarkerBlock): void {
-  if (block.root) {
-    destroyRoot(block.root)
-  }
-  removeBlockRange(block)
-}
-
-function collectBlockNodes(block: MarkerBlock): Node[] {
-  const nodes: Node[] = []
-  let cursor: Node | null = block.start
-  while (cursor) {
-    nodes.push(cursor)
-    if (cursor === block.end) {
-      break
-    }
-    cursor = cursor.nextSibling
-  }
-  return nodes
-}
-
-function removeBlockRange(block: MarkerBlock): void {
-  let cursor: Node | null = block.start
-  while (cursor) {
-    const next: Node | null = cursor.nextSibling
-    cursor.parentNode?.removeChild(cursor)
-    if (cursor === block.end) {
-      break
-    }
-    cursor = next
-  }
-}
-
 // Number.MAX_SAFE_INTEGER is 2^53 - 1, but we reset earlier to avoid any precision issues
 const MAX_SAFE_VERSION = 0x1fffffffffffff // 2^53 - 1
 
@@ -238,7 +186,7 @@ export function createVersionedSignalAccessor<T>(initialValue: T): Signal<T> {
  *
  * @returns Container object with markers, blocks map, and dispose function
  */
-export function createKeyedListContainer<T = unknown>(): KeyedListContainer<T> {
+function createKeyedListContainer<T = unknown>(): KeyedListContainer<T> {
   const startMarker = document.createComment('fict:list:start')
   const endMarker = document.createComment('fict:list:end')
 
@@ -306,7 +254,7 @@ export function createKeyedListContainer<T = unknown>(): KeyedListContainer<T> {
  * @param render - Function that creates the DOM nodes and sets up bindings
  * @returns New KeyedBlock
  */
-export function createKeyedBlock<T>(
+function createKeyedBlock<T>(
   key: string | number,
   item: T,
   index: number,
@@ -377,13 +325,6 @@ export function createKeyedBlock<T>(
 // Utilities
 // ============================================================================
 
-/**
- * Find the first node after the start marker (for getting current anchor)
- */
-export function getFirstNodeAfter(marker: Comment): Node | null {
-  return marker.nextSibling
-}
-
 /**
  * Check if a node is between two markers
  */