webcake-storefront-mcp 1.18.0 → 1.18.1

package/dist/builder/guide.js

@@ -158,6 +158,49 @@ Rule of thumb: if the page shows products, a cart, customer/order data, or blog
 set \`type\` accordingly so the binding source is turned on. A binding target like
 \`product::product_price\` REQUIRES its page to be the matching type.
 
+## Build the WHOLE storefront — every page to the SAME standard (NOT just the home page)
+A shop is multi-page. Build EACH page to a real e-commerce standard with the same palette,
+spacing and header/footer — never leave the home page rich and the rest as bare stubs.
+\`scaffold_store_pages\` creates FUNCTIONAL but MINIMAL pages (a heading + the binding element);
+treat them as STARTERS to enrich, not the finished page. After scaffolding, rebuild each page's
+source so it looks designed:
+- Category (collections, type store): banner + heading + grid-product (+ optional intro/CTA).
+- Product detail (products, type store): 2-col [product-gallery | info: text-dataset
+  product::product_name + product_price/original_price + short_description, quantity-input,
+  "Thêm vào giỏ" (add_to_cart) + "Mua ngay" (buy_now), trust badges] then a description/feature
+  band then a related grid-product ("Có thể bạn cũng thích").
+- Cart (cart, type store): heading + 2-col [cart-items | order-summary card with a
+  "Tiến hành thanh toán" button -> { action:"open_page", open_page_id:<checkout> }] + continue link.
+- Checkout (checkout, type store): heading + 2-col [form{type:form_order} with input/
+  phone-number/email/address + submit-button "Đặt hàng" | order summary (cart-items)].
+- Thank-you (complete, type store): centred confirmation + order-items + continue-shopping.
+- Optional: About / Contact (custom), Blog (type blog: post-list) + Post.
+Reuse the SAME section helpers, palette and card styling as the home page so the whole site
+feels like ONE design.
+
+## Global Header & Footer — create them for EVERY site (don't inline per page)
+A header (logo/nav/cart) and footer (links/contact/copyright) belong on EVERY page, so make them
+GLOBAL, not copied into each page. Build a header section + a footer section (new_section, same as
+any section), then:
+  create_global_section({ type:"header", name:"Header", section:<headerSection> })   // top of every page
+  create_global_section({ type:"footer", name:"Footer", section:<footerSection> })   // bottom of every page
+(omit page_ids to apply to ALL pages). ORDER MATTERS: build/save the page CONTENT first, THEN
+create the globals — they embed into each page's source. If you later overwrite a page's source
+(update_page_source/build_page) you WIPE its embedded header/footer, so re-create the globals
+(delete_global_section by the section NODE id, then create once) to re-embed cleanly. Edit a global
+later with update_global_section_element(s) and it updates on every page at once.
+
+## Popups (newsletter / promo / age-gate)
+A popup is a GLOBAL SOURCE, not a page section. Build it, store it, then trigger it:
+1. Build the popup body (new_section: heading + text + form/input + a close button), then wrap it:
+   new_element("popup", { children:[<that section>], specials:{ /* trigger + overlay */ } }).
+   Trigger/behaviour (auto-open after a delay, exit-intent, only-once, overlay) lives in specials.
+2. Save it: create_global_source({ component:"popup", source:{ sections:[<popupNode>] } }) -> returns its id.
+3. Open/close from any element via events: a button { action:"open_popup", popup_id:"<id>", popup_overlay:true };
+   a close button inside { action:"close_popup", popup_id:"<id>" }; a form can auto-close on its
+   success trigger ({ eventName:"success", action:"close_popup", popup_id:"<id>" }).
+List existing popups with list_global_sources({component:"popup"}); edit via update_global_source(_element).
+
 ## Workflow (do this every time)
 1. Intake: confirm goal, brand, colours, sections wanted (ask 3-5 questions if unclear).
 2. list_elements / get_element to pick the right component types.

package/dist/changelog.json

@@ -1,4 +1,11 @@
 [
+  {
+    "v": "1.18.1",
+    "d": "25/06/2026",
+    "type": "Changed",
+    "en": "get_build_guide now includes three new sections: \"Build the WHOLE storefront\" with per-page recipes for enriching category, product detail, cart,…",
+    "vi": "get_build_guide nay bổ sung ba mục mới: \"Build the WHOLE storefront\" — công thức từng trang để nâng cấp danh mục, trang chi tiết sản phẩm, giỏ hàng,…"
+  },
   {
     "v": "1.18.0",
     "d": "25/06/2026",
@@ -33,12 +40,5 @@
     "type": "Fixed",
     "en": "update_page_element, update_page_elements, update_global_source_element, and update_global_source_elements now normalize events and bindings arrays…",
     "vi": "update_page_element, update_page_elements, update_global_source_element và update_global_source_elements nay chuẩn hóa mảng events và bindings khi…"
-  },
-  {
-    "v": "1.15.0",
-    "d": "24/06/2026",
-    "type": "Added",
-    "en": "New get_global_section tool returns a compact tree representation of a single global section (Header/Footer/block), listing each element's id, type,…",
-    "vi": "Tool mới get_global_section trả về cây phần tử dạng compact của một global section (Header/Footer/block), liệt kê id, type, text, class, binding và…"
   }
 ]

package/dist/server.js

@@ -8,6 +8,8 @@ Tool discovery: the common tools (pages, builder, products, orders, blog, custom
 
 You can also BUILD pages: use get_build_guide, list_elements, get_element to learn the BuilderX component model, new_section/new_element to compose, validate_page to check, then build_page (dry_run first) to create. Publishing is site-level via publish_site.
 
+Build the WHOLE site, not just the home page: enrich EVERY page (category, product detail, cart, checkout, thank-you, …) to the same e-commerce standard with the same palette/header/footer — scaffold_store_pages makes MINIMAL starter pages, so design them properly afterwards. Make the Header and Footer GLOBAL (create_global_section type:"header"/"footer") so they're consistent on every page — don't inline them per page. For newsletter/promo offers, build a popup (a "popup" global_source) and open it with an open_popup event. See get_build_guide for the per-page recipes, the global-section order rules, and the popup workflow.
+
 To make a generated site look real, also CREATE DATA so dataset bindings resolve: create_product_category + create_product (storefront), create_blog_category + create_article (blog). Get image URLs from search_images / upload_images first, then reference them. A good flow for a fresh site: create_site → create a few categories → create products in them → build_page (home + store/blog pages) → publish_site.
 
 INTAKE FIRST — when the user asks to BUILD/CREATE a site, store, or page (a fresh build, not a small edit or a data question), do NOT jump straight to create_site/build_page on the same turn. Act as a professional shop-website designer doing client work: first ask ONE short batch of questions (call get_intake_guide for the exact list), restate the plan you'll build, get a "yes", THEN build. The shop owner is an ORDINARY person, not a designer — ask in plain words and visual outcomes ("tông nâu ấm, ảnh sản phẩm to"), never jargon. Ask the essentials (with sensible defaults so they answer fast): what they sell + a few products & prices, brand/shop name, primary color/style, which pages they need, real contact info (hotline/Zalo, address, email, hours) + the main call-to-action, and any promotion. NEVER invent or silently placeholder real data (shop name, products, prices, phone, address) — ask for it; placeholder only what the user explicitly skips, and tell them what to fill in. Skip intake only when the user already gave the brief, says "just do it / tự quyết", or it's a tiny edit.

package/dist/tools/builder.js

@@ -197,7 +197,10 @@ product/category/cart from any page lands on a real page instead of a 404.
 Creates only the ones MISSING (matched by slug): Category (collections), Product (products),
 Cart (cart), Checkout (checkout), Thank-you (complete) — all type 'store' (enables use_store),
 plus optional member (login/register/profile) and blog (blog/post) pages.
-Run this right after you create products/categories. dry_run=true (default) previews.`, {
+Run this right after you create products/categories. dry_run=true (default) previews.
+NOTE: these are MINIMAL STARTER pages (a heading + the binding element) — you MUST then
+enrich EACH one to the same standard as the home page (see get_build_guide "Build the WHOLE
+storefront"), and add a GLOBAL header/footer (create_global_section). Don't leave them bare.`, {
         include_member: z.boolean().default(false).describe("Also create login/register/profile (type member, use_member)"),
         include_blog: z.boolean().default(false).describe("Also create blog list + post pages (type blog, use_blog)"),
         dry_run: z.boolean().default(true).describe("Preview (true) or actually create the missing pages (false)"),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webcake-storefront-mcp",
-  "version": "1.18.0",
+  "version": "1.18.1",
   "description": "MCP server for the WebCake/StoreCake storefront builder — page CRUD, page authoring, products, orders, and more",
   "mcpName": "io.github.vuluu2k/webcake-storefront-mcp",
   "license": "MIT",