0.1.4 (#5)

Co-authored-by: Julien Valverdé <julien.valverde@mailo.com>
Reviewed-on: #5

packages/effect-fc/README.md

@@ -16,14 +16,14 @@ Documentation is currently being written. In the meantime, you can take a look a
 ## What writing components looks like
 ```typescript
 import { Component } from "effect-fc"
-import { useOnce, useSubscribe } from "effect-fc/hooks"
+import { useOnce, useSubscribables } from "effect-fc/Hooks"
 import { Todo } from "./Todo"
 import { TodosState } from "./TodosState.service"
 
 
-export class Todos extends Component.makeUntraced(function* Todos() {
+export class Todos extends Component.makeUntraced("Todos")(function*() {
     const state = yield* TodosState
-    const [todos] = yield* useSubscribe(state.ref)
+    const [todos] = yield* useSubscribables(state.ref)
 
     yield* useOnce(() => Effect.andThen(
         Console.log("Todos mounted"),
@@ -49,7 +49,7 @@ export class Todos extends Component.makeUntraced(function* Todos() {
 
 const TodosStateLive = TodosState.Default("todos")
 
-const Index = Component.makeUntraced(function* Index() {
+const Index = Component.makeUntraced("Index")(function*() {
     const context = yield* useContext(TodosStateLive, { finalizerExecutionMode: "fork" })
     const TodosFC = yield* Effect.provide(Todos, context)
 

packages/effect-fc/biome.json

@@ -0,0 +1,8 @@
+{
+    "$schema": "https://biomejs.dev/schemas/latest/schema.json",
+    "root": false,
+    "extends": "//",
+    "files": {
+        "includes": ["./src/**"]
+    }
+}

packages/effect-fc/package.json

@@ -1,7 +1,7 @@
 {
   "name": "effect-fc",
   "description": "Write React function components with Effect",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "type": "module",
   "files": [
     "./README.md",
@@ -17,33 +17,32 @@
       "types": "./dist/index.d.ts",
       "default": "./dist/index.js"
     },
-    "./hooks": {
-      "types": "./dist/hooks/index.d.ts",
-      "default": "./dist/hooks/index.js"
-    },
-    "./types": {
-      "types": "./dist/types/index.d.ts",
-      "default": "./dist/types/index.js"
-    },
-    "./*": {
-      "types": "./dist/*.d.ts",
-      "default": "./dist/*.js"
-    }
+    "./*": [
+      {
+        "types": "./dist/*/index.d.ts",
+        "default": "./dist/*/index.js"
+      },
+      {
+        "types": "./dist/*.d.ts",
+        "default": "./dist/*.js"
+      }
+    ]
   },
   "scripts": {
     "build": "tsc",
     "lint:tsc": "tsc --noEmit",
+    "lint:biome": "biome lint",
     "pack": "npm pack",
-    "clean:cache": "rm -f tsconfig.tsbuildinfo",
+    "clean:cache": "rm -rf .turbo tsconfig.tsbuildinfo",
     "clean:dist": "rm -rf dist",
-    "clean:node": "rm -rf node_modules"
+    "clean:modules": "rm -rf node_modules"
   },
   "peerDependencies": {
     "@types/react": "^19.0.0",
     "effect": "^3.15.0",
     "react": "^19.0.0"
   },
-  "devDependencies": {
-    "@effect/language-service": "^0.35.2"
+  "dependencies": {
+    "@typed/async-data": "^0.13.1"
   }
 }

packages/effect-fc/src/Async.ts

@@ -1,16 +1,17 @@
+/** biome-ignore-all lint/complexity/useArrowFunction: necessary for class prototypes */
 import { Effect, Function, Predicate, Runtime, Scope } from "effect"
 import * as React from "react"
 import type * as Component from "./Component.js"
 
 
-export const TypeId: unique symbol = Symbol.for("effect-fc/Suspense")
+export const TypeId: unique symbol = Symbol.for("effect-fc/Async")
 export type TypeId = typeof TypeId
 
-export interface Suspense extends Suspense.Options {
+export interface Async extends Async.Options {
     readonly [TypeId]: TypeId
 }
 
-export namespace Suspense {
+export namespace Async {
     export interface Options {
         readonly defaultFallback?: React.ReactNode
     }
@@ -23,13 +24,13 @@ const SuspenseProto = Object.freeze({
     [TypeId]: TypeId,
 
     makeFunctionComponent<P extends {}, A extends React.ReactNode, E, R>(
-        this: Component.Component<P, A, E, R> & Suspense,
+        this: Component.Component<P, A, E, R> & Async,
         runtimeRef: React.RefObject<Runtime.Runtime<Exclude<R, Scope.Scope>>>,
         scope: Scope.Scope,
     ) {
         const SuspenseInner = (props: { readonly promise: Promise<React.ReactNode> }) => React.use(props.promise)
 
-        return ({ fallback, name, ...props }: Suspense.Props) => {
+        return ({ fallback, name, ...props }: Async.Props) => {
             const promise = Runtime.runPromise(runtimeRef.current)(
                 Effect.provideService(this.body(props as P), Scope.Scope, scope)
             )
@@ -44,19 +45,19 @@ const SuspenseProto = Object.freeze({
 } as const)
 
 
-export const isSuspense = (u: unknown): u is Suspense => Predicate.hasProperty(u, TypeId)
+export const isAsync = (u: unknown): u is Async => Predicate.hasProperty(u, TypeId)
 
-export const suspense = <T extends Component.Component<any, any, any, any>>(
+export const async = <T extends Component.Component<any, any, any, any>>(
     self: T
 ): (
     & Omit<T, keyof Component.Component.AsComponent<T>>
     & Component.Component<
-        Component.Component.Props<T> & Suspense.Props,
+        Component.Component.Props<T> & Async.Props,
         Component.Component.Success<T>,
         Component.Component.Error<T>,
         Component.Component.Context<T>
     >
-    & Suspense
+    & Async
 ) => Object.setPrototypeOf(
     Object.assign(function() {}, self),
     Object.freeze(Object.setPrototypeOf(
@@ -66,16 +67,16 @@ export const suspense = <T extends Component.Component<any, any, any, any>>(
 )
 
 export const withOptions: {
-    <T extends Component.Component<any, any, any, any> & Suspense>(
-        options: Partial<Suspense.Options>
+    <T extends Component.Component<any, any, any, any> & Async>(
+        options: Partial<Async.Options>
     ): (self: T) => T
-    <T extends Component.Component<any, any, any, any> & Suspense>(
+    <T extends Component.Component<any, any, any, any> & Async>(
         self: T,
-        options: Partial<Suspense.Options>,
+        options: Partial<Async.Options>,
     ): T
-} = Function.dual(2, <T extends Component.Component<any, any, any, any> & Suspense>(
+} = Function.dual(2, <T extends Component.Component<any, any, any, any> & Async>(
     self: T,
-    options: Partial<Suspense.Options>,
+    options: Partial<Async.Options>,
 ): T => Object.setPrototypeOf(
     Object.assign(function() {}, self, options),
     Object.getPrototypeOf(self),

packages/effect-fc/src/Component.ts

@@ -1,7 +1,9 @@
-import { Context, Effect, Effectable, ExecutionStrategy, Function, Predicate, Runtime, Scope, String, Tracer, type Types, type Utils } from "effect"
+/** biome-ignore-all lint/complexity/noBannedTypes: {} is the default type for React props */
+/** biome-ignore-all lint/complexity/useArrowFunction: necessary for class prototypes */
+import { Context, Effect, Effectable, ExecutionStrategy, Function, Predicate, Runtime, Scope, Tracer, type Types, type Utils } from "effect"
 import * as React from "react"
-import { Hooks } from "./hooks/index.js"
-import * as Memo from "./Memo.js"
+import * as Hooks from "./Hooks/index.js"
+import { Memoized } from "./index.js"
 
 
 export const TypeId: unique symbol = Symbol.for("effect-fc/Component")
@@ -12,12 +14,12 @@ extends
     Effect.Effect<(props: P) => A, never, Exclude<R, Scope.Scope>>,
     Component.Options
 {
-    new(_: never): {}
+    new(_: never): Record<string, never>
     readonly [TypeId]: TypeId
-    readonly ["~Props"]: P
-    readonly ["~Success"]: A
-    readonly ["~Error"]: E
-    readonly ["~Context"]: R
+    readonly "~Props": P
+    readonly "~Success": A
+    readonly "~Error": E
+    readonly "~Context": R
 
     /** @internal */
     readonly body: (props: P) => Effect.Effect<A, E, R>
@@ -53,6 +55,7 @@ const ComponentProto = Object.freeze({
         this: Component<P, A, E, R>
     ) {
         const self = this
+        // biome-ignore lint/style/noNonNullAssertion: context initialization
         const runtimeRef = React.useRef<Runtime.Runtime<Exclude<R, Scope.Scope>>>(null!)
         runtimeRef.current = yield* Effect.runtime<Exclude<R, Scope.Scope>>()
 
@@ -67,7 +70,7 @@ const ComponentProto = Object.freeze({
             const FC = React.useMemo(() => {
                 const f: React.FC<P> = self.makeFunctionComponent(runtimeRef, scope)
                 f.displayName = self.displayName ?? "Anonymous"
-                return Memo.isMemo(self)
+                return Memoized.isMemoized(self)
                     ? React.memo(f, self.propsAreEqual)
                     : f
             }, [scope])
@@ -331,13 +334,9 @@ export const make: (
     ) => make.Gen & make.NonGen)
 ) = (spanNameOrBody: Function | string, ...pipeables: any[]): any => {
     if (typeof spanNameOrBody !== "string") {
-        const displayName = displayNameFromBody(spanNameOrBody)
         return Object.setPrototypeOf(
             Object.assign(function() {}, defaultOptions, {
-                body: displayName
-                    ? Effect.fn(displayName)(spanNameOrBody as any, ...pipeables as [])
-                    : Effect.fn(spanNameOrBody as any, ...pipeables),
-                displayName,
+                body: Effect.fn(spanNameOrBody as any, ...pipeables),
             }),
             ComponentProto,
         )
@@ -347,26 +346,34 @@ export const make: (
         return (body: any, ...pipeables: any[]) => Object.setPrototypeOf(
             Object.assign(function() {}, defaultOptions, {
                 body: Effect.fn(spanNameOrBody, spanOptions)(body, ...pipeables as []),
-                displayName: displayNameFromBody(body) ?? spanNameOrBody,
+                displayName: spanNameOrBody,
             }),
             ComponentProto,
         )
     }
 }
 
-export const makeUntraced: make.Gen & make.NonGen = (
-    body: Function,
-    ...pipeables: any[]
-) => Object.setPrototypeOf(
-    Object.assign(function() {}, defaultOptions, {
-        body: Effect.fnUntraced(body as any, ...pipeables as []),
-        displayName: displayNameFromBody(body),
-    }),
-    ComponentProto,
+export const makeUntraced: (
+    & make.Gen
+    & make.NonGen
+    & ((name: string) => make.Gen & make.NonGen)
+) = (spanNameOrBody: Function | string, ...pipeables: any[]): any => (
+    typeof spanNameOrBody !== "string"
+        ? Object.setPrototypeOf(
+            Object.assign(function() {}, defaultOptions, {
+                body: Effect.fnUntraced(spanNameOrBody as any, ...pipeables as []),
+            }),
+            ComponentProto,
+        )
+        : (body: any, ...pipeables: any[]) => Object.setPrototypeOf(
+            Object.assign(function() {}, defaultOptions, {
+                body: Effect.fnUntraced(body, ...pipeables as []),
+                displayName: spanNameOrBody,
+            }),
+            ComponentProto,
+        )
 )
 
-const displayNameFromBody = (body: Function) => !String.isEmpty(body.name) ? body.name : undefined
-
 export const withOptions: {
     <T extends Component<any, any, any, any>>(
         options: Partial<Component.Options>

packages/effect-fc/src/Form.ts

@@ -0,0 +1,411 @@
+import * as AsyncData from "@typed/async-data"
+import { Array, Cause, Chunk, type Duration, Effect, Equal, Exit, Fiber, flow, identity, Option, ParseResult, Pipeable, Predicate, pipe, Ref, Schema, type Scope, Stream, type Subscribable, SubscriptionRef } from "effect"
+import type { NoSuchElementException } from "effect/Cause"
+import * as React from "react"
+import * as Hooks from "./Hooks/index.js"
+import * as PropertyPath from "./PropertyPath.js"
+import * as SubscribableInternal from "./Subscribable.js"
+import * as SubscriptionSubRef from "./SubscriptionSubRef.js"
+
+
+export const FormTypeId: unique symbol = Symbol.for("effect-fc/Form")
+export type FormTypeId = typeof FormTypeId
+
+export interface Form<in out A, in out I = A, out R = never, in out SA = void, in out SE = A, out SR = never>
+extends Pipeable.Pipeable {
+    readonly [FormTypeId]: FormTypeId
+
+    readonly schema: Schema.Schema<A, I, R>
+    readonly submit: (value: NoInfer<A>) => Effect.Effect<SA, SE, SR>
+    readonly debounce: Option.Option<Duration.DurationInput>
+
+    readonly valueRef: SubscriptionRef.SubscriptionRef<Option.Option<A>>
+    readonly encodedValueRef: SubscriptionRef.SubscriptionRef<I>
+    readonly errorRef: SubscriptionRef.SubscriptionRef<Option.Option<ParseResult.ParseError>>
+    readonly validationFiberRef: SubscriptionRef.SubscriptionRef<Option.Option<Fiber.Fiber<void, never>>>
+    readonly submitStateRef: SubscriptionRef.SubscriptionRef<AsyncData.AsyncData<SA, SE>>
+
+    readonly canSubmitSubscribable: Subscribable.Subscribable<boolean>
+}
+
+class FormImpl<in out A, in out I = A, out R = never, in out SA = void, in out SE = A, out SR = never>
+extends Pipeable.Class() implements Form<A, I, R, SA, SE, SR> {
+    readonly [FormTypeId]: FormTypeId = FormTypeId
+
+    constructor(
+        readonly schema: Schema.Schema<A, I, R>,
+        readonly submit: (value: NoInfer<A>) => Effect.Effect<SA, SE, SR>,
+        readonly debounce: Option.Option<Duration.DurationInput>,
+
+        readonly valueRef: SubscriptionRef.SubscriptionRef<Option.Option<A>>,
+        readonly encodedValueRef: SubscriptionRef.SubscriptionRef<I>,
+        readonly errorRef: SubscriptionRef.SubscriptionRef<Option.Option<ParseResult.ParseError>>,
+        readonly validationFiberRef: SubscriptionRef.SubscriptionRef<Option.Option<Fiber.Fiber<void, never>>>,
+        readonly submitStateRef: SubscriptionRef.SubscriptionRef<AsyncData.AsyncData<SA, SE>>,
+
+        readonly canSubmitSubscribable: Subscribable.Subscribable<boolean>,
+    ) {
+        super()
+    }
+}
+
+export const isForm = (u: unknown): u is Form<unknown, unknown, unknown, unknown, unknown, unknown> => Predicate.hasProperty(u, FormTypeId)
+
+export namespace make {
+    export interface Options<in out A, in out I, out R, in out SA = void, in out SE = A, out SR = never> {
+        readonly schema: Schema.Schema<A, I, R>
+        readonly initialEncodedValue: NoInfer<I>
+        readonly submit: (value: NoInfer<A>) => Effect.Effect<SA, SE, SR>,
+        readonly debounce?: Duration.DurationInput,
+    }
+}
+
+export const make: {
+    <A, I = A, R = never, SA = void, SE = A, SR = never>(
+        options: make.Options<A, I, R, SA, SE, SR>
+    ): Effect.Effect<Form<A, I, R, SA, SE, SR>>
+} = Effect.fnUntraced(function* <A, I = A, R = never, SA = void, SE = A, SR = never>(
+    options: make.Options<A, I, R, SA, SE, SR>
+) {
+    const valueRef = yield* SubscriptionRef.make(Option.none<A>())
+    const errorRef = yield* SubscriptionRef.make(Option.none<ParseResult.ParseError>())
+    const validationFiberRef = yield* SubscriptionRef.make(Option.none<Fiber.Fiber<void, never>>())
+    const submitStateRef = yield* SubscriptionRef.make(AsyncData.noData<SA, SE>())
+
+    return new FormImpl(
+        options.schema,
+        options.submit,
+        Option.fromNullable(options.debounce),
+
+        valueRef,
+        yield* SubscriptionRef.make(options.initialEncodedValue),
+        errorRef,
+        validationFiberRef,
+        submitStateRef,
+
+        pipe(
+            <A>([value, error, validationFiber, submitState]: readonly [
+                Option.Option<A>,
+                Option.Option<ParseResult.ParseError>,
+                Option.Option<Fiber.Fiber<void, never>>,
+                AsyncData.AsyncData<SA, SE>,
+            ]) => Option.isSome(value) && Option.isNone(error) && Option.isNone(validationFiber) && !AsyncData.isLoading(submitState),
+
+            filter => SubscribableInternal.make({
+                get: Effect.map(Effect.all([valueRef, errorRef, validationFiberRef, submitStateRef]), filter),
+                get changes() {
+                    return Stream.map(
+                        Stream.zipLatestAll(
+                            valueRef.changes,
+                            errorRef.changes,
+                            validationFiberRef.changes,
+                            submitStateRef.changes,
+                        ),
+                        filter,
+                    )
+                },
+            }),
+        ),
+    )
+})
+
+export const run = <A, I, R, SA, SE, SR>(
+    self: Form<A, I, R, SA, SE, SR>
+): Effect.Effect<void, never, Scope.Scope | R> => Stream.runForEach(
+    self.encodedValueRef.changes.pipe(
+        Option.isSome(self.debounce) ? Stream.debounce(self.debounce.value) : identity
+    ),
+
+    encodedValue => self.validationFiberRef.pipe(
+        Effect.andThen(Option.match({
+            onSome: Fiber.interrupt,
+            onNone: () => Effect.void,
+        })),
+        Effect.andThen(
+            Effect.addFinalizer(() => SubscriptionRef.set(self.validationFiberRef, Option.none())).pipe(
+                Effect.andThen(Schema.decode(self.schema, { errors: "all" })(encodedValue)),
+                Effect.exit,
+                Effect.andThen(flow(
+                    Exit.matchEffect({
+                        onSuccess: v => Effect.andThen(
+                            SubscriptionRef.set(self.valueRef, Option.some(v)),
+                            SubscriptionRef.set(self.errorRef, Option.none()),
+                        ),
+                        onFailure: c => Option.match(
+                            Chunk.findFirst(Cause.failures(c), e => e._tag === "ParseError"),
+                            {
+                                onSome: e => SubscriptionRef.set(self.errorRef, Option.some(e)),
+                                onNone: () => Effect.void,
+                            },
+                        ),
+                    }),
+                    Effect.uninterruptible,
+                )),
+                Effect.scoped,
+                Effect.forkScoped,
+            )
+        ),
+        Effect.andThen(fiber => SubscriptionRef.set(self.validationFiberRef, Option.some(fiber)))
+    ),
+)
+
+export const submit = <A, I, R, SA, SE, SR>(
+    self: Form<A, I, R, SA, SE, SR>
+): Effect.Effect<Option.Option<AsyncData.AsyncData<SA, SE>>, NoSuchElementException, SR> => Effect.whenEffect(
+    self.valueRef.pipe(
+        Effect.andThen(identity),
+        Effect.tap(Ref.set(self.submitStateRef, AsyncData.loading())),
+        Effect.andThen(flow(
+            self.submit,
+            Effect.exit,
+            Effect.map(Exit.match({
+                onSuccess: a => AsyncData.success(a),
+                onFailure: e => AsyncData.failure(e),
+            })),
+            Effect.tap(v => Ref.set(self.submitStateRef, v))
+        )),
+    ),
+
+    self.canSubmitSubscribable.get,
+)
+
+export namespace service {
+    export interface Options<in out A, in out I, out R, in out SA = void, in out SE = A, out SR = never>
+    extends make.Options<A, I, R, SA, SE, SR> {}
+}
+
+export const service = <A, I = A, R = never, SA = void, SE = A, SR = never>(
+    options: service.Options<A, I, R, SA, SE, SR>
+): Effect.Effect<Form<A, I, R, SA, SE, SR>, never, R | Scope.Scope> => Effect.tap(
+    make(options),
+    form => Effect.forkScoped(run(form)),
+)
+
+export const field = <A, I, R, SA, SE, SR, const P extends PropertyPath.Paths<NoInfer<I>>>(
+    self: Form<A, I, R, SA, SE, SR>,
+    path: P,
+): FormField<PropertyPath.ValueFromPath<A, P>, PropertyPath.ValueFromPath<I, P>> => new FormFieldImpl(
+    pipe(
+        Option.match({
+            onSome: (v: A) => Option.map(PropertyPath.get(v, path), Option.some),
+            onNone: () => Option.some(Option.none()),
+        }),
+        filter => SubscribableInternal.make({
+            get: Effect.flatMap(self.valueRef, filter),
+            get changes() { return Stream.flatMap(self.valueRef.changes, filter) },
+        }),
+    ),
+
+    SubscriptionSubRef.makeFromPath(self.encodedValueRef, path),
+
+    pipe(
+        Option.match({
+            onSome: (v: ParseResult.ParseError) => Effect.andThen(
+                ParseResult.ArrayFormatter.formatError(v),
+                Array.filter(issue => PropertyPath.equivalence(issue.path, path)),
+            ),
+            onNone: () => Effect.succeed([]),
+        }),
+        filter => SubscribableInternal.make({
+            get: Effect.flatMap(self.errorRef.get, filter),
+            get changes() { return Stream.flatMap(self.errorRef.changes, filter) },
+        }),
+    ),
+
+    pipe(
+        Option.isSome,
+        filter => SubscribableInternal.make({
+            get: Effect.map(self.validationFiberRef.get, filter),
+            get changes() { return Stream.map(self.validationFiberRef.changes, filter) },
+        }),
+    ),
+
+    pipe(
+        AsyncData.isLoading,
+        filter => SubscribableInternal.make({
+            get: Effect.map(self.submitStateRef, filter),
+            get changes() { return Stream.map(self.submitStateRef.changes, filter) },
+        }),
+    ),
+)
+
+
+export const FormFieldTypeId: unique symbol = Symbol.for("effect-fc/FormField")
+export type FormFieldTypeId = typeof FormFieldTypeId
+
+export interface FormField<in out A, in out I = A>
+extends Pipeable.Pipeable {
+    readonly [FormFieldTypeId]: FormFieldTypeId
+
+    readonly valueSubscribable: Subscribable.Subscribable<Option.Option<A>, NoSuchElementException>
+    readonly encodedValueRef: SubscriptionRef.SubscriptionRef<I>
+    readonly issuesSubscribable: Subscribable.Subscribable<readonly ParseResult.ArrayFormatterIssue[]>
+    readonly isValidatingSubscribable: Subscribable.Subscribable<boolean>
+    readonly isSubmittingSubscribable: Subscribable.Subscribable<boolean>
+}
+
+class FormFieldImpl<in out A, in out I = A>
+extends Pipeable.Class() implements FormField<A, I> {
+    readonly [FormFieldTypeId]: FormFieldTypeId = FormFieldTypeId
+
+    constructor(
+        readonly valueSubscribable: Subscribable.Subscribable<Option.Option<A>, NoSuchElementException>,
+        readonly encodedValueRef: SubscriptionRef.SubscriptionRef<I>,
+        readonly issuesSubscribable: Subscribable.Subscribable<readonly ParseResult.ArrayFormatterIssue[]>,
+        readonly isValidatingSubscribable: Subscribable.Subscribable<boolean>,
+        readonly isSubmittingSubscribable: Subscribable.Subscribable<boolean>,
+    ) {
+        super()
+    }
+}
+
+export const isFormField = (u: unknown): u is FormField<unknown, unknown> => Predicate.hasProperty(u, FormFieldTypeId)
+
+export namespace useForm {
+    export interface Options<in out A, in out I, out R, in out SA = void, in out SE = A, out SR = never>
+    extends make.Options<A, I, R, SA, SE, SR> {}
+}
+
+export const useForm: {
+    <A, I = A, R = never, SA = void, SE = A, SR = never>(
+        options: make.Options<A, I, R, SA, SE, SR>,
+        deps: React.DependencyList,
+    ): Effect.Effect<Form<A, I, R, SA, SE, SR>, never, R>
+} = Effect.fnUntraced(function* <A, I = A, R = never, SA = void, SE = A, SR = never>(
+    options: make.Options<A, I, R, SA, SE, SR>,
+    deps: React.DependencyList,
+) {
+    const form = yield* Hooks.useMemo(() => make(options), [options.debounce, ...deps])
+    yield* Hooks.useFork(() => run(form), [form])
+    return form
+})
+
+export const useSubmit = <A, I, R, SA, SE, SR>(
+    self: Form<A, I, R, SA, SE, SR>
+): Effect.Effect<
+    () => Promise<Option.Option<AsyncData.AsyncData<SA, SE>>>,
+    never,
+    SR
+> => Hooks.useCallbackPromise(() => submit(self), [self])
+
+export const useField = <A, I, R, SA, SE, SR, const P extends PropertyPath.Paths<NoInfer<I>>>(
+    self: Form<A, I, R, SA, SE, SR>,
+    path: P,
+): FormField<
+    PropertyPath.ValueFromPath<A, P>,
+    PropertyPath.ValueFromPath<I, P>
+// biome-ignore lint/correctness/useExhaustiveDependencies: individual path components need to be compared
+> => React.useMemo(() => field(self, path), [self, ...path])
+
+export namespace useInput {
+    export interface Options {
+        readonly debounce?: Duration.DurationInput
+    }
+
+    export interface Result<T> {
+        readonly value: T
+        readonly setValue: React.Dispatch<React.SetStateAction<T>>
+    }
+}
+
+export const useInput: {
+    <A, I>(
+        field: FormField<A, I>,
+        options?: useInput.Options,
+    ): Effect.Effect<useInput.Result<I>, NoSuchElementException>
+} = Effect.fnUntraced(function* <A, I>(
+    field: FormField<A, I>,
+    options?: useInput.Options,
+) {
+    const internalValueRef = yield* Hooks.useMemo(() => Effect.andThen(field.encodedValueRef, SubscriptionRef.make), [field])
+    const [value, setValue] = yield* Hooks.useRefState(internalValueRef)
+
+    yield* Hooks.useFork(() => Effect.all([
+        Stream.runForEach(
+            Stream.drop(field.encodedValueRef, 1),
+            upstreamEncodedValue => Effect.whenEffect(
+                Ref.set(internalValueRef, upstreamEncodedValue),
+                Effect.andThen(internalValueRef, internalValue => !Equal.equals(upstreamEncodedValue, internalValue)),
+            ),
+        ),
+
+        Stream.runForEach(
+            internalValueRef.changes.pipe(
+                Stream.drop(1),
+                Stream.changesWith(Equal.equivalence()),
+                options?.debounce ? Stream.debounce(options.debounce) : identity,
+            ),
+            internalValue => Ref.set(field.encodedValueRef, internalValue),
+        ),
+    ], { concurrency: "unbounded" }), [field, internalValueRef, options?.debounce])
+
+    return { value, setValue }
+})
+
+export namespace useOptionalInput {
+    export interface Options<T> extends useInput.Options {
+        readonly defaultValue: T
+    }
+
+    export interface Result<T> extends useInput.Result<T> {
+        readonly enabled: boolean
+        readonly setEnabled: React.Dispatch<React.SetStateAction<boolean>>
+    }
+}
+
+export const useOptionalInput: {
+    <A, I>(
+        field: FormField<A, Option.Option<I>>,
+        options: useOptionalInput.Options<I>,
+    ): Effect.Effect<useOptionalInput.Result<I>, NoSuchElementException>
+} = Effect.fnUntraced(function* <A, I>(
+    field: FormField<A, Option.Option<I>>,
+    options: useOptionalInput.Options<I>,
+) {
+    const [enabledRef, internalValueRef] = yield* Hooks.useMemo(() => Effect.andThen(
+        field.encodedValueRef,
+        Option.match({
+            onSome: v => Effect.all([SubscriptionRef.make(true), SubscriptionRef.make(v)]),
+            onNone: () => Effect.all([SubscriptionRef.make(false), SubscriptionRef.make(options.defaultValue)]),
+        }),
+    ), [field])
+
+    const [enabled, setEnabled] = yield* Hooks.useRefState(enabledRef)
+    const [value, setValue] = yield* Hooks.useRefState(internalValueRef)
+
+    yield* Hooks.useFork(() => Effect.all([
+        Stream.runForEach(
+            Stream.drop(field.encodedValueRef, 1),
+
+            upstreamEncodedValue => Effect.whenEffect(
+                Option.match(upstreamEncodedValue, {
+                    onSome: v => Effect.andThen(
+                        Ref.set(enabledRef, true),
+                        Ref.set(internalValueRef, v),
+                    ),
+                    onNone: () => Effect.andThen(
+                        Ref.set(enabledRef, false),
+                        Ref.set(internalValueRef, options.defaultValue),
+                    ),
+                }),
+
+                Effect.andThen(
+                    Effect.all([enabledRef, internalValueRef]),
+                    ([enabled, internalValue]) => !Equal.equals(upstreamEncodedValue, enabled ? Option.some(internalValue) : Option.none()),
+                ),
+            ),
+        ),
+
+        Stream.runForEach(
+            enabledRef.changes.pipe(
+                Stream.zipLatest(internalValueRef.changes),
+                Stream.drop(1),
+                Stream.changesWith(Equal.equivalence()),
+                options?.debounce ? Stream.debounce(options.debounce) : identity,
+            ),
+            ([enabled, internalValue]) => Ref.set(field.encodedValueRef, enabled ? Option.some(internalValue) : Option.none()),
+        ),
+    ], { concurrency: "unbounded" }), [field, enabledRef, internalValueRef, options.debounce])
+
+    return { enabled, setEnabled, value, setValue }
+})

packages/effect-fc/src/Hooks/index.ts

@@ -12,5 +12,5 @@ export * from "./useRefFromState.js"
 export * from "./useRefState.js"
 export * from "./useScope.js"
 export * from "./useStreamFromReactiveValues.js"
-export * from "./useSubscribe.js"
+export * from "./useSubscribables.js"
 export * from "./useSubscribeStream.js"

packages/effect-fc/src/Hooks/input/useOptionalInput.ts

@@ -1,11 +1,11 @@
 import { type Duration, Effect, Equal, Equivalence, flow, identity, Option, type ParseResult, Ref, Schema, Stream, SubscriptionRef } from "effect"
 import * as React from "react"
-import { SetStateAction } from "../../../types/index.js"
+import * as SetStateAction from "../../SetStateAction.js"
 import { useCallbackSync } from "../useCallbackSync.js"
 import { useFork } from "../useFork.js"
 import { useOnce } from "../useOnce.js"
 import { useRefState } from "../useRefState.js"
-import { useSubscribe } from "../useSubscribe.js"
+import { useSubscribables } from "../useSubscribables.js"
 
 
 export namespace useOptionalInput {
@@ -101,7 +101,7 @@ export const useOptionalInput: {
         [options.schema, options.ref, internalRef, enabledRef],
     )
 
-    const [enabled] = yield* useSubscribe(enabledRef)
+    const [enabled] = yield* useSubscribables(enabledRef)
     const [value, setValue] = yield* useRefState(internalRef)
     return { value, setValue, enabled, setEnabled, error }
 })

packages/effect-fc/src/Hooks/useCallbackPromise.ts

@@ -11,8 +11,10 @@ export const useCallbackPromise: {
     callback: (...args: Args) => Effect.Effect<A, E, R>,
     deps: React.DependencyList,
 ) {
+    // biome-ignore lint/style/noNonNullAssertion: context initialization
     const runtimeRef = React.useRef<Runtime.Runtime<R>>(null!)
     runtimeRef.current = yield* Effect.runtime<R>()
 
+    // biome-ignore lint/correctness/useExhaustiveDependencies: use of React.DependencyList
     return React.useCallback((...args: Args) => Runtime.runPromise(runtimeRef.current)(callback(...args)), deps)
 })

packages/effect-fc/src/Hooks/useCallbackSync.ts

@@ -11,8 +11,10 @@ export const useCallbackSync: {
     callback: (...args: Args) => Effect.Effect<A, E, R>,
     deps: React.DependencyList,
 ) {
+    // biome-ignore lint/style/noNonNullAssertion: context initialization
     const runtimeRef = React.useRef<Runtime.Runtime<R>>(null!)
     runtimeRef.current = yield* Effect.runtime<R>()
 
+    // biome-ignore lint/correctness/useExhaustiveDependencies: use of React.DependencyList
     return React.useCallback((...args: Args) => Runtime.runSync(runtimeRef.current)(callback(...args)), deps)
 })

packages/effect-fc/src/Hooks/useEffect.ts

@@ -1,7 +1,7 @@
 import { Effect, ExecutionStrategy, Runtime, Scope } from "effect"
 import * as React from "react"
-import type { ScopeOptions } from "./ScopeOptions.js"
 import { closeScope } from "./internal.js"
+import type { ScopeOptions } from "./ScopeOptions.js"
 
 
 export const useEffect: {
@@ -24,5 +24,6 @@ export const useEffect: {
             () => closeScope(scope, runtime, options)
         ),
         Runtime.runSync(runtime),
+    // biome-ignore lint/correctness/useExhaustiveDependencies: use of React.DependencyList
     ), deps)
 })

packages/effect-fc/src/Hooks/useFork.ts

@@ -27,5 +27,6 @@ export const useFork: {
             ...options,
             finalizerExecutionMode: options?.finalizerExecutionMode ?? "fork",
         })
+    // biome-ignore lint/correctness/useExhaustiveDependencies: use of React.DependencyList
     }, deps)
 })

packages/effect-fc/src/Hooks/useLayoutEffect.ts

@@ -1,7 +1,7 @@
 import { Effect, ExecutionStrategy, Runtime, Scope } from "effect"
 import * as React from "react"
-import type { ScopeOptions } from "./ScopeOptions.js"
 import { closeScope } from "./internal.js"
+import type { ScopeOptions } from "./ScopeOptions.js"
 
 
 export const useLayoutEffect: {
@@ -24,5 +24,6 @@ export const useLayoutEffect: {
             () => closeScope(scope, runtime, options)
         ),
         Runtime.runSync(runtime),
+    // biome-ignore lint/correctness/useExhaustiveDependencies: use of React.DependencyList
     ), deps)
 })

packages/effect-fc/src/Hooks/useMemo.ts

@@ -12,5 +12,6 @@ export const useMemo: {
     deps: React.DependencyList,
 ) {
     const runtime = yield* Effect.runtime()
+    // biome-ignore lint/correctness/useExhaustiveDependencies: use of React.DependencyList
     return yield* React.useMemo(() => Runtime.runSync(runtime)(Effect.cached(factory())), deps)
 })

packages/effect-fc/src/Hooks/useRefState.ts

@@ -1,6 +1,6 @@
-import { Effect, Equivalence, Ref, Stream, SubscriptionRef } from "effect"
+import { Effect, Equivalence, Ref, Stream, type SubscriptionRef } from "effect"
 import * as React from "react"
-import { SetStateAction } from "../../types/index.js"
+import * as SetStateAction from "../SetStateAction.js"
 import { useCallbackSync } from "./useCallbackSync.js"
 import { useFork } from "./useFork.js"
 import { useOnce } from "./useOnce.js"

packages/effect-fc/src/Hooks/useScope.ts

@@ -1,7 +1,7 @@
 import { Effect, ExecutionStrategy, Ref, Runtime, Scope } from "effect"
 import * as React from "react"
-import type { ScopeOptions } from "./ScopeOptions.js"
 import { closeScope } from "./internal.js"
+import type { ScopeOptions } from "./ScopeOptions.js"
 
 
 export const useScope: {
@@ -12,6 +12,7 @@ export const useScope: {
 } = Effect.fnUntraced(function*(deps, options) {
     const runtime = yield* Effect.runtime()
 
+    // biome-ignore lint/correctness/useExhaustiveDependencies: no reactivity needed
     const [isInitialRun, initialScope] = React.useMemo(() => Runtime.runSync(runtime)(Effect.all([
         Ref.make(true),
         Scope.make(options?.finalizerExecutionStrategy ?? ExecutionStrategy.sequential),
@@ -30,6 +31,7 @@ export const useScope: {
                 Effect.map(scope => () => closeScope(scope, runtime, options)),
             ),
         })
+    // biome-ignore lint/correctness/useExhaustiveDependencies: use of React.DependencyList
     ), deps)
 
     return scope

packages/effect-fc/src/Hooks/useSubscribables.ts

@@ -4,7 +4,7 @@ import { useFork } from "./useFork.js"
 import { useOnce } from "./useOnce.js"
 
 
-export const useSubscribe: {
+export const useSubscribables: {
     <const T extends readonly Subscribable.Subscribable<any, any, any>[]>(
         ...elements: T
     ): Effect.Effect<

packages/effect-fc/src/Hooks/useSubscribeStream.ts

@@ -16,6 +16,7 @@ export const useSubscribeStream: {
     initialValue?: A,
 ) {
     const [reactStateValue, setReactStateValue] = React.useState(
+        // biome-ignore lint/correctness/useExhaustiveDependencies: no reactivity needed
         React.useMemo(() => initialValue
             ? Option.some(initialValue)
             : Option.none(),

packages/effect-fc/src/Memo.ts

@@ -1,50 +0,0 @@
-import { type Equivalence, Function, Predicate } from "effect"
-import type * as Component from "./Component.js"
-
-
-export const TypeId: unique symbol = Symbol.for("effect-fc/Memo")
-export type TypeId = typeof TypeId
-
-export interface Memo<P> extends Memo.Options<P> {
-    readonly [TypeId]: TypeId
-}
-
-export namespace Memo {
-    export interface Options<P> {
-        readonly propsAreEqual?: Equivalence.Equivalence<P>
-    }
-}
-
-
-const MemoProto = Object.freeze({
-    [TypeId]: TypeId
-} as const)
-
-
-export const isMemo = (u: unknown): u is Memo<unknown> => Predicate.hasProperty(u, TypeId)
-
-export const memo = <T extends Component.Component<any, any, any, any>>(
-    self: T
-): T & Memo<Component.Component.Props<T>> => Object.setPrototypeOf(
-    Object.assign(function() {}, self),
-    Object.freeze(Object.setPrototypeOf(
-        Object.assign({}, MemoProto),
-        Object.getPrototypeOf(self),
-    )),
-)
-
-export const withOptions: {
-    <T extends Component.Component<any, any, any, any> & Memo<any>>(
-        options: Partial<Memo.Options<Component.Component.Props<T>>>
-    ): (self: T) => T
-    <T extends Component.Component<any, any, any, any> & Memo<any>>(
-        self: T,
-        options: Partial<Memo.Options<Component.Component.Props<T>>>,
-    ): T
-} = Function.dual(2, <T extends Component.Component<any, any, any, any> & Memo<any>>(
-    self: T,
-    options: Partial<Memo.Options<Component.Component.Props<T>>>,
-): T => Object.setPrototypeOf(
-    Object.assign(function() {}, self, options),
-    Object.getPrototypeOf(self),
-))

packages/effect-fc/src/Memoized.ts

@@ -0,0 +1,51 @@
+/** biome-ignore-all lint/complexity/useArrowFunction: necessary for class prototypes */
+import { type Equivalence, Function, Predicate } from "effect"
+import type * as Component from "./Component.js"
+
+
+export const TypeId: unique symbol = Symbol.for("effect-fc/Memoized")
+export type TypeId = typeof TypeId
+
+export interface Memoized<P> extends Memoized.Options<P> {
+    readonly [TypeId]: TypeId
+}
+
+export namespace Memoized {
+    export interface Options<P> {
+        readonly propsAreEqual?: Equivalence.Equivalence<P>
+    }
+}
+
+
+const MemoizedProto = Object.freeze({
+    [TypeId]: TypeId
+} as const)
+
+
+export const isMemoized = (u: unknown): u is Memoized<unknown> => Predicate.hasProperty(u, TypeId)
+
+export const memoized = <T extends Component.Component<any, any, any, any>>(
+    self: T
+): T & Memoized<Component.Component.Props<T>> => Object.setPrototypeOf(
+    Object.assign(function() {}, self),
+    Object.freeze(Object.setPrototypeOf(
+        Object.assign({}, MemoizedProto),
+        Object.getPrototypeOf(self),
+    )),
+)
+
+export const withOptions: {
+    <T extends Component.Component<any, any, any, any> & Memoized<any>>(
+        options: Partial<Memoized.Options<Component.Component.Props<T>>>
+    ): (self: T) => T
+    <T extends Component.Component<any, any, any, any> & Memoized<any>>(
+        self: T,
+        options: Partial<Memoized.Options<Component.Component.Props<T>>>,
+    ): T
+} = Function.dual(2, <T extends Component.Component<any, any, any, any> & Memoized<any>>(
+    self: T,
+    options: Partial<Memoized.Options<Component.Component.Props<T>>>,
+): T => Object.setPrototypeOf(
+    Object.assign(function() {}, self, options),
+    Object.getPrototypeOf(self),
+))

packages/effect-fc/src/PropertyPath.ts

@@ -1,34 +1,34 @@
-import { Array, Function, Option, Predicate } from "effect"
+import { Array, Equivalence, Function, Option, Predicate } from "effect"
 
 
+export type PropertyPath = readonly PropertyKey[]
+
 type Prev = readonly [never, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
 
-export type Paths<T, D extends number = 5, Seen = never> = [] | (
-    D extends never ? [] :
-    T extends Seen ? [] :
-    T extends readonly any[] ? ArrayPaths<T, D, Seen | T> :
-    T extends object ? ObjectPaths<T, D, Seen | T> :
+export type Paths<T, D extends number = 5, Seen = never> = readonly [] | (
+    D extends never ? readonly [] :
+    T extends Seen ? readonly [] :
+    T extends readonly any[] ? {
+        [K in keyof T as K extends number ? K : never]:
+            | readonly [K]
+            | readonly [K, ...Paths<T[K], Prev[D], Seen | T>]
+    } extends infer O
+        ? O[keyof O]
+        : never
+    :
+    T extends object ? {
+        [K in keyof T as K extends string | number | symbol ? K : never]-?:
+            NonNullable<T[K]> extends infer V
+                ? readonly [K] | readonly [K, ...Paths<V, Prev[D], Seen>]
+                : never
+    } extends infer O
+        ? O[keyof O]
+        : never
+    :
     never
 )
 
-export type ArrayPaths<T extends readonly any[], D extends number, Seen> = {
-    [K in keyof T as K extends number ? K : never]:
-        | [K]
-        | [K, ...Paths<T[K], Prev[D], Seen>]
-} extends infer O
-    ? O[keyof O]
-    : never
-
-export type ObjectPaths<T extends object, D extends number, Seen> = {
-    [K in keyof T as K extends string | number | symbol ? K : never]-?:
-        NonNullable<T[K]> extends infer V
-            ? [K] | [K, ...Paths<V, Prev[D], Seen>]
-            : never
-} extends infer O
-    ? O[keyof O]
-    : never
-
-export type ValueFromPath<T, P extends any[]> = P extends [infer Head, ...infer Tail]
+export type ValueFromPath<T, P extends readonly any[]> = P extends readonly [infer Head, ...infer Tail]
     ? Head extends keyof T
         ? ValueFromPath<T[Head], Tail>
         : T extends readonly any[]
@@ -38,8 +38,8 @@ export type ValueFromPath<T, P extends any[]> = P extends [infer Head, ...infer
             : never
     : T
 
-export type AnyPath = readonly PropertyKey[]
 
+export const equivalence: Equivalence.Equivalence<PropertyPath> = Equivalence.array(Equivalence.strict())
 
 export const unsafeGet: {
     <T, const P extends Paths<T>>(path: P): (self: T) => ValueFromPath<T, P>
@@ -64,16 +64,16 @@ export const get: {
 )
 
 export const immutableSet: {
-    <T, const P extends Paths<T>>(path: P, value: ValueFromPath<T, P>): (self: T) => ValueFromPath<T, P>
+    <T, const P extends Paths<T>>(path: P, value: ValueFromPath<T, P>): (self: T) => Option.Option<T>
     <T, const P extends Paths<T>>(self: T, path: P, value: ValueFromPath<T, P>): Option.Option<T>
 } = Function.dual(3, <T, const P extends Paths<T>>(self: T, path: P, value: ValueFromPath<T, P>): Option.Option<T> => {
-    const key = Array.head(path as AnyPath)
+    const key = Array.head(path as PropertyPath)
     if (Option.isNone(key))
         return Option.some(value as T)
     if (!Predicate.hasProperty(self, key.value))
         return Option.none()
 
-    const child = immutableSet<any, any>(self[key.value], Option.getOrThrow(Array.tail(path as AnyPath)), value)
+    const child = immutableSet<any, any>(self[key.value], Option.getOrThrow(Array.tail(path as PropertyPath)), value)
     if (Option.isNone(child))
         return child
 

packages/effect-fc/src/ReactRuntime.ts

@@ -1,3 +1,4 @@
+/** biome-ignore-all lint/complexity/useArrowFunction: necessary for class prototypes */
 import { Effect, type Layer, ManagedRuntime, Predicate, type Runtime } from "effect"
 import * as React from "react"
 
@@ -6,7 +7,7 @@ export const TypeId: unique symbol = Symbol.for("effect-fc/ReactRuntime")
 export type TypeId = typeof TypeId
 
 export interface ReactRuntime<R, ER> {
-    new(_: never): {}
+    new(_: never): Record<string, never>
     readonly [TypeId]: TypeId
     readonly runtime: ManagedRuntime.ManagedRuntime<R, ER>
     readonly context: React.Context<Runtime.Runtime<R>>
@@ -23,6 +24,7 @@ export const make = <R, ER>(
 ): ReactRuntime<R, ER> => Object.setPrototypeOf(
     Object.assign(function() {}, {
         runtime: ManagedRuntime.make(layer, memoMap),
+        // biome-ignore lint/style/noNonNullAssertion: context initialization
         context: React.createContext<Runtime.Runtime<R>>(null!),
     }),
     ReactRuntimeProto,
@@ -48,16 +50,14 @@ export const Provider = <R, ER>(
     )
 }
 
-namespace ProviderInner {
-    export interface Props<R, ER> {
-        readonly runtime: ReactRuntime<R, ER>
-        readonly promise: Promise<Runtime.Runtime<R>>
-        readonly children?: React.ReactNode
-    }
+interface ProviderInnerProps<R, ER> {
+    readonly runtime: ReactRuntime<R, ER>
+    readonly promise: Promise<Runtime.Runtime<R>>
+    readonly children?: React.ReactNode
 }
 
 const ProviderInner = <R, ER>(
-    { runtime, promise, children }: ProviderInner.Props<R, ER>
+    { runtime, promise, children }: ProviderInnerProps<R, ER>
 ): React.ReactNode => React.createElement(
     runtime.context,
     { value: React.use(promise) },

packages/effect-fc/src/SubscriptionSubRef.ts

@@ -2,7 +2,7 @@ import { Chunk, Effect, Effectable, Option, Predicate, Readable, Ref, Stream, Su
 import * as PropertyPath from "./PropertyPath.js"
 
 
-export const SubscriptionSubRefTypeId: unique symbol = Symbol.for("effect-fc/types/SubscriptionSubRef")
+export const SubscriptionSubRefTypeId: unique symbol = Symbol.for("effect-fc/SubscriptionSubRef")
 export type SubscriptionSubRefTypeId = typeof SubscriptionSubRefTypeId
 
 export interface SubscriptionSubRef<in out A, in out B extends SubscriptionRef.SubscriptionRef<any>>
@@ -78,7 +78,7 @@ extends Effectable.Class<A> implements SubscriptionSubRef<A, B> {
         return Effect.Do.pipe(
             Effect.bind("b", (): Effect.Effect<Effect.Effect.Success<B>> => this.parent),
             Effect.bind("ca", ({ b }) => f(this.getter(b))),
-            Effect.tap(({ b, ca: [, a] }) => Ref.set(this.parent, this.setter(b, a))),
+            Effect.tap(({ b, ca: [, a] }) => SubscriptionRef.set(this.parent, this.setter(b, a))),
             Effect.map(({ ca: [c] }) => c),
         )
     }

packages/effect-fc/src/hooks/index.ts

@@ -1,2 +0,0 @@
-export * from "./Hooks/index.js"
-export * as Hooks from "./Hooks/index.js"

packages/effect-fc/src/index.ts

@@ -1,4 +1,10 @@
+export * as Async from "./Async.js"
 export * as Component from "./Component.js"
-export * as Memo from "./Memo.js"
+export * as Form from "./Form.js"
+export * as Hooks from "./Hooks/index.js"
+export * as Memoized from "./Memoized.js"
+export * as PropertyPath from "./PropertyPath.js"
 export * as ReactRuntime from "./ReactRuntime.js"
-export * as Suspense from "./Suspense.js"
+export * as SetStateAction from "./SetStateAction.js"
+export * as Subscribable from "./Subscribable.js"
+export * as SubscriptionSubRef from "./SubscriptionSubRef.js"

packages/effect-fc/src/types/index.ts

@@ -1,4 +0,0 @@
-export * as PropertyPath from "./PropertyPath.js"
-export * as SetStateAction from "./SetStateAction.js"
-export * as Subscribable from "./Subscribable.js"
-export * as SubscriptionSubRef from "./SubscriptionSubRef.js"

packages/effect-fc/tsconfig.json

@@ -26,7 +26,12 @@
 
     // Build
     "outDir": "./dist",
-    "declaration": true
+    "declaration": true,
+    "sourceMap": true,
+
+    "plugins": [
+      { "name": "@effect/language-service" }
+    ]
   },
 
   "include": ["./src"]