@cmo-so/cli 0.12.8 → 0.12.10

package/dist/cmo.mjs

@@ -14658,6 +14658,54 @@ function replace(blocks, ref, next, synced = {}) {
 function sectionAt(blocks, ref, synced = {}) {
   return pick(locate(blocks), ref, synced);
 }
+function widthValue(width) {
+  const w = String(width ?? "").trim();
+  if (w === "content") return null;
+  if (w === "wide") return "var(--wp--style--global--wide-size)";
+  if (/^\d{2,4}(\.\d+)?(px|rem|em|vw|%)$/.test(w)) return w;
+  throw new Error('width: "content", "wide" or a CSS length such as 1240px.');
+}
+var NARROW_PX = 700;
+var sizePx = (v) => {
+  const m = /^(\d+(?:\.\d+)?)(px|rem|em)$/.exec(v);
+  return m ? Number(m[1]) * (m[2] === "px" ? 1 : 16) : null;
+};
+function setSectionWidth(b, width) {
+  const size = widthValue(width);
+  const before = [];
+  const visit = (x, top) => {
+    let changed = false;
+    for (const c of x.inner) if (visit(c, false)) changed = true;
+    const lay = x.attrs.layout;
+    const constrained = lay?.type === "constrained";
+    const cur = lay?.contentSize;
+    const px = cur ? sizePx(cur) : null;
+    const eligible = constrained && (!cur || cur.includes("--wp--style--global") || px == null || px >= NARROW_PX);
+    if (eligible || top && !lay && (x.name === "core/group" || x.name === "core/cover")) {
+      if ((cur ?? null) !== size) {
+        before.push(cur ?? "content");
+        const next = { ...lay ?? {}, type: "constrained" };
+        if (size) next.contentSize = size;
+        else delete next.contentSize;
+        x.attrs = { ...x.attrs, layout: next };
+        changed = true;
+      }
+    }
+    if (changed) delete x.raw;
+    return changed;
+  };
+  visit(b, true);
+  return { containers: before.length, before };
+}
+function refreshRaw(list3) {
+  let any = false;
+  for (const b of list3) {
+    const inner = refreshRaw(b.inner);
+    if (inner) delete b.raw;
+    if (inner || b.raw == null) any = true;
+  }
+  return any;
+}
 var escRe = (s) => s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
 function applyEdits(b, e) {
   let m = serializeBlock(b);
@@ -15195,6 +15243,15 @@ async function styleGet(site) {
       fonts: (user.settings?.typography?.fontFamilies?.theme ?? []).map((f) => f.slug)
     },
     contrast: contrastReport(Object.fromEntries([...palette.values()].map((c) => [c.slug, c.color]))),
+    layout: {
+      content: user.settings?.layout?.contentSize ?? base.settings?.layout?.contentSize ?? null,
+      wide: user.settings?.layout?.wideSize ?? base.settings?.layout?.wideSize ?? null,
+      padding: {
+        left: user.styles?.spacing?.padding?.left ?? base.styles?.spacing?.padding?.left ?? null,
+        right: user.styles?.spacing?.padding?.right ?? base.styles?.spacing?.padding?.right ?? null
+      }
+    },
+    css: user.styles?.css ?? "",
     _palette: [...palette.values()],
     _fonts: [...fonts.values()],
     _user: user
@@ -15235,6 +15292,17 @@ function contrastReport(colors) {
   });
 }
 async function styleSet(site, change, force = false) {
+  const len = (v, what) => {
+    const t = String(v ?? "").trim();
+    if (!/^(0|\d{1,4}(\.\d+)?(px|rem|em|vw|%)|var\(--wp--preset--spacing--[a-z0-9-]+\)|clamp\([0-9a-z.,%+\-\s()]+\))$/i.test(
+      t
+    ))
+      throw new Error(`${what}: "${t}" isn't a CSS length like 1240px, 2rem or var(--wp--preset--spacing--50).`);
+    return t;
+  };
+  for (const css of [change.css, change.css_append])
+    if (css != null && /<\/?style|<\?|<script|@import\s+url\(\s*['"]?(?!https:)/i.test(css))
+      throw new Error("css: plain CSS only (no <style>, <script>, PHP or non-https imports).");
   const cur = await styleGet(site);
   const palette = cur._palette.map((c) => ({ ...c }));
   for (const [slug, color] of Object.entries(change.colors ?? {})) {
@@ -15259,15 +15327,48 @@ async function styleSet(site, change, force = false) {
     );
   const user = cur._user;
   const settings2 = { ...user.settings ?? {} };
+  const styles = { ...user.styles ?? {} };
   if (change.colors) settings2.color = { ...settings2.color ?? {}, palette: { theme: palette } };
   if (change.fonts)
     settings2.typography = { ...settings2.typography ?? {}, fontFamilies: { theme: fonts } };
+  if (change.layout) {
+    const layout = { ...settings2.layout ?? {} };
+    if (change.layout.content != null) layout.contentSize = len(change.layout.content, "layout.content");
+    if (change.layout.wide != null) layout.wideSize = len(change.layout.wide, "layout.wide");
+    settings2.layout = layout;
+  }
+  if (change.padding) {
+    const spacing = { ...styles.spacing ?? {} };
+    const pad = { ...spacing.padding ?? {} };
+    if (change.padding.left != null) pad.left = len(change.padding.left, "padding.left");
+    if (change.padding.right != null) pad.right = len(change.padding.right, "padding.right");
+    styles.spacing = { ...spacing, padding: pad };
+    settings2.useRootPaddingAwareAlignments = true;
+  }
+  if (change.css != null) styles.css = change.css;
+  if (change.css_append)
+    styles.css = `${String(styles.css ?? "").trimEnd()}
+
+${change.css_append.trim()}
+`.trimStart();
   await call(site, {
     method: "POST",
     path: `/wp/v2/global-styles/${cur.id}`,
-    body: { settings: settings2, styles: user.styles ?? {} }
+    body: { settings: settings2, styles }
   });
+  const changedLayout = change.layout || change.padding;
   return {
+    ...changedLayout ? {
+      layout: {
+        before: cur.layout,
+        after: {
+          content: settings2.layout?.contentSize ?? cur.layout.content,
+          wide: settings2.layout?.wideSize ?? cur.layout.wide,
+          padding: change.padding ? { ...cur.layout.padding, ...change.padding } : cur.layout.padding
+        }
+      }
+    } : {},
+    ...change.css != null || change.css_append ? { css: { before: cur.css.length, after: String(styles.css ?? "").length, before_text: cur.css } } : {},
     colors: Object.fromEntries(
       Object.entries(change.colors ?? {}).map(([k, v]) => [k, { before: cur.colors[k], after: v }])
     ),
@@ -16386,7 +16487,7 @@ var siteTools = [
   }),
   tool({
     name: "wp_style_get",
-    description: "The brand: colours (by name: canvas, panel, soft, ink, muted, olive, accent\u2026) and fonts (display, body), and the text contrast of each colour pair.",
+    description: "The site's look: colours (by name: canvas, panel, soft, ink, muted, olive, accent\u2026), fonts (display, body), layout widths (content, wide) and page padding, the extra CSS, and the text contrast of each colour pair.",
     parameters: { type: "object", properties: {} },
     group: "site",
     need: READ,
@@ -16394,7 +16495,14 @@ var siteTools = [
     gates: ["WP"],
     run: async (ctx) => {
       const s = await styleGet(siteOf(ctx));
-      return { colors: s.colors, fonts: s.fonts, customized: s.customized, contrast: s.contrast };
+      return {
+        colors: s.colors,
+        fonts: s.fonts,
+        layout: s.layout,
+        css: s.css,
+        customized: s.customized,
+        contrast: s.contrast
+      };
     }
   })
 ];
@@ -16836,12 +16944,15 @@ var sectionTools = [
   }),
   tool({
     name: "wp_section_update",
-    description: "Change one section. edits: change text, links or pictures inside it and keep its design (works on any section, the homepage too). slots: write the section again from new content (generated types; give the complete content). faq: add, remove (1-based numbers) or replace questions.",
+    description: 'Change one section. width: line its content up with the header and footer ("wide") or another width, one section or all. edits: change text, links or pictures inside it and keep its design (works on any section, the homepage too). slots: write the section again from new content (generated types; give the complete content). faq: add, remove (1-based numbers) or replace questions.',
     parameters: {
       type: "object",
       properties: {
         page: PAGE,
-        section: str2("Section id from wp_page_get (s2, m4) or its type (faq)."),
+        section: str2('Section id from wp_page_get (s2, m4) or its type (faq); "all" with width only.'),
+        width: str2(
+          `The section's inner width: "content" (the site's content width), "wide" (the site's wide width, as the header and footer) or a CSS length (1240px). Changes the section and its containers wider than 700px; with section "all", every section on the page.`
+        ),
         edits: EDITS,
         slots: obj("Complete new content for the section (same type unless type is given)."),
         markup: str2(
@@ -16870,6 +16981,19 @@ var sectionTools = [
     ),
     run: (ctx, a) => changePage(ctx, a, (blocks, kit) => {
       const ref = String(a.section);
+      if (a.width != null && a.width !== "") {
+        const targets = ref === "all" ? locate(blocks) : [sectionAt(blocks, ref, kit.syncedTitles)];
+        const changed = {};
+        for (const t of targets) {
+          if (t.block.name === "core/block") continue;
+          const r = setSectionWidth(t.block, a.width);
+          if (r.containers) changed[t.id] = r;
+        }
+        refreshRaw(blocks);
+        if (!Object.keys(changed).length) throw new Error("Those sections already have that width.");
+        return { blocks, note: { width: String(a.width), sections: changed } };
+      }
+      if (ref === "all") throw new Error('section "all" works with width only.');
       const target = sectionAt(blocks, ref, kit.syncedTitles);
       const type = classify(target.block, target.region, kit.syncedTitles);
       let next;
@@ -17236,7 +17360,7 @@ var childTools = [
   }),
   tool({
     name: "wp_child_theme_update",
-    description: "Change a Maggie child theme's files (default: the active child): brand colours (by name, hex) and fonts (by name, CSS font-family of fonts already in it) in theme.json, extra theme.json styles, plain CSS (replace or append), the header or footer (block markup), templates, and the site's own patterns (shown in the editor's inserter). Data only, never code. Each change keeps a backup (wp_child_theme_restore). Changes made with wp_style_set / wp_header_set are stored in the database and win over the child's files.",
+    description: "Change a Maggie child theme's files (default: the active child): brand colours (by name, hex) and fonts (by name, CSS font-family of fonts already in it) in theme.json, extra theme.json styles, plain CSS (replace or append), the site's own JavaScript (assets/js/site.js, replace or append; runs for every visitor), the header or footer (block markup), templates, and the site's own patterns (shown in the editor's inserter). No PHP or server code. Each change keeps a backup (wp_child_theme_restore). Changes made with wp_style_set / wp_header_set are stored in the database and win over the child's files.",
     parameters: {
       type: "object",
       properties: {
@@ -17257,6 +17381,10 @@ var childTools = [
         styles: obj('theme.json styles to merge in (e.g. { "elements": { "button": { \u2026 } } }).'),
         css: str2("Replace the child's CSS (plain CSS)."),
         css_append: str2("Add CSS at the end."),
+        js: str2(
+          `Replace the site's own script (assets/js/site.js, plain JavaScript loaded deferred on every page; "" turns it off). Needs Maggie Core 0.12+ and a login allowed to add scripts. No eval or new Function; addresses only on the site or cdn.jsdelivr.net, unpkg.com, cdnjs.cloudflare.com.`
+        ),
+        js_append: str2("Add JavaScript at the end of the site's script."),
         header: str2("Header block markup (parts/header.html)."),
         footer: str2("Footer block markup (parts/footer.html)."),
         templates: obj('Templates by slug \u2192 block markup, e.g. { "page-landing": "\u2026" }.'),
@@ -17270,8 +17398,8 @@ var childTools = [
     gates: [...GATES],
     confirm: (a, lang) => say(
       lang,
-      `Change the child theme ${q2(a.slug, "(the active one)")} on your website.`,
-      `\u4FEE\u6539\u7DB2\u7AD9\u7684\u5B50\u4E3B\u984C ${q2(a.slug, "\uFF08\u76EE\u524D\u4F7F\u7528\u4E2D\u7684\uFF09")}\u3002`
+      `Change the child theme ${q2(a.slug, "(the active one)")} on your website.${typeof a.js === "string" || typeof a.js_append === "string" ? a.js === "" ? " Turns off the site's own script." : " Includes JavaScript that runs in every visitor's browser on every page." : ""}`,
+      `\u4FEE\u6539\u7DB2\u7AD9\u7684\u5B50\u4E3B\u984C ${q2(a.slug, "\uFF08\u76EE\u524D\u4F7F\u7528\u4E2D\u7684\uFF09")}\u3002${typeof a.js === "string" || typeof a.js_append === "string" ? a.js === "" ? "\u95DC\u9589\u7DB2\u7AD9\u81EA\u8A02\u8173\u672C\u3002" : "\u5305\u542B\u6703\u5728\u6BCF\u4F4D\u8A2A\u5BA2\u700F\u89BD\u5668\u3001\u6BCF\u500B\u9801\u9762\u57F7\u884C\u7684 JavaScript\u3002" : ""}`
     ),
     run: async (ctx, a) => {
       const site = siteOf(ctx);
@@ -17369,6 +17497,22 @@ var childTools = [
       if (typeof a.css_append === "string")
         files["style.css"] = `${(files["style.css"] ?? cur["style.css"] ?? "").replace(/\n*$/, "\n")}${a.css_append}
 `;
+      if (typeof a.js === "string" || typeof a.js_append === "string") {
+        const parentV = String(info.parent?.version ?? "0");
+        const [maj, min] = parentV.split(".").map(Number);
+        if ((maj ?? 0) === 0 && (min ?? 0) < 12)
+          throw new Error(
+            `The site's script needs Maggie Core 0.12 or later (the site has ${parentV}): update it with wp_theme_update first.`
+          );
+        const js = typeof a.js === "string" ? a.js : `${(cur["assets/js/site.js"] ?? "").replace(/\n*$/, "\n")}${String(a.js_append)}
+`.trimStart();
+        if (/<\/?script\b/i.test(js)) throw new Error("js: plain JavaScript only, no <script> tags.");
+        if (/<\?(php|=)?/i.test(js)) throw new Error("js: PHP isn't allowed.");
+        files["assets/js/site.js"] = js;
+        notes.push(
+          js.trim() ? "assets/js/site.js runs deferred on every page; undo with wp_child_theme_restore." : "The site's own script is off."
+        );
+      }
       const markup = (path3, m) => {
         if (typeof m !== "string" || !m.trim()) return;
         if (!parse(m).some((b) => b.name)) throw new Error(`${path3}: give block markup (<!-- wp:\u2026 -->).`);
@@ -17775,23 +17919,41 @@ var elementTools = [
   }),
   tool({
     name: "wp_style_set",
-    description: "Change brand colours (by name, hex) and fonts (by name, CSS font-family) for the whole site. Refuses colours that would make text hard to read (contrast under 4.5:1).",
+    description: "Change the whole site's look: brand colours (by name, hex), fonts (by name, CSS font-family), layout widths (content: the width sections and text use; wide: the header, footer and wide blocks), the left and right page padding, and extra CSS. Saved in the site's Global Styles (works on any block theme; returns before and after). Refuses colours that would make text hard to read (contrast under 4.5:1). One section's width: wp_section_update width.",
     parameters: {
       type: "object",
       properties: {
         colors: obj('e.g. { "olive": "#4F5B48", "accent": "#A8834F" }.'),
-        fonts: obj('e.g. { "display": "\\"Playfair Display\\", Georgia, serif" }.')
+        fonts: obj('e.g. { "display": "\\"Playfair Display\\", Georgia, serif" }.'),
+        layout: obj('Widths, e.g. { "content": "1240px", "wide": "1240px" }.', {
+          content: str2("Content width (CSS length)."),
+          wide: str2("Wide width (CSS length).")
+        }),
+        padding: obj('Left and right page padding, e.g. { "left": "24px", "right": "24px" }.', {
+          left: str2(""),
+          right: str2("")
+        }),
+        css: str2("Replace the site's extra CSS (Global Styles \u2192 Additional CSS); plain CSS only."),
+        css_append: str2("Add this CSS after the site's extra CSS.")
       }
     },
     group: "site",
     need: WRITE,
     risk: "W3",
     gates: [...GATES],
-    confirm: (_a3, lang) => say(lang, "Change the website's brand colours or fonts (every page).", "\u4FEE\u6539\u7DB2\u7AD9\u7684\u54C1\u724C\u984F\u8272\u6216\u5B57\u9AD4\uFF08\u6240\u6709\u9801\u9762\uFF09\u3002"),
-    run: async (ctx, a) => {
-      const r = await styleSet(siteOf(ctx), { colors: a.colors, fonts: a.fonts });
-      return r;
-    }
+    confirm: (_a3, lang) => say(
+      lang,
+      "Change the website's look for every page (colours, fonts, widths, padding or extra CSS); the result shows before and after.",
+      "\u4FEE\u6539\u7DB2\u7AD9\u6240\u6709\u9801\u9762\u7684\u5916\u89C0\uFF08\u984F\u8272\u3001\u5B57\u9AD4\u3001\u5BEC\u5EA6\u3001\u908A\u8DDD\u6216\u984D\u5916 CSS\uFF09\uFF1B\u7D50\u679C\u6703\u5217\u51FA\u4FEE\u6539\u524D\u5F8C\u3002"
+    ),
+    run: async (ctx, a) => styleSet(siteOf(ctx), {
+      colors: a.colors,
+      fonts: a.fonts,
+      layout: a.layout,
+      padding: a.padding,
+      css: typeof a.css === "string" ? a.css : void 0,
+      css_append: typeof a.css_append === "string" ? a.css_append : void 0
+    })
   })
 ];
 function checkMarkup(markup, what) {
@@ -21766,7 +21928,7 @@ var program = new Command();
 // package.json
 var package_default = {
   name: "@cmo-so/cli",
-  version: "0.12.8",
+  version: "0.12.10",
   description: "CMO.so on the command line: your websites, ideas, blog posts, LinkedIn queue and results, plus a local MCP server for Claude Desktop, Cursor and other MCP clients.",
   type: "module",
   license: "MIT",
@@ -32813,6 +32975,16 @@ function registerWp(program3) {
       o.preview ? { tool: "wp_section_update", args } : args
     );
   });
+  section.command("width <page> <section> <width>").description(
+    'line sections up: width "wide" (as the header and footer), "content" or 1240px; section "all" = every section'
+  ).option("--preview", "show the result, save nothing").action(async (p, s, w, o, c) => {
+    const args = { page: p, section: s, width: w };
+    await run(
+      g(c),
+      o.preview ? "wp_preview" : "wp_section_update",
+      o.preview ? { tool: "wp_section_update", args } : args
+    );
+  });
   pos(section.command("move <page> <section>").description("move a section")).action(
     (p, s, o, c) => run(g(c), "wp_section_move", { page: p, section: s, ...posArgs(o) })
   );
@@ -32878,12 +33050,16 @@ ${table(r.issues, ["severity", "code", "path", "detail"])}`;
       await run(g(c), part === "header" ? "wp_header_set" : "wp_footer_set", args);
     });
   }
-  const style = wp.command("style").description("brand colours and fonts");
+  const style = wp.command("style").description("brand colours, fonts, layout widths, page padding and extra CSS");
   style.command("get", { isDefault: true }).action((_o, c) => run(g(c), "wp_style_get", {}));
-  style.command("set [colors...]").description(`e.g. cmo wp style set olive=#4F5B48 --font 'display="Playfair Display", serif'`).option("--font <slug=family...>").action(
-    (colors, o, c) => run(g(c), "wp_style_set", {
+  style.command("set [colors...]").description(`e.g. cmo wp style set olive=#4F5B48 --font 'display="Playfair Display", serif'`).option("--font <slug=family...>").option("--content <width>", "content width, e.g. 1240px").option("--wide <width>", "wide width (header, footer, wide blocks)").option("--padding <length>", "left and right page padding, e.g. 24px").option("--css-file <file>", "replace the site's extra CSS with this file").option("--css-append <file>", "add this CSS file after the site's extra CSS").action(
+    async (colors, o, c) => run(g(c), "wp_style_set", {
       colors: colors.length ? Object.fromEntries(pairs(colors)) : void 0,
-      fonts: o.font ? Object.fromEntries(pairs(o.font)) : void 0
+      fonts: o.font ? Object.fromEntries(pairs(o.font)) : void 0,
+      layout: o.content || o.wide ? { content: o.content, wide: o.wide } : void 0,
+      padding: o.padding ? { left: o.padding, right: o.padding } : void 0,
+      css: o.cssFile ? await readFile2(o.cssFile, "utf8") : void 0,
+      css_append: o.cssAppend ? await readFile2(o.cssAppend, "utf8") : void 0
     })
   );
   const media = wp.command("media").description("pictures in the media library");
@@ -33000,12 +33176,15 @@ ${table(r.issues, ["severity", "code", "path", "detail"])}`;
   ).option(
     "--from <file>",
     "JSON: { colors, fonts, styles, css, css_append, header, footer, templates, patterns, remove_patterns }"
-  ).option("--color <slug=hex...>").option("--css-file <file>", "replace the CSS with this file").option("--header-file <file>", "header block markup").option("--footer-file <file>", "footer block markup").action(
+  ).option("--color <slug=hex...>").option("--css-file <file>", "replace the CSS with this file").option("--js-file <file>", "replace the site's script (assets/js/site.js, runs on every page) with this file").option("--js-append <file>", "add this JavaScript file at the end of the site's script").option("--js-off", "turn the site's script off").option("--header-file <file>", "header block markup").option("--footer-file <file>", "footer block markup").action(
     async (slug, o, c) => {
       const args = o.from ? await json(o.from) : {};
       if (slug) args.slug = slug;
       if (o.color) args.colors = Object.fromEntries(pairs(o.color));
       if (o.cssFile) args.css = await readFile2(o.cssFile, "utf8");
+      if (o.jsFile) args.js = await readFile2(o.jsFile, "utf8");
+      if (o.jsAppend) args.js_append = await readFile2(o.jsAppend, "utf8");
+      if (o.jsOff) args.js = "";
       if (o.headerFile) args.header = await readFile2(o.headerFile, "utf8");
       if (o.footerFile) args.footer = await readFile2(o.footerFile, "utf8");
       await run(g(c), "wp_child_theme_update", args);

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@cmo-so/cli",
-	"version": "0.12.8",
+	"version": "0.12.10",
 	"description": "CMO.so on the command line: your websites, ideas, blog posts, LinkedIn queue and results, plus a local MCP server for Claude Desktop, Cursor and other MCP clients.",
 	"type": "module",
 	"license": "MIT",