Version 5.0.0 beta 3

applications/core/interface/themeeditor/themeEditor.js

@@ -272,6 +272,7 @@ customElements.define('theme-editor', class extends HTMLElement {
             this.currentPanel.setAttribute('aria-hidden', 'false');
             this.currentPanel.inert = false;
             this.currentPanel.removeAttribute('data-panel-prev');
+            this.currentPanel.querySelector("button")?.focus();
 
         } else {
 
@@ -286,6 +287,7 @@ customElements.define('theme-editor', class extends HTMLElement {
             // Open the new panel
             this.currentPanel.setAttribute('aria-hidden', 'false');
             this.currentPanel.inert = false;
+            this.currentPanel.querySelector("button, input, select, textarea")?.focus();
 
             // Set the text for the Back button
             this.currentPanel.querySelector(`[data-panel-nav="back"]`).innerText = oldPanel.querySelector('[data-panel-name]')?.innerText ?? 'Back';
@@ -299,25 +301,6 @@ customElements.define('theme-editor', class extends HTMLElement {
         }
     }
 
-    /**
-     * This changes tabs (Colors/Settings)
-     * @param {Event} Event 
-     * @param {HTMLElement} target 
-     */
-    changeTab(event, target){
-
-        // Find out what group this tab controls
-        const group = target.closest('editor-tabs').getAttribute('data-tabs');
-
-        // Remove active tab
-        this.querySelectorAll(`[data-tabs=${group}] button`).forEach(t => t.setAttribute('aria-expanded', 'false'));
-        this.querySelectorAll(`[data-tabs-content=${group}]`).forEach(c => c.setAttribute('aria-hidden', 'true'));
-
-        // Set active tab
-        target.setAttribute('aria-expanded', 'true');
-        document.getElementById(target.getAttribute('aria-controls')).setAttribute('aria-hidden', 'false');
-    }
-
     /**
      * Update <style id="themeVariables"> with variables
      */
@@ -817,7 +800,10 @@ customElements.define('theme-editor', class extends HTMLElement {
         }
 
         // Always open the panel with the swatch picker visible
-        document.querySelector('[aria-controls="content__colorSelector__swatches"]').click();
+        let swatchTab = document.querySelector('[aria-controls="content__colorSelector__swatches"]');
+        if(swatchTab.getAttribute("aria-expanded") === "false"){
+            swatchTab.click()
+        }
 
         // Optionally hide swatches (ie. the Color Scheme creator)
         if(target.getAttribute('data-color-tool') != ''){