Convert distillation studio to static Space

README.md

@@ -3,9 +3,7 @@ title: ADI Distillation Studio
 emoji: 🧪
 colorFrom: gray
 colorTo: green
-sdk: gradio
-sdk_version: 6.19.0
-python_version: '3.12'
-app_file: app.py
+sdk: static
+app_file: index.html
 pinned: false
 ---

app.py

@@ -1,153 +0,0 @@
-import json
-import re
-import tempfile
-from pathlib import Path
-
-import gradio as gr
-
-
-STYLE_PRESETS = {
-    "ADI concise": "Answer clearly, directly, and with practical next steps. Keep the tone calm and capable.",
-    "Technical mentor": "Explain the reasoning briefly, use precise terms, and make the user feel more capable.",
-    "Support agent": "Be reassuring, diagnose the issue, and give a short ordered fix path.",
-    "Creative partner": "Offer useful ideas with a little warmth and imagination while staying grounded.",
-    "Safety reviewer": "Identify risks, state assumptions, and recommend the safest useful action.",
-}
-
-VARIATION_TEMPLATES = [
-    "Direct task",
-    "Beginner phrasing",
-    "Production constraint",
-    "Edge case",
-    "Follow-up turn",
-]
-
-
-def clean_text(value):
-    return re.sub(r"\s+", " ", (value or "").strip())
-
-
-def split_steps(text):
-    lines = [line.strip(" -\t") for line in (text or "").splitlines()]
-    lines = [line for line in lines if line]
-    if len(lines) >= 2:
-        return lines[:6]
-    sentences = re.split(r"(?<=[.!?])\s+", clean_text(text))
-    return [sentence for sentence in sentences if sentence][:6]
-
-
-def user_variant(instruction, idx):
-    instruction = clean_text(instruction)
-    if idx == 0:
-        return instruction
-    if idx == 1:
-        return f"I'm new to this. {instruction}"
-    if idx == 2:
-        return f"{instruction} Keep the answer production-ready and avoid unnecessary detail."
-    if idx == 3:
-        return f"{instruction} Also mention one common edge case or failure mode."
-    return f"Follow up on this request and make the answer easier to act on: {instruction}"
-
-
-def assistant_variant(teacher_answer, style_text, idx):
-    answer = clean_text(teacher_answer)
-    steps = split_steps(teacher_answer)
-    if idx == 0:
-        return answer
-    if idx == 1:
-        return f"Here is the short version: {answer}"
-    if idx == 2:
-        return "\n".join(f"{i + 1}. {step}" for i, step in enumerate(steps)) or answer
-    if idx == 3:
-        return f"{answer}\n\nWatch for: missing context, stale assumptions, or inputs that do not match the expected format."
-    return f"{answer}\n\nStyle target: {style_text}"
-
-
-def make_record(system_prompt, user, assistant, source, tags):
-    return {
-        "messages": [
-            {"role": "system", "content": system_prompt},
-            {"role": "user", "content": user},
-            {"role": "assistant", "content": assistant},
-        ],
-        "metadata": {
-            "source": source,
-            "tags": [tag.strip() for tag in tags.split(",") if tag.strip()],
-        },
-    }
-
-
-def build_dataset(instruction, teacher_answer, style_preset, custom_style, tags, include_variants):
-    instruction = clean_text(instruction)
-    teacher_answer = (teacher_answer or "").strip()
-    if not instruction:
-        raise gr.Error("Add an instruction or user request first.")
-    if not teacher_answer:
-        raise gr.Error("Add a teacher answer first.")
-
-    style_text = clean_text(custom_style) or STYLE_PRESETS[style_preset]
-    system_prompt = f"You are ADI. {style_text}"
-    count = 5 if include_variants else 1
-
-    records = []
-    for idx in range(count):
-        records.append(
-            make_record(
-                system_prompt=system_prompt,
-                user=user_variant(instruction, idx),
-                assistant=assistant_variant(teacher_answer, style_text, idx),
-                source=VARIATION_TEMPLATES[idx],
-                tags=tags,
-            )
-        )
-
-    jsonl = "\n".join(json.dumps(record, ensure_ascii=False) for record in records)
-    preview = json.dumps(records[0], ensure_ascii=False, indent=2)
-    out_path = Path(tempfile.NamedTemporaryFile(suffix=".jsonl", delete=False).name)
-    out_path.write_text(jsonl + "\n", encoding="utf-8")
-    summary = f"Generated {len(records)} JSONL record(s). First record has {len(records[0]['messages'])} messages."
-    return summary, preview, jsonl, str(out_path)
-
-
-with gr.Blocks(title="ADI Distillation Studio", fill_width=True) as demo:
-    gr.Markdown("# ADI Distillation Studio")
-    with gr.Row():
-        with gr.Column(scale=1):
-            instruction = gr.Textbox(
-                label="Instruction / user request",
-                lines=5,
-                value="Explain why a recent llama.cpp build is needed for Qwen3.5 GGUF models.",
-            )
-            teacher = gr.Textbox(
-                label="Teacher answer",
-                lines=10,
-                value=(
-                    "Qwen3.5 uses hybrid SSM/Mamba-style gated-delta layers. Older llama.cpp builds may not "
-                    "recognize those tensors or metadata, so the GGUF can download correctly but still fail at "
-                    "model load. Use a recent llama.cpp or a llama-cpp-python wheel that bundles a compatible commit."
-                ),
-            )
-            style = gr.Dropdown(
-                choices=list(STYLE_PRESETS),
-                value="ADI concise",
-                label="Style preset",
-            )
-            custom_style = gr.Textbox(label="Custom style override", lines=3)
-            tags = gr.Textbox(label="Tags", value="adi,distillation,qwen3.5")
-            include_variants = gr.Checkbox(label="Generate five variants", value=True)
-            build = gr.Button("Generate JSONL", variant="primary")
-        with gr.Column(scale=1):
-            summary = gr.Textbox(label="Summary", interactive=False)
-            preview = gr.Code(label="First record preview", language="json", lines=18)
-            download = gr.File(label="Download JSONL")
-
-    jsonl = gr.Code(label="Full JSONL", language="json", lines=14)
-    build.click(
-        build_dataset,
-        inputs=[instruction, teacher, style, custom_style, tags, include_variants],
-        outputs=[summary, preview, jsonl, download],
-    )
-
-
-if __name__ == "__main__":
-    demo.launch()

index.html

@@ -0,0 +1,124 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <title>ADI Distillation Studio</title>
+  <style>
+    :root { color-scheme: dark; --bg:#080b10; --panel:#151922; --line:#303745; --text:#f5f7fb; --muted:#aab2c0; --accent:#12b981; }
+    * { box-sizing: border-box; }
+    body { margin:0; font:15px/1.45 system-ui, -apple-system, Segoe UI, sans-serif; background:var(--bg); color:var(--text); }
+    main { max-width:1180px; margin:0 auto; padding:28px 18px 40px; }
+    h1 { margin:0 0 18px; font-size:30px; }
+    label { display:block; font-weight:700; margin:0 0 8px; }
+    textarea, input, select { width:100%; border:1px solid var(--line); border-radius:8px; background:#0d1118; color:var(--text); padding:12px; font:inherit; }
+    textarea { min-height:128px; resize:vertical; }
+    .grid { display:grid; grid-template-columns:minmax(300px, 0.9fr) minmax(360px, 1.1fr); gap:18px; align-items:start; }
+    .panel { background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:16px; }
+    .row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
+    .field { margin-bottom:14px; }
+    button, a.button { display:inline-flex; justify-content:center; align-items:center; min-height:42px; border:0; border-radius:8px; padding:0 16px; background:var(--accent); color:#04110c; font-weight:800; cursor:pointer; text-decoration:none; }
+    pre { margin:0; white-space:pre-wrap; word-break:break-word; background:#0d1118; border:1px solid var(--line); border-radius:8px; padding:14px; min-height:220px; color:#d8ffe9; }
+    .muted { color:var(--muted); }
+    .actions { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
+    @media (max-width: 850px) { .grid, .row { grid-template-columns:1fr; } }
+  </style>
+</head>
+<body>
+<main>
+  <h1>ADI Distillation Studio</h1>
+  <div class="grid">
+    <section class="panel">
+      <div class="field">
+        <label for="instruction">Instruction / user request</label>
+        <textarea id="instruction">Explain why a recent llama.cpp build is needed for Qwen3.5 GGUF models.</textarea>
+      </div>
+      <div class="field">
+        <label for="teacher">Teacher answer</label>
+        <textarea id="teacher">Qwen3.5 uses hybrid SSM/Mamba-style gated-delta layers. Older llama.cpp builds may not recognize those tensors or metadata, so the GGUF can download correctly but still fail at model load. Use a recent llama.cpp or a llama-cpp-python wheel that bundles a compatible commit.</textarea>
+      </div>
+      <div class="row">
+        <div class="field">
+          <label for="style">Style preset</label>
+          <select id="style">
+            <option>ADI concise</option>
+            <option>Technical mentor</option>
+            <option>Support agent</option>
+            <option>Creative partner</option>
+            <option>Safety reviewer</option>
+          </select>
+        </div>
+        <div class="field">
+          <label for="tags">Tags</label>
+          <input id="tags" value="adi,distillation,qwen3.5" />
+        </div>
+      </div>
+      <div class="field">
+        <label for="custom">Custom style override</label>
+        <textarea id="custom" style="min-height:80px"></textarea>
+      </div>
+      <div class="actions">
+        <button id="generate">Generate JSONL</button>
+        <a id="download" class="button" download="adi-distillation.jsonl">Download JSONL</a>
+      </div>
+    </section>
+    <section class="panel">
+      <p id="summary" class="muted">Ready.</p>
+      <label>First record preview</label>
+      <pre id="preview"></pre>
+      <label style="margin-top:14px">Full JSONL</label>
+      <pre id="jsonl"></pre>
+    </section>
+  </div>
+</main>
+<script>
+const styles = {
+  "ADI concise": "Answer clearly, directly, and with practical next steps. Keep the tone calm and capable.",
+  "Technical mentor": "Explain the reasoning briefly, use precise terms, and make the user feel more capable.",
+  "Support agent": "Be reassuring, diagnose the issue, and give a short ordered fix path.",
+  "Creative partner": "Offer useful ideas with warmth and imagination while staying grounded.",
+  "Safety reviewer": "Identify risks, state assumptions, and recommend the safest useful action."
+};
+const variants = ["Direct task", "Beginner phrasing", "Production constraint", "Edge case", "Follow-up turn"];
+const clean = text => (text || "").trim().replace(/\s+/g, " ");
+function userVariant(text, idx) {
+  if (idx === 1) return "I'm new to this. " + text;
+  if (idx === 2) return text + " Keep the answer production-ready and avoid unnecessary detail.";
+  if (idx === 3) return text + " Also mention one common edge case or failure mode.";
+  if (idx === 4) return "Follow up on this request and make the answer easier to act on: " + text;
+  return text;
+}
+function assistantVariant(answer, style, idx) {
+  const sentences = answer.split(/(?<=[.!?])\s+/).filter(Boolean);
+  if (idx === 1) return "Here is the short version: " + answer;
+  if (idx === 2) return sentences.slice(0, 6).map((s, i) => `${i + 1}. ${s}`).join("\n") || answer;
+  if (idx === 3) return answer + "\n\nWatch for: missing context, stale assumptions, or inputs that do not match the expected format.";
+  if (idx === 4) return answer + "\n\nStyle target: " + style;
+  return answer;
+}
+function generate() {
+  const instruction = clean(document.querySelector("#instruction").value);
+  const teacher = clean(document.querySelector("#teacher").value);
+  const style = clean(document.querySelector("#custom").value) || styles[document.querySelector("#style").value];
+  const tags = document.querySelector("#tags").value.split(",").map(t => t.trim()).filter(Boolean);
+  if (!instruction || !teacher) return;
+  const records = variants.map((source, idx) => ({
+    messages: [
+      {role: "system", content: "You are ADI. " + style},
+      {role: "user", content: userVariant(instruction, idx)},
+      {role: "assistant", content: assistantVariant(teacher, style, idx)}
+    ],
+    metadata: {source, tags}
+  }));
+  const jsonl = records.map(r => JSON.stringify(r)).join("\n") + "\n";
+  document.querySelector("#summary").textContent = `Generated ${records.length} JSONL records.`;
+  document.querySelector("#preview").textContent = JSON.stringify(records[0], null, 2);
+  document.querySelector("#jsonl").textContent = jsonl;
+  const blob = new Blob([jsonl], {type:"application/jsonl"});
+  document.querySelector("#download").href = URL.createObjectURL(blob);
+}
+document.querySelector("#generate").addEventListener("click", generate);
+generate();
+</script>
+</body>
+</html>

requirements.txt

@@ -1 +0,0 @@
-gradio==6.19.0