docs(builders/components): document constructors (#8636)

discordjs · Sep 19, 2022 · 8444576 · 8444576
1 parent 6d43e26
commit 8444576
Show file tree

Hide file tree

Showing 5 changed files with 119 additions and 7 deletions.
diff --git a/packages/builders/src/components/ActionRow.ts b/packages/builders/src/components/ActionRow.ts
@@ -1,3 +1,5 @@
+/* eslint-disable jsdoc/check-param-names */
+
 import {
 	type APIActionRowComponent,
 	ComponentType,
@@ -33,6 +35,40 @@ export class ActionRowBuilder<T extends AnyComponentBuilder> extends ComponentBu
 	 */
 	public readonly components: T[];
 
+	/**
+	 * Creates a new action row from API data
+	 *
+	 * @param data - The API data to create this action row with
+	 * @example
+	 * Creating an action row from an API data object
+	 * ```ts
+	 * const actionRow = new ActionRowBuilder({
+	 * 	components: [
+	 * 		{
+	 * 			custom_id: "custom id",
+	 * 			label: "Type something",
+	 * 			style: TextInputStyle.Short,
+	 * 			type: ComponentType.TextInput,
+	 * 		},
+	 * 	],
+	 * });
+	 * ```
+	 * @example
+	 * Creating an action row using setters and API data
+	 * ```ts
+	 * const actionRow = new ActionRowBuilder({
+	 * 	components: [
+	 * 		{
+	 * 			custom_id: "custom id",
+	 * 			label: "Click me",
+	 * 			style: ButtonStyle.Primary,
+	 * 			type: ComponentType.Button,
+	 * 		},
+	 * 	],
+	 * })
+	 * 	.addComponents(button2, button3);
+	 * ```
+	 */
 	public constructor({ components, ...data }: Partial<APIActionRowComponent<APIActionRowComponentTypes>> = {}) {
 		super({ type: ComponentType.ActionRow, ...data });
 		this.components = (components?.map((component) => createComponentBuilder(component)) ?? []) as T[];

diff --git a/packages/builders/src/components/button/Button.ts b/packages/builders/src/components/button/Button.ts
@@ -29,24 +29,24 @@ export class ButtonBuilder extends ComponentBuilder<APIButtonComponent> {
 	 * Creating a button from an API data object
 	 * ```ts
 	 * const button = new ButtonBuilder({
-	 * 	style: 'primary',
+	 * 	custom_id: 'a cool button',
+	 * 	style: ButtonStyle.Primary,
 	 * 	label: 'Click Me',
 	 * 	emoji: {
-	 * 		name: ':smile:',
-	 * 		id: '12345678901234567890123456789012',
+	 * 		name: 'smile',
+	 * 		id: '123456789012345678',
 	 * 	},
-	 *  custom_id: '12345678901234567890123456789012',
 	 * });
 	 * ```
 	 * @example
 	 * Creating a button using setters and API data
 	 * ```ts
 	 * const button = new ButtonBuilder({
-	 * 	style: 'primary',
+	 * 	style: ButtonStyle.Secondary,
 	 * 	label: 'Click Me',
 	 * })
-	 * .setEmoji({ name: ':smile:', id: '12345678901234567890123456789012' })
-	 * .setCustomId('12345678901234567890123456789012');
+	 * 	.setEmoji({ name: '🙂' })
+	 * 	.setCustomId('another cool button');
 	 * ```
 	 */
 	public constructor(data?: Partial<APIButtonComponent>) {

diff --git a/packages/builders/src/components/selectMenu/SelectMenu.ts b/packages/builders/src/components/selectMenu/SelectMenu.ts
@@ -21,6 +21,37 @@ export class SelectMenuBuilder extends ComponentBuilder<APISelectMenuComponent>
 	 */
 	public readonly options: SelectMenuOptionBuilder[];
 
+	/**
+	 * Creates a new select menu from API data
+	 *
+	 * @param data - The API data to create this select menu with
+	 * @example
+	 * Creating a select menu from an API data object
+	 * ```ts
+	 * const selectMenu = new SelectMenuBuilder({
+	 * 	custom_id: 'a cool select menu',
+	 * 	placeholder: 'select an option',
+	 * 	max_values: 2,
+	 * 	options: [
+	 * 		{ label: 'option 1', value: '1' },
+	 * 		{ label: 'option 2', value: '2' },
+	 * 		{ label: 'option 3', value: '3' },
+	 * 	],
+	 * });
+	 * ```
+	 * @example
+	 * Creating a select menu using setters and API data
+	 * ```ts
+	 * const selectMenu = new SelectMenuBuilder({
+	 * 	custom_id: 'a cool select menu',
+	 * })
+	 * 	.setMinValues(1)
+	 * 	.addOptions({
+	 * 		label: 'Catchy',
+	 * 		value: 'catch',
+	 * 	});
+	 * ```
+	 */
 	public constructor(data?: Partial<APISelectMenuComponent>) {
 		const { options, ...initData } = data ?? {};
 		super({ type: ComponentType.SelectMenu, ...initData });

diff --git a/packages/builders/src/components/selectMenu/SelectMenuOption.ts b/packages/builders/src/components/selectMenu/SelectMenuOption.ts
@@ -11,6 +11,28 @@ import {
  * Represents a option within a select menu component
  */
 export class SelectMenuOptionBuilder implements JSONEncodable<APISelectMenuOption> {
+	/**
+	 * Creates a new select menu option from API data
+	 *
+	 * @param data - The API data to create this select menu option with
+	 * @example
+	 * Creating a select menu option from an API data object
+	 * ```ts
+	 * const selectMenuOption = new SelectMenuOptionBuilder({
+	 * 	label: 'catchy label',
+	 * 	value: '1',
+	 * });
+	 * ```
+	 * @example
+	 * Creating a select menu option using setters and API data
+	 * ```ts
+	 * const selectMenuOption = new SelectMenuOptionBuilder({
+	 * 	default: true,
+	 * 	value: '1',
+	 * })
+	 * 	.setLabel('woah')
+	 * ```
+	 */
 	public constructor(public data: Partial<APISelectMenuOption> = {}) {}
 
 	/**

diff --git a/packages/builders/src/components/textInput/TextInput.ts b/packages/builders/src/components/textInput/TextInput.ts
@@ -19,6 +19,29 @@ export class TextInputBuilder
 	extends ComponentBuilder<APITextInputComponent>
 	implements Equatable<APITextInputComponent | JSONEncodable<APITextInputComponent>>
 {
+	/**
+	 * Creates a new text input from API data
+	 *
+	 * @param data - The API data to create this text input with
+	 * @example
+	 * Creating a select menu option from an API data object
+	 * ```ts
+	 * const textInput = new TextInputBuilder({
+	 * 	custom_id: 'a cool select menu',
+	 * 	label: 'Type something',
+	 * 	style: TextInputStyle.Short,
+	 * });
+	 * ```
+	 * @example
+	 * Creating a select menu option using setters and API data
+	 * ```ts
+	 * const textInput = new TextInputBuilder({
+	 * 	label: 'Type something else',
+	 * })
+	 * 	.setCustomId('woah')
+	 * 	.setStyle(TextInputStyle.Paragraph);
+	 * ```
+	 */
 	public constructor(data?: APITextInputComponent & { type?: ComponentType.TextInput }) {
 		super({ type: ComponentType.TextInput, ...data });
 	}