Updated baseURL to end in 0.06

Author: RPDevJesco

zephyrcore/zephyr.js

@@ -3,7 +3,7 @@
  * and data binding capabilities.
  */
 export default class ZephyrJS extends HTMLElement {
-    static baseUrl = 'https://cdn.jsdelivr.net/gh/RPDevJesco/ZephyrJS@0.05';
+    static baseUrl = 'https://cdn.jsdelivr.net/gh/RPDevJesco/ZephyrJS@0.06';
 
     static setBaseUrl(url) {
         ZephyrJS.baseUrl = url.endsWith('/') ? url : url + '/';

zephyrtemplates/Dropdown.js

@@ -12,22 +12,16 @@ export default class Dropdown extends ZephyrJS {
             selectedOption: null,
             placeholder: 'Select an option'
         };
-        console.log('Dropdown constructor called');
     }
 
     async connectedCallback() {
-        console.log('Dropdown connectedCallback started');
         await super.connectedCallback();
-        console.log('Dropdown super.connectedCallback completed');
 
         this.setOptions(JSON.parse(this.getAttribute('options') || '[]'));
         this.state.placeholder = this.getAttribute('placeholder') || this.state.placeholder;
         this.state.selectedOption = this.getAttribute('selected') || null;
 
-        console.log('Dropdown state after attribute processing:', this.state);
-
         await this.renderAndAddListeners();
-        console.log('Dropdown renderAndAddListeners completed');
     }
 
     setOptions(options) {
@@ -36,28 +30,22 @@ export default class Dropdown extends ZephyrJS {
     }
 
     async renderAndAddListeners() {
-        console.log('renderAndAddListeners started');
         await this.render();
         this.addEventListeners();
-        console.log('renderAndAddListeners completed');
     }
 
     async render() {
-        console.log('Render started');
         if (!this.shadowRoot) {
             console.error('Shadow root not found');
             return;
         }
 
         let select = this.shadowRoot.querySelector('select');
         if (!select) {
-            console.log('Select element not found, inserting template content');
             if (this.template && this.template.content) {
                 const templateContent = this.template.content.cloneNode(true);
-                console.log('Cloned template content:', templateContent);
                 this.shadowRoot.appendChild(templateContent);
                 select = this.shadowRoot.querySelector('select');
-                console.log('Select element after insertion:', select);
             } else {
                 console.error('Template content not available');
                 return;
@@ -91,30 +79,23 @@ export default class Dropdown extends ZephyrJS {
             optionElement.selected = option.value === this.state.selectedOption;
             select.appendChild(optionElement);
         });
-
-        console.log('Render completed, select content:', select.innerHTML);
     }
 
     addEventListeners() {
-        console.log('Adding event listeners');
         const select = this.shadowRoot.querySelector('select');
 
         if (select) {
             select.addEventListener('change', (e) => {
                 this.state.selectedOption = e.target.value;
                 this.dispatchCustomEvent('optionSelected', { option: this.state.selectedOption });
             });
-            console.log('Change listener added to select element');
         } else {
             console.error('Select element not found');
         }
-
-        console.log('Event listeners added');
     }
 
     disconnectedCallback() {
         super.disconnectedCallback();
-        console.log('Dropdown disconnected');
     }
 }
 

zephyrtemplates/templates/dropdown.html

@@ -10,8 +10,8 @@
         }
         .dropdown-toggle {
             padding: 10px;
-            border: 1px solid var(--neutral-color, #ccc);
-            background-color: var(--light-color, #fff);
+            border: 1px solid var(--neutral-color);
+            background-color: var(--background-color);
             color: var(--dark-text, #333);
             cursor: pointer;
             user-select: none;
@@ -22,8 +22,8 @@
             top: 100%;
             left: 0;
             right: 0;
-            background-color: var(--light-color, #fff);
-            border: 1px solid var(--neutral-color, #ccc);
+            background-color: var(--background-color);
+            border: 1px solid var(--neutral-color);
             border-top: none;
             list-style-type: none;
             padding: 0;
@@ -40,7 +40,7 @@
             cursor: pointer;
         }
         .dropdown-option:hover {
-            background-color: var(--secondary-color, #f0f0f0);
+            background-color: var(--secondary-color);
         }
     </style>
     <div class="dropdown-container">