change props children in input
This commit is contained in:
parent
f082308d5d
commit
b46be19a22
|
|
@ -5,11 +5,11 @@ import { useField as useFormikField, useFormikContext, FieldHookConfig } from "f
|
||||||
//const useFormikField = null;
|
//const useFormikField = null;
|
||||||
//const useFormikContext = ()=>{};
|
//const useFormikContext = ()=>{};
|
||||||
|
|
||||||
export function useField(props){
|
export function useField(props) {
|
||||||
let getField = useFormikField;
|
let getField = useFormikField;
|
||||||
const context = useFormikContext();
|
const context = useFormikContext();
|
||||||
if(!context){
|
if (!context) {
|
||||||
getField = (propsOrFieldName: FieldHookConfig<any>)=>{
|
getField = (propsOrFieldName: FieldHookConfig<any>) => {
|
||||||
return [props, null, null];
|
return [props, null, null];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -25,8 +25,9 @@ export default function Input(
|
||||||
}
|
}
|
||||||
) {
|
) {
|
||||||
/*name, id*/
|
/*name, id*/
|
||||||
|
let { children, ...otherProps } = props;
|
||||||
|
|
||||||
const [field, meta, helpers] = useField(props);
|
const [field, meta, helpers] = useField(otherProps);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div css={[props.title && tw`my-1`, tw`relative`]} className={props.className}>
|
<div css={[props.title && tw`my-1`, tw`relative`]} className={props.className}>
|
||||||
|
|
@ -43,7 +44,7 @@ export default function Input(
|
||||||
{/*name={name || title} id={id || name || title}*/}
|
{/*name={name || title} id={id || name || title}*/}
|
||||||
<input
|
<input
|
||||||
id={props.id ?? props.name ?? props.title}
|
id={props.id ?? props.name ?? props.title}
|
||||||
{...props}
|
{...otherProps}
|
||||||
{...field}
|
{...field}
|
||||||
tw="bg-primary appearance-none border-2 border-secondary rounded w-full py-2 px-4 text-primary leading-tight focus:outline-none focus:bg-secondary focus:border-accent transition duration-150 "
|
tw="bg-primary appearance-none border-2 border-secondary rounded w-full py-2 px-4 text-primary leading-tight focus:outline-none focus:bg-secondary focus:border-accent transition duration-150 "
|
||||||
/>
|
/>
|
||||||
|
|
@ -69,7 +70,7 @@ export function TextArea({
|
||||||
<label
|
<label
|
||||||
{...label}
|
{...label}
|
||||||
css={[tw`block text-secondary text-sm font-bold mb-2`, label?.css]}
|
css={[tw`block text-secondary text-sm font-bold mb-2`, label?.css]}
|
||||||
|
|
||||||
>
|
>
|
||||||
{title}
|
{title}
|
||||||
</label>
|
</label>
|
||||||
|
|
@ -100,12 +101,12 @@ export function TextArea({
|
||||||
export function CheckBox({
|
export function CheckBox({
|
||||||
label,
|
label,
|
||||||
title,
|
title,
|
||||||
|
|
||||||
children,
|
children,
|
||||||
...props
|
...props
|
||||||
}) {
|
}) {
|
||||||
|
|
||||||
const [field, meta, helpers] = useField(props);
|
const [field, meta, helpers] = useField(props);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div tw="my-1 flex text-secondary">
|
<div tw="my-1 flex text-secondary">
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user