diff --git a/packages/web/components/patterns/FormModal.tsx b/packages/web/components/patterns/FormModal.tsx new file mode 100644 index 000000000..ab7f5b6d4 --- /dev/null +++ b/packages/web/components/patterns/FormModal.tsx @@ -0,0 +1,70 @@ +import { + ModalContent, + ModalOverlay, + ModalRoot, +} from '../elements/ModalPrimitives' +import { Box, HStack, VStack } from '../elements/LayoutPrimitives' +import { Button } from '../elements/Button' +import { StyledText } from '../elements/StyledText' +import { FormInput } from '../elements/FormElements' + +interface FormInputProps { + name: string + label: string + value?: string + onChange: (value: string) => void + type?: string + placeholder?: string + disabled?: boolean + hidden?: boolean +} + +interface FormModalProps { + inputs?: FormInputProps[] + title: string + acceptButtonLabel?: string + onSubmit: () => void + onOpenChange: (open: boolean) => void +} + +export function FormModal(props: FormModalProps): JSX.Element { + return ( + + + + + {props.title} + +
+ {props.inputs?.map((input) => ( + + {input.label} + input.onChange(event.target.value)} + disabled={input.disabled} + hidden={input.hidden} + /> + + ))} + + + + +
+
+
+
+
+ ) +}