diff --git a/packages/effect-fc-next/README.md b/packages/effect-fc-next/README.md
index 5c164f8..2ce8f10 100644
--- a/packages/effect-fc-next/README.md
+++ b/packages/effect-fc-next/README.md
@@ -47,7 +47,7 @@ const Index = Component.make("IndexView")(function*() {
 
     return <Todos />
 }).pipe(
-    Component.withRuntime(runtime.context)
+    Component.withContext(runtime.context)
 )
 
 export const Route = createFileRoute("/")({
diff --git a/packages/effect-fc-next/src/Component.ts b/packages/effect-fc-next/src/Component.ts
index bec0610..d457468 100644
--- a/packages/effect-fc-next/src/Component.ts
+++ b/packages/effect-fc-next/src/Component.ts
@@ -612,12 +612,12 @@ export const withOptions: {
  *
  * // Route definition
  * export const Route = createFileRoute("/")({
- *   component: Component.withRuntime(HomePage, runtime.context)
+ *   component: Component.withContext(HomePage, runtime.context)
  * })
  * ```
  *
  */
-export const withRuntime: {
+export const withContext: {
     <P extends {}, A extends React.ReactNode, E, R, F extends Component.Signature>(
         context: React.Context<Context.Context<R>>,
     ): (self: Component<P, A, E, Scope.Scope | NoInfer<R>, F>) => F
@@ -628,9 +628,9 @@ export const withRuntime: {
 } = Function.dual(2, <P extends {}, A extends React.ReactNode, E, R, F extends Component.Signature>(
     self: Component<P, A, E, R, F>,
     context: React.Context<Context.Context<R>>,
-) => function WithRuntime(props: P) {
+) => function WithContext(props: P) {
     return React.createElement(
-        Effect.runSyncWith(React.useContext(context))(self.use) as React.FC<P>,
+        Effect.runSyncWith(React.useContext(context))(self.use),
         props,
     )
 })
diff --git a/packages/effect-fc-next/test/Component.test.tsx b/packages/effect-fc-next/test/Component.test.tsx
index 9401608..0abd55e 100644
--- a/packages/effect-fc-next/test/Component.test.tsx
+++ b/packages/effect-fc-next/test/Component.test.tsx
@@ -22,7 +22,7 @@ describe("Component", () => {
             const value = yield* Component.useOnMount(onMount)
             return <div>{value}</div>
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
@@ -58,7 +58,7 @@ describe("Component", () => {
 
             return <div>{result}</div>
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
@@ -109,7 +109,7 @@ describe("Component", () => {
 
             return <div>{result}</div>
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
@@ -153,7 +153,7 @@ describe("Component", () => {
 
             return <div>{props.value}</div>
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
@@ -208,7 +208,7 @@ describe("Component", () => {
 
             return <div>{callback(1)}</div>
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
@@ -263,7 +263,7 @@ describe("Component", () => {
 
             return <div>{result}</div>
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
@@ -324,7 +324,7 @@ describe("Component", () => {
 
             return <Child />
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
diff --git a/packages/effect-fc-next/test/Lens.test.tsx b/packages/effect-fc-next/test/Lens.test.tsx
index 3407f14..093b7bf 100644
--- a/packages/effect-fc-next/test/Lens.test.tsx
+++ b/packages/effect-fc-next/test/Lens.test.tsx
@@ -34,7 +34,7 @@ describe("Lens", () => {
                 </>
             )
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
@@ -68,7 +68,7 @@ describe("Lens", () => {
 
             return <div>{value.label}</div>
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
@@ -104,7 +104,7 @@ describe("Lens", () => {
 
             return <button onClick={() => setValue(previous => `${previous}!`)}>{value}</button>
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
@@ -140,7 +140,7 @@ describe("Lens", () => {
 
             return <div>{value.label}</div>
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
diff --git a/packages/effect-fc-next/test/View.test.tsx b/packages/effect-fc-next/test/View.test.tsx
index 3065a8e..301b6de 100644
--- a/packages/effect-fc-next/test/View.test.tsx
+++ b/packages/effect-fc-next/test/View.test.tsx
@@ -31,7 +31,7 @@ describe("View", () => {
 
             return <div>{`${currentCount}:${currentLabel}`}</div>
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
@@ -67,7 +67,7 @@ describe("View", () => {
 
             return <div>{`${currentItem.label}:${currentFlag ? "on" : "off"}`}</div>
         }).pipe(
-            Component.withRuntime(runtime.context)
+            Component.withContext(runtime.context)
         )
 
         const view = render(
diff --git a/packages/example-next/src/routes/async.tsx b/packages/example-next/src/routes/async.tsx
index 4be061b..44c41a9 100644
--- a/packages/example-next/src/routes/async.tsx
+++ b/packages/example-next/src/routes/async.tsx
@@ -56,7 +56,7 @@ const AsyncRouteComponent = Component.make("AsyncRouteView")(function*() {
         </Container>
     )
 }).pipe(
-    Component.withRuntime(runtime.context),
+    Component.withContext(runtime.context),
 )
 
 export const Route = createFileRoute("/async")({
diff --git a/packages/example-next/src/routes/form.tsx b/packages/example-next/src/routes/form.tsx
index 88885a4..9763951 100644
--- a/packages/example-next/src/routes/form.tsx
+++ b/packages/example-next/src/routes/form.tsx
@@ -55,7 +55,7 @@ const RegisterRouteComponent = Component.make("RegisterRouteView")(function*() {
         </Container>
     )
 }).pipe(
-    Component.withRuntime(runtime.context),
+    Component.withContext(runtime.context),
 )
 
 export const Route = createFileRoute("/form")({
diff --git a/packages/example-next/src/routes/index.tsx b/packages/example-next/src/routes/index.tsx
index 0b4d271..7f98e30 100644
--- a/packages/example-next/src/routes/index.tsx
+++ b/packages/example-next/src/routes/index.tsx
@@ -48,7 +48,7 @@ const TodoRouteComponent = Component.make("TodoRouteView")(function*() {
         </Container>
     )
 }).pipe(
-    Component.withRuntime(runtime.context),
+    Component.withContext(runtime.context),
 )
 
 export const Route = createFileRoute("/")({
diff --git a/packages/example-next/src/routes/query.tsx b/packages/example-next/src/routes/query.tsx
index a97a8bf..313bbff 100644
--- a/packages/example-next/src/routes/query.tsx
+++ b/packages/example-next/src/routes/query.tsx
@@ -77,7 +77,7 @@ const QueryRouteComponent = Component.make("QueryRouteView")(function*() {
         </Container>
     )
 }).pipe(
-    Component.withRuntime(runtime.context),
+    Component.withContext(runtime.context),
 )
 
 export const Route = createFileRoute("/query")({
diff --git a/packages/example-next/src/routes/result.tsx b/packages/example-next/src/routes/result.tsx
index bfcdb0c..3ca96cb 100644
--- a/packages/example-next/src/routes/result.tsx
+++ b/packages/example-next/src/routes/result.tsx
@@ -37,7 +37,7 @@ const ResultRouteComponent = Component.make("ResultRouteView")(function*() {
         </Container>
     )
 }).pipe(
-    Component.withRuntime(runtime.context),
+    Component.withContext(runtime.context),
 )
 
 export const Route = createFileRoute("/result")({