ImageInput component
ImageInput is a component that lets you set up an image field on a Freedom UI page.
Properties
id string
The unique ID. Service field.
value string
The image field value. Can be bound to text or ImageLink attributes, such as, Base64, DataURI or CDN link to an image.
readonly boolean
Whether the field is read-only. By default, false.
visible boolean
Whether the field is visible. By default, true.
positioning string
The image position in the container. By default, cover.
Available values
cover | The image fills the entire element content box with possible cropping. Aspect ratio is preserved. |
scale-down | The image fits the boundaries of the element content box without cropping. Aspect ratio is preserved. |
size string
The image width and height.
Available values
small | 32*32 px |
medium | 48*48 px |
large | 80*80 px |
extra-large | 120*120 px |
borderRadius string
The type of corner rounding. By default, medium.
Available values
none | No rounding (0 px). |
small | Small rounding (4 px). |
medium | Medium rounding (8 px). |
large | Large rounding (16 px). |
maxFileSize number
The maximum allowed file size.
customHeight string optional
The custom image height in em, px, %, or other units supported by CSS. Fill out both customHeight and customWidth when you customize the dimensions.
customWidth string optional
The custom image width in em, px, %, or other units supported by CSS. Fill out both customHeight and customWidth when you customize the dimensions.
placeholderMode ImagePlaceholderMode optional
The mode of the placeholder. By default, icon.
Available values
abbreviation | Text placeholder. |
icon | Icon placeholder. |
placeholder string optional
Icon or text placeholder displayed if no image is added to the field. Must be bound to a text attribute if placeholderMode is set to abbreviation. Must be bound to an image from the repository if the placeholderMode is set to icon.