feat(studio): inspector fields, toggles and sections on the shared primitives

.fallowrc.jsonc

@@ -1,6 +1,19 @@
 {
   "$schema": "https://raw.githubusercontent.com/fallow-rs/fallow/main/config-schema.json",
   "entry": [
+    // Vitest collects .test.mjs, but fallow's default test-entry detection only
+    // knows the .ts/.tsx spellings, so this one reads as an unreachable file.
+    "packages/studio/scripts/*.test.mjs",
+    // The KTD6 dismiss-spike fixture. scripts/menu-dismiss-spike.mjs injects it
+    // into a running Studio by importing it from the Vite dev server by URL, so
+    // no TypeScript import reaches its mount function.
+    "packages/studio/src/components/ui/menuDismissSpikeMount.tsx",
+    // The shared-primitive barrel. Studio's panels move onto Button, IconButton,
+    // Tabs and Tooltip folder by folder, so a primitive is exported here before
+    // its first consumer exists. Treating the barrel as an entry point is what
+    // the alternative (an inline suppression per export, deleted again a week
+    // later) was pretending to be.
+    "packages/studio/src/components/ui/index.ts",
     "packages/producer/src/**/*.test.ts",
     "packages/aws-lambda/src/**/*.test.ts",
     "packages/gcp-cloud-run/src/**/*.test.ts",

packages/studio/.gitignore

@@ -2,3 +2,4 @@ dist/
 node_modules/
 data/projects/
 tests/e2e/evidence/
+.design-shots/

packages/studio/package-subpaths.json

@@ -13,6 +13,12 @@
       "types": "./dist/styles/tailwind-preset.d.ts",
       "environments": ["bun", "node"]
     },
+    "./theme.css": {
+      "source": "./src/styles/theme.css",
+      "runtime": "./src/styles/theme.css",
+      "types": null,
+      "environments": ["browser", "bun", "node"]
+    },
     "./package.json": {
       "source": "./package.json",
       "runtime": "./package.json",

packages/studio/package.json

@@ -26,6 +26,7 @@
       "import": "./src/styles/tailwind-preset.ts",
       "types": "./src/styles/tailwind-preset.ts"
     },
+    "./theme.css": "./src/styles/theme.css",
     "./package.json": "./package.json"
   },
   "publishConfig": {
@@ -39,6 +40,7 @@
         "import": "./dist/styles/tailwind-preset.js",
         "types": "./dist/styles/tailwind-preset.d.ts"
       },
+      "./theme.css": "./src/styles/theme.css",
       "./package.json": "./package.json"
     },
     "main": "./dist/index.js",
@@ -49,13 +51,16 @@
     "build": "vite build && tsup",
     "typecheck": "tsc --noEmit",
     "test": "vitest run",
+    "design:shots": "node scripts/design-shots.mjs",
+    "spike:menu-dismiss": "node scripts/menu-dismiss-spike.mjs",
     "test:webmcp-edit-loop": "node tests/e2e/webmcp-edit-loop.mjs",
     "test:timeline-virtualization": "TIMELINE_ROW_VIRTUALIZATION=on TIMELINE_ELEMENT_COUNT=50000 node tests/e2e/timeline-virtualization.mjs",
     "test:watch": "vitest",
     "report:sdk-cutover": "bun src/utils/sdkCutoverPolicy.report.ts",
     "test:timeline-default": "bun run test:timeline-virtualization"
   },
   "dependencies": {
+    "@base-ui/react": "1.7.0",
     "@codemirror/autocomplete": "^6.20.1",
     "@codemirror/commands": "^6.10.3",
     "@codemirror/lang-css": "^6.3.1",
@@ -76,22 +81,22 @@
     "@phosphor-icons/react": "^2.1.10",
     "@tanstack/react-virtual": "^3.14.6",
     "bpm-detective": "^2.0.5",
+    "cn": "0.2.4",
     "dompurify": "^3.2.4",
     "gsap": "^3.13.0",
     "marked": "^14.1.4",
     "mediabunny": "^1.45.3"
   },
   "devDependencies": {
     "@hyperframes/producer": "workspace:*",
+    "@tailwindcss/vite": "^4.3.3",
     "@types/react": "19",
     "@types/react-dom": "19",
     "@vitejs/plugin-react": "^4.0.0",
-    "autoprefixer": "^10.4.0",
     "chokidar": "^4.0.3",
     "fake-indexeddb": "^6.2.5",
-    "postcss": "^8.4.0",
     "puppeteer-core": "^25.2.1",
-    "tailwindcss": "^3.4.0",
+    "tailwindcss": "^4.3.3",
     "tsup": "^8.0.0",
     "typescript": "^5.0.0",
     "vite": "^6.4.2",