Lowdefy

MultipleSelector

value type: any[]

The MultipleSelector block is a drop down selector that allows a user to select multiple values 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, RadioSelector and Selector.

Select items
block_id: []


id: block_id
type: MultipleSelector
properties:
  options:
    - label: First
      value: 1
      disabled: false
    - label: Second
      value: 2
      disabled: false
properties:
Allow the user to clear the selected value, sets the value to null.
Autofocus to the block on page load.
CloseCircleOutlined
Name of an Ant Design Icon or properties of an Icon block to customize icon at far right position of the selector, shown when user is given option to clear input.
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.
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.
Select options type
options:
  • Disable the option if true.
    Value label shown to user.
    Value selected. Can be of any type.
  • Disable the option if true.
    Value label shown to user.
    Value selected. Can be of any type.

Css style to applied to option elements.
Placeholder text inside the block before user selects input.
CheckOutlined
Name of an Ant Design Icon or properties of an Icon block to customize icon showing when a selection is made in the drop-down list.
Show the suffix icon at the drop-down position of the selector.
Size of the block.
DownOutlined
Name of an Ant Design Icon or properties of an Icon block to customize at the drop-down position of the selector.
Multiple selector label title.
type: object
properties:
  actions:
    additionalProperties: false
    properties:
      onChange:
        description: Trigger actions when selection is changed.
        type: array
    type: object
  properties:
    additionalProperties: false
    properties:
      allowClear:
        default: true
        description: Allow the user to clear the selected value, sets the value to null.
        type: boolean
      autoFocus:
        default: false
        description: Autofocus to the block on page load.
        type: boolean
      clearIcon:
        default: CloseCircleOutlined
        description: >-
          Name of an Ant Design Icon or properties of an Icon block to customize
          icon at far right position of the selector, shown when user is given
          option to clear input.
        type:
          - string
          - object
      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.
            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.
            type: string
        type: object
      options:
        default: []
        oneOf:
          - description: >-
              Options can either be an array of primitive values, on an array of
              label, value pairs.
            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.
                  type: string
                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
      optionsStyle:
        description: Css style to applied to option elements.
        type: object
      placeholder:
        default: Select item
        description: Placeholder text inside the block before user selects input.
        type: string
      selectedIcon:
        default: CheckOutlined
        description: >-
          Name of an Ant Design Icon or properties of an Icon block to customize
          icon showing when a selection is made in the drop-down list.
        type:
          - string
          - object
      showArrow:
        default: true
        description: Show the suffix icon at the drop-down position of the selector.
        type: boolean
      size:
        default: default
        description: Size of the block.
        enum:
          - small
          - default
          - large
        type: string
      suffixIcon:
        default: DownOutlined
        description: >-
          Name of an Ant Design Icon or properties of an Icon block to customize
          at the drop-down position of the selector.
        type:
          - string
          - object
      title:
        description: Multiple selector label title.
        type: string
    type: object