npm - @mugwork/mug - Versions diffs - 0.1.0 - Mend

@mugwork/mug 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (135) hide show

package/LICENSE +21 -0
package/README.md +251 -0
package/dist/explorer.js +3 -0
package/dist/packages/email-template/src/email-template.d.ts +18 -0
package/dist/packages/email-template/src/email-template.js +74 -0
package/dist/packages/email-template/src/index.d.ts +1 -0
package/dist/packages/email-template/src/index.js +1 -0
package/dist/packages/surface-renderer/src/form-renderer.d.ts +117 -0
package/dist/packages/surface-renderer/src/form-renderer.js +719 -0
package/dist/packages/surface-renderer/src/index.d.ts +4 -0
package/dist/packages/surface-renderer/src/index.js +2 -0
package/dist/packages/surface-renderer/src/portal-renderer.d.ts +177 -0
package/dist/packages/surface-renderer/src/portal-renderer.js +1089 -0
package/dist/packages/surface-renderer/src/workspace-home.d.ts +46 -0
package/dist/packages/surface-renderer/src/workspace-home.js +345 -0
package/dist/runtime/agent-types.d.ts +48 -0
package/dist/runtime/agent-types.js +3 -0
package/dist/runtime/ai-router.d.ts +32 -0
package/dist/runtime/ai-router.js +112 -0
package/dist/runtime/app.d.ts +6 -0
package/dist/runtime/app.js +399 -0
package/dist/runtime/chunker.d.ts +6 -0
package/dist/runtime/chunker.js +30 -0
package/dist/runtime/context.d.ts +115 -0
package/dist/runtime/context.js +440 -0
package/dist/runtime/do/workspace-database.d.ts +10 -0
package/dist/runtime/do/workspace-database.js +199 -0
package/dist/runtime/form-types.d.ts +143 -0
package/dist/runtime/form-types.js +1 -0
package/dist/runtime/runtime.d.ts +9 -0
package/dist/runtime/runtime.js +7 -0
package/dist/runtime/source-types.d.ts +15 -0
package/dist/runtime/source-types.js +1 -0
package/dist/runtime/source.d.ts +70 -0
package/dist/runtime/source.js +21 -0
package/dist/runtime/sync-runtime.d.ts +10 -0
package/dist/runtime/sync-runtime.js +185 -0
package/dist/runtime/types.d.ts +21 -0
package/dist/runtime/types.js +1 -0
package/dist/runtime/workflow-entrypoint.d.ts +31 -0
package/dist/runtime/workflow-entrypoint.js +1297 -0
package/dist/runtime/workflow.d.ts +285 -0
package/dist/runtime/workflow.js +1008 -0
package/dist/src/cli.d.ts +2 -0
package/dist/src/cli.js +44116 -0
package/dist/src/commands/ai-gateway-route.d.ts +24 -0
package/dist/src/commands/ai-gateway-route.js +192 -0
package/dist/src/commands/auth.d.ts +1 -0
package/dist/src/commands/auth.js +42 -0
package/dist/src/commands/billing.d.ts +6 -0
package/dist/src/commands/billing.js +76 -0
package/dist/src/commands/brain.d.ts +1 -0
package/dist/src/commands/brain.js +194 -0
package/dist/src/commands/demo.d.ts +12 -0
package/dist/src/commands/demo.js +147 -0
package/dist/src/commands/deploy.d.ts +1 -0
package/dist/src/commands/deploy.js +1052 -0
package/dist/src/commands/dev.d.ts +14 -0
package/dist/src/commands/dev.js +2818 -0
package/dist/src/commands/form.d.ts +8 -0
package/dist/src/commands/form.js +396 -0
package/dist/src/commands/init.d.ts +1 -0
package/dist/src/commands/init.js +139 -0
package/dist/src/commands/issue.d.ts +7 -0
package/dist/src/commands/issue.js +191 -0
package/dist/src/commands/login.d.ts +9 -0
package/dist/src/commands/login.js +163 -0
package/dist/src/commands/logs.d.ts +8 -0
package/dist/src/commands/logs.js +113 -0
package/dist/src/commands/portal.d.ts +2 -0
package/dist/src/commands/portal.js +111 -0
package/dist/src/commands/pull.d.ts +3 -0
package/dist/src/commands/pull.js +184 -0
package/dist/src/commands/push.d.ts +4 -0
package/dist/src/commands/push.js +183 -0
package/dist/src/commands/run.d.ts +6 -0
package/dist/src/commands/run.js +91 -0
package/dist/src/commands/secret.d.ts +7 -0
package/dist/src/commands/secret.js +105 -0
package/dist/src/commands/shutdown.d.ts +1 -0
package/dist/src/commands/shutdown.js +46 -0
package/dist/src/commands/sql.d.ts +8 -0
package/dist/src/commands/sql.js +142 -0
package/dist/src/commands/status.d.ts +5 -0
package/dist/src/commands/status.js +39 -0
package/dist/src/commands/sync.d.ts +7 -0
package/dist/src/commands/sync.js +991 -0
package/dist/src/commands/usage.d.ts +6 -0
package/dist/src/commands/usage.js +78 -0
package/dist/src/commands/webhooks.d.ts +1 -0
package/dist/src/commands/webhooks.js +102 -0
package/dist/src/commands/workspace.d.ts +23 -0
package/dist/src/commands/workspace.js +590 -0
package/dist/src/connector-migration.d.ts +20 -0
package/dist/src/connector-migration.js +43 -0
package/dist/src/connector-parser.d.ts +14 -0
package/dist/src/connector-parser.js +94 -0
package/dist/src/connector-service/discover.d.ts +37 -0
package/dist/src/connector-service/discover.js +79 -0
package/dist/src/connector-service/gather.d.ts +22 -0
package/dist/src/connector-service/gather.js +89 -0
package/dist/src/connector-service/init.d.ts +14 -0
package/dist/src/connector-service/init.js +109 -0
package/dist/src/connector-service/scaffold.d.ts +17 -0
package/dist/src/connector-service/scaffold.js +194 -0
package/dist/src/connector-service/spec-storage.d.ts +8 -0
package/dist/src/connector-service/spec-storage.js +48 -0
package/dist/src/connector-service/types.d.ts +57 -0
package/dist/src/connector-service/types.js +2 -0
package/dist/src/connector-service/verify.d.ts +24 -0
package/dist/src/connector-service/verify.js +575 -0
package/dist/src/email-template.d.ts +2 -0
package/dist/src/email-template.js +1 -0
package/dist/src/manifest.d.ts +31 -0
package/dist/src/manifest.js +25 -0
package/dist/src/mug-icon.d.ts +1 -0
package/dist/src/mug-icon.js +12 -0
package/dist/src/slack-manifest.d.ts +119 -0
package/dist/src/slack-manifest.js +163 -0
package/dist/src/source-migration.d.ts +20 -0
package/dist/src/source-migration.js +43 -0
package/dist/src/surface-renderer.d.ts +5 -0
package/dist/src/surface-renderer.js +3 -0
package/dist/src/templates.d.ts +3 -0
package/dist/src/templates.js +48 -0
package/dist/src/version-check.d.ts +1 -0
package/dist/src/version-check.js +28 -0
package/dist/src/workflow-parser.d.ts +95 -0
package/dist/src/workflow-parser.js +526 -0
package/dist/worker/src/agent-types.d.ts +27 -0
package/dist/worker/src/agent-types.js +3 -0
package/dist/worker/src/source-types.d.ts +14 -0
package/dist/worker/src/source-types.js +1 -0
package/package.json +90 -0
package/src/data/model-capabilities.json +171 -0

package/dist/packages/surface-renderer/src/form-renderer.js ADDED Viewed

@@ -0,0 +1,719 @@
+export function renderPwaTags(opts) {
+    const color = opts.accentColor ?? "#71B7FB";
+    return `<link rel="manifest" href="/manifest.json?surface=${esc(opts.surfaceId)}">
+<meta name="theme-color" content="${esc(color)}">
+<meta name="apple-mobile-web-app-capable" content="yes">
+<meta name="apple-mobile-web-app-status-bar-style" content="default">
+<link rel="apple-touch-icon" href="/icon-192.png">`;
+}
+export function renderInstallBanner(opts) {
+    const color = opts.accentColor ?? "#71B7FB";
+    const id = esc(opts.surfaceId);
+    return `<div id="mug-pwa-banner" style="display:none;position:fixed;bottom:0;left:0;right:0;z-index:9999;padding:12px 16px;background:${esc(color)};color:#fff;font-family:system-ui,sans-serif;font-size:14px;align-items:center;gap:12px;box-shadow:0 -2px 8px rgba(0,0,0,.15)">
+<img src="/icon-192.png" width="40" height="40" style="border-radius:8px">
+<span style="flex:1">Add "<strong>${esc(opts.title)}</strong>" to your home screen</span>
+<button id="mug-pwa-dismiss" style="background:none;border:none;color:#fff;font-size:22px;cursor:pointer;padding:0 4px" aria-label="Dismiss">&times;</button>
+</div>
+<style>@media(min-width:769px){#mug-pwa-banner{display:none!important}}</style>
+<script>
+(function(){
+  if(navigator.serviceWorker)navigator.serviceWorker.register('/sw.js');
+  var s=window.matchMedia('(display-mode:standalone)').matches||navigator.standalone;
+  if(s)return;
+  var k='mug-pwa-dismissed-${id}';
+  if(localStorage.getItem(k))return;
+  var b=document.getElementById('mug-pwa-banner');
+  if(b)b.style.display='flex';
+  var d=document.getElementById('mug-pwa-dismiss');
+  if(d)d.onclick=function(){localStorage.setItem(k,'1');if(b)b.style.display='none';};
+})();
+</script>`;
+}
+export function renderMetaTags(opts) {
+    const desc = opts.description ?? "Powered by Mug";
+    let tags = `<meta property="og:title" content="${esc(opts.title)}">
+<meta property="og:description" content="${esc(desc)}">
+<meta property="og:image" content="${esc(opts.ogImageUrl)}">
+<meta property="og:type" content="website">
+<meta name="twitter:card" content="summary_large_image">
+<meta name="twitter:title" content="${esc(opts.title)}">
+<meta name="twitter:description" content="${esc(desc)}">
+<meta name="twitter:image" content="${esc(opts.ogImageUrl)}">
+<meta name="description" content="${esc(desc)}">`;
+    if (opts.canonicalUrl)
+        tags += `\n<meta property="og:url" content="${esc(opts.canonicalUrl)}">`;
+    if (opts.siteName)
+        tags += `\n<meta property="og:site_name" content="${esc(opts.siteName)}">`;
+    return tags;
+}
+export function renderForm(config, session, editRecord, basePath, prefillValues, breadcrumb, embed) {
+    const { title, description, submitText, pages, access, branding } = config;
+    const needsAuth = access.mode !== "public" && !session;
+    const pageCount = pages.length;
+    const base = basePath ?? `/surface/${config.workspace}/${config.surfaceId}`;
+    const logoSrc = branding?.logo ?? branding?.logoSquare;
+    const accentVar = branding?.accentColor ? `<style>:root { --accent: ${esc(branding.accentColor)}; }</style>` : "";
+    const ogImageUrl = branding?.ogImage ?? "/_og-image.png";
+    const metaTags = renderMetaTags({ title, description, ogImageUrl });
+    return `<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<link rel="icon" type="image/svg+xml" href="/favicon.svg">
+<title>${esc(title)}</title>
+${metaTags}
+<style>${CSS}</style>
+${accentVar}
+</head>
+<body>
+<div class="container">
+  ${breadcrumb ? `<a href="${esc(breadcrumb.href)}" class="back-link">&larr; ${esc(breadcrumb.label)}</a>` : ""}
+  <header>
+    ${logoSrc ? (embed ? `<img src="${esc(logoSrc)}" alt="" class="brand-logo">` : `<a href="/"><img src="${esc(logoSrc)}" alt="" class="brand-logo"></a>`) : ""}
+    <h1>${esc(title)}</h1>
+    ${description ? `<p class="desc">${esc(description)}</p>` : ""}
+    ${session ? `<div class="header-meta">
+      <div class="session">${esc(session.email ?? session.phone ?? "")}</div>
+      ${!session.isDemo ? `<form method="POST" action="/logout"><button type="submit" class="logout-btn"><i data-lucide="log-out"></i> Log out</button></form>` : ""}
+    </div>` : ""}
+  </header>
+  ${needsAuth ? renderAuthGate(config) : renderFormBody(config, pageCount, prefillValues, session?.authRow)}
+</div>
+${editRecord ? `<script>var __editRecord = ${JSON.stringify(editRecord)};</script>` : ""}
+${session?.authRow ? `<script>var __authRow = ${JSON.stringify(session.authRow)};</script>` : ""}
+${prefillValues && Object.keys(prefillValues).length > 0 ? `<script>var __prefill = ${JSON.stringify(prefillValues)};</script>` : ""}
+<script>${needsAuth ? AUTH_JS(config, base) : FORM_JS(config, pageCount, base)}</script>
+<script src="https://unpkg.com/lucide@latest/dist/umd/lucide.min.js"></script>
+<script>lucide.createIcons();</script>
+</body>
+</html>`;
+}
+export function esc(s) {
+    return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+function renderAuthGate(config) {
+    const method = config.access.method ?? "email";
+    const label = method === "email" ? "Enter your email" : "Enter your phone number";
+    const inputType = method === "email" ? "email" : "tel";
+    const placeholder = method === "email" ? "you@example.com" : "+1 555 123 4567";
+    return `
+  <div id="auth-gate">
+    <div class="auth-box">
+      <label for="auth-input">${label}</label>
+      <input type="${inputType}" id="auth-input" placeholder="${placeholder}" required autocomplete="${method}">
+      <button type="button" id="auth-submit" class="btn btn-primary">Send verification</button>
+      <div id="auth-msg" class="msg"></div>
+    </div>
+    <div id="code-box" class="auth-box" style="display:none">
+      <label for="code-input">Enter verification code</label>
+      <input type="text" id="code-input" placeholder="123456" maxlength="6" inputmode="numeric" pattern="[0-9]*">
+      <button type="button" id="code-submit" class="btn btn-primary">Verify</button>
+      <div id="code-msg" class="msg"></div>
+    </div>
+  </div>`;
+}
+function renderFormBody(config, pageCount, prefillValues, authRow) {
+    const { pages, submitText } = config;
+    let html = `<form id="mug-form" novalidate>`;
+    for (let i = 0; i < pages.length; i++) {
+        const page = pages[i];
+        const condAttr = page.showWhen ? ` data-page-show='${JSON.stringify(page.showWhen)}'` : "";
+        html += `<div class="page" data-page-id="${esc(page.id)}" data-page-idx="${i}"${condAttr} ${i > 0 ? 'style="display:none"' : ""}>`;
+        if (page.title)
+            html += `<h2>${esc(page.title)}</h2>`;
+        if (page.description)
+            html += `<p class="page-desc">${esc(page.description)}</p>`;
+        for (const field of page.fields) {
+            html += renderField(field, prefillValues, authRow);
+        }
+        html += `<div class="nav">`;
+        if (i > 0)
+            html += `<button type="button" class="btn btn-back" data-nav="back">Back</button>`;
+        if (i < pageCount - 1) {
+            html += `<button type="button" class="btn btn-primary" data-nav="next">Next</button>`;
+        }
+        else {
+            html += `<button type="submit" class="btn btn-primary">${esc(submitText ?? "Submit")}</button>`;
+        }
+        html += `</div></div>`;
+    }
+    html += `</form><div id="form-msg" class="msg"></div>`;
+    if (pageCount > 1) {
+        html += `<div class="progress"><div class="progress-bar" id="progress-bar"></div></div>`;
+    }
+    return html;
+}
+function resolveTemplates(text, authRow) {
+    if (!authRow)
+        return text;
+    return text.replace(/\{\{(\w+)\}\}/g, (_, key) => {
+        const val = authRow[key];
+        return val != null ? String(val) : `{{${key}}}`;
+    });
+}
+function resolveValidationRules(rules, authRow) {
+    if (!rules || !authRow)
+        return rules;
+    return rules.map(r => ({
+        ...r,
+        value: typeof r.value === "string" && r.value.includes("{{")
+            ? (() => { const resolved = resolveTemplates(String(r.value), authRow); const n = Number(resolved); return isNaN(n) ? resolved : n; })()
+            : r.value,
+        message: resolveTemplates(r.message, authRow),
+    }));
+}
+function renderField(field, prefillValues, authRow) {
+    if (field.type === "hidden") {
+        const val = prefillValues?.[field.name] ?? field.default ?? "";
+        return `<input type="hidden" name="${esc(field.name)}" value="${esc(String(val))}">`;
+    }
+    if (field.type === "calculated") {
+        return renderCalculated(field);
+    }
+    const condAttr = field.showWhen ? ` data-show='${JSON.stringify(field.showWhen)}'` : "";
+    const req = field.required ? " required" : "";
+    const ph = field.placeholder ? ` placeholder="${esc(field.placeholder)}"` : "";
+    const pf = prefillValues?.[field.name];
+    const effectiveVal = pf != null ? String(pf) : (field.default != null ? String(field.default) : "");
+    const def = field.default != null ? String(field.default) : "";
+    const defAttr = def ? ` data-default="${esc(def)}"` : "";
+    const valAttr = effectiveVal ? ` value="${esc(effectiveVal)}"` : "";
+    const isLocked = field.locked === true;
+    const lockAttr = isLocked ? " readonly" : "";
+    const lockClass = isLocked ? " locked" : "";
+    const resolvedRules = resolveValidationRules(field.validate, authRow);
+    const validateAttr = resolvedRules?.length ? ` data-validate='${JSON.stringify(resolvedRules).replace(/'/g, "&#39;")}'` : "";
+    const resolvedHelp = field.helpText ? resolveTemplates(field.helpText, authRow) : undefined;
+    let html = `<div class="field${lockClass}"${condAttr}${validateAttr}>`;
+    html += `<label for="f-${esc(field.name)}">${esc(field.label)}${field.required ? ' <span class="req">*</span>' : ""}</label>`;
+    if (resolvedHelp)
+        html += `<div class="help-text">${esc(resolvedHelp)}</div>`;
+    switch (field.type) {
+        case "text":
+        case "email":
+        case "phone": {
+            const t = field.type === "phone" ? "tel" : field.type;
+            const pat = field.pattern ? ` pattern="${esc(field.pattern)}"` : "";
+            html += `<input type="${t}" id="f-${esc(field.name)}" name="${esc(field.name)}"${ph}${req}${pat}${valAttr}${defAttr}${lockAttr}>`;
+            break;
+        }
+        case "number": {
+            const min = field.min != null ? ` min="${field.min}"` : "";
+            const max = field.max != null ? ` max="${field.max}"` : "";
+            const step = field.step != null ? ` step="${field.step}"` : "";
+            html += `<input type="number" id="f-${esc(field.name)}" name="${esc(field.name)}"${ph}${req}${min}${max}${step}${valAttr}${defAttr}${lockAttr} inputmode="decimal">`;
+            break;
+        }
+        case "date": {
+            const min = field.min ? ` min="${esc(String(field.min))}"` : "";
+            const max = field.max ? ` max="${esc(String(field.max))}"` : "";
+            html += `<input type="date" id="f-${esc(field.name)}" name="${esc(field.name)}"${req}${min}${max}${valAttr}${defAttr}${lockAttr}>`;
+            break;
+        }
+        case "select": {
+            const disabledAttr = isLocked ? " disabled" : "";
+            html += `<select id="f-${esc(field.name)}" name="${esc(field.name)}"${req}${defAttr}${disabledAttr}>`;
+            html += `<option value="">Select...</option>`;
+            for (const opt of field.options ?? []) {
+                const sel = effectiveVal && opt.value === effectiveVal ? " selected" : "";
+                html += `<option value="${esc(opt.value)}"${sel}>${esc(opt.label)}</option>`;
+            }
+            html += `</select>`;
+            if (isLocked && effectiveVal) {
+                html += `<input type="hidden" name="${esc(field.name)}" value="${esc(effectiveVal)}">`;
+            }
+            break;
+        }
+        case "multiselect": {
+            const selVals = effectiveVal ? effectiveVal.split(",").map(s => s.trim()) : [];
+            html += `<div class="multi" id="f-${esc(field.name)}"${defAttr}>`;
+            for (const opt of field.options ?? []) {
+                const chk = selVals.includes(opt.value) ? " checked" : "";
+                const dis = isLocked ? " disabled" : "";
+                html += `<label class="check-label"><input type="checkbox" name="${esc(field.name)}" value="${esc(opt.value)}"${chk}${dis}> ${esc(opt.label)}</label>`;
+            }
+            if (isLocked) {
+                for (const v of selVals) {
+                    html += `<input type="hidden" name="${esc(field.name)}" value="${esc(v)}">`;
+                }
+            }
+            html += `</div>`;
+            break;
+        }
+        case "textarea": {
+            const rows = field.rows ?? 3;
+            const ml = field.maxLength ? ` maxlength="${field.maxLength}"` : "";
+            html += `<textarea id="f-${esc(field.name)}" name="${esc(field.name)}" rows="${rows}"${ph}${req}${ml}${defAttr}${lockAttr}>${effectiveVal ? esc(effectiveVal) : ""}</textarea>`;
+            break;
+        }
+        case "file": {
+            const accept = field.accept ? ` accept="${esc(field.accept)}"` : "";
+            html += `<input type="file" id="f-${esc(field.name)}" name="${esc(field.name)}"${req}${accept} data-max-mb="${field.maxSizeMb ?? 10}">`;
+            html += `<div class="file-info" id="fi-${esc(field.name)}"></div>`;
+            break;
+        }
+    }
+    html += `<div class="err" id="e-${esc(field.name)}"></div></div>`;
+    return html;
+}
+function renderCalculated(field) {
+    const condAttr = field.showWhen ? ` data-show='${JSON.stringify(field.showWhen)}'` : "";
+    return `<div class="field calc"${condAttr}>
+    <label>${esc(field.label)}</label>
+    <div class="calc-value" id="f-${esc(field.name)}" data-expr="${esc(field.expression ?? "")}" data-fmt="${field.format ?? "number"}">—</div>
+  </div>`;
+}
+function AUTH_JS(config, base) {
+    const method = config.access.method ?? "email";
+    return `
+(function() {
+  var input = document.getElementById('auth-input');
+  var btn = document.getElementById('auth-submit');
+  var msg = document.getElementById('auth-msg');
+  var codeBox = document.getElementById('code-box');
+  var codeInput = document.getElementById('code-input');
+  var codeBtn = document.getElementById('code-submit');
+  var codeMsg = document.getElementById('code-msg');
+  var identifier = '';
+  btn.addEventListener('click', function() {
+    identifier = input.value.trim();
+    if (!identifier) return;
+    btn.disabled = true;
+    msg.textContent = 'Sending...';
+    fetch('${base}/auth', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ identifier: identifier }),
+      credentials: 'include'
+    }).then(function(r) { return r.json(); }).then(function(d) {
+      btn.disabled = false;
+      if (d.status === 'sent') {
+        ${method === "email"
+        ? "msg.textContent = 'Check your email for a verification link.';"
+        : "msg.textContent = 'Code sent.'; codeBox.style.display = ''; codeInput.focus();"}
+      }
+    }).catch(function() { btn.disabled = false; msg.textContent = 'Error. Try again.'; });
+  });
+  ${method === "phone" ? `
+  codeBtn.addEventListener('click', function() {
+    var code = codeInput.value.trim();
+    if (!code) return;
+    codeBtn.disabled = true;
+    codeMsg.textContent = 'Verifying...';
+    fetch('${base}/verify-code', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ identifier: identifier, code: code }),
+      credentials: 'include'
+    }).then(function(r) {
+      if (r.ok) { location.reload(); }
+      else { return r.json().then(function(d) { codeBtn.disabled = false; codeMsg.textContent = d.error || 'Invalid code.'; }); }
+    }).catch(function() { codeBtn.disabled = false; codeMsg.textContent = 'Error. Try again.'; });
+  });` : ""}
+})();`;
+}
+function FORM_JS(config, pageCount, base) {
+    const pagesJson = JSON.stringify(config.pages.map(p => ({
+        id: p.id,
+        nextPage: p.nextPage,
+        showWhen: p.showWhen,
+    })));
+    return `
+(function() {
+  var pages = ${pagesJson};
+  var currentPage = 0;
+  var form = document.getElementById('mug-form');
+  var formMsg = document.getElementById('form-msg');
+  var allPages = document.querySelectorAll('.page');
+  var progressBar = document.getElementById('progress-bar');
+  function getValues() {
+    var vals = {};
+    var inputs = form.querySelectorAll('input, select, textarea');
+    for (var i = 0; i < inputs.length; i++) {
+      var el = inputs[i];
+      if (el.type === 'checkbox') {
+        if (!vals[el.name]) vals[el.name] = [];
+        if (el.checked) vals[el.name].push(el.value);
+      } else if (el.type === 'file') {
+        continue;
+      } else {
+        vals[el.name] = el.value;
+      }
+    }
+    return vals;
+  }
+  function evalCondition(c, vals) {
+    var v = vals[c.field];
+    switch (c.op) {
+      case 'eq': return v == c.value;
+      case 'neq': return v != c.value;
+      case 'in': return Array.isArray(c.value) && c.value.indexOf(v) >= 0;
+      case 'gt': return Number(v) > Number(c.value);
+      case 'lt': return Number(v) < Number(c.value);
+      case 'filled': return v !== '' && v !== undefined && v !== null && !(Array.isArray(v) && v.length === 0);
+      case 'empty': return v === '' || v === undefined || v === null || (Array.isArray(v) && v.length === 0);
+    }
+    return true;
+  }
+  function evalConditions(conds, vals) {
+    if (!conds || conds.length === 0) return true;
+    for (var i = 0; i < conds.length; i++) {
+      if (!evalCondition(conds[i], vals)) return false;
+    }
+    return true;
+  }
+  function updateVisibility() {
+    var vals = getValues();
+    var fields = form.querySelectorAll('[data-show]');
+    for (var i = 0; i < fields.length; i++) {
+      var conds = JSON.parse(fields[i].getAttribute('data-show'));
+      var show = evalConditions(conds, vals);
+      fields[i].style.display = show ? '' : 'none';
+      var inputs = fields[i].querySelectorAll('input, select, textarea');
+      for (var j = 0; j < inputs.length; j++) {
+        if (!show) inputs[j].removeAttribute('required');
+      }
+    }
+  }
+  function updateCalculated() {
+    var vals = getValues();
+    var calcs = form.querySelectorAll('.calc-value');
+    for (var i = 0; i < calcs.length; i++) {
+      var expr = calcs[i].getAttribute('data-expr');
+      var fmt = calcs[i].getAttribute('data-fmt');
+      try {
+        var result = evalExpr(expr, vals);
+        if (isNaN(result) || result === null) { calcs[i].textContent = '\\u2014'; continue; }
+        if (fmt === 'currency') calcs[i].textContent = '$' + result.toFixed(2);
+        else if (fmt === 'percent') calcs[i].textContent = result.toFixed(1) + '%';
+        else calcs[i].textContent = String(result);
+      } catch(e) { calcs[i].textContent = '\\u2014'; }
+    }
+  }
+  function evalExpr(expr, vals) {
+    var tokens = expr.replace(/([+\\-*\\/()%])/g, ' $1 ').split(/\\s+/).filter(Boolean);
+    var out = [];
+    for (var i = 0; i < tokens.length; i++) {
+      var t = tokens[i];
+      if (/^[+\\-*\\/()%]$/.test(t)) { out.push(t); }
+      else if (/^\\d+(\\.\\d+)?$/.test(t)) { out.push(t); }
+      else { var v = parseFloat(vals[t]); if (isNaN(v)) return NaN; out.push(v); }
+    }
+    return Function('"use strict"; return (' + out.join(' ') + ')')();
+  }
+  function validateField(fieldEl, requireRequired) {
+    var input = fieldEl.querySelector('input, select, textarea');
+    if (!input) return true;
+    var errEl = fieldEl.querySelector('.err');
+    if (errEl) errEl.textContent = '';
+    if (requireRequired && input.hasAttribute('required') && !input.value.trim()) {
+      if (errEl) errEl.textContent = 'Required';
+      return false;
+    }
+    if (input.value.trim() && !input.checkValidity()) {
+      if (errEl) errEl.textContent = input.validationMessage;
+      return false;
+    }
+    var rulesJson = fieldEl.getAttribute('data-validate');
+    if (rulesJson && input.value.trim()) {
+      var rules = JSON.parse(rulesJson);
+      for (var r = 0; r < rules.length; r++) {
+        var rule = rules[r];
+        var val = input.value;
+        var fail = false;
+        if (rule.rule === 'min' && Number(val) < Number(rule.value)) fail = true;
+        if (rule.rule === 'max' && Number(val) > Number(rule.value)) fail = true;
+        if (rule.rule === 'minLength' && val.length < Number(rule.value)) fail = true;
+        if (rule.rule === 'maxLength' && val.length > Number(rule.value)) fail = true;
+        if (rule.rule === 'pattern' && !new RegExp(rule.value).test(val)) fail = true;
+        if (fail) {
+          if (errEl) errEl.textContent = rule.message;
+          return false;
+        }
+      }
+    }
+    return true;
+  }
+  function validatePage(pageIdx) {
+    var page = allPages[pageIdx];
+    var valid = true;
+    var fields = page.querySelectorAll('.field:not([style*="display: none"]):not([style*="display:none"])');
+    for (var i = 0; i < fields.length; i++) {
+      if (!validateField(fields[i], true)) valid = false;
+    }
+    return valid;
+  }
+  function resolveNextPage(pageIdx) {
+    var p = pages[pageIdx];
+    if (!p.nextPage) return pageIdx + 1;
+    if (typeof p.nextPage === 'string') {
+      for (var i = 0; i < pages.length; i++) { if (pages[i].id === p.nextPage) return i; }
+      return pageIdx + 1;
+    }
+    var vals = getValues();
+    var conds = p.nextPage.conditions || [];
+    for (var i = 0; i < conds.length; i++) {
+      if (evalConditions(conds[i].when, vals)) {
+        for (var j = 0; j < pages.length; j++) { if (pages[j].id === conds[i].goto) return j; }
+      }
+    }
+    var def = p.nextPage['default'];
+    if (def) { for (var j = 0; j < pages.length; j++) { if (pages[j].id === def) return j; } }
+    return pageIdx + 1;
+  }
+  function showPage(idx) {
+    for (var i = 0; i < allPages.length; i++) allPages[i].style.display = 'none';
+    allPages[idx].style.display = '';
+    currentPage = idx;
+    if (progressBar) progressBar.style.width = ((idx + 1) / ${pageCount} * 100) + '%';
+    window.scrollTo(0, 0);
+  }
+  form.addEventListener('keydown', function(e) {
+    if (e.key === 'Enter' && e.target.tagName !== 'TEXTAREA') {
+      var lastPage = ${pageCount} - 1;
+      if (currentPage < lastPage) {
+        e.preventDefault();
+        var nextBtn = allPages[currentPage].querySelector('[data-nav="next"]');
+        if (nextBtn) nextBtn.click();
+      }
+    }
+  });
+  form.addEventListener('input', function(e) {
+    updateVisibility(); updateCalculated();
+    var fieldEl = e.target.closest('.field');
+    if (fieldEl) validateField(fieldEl, false);
+  });
+  form.addEventListener('change', function(e) {
+    updateVisibility(); updateCalculated();
+    var fieldEl = e.target.closest('.field');
+    if (fieldEl) validateField(fieldEl, false);
+  });
+  form.addEventListener('blur', function(e) {
+    var fieldEl = e.target.closest('.field');
+    if (fieldEl) validateField(fieldEl, false);
+  }, true);
+  form.addEventListener('click', function(e) {
+    var btn = e.target.closest('[data-nav]');
+    if (!btn) return;
+    if (btn.getAttribute('data-nav') === 'next') {
+      if (!validatePage(currentPage)) return;
+      var next = resolveNextPage(currentPage);
+      if (next < ${pageCount}) showPage(next);
+    } else if (btn.getAttribute('data-nav') === 'back') {
+      if (currentPage > 0) showPage(currentPage - 1);
+    }
+  });
+  form.addEventListener('submit', function(e) {
+    e.preventDefault();
+    if (!validatePage(currentPage)) return;
+    var vals = getValues();
+    var calcs = form.querySelectorAll('.calc-value');
+    for (var i = 0; i < calcs.length; i++) {
+      var name = calcs[i].id.replace('f-', '');
+      var text = calcs[i].textContent;
+      if (text !== '\\u2014') vals[name] = text;
+    }
+    for (var fk in fileUrls) { vals[fk] = fileUrls[fk]; }
+    if (window.__editRecord) { vals._edit = true; vals._editRecord = window.__editRecord; }
+    var submitBtn = form.querySelector('[type="submit"]');
+    submitBtn.disabled = true;
+    form.style.display = 'none';
+    if (progressBar) progressBar.parentElement.style.display = 'none';
+    formMsg.className = 'msg success';
+    formMsg.textContent = 'Submitted successfully!';
+    confetti();
+    fetch('${base}/submit', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify(vals),
+      credentials: 'include'
+    }).then(function(r) { return r.json(); }).then(function(d) {
+      if (d.status !== 'ok' && d.status !== 'created') {
+        form.style.display = '';
+        if (progressBar) progressBar.parentElement.style.display = '';
+        submitBtn.disabled = false;
+        formMsg.className = 'msg';
+        formMsg.textContent = d.error || 'Submission failed.';
+      }
+    }).catch(function() {
+      form.style.display = '';
+      if (progressBar) progressBar.parentElement.style.display = '';
+      submitBtn.disabled = false;
+      formMsg.className = 'msg';
+      formMsg.textContent = 'Network error. Try again.';
+    });
+  });
+  function confetti() {
+    var colors = ['#4a9','#e44','#fa0','#48f','#f4a','#8e4'];
+    var container = document.querySelector('.container');
+    for (var i = 0; i < 80; i++) {
+      var el = document.createElement('div');
+      el.className = 'confetti-piece';
+      el.style.left = Math.random() * 100 + '%';
+      el.style.background = colors[Math.floor(Math.random() * colors.length)];
+      el.style.animationDelay = Math.random() * 0.6 + 's';
+      el.style.animationDuration = (1.2 + Math.random() * 1.2) + 's';
+      container.appendChild(el);
+    }
+    setTimeout(function() {
+      var pieces = document.querySelectorAll('.confetti-piece');
+      for (var i = 0; i < pieces.length; i++) pieces[i].remove();
+    }, 3000);
+  }
+  function setFieldValue(el, val) {
+    if (!el) return;
+    if (el.tagName === 'INPUT' || el.tagName === 'SELECT' || el.tagName === 'TEXTAREA') {
+      el.value = String(val ?? '');
+    }
+  }
+  function prefill() {
+    var record = window.__editRecord || {};
+    for (var key in record) { setFieldValue(document.getElementById('f-' + key), record[key]); }
+    var params = new URLSearchParams(window.location.search);
+    params.forEach(function(val, key) { setFieldValue(document.getElementById('f-' + key), val); });
+    var pf = window.__prefill || {};
+    for (var key in pf) { setFieldValue(document.getElementById('f-' + key), pf[key]); }
+  }
+  var fileUrls = {};
+  form.addEventListener('change', function(e) {
+    var input = e.target;
+    if (input.type !== 'file' || !input.files || !input.files[0]) return;
+    var file = input.files[0];
+    var maxMb = parseInt(input.getAttribute('data-max-mb') || '10');
+    var info = document.getElementById('fi-' + input.name);
+    if (file.size > maxMb * 1024 * 1024) {
+      if (info) info.textContent = 'File too large (max ' + maxMb + 'MB)';
+      input.value = '';
+      return;
+    }
+    if (info) info.textContent = 'Uploading...';
+    var fd = new FormData();
+    fd.append('file', file);
+    fd.append('field', input.name);
+    fetch('${base}/upload', { method: 'POST', body: fd, credentials: 'include' })
+      .then(function(r) { return r.json(); })
+      .then(function(d) {
+        if (d.url) {
+          fileUrls[input.name] = d.url;
+          if (info) info.textContent = file.name + ' uploaded';
+        } else {
+          if (info) info.textContent = 'Upload failed';
+        }
+      }).catch(function() { if (info) info.textContent = 'Upload failed'; });
+  });
+  prefill();
+  updateVisibility();
+  updateCalculated();
+  if (progressBar) progressBar.style.width = (1 / ${pageCount} * 100) + '%';
+})();`;
+}
+const CSS = `
+:root { --accent: #1a1a1a; }
+* { box-sizing: border-box; margin: 0; padding: 0; }
+body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #f5f5f5; color: #1a1a1a; line-height: 1.5; }
+.container { max-width: 560px; margin: 0 auto; padding: 24px 16px; }
+.back-link { display: inline-block; margin-bottom: 16px; color: #666; text-decoration: none; font-size: 14px; transition: color 0.15s; }
+.back-link:hover { color: var(--accent); }
+header { margin-bottom: 24px; position: relative; }
+.brand-logo { display: block; max-height: 72px; max-width: 240px; margin-bottom: 12px; }
+h1 { font-size: 24px; font-weight: 600; margin-bottom: 4px; }
+h2 { font-size: 18px; font-weight: 600; margin-bottom: 12px; }
+.desc, .page-desc { color: #666; font-size: 14px; margin-bottom: 12px; }
+.header-meta { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
+.session { font-size: 13px; color: #666; background: #f0f0f0; padding: 6px 12px; border-radius: 6px; display: inline-block; }
+.logout-btn { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: none; background: #f0f0f0; border-radius: 6px; cursor: pointer; color: #666; font-size: 13px; font-family: inherit; transition: background 0.15s, color 0.15s; }
+.logout-btn:hover { background: #e0e0e0; color: #333; }
+.logout-btn svg { width: 16px; height: 16px; }
+.field { margin-bottom: 16px; }
+label { display: block; font-size: 14px; font-weight: 500; margin-bottom: 4px; }
+.req { color: #e44; }
+input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="date"],
+select, textarea {
+  width: 100%; padding: 10px 12px; border: 1px solid #ddd; border-radius: 8px;
+  font-size: 16px; font-family: inherit; background: #fff; transition: border-color 0.15s;
+}
+input:focus, select:focus, textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent); }
+textarea { resize: vertical; }
+.multi { display: flex; flex-direction: column; gap: 6px; }
+.check-label { font-size: 14px; display: flex; align-items: center; gap: 8px; cursor: pointer; }
+.check-label input { width: 18px; height: 18px; }
+input[type="file"] { padding: 8px; }
+.file-info { font-size: 12px; color: #888; margin-top: 4px; }
+.field.locked input, .field.locked select, .field.locked textarea { background: #f5f5f5; color: #666; cursor: not-allowed; border-color: #e0e0e0; }
+.calc { background: #f9f9f9; padding: 12px; border-radius: 8px; }
+.calc-value { font-size: 20px; font-weight: 600; color: #1a1a1a; }
+.help-text { color: #888; font-size: 13px; margin-bottom: 6px; }
+.err { color: #e44; font-size: 13px; margin-top: 4px; min-height: 0; }
+.msg { font-size: 14px; color: #666; margin-top: 12px; }
+.msg.success { color: var(--accent); font-size: 18px; text-align: center; padding: 32px 0; }
+.nav { display: flex; gap: 12px; margin-top: 20px; }
+.btn { padding: 12px 24px; border: none; border-radius: 8px; font-size: 16px; font-weight: 500; cursor: pointer; transition: background 0.15s; }
+.btn-primary { background: var(--accent); color: #fff; flex: 1; }
+.btn-primary:hover { background: color-mix(in srgb, var(--accent) 80%, #000); }
+.btn-primary:disabled { background: #999; cursor: not-allowed; }
+.btn-back { background: #e8e8e8; color: #333; }
+.btn-back:hover { background: #ddd; }
+.progress { height: 3px; background: #e8e8e8; border-radius: 2px; margin-top: 24px; }
+.progress-bar { height: 100%; background: var(--accent); border-radius: 2px; transition: width 0.3s; }
+.auth-box { background: #fff; padding: 24px; border-radius: 12px; margin-bottom: 16px; }
+.auth-box label { margin-bottom: 8px; }
+.auth-box input { margin-bottom: 12px; }
+.auth-box .btn { width: 100%; }
+@media (max-width: 480px) {
+  .container { padding: 16px 12px; }
+  h1 { font-size: 20px; }
+  .btn { padding: 14px 20px; }
+}
+.confetti-piece {
+  position: fixed;
+  top: -10px;
+  width: 8px;
+  height: 12px;
+  border-radius: 2px;
+  opacity: 0.9;
+  animation: confetti-fall linear forwards;
+  pointer-events: none;
+  z-index: 1000;
+}
+@keyframes confetti-fall {
+  0% { transform: translateY(0) rotate(0deg); opacity: 1; }
+  100% { transform: translateY(100vh) rotate(720deg); opacity: 0; }
+}
+`;