ColorFieldΒΆ
-
/libs/granite/ui/components/coral/foundation/form/colorfield
A field that allows user to enter color.
It extends
Field
component.It has the following content structure:
-
granite:FormColorField
- granite:FormField
- namestring
The name that identifies the field when submitting the form.
- valuestringel
The value of the field. This value can be set in 5 different formats (HEX, RGB, RGBA, HSB and CMYK)
- emptyTextstring
- i18n
A hint to the user of what can be entered in the field.
- disabledboolean
Indicates if the field is in disabled state.
- requiredboolean
Indicates if the field is mandatory to be filled.
-
variantstring
- default
Enumeration for colorfield variant:
- default
- Use ColorField as a formfield
- swatch
- Use a simple swatch as ColorField
-
autogenerateColorsstring
- off
Enumeration for auto generated colors state:
- off
- Disable auto generation
- shades
- Automatically generate shades (darker colors) of all colors
- tints
- Automatically generate tints (lighter colors) of all colors
- showSwatchesboolean
Indicates if swatches view should be displayed. swatches view is the right side container that allows to select color from swatches.
- showPropertiesboolean
Indicates if color properties view should be displayed. color properties view is the left side container having sliders, hex and RGBA inputs
- showDefaultColorsboolean
Indicates if default colors should be displayed.
- validationstring
- multiple
The name of the validator to be applied. E.g.
foundation.jcr.name
. See validation in Granite UI.
Custom colors can be added as items with following content structure:
- granite:FormColorFieldItem
- valuestring
The color value. This value can be set in 5 different formats (HEX, RGB, RGBA, HSB and CMYK)
Example:
+ colorfield - sling:resourceType = "granite/ui/components/coral/foundation/form/colorfield" + items + color1 - value = "#FF4136" + color2 - value = "#0074D9"
-
granite:FormColorField