dsh-fonttune 0.7.0 → 0.7.1

package/CHANGELOG.en.md

@@ -2,6 +2,19 @@
 
 All notable changes to **dsh-fonttune** are documented here. Chinese version: [CHANGELOG.md](CHANGELOG.md).
 
+## [0.7.1] - 2026-10-20
+
+### Changed
+- **The panel and the dot each decide their own side**: the panel opens into the quadrant its own middle sits in, while the dot still snaps to the corner it remembers, so the two no longer share one rule.
+- **Switching corners takes less travel**: the conversation's middle is the line to cross, so the corner follows the panel's own middle rather than the region's edge.
+- **Snapping is one continuous motion**: after a release the panel and the dot travel to the target corner together, instead of the panel jumping to the other side first and then sliding.
+
+### Fixed
+- **The panel sometimes rested on the window's bottom-left corner**: while the conversation was not measurable yet, the dot was moved onto the window corner and that position was stored; it now moves only against a measurable conversation and never stores a stand-in.
+- **The dot sat on the sidebar in a narrow window**: a conversation squeezed to a sliver is still the region, instead of falling back to the whole window.
+- **The shadow did not follow the unfold**: the panel's shadow now changes with the shape while it unfolds and folds.
+- **The first frame of an unfold flickered**: the panel no longer blinks before it appears.
+
 ## [0.7.0] - 2026-10-19
 
 ### Changed

package/CHANGELOG.md

@@ -2,6 +2,19 @@
 
 **dsh-fonttune** 的重要变更都记录在这里。英文版见 [CHANGELOG.en.md](CHANGELOG.en.md)。
 
+## [0.7.1] - 2026-10-20
+
+### 变更
+- **面板与圆点各自决定吸附方向**：面板按自己的中心落在对话区的哪个象限展开，圆点仍吸附到自己记住的角落，两者不再共用一套判断。
+- **换角所需移动更少**：以对话区中心为原点，面板中心越过中线即可换到对应的角，不必先拖到区域边缘。
+- **吸附是一个连续动作**：换角松手后，面板与圆点一同滑向目标角落，面板不再先跳到另一侧再飞过去。
+
+### 修复
+- **悬浮面板偶尔停在窗口左下角**：对话区尚未完成布局的瞬间，圆点会被移到窗口角落并记住那个位置；现在只在对话区可测量时移动，也不再保存这种临时位置。
+- **窗口很窄时圆点落在侧边栏上**：对话区被挤成一条窄边时仍按对话区吸附，不再退回整块窗口。
+- **展开与收起时投影不同步**：面板的投影现在随展开、收起的形状一同变化。
+- **展开的第一帧闪动**：面板展开时不再先闪一下再出现。
+
 ## [0.7.0] - 2026-10-19
 
 ### 变更

package/README.en.md

@@ -39,7 +39,7 @@ The floating tuning panel (left, with its "in force right now" readout) and the
 
 | Plugin version | Supported DSH versions |
 | --- | --- |
-| **0.7.x** (latest, 0.7.0) | 0.1.7-alpha.1, 0.1.7-alpha.2, 0.1.7-rc.1, 0.1.7-rc.2, 0.2.0-rc.1, 0.2.0-rc.2, 0.2.1-alpha.1, 0.2.1-alpha.2, 0.2.1-alpha.3, 0.2.1-alpha.4, 0.2.1-alpha.5, 0.2.1-rc.1, 0.2.1-rc.2 |
+| **0.7.x** (latest, 0.7.1) | 0.1.7-alpha.1, 0.1.7-alpha.2, 0.1.7-rc.1, 0.1.7-rc.2, 0.2.0-rc.1, 0.2.0-rc.2, 0.2.1-alpha.1, 0.2.1-alpha.2, 0.2.1-alpha.3, 0.2.1-alpha.4, 0.2.1-alpha.5, 0.2.1-rc.1, 0.2.1-rc.2 |
 | 0.6.x (0.6.2) | 0.1.7-alpha.1, 0.1.7-alpha.2, 0.1.7-rc.1, 0.1.7-rc.2, 0.2.0-rc.1, 0.2.0-rc.2, 0.2.1-alpha.1, 0.2.1-alpha.2, 0.2.1-alpha.3, 0.2.1-alpha.4, 0.2.1-alpha.5, 0.2.1-rc.1, 0.2.1-rc.2 |
 | 0.5.x (0.5.0) | 0.1.7-alpha.1, 0.1.7-alpha.2, 0.1.7-rc.1, 0.1.7-rc.2, 0.2.0-rc.1, 0.2.0-rc.2, 0.2.1-alpha.1, 0.2.1-alpha.2 |
 | 0.4.x (0.4.2) | 0.1.7-alpha.1, 0.1.7-alpha.2, 0.1.7-rc.1, 0.1.7-rc.2, 0.2.0-rc.1, 0.2.0-rc.2, 0.2.1-alpha.1, 0.2.1-alpha.2 |

package/README.md

@@ -39,7 +39,7 @@
 
 | 插件版本 | 支持的 DSH 版本 |
 | --- | --- |
-| **0.7.x**（最新，0.7.0） | 0.1.7-alpha.1、0.1.7-alpha.2、0.1.7-rc.1、0.1.7-rc.2、0.2.0-rc.1、0.2.0-rc.2、0.2.1-alpha.1、0.2.1-alpha.2、0.2.1-alpha.3、0.2.1-alpha.4、0.2.1-alpha.5、0.2.1-rc.1、0.2.1-rc.2 |
+| **0.7.x**（最新，0.7.1） | 0.1.7-alpha.1、0.1.7-alpha.2、0.1.7-rc.1、0.1.7-rc.2、0.2.0-rc.1、0.2.0-rc.2、0.2.1-alpha.1、0.2.1-alpha.2、0.2.1-alpha.3、0.2.1-alpha.4、0.2.1-alpha.5、0.2.1-rc.1、0.2.1-rc.2 |
 | 0.6.x（0.6.2） | 0.1.7-alpha.1、0.1.7-alpha.2、0.1.7-rc.1、0.1.7-rc.2、0.2.0-rc.1、0.2.0-rc.2、0.2.1-alpha.1、0.2.1-alpha.2、0.2.1-alpha.3、0.2.1-alpha.4、0.2.1-alpha.5、0.2.1-rc.1、0.2.1-rc.2 |
 | 0.5.x（0.5.0） | 0.1.7-alpha.1、0.1.7-alpha.2、0.1.7-rc.1、0.1.7-rc.2、0.2.0-rc.1、0.2.0-rc.2、0.2.1-alpha.1、0.2.1-alpha.2 |
 | 0.4.x（0.4.2） | 0.1.7-alpha.1、0.1.7-alpha.2、0.1.7-rc.1、0.1.7-rc.2、0.2.0-rc.1、0.2.0-rc.2、0.2.1-alpha.1、0.2.1-alpha.2 |

package/lib/client.js

@@ -1194,6 +1194,15 @@ function floatBoundsPick(rects, viewport) {
   if (!isFinite(vh) || vh <= 0) vh = FLOAT_VIEWPORT_H;
   var full = { left: 0, top: 0, right: vw, bottom: vh, width: vw, height: vh };
   var list = Array.isArray(rects) ? rects : [];
+  // A region narrower than one dot used to count as "no region at all", and the
+  // fallback was the WHOLE viewport — so in a narrow window the dot parked on the
+  // window's own corner, over the sidebar, instead of on the conversation's. The
+  // largest readable box is kept as a fallback, and it names itself in `index` so
+  // the watcher holds the box whose size actually defines the region. `full` is
+  // left for a page with no region at all — or only degenerate 0-area rects.
+  var best = null;
+  var bestIndex = -1;
+  var bestArea = -1;
   for (var index = 0; index < list.length; index += 1) {
     var box = floatBoxOf(list[index]);
     if (box === null) continue;
@@ -1203,12 +1212,18 @@ function floatBoundsPick(rects, viewport) {
     var bottom = Math.max(0, Math.min(vh, box.bottom));
     var width = right - left;
     var height = bottom - top;
+    if (width > 0 && height > 0 && width * height > bestArea) {
+      bestArea = width * height;
+      bestIndex = index;
+      best = { left: left, top: top, right: right, bottom: bottom, width: width, height: height };
+    }
     if (width < FLOAT_BOUNDS_MIN || height < FLOAT_BOUNDS_MIN) continue;
     return {
       index: index,
       bounds: { left: left, top: top, right: right, bottom: bottom, width: width, height: height },
     };
   }
+  if (best !== null) return { index: bestIndex, bounds: best };
   return { index: -1, bounds: full };
 }
 
@@ -1327,6 +1342,36 @@ function floatTransformOrigin(quadrant) {
   return "100% 100%";
 }
 
+/**
+ * Which side the open CARD grows towards: the one with more room for it.
+ *
+ * The card hangs off the dot, so it can only extend one way from it, and the
+ * side that holds more of the card is the side the conversation has room for.
+ * Each axis compares the room beyond the dot's own box on either side and sends
+ * the card to the larger one — which is also the side its middle ends up on, so
+ * "the panel goes to the corner it sits in" holds by construction.
+ *
+ * This is the CARD's rule, not the dot's: the dot keeps the corner it remembers
+ * living in (see `floatCornerPoint`), while a rule shared by both is what made
+ * the card jump whenever the dot crossed a line the card had not. The answer
+ * depends on the dot and the region and on nothing else — never on a card it
+ * just placed — so it cannot vote itself back and forth.
+ * @param {unknown} bounds - the region, as `floatBoundsFrom` returns it.
+ * @param {number} x - the dot's left edge, in CSS pixels.
+ * @param {number} y - the dot's top edge, in CSS pixels.
+ * @param {number} [dot] - the dot's diameter (defaults to FLOAT_DOT).
+ * @returns {string} one of "tl", "tr", "bl", "br" — the quadrant the card is
+ *   anchored on, which is the corner it grows away from.
+ */
+function floatCardCorner(bounds, x, y, dot) {
+  var box = floatBoxOf(bounds);
+  if (box === null) box = { left: 0, top: 0, right: FLOAT_VIEWPORT_W, bottom: FLOAT_VIEWPORT_H };
+  var size = dot === undefined ? FLOAT_DOT : dot;
+  var growRight = box.right - x >= x + size - box.left;
+  var growDown = box.bottom - y >= y + size - box.top;
+  return (growDown ? "t" : "b") + (growRight ? "l" : "r");
+}
+
 /**
  * Which corner of the card lands on the dot, and where the expansion starts.
  *
@@ -4623,6 +4668,7 @@ var shared = {
   floatExpandDirection: floatExpandDirection,
   floatTransformOrigin: floatTransformOrigin,
   floatCardAnchor: floatCardAnchor,
+  floatCardCorner: floatCardCorner,
   floatClipStart: floatClipStart,
   floatClipRest: floatClipRest,
   isRestClip: isRestClip,
@@ -10377,7 +10423,10 @@ var GLASS_OK = (function () {
 
 function mountFloatPanel(scope, t, hostCtx) {
   /** How far the panel's drop shadow reaches past its own box (10px offset + blur). */
-  var SHADOW_REACH = 56;  var noop = function () {};
+  var SHADOW_REACH = 56;
+  /** The dot's own snap slide, in ms — the stylesheet's `.dfp-floatSnap` transition. */
+  var FLOAT_SNAP_MS = 160;
+  var noop = function () {};
   if (typeof document === "undefined" || !document.body) return { destroy: noop, toggle: noop };
   // The offline stand-ins hand out element stubs without listeners or
   // selectors; without a real element face there is nothing to mount on.
@@ -10468,6 +10517,19 @@ function mountFloatPanel(scope, t, hostCtx) {
   // end on the same small rectangle the unfold started from, and the card's own
   // measurement only exists while it is mounted.
   var liveQuadrant = null;
+  // The CARD's own side, re-decided when the panel opens (and when the dot is
+  // dropped or the region changes shape). It is NOT the dot's corner: the card
+  // goes wherever it has the most room, while the dot keeps the corner it
+  // remembers living in. One rule shared by both is what made the card jump
+  // whenever the dot crossed a line the card had not.
+  var cardQuadrant = null;
+  // Whether the NEXT render follows a snap. The card then keeps the place it
+  // already had on screen and TRAVELS to the new corner with the dot, instead of
+  // jumping a panel-width to the other side of it (see the glide in `render`).
+  var anchorGlide = false;
+  // The card's own offset inside the host, as laid out last time: the glide is
+  // the difference between where the new side puts it and that.
+  var lastAnchor = null;
 
   var el = function (tag, className, text) {
     var node = document.createElement(tag);
@@ -10846,6 +10908,11 @@ function mountFloatPanel(scope, t, hostCtx) {
     return null;
   };
 
+  // Whether the last region reading was a real region or the whole-window
+  // stand-in (see `floatBounds`). A stand-in never moves the dot: it means "no
+  // conversation to measure right now", not "the conversation is the window".
+  var boundsAreReal = false;
+
   /** The window size the bounds are cut to, with the shared fallback. */
   var floatViewport = function () {
     return {
@@ -10975,10 +11042,19 @@ function mountFloatPanel(scope, t, hostCtx) {
    * The conversation when it can be found, the whole window when it cannot (a
    * settings page has no prose at all): the window is what this used to be
    * everywhere, and it stays the last resort rather than the rule.
+   *
+   * WHICH one answered is remembered in `boundsAreReal`, because the two are not
+   * interchangeable for a MOVE: the whole window is a stand-in for "there is no
+   * conversation to measure at this instant" — a session still mounting, a
+   * message list laid out at 0×0 — and a dot parked on the window's corner over
+   * a page that does have a conversation is exactly the reported "it sits on the
+   * window's left edge instead of the conversation's corner".
    * @returns {object} the bounds, in viewport coordinates.
    */
   var floatBounds = function () {
-    return shared.floatBoundsFrom(floatBoundsRects(), floatViewport());
+    var picked = shared.floatBoundsPick(floatBoundsRects(), floatViewport());
+    boundsAreReal = picked.index >= 0;
+    return picked.bounds;
   };
 
   /**
@@ -11067,6 +11143,36 @@ function mountFloatPanel(scope, t, hostCtx) {
     );
   };
 
+  /**
+   * The shade's scale for the panel's CURRENT visible box.
+   *
+   * Read from the card's own clip every frame, not driven by a CSS transition: the
+   * small value only exists for the two arming frames, and a transition beginning
+   * there is cleared before it can run (measured: the inline value was gone and
+   * `transform` was `none` 138 ms into the unfold, with the shadow at full size the
+   * whole way). Written per frame, the shadow is exactly as big as what the panel
+   * is showing, on every frame, by construction.
+   * @param {object} card - the live card.
+   * @param {string} clip - its computed clip-path.
+   * @returns {string} the inline transform, or "" for the resting panel.
+   */
+  var shadeFromClip = function (card, clip) {
+    if (clip === "none") return "";
+    var found = /^inset\((-?[\d.]+)px (-?[\d.]+)px (-?[\d.]+)px (-?[\d.]+)px/.exec(clip);
+    if (found === null) return "";
+    var width = 0;
+    var height = 0;
+    try {
+      width = card.offsetWidth;
+      height = card.offsetHeight;
+    } catch (error) {
+      return "";
+    }
+    if (!(width > 0) || !(height > 0)) return "";
+    var visibleW = Math.max(1, width - Number(found[2]) - Number(found[4]));
+    var visibleH = Math.max(1, height - Number(found[1]) - Number(found[3]));
+    return "scale(" + (visibleW / width).toFixed(4) + ", " + (visibleH / height).toFixed(4) + ")";
+  };
   var mirrorGlassClip = function (card, glass, ms) {    if (glass === null || glass === undefined) return;
     var shade = host.querySelector(".dfp-floatShade");
     var until = Date.now() + ms;
@@ -11079,11 +11185,11 @@ function mountFloatPanel(scope, t, hostCtx) {
         return;
       }
       glass.style.clipPath = clip;
-      // The shade gets the same shape GROWN by the shadow's reach: its shadow
-      // paints OUTSIDE the box, so an exact clip would cut the shadow off, while no
-      // clip at all left a static frame around the growing panel — the "second edge"
-      // that ran alongside the panel's own.
-      if (shade !== null && shade !== undefined) shade.style.clipPath = growClip(clip, SHADOW_REACH);
+            // The shade is SCALED to the panel's visible box, frame by frame (see
+      // `shadeFromClip`): its shadow is painted from its own box, so a layer left at
+      // the full panel size shows a full-size shadow for the whole unfold — the
+      // "second edge" beside the panel's own. Scaling the layer scales the shadow.
+      if (shade !== null && shade !== undefined) shade.style.transform = shadeFromClip(card, clip);
       if (Date.now() < until) globalThis.requestAnimationFrame(step);
     };
     if (typeof globalThis.requestAnimationFrame === "function") globalThis.requestAnimationFrame(step);
@@ -11430,6 +11536,56 @@ function mountFloatPanel(scope, t, hostCtx) {
     return fallback;
   };
 
+  /**
+   * The middle of the CARD as it is on the page, or null while it is not.
+   *
+   * Read from the layer the card sits in (the wrapper carries the anchored edge
+   * and the size), so the unfold's own scale — which rides the card inside it —
+   * cannot make a growing panel look like a moving one.
+   * @returns {{x: number, y: number}|null} its middle in viewport coordinates.
+   */
+  var cardMiddle = function () {
+    var layer = null;
+    try {
+      layer = host.querySelector(".dfp-floatShadow");
+    } catch (error) {
+      layer = null;
+    }
+    if (layer === null || layer === undefined) return null;
+    var rect = rectOf(layer);
+    if (rect === null || !(rect.width > 0) || !(rect.height > 0)) return null;
+    return { x: rect.left + rect.width / 2, y: rect.top + rect.height / 2 };
+  };
+
+  /**
+   * Re-decide which side of the conversation the card opens towards.
+   *
+   * The rule is the card's OWN, and it is about ROOM: the card hangs off the
+   * dot, so it can only grow one way from it, and the side that holds more of it
+   * is the side the conversation has room for. Per axis the two rooms on either
+   * side of the dot are compared and the card is sent to the larger one, which
+   * is also the side its middle ends up on — the panel flies to the corner it
+   * sits in, measured against the conversation rather than against the dot.
+   *
+   * The dot keeps its own rule — the corner it remembers living in — and that
+   * difference is the point: a rule shared by both made the card jump whenever
+   * the dot crossed a line the card had not. This answer depends on the dot and
+   * the region and on nothing else, so it cannot vote itself back and forth.
+   *
+   * Called at the moments a side can legitimately change — an open, when the
+   * card does not exist yet, a release that lands the dot on another corner, and
+   * a region that changed shape — and never from `render`. A caller that changes
+   * the side must also place the card WITHOUT a slide: a side is an anchored
+   * edge, so the card moves by its own width when it changes.
+   * @param {object} [bounds] - the region, when the caller has it already.
+   */
+  var voteCardQuadrant = function (bounds, at) {
+    var region = bounds === undefined ? floatBounds() : bounds;
+    var origin = at === undefined ? pos : at;
+    if (origin === null || origin === undefined) return;
+    cardQuadrant = shared.floatCardCorner(region, origin.x, origin.y);
+  };
+
   /**
    * Snap the dot to the corner it LIVES in, with a short slide.
    *
@@ -11452,8 +11608,15 @@ function mountFloatPanel(scope, t, hostCtx) {
    * to send the dot to the top-left corner the user never asked for.
    * @returns {{x: number, y: number}} the corner the dot now sits on.
    */
-  var snapToCorner = function () {
+  var snapToCorner = function (instant) {
     var bounds = floatBounds();
+    // A stand-in region is not a home: the window's corner is what the dot would
+    // land on over a page whose conversation is merely not measurable yet, which
+    // is the reported "it snaps to the window's left edge instead of the
+    // conversation's corner". A dot the document already placed keeps the corner
+    // the last REAL region gave it; the observer settles it again the moment one
+    // exists (see `reflowIntoBounds`).
+    if (!boundsAreReal && pos !== null) return pos;
     var snapped;
     if (pos !== null) {
       snapped = cornerHome(bounds, pos);
@@ -11475,7 +11638,11 @@ function mountFloatPanel(scope, t, hostCtx) {
     }
     pos = snapped;
     try {
-      host.classList.add("dfp-floatSnap");
+      // An instant settle must also DROP a snap class left over from an earlier
+      // move, or the very same `left`/`top` write is animated and the panel appears
+      // to drift over from where it used to be.
+      if (instant === true) host.classList.remove("dfp-floatSnap");
+      else host.classList.add("dfp-floatSnap");
     } catch (error) {
       // A host without classes still lands on the snapped corner.
     }
@@ -11586,9 +11753,15 @@ function mountFloatPanel(scope, t, hostCtx) {
    *   dot rather than the document handing it a position.
    * @returns {boolean} true when the dot was moved onto its corner.
    */
-  var settleOnCorner = function (regionMoved) {
+  var settleOnCorner = function (regionMoved, instant) {
     if (drag !== null || resize !== null) return false;
     var bounds = floatBounds();
+    // Nothing real to settle onto: a shut panel on a settings page, or a
+    // conversation that is not measurable at this instant, leaves the dot where
+    // it is — moving it onto the window's corner is the bug, not the fallback.
+    // With nothing stored at all there is no home to keep, so the stylesheet's
+    // own corner is pinned as before.
+    if (!boundsAreReal && pos !== null) return false;
     var at = pos;
     if (at === null) {
       var rect = rectOf(host);
@@ -11628,7 +11801,7 @@ function mountFloatPanel(scope, t, hostCtx) {
       at.y + shared.FLOAT_DOT <= bounds.bottom + 0.5
     );
     pos = { x: Math.round(at.x), y: Math.round(at.y) };
-    snapToCorner();
+    snapToCorner(instant);
     // Both fields in ONE write: the dot is on the corner and the document is
     // told which corner that is, in the same `mutate`. A region that changed
     // shape is the caller that has to store the move it just made, wherever the
@@ -11653,8 +11826,22 @@ function mountFloatPanel(scope, t, hostCtx) {
    * `settleOnCorner`).
    */
   var reflowIntoBounds = function () {
-    if (!settleOnCorner(true)) return;
-    if (open) render();
+    var bounds = floatBounds();
+    var wasSide = cardQuadrant;
+    if (pos !== null) {
+      // The card's side belongs to the corner the dot is going to, so it is
+      // decided BEFORE the dot is moved — the two then land in the same frame,
+      // and a changed side never sweeps across the middle behind a slide.
+      var home = cornerHome(bounds, pos);
+      cardQuadrant = shared.floatCardCorner(bounds, home.x, home.y);
+    }
+    var moved = settleOnCorner(true);
+    if (open && (moved || cardQuadrant !== wasSide)) {
+      // The region moved the dot and possibly the card's side with it: follow it
+      // in one motion rather than in a jump and a slide (see `anchorGlide`).
+      anchorGlide = moved;
+      render();
+    }
   };
 
   /**
@@ -11948,7 +12135,10 @@ function mountFloatPanel(scope, t, hostCtx) {
       // browser cancelled) would otherwise unfold the card in the middle of the
       // conversation. An ordinary open — the dot already on its corner — moves
       // nothing at all.
-      settleOnCorner();
+      settleOnCorner(false, true);
+      // Which side the unfold goes to: the card's own vote, taken once, here —
+      // the one moment before it exists on the page (see `voteCardQuadrant`).
+      voteCardQuadrant();
       playEnter = true;
       if (closeTimer !== null) {
         globalThis.clearTimeout(closeTimer);
@@ -12242,10 +12432,35 @@ function mountFloatPanel(scope, t, hostCtx) {
       // region is where it lives from now on. Every other path reads the
       // remembered corner instead (see `settleOnCorner`), which is what keeps a
       // region change from re-deciding it from stale coordinates.
-      corner = shared.floatNearestCorner(floatBounds(), pos.x, pos.y);
+      var bounds = floatBounds();
+      // Which corner the dot goes to is read from the PANEL's own middle while
+      // the panel is up — a panel dragged by its head hangs a full card away
+      // from the dot, so asking where the DOT is made the user haul it far past
+      // the conversation's own middle to reach the far side. The conversation's
+      // middle is the origin either way: above it is up, right of it is right.
+      var ref = cardMiddle();
+      if (ref === null) {
+        ref = { x: pos.x + shared.FLOAT_DOT / 2, y: pos.y + shared.FLOAT_DOT / 2 };
+      }
+      corner = shared.floatQuadrantIn(bounds, ref.x, ref.y);
+      // The card's side is decided for the corner the dot LANDS on, not for
+      // where the hand let go: a dot moved to the opposite corner has to take
+      // the card with it, or the panel hangs off the conversation on the side
+      // the old corner had room on.
+      var home = shared.floatCornerPoint(bounds, corner);
+      // Voted for the corner the dot is LANDING on, without moving the dot
+      // first: a stand-in region refuses to move the dot, and a `pos` written
+      // here would then claim a corner the host never went to.
+      voteCardQuadrant(bounds, home);
+      // The snap itself is always animated. The card re-anchors in the same
+      // frame, so a side that changed is already on its new edge while the dot
+      // slides — one reposition at the release point rather than a card dragged
+      // across the screen with its far edge pinned.
       snapToCorner();
       var live = readState();
       writeLivePos(live);
+      // The rebuild that follows rides the snap: a side that changed glides.
+      anchorGlide = open;
       render();
     };
     var up = function () {
@@ -12457,7 +12672,12 @@ function mountFloatPanel(scope, t, hostCtx) {
     if (open && !(playEnter && !motionReduced()) && typeof dot.classList !== "undefined") {
       dot.classList.add("dfp-dotAway");
     }
-    if (!open) return;
+    if (!open) {
+      // A shut panel has no card to glide; a glide armed by a snap is spent here
+      // rather than left to surprise the next open.
+      anchorGlide = false;
+      return;
+    }
 
     // The shadow's own layer: the card is clipped while it animates, and a clip
     // on the card would clip the card's own filter away with it (see the sheet).
@@ -12483,15 +12703,24 @@ function mountFloatPanel(scope, t, hostCtx) {
       // first one is a decision, not a coincidence.
       anchor = { x: bounds.right, y: bounds.bottom };
     }
-    var quadrant = shared.floatQuadrantIn(bounds, anchor.x, anchor.y);
-    // The remembered corner is the answer the card is really anchored on: a
-    // region narrow enough puts a corner's coordinates on the other side of its
-    // own middle, and the card still has to grow AWAY from the corner the dot
-    // lives in rather than flip around it. A dot that is not on its remembered
-    // corner (mid-drag, or a position just adopted) is read from where it is.
-    // Asked through a helper: `corner` below is the CARD's anchored corner, and
-    // a local of that name here would shadow the dot's identity.
-    quadrant = dotQuadrant(bounds, anchor, quadrant);
+    var quadrant;
+    if (cardQuadrant !== null) {
+      // The card's side is its own answer (see `voteCardQuadrant`): the side of
+      // the dot that holds more of the card, voted when a side may change.
+      quadrant = cardQuadrant;
+    } else {
+      // A card that has never been placed anywhere unfolds out of the dot, which
+      // is also where a first panel ends up.
+      quadrant = shared.floatQuadrantIn(bounds, anchor.x, anchor.y);
+      // The remembered corner is the answer the card is really anchored on: a
+      // region narrow enough puts a corner's coordinates on the other side of its
+      // own middle, and the card still has to grow AWAY from the corner the dot
+      // lives in rather than flip around it. A dot that is not on its remembered
+      // corner (mid-drag, or a position just adopted) is read from where it is.
+      // Asked through a helper: `corner` below is the CARD's anchored corner, and
+      // a local of that name here would shadow the dot's identity.
+      quadrant = dotQuadrant(bounds, anchor, quadrant);
+    }
     liveQuadrant = quadrant;
     var expand = shared.floatExpandDirection(quadrant);
     try {
@@ -12822,10 +13051,45 @@ function mountFloatPanel(scope, t, hostCtx) {
       });
       card.appendChild(grip);
     })();
-    shadow.appendChild(el("div", "dfp-floatShade"));
+    var shadeEl = el("div", "dfp-floatShade");
+    shadeEl.style.transformOrigin = cardCorner.origin;
+    shadow.appendChild(shadeEl);
     shadow.appendChild(glass);
     shadow.appendChild(card);
     host.appendChild(shadow);
+    // A side is an anchored EDGE, so switching it moves the card by its own
+    // width in one frame. On a snap that would be a jump to the middle of the
+    // screen FOLLOWED by the slide to the corner — two motions. The card is put
+    // back where it already was on screen with a translate, and that translate
+    // is released over the dot's own 160 ms: the panel then travels from where
+    // the user let go straight to the corner, in one motion, with the dot.
+    var anchorLeft = 0;
+    var anchorTop = 0;
+    try {
+      anchorLeft = shadow.offsetLeft;
+      anchorTop = shadow.offsetTop;
+    } catch (error) {
+      // An unmeasurable layer keeps no glide; the side change is instant.
+    }
+    if (anchorGlide && lastAnchor !== null) {
+      anchorGlide = false;
+      var glideX = lastAnchor.left - anchorLeft;
+      var glideY = lastAnchor.top - anchorTop;
+      if (glideX !== 0 || glideY !== 0) {
+        try {
+          shadow.style.transform = "translate(" + glideX + "px," + glideY + "px)";
+          // One forced layout commits that frame, so the next write has a value
+          // to leave FROM; without it both writes land in one recalc and the
+          // glide is the same jump it was meant to remove.
+          shadow.getBoundingClientRect();
+          shadow.style.transition = "transform " + FLOAT_SNAP_MS + "ms ease";
+          shadow.style.transform = "none";
+        } catch (error) {
+          shadow.style.transform = "";
+        }
+      }
+    }
+    lastAnchor = { left: anchorLeft, top: anchorTop };
     // Enter animation, only on a real shut->open transition: the card starts
     // clipped to the dot's own rectangle, a hair smaller and dimmer, and the
     // next frames let the transition carry all three home (clip/transform/

package/lib/shared.cjs

@@ -1185,6 +1185,15 @@ function floatBoundsPick(rects, viewport) {
   if (!isFinite(vh) || vh <= 0) vh = FLOAT_VIEWPORT_H;
   var full = { left: 0, top: 0, right: vw, bottom: vh, width: vw, height: vh };
   var list = Array.isArray(rects) ? rects : [];
+  // A region narrower than one dot used to count as "no region at all", and the
+  // fallback was the WHOLE viewport — so in a narrow window the dot parked on the
+  // window's own corner, over the sidebar, instead of on the conversation's. The
+  // largest readable box is kept as a fallback, and it names itself in `index` so
+  // the watcher holds the box whose size actually defines the region. `full` is
+  // left for a page with no region at all — or only degenerate 0-area rects.
+  var best = null;
+  var bestIndex = -1;
+  var bestArea = -1;
   for (var index = 0; index < list.length; index += 1) {
     var box = floatBoxOf(list[index]);
     if (box === null) continue;
@@ -1194,12 +1203,18 @@ function floatBoundsPick(rects, viewport) {
     var bottom = Math.max(0, Math.min(vh, box.bottom));
     var width = right - left;
     var height = bottom - top;
+    if (width > 0 && height > 0 && width * height > bestArea) {
+      bestArea = width * height;
+      bestIndex = index;
+      best = { left: left, top: top, right: right, bottom: bottom, width: width, height: height };
+    }
     if (width < FLOAT_BOUNDS_MIN || height < FLOAT_BOUNDS_MIN) continue;
     return {
       index: index,
       bounds: { left: left, top: top, right: right, bottom: bottom, width: width, height: height },
     };
   }
+  if (best !== null) return { index: bestIndex, bounds: best };
   return { index: -1, bounds: full };
 }
 
@@ -1318,6 +1333,36 @@ function floatTransformOrigin(quadrant) {
   return "100% 100%";
 }
 
+/**
+ * Which side the open CARD grows towards: the one with more room for it.
+ *
+ * The card hangs off the dot, so it can only extend one way from it, and the
+ * side that holds more of the card is the side the conversation has room for.
+ * Each axis compares the room beyond the dot's own box on either side and sends
+ * the card to the larger one — which is also the side its middle ends up on, so
+ * "the panel goes to the corner it sits in" holds by construction.
+ *
+ * This is the CARD's rule, not the dot's: the dot keeps the corner it remembers
+ * living in (see `floatCornerPoint`), while a rule shared by both is what made
+ * the card jump whenever the dot crossed a line the card had not. The answer
+ * depends on the dot and the region and on nothing else — never on a card it
+ * just placed — so it cannot vote itself back and forth.
+ * @param {unknown} bounds - the region, as `floatBoundsFrom` returns it.
+ * @param {number} x - the dot's left edge, in CSS pixels.
+ * @param {number} y - the dot's top edge, in CSS pixels.
+ * @param {number} [dot] - the dot's diameter (defaults to FLOAT_DOT).
+ * @returns {string} one of "tl", "tr", "bl", "br" — the quadrant the card is
+ *   anchored on, which is the corner it grows away from.
+ */
+function floatCardCorner(bounds, x, y, dot) {
+  var box = floatBoxOf(bounds);
+  if (box === null) box = { left: 0, top: 0, right: FLOAT_VIEWPORT_W, bottom: FLOAT_VIEWPORT_H };
+  var size = dot === undefined ? FLOAT_DOT : dot;
+  var growRight = box.right - x >= x + size - box.left;
+  var growDown = box.bottom - y >= y + size - box.top;
+  return (growDown ? "t" : "b") + (growRight ? "l" : "r");
+}
+
 /**
  * Which corner of the card lands on the dot, and where the expansion starts.
  *
@@ -4614,6 +4659,7 @@ var shared = {
   floatExpandDirection: floatExpandDirection,
   floatTransformOrigin: floatTransformOrigin,
   floatCardAnchor: floatCardAnchor,
+  floatCardCorner: floatCardCorner,
   floatClipStart: floatClipStart,
   floatClipRest: floatClipRest,
   isRestClip: isRestClip,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-fonttune",
-  "version": "0.7.0",
+  "version": "0.7.1",
   "description": "Font plugin for the DeepSeek Harness Web GUI: the conversation gets its own font, size, line height and weight, the interface font and weight follow it, code keeps its own axis with ligature control, and whole setups save as presets.",
   "type": "module",
   "icon": "icon.svg",