AOI COMPONENTS V2

Bringing Discord Components V2 into the world of aoi.js!

ToC

• Introduction
• Installation
• Functions
• Example

Introduction

This package add extra functions to aoi.js allowing users to use components V2 of discord.

Caution

Using functions like $addButton instead of $addButtonComponent and the likes won't work for this package's $sendComponent. Basically it's better not to use any aoi.js functions inside it, except the database ones.

Also all these functions here would use the JSON structure of API and hence it's possible to directly supply the JSON but beware that any error in JSON will end up with Discord API Error as error handling is left to them to ease my work.

Installation

Install

npm i https://github.com/NanotechPikachu/aoi-components-v2

Index

const { initializeV2 } = require("aoi-components-v2");

const client = // AoiClient setup;

initializeV2(client); // to add the custom functions here

Functions

• $addButtonComponent

Syntax

$addButtonComponent[label?;style;customId?;disabled?;emoji?;url?]

Options

Option	Description	Required	Default
label	The text inside the button	false (if emoji is there), else true	No Value
style	Style of Button: PRIMARY, SECONDARY, DANGER, SUCCESS, LINK	true	No Value
customId	Custom ID for button	false (if URL) else true	No Value
disabled	Is button Disabled? false or true	false	false
emoji	Emoji inside button	false	No Value
url	URL if style of button is URL	true (if URL button) else false	No Value

---

• $addFileComponent

Syntax

$addFileComponent[url;spoiler?]

Options

Option	Description	Required	Default
url	URL attachment of file	true	No Value
spoiler	Does the file need to be enclosed in spoiler? true or false	false	false

Note

Even I am not entirely sure how this works but yeah, at least as per the discord.js docs, the syntax and everything is right. So, don't blame me!

---

• $addMediaComponent

Syntax

$addMediaComponent[...medias]

Options

Option	Description	Required	Default
medias	MediaItem components seperated by ";"	true	No Value

Note

You have to supply it either by the correct JSON as per discord API docs or supply with media generated by $addMediaItem

This is the function for the component of type MediaGallery as per API docs.

---

• $addMediaItem

Syntax

$addMediaItem[url;description?;alt?;spoiler?]

Options

Option	Description	Required	Default
url	Media URL	true	No Value
description	Media Description	false	No Value
alt	Media Alt Text	false	No Value
spoiler	Whether the media item must be enclosed in spoiler? true or false	false	false

---

• $addRowComponent

Syntax

$addRowComponent[...components]

Options

Option	Description	Required	Default
components	Components seperated by ";"	true	No Value

Note

It's the ActionRow of API. As such, it can hold only components of type Button and SelectMenu.

---

• $addSectionComponent

Syntax

$addSectionComponent[...components]

Options

Option	Description	Required	Default
components	Components seperated by ";"	true	No Value

Note

This is to create a Section in the Container. Each Section should have at least one TextDisplay and at most one Thumbnail or Button. Both of these are essential as per API docs. So there should be at least 2 components inserted in this function.

---

• $addSelectMenuComponent

Syntax

$addSelectMenuComponent[type;customId;placeholder;minValue?;maxValue?;...values]

Options

This is an exact replica of aoi.js' $addSelectMenu so, I'm not telling the params.

---

• $addSpacingComponent

Syntax

$addSpacingComponent[spacing?;divider?;id?]

Options

Option	Description	Required	Default
spacing	Spacing value - large or small	false	small
divider	Whether divider must be visible? true or false	false	true
id	Components ID	false	No Value

---

• $addTextComponent

Syntax

$addTextComponent[content;id?]

Options

Option	Description	Required	Default
content	Text Content	true	No Value
id	Components ID	false	No Value

---

• $addThumbnailComponent

Syntax

$addThumbnailComponent[url;description?;spoiler?]

Options

Option	Description	Required	Default
url	URL of thumbnail to be added	true	No Value
description	Description of thumbnail	false	No Value
spoiler	Whether to be enclosed in spoiler? true or false	false	false

Note

This is only to be used under (inside) Section component. Everywhere else will trigger a Discord API Error.

---

• $containerBuilder

Syntax

$containerBuilder[color?;spoiler?;...components]

Options

Option	Description	Required	Default
color	Accent color. Put Hex code without "#"	false	No Value
spoiler	Whether to be enclosed in spoiler? true or false	false	false
components	Components inside the container	true	No Value

Note

This can be API JSON structure or contain the functions available here!

---

• $sendComponent

Syntax

$sendComponent[...components]

Options

Option	Description	Required	Default
components	Components to be sent	true	No Value

Note

This is for Components V2 only!

Example

A simple one since I am too lazy lol.

$sendComponent[$containerBuilder[FF0000;false;$addSectionComponent[$addTextComponent[$username];$addThumbnailComponent[$useravatar]];$addSpacingComponent[small];$addRowComponent[$addButtonComponent[Hi;PRIMARY;yo;false]];$addSpacingComponent[large;false];$addMediaComponent[$addMediaItem[$useravatar]]]]