@motion-proto/live-tokens 0.65.1 → 0.67.0

package/dist-plugin/index.js

@@ -13,7 +13,7 @@ import {
   nextAvailableName,
   normalizeTheme,
   versionedFileResourceServer
-} from "./chunk-NDJJORKJ.js";
+} from "./chunk-T4PMCFJN.js";
 import {
   CURRENT_COMPONENT_SCHEMA_VERSION
 } from "./chunk-NE6N66EE.js";
@@ -243,12 +243,14 @@ function themeFileApi(opts) {
   const packageColorsAndTypeDir = path.join(packageDataDir, "colors-and-type");
   const packageThemesDir = path.join(packageDataDir, "themes");
   const packageComponentConfigsDir = path.join(packageDataDir, "component-configs");
-  function shippedColorsAndTypeNames(dataDir) {
+  const packageSketchStylesDir = path.join(packageDataDir, "sketch-styles");
+  function shippedNames(dataDir, subdir) {
     try {
       const pkgRoot = path.resolve(dataDir, "..", "..", "..");
       const pkg = JSON.parse(fs.readFileSync(path.join(pkgRoot, "package.json"), "utf-8"));
       const files = Array.isArray(pkg.files) ? pkg.files : [];
-      return files.filter((f) => /^src\/live-tokens\/data\/colors-and-type\/[^/]+\.json$/.test(f)).map((f) => path.basename(f, ".json"));
+      const owned = new RegExp(`^src/live-tokens/data/${subdir}/[^/]+\\.json$`);
+      return files.filter((f) => owned.test(f)).map((f) => path.basename(f, ".json"));
     } catch {
       return [];
     }
@@ -260,7 +262,7 @@ function themeFileApi(opts) {
   const colorsAndTypeResource = versionedFileResourceServer({
     dir: COLORS_AND_TYPE_DIR,
     packageDir: packageColorsAndTypeDir,
-    packageOwnedNames: shippedColorsAndTypeNames(packageDataDir)
+    packageOwnedNames: shippedNames(packageDataDir, "colors-and-type")
   });
   const componentResourceCache = /* @__PURE__ */ new Map();
   function componentResource(comp) {
@@ -278,7 +280,11 @@ function themeFileApi(opts) {
     dir: THEMES_DIR,
     packageDir: packageThemesDir
   });
-  const sketchStylesResource = versionedFileResourceServer({ dir: SKETCH_STYLES_DIR });
+  const sketchStylesResource = versionedFileResourceServer({
+    dir: SKETCH_STYLES_DIR,
+    packageDir: packageSketchStylesDir,
+    packageOwnedNames: shippedNames(packageDataDir, "sketch-styles")
+  });
   function ensureColorsAndTypeDir() {
     colorsAndTypeResource.ensureDir();
   }
@@ -1090,7 +1096,8 @@ ${lines.join("\n")}
       return {
         name: data?.name || fileName,
         fileName,
-        updatedAt: data?.updatedAt || ""
+        updatedAt: data?.updatedAt || "",
+        isPackage: sketchStylesResource.isPackageFile(fileName)
       };
     });
     jsonResponse(res, 200, { component: comp, files });
@@ -1406,7 +1413,8 @@ ${lines.join("\n")}
       return {
         name: data?.name || fileName,
         fileName,
-        updatedAt: data?.updatedAt || ""
+        updatedAt: data?.updatedAt || "",
+        isPackage: sketchStylesResource.isPackageFile(fileName)
       };
     });
     jsonResponse(res, 200, { files });
@@ -1446,7 +1454,15 @@ ${lines.join("\n")}
       return;
     }
     if (req.method === "DELETE") {
-      if (fs.existsSync(filePath)) fs.unlinkSync(filePath);
+      if (fs.existsSync(filePath)) {
+        fs.unlinkSync(filePath);
+      } else if (sketchStylesResource.existingPath(fileName)) {
+        jsonResponse(res, 403, {
+          error: "Cannot delete a sketchstyle shipped with the package. Saving it creates a local copy; deleting that copy restores the shipped version.",
+          code: "PACKAGE_SKETCH_STYLE"
+        });
+        return;
+      }
       jsonResponse(res, 200, { ok: true });
       return;
     }
@@ -1540,6 +1556,7 @@ ${lines.join("\n")}
     { method: "POST", pattern: PRODUCTION_ROUTE, handler: methodNotAllowed },
     { method: "DELETE", pattern: PRODUCTION_ROUTE, handler: methodNotAllowed }
   ];
+  const isEditorOwnedJson = (file) => file.endsWith(".json") && path.resolve(file).startsWith(dataDirs.dataDir + path.sep);
   return {
     name: "theme-file-api",
     config() {
@@ -1548,7 +1565,8 @@ ${lines.join("\n")}
           __PROJECT_ROOT__: JSON.stringify(process.cwd()),
           __APP_VERSION__: JSON.stringify(PKG_VERSION),
           __LIVE_TOKENS_API_BASE__: JSON.stringify(API_BASE)
-        }
+        },
+        server: { watch: { ignored: [isEditorOwnedJson] } }
       };
     },
     configureServer(server) {

package/dist-plugin/migrateData/index.cjs

@@ -1053,65 +1053,38 @@ var KNOWN_COMPONENT_CONFIG_KEYS = /* @__PURE__ */ new Set([
   "--sectiondivider-sm-color-family"
 ]);
 
-// src/editor/core/sketch/sketchStyles.ts
-var base = {
-  label: "",
-  blurb: "",
-  fillTravel: 1.5,
-  strokeTravel: 1.5,
-  wobble: 45,
-  roughness: 3,
-  borderWavelength: 1,
-  waveform: 1,
-  strokeWidth: 1.5,
-  doubleStroke: false,
-  retraceOffset: 1.2,
-  retracePass: "copy",
-  fillStyle: "solid",
-  hatchInk: 0.4,
-  strokeStyle: "solid",
-  pressure: 0.25,
-  pressureMod: 0.35,
-  pooling: 1.2,
-  strokeInk: 1,
-  maskOn: true,
-  maskBlob: 100,
-  maskOutputMin: 0.45,
-  maskOutputMax: 1,
-  maskOctaves: 2,
-  maskGrain: "fractal",
-  maskPosterize: 1,
-  maskSoftness: 1.5,
-  jitterX: 2.5,
-  jitterY: 2.5,
-  jitterRot: 0.6,
-  jitterScale: 0.035,
-  cornerSpread: 10,
-  cornerTravel: 8,
-  iconTravel: 1.25,
-  iconWavelength: 0.625,
-  iconMaskOn: true,
-  iconMaskScale: 1
-};
-var SKETCH_STYLES = {
-  pencil: {
-    ...base,
+// src/live-tokens/data/sketch-styles/pencil.json
+var pencil_default = {
+  name: "Pencil",
+  settings: {
     label: "Pencil",
     blurb: "Two graphite passes on their own seeds, so the outline disagrees with itself the way a hand coming back round does. Tight grain, little else.",
     fillTravel: 0.75,
     strokeTravel: 1.25,
     wobble: 30,
     roughness: 3,
+    borderWavelength: 1,
     waveform: 1,
     strokeWidth: 1.25,
     doubleStroke: true,
-    retracePass: "reseeded",
     retraceOffset: 1.5,
+    retracePass: "reseeded",
+    fillStyle: "solid",
+    hatchInk: 0.4,
+    strokeStyle: "solid",
+    pressure: 0.15,
+    pressureMod: 0.3,
+    pooling: 0,
     strokeInk: 0.85,
-    maskBlob: 40,
-    maskOutputMin: 0.62,
+    maskOn: true,
+    maskBlobX: 525,
+    maskBlobY: 47,
+    maskBlobLinked: false,
+    maskAngle: 67,
+    maskOutputMin: 0.59,
     maskOutputMax: 1,
     maskOctaves: 3,
+    maskGrain: "turbulence",
     maskPosterize: 1,
     maskSoftness: 0,
     jitterX: 1.5,
@@ -1120,147 +1093,243 @@ var SKETCH_STYLES = {
     jitterScale: 0.022,
     cornerSpread: 6,
     cornerTravel: 4.5,
-    pressure: 0.15,
-    pressureMod: 0.3,
-    pooling: 0,
-    iconTravel: 0.75
+    iconTravel: 0.75,
+    iconWavelength: 0.625,
+    iconMaskOn: true,
+    iconMaskScale: 1
   },
-  marker: {
-    ...base,
+  updatedAt: "2026-08-28T14:35:06.291Z",
+  createdAt: "2026-08-28T14:35:06.291Z"
+};
+
+// src/live-tokens/data/sketch-styles/marker.json
+var marker_default = {
+  name: "Marker",
+  settings: {
     label: "Marker",
     blurb: "Broad translucent nib gone round twice on the same line, so the overlap darkens and the ink pools where it slows.",
     fillTravel: 2,
     strokeTravel: 1.5,
     wobble: 56,
-    waveform: 1.4,
+    roughness: 3,
     borderWavelength: 1.3,
+    waveform: 1.4,
     strokeWidth: 4,
     doubleStroke: true,
+    retraceOffset: 2.2,
     retracePass: "copy",
+    fillStyle: "solid",
+    hatchInk: 0.4,
+    strokeStyle: "solid",
+    pressure: 0.2,
+    pressureMod: 0.25,
+    pooling: 2,
     strokeInk: 0.52,
-    retraceOffset: 2.2,
-    maskBlob: 115,
-    maskOutputMin: 0.42,
+    maskOn: true,
+    maskBlobX: 230,
+    maskBlobY: 230,
+    maskBlobLinked: true,
+    maskAngle: 0,
+    maskOutputMin: 0.76,
     maskOutputMax: 1,
     maskOctaves: 3,
+    maskGrain: "fractal",
     maskPosterize: 4,
-    maskSoftness: 4,
+    maskSoftness: 0,
     jitterX: 3,
     jitterY: 3,
     jitterRot: 0.8,
     jitterScale: 0.045,
     cornerSpread: 10,
     cornerTravel: 8,
-    pressure: 0.2,
-    pressureMod: 0.25,
-    pooling: 2,
     iconTravel: 1.25,
+    iconWavelength: 0.625,
+    iconMaskOn: true,
     iconMaskScale: 4
   },
-  whiteboard: {
-    ...base,
+  updatedAt: "2026-08-28T14:45:04.324Z",
+  createdAt: "2026-08-28T14:45:04.324Z"
+};
+
+// src/live-tokens/data/sketch-styles/whiteboard.json
+var whiteboard_default = {
+  name: "Whiteboard",
+  settings: {
     label: "Whiteboard",
     blurb: "The fattest nib on glass. One long smooth undulation, and a veined mask that streaks the fill like a half-wiped board.",
     fillTravel: 2.5,
     strokeTravel: 2.5,
     wobble: 90,
     roughness: 1,
-    waveform: 1,
     borderWavelength: 1.5,
+    waveform: 1,
     strokeWidth: 5.5,
     doubleStroke: true,
+    retraceOffset: 3,
     retracePass: "copy",
+    fillStyle: "solid",
+    hatchInk: 0.4,
+    strokeStyle: "solid",
+    pressure: 0.15,
+    pressureMod: 0.15,
+    pooling: 3.5,
     strokeInk: 0.66,
-    retraceOffset: 3,
-    maskGrain: "turbulence",
-    maskBlob: 180,
-    maskOutputMin: 0.42,
+    maskOn: true,
+    maskBlobX: 180,
+    maskBlobY: 38,
+    maskBlobLinked: false,
+    maskAngle: 0,
+    maskOutputMin: 0.68,
     maskOutputMax: 1,
-    maskOctaves: 1,
+    maskOctaves: 3,
+    maskGrain: "turbulence",
     maskPosterize: 3,
-    maskSoftness: 8,
+    maskSoftness: 0,
     jitterX: 4.5,
     jitterY: 4.5,
-    jitterRot: 1.2,
+    jitterRot: 3,
     jitterScale: 0.07,
     cornerSpread: 14,
     cornerTravel: 11,
-    pressure: 0.15,
-    pressureMod: 0.15,
-    pooling: 3.5,
     iconTravel: 1.75,
+    iconWavelength: 0.625,
+    iconMaskOn: true,
     iconMaskScale: 1.5
   },
-  hatched: {
-    ...base,
+  updatedAt: "2026-08-28T14:46:58.140Z",
+  createdAt: "2026-08-28T14:46:58.140Z"
+};
+
+// src/live-tokens/data/sketch-styles/hatched.json
+var hatched_default = {
+  name: "Hatched",
+  settings: {
     label: "Hatched",
     blurb: "An etching. The fill is angled shading, the outline a single hard-edged scratch that chatters along its length. No mask: the hatch is the texture.",
     fillTravel: 1.25,
     strokeTravel: 1.5,
     wobble: 24,
     roughness: 3,
+    borderWavelength: 1,
     waveform: 3,
     strokeWidth: 1.5,
+    doubleStroke: false,
+    retraceOffset: 1.2,
+    retracePass: "copy",
     fillStyle: "hatched",
     hatchInk: 0.5,
-    doubleStroke: false,
+    strokeStyle: "solid",
+    pressure: 0.3,
+    pressureMod: 0.45,
+    pooling: 0.8,
+    strokeInk: 1,
     maskOn: false,
-    iconMaskOn: false,
+    maskBlobX: 100,
+    maskBlobY: 100,
+    maskBlobLinked: true,
+    maskAngle: 0,
+    maskOutputMin: 0.45,
+    maskOutputMax: 1,
+    maskOctaves: 2,
+    maskGrain: "fractal",
+    maskPosterize: 1,
+    maskSoftness: 1.5,
     jitterX: 1.5,
     jitterY: 1.5,
     jitterRot: 0.4,
     jitterScale: 0.03,
     cornerSpread: 6,
     cornerTravel: 6,
-    pressure: 0.3,
-    pressureMod: 0.45,
-    pooling: 0.8,
     iconTravel: 1.25,
-    iconWavelength: 0.5
+    iconWavelength: 0.5,
+    iconMaskOn: false,
+    iconMaskScale: 1
   },
-  dashed: {
-    ...base,
+  updatedAt: "2026-08-28T15:47:36.934Z",
+  createdAt: "2026-08-28T15:47:36.934Z"
+};
+
+// src/live-tokens/data/sketch-styles/dashed.json
+var dashed_default = {
+  name: "Dashed",
+  settings: {
     label: "Dashed",
     blurb: "A drafting outline. One slow drift along the ruler, broken into strokes, with jitter, mask and pressure all off. The clean pole.",
-    strokeStyle: "dashed",
-    strokeTravel: 1,
     fillTravel: 0.5,
+    strokeTravel: 1,
     wobble: 120,
     roughness: 1,
+    borderWavelength: 1,
     waveform: 1,
     strokeWidth: 1.5,
     doubleStroke: false,
+    retraceOffset: 1.2,
+    retracePass: "copy",
+    fillStyle: "solid",
+    hatchInk: 0.4,
+    strokeStyle: "dashed",
+    pressure: 0,
+    pressureMod: 0,
+    pooling: 0,
+    strokeInk: 1,
     maskOn: false,
-    iconMaskOn: false,
+    maskBlobX: 100,
+    maskBlobY: 100,
+    maskBlobLinked: true,
+    maskAngle: 0,
+    maskOutputMin: 0.45,
+    maskOutputMax: 1,
+    maskOctaves: 2,
+    maskGrain: "fractal",
+    maskPosterize: 1,
+    maskSoftness: 1.5,
     jitterX: 0,
     jitterY: 0,
     jitterRot: 0,
     jitterScale: 0,
     cornerSpread: 4,
     cornerTravel: 3,
-    pressure: 0,
-    pressureMod: 0,
-    pooling: 0,
-    iconTravel: 0
+    iconTravel: 0,
+    iconWavelength: 0.625,
+    iconMaskOn: false,
+    iconMaskScale: 1
   },
-  napkin: {
-    ...base,
+  updatedAt: "2026-08-28T15:47:36.934Z",
+  createdAt: "2026-08-28T15:47:36.934Z"
+};
+
+// src/live-tokens/data/sketch-styles/napkin.json
+var napkin_default = {
+  name: "Napkin",
+  settings: {
     label: "Napkin",
     blurb: "Ballpoint in a hurry. Everything loose at once: a square wave sends every edge to full travel, and the second pass lands wherever it lands.",
     fillTravel: 3,
     strokeTravel: 2.25,
     wobble: 50,
     roughness: 3,
+    borderWavelength: 1,
     waveform: 2.5,
     strokeWidth: 2.25,
     doubleStroke: true,
-    retracePass: "reseeded",
     retraceOffset: 4,
+    retracePass: "reseeded",
+    fillStyle: "solid",
+    hatchInk: 0.4,
+    strokeStyle: "solid",
+    pressure: 0.45,
+    pressureMod: 0.6,
+    pooling: 2.5,
     strokeInk: 1,
-    maskBlob: 150,
+    maskOn: true,
+    maskBlobX: 150,
+    maskBlobY: 150,
+    maskBlobLinked: true,
+    maskAngle: 0,
     maskOutputMin: 0.43,
     maskOutputMax: 0.95,
     maskOctaves: 2,
+    maskGrain: "fractal",
     maskPosterize: 2,
     maskSoftness: 10,
     jitterX: 6,
@@ -1269,28 +1338,47 @@ var SKETCH_STYLES = {
     jitterScale: 0.1,
     cornerSpread: 20,
     cornerTravel: 17,
-    pressure: 0.45,
-    pressureMod: 0.6,
-    pooling: 2.5,
     iconTravel: 2.25,
+    iconWavelength: 0.625,
+    iconMaskOn: true,
     iconMaskScale: 3.6
   },
-  dry: {
-    ...base,
+  updatedAt: "2026-08-28T15:47:36.934Z",
+  createdAt: "2026-08-28T15:47:36.934Z"
+};
+
+// src/live-tokens/data/sketch-styles/dry.json
+var dry_default = {
+  name: "Dry marker",
+  settings: {
     label: "Dry marker",
     blurb: "Ink that ran out. One scratchy pass that breaks up along its length, over a fill the mask has worn nearly through in patches.",
     fillTravel: 2.25,
     strokeTravel: 1.75,
     wobble: 50,
-    waveform: 2,
+    roughness: 3,
     borderWavelength: 0.5,
+    waveform: 2,
     strokeWidth: 3.5,
     doubleStroke: false,
+    retraceOffset: 1.2,
+    retracePass: "copy",
+    fillStyle: "solid",
+    hatchInk: 0.4,
+    strokeStyle: "solid",
+    pressure: 0.4,
+    pressureMod: 0.8,
+    pooling: 1.5,
     strokeInk: 0.4,
-    maskBlob: 150,
+    maskOn: true,
+    maskBlobX: 150,
+    maskBlobY: 150,
+    maskBlobLinked: true,
+    maskAngle: 0,
     maskOutputMin: 0.24,
     maskOutputMax: 0.91,
     maskOctaves: 2,
+    maskGrain: "fractal",
     maskPosterize: 4,
     maskSoftness: 1.75,
     jitterX: 5,
@@ -1299,26 +1387,34 @@ var SKETCH_STYLES = {
     jitterScale: 0.08,
     cornerSpread: 16,
     cornerTravel: 13,
-    pressure: 0.4,
-    pressureMod: 0.8,
-    pooling: 1.5,
     iconTravel: 1.75,
+    iconWavelength: 0.625,
+    iconMaskOn: true,
     iconMaskScale: 3.8
-  }
+  },
+  updatedAt: "2026-08-28T15:47:36.934Z",
+  createdAt: "2026-08-28T15:47:36.934Z"
 };
+
+// src/editor/core/sketch/sketchStyles.ts
+var SHIPPED_FILES = { pencil: pencil_default, marker: marker_default, whiteboard: whiteboard_default, hatched: hatched_default, dashed: dashed_default, napkin: napkin_default, dry: dry_default };
+var SKETCH_STYLES = Object.fromEntries(
+  Object.entries(SHIPPED_FILES).map(([id, file]) => [id, file.settings])
+);
 var DEFAULT_SKETCH_STYLE = "marker";
 function hydrateSketchStyle(raw) {
-  const base2 = SKETCH_STYLES[DEFAULT_SKETCH_STYLE];
+  const base = SKETCH_STYLES[DEFAULT_SKETCH_STYLE];
   const stored = raw ?? {};
-  const out = { ...base2 };
-  for (const key of Object.keys(base2)) {
+  const out = { ...base };
+  for (const key of Object.keys(base)) {
     if (stored[key] !== void 0) out[key] = stored[key];
   }
-  if (out.fillStyle === "none") out.fillStyle = base2.fillStyle;
+  if (out.fillStyle === "none") out.fillStyle = base.fillStyle;
   convertTiledMask(stored, out);
   convertCutToLevels(stored, out);
   carryLevelsToOutput(stored, out);
   halveSwingDials(stored, out);
+  splitBlobAxes(stored, out);
   convertCyclesToWavelength(stored, out);
   convertIconTileToScale(stored, out);
   restoreDerivedRetrace(stored, out);
@@ -1350,6 +1446,13 @@ function convertCyclesToWavelength(stored, out) {
   const layers = stored.octaves;
   if (typeof layers === "number") out.roughness = Math.min(3, Math.max(1, layers));
 }
+function splitBlobAxes(stored, out) {
+  const blob = stored.maskBlob;
+  if (typeof blob !== "number") return;
+  out.maskBlobX = blob;
+  out.maskBlobY = blob;
+  out.maskBlobLinked = true;
+}
 function convertIconTileToScale(stored, out) {
   const tile = stored.iconMaskTile;
   if (typeof tile !== "number") return;
@@ -1365,7 +1468,10 @@ function convertTiledMask(stored, out) {
   const scale = stored.maskScale;
   if (typeof scale !== "number") return;
   const freq = stored.maskFrequency;
-  if (typeof freq === "number") out.maskBlob = Math.round(scale / (freq * LEGACY_TILE));
+  if (typeof freq === "number") {
+    out.maskBlobX = Math.round(scale / (freq * LEGACY_TILE));
+    out.maskBlobY = out.maskBlobX;
+  }
   const soft = stored.maskSoftness;
   if (typeof soft === "number") out.maskSoftness = Number((soft * scale / LEGACY_TILE).toFixed(1));
 }
@@ -1478,12 +1584,12 @@ function normalizeTheme(raw, resolvers) {
   }
   const filled = { components: [], aliases: 0, orphans: 0 };
   for (const comp of resolvers.listComponentNames()) {
-    const base2 = asObject(resolvers.readComponentConfig(comp, "default"));
-    const baseAliases = base2 ? asObject(base2.aliases) : null;
-    if (!base2 || !baseAliases) continue;
+    const base = asObject(resolvers.readComponentConfig(comp, "default"));
+    const baseAliases = base ? asObject(base.aliases) : null;
+    if (!base || !baseAliases) continue;
     const entry = componentConfigs[comp];
     if (!entry) {
-      const { schemaVersion: _standaloneStamp, ...rest } = stripFileMarker(base2);
+      const { schemaVersion: _standaloneStamp, ...rest } = stripFileMarker(base);
       componentConfigs[comp] = structuredClone(rest);
       filled.components.push(comp);
       continue;

package/dist-plugin/migrateData/index.js

@@ -7,7 +7,7 @@ import {
   normalizeTheme,
   planLegacyRenames,
   versionedFileResourceServer
-} from "../chunk-NDJJORKJ.js";
+} from "../chunk-T4PMCFJN.js";
 import {
   CURRENT_COMPONENT_SCHEMA_VERSION
 } from "../chunk-NE6N66EE.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@motion-proto/live-tokens",
-  "version": "0.65.1",
+  "version": "0.67.0",
   "type": "module",
   "description": "Design token editor with live CSS variable editing. Svelte 5 + Vite 8.",
   "keywords": [
@@ -41,6 +41,13 @@
     "src/live-tokens/data/themes/sketchy.json",
     "src/live-tokens/data/themes/spring-meadow.json",
     "src/live-tokens/data/themes/sunset.json",
+    "src/live-tokens/data/sketch-styles/pencil.json",
+    "src/live-tokens/data/sketch-styles/marker.json",
+    "src/live-tokens/data/sketch-styles/whiteboard.json",
+    "src/live-tokens/data/sketch-styles/hatched.json",
+    "src/live-tokens/data/sketch-styles/dashed.json",
+    "src/live-tokens/data/sketch-styles/napkin.json",
+    "src/live-tokens/data/sketch-styles/dry.json",
     "dist-plugin",
     ".claude/skills",
     "bin",

package/src/editor/bootstrap.ts

@@ -22,10 +22,16 @@ import * as editorStore from './core/store/editorStore';
 import * as themeDocumentSync from './core/themes/themeDocumentSync';
 import { initializeTheme } from './core/themes/themeInit';
 import { registerComponent, type RegisterComponentEntry } from './component-editor/registry';
+import { registerSketchLook, type RegisterSketchLookInput } from './core/sketch/sketchRegistry';
 
 export interface BootLiveTokensOptions {
   /** Consumer-authored components to register with the editor before mount. Dev-only. */
   components?: RegisterComponentEntry[];
+  /** Sketchstyles this project ships, joining the shipped looks in every
+      picker. Registered in a build as well as in dev: carrying a customized
+      sketchstyle to a published site is the whole point, so these must not sit
+      behind the DEV guard `components` sits behind. */
+  sketchLooks?: RegisterSketchLookInput[];
 }
 
 export async function bootLiveTokens(
@@ -38,6 +44,12 @@ export async function bootLiveTokens(
   columnsOverlay.init();
   editorStore.init();
 
+  // Before the DEV block: `initializeTheme` recovers the open theme's look by
+  // name against the pool, so the pool has to be whole by the time it runs.
+  if (opts.sketchLooks) {
+    for (const look of opts.sketchLooks) registerSketchLook(look);
+  }
+
   if (import.meta.env.DEV) {
     themeDocumentSync.init();
     if (opts.components) {

package/src/editor/core/productionPulse.ts

@@ -37,7 +37,7 @@ export function bumpComponentActiveRevision(): void {
  * Set by the client writes that move the live look (`writeWorkingColorsAndType`,
  * `writeWorkingComponentConfig`, `saveActiveTheme`, `saveAsTheme`, and every
  * sketch gesture that changes what the effect paints: `setSketchEnabled`,
- * `updateSketchSettings`, `selectSketchStyle`, `selectSavedSketchStyle`);
+ * `updateSketchSettings`, `selectSketchStyle`);
  * cleared by `adoptLook` and by `hydrateAppliedTheme`, on this document and on
  * every peer an Apply broadcasts to. Module-level, so it survives the
  * remounts a view switch causes.