@syntrologie/runtime-sdk 2.8.0-canary.179 → 2.8.0-canary.180

package/dist/components/SyntroBottomSheet.d.ts

@@ -107,6 +107,9 @@ export declare class SyntroBottomSheet extends LitElement {
         isDragging: {
             attribute: boolean;
         };
+        _visible: {
+            attribute: boolean;
+        };
     };
     isOpen: boolean;
     tiles: TileConfig[];
@@ -121,6 +124,9 @@ export declare class SyntroBottomSheet extends LitElement {
      *  during an in-progress drag. Reset to 0 on release. */
     dragOffsetVh: number;
     isDragging: boolean;
+    /** Keeps the DOM alive during exit transition. Set true on open,
+     *  set false after exit animation completes or times out. */
+    _visible: boolean;
     private _activePointerId;
     private _dragStartY;
     private _dragStartSnap;
@@ -137,6 +143,7 @@ export declare class SyntroBottomSheet extends LitElement {
     /** Saved body overflow value before we apply scroll lock. */
     private _savedBodyOverflow;
     private _entryRafId;
+    private _exitTimer;
     private _onDocumentMousedown;
     private _onScrimClick;
     createRenderRoot(): this;
@@ -162,6 +169,8 @@ export declare class SyntroBottomSheet extends LitElement {
     private _lockBodyScroll;
     private _unlockBodyScroll;
     private _scheduleEntryTransition;
+    private _scheduleExitTransition;
+    private _cancelExitTransition;
     /** Convert a vertical pointer delta (px, downward = positive) to a vh
      *  offset. Used during drag and for velocity calculations. */
     private _pxToVh;

package/dist/index.js

@@ -7682,6 +7682,9 @@ var SyntroBottomSheet = class extends LitElement6 {
      *  during an in-progress drag. Reset to 0 on release. */
     __publicField(this, "dragOffsetVh", 0);
     __publicField(this, "isDragging", false);
+    /** Keeps the DOM alive during exit transition. Set true on open,
+     *  set false after exit animation completes or times out. */
+    __publicField(this, "_visible", false);
     // --- Drag tracking (non-reactive) ---
     __publicField(this, "_activePointerId", null);
     __publicField(this, "_dragStartY", 0);
@@ -7699,6 +7702,7 @@ var SyntroBottomSheet = class extends LitElement6 {
     /** Saved body overflow value before we apply scroll lock. */
     __publicField(this, "_savedBodyOverflow", null);
     __publicField(this, "_entryRafId", 0);
+    __publicField(this, "_exitTimer", null);
     // --- Outside-click-to-close (matches SyntroDrawer pattern) ---
     __publicField(this, "_onDocumentMousedown", (e) => {
       if (!this.isOpen) return;
@@ -7792,6 +7796,10 @@ var SyntroBottomSheet = class extends LitElement6 {
     super.disconnectedCallback();
     document.removeEventListener("mousedown", this._onDocumentMousedown);
     cancelAnimationFrame(this._entryRafId);
+    if (this._exitTimer !== null) {
+      clearTimeout(this._exitTimer);
+      this._exitTimer = null;
+    }
     this._unlockBodyScroll();
   }
   updated(changed) {
@@ -7799,10 +7807,13 @@ var SyntroBottomSheet = class extends LitElement6 {
     this._scrollEl = (_a3 = this.querySelector('[data-syntro-bottom-sheet="scroll-area"]')) != null ? _a3 : null;
     if (changed.has("isOpen")) {
       if (this.isOpen) {
+        this._cancelExitTransition();
+        this._visible = true;
         this.snap = "mid";
         this._lockBodyScroll();
         this._scheduleEntryTransition();
-      } else {
+      } else if (this._visible) {
+        this._scheduleExitTransition();
         this._unlockBodyScroll();
       }
       this.dragOffsetVh = 0;
@@ -7840,6 +7851,24 @@ var SyntroBottomSheet = class extends LitElement6 {
       });
     });
   }
+  _scheduleExitTransition() {
+    const container = this.querySelector('[data-syntro-bottom-sheet="container"]');
+    if (!container) {
+      this._visible = false;
+      return;
+    }
+    container.style.transform = "translateY(100svh)";
+    this._exitTimer = setTimeout(() => {
+      this._exitTimer = null;
+      this._visible = false;
+    }, 350);
+  }
+  _cancelExitTransition() {
+    if (this._exitTimer !== null) {
+      clearTimeout(this._exitTimer);
+      this._exitTimer = null;
+    }
+  }
   // ── Snap math ────────────────────────────────────────────────────────────
   /** Convert a vertical pointer delta (px, downward = positive) to a vh
    *  offset. Used during drag and for velocity calculations. */
@@ -7988,7 +8017,7 @@ var SyntroBottomSheet = class extends LitElement6 {
   }
   // ── Render ───────────────────────────────────────────────────────────────
   render() {
-    if (!this.isOpen) return nothing5;
+    if (!this._visible) return nothing5;
     const dur = this._duration;
     const ease = this._easing;
     const topEdgeVh = this._topEdgeVh;
@@ -8131,7 +8160,8 @@ __publicField(SyntroBottomSheet, "properties", {
   // reactive without that quirk.
   snap: { attribute: false },
   dragOffsetVh: { attribute: false },
-  isDragging: { attribute: false }
+  isDragging: { attribute: false },
+  _visible: { attribute: false }
 });
 customElements.define("syntro-bottom-sheet", SyntroBottomSheet);
 
@@ -9547,7 +9577,7 @@ function error(prefix, message, data) {
 }
 
 // src/version.ts
-var SDK_VERSION = "2.8.0-canary.179";
+var SDK_VERSION = "2.8.0-canary.180";
 
 // src/types.ts
 var SDK_SCHEMA_VERSION = "2.0";