ActionRowBuilder

ActionRowBuilder is a generic container that holds interactive components (buttons, select menus, or text inputs in modals). Each message can have up to 5 action rows.

Import

TypeScript

import { ActionRowBuilder } from "lunibee";

JavaScript

import { ActionRowBuilder } from "lunibee";

Generic Type Parameter

ActionRowBuilder<T> is typed to the component it will hold. This provides type-safe addComponents() calls:

TypeScript

import { ActionRowBuilder, ButtonBuilder, StringSelectBuilder } from "lunibee";

const buttonRow = new ActionRowBuilder<ButtonBuilder>();
const selectRow = new ActionRowBuilder<StringSelectBuilder>();

JavaScript

import { ActionRowBuilder, ButtonBuilder, StringSelectBuilder } from "lunibee";

const buttonRow = new ActionRowBuilder();
const selectRow = new ActionRowBuilder();

Methods

addComponents(...components)

Adds one or more components to the row (max 5 buttons or 1 select menu per row).

TypeScript

const row = new ActionRowBuilder<ButtonBuilder>().addComponents(
  new ButtonBuilder().setCustomId("a").setLabel("A").setStyle(1),
  new ButtonBuilder().setCustomId("b").setLabel("B").setStyle(2),
);

JavaScript

const row = new ActionRowBuilder().addComponents(
  new ButtonBuilder().setCustomId("a").setLabel("A").setStyle(1),
  new ButtonBuilder().setCustomId("b").setLabel("B").setStyle(2),
);

setComponents(...components)

Replaces all components with a new set.

toJSON()

Serializes to a raw Discord API-compatible action row object.

Examples

Three-button row

TypeScript

import { ActionRowBuilder, ButtonBuilder, ButtonStyle } from "lunibee";

const row = new ActionRowBuilder<ButtonBuilder>().addComponents(
  new ButtonBuilder().setCustomId("prev").setLabel("◀ Previous").setStyle(ButtonStyle.Secondary),
  new ButtonBuilder().setCustomId("stop").setLabel("⏹ Stop").setStyle(ButtonStyle.Danger),
  new ButtonBuilder().setCustomId("next").setLabel("Next ▶").setStyle(ButtonStyle.Secondary),
);
await channel.send({ content: "Page 1 of 5", components: [row] });

JavaScript

import { ActionRowBuilder, ButtonBuilder, ButtonStyle } from "lunibee";

const row = new ActionRowBuilder().addComponents(
  new ButtonBuilder().setCustomId("prev").setLabel("◀ Previous").setStyle(ButtonStyle.Secondary),
  new ButtonBuilder().setCustomId("stop").setLabel("⏹ Stop").setStyle(ButtonStyle.Danger),
  new ButtonBuilder().setCustomId("next").setLabel("Next ▶").setStyle(ButtonStyle.Secondary),
);
await channel.send({ content: "Page 1 of 5", components: [row] });

Select menu row

TypeScript

import { ActionRowBuilder, StringSelectBuilder } from "lunibee";

const row = new ActionRowBuilder<StringSelectBuilder>().addComponents(
  new StringSelectBuilder()
    .setCustomId("pick_role")
    .setPlaceholder("Pick a role…")
    .addOptions(
      { label: "Developer", value: "dev", emoji: "💻" },
      { label: "Designer", value: "design", emoji: "🎨" },
    ),
);
await channel.send({ content: "Choose your role:", components: [row] });

JavaScript

import { ActionRowBuilder, StringSelectBuilder } from "lunibee";

const row = new ActionRowBuilder().addComponents(
  new StringSelectBuilder()
    .setCustomId("pick_role")
    .setPlaceholder("Pick a role…")
    .addOptions(
      { label: "Developer", value: "dev", emoji: "💻" },
      { label: "Designer", value: "design", emoji: "🎨" },
    ),
);
await channel.send({ content: "Choose your role:", components: [row] });

Modal with text input (using ActionRowBuilder)

TypeScript

import { ActionRowBuilder, TextInputBuilder, TextInputStyle, ModalBuilder } from "lunibee";

const modal = new ModalBuilder()
  .setCustomId("feedback")
  .setTitle("Send Feedback")
  .addComponents(
    new ActionRowBuilder<TextInputBuilder>().addComponents(
      new TextInputBuilder()
        .setCustomId("message")
        .setLabel("Your feedback")
        .setStyle(TextInputStyle.Paragraph),
    ),
  );
await interaction.showModal(modal);

JavaScript

import { ActionRowBuilder, TextInputBuilder, TextInputStyle, ModalBuilder } from "lunibee";

const modal = new ModalBuilder()
  .setCustomId("feedback")
  .setTitle("Send Feedback")
  .addComponents(
    new ActionRowBuilder().addComponents(
      new TextInputBuilder()
        .setCustomId("message")
        .setLabel("Your feedback")
        .setStyle(TextInputStyle.Paragraph),
    ),
  );
await interaction.showModal(modal);