ButtonSelector
value type: any
The ButtonSelector
block allows a user to select a single value from a set of options. The user cannot deselect an option once they have selected an input.
The options for the selector can be provides as either an array of primitive values (strings, numbers, booleans or dates), or as an array of label-value pairs, where the label is a string, and the value can be of any type, including objects like dates and arrays.
Other selector blocks are
CheckboxSelector
,MultipleSelector
,RadioSelector
andSelector
.
Block
State
block_id: null
Block Setup
id: block_id
type: ButtonSelector
properties:
options:
- label: First
value: 1
disabled: false
style: null
- label: Second
value: 2
disabled: false
style: null
Settings
ButtonSelector JSON Schema Definition
type: object
properties:
events:
additionalProperties: false
properties:
onChange:
description: Trigger actions when selection is changed.
type: array
type: object
properties:
additionalProperties: false
properties:
buttonStyle:
default: solid
description: Style of the selected option button.
enum:
- solid
- outline
type: string
color:
description: Selected button color.
type: string
disabled:
default: false
description: Disable the block if true.
type: boolean
inputStyle:
description: Css style to applied to input.
type: object
label:
additionalProperties: false
description: Label properties.
properties:
align:
default: left
description: Align label left or right when inline.
enum:
- left
- right
type: string
colon:
default: true
description: Append label with colon.
type: boolean
disabled:
default: false
description: Hide input label.
type: boolean
extra:
description: Extra text to display beneath the content - supports html.
type: string
extraStyle:
description: Css style to applied to label extra.
type: object
feedbackStyle:
description: Css style to applied to label feedback.
type: object
hasFeedback:
default: true
description: >-
Display feedback extra from validation, this does not disable
validation.
type: boolean
inline:
default: false
description: Render input and label inline.
type: boolean
span:
description: Label inline span.
type: number
title:
description: Label title - supports html.
type: string
type: object
options:
default: []
oneOf:
- description: >-
Options can either be an array of primitive values, on an array of
label, value pairs - supports html.
items:
type: string
type: array
- description: >-
Options can either be an array of primitive values, on an array of
label, value pairs.
items:
type: number
type: array
- description: >-
Options can either be an array of primitive values, on an array of
label, value pairs.
items:
type: boolean
type: array
- description: >-
Options can either be an array of primitive values, on an array of
label, value pairs.
items:
properties:
disabled:
default: false
description: Disable the option if true.
type: boolean
label:
description: Value label shown to user - supports html.
type: string
style:
description: Css style to applied to option.
type: object
value:
description: Value selected. Can be of any type.
oneOf:
- type: string
- type: number
- type: boolean
- type: object
- type: array
required:
- value
type: object
type: array
size:
default: default
description: Size of the block.
enum:
- small
- default
- large
type: string
title:
description: >-
Title to describe the input component, if no title is specified the
block id is displayed - supports html.
type: string
type: object