@codeyam/codeyam-cli 0.1.23 → 0.1.25

package/codeyam-cli/templates/design-systems/neo-brutalist-design-system.md

@@ -0,0 +1,294 @@
+# Neo-Brutalist Design System
+
+> Hard-edged, warm, editorial UI. Offset shadows, bold borders, hot pink accent. For any web or mobile app.
+
+## Philosophy
+
+Heavy black borders and offset box shadows create a "printed" feel. Warm off-white base (never pure white or grey). Typography is heavy and confident. No gradients. No rounded corners over 18px.
+
+**Rules:**
+
+1. Cards always have `border: 2px solid` + offset box shadow
+2. Interactive elements "press" on hover/active (`translate(2px, 2px)`, shadow removed)
+3. Dark mode inverts backgrounds but keeps accent colors identical
+4. Dark cards/sidebar stay dark in both modes
+
+---
+
+## Colors
+
+### Light Mode
+
+```css
+[data-theme='light'] {
+  --bg-base: #f5f0e8; /* warm off-white page bg */
+  --bg-surface: #ffffff; /* cards, panels */
+  --bg-muted: #ede8de; /* subtle sections, table headers */
+  --bg-inverse: #0d0d0d; /* dark surfaces */
+
+  --text-primary: #0d0d0d;
+  --text-secondary: #666666;
+  --text-muted: #999999;
+  --text-inverse: #ffffff;
+
+  --border: #0d0d0d;
+  --border-light: #e5ddd0; /* internal dividers */
+
+  --shadow-sm: 2px 2px 0px #0d0d0d;
+  --shadow-md: 4px 4px 0px #0d0d0d;
+  --shadow-lg: 6px 6px 0px #0d0d0d;
+  --shadow-accent: 4px 4px 0px #ff90e8;
+}
+```
+
+### Dark Mode
+
+```css
+[data-theme='dark'] {
+  --bg-base: #111111;
+  --bg-surface: #1a1a1a;
+  --bg-muted: #222222;
+  --text-primary: #f5f0e8;
+  --text-secondary: #aaaaaa;
+  --text-muted: #666666;
+  --text-inverse: #0d0d0d;
+  --border: #f5f0e8;
+  --border-light: #2a2a2a;
+  --shadow-sm: 2px 2px 0px #f5f0e8;
+  --shadow-md: 4px 4px 0px #f5f0e8;
+  --shadow-lg: 6px 6px 0px #f5f0e8;
+  /* Accents unchanged. Dark cards/sidebar unchanged. */
+}
+```
+
+Respect `@media (prefers-color-scheme: dark)` on `:root:not([data-theme="light"])`.
+
+### Accents
+
+```css
+/* These don't change between modes */
+--pink: #ff90e8; /* primary: CTAs, active nav, highlights */
+--pink-light: #ffe4f8;
+--teal: #14b8a6; /* secondary: success states, live data */
+--teal-light: #ccfbf1;
+--teal-dark: #0f766e;
+--yellow: #facc15; /* tertiary: alerts, featured labels */
+--yellow-light: #fef9c3;
+--yellow-dark: #ca8a04;
+--orange: #fb923c; /* quaternary: warnings */
+```
+
+### Semantic
+
+```css
+--success-bg: #d1fae5;
+--success-text: #065f46;
+--danger-bg: #fee2e2;
+--danger-text: #991b1b;
+--warning-bg: #fef9c3;
+--warning-text: #854d0e;
+/* Dark mode: --success-bg: #052e16; --success-text: #86efac; etc. */
+```
+
+### Ordered Palette
+
+```css
+/* For any categorical sequence: tags, categories, avatars, etc. */
+--palette-1: #ff90e8; /* pink */
+--palette-2: #14b8a6; /* teal */
+--palette-3: #facc15; /* yellow */
+--palette-4: #fb923c; /* orange */
+--palette-5: #818cf8; /* purple */
+```
+
+---
+
+## Typography
+
+**Font stack:** `'DM Sans', sans-serif` (body), `'DM Serif Display', serif` (display/h1), `'DM Mono', monospace` (code)
+
+| Style       | Size                     | Weight              | Notes                                                 |
+| ----------- | ------------------------ | ------------------- | ----------------------------------------------------- |
+| Display     | `clamp(28px, 4vw, 48px)` | 400 (Serif Display) | `letter-spacing: -1.5px; line-height: 1.1`            |
+| H1          | `clamp(22px, 3vw, 36px)` | 900                 | `letter-spacing: -1px`                                |
+| H2          | 20px                     | 900                 | `letter-spacing: -0.5px`                              |
+| H3          | 15px                     | 700                 |                                                       |
+| Label       | 11px                     | 700                 | `uppercase; letter-spacing: 1px; color: --text-muted` |
+| Body        | 14px                     | 400                 | `line-height: 1.6`                                    |
+| Body SM     | 13px                     | 400                 | `line-height: 1.5`                                    |
+| Large Value | `clamp(22px, 3vw, 32px)` | 900                 | `letter-spacing: -1px` — for emphasized numbers       |
+
+**Common pattern — eyebrow + title:** Label above H2 in almost every section.
+
+---
+
+## Spacing & Radius
+
+Base unit: 4px. Scale: 4, 8, 12, 16, 20, 24, 28, 32, 40, 48px.
+
+| Context                | Value       |
+| ---------------------- | ----------- |
+| Card padding (compact) | `16px 18px` |
+| Card padding (default) | `22px 24px` |
+| Card padding (large)   | `28px 28px` |
+| Grid gap               | 18px        |
+
+```css
+--radius-sm: 8px;
+--radius-md: 12px;
+--radius-lg: 18px; /* cards — max radius in the system */
+--radius-pill: 999px; /* badges, avatars */
+```
+
+---
+
+## Layout
+
+### Common Patterns
+
+- **Sidebar:** 220px fixed left, `--bg-inverse`, always dark in both modes
+- **Top nav:** Sticky, 64px height, `--bg-base`, bottom border
+- **Bottom nav (mobile):** Fixed, 64px, `--pink-light` active bg. Add `env(safe-area-inset-bottom)` padding
+- **Main content:** flex-1, `--bg-base`, padding `36px 40px`
+
+### Navigation States
+
+- Logo mark: 36px accent square + bold name
+- Nav items: 14px, `10px 14px` padding, rounded 10px. Hover/active → `--pink` bg + dark text
+- Top nav active link: inverse bg pill
+
+### Mobile / Small Viewport
+
+- Single column, 16px padding
+- Cards stack vertically, buttons full-width in forms
+- Reduce shadows to `--shadow-sm`
+
+---
+
+## Components
+
+### Card
+
+```css
+.card {
+  background: var(--bg-surface);
+  border: 2px solid var(--border);
+  border-radius: var(--radius-lg);
+  padding: 22px 24px;
+  box-shadow: var(--shadow-md);
+  position: relative;
+  overflow: hidden;
+}
+```
+
+**Variants:** `default` (white), `dark` (inverse bg + accent shadow), `pink`, `teal`, `yellow`, `muted` (base bg).
+
+**Interactive states:** hover → `translateY(-3px)` + `shadow-lg`. Active → `translate(2px, 2px)` + `shadow-sm`.
+
+### Value Card
+
+Card with: decorative accent circle (top-right, 64px, 20% opacity), icon box (40px, accent bg, 2px border, rounded 10px), label (eyebrow), emphasized value (Large Value style), optional trend badge (pill, success/danger colors).
+
+### Button
+
+```css
+.btn {
+  padding: 11px 22px;
+  border-radius: var(--radius-md);
+  font-weight: 700;
+  font-size: 14px;
+  border: 2px solid var(--border);
+}
+.btn:hover {
+  transform: translate(-1px, -1px);
+}
+.btn:active {
+  transform: translate(2px, 2px);
+  box-shadow: none;
+}
+```
+
+| Variant   | Background     | Text             | Border/Shadow             |
+| --------- | -------------- | ---------------- | ------------------------- |
+| Primary   | `--pink`       | `--text-primary` | `--shadow-md`             |
+| Secondary | `--bg-surface` | `--text-primary` | `--shadow-sm`             |
+| Teal      | `--teal`       | `--text-primary` | `--shadow-md`             |
+| Yellow    | `--yellow`     | `--text-primary` | `--shadow-md`             |
+| Dark      | `--bg-inverse` | `--text-inverse` | `--shadow-accent`         |
+| Ghost     | transparent    | `--text-primary` | none; hover: `--bg-muted` |
+
+| Size         | Padding     | Font Size |
+| ------------ | ----------- | --------- |
+| SM           | `7px 14px`  | 12px      |
+| MD (default) | `11px 22px` | 14px      |
+| LG           | `15px 30px` | 16px      |
+
+Icon-only: 40x40, no padding, `--radius-sm`.
+
+### Badge / Pill
+
+`padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; border: 1.5px solid currentColor`. Semantic variants: success, danger, warning, pink, teal, yellow, neutral. Solid variant: inverse bg+text.
+
+### Input
+
+`padding: 11px 16px; border: 2px solid var(--border); border-radius: var(--radius-md); font-size: 14px`. Focus: `box-shadow: 0 0 0 3px var(--pink)`. Input-group: input + button joined with zero'd inner radii.
+
+### Table
+
+Container: card shell (border, radius-lg, shadow-md, overflow hidden). Header: `--bg-muted`, 11px uppercase labels. Rows: `16px 28px` padding, `--border-light` divider, hover → muted bg.
+
+### Progress Bar
+
+Track: 12px height, `--bg-muted`, pill radius, 2px border. Fill: pill radius, accent color. Animate: `width 0.8s cubic-bezier(0.34, 1.56, 0.64, 1)`.
+
+### Avatar
+
+Square-ish (`--radius-sm`), 2px border. Sizes: 28/36/48px. Cycle through ordered palette colors.
+
+### Tag / Chip
+
+`padding: 5px 12px; border-radius: 999px; border: 2px solid var(--border); font-size: 13px; font-weight: 600`. Hover → pink bg. Active → inverse bg+text.
+
+### Tooltip
+
+`background: --bg-inverse; border: 2px solid --pink; border-radius: --radius-md; padding: 10px 16px; color: --text-inverse; font-size: 13px`. Bold label + bold value.
+
+---
+
+## Motion
+
+```css
+--transition-fast: 120ms ease; /* button press */
+--transition-base: 180ms ease; /* card hover, general */
+```
+
+Bouncy and tactile — elements lift and press. Staggered fade-up on page load:
+
+```css
+@keyframes fadeUp {
+  from {
+    opacity: 0;
+    transform: translateY(12px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+/* animation: fadeUp 0.4s ease forwards; delay: n * 0.05s */
+```
+
+---
+
+## Checklist
+
+- [ ] Background is `#F5F0E8` (light) or `#111111` (dark) — never pure white or grey
+- [ ] Every card has 2px border + offset box shadow
+- [ ] Interactive elements press-shift on :active
+- [ ] DM Sans (body) + DM Serif Display (headlines) + DM Mono (code)
+- [ ] At least one pink element visible on every screen
+- [ ] Labels: 11px uppercase, letter-spacing 1px
+- [ ] Badges are pill-shaped with border
+- [ ] Dark sidebar/cards unchanged in dark mode
+- [ ] No gradients anywhere
+- [ ] Spacing follows 4px grid

package/codeyam-cli/templates/expo-react-native/MOBILE_SETUP.md

@@ -78,6 +78,121 @@ Use Tailwind classes on React Native components:
 </View>
 ```
 
+## CodeYam Scenario Data
+
+### AsyncStorage Seeding
+
+AsyncStorage uses `localStorage` on web, so CodeYam's existing localStorage injection works automatically. Use the `localStorage` field in scenario JSON to pre-populate storage:
+
+```json
+{
+  "name": "With Saved Items",
+  "url": "/",
+  "dimensions": ["iPhone 16"],
+  "localStorage": {
+    "items": "[{\"id\":\"1\",\"title\":\"Buy groceries\",\"done\":false},{\"id\":\"2\",\"title\":\"Walk the dog\",\"done\":true}]"
+  }
+}
+```
+
+Values must be JSON strings (matching how AsyncStorage stores them). Your `storage.get()` calls will read this data normally.
+
+### API Mocking
+
+For apps that fetch from APIs, use relative URLs so CodeYam's proxy can intercept and mock them:
+
+```tsx
+// Use relative URLs — these go through the CodeYam proxy
+const response = await fetch('/api/items');
+```
+
+Then provide mock routes in your scenario data:
+
+```json
+{
+  "name": "With API Data",
+  "url": "/",
+  "dimensions": ["iPhone 16"],
+  "routes": {
+    "/api/items": {
+      "body": [{ "id": 1, "title": "First item" }],
+      "status": 200
+    }
+  }
+}
+```
+
+### Device Presets
+
+Mobile projects default to these screen sizes:
+
+| Preset            | Width | Height |
+| ----------------- | ----- | ------ |
+| iPhone 16         | 393   | 852    |
+| iPhone 16 Pro Max | 430   | 932    |
+| iPhone SE         | 375   | 667    |
+| Pixel 8           | 412   | 915    |
+| iPad mini         | 744   | 1133   |
+
+## Design Tokens (lib/theme.ts)
+
+All design tokens live in `lib/theme.ts` — this is the **single source of truth** for colors, spacing, typography, and border radius. Import and use in every component:
+
+```tsx
+import { theme } from '@/lib/theme';
+
+<View
+  style={{ backgroundColor: theme.colors.bgBase, padding: theme.spacing.lg }}
+>
+  <Text
+    style={{ fontSize: theme.fontSize.lg, color: theme.colors.textPrimary }}
+  >
+    Hello
+  </Text>
+</View>;
+```
+
+**Do NOT:**
+
+- Use CSS custom properties (`var(--token)`) — they don't work in React Native
+- Hardcode color strings or pixel values in components
+- Create a separate `globals.css` token system — `lib/theme.ts` is the only source
+
+When a design system is selected, populate `lib/theme.ts` with its tokens.
+
+## Testing
+
+Tests use Jest with the `jest-expo` preset. Run with:
+
+```bash
+npx jest                          # Run all tests
+npx jest app/hooks/useCounter.ts  # Run specific test file
+```
+
+The Jest config is in `package.json`. The `transformIgnorePatterns` is pre-configured to handle Expo and React Native module transforms — you should not need to modify it.
+
+## Web vs Native Differences
+
+The CodeYam editor previews your app via **Expo Web** (react-native-web in a browser). Some differences from native iOS/Android devices are expected:
+
+| Aspect           | Web Preview                                            | Native Device                                           |
+| ---------------- | ------------------------------------------------------ | ------------------------------------------------------- |
+| **Fonts**        | System fonts, may differ in weight/metrics/line-height | Loaded custom fonts (if added via expo-font)            |
+| **SafeAreaView** | No effect (no notch in browser)                        | Applies real safe area insets for notch, home indicator |
+| **Platform.OS**  | Returns `'web'`                                        | Returns `'ios'` or `'android'`                          |
+| **Shadows**      | Uses CSS `box-shadow` (works well)                     | Uses RN shadow props (iOS) or `elevation` (Android)     |
+| **Gestures**     | Mouse drag events                                      | Touch/swipe with inertia                                |
+| **StatusBar**    | No visible effect                                      | Controls device status bar appearance                   |
+| **Haptics**      | No-op                                                  | Real haptic feedback via `expo-haptics`                 |
+
+**The web preview is for layout and data verification.** Test final visual polish on a real device or simulator:
+
+```bash
+npm run ios       # iOS Simulator
+npm run android   # Android Emulator
+npm start         # Pick platform from Expo menu
+```
+
 ## Building for Production
 
 ```bash

package/codeyam-cli/templates/expo-react-native/app/_layout.tsx

@@ -1,12 +1,13 @@
 import '../global.css';
 import { Stack } from 'expo-router';
 import { StatusBar } from 'expo-status-bar';
+import { SafeAreaProvider } from 'react-native-safe-area-context';
 
 export default function RootLayout() {
   return (
-    <>
+    <SafeAreaProvider>
       <Stack screenOptions={{ headerShown: false }} />
       <StatusBar style="auto" />
-    </>
+    </SafeAreaProvider>
   );
 }

package/codeyam-cli/templates/expo-react-native/global.css

@@ -1,3 +1,10 @@
+/* NativeWind / Tailwind utility layer.
+ *
+ * Design tokens are defined in lib/theme.ts — that is the single source
+ * of truth for colors, spacing, typography, and border radius.
+ * Do NOT define CSS custom properties here for design tokens.
+ * React Native components cannot read CSS variables.
+ */
 @tailwind base;
 @tailwind components;
 @tailwind utilities;

package/codeyam-cli/templates/expo-react-native/lib/theme.ts

@@ -0,0 +1,73 @@
+/**
+ * Design tokens — single source of truth for all styling.
+ *
+ * When a design system is selected (via .codeyam/design-system.md),
+ * populate these values from the design system's color palette,
+ * typography scale, and spacing rhythm.
+ *
+ * Import in every component:
+ *   import { theme } from '@/lib/theme';
+ *   <View style={{ backgroundColor: theme.colors.bgBase }}>
+ *
+ * Do NOT use CSS custom properties (var(--token)) in React Native.
+ * Do NOT hardcode color strings or pixel values in components.
+ */
+
+export const theme = {
+  colors: {
+    bgBase: '#f8fafc',
+    bgSurface: '#ffffff',
+    bgSurfaceRaised: '#ffffff',
+    bgInverse: '#1e293b',
+
+    textPrimary: '#0f172a',
+    textSecondary: '#475569',
+    textMuted: '#94a3b8',
+
+    border: '#e2e8f0',
+
+    accent: '#005C75',
+    accentLight: '#e0f2fe',
+  },
+
+  spacing: {
+    xs: 4,
+    sm: 8,
+    md: 12,
+    lg: 16,
+    xl: 24,
+    '2xl': 32,
+    '3xl': 48,
+  },
+
+  fontSize: {
+    xs: 12,
+    sm: 14,
+    base: 16,
+    lg: 18,
+    xl: 20,
+    '2xl': 24,
+    '3xl': 30,
+    '4xl': 36,
+  },
+
+  fontWeight: {
+    normal: '400' as const,
+    medium: '500' as const,
+    semibold: '600' as const,
+    bold: '700' as const,
+  },
+
+  fontFamily: {
+    sans: 'System',
+    mono: 'monospace',
+  },
+
+  borderRadius: {
+    sm: 4,
+    md: 8,
+    lg: 12,
+    xl: 16,
+    full: 9999,
+  },
+};

package/codeyam-cli/templates/expo-react-native/package.json

@@ -9,7 +9,8 @@
     "start": "expo start",
     "android": "expo start --android",
     "ios": "expo start --ios",
-    "build:web": "expo export --platform web"
+    "build:web": "expo export --platform web",
+    "test": "jest"
   },
   "dependencies": {
     "expo": "~55.0.5",
@@ -17,8 +18,9 @@
     "expo-status-bar": "~55.0.4",
     "expo-linking": "~55.0.7",
     "expo-constants": "~55.0.7",
-    "react": "19.2.0",
-    "react-dom": "19.2.0",
+    "expo-font": "~55.0.4",
+    "react": "19.2.4",
+    "react-dom": "19.2.4",
     "react-native": "0.83.2",
     "react-native-web": "^0.21.0",
     "react-native-safe-area-context": "~5.6.2",
@@ -27,12 +29,20 @@
     "@expo/vector-icons": "^15.0.2",
     "@react-native-async-storage/async-storage": "2.2.0",
     "nativewind": "^4.2.2",
-    "tailwindcss": "^3.4.19",
-    "react-native-reanimated": "4.2.1"
+    "tailwindcss": "^3.4.19"
   },
   "devDependencies": {
     "@types/react": "~19.2.2",
     "babel-preset-expo": "^55.0.10",
-    "typescript": "~5.9.2"
+    "typescript": "~5.9.2",
+    "jest": "^29.7.0",
+    "jest-expo": "~55.0.5",
+    "@testing-library/react-native": "^13.2.0"
+  },
+  "jest": {
+    "preset": "jest-expo",
+    "transformIgnorePatterns": [
+      "node_modules/(?!((jest-)?react-native|@react-native(-community)?)|expo(nent)?|@expo(nent)?/.*|@expo-google-fonts/.*|react-navigation|@react-navigation/.*|nativewind)"
+    ]
   }
 }

package/codeyam-cli/templates/isolation-route/expo-router.tsx.template

@@ -0,0 +1,54 @@
+/**
+ * CodeYam Isolation Route — Expo Router
+ *
+ * Place this file at: app/isolated-components/ComponentName.tsx
+ * URL: /isolated-components/ComponentName?s=ScenarioName
+ *
+ * This route renders a single component with scenario-specific props,
+ * enabling isolated component preview and screenshot capture.
+ */
+
+import { useLocalSearchParams } from 'expo-router';
+import { View, Text } from 'react-native';
+import { theme } from '@/lib/theme';
+// import YourComponent from '@/app/components/YourComponent';
+
+// Define scenarios: map scenario names to component props
+const scenarios: Record<string, Record<string, unknown>> = {
+  Default: {
+    // props for the default scenario
+  },
+  // Add more scenarios here
+};
+
+export default function ComponentIsolation() {
+  const { s } = useLocalSearchParams<{ s: string }>();
+  const scenarioName = s || 'Default';
+  const props = scenarios[scenarioName];
+
+  if (!props) {
+    return (
+      <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
+        <Text style={{ fontFamily: theme.fontFamily.mono, color: '#e74c3c' }}>
+          Unknown scenario: {scenarioName}
+        </Text>
+      </View>
+    );
+  }
+
+  return (
+    <View
+      style={{
+        flex: 1,
+        justifyContent: 'center',
+        alignItems: 'center',
+        backgroundColor: theme.colors.bgBase,
+      }}
+    >
+      <View nativeID="codeyam-capture" style={{ maxWidth: 384 }}>
+        {/* <YourComponent {...props} /> */}
+        <Text>Replace with your component</Text>
+      </View>
+    </View>
+  );
+}

package/codeyam-cli/templates/nextjs-prisma-sqlite/seed-adapter.ts

@@ -37,7 +37,12 @@ async function main() {
   const data = JSON.parse(raw);
   const seed = data.seed || data;
 
-  const tableNames = Object.keys(seed);
+  // Discover ALL models from the Prisma schema — not just the tables in the seed data.
+  // This ensures FK-dependent tables (e.g., Passenger → Flight) are cleared even when
+  // the seed only contains the parent table's data.
+  const allModels = Prisma.dmmf.datamodel.models.map(
+    (m) => m.name.charAt(0).toLowerCase() + m.name.slice(1),
+  );
 
   // Run everything in a single transaction for atomicity and speed.
   // SQLite auto-commits each statement by default — wrapping in a transaction
@@ -48,8 +53,8 @@ async function main() {
     // clearing parent and child tables.
     await tx.$executeRawUnsafe('PRAGMA foreign_keys = OFF');
 
-    // Wipe all tables
-    for (const table of [...tableNames].reverse()) {
+    // Wipe ALL tables in the schema (not just seeded ones)
+    for (const table of [...allModels].reverse()) {
       try {
         await (tx as any)[table].deleteMany();
       } catch {
@@ -57,10 +62,10 @@ async function main() {
       }
     }
 
-    // Batch-reset auto-increment counters in a single statement.
+    // Batch-reset auto-increment counters for ALL tables.
     // Without this, SQLite IDs keep climbing across scenario switches,
     // causing hardcoded URLs like /drinks/1 to 404.
-    const seqNames = tableNames
+    const seqNames = allModels
       .flatMap((t) => [`'${t}'`, `'${t.charAt(0).toUpperCase() + t.slice(1)}'`])
       .join(', ');
     try {

package/codeyam-cli/templates/seed-adapters/supabase.ts

@@ -28,6 +28,7 @@
  */
 
 import { createClient } from '@supabase/supabase-js';
+import { Prisma } from '@prisma/client';
 import * as fs from 'fs';
 import * as path from 'path';
 
@@ -109,13 +110,21 @@ function getProjectRef(): string {
 }
 
 async function seedTables(seed: Record<string, unknown[]>) {
-  const tableNames = Object.keys(seed);
-  if (tableNames.length === 0) return;
+  if (Object.keys(seed).length === 0) return;
 
-  console.log(`Seeding tables: ${tableNames.join(', ')}`);
+  // Discover ALL models from the Prisma schema — not just the tables in the seed data.
+  // This ensures FK-dependent tables are cleared even when the seed only contains
+  // the parent table's data. Every editor project has Prisma installed.
+  const allModels = Prisma.dmmf.datamodel.models.map(
+    (m) => m.name.charAt(0).toLowerCase() + m.name.slice(1),
+  );
+
+  console.log(
+    `Clearing ${allModels.length} tables, seeding: ${Object.keys(seed).join(', ')}`,
+  );
 
-  // Wipe tables in reverse order (to respect foreign keys)
-  for (const table of [...tableNames].reverse()) {
+  // Clear ALL tables in reverse order (children before parents for FK safety)
+  for (const table of [...allModels].reverse()) {
     const { error } = await supabase.from(table).delete().gte('id', 0);
     if (error) {
       const { error: error2 } = await supabase