Guide

Embeds V2

Créez des messages Discord enrichis avec l'EmbedV2Builder.

Vue d'ensemble

glyria.js intègre un builder de première classe pour les Components V2 de Discord — le nouveau système de messages qui remplace les embeds classiques par une mise en page entièrement composable.

const embed = new EmbedV2Builder()
  .container({ accentColor: 0x5865F2 })
    .textDisplay("# Bonjour !")
    .textDisplay("Bienvenue sur le serveur.")
  .end()
  .build()

await ctx.reply({ ...embed })

Spreadez toujours .build() directement dans votre reply — pas dans embeds: [].

// ✅ correct
await ctx.reply({ ...embed })

// ❌ incorrect
await ctx.reply({ embeds: [embed] })

EmbedV2Builder est disponible globalement — aucun import nécessaire.

Container

Le container est le bloc de construction principal. Il enveloppe votre contenu et accepte une couleur d'accentuation optionnelle :

new EmbedV2Builder()
  .container({ accentColor: 0x5865F2 })
    .textDisplay("Contenu ici")
  .end()
  .build()

Option	Type	Description
`accentColor`	`number`	Couleur de la bordure gauche (hex en nombre)
`spoiler`	`boolean`	Floute le contenu jusqu'au clic

Text display

Ajoutez du texte markdown n'importe où dans un container :

.container()
  .textDisplay("# Titre")
  .textDisplay("Du texte en **gras** et en *italique*.")
.end()

Separator

Ajoutez un espacement visuel entre les sections :

.container()
  .textDisplay("Section une")
  .separator({ spacing: "large" })
  .textDisplay("Section deux")
.end()

Option	Valeurs	Description
`spacing`	`"small"` \| `"large"`	Taille de l'espacement
`divider`	`boolean`	Afficher une ligne de séparation

Section

Une section associe du texte à un accessoire (bouton ou miniature) sur le côté droit :

.container()
  .section()
    .textDisplay("Choisissez votre rôle")
    .buttonAccessory({ label: "Choisir", customId: "role_picker", style: "primary" })
  .end()
.end()

Avec une miniature :

.section()
  .textDisplay("Infos du serveur")
  .thumbnailAccessory("https://example.com/icon.png", "Icône du serveur")
.end()

Une section nécessite au moins un textDisplay et exactement un accessoire (buttonAccessory ou thumbnailAccessory). L'absence de l'un ou l'autre lèvera une erreur.

Action row

Ajoutez des boutons cliquables sous votre contenu :

.container()
  .textDisplay("Êtes-vous sûr ?")
  .actionRow()
    .button({ label: "Confirmer", customId: "confirm", style: "success" })
    .button({ label: "Annuler", customId: "cancel", style: "danger" })
  .end()
.end()

Styles de boutons

Style	Cas d'usage
`primary`	Action principale — nécessite `customId`
`secondary`	Action secondaire — nécessite `customId`
`success`	Action positive — nécessite `customId`
`danger`	Action destructive — nécessite `customId`
`link`	URL externe — nécessite `url`

Options des boutons

Option	Type	Description
`label`	`string`	Texte du bouton
`customId`	`string`	Identifiant pour la gestion des interactions
`style`	`string`	Style du bouton
`url`	`string`	URL pour les boutons de type link
`emoji`	`object`	Emoji du bouton
`disabled`	`boolean`	Désactiver le bouton

Media gallery

Affichez jusqu'à 10 images dans une grille :

.container()
  .textDisplay("Galerie")
  .mediaGallery([
    { url: "https://example.com/image1.png" },
    { url: "https://example.com/image2.png", description: "Une légende" },
  ])
.end()

File

Joignez un fichier au message :

.container()
  .file("attachment://rapport.pdf")
.end()

Plusieurs containers

Enchaînez plusieurs containers dans un seul message :

new EmbedV2Builder()
  .container({ accentColor: 0x57F287 })
    .textDisplay("✅ Action effectuée")
  .end()
  .separator()
  .container()
    .textDisplay("Voici les détails...")
    .actionRow()
      .button({ label: "Voir", customId: "view_details", style: "secondary" })
    .end()
  .end()
  .build()

Footer global

Si configuré dans glyria.config.ts, un footer est automatiquement ajouté à chaque container :

// glyria.config.ts
export default defineConfig({
  theme: {
    embedV2: {
      footer: { text: "Mon Bot • v1.0" }
    }
  }
})

Aucun code supplémentaire nécessaire dans vos commandes — glyria.js s'en charge automatiquement.

Exemple complet

export default new GlyriaCommand()
  .setName("config")
  .setDescription("Configuration du bot")
  .addSubCommandGroup((group) =>
    group
      .setName("logs")
      .setDescription("Configuration des logs")
      .addSubCommand((cmd) =>
        cmd
          .setName("update")
          .setDescription("Mettre à jour les paramètres des logs")
          .addBooleanOption((option) =>
            option
              .setName("enabled")
              .setDescription("Activer les logs")
              .setRequired(true)
          )
          .execute(async (ctx) => {
            const embed = new EmbedV2Builder()
              .container({ accentColor: 0x5865F2 })
                .textDisplay("Configuration des logs mise à jour !")
                .separator({ spacing: "large" })
                .section()
                  .textDisplay("Désactiver les logs")
                  .buttonAccessory({ label: "Désactiver", style: "link", url: "https://discord.com" })
                .end()
                .actionRow()
                  .button({ label: "Activer", style: "link", url: "https://discord.com" })
                .end()
              .end()
              .build()

            await ctx.reply({ ...embed })
          })
      )
  )

Éditer cette pageouSignaler un problème

Events

Écoutez les événements Discord avec GlyriaEvent.

GlyriaBus

Un bus d'événements typé avec support des middlewares pour votre bot Discord.