Sunar

Modal

Modals are popup forms that can collect detailed user input. They are particularly useful for complex interactions that require multiple fields or steps.

Usage

import { Modal, execute } from 'sunar';
 
const modal = new Modal({ id: 'example' });
 
execute(modal, (interaction) => {
	// handle execution
});
 
export { modal };

Implementation

The following example demonstrates how to implement a Modal using Sunar:

import { Modal, Slash, execute } from 'sunar';
import {
	ActionRowBuilder,
	ModalBuilder,
	TextInputBuilder,
	TextInputStyle,
} from 'discord.js';
 
const slash = new Slash({
	name: 'feedback',
	description: 'Send us feedback',
});
 
execute(slash, (interaction) => {
	const contentInput = new TextInputBuilder()
		.setCustomId('content')
		.setLabel('Content')
		.setStyle(TextInputStyle.Paragraph)
		.setPlaceholder('Your feedback content...')
		.setRequired(true);
 
	const row = new ActionRowBuilder().setComponents(contentInput);
 
	const modal = new ModalBuilder()
		.setCustomId('feedback')
		.setTitle('Submit your feedback')
		.setComponents(row);
 
	interaction.showModal(modal);
});
 
const modal = new Modal({ id: 'feedback' });
 
execute(modal, (interaction) => {
	const feedback = interaction.fields.getTextInputValue('content');
 
	// Send feedback somewhere...
 
	interaction.reply({
		content: 'Thanks for the feedback!',
		ephemeral: true,
	});
});
 
export { slash, modal };

Reference

PropTypeDefault
id
string | RegExp
-
PropTypeDefault
cooldown
CooldownResolvable
-

Last updated on

On this page

GitHubEdit on Github ↗