TextInput
import { TextInput } from '@app/forms/TextInput.styled'
Component Props
value
string
placeholder
string
className
string
placeholderClassName
string
placeholderTextColor
string
hasError
boolean
readOnly
boolean
disabled
boolean
Show Props Schema
const TextInputProps = z.object({
value: z
.string()
.optional(),
placeholder: z
.string()
.optional()
.example("Start typing..."),
className: z
.string()
.optional(),
placeholderClassName: z
.string()
.optional(),
placeholderTextColor: z
.string()
.default("hsl(var(--muted))"),
hasError: z
.boolean()
.optional(),
readOnly: z
.boolean()
.optional(),
disabled: z
.boolean()
.optional(),
})
💡 Could be handy to copy-paste into an AI chat?
Show Props Types
{
value?: string | undefined;
placeholder?: string | undefined;
className?: string | undefined;
placeholderClassName?: string | undefined;
placeholderTextColor?: string;
hasError?: boolean;
readOnly?: boolean;
disabled?: boolean;
}
💡 Could be handy to copy-paste into an AI chat?
File Location
You can find the source of the TextInput
component in the following location:
- TextInput.styled.tsx
Other
Disclaimer - Automatic Docgen
🤖
These dynamic component docs were auto-generated with npm run regenerate-docs
. You can hook into automatic docgen by exporting getDocumentationProps
from a component file. You’ll want to provide example props from the ComponentProps zod schema, e.g:
TextInput.styled.tsx
/* --- Docs ---------------------- */
export const getDocumentationProps = TextInputProps.documentationProps('TextInput')