Update quickstart notebook with dynamic form field

vibe_coder_quickstart.ipynb

@@ -4,14 +4,14 @@
    "cell_type": "markdown",
    "metadata": {},
    "source": [
-    "# 🚀 VIBE CODER v2.0 MAX — Official Google Colab Quickstart\n",
+    "# 🚀 VIBE CODER v2.0 MAX — Official Google Colab Studio\n",
     "\n",
-    "[![Open In Colab](https://colab.research.google.com/assets/colab-badge.svg)](https://colab.research.google.com/github/shawaz03/vibe-coder/blob/main/vibe_coder_quickstart.ipynb)\n",
+    "[![Open In Colab](https://colab.research.google.com/assets/colab-badge.svg)](https://colab.research.google.com/github/shawaz03/LLM/blob/main/vibe_coder_quickstart.ipynb)\n",
     "\n",
-    "This notebook demonstrates how to run **Vibe Coder v2.0 MAX (7B)** on a **Free Google Colab T4 GPU** using **4-bit NF4 Quantization** (uses only ~5.2 GB VRAM with zero memory warnings).\n",
+    "Run **Vibe Coder v2.0 MAX (7B)** on a **Free Google Colab T4 GPU** in 4-bit NF4 Quantization (5.2 GB VRAM, 0 memory errors).\n",
     "\n",
-    "- **Model**: [`shawaz03/vibe-coder-7b-max`](https://huggingface.co/shawaz03/vibe-coder-7b-max)\n",
-    "- **Specialization**: Full-Stack React, Next.js 15, TypeScript, Tailwind CSS, Prisma, Zustand, and Anti-AI Aesthetic Directives."
+    "- **Hugging Face Model**: [`shawaz03/vibe-coder-7b-max`](https://huggingface.co/shawaz03/vibe-coder-7b-max)\n",
+    "- **Specialization**: Autonomous Full-Stack React 19, Next.js 15, TypeScript, Tailwind CSS, Prisma, and Anti-AI Aesthetic Directives."
    ]
   },
   {
@@ -27,7 +27,6 @@
    "metadata": {},
    "outputs": [],
    "source": [
-    "# Install required libraries\n",
     "!pip install -q transformers torch accelerate bitsandbytes huggingface_hub"
    ]
   },
@@ -48,10 +47,8 @@
     "from transformers import AutoModelForCausalLM, AutoTokenizer, BitsAndBytesConfig, TextStreamer\n",
     "\n",
     "MODEL_ID = \"shawaz03/vibe-coder-7b-max\"\n",
+    "print(f\"🚀 Loading {MODEL_ID} in 4-bit NF4...\")\n",
     "\n",
-    "print(f\"🚀 Loading {MODEL_ID} in 4-bit NF4 for Google Colab...\")\n",
-    "\n",
-    "# 4-bit configuration (Fits smoothly in 5.2 GB VRAM on Colab T4)\n",
     "bnb_config = BitsAndBytesConfig(\n",
     "    load_in_4bit=True,\n",
     "    bnb_4bit_quant_type=\"nf4\",\n",
@@ -69,14 +66,14 @@
     "model.eval()\n",
     "streamer = TextStreamer(tokenizer, skip_prompt=True, skip_special_tokens=True)\n",
     "\n",
-    "print(\"\\n✅ VIBE CODER IS READY TO GENERATE CODE!\")"
+    "print(\"\\n✅ VIBE CODER IS READY!\")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
-    "### 3. Interactive Code Generator"
+    "### 3. Vibe Coder Engine Definition"
    ]
   },
   {
@@ -85,14 +82,19 @@
    "metadata": {},
    "outputs": [],
    "source": [
-    "# Vibe Coder System Prompt\n",
     "VIBE_CODER_SYSTEM_PROMPT = \"\"\"You are Vibe Coder, a world-class principal full-stack software engineer and UI/UX designer.\n",
-    "ENGINEERING DIRECTIVES:\n",
-    "1. ZERO PLACEHOLDERS: Never output '// TODO' or incomplete stubs. Every component, hook, and route must be fully written.\n",
-    "2. MODERN DESIGN SYSTEM: Use Tailwind CSS with dark neutral palettes (bg-neutral-900, border-neutral-800), clean accents (cyan, emerald, violet), and Lucide icons.\n",
-    "3. TYPE SAFETY: Include full TypeScript interfaces and prop types.\"\"\"\n",
+    "ENGINEERING & CODING DIRECTIVES:\n",
+    "1. COMPLETE IMPLEMENTATIONS: Never output '// TODO', '/* implement later */', or incomplete stubs. Every component, hook, and route must be fully written.\n",
+    "2. NO ARTIFACT STRINGS: Never output template tags, variant numbers (e.g. 'Build Variant #...'), or internal directive texts.\n",
+    "3. FULL STATE & INTERACTION: Include real mock data arrays, working toggle logic, and complete TypeScript types.\n",
+    "4. MODERN DESIGN SYSTEM: Use Tailwind CSS with dark neutral palettes (bg-neutral-900, border-neutral-800), clean accents (cyan, emerald, violet), and Lucide React icons.\n",
+    "5. CLEAN OUTPUT: Output standard, clean TypeScript/React code with 'use client' when state is used.\"\"\"\n",
     "\n",
     "def ask_vibe_coder(prompt_text, temperature=0.2, max_tokens=1500):\n",
+    "    if not prompt_text.strip():\n",
+    "        print(\"⚠️ Please enter a prompt in the box below.\")\n",
+    "        return\n",
+    "\n",
     "    messages = [\n",
     "        {\"role\": \"system\", \"content\": VIBE_CODER_SYSTEM_PROMPT},\n",
     "        {\"role\": \"user\", \"content\": prompt_text}\n",
@@ -102,7 +104,7 @@
     "    inputs = tokenizer(formatted_prompt, return_tensors=\"pt\").to(\"cuda\")\n",
     "    \n",
     "    print(\"=\" * 75)\n",
-    "    print(f\"🚀 PROMPT: {prompt_text}\")\n",
+    "    print(f\"💬 USER PROMPT: {prompt_text}\")\n",
     "    print(\"=\" * 75 + \"\\n\")\n",
     "    \n",
     "    with torch.no_grad():\n",
@@ -124,17 +126,34 @@
    "cell_type": "markdown",
    "metadata": {},
    "source": [
-    "### 4. Run Example Prompts"
+    "### 4. 🎮 Dynamic Prompt Studio (Interactive Form Box)\n",
+    "Type your custom prompt into the box below and click the **Play (Run)** button:"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
-   "metadata": {},
+   "metadata": {
+    "cellView": "form"
+   },
    "outputs": [],
    "source": [
-    "# Example 1: Full-Stack Component\n",
-    "ask_vibe_coder(\"Build an interactive pricing card in React with Tailwind CSS, monthly/annual toggle, and checkmark feature list.\")"
+    "# @title 🚀 Vibe Coder Interactive Code Generator { vertical-output: true }\n",
+    "# @markdown Enter your custom prompt and configure generation settings:\n",
+    "\n",
+    "prompt = \"Build an interactive pricing matrix in React with Tailwind CSS, supporting monthly/annual billing toggle, 5 feature bullet checkmarks, and popular badge with zero placeholders.\"  # @param {type:\"string\"}\n",
+    "temperature = 0.2  # @param {type:\"slider\", min:0.05, max:1.0, step:0.05}\n",
+    "max_tokens = 1500  # @param {type:\"slider\", min:256, max:3072, step:128}\n",
+    "\n",
+    "ask_vibe_coder(prompt, temperature=temperature, max_tokens=max_tokens)"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "### 5. 💬 Continuous Live Chat Loop\n",
+    "Run this cell to chat and prompt continuously in real-time:"
    ]
   },
   {
@@ -143,8 +162,12 @@
    "metadata": {},
    "outputs": [],
    "source": [
-    "# Example 2: Next.js Server Action\n",
-    "ask_vibe_coder(\"Write a Next.js Server Action with Zod validation to update user settings with error handling.\")"
+    "while True:\n",
+    "    user_query = input(\"\\n👉 Type any prompt (or 'exit' to quit): \")\n",
+    "    if not user_query.strip() or user_query.lower() in [\"exit\", \"quit\"]:\n",
+    "        print(\"Session stopped.\")\n",
+    "        break\n",
+    "    ask_vibe_coder(user_query, temperature=0.2)"
    ]
   }
  ],