Add Effect v4 support, Fast Refresh tooling, and revamped docs #56

Merged
Thilawyn merged 133 commits from next into master 2026-07-26 02:32:59 +02:00
10 changed files with 23 additions and 23 deletions
Showing only changes of commit 1dc8368750 - Show all commits
+1 -1
View File
@@ -47,7 +47,7 @@ const Index = Component.make("IndexView")(function*() {
return <Todos /> return <Todos />
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
export const Route = createFileRoute("/")({ export const Route = createFileRoute("/")({
+4 -4
View File
@@ -612,12 +612,12 @@ export const withOptions: {
* *
* // Route definition * // Route definition
* export const Route = createFileRoute("/")({ * 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>( <P extends {}, A extends React.ReactNode, E, R, F extends Component.Signature>(
context: React.Context<Context.Context<R>>, context: React.Context<Context.Context<R>>,
): (self: Component<P, A, E, Scope.Scope | NoInfer<R>, F>) => F ): (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>( } = Function.dual(2, <P extends {}, A extends React.ReactNode, E, R, F extends Component.Signature>(
self: Component<P, A, E, R, F>, self: Component<P, A, E, R, F>,
context: React.Context<Context.Context<R>>, context: React.Context<Context.Context<R>>,
) => function WithRuntime(props: P) { ) => function WithContext(props: P) {
return React.createElement( return React.createElement(
Effect.runSyncWith(React.useContext(context))(self.use) as React.FC<P>, Effect.runSyncWith(React.useContext(context))(self.use),
props, props,
) )
}) })
@@ -22,7 +22,7 @@ describe("Component", () => {
const value = yield* Component.useOnMount(onMount) const value = yield* Component.useOnMount(onMount)
return <div>{value}</div> return <div>{value}</div>
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
@@ -58,7 +58,7 @@ describe("Component", () => {
return <div>{result}</div> return <div>{result}</div>
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
@@ -109,7 +109,7 @@ describe("Component", () => {
return <div>{result}</div> return <div>{result}</div>
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
@@ -153,7 +153,7 @@ describe("Component", () => {
return <div>{props.value}</div> return <div>{props.value}</div>
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
@@ -208,7 +208,7 @@ describe("Component", () => {
return <div>{callback(1)}</div> return <div>{callback(1)}</div>
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
@@ -263,7 +263,7 @@ describe("Component", () => {
return <div>{result}</div> return <div>{result}</div>
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
@@ -324,7 +324,7 @@ describe("Component", () => {
return <Child /> return <Child />
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
+4 -4
View File
@@ -34,7 +34,7 @@ describe("Lens", () => {
</> </>
) )
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
@@ -68,7 +68,7 @@ describe("Lens", () => {
return <div>{value.label}</div> return <div>{value.label}</div>
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
@@ -104,7 +104,7 @@ describe("Lens", () => {
return <button onClick={() => setValue(previous => `${previous}!`)}>{value}</button> return <button onClick={() => setValue(previous => `${previous}!`)}>{value}</button>
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
@@ -140,7 +140,7 @@ describe("Lens", () => {
return <div>{value.label}</div> return <div>{value.label}</div>
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
+2 -2
View File
@@ -31,7 +31,7 @@ describe("View", () => {
return <div>{`${currentCount}:${currentLabel}`}</div> return <div>{`${currentCount}:${currentLabel}`}</div>
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
@@ -67,7 +67,7 @@ describe("View", () => {
return <div>{`${currentItem.label}:${currentFlag ? "on" : "off"}`}</div> return <div>{`${currentItem.label}:${currentFlag ? "on" : "off"}`}</div>
}).pipe( }).pipe(
Component.withRuntime(runtime.context) Component.withContext(runtime.context)
) )
const view = render( const view = render(
+1 -1
View File
@@ -56,7 +56,7 @@ const AsyncRouteComponent = Component.make("AsyncRouteView")(function*() {
</Container> </Container>
) )
}).pipe( }).pipe(
Component.withRuntime(runtime.context), Component.withContext(runtime.context),
) )
export const Route = createFileRoute("/async")({ export const Route = createFileRoute("/async")({
+1 -1
View File
@@ -55,7 +55,7 @@ const RegisterRouteComponent = Component.make("RegisterRouteView")(function*() {
</Container> </Container>
) )
}).pipe( }).pipe(
Component.withRuntime(runtime.context), Component.withContext(runtime.context),
) )
export const Route = createFileRoute("/form")({ export const Route = createFileRoute("/form")({
+1 -1
View File
@@ -48,7 +48,7 @@ const TodoRouteComponent = Component.make("TodoRouteView")(function*() {
</Container> </Container>
) )
}).pipe( }).pipe(
Component.withRuntime(runtime.context), Component.withContext(runtime.context),
) )
export const Route = createFileRoute("/")({ export const Route = createFileRoute("/")({
+1 -1
View File
@@ -77,7 +77,7 @@ const QueryRouteComponent = Component.make("QueryRouteView")(function*() {
</Container> </Container>
) )
}).pipe( }).pipe(
Component.withRuntime(runtime.context), Component.withContext(runtime.context),
) )
export const Route = createFileRoute("/query")({ export const Route = createFileRoute("/query")({
+1 -1
View File
@@ -37,7 +37,7 @@ const ResultRouteComponent = Component.make("ResultRouteView")(function*() {
</Container> </Container>
) )
}).pipe( }).pipe(
Component.withRuntime(runtime.context), Component.withContext(runtime.context),
) )
export const Route = createFileRoute("/result")({ export const Route = createFileRoute("/result")({