feat: fire new monster-tab-change event

- Refactored the import statements in tabs.mjs to align with coding standards, enhancing overall code clarity.
- Reformatted method comments and method bodies for consistent indentation, making the code structure more visually approachable.
- Ensured that the switch statement within getTranslations uses consistent spacing and indentation for better readability.

source/components/layout/tabs.mjs

@@ -291,7 +291,11 @@ class Tabs extends CustomElement {
   removeTab(tabId) {
     const tabs = this.getTabs();
     for (const tab of tabs) {
-			if ((tab.getAttribute("id") === tabId || tab.getAttribute("data-monster-name") === tabId) && tab.hasAttribute("data-monster-removable")) {
+      if (
+        (tab.getAttribute("id") === tabId ||
+          tab.getAttribute("data-monster-name") === tabId) &&
+        tab.hasAttribute("data-monster-removable")
+      ) {
         tab.remove();
         initTabButtons.call(this);
         return this;
@@ -324,12 +328,10 @@ class Tabs extends CustomElement {
    * @param removable
    * @returns {Tabs}
    */
-	addTab(content,  {
-		active    = false,
-		label     = null,
-		tabId     = null,
-		removable = true
-	} = {}  ) {
+  addTab(
+    content,
+    { active = false, label = null, tabId = null, removable = true } = {},
+  ) {
     const tab = document.createElement("div");
     if (!isString(label) || label.trim() === "") {
       label = this.getOption("labels.new-tab-label");
@@ -348,12 +350,14 @@ class Tabs extends CustomElement {
     // check if id is already used
     const existingTabs = this.getTabs();
     for (const existingTab of existingTabs) {
-			if (existingTab.getAttribute("id") === tabId || existingTab.getAttribute("data-monster-name") === tabId) {
+      if (
+        existingTab.getAttribute("id") === tabId ||
+        existingTab.getAttribute("data-monster-name") === tabId
+      ) {
         throw new Error(`Tab with id "${tabId}" already exists.`);
       }
     }
 
-
     tab.setAttribute("id", tabId);
 
     if (active === true) {
@@ -373,7 +377,7 @@ class Tabs extends CustomElement {
     }
 
     this.appendChild(tab);
-		return this
+    return this;
   }
 
   /**
@@ -722,6 +726,10 @@ function show(element) {
     if (id === reference) {
       node.classList.add("active");
 
+      fireCustomEvent(this, "monster-tab-change", {
+        reference,
+      });
+
       const openDelay = Number.parseInt(
         this.getOption("features.openDelay"),
         10,