IonicConfig
Configuration options for Ionic form fields.
These settings can be applied at two levels:
- Library-level: Via
- applies to all formswithIonicFields ({ ... }) - Form-level: Via
defaultPropsin form config - applies to a specific form
The cascade hierarchy is: Library-level → Form-level → Field-level
Properties
| Name | Type | Description |
|---|---|---|
| buttonFill | "default" | "outline" | "solid" | "clear" | undefined | Default fill style for buttons (overrides general fill if set) @default 'solid' |
| color | "primary" | "secondary" | "tertiary" | "success" | "warning" | "danger" | "light" | "medium" | "dark" | undefined | Default color theme for form controls @default 'primary' |
| expand | "full" | "block" | undefined | Default expand behavior for buttons @default undefined |
| fill | "outline" | "solid" | undefined | Default fill style for form inputs @default 'solid' |
| labelPlacement | "fixed" | "start" | "end" | "stacked" | "floating" | undefined | Default label placement for form inputs @default 'start' |
| shape | "round" | undefined | Default shape for form controls @default undefined |
| size | "default" | "small" | "large" | undefined | Default size for buttons @default 'default' |
| strong | boolean | undefined | Whether buttons should be strong (bold) by default @default false |
Example usage
// Library-level (in app config)
provideDynamicForms(withIonicFields ({ fill: 'outline', labelPlacement: 'floating' }))
// Form-level (in form config)
const config: IonicFormConfig = {
defaultProps: { color: 'tertiary' },
fields: [...]
};