feat: components v2 in builders v1 (#10787)

* feat(builders): components v2 in builders v1 * feat: implemented the first components * fix: tests * fix: tests * fix: export the new stuff * feat: add rest of components * feat: add callback syntax * feat: callback syntax for section * fix: missing implements * fix: accessory property * fix: apply suggestions from v2 PR * chore: bring in line with builders v2 * fix: add missing type * chore: split accessory methods * chore: backport changes from v2 PR * fix: accent_color is nullish * fix: allow passing raw json to MediaGallery methods * fix: add test * chore: add Container#addXComponents * fix: docs * chore: bump discord-api-types * Update packages/builders/src/components/Assertions.ts Co-authored-by: Denis-Adrian Cristea <didinele.dev@gmail.com> --------- Co-authored-by: Denis-Adrian Cristea <didinele.dev@gmail.com>
2026-03-19 04:53:30 +01:00 · 2025-04-24 21:59:58 +02:00
parent 53dbc96194
commit 118e682682
31 changed files with 1955 additions and 120 deletions
--- a/packages/builders/src/components/v2/Thumbnail.ts
+++ b/packages/builders/src/components/v2/Thumbnail.ts
@@ -0,0 +1,86 @@
+import type { APIThumbnailComponent } from 'discord-api-types/v10';
+import { ComponentType } from 'discord-api-types/v10';
+import { ComponentBuilder } from '../Component';
+import { descriptionPredicate, spoilerPredicate, unfurledMediaItemPredicate } from './Assertions';
+
+export class ThumbnailBuilder extends ComponentBuilder<APIThumbnailComponent> {
+	/**
+	 * Creates a new thumbnail from API data.
+	 *
+	 * @param data - The API data to create this thumbnail with
+	 * @example
+	 * Creating a thumbnail from an API data object:
+	 * ```ts
+	 * const thumbnaik = new ThumbnailBuilder({
+	 * 	description: 'some text',
+	 *  media: {
+	 *      url: 'https://cdn.discordapp.com/embed/avatars/4.png',
+	 *  },
+	 * });
+	 * ```
+	 * @example
+	 * Creating a thumbnail using setters and API data:
+	 * ```ts
+	 * const thumbnail = new ThumbnailBuilder({
+	 * 	media: {
+	 *      url: 'attachment://image.png',
+	 *  },
+	 * })
+	 * 	.setDescription('alt text');
+	 * ```
+	 */
+	public constructor(data: Partial<APIThumbnailComponent> = {}) {
+		super({
+			type: ComponentType.Thumbnail,
+			...data,
+			media: data.media ? { url: data.media.url } : undefined,
+		});
+	}
+
+	/**
+	 * Sets the description of this thumbnail.
+	 *
+	 * @param description - The description to use
+	 */
+	public setDescription(description: string) {
+		this.data.description = descriptionPredicate.parse(description);
+		return this;
+	}
+
+	/**
+	 * Clears the description of this thumbnail.
+	 */
+	public clearDescription() {
+		this.data.description = undefined;
+		return this;
+	}
+
+	/**
+	 * Sets the spoiler status of this thumbnail.
+	 *
+	 * @param spoiler - The spoiler status to use
+	 */
+	public setSpoiler(spoiler = true) {
+		this.data.spoiler = spoilerPredicate.parse(spoiler);
+		return this;
+	}
+
+	/**
+	 * Sets the media URL of this thumbnail.
+	 *
+	 * @param url - The URL to use
+	 */
+	public setURL(url: string) {
+		this.data.media = unfurledMediaItemPredicate.parse({ url });
+		return this;
+	}
+
+	/**
+	 * {@inheritdoc ComponentBuilder.toJSON}
+	 */
+	public override toJSON(): APIThumbnailComponent {
+		unfurledMediaItemPredicate.parse(this.data.media);
+
+		return { ...this.data } as APIThumbnailComponent;
+	}
+}