Image Upload Component

THIS PAGE
Introduction
Configuration Options
Triggers
Validations
Theme Options

Introduction

The image component is used for collecting images from the user. User can select multiple images.

Screenshot

Configuration Options

Label

Expected Type: String

An optional label for the input. Can be used to define what the input is for, for the user.

Placeholder

Expected Type: String

An optional placeholder for the input. It's displayed inside the input till the input doesn't have a value.

Hint

Expected Type: String

An optional hint for the input. It's displayed inside a tooltip right next to the label upon hover.

Disabled

Expected Type: Boolean

This determines whether the input component is editable by the user or not.

Default Image

Expected Type: Url

The default image for the input. To set this field either click on upload to quickly upload an image or alternatively, input a url that points to an image. This can be used to show initial image to the input that can then be changed by the user.

Multiple Images

Expected Type: Boolean

This determines whether the input component can upload a single image or multiple images

Triggers

  • Change: Triggers whenever the input is changed.

Validations

You can use the validation builder to add various validations on the input. This can range from the input simply being required to complex regex based validations.

Screenshot

You can read more on how to configure validations here.

Theme Options

  • Label Color: The input's label color. (String | Hex)
  • Hint Color: The input's hint color. (String | Hex)
  • Object Fit: The input's resize configuration with respect to its container. (String)
  • Aspect Ratio: The input's aspect ratio. (Number)
Did you find what you were looking for?
👍
👎
What went wrong?
Need more help?We have a thriving Discordcommunity that can help you with all things Canonic. →