How to configure Modal

In this guide, you will learn how to configure a modal and everything you can do with it. Modals support placeholders, you can put them in any part of the modal, and they will be replaced with the corresponding value when the modal is displayed.

I really recommend learning about the message configuration first, as modals use the same component system. You can find the message configuration guide here.

Modal Configuration

This is the main part of the modal configuration. You set everything you want to display in the modal here. The modal is composed of components, which are the building blocks of the modal. Each component has a type and can have various options.

Support the following components: text-display, label.

title: #string, optional, the title of the modal.
components: # list of components, the components of the modal

Components

Below, you will find a list of all the possible components you can include in your modal. There are no components that are required in a modal.

Component Conditions

Each component supports conditions, these are exactly the same conditions you can find in scripts. They allow you to display a component only in certain cases, so your message can adapt to the context. You can find the list of available conditions here. The format is as follows:

components:
  - type: <component-type> # The type of the component
    conditions: # Optional, the conditions of the component
      - id: <condition-id> # The id of the condition
        args: # The arguments of the condition
          <arg-name>: <arg-value> # The arguments of the condition

`text-display`

Text display are the default components to use when you want to display text. They are compatible with Discord’s markdown format, so you can create titles by adding # at the beginning of the line, etc.

The content option can be a list of strings, ItsMyBot will randomly select one of the results. This means each modal will be unique!

type: text-display
content: #string | list

`label`

A label is a component that can contain a label, a description, and an input component. It is used to display a label with an input field, like a text input or a select menu.

Support the following components: text-input, select-menu.

type: label
label: #string | list, the label of the component
description: #string | list, optional
component: # component, the input component

`text-input`

A text input is a component that allows the user to enter text. It can be used to collect information from the user.

type: text-input
style: #string, the style of the text input, can be 'Short' or 'Paragraph'
custom-id: #string, the custom id of the text input
placeholder: #string | list, optional, the placeholder of the text input
max-length: #integer, optional, the maximum length of the text input
min-length: #integer, optional, the minimum length of the text input
required: #boolean, optional, whether the text input is required or not
value: #string | list, optional, the default value of the text input

A select menu is a component that allows the user to select an option from a list.

The placeholder options can be a string or a list of strings, ItsMyBot will randomly select one of the results.

type: select-menu
custom-id: #string
options: # list of options
placeholder: #string | list, optional
min-values: #integer, optional, default is 1
max-values: #integer, optional, default is 1
data-source: #string, optional, the data source to use for the select menu, see the repeat component for more information
template: #list, optional, the template to use for the select menu