diff --git a/src/components/Form/Form.stories.tsx b/src/components/Form/Form.stories.tsx index 7a2b06d..bcd7b91 100644 --- a/src/components/Form/Form.stories.tsx +++ b/src/components/Form/Form.stories.tsx @@ -14,7 +14,17 @@ const fields: FormField[] = [ component: "Input", placeholder: "your cool round name", }, - + { + field: { + name: "disabledField", + label: "Disabled input", + className: "border-grey-300", + validation: { stringValidation: { minLength: 7 } }, + }, + component: "Input", + placeholder: "This field is disabled", + disabled: true, + }, { field: { name: "roundDescription", diff --git a/src/types/form/fieldTypes.ts b/src/types/form/fieldTypes.ts index fa0d67e..a05d8b3 100644 --- a/src/types/form/fieldTypes.ts +++ b/src/types/form/fieldTypes.ts @@ -1,6 +1,7 @@ import { FieldArrayProps, MetricsProps } from "@/components/Form"; import { FileUploadProps } from "@/primitives/FileUpload"; import { SelectProps } from "@/primitives/Select"; +import { InputProps } from "@/ui-shadcn/input"; import { Markdown } from "../markdown"; @@ -49,7 +50,7 @@ export interface BaseField { className?: string; } -export interface InputField { +export interface InputField extends InputProps { field: BaseField; component: "Input"; type?: string; diff --git a/src/ui-shadcn/input.tsx b/src/ui-shadcn/input.tsx index 65f2b25..62be4ae 100644 --- a/src/ui-shadcn/input.tsx +++ b/src/ui-shadcn/input.tsx @@ -5,14 +5,17 @@ import { cn } from "@/lib/utils"; export interface InputProps extends React.InputHTMLAttributes {} const Input = React.forwardRef( - ({ className, type, ...props }, ref) => { + ({ className, type, disabled, ...props }, ref) => { return (