clawfire 0.6.19 → 0.6.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clawfire",
-  "version": "0.6.19",
+  "version": "0.6.20",
   "description": "AI-First Firebase app framework — Speak. Build. Deploy.",
   "type": "module",
   "main": "./dist/index.cjs",

package/templates/starter/app/pages/todos/index.html

@@ -1,11 +1,34 @@
 <!-- @title: Todos — Clawfire -->
 
 <div class="max-w-xl mx-auto">
-  <div class="text-center mb-8">
+  <div class="text-center mb-6">
     <h1 class="text-3xl font-bold">
       <span class="bg-gradient-to-r from-brand-400 to-brand-600 bg-clip-text text-transparent">Todos</span>
     </h1>
-    <p class="text-zinc-500 text-sm mt-1">Your first Clawfire app — add, complete, and delete todos</p>
+    <p class="text-zinc-500 text-sm mt-1">Dual-mode store — compare In-Memory vs Firestore</p>
+  </div>
+
+  <!-- Tabs -->
+  <div class="flex border-b border-zinc-800 mb-6">
+    <button id="tab-memory" onclick="switchTab('memory')"
+      class="flex-1 py-3 text-sm font-semibold text-center border-b-2 transition-colors cursor-pointer">
+      <span class="inline-flex items-center gap-1.5">
+        <svg width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2H7a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2zM9 9h6v6H9V9z"/></svg>
+        In-Memory
+      </span>
+    </button>
+    <button id="tab-firestore" onclick="switchTab('firestore')"
+      class="flex-1 py-3 text-sm font-semibold text-center border-b-2 transition-colors cursor-pointer">
+      <span class="inline-flex items-center gap-1.5">
+        <svg width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4"/></svg>
+        Firestore DB
+      </span>
+    </button>
+  </div>
+
+  <!-- Mode Badge -->
+  <div class="flex justify-center mb-4">
+    <span id="mode-badge" class="inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-xs font-medium"></span>
   </div>
 
   <!-- Input -->
@@ -44,10 +67,28 @@
 <script>
 (function() {
   const API = '/api/todos';
-  let todos = [];
+  let currentMode = 'memory';
+  let memoryTodos = [];
+  let firestoreTodos = [];
+  let memoryLoaded = false;
+  let firestoreLoaded = false;
+  let firestoreError = null;
 
-  async function api(path, body = {}) {
-    const res = await fetch(`${API}/${path}`, {
+  function getTodos() {
+    return currentMode === 'memory' ? memoryTodos : firestoreTodos;
+  }
+  function setTodos(list) {
+    if (currentMode === 'memory') { memoryTodos = list; memoryLoaded = true; }
+    else { firestoreTodos = list; firestoreLoaded = true; }
+  }
+  function isLoaded() {
+    return currentMode === 'memory' ? memoryLoaded : firestoreLoaded;
+  }
+
+  async function api(path, body) {
+    if (!body) body = {};
+    body.mode = currentMode;
+    const res = await fetch(API + '/' + path, {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify(body),
@@ -62,29 +103,91 @@
     return json.data;
   }
 
+  function updateTabs() {
+    var memTab = document.getElementById('tab-memory');
+    var fsTab = document.getElementById('tab-firestore');
+    var badge = document.getElementById('mode-badge');
+    if (!memTab || !fsTab) return;
+
+    if (currentMode === 'memory') {
+      memTab.className = 'flex-1 py-3 text-sm font-semibold text-center border-b-2 border-brand-500 text-brand-400 transition-colors cursor-pointer';
+      fsTab.className = 'flex-1 py-3 text-sm font-semibold text-center border-b-2 border-transparent text-zinc-500 hover:text-zinc-300 transition-colors cursor-pointer';
+      badge.className = 'inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-xs font-medium bg-brand-500/10 text-brand-400 border border-brand-500/20';
+      badge.innerHTML = '<svg width="10" height="10" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M9 3v2m6-2v2M9 19v2m6-2v2M5 9H3m2 6H3m18-6h-2m2 6h-2M7 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2H7a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2zM9 9h6v6H9V9z"/></svg> In-Memory — resets on cold start';
+    } else {
+      fsTab.className = 'flex-1 py-3 text-sm font-semibold text-center border-b-2 border-amber-500 text-amber-400 transition-colors cursor-pointer';
+      memTab.className = 'flex-1 py-3 text-sm font-semibold text-center border-b-2 border-transparent text-zinc-500 hover:text-zinc-300 transition-colors cursor-pointer';
+      badge.className = 'inline-flex items-center gap-1.5 px-3 py-1 rounded-full text-xs font-medium bg-amber-500/10 text-amber-400 border border-amber-500/20';
+      badge.innerHTML = '<svg width="10" height="10" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4"/></svg> Firestore DB — persists across deploys';
+    }
+  }
+
+  window.switchTab = function(mode) {
+    if (mode === currentMode) return;
+    currentMode = mode;
+    firestoreError = null;
+    updateTabs();
+    if (isLoaded()) {
+      render();
+    } else {
+      var list = document.getElementById('todo-list');
+      if (list) list.innerHTML = '<div class="text-center py-12 text-zinc-500 text-sm">Loading todos...</div>';
+      loadTodos();
+    }
+  };
+
   async function loadTodos() {
     try {
       const data = await api('list');
-      todos = data.todos;
+      setTodos(data.todos);
+      if (currentMode === 'firestore') firestoreError = null;
       render();
     } catch (e) {
-      var list = document.getElementById('todo-list');
-      if (list) {
-        var isApiUnavailable = e.message.includes('not available') || e.message.includes('non-JSON');
-        if (isApiUnavailable) {
-          list.innerHTML = '<div class="text-center py-12">'
-            + '<svg class="mx-auto mb-3 text-zinc-600" width="48" height="48" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path d="M12 9v3.75m9-.75a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9 3.75h.008v.008H12v-.008Z"/></svg>'
-            + '<p class="text-zinc-400 text-sm font-medium mb-1">API Not Available</p>'
-            + '<p class="text-zinc-600 text-xs">Cloud Functions need to be deployed for the API to work.</p>'
-            + '<p class="text-zinc-600 text-xs mt-1">Run <code class="text-brand-400 bg-zinc-800 px-1.5 py-0.5 rounded">/clawfire-deploy</code> in Claude Code.</p>'
-            + '</div>';
-        } else {
-          showError('Failed to load todos: ' + e.message);
+      if (currentMode === 'firestore' && (e.message.includes('Firestore') || e.message.includes('not configured') || e.message.includes('not available'))) {
+        firestoreError = e.message;
+        renderFirestoreError();
+      } else {
+        var list = document.getElementById('todo-list');
+        if (list) {
+          var isApiUnavailable = e.message.includes('not available') || e.message.includes('non-JSON');
+          if (isApiUnavailable) {
+            list.innerHTML = '<div class="text-center py-12">'
+              + '<svg class="mx-auto mb-3 text-zinc-600" width="48" height="48" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path d="M12 9v3.75m9-.75a9 9 0 1 1-18 0 9 9 0 0 1 18 0Zm-9 3.75h.008v.008H12v-.008Z"/></svg>'
+              + '<p class="text-zinc-400 text-sm font-medium mb-1">API Not Available</p>'
+              + '<p class="text-zinc-600 text-xs">Cloud Functions need to be deployed for the API to work.</p>'
+              + '<p class="text-zinc-600 text-xs mt-1">Run <code class="text-brand-400 bg-zinc-800 px-1.5 py-0.5 rounded">/clawfire-deploy</code> in Claude Code.</p>'
+              + '</div>';
+          } else {
+            showError('Failed to load todos: ' + e.message);
+          }
         }
       }
     }
   }
 
+  function renderFirestoreError() {
+    var list = document.getElementById('todo-list');
+    var stats = document.getElementById('stats');
+    if (stats) stats.classList.add('hidden');
+    if (!list) return;
+    list.innerHTML = '<div class="text-center py-12">'
+      + '<div class="mx-auto mb-4 w-12 h-12 rounded-full bg-amber-500/10 flex items-center justify-center">'
+      + '<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24" class="text-amber-400"><path d="M4 7v10c0 2.21 3.582 4 8 4s8-1.79 8-4V7M4 7c0 2.21 3.582 4 8 4s8-1.79 8-4M4 7c0-2.21 3.582-4 8-4s8 1.79 8 4m0 5c0 2.21-3.582 4-8 4s-8-1.79-8-4"/></svg>'
+      + '</div>'
+      + '<p class="text-amber-400 text-sm font-medium mb-2">Firestore Not Available</p>'
+      + '<p class="text-zinc-500 text-xs max-w-xs mx-auto mb-3">Firebase config is not set or Firestore is not enabled for this project.</p>'
+      + '<div class="bg-zinc-900 border border-zinc-800 rounded-lg px-4 py-3 text-left max-w-xs mx-auto">'
+      + '<p class="text-zinc-400 text-xs font-medium mb-1">To enable Firestore:</p>'
+      + '<ol class="text-zinc-500 text-xs space-y-1 list-decimal list-inside">'
+      + '<li>Run <code class="text-brand-400 bg-zinc-800 px-1 py-0.5 rounded">/clawfire-init</code></li>'
+      + '<li>Select or create a Firebase project</li>'
+      + '<li>Deploy with <code class="text-brand-400 bg-zinc-800 px-1 py-0.5 rounded">/clawfire-deploy</code></li>'
+      + '</ol>'
+      + '</div>'
+      + '<p class="text-zinc-600 text-xs mt-3">Meanwhile, use the <button onclick="switchTab(\'memory\')" class="text-brand-400 hover:underline cursor-pointer">In-Memory</button> tab!</p>'
+      + '</div>';
+  }
+
   window.addTodo = async function() {
     const input = document.getElementById('todo-input');
     const title = input.value.trim();
@@ -92,8 +195,10 @@
     const btn = document.getElementById('add-btn');
     btn.disabled = true;
     try {
-      const data = await api('create', { title });
+      const data = await api('create', { title: title });
+      var todos = getTodos();
       todos.unshift(data.todo);
+      setTodos(todos);
       input.value = '';
       render();
     } catch (e) {
@@ -105,13 +210,15 @@
   };
 
   window.toggleTodo = async function(id) {
-    const todo = todos.find(t => t.id === id);
+    var todos = getTodos();
+    const todo = todos.find(function(t) { return t.id === id; });
     if (!todo) return;
     try {
-      const data = await api('update', { id, completed: !todo.completed });
+      const data = await api('update', { id: id, completed: !todo.completed });
       if (data.todo) {
-        const idx = todos.findIndex(t => t.id === id);
+        const idx = todos.findIndex(function(t) { return t.id === id; });
         if (idx !== -1) todos[idx] = data.todo;
+        setTodos(todos);
         render();
       }
     } catch (e) {
@@ -121,8 +228,9 @@
 
   window.deleteTodo = async function(id) {
     try {
-      await api('delete', { id });
-      todos = todos.filter(t => t.id !== id);
+      await api('delete', { id: id });
+      var todos = getTodos().filter(function(t) { return t.id !== id; });
+      setTodos(todos);
       render();
     } catch (e) {
       showError('Failed to delete todo: ' + e.message);
@@ -130,34 +238,44 @@
   };
 
   function render() {
+    var todos = getTodos();
     const list = document.getElementById('todo-list');
     const stats = document.getElementById('stats');
     if (!list) return;
 
+    if (currentMode === 'firestore' && firestoreError) {
+      renderFirestoreError();
+      return;
+    }
+
     if (todos.length === 0) {
       if (stats) stats.classList.add('hidden');
-      list.innerHTML = '<div class="text-center py-12 text-zinc-600"><svg class="mx-auto mb-3" width="48" height="48" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path d="M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2M9 5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2M9 5h6"/></svg><p class="text-sm">No todos yet. Add one above!</p></div>';
+      var modeLabel = currentMode === 'memory' ? 'in-memory' : 'Firestore';
+      list.innerHTML = '<div class="text-center py-12 text-zinc-600">'
+        + '<svg class="mx-auto mb-3" width="48" height="48" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path d="M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2M9 5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2M9 5h6"/></svg>'
+        + '<p class="text-sm">No ' + modeLabel + ' todos yet. Add one above!</p>'
+        + '</div>';
       return;
     }
 
-    const done = todos.filter(t => t.completed).length;
+    const done = todos.filter(function(t) { return t.completed; }).length;
     if (stats) {
       stats.classList.remove('hidden');
       document.getElementById('total-count').textContent = todos.length;
       document.getElementById('done-count').textContent = done;
     }
 
-    list.innerHTML = todos.map(todo => `
-      <div class="group flex items-center gap-3 px-4 py-3 bg-zinc-900 border border-zinc-800 rounded-xl hover:border-zinc-700 transition-colors ${todo.completed ? 'opacity-50' : ''}">
-        <div onclick="toggleTodo('${todo.id}')" class="w-5.5 h-5.5 border-2 ${todo.completed ? 'bg-brand-500 border-brand-500' : 'border-zinc-700 hover:border-brand-500'} rounded-md cursor-pointer flex items-center justify-center flex-shrink-0 transition-colors">
-          ${todo.completed ? '<svg width="14" height="14" fill="none" stroke="#fff" stroke-width="2.5" viewBox="0 0 24 24"><path d="M5 13l4 4L19 7"/></svg>' : ''}
-        </div>
-        <span class="flex-1 text-sm ${todo.completed ? 'line-through text-zinc-500' : ''}">${escapeHtml(todo.title)}</span>
-        <button onclick="deleteTodo('${todo.id}')" class="opacity-0 group-hover:opacity-100 p-1 rounded-md text-zinc-600 hover:text-red-400 hover:bg-red-400/10 transition-all" title="Delete">
-          <svg width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M18 6L6 18M6 6l12 12"/></svg>
-        </button>
-      </div>
-    `).join('');
+    list.innerHTML = todos.map(function(todo) {
+      return '<div class="group flex items-center gap-3 px-4 py-3 bg-zinc-900 border border-zinc-800 rounded-xl hover:border-zinc-700 transition-colors ' + (todo.completed ? 'opacity-50' : '') + '">'
+        + '<div onclick="toggleTodo(\'' + todo.id + '\')" class="w-5.5 h-5.5 border-2 ' + (todo.completed ? 'bg-brand-500 border-brand-500' : 'border-zinc-700 hover:border-brand-500') + ' rounded-md cursor-pointer flex items-center justify-center flex-shrink-0 transition-colors">'
+        + (todo.completed ? '<svg width="14" height="14" fill="none" stroke="#fff" stroke-width="2.5" viewBox="0 0 24 24"><path d="M5 13l4 4L19 7"/></svg>' : '')
+        + '</div>'
+        + '<span class="flex-1 text-sm ' + (todo.completed ? 'line-through text-zinc-500' : '') + '">' + escapeHtml(todo.title) + '</span>'
+        + '<button onclick="deleteTodo(\'' + todo.id + '\')" class="opacity-0 group-hover:opacity-100 p-1 rounded-md text-zinc-600 hover:text-red-400 hover:bg-red-400/10 transition-all" title="Delete">'
+        + '<svg width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M18 6L6 18M6 6l12 12"/></svg>'
+        + '</button>'
+        + '</div>';
+    }).join('');
   }
 
   function escapeHtml(text) {
@@ -171,20 +289,20 @@
     if (!toast) return;
     toast.textContent = msg;
     toast.classList.remove('hidden');
-    setTimeout(() => toast.classList.add('hidden'), 3000);
+    setTimeout(function() { toast.classList.add('hidden'); }, 3000);
   }
 
   function init() {
     const input = document.getElementById('todo-input');
     if (input) {
-      input.addEventListener('keydown', (e) => {
+      input.addEventListener('keydown', function(e) {
         if (e.key === 'Enter') window.addTodo();
       });
     }
+    updateTabs();
     loadTodos();
   }
 
-  // Initialize — SPA router re-executes scripts on navigation, so no need for clawfire:navigate listener
   init();
 })();
 </script>

package/templates/starter/functions/package.json

@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "clawfire": "latest",
+    "firebase": "^11.0.0",
     "firebase-admin": "^13.0.0",
     "firebase-functions": "^6.0.0"
   },

package/templates/starter/functions/routes/todos/create.ts

@@ -1,8 +1,9 @@
 import { defineAPI, z } from "clawfire";
-import { todoStore } from "../../store.js";
+import { getStore } from "../../store.js";
 
 export default defineAPI({
   input: z.object({
+    mode: z.enum(["memory", "firestore"]).optional().default("memory"),
     title: z.string().min(1).max(200),
   }),
   output: z.object({
@@ -19,7 +20,8 @@ export default defineAPI({
     tags: ["todos"],
   },
   handler: async (input) => {
-    const todo = await todoStore.create(input.title);
+    const store = getStore(input.mode);
+    const todo = await store.create(input.title);
     return { todo };
   },
 });

package/templates/starter/functions/routes/todos/delete.ts

@@ -1,8 +1,9 @@
 import { defineAPI, z } from "clawfire";
-import { todoStore } from "../../store.js";
+import { getStore } from "../../store.js";
 
 export default defineAPI({
   input: z.object({
+    mode: z.enum(["memory", "firestore"]).optional().default("memory"),
     id: z.string(),
   }),
   output: z.object({
@@ -14,7 +15,8 @@ export default defineAPI({
     tags: ["todos"],
   },
   handler: async (input) => {
-    const success = await todoStore.delete(input.id);
+    const store = getStore(input.mode);
+    const success = await store.delete(input.id);
     return { success };
   },
 });

package/templates/starter/functions/routes/todos/list.ts

@@ -1,8 +1,10 @@
 import { defineAPI, z } from "clawfire";
-import { todoStore } from "../../store.js";
+import { getStore } from "../../store.js";
 
 export default defineAPI({
-  input: z.object({}),
+  input: z.object({
+    mode: z.enum(["memory", "firestore"]).optional().default("memory"),
+  }),
   output: z.object({
     todos: z.array(
       z.object({
@@ -19,8 +21,9 @@ export default defineAPI({
     auth: "public",
     tags: ["todos"],
   },
-  handler: async () => {
-    const todos = await todoStore.list();
+  handler: async (input) => {
+    const store = getStore(input.mode);
+    const todos = await store.list();
     return { todos, count: todos.length };
   },
 });

package/templates/starter/functions/routes/todos/update.ts

@@ -1,8 +1,9 @@
 import { defineAPI, z } from "clawfire";
-import { todoStore } from "../../store.js";
+import { getStore } from "../../store.js";
 
 export default defineAPI({
   input: z.object({
+    mode: z.enum(["memory", "firestore"]).optional().default("memory"),
     id: z.string(),
     title: z.string().min(1).max(200).optional(),
     completed: z.boolean().optional(),
@@ -23,7 +24,8 @@ export default defineAPI({
     tags: ["todos"],
   },
   handler: async (input) => {
-    const todo = await todoStore.update(input.id, {
+    const store = getStore(input.mode);
+    const todo = await store.update(input.id, {
       title: input.title,
       completed: input.completed,
     });

package/templates/starter/functions/store.ts

@@ -1,9 +1,12 @@
 /**
  * Todo Store — Dual Mode (In-Memory + Firestore)
  *
- * Mode is auto-detected from process.env.CLAWFIRE_FIREBASE_CONFIG.
- * If the env var contains valid Firebase config, Firestore mode is used.
- * Otherwise, falls back to in-memory mode (no setup needed).
+ * Two explicit stores are available:
+ *   - memoryTodoStore: Pure in-memory Map, always works
+ *   - firestoreTodoStore: Client Firebase SDK via CLAWFIRE_FIREBASE_CONFIG
+ *
+ * Use getStore("memory" | "firestore") to select at runtime.
+ * Legacy todoStore is kept for backward compatibility (auto-detect).
  */
 
 export interface Todo {
@@ -13,26 +16,76 @@ export interface Todo {
   createdAt: string;
 }
 
+export interface TodoStore {
+  list(): Promise<Todo[]>;
+  create(title: string): Promise<Todo>;
+  update(
+    id: string,
+    data: Partial<Pick<Todo, "title" | "completed">>,
+  ): Promise<Todo | null>;
+  delete(id: string): Promise<boolean>;
+}
+
 // ─── In-Memory Store ──────────────────────────────────────────
-const memoryStore = new Map<string, Todo>();
+const memoryMap = new Map<string, Todo>();
 let idCounter = 0;
 
-// ─── Firestore State (lazy-initialized) ──────────────────────
-let initialized = false;
-let useFirestore = false;
-let firestoreDb: any = null;
-let firestoreMethods: any = null;
+export const memoryTodoStore: TodoStore = {
+  async list() {
+    return Array.from(memoryMap.values()).sort(
+      (a, b) =>
+        new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime(),
+    );
+  },
+
+  async create(title) {
+    const todo: Todo = {
+      id: `todo_${++idCounter}_${Date.now()}`,
+      title,
+      completed: false,
+      createdAt: new Date().toISOString(),
+    };
+    memoryMap.set(todo.id, todo);
+    return todo;
+  },
+
+  async update(id, data) {
+    const todo = memoryMap.get(id);
+    if (!todo) return null;
+    if (data.title !== undefined) todo.title = data.title;
+    if (data.completed !== undefined) todo.completed = data.completed;
+    memoryMap.set(id, todo);
+    return todo;
+  },
+
+  async delete(id) {
+    return memoryMap.delete(id);
+  },
+};
+
+// ─── Firestore Store (lazy-initialized) ──────────────────────
+let fsInitialized = false;
+let fsAvailable = false;
+let fsDb: any = null;
+let fsMethods: any = null;
+let fsError: string | null = null;
 
-async function ensureInit(): Promise<void> {
-  if (initialized) return;
-  initialized = true;
+async function ensureFirestore(): Promise<void> {
+  if (fsInitialized) return;
+  fsInitialized = true;
 
   const configJson = process.env.CLAWFIRE_FIREBASE_CONFIG;
-  if (!configJson) return;
+  if (!configJson) {
+    fsError = "Firestore not configured: CLAWFIRE_FIREBASE_CONFIG env var is not set.";
+    return;
+  }
 
   try {
     const config = JSON.parse(configJson);
-    if (!config.apiKey || config.apiKey.startsWith("YOUR_")) return;
+    if (!config.apiKey || config.apiKey.startsWith("YOUR_")) {
+      fsError = "Firestore not configured: Firebase API key is missing or placeholder.";
+      return;
+    }
 
     const firebaseApp = await import("firebase/app");
     const firebaseFirestore = await import("firebase/firestore");
@@ -42,89 +95,117 @@ async function ensureInit(): Promise<void> {
         ? firebaseApp.initializeApp(config)
         : firebaseApp.getApps()[0];
 
-    firestoreDb = firebaseFirestore.getFirestore(app);
-    firestoreMethods = firebaseFirestore;
-    useFirestore = true;
-    console.log("  [store] Firestore mode enabled");
+    fsDb = firebaseFirestore.getFirestore(app);
+    fsMethods = firebaseFirestore;
+    fsAvailable = true;
+    console.log("  [store] Firestore mode available");
   } catch (err) {
-    console.warn("  [store] Firestore init failed, using in-memory:", err);
+    fsError = `Firestore init failed: ${err instanceof Error ? err.message : String(err)}`;
+    console.warn("  [store]", fsError);
   }
 }
 
-// ─── Exported Store (async methods) ──────────────────────────
-export const todoStore = {
-  async list(): Promise<Todo[]> {
-    await ensureInit();
-    if (useFirestore) {
-      const { collection, getDocs, query, orderBy } = firestoreMethods;
-      const q = query(
-        collection(firestoreDb, "todos"),
-        orderBy("createdAt", "desc"),
-      );
-      const snap = await getDocs(q);
-      return snap.docs.map((d: any) => ({ id: d.id, ...d.data() }) as Todo);
-    }
-    return Array.from(memoryStore.values()).sort(
-      (a, b) =>
-        new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime(),
+function requireFirestore() {
+  if (!fsAvailable) {
+    throw new Error(fsError || "Firestore is not available.");
+  }
+}
+
+export const firestoreTodoStore: TodoStore = {
+  async list() {
+    await ensureFirestore();
+    requireFirestore();
+    const { collection, getDocs, query, orderBy } = fsMethods;
+    const q = query(
+      collection(fsDb, "todos"),
+      orderBy("createdAt", "desc"),
     );
+    const snap = await getDocs(q);
+    return snap.docs.map((d: any) => ({ id: d.id, ...d.data() }) as Todo);
   },
 
-  async create(title: string): Promise<Todo> {
-    await ensureInit();
+  async create(title) {
+    await ensureFirestore();
+    requireFirestore();
+    const { collection, addDoc } = fsMethods;
     const todo: Todo = {
       id: "",
       title,
       completed: false,
       createdAt: new Date().toISOString(),
     };
-    if (useFirestore) {
-      const { collection, addDoc } = firestoreMethods;
-      const ref = await addDoc(collection(firestoreDb, "todos"), {
-        title: todo.title,
-        completed: todo.completed,
-        createdAt: todo.createdAt,
-      });
-      todo.id = ref.id;
-    } else {
-      todo.id = `todo_${++idCounter}_${Date.now()}`;
-      memoryStore.set(todo.id, todo);
-    }
+    const ref = await addDoc(collection(fsDb, "todos"), {
+      title: todo.title,
+      completed: todo.completed,
+      createdAt: todo.createdAt,
+    });
+    todo.id = ref.id;
     return todo;
   },
 
-  async update(
-    id: string,
-    data: Partial<Pick<Todo, "title" | "completed">>,
-  ): Promise<Todo | null> {
-    await ensureInit();
-    if (useFirestore) {
-      const { doc, updateDoc, getDoc } = firestoreMethods;
-      const ref = doc(firestoreDb, "todos", id);
-      const updateData: Record<string, any> = {};
-      if (data.title !== undefined) updateData.title = data.title;
-      if (data.completed !== undefined) updateData.completed = data.completed;
-      await updateDoc(ref, updateData);
-      const snap = await getDoc(ref);
-      return snap.exists()
-        ? ({ id: snap.id, ...snap.data() } as Todo)
-        : null;
-    }
-    const todo = memoryStore.get(id);
-    if (!todo) return null;
-    if (data.title !== undefined) todo.title = data.title;
-    if (data.completed !== undefined) todo.completed = data.completed;
-    memoryStore.set(id, todo);
-    return todo;
+  async update(id, data) {
+    await ensureFirestore();
+    requireFirestore();
+    const { doc, updateDoc, getDoc } = fsMethods;
+    const ref = doc(fsDb, "todos", id);
+    const updateData: Record<string, any> = {};
+    if (data.title !== undefined) updateData.title = data.title;
+    if (data.completed !== undefined) updateData.completed = data.completed;
+    await updateDoc(ref, updateData);
+    const snap = await getDoc(ref);
+    return snap.exists()
+      ? ({ id: snap.id, ...snap.data() } as Todo)
+      : null;
   },
 
-  async delete(id: string): Promise<boolean> {
-    await ensureInit();
-    if (useFirestore) {
-      const { doc, deleteDoc } = firestoreMethods;
-      await deleteDoc(doc(firestoreDb, "todos", id));
-      return true;
-    }
-    return memoryStore.delete(id);
+  async delete(id) {
+    await ensureFirestore();
+    requireFirestore();
+    const { doc, deleteDoc } = fsMethods;
+    await deleteDoc(doc(fsDb, "todos", id));
+    return true;
+  },
+};
+
+// ─── Store Selector ──────────────────────────────────────────
+export function getStore(mode?: string): TodoStore {
+  return mode === "firestore" ? firestoreTodoStore : memoryTodoStore;
+}
+
+// ─── Legacy Export (auto-detect, backward compatible) ────────
+let legacyInitialized = false;
+let legacyUseFirestore = false;
+
+async function ensureLegacyInit(): Promise<void> {
+  if (legacyInitialized) return;
+  legacyInitialized = true;
+  await ensureFirestore();
+  legacyUseFirestore = fsAvailable;
+}
+
+export const todoStore: TodoStore = {
+  async list() {
+    await ensureLegacyInit();
+    return legacyUseFirestore
+      ? firestoreTodoStore.list()
+      : memoryTodoStore.list();
+  },
+  async create(title) {
+    await ensureLegacyInit();
+    return legacyUseFirestore
+      ? firestoreTodoStore.create(title)
+      : memoryTodoStore.create(title);
+  },
+  async update(id, data) {
+    await ensureLegacyInit();
+    return legacyUseFirestore
+      ? firestoreTodoStore.update(id, data)
+      : memoryTodoStore.update(id, data);
+  },
+  async delete(id) {
+    await ensureLegacyInit();
+    return legacyUseFirestore
+      ? firestoreTodoStore.delete(id)
+      : memoryTodoStore.delete(id);
   },
 };

package/templates/starter/functions/tsconfig.json

@@ -1,8 +1,8 @@
 {
   "compilerOptions": {
     "target": "ES2022",
-    "module": "CommonJS",
-    "moduleResolution": "node",
+    "module": "Node16",
+    "moduleResolution": "Node16",
     "esModuleInterop": true,
     "strict": true,
     "skipLibCheck": true,