@forcecalendar/interface 1.0.60 → 1.0.61

package/package.json

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

package/src/components/ForceCalendar.js

@@ -37,6 +37,38 @@ export class ForceCalendar extends BaseComponent {
     this._busUnsubscribers = [];
   }
 
+  /**
+   * Route observed-attribute changes into the StateManager.
+   * Without this, attribute updates after mount (view, locale, timezone,
+   * week-starts-on, date) only re-rendered from stale state and had no
+   * visible effect. 'height' is presentational and picked up by render().
+   */
+  propChanged(name, oldValue, newValue) {
+    if (!this.stateManager || oldValue === newValue) return;
+
+    switch (name) {
+      case 'view':
+        if (newValue) this.stateManager.setView(newValue);
+        break;
+      case 'date': {
+        const date = newValue ? new Date(newValue) : null;
+        if (date && !isNaN(date.getTime())) this.stateManager.setDate(date);
+        break;
+      }
+      case 'locale':
+        if (newValue) this.stateManager.updateConfig({ locale: newValue });
+        break;
+      case 'timezone':
+        if (newValue) this.stateManager.updateConfig({ timeZone: newValue });
+        break;
+      case 'week-starts-on': {
+        const day = parseInt(newValue, 10);
+        if (!Number.isNaN(day)) this.stateManager.updateConfig({ weekStartsOn: day });
+        break;
+      }
+    }
+  }
+
   initialize() {
     // Initialize state manager with config from attributes
     const config = {

package/src/core/BaseComponent.js

@@ -183,8 +183,13 @@ export class BaseComponent extends HTMLElement {
    */
   _restoreScrollPositions(positions) {
     if (!this._contentWrapper || positions.size === 0) return;
+    // CSS.escape may be absent in sandboxed or test environments
+    const escapeId =
+      typeof CSS !== 'undefined' && typeof CSS.escape === 'function'
+        ? CSS.escape
+        : id => String(id).replace(/["\\]/g, '\\$&');
     positions.forEach((pos, id) => {
-      const el = this._contentWrapper.querySelector(`[id="${CSS.escape(id)}"]`);
+      const el = this._contentWrapper.querySelector(`[id="${escapeId(id)}"]`);
       if (el) {
         el.scrollTop = pos.top;
         el.scrollLeft = pos.left;