@dragonui/discord

Uma biblioteca de UI Components V2 para Discord.js, focada em liberdade total de criação, sem padrões engessados de título, descrição ou estrutura.

Aqui você monta a interface do seu jeito, bloco por bloco.

✨ Filosofia

• ✅ Components V2 first
• ✅ Nada forçado (sem title/description obrigatório)
• ✅ Tudo modular e independente
• ✅ API simples (create.text(), create.button(), etc)
• ✅ Compatível com discord.js@14+

📦 Instalação

npm install @dragonui/discord

> discord.js é dependência obrigatória:



npm install discord.js




🚀 Uso básico

const { create } = require("@dragonui/discord");

const ui = create.container([
  create.text("⚡ Painel Principal"),
  create.separator(),
  create.row([
    create.button({
      id: "start",
      label: "Iniciar",
      style: 1
    })
  ])
]);

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




🧱 API

create.container(components[])

Cria um ContainerBuilder.

create.container([
  create.text("Olá mundo")
])




create.text(content)

Cria um TextDisplayBuilder.

create.text("Texto livre")




create.separator(spacing?, divider?)

Cria um SeparatorBuilder.

create.separator("Small", true)




create.banner(urls[])

Cria um MediaGalleryBuilder.

create.banner([
  "https://imgur.com/a.png"
])




create.section({ texts[], thumbnail? })

Cria um SectionBuilder totalmente livre.

create.section({
  texts: [
    create.text("Linha 1"),
    create.text("Linha 2")
  ],
  thumbnail: "https://imgur.com/thumb.png"
})




create.button({ id, label?, emoji?, style?, disabled? })

Cria um botão.

create.button({
  id: "confirm",
  label: "Confirmar",
  emoji: "✅",
  style: 1
})




create.row(components[])

Cria uma ActionRowBuilder.

create.row([
  create.button({ id: "a", label: "A" }),
  create.button({ id: "b", label: "B" })
])



🧠 Extras

🟣 Embed (create.embed)

Embed opcional, sem interferir nos Components V2.

create.embed({
  description: "Mensagem informativa",
  color: 0x000000
})



🧾 Modal (create.modal)

Criação simples e controlada de modais.

create.modal({
  id: "login",
  title: "Login",
  inputs: [
    {
      customId: "email",
      label: "Email",
      style: 1,
      required: true
    }
  ]
});



📋 Select Menu (create.select)

Cria StringSelectMenuBuilder.

create.select({
  id: "plan",
  placeholder: "Escolha um plano",
  options: [
    { label: "Básico", value: "basic" },
    { label: "Pro", value: "pro" }
  ]
});



🧩 Componentes disponíveis

Container

Text

Separator

Banner (Media Gallery)

Section

Button

Row

Embed

Modal

Select Menu

🔥 Objetivo do projeto

O @dragonui/discord existe para facilitar a criação de interfaces modernas no Discord, sem limitar a criatividade do desenvolvedor.

Você decide o layout, a ordem e a experiência.


📄 Licença

MIT © Dragon