Input work

packages/example/src/routes/dev/input.tsx

@@ -1,27 +1,32 @@
 import { TextFieldInput } from "@/lib/TextFieldInput"
 import { runtime } from "@/runtime"
-import { Container } from "@radix-ui/themes"
+import { Container, TextField } from "@radix-ui/themes"
 import { createFileRoute } from "@tanstack/react-router"
 import { Console, Schema, Stream, SubscriptionRef } from "effect"
 import { Component, Memo } from "effect-fc"
-import { useOnce } from "effect-fc/hooks"
-import { useFork } from "effect-fc/hooks/Hooks/useFork"
+import { useFork, useInput, useOnce, useRefState } from "effect-fc/hooks"
 
 
-const IntTextFieldInput = TextFieldInput({ schema: Schema.NumberFromString.pipe(Schema.int()) })
+const IntFromString = Schema.NumberFromString.pipe(Schema.int())
+
+const IntTextFieldInput = TextFieldInput({ schema: IntFromString })
 const StringTextFieldInput = TextFieldInput({ schema: Schema.String })
 
 const Input = Component.makeUntraced(function* Input() {
     const IntTextFieldInputFC = yield* IntTextFieldInput
     const StringTextFieldInputFC = yield* StringTextFieldInput
 
-    const intRef = yield* useOnce(() => SubscriptionRef.make(0))
+    const intRef1 = yield* useOnce(() => SubscriptionRef.make(0))
+    const intRef2 = yield* useOnce(() => SubscriptionRef.make(0))
     const stringRef = yield* useOnce(() => SubscriptionRef.make(""))
-    yield* useFork(() => Stream.runForEach(intRef.changes, Console.log), [intRef])
+    // yield* useFork(() => Stream.runForEach(intRef1.changes, Console.log), [intRef1])
+
+    const input2 = yield* useInput({ schema: IntFromString, ref: intRef2 })
 
     return (
         <Container>
-            <IntTextFieldInputFC ref={intRef} />
+            <IntTextFieldInputFC ref={intRef1} />
+            <TextField.Root value={input2.value} onChange={input2.onChange} />
             <StringTextFieldInputFC ref={stringRef} />
         </Container>
     )