Lowdefy

RadioSelector

value type: any

The RadioSelector block is a set of radio buttons that allow a user to select a single value from a set of options.

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 ButtonSelector, CheckboxSelector, MultipleSelector and Selector.

block_id: null


id: block_id
type: RadioSelector
properties:
  options:
    - label: First
      value: 1
      disabled: false
      style: null
    - label: Second
      value: 2
      disabled: false
      style: null
properties:
Align options.
Selected radio color.
List options horizontally or vertical.
Disable the block if true.
Css style to applied to input.
label:
Align label left or right when inline.
Append label with colon.
Hide input label.
Extra text to display beneath the content - supports html.
Css style to applied to label extra.
Css style to applied to label feedback.
Display feedback extra from validation, this does not disable validation.
Render input and label inline.
Label inline span.
Label title - supports html.
Select options type
options:
  • Disable the option if true.
    Value label shown to user - supports html.
    Css style to applied to option.
    Value selected.
    AiOutlineMinusCircle
  • Disable the option if true.
    Value label shown to user - supports html.
    Css style to applied to option.
    Value selected.
    AiOutlineMinusCircle

Title to describe the input component, if no title is specified the block id is displayed - supports html.
Specifies wrapping of options. Applies when 'direction' is 'horizontal'.
type: object
properties:
  type: object
  properties:
    type: object
    additionalProperties: false
    properties:
      align:
        type: string
        enum:
          - start
          - end
          - center
          - baseline
        default: start
        description: Align options.
      color:
        type: string
        description: Selected radio color.
      disabled:
        type: boolean
        default: false
        description: Disable the block if true.
      direction:
        type: string
        enum:
          - horizontal
          - vertical
        default: horizontal
        description: List options horizontally or vertical.
      wrap:
        type: boolean
        default: true
        description: Specifies wrapping of options. Applies when 'direction' is 'horizontal'.
      inputStyle:
        type: object
        description: Css style to applied to input.
      label:
        type: object
        description: Label properties.
        additionalProperties: false
        properties:
          align:
            type: string
            enum:
              - left
              - right
            default: left
            description: Align label left or right when inline.
          colon:
            type: boolean
            default: true
            description: Append label with colon.
          extra:
            type: string
            description: Extra text to display beneath the content - supports html.
          title:
            type: string
            description: Label title - supports html.
          span:
            type: number
            description: Label inline span.
          disabled:
            type: boolean
            default: false
            description: Hide input label.
          hasFeedback:
            type: boolean
            default: true
            description: Display feedback extra from validation, this does not disable
              validation.
          inline:
            type: boolean
            default: false
            description: Render input and label inline.
          extraStyle:
            type: object
            description: Css style to applied to label extra.
          feedbackStyle:
            type: object
            description: Css style to applied to label feedback.
      options:
        default: []
        oneOf:
          - type: array
            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:
              type: object
              required:
                - value
              properties:
                label:
                  type: string
                  description: Value label shown to user - supports html.
                value:
                  description: Value selected.
                  oneOf:
                    - type: string
                    - type: number
                    - type: boolean
                    - type: object
                disabled:
                  type: boolean
                  default: false
                  description: Disable the option if true.
                style:
                  type: object
                  description: Css style to applied to option.
      title:
        type: string
        description: Title to describe the input component, if no title is specified the
          block id is displayed - supports html.
  events:
    type: object
    additionalProperties: false
    properties:
      onChange:
        type: array
        description: Trigger action when selection is changed.