@motion-proto/live-tokens 0.62.0 → 0.64.0

package/dist-plugin/index.js

@@ -13,7 +13,7 @@ import {
   nextAvailableName,
   normalizeTheme,
   versionedFileResourceServer
-} from "./chunk-232GZGQU.js";
+} from "./chunk-NDJJORKJ.js";
 import {
   CURRENT_COMPONENT_SCHEMA_VERSION
 } from "./chunk-NE6N66EE.js";
@@ -23,7 +23,7 @@ import {
   runAdditiveTokensCssMigrations,
   runTokensCssMigrations,
   validateTokensCss
-} from "./chunk-OPYOK2CA.js";
+} from "./chunk-ZHPX7ZYQ.js";
 import {
   hexToOklch,
   oklchToRgb255,
@@ -31,7 +31,7 @@ import {
 } from "./chunk-7TQQTHI6.js";
 import {
   resolveDataDirs
-} from "./chunk-Y5CNFSSV.js";
+} from "./chunk-RVE3MNKM.js";
 
 // vite-plugin/themeFileApi.ts
 import fs from "fs";
@@ -220,7 +220,7 @@ function themeFileApi(opts) {
   const COLORS_AND_TYPE_DIR = dataDirs.colorsAndTypeDir;
   const COMPONENT_CONFIGS_DIR = dataDirs.componentConfigsDir;
   const THEMES_DIR = dataDirs.themesDir;
-  const SKETCH_PRESETS_DIR = dataDirs.sketchPresetsDir;
+  const SKETCH_STYLES_DIR = dataDirs.sketchStylesDir;
   const CSS_PATH = path.resolve(opts.tokensCssPath);
   const GENERATED_CSS_PATH = opts.tokensGeneratedCssPath ? path.resolve(opts.tokensGeneratedCssPath) : path.join(dataDirs.dataDir, "tokens.generated.css");
   const FONTS_CSS_PATH = opts.fontsCssPath ? path.resolve(opts.fontsCssPath) : path.join(path.dirname(CSS_PATH), "fonts.css");
@@ -278,7 +278,7 @@ function themeFileApi(opts) {
     dir: THEMES_DIR,
     packageDir: packageThemesDir
   });
-  const sketchPresetsResource = versionedFileResourceServer({ dir: SKETCH_PRESETS_DIR });
+  const sketchStylesResource = versionedFileResourceServer({ dir: SKETCH_STYLES_DIR });
   function ensureColorsAndTypeDir() {
     colorsAndTypeResource.ensureDir();
   }
@@ -617,6 +617,13 @@ ${lines.join("\n")}
       `[live-tokens] This project still uses the data layout from 0.47 and earlier: ${evidence}. Since 0.48 the whole-look theme files live in \`themes/\` and the colors and type live in \`colors-and-type/\`. Nothing in the data directory was written, the editor cannot save, and ${path.basename(GENERATED_CSS_PATH)} is left exactly as it is. Run \`npx live-tokens migrate\` to move the directories and heal the tree, then restart the dev server.`
     );
   }
+  function warnOnUnmigratedSketchStyles(warn) {
+    const legacyDir = path.join(dataDirs.dataDir, "sketch-presets");
+    if (!fs.existsSync(legacyDir)) return;
+    warn(
+      `[live-tokens] Saved sketchstyles still live under the retired ${path.basename(legacyDir)}/ directory name. Run \`npx live-tokens migrate\` to rename it to ${path.basename(SKETCH_STYLES_DIR)}/; until then they will not show up in the Sketchstyle view.`
+    );
+  }
   const diskThemeResolvers = {
     readColorsAndType: (name) => colorsAndTypeResource.readJson(sanitizeFileName(name)),
     readComponentConfig: (comp, name) => readComponentConfig(comp, sanitizeFileName(name)),
@@ -856,8 +863,8 @@ ${lines.join("\n")}
   const THEME_EXPORT_REGEX = new RegExp(`^${escapedBase}/themes/([a-z0-9\\-_]+)/export$`);
   const THEME_IMPORT_ROUTE = `${API_BASE}/themes/import`;
   const THEME_BY_NAME_REGEX = new RegExp(`^${escapedBase}/themes/([a-z0-9\\-_]+)$`);
-  const SKETCH_PRESETS_ROUTE = `${API_BASE}/sketch-presets`;
-  const SKETCH_PRESET_BY_NAME_REGEX = new RegExp(`^${escapedBase}/sketch-presets/([a-z0-9\\-_]+)$`);
+  const SKETCH_STYLES_ROUTE = `${API_BASE}/sketch-styles`;
+  const SKETCH_STYLE_BY_NAME_REGEX = new RegExp(`^${escapedBase}/sketch-styles/([a-z0-9\\-_]+)$`);
   const PRODUCTION_ROUTE = `${API_BASE}/production`;
   async function handleListColorsAndType(_ctx) {
     const files = colorsAndTypeResource.listNames().map((fileName) => {
@@ -1389,11 +1396,11 @@ ${lines.join("\n")}
       }
     });
   }
-  async function handleListSketchPresets({ res }) {
-    const files = sketchPresetsResource.listNames().map((fileName) => {
+  async function handleListSketchStyles({ res }) {
+    const files = sketchStylesResource.listNames().map((fileName) => {
       let data = null;
       try {
-        data = sketchPresetsResource.readJson(fileName);
+        data = sketchStylesResource.readJson(fileName);
       } catch {
       }
       return {
@@ -1404,12 +1411,12 @@ ${lines.join("\n")}
     });
     jsonResponse(res, 200, { files });
   }
-  async function handleSketchPresetByName({ params, req, res }) {
+  async function handleSketchStyleByName({ params, req, res }) {
     const [fileName] = params;
     if (rejectReservedName(res, fileName)) return;
-    const filePath = sketchPresetsResource.filePath(fileName);
+    const filePath = sketchStylesResource.filePath(fileName);
     if (req.method === "GET") {
-      const raw = sketchPresetsResource.readJson(fileName);
+      const raw = sketchStylesResource.readJson(fileName);
       if (!raw) {
         jsonResponse(res, 404, { error: "Not found" });
         return;
@@ -1420,7 +1427,7 @@ ${lines.join("\n")}
     if (req.method === "PUT") {
       const body = JSON.parse(await readBody(req));
       if (!body || typeof body !== "object" || !body.settings || typeof body.settings !== "object") {
-        jsonResponse(res, 400, { error: "A sketch preset needs a settings object" });
+        jsonResponse(res, 400, { error: "A sketchstyle needs a settings object" });
         return;
       }
       body.name = String(body.name || fileName);
@@ -1433,7 +1440,7 @@ ${lines.join("\n")}
         }
       }
       if (!body.createdAt) body.createdAt = body.updatedAt;
-      sketchPresetsResource.ensureDir();
+      sketchStylesResource.ensureDir();
       fs.writeFileSync(filePath, JSON.stringify(body, null, 2));
       jsonResponse(res, 200, { ok: true, fileName });
       return;
@@ -1520,14 +1527,14 @@ ${lines.join("\n")}
     { method: "PUT", pattern: THEME_BY_NAME_REGEX, handler: handleThemeByName },
     { method: "DELETE", pattern: THEME_BY_NAME_REGEX, handler: handleThemeByName },
     // Production — the whole-look adopt door
-    { method: "GET", pattern: SKETCH_PRESETS_ROUTE, handler: handleListSketchPresets },
-    { method: "PUT", pattern: SKETCH_PRESETS_ROUTE, handler: methodNotAllowed },
-    { method: "POST", pattern: SKETCH_PRESETS_ROUTE, handler: methodNotAllowed },
-    { method: "DELETE", pattern: SKETCH_PRESETS_ROUTE, handler: methodNotAllowed },
-    { method: "GET", pattern: SKETCH_PRESET_BY_NAME_REGEX, handler: handleSketchPresetByName },
-    { method: "PUT", pattern: SKETCH_PRESET_BY_NAME_REGEX, handler: handleSketchPresetByName },
-    { method: "DELETE", pattern: SKETCH_PRESET_BY_NAME_REGEX, handler: handleSketchPresetByName },
-    { method: "POST", pattern: SKETCH_PRESET_BY_NAME_REGEX, handler: methodNotAllowed },
+    { method: "GET", pattern: SKETCH_STYLES_ROUTE, handler: handleListSketchStyles },
+    { method: "PUT", pattern: SKETCH_STYLES_ROUTE, handler: methodNotAllowed },
+    { method: "POST", pattern: SKETCH_STYLES_ROUTE, handler: methodNotAllowed },
+    { method: "DELETE", pattern: SKETCH_STYLES_ROUTE, handler: methodNotAllowed },
+    { method: "GET", pattern: SKETCH_STYLE_BY_NAME_REGEX, handler: handleSketchStyleByName },
+    { method: "PUT", pattern: SKETCH_STYLE_BY_NAME_REGEX, handler: handleSketchStyleByName },
+    { method: "DELETE", pattern: SKETCH_STYLE_BY_NAME_REGEX, handler: handleSketchStyleByName },
+    { method: "POST", pattern: SKETCH_STYLE_BY_NAME_REGEX, handler: methodNotAllowed },
     { method: "PUT", pattern: PRODUCTION_ROUTE, handler: handleAdoptLook },
     { method: "GET", pattern: PRODUCTION_ROUTE, handler: methodNotAllowed },
     { method: "POST", pattern: PRODUCTION_ROUTE, handler: methodNotAllowed },
@@ -1567,6 +1574,7 @@ ${lines.join("\n")}
           productionPointerHeld,
           (msg) => server.config.logger.warn(msg)
         );
+        warnOnUnmigratedSketchStyles((msg) => server.config.logger.warn(msg));
       }
       server.middlewares.use(async (req, res, next) => {
         if (legacyLayout && req.method !== "GET" && (req.url ?? "").startsWith(API_BASE)) {

package/dist-plugin/migrateData/index.cjs

@@ -1053,6 +1053,340 @@ 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,
+    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,
+    waveform: 1,
+    strokeWidth: 1.25,
+    doubleStroke: true,
+    retracePass: "reseeded",
+    retraceOffset: 1.5,
+    strokeInk: 0.85,
+    maskBlob: 40,
+    maskOutputMin: 0.62,
+    maskOutputMax: 1,
+    maskOctaves: 3,
+    maskPosterize: 1,
+    maskSoftness: 0,
+    jitterX: 1.5,
+    jitterY: 1.5,
+    jitterRot: 0.35,
+    jitterScale: 0.022,
+    cornerSpread: 6,
+    cornerTravel: 4.5,
+    pressure: 0.15,
+    pressureMod: 0.3,
+    pooling: 0,
+    iconTravel: 0.75
+  },
+  marker: {
+    ...base,
+    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,
+    borderWavelength: 1.3,
+    strokeWidth: 4,
+    doubleStroke: true,
+    retracePass: "copy",
+    strokeInk: 0.52,
+    retraceOffset: 2.2,
+    maskBlob: 115,
+    maskOutputMin: 0.42,
+    maskOutputMax: 1,
+    maskOctaves: 3,
+    maskPosterize: 4,
+    maskSoftness: 4,
+    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,
+    iconMaskScale: 4
+  },
+  whiteboard: {
+    ...base,
+    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,
+    strokeWidth: 5.5,
+    doubleStroke: true,
+    retracePass: "copy",
+    strokeInk: 0.66,
+    retraceOffset: 3,
+    maskGrain: "turbulence",
+    maskBlob: 180,
+    maskOutputMin: 0.42,
+    maskOutputMax: 1,
+    maskOctaves: 1,
+    maskPosterize: 3,
+    maskSoftness: 8,
+    jitterX: 4.5,
+    jitterY: 4.5,
+    jitterRot: 1.2,
+    jitterScale: 0.07,
+    cornerSpread: 14,
+    cornerTravel: 11,
+    pressure: 0.15,
+    pressureMod: 0.15,
+    pooling: 3.5,
+    iconTravel: 1.75,
+    iconMaskScale: 1.5
+  },
+  hatched: {
+    ...base,
+    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,
+    waveform: 3,
+    strokeWidth: 1.5,
+    fillStyle: "hatched",
+    hatchInk: 0.5,
+    doubleStroke: false,
+    maskOn: false,
+    iconMaskOn: false,
+    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
+  },
+  dashed: {
+    ...base,
+    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,
+    wobble: 120,
+    roughness: 1,
+    waveform: 1,
+    strokeWidth: 1.5,
+    doubleStroke: false,
+    maskOn: false,
+    iconMaskOn: false,
+    jitterX: 0,
+    jitterY: 0,
+    jitterRot: 0,
+    jitterScale: 0,
+    cornerSpread: 4,
+    cornerTravel: 3,
+    pressure: 0,
+    pressureMod: 0,
+    pooling: 0,
+    iconTravel: 0
+  },
+  napkin: {
+    ...base,
+    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,
+    waveform: 2.5,
+    strokeWidth: 2.25,
+    doubleStroke: true,
+    retracePass: "reseeded",
+    retraceOffset: 4,
+    strokeInk: 1,
+    maskBlob: 150,
+    maskOutputMin: 0.43,
+    maskOutputMax: 0.95,
+    maskOctaves: 2,
+    maskPosterize: 2,
+    maskSoftness: 10,
+    jitterX: 6,
+    jitterY: 6,
+    jitterRot: 1.8,
+    jitterScale: 0.1,
+    cornerSpread: 20,
+    cornerTravel: 17,
+    pressure: 0.45,
+    pressureMod: 0.6,
+    pooling: 2.5,
+    iconTravel: 2.25,
+    iconMaskScale: 3.6
+  },
+  dry: {
+    ...base,
+    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,
+    borderWavelength: 0.5,
+    strokeWidth: 3.5,
+    doubleStroke: false,
+    strokeInk: 0.4,
+    maskBlob: 150,
+    maskOutputMin: 0.24,
+    maskOutputMax: 0.91,
+    maskOctaves: 2,
+    maskPosterize: 4,
+    maskSoftness: 1.75,
+    jitterX: 5,
+    jitterY: 5,
+    jitterRot: 1.4,
+    jitterScale: 0.08,
+    cornerSpread: 16,
+    cornerTravel: 13,
+    pressure: 0.4,
+    pressureMod: 0.8,
+    pooling: 1.5,
+    iconTravel: 1.75,
+    iconMaskScale: 3.8
+  }
+};
+var DEFAULT_SKETCH_STYLE = "marker";
+function hydrateSketchStyle(raw) {
+  const base2 = SKETCH_STYLES[DEFAULT_SKETCH_STYLE];
+  const stored = raw ?? {};
+  const out = { ...base2 };
+  for (const key of Object.keys(base2)) {
+    if (stored[key] !== void 0) out[key] = stored[key];
+  }
+  if (out.fillStyle === "none") out.fillStyle = base2.fillStyle;
+  convertTiledMask(stored, out);
+  convertCutToLevels(stored, out);
+  carryLevelsToOutput(stored, out);
+  halveSwingDials(stored, out);
+  convertCyclesToWavelength(stored, out);
+  convertIconTileToScale(stored, out);
+  restoreDerivedRetrace(stored, out);
+  return out;
+}
+function restoreDerivedRetrace(stored, out) {
+  if (stored.retraceOffset === void 0) {
+    out.retraceOffset = Number(Math.max(1.2, out.strokeWidth * 0.55).toFixed(2));
+  }
+}
+var SWING_DIALS = {
+  fillScale: "fillTravel",
+  strokeScale: "strokeTravel",
+  iconScale: "iconTravel",
+  cornerShift: "cornerTravel"
+};
+function convertCyclesToWavelength(stored, out) {
+  const cycles = stored.frequency;
+  if (typeof cycles === "number" && cycles > 0) out.wobble = Math.round(1 / cycles);
+  for (const [legacy, key] of [
+    ["borderFrequency", "borderWavelength"],
+    ["iconFrequency", "iconWavelength"]
+  ]) {
+    const multiple = stored[legacy];
+    if (typeof multiple === "number" && multiple > 0) {
+      out[key] = Number((1 / multiple).toFixed(3));
+    }
+  }
+  const layers = stored.octaves;
+  if (typeof layers === "number") out.roughness = Math.min(3, Math.max(1, layers));
+}
+function convertIconTileToScale(stored, out) {
+  const tile = stored.iconMaskTile;
+  if (typeof tile !== "number") return;
+  out.iconMaskScale = Math.min(5, Math.max(0.5, Number((tile / 90).toFixed(2))));
+}
+function halveSwingDials(stored, out) {
+  for (const [legacy, key] of Object.entries(SWING_DIALS)) {
+    const value = stored[legacy];
+    if (typeof value === "number") out[key] = value / 2;
+  }
+}
+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));
+  const soft = stored.maskSoftness;
+  if (typeof soft === "number") out.maskSoftness = Number((soft * scale / LEGACY_TILE).toFixed(1));
+}
+function convertCutToLevels(stored, out) {
+  const contrast = stored.maskContrast;
+  const coverage = stored.maskCoverage;
+  if (typeof contrast !== "number" || typeof coverage !== "number") return;
+  const veined = out.maskGrain === "turbulence";
+  const [lo, hi] = veined ? LEGACY_RANGE.turbulence : LEGACY_RANGE.fractal;
+  const pivot = veined ? 0.55 - 0.5 * coverage : 0.8 - 0.6 * coverage;
+  const level = (raw) => Math.min(1, Math.max(0, (raw - lo) / (hi - lo)));
+  out.maskOutputMin = Number(level(pivot - 0.5 / contrast).toFixed(2));
+  out.maskOutputMax = Number(Math.max(out.maskOutputMin + 0.02, level(pivot + 0.5 / contrast)).toFixed(2));
+}
+function carryLevelsToOutput(stored, out) {
+  if (typeof stored.maskLevelMin === "number") out.maskOutputMin = stored.maskLevelMin;
+  if (typeof stored.maskLevelMax === "number") out.maskOutputMax = stored.maskLevelMax;
+}
+var LEGACY_RANGE = { fractal: [0.24, 0.77], turbulence: [0.02, 0.6] };
+var LEGACY_TILE = 600;
+
 // vite-plugin/themes/normalizeTheme.ts
 function asObject(value) {
   return value && typeof value === "object" && !Array.isArray(value) ? value : null;
@@ -1144,12 +1478,12 @@ function normalizeTheme(raw, resolvers) {
   }
   const filled = { components: [], aliases: 0, orphans: 0 };
   for (const comp of resolvers.listComponentNames()) {
-    const base = asObject(resolvers.readComponentConfig(comp, "default"));
-    const baseAliases = base ? asObject(base.aliases) : null;
-    if (!base || !baseAliases) continue;
+    const base2 = asObject(resolvers.readComponentConfig(comp, "default"));
+    const baseAliases = base2 ? asObject(base2.aliases) : null;
+    if (!base2 || !baseAliases) continue;
     const entry = componentConfigs[comp];
     if (!entry) {
-      const { schemaVersion: _standaloneStamp, ...rest } = stripFileMarker(base);
+      const { schemaVersion: _standaloneStamp, ...rest } = stripFileMarker(base2);
       componentConfigs[comp] = structuredClone(rest);
       filled.components.push(comp);
       continue;
@@ -1165,6 +1499,8 @@ function normalizeTheme(raw, resolvers) {
       if (!(key in baseAliases)) filled.orphans++;
     }
   }
+  const embeddedSketchStyle = asObject(src.sketchStyle);
+  const sketchStyle = embeddedSketchStyle ? hydrateSketchStyle(embeddedSketchStyle) : void 0;
   return {
     theme: {
       name: asString(src.name, "Untitled"),
@@ -1173,7 +1509,8 @@ function normalizeTheme(raw, resolvers) {
       schemaVersion: THEME_SCHEMA_VERSION,
       colorsAndType,
       componentConfigs,
-      componentSchemaVersion: CURRENT_COMPONENT_SCHEMA_VERSION
+      componentSchemaVersion: CURRENT_COMPONENT_SCHEMA_VERSION,
+      ...sketchStyle ? { sketchStyle } : {}
     },
     dropped,
     migrated,
@@ -1356,8 +1693,12 @@ function migrateData(opts) {
     configuredManifestsDir: opts.legacyManifestsDir
   };
   const legacyLayout = detectLegacyLayout(layoutInput);
-  const renames = legacyLayout ? planLegacyRenames(legacyLayout, layoutInput) : [];
-  if (legacyLayout && !check) applyLegacyRenames(renames);
+  const legacyRenames = legacyLayout ? planLegacyRenames(legacyLayout, layoutInput) : [];
+  const sketchStylesFrom = import_path3.default.join(opts.dataDir, "sketch-presets");
+  const sketchStylesTo = import_path3.default.join(opts.dataDir, "sketch-styles");
+  const sketchStylesRenames = import_fs3.default.existsSync(sketchStylesFrom) ? [{ from: sketchStylesFrom, to: sketchStylesTo }] : [];
+  const renames = [...legacyRenames, ...sketchStylesRenames];
+  if (!check) applyLegacyRenames(renames);
   const planningLegacy = legacyLayout !== null && check;
   const colorsAndTypeDir = planningLegacy ? opts.themesDir : opts.colorsAndTypeDir;
   const themesDir = planningLegacy ? legacyLayout.manifestsDir : opts.themesDir;
@@ -1414,7 +1755,7 @@ function migrateData(opts) {
     upgradedThemes: []
   };
   if (legacyPointers.length === 0) {
-    if (!legacyLayout) return empty;
+    if (!legacyLayout && renames.length === 0) return empty;
     return { ...empty, status: check ? "planned" : "healed" };
   }
   const resolvers = {
@@ -1659,7 +2000,7 @@ function resolveDataDirs(opts = {}) {
     colorsAndTypeDir: opts.colorsAndTypeDir ? import_path4.default.resolve(opts.colorsAndTypeDir) : fileConfig.colorsAndTypeDir ? import_path4.default.resolve(fileConfig.colorsAndTypeDir) : sub("colors-and-type"),
     componentConfigsDir: opts.componentConfigsDir ? import_path4.default.resolve(opts.componentConfigsDir) : fileConfig.componentConfigsDir ? import_path4.default.resolve(fileConfig.componentConfigsDir) : sub("component-configs"),
     themesDir: opts.themesDir ? import_path4.default.resolve(opts.themesDir) : fileConfig.themesDir ? import_path4.default.resolve(fileConfig.themesDir) : sub("themes"),
-    sketchPresetsDir: sub("sketch-presets"),
+    sketchStylesDir: sub("sketch-styles"),
     legacyManifestsDir: fileConfig.manifestsDir ? import_path4.default.resolve(fileConfig.manifestsDir) : void 0
   };
 }

package/dist-plugin/migrateData/index.d.cts

@@ -1,4 +1,4 @@
-export { r as readLiveTokensConfig, a as resolveDataDirs } from '../dataPaths-CRfD1LdA.cjs';
+export { r as readLiveTokensConfig, a as resolveDataDirs } from '../dataPaths-DZUzVv8H.cjs';
 
 interface LegacyRename {
     from: string;

package/dist-plugin/migrateData/index.d.ts

@@ -1,4 +1,4 @@
-export { r as readLiveTokensConfig, a as resolveDataDirs } from '../dataPaths-CRfD1LdA.js';
+export { r as readLiveTokensConfig, a as resolveDataDirs } from '../dataPaths-DZUzVv8H.js';
 
 interface LegacyRename {
     from: string;

package/dist-plugin/migrateData/index.js

@@ -7,14 +7,14 @@ import {
   normalizeTheme,
   planLegacyRenames,
   versionedFileResourceServer
-} from "../chunk-232GZGQU.js";
+} from "../chunk-NDJJORKJ.js";
 import {
   CURRENT_COMPONENT_SCHEMA_VERSION
 } from "../chunk-NE6N66EE.js";
 import {
   readLiveTokensConfig,
   resolveDataDirs
-} from "../chunk-Y5CNFSSV.js";
+} from "../chunk-RVE3MNKM.js";
 
 // vite-plugin/migrateData/migrateData.ts
 import fs from "fs";
@@ -90,8 +90,12 @@ function migrateData(opts) {
     configuredManifestsDir: opts.legacyManifestsDir
   };
   const legacyLayout = detectLegacyLayout(layoutInput);
-  const renames = legacyLayout ? planLegacyRenames(legacyLayout, layoutInput) : [];
-  if (legacyLayout && !check) applyLegacyRenames(renames);
+  const legacyRenames = legacyLayout ? planLegacyRenames(legacyLayout, layoutInput) : [];
+  const sketchStylesFrom = path.join(opts.dataDir, "sketch-presets");
+  const sketchStylesTo = path.join(opts.dataDir, "sketch-styles");
+  const sketchStylesRenames = fs.existsSync(sketchStylesFrom) ? [{ from: sketchStylesFrom, to: sketchStylesTo }] : [];
+  const renames = [...legacyRenames, ...sketchStylesRenames];
+  if (!check) applyLegacyRenames(renames);
   const planningLegacy = legacyLayout !== null && check;
   const colorsAndTypeDir = planningLegacy ? opts.themesDir : opts.colorsAndTypeDir;
   const themesDir = planningLegacy ? legacyLayout.manifestsDir : opts.themesDir;
@@ -148,7 +152,7 @@ function migrateData(opts) {
     upgradedThemes: []
   };
   if (legacyPointers.length === 0) {
-    if (!legacyLayout) return empty;
+    if (!legacyLayout && renames.length === 0) return empty;
     return { ...empty, status: check ? "planned" : "healed" };
   }
   const resolvers = {

package/dist-plugin/tokensCssMigrations/index.cjs

@@ -566,6 +566,43 @@ var tokensCssMigration_2026_08_27_editorialSizeSteps = {
   }
 };
 
+// vite-plugin/tokensCssMigrations/migrations/2026-08-27-editorial-large-steps.ts
+var BUNDLE3 = [
+  { name: "--editorial-xl-font-family", value: "var(--font-editorial)" },
+  { name: "--editorial-xl-font-size", value: "var(--font-size-xl)" },
+  { name: "--editorial-xl-font-weight", value: "var(--font-weight-normal)" },
+  { name: "--editorial-xl-line-height", value: "var(--line-height-tighter)" },
+  { name: "--editorial-xl-letter-spacing", value: "var(--letter-spacing-normal)" },
+  { name: "--editorial-lg-font-family", value: "var(--font-editorial)" },
+  { name: "--editorial-lg-font-size", value: "var(--font-size-lg)" },
+  { name: "--editorial-lg-font-weight", value: "var(--font-weight-normal)" },
+  { name: "--editorial-lg-line-height", value: "var(--line-height-tight)" },
+  { name: "--editorial-lg-letter-spacing", value: "var(--letter-spacing-normal)" }
+];
+var tokensCssMigration_2026_08_27_editorialLargeSteps = {
+  id: "2026-08-27-editorial-large-steps",
+  kind: "additive",
+  description: "Add the --editorial-lg-* and --editorial-xl-* steps above the reading size",
+  apply(css) {
+    return ensureScale(css, {
+      sectionComment: "Editorial \u2014 the steps above the reading size",
+      anchorPrefixes: [
+        "--editorial-",
+        "--eyebrow-",
+        "--code-",
+        "--body-",
+        "--heading-",
+        "--letter-spacing-",
+        "--line-height-",
+        "--font-weight-",
+        "--font-size-",
+        "--font-"
+      ],
+      entries: BUNDLE3
+    });
+  }
+};
+
 // vite-plugin/files/dataPaths.ts
 var import_fs = __toESM(require("fs"), 1);
 var import_path = __toESM(require("path"), 1);
@@ -613,7 +650,8 @@ var TOKENS_CSS_MIGRATIONS = [
   tokensCssMigration_2026_08_25_editorialTypeRole,
   tokensCssMigration_2026_08_26_gradientStops,
   tokensCssMigration_2026_08_27_backdropPolarity,
-  tokensCssMigration_2026_08_27_editorialSizeSteps
+  tokensCssMigration_2026_08_27_editorialSizeSteps,
+  tokensCssMigration_2026_08_27_editorialLargeSteps
 ];
 function runTokensCssMigrations(css) {
   return foldMigrations(css, () => true);

package/dist-plugin/tokensCssMigrations/index.d.cts

@@ -1,4 +1,4 @@
-export { r as readLiveTokensConfig } from '../dataPaths-CRfD1LdA.cjs';
+export { r as readLiveTokensConfig } from '../dataPaths-DZUzVv8H.cjs';
 
 /**
  * A `tokens-css` migration: a pure, idempotent transform on the text of a

package/dist-plugin/tokensCssMigrations/index.d.ts

@@ -1,4 +1,4 @@
-export { r as readLiveTokensConfig } from '../dataPaths-CRfD1LdA.js';
+export { r as readLiveTokensConfig } from '../dataPaths-DZUzVv8H.js';
 
 /**
  * A `tokens-css` migration: a pure, idempotent transform on the text of a