fix(base): keep inline embed left edge at page-content, extend right only

Removing the leftward extension. With negative margin-left, the
grid grew leftward past page-content and the first column appeared
near the sidebar edge on load — wrong; Notion keeps the first column
aligned with page text. Drop margin-left and the extendLeft
calculation; only extend rightward toward AppShell.Main's right edge.

Leftward viewport extension (so frozen columns can lock at the
sidebar edge during scroll) becomes meaningful once we add frozen
columns. Deferred until that feature lands.

apps/client/src/features/base/components/base-table.tsx

@@ -315,14 +315,14 @@ export function BaseTable({ pageId, embedded }: BaseTableProps) {
   if (!base) return null;
 
   // When embedded inline in a doc page, the parent <NodeViewWrapper>
-  // exposes --embed-extend-l / --embed-extend-r (positive px values).
+  // exposes --embed-extend-r (positive px). We pull the grid's right
-  // We pull the grid's left/right edges outward via negative margin —
+  // edge outward via negative margin-right — box-model: width: auto
-  // box-model: width: auto becomes parent_width + extend, so the box
+  // becomes parent_width + |margin|, so the box physically grows past
-  // physically grows past its parent's bounds. The toolbar keeps the
+  // its parent's bounds. Left edge stays at the wrapper's natural
-  // parent-constrained width so it stays in line with the page text.
+  // (page-content) position so the table aligns with page text on
+  // load. Toolbar is unchanged.
   const gridExtendStyle = embedded
     ? ({
-        marginLeft: "calc(-1 * var(--embed-extend-l, 0px))",
         marginRight: "calc(-1 * var(--embed-extend-r, 0px))",
       } as const)
     : undefined;

apps/client/src/features/editor/components/base-embed/base-embed-view.tsx

@@ -6,26 +6,22 @@ import { useBaseQuery } from "@/features/base/queries/base-query";
 
 const SIDE_GUTTER = 8;
 
-// Anchor directly to AppShell.Main (the <main> tag) for both sides.
+// Extend the grid only to the right — toward AppShell.Main's right
-// This is the layout container that already accounts for the navbar's
+// edge. The left edge stays at the wrapper's natural (page-content)
-// width and sidebar collapse state — its left/right edges are exactly
+// position so the table is visually aligned with the page text on
-// where the embed should extend to.
+// load, matching Notion. Leftward scroll-viewport extension is only
+// meaningful once we add frozen columns that need to lock at the
+// sidebar edge; deferred until then.
 function applyExtension(wrapper: HTMLDivElement) {
   const rect = wrapper.getBoundingClientRect();
   if (rect.width === 0) return;
 
   const main = wrapper.closest("main") as HTMLElement | null;
-  const mainRect = main?.getBoundingClientRect();
+  const targetRight = main
-
+    ? main.getBoundingClientRect().right - SIDE_GUTTER
-  const targetLeft = (mainRect?.left ?? 0) + SIDE_GUTTER;
-  const targetRight = mainRect
-    ? mainRect.right - SIDE_GUTTER
     : window.innerWidth - SIDE_GUTTER;
 
-  const extendLeft = Math.max(0, rect.left - targetLeft);
   const extendRight = Math.max(0, targetRight - rect.right);
-
-  wrapper.style.setProperty("--embed-extend-l", `${extendLeft}px`);
   wrapper.style.setProperty("--embed-extend-r", `${extendRight}px`);
 }