@magicyan/discord 1.4.3 → 1.4.5

package/dist/functions/components/container.cjs

@@ -1,21 +1,17 @@
 'use strict';
 
-const core = require('@magicyan/core');
 const discord_js = require('discord.js');
-const selectmenu = require('../../guards/selectmenu.cjs');
 const attachment = require('../../guards/attachment.cjs');
+const selectmenu = require('../../guards/selectmenu.cjs');
 const gallery = require('./gallery.cjs');
-const text = require('./text.cjs');
 const row = require('./row.cjs');
+const text = require('./text.cjs');
 
-function createContainer(data) {
+function createContainer(data, ...components) {
   const container = new discord_js.ContainerBuilder();
-  data.accentColor && container.setAccentColor(
-    typeof data.accentColor === "string" ? data.accentColor in discord_js.Colors ? discord_js.Colors[data.accentColor] : core.hexToRgb(data.accentColor) : data.accentColor
-  );
-  for (const component of data.components) {
+  const addComponent = (component) => {
     if (!component)
-      continue;
+      return;
     if (typeof component === "string") {
       container.addTextDisplayComponents(
         text.createTextDisplay(component)
@@ -56,7 +52,23 @@ function createContainer(data) {
     if (component instanceof discord_js.SeparatorBuilder) {
       container.addSeparatorComponents(component);
     }
+  };
+  const setColor = (color) => {
+    container.setAccentColor(
+      discord_js.resolveColor(color)
+    );
+  };
+  const isContainerData = (value) => typeof value === "object" && "components" in value && Array.isArray(value.components);
+  if (isContainerData(data)) {
+    if (data.accentColor)
+      setColor(data.accentColor);
+    for (const component of data.components)
+      addComponent(component);
+    return container;
   }
+  setColor(data);
+  for (const component of components)
+    addComponent(component);
   return container;
 }
 

package/dist/functions/components/container.mjs

@@ -1,19 +1,15 @@
-import { hexToRgb } from '@magicyan/core';
-import { ContainerBuilder, Colors, TextDisplayBuilder, ActionRowBuilder, ButtonBuilder, SectionBuilder, FileBuilder, MediaGalleryBuilder, SeparatorBuilder } from 'discord.js';
-import { isAnySelectMenuBuilder } from '../../guards/selectmenu.mjs';
+import { ContainerBuilder, TextDisplayBuilder, ActionRowBuilder, ButtonBuilder, SectionBuilder, FileBuilder, MediaGalleryBuilder, SeparatorBuilder, resolveColor } from 'discord.js';
 import { isAttachment } from '../../guards/attachment.mjs';
+import { isAnySelectMenuBuilder } from '../../guards/selectmenu.mjs';
 import { createMediaGallery } from './gallery.mjs';
-import { createTextDisplay } from './text.mjs';
 import { createRow } from './row.mjs';
+import { createTextDisplay } from './text.mjs';
 
-function createContainer(data) {
+function createContainer(data, ...components) {
   const container = new ContainerBuilder();
-  data.accentColor && container.setAccentColor(
-    typeof data.accentColor === "string" ? data.accentColor in Colors ? Colors[data.accentColor] : hexToRgb(data.accentColor) : data.accentColor
-  );
-  for (const component of data.components) {
+  const addComponent = (component) => {
     if (!component)
-      continue;
+      return;
     if (typeof component === "string") {
       container.addTextDisplayComponents(
         createTextDisplay(component)
@@ -54,7 +50,23 @@ function createContainer(data) {
     if (component instanceof SeparatorBuilder) {
       container.addSeparatorComponents(component);
     }
+  };
+  const setColor = (color) => {
+    container.setAccentColor(
+      resolveColor(color)
+    );
+  };
+  const isContainerData = (value) => typeof value === "object" && "components" in value && Array.isArray(value.components);
+  if (isContainerData(data)) {
+    if (data.accentColor)
+      setColor(data.accentColor);
+    for (const component of data.components)
+      addComponent(component);
+    return container;
   }
+  setColor(data);
+  for (const component of components)
+    addComponent(component);
   return container;
 }
 

package/dist/functions/components/section.cjs

@@ -6,17 +6,33 @@ const thumbnail = require('./thumbnail.cjs');
 
 function createSection(data) {
   const section = new discord_js.SectionBuilder();
-  if (data.button) {
-    section.setButtonAccessory(data.button);
-  }
-  if (data.thumbnail) {
-    section.setThumbnailAccessory(
-      thumbnail.createThumbnail(data.thumbnail)
+  function setAccessory(data2) {
+    if (data2 instanceof discord_js.ButtonBuilder) {
+      return section.setButtonAccessory(data2);
+    }
+    if (data2 instanceof discord_js.ThumbnailBuilder) {
+      return section.setThumbnailAccessory(data2);
+    }
+    if (typeof data2 === "string") {
+      return section.setThumbnailAccessory(
+        thumbnail.createThumbnail(data2)
+      );
+    }
+    if ("media" in data2 || "description" in data2) {
+      return section.setThumbnailAccessory(
+        thumbnail.createThumbnail(data2)
+      );
+    }
+    return section.setButtonAccessory(
+      new discord_js.ButtonBuilder(data2)
     );
   }
+  if (data.accessory || data.button || data.thumbnail) {
+    setAccessory(data.accessory ?? data.button ?? data.thumbnail);
+  }
   if (Array.isArray(data.content)) {
     section.addTextDisplayComponents(
-      data.content.map(text.createTextDisplay)
+      data.content.map((text$1) => text.createTextDisplay(text$1))
     );
   } else {
     section.addTextDisplayComponents(

package/dist/functions/components/section.mjs

@@ -1,20 +1,36 @@
-import { SectionBuilder } from 'discord.js';
+import { SectionBuilder, ButtonBuilder, ThumbnailBuilder } from 'discord.js';
 import { createTextDisplay } from './text.mjs';
 import { createThumbnail } from './thumbnail.mjs';
 
 function createSection(data) {
   const section = new SectionBuilder();
-  if (data.button) {
-    section.setButtonAccessory(data.button);
-  }
-  if (data.thumbnail) {
-    section.setThumbnailAccessory(
-      createThumbnail(data.thumbnail)
+  function setAccessory(data2) {
+    if (data2 instanceof ButtonBuilder) {
+      return section.setButtonAccessory(data2);
+    }
+    if (data2 instanceof ThumbnailBuilder) {
+      return section.setThumbnailAccessory(data2);
+    }
+    if (typeof data2 === "string") {
+      return section.setThumbnailAccessory(
+        createThumbnail(data2)
+      );
+    }
+    if ("media" in data2 || "description" in data2) {
+      return section.setThumbnailAccessory(
+        createThumbnail(data2)
+      );
+    }
+    return section.setButtonAccessory(
+      new ButtonBuilder(data2)
     );
   }
+  if (data.accessory || data.button || data.thumbnail) {
+    setAccessory(data.accessory ?? data.button ?? data.thumbnail);
+  }
   if (Array.isArray(data.content)) {
     section.addTextDisplayComponents(
-      data.content.map(createTextDisplay)
+      data.content.map((text) => createTextDisplay(text))
     );
   } else {
     section.addTextDisplayComponents(

package/dist/index.d.cts

@@ -1,5 +1,5 @@
 import * as discord_js from 'discord.js';
-import { GatewayIntentBits, Partials, Attachment, AttachmentBuilder, EmbedAssetData, Guild, GuildMember, User, ClientUser, ImageURLOptions, EmbedFooterData, ColorResolvable, APIEmbed, Embed, EmbedData, EmbedBuilder, AttachmentData, ButtonBuilder, LinkButtonComponentData, AnyComponentBuilder, ActionRowBuilder, FileBuilder, APIUnfurledMediaItem, MediaGalleryBuilder, MediaGalleryItemData, SeparatorBuilder, ThumbnailComponentData, ThumbnailBuilder, SectionBuilder, TextDisplayBuilder, MessageActionRowComponentBuilder, ContainerBuilder, Colors, ContainerComponentData, RGBTuple, ChannelType, CommandInteractionOption, Client, ApplicationCommand, TextInputBuilder, ModalSubmitInteraction, ModalSubmitFields, Collection, TextInputComponent, TextInputStyle, TextInputComponentData, GuildEmoji, GuildTextBasedChannel, Message, Role, WebhookClientOptions, WebhookClient, WebhookClientData, StringSelectMenuBuilder, UserSelectMenuBuilder, RoleSelectMenuBuilder, ChannelSelectMenuBuilder, MentionableSelectMenuBuilder } from 'discord.js';
+import { GatewayIntentBits, Partials, Attachment, AttachmentBuilder, EmbedAssetData, Guild, GuildMember, User, ClientUser, ImageURLOptions, EmbedFooterData, ColorResolvable, APIEmbed, Embed, EmbedData, EmbedBuilder, AttachmentData, ButtonBuilder, LinkButtonComponentData, AnyComponentBuilder, ActionRowBuilder, FileBuilder, APIUnfurledMediaItem, MediaGalleryBuilder, MediaGalleryItemData, SeparatorBuilder, ThumbnailComponentData, ThumbnailBuilder, ButtonComponentData, SectionBuilder, TextDisplayBuilder, MessageActionRowComponentBuilder, ContainerBuilder, ContainerComponentData, ChannelType, CommandInteractionOption, Client, ApplicationCommand, TextInputBuilder, ModalSubmitInteraction, ModalSubmitFields, Collection, TextInputComponent, TextInputStyle, TextInputComponentData, GuildEmoji, GuildTextBasedChannel, Message, Role, WebhookClientOptions, WebhookClient, WebhookClientData, StringSelectMenuBuilder, UserSelectMenuBuilder, RoleSelectMenuBuilder, ChannelSelectMenuBuilder, MentionableSelectMenuBuilder } from 'discord.js';
 export * from '@magicyan/core';
 
 declare const chars: {
@@ -322,14 +322,23 @@ type ThumbnailData = Partial<Omit<ThumbnailComponentData, "type">> | Attachment
  */
 declare function createThumbnail(data: ThumbnailData): ThumbnailBuilder;
 
-type SectionAcessoryData = {
+type SectionThumbnailAccessory = ThumbnailBuilder | ThumbnailData;
+type SectionButtonAccessory = ButtonBuilder | Partial<ButtonComponentData>;
+type SectionAccessory = SectionThumbnailAccessory | SectionButtonAccessory;
+type SectionAccessoryData = {
+    accessory: SectionAccessory;
     button?: never;
-    thumbnail: ThumbnailData;
+    thumbnail?: never;
 } | {
-    button: ButtonBuilder;
+    button: SectionButtonAccessory;
     thumbnail?: never;
+    accessory?: never;
+} | {
+    thumbnail: SectionThumbnailAccessory;
+    button?: never;
+    accessory?: never;
 };
-type SectionData = SectionAcessoryData & {
+type SectionData = SectionAccessoryData & {
     content: string | string[];
 };
 /**
@@ -396,71 +405,58 @@ declare function createSection(data: SectionData): SectionBuilder;
  */
 declare function createTextDisplay(content: string, id?: number): TextDisplayBuilder;
 
-type ComponentData = TextDisplayBuilder | SeparatorBuilder | FileBuilder | SectionBuilder | MediaGalleryBuilder | ActionRowBuilder<MessageActionRowComponentBuilder> | MessageActionRowComponentBuilder[] | MessageActionRowComponentBuilder | AttachmentBuilder | AttachmentBuilder | string | null | undefined;
-declare function createComponents(...data: (ComponentData | ContainerBuilder)[]): (TextDisplayBuilder | SeparatorBuilder | ContainerBuilder | FileBuilder | SectionBuilder | MediaGalleryBuilder | ActionRowBuilder<MessageActionRowComponentBuilder>)[];
+type ComponentData = TextDisplayBuilder | SeparatorBuilder | FileBuilder | SectionBuilder | MediaGalleryBuilder | ActionRowBuilder<MessageActionRowComponentBuilder> | MessageActionRowComponentBuilder[] | MessageActionRowComponentBuilder | Attachment | AttachmentBuilder | string | null | undefined;
+declare function createComponents(...data: (ComponentData | ContainerBuilder)[]): (TextDisplayBuilder | SeparatorBuilder | FileBuilder | SectionBuilder | MediaGalleryBuilder | ActionRowBuilder<MessageActionRowComponentBuilder> | ContainerBuilder)[];
 
-type PresetColor = keyof typeof Colors;
+type ContainerColor = (string & {}) | ColorResolvable;
 interface ContainerData extends Omit<ContainerComponentData, "accentColor" | "type" | "components"> {
-    accentColor?: (string & {}) | number | null | RGBTuple | PresetColor;
+    accentColor?: ContainerColor;
     components: ComponentData[];
 }
 /**
- * Creates a {@link ContainerBuilder} component with customizable accent color and components.
+ * Creates a {@link ContainerBuilder} component with optional accent color and a set of child components.
  *
- * This function generates a container that can include various components such as text displays, action rows,
- * buttons, media galleries, and more. The container also allows for setting an accent color, which can be
- * either a string (hex color), a number, a predefined color, or an RGB tuple.
+ * This function can be used in two ways:
+ * 1. By passing an object with `accentColor` and `components` properties.
+ * 2. By passing the `accentColor` directly followed by a list of components.
  *
- * **Parameters:**
- * - `accentColor` (optional): The accent color for the container. This can be:
- *   - A hexadecimal color code (string) such as `"#ff5733"`.
- *   - A numeric value representing the color.
- *   - An {@link RGBTuple} (an array of three numbers representing RGB values).
- *   - A predefined color from the {@link Colors} enum (e.g., `Colors.Red`).
- * - `components`: An array of components that can be added to the container. These components can be:
- *   - {@link TextDisplayBuilder}, a string, {@link ActionRowBuilder}, {@link ButtonBuilder},
- *   - {@link SectionBuilder}, {@link MediaGalleryBuilder}, {@link FileBuilder}, or
- *   - {@link SeparatorBuilder}. Attachments are also accepted and will be handled as media galleries.
+ * The container can include various types of components such as:
+ * - `string` (converted to `TextDisplayBuilder`)
+ * - {@link TextDisplayBuilder}
+ * - {@link ActionRowBuilder}
+ * - Arrays of components (converted to an action row)
+ * - {@link ButtonBuilder}
+ * - {@link SectionBuilder}
+ * - {@link MediaGalleryBuilder}
+ * - {@link FileBuilder}
+ * - {@link SeparatorBuilder}
+ * - Discord attachments (treated as media galleries)
  *
- * @param data - An object containing the properties `accentColor` and `components` for configuring the container.
+ * @param data - Either a `ContainerData` object containing `accentColor` and `components`, or the accent color directly.
+ * @param components - When using the overload with accent color as the first parameter, this is the list of components to include in the container.
  *
- * @returns A {@link ContainerBuilder} instance with the specified configuration.
+ * @returns A {@link ContainerBuilder} instance with all components and styles applied.
  *
  * @example
- * // Creating a container with an accent color and a text display component
+ * // Using ContainerData object
  * const container = createContainer({
- *   accentColor: "#ff5733", // Hex color code
- *   components: [
- *     "This is a text display component"
- *   ]
+ *   accentColor: "#ff5733",
+ *   components: ["Welcome to the app!"]
  * });
  *
  * @example
- * // Creating a container with predefined color and an action row containing a button
- * const container = createContainer({
- *   accentColor: Colors.Green, // Predefined color from Colors enum
- *   components: [
- *       createSection({
- *          content: "-# Increment counter",
- *          button: new ButtonBuilder({
- *              customId: `counter/increment`,
- *              label: "+",
- *              style: ButtonStyle.Success
- *          })
- *      }),
- *   ]
- * });
+ * // Using color and components as separate arguments
+ * const container = createContainer("Red",
+ *   new TextDisplayBuilder().setText("Alert!"),
+ *   new SeparatorBuilder()
+ * );
  *
  * @example
- * // Creating a container with an RGB tuple as the accent color
- * const container = createContainer({
- *   accentColor: [255, 87, 51], // RGB tuple
- *   components: [
- *     "Here's some content."
- *   ]
- * });
+ * // Using RGB tuple
+ * const container = createContainer([255, 0, 0], "Red alert");
  */
 declare function createContainer(data: ContainerData): ContainerBuilder;
+declare function createContainer(data: ColorResolvable | string, ...components: ComponentData[]): ContainerBuilder;
 
 type GuildChannelType = Exclude<ChannelType, ChannelType.DM>;
 type FindChannelFilter<T extends GuildChannelType> = (channel: GetChannelType<T>) => boolean;
@@ -598,4 +594,4 @@ declare function isAnySelectMenuBuilder(value: unknown): value is AnySelectMenuB
 declare function isButtonBuilder(value: unknown): value is ButtonBuilder;
 
 export { CustomItents, CustomPartials, EmbedLimit, EmbedPlusBuilder, chars, commandMention, createComponents, createContainer, createEmbed, createEmbedAsset, createEmbedAuthor, createEmbedFiles, createEmbedFooter, createFile, createLinkButton, createMediaGallery, createModalFields, createModalInput, createRow, createSection, createSeparator, createTextDisplay, createThumbnail, createWebhookClient, extractMentionId, findChannel, findCommand, findEmoji, findMember, findMessage, findRole, getChannelUrlInfo, getMessageUrlInfo, isAnySelectMenuBuilder, isAttachment, isButtonBuilder, modalFieldsToRecord, setMobileStatus };
-export type { AnyEmbedData, AnySelectMenuBuilder, ComponentData, ContainerData, EmbedPlusAssetData, EmbedPlusAuthorData, EmbedPlusColorData, EmbedPlusData, EmbedPlusFooterData, EmbedPlusProperty, PresetColor, SectionAcessoryData, SectionData, SeparatorData, ThumbnailData };
+export type { AnyEmbedData, AnySelectMenuBuilder, ComponentData, ContainerColor, ContainerData, EmbedPlusAssetData, EmbedPlusAuthorData, EmbedPlusColorData, EmbedPlusData, EmbedPlusFooterData, EmbedPlusProperty, SectionAccessory, SectionAccessoryData, SectionButtonAccessory, SectionData, SectionThumbnailAccessory, SeparatorData, ThumbnailData };

package/dist/index.d.mts

@@ -1,5 +1,5 @@
 import * as discord_js from 'discord.js';
-import { GatewayIntentBits, Partials, Attachment, AttachmentBuilder, EmbedAssetData, Guild, GuildMember, User, ClientUser, ImageURLOptions, EmbedFooterData, ColorResolvable, APIEmbed, Embed, EmbedData, EmbedBuilder, AttachmentData, ButtonBuilder, LinkButtonComponentData, AnyComponentBuilder, ActionRowBuilder, FileBuilder, APIUnfurledMediaItem, MediaGalleryBuilder, MediaGalleryItemData, SeparatorBuilder, ThumbnailComponentData, ThumbnailBuilder, SectionBuilder, TextDisplayBuilder, MessageActionRowComponentBuilder, ContainerBuilder, Colors, ContainerComponentData, RGBTuple, ChannelType, CommandInteractionOption, Client, ApplicationCommand, TextInputBuilder, ModalSubmitInteraction, ModalSubmitFields, Collection, TextInputComponent, TextInputStyle, TextInputComponentData, GuildEmoji, GuildTextBasedChannel, Message, Role, WebhookClientOptions, WebhookClient, WebhookClientData, StringSelectMenuBuilder, UserSelectMenuBuilder, RoleSelectMenuBuilder, ChannelSelectMenuBuilder, MentionableSelectMenuBuilder } from 'discord.js';
+import { GatewayIntentBits, Partials, Attachment, AttachmentBuilder, EmbedAssetData, Guild, GuildMember, User, ClientUser, ImageURLOptions, EmbedFooterData, ColorResolvable, APIEmbed, Embed, EmbedData, EmbedBuilder, AttachmentData, ButtonBuilder, LinkButtonComponentData, AnyComponentBuilder, ActionRowBuilder, FileBuilder, APIUnfurledMediaItem, MediaGalleryBuilder, MediaGalleryItemData, SeparatorBuilder, ThumbnailComponentData, ThumbnailBuilder, ButtonComponentData, SectionBuilder, TextDisplayBuilder, MessageActionRowComponentBuilder, ContainerBuilder, ContainerComponentData, ChannelType, CommandInteractionOption, Client, ApplicationCommand, TextInputBuilder, ModalSubmitInteraction, ModalSubmitFields, Collection, TextInputComponent, TextInputStyle, TextInputComponentData, GuildEmoji, GuildTextBasedChannel, Message, Role, WebhookClientOptions, WebhookClient, WebhookClientData, StringSelectMenuBuilder, UserSelectMenuBuilder, RoleSelectMenuBuilder, ChannelSelectMenuBuilder, MentionableSelectMenuBuilder } from 'discord.js';
 export * from '@magicyan/core';
 
 declare const chars: {
@@ -322,14 +322,23 @@ type ThumbnailData = Partial<Omit<ThumbnailComponentData, "type">> | Attachment
  */
 declare function createThumbnail(data: ThumbnailData): ThumbnailBuilder;
 
-type SectionAcessoryData = {
+type SectionThumbnailAccessory = ThumbnailBuilder | ThumbnailData;
+type SectionButtonAccessory = ButtonBuilder | Partial<ButtonComponentData>;
+type SectionAccessory = SectionThumbnailAccessory | SectionButtonAccessory;
+type SectionAccessoryData = {
+    accessory: SectionAccessory;
     button?: never;
-    thumbnail: ThumbnailData;
+    thumbnail?: never;
 } | {
-    button: ButtonBuilder;
+    button: SectionButtonAccessory;
     thumbnail?: never;
+    accessory?: never;
+} | {
+    thumbnail: SectionThumbnailAccessory;
+    button?: never;
+    accessory?: never;
 };
-type SectionData = SectionAcessoryData & {
+type SectionData = SectionAccessoryData & {
     content: string | string[];
 };
 /**
@@ -396,71 +405,58 @@ declare function createSection(data: SectionData): SectionBuilder;
  */
 declare function createTextDisplay(content: string, id?: number): TextDisplayBuilder;
 
-type ComponentData = TextDisplayBuilder | SeparatorBuilder | FileBuilder | SectionBuilder | MediaGalleryBuilder | ActionRowBuilder<MessageActionRowComponentBuilder> | MessageActionRowComponentBuilder[] | MessageActionRowComponentBuilder | AttachmentBuilder | AttachmentBuilder | string | null | undefined;
-declare function createComponents(...data: (ComponentData | ContainerBuilder)[]): (TextDisplayBuilder | SeparatorBuilder | ContainerBuilder | FileBuilder | SectionBuilder | MediaGalleryBuilder | ActionRowBuilder<MessageActionRowComponentBuilder>)[];
+type ComponentData = TextDisplayBuilder | SeparatorBuilder | FileBuilder | SectionBuilder | MediaGalleryBuilder | ActionRowBuilder<MessageActionRowComponentBuilder> | MessageActionRowComponentBuilder[] | MessageActionRowComponentBuilder | Attachment | AttachmentBuilder | string | null | undefined;
+declare function createComponents(...data: (ComponentData | ContainerBuilder)[]): (TextDisplayBuilder | SeparatorBuilder | FileBuilder | SectionBuilder | MediaGalleryBuilder | ActionRowBuilder<MessageActionRowComponentBuilder> | ContainerBuilder)[];
 
-type PresetColor = keyof typeof Colors;
+type ContainerColor = (string & {}) | ColorResolvable;
 interface ContainerData extends Omit<ContainerComponentData, "accentColor" | "type" | "components"> {
-    accentColor?: (string & {}) | number | null | RGBTuple | PresetColor;
+    accentColor?: ContainerColor;
     components: ComponentData[];
 }
 /**
- * Creates a {@link ContainerBuilder} component with customizable accent color and components.
+ * Creates a {@link ContainerBuilder} component with optional accent color and a set of child components.
  *
- * This function generates a container that can include various components such as text displays, action rows,
- * buttons, media galleries, and more. The container also allows for setting an accent color, which can be
- * either a string (hex color), a number, a predefined color, or an RGB tuple.
+ * This function can be used in two ways:
+ * 1. By passing an object with `accentColor` and `components` properties.
+ * 2. By passing the `accentColor` directly followed by a list of components.
  *
- * **Parameters:**
- * - `accentColor` (optional): The accent color for the container. This can be:
- *   - A hexadecimal color code (string) such as `"#ff5733"`.
- *   - A numeric value representing the color.
- *   - An {@link RGBTuple} (an array of three numbers representing RGB values).
- *   - A predefined color from the {@link Colors} enum (e.g., `Colors.Red`).
- * - `components`: An array of components that can be added to the container. These components can be:
- *   - {@link TextDisplayBuilder}, a string, {@link ActionRowBuilder}, {@link ButtonBuilder},
- *   - {@link SectionBuilder}, {@link MediaGalleryBuilder}, {@link FileBuilder}, or
- *   - {@link SeparatorBuilder}. Attachments are also accepted and will be handled as media galleries.
+ * The container can include various types of components such as:
+ * - `string` (converted to `TextDisplayBuilder`)
+ * - {@link TextDisplayBuilder}
+ * - {@link ActionRowBuilder}
+ * - Arrays of components (converted to an action row)
+ * - {@link ButtonBuilder}
+ * - {@link SectionBuilder}
+ * - {@link MediaGalleryBuilder}
+ * - {@link FileBuilder}
+ * - {@link SeparatorBuilder}
+ * - Discord attachments (treated as media galleries)
  *
- * @param data - An object containing the properties `accentColor` and `components` for configuring the container.
+ * @param data - Either a `ContainerData` object containing `accentColor` and `components`, or the accent color directly.
+ * @param components - When using the overload with accent color as the first parameter, this is the list of components to include in the container.
  *
- * @returns A {@link ContainerBuilder} instance with the specified configuration.
+ * @returns A {@link ContainerBuilder} instance with all components and styles applied.
  *
  * @example
- * // Creating a container with an accent color and a text display component
+ * // Using ContainerData object
  * const container = createContainer({
- *   accentColor: "#ff5733", // Hex color code
- *   components: [
- *     "This is a text display component"
- *   ]
+ *   accentColor: "#ff5733",
+ *   components: ["Welcome to the app!"]
  * });
  *
  * @example
- * // Creating a container with predefined color and an action row containing a button
- * const container = createContainer({
- *   accentColor: Colors.Green, // Predefined color from Colors enum
- *   components: [
- *       createSection({
- *          content: "-# Increment counter",
- *          button: new ButtonBuilder({
- *              customId: `counter/increment`,
- *              label: "+",
- *              style: ButtonStyle.Success
- *          })
- *      }),
- *   ]
- * });
+ * // Using color and components as separate arguments
+ * const container = createContainer("Red",
+ *   new TextDisplayBuilder().setText("Alert!"),
+ *   new SeparatorBuilder()
+ * );
  *
  * @example
- * // Creating a container with an RGB tuple as the accent color
- * const container = createContainer({
- *   accentColor: [255, 87, 51], // RGB tuple
- *   components: [
- *     "Here's some content."
- *   ]
- * });
+ * // Using RGB tuple
+ * const container = createContainer([255, 0, 0], "Red alert");
  */
 declare function createContainer(data: ContainerData): ContainerBuilder;
+declare function createContainer(data: ColorResolvable | string, ...components: ComponentData[]): ContainerBuilder;
 
 type GuildChannelType = Exclude<ChannelType, ChannelType.DM>;
 type FindChannelFilter<T extends GuildChannelType> = (channel: GetChannelType<T>) => boolean;
@@ -598,4 +594,4 @@ declare function isAnySelectMenuBuilder(value: unknown): value is AnySelectMenuB
 declare function isButtonBuilder(value: unknown): value is ButtonBuilder;
 
 export { CustomItents, CustomPartials, EmbedLimit, EmbedPlusBuilder, chars, commandMention, createComponents, createContainer, createEmbed, createEmbedAsset, createEmbedAuthor, createEmbedFiles, createEmbedFooter, createFile, createLinkButton, createMediaGallery, createModalFields, createModalInput, createRow, createSection, createSeparator, createTextDisplay, createThumbnail, createWebhookClient, extractMentionId, findChannel, findCommand, findEmoji, findMember, findMessage, findRole, getChannelUrlInfo, getMessageUrlInfo, isAnySelectMenuBuilder, isAttachment, isButtonBuilder, modalFieldsToRecord, setMobileStatus };
-export type { AnyEmbedData, AnySelectMenuBuilder, ComponentData, ContainerData, EmbedPlusAssetData, EmbedPlusAuthorData, EmbedPlusColorData, EmbedPlusData, EmbedPlusFooterData, EmbedPlusProperty, PresetColor, SectionAcessoryData, SectionData, SeparatorData, ThumbnailData };
+export type { AnyEmbedData, AnySelectMenuBuilder, ComponentData, ContainerColor, ContainerData, EmbedPlusAssetData, EmbedPlusAuthorData, EmbedPlusColorData, EmbedPlusData, EmbedPlusFooterData, EmbedPlusProperty, SectionAccessory, SectionAccessoryData, SectionButtonAccessory, SectionData, SectionThumbnailAccessory, SeparatorData, ThumbnailData };

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as discord_js from 'discord.js';
-import { GatewayIntentBits, Partials, Attachment, AttachmentBuilder, EmbedAssetData, Guild, GuildMember, User, ClientUser, ImageURLOptions, EmbedFooterData, ColorResolvable, APIEmbed, Embed, EmbedData, EmbedBuilder, AttachmentData, ButtonBuilder, LinkButtonComponentData, AnyComponentBuilder, ActionRowBuilder, FileBuilder, APIUnfurledMediaItem, MediaGalleryBuilder, MediaGalleryItemData, SeparatorBuilder, ThumbnailComponentData, ThumbnailBuilder, SectionBuilder, TextDisplayBuilder, MessageActionRowComponentBuilder, ContainerBuilder, Colors, ContainerComponentData, RGBTuple, ChannelType, CommandInteractionOption, Client, ApplicationCommand, TextInputBuilder, ModalSubmitInteraction, ModalSubmitFields, Collection, TextInputComponent, TextInputStyle, TextInputComponentData, GuildEmoji, GuildTextBasedChannel, Message, Role, WebhookClientOptions, WebhookClient, WebhookClientData, StringSelectMenuBuilder, UserSelectMenuBuilder, RoleSelectMenuBuilder, ChannelSelectMenuBuilder, MentionableSelectMenuBuilder } from 'discord.js';
+import { GatewayIntentBits, Partials, Attachment, AttachmentBuilder, EmbedAssetData, Guild, GuildMember, User, ClientUser, ImageURLOptions, EmbedFooterData, ColorResolvable, APIEmbed, Embed, EmbedData, EmbedBuilder, AttachmentData, ButtonBuilder, LinkButtonComponentData, AnyComponentBuilder, ActionRowBuilder, FileBuilder, APIUnfurledMediaItem, MediaGalleryBuilder, MediaGalleryItemData, SeparatorBuilder, ThumbnailComponentData, ThumbnailBuilder, ButtonComponentData, SectionBuilder, TextDisplayBuilder, MessageActionRowComponentBuilder, ContainerBuilder, ContainerComponentData, ChannelType, CommandInteractionOption, Client, ApplicationCommand, TextInputBuilder, ModalSubmitInteraction, ModalSubmitFields, Collection, TextInputComponent, TextInputStyle, TextInputComponentData, GuildEmoji, GuildTextBasedChannel, Message, Role, WebhookClientOptions, WebhookClient, WebhookClientData, StringSelectMenuBuilder, UserSelectMenuBuilder, RoleSelectMenuBuilder, ChannelSelectMenuBuilder, MentionableSelectMenuBuilder } from 'discord.js';
 export * from '@magicyan/core';
 
 declare const chars: {
@@ -322,14 +322,23 @@ type ThumbnailData = Partial<Omit<ThumbnailComponentData, "type">> | Attachment
  */
 declare function createThumbnail(data: ThumbnailData): ThumbnailBuilder;
 
-type SectionAcessoryData = {
+type SectionThumbnailAccessory = ThumbnailBuilder | ThumbnailData;
+type SectionButtonAccessory = ButtonBuilder | Partial<ButtonComponentData>;
+type SectionAccessory = SectionThumbnailAccessory | SectionButtonAccessory;
+type SectionAccessoryData = {
+    accessory: SectionAccessory;
     button?: never;
-    thumbnail: ThumbnailData;
+    thumbnail?: never;
 } | {
-    button: ButtonBuilder;
+    button: SectionButtonAccessory;
     thumbnail?: never;
+    accessory?: never;
+} | {
+    thumbnail: SectionThumbnailAccessory;
+    button?: never;
+    accessory?: never;
 };
-type SectionData = SectionAcessoryData & {
+type SectionData = SectionAccessoryData & {
     content: string | string[];
 };
 /**
@@ -396,71 +405,58 @@ declare function createSection(data: SectionData): SectionBuilder;
  */
 declare function createTextDisplay(content: string, id?: number): TextDisplayBuilder;
 
-type ComponentData = TextDisplayBuilder | SeparatorBuilder | FileBuilder | SectionBuilder | MediaGalleryBuilder | ActionRowBuilder<MessageActionRowComponentBuilder> | MessageActionRowComponentBuilder[] | MessageActionRowComponentBuilder | AttachmentBuilder | AttachmentBuilder | string | null | undefined;
-declare function createComponents(...data: (ComponentData | ContainerBuilder)[]): (TextDisplayBuilder | SeparatorBuilder | ContainerBuilder | FileBuilder | SectionBuilder | MediaGalleryBuilder | ActionRowBuilder<MessageActionRowComponentBuilder>)[];
+type ComponentData = TextDisplayBuilder | SeparatorBuilder | FileBuilder | SectionBuilder | MediaGalleryBuilder | ActionRowBuilder<MessageActionRowComponentBuilder> | MessageActionRowComponentBuilder[] | MessageActionRowComponentBuilder | Attachment | AttachmentBuilder | string | null | undefined;
+declare function createComponents(...data: (ComponentData | ContainerBuilder)[]): (TextDisplayBuilder | SeparatorBuilder | FileBuilder | SectionBuilder | MediaGalleryBuilder | ActionRowBuilder<MessageActionRowComponentBuilder> | ContainerBuilder)[];
 
-type PresetColor = keyof typeof Colors;
+type ContainerColor = (string & {}) | ColorResolvable;
 interface ContainerData extends Omit<ContainerComponentData, "accentColor" | "type" | "components"> {
-    accentColor?: (string & {}) | number | null | RGBTuple | PresetColor;
+    accentColor?: ContainerColor;
     components: ComponentData[];
 }
 /**
- * Creates a {@link ContainerBuilder} component with customizable accent color and components.
+ * Creates a {@link ContainerBuilder} component with optional accent color and a set of child components.
  *
- * This function generates a container that can include various components such as text displays, action rows,
- * buttons, media galleries, and more. The container also allows for setting an accent color, which can be
- * either a string (hex color), a number, a predefined color, or an RGB tuple.
+ * This function can be used in two ways:
+ * 1. By passing an object with `accentColor` and `components` properties.
+ * 2. By passing the `accentColor` directly followed by a list of components.
  *
- * **Parameters:**
- * - `accentColor` (optional): The accent color for the container. This can be:
- *   - A hexadecimal color code (string) such as `"#ff5733"`.
- *   - A numeric value representing the color.
- *   - An {@link RGBTuple} (an array of three numbers representing RGB values).
- *   - A predefined color from the {@link Colors} enum (e.g., `Colors.Red`).
- * - `components`: An array of components that can be added to the container. These components can be:
- *   - {@link TextDisplayBuilder}, a string, {@link ActionRowBuilder}, {@link ButtonBuilder},
- *   - {@link SectionBuilder}, {@link MediaGalleryBuilder}, {@link FileBuilder}, or
- *   - {@link SeparatorBuilder}. Attachments are also accepted and will be handled as media galleries.
+ * The container can include various types of components such as:
+ * - `string` (converted to `TextDisplayBuilder`)
+ * - {@link TextDisplayBuilder}
+ * - {@link ActionRowBuilder}
+ * - Arrays of components (converted to an action row)
+ * - {@link ButtonBuilder}
+ * - {@link SectionBuilder}
+ * - {@link MediaGalleryBuilder}
+ * - {@link FileBuilder}
+ * - {@link SeparatorBuilder}
+ * - Discord attachments (treated as media galleries)
  *
- * @param data - An object containing the properties `accentColor` and `components` for configuring the container.
+ * @param data - Either a `ContainerData` object containing `accentColor` and `components`, or the accent color directly.
+ * @param components - When using the overload with accent color as the first parameter, this is the list of components to include in the container.
  *
- * @returns A {@link ContainerBuilder} instance with the specified configuration.
+ * @returns A {@link ContainerBuilder} instance with all components and styles applied.
  *
  * @example
- * // Creating a container with an accent color and a text display component
+ * // Using ContainerData object
  * const container = createContainer({
- *   accentColor: "#ff5733", // Hex color code
- *   components: [
- *     "This is a text display component"
- *   ]
+ *   accentColor: "#ff5733",
+ *   components: ["Welcome to the app!"]
  * });
  *
  * @example
- * // Creating a container with predefined color and an action row containing a button
- * const container = createContainer({
- *   accentColor: Colors.Green, // Predefined color from Colors enum
- *   components: [
- *       createSection({
- *          content: "-# Increment counter",
- *          button: new ButtonBuilder({
- *              customId: `counter/increment`,
- *              label: "+",
- *              style: ButtonStyle.Success
- *          })
- *      }),
- *   ]
- * });
+ * // Using color and components as separate arguments
+ * const container = createContainer("Red",
+ *   new TextDisplayBuilder().setText("Alert!"),
+ *   new SeparatorBuilder()
+ * );
  *
  * @example
- * // Creating a container with an RGB tuple as the accent color
- * const container = createContainer({
- *   accentColor: [255, 87, 51], // RGB tuple
- *   components: [
- *     "Here's some content."
- *   ]
- * });
+ * // Using RGB tuple
+ * const container = createContainer([255, 0, 0], "Red alert");
  */
 declare function createContainer(data: ContainerData): ContainerBuilder;
+declare function createContainer(data: ColorResolvable | string, ...components: ComponentData[]): ContainerBuilder;
 
 type GuildChannelType = Exclude<ChannelType, ChannelType.DM>;
 type FindChannelFilter<T extends GuildChannelType> = (channel: GetChannelType<T>) => boolean;
@@ -598,4 +594,4 @@ declare function isAnySelectMenuBuilder(value: unknown): value is AnySelectMenuB
 declare function isButtonBuilder(value: unknown): value is ButtonBuilder;
 
 export { CustomItents, CustomPartials, EmbedLimit, EmbedPlusBuilder, chars, commandMention, createComponents, createContainer, createEmbed, createEmbedAsset, createEmbedAuthor, createEmbedFiles, createEmbedFooter, createFile, createLinkButton, createMediaGallery, createModalFields, createModalInput, createRow, createSection, createSeparator, createTextDisplay, createThumbnail, createWebhookClient, extractMentionId, findChannel, findCommand, findEmoji, findMember, findMessage, findRole, getChannelUrlInfo, getMessageUrlInfo, isAnySelectMenuBuilder, isAttachment, isButtonBuilder, modalFieldsToRecord, setMobileStatus };
-export type { AnyEmbedData, AnySelectMenuBuilder, ComponentData, ContainerData, EmbedPlusAssetData, EmbedPlusAuthorData, EmbedPlusColorData, EmbedPlusData, EmbedPlusFooterData, EmbedPlusProperty, PresetColor, SectionAcessoryData, SectionData, SeparatorData, ThumbnailData };
+export type { AnyEmbedData, AnySelectMenuBuilder, ComponentData, ContainerColor, ContainerData, EmbedPlusAssetData, EmbedPlusAuthorData, EmbedPlusColorData, EmbedPlusData, EmbedPlusFooterData, EmbedPlusProperty, SectionAccessory, SectionAccessoryData, SectionButtonAccessory, SectionData, SectionThumbnailAccessory, SeparatorData, ThumbnailData };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@magicyan/discord",
-  "version": "1.4.3",
+  "version": "1.4.5",
   "description": "Simple functions to facilitate discord bot development",
   "license": "MIT",
   "type": "module",
@@ -49,6 +49,6 @@
     "vitest": "^2.1.9"
   },
   "dependencies": {
-    "@magicyan/core": "^1.0.21"
+    "@magicyan/core": "^1.1.0"
   }
 }