@forcecalendar/interface 1.0.7 → 1.0.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@forcecalendar/interface",
-  "version": "1.0.7",
+  "version": "1.0.9",
   "type": "module",
   "description": "Official interface layer for forceCalendar Core - Enterprise calendar components",
   "main": "dist/force-calendar-interface.umd.js",

package/src/components/ForceCalendar.js

@@ -436,6 +436,16 @@ export class ForceCalendar extends BaseComponent {
         console.log('[ForceCalendar] afterRender - stateManager:', !!this.stateManager);
 
         if (viewElement && this.stateManager) {
+            // Debug: check what's available on the viewElement
+            console.log('[ForceCalendar] viewElement.constructor.name:', viewElement.constructor?.name);
+            console.log('[ForceCalendar] viewElement methods:', Object.getOwnPropertyNames(Object.getPrototypeOf(viewElement)));
+
+            // Try to force custom element upgrade (Locker Service may prevent auto-upgrade)
+            if (typeof customElements !== 'undefined' && customElements.upgrade) {
+                console.log('[ForceCalendar] Forcing custom element upgrade');
+                customElements.upgrade(viewElement);
+            }
+
             // Store stateManager in global registry (bypasses Locker Service proxy issues)
             const registryId = this._registryId || (this._registryId = 'fc-' + Math.random().toString(36).substr(2, 9));
             window.__forceCalendarRegistry = window.__forceCalendarRegistry || {};
@@ -444,6 +454,15 @@ export class ForceCalendar extends BaseComponent {
             // Pass registry ID via attribute (attributes work through Locker Service)
             viewElement.setAttribute('data-state-registry', registryId);
             console.log('[ForceCalendar] Set registry ID:', registryId);
+
+            // Also try direct initialization if the element has the method
+            if (viewElement._checkRegistry) {
+                console.log('[ForceCalendar] Calling _checkRegistry directly');
+                viewElement._checkRegistry();
+            } else if (viewElement.setStateManager) {
+                console.log('[ForceCalendar] Calling setStateManager directly');
+                viewElement.setStateManager(this.stateManager);
+            }
         } else {
             console.log('[ForceCalendar] Could not set stateManager - viewElement:', !!viewElement, 'stateManager:', !!this.stateManager);
         }

package/src/components/views/DayView.js

@@ -10,31 +10,43 @@ import { StyleUtils } from '../../utils/StyleUtils.js';
 import { DOMUtils } from '../../utils/DOMUtils.js';
 
 export class DayView extends BaseComponent {
-    static get observedAttributes() {
-        return ['data-state-registry'];
-    }
-
     constructor() {
         super();
         this._stateManager = null;
         this.viewData = null;
         this.hours = Array.from({ length: 24 }, (_, i) => i);
+        this._registryCheckInterval = null;
     }
 
     connectedCallback() {
         super.connectedCallback();
-        this._checkRegistry();
+        this._startRegistryPolling();
     }
 
-    attributeChangedCallback(name, oldValue, newValue) {
-        if (name === 'data-state-registry' && newValue) {
-            this._checkRegistry();
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        if (this._registryCheckInterval) {
+            clearInterval(this._registryCheckInterval);
         }
     }
 
+    _startRegistryPolling() {
+        this._checkRegistry();
+        let attempts = 0;
+        this._registryCheckInterval = setInterval(() => {
+            attempts++;
+            if (this._stateManager || attempts > 50) {
+                clearInterval(this._registryCheckInterval);
+                return;
+            }
+            this._checkRegistry();
+        }, 100);
+    }
+
     _checkRegistry() {
         const registryId = this.getAttribute('data-state-registry');
         if (registryId && window.__forceCalendarRegistry && window.__forceCalendarRegistry[registryId]) {
+            clearInterval(this._registryCheckInterval);
             this.setStateManager(window.__forceCalendarRegistry[registryId]);
         }
     }

package/src/components/views/MonthView.js

@@ -10,11 +10,6 @@ import { DateUtils } from '../../utils/DateUtils.js';
 import { StyleUtils } from '../../utils/StyleUtils.js';
 
 export class MonthView extends BaseComponent {
-    // Observe data-state-registry attribute for Locker Service compatibility
-    static get observedAttributes() {
-        return ['data-state-registry'];
-    }
-
     constructor() {
         super();
         this._stateManager = null;
@@ -22,18 +17,41 @@ export class MonthView extends BaseComponent {
         this.config = {
             maxEventsToShow: 3,
         };
+        this._registryCheckInterval = null;
     }
 
     connectedCallback() {
         super.connectedCallback();
-        // Check for registry ID on connect (may already be set)
-        this._checkRegistry();
+        console.log('[MonthView] connectedCallback - starting registry polling');
+        // Poll for registry since attributeChangedCallback doesn't work in Locker Service
+        this._startRegistryPolling();
+    }
+
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this._stopRegistryPolling();
     }
 
-    attributeChangedCallback(name, oldValue, newValue) {
-        console.log('[MonthView] attributeChangedCallback:', name, oldValue, '->', newValue);
-        if (name === 'data-state-registry' && newValue) {
+    _startRegistryPolling() {
+        // Check immediately
+        this._checkRegistry();
+
+        // Then poll every 100ms until we find it (max 5 seconds)
+        let attempts = 0;
+        this._registryCheckInterval = setInterval(() => {
+            attempts++;
+            if (this._stateManager || attempts > 50) {
+                this._stopRegistryPolling();
+                return;
+            }
             this._checkRegistry();
+        }, 100);
+    }
+
+    _stopRegistryPolling() {
+        if (this._registryCheckInterval) {
+            clearInterval(this._registryCheckInterval);
+            this._registryCheckInterval = null;
         }
     }
 
@@ -43,6 +61,7 @@ export class MonthView extends BaseComponent {
         if (registryId && window.__forceCalendarRegistry && window.__forceCalendarRegistry[registryId]) {
             const manager = window.__forceCalendarRegistry[registryId];
             console.log('[MonthView] Found stateManager in registry');
+            this._stopRegistryPolling();
             this.setStateManager(manager);
         }
     }

package/src/components/views/WeekView.js

@@ -10,31 +10,43 @@ import { StyleUtils } from '../../utils/StyleUtils.js';
 import { DOMUtils } from '../../utils/DOMUtils.js';
 
 export class WeekView extends BaseComponent {
-    static get observedAttributes() {
-        return ['data-state-registry'];
-    }
-
     constructor() {
         super();
         this._stateManager = null;
         this.viewData = null;
         this.hours = Array.from({ length: 24 }, (_, i) => i); // 0-23
+        this._registryCheckInterval = null;
     }
 
     connectedCallback() {
         super.connectedCallback();
-        this._checkRegistry();
+        this._startRegistryPolling();
     }
 
-    attributeChangedCallback(name, oldValue, newValue) {
-        if (name === 'data-state-registry' && newValue) {
-            this._checkRegistry();
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        if (this._registryCheckInterval) {
+            clearInterval(this._registryCheckInterval);
         }
     }
 
+    _startRegistryPolling() {
+        this._checkRegistry();
+        let attempts = 0;
+        this._registryCheckInterval = setInterval(() => {
+            attempts++;
+            if (this._stateManager || attempts > 50) {
+                clearInterval(this._registryCheckInterval);
+                return;
+            }
+            this._checkRegistry();
+        }, 100);
+    }
+
     _checkRegistry() {
         const registryId = this.getAttribute('data-state-registry');
         if (registryId && window.__forceCalendarRegistry && window.__forceCalendarRegistry[registryId]) {
+            clearInterval(this._registryCheckInterval);
             this.setStateManager(window.__forceCalendarRegistry[registryId]);
         }
     }