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

package/dist/components/SyntroBottomSheet.d.ts

@@ -9,18 +9,20 @@
  * reached its top.
  *
  * **Geometry:** ``position: fixed; left:0; right:0; bottom:0;
- * height: 100vh`` with a vertical ``translateY()`` to position the
- * **top edge** of the sheet at the active snap point. ``height = 100vh``
+ * height: 100svh`` with a vertical ``translateY()`` to position the
+ * **top edge** of the sheet at the active snap point. ``height = 100svh``
  * keeps the sheet's bottom anchored even when the snap point moves —
- * the content area below the handle just expands. Inner padding uses
- * ``env(safe-area-inset-bottom)`` so the iPhone home indicator doesn't
- * eat the last row of tiles.
+ * the content area below the handle just expands. ``svh`` (small
+ * viewport height) is used instead of ``dvh`` so the sheet doesn't
+ * jump when the mobile browser chrome (URL bar) appears or hides.
+ * Inner padding uses ``env(safe-area-inset-bottom)`` so the iPhone
+ * home indicator doesn't eat the last row of tiles.
  *
- * **Snap points** (vh percentages, peek default 30, mid 70, full 95)
+ * **Snap points** (svh percentages, peek default 30, mid 70, full 95)
  * are configurable via ``theme.canvas.snapPoints``. ``peek`` is the
  * lowest position the sheet rests at — dragging below peek with a
  * downward velocity dispatches ``canvas-toggle`` (close) rather than
- * snapping back. The translateY is computed as ``(100 - snapVh)%``.
+ * snapping back. The translateY is computed as ``(100 - snapVh)svh``.
  *
  * **Drag handle** is a 44px-tall touch target across the top, matching
  * Apple's recommended minimum for finger taps. ``pointerdown`` here

package/dist/components/SyntroCanvasOverlay.d.ts

@@ -82,6 +82,8 @@ export declare class SyntroCanvasOverlay extends LitElement {
     isMobileMode: boolean;
     private _notifications;
     private _surfaceUnsub;
+    private _toggleCooldown;
+    private _toggleCooldownTimer;
     /** Prev-state map: entry.id → last evaluated boolean */
     private _notifyPrevState;
     /** Unsubscribe for the EventBus notify-watcher subscription */

package/dist/index.js

@@ -7833,7 +7833,7 @@ var SyntroBottomSheet = class extends LitElement6 {
       const targetTransform = container.style.transform;
       const targetTransition = container.style.transition;
       container.style.transition = "none";
-      container.style.transform = "translateY(100vh)";
+      container.style.transform = "translateY(100svh)";
       this._entryRafId = requestAnimationFrame(() => {
         container.style.transition = targetTransition;
         container.style.transform = targetTransform;
@@ -8005,15 +8005,17 @@ var SyntroBottomSheet = class extends LitElement6 {
       left: "0",
       right: "0",
       bottom: "0",
-      // ``100dvh`` (dynamic viewport height) shrinks when the iOS soft
-      // keyboard appears, so a tile with a text input doesn't end up
-      // covered by the keyboard. ``100vh`` would be measured against the
-      // pre-keyboard viewport and lose the bottom of the sheet behind
-      // the keyboard. Browser support: Safari 15.4+, Chrome 108+,
-      // Firefox 101+ — universal in 2026.
-      height: "100dvh",
+      // ``100svh`` (small viewport height) is the viewport with the
+      // mobile browser chrome (URL bar) visible.  Using ``svh`` instead
+      // of ``dvh`` prevents the sheet from jumping when Chrome/Safari
+      // shows or hides the URL bar — the sheet is always sized for the
+      // smallest viewport.  When the URL bar hides, a small gap appears
+      // at the bottom rather than a jarring position shift.  Browser
+      // support: Safari 15.4+, Chrome 108+, Firefox 101+ — universal
+      // in 2026.
+      height: "100svh",
       pointerEvents: "auto",
-      transform: `translateY(${topEdgeVh}vh)`,
+      transform: `translateY(${topEdgeVh}svh)`,
       transition: this.isDragging ? "none" : `transform ${dur} ${ease}, opacity ${dur} ease-out`,
       display: "flex",
       flexDirection: "column",
@@ -8049,7 +8051,7 @@ var SyntroBottomSheet = class extends LitElement6 {
       overflowY: "auto",
       padding: "0 1rem 1rem",
       touchAction: "pan-y",
-      maxHeight: `calc(${snapVh}dvh - 56px)`
+      maxHeight: `calc(${snapVh}svh - 56px)`
     };
     return html6`
       <div data-syntro-bottom-sheet="root" style=${styleMap6(rootStyles)}>
@@ -9082,6 +9084,9 @@ var SyntroCanvasOverlay = class extends LitElement7 {
     // ---- Controllers -------------------------------------------------------
     __publicField(this, "_notifications");
     __publicField(this, "_surfaceUnsub", null);
+    // ---- Toggle guard -------------------------------------------------------
+    __publicField(this, "_toggleCooldown", false);
+    __publicField(this, "_toggleCooldownTimer", null);
     // ---- NotifyWatcher state -----------------------------------------------
     /** Prev-state map: entry.id → last evaluated boolean */
     __publicField(this, "_notifyPrevState", /* @__PURE__ */ new Map());
@@ -9108,6 +9113,10 @@ var SyntroCanvasOverlay = class extends LitElement7 {
     this._stopNotifyWatcher();
     (_a3 = this._surfaceUnsub) == null ? void 0 : _a3.call(this);
     this._surfaceUnsub = null;
+    if (this._toggleCooldownTimer !== null) {
+      clearTimeout(this._toggleCooldownTimer);
+      this._toggleCooldownTimer = null;
+    }
   }
   _subscribeSurface() {
     var _a3;
@@ -9221,7 +9230,14 @@ var SyntroCanvasOverlay = class extends LitElement7 {
   }
   _toggle() {
     var _a3, _b;
+    if (this._toggleCooldown) return;
     const next = !this.isOpen;
+    this.isOpen = next;
+    this._toggleCooldown = true;
+    this._toggleCooldownTimer = setTimeout(() => {
+      this._toggleCooldown = false;
+      this._toggleCooldownTimer = null;
+    }, 300);
     if (next) {
       (_a3 = this.telemetry) == null ? void 0 : _a3.trackCanvasOpened("overlay");
     } else {
@@ -9531,7 +9547,7 @@ function error(prefix, message, data) {
 }
 
 // src/version.ts
-var SDK_VERSION = "2.8.0-canary.177";
+var SDK_VERSION = "2.8.0-canary.179";
 
 // src/types.ts
 var SDK_SCHEMA_VERSION = "2.0";