diff --git a/packages/effect-fc/src/Component.ts b/packages/effect-fc/src/Component.ts
index 75f3650..bc637f4 100644
--- a/packages/effect-fc/src/Component.ts
+++ b/packages/effect-fc/src/Component.ts
@@ -7,7 +7,7 @@ import * as Memoized from "./Memoized.js"
 export const TypeId: unique symbol = Symbol.for("effect-fc/Component")
 export type TypeId = typeof TypeId
 
-export interface Component<P, A extends React.ReactNode, E, R>
+export interface Component<P extends {}, A extends React.ReactNode, E, R>
 extends
     Effect.Effect<(props: P) => A, never, Exclude<R, Scope.Scope>>,
     Component.Options
@@ -49,7 +49,7 @@ const ComponentProto = Object.freeze({
     ...Effectable.CommitPrototype,
     [TypeId]: TypeId,
 
-    commit: Effect.fnUntraced(function* <P, A extends React.ReactNode, E, R>(
+    commit: Effect.fnUntraced(function* <P extends {}, A extends React.ReactNode, E, R>(
         this: Component<P, A, E, R>
     ) {
         const self = this
@@ -72,11 +72,11 @@ const ComponentProto = Object.freeze({
                     : f
             }, [scope])
 
-            return React.createElement(FC as React.FC<{}>, props as {})
+            return React.createElement(FC, props)
         }, [])
     }),
 
-    makeFunctionComponent<P, A extends React.ReactNode, E, R>(
+    makeFunctionComponent<P extends {}, A extends React.ReactNode, E, R>(
         this: Component<P, A, E, R>,
         runtimeRef: React.RefObject<Runtime.Runtime<Exclude<R, Scope.Scope>>>,
         scope: Scope.Scope,
@@ -95,18 +95,18 @@ const defaultOptions = {
 const nonReactiveTags = [Tracer.ParentSpan] as const
 
 
-export const isComponent = (u: unknown): u is Component<unknown, React.ReactNode, unknown, unknown> => Predicate.hasProperty(u, TypeId)
+export const isComponent = (u: unknown): u is Component<{}, React.ReactNode, unknown, unknown> => Predicate.hasProperty(u, TypeId)
 
 export namespace make {
     export type Gen = {
-        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A extends React.ReactNode, P = never>(
+        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A extends React.ReactNode, P extends {} = {}>(
             body: (props: P) => Generator<Eff, A, never>
         ): Component<
             P, A,
             [Eff] extends [never] ? never : [Eff] extends [Utils.YieldWrap<Effect.Effect<infer _A, infer E, infer _R>>] ? E : never,
             [Eff] extends [never] ? never : [Eff] extends [Utils.YieldWrap<Effect.Effect<infer _A, infer _E, infer R>>] ? R : never
         >
-        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B extends Effect.Effect<React.ReactNode, any, any>, P = never>(
+        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B extends Effect.Effect<React.ReactNode, any, any>, P extends {} = {}>(
             body: (props: P) => Generator<Eff, A, never>,
             a: (
                 _: Effect.Effect<
@@ -117,7 +117,7 @@ export namespace make {
                 props: NoInfer<P>,
             ) => B,
         ): Component<P, Effect.Effect.Success<Effect.Effect.AsEffect<B>>, Effect.Effect.Error<B>, Effect.Effect.Context<B>>
-        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C extends Effect.Effect<React.ReactNode, any, any>, P = never>(
+        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C extends Effect.Effect<React.ReactNode, any, any>, P extends {} = {}>(
             body: (props: P) => Generator<Eff, A, never>,
             a: (
                 _: Effect.Effect<
@@ -129,7 +129,7 @@ export namespace make {
             ) => B,
             b: (_: B, props: NoInfer<P>) => C,
         ): Component<P, Effect.Effect.Success<Effect.Effect.AsEffect<C>>, Effect.Effect.Error<C>, Effect.Effect.Context<C>>
-        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D extends Effect.Effect<React.ReactNode, any, any>, P = never>(
+        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D extends Effect.Effect<React.ReactNode, any, any>, P extends {} = {}>(
             body: (props: P) => Generator<Eff, A, never>,
             a: (
                 _: Effect.Effect<
@@ -142,7 +142,7 @@ export namespace make {
             b: (_: B, props: NoInfer<P>) => C,
             c: (_: C, props: NoInfer<P>) => D,
         ): Component<P, Effect.Effect.Success<Effect.Effect.AsEffect<D>>, Effect.Effect.Error<D>, Effect.Effect.Context<D>>
-        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D, E extends Effect.Effect<React.ReactNode, any, any>, P = never>(
+        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D, E extends Effect.Effect<React.ReactNode, any, any>, P extends {} = {}>(
             body: (props: P) => Generator<Eff, A, never>,
             a: (
                 _: Effect.Effect<
@@ -156,7 +156,7 @@ export namespace make {
             c: (_: C, props: NoInfer<P>) => D,
             d: (_: D, props: NoInfer<P>) => E,
         ): Component<P, Effect.Effect.Success<Effect.Effect.AsEffect<E>>, Effect.Effect.Error<E>, Effect.Effect.Context<E>>
-        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D, E, F extends Effect.Effect<React.ReactNode, any, any>, P = never>(
+        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D, E, F extends Effect.Effect<React.ReactNode, any, any>, P extends {} = {}>(
             body: (props: P) => Generator<Eff, A, never>,
             a: (
                 _: Effect.Effect<
@@ -171,7 +171,7 @@ export namespace make {
             d: (_: D, props: NoInfer<P>) => E,
             e: (_: E, props: NoInfer<P>) => F,
         ): Component<P, Effect.Effect.Success<Effect.Effect.AsEffect<F>>, Effect.Effect.Error<F>, Effect.Effect.Context<F>>
-        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D, E, F, G extends Effect.Effect<React.ReactNode, any, any>, P = never>(
+        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D, E, F, G extends Effect.Effect<React.ReactNode, any, any>, P extends {} = {}>(
             body: (props: P) => Generator<Eff, A, never>,
             a: (
                 _: Effect.Effect<
@@ -187,7 +187,7 @@ export namespace make {
             e: (_: E, props: NoInfer<P>) => F,
             f: (_: F, props: NoInfer<P>) => G,
         ): Component<P, Effect.Effect.Success<Effect.Effect.AsEffect<G>>, Effect.Effect.Error<G>, Effect.Effect.Context<G>>
-        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D, E, F, G, H extends Effect.Effect<React.ReactNode, any, any>, P = never>(
+        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D, E, F, G, H extends Effect.Effect<React.ReactNode, any, any>, P extends {} = {}>(
             body: (props: P) => Generator<Eff, A, never>,
             a: (
                 _: Effect.Effect<
@@ -204,7 +204,7 @@ export namespace make {
             f: (_: F, props: NoInfer<P>) => G,
             g: (_: G, props: NoInfer<P>) => H,
         ): Component<P, Effect.Effect.Success<Effect.Effect.AsEffect<H>>, Effect.Effect.Error<H>, Effect.Effect.Context<H>>
-        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D, E, F, G, H, I extends Effect.Effect<React.ReactNode, any, any>, P = never>(
+        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D, E, F, G, H, I extends Effect.Effect<React.ReactNode, any, any>, P extends {} = {}>(
             body: (props: P) => Generator<Eff, A, never>,
             a: (
                 _: Effect.Effect<
@@ -222,7 +222,7 @@ export namespace make {
             g: (_: G, props: NoInfer<P>) => H,
             h: (_: H, props: NoInfer<P>) => I,
         ): Component<P, Effect.Effect.Success<Effect.Effect.AsEffect<I>>, Effect.Effect.Error<I>, Effect.Effect.Context<I>>
-        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D, E, F, G, H, I, J extends Effect.Effect<React.ReactNode, any, any>, P = never>(
+        <Eff extends Utils.YieldWrap<Effect.Effect<any, any, any>>, A, B, C, D, E, F, G, H, I, J extends Effect.Effect<React.ReactNode, any, any>, P extends {} = {}>(
             body: (props: P) => Generator<Eff, A, never>,
             a: (
                 _: Effect.Effect<
@@ -384,10 +384,10 @@ export const withOptions: {
 ))
 
 export const withRuntime: {
-    <P, A extends React.ReactNode, E, R>(
+    <P extends {}, A extends React.ReactNode, E, R>(
         context: React.Context<Runtime.Runtime<R>>,
     ): (self: Component<P, A, E, Types.NoInfer<R>>) => (props: P) => A
-    <P, A extends React.ReactNode, E, R>(
+    <P extends {}, A extends React.ReactNode, E, R>(
         self: Component<P, A, E, Types.NoInfer<R>>,
         context: React.Context<Runtime.Runtime<R>>,
     ): (props: P) => A
diff --git a/packages/effect-fc/src/Suspense.ts b/packages/effect-fc/src/Suspense.ts
index e89c539..3a906eb 100644
--- a/packages/effect-fc/src/Suspense.ts
+++ b/packages/effect-fc/src/Suspense.ts
@@ -22,7 +22,7 @@ export namespace Suspense {
 const SuspenseProto = Object.freeze({
     [TypeId]: TypeId,
 
-    makeFunctionComponent<P, A extends React.ReactNode, E, R>(
+    makeFunctionComponent<P extends {}, A extends React.ReactNode, E, R>(
         this: Component.Component<P, A, E, R> & Suspense,
         runtimeRef: React.RefObject<Runtime.Runtime<Exclude<R, Scope.Scope>>>,
         scope: Scope.Scope,
diff --git a/packages/example/src/routes/dev/async-rendering.tsx b/packages/example/src/routes/dev/async-rendering.tsx
index fff7f45..64ad8ea 100644
--- a/packages/example/src/routes/dev/async-rendering.tsx
+++ b/packages/example/src/routes/dev/async-rendering.tsx
@@ -3,7 +3,7 @@ import { Flex, Text, TextField } from "@radix-ui/themes"
 import { createFileRoute } from "@tanstack/react-router"
 import { GetRandomValues, makeUuid4 } from "@typed/id"
 import { Effect } from "effect"
-import { Component, Memoized } from "effect-fc"
+import { Component, Memoized, Suspense } from "effect-fc"
 import { Hooks } from "effect-fc/hooks"
 import * as React from "react"
 
@@ -64,8 +64,8 @@ class AsyncComponent extends Component.makeUntraced(function* AsyncComponent() {
         </Flex>
     )
 }).pipe(
-    // Suspense.suspense,
-    // Suspense.withOptions({ defaultFallback: <p>Loading...</p> }),
+    Suspense.suspense,
+    Suspense.withOptions({ defaultFallback: <p>Loading...</p> }),
 ) {}
 class MemoizedAsyncComponent extends Memoized.memo(AsyncComponent) {}