Sunar

SelectMenu

Select menus allow users to choose from a list of options. They are useful for forms, surveys, or any scenario where the user needs to make a selection from multiple choices.

Usage

import { SelectMenu, execute } from 'sunar';

const select = new SelectMenu({
	id: 'example',
	type: ComponentType.StringSelect,
});

execute(select, (interaction) => {
	// handle execution
});

export { select };

Implementation

The following example demonstrates how to implement a Select Menu using Sunar:

import { SelectMenu, Slash, execute } from 'sunar';
import {
	ActionRowBuilder,
	ComponentType,
	StringSelectMenuBuilder,
} from 'discord.js';

const slash = new Slash({
	name: 'buy',
	description: 'Buy something',
});

execute(slash, (interaction) => {
	const select = new StringSelectMenuBuilder()
		.setCustomId('buySelectMenu')
		.setOptions(
			{ label: 'Laptop', value: 'laptop' },
			{ label: 'Smart TV', value: 'smart-tv' },
			{ label: 'Tablet', value: 'tablet' },
			{ label: 'Smartphone', value: 'smartphone' },
		)
		.setPlaceholder('Select an item to purchase');

	const row = new ActionRowBuilder().setComponents(select);

	interaction.reply({ components: [row] });
});

const select = new SelectMenu({
	id: 'buySelectMenu',
	type: ComponentType.StringSelect,
});

execute(select, (interaction) => {
	const item = interaction.values.at(0);

	// Do something with the item...

	interaction.reply({ content: `You have purchased the **${item}** item` });
});

export { slash, select };

Reference

SelectMenuOptions

Prop

Type

SelectMenuConfig

Prop

Type

How is this guide?

Last updated on