@pyreon/core 0.13.1 → 0.15.0

package/src/lifecycle.ts

@@ -2,8 +2,7 @@ import type { CleanupFn, LifecycleHooks } from './types'
 
 // Dev-mode gate: see `pyreon/no-process-dev-gate` lint rule for why this
 // uses `import.meta.env.DEV` instead of `typeof process !== 'undefined'`.
-// @ts-ignore — `import.meta.env.DEV` is provided by Vite/Rolldown at build time
-const __DEV__ = import.meta.env?.DEV === true
+const __DEV__ = process.env.NODE_ENV !== 'production'
 
 // The currently-executing component's hook storage, set by the renderer
 // before calling the component function, cleared immediately after.
@@ -79,7 +78,10 @@ function warnOutsideSetup(hookName: string): void {
  */
 export function onMount(fn: () => CleanupFn | void | undefined) {
   warnOutsideSetup('onMount')
-  _current?.mount.push(fn)
+  if (_current) {
+    if (_current.mount === null) _current.mount = []
+    _current.mount.push(fn)
+  }
 }
 
 /**
@@ -87,7 +89,10 @@ export function onMount(fn: () => CleanupFn | void | undefined) {
  */
 export function onUnmount(fn: () => void) {
   warnOutsideSetup('onUnmount')
-  _current?.unmount.push(fn)
+  if (_current) {
+    if (_current.unmount === null) _current.unmount = []
+    _current.unmount.push(fn)
+  }
 }
 
 /**
@@ -95,7 +100,10 @@ export function onUnmount(fn: () => void) {
  */
 export function onUpdate(fn: () => void) {
   warnOutsideSetup('onUpdate')
-  _current?.update.push(fn)
+  if (_current) {
+    if (_current.update === null) _current.update = []
+    _current.update.push(fn)
+  }
 }
 
 /**
@@ -113,5 +121,8 @@ export function onUpdate(fn: () => void) {
  */
 export function onErrorCaptured(fn: (err: unknown) => boolean | undefined) {
   warnOutsideSetup('onErrorCaptured')
-  _current?.error.push(fn)
+  if (_current) {
+    if (_current.error === null) _current.error = []
+    _current.error.push(fn)
+  }
 }

package/src/manifest.ts

@@ -249,14 +249,14 @@ const getMode = useContext(ModeCtx)    // reactive: returns () => T`,
       kind: 'component',
       signature: '<Show when={condition} fallback={alternative}>{children}</Show>',
       summary:
-        'Reactive conditional rendering. Mounts children when `when` is truthy, unmounts and shows `fallback` when falsy. More efficient than ternary for signal-driven conditions because it avoids re-evaluating the entire branch expression on every signal change — `Show` only transitions between mounted/unmounted when the boolean flips.',
+        'Reactive conditional rendering. Mounts children when `when` is truthy, unmounts and shows `fallback` when falsy. More efficient than ternary for signal-driven conditions because it avoids re-evaluating the entire branch expression on every signal change — `Show` only transitions between mounted/unmounted when the boolean flips. `when` accepts BOTH a value (`when={true}`, `when={signal()}`) and an accessor (`when={() => signal()}`) — the framework normalizes via `typeof === "function"`. The accessor form is required for true reactivity (the framework re-evaluates it on signal change); a bare `when={signal}` reference works because the compiler\'s signal auto-call rewrites it to `when={signal()}`.',
       example: `<Show when={isLoggedIn()} fallback={<LoginForm />}>
   <Dashboard />
 </Show>`,
       mistakes: [
         '`{cond() ? <A /> : <B />}` — works but less efficient than `<Show>` for signal-driven conditions',
         '`<Show when={items().length}>` — works (truthy check), but be explicit: `<Show when={items().length > 0}>`',
-        '`<Show when={user}>` without calling the signal — must call: `<Show when={user()}>`',
+        '`<Show when={signal}>` (bare reference) — relies on the compiler\'s signal auto-call to rewrite to `when={signal()}`. Works defensively but use `when={() => signal()}` for explicit accessor semantics across the entire reactive lifecycle.',
       ],
       seeAlso: ['Switch', 'Match', 'For'],
     },
@@ -284,7 +284,7 @@ const getMode = useContext(ModeCtx)    // reactive: returns () => T`,
       kind: 'component',
       signature: '<Match when={condition}>{children}</Match>',
       summary:
-        'A branch inside a `<Switch>`. Renders its children when `when` is truthy and it is the first truthy `<Match>` in the parent `<Switch>`. Must be a direct child of `<Switch>`.',
+        'A branch inside a `<Switch>`. Renders its children when `when` is truthy and it is the first truthy `<Match>` in the parent `<Switch>`. Must be a direct child of `<Switch>`. `when` accepts both a value and an accessor (same normalization as `<Show>`).',
       example: `<Switch>
   <Match when={tab() === "home"}><Home /></Match>
   <Match when={tab() === "settings"}><Settings /></Match>
@@ -481,6 +481,46 @@ return <input ref={inputRef} />`,
 })`,
       seeAlso: ['@pyreon/reactivity'],
     },
+    {
+      name: 'nativeCompat',
+      kind: 'function',
+      signature: '<T>(fn: T) => T',
+      summary:
+        'Mark a Pyreon framework component as "self-managing" so compat layers (`@pyreon/{react,preact,vue,solid}-compat`) skip their wrapping and route the component through Pyreon\'s mount path. Use on every `@pyreon/*` JSX component whose setup body uses `provide()` / lifecycle hooks / signal subscriptions — wrapping breaks those by running the body inside the compat layer\'s render context instead of Pyreon\'s. Idempotent; non-function inputs pass through unchanged. The marker is a registry symbol (`Symbol.for("pyreon:native-compat")`), so framework and compat sides share it without an import dependency between them.',
+      example: `// In a framework package:
+export const RouterView = nativeCompat(function RouterView(props) {
+  provide(RouterContext, ...)
+  return <div>{children}</div>
+})`,
+      seeAlso: ['isNativeCompat', 'NATIVE_COMPAT_MARKER'],
+      mistakes: [
+        'Forgetting to mark a new framework JSX export — under compat mode, the component\'s `provide()` / `onMount()` calls fail with "called outside component setup" warnings and the rendered DOM silently breaks.',
+        'Marking user-app components — only `@pyreon/*` framework components that already manage their own reactivity should be marked. User components in compat mode are SUPPOSED to be wrapped (that\'s how they get re-render-on-state-change semantics).',
+      ],
+    },
+    {
+      name: 'isNativeCompat',
+      kind: 'function',
+      signature: '(fn: unknown) => boolean',
+      summary:
+        'Compat-layer-side: read whether a function has been marked as a Pyreon native framework component via `nativeCompat()`. Compat `jsx()` calls this to decide whether to skip the React/Vue/Solid/Preact-style wrapping. Always returns `false` for non-function inputs.',
+      example: `// In a compat layer's jsx-runtime:
+if (isNativeCompat(type)) return h(type, props)
+return wrapCompatComponent(type)(props)`,
+      seeAlso: ['nativeCompat', 'NATIVE_COMPAT_MARKER'],
+    },
+    {
+      name: 'NATIVE_COMPAT_MARKER',
+      kind: 'constant',
+      signature: 'symbol',
+      summary:
+        'The well-known registry symbol (`Symbol.for("pyreon:native-compat")`) used to mark a component as a Pyreon native framework component. Most callers should use `nativeCompat()` / `isNativeCompat()` instead of touching the symbol directly; exported for advanced cases (e.g., a compat layer that wants to inspect the property without going through the helper).',
+      example: `import { NATIVE_COMPAT_MARKER } from '@pyreon/core'
+
+// Equivalent to nativeCompat(MyComponent):
+;(MyComponent as Record<symbol, boolean>)[NATIVE_COMPAT_MARKER] = true`,
+      seeAlso: ['nativeCompat', 'isNativeCompat'],
+    },
     {
       name: 'ExtractProps',
       kind: 'type',

package/src/props.ts

@@ -151,25 +151,38 @@ export function _rp<T>(fn: () => T): () => T {
 export function makeReactiveProps(
   raw: Record<string, unknown>,
 ): Record<string, unknown> {
-  const result: Record<string, unknown> = {}
-  let hasGetters = false
+  // Fast path: scan for any REACTIVE_PROP-branded function first.
+  // If none found, return raw immediately — no object allocation, no property copying.
+  // This saves ~90 object allocations + ~450 property copies per page load
+  // for components with all-static props (buttons, icons, layout, etc.).
+  const keys = Object.keys(raw)
+  let hasAny = false
+  for (let i = 0; i < keys.length; i++) {
+    const val = raw[keys[i]!]
+    if (typeof val === 'function' && (val as any)[REACTIVE_PROP]) {
+      hasAny = true
+      break
+    }
+  }
+  if (!hasAny) return raw
 
-  for (const key of Object.keys(raw)) {
+  // At least one reactive prop exists — build the getter-backed object.
+  const result: Record<string, unknown> = {}
+  for (let i = 0; i < keys.length; i++) {
+    const key = keys[i]!
     const val = raw[key]
-
     if (typeof val === 'function' && (val as any)[REACTIVE_PROP]) {
       Object.defineProperty(result, key, {
         get: val as () => unknown,
         enumerable: true,
         configurable: true,
       })
-      hasGetters = true
     } else {
       result[key] = val
     }
   }
 
-  return hasGetters ? result : raw
+  return result
 }
 
 // ─── Unique ID ───────────────────────────────────────────────────────────────

package/src/show.ts

@@ -3,12 +3,25 @@ import type { Props, VNode, VNodeChild, VNodeChildAtom } from './types'
 // ─── Show ─────────────────────────────────────────────────────────────────────
 
 export interface ShowProps extends Props {
-  /** Accessor — children render when truthy, fallback when falsy. */
-  when: () => unknown
+  /**
+   * Truthy condition. Accepts a value or an accessor.
+   *
+   * Use an accessor (`() => signal()`) for reactive conditions.
+   * Bare values are accepted for static cases and as a defensive normalization
+   * for cases where the compiler's signal auto-call has already invoked
+   * a signal at the prop site (e.g. `when={mySignal}` becomes `when={mySignal()}`).
+   */
+  when: unknown | (() => unknown)
   fallback?: VNodeChild
   children?: VNodeChild
 }
 
+// Normalize a value-or-accessor `when` into a single accessor.
+// Same shape used by Match — kept inline (one branch) to stay zero-cost.
+function callWhen(when: unknown): unknown {
+  return typeof when === 'function' ? (when as () => unknown)() : when
+}
+
 /**
  * Conditionally render children based on a reactive condition.
  *
@@ -25,7 +38,7 @@ export interface ShowProps extends Props {
 export function Show(props: ShowProps): VNode | null {
   // Returns a reactive accessor; the renderer unwraps it at mount time.
   return ((): VNodeChildAtom =>
-    (props.when()
+    (callWhen(props.when)
       ? (props.children ?? null)
       : (props.fallback ?? null)) as VNodeChildAtom) as unknown as VNode
 }
@@ -33,8 +46,8 @@ export function Show(props: ShowProps): VNode | null {
 // ─── Switch / Match ───────────────────────────────────────────────────────────
 
 export interface MatchProps extends Props {
-  /** Accessor — this branch renders when truthy. */
-  when: () => unknown
+  /** Truthy condition. Accepts a value or an accessor — see {@link ShowProps.when}. */
+  when: unknown | (() => unknown)
   children?: VNodeChild
 }
 
@@ -97,7 +110,7 @@ export function Switch(props: SwitchProps): VNode | null {
     for (const branch of branches) {
       if (!isMatchVNode(branch)) continue
       const matchProps = branch.props as unknown as MatchProps
-      if (matchProps.when()) return resolveMatchChildren(branch)
+      if (callWhen(matchProps.when)) return resolveMatchChildren(branch)
     }
 
     return (props.fallback ?? null) as VNodeChildAtom

package/src/suspense.ts

@@ -3,8 +3,7 @@ import type { Props, VNode, VNodeChild } from './types'
 
 // Dev-mode gate: see `pyreon/no-process-dev-gate` lint rule for why this
 // uses `import.meta.env.DEV` instead of `typeof process !== 'undefined'`.
-// @ts-ignore — `import.meta.env.DEV` is provided by Vite/Rolldown at build time
-const __DEV__ = import.meta.env?.DEV === true
+const __DEV__ = process.env.NODE_ENV !== 'production'
 
 /** Internal marker attached to lazy()-wrapped components */
 export type LazyComponent<P extends Props = Props> = ((props: P) => VNodeChild) & {

package/src/telemetry.ts

@@ -1,6 +1,10 @@
 /**
  * Error telemetry — hook into Pyreon's error reporting for Sentry, Datadog, etc.
  *
+ * Captures errors from ALL lifecycle phases including reactive effects.
+ * `effect()` errors thrown by `@pyreon/reactivity` are bridged through a
+ * globalThis sink (no upward import — reactivity doesn't depend on core).
+ *
  * @example
  * import { registerErrorHandler } from "@pyreon/core"
  * import * as Sentry from "@sentry/browser"
@@ -13,7 +17,7 @@
  */
 
 export interface ErrorContext {
-  /** Component function name, or "Anonymous" */
+  /** Component function name, "Anonymous", or "Effect" for reactive effects */
   component: string
   /** Lifecycle phase where the error occurred */
   phase: 'setup' | 'render' | 'mount' | 'unmount' | 'effect'
@@ -31,10 +35,17 @@ let _handlers: ErrorHandler[] = []
 
 /**
  * Register a global error handler. Called whenever a component throws in any
- * lifecycle phase. Returns an unregister function.
+ * lifecycle phase, OR an effect throws in `@pyreon/reactivity`. Returns an
+ * unregister function.
+ *
+ * Also installs a `globalThis.__pyreon_report_error__` bridge so the
+ * reactivity package (which can't depend on core) can forward effect errors
+ * into the same telemetry pipeline. Pre-fix the two surfaces were
+ * disconnected — Sentry/Datadog wiring missed effect-thrown errors.
  */
 export function registerErrorHandler(handler: ErrorHandler): () => void {
   _handlers.push(handler)
+  _installReactivityBridge()
   return () => {
     _handlers = _handlers.filter((h) => h !== handler)
   }
@@ -53,3 +64,20 @@ export function reportError(ctx: ErrorContext): void {
     }
   }
 }
+
+// ─── Reactivity bridge ──────────────────────────────────────────────────────
+// Installs `globalThis.__pyreon_report_error__` so `@pyreon/reactivity`
+// effect-error path can forward into reportError. Idempotent — multiple
+// `registerErrorHandler` calls install once.
+
+interface PyreonErrorBridge {
+  __pyreon_report_error__?: (err: unknown, phase: 'effect') => void
+}
+const _bridgeHost = globalThis as PyreonErrorBridge
+
+function _installReactivityBridge(): void {
+  if (_bridgeHost.__pyreon_report_error__) return
+  _bridgeHost.__pyreon_report_error__ = (err, phase) => {
+    reportError({ component: 'Effect', phase, error: err, timestamp: Date.now() })
+  }
+}

package/src/tests/compat-marker.test.ts

@@ -0,0 +1,96 @@
+import { describe, expect, it } from 'vitest'
+import { isNativeCompat, NATIVE_COMPAT_MARKER, nativeCompat } from '../compat-marker'
+
+describe('NATIVE_COMPAT_MARKER', () => {
+  it('is the same registry symbol regardless of how it is referenced', () => {
+    // Symbol.for(...) registry contract — every consumer that uses the same
+    // string key (compat layers reading it, framework packages writing it)
+    // gets the SAME symbol identity. Changing the string is a breaking
+    // change to the marker contract.
+    expect(NATIVE_COMPAT_MARKER).toBe(Symbol.for('pyreon:native-compat'))
+  })
+
+  it('is a `symbol`-typed value', () => {
+    expect(typeof NATIVE_COMPAT_MARKER).toBe('symbol')
+  })
+})
+
+describe('nativeCompat', () => {
+  it('attaches the marker to a function and returns the same reference', () => {
+    function RouterView() {
+      return null
+    }
+    const marked = nativeCompat(RouterView)
+    expect(marked).toBe(RouterView)
+    expect((RouterView as unknown as Record<symbol, boolean>)[NATIVE_COMPAT_MARKER]).toBe(true)
+  })
+
+  it('is idempotent — applying twice yields the same property state', () => {
+    const Component = () => null
+    nativeCompat(Component)
+    nativeCompat(Component)
+    expect((Component as unknown as Record<symbol, boolean>)[NATIVE_COMPAT_MARKER]).toBe(true)
+  })
+
+  it('passes non-function values through unchanged', () => {
+    // Defensive: callers may pipe variables of unknown shape (e.g. lazy
+    // imports that resolve to objects, or null during HMR boundary
+    // teardown). The helper must be safe regardless.
+    expect(nativeCompat(null as unknown)).toBe(null)
+    expect(nativeCompat(undefined as unknown)).toBe(undefined)
+    const obj = { foo: 'bar' }
+    expect(nativeCompat(obj)).toBe(obj)
+    expect((obj as unknown as Record<symbol, boolean>)[NATIVE_COMPAT_MARKER]).toBeUndefined()
+  })
+
+  it('preserves the function signature for typed callers', () => {
+    // The generic `T` flows through unchanged so framework component
+    // exports keep their typed callable shape after wrapping.
+    const Typed = (props: { name: string }): string => `hello ${props.name}`
+    const marked: typeof Typed = nativeCompat(Typed)
+    expect(marked({ name: 'world' })).toBe('hello world')
+  })
+})
+
+describe('isNativeCompat', () => {
+  it('returns true for a marked function', () => {
+    const Comp = nativeCompat(() => null)
+    expect(isNativeCompat(Comp)).toBe(true)
+  })
+
+  it('returns false for an unmarked function', () => {
+    expect(isNativeCompat(() => null)).toBe(false)
+  })
+
+  it('returns false for non-function inputs', () => {
+    expect(isNativeCompat(null)).toBe(false)
+    expect(isNativeCompat(undefined)).toBe(false)
+    expect(isNativeCompat('string')).toBe(false)
+    expect(isNativeCompat(42)).toBe(false)
+    expect(isNativeCompat({ [NATIVE_COMPAT_MARKER]: true })).toBe(false)
+  })
+
+  it('returns false when the marker is set to a non-true value', () => {
+    // Defensive against accidental shape mismatch — only `=== true` qualifies.
+    function Comp() {
+      return null
+    }
+    ;(Comp as unknown as Record<symbol, unknown>)[NATIVE_COMPAT_MARKER] = 1
+    expect(isNativeCompat(Comp)).toBe(false)
+    ;(Comp as unknown as Record<symbol, unknown>)[NATIVE_COMPAT_MARKER] = 'yes'
+    expect(isNativeCompat(Comp)).toBe(false)
+  })
+
+  it('reads the same registry symbol that nativeCompat writes', () => {
+    // Cross-side contract: a function marked here is detectable by
+    // someone who looked up the symbol via `Symbol.for('pyreon:native-compat')`
+    // independently — without importing NATIVE_COMPAT_MARKER from this module.
+    const Comp = nativeCompat(function Comp() {
+      return null
+    })
+    const externallyDiscoveredSymbol = Symbol.for('pyreon:native-compat')
+    expect(
+      (Comp as unknown as Record<symbol, boolean>)[externallyDiscoveredSymbol],
+    ).toBe(true)
+  })
+})

package/src/tests/component.test.ts

@@ -105,12 +105,12 @@ describe('runWithHooks', () => {
     expect(hooks.unmount).toHaveLength(2)
   })
 
-  test('empty hooks when component registers none', () => {
+  test('null hooks when component registers none (lazy allocation)', () => {
     const { hooks } = runWithHooks(() => h('div', null), {})
-    expect(hooks.mount).toHaveLength(0)
-    expect(hooks.unmount).toHaveLength(0)
-    expect(hooks.update).toHaveLength(0)
-    expect(hooks.error).toHaveLength(0)
+    expect(hooks.mount).toBeNull()
+    expect(hooks.unmount).toBeNull()
+    expect(hooks.update).toBeNull()
+    expect(hooks.error).toBeNull()
   })
 })
 

package/src/tests/context.test.ts

@@ -196,9 +196,9 @@ describe('provide', () => {
     // Context should still be available after runWithHooks
     expect(useContext(ctx)).toBe('provided-value')
     // unmount hooks should include the popContext cleanup
-    expect(hooks.unmount.length).toBeGreaterThanOrEqual(1)
+    expect(hooks.unmount!.length).toBeGreaterThanOrEqual(1)
     // Running unmount cleans up
-    for (const fn of hooks.unmount) fn()
+    for (const fn of hooks.unmount!) fn()
     expect(useContext(ctx)).toBe('default')
   })
 
@@ -216,7 +216,7 @@ describe('provide', () => {
     expect(useContext(ctxA)).toBe('A-value')
     expect(useContext(ctxB)).toBe('B-value')
     // Clean up
-    for (const fn of hooks.unmount) fn()
+    for (const fn of hooks.unmount!) fn()
     expect(useContext(ctxA)).toBe('a')
     expect(useContext(ctxB)).toBe('b')
   })

package/src/tests/core.test.ts

@@ -172,14 +172,14 @@ describe('runWithHooks()', () => {
 
     const { vnode, hooks } = runWithHooks(Comp, {})
     expect(vnode).not.toBeNull()
-    expect(hooks.mount).toHaveLength(1)
-    expect(hooks.mount[0]).toBe(mountFn)
-    expect(hooks.unmount).toHaveLength(1)
-    expect(hooks.unmount[0]).toBe(unmountFn)
-    expect(hooks.update).toHaveLength(1)
-    expect(hooks.update[0]).toBe(updateFn)
-    expect(hooks.error).toHaveLength(1)
-    expect(hooks.error[0]).toBe(errorFn)
+    expect(hooks.mount!).toHaveLength(1)
+    expect(hooks.mount![0]).toBe(mountFn)
+    expect(hooks.unmount!).toHaveLength(1)
+    expect(hooks.unmount![0]).toBe(unmountFn)
+    expect(hooks.update!).toHaveLength(1)
+    expect(hooks.update![0]).toBe(updateFn)
+    expect(hooks.error!).toHaveLength(1)
+    expect(hooks.error![0]).toBe(errorFn)
   })
 
   test('returns null vnode when component returns null', () => {
@@ -208,7 +208,7 @@ describe('runWithHooks()', () => {
     }
 
     const { hooks } = runWithHooks(Comp, {})
-    expect(hooks.mount).toHaveLength(3)
+    expect(hooks.mount!).toHaveLength(3)
   })
 
   test('passes props to component function', () => {
@@ -350,7 +350,7 @@ describe('createContext / useContext', () => {
     // Context is available after provide()
     expect(useContext(ctx)).toBe('provided')
     // Running unmount hooks should pop the context
-    for (const fn of hooks.unmount) fn()
+    for (const fn of hooks.unmount!) fn()
     expect(useContext(ctx)).toBe('default')
   })
 })
@@ -663,7 +663,7 @@ describe('ErrorBoundary', () => {
     }, {})
     expect(vnode).not.toBeNull()
     // Should have registered onUnmount for cleanup
-    expect(hooks.unmount.length).toBeGreaterThanOrEqual(1)
+    expect(hooks.unmount!.length).toBeGreaterThanOrEqual(1)
   })
 
   test('renders children when no error', () => {

package/src/tests/dynamic.test.ts

@@ -1,6 +1,6 @@
 import { Dynamic } from '../dynamic'
 import { h } from '../h'
-import type { ComponentFn, VNode } from '../types'
+import type { ComponentFn, VNode, VNodeChild } from '../types'
 
 describe('Dynamic', () => {
   test('renders component function', () => {
@@ -52,4 +52,36 @@ describe('Dynamic', () => {
     expect(result).not.toBeNull()
     expect((result as VNode).type).toBe('br')
   })
+
+  test('does not leak children as a prop on string-tag mount', () => {
+    // Regression: for string `component`, runtime-dom forwards every prop
+    // key to setAttribute. If `children` stayed in props it crashed at
+    // mount with `setAttribute('children', ...)`. The fix re-emits them
+    // as h() rest args, landing them in vnode.children.
+    const result = Dynamic({ component: 'h3', children: 'hello' })
+    expect((result as VNode).type).toBe('h3')
+    expect((result as VNode).props.children).toBeUndefined()
+    expect((result as VNode).children).toEqual(['hello'])
+  })
+
+  test('flattens array children to vnode.children', () => {
+    const a = h('span', null, 'a')
+    const b = h('span', null, 'b')
+    const result = Dynamic({ component: 'div', children: [a, b] })
+    expect((result as VNode).props.children).toBeUndefined()
+    expect((result as VNode).children).toHaveLength(2)
+  })
+
+  test('component children still reach props.children at mount', () => {
+    // For component (not string), the merge happens at mount via
+    // mergeChildrenIntoProps — verified end-to-end by mount tests in
+    // runtime-dom. Here we just confirm the vnode shape is correct so the
+    // merge will fire (children must be on vnode.children, not props).
+    const Comp: ComponentFn = (props) =>
+      h('div', null, (props as { children?: VNodeChild }).children ?? null)
+    const result = Dynamic({ component: Comp, children: 'hi' })
+    expect((result as VNode).type).toBe(Comp)
+    expect((result as VNode).props.children).toBeUndefined()
+    expect((result as VNode).children).toEqual(['hi'])
+  })
 })

package/src/tests/error-boundary.test.ts

@@ -76,7 +76,7 @@ describe('ErrorBoundary', () => {
       })
       return null
     }, {})
-    expect(hooks.unmount.length).toBeGreaterThanOrEqual(1)
+    expect(hooks.unmount!.length).toBeGreaterThanOrEqual(1)
   })
 
   test('warns when fallback is not a function', () => {

package/src/tests/lifecycle.test.ts

@@ -42,8 +42,8 @@ describe('onMount', () => {
     setCurrentHooks(hooks)
     const fn = () => undefined
     onMount(fn)
-    expect(hooks.mount).toHaveLength(1)
-    expect(hooks.mount[0]).toBe(fn)
+    expect(hooks.mount!).toHaveLength(1)
+    expect(hooks.mount![0]).toBe(fn)
   })
 
   test('multiple onMount calls accumulate', () => {
@@ -52,7 +52,7 @@ describe('onMount', () => {
     onMount(() => undefined)
     onMount(() => undefined)
     onMount(() => undefined)
-    expect(hooks.mount).toHaveLength(3)
+    expect(hooks.mount!).toHaveLength(3)
   })
 
   test('warns when called outside component setup', () => {
@@ -73,16 +73,16 @@ describe('onMount', () => {
     setCurrentHooks(hooks)
     const cleanup = () => {}
     onMount(() => cleanup)
-    expect(hooks.mount).toHaveLength(1)
-    expect(hooks.mount[0]!()).toBe(cleanup)
+    expect(hooks.mount!).toHaveLength(1)
+    expect(hooks.mount![0]!()).toBe(cleanup)
   })
 
   test('accepts callback returning void', () => {
     const hooks: LifecycleHooks = { mount: [], unmount: [], update: [], error: [] }
     setCurrentHooks(hooks)
     onMount(() => {})
-    expect(hooks.mount).toHaveLength(1)
-    expect(hooks.mount[0]!()).toBeUndefined()
+    expect(hooks.mount!).toHaveLength(1)
+    expect(hooks.mount![0]!()).toBeUndefined()
   })
 })
 
@@ -96,8 +96,8 @@ describe('onUnmount', () => {
     setCurrentHooks(hooks)
     const fn = () => {}
     onUnmount(fn)
-    expect(hooks.unmount).toHaveLength(1)
-    expect(hooks.unmount[0]).toBe(fn)
+    expect(hooks.unmount!).toHaveLength(1)
+    expect(hooks.unmount![0]).toBe(fn)
   })
 
   test('warns when called outside component setup', () => {
@@ -120,8 +120,8 @@ describe('onUpdate', () => {
     setCurrentHooks(hooks)
     const fn = () => {}
     onUpdate(fn)
-    expect(hooks.update).toHaveLength(1)
-    expect(hooks.update[0]).toBe(fn)
+    expect(hooks.update!).toHaveLength(1)
+    expect(hooks.update![0]).toBe(fn)
   })
 
   test('warns when called outside component setup', () => {
@@ -144,8 +144,8 @@ describe('onErrorCaptured', () => {
     setCurrentHooks(hooks)
     const fn = () => true
     onErrorCaptured(fn)
-    expect(hooks.error).toHaveLength(1)
-    expect(hooks.error[0]).toBe(fn)
+    expect(hooks.error!).toHaveLength(1)
+    expect(hooks.error![0]).toBe(fn)
   })
 
   test('warns when called outside component setup', () => {
@@ -167,7 +167,7 @@ describe('onErrorCaptured', () => {
     })
     // Simulate calling the handler
     const testError = new Error('test')
-    hooks.error[0]!(testError)
+    hooks.error![0]!(testError)
     expect(captured).toBe(testError)
   })
 })
@@ -186,10 +186,10 @@ describe('lifecycle hooks interaction', () => {
     onUpdate(() => {})
     onErrorCaptured(() => true)
 
-    expect(hooks.mount).toHaveLength(1)
-    expect(hooks.unmount).toHaveLength(1)
-    expect(hooks.update).toHaveLength(1)
-    expect(hooks.error).toHaveLength(1)
+    expect(hooks.mount!).toHaveLength(1)
+    expect(hooks.unmount!).toHaveLength(1)
+    expect(hooks.update!).toHaveLength(1)
+    expect(hooks.error!).toHaveLength(1)
   })
 
   test('hooks from different setCurrentHooks calls go to different stores', () => {

package/src/tests/manifest-snapshot.test.ts

@@ -85,8 +85,13 @@ describe('gen-docs — core snapshot', () => {
 
   it('renders @pyreon/core to MCP api-reference entries — one per api[] item', () => {
     const record = renderApiReferenceEntries(coreManifest)
-    expect(Object.keys(record).length).toBe(28)
+    expect(Object.keys(record).length).toBe(31)
     expect(Object.keys(record)).toContain('core/h')
+    // Compat-mode native marker — added so framework JSX components opt out
+    // of `@pyreon/{react,preact,vue,solid}-compat` wrapping.
+    expect(Object.keys(record)).toContain('core/nativeCompat')
+    expect(Object.keys(record)).toContain('core/isNativeCompat')
+    expect(Object.keys(record)).toContain('core/NATIVE_COMPAT_MARKER')
     // Spot-check the flagship API — h() is the hyperscript function
     const h = record['core/h']!
     expect(h.notes).toContain('JSX')