@noleemits/vision-builder-control-mcp 4.43.0 → 4.44.0

package/index.js

@@ -108,7 +108,7 @@ process.on('SIGINT', () => {
 // CONFIG
 // ================================================================
 
-const VERSION = '4.43.0';
+const VERSION = '4.44.0';
 const MIN_PLUGIN_VERSION = '4.13.0'; // Minimum WP plugin version required by this MCP server
 
 // ================================================================
@@ -2150,9 +2150,41 @@ function getToolDefinitions() {
                 required: ['page_id', 'element_id', 'target_parent_id']
             }
         },
+        {
+            name: 'set_container_layout',
+            description: 'Set a container\'s layout (flex/grid) from a clean intent — prefer this over raw update_element when you want WYSIWYG-editable native Elementor layout instead of custom_css workarounds. Translates {mode, columns, gap, responsive} into the full Elementor schema (container_type, grid_columns_grid object, gap object shape, _tablet/_mobile variants, etc.). Modes: "grid" (uses Elementor native CSS Grid — best for card layouts), "flex-row" (horizontal flex), "flex-column" (vertical stack). Defaults: gap=24px, responsive=auto (tablet halves columns, mobile = 1 col). Pass responsive: false to skip responsive variants. Only operates on containers (rejected with invalid_target if you target a widget). The resulting layout shows up in Elementor\'s Layout panel as if a human set it, so non-technical editors can modify it through the UI. v4.44.0+.',
+            inputSchema: {
+                type: 'object',
+                properties: {
+                    page_id:      { type: 'number', description: 'WordPress page ID' },
+                    container_id: { type: 'string', description: 'Elementor ID of the container to configure' },
+                    mode:         { type: 'string', enum: ['grid', 'flex-row', 'flex-column'], description: 'Layout mode' },
+                    columns:      { type: 'number', description: 'Grid mode: number of columns (default 3). Ignored for flex modes.' },
+                    rows:         { type: 'number', description: 'Grid mode: number of explicit rows (default 1).' },
+                    gap:          { description: 'Gap in px (number) or object {row, column, unit?}. Default 24.' },
+                    auto_flow:    { type: 'string', enum: ['row', 'column', 'dense'], description: 'Grid auto-flow direction.' },
+                    align_items: {
+                        type: 'string',
+                        description: 'Cross-axis alignment. Grid: start|center|end|stretch. Flex: flex-start|center|flex-end|stretch|baseline.',
+                    },
+                    justify_items:   { type: 'string', enum: ['start', 'center', 'end', 'stretch'], description: 'Grid-only: per-item main-axis alignment.' },
+                    justify_content: {
+                        type: 'string',
+                        enum: ['flex-start', 'center', 'flex-end', 'space-between', 'space-around', 'space-evenly'],
+                        description: 'Flex-only: main-axis distribution.',
+                    },
+                    wrap:    { type: 'string', enum: ['wrap', 'nowrap'], description: 'Flex-only: wrap behavior.' },
+                    responsive: {
+                        description: 'Responsive variants. Default = true (auto: tablet halved, mobile 1 col). Pass false to skip variants. Or pass { tablet: {columns, gap}, mobile: {columns, gap} } for explicit values.',
+                    },
+                    force: { type: 'boolean', description: 'Override edit locks (default: false)' }
+                },
+                required: ['page_id', 'container_id', 'mode']
+            }
+        },
         {
             name: 'update_element',
-            description: 'Update any element\'s settings by its Elementor ID or path. Patch widget properties like hover_color, background_color, __globals__ overrides, text, link URLs, etc. Supports dot-notation for nested keys (e.g. "__globals__.hover_color"). Supports element_path as alternative to element_id (e.g. "sectionId/1/0" = section → child 1 → child 0). Use list_elements or export_page first to find the element ID and current settings. IMPORTANT: Prefer settings_json (JSON string) over settings (object) for reliable MCP transport. AUTO-INJECTED KEYS: background_background:"classic" auto-set when you set background_color; typography_typography:"custom" auto-set when you set font properties; flex_grow expands to all 3 required keys; grid column strings auto-wrapped in object format. ICON WIDGET: For view="default" use "icon_size" for dimensions. For view="stacked" or "framed" (circle/square background) use "size" instead — "icon_size" is silently ignored in stacked/framed mode. LOOP-GRID WIDGET: query settings use the prefix "post_query_" (post_query_post_type, post_query_orderby, post_query_order, post_query_posts_per_page) — NOT "posts_post_type". Setting "posts_post_type" is silently accepted but ignored. RACE CONDITION: when patching multiple elements on the SAME page in parallel, use batch_update_elements instead — parallel update_element calls can clobber each other. ATOMIC SCHEMA VALIDATION (v4.42.5+): writes that violate the Elementor V4 atomic schema are rejected up front (HTTP 400 invalid_atomic_setting) instead of silently corrupting the page. Currently enforced: e-heading.tag ∈ {h1..h6}, e-paragraph.tag ∈ {p, span}. If you need a non-heading visual element styled like an eyebrow, use e-paragraph (tag=p or span) — not e-heading with tag=div.',
+            description: 'Update any element\'s settings by its Elementor ID or path. Patch widget properties like hover_color, background_color, __globals__ overrides, text, link URLs, etc. Supports dot-notation for nested keys (e.g. "__globals__.hover_color"). Supports element_path as alternative to element_id (e.g. "sectionId/1/0" = section → child 1 → child 0). Use list_elements or export_page first to find the element ID and current settings. IMPORTANT: Prefer settings_json (JSON string) over settings (object) for reliable MCP transport. AUTO-INJECTED KEYS: background_background:"classic" auto-set when you set background_color; typography_typography:"custom" auto-set when you set font properties; flex_grow expands to all 3 required keys; grid column strings auto-wrapped in object format. ICON WIDGET: For view="default" use "icon_size" for dimensions. For view="stacked" or "framed" (circle/square background) use "size" instead — "icon_size" is silently ignored in stacked/framed mode. LOOP-GRID WIDGET: query settings use the prefix "post_query_" (post_query_post_type, post_query_orderby, post_query_order, post_query_posts_per_page) — NOT "posts_post_type". Setting "posts_post_type" is silently accepted but ignored. RACE CONDITION: when patching multiple elements on the SAME page in parallel, use batch_update_elements instead — parallel update_element calls can clobber each other. ATOMIC SCHEMA VALIDATION (v4.42.5+): writes that violate the Elementor V4 atomic schema are rejected up front (HTTP 400 invalid_atomic_setting) instead of silently corrupting the page. Currently enforced: e-heading.tag ∈ {h1..h6}, e-paragraph.tag ∈ {p, span}. If you need a non-heading visual element styled like an eyebrow, use e-paragraph (tag=p or span) — not e-heading with tag=div. NATIVE GRID/FLEX TIP: for container layout (grid columns, flex direction, gap), prefer set_container_layout — it produces WYSIWYG-editable native settings instead of forcing you to assemble the raw Elementor schema.',
             inputSchema: {
                 type: 'object',
                 properties: {
@@ -4096,6 +4128,33 @@ async function handleToolCall(name, args) {
         return ok(`Moved ${r.element_type} (${r.element_id}) to parent ${r.target_parent_id}${r.position !== null ? ` at position ${r.position}` : ''}`);
     }
 
+    case 'set_container_layout': {
+        try {
+            const body = {
+                container_id: args.container_id,
+                mode: args.mode,
+            };
+            if (args.columns !== undefined) body.columns = args.columns;
+            if (args.rows !== undefined) body.rows = args.rows;
+            if (args.gap !== undefined) body.gap = args.gap;
+            if (args.auto_flow) body.auto_flow = args.auto_flow;
+            if (args.align_items) body.align_items = args.align_items;
+            if (args.justify_items) body.justify_items = args.justify_items;
+            if (args.justify_content) body.justify_content = args.justify_content;
+            if (args.wrap) body.wrap = args.wrap;
+            if (args.responsive !== undefined) body.responsive = args.responsive;
+            if (args.force) body.force = true;
+            const r = await apiCall(`/pages/${args.page_id}/set-container-layout`, 'POST', body);
+            if (r.code || r.error) return ok(`Failed: ${r.message || r.error || 'Unknown error'}`);
+            return ok(
+                `Container ${r.container_id} set to ${r.mode} on page ${r.page_id}.\n` +
+                `Applied keys: ${(r.applied_keys || []).join(', ')}`
+            );
+        } catch (err) {
+            return ok(`Failed: ${err.message}`);
+        }
+    }
+
     case 'update_element': {
         // Resolve settings: prefer settings_json (string) for reliable MCP transport, fall back to settings (object)
         let settings = null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@noleemits/vision-builder-control-mcp",
-  "version": "4.43.0",
+  "version": "4.44.0",
   "description": "Vision Builder Control MCP server - design token-driven page builder tools for WordPress/Elementor websites",
   "type": "module",
   "main": "index.js",