Update src/App.jsx

src/App.jsx

@@ -28,12 +28,21 @@ const TABLE_ANCHORS = [
   { key: "qty", expected_text: "Qty" },
 ];
 
+// Canonical line-item column set. Keep this in sync with the backend
+// (prompts.py + generate_template_schema_skeletons.py).
 const TABLE_COLUMNS = [
   { key: "item_number", label: "Item Number" },
+  { key: "lot_number", label: "Lot Number" },
   { key: "description", label: "Description" },
   { key: "qty", label: "Qty" },
+  { key: "price", label: "Price" },
+  { key: "total", label: "Total" },
+  { key: "bundle", label: "Bundle" }, // NEW: bundle column
 ];
 
+// Schema version (matches T10 "version_schema")
+const SCHEMA_VERSION = 3;
+
 /** ---------- normalization helpers ---------- */
 
 function normBBox(b, w, h) {
@@ -156,6 +165,10 @@ export default function App() {
 
   // NEW: template id comes from URL OR manual input
   const [templateId, setTemplateId] = useState("");
+  // NEW: template metadata so the exported config matches the registry template format
+  const [templateName, setTemplateName] = useState("");
+  const [templateVersion, setTemplateVersion] = useState(1);
+  const [matchKeywordsAny, setMatchKeywordsAny] = useState("");
 
   const [pageSize, setPageSize] = useState({ w: 0, h: 0 });
   const [selectedFieldId, setSelectedFieldId] = useState(FIELDS[0].fieldId);
@@ -249,6 +262,10 @@ export default function App() {
     const tid = sp.get("template_id");
     setTemplateId((tid || "").trim());
 
+    // Optional metadata via URL
+    const tname = sp.get("template_name");
+    if (tname) setTemplateName(tname.trim());
+
     if (!id) {
       setPdfUrl(null);
       setPdfName(null);
@@ -471,12 +488,13 @@ export default function App() {
     return applyOffset(st.anchor, st.valueOffsetPx);
   }
 
-  function buildConfig() {
+  // Build ONLY the schema portion (flat) — fields + table mapping.
+  function buildSchema() {
     if (!pageSize.w || !pageSize.h) return null;
 
     return {
       form_id: pdfId ? `trainer_${pdfId}` : "trainer_form_v1",
-      version: 3,
+      version_schema: SCHEMA_VERSION,
       page: 1,
       scalar_value_region_mode: offsetMode ? "offset_from_anchor_v1" : "absolute_bbox_v1",
       fields: FIELDS.map((f) => {
@@ -564,11 +582,55 @@ export default function App() {
     };
   }
 
+  // Build the FULL template object in the registry format (matches T10_*.json).
+  function buildConfig() {
+    const schema = buildSchema();
+    if (!schema) return null;
+
+    const tid = (templateId || "").trim();
+    const kwAny = (matchKeywordsAny || "")
+      .split(",")
+      .map((s) => s.trim())
+      .filter(Boolean);
+
+    return {
+      template_id: tid || "UNSET_TEMPLATE_ID",
+      name: (templateName || "").trim() || tid || "Untitled Template",
+      status: "active",
+      version: Number(templateVersion) || 1,
+      match: {
+        keywords_all: [],
+        keywords_any: kwAny,
+      },
+      // flat schema (same level as T10)
+      ...schema,
+    };
+  }
+
   const previewConfig = useMemo(
     () => buildConfig(),
-    [pageSize.w, pageSize.h, boxes, offsetMode, rowHeightHintPx, pdfId]
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [pageSize.w, pageSize.h, boxes, offsetMode, rowHeightHintPx, pdfId, templateId, templateName, templateVersion, matchKeywordsAny]
   );
 
+  function downloadTemplateJson() {
+    const cfg = buildConfig();
+    if (!cfg) {
+      setSendStatus({ state: "err", msg: "Config not ready. Load a PDF first." });
+      return;
+    }
+    const tid = (templateId || "").trim() || "template";
+    const blob = new Blob([JSON.stringify(cfg, null, 2)], { type: "application/json" });
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = `${tid}.json`;
+    document.body.appendChild(a);
+    a.click();
+    document.body.removeChild(a);
+    URL.revokeObjectURL(url);
+  }
+
   async function saveConfig() {
     if (!pdfId) {
       setSendStatus({ state: "err", msg: "Missing pdf_id in URL." });
@@ -652,7 +714,7 @@ export default function App() {
           )}
         </div>
 
-        {/* NEW: Template ID */}
+        {/* Template ID */}
         <div style={{ marginBottom: 14 }}>
           <div style={UI.label}>Template ID (required)</div>
           <input
@@ -666,6 +728,44 @@ export default function App() {
           </div>
         </div>
 
+        {/* Template Name */}
+        <div style={{ marginBottom: 14 }}>
+          <div style={UI.label}>Template Name</div>
+          <input
+            style={UI.input}
+            value={templateName}
+            onChange={(e) => setTemplateName(e.target.value)}
+            placeholder="e.g. Zavation Sales Order Form"
+          />
+        </div>
+
+        {/* Match keywords */}
+        <div style={{ marginBottom: 14 }}>
+          <div style={UI.label}>Match keywords (comma separated)</div>
+          <input
+            style={UI.input}
+            value={matchKeywordsAny}
+            onChange={(e) => setMatchKeywordsAny(e.target.value)}
+            placeholder="e.g. zavation, sales order, purchase order"
+          />
+          <div style={{ fontSize: 12, color: UI.subtle, marginTop: 6 }}>
+            Stored as <code>match.keywords_any</code> for classification.
+          </div>
+        </div>
+
+        {/* Template version */}
+        <div style={{ marginBottom: 14 }}>
+          <div style={UI.label}>Template Version</div>
+          <input
+            style={UI.input}
+            type="number"
+            min="1"
+            step="1"
+            value={templateVersion}
+            onChange={(e) => setTemplateVersion(Number(e.target.value || 1))}
+          />
+        </div>
+
         {/* Zoom / Pan controls */}
         <div style={{ marginBottom: 14 }}>
           <div style={UI.label}>View (Zoom / Pan)</div>
@@ -830,7 +930,7 @@ export default function App() {
                     ))}
                   </select>
                   <div style={{ fontSize: 12, color: UI.subtle, marginTop: 6 }}>
-                    Columns should be drawn inside the table region.
+                    Columns should be drawn inside the table region. (Includes <b>Bundle</b>.)
                   </div>
                 </div>
               )}
@@ -881,6 +981,19 @@ export default function App() {
           {sendStatus.state === "sending" ? "Saving..." : "Save Config"}
         </button>
 
+        {/* DOWNLOAD as <template_id>.json in registry format */}
+        <button
+          onClick={downloadTemplateJson}
+          disabled={!pdfUrl}
+          style={{
+            ...UI.btnBase,
+            ...(pdfUrl ? UI.blue : { background: "rgba(255,255,255,0.10)", color: "#aaa" }),
+            marginTop: 10,
+          }}
+        >
+          Download Template JSON
+        </button>
+
         {sendStatus.state !== "idle" && (
           <div
             style={{
@@ -1088,7 +1201,7 @@ export default function App() {
       >
         <h3 style={{ margin: "0 0 10px", fontSize: 18 }}>Config Preview</h3>
         <div style={{ fontSize: 12, color: "#9aa4b2", marginBottom: 10 }}>
-          Live preview of what will be saved.
+          Live preview of what will be saved (registry template format).
         </div>
 
         <pre