Text Input

type: 4 Modals

The Text Input is a text field the user fills in inside a modal. It can be single-line or multi-line (paragraph). It always goes inside a Label.

Preview

{
  "type": 9,
  "data": {
    "custom_id": "report",
    "title": "Report a problem",
    "components": [
      {
        "type": 18,
        "label": "Title",
        "component": {
          "type": 4,
          "custom_id": "title",
          "style": 1,
          "placeholder": "Summarize the problem",
          "min_length": 5,
          "max_length": 80
        }
      },
      {
        "type": 18,
        "label": "Description",
        "description": "What happened? How can we reproduce it?",
        "component": {
          "type": 4,
          "custom_id": "description",
          "style": 2,
          "placeholder": "When I click on...",
          "max_length": 2000
        }
      },
      {
        "type": 18,
        "label": "Version",
        "component": {
          "type": 4,
          "custom_id": "version",
          "style": 1,
          "value": "v2.4.1",
          "required": false
        }
      }
    ]
  }
}

Fields

Field	Type	Description
`type`	integer	required Always `4`.
`id`	integer	optional Unique identifier.
`custom_id`	string	required 1-100 characters.
`style`	integer	required `1` = single line (Short), `2` = paragraph (Paragraph).
`min_length`	integer	optional Minimum length (0-4000).
`max_length`	integer	optional Maximum length (1-4000).
`required`	boolean	optional Whether it’s required. Defaults to `true`.
`value`	string	optional Pre-filled text. Max 4000 characters.
`placeholder`	string	optional Grey example text. Max 100 characters.
`label`	string	deprecated Use a Label instead.

Code

Respond to the interaction with the JSON above. On submit, you receive value with the typed text.

await interaction.showModal({
  custom_id: 'report',
  title: 'Report a problem',
  components: [
    { type: 18, label: 'Title', component: { type: 4, custom_id: 'title', style: 1, min_length: 5, max_length: 80 } },
    { type: 18, label: 'Description', component: { type: 4, custom_id: 'description', style: 2, max_length: 2000 } },
  ],
});

// When the modal is submitted
if (interaction.isModalSubmit() && interaction.customId === 'report') {
  const title = interaction.fields.getTextInputValue('title');
  const description = interaction.fields.getTextInputValue('description');
}

class Report(discord.ui.Modal, title="Report a problem"):
    title_input = discord.ui.Label(
        text="Title",
        component=discord.ui.TextInput(style=discord.TextStyle.short, min_length=5, max_length=80),
    )
    description = discord.ui.Label(
        text="Description",
        description="What happened? How can we reproduce it?",
        component=discord.ui.TextInput(style=discord.TextStyle.paragraph, max_length=2000),
    )

    async def on_submit(self, interaction: discord.Interaction):
        await interaction.response.send_message(
            f"Report received: **{self.title_input.component.value}**", ephemeral=True
        )

discordgo.Label{
  Label: "Description",
  Component: discordgo.TextInput{
    CustomID:  "description",
    Style:     discordgo.TextInputParagraph,
    MaxLength: 2000,
  },
}