Enum Field Type
Additional attributes, defaults, and usage example for enum fields.
Usage Example
Here is an example that shows a field called backgroundColor
that lets an editor choose between a primary and secondary color.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
The default control type is a dropdown. See control types below for additional rendering options.
Control Types
Control types affect how the field is rendered, as well as how options
are defined.
button-group
A button group creates a horizontal list of buttons, where only one can be selected at a time.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
dropdown
(default)
Dropdown is the default control type. It renders a simple dropdown control that lists the labels and stores the values.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
- If field is not required, dropdown will render a None option to allow for clearing the value. Otherwise, only the options are rendered.
palette
A palette allows for a series of color swatches, where you can control the text, background, and border colors.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
You can also use variables from your global styles object. This is an effective way to ensure consistency in color choices throughout your project. Here's an example that let's editors choose from two colors set as
primary
andsecondary
in global styles.1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
palette-colors
While palette
shows single color combinations, palette-colors
is designed to show more complex color combinations.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
Like the
palette
control, you can also use variables from your global styles object. This is an effective way to ensure consistency in color choices throughout your project.1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
thumbnails
You can also list a series of image tiles from images that are loaded directly from your repository.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23