Move figma-plugin into src/, flatten nested src/

.github/workflows/ci.yml

@@ -95,7 +95,7 @@ jobs:
           set -euo pipefail
 
           VERSION="${{ needs.ci.outputs.version }}"
-          PLUGIN_DIR="figma-plugin"
+          PLUGIN_DIR="src/figma-plugin"
 
           echo "Publishing Figma plugin v${VERSION} (plugin id: ${FIGMA_PLUGIN_ID})"
 

README.md

@@ -455,7 +455,7 @@ $ pnpm i
 
 1. `pnpm run build-figma`
 2. In Figma: Plugins → Development → Import plugin from manifest…
-3. Select `figma-plugin/manifest.json`
+3. Select `src/figma-plugin/manifest.json`
 
 ## Validation
 

package.json

@@ -105,7 +105,7 @@
     "local-release": "pnpm run lgtm && changeset version && changeset publish",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
-    "build-figma": "vite build --config figma-plugin/vite.config.ts && tsup --config figma-plugin/tsup.config.ts",
+    "build-figma": "vite build --config src/figma-plugin/vite.config.ts && tsup --config src/figma-plugin/tsup.config.ts",
     "chromatic": "chromatic --project-token $CHROMATIC_PROJECT_TOKEN",
     "prepare": "pnpm run pretest && husky",
     "changeset": "pnpm exec changeset"

figma-plugin/src/code.ts → src/figma-plugin/code.ts

@@ -1,6 +1,6 @@
 /// <reference types="@figma/plugin-typings" />
 
-import type { FigmaVariable } from "../../src/lib/builder";
+import type { FigmaVariable, FigmaVariableValue } from "../lib/builder";
 import { COLLECTION_NAME } from "./constants";
 
 // ─── Plugin entry point ─────────────────────────────────────────────────
@@ -37,14 +37,18 @@ async function findOrCreateCollection(name: string) {
 function ensureModes(collection: VariableCollection, ...modeNames: string[]) {
   const result: Record<string, string> = {};
   for (let i = 0; i < modeNames.length; i++) {
-    const existing = collection.modes.find((m) => m.name === modeNames[i]);
+    const name = modeNames[i];
+    if (!name) continue;
+    const existing = collection.modes.find((m) => m.name === name);
     if (existing) {
-      result[modeNames[i]] = existing.modeId;
+      result[name] = existing.modeId;
     } else if (i === 0 && collection.modes.length === 1) {
-      collection.renameMode(collection.modes[0].modeId, modeNames[i]);
-      result[modeNames[i]] = collection.modes[0].modeId;
+      const first = collection.modes[0];
+      if (!first) continue;
+      collection.renameMode(first.modeId, name);
+      result[name] = first.modeId;
     } else {
-      result[modeNames[i]] = collection.addMode(modeNames[i]);
+      result[name] = collection.addMode(name);
     }
   }
   return result;
@@ -64,6 +68,28 @@ async function findOrCreateVariable(
 
 // ─── Sync logic ─────────────────────────────────────────────────────────
 
+function setModeValue(
+  variable: Variable,
+  modeId: string,
+  value: FigmaVariableValue,
+  varMap: Record<string, Variable>,
+) {
+  if ("alias" in value) {
+    const target = varMap[value.alias];
+    if (target) {
+      variable.setValueForMode(
+        modeId,
+        figma.variables.createVariableAlias(target),
+      );
+    } else {
+      console.warn(`Alias target not found: ${value.alias}`);
+      variable.setValueForMode(modeId, { r: 0, g: 0, b: 0, a: 1 });
+    }
+  } else {
+    variable.setValueForMode(modeId, value);
+  }
+}
+
 async function syncVariables(variables: FigmaVariable[]) {
   const collection = await findOrCreateCollection(COLLECTION_NAME);
   const modes = ensureModes(collection, "Light", "Dark");
@@ -77,28 +103,14 @@ async function syncVariables(variables: FigmaVariable[]) {
   // Set values and metadata
   for (const v of variables) {
     const variable = varMap[v.path];
+    if (!variable) continue;
 
     if (v.description) variable.description = v.description;
     if (v.scopes) variable.scopes = v.scopes as VariableScope[];
 
     for (const [modeName, modeId] of Object.entries(modes)) {
       const value = v.values[modeName];
-      if (!value) continue;
-
-      if ("alias" in value) {
-        const target = varMap[value.alias];
-        if (target) {
-          variable.setValueForMode(
-            modeId,
-            figma.variables.createVariableAlias(target),
-          );
-        } else {
-          console.warn(`Alias target not found: ${value.alias}`);
-          variable.setValueForMode(modeId, { r: 0, g: 0, b: 0, a: 1 });
-        }
-      } else {
-        variable.setValueForMode(modeId, value);
-      }
+      if (value) setModeValue(variable, modeId, value, varMap);
     }
   }
 

figma-plugin/src/main.tsx → src/figma-plugin/main.tsx

@@ -1,13 +1,13 @@
 import { useEffect, useState } from "react";
 import { createRoot } from "react-dom/client";
-import { Fab } from "../../src/components/m3/Fab";
-import { FlowfieldSt } from "../../src/Flowfield.stories";
-import { FlowfieldScene } from "../../src/Flowfield.stories.helpers";
-import { Mcu } from "../../src/Mcu";
-import { useMcu } from "../../src/Mcu.context";
+import { Fab } from "../components/m3/Fab";
+import { FlowfieldSt } from "../Flowfield.stories";
+import { FlowfieldScene } from "../Flowfield.stories.helpers";
+import { Mcu } from "../Mcu";
+import { useMcu } from "../Mcu.context";
 
-import { TooltipProvider } from "../../src/components/ui/tooltip";
-import "../../src/styles/globals.css";
+import { TooltipProvider } from "../components/ui/tooltip";
+import "../styles/globals.css";
 import "./main.css";
 
 function SyncButton() {
@@ -73,4 +73,5 @@ function App() {
   );
 }
 
-createRoot(document.getElementById("root")!).render(<App />);
+const root = document.getElementById("root");
+if (root) createRoot(root).render(<App />);

figma-plugin/tsup.config.ts → src/figma-plugin/tsup.config.ts

@@ -1,11 +1,11 @@
 import { defineConfig } from "tsup";
 
 export default defineConfig({
-  entryPoints: ["figma-plugin/src/code.ts"],
+  entryPoints: ["src/figma-plugin/code.ts"],
   format: ["iife"],
   target: "es2015",
   dts: false,
-  outDir: "figma-plugin/dist",
+  outDir: "src/figma-plugin/dist",
   clean: false,
   outExtension: () => ({ js: ".js" }),
 });

figma-plugin/vite.config.ts → src/figma-plugin/vite.config.ts

@@ -7,11 +7,11 @@ import tsconfigPaths from "vite-tsconfig-paths";
 const dir = import.meta.dirname;
 
 export default defineConfig({
-  root: resolve(dir, "src"),
+  root: dir,
   plugins: [
     react(),
     viteSingleFile(),
-    tsconfigPaths({ root: resolve(dir, "..") }),
+    tsconfigPaths({ root: resolve(dir, "../..") }),
   ],
   build: {
     outDir: resolve(dir, "dist"),