mirror of
https://github.com/johndoe6345789/metabuilder.git
synced 2026-04-24 22:04:56 +00:00
code: fakemui,tsx,textfield (1 files)
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
import React, { forwardRef } from 'react'
|
||||
import React, { forwardRef, useId } from 'react'
|
||||
import { FormLabel } from './FormLabel'
|
||||
import { FormHelperText } from './FormHelperText'
|
||||
import { Input, InputProps } from './Input'
|
||||
@@ -10,13 +10,18 @@ export interface TextFieldProps extends InputProps {
|
||||
}
|
||||
|
||||
export const TextField = forwardRef<HTMLInputElement, TextFieldProps>(
|
||||
({ label, helperText, error, className = '', ...props }, ref) => (
|
||||
<div className={`text-field ${error ? 'text-field--error' : ''} ${className}`}>
|
||||
{label && <FormLabel>{label}</FormLabel>}
|
||||
<Input ref={ref} error={error} {...props} />
|
||||
{helperText && <FormHelperText error={error}>{helperText}</FormHelperText>}
|
||||
</div>
|
||||
)
|
||||
({ label, helperText, error, className = '', id: providedId, ...props }, ref) => {
|
||||
const generatedId = useId()
|
||||
const id = providedId ?? generatedId
|
||||
|
||||
return (
|
||||
<div className={`text-field ${error ? 'text-field--error' : ''} ${className}`}>
|
||||
{label && <FormLabel htmlFor={id}>{label}</FormLabel>}
|
||||
<Input ref={ref} id={id} error={error} {...props} />
|
||||
{helperText && <FormHelperText error={error}>{helperText}</FormHelperText>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
)
|
||||
|
||||
TextField.displayName = 'TextField'
|
||||
|
||||
Reference in New Issue
Block a user