fix: separate event setting from button creation

Fixes the bug of not setting events on a button because the button is
not yet created or appended to the DOM. Event setting relies on the
element's ID in the DOM. Separated event setting into another method to
address this issue. Additionally, return `this` in methods where
chaining is necessary.

src/components/button/button-create.js

@@ -2,53 +2,33 @@
 
 import { isConfigVerified } from '@utilities/config/config-verifier'
 import { setAttributes } from '@utilities/components/set-attributes'
-import { setEvents } from '@utilities/components/set-events'
 
 function createButton(config) {
 	if (!isConfigVerified('button', config)) return
 
-	const { type, id, class_name, icon, events } = config
+	const { type, id, class_name, icon } = config
 	let { text } = config
 
 	let button
 
 	switch (type) {
 		case 'rounded-square':
 			text = undefined
-			button = createContainer(
-				icon,
-				text,
-				id,
-				class_name,
-				events,
-				'rounded-square'
-			)
+			button = createContainer(icon, text, id, class_name, 'rounded-square')
 			break
 		case 'slab':
 			if (!text && !icon) return
-			button = createContainer(icon, text, id, class_name, events, 'slab')
+			button = createContainer(icon, text, id, class_name, 'slab')
 			break
 		default:
 			if (!text && !icon) return
-			button = createContainer(
-				icon,
-				text,
-				id,
-				class_name,
-				events,
-				'transparent'
-			)
+			button = createContainer(icon, text, id, class_name, 'transparent')
 	}
 
 	return button
 }
 
-function createContainer(icon, text, id, class_name, events, type) {
-	if (!events) {
-		console.error('Button is useless without events.')
-		return
-	}
-
+function createContainer(icon, text, id, class_name, type) {
 	const BUTTON = document.createElement('div')
 	setAttributes(BUTTON, {
 		id: `button-${id}`,
@@ -72,7 +52,6 @@ function createContainer(icon, text, id, class_name, events, type) {
 		BUTTON.appendChild(TEXT)
 	}
 
-	setEvents(events)
 	return BUTTON
 }
 

src/components/button/button-set-events.js

@@ -0,0 +1,12 @@
+'use strict'
+
+import { isConfigVerified } from '@utilities/config/config-verifier'
+import { setEvents } from '@utilities/components/set-events'
+
+function setButtonEvents(config) {
+	if (!isConfigVerified('button', config)) return
+	const { id, events } = config
+	setEvents(id, events)
+}
+
+export { setButtonEvents }

src/components/button/button.js

@@ -2,6 +2,7 @@
 
 import { isConfigVerified } from '@utilities/config/config-verifier'
 import { createButton } from './button-create'
+import { setEvents } from './button-set-events'
 import { removeButton } from './button-remove'
 
 class Button {
@@ -14,6 +15,10 @@ class Button {
 		createButton(this.config)
 	}
 
+	setEvents() {
+		setEvents(this.config)
+	}
+
 	remove() {
 		removeButton(this.config)
 	}