CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-discordjs--builders

Type-safe builders for Discord API payloads including slash commands, embeds, buttons, select menus, and message components

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Overview
Eval results
Files

embeds.mddocs/

Embeds

The embed system provides a builder for creating rich message embeds with titles, descriptions, fields, images, and other visual components.

EmbedBuilder

Main builder for creating Discord message embeds.

class EmbedBuilder {
  readonly data: APIEmbed;

  constructor(data?: APIEmbed);
  
  setTitle(title: string | null): this;
  setDescription(description: string | null): this;
  setURL(url: string | null): this;
  setTimestamp(timestamp?: Date | number | null): this;
  setColor(color: RGBTuple | number | string | null): this;
  setThumbnail(url: string | null): this;
  setImage(url: string | null): this;
  setAuthor(options: EmbedAuthorOptions | null): this;
  setFooter(options: EmbedFooterOptions | null): this;
  
  addFields(...fields: RestOrArray<APIEmbedField>): this;
  spliceFields(index: number, deleteCount: number, ...fields: APIEmbedField[]): this;
  setFields(...fields: RestOrArray<APIEmbedField>): this;
  
  toJSON(): APIEmbed;
}

Types

Color Types

type RGBTuple = [red: number, green: number, blue: number];

Author Options

interface EmbedAuthorOptions {
  name: string;
  url?: string;
  iconURL?: string;
}

interface EmbedAuthorData extends IconData, Omit<APIEmbedAuthor, 'icon_url' | 'proxy_icon_url'> {
  readonly name: string;
  readonly url?: string;
  readonly iconURL?: string;
  readonly proxyIconURL?: string;
}

Footer Options

interface EmbedFooterOptions {
  text: string;
  iconURL?: string;
}

interface EmbedFooterData extends IconData, Omit<APIEmbedFooter, 'icon_url' | 'proxy_icon_url'> {
  readonly text: string;
  readonly iconURL?: string;
  readonly proxyIconURL?: string;
}

Field Structure

interface APIEmbedField {
  name: string;
  value: string;
  inline?: boolean;
}

Icon Data

interface IconData {
  iconURL?: string;
  proxyIconURL?: string;
}

Usage Examples

Basic Embed

import { EmbedBuilder } from "@discordjs/builders";

const embed = new EmbedBuilder()
  .setTitle('Hello World!')
  .setDescription('This is a basic embed')
  .setColor(0x00AE86);

Rich Embed with All Features

const richEmbed = new EmbedBuilder()
  .setTitle('Server Statistics')
  .setDescription('Current server information and statistics')
  .setURL('https://discord.js.org')
  .setThumbnail('https://i.imgur.com/thumbnail.png')
  .setImage('https://i.imgur.com/image.png')
  .setTimestamp()
  .setColor('#0099ff')
  .setAuthor({
    name: 'Bot Name',
    iconURL: 'https://i.imgur.com/avatar.png',
    url: 'https://discord.js.org'
  })
  .setFooter({
    text: 'Footer text',
    iconURL: 'https://i.imgur.com/footer.png'
  })
  .addFields(
    { name: 'Online Users', value: '42', inline: true },
    { name: 'Total Members', value: '150', inline: true },
    { name: 'Server Boost Level', value: 'Level 2', inline: true },
    { name: 'Latest News', value: 'Check out our new features!' }
  );

Dynamic Fields

const statsEmbed = new EmbedBuilder()
  .setTitle('User Statistics')
  .setColor(0x00ff00);

// Add fields dynamically
const userStats = [
  { name: 'Messages Sent', value: '1,234', inline: true },
  { name: 'Voice Time', value: '12h 34m', inline: true },
  { name: 'Join Date', value: '2021-01-15', inline: true }
];

statsEmbed.addFields(...userStats);

// Modify existing fields
statsEmbed.spliceFields(1, 1, { 
  name: 'Voice Time (Updated)', 
  value: '15h 42m', 
  inline: true 
});

Color Variations

// Hex color
const hexEmbed = new EmbedBuilder()
  .setTitle('Hex Color')
  .setColor('#ff0000');

// RGB tuple
const rgbEmbed = new EmbedBuilder()
  .setTitle('RGB Color')
  .setColor([255, 0, 0]);

// Decimal color
const decimalEmbed = new EmbedBuilder()
  .setTitle('Decimal Color')
  .setColor(16711680);

// Remove color
const noColorEmbed = new EmbedBuilder()
  .setTitle('No Color')
  .setColor(null);

Timestamp Variations

// Current timestamp
const currentEmbed = new EmbedBuilder()
  .setTitle('Current Time')
  .setTimestamp();

// Specific date
const specificEmbed = new EmbedBuilder()
  .setTitle('Specific Date')
  .setTimestamp(new Date('2023-12-25'));

// Unix timestamp
const unixEmbed = new EmbedBuilder()
  .setTitle('Unix Timestamp')
  .setTimestamp(1640995200000);

// Remove timestamp
const noTimestampEmbed = new EmbedBuilder()
  .setTitle('No Timestamp')
  .setTimestamp(null);

Validation and Limits

The embed builder automatically validates data according to Discord's limits:

  • Title: Maximum 256 characters
  • Description: Maximum 4096 characters
  • Fields: Maximum 25 fields
  • Field Name: Maximum 256 characters
  • Field Value: Maximum 1024 characters
  • Footer Text: Maximum 2048 characters
  • Author Name: Maximum 256 characters
  • Total Embed Length: Maximum 6000 characters (combined across all text fields)

Utility Functions

embedLength

Calculate the total character length of an embed.

function embedLength(data: APIEmbed): number;

Usage:

import { EmbedBuilder, embedLength } from "@discordjs/builders";

const embed = new EmbedBuilder()
  .setTitle('Test Embed')
  .setDescription('This is a test embed')
  .addFields({ name: 'Field', value: 'Value' });

const length = embedLength(embed.toJSON());
console.log(`Embed length: ${length} characters`);

Install with Tessl CLI

npx tessl i tessl/npm-discordjs--builders

docs

assertions.md

components-v2.md

context-menu-commands.md

embeds.md

index.md

message-components.md

modals.md

select-menus.md

slash-commands.md

utilities.md

tile.json