select
select
enables EarlyBird users to effortlessly choose a value from the available options.
Example usage
json
[
{
name: 'features',
title: 'Features',
fields: [
{
name: 'align',
title: 'Align',
type: 'select',
options: [
{
label: 'Left',
value: 'left'
},
{
label: 'Right',
value: 'right'
}
],
default: 'left'
}
]
}
]
[
{
name: 'features',
title: 'Features',
fields: [
{
name: 'align',
title: 'Align',
type: 'select',
options: [
{
label: 'Left',
value: 'left'
},
{
label: 'Right',
value: 'right'
}
],
default: 'left'
}
]
}
]
jsx
<div id="features">
<div
className={`feature ${features.align === 'right' ? 'feature-right' : ''}`}
>
{(() => {
switch (features.align) {
case 'left':
return <div>Align Left</div>
case 'right':
return <div>Align Right</div>
default:
return null
}
})()}
</div>
</div>
<div id="features">
<div
className={`feature ${features.align === 'right' ? 'feature-right' : ''}`}
>
{(() => {
switch (features.align) {
case 'left':
return <div>Align Left</div>
case 'right':
return <div>Align Right</div>
default:
return null
}
})()}
</div>
</div>
options
Type: Array
label
Type: string
The title of the select option.
value
Type: string
The value of the select option.