@swiftbrowser/web 0.5.1 → 0.5.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swiftbrowser/web",
-  "version": "0.5.1",
+  "version": "0.5.2",
   "type": "module",
   "description": "SwiftBrowser web renderer and dev server: applies render ops from a Swift/Wasm app to the DOM inside an iPhone frame.",
   "repository": {

package/src/layout/engine.ts

@@ -3262,10 +3262,19 @@ export class LayoutPass {
       );
       const trailingUsed = trailingWidth > 0 || chrome['more'] !== undefined || inlineSecondary.length > 0;
       const rightUsed = trailingUsed ? x + size.width - (trailingEdge + NAV_GROUP_SPACING) : 0;
-      const side = Math.max(leftUsed, rightUsed) + 8;
-      const available = Math.max(0, size.width - 2 * side);
-      const titleWidth = Math.min(Math.ceil(this.measurer.measureWidth(title, titleFont) - 0.001), Math.floor(size.width * 0.56), Math.floor(available));
-      chrome['title'] = { x: x + (size.width - titleWidth) / 2, y: rowY, width: titleWidth, height: NAV_BAR_HEIGHT };
+      // As UIKit places it: centered in the bar when it fits there; else slid
+      // off-center into the room the items leave (between them, 8 clear of
+      // each side), and truncated only when it does not fit even there.
+      const roomStart = x + leftUsed + 8;
+      const roomEnd = x + size.width - rightUsed - 8;
+      const titleWidth = Math.min(
+        Math.ceil(this.measurer.measureWidth(title, titleFont) - 0.001),
+        Math.floor(size.width * 0.56),
+        Math.floor(Math.max(0, roomEnd - roomStart)),
+      );
+      const centered = x + (size.width - titleWidth) / 2;
+      const titleX = Math.max(roomStart, Math.min(centered, roomEnd - titleWidth));
+      chrome['title'] = { x: titleX, y: rowY, width: titleWidth, height: NAV_BAR_HEIGHT };
     }
     this.setChrome(node, chrome);