diff --git a/.changeset/friendly-pumas-switch.md b/.changeset/friendly-pumas-switch.md new file mode 100644 index 00000000..c1894b9a --- /dev/null +++ b/.changeset/friendly-pumas-switch.md @@ -0,0 +1,5 @@ +--- +"@frigade/react": patch +--- + +Adds support for props in form fields diff --git a/packages/react/src/components/Form/FormStep.tsx b/packages/react/src/components/Form/FormStep.tsx index 09c1e7e4..a9fbecc1 100644 --- a/packages/react/src/components/Form/FormStep.tsx +++ b/packages/react/src/components/Form/FormStep.tsx @@ -67,7 +67,7 @@ export function FormStep({ () => // @ts-expect-error TODO: Add type to step.fields (step.fields?.filter( - (field: any) => fieldTypes[field.type] != null && field.id + (field: FormFieldData) => fieldTypes[field.type] != null && field.id ) as FormFieldData[]) ?? [], [step.fields, fieldTypes] ) diff --git a/packages/react/src/components/Form/fields/BaseField.tsx b/packages/react/src/components/Form/fields/BaseField.tsx index 073a64e3..94238904 100644 --- a/packages/react/src/components/Form/fields/BaseField.tsx +++ b/packages/react/src/components/Form/fields/BaseField.tsx @@ -17,7 +17,7 @@ interface BaseFieldProps extends FormFieldProps { } export function BaseField({ children, field, fieldData, fieldState }: BaseFieldProps) { - const { id, label, placeholder } = fieldData + const { id, label, placeholder, props } = fieldData const { error } = fieldState const fieldProps = { @@ -27,6 +27,7 @@ export function BaseField({ children, field, fieldData, fieldState }: BaseFieldP ...styles.input, 'aria-invalid': !!error, value: field.value ?? '', + ...props, } return ( diff --git a/packages/react/src/components/Form/index.tsx b/packages/react/src/components/Form/index.tsx index fe503418..e553d4ef 100644 --- a/packages/react/src/components/Form/index.tsx +++ b/packages/react/src/components/Form/index.tsx @@ -44,6 +44,7 @@ export interface FormFieldData extends ValidationRules { type: string value?: string multiple?: boolean + props?: Record // allow any other custom properties [key: string]: any }