@withpotter/lib 0.13.0-next.101

package/dist/template-context.js

@@ -0,0 +1,1278 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { BRAND_PRIMARY } from "@withpotter/lib/brand";
+import {
+  createContext,
+  useContext,
+  useState,
+  useEffect,
+  useCallback,
+  useMemo,
+  useRef
+} from "react";
+import { resolveIcon } from "./icon-resolver";
+import { validateTemplateConfig } from "./schema-validation";
+import { resolveWebUrl } from "./web-url";
+import { apiFetch } from "@withpotter/lib/api/core";
+const WEB_URL = resolveWebUrl();
+const SCHEMA_CACHE_PREFIX = "pb_template_schema_";
+const SCHEMA_CACHE_TTL = 5 * 60 * 1e3;
+function getSchemaCache(templateId) {
+  try {
+    const raw = localStorage.getItem(SCHEMA_CACHE_PREFIX + templateId);
+    if (!raw) return null;
+    return JSON.parse(raw);
+  } catch {
+    return null;
+  }
+}
+function setSchemaCache(templateId, data) {
+  try {
+    const entry = { data, timestamp: Date.now() };
+    localStorage.setItem(
+      SCHEMA_CACHE_PREFIX + templateId,
+      JSON.stringify(entry)
+    );
+  } catch {
+  }
+}
+function isCacheFresh(cache) {
+  return Date.now() - cache.timestamp < SCHEMA_CACHE_TTL;
+}
+let registryMemo = null;
+const REGISTRY_MEMO_MS = 6e4;
+function fetchRegistry() {
+  if (registryMemo && Date.now() - registryMemo.at < REGISTRY_MEMO_MS) {
+    return registryMemo.value;
+  }
+  const value = fetchRegistryUncached().catch((err) => {
+    registryMemo = null;
+    throw err;
+  });
+  registryMemo = { at: Date.now(), value };
+  return value;
+}
+function prefetchRegistry() {
+  void fetchRegistry().catch(() => {
+  });
+}
+async function fetchRegistryUncached() {
+  const MAX_ATTEMPTS = 3;
+  let lastError = new Error("Failed to fetch template registry");
+  for (let attempt = 0; attempt < MAX_ATTEMPTS; attempt++) {
+    if (attempt > 0) {
+      await new Promise((resolve) => setTimeout(resolve, attempt * 600));
+    }
+    const controller = new AbortController();
+    const timeoutId = setTimeout(() => controller.abort(), 1e4);
+    try {
+      const res = await fetch(`${WEB_URL}/api/templates/registry`, {
+        cache: "no-store",
+        signal: controller.signal
+      });
+      if (!res.ok) throw new Error(`HTTP ${res.status}`);
+      return await res.json();
+    } catch (err) {
+      lastError = err instanceof Error ? err : new Error("Fetch failed");
+    } finally {
+      clearTimeout(timeoutId);
+    }
+  }
+  try {
+    const fallback = await fetchRegistryFromApi();
+    if (fallback.templates.length > 0) return fallback;
+  } catch {
+  }
+  throw lastError;
+}
+async function fetchProvisionableTemplateIds() {
+  try {
+    const rows = await apiFetch("/templates");
+    const ids = rows.filter((t) => t.isActive !== false).map((t) => t.id);
+    return ids.length > 0 ? new Set(ids) : null;
+  } catch {
+    return null;
+  }
+}
+async function fetchRegistryFromApi() {
+  const rows = await apiFetch("/templates");
+  const templates = rows.filter((t) => t.isActive !== false).map((t) => ({
+    id: t.id,
+    name: t.name,
+    description: t.description ?? "",
+    category: t.category ?? "other",
+    icon: "",
+    thumbnail: t.previewImage ?? null,
+    tags: [],
+    sortOrder: t.sortOrder ?? 0,
+    behaviors: t.behaviors ?? []
+  }));
+  const counts = /* @__PURE__ */ new Map();
+  for (const t of templates)
+    counts.set(t.category, (counts.get(t.category) ?? 0) + 1);
+  return {
+    version: "api-fallback",
+    generatedAt: (/* @__PURE__ */ new Date()).toISOString(),
+    categories: [...counts].map(([id, count]) => ({
+      id,
+      name: id.charAt(0).toUpperCase() + id.slice(1),
+      icon: "",
+      count
+    })),
+    templates
+  };
+}
+function validateTemplateSchema(schema) {
+  const zodResult = validateTemplateConfig(
+    schema
+  );
+  const warnings = [
+    ...zodResult.errors.map(
+      (e) => `[Schema Error] ${e.path ? `${e.path}: ` : ""}${e.message}`
+    ),
+    ...zodResult.warnings
+  ];
+  return { valid: zodResult.valid, warnings };
+}
+const failedTemplateFetches = /* @__PURE__ */ new Map();
+const FAILURE_TTL_MS = 1e4;
+function hasRecentlyFailed(templateId) {
+  const failedAt = failedTemplateFetches.get(templateId);
+  if (!failedAt) return false;
+  if (Date.now() - failedAt > FAILURE_TTL_MS) {
+    failedTemplateFetches.delete(templateId);
+    return false;
+  }
+  return true;
+}
+function markFailed(templateId) {
+  failedTemplateFetches.set(templateId, Date.now());
+}
+function clearFailedCache(templateId) {
+  failedTemplateFetches.delete(templateId);
+}
+const standIn = (t) => t?.__servedFromApiRow;
+async function fetchTemplateSchema(templateId, retryCount = 0, timeoutMs = 2e3) {
+  const MAX_RETRIES = timeoutMs > 2e3 ? 3 : 0;
+  if (retryCount === 0 && hasRecentlyFailed(templateId)) {
+    console.warn(`Template "${templateId}" recently failed, skipping fetch`);
+    return null;
+  }
+  try {
+    const controller = new AbortController();
+    const timeoutId = setTimeout(() => controller.abort(), timeoutMs);
+    const res = await fetch(`${WEB_URL}/api/templates/${templateId}`, {
+      cache: "no-store",
+      signal: controller.signal
+    }).finally(() => clearTimeout(timeoutId));
+    if (!res.ok) {
+      if (res.status === 404) {
+        markFailed(templateId);
+        console.error(`Template not found: ${templateId} (HTTP ${res.status})`);
+        return null;
+      }
+      if (retryCount < MAX_RETRIES) {
+        console.warn(
+          `Template fetch failed (attempt ${retryCount + 1}), retrying...`
+        );
+        await new Promise(
+          (resolve) => setTimeout(resolve, (retryCount + 1) * 500)
+        );
+        return fetchTemplateSchema(templateId, retryCount + 1, timeoutMs);
+      }
+      markFailed(templateId);
+      console.error(
+        `Failed to fetch schema for template: ${templateId} (HTTP ${res.status})`
+      );
+      return null;
+    }
+    clearFailedCache(templateId);
+    return res.json();
+  } catch (err) {
+    if (retryCount < MAX_RETRIES) {
+      console.warn(
+        `Template fetch error (attempt ${retryCount + 1}), retrying...`,
+        err
+      );
+      await new Promise(
+        (resolve) => setTimeout(resolve, (retryCount + 1) * 500)
+      );
+      return fetchTemplateSchema(templateId, retryCount + 1, timeoutMs);
+    }
+    try {
+      const row = await apiFetch(`/templates/${templateId}`);
+      if (row?.id) {
+        console.warn(
+          `Template "${templateId}" schema served from the API row; the dashboard is degraded until the renderer returns.`
+        );
+        return { ...row, __servedFromApiRow: true };
+      }
+    } catch {
+    }
+    markFailed(templateId);
+    console.error(`Error fetching template ${templateId}:`, err);
+    return null;
+  }
+}
+function resolveTemplateConfig(apiTemplate) {
+  const FONT_SIZE_OPTIONS = [
+    { label: "Extra Small (12px)", value: "xs" },
+    { label: "Small (14px)", value: "sm" },
+    { label: "Base (16px)", value: "base" },
+    { label: "Large (18px)", value: "lg" },
+    { label: "Extra Large (20px)", value: "xl" },
+    { label: "2XL (24px)", value: "2xl" },
+    { label: "3XL (30px)", value: "3xl" },
+    { label: "4XL (36px)", value: "4xl" },
+    { label: "5XL (48px)", value: "5xl" },
+    { label: "6XL (60px)", value: "6xl" }
+  ];
+  const FONT_SIZE_EXCLUDED_NAME_PATTERN = /(link|url|slug|email|phone|sku|placeholder|alt|path|handle|id)$/i;
+  function defaultFontSizeForField(field) {
+    const key = `${field.name} ${field.label}`.toLowerCase();
+    if (/headline|hero\s*title|main\s*title/.test(key)) return "6xl";
+    if (/title|heading/.test(key)) return "4xl";
+    if (/subtitle|description|content|story|body/.test(key)) return "base";
+    if (/eyebrow|caption|tagline|label/.test(key)) return "sm";
+    if (field.type === "textarea" || field.type === "richtext") return "base";
+    return "lg";
+  }
+  function shouldAttachFontSizeField(field, sectionFields) {
+    if (!["text", "textarea", "richtext"].includes(field.type)) return false;
+    if (field.name.endsWith("Size")) return false;
+    if (FONT_SIZE_EXCLUDED_NAME_PATTERN.test(field.name)) return false;
+    return !sectionFields.some((f) => f.name === `${field.name}Size`);
+  }
+  function attachFontSizeFields(fields) {
+    const result = [];
+    for (const field of fields) {
+      result.push(field);
+      if (!shouldAttachFontSizeField(field, fields)) continue;
+      result.push({
+        name: `${field.name}Size`,
+        label: `${field.label} Size`,
+        type: "select",
+        ui: "fontSizeScale",
+        default: defaultFontSizeForField(field),
+        options: FONT_SIZE_OPTIONS,
+        previewText: field.label,
+        description: `Controls font size for "${field.label}"`
+      });
+    }
+    return result;
+  }
+  function withFontSizeControls(pageContent) {
+    const enhanced = {};
+    for (const [pageKey, pageSchema] of Object.entries(pageContent)) {
+      if (!pageSchema) continue;
+      const sourceSections = pageSchema.sections || [];
+      const seen = /* @__PURE__ */ new Set();
+      const dedupedSections = [];
+      for (const section of sourceSections) {
+        if (seen.has(section.id)) {
+          if (process.env.NODE_ENV !== "production") {
+            console.warn(
+              `[template-context] Duplicate section id "${section.id}" on page "${pageKey}" \u2014 dropping duplicate.`
+            );
+          }
+          continue;
+        }
+        seen.add(section.id);
+        dedupedSections.push(section);
+      }
+      enhanced[pageKey] = {
+        ...pageSchema,
+        sections: dedupedSections.map((section) => ({
+          ...section,
+          fields: attachFontSizeFields(section.fields || [])
+        }))
+      };
+    }
+    return enhanced;
+  }
+  function normalizeSiteSettings(raw) {
+    if (!raw) return void 0;
+    const result = {};
+    for (const [sectionKey, sectionVal] of Object.entries(raw)) {
+      if (!sectionVal || typeof sectionVal !== "object") continue;
+      const section = sectionVal;
+      if (section.type && section.type !== "section") {
+        result[sectionKey] = section;
+        continue;
+      }
+      const fieldsRaw = section.fields;
+      let fieldsArray;
+      if (Array.isArray(fieldsRaw)) {
+        fieldsArray = fieldsRaw;
+      } else if (fieldsRaw && typeof fieldsRaw === "object") {
+        fieldsArray = Object.entries(fieldsRaw).map(
+          ([fieldName, fieldConfig]) => ({
+            ...fieldConfig,
+            name: fieldName
+          })
+        );
+      } else {
+        result[sectionKey] = section;
+        continue;
+      }
+      result[sectionKey] = {
+        label: section.title || section.label || sectionKey,
+        description: section.description,
+        fields: fieldsArray
+      };
+    }
+    return Object.keys(result).length > 0 ? result : void 0;
+  }
+  const contentTypes = {};
+  for (const [key, ct] of Object.entries(apiTemplate.contentTypes || {})) {
+    const ctRecord = ct;
+    contentTypes[key] = {
+      ...ct,
+      // Map API field names to expected field names
+      name: ct.name || ctRecord.label || key,
+      singularName: ct.singularName || ctRecord.labelSingular || ctRecord.label || key,
+      apiEndpoint: ct.apiEndpoint || ctRecord.coreEndpoint,
+      contentTypeKey: ct.contentTypeKey || key,
+      // Set contentTypeKey to the object key if not provided
+      icon: resolveIcon(ct.icon)
+    };
+  }
+  if (!contentTypes.blog) {
+    contentTypes.blog = {
+      name: "Blog Posts",
+      singularName: "Blog Post",
+      icon: resolveIcon("BookOpen"),
+      apiEndpoint: "blog",
+      contentTypeKey: "blog",
+      behaviors: [],
+      fields: [
+        { name: "title", label: "Post Title", type: "text", required: true },
+        { name: "slug", label: "URL Slug", type: "text", required: true },
+        { name: "shortDescription", label: "Excerpt", type: "textarea" },
+        { name: "description", label: "Body", type: "richtext" },
+        { name: "image", label: "Cover Image", type: "image" },
+        { name: "category", label: "Category", type: "text" },
+        { name: "tags", label: "Tags", type: "text" },
+        { name: "author", label: "Author Name", type: "text" },
+        { name: "readTime", label: "Read Time (minutes)", type: "number" },
+        { name: "featured", label: "Featured", type: "boolean" },
+        {
+          name: "status",
+          label: "Status",
+          type: "select",
+          options: [
+            { label: "Published", value: "published" },
+            { label: "Draft", value: "draft" }
+          ]
+        }
+      ]
+    };
+  }
+  const featurePages = /* @__PURE__ */ new Set([
+    "analytics",
+    "customers",
+    "orders",
+    "bookings",
+    "payments",
+    "calendar-sync",
+    "gift-cards",
+    "giftcards",
+    "memberships",
+    "waitlist",
+    "loyalty",
+    "gallery",
+    "collections",
+    "blog"
+  ]);
+  const specialPaths = /* @__PURE__ */ new Set([
+    "/dashboard",
+    "/dashboard/settings",
+    "/dashboard/appearance",
+    "/dashboard/payments",
+    "/dashboard/analytics",
+    "/dashboard/customers",
+    "/dashboard/orders",
+    "/dashboard/content/team",
+    "/dashboard/content/inquiries",
+    "/dashboard/bookings",
+    "/dashboard/calendar-sync",
+    "/dashboard/gift-cards",
+    "/dashboard/content/memberships",
+    "/dashboard/waitlist",
+    "/dashboard/gallery",
+    "/dashboard/blog"
+  ]);
+  const pathMapping = {
+    "/overview": "/dashboard",
+    "/admin": "/dashboard",
+    "/settings": "/dashboard/settings",
+    "/admin/settings": "/dashboard/settings",
+    "/appearance": "/dashboard/appearance",
+    "/admin/appearance": "/dashboard/appearance",
+    "/payments": "/dashboard/payments",
+    "/admin/payments": "/dashboard/payments",
+    "/orders": "/dashboard/orders",
+    "/admin/orders": "/dashboard/orders",
+    "/analytics": "/dashboard/analytics",
+    "/admin/analytics": "/dashboard/analytics",
+    "/customers": "/dashboard/customers",
+    "/admin/customers": "/dashboard/customers",
+    "/products": "/dashboard/content/products",
+    "/admin/products": "/dashboard/content/products",
+    "/pages": "/dashboard/content/pages",
+    "/admin/pages": "/dashboard/content/pages",
+    "/team": "/dashboard/content/team",
+    "/admin/team": "/dashboard/content/team",
+    "/inquiries": "/dashboard/content/inquiries",
+    "/admin/inquiries": "/dashboard/content/inquiries",
+    "/bookings": "/dashboard/bookings",
+    "/admin/bookings": "/dashboard/bookings",
+    "/gallery": "/dashboard/gallery",
+    "/admin/gallery": "/dashboard/gallery",
+    "/testimonials": "/dashboard/content/testimonials",
+    "/admin/testimonials": "/dashboard/content/testimonials",
+    "/collections": "/dashboard/collections",
+    "/admin/collections": "/dashboard/collections"
+  };
+  const rawModules = apiTemplate.dashboardModules;
+  const modulesArray = !rawModules ? [] : Array.isArray(rawModules) ? rawModules : Object.entries(rawModules).map(([id, mod]) => ({
+    id,
+    ...mod
+  }));
+  const dashboardModules = modulesArray.map((mod) => {
+    const modRecord = mod;
+    const apiPath = modRecord.path;
+    const contentType = modRecord.contentType;
+    let href = pathMapping[apiPath] || apiPath;
+    if (href && href.startsWith("/admin")) {
+      href = href.replace(/^\/admin/, "");
+    }
+    if (href && !href.startsWith("/dashboard")) {
+      href = `/dashboard${href}`;
+    }
+    if (contentType && !specialPaths.has(href)) {
+      if (featurePages.has(contentType)) {
+        href = `/dashboard/${contentType}`;
+      } else {
+        href = `/dashboard/content/${contentType}`;
+      }
+    }
+    return {
+      id: modRecord.id,
+      name: modRecord.label || modRecord.name || modRecord.title,
+      // Map 'label', 'name', or 'title'
+      href,
+      icon: resolveIcon(modRecord.icon),
+      description: modRecord.description,
+      badge: modRecord.badge,
+      contentType: modRecord.contentType
+    };
+  });
+  const DEFAULT_APPEARANCE = {
+    colors: {
+      label: "Brand Colors",
+      description: "Customize the color palette of your website",
+      fields: [
+        {
+          name: "primary",
+          label: "Primary",
+          type: "color",
+          default: BRAND_PRIMARY
+        },
+        {
+          name: "secondary",
+          label: "Secondary",
+          type: "color",
+          default: "#1A1A1A"
+        },
+        { name: "accent", label: "Accent", type: "color", default: "#FFB800" },
+        {
+          name: "background",
+          label: "Background",
+          type: "color",
+          default: "#FFFFFF"
+        },
+        { name: "text", label: "Text", type: "color", default: "#2D2D2D" }
+      ]
+    },
+    fonts: {
+      label: "Typography",
+      description: "Choose fonts for headings and body text",
+      fields: [
+        {
+          name: "heading",
+          label: "Heading Font",
+          type: "font",
+          default: "Inter"
+        },
+        { name: "body", label: "Body Font", type: "font", default: "Inter" }
+      ]
+    },
+    sections: {
+      label: "Section Visibility",
+      description: "Show or hide sections on your website",
+      fields: [
+        {
+          name: "showHero",
+          label: "Hero Banner",
+          type: "boolean",
+          default: true
+        },
+        {
+          name: "showTestimonials",
+          label: "Testimonials",
+          type: "boolean",
+          default: true
+        },
+        {
+          name: "showNewsletter",
+          label: "Newsletter Signup",
+          type: "boolean",
+          default: true
+        }
+      ]
+    }
+  };
+  const DEFAULT_PAGE_CONTENT = {
+    home: {
+      label: "Home",
+      description: "Content for your homepage",
+      sections: [
+        {
+          id: "hero",
+          label: "Hero Section",
+          fields: [
+            {
+              name: "headline",
+              label: "Headline",
+              type: "text",
+              placeholder: "Welcome to our store"
+            },
+            {
+              name: "subheadline",
+              label: "Subheadline",
+              type: "textarea",
+              placeholder: "Discover amazing products"
+            },
+            { name: "heroImage", label: "Hero Image", type: "image" },
+            {
+              name: "ctaText",
+              label: "Button Text",
+              type: "text",
+              default: "Shop Now",
+              placeholder: "Shop Now"
+            },
+            {
+              name: "ctaLink",
+              label: "Button Link",
+              type: "text",
+              default: "/products",
+              placeholder: "/products"
+            }
+          ]
+        },
+        {
+          id: "featured",
+          label: "Featured Section",
+          fields: [
+            {
+              name: "title",
+              label: "Section Title",
+              type: "text",
+              default: "Featured Products",
+              placeholder: "Featured Products"
+            },
+            {
+              name: "subtitle",
+              label: "Section Subtitle",
+              type: "textarea",
+              placeholder: "Our top picks for you"
+            }
+          ]
+        }
+      ]
+    },
+    about: {
+      label: "About",
+      description: "Tell visitors about your business",
+      sections: [
+        {
+          id: "story",
+          label: "Our Story",
+          fields: [
+            {
+              name: "title",
+              label: "Page Title",
+              type: "text",
+              default: "About Us",
+              placeholder: "About Us"
+            },
+            {
+              name: "content",
+              label: "Story Content",
+              type: "richtext",
+              placeholder: "Tell your brand story..."
+            },
+            { name: "image", label: "About Image", type: "image" }
+          ]
+        },
+        {
+          id: "mission",
+          label: "Mission & Values",
+          fields: [
+            {
+              name: "mission",
+              label: "Mission Statement",
+              type: "textarea",
+              placeholder: "Our mission is..."
+            },
+            {
+              name: "values",
+              label: "Core Values",
+              type: "textarea",
+              placeholder: "Quality, Integrity, Innovation"
+            }
+          ]
+        }
+      ]
+    },
+    contact: {
+      label: "Contact",
+      description: "Contact page information",
+      sections: [
+        {
+          id: "info",
+          label: "Contact Information",
+          fields: [
+            {
+              name: "title",
+              label: "Page Title",
+              type: "text",
+              default: "Contact Us",
+              placeholder: "Contact Us"
+            },
+            {
+              name: "description",
+              label: "Description",
+              type: "textarea",
+              placeholder: "We'd love to hear from you"
+            },
+            {
+              name: "email",
+              label: "Email Address",
+              type: "text",
+              placeholder: "hello@example.com"
+            },
+            {
+              name: "phone",
+              label: "Phone Number",
+              type: "text",
+              placeholder: "+1 (555) 000-0000"
+            },
+            {
+              name: "address",
+              label: "Address",
+              type: "textarea",
+              placeholder: "123 Main St, City, State"
+            }
+          ]
+        }
+      ]
+    },
+    faq: {
+      label: "FAQ",
+      description: "Frequently asked questions page",
+      sections: [
+        {
+          id: "header",
+          label: "Page Header",
+          fields: [
+            {
+              name: "title",
+              label: "Page Title",
+              type: "text",
+              default: "Frequently Asked Questions",
+              placeholder: "Frequently Asked Questions"
+            },
+            {
+              name: "subtitle",
+              label: "Subtitle",
+              type: "textarea",
+              placeholder: "Find answers to common questions"
+            }
+          ]
+        }
+      ]
+    },
+    shop: {
+      label: "Shop",
+      description: "Shop / products listing page",
+      sections: [
+        {
+          id: "header",
+          label: "Page Header",
+          fields: [
+            {
+              name: "title",
+              label: "Page Title",
+              type: "text",
+              default: "Shop",
+              placeholder: "Shop"
+            },
+            {
+              name: "subtitle",
+              label: "Subtitle",
+              type: "textarea",
+              placeholder: "Browse our collection"
+            }
+          ]
+        }
+      ]
+    },
+    orderTrack: {
+      label: "Order Tracking",
+      description: "Order tracking page",
+      sections: [
+        {
+          id: "header",
+          label: "Page Header",
+          fields: [
+            {
+              name: "title",
+              label: "Page Title",
+              type: "text",
+              default: "Track Your Order",
+              placeholder: "Track Your Order"
+            },
+            {
+              name: "subtitle",
+              label: "Subtitle",
+              type: "textarea",
+              placeholder: "Enter your order details to check the status"
+            }
+          ]
+        }
+      ]
+    },
+    booking: {
+      label: "Booking",
+      description: "Booking / appointment page",
+      platformFallback: true,
+      sections: [
+        {
+          id: "header",
+          label: "Page Header",
+          fields: [
+            {
+              name: "title",
+              label: "Page Title",
+              type: "text",
+              default: "Book an Appointment",
+              placeholder: "Book an Appointment"
+            },
+            {
+              name: "subtitle",
+              label: "Subtitle",
+              type: "textarea",
+              placeholder: "Schedule your visit with us"
+            }
+          ]
+        },
+        {
+          id: "layout",
+          label: "Layout",
+          fields: [
+            {
+              name: "variant",
+              label: "Layout Style",
+              type: "select",
+              default: "default",
+              options: [
+                { value: "default", label: "Default" },
+                { value: "split", label: "Split (calendar left / form right)" }
+              ]
+            }
+          ]
+        }
+      ]
+    },
+    membership: {
+      label: "Membership",
+      description: "Membership / subscription page",
+      platformFallback: true,
+      sections: [
+        {
+          id: "header",
+          label: "Page Header",
+          fields: [
+            {
+              name: "title",
+              label: "Page Title",
+              type: "text",
+              default: "Membership Plans",
+              placeholder: "Membership Plans"
+            },
+            {
+              name: "subtitle",
+              label: "Subtitle",
+              type: "textarea",
+              placeholder: "Choose the plan that suits you best"
+            }
+          ]
+        },
+        {
+          id: "layout",
+          label: "Layout",
+          fields: [
+            {
+              name: "variant",
+              label: "Layout Style",
+              type: "select",
+              default: "cards",
+              options: [
+                { value: "cards", label: "Cards (side by side)" },
+                { value: "comparison", label: "Comparison Table" }
+              ]
+            }
+          ]
+        }
+      ]
+    },
+    services: {
+      label: "Services",
+      description: "Services listing page",
+      platformFallback: true,
+      sections: [
+        {
+          id: "header",
+          label: "Page Header",
+          fields: [
+            {
+              name: "title",
+              label: "Page Title",
+              type: "text",
+              default: "Our Services",
+              placeholder: "Our Services"
+            },
+            {
+              name: "subtitle",
+              label: "Subtitle",
+              type: "textarea",
+              placeholder: "Browse our services and book online"
+            }
+          ]
+        },
+        {
+          id: "layout",
+          label: "Layout",
+          fields: [
+            {
+              name: "variant",
+              label: "Layout Style",
+              type: "select",
+              default: "grid",
+              options: [
+                { value: "grid", label: "Grid" },
+                { value: "list", label: "List" }
+              ]
+            }
+          ]
+        }
+      ]
+    },
+    events: {
+      label: "Events",
+      description: "Events listing page",
+      platformFallback: true,
+      sections: [
+        {
+          id: "header",
+          label: "Page Header",
+          fields: [
+            {
+              name: "title",
+              label: "Page Title",
+              type: "text",
+              default: "Upcoming Events",
+              placeholder: "Upcoming Events"
+            },
+            {
+              name: "subtitle",
+              label: "Subtitle",
+              type: "textarea",
+              placeholder: "Browse and register for upcoming events"
+            }
+          ]
+        },
+        {
+          id: "layout",
+          label: "Layout",
+          fields: [
+            {
+              name: "variant",
+              label: "Layout Style",
+              type: "select",
+              default: "grid",
+              options: [
+                { value: "grid", label: "Grid" },
+                { value: "list", label: "List (timeline-style)" }
+              ]
+            }
+          ]
+        }
+      ]
+    },
+    packages: {
+      label: "Packages",
+      description: "Packages / services listing page",
+      sections: [
+        {
+          id: "header",
+          label: "Page Header",
+          fields: [
+            {
+              name: "title",
+              label: "Page Title",
+              type: "text",
+              default: "Our Packages",
+              placeholder: "Our Packages"
+            },
+            {
+              name: "subtitle",
+              label: "Subtitle",
+              type: "textarea",
+              placeholder: "Explore our curated packages"
+            }
+          ]
+        }
+      ]
+    },
+    footer: {
+      label: "Footer",
+      description: "Customize your website footer",
+      sections: [
+        {
+          id: "content",
+          label: "Footer Content",
+          fields: [
+            {
+              name: "tagline",
+              label: "Tagline",
+              type: "text",
+              placeholder: "Your tagline here"
+            },
+            {
+              name: "copyright",
+              label: "Copyright Text",
+              type: "text",
+              placeholder: "\xA9 2026 Your Business"
+            },
+            {
+              name: "showSocialLinks",
+              label: "Show Social Links",
+              type: "boolean",
+              default: true
+            }
+          ]
+        }
+      ]
+    }
+  };
+  const apiRecord = apiTemplate;
+  const templateAppearance = apiTemplate.appearance || {
+    ...apiRecord.colors ? { colors: apiRecord.colors } : {},
+    ...apiRecord.fonts ? { fonts: apiRecord.fonts } : {},
+    ...apiRecord.sections ? { sections: apiRecord.sections } : {}
+  };
+  const resolvedAppearance = Object.keys(templateAppearance).length > 0 ? templateAppearance : DEFAULT_APPEARANCE;
+  const templatePageContent = apiTemplate.pageContent;
+  const hasPageContent = templatePageContent && Object.values(templatePageContent).some(
+    (schema) => (schema?.sections?.length ?? 0) > 0
+  );
+  const resolvedPageContent = hasPageContent ? templatePageContent : DEFAULT_PAGE_CONTENT;
+  const finalPageContent = withFontSizeControls(resolvedPageContent);
+  return {
+    ...apiTemplate,
+    icon: resolveIcon(apiTemplate.icon),
+    contentTypes,
+    dashboardModules,
+    appearance: resolvedAppearance,
+    pageContent: withFontSizeControls(resolvedPageContent),
+    siteSettings: normalizeSiteSettings(
+      apiTemplate.siteSettings
+    )
+  };
+}
+const TemplateContext = createContext(null);
+function TemplateProvider({ children }) {
+  const [registry, setRegistry] = useState(null);
+  const [registryLoading, setRegistryLoading] = useState(false);
+  const [loadedSchemas, setLoadedSchemas] = useState(/* @__PURE__ */ new Map());
+  const [schemaLoading, setSchemaLoading] = useState(false);
+  const [currentTemplate, setCurrentTemplateState] = useState(null);
+  const [dashboardState, setDashboardState] = useState("loading");
+  const [schemaWarnings, setSchemaWarnings] = useState([]);
+  const [error, setError] = useState(null);
+  const loadRegistry = useCallback(async () => {
+    try {
+      setRegistryLoading(true);
+      setError(null);
+      const data = await fetchRegistry();
+      setRegistry(data);
+    } catch (err) {
+      console.warn("Failed to load template registry:", err);
+      setError(
+        err instanceof Error ? err : new Error("Failed to load registry")
+      );
+    } finally {
+      setRegistryLoading(false);
+    }
+  }, []);
+  const loadingTemplatesRef = useRef(/* @__PURE__ */ new Set());
+  const requestedTemplateRef = useRef(null);
+  const loadedSchemasRef = useRef(loadedSchemas);
+  loadedSchemasRef.current = loadedSchemas;
+  const loadTemplateSchema = useCallback(
+    async (templateId) => {
+      if (!templateId || templateId === "default" || templateId === "undefined") {
+        return null;
+      }
+      const cached = loadedSchemasRef.current.get(templateId);
+      if (cached && !standIn(cached)) return cached;
+      if (loadingTemplatesRef.current.has(templateId)) {
+        return new Promise((resolve) => {
+          const check = () => {
+            if (!loadingTemplatesRef.current.has(templateId)) {
+              resolve(loadedSchemasRef.current.get(templateId) || null);
+            } else {
+              setTimeout(check, 50);
+            }
+          };
+          setTimeout(check, 50);
+        });
+      }
+      const lsCache = getSchemaCache(templateId);
+      if (lsCache) {
+        const validation = validateTemplateSchema(lsCache.data);
+        if (validation.warnings.length > 0) {
+          setSchemaWarnings(validation.warnings);
+          setDashboardState("degraded");
+        } else {
+          setSchemaWarnings([]);
+          setDashboardState("healthy");
+        }
+        const resolved = resolveTemplateConfig(lsCache.data);
+        setLoadedSchemas((prev) => new Map(prev).set(templateId, resolved));
+        if (!isCacheFresh(lsCache)) {
+          fetchTemplateSchema(templateId).then((fresh) => {
+            if (fresh) {
+              setSchemaCache(templateId, fresh);
+              const freshResolved = resolveTemplateConfig(fresh);
+              setLoadedSchemas(
+                (prev) => new Map(prev).set(templateId, freshResolved)
+              );
+            }
+          }).catch(() => {
+          });
+        }
+        return resolved;
+      }
+      loadingTemplatesRef.current.add(templateId);
+      try {
+        setSchemaLoading(true);
+        const apiSchema = await fetchTemplateSchema(templateId);
+        if (!apiSchema) {
+          console.warn(
+            `Template "${templateId}" schema not available from API`
+          );
+          return null;
+        }
+        const validation = validateTemplateSchema(apiSchema);
+        if (validation.warnings.length > 0) {
+          console.warn(
+            `Template "${templateId}" schema warnings:`,
+            validation.warnings
+          );
+          setSchemaWarnings(validation.warnings);
+          setDashboardState("degraded");
+        } else {
+          setSchemaWarnings([]);
+          setDashboardState("healthy");
+        }
+        const resolved = resolveTemplateConfig(apiSchema);
+        if (apiSchema.__servedFromApiRow) {
+          setDashboardState("degraded");
+          setSchemaWarnings([
+            "Showing a reduced dashboard: the template service is unreachable."
+          ]);
+          setLoadedSchemas((prev) => new Map(prev).set(templateId, resolved));
+          void fetchTemplateSchema(templateId, 1, 12e3).then((full) => {
+            if (!full || standIn(full)) return;
+            setSchemaCache(templateId, full);
+            const real = resolveTemplateConfig(full);
+            setLoadedSchemas((prev) => new Map(prev).set(templateId, real));
+            if (requestedTemplateRef.current !== templateId) return;
+            setCurrentTemplateState(real);
+            setSchemaWarnings([]);
+            setDashboardState("healthy");
+          });
+          return resolved;
+        }
+        setLoadedSchemas((prev) => new Map(prev).set(templateId, resolved));
+        setSchemaCache(templateId, apiSchema);
+        return resolved;
+      } catch (err) {
+        console.warn(`Failed to load schema for ${templateId} from API:`, err);
+        setDashboardState("template-missing");
+        setSchemaWarnings([]);
+        return null;
+      } finally {
+        setSchemaLoading(false);
+        loadingTemplatesRef.current.delete(templateId);
+      }
+    },
+    []
+    // No dependencies — uses refs for cache access
+  );
+  const setCurrentTemplate = useCallback(
+    async (templateId) => {
+      if (!templateId || templateId === "default" || templateId === "undefined") {
+        console.warn(
+          `setCurrentTemplate: Invalid templateId "${templateId}", ignoring`
+        );
+        return;
+      }
+      requestedTemplateRef.current = templateId;
+      setDashboardState("loading");
+      const schema = await loadTemplateSchema(templateId);
+      if (requestedTemplateRef.current !== templateId) return;
+      if (schema) {
+        setCurrentTemplateState(schema);
+      } else {
+        setDashboardState("template-missing");
+      }
+    },
+    [loadTemplateSchema]
+  );
+  const getTemplate = useCallback(
+    (id) => {
+      return loadedSchemas.get(id) || null;
+    },
+    [loadedSchemas]
+  );
+  const getTemplatesByCategory = useCallback(
+    (category) => {
+      return registry?.templates.filter((t) => t.category === category) || [];
+    },
+    [registry]
+  );
+  const getContentType = useCallback(
+    (templateId, contentTypeKey) => {
+      const template = getTemplate(templateId);
+      return template?.contentTypes[contentTypeKey] || null;
+    },
+    [getTemplate]
+  );
+  const retryCurrentTemplate = useCallback(async () => {
+    if (!currentTemplate?.id) {
+      console.warn("No current template to retry");
+      return;
+    }
+    const templateId = currentTemplate.id;
+    console.log(`Retrying template load: ${templateId}`);
+    clearFailedCache(templateId);
+    setDashboardState("loading");
+    await setCurrentTemplate(templateId);
+  }, [currentTemplate, setCurrentTemplate]);
+  const categories = useMemo(() => registry?.categories || [], [registry]);
+  const templateList = useMemo(() => registry?.templates || [], [registry]);
+  const value = useMemo(
+    () => ({
+      registry,
+      categories,
+      templateList,
+      loadedSchemas,
+      currentTemplate,
+      dashboardState,
+      schemaWarnings,
+      registryLoading,
+      schemaLoading,
+      error,
+      loadTemplateSchema,
+      getTemplate,
+      getTemplatesByCategory,
+      getContentType,
+      setCurrentTemplate,
+      refetchRegistry: loadRegistry,
+      retryCurrentTemplate
+    }),
+    [
+      registry,
+      categories,
+      templateList,
+      loadedSchemas,
+      currentTemplate,
+      dashboardState,
+      schemaWarnings,
+      registryLoading,
+      schemaLoading,
+      error,
+      loadTemplateSchema,
+      getTemplate,
+      getTemplatesByCategory,
+      getContentType,
+      setCurrentTemplate,
+      loadRegistry,
+      retryCurrentTemplate
+    ]
+  );
+  return /* @__PURE__ */ jsx(TemplateContext.Provider, { value, children });
+}
+function useTemplates() {
+  const context = useContext(TemplateContext);
+  if (!context) {
+    throw new Error("useTemplates must be used within a TemplateProvider");
+  }
+  return context;
+}
+function useCurrentTemplate(templateId) {
+  const {
+    currentTemplate,
+    setCurrentTemplate,
+    schemaLoading,
+    dashboardState,
+    schemaWarnings,
+    retryCurrentTemplate
+  } = useTemplates();
+  const attemptedLoadRef = useRef(null);
+  useEffect(() => {
+    if (!templateId || templateId === "default" || templateId === "undefined") {
+      return;
+    }
+    if (attemptedLoadRef.current === templateId) {
+      return;
+    }
+    const needsLoad = !currentTemplate || attemptedLoadRef.current !== templateId;
+    if (needsLoad) {
+      attemptedLoadRef.current = templateId;
+      setCurrentTemplate(templateId);
+    }
+  }, [templateId, currentTemplate, setCurrentTemplate]);
+  return {
+    template: currentTemplate?.id === templateId ? currentTemplate : null,
+    loading: schemaLoading,
+    dashboardState,
+    schemaWarnings,
+    retryCurrentTemplate
+  };
+}
+export {
+  TemplateProvider,
+  fetchProvisionableTemplateIds,
+  fetchRegistry,
+  prefetchRegistry,
+  useCurrentTemplate,
+  useTemplates,
+  validateTemplateSchema
+};
+//# sourceMappingURL=template-context.js.map