@taprootio/site-authoring 0.22.0 → 0.22.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@taprootio/site-authoring",
-  "version": "0.22.0",
+  "version": "0.22.2",
   "description": "Taproot site authoring CLI: sign in once in the browser, then pull, validate, push, preview, approve, and deploy a site from the terminal",
   "type": "module",
   "license": "ISC",
@@ -28,7 +28,7 @@
     "README.md"
   ],
   "dependencies": {
-    "@taprootio/espalier": "6.3.0",
+    "@taprootio/espalier": "6.5.0",
     "mediabunny": "1.61.1"
   },
   "scripts": {

package/src/changelog.json

@@ -1,5 +1,22 @@
 {
   "entries": [
+    {
+      "version": "0.22.2",
+      "note": "Free-form sections pad evenly with the page padding wherever they render, including preview-page; Espalier 6.5.0 lets the page preview take the width a capped main column leaves it.",
+      "behavior": [
+        "The renderer writes a standard free-form section's padding on the section (--esp-size-padding on every side, in place of Espalier's side padding of --esp-size-medium and larger top and bottom), so preview-page and the editor's live preview show the same padding the published page does. A section with no theme context also shows the page background through it, as the published page does. Sections with contentPadding none are unchanged. Republish to apply it to a published page.",
+        "Espalier 6.5.0 changes the editor page layout only. The default site theme is rebuilt against it and its content is unchanged except for the recorded Espalier version, so pulled and validated themes behave as before."
+      ],
+      "help": []
+    },
+    {
+      "version": "0.22.1",
+      "note": "Espalier 6.4.0: dialogs can be bounded by inset properties; the default site theme output is unchanged.",
+      "behavior": [
+        "Espalier 6.4.0 adds four inset properties on dialogs and lets a full-screen box follow them. The default site theme is rebuilt against it and its content is unchanged except for the recorded Espalier version, so pulled and validated themes behave as before."
+      ],
+      "help": []
+    },
     {
       "version": "0.22.0",
       "note": "validate warns when a free-form page has no h1 or a banner or hero already claims it, and about alt text, link text, long titles and missing descriptions.",

package/src/content/tiptap-prosemirror.ts

@@ -745,7 +745,17 @@ function renderSection(
       "--esp-section-padding-inline: 0",
       "--esp-section-padding-block: 0",
     );
+  } else {
+    // Espalier pads a section's sides with `--esp-size-medium` and its top and bottom with the larger
+    // `--esp-size-section`. A free-form section pads evenly all round with the page padding, and says so
+    // here, in the one place that renders it, so the published page, the editor's live preview and the
+    // CLI all get the same padding (TR01258: the page shell used to add it, and the preview has no shell).
+    sectionStyleParts.push(
+      "--esp-section-padding-inline: var(--esp-size-padding)",
+      "--esp-section-padding-block: var(--esp-size-padding)",
+    );
   }
+
   // Espalier paints the decoration plane only on a section carrying the
   // `decoration` attribute, so the hooks and the attribute travel together.
   const decorationStyle = kind === "explicit" ? normalizedSectionDecorationStyle(attrs.decoration) : undefined;
@@ -758,6 +768,10 @@ function renderSection(
     sectionStyleParts.push(
       `--esp-section-background: color-mix(in oklab, var(--esp-color-background) ${background.scrimOpacityPercent}%, transparent)`,
     );
+  } else if (!context) {
+    // A section with no theme context lets the page background show through; Espalier would paint the
+    // plain page colour over a page background image. (A photo background's scrim above replaces it.)
+    sectionStyleParts.push("--esp-section-background: transparent");
   }
   const sectionStyle = sectionStyleParts.length > 0 ? sectionStyleParts.join("; ") : undefined;
   const content = renderElement(