Thilawyn/effect-fc
1
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

0.1.3 #4

Merged
Thilawyn merged 90 commits from next into master 2025-08-23 03:07:28 +02:00
Conversation 0 Commits 90 Files Changed 55 +6 -6
1 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 42a1dd1caf - Show all commits

12
packages/example/src/lib/TextInput.tsx → packages/example/src/lib/TextFieldInput.tsx
View File

@@ -5,20 +5,20 @@ import { useInput } from "effect-fc/hooks"
import * as React from "react" import * as React from "react"
export interface TextInputProps<A, R> extends Omit<useInput.Options<A, R>, "schema"> { export interface TextFieldInputProps<A, R> extends Omit<useInput.Options<A, R>, "schema"> {
readonly textFieldRootProps: Omit<TextField.RootProps, "children"> readonly textFieldRootProps: Omit<TextField.RootProps, "children">
readonly children?: React.ReactNode readonly children?: React.ReactNode
} }
export const TextInput = <A, R>( export const TextFieldInput = <A, R>(
schema: Schema.Schema<A, string, R> schema: Schema.Schema<A, string, R>
): Component.Component< ): Component.Component<
TextInputProps<A, R>, TextFieldInputProps<A, R>,
React.JSX.Element, React.JSX.Element,
ParseResult.ParseError, ParseResult.ParseError,
R R
> => Component.makeUntraced(function* TextInput(props: TextInputProps<A, R>) { > => Component.makeUntraced(function* TextFieldInput(props) {
const input = yield* useInput({ ...props, schema }) const input = yield* useInput({ schema, ...props })
const issues = React.useMemo(() => Option.map( const issues = React.useMemo(() => Option.map(
input.error, input.error,
ParseResult.ArrayFormatter.formatErrorSync, ParseResult.ArrayFormatter.formatErrorSync,
@@ -27,7 +27,7 @@ export const TextInput = <A, R>(
return ( return (
<Flex direction="column" gap="1"> <Flex direction="column" gap="1">
{Option.isSome(issues) && {Option.isSome(issues) &&
<Callout.Root> <Callout.Root color="red" role="alert">
<Callout.Text> <Callout.Text>
<ul> <ul>
{issues.value.map(issue => <li>{issue.message}</li>)} {issues.value.map(issue => <li>{issue.message}</li>)}