@descope/web-components-ui 3.13.1 → 3.13.2

package/dist/index.esm.js

@@ -25606,6 +25606,11 @@ class RawTooltip extends createBaseClass$1({
   componentName: componentName$9,
   baseSelector: 'vaadin-tooltip',
 }) {
+  // Observes the inner descope-anchored's `class` attribute so runtime updates
+  // (e.g. real-time conditional components toggling `.hidden`) keep this
+  // tooltip's class in sync. Set up in connectedCallback so reconnects work.
+  #anchoredClassObserver = null;
+
   constructor() {
     super();
 
@@ -25721,9 +25726,31 @@ class RawTooltip extends createBaseClass$1({
     );
     this.#setTooltipTarget();
 
+    setTimeout(() => this.#onOverlayReady());
+  }
+
+  #observeAnchored() {
+    this.#anchoredClassObserver?.disconnect();
+    if (this.anchored) {
+      this.#anchoredClassObserver = observeAttributes$1(
+        this.anchored,
+        () => this.#syncComponentState(),
+        { includeAttrs: ['class'] },
+      );
+    }
+  }
+
+  // createBaseClass gates init() to first-connect, so observing here is
+  // required for the detach/reattach cycle to keep working.
+  connectedCallback() {
+    super.connectedCallback?.();
     this.#syncComponentState();
+    this.#observeAnchored();
+  }
 
-    setTimeout(() => this.#onOverlayReady());
+  disconnectedCallback() {
+    super.disconnectedCallback?.();
+    this.#anchoredClassObserver?.disconnect();
   }
 
   #setTooltipTarget() {
@@ -27015,6 +27042,12 @@ class RawAttachment extends createBaseClass$1({
   componentName: componentName$6,
   baseSelector: 'descope-anchored',
 }) {
+  // Observes the inner descope-anchored's `class` attribute so runtime
+  // updates (e.g. real-time conditional components toggling `.hidden`) keep
+  // this attachment host's class in sync. Set up in connectedCallback so
+  // reconnects work (createBaseClass gates init() to first connect only).
+  #anchoredClassObserver = null;
+
   constructor() {
     super();
 
@@ -27053,8 +27086,6 @@ class RawAttachment extends createBaseClass$1({
   init() {
     super.init?.();
 
-    this.#syncComponentState();
-
     injectStyle(
       `
       :host {
@@ -27105,6 +27136,30 @@ class RawAttachment extends createBaseClass$1({
     this.classList.toggle('hidden', hasHidden);
   }
 
+  #observeAnchored() {
+    this.#anchoredClassObserver?.disconnect();
+    if (this.anchored) {
+      this.#anchoredClassObserver = observeAttributes$1(
+        this.anchored,
+        () => this.#syncComponentState(),
+        { includeAttrs: ['class'] },
+      );
+    }
+  }
+
+  // createBaseClass gates init() to first-connect, so observing here is
+  // required for the detach/reattach cycle to keep working.
+  connectedCallback() {
+    super.connectedCallback?.();
+    this.#syncComponentState();
+    this.#observeAnchored();
+  }
+
+  disconnectedCallback() {
+    super.disconnectedCallback?.();
+    this.#anchoredClassObserver?.disconnect();
+  }
+
   #syncAvailableSizeAttr() {
     const anchor = this.defaultSlot?.assignedElements()?.[0];
 
@@ -31777,6 +31832,11 @@ class RawAnchored extends createBaseClass$1({
 
   #hostStretchSheet = null;
 
+  // Observes the anchor's `class` attribute so runtime updates by the SDK
+  // (e.g. real-time conditional components toggling `.hidden`) propagate to
+  // this element. Without this, only the initial slotchange would sync.
+  #anchorClassObserver = null;
+
   get #anchor() {
     return this.defaultSlot.assignedElements({ flatten: true })[0];
   }
@@ -31879,6 +31939,28 @@ class RawAnchored extends createBaseClass$1({
       this.#anchored,
       'st-host-direction',
     );
+
+    this.#observeAnchorClass();
+  }
+
+  #observeAnchorClass() {
+    this.#anchorClassObserver?.disconnect();
+    if (this.#anchor) {
+      this.#anchorClassObserver = observeAttributes$1(
+        this.#anchor,
+        () => this.#syncComponentState(),
+        { includeAttrs: ['class'] },
+      );
+    }
+  }
+
+  // createBaseClass gates init() to first-connect (#isInit). Without
+  // re-observing here, runtime `.hidden` toggles stop syncing after a
+  // detach/reattach cycle.
+  connectedCallback() {
+    super.connectedCallback?.();
+    this.#observeAnchorClass();
+    this.#syncComponentState();
   }
 
   // Injects [stretch] layout rules into the containing component's shadow root (e.g. descope-attachment)
@@ -31920,6 +32002,7 @@ class RawAnchored extends createBaseClass$1({
     super.disconnectedCallback?.();
     this.#stretchObserver?.disconnect();
     this.#directionObserver?.disconnect();
+    this.#anchorClassObserver?.disconnect();
   }
 
   // Track whether anything is slotted, so the host display rule can hide an