feat: Make message components great (#163)

* fix: mentionables defaults

* feat: make message api components great

* fix: add url to button link

package.json

@@ -5,9 +5,7 @@
 	"main": "./lib/index.js",
 	"module": "./lib/index.js",
 	"types": "./lib/index.d.ts",
-	"files": [
-		"lib/**"
-	],
+	"files": ["lib/**"],
 	"scripts": {
 		"build": "tsc --outDir ./lib",
 		"prepublishOnly": "npm run build",
@@ -15,7 +13,7 @@
 		"lint": "biome lint --apply ./src",
 		"format": "biome format --write ./src",
 		"check-h": "biome check --apply ./src",
-		"check": "biome check --apply --changed --no-errors-on-unmatched ./src"
+		"check": "biome check --apply --no-errors-on-unmatched ./src"
 	},
 	"author": "MARCROCK22",
 	"license": "Apache-2.0",
@@ -27,10 +25,7 @@
 		"ws": "^8.16.0"
 	},
 	"lint-staged": {
-		"*.ts": [
-			"biome check --apply",
-			"biome format --write"
-		]
+		"*.ts": ["biome check --apply", "biome format --write"]
 	},
 	"devDependencies": {
 		"@biomejs/biome": "1.6.0",
@@ -55,13 +50,7 @@
 	"bugs": {
 		"url": "https://github.com/tiramisulabs/seyfert"
 	},
-	"keywords": [
-		"api",
-		"discord",
-		"bots",
-		"typescript",
-		"botdev"
-	],
+	"keywords": ["api", "discord", "bots", "typescript", "botdev"],
 	"publishConfig": {
 		"access": "public"
 	},
@@ -71,4 +60,4 @@
 			"url": "https://github.com/socram03"
 		}
 	]
-}
+}

src/components/ActionRow.ts

@@ -1,18 +1,21 @@
 import type { APIMessageActionRowComponent, ComponentType } from '../common';
-import { BaseComponent } from '../structures/extra/BaseComponent';
+import { BaseComponent } from './BaseComponent';
 import type { ActionRowMessageComponents } from './index';
 import { componentFactory } from './index';
 
 export class MessageActionRowComponent<
 	T extends ActionRowMessageComponents,
 > extends BaseComponent<ComponentType.ActionRow> {
+	private ComponentsFactory: T[];
 	constructor(data: {
 		type: ComponentType.ActionRow;
 		components: APIMessageActionRowComponent[];
 	}) {
 		super(data);
-		this.components = data.components.map(componentFactory) as T[];
+		this.ComponentsFactory = data.components.map(componentFactory) as T[];
 	}
 
-	components: T[];
+	get components() {
+		return this.ComponentsFactory;
+	}
 }

src/components/BaseComponent.ts

@@ -0,0 +1,39 @@
+import { fromComponent } from '../builders';
+import type {
+	APIActionRowComponent,
+	APIActionRowComponentTypes,
+	APIButtonComponent,
+	APIChannelSelectComponent,
+	APIMentionableSelectComponent,
+	APIRoleSelectComponent,
+	APIStringSelectComponent,
+	APITextInputComponent,
+	APIUserSelectComponent,
+	ComponentType,
+} from '../common';
+
+export class BaseComponent<T extends ComponentType> {
+	constructor(public data: APIComponentsMap[T]) {}
+
+	get type() {
+		return this.data.type;
+	}
+
+	toJSON() {
+		return this.data;
+	}
+
+	toBuilder() {
+		return fromComponent(this.data);
+	}
+}
+export interface APIComponentsMap {
+	[ComponentType.ActionRow]: APIActionRowComponent<APIActionRowComponentTypes>;
+	[ComponentType.Button]: APIButtonComponent;
+	[ComponentType.ChannelSelect]: APIChannelSelectComponent;
+	[ComponentType.MentionableSelect]: APIMentionableSelectComponent;
+	[ComponentType.RoleSelect]: APIRoleSelectComponent;
+	[ComponentType.StringSelect]: APIStringSelectComponent;
+	[ComponentType.UserSelect]: APIUserSelectComponent;
+	[ComponentType.TextInput]: APITextInputComponent;
+}

src/components/BaseSelectMenuComponent.ts

@@ -0,0 +1,31 @@
+import type { ComponentType } from '../common';
+import { BaseComponent } from './BaseComponent';
+
+export type APISelectMenuComponentTypes =
+	| ComponentType.ChannelSelect
+	| ComponentType.MentionableSelect
+	| ComponentType.RoleSelect
+	| ComponentType.StringSelect
+	| ComponentType.UserSelect;
+
+export class BaseSelectMenuComponent<T extends APISelectMenuComponentTypes> extends BaseComponent<T> {
+	get customId() {
+		return this.data.custom_id;
+	}
+
+	get disabed() {
+		return this.data.disabled;
+	}
+
+	get max() {
+		return this.data.max_values;
+	}
+
+	get min() {
+		return this.data.min_values;
+	}
+
+	get placeholder() {
+		return this.data.placeholder;
+	}
+}

src/components/ButtonComponent.ts

@@ -1,41 +1,54 @@
-import type {
-	APIButtonComponentWithCustomId,
-	APIButtonComponentWithURL,
-	APIMessageComponentEmoji,
-	ComponentType,
-} from '../common';
-import { ButtonStyle } from '../common';
-import { BaseComponent } from '../structures/extra/BaseComponent';
+import { Button, type ButtonStylesForID } from '../builders';
+import type { ButtonStyle, ComponentType } from '../common';
+import { BaseComponent } from './BaseComponent';
 
 export class LinkButtonComponent extends BaseComponent<ComponentType.Button> {
-	constructor(data: APIButtonComponentWithURL) {
-		super(data);
-		this.label = data.label;
-		this.emoji = data.emoji;
-		this.disabled = !!data.disabled;
-		this.url = data.url;
+	get style() {
+		return this.data.style as ButtonStyle.Link;
 	}
 
-	style = ButtonStyle.Link;
-	label?: string;
-	emoji?: APIMessageComponentEmoji;
-	disabled: boolean;
-	url: string;
+	get url(): string {
+		// @ts-ignore
+		return this.data.url;
+	}
+
+	get label() {
+		return this.data.label;
+	}
+
+	get disabled() {
+		return this.data.disabled;
+	}
+
+	get emoji() {
+		return this.data.emoji;
+	}
+
+	toBuilder() {
+		return new Button<false>(this.data as never);
+	}
 }
 
 export type ButtonStyleExludeLink = Exclude<ButtonStyle, ButtonStyle.Link>;
 
 export class ButtonComponent extends BaseComponent<ComponentType.Button> {
-	constructor(data: APIButtonComponentWithCustomId) {
-		super(data);
-		this.style = data.style;
-		this.label = data.label;
-		this.emoji = data.emoji;
-		this.disabled = !!data.disabled;
+	get style() {
+		return this.data.style as ButtonStylesForID;
 	}
 
-	style: ButtonStyleExludeLink;
-	label?: string;
-	emoji?: APIMessageComponentEmoji;
-	disabled: boolean;
+	get label() {
+		return this.data.label;
+	}
+
+	get disabled() {
+		return this.data.disabled;
+	}
+
+	get emoji() {
+		return this.data.emoji;
+	}
+
+	toBuilder() {
+		return new Button<true>(this.data as never);
+	}
 }

src/components/ChannelSelectMenuComponent.ts

@@ -1,12 +1,12 @@
-import type { APIChannelSelectComponent, ChannelType, ComponentType } from '../common';
-import { BaseSelectMenuComponent } from '../structures/extra/BaseSelectMenuComponent';
+import type { ComponentType } from '../common';
+import { BaseSelectMenuComponent } from './BaseSelectMenuComponent';
 
 export class ChannelSelectMenuComponent extends BaseSelectMenuComponent<ComponentType.ChannelSelect> {
-	constructor(data: APIChannelSelectComponent) {
-		super(data);
-
-		this.channelTypes = data.channel_types;
+	get channelsTypes() {
+		return this.data.channel_types;
 	}
 
-	channelTypes?: ChannelType[];
+	get defaultValues() {
+		return this.data.default_values;
+	}
 }

src/components/MentionableSelectMenuComponent.ts

@@ -1,4 +1,8 @@
 import type { ComponentType } from '../common';
-import { BaseSelectMenuComponent } from '../structures/extra/BaseSelectMenuComponent';
+import { BaseSelectMenuComponent } from './BaseSelectMenuComponent';
 
-export class MentionableSelectMenuComponent extends BaseSelectMenuComponent<ComponentType.MentionableSelect> {}
+export class MentionableSelectMenuComponent extends BaseSelectMenuComponent<ComponentType.MentionableSelect> {
+	get defaultValues() {
+		return this.data.default_values;
+	}
+}

src/components/RoleSelectMenuComponent.ts

@@ -1,4 +1,8 @@
 import type { ComponentType } from '../common';
-import { BaseSelectMenuComponent } from '../structures/extra/BaseSelectMenuComponent';
+import { BaseSelectMenuComponent } from './BaseSelectMenuComponent';
 
-export class RoleSelectMenuComponent extends BaseSelectMenuComponent<ComponentType.RoleSelect> {}
+export class RoleSelectMenuComponent extends BaseSelectMenuComponent<ComponentType.RoleSelect> {
+	get defaultValues() {
+		return this.data.default_values;
+	}
+}

src/components/StringSelectMenuComponent.ts

@@ -1,12 +1,8 @@
-import type { APISelectMenuOption, APIStringSelectComponent, ComponentType } from '../common';
-import { BaseSelectMenuComponent } from '../structures/extra/BaseSelectMenuComponent';
+import type { ComponentType } from '../common';
+import { BaseSelectMenuComponent } from './BaseSelectMenuComponent';
 
 export class StringSelectMenuComponent extends BaseSelectMenuComponent<ComponentType.StringSelect> {
-	constructor(data: APIStringSelectComponent) {
-		super(data);
-
-		this.options = data.options;
+	get options() {
+		return this.data.options;
 	}
-
-	options: APISelectMenuOption[];
 }

src/components/TextInputComponent.ts

@@ -1,14 +1,36 @@
-import type { APIModalComponent, APITextInputComponent, ComponentType } from '../common';
-import { BaseComponent } from '../structures/extra/BaseComponent';
+import type { ComponentType } from '../common';
+import { BaseComponent } from './BaseComponent';
 
 export class TextInputComponent extends BaseComponent<ComponentType.TextInput> {
-	constructor(data: APITextInputComponent) {
-		super(data);
-
-		this.customId = data.custom_id;
-		this.value = data.value!;
+	get customId() {
+		return this.data.custom_id;
 	}
 
-	customId: string;
-	value: string | APIModalComponent;
+	get value() {
+		return this.data.value;
+	}
+
+	get style() {
+		return this.data.style;
+	}
+
+	get label() {
+		return this.data.label;
+	}
+
+	get max() {
+		return this.data.max_length;
+	}
+
+	get min() {
+		return this.data.min_length;
+	}
+
+	get required() {
+		return this.data.required;
+	}
+
+	get placeholder() {
+		return this.data.placeholder;
+	}
 }

src/components/UserSelectMenuComponent.ts

@@ -1,4 +1,8 @@
 import type { ComponentType } from '../common';
-import { BaseSelectMenuComponent } from '../structures/extra/BaseSelectMenuComponent';
+import { BaseSelectMenuComponent } from './BaseSelectMenuComponent';
 
-export class UserSelectMenuComponent extends BaseSelectMenuComponent<ComponentType.UserSelect> {}
+export class UserSelectMenuComponent extends BaseSelectMenuComponent<ComponentType.UserSelect> {
+	get defaultValues() {
+		return this.data.default_values;
+	}
+}

src/components/index.ts

@@ -1,6 +1,6 @@
 import type { APIMessageActionRowComponent } from '../common';
 import { ButtonStyle, ComponentType } from '../common';
-import { BaseComponent } from '../structures/extra/BaseComponent';
+import { BaseComponent } from './BaseComponent';
 import { ButtonComponent, LinkButtonComponent } from './ButtonComponent';
 import { ChannelSelectMenuComponent } from './ChannelSelectMenuComponent';
 import { MentionableSelectMenuComponent } from './MentionableSelectMenuComponent';

src/structures/extra/BaseComponent.ts

@@ -1,13 +0,0 @@
-import type { APIBaseComponent, ComponentType } from '../../common';
-
-export interface BaseComponent<T extends ComponentType> extends APIBaseComponent<T> {}
-
-export class BaseComponent<T extends ComponentType> {
-	constructor(data: APIBaseComponent<T>) {
-		Object.assign(this, data);
-	}
-
-	toJSON() {
-		return { type: this.type };
-	}
-}

src/structures/extra/BaseSelectMenuComponent.ts

@@ -1,23 +0,0 @@
-import type { APIBaseSelectMenuComponent, ComponentType, Identify, ObjectToLower } from '../../common';
-import { BaseComponent } from './BaseComponent';
-
-export type APISelectMenuComponentTypes =
-	| ComponentType.ChannelSelect
-	| ComponentType.MentionableSelect
-	| ComponentType.RoleSelect
-	| ComponentType.StringSelect
-	| ComponentType.UserSelect;
-
-export interface BaseSelectMenuComponent<T extends APISelectMenuComponentTypes>
-	extends BaseComponent<T>,
-		ObjectToLower<Identify<Omit<APIBaseSelectMenuComponent<APISelectMenuComponentTypes>, 'type'>>> {}
-
-export class BaseSelectMenuComponent<T extends APISelectMenuComponentTypes> extends BaseComponent<T> {
-	constructor(data: APIBaseSelectMenuComponent<T>) {
-		super(data);
-	}
-
-	toJSON() {
-		return { ...this };
-	}
-}