@dreamtree-org/landing-kit 0.7.2 → 0.9.0

package/dist/schema.js

@@ -267,8 +267,8 @@ var MAX_SECTIONS = 20;
 function sectionDefaults(type) {
   const def = SECTION_TYPES[type];
   if (!def) throw new Error(`Unknown section type "${type}"`);
-  const fill = (fields2) => Object.fromEntries(fields2.map((f) => [f.key, f.kind === "list" ? (f.default || []).map((item) => ({ ...fill(f.of), ...item })) : f.default]));
-  return fill(def.fields);
+  const fill2 = (fields2) => Object.fromEntries(fields2.map((f) => [f.key, f.kind === "list" ? (f.default || []).map((item) => ({ ...fill2(f.of), ...item })) : f.default]));
+  return fill2(def.fields);
 }
 var seq = 0;
 function newSectionId(type) {
@@ -298,7 +298,7 @@ var decode = (s) => s.replace(/&(amp|quot|#39|lt|gt|#x[0-9a-f]+|#\d+);/gi, (m, e
 });
 function safeHref(raw) {
   const v = decode(String(raw || "")).replace(/[\u0000- \u007f-\u009f]/g, "");
-  if (!v) return null;
+  if (!v || v.includes("\\")) return null;
   if (/^(https?:\/\/|mailto:|tel:)/i.test(v)) return v;
   if (/^\/(?!\/)/.test(v) || v.startsWith("#")) return v;
   return null;
@@ -422,6 +422,9 @@ function field(f, value, path, errors) {
       throw new Error(`Unknown field kind "${f.kind}" (${path})`);
   }
 }
+function validateFields(defs, obj, path, errors) {
+  return fields(defs, obj, path, errors);
+}
 function fields(defs, obj, path, errors) {
   const src = obj && typeof obj === "object" && !Array.isArray(obj) ? obj : {};
   if (obj != null && src !== obj) errors.push({ path, message: "must be an object" });
@@ -645,24 +648,318 @@ function themeVars(input) {
     }
   };
 }
+
+// src/schema/store.js
+var STORE_VERSION = 2;
+var MAX_BLOCKS = 12;
+var ID_RE2 = /^[a-z0-9][a-z0-9-]{0,39}$/;
+var opt = (...pairs) => pairs.map(([value, label]) => ({ value, label }));
+var sel = (key, label, options, d) => ({ key, kind: "select", label, options, default: d });
+var bool = (key, label, d) => ({ key, kind: "bool", label, default: d });
+var heading = (d, max = 90) => ({ key: "title", kind: "text", label: "Heading", max, default: d });
+var CONTENT_BLOCKS = ["promo_banner", "usp_strip", "trust_badges", "cta_cards", "faq", "rich_text", "testimonials", "brand_strip", "gallery"];
+var LISTING_SLOTS = {
+  collection_header: { label: "Collection header", description: "Title, description and quick links for the category or search.", fields: [bool("show_description", "Show the description", true), bool("show_quick_links", "Show quick links", true)] },
+  toolbar: { label: "Toolbar and sort", description: "Result count, sort and the filters in use.", fields: [] },
+  filters: { label: "Filters", description: "Price, brand and spec filters.", required: true, fields: [] },
+  results: { label: "Results grid", description: "The products, with paging.", required: true, fields: [] }
+};
+var PRODUCT_SLOTS = {
+  gallery: { label: "Gallery", description: "Photos of the product.", required: true, fields: [] },
+  buy_box: { label: "Buy box", description: "Title, price, key specs and the buy buttons.", required: true, fields: [bool("show_compare", "Show Add to compare", true), bool("show_quote", "Show bulk quote link", true)] },
+  highlights: { label: "Highlights", description: "The product's headline numbers and selling points.", fields: [heading("Highlights")] },
+  delivery: { label: "Delivery check", description: "PIN code delivery estimate.", fields: [] },
+  seller: { label: "Seller", description: "Who sells and services the product.", fields: [] },
+  inspection: { label: "Inspection report", description: "Checks, grade and condition notes.", fields: [heading("Inspection report"), bool("expanded", "Open by default", false)] },
+  battery: { label: "Battery", description: "Battery health, where the product has one.", fields: [] },
+  included: { label: "In the box", description: "What ships with the product.", fields: [] },
+  specs: { label: "Specifications", description: "The full specification table.", fields: [heading("Specifications")] },
+  policies: { label: "Warranty and returns", description: "The store's warranty and return terms.", fields: [heading("Warranty and returns")] },
+  similar: { label: "Similar products", description: "More products like this one.", fields: [heading("Similar products"), sel("limit", "How many", opt(["3", "3"], ["4", "4"], ["6", "6"], ["8", "8"]), "4")] }
+};
+var SORTS = opt(["relevance", "Recommended"], ["newest", "Newest first"], ["price_asc", "Price: low to high"], ["price_desc", "Price: high to low"], ["discount", "Biggest discount"]);
+var STORE_PAGES = {
+  listing: {
+    label: "Listing page",
+    slots: LISTING_SLOTS,
+    settings: [
+      sel("columns", "Columns on desktop", opt(["3", "3"], ["4", "4"]), "3"),
+      sel("columns_mobile", "Columns on phones", opt(["1", "1"], ["2", "2"]), "2"),
+      sel("page_size", "Products per page", opt(["12", "12"], ["24", "24"], ["36", "36"]), "12"),
+      sel("default_sort", "Default sort", SORTS, "relevance"),
+      sel("filters", "Filters show as", opt(["sidebar", "Sidebar"], ["topbar", "Bar above the results"], ["drawer", "Button that opens a panel"]), "sidebar"),
+      bool("active_chips", "Show the filters in use as chips", true),
+      sel("paging", "Paging", opt(["pages", "Page numbers"], ["load_more", "Load more button"]), "pages")
+    ],
+    templates: {
+      classic: { label: "Classic", description: "Filters in a sidebar beside a product grid.", settings: {}, blocks: ["collection_header", "toolbar", "filters", "results"] },
+      topbar: { label: "Top bar", description: "Filter chips above a wide grid, more room for products.", settings: { columns: "4", filters: "topbar", paging: "load_more" }, blocks: ["collection_header", "filters", "toolbar", "results"] },
+      editorial: { label: "Editorial", description: "A story-led collection header, then the grid behind a filter button.", settings: { columns: "4", filters: "drawer", active_chips: false }, blocks: ["collection_header", "rich_text", "toolbar", "filters", "results"] }
+    },
+    default: "classic"
+  },
+  product: {
+    label: "Product page",
+    slots: PRODUCT_SLOTS,
+    settings: [
+      sel("gallery", "Gallery", opt(["thumbs_side", "Thumbnails beside the photo"], ["thumbs_below", "Thumbnails below the photo"], ["mosaic", "Full-width mosaic"]), "thumbs_side"),
+      bool("sticky_buy_bar", "Sticky buy bar on phones", true),
+      sel("spec_tiles", "Key spec tiles", opt(["0", "None"], ["4", "4"], ["6", "6"]), "4"),
+      bool("breadcrumbs", "Show breadcrumbs", true)
+    ],
+    templates: {
+      classic: { label: "Classic", description: "Photos beside the buy box, details below.", settings: { gallery: "thumbs_side" }, blocks: ["gallery", "buy_box", "delivery", "seller", "inspection", "battery", "included", "specs", "policies", "similar"] },
+      immersive: { label: "Immersive", description: "A full-width photo mosaic first, a floating buy panel, the story below.", settings: { gallery: "mosaic" }, blocks: ["gallery", "buy_box", "highlights", "inspection", "specs", "policies", "similar"] },
+      compact: { label: "Compact", description: "One column, phone first, with a sticky buy bar.", settings: { gallery: "thumbs_below", spec_tiles: "0", breadcrumbs: false }, blocks: ["gallery", "buy_box", "delivery", "inspection", "specs", "policies", "similar"] }
+    },
+    default: "classic"
+  }
+};
+var STORE_PAGE_KEYS = Object.keys(STORE_PAGES);
+var link = [
+  { key: "label", kind: "text", label: "Label", max: 30, required: true, default: "" },
+  { key: "href", kind: "url", label: "Link", required: true, default: "" }
+];
+var CHROME_FIELDS = [
+  {
+    key: "announcement",
+    kind: "group",
+    label: "Announcement bar",
+    fields: [
+      bool("enabled", "Show the announcement bar", false),
+      { key: "text", kind: "text", label: "Message", max: 120, default: "" },
+      { key: "href", kind: "url", label: "Link", default: "" },
+      sel("tone", "Colour", opt(["brand", "Brand"], ["accent", "Accent"], ["dark", "Dark"]), "brand")
+    ]
+  },
+  {
+    key: "header",
+    kind: "group",
+    label: "Header",
+    fields: [
+      { key: "utility_text", kind: "text", label: "Strip above the header", max: 80, default: "" },
+      bool("show_search", "Search box", true),
+      bool("category_nav", "Menu of the categories you sell", true),
+      { key: "nav_links", kind: "list", label: "Extra menu links", max: 8, itemLabel: "label", of: link, default: [] },
+      bool("sticky", "Keep the header on screen while scrolling", true)
+    ]
+  },
+  {
+    key: "footer",
+    kind: "group",
+    label: "Footer",
+    fields: [
+      { key: "about", kind: "textarea", label: "About the store", max: 240, default: "" },
+      {
+        key: "columns",
+        kind: "list",
+        label: "Link columns",
+        max: 4,
+        itemLabel: "title",
+        of: [{ key: "title", kind: "text", label: "Column heading", max: 40, required: true, default: "" }, { key: "links", kind: "list", label: "Links", max: 8, itemLabel: "label", of: link, default: [] }],
+        default: []
+      },
+      {
+        key: "socials",
+        kind: "list",
+        label: "Social profiles",
+        max: 6,
+        itemLabel: "network",
+        of: [sel("network", "Network", opt(["instagram", "Instagram"], ["facebook", "Facebook"], ["youtube", "YouTube"], ["x", "X"], ["linkedin", "LinkedIn"], ["whatsapp", "WhatsApp"]), "instagram"), { key: "href", kind: "url", label: "Profile link", required: true, default: "" }],
+        default: []
+      },
+      { key: "note", kind: "text", label: "Small print (GSTIN, address)", max: 160, default: "" }
+    ]
+  }
+];
+var CARD_FIELDS = [
+  sel("image_ratio", "Photo shape", opt(["4:3", "Landscape 4:3"], ["1:1", "Square"], ["3:4", "Portrait 3:4"]), "4:3"),
+  bool("badges", "Condition and discount badges", true),
+  bool("spec_line", "Key specs line", true),
+  bool("compare", "Compare checkbox", true),
+  bool("quick_add", "Add to cart button", true),
+  bool("mrp", "Show the MRP struck through", true),
+  sel("hover", "On hover", opt(["none", "Nothing"], ["zoom", "Zoom the photo"], ["second_image", "Show the second photo"]), "zoom")
+];
+function validateGroups(defs, obj, path, errors) {
+  const src = obj && typeof obj === "object" && !Array.isArray(obj) ? obj : {};
+  if (obj != null && src !== obj) errors.push({ path, message: "must be an object" });
+  return Object.fromEntries(defs.map((g) => [g.key, g.kind === "group" ? validateFields(g.fields, src[g.key], `${path}.${g.key}`, errors) : validateFields([g], src, path, errors)[g.key]]));
+}
+var fill = (defs) => Object.fromEntries(defs.map((f) => [f.key, f.kind === "group" ? fill(f.fields) : f.kind === "list" ? [...f.default || []] : f.default]));
+var defaultChrome = () => fill(CHROME_FIELDS);
+var defaultCard = () => fill(CARD_FIELDS);
+function blockDef(pageKey, type) {
+  const page = own(STORE_PAGES, pageKey) ? STORE_PAGES[pageKey] : null;
+  if (!page) return null;
+  if (own(page.slots, type)) return { ...page.slots[type], slot: true };
+  if (CONTENT_BLOCKS.includes(type) && own(SECTION_TYPES, type)) return { ...SECTION_TYPES[type], slot: false };
+  return null;
+}
+var own = (obj, key) => Object.prototype.hasOwnProperty.call(obj, key);
+var blockId = (type) => type.replace(/_/g, "-");
+var blockDefaults = (pageKey, type) => {
+  const def = blockDef(pageKey, type);
+  return def.slot ? fill(def.fields) : sectionDefaults(type);
+};
+function newBlock(pageKey, type) {
+  const def = blockDef(pageKey, type);
+  if (!def) throw new Error(`Unknown block "${type}" on the ${pageKey} page`);
+  return { id: def.slot ? blockId(type) : newSectionId(type), type, enabled: true, props: blockDefaults(pageKey, type) };
+}
+function templatePage(pageKey, template) {
+  const page = STORE_PAGES[pageKey];
+  const key = own(page.templates, template) ? template : page.default;
+  const tpl = page.templates[key];
+  const settings = { ...fill(page.settings), ...tpl.settings };
+  const blocks = tpl.blocks.map((type) => ({ id: blockId(type), type, enabled: true, props: blockDefaults(pageKey, type) }));
+  return { template: key, settings, blocks };
+}
+function validateTemplatePage(pageKey, input, path, errors) {
+  var _a, _b;
+  const page = STORE_PAGES[pageKey];
+  const src = input && typeof input === "object" && !Array.isArray(input) ? input : {};
+  let template = (_a = src.template) != null ? _a : page.default;
+  if (!own(page.templates, template)) {
+    errors.push({ path: `${path}.template`, message: `must be one of ${Object.keys(page.templates).join(", ")}` });
+    template = page.default;
+  }
+  const tpl = page.templates[template];
+  const settingDefs = page.settings.map((f) => tpl.settings[f.key] === void 0 ? f : { ...f, default: tpl.settings[f.key] });
+  const settings = validateFields(settingDefs, (_b = src.settings) != null ? _b : {}, `${path}.settings`, errors);
+  const list = Array.isArray(src.blocks) ? src.blocks : null;
+  if (src.blocks != null && !list) errors.push({ path: `${path}.blocks`, message: "must be a list" });
+  const raw = list != null ? list : templatePage(pageKey, template).blocks;
+  if (raw.length > MAX_BLOCKS) errors.push({ path: `${path}.blocks`, message: `can have at most ${MAX_BLOCKS}` });
+  const ids = /* @__PURE__ */ new Set();
+  const slotsSeen = /* @__PURE__ */ new Set();
+  const blocks = [];
+  raw.slice(0, MAX_BLOCKS).forEach((b, i) => {
+    var _a2, _b2;
+    const at = `${path}.blocks[${i}]`;
+    if (!b || typeof b !== "object") {
+      errors.push({ path: at, message: "must be an object" });
+      return;
+    }
+    const def = blockDef(pageKey, b.type);
+    if (!def) {
+      errors.push({ path: `${at}.type`, message: `unknown block "${b.type}" on the ${page.label.toLowerCase()}` });
+      return;
+    }
+    const id = String((_a2 = b.id) != null ? _a2 : "");
+    if (!ID_RE2.test(id)) errors.push({ path: `${at}.id`, message: "must be 1\u201340 lowercase letters, digits or dashes" });
+    else if (ids.has(id)) errors.push({ path: `${at}.id`, message: `duplicate id "${id}"` });
+    ids.add(id);
+    if (def.slot) {
+      if (slotsSeen.has(b.type)) {
+        errors.push({ path: `${at}.type`, message: `"${def.label}" can appear only once` });
+        return;
+      }
+      slotsSeen.add(b.type);
+    }
+    let enabled = b.enabled === void 0 ? true : b.enabled;
+    if (typeof enabled !== "boolean") {
+      errors.push({ path: `${at}.enabled`, message: "must be true or false" });
+      enabled = true;
+    }
+    if (def.required && !enabled) {
+      errors.push({ path: `${at}.enabled`, message: `"${def.label}" is required and cannot be hidden` });
+      enabled = true;
+    }
+    blocks.push({ id, type: b.type, enabled, props: validateFields(def.fields, (_b2 = b.props) != null ? _b2 : {}, `${at}.props`, errors) });
+  });
+  for (const [type, def] of Object.entries(page.slots)) {
+    if (def.required && !slotsSeen.has(type)) {
+      errors.push({ path: `${path}.blocks`, message: `"${def.label}" is required` });
+      blocks.push({ id: ids.has(blockId(type)) ? `${blockId(type)}-1` : blockId(type), type, enabled: true, props: blockDefaults(pageKey, type) });
+    }
+  }
+  return { template, settings, blocks };
+}
+function migrateStore(input) {
+  const home = input && typeof input === "object" && Array.isArray(input.sections) ? input : null;
+  return {
+    version: STORE_VERSION,
+    pages: { home: home ? { version: 1, sections: home.sections } : defaultPage(), listing: templatePage("listing"), product: templatePage("product") },
+    chrome: defaultChrome(),
+    card: defaultCard()
+  };
+}
+var isLegacyPage = (doc) => !!doc && typeof doc === "object" && doc.version !== STORE_VERSION && Array.isArray(doc.sections);
+function validateStore(input) {
+  var _a, _b, _c;
+  const errors = [];
+  const src0 = isLegacyPage(input) ? migrateStore(input) : input;
+  const src = src0 && typeof src0 === "object" && !Array.isArray(src0) ? src0 : null;
+  if (!src) {
+    const doc2 = migrateStore(null);
+    return { ok: false, errors: [{ path: "doc", message: "must be an object" }], doc: doc2 };
+  }
+  if (src.version != null && src.version !== STORE_VERSION) errors.push({ path: "version", message: `must be ${STORE_VERSION}` });
+  const pages = src.pages && typeof src.pages === "object" ? src.pages : {};
+  const home = validatePage((_a = pages.home) != null ? _a : defaultPage());
+  home.errors.forEach((e) => errors.push({ path: `pages.home.${e.path}`, message: e.message }));
+  const doc = {
+    version: STORE_VERSION,
+    pages: {
+      home: home.page,
+      ...Object.fromEntries(STORE_PAGE_KEYS.map((k) => [k, validateTemplatePage(k, pages[k], `pages.${k}`, errors)]))
+    },
+    chrome: validateGroups(CHROME_FIELDS, (_b = src.chrome) != null ? _b : {}, "chrome", errors),
+    card: validateFields(CARD_FIELDS, (_c = src.card) != null ? _c : {}, "card", errors)
+  };
+  if (doc.chrome.announcement.enabled && !doc.chrome.announcement.text) errors.push({ path: "chrome.announcement.text", message: "is required when the bar is shown" });
+  return { ok: errors.length === 0, errors, doc };
+}
+function defaultStore({ name, tagline } = {}) {
+  return { ...migrateStore(defaultPage({ name, tagline })) };
+}
+function storeMediaRefs(doc) {
+  const out = [];
+  const walk = (v) => {
+    if (Array.isArray(v)) v.forEach(walk);
+    else if (v && typeof v === "object") {
+      if (v.media_id != null && Object.keys(v).every((k) => k === "media_id" || k === "alt")) out.push(v);
+      else Object.values(v).forEach(walk);
+    }
+  };
+  walk(doc);
+  return out;
+}
 export {
+  CARD_FIELDS,
+  CHROME_FIELDS,
+  CONTENT_BLOCKS,
   DEFAULT_THEME,
   FONT_PAIRS,
   ICON_NAMES,
+  LISTING_SLOTS,
+  MAX_BLOCKS,
   MAX_SECTIONS,
   MODES,
   PAGE_VERSION,
   PALETTE_STEPS,
+  PRODUCT_SLOTS,
   RADII,
   SECTION_TYPES,
   SECTION_TYPE_KEYS,
+  STORE_PAGES,
+  STORE_PAGE_KEYS,
+  STORE_VERSION,
   THEME_PRESETS,
+  blockDef,
   brandPalette,
   contrastRatio,
+  defaultCard,
+  defaultChrome,
   defaultPage,
+  defaultStore,
   hexToOklch,
   isHex,
+  isLegacyPage,
   luminance,
+  migrateStore,
+  newBlock,
   newSection,
   newSectionId,
   oklchToHex,
@@ -670,7 +967,11 @@ export {
   safeHref,
   sanitizeRichText,
   sectionDefaults,
+  storeMediaRefs,
+  templatePage,
   themeVars,
+  validateFields,
   validatePage,
+  validateStore,
   validateTheme
 };

package/index.d.ts

@@ -299,7 +299,7 @@ export declare function createDemoIsland(props: Omit<DemoDialogProps, 'onClose'>
 // ---------------------------------------------------------------------------
 // Tenant pages: a store's own landing page as data. Validate and build pages
 // with `@dreamtree-org/landing-kit/schema`; render them with TenantPage.
-import type { PageDoc, Theme, MediaRef, SectionType, ValidationError, Palette, FontPair } from './schema';
+import type { PageDoc, Theme, MediaRef, SectionType, ValidationError, Palette, FontPair, StoreDoc, TemplateBlock } from './schema';
 
 export interface TenantPageProps {
   /** A page document (validated again here; invalid sections are dropped). */
@@ -321,6 +321,20 @@ export function TenantPage(props: TenantPageProps): JSX.Element;
 export const TENANT_BLOCKS: Record<SectionType, (props: any) => JSX.Element | null>;
 export function HeroSlider(props: Record<string, unknown>): JSX.Element | null;
 export function NamedIcon(props: { name: string; size?: number; className?: string }): JSX.Element | null;
+export interface TemplateRegionProps {
+  /** The blocks of a template page (StoreDoc.pages.listing/product.blocks), in order; hidden ones are skipped. */
+  blocks: TemplateBlock[];
+  /** App components for commerce slots, by block type; return null to place a slot yourself. */
+  slots?: Record<string, ComponentType<{ block: TemplateBlock; props: Record<string, unknown> }>>;
+  theme?: Partial<Theme> | null;
+  resolveMedia?: (ref: MediaRef, variant: string) => string | null;
+  linkComponent?: ComponentType<any> | null;
+  storeName?: string;
+  className?: string;
+}
+/** A listing or product page's blocks: app slots plus content sections rendered like TenantPage. */
+export function TemplateRegion(props: TemplateRegionProps): JSX.Element;
+export function validateStore(doc: unknown): { ok: boolean; errors: ValidationError[]; doc: StoreDoc };
 export function validatePage(doc: unknown): { ok: boolean; errors: ValidationError[]; page: PageDoc };
 export function validateTheme(theme: unknown): { ok: boolean; errors: ValidationError[]; warnings: ValidationError[]; theme: Theme };
 export function themeVars(theme: unknown): { theme: Theme; font: FontPair; palette: { primary: Palette; accent: Palette }; style: Record<string, string> };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dreamtree-org/landing-kit",
-  "version": "0.7.2",
-  "description": "The shared marketing site and auth frame (AuthShell + brands) for every Dreamtree product: content-driven landing pages, login/signup shell, Express routes, prerender and SEO files.",
+  "version": "0.9.0",
+  "description": "The shared marketing site, auth frame (AuthShell + brands) and Platform admin console for every Dreamtree product: content-driven landing pages, login/signup shell, platform console client, Express routes, prerender and SEO files.",
   "author": {
     "name": "Partha Preetham Krishna",
     "email": "preetham.krishna.dev@gmail.com",
@@ -56,6 +56,11 @@
       "import": "./dist/enhance.js",
       "require": "./dist/enhance.cjs"
     },
+    "./platform": {
+      "types": "./platform.d.ts",
+      "import": "./dist/platform.js",
+      "require": "./dist/platform.cjs"
+    },
     "./styles.css": "./styles.css",
     "./auth.css": "./auth.css"
   },
@@ -73,6 +78,9 @@
     "schema.d.ts",
     "demo-server.d.ts",
     "enhance.d.ts",
+    "platform.d.ts",
+    "PLATFORM-API.md",
+    "ai-skills",
     "README.md",
     "MIGRATION.md",
     "LICENSE"
@@ -85,9 +93,16 @@
   },
   "peerDependencies": {
     "react": ">=18",
-    "react-dom": ">=18"
+    "react-dom": ">=18",
+    "@dreamtree-org/twreact-ui": "^2.0.2"
+  },
+  "peerDependenciesMeta": {
+    "@dreamtree-org/twreact-ui": {
+      "optional": true
+    }
   },
   "devDependencies": {
+    "@dreamtree-org/twreact-ui": "^2.0.2",
     "esbuild": "^0.25.0",
     "express": "^4.22.3",
     "react": "^18.3.1",
@@ -96,6 +111,12 @@
   "engines": {
     "node": ">=18"
   },
+  "dreamtree": {
+    "ai": {
+      "skill": "ai-skills/landing-kit.md",
+      "name": "landing-kit"
+    }
+  },
   "keywords": [
     "react",
     "landing-page",
@@ -106,7 +127,8 @@
     "express",
     "prerender",
     "dreamtree",
-    "multi-tenant"
+    "multi-tenant",
+    "admin-console"
   ],
   "publishConfig": {
     "access": "public"