packages/effect-fc/src/Component.ts

@@ -1,4 +1,4 @@
-import { Context, Effect, type Equivalence, type ExecutionStrategy, Function, pipe, Pipeable, Predicate, Runtime, Scope, String, Tracer, type Utils } from "effect"
+import { Context, Effect, type Equivalence, ExecutionStrategy, Function, pipe, Pipeable, Predicate, Runtime, Scope, String, Tracer, type Utils } from "effect"
 import * as React from "react"
 import * as Hook from "./Hook.js"
 import type { ExcludeKeys } from "./utils.js"
@@ -26,6 +26,11 @@ const ComponentProto = Object.seal({
     pipe() { return Pipeable.pipeArguments(this, arguments) }
 } as const)
 
+const defaultOptions: Component.Options = {
+    finalizerExecutionMode: "sync",
+    finalizerExecutionStrategy: ExecutionStrategy.sequential,
+}
+
 const nonReactiveTags = [Tracer.ParentSpan] as const
 
 
@@ -190,7 +195,7 @@ export const make: (
                 ? Effect.fn(displayName)(spanNameOrBody as any, ...pipeables as [])
                 : Effect.fn(spanNameOrBody as any, ...pipeables),
             displayName,
-            options: {},
+            options: { ...defaultOptions },
         }, ComponentProto)
     }
     else {
@@ -198,7 +203,7 @@ export const make: (
         return (body: any, ...pipeables: any[]) => Object.setPrototypeOf({
             body: Effect.fn(spanNameOrBody, spanOptions)(body, ...pipeables as []),
             displayName: displayNameFromBody(body) ?? spanNameOrBody,
-            options: {},
+            options: { ...defaultOptions },
         }, ComponentProto)
     }
 }
@@ -206,7 +211,7 @@ export const make: (
 export const makeUntraced: make.Gen = (body: Function, ...pipeables: any[]) => Object.setPrototypeOf({
     body: Effect.fnUntraced(body as any, ...pipeables as []),
     displayName: displayNameFromBody(body),
-    options: {},
+    options: { ...defaultOptions },
 }, ComponentProto)
 
 const displayNameFromBody = (body: Function) => !String.isEmpty(body.name) ? body.name : undefined
@@ -230,15 +235,15 @@ export const withDisplayName: {
 
 export const withOptions: {
     <T extends Component<any, any, any>>(
-        options: Component.Options
+        options: Partial<Component.Options>
     ): (self: T) => T
     <T extends Component<any, any, any>>(
         self: T,
-        options: Component.Options,
+        options: Partial<Component.Options>,
     ): T
 } = Function.dual(2, <T extends Component<any, any, any>>(
     self: T,
-    options: Component.Options,
+    options: Partial<Component.Options>,
 ): T => Object.setPrototypeOf(
     { ...self, options: { ...self.options, ...options } },
     Object.getPrototypeOf(self),

packages/example/src/todo/Todo.tsx

@@ -110,4 +110,6 @@ export const Todo = Component.make(function* Todo(props: TodoProps) {
             }
         </Flex>
     )
-})
+}).pipe(
+    Component.memo
+)