@smilodon/core 1.0.13 → 1.0.15

package/dist/index.umd.js

@@ -966,11 +966,6 @@
             this._errorMessage = '';
             this._boundArrowClick = null;
             console.log('[EnhancedSelect] Constructor called');
-            // WORKAROUND: Force display style on host element for Angular compatibility
-            // Angular's rendering seems to not apply :host styles correctly in some cases
-            this.style.display = 'block';
-            this.style.width = '100%';
-            console.log('[EnhancedSelect] Forced host display styles');
             this._shadow = this.attachShadow({ mode: 'open' });
             console.log('[EnhancedSelect] Shadow root attached:', this._shadow);
             this._uniqueId = `enhanced-select-${Math.random().toString(36).substr(2, 9)}`;
@@ -1012,10 +1007,11 @@
             console.log('[EnhancedSelect] Options container created');
             this._liveRegion = this._createLiveRegion();
             console.log('[EnhancedSelect] Live region created');
-            this._assembleDOM();
-            console.log('[EnhancedSelect] DOM assembled');
+            // Initialize styles BEFORE assembling DOM (order matters in shadow DOM)
             this._initializeStyles();
             console.log('[EnhancedSelect] Styles initialized');
+            this._assembleDOM();
+            console.log('[EnhancedSelect] DOM assembled');
             this._attachEventListeners();
             console.log('[EnhancedSelect] Event listeners attached');
             this._initializeObservers();
@@ -1024,6 +1020,12 @@
         }
         connectedCallback() {
             console.log('[EnhancedSelect] connectedCallback called');
+            // WORKAROUND: Force display style on host element for Angular compatibility
+            // Angular's rendering seems to not apply :host styles correctly in some cases
+            // Must be done in connectedCallback when element is attached to DOM
+            this.style.display = 'block';
+            this.style.width = '100%';
+            console.log('[EnhancedSelect] Forced host display styles');
             // Load initial data if server-side is enabled
             if (this._config.serverSide.enabled && this._config.serverSide.initialSelectedValues) {
                 this._loadInitialSelectedItems();