Add more form constraints

Author: ischaojie

demo/forms.py

@@ -141,7 +141,10 @@ class SizeModel(BaseModel):
 
 class BigModel(BaseModel):
     name: str | None = Field(
-        None, description='This field is not required, it must start with a capital letter if provided'
+        None,
+        max_length=10,
+        min_length=2,
+        description='This field is not required, it must start with a capital letter if provided',
     )
     profile_pic: Annotated[UploadFile, FormFile(accept='image/*', max_size=16_000)] = Field(
         description='Upload a profile picture, must not be more than 16kb'
@@ -153,6 +156,7 @@ class BigModel(BaseModel):
     human: bool | None = Field(
         None, title='Is human', description='Are you human?', json_schema_extra={'mode': 'switch'}
     )
+    number: int | None = Field(None, title='Number', ge=0, le=10, multiple_of=2, description='This is a number')
     size: SizeModel
 
     @field_validator('name')

src/npm-fastui/src/components/FormField.tsx

@@ -30,11 +30,16 @@ interface FormFieldInputProps extends BaseFormFieldProps {
   type: 'FormFieldInput'
   htmlType: 'text' | 'date' | 'datetime-local' | 'time' | 'email' | 'url' | 'number' | 'password'
   initial?: string | number
+  maxLength?: number
+  minLength?: number
+  ge?: number
+  le?: number
+  multipleOf?: number
   placeholder?: string
 }
 
 export const FormFieldInputComp: FC<FormFieldInputProps> = (props) => {
-  const { name, placeholder, required, htmlType, locked } = props
+  const { name, placeholder, required, htmlType, locked, maxLength, minLength, ge, le, multipleOf } = props
 
   return (
     <div className={useClassName(props)}>
@@ -49,6 +54,11 @@ export const FormFieldInputComp: FC<FormFieldInputProps> = (props) => {
         disabled={locked}
         placeholder={placeholder}
         aria-describedby={descId(props)}
+        maxLength={maxLength}
+        minLength={minLength}
+        min={ge}
+        max={le}
+        step={multipleOf}
       />
       <ErrorDescription {...props} />
     </div>

src/python-fastui/fastui/components/forms.py

@@ -32,6 +32,11 @@ class FormFieldInput(BaseFormField):
     html_type: InputHtmlType = pydantic.Field(default='text', serialization_alias='htmlType')
     initial: _t.Union[str, float, None] = None
     placeholder: _t.Union[str, None] = None
+    max_length: _t.Union[int, None] = pydantic.Field(default=None, serialization_alias='maxLength')
+    min_length: _t.Union[int, None] = pydantic.Field(default=None, serialization_alias='minLength')
+    ge: _t.Union[int, float, None] = None
+    le: _t.Union[int, float, None] = None
+    multiple_of: _t.Union[int, float, None] = pydantic.Field(default=None, serialization_alias='multipleOf')
     type: _t.Literal['FormFieldInput'] = 'FormFieldInput'
 
 

src/python-fastui/fastui/json_schema.py

@@ -186,6 +186,11 @@ def json_schema_field_to_field(
             required=required,
             initial=schema.get('default'),
             description=schema.get('description'),
+            max_length=schema.get('maxLength'),
+            min_length=schema.get('minLength'),
+            ge=schema.get('minimum'),
+            le=schema.get('maximum'),
+            multiple_of=schema.get('multipleOf'),
         )