@motion-proto/live-tokens 0.56.1 → 0.58.0

package/dist-plugin/{chunk-PB2JTK2H.js → chunk-LW4SR7AZ.js}

@@ -1,8 +1,8 @@
 import {
   cssColorToOklch,
   gamutClamp,
-  oklchToCssClamped
-} from "./chunk-YR6GPXW2.js";
+  oklchToCss
+} from "./chunk-XWXIMTWZ.js";
 
 // src/editor/core/storage/files/versionedFileResourceClient.ts
 function sanitizeFileName(name) {
@@ -21,6 +21,30 @@ function formatColorOpacity(name, opacity) {
 }
 
 // src/editor/core/themes/parsers/gradient.ts
+var LINEAR_DIRECTIONS = [
+  "to top",
+  "to top right",
+  "to right",
+  "to bottom right",
+  "to bottom",
+  "to bottom left",
+  "to left",
+  "to top left"
+];
+var DIRECTION_ANGLES = {
+  "to top": 0,
+  "to top right": 45,
+  "to right": 90,
+  "to bottom right": 135,
+  "to bottom": 180,
+  "to bottom left": 225,
+  "to left": 270,
+  "to top left": 315
+};
+function parseDirection(raw) {
+  const norm = raw.trim().toLowerCase().replace(/\s+/g, " ");
+  return LINEAR_DIRECTIONS.includes(norm) ? norm : null;
+}
 var RADIAL_BASE_PX = 100;
 function formatStopColor(s) {
   const opacity = s.opacity ?? 100;
@@ -48,11 +72,15 @@ function formatGradientValue(v) {
     return first ? formatStopColor(first) : "transparent";
   }
   const stops = formatGradientStops(v.stops);
-  if (v.type === "linear") return `linear-gradient(${v.angle}deg, ${stops})`;
+  if (v.type === "linear") {
+    return `linear-gradient(${v.direction ?? `${v.angle}deg`}, ${stops})`;
+  }
   return `radial-gradient(${formatRadialShape(v)} at ${v.centerX ?? 50}% 50%, ${stops})`;
 }
 var NUM = String.raw`-?\d+(?:\.\d+)?`;
-var LINEAR_RE = new RegExp(String.raw`^linear-gradient\(\s*(${NUM})deg\s*,\s*(.+)\)$`, "i");
+var HEADING = String.raw`${NUM}deg|to\s+\w+(?:\s+\w+)?`;
+var LINEAR_RE = new RegExp(String.raw`^linear-gradient\(\s*(${HEADING})\s*,\s*(.+)\)$`, "i");
+var DEG_RE = new RegExp(String.raw`^(${NUM})deg$`, "i");
 var RADIAL_RE = new RegExp(
   String.raw`^radial-gradient\(\s*(circle|circle\s+${NUM}px|ellipse\s+${NUM}px\s+${NUM}px)\s+at\s+(${NUM})%\s+50%\s*,\s*(.+)\)$`,
   "i"
@@ -111,8 +139,12 @@ function parseGradientValue(value) {
   const css = value.trim();
   const linear = css.match(LINEAR_RE);
   if (linear) {
+    const deg = linear[1].match(DEG_RE);
+    const direction = deg ? null : parseDirection(linear[1]);
+    if (!deg && !direction) return null;
     const stops2 = parseStops(linear[2]);
-    return stops2 && { type: "linear", angle: parseFloat(linear[1]), stops: stops2 };
+    if (!stops2) return null;
+    return deg ? { type: "linear", angle: parseFloat(deg[1]), stops: stops2 } : { type: "linear", angle: 0, direction, stops: stops2 };
   }
   const radial = css.match(RADIAL_RE);
   if (!radial) return null;
@@ -307,7 +339,7 @@ function scaleStepToX(step, scale) {
   return scale.steps.length > 1 ? idx / (scale.steps.length - 1) * 100 : 50;
 }
 function serializeDerivedValue(value) {
-  return value.kind === "raw" ? value.css : oklchToCssClamped(value.l, value.c, value.h);
+  return value.kind === "raw" ? value.css : oklchToCss(value.l, value.c, value.h);
 }
 function computePaletteOklch(index, base, lightnessCurve, saturationCurve, curveOffset, hueCurve) {
   const { c: baseC } = base;
@@ -587,6 +619,7 @@ function reconcilePalettesFromCssVars(palettes, cssVars) {
 
 export {
   parseColorOpacity,
+  DIRECTION_ANGLES,
   formatGradientValue,
   parseGradientValue,
   sanitizeFileName,

package/dist-plugin/{chunk-YR6GPXW2.js → chunk-XWXIMTWZ.js}

@@ -99,10 +99,6 @@ function oklchToCss(l, c, h) {
   const cs = trim(c, 4);
   return `oklch(${trim(l, 4)} ${cs} ${cs === "0" ? "0" : trim(h, 2)})`;
 }
-function oklchToCssClamped(l, c, h) {
-  const g = gamutClamp(l, c, h);
-  return oklchToCss(g.l, g.c, g.h);
-}
 var OKLCH_RE = /^oklch\(\s*([\d.]+)(%?)\s+([\d.]+)(%?)\s+([\d.]+)(?:deg)?\s*\)$/i;
 var HEX6_RE = /^#[0-9a-f]{6}$/i;
 function parseOklchCss(value) {
@@ -124,6 +120,5 @@ export {
   oklchToHexClamped,
   gamutClamp,
   oklchToCss,
-  oklchToCssClamped,
   cssColorToOklch
 };

package/dist-plugin/{chunk-D3ZVKOR4.js → chunk-Y5CNFSSV.js}

@@ -42,6 +42,7 @@ function resolveDataDirs(opts = {}) {
     colorsAndTypeDir: opts.colorsAndTypeDir ? path.resolve(opts.colorsAndTypeDir) : fileConfig.colorsAndTypeDir ? path.resolve(fileConfig.colorsAndTypeDir) : sub("colors-and-type"),
     componentConfigsDir: opts.componentConfigsDir ? path.resolve(opts.componentConfigsDir) : fileConfig.componentConfigsDir ? path.resolve(fileConfig.componentConfigsDir) : sub("component-configs"),
     themesDir: opts.themesDir ? path.resolve(opts.themesDir) : fileConfig.themesDir ? path.resolve(fileConfig.themesDir) : sub("themes"),
+    sketchPresetsDir: sub("sketch-presets"),
     legacyManifestsDir: fileConfig.manifestsDir ? path.resolve(fileConfig.manifestsDir) : void 0
   };
 }

package/dist-plugin/{dataPaths-DBN0RPuT.d.cts → dataPaths-CRfD1LdA.d.cts}

@@ -28,6 +28,9 @@ interface ResolvedDataDirs {
     colorsAndTypeDir: string;
     componentConfigsDir: string;
     themesDir: string;
+    /** No per-folder config override: sketch presets are a draft-look artifact
+     *  with no reason to live apart from the rest of the data tree. */
+    sketchPresetsDir: string;
     /** Absolute path of the retired `manifestsDir` key, when the config sets it.
      *  Only the pre-0.48 layout detector and the migration read it. */
     legacyManifestsDir?: string;

package/dist-plugin/{dataPaths-DBN0RPuT.d.ts → dataPaths-CRfD1LdA.d.ts}

@@ -28,6 +28,9 @@ interface ResolvedDataDirs {
     colorsAndTypeDir: string;
     componentConfigsDir: string;
     themesDir: string;
+    /** No per-folder config override: sketch presets are a draft-look artifact
+     *  with no reason to live apart from the rest of the data tree. */
+    sketchPresetsDir: string;
     /** Absolute path of the retired `manifestsDir` key, when the config sets it.
      *  Only the pre-0.48 layout detector and the migration read it. */
     legacyManifestsDir?: string;

package/dist-plugin/fontPairing/index.cjs

@@ -143,12 +143,13 @@ function fontPairingLabel(stacks, sources) {
 }
 
 // src/editor/core/fonts/applyFontPairing.ts
-var SLOT_ORDER = ["display", "body", "serif", "mono"];
+var SLOT_ORDER = ["display", "body", "serif", "mono", "editorial"];
 var SLOT_VARIABLES = {
   display: "--font-display",
   body: "--font-sans",
   serif: "--font-serif",
-  mono: "--font-mono"
+  mono: "--font-mono",
+  editorial: "--font-editorial"
 };
 function slugifyFamily(name) {
   return name.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-|-$/g, "");
@@ -391,6 +392,7 @@ function resolveDataDirs(opts = {}) {
     colorsAndTypeDir: opts.colorsAndTypeDir ? import_path.default.resolve(opts.colorsAndTypeDir) : fileConfig.colorsAndTypeDir ? import_path.default.resolve(fileConfig.colorsAndTypeDir) : sub("colors-and-type"),
     componentConfigsDir: opts.componentConfigsDir ? import_path.default.resolve(opts.componentConfigsDir) : fileConfig.componentConfigsDir ? import_path.default.resolve(fileConfig.componentConfigsDir) : sub("component-configs"),
     themesDir: opts.themesDir ? import_path.default.resolve(opts.themesDir) : fileConfig.themesDir ? import_path.default.resolve(fileConfig.themesDir) : sub("themes"),
+    sketchPresetsDir: sub("sketch-presets"),
     legacyManifestsDir: fileConfig.manifestsDir ? import_path.default.resolve(fileConfig.manifestsDir) : void 0
   };
 }

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

@@ -1,7 +1,7 @@
-import { c as FontStackVariable, C as ColorsAndType, b as FontStack, F as FontSource } from '../themeTypes-BAqtv4XO.cjs';
-export { r as readLiveTokensConfig, a as resolveDataDirs } from '../dataPaths-DBN0RPuT.cjs';
+import { c as FontStackVariable, C as ColorsAndType, b as FontStack, F as FontSource } from '../themeTypes-DSV3Zisf.cjs';
+export { r as readLiveTokensConfig, a as resolveDataDirs } from '../dataPaths-CRfD1LdA.cjs';
 
-type PairingSlot = 'display' | 'body' | 'serif' | 'mono';
+type PairingSlot = 'display' | 'body' | 'serif' | 'mono' | 'editorial';
 interface PairingFace {
     name: string;
     url: string;

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

@@ -1,7 +1,7 @@
-import { c as FontStackVariable, C as ColorsAndType, b as FontStack, F as FontSource } from '../themeTypes-BAqtv4XO.js';
-export { r as readLiveTokensConfig, a as resolveDataDirs } from '../dataPaths-DBN0RPuT.js';
+import { c as FontStackVariable, C as ColorsAndType, b as FontStack, F as FontSource } from '../themeTypes-DSV3Zisf.js';
+export { r as readLiveTokensConfig, a as resolveDataDirs } from '../dataPaths-CRfD1LdA.js';
 
-type PairingSlot = 'display' | 'body' | 'serif' | 'mono';
+type PairingSlot = 'display' | 'body' | 'serif' | 'mono' | 'editorial';
 interface PairingFace {
     name: string;
     url: string;

package/dist-plugin/fontPairing/index.js

@@ -1,7 +1,7 @@
 import {
   readLiveTokensConfig,
   resolveDataDirs
-} from "../chunk-D3ZVKOR4.js";
+} from "../chunk-Y5CNFSSV.js";
 
 // src/editor/core/fonts/fontParse.ts
 function parseGoogleFontsUrl(url2) {
@@ -101,12 +101,13 @@ function fontPairingLabel(stacks, sources) {
 }
 
 // src/editor/core/fonts/applyFontPairing.ts
-var SLOT_ORDER = ["display", "body", "serif", "mono"];
+var SLOT_ORDER = ["display", "body", "serif", "mono", "editorial"];
 var SLOT_VARIABLES = {
   display: "--font-display",
   body: "--font-sans",
   serif: "--font-serif",
-  mono: "--font-mono"
+  mono: "--font-mono",
+  editorial: "--font-editorial"
 };
 function slugifyFamily(name) {
   return name.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-|-$/g, "");

package/dist-plugin/generateColorsAndType/index.cjs

@@ -139,10 +139,6 @@ function oklchToCss(l, c, h) {
   const cs = trim(c, 4);
   return `oklch(${trim(l, 4)} ${cs} ${cs === "0" ? "0" : trim(h, 2)})`;
 }
-function oklchToCssClamped(l, c, h) {
-  const g = gamutClamp(l, c, h);
-  return oklchToCss(g.l, g.c, g.h);
-}
 var OKLCH_RE = /^oklch\(\s*([\d.]+)(%?)\s+([\d.]+)(%?)\s+([\d.]+)(?:deg)?\s*\)$/i;
 var HEX6_RE = /^#[0-9a-f]{6}$/i;
 function parseOklchCss(value) {
@@ -336,7 +332,7 @@ function scaleStepToX(step, scale) {
   return scale.steps.length > 1 ? idx / (scale.steps.length - 1) * 100 : 50;
 }
 function serializeDerivedValue(value) {
-  return value.kind === "raw" ? value.css : oklchToCssClamped(value.l, value.c, value.h);
+  return value.kind === "raw" ? value.css : oklchToCss(value.l, value.c, value.h);
 }
 function computePaletteOklch(index, base, lightnessCurve, saturationCurve, curveOffset, hueCurve) {
   const { c: baseC } = base;
@@ -609,6 +605,16 @@ function formatColorOpacity(name, opacity) {
 }
 
 // src/editor/core/themes/parsers/gradient.ts
+var DIRECTION_ANGLES = {
+  "to top": 0,
+  "to top right": 45,
+  "to right": 90,
+  "to bottom right": 135,
+  "to bottom": 180,
+  "to bottom left": 225,
+  "to left": 270,
+  "to top left": 315
+};
 var RADIAL_BASE_PX = 100;
 function formatStopColor(s) {
   const opacity = s.opacity ?? 100;
@@ -636,11 +642,15 @@ function formatGradientValue(v) {
     return first ? formatStopColor(first) : "transparent";
   }
   const stops = formatGradientStops(v.stops);
-  if (v.type === "linear") return `linear-gradient(${v.angle}deg, ${stops})`;
+  if (v.type === "linear") {
+    return `linear-gradient(${v.direction ?? `${v.angle}deg`}, ${stops})`;
+  }
   return `radial-gradient(${formatRadialShape(v)} at ${v.centerX ?? 50}% 50%, ${stops})`;
 }
 var NUM = String.raw`-?\d+(?:\.\d+)?`;
-var LINEAR_RE = new RegExp(String.raw`^linear-gradient\(\s*(${NUM})deg\s*,\s*(.+)\)$`, "i");
+var HEADING = String.raw`${NUM}deg|to\s+\w+(?:\s+\w+)?`;
+var LINEAR_RE = new RegExp(String.raw`^linear-gradient\(\s*(${HEADING})\s*,\s*(.+)\)$`, "i");
+var DEG_RE = new RegExp(String.raw`^(${NUM})deg$`, "i");
 var RADIAL_RE = new RegExp(
   String.raw`^radial-gradient\(\s*(circle|circle\s+${NUM}px|ellipse\s+${NUM}px\s+${NUM}px)\s+at\s+(${NUM})%\s+50%\s*,\s*(.+)\)$`,
   "i"
@@ -655,7 +665,8 @@ function makeDefaultGradients() {
     {
       variable: "--gradient-1",
       type: "linear",
-      angle: 90,
+      angle: DIRECTION_ANGLES["to right"],
+      direction: "to right",
       stops: [
         { position: 0, color: "--color-brand-500" },
         { position: 100, color: "--color-accent-500" }
@@ -673,7 +684,8 @@ function makeDefaultGradients() {
     {
       variable: "--gradient-3",
       type: "linear",
-      angle: 90,
+      angle: DIRECTION_ANGLES["to right"],
+      direction: "to right",
       stops: [
         { position: 0, color: "--color-success-500" },
         { position: 100, color: "--color-info-500" }
@@ -1914,6 +1926,7 @@ function resolveDataDirs(opts = {}) {
     colorsAndTypeDir: opts.colorsAndTypeDir ? import_path.default.resolve(opts.colorsAndTypeDir) : fileConfig.colorsAndTypeDir ? import_path.default.resolve(fileConfig.colorsAndTypeDir) : sub("colors-and-type"),
     componentConfigsDir: opts.componentConfigsDir ? import_path.default.resolve(opts.componentConfigsDir) : fileConfig.componentConfigsDir ? import_path.default.resolve(fileConfig.componentConfigsDir) : sub("component-configs"),
     themesDir: opts.themesDir ? import_path.default.resolve(opts.themesDir) : fileConfig.themesDir ? import_path.default.resolve(fileConfig.themesDir) : sub("themes"),
+    sketchPresetsDir: sub("sketch-presets"),
     legacyManifestsDir: fileConfig.manifestsDir ? import_path.default.resolve(fileConfig.manifestsDir) : void 0
   };
 }

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

@@ -1,5 +1,5 @@
-import { F as FontSource, b as FontStack, G as GradientDiskToken, O as Oklch, H as HarmonyMode, C as ColorsAndType } from '../themeTypes-BAqtv4XO.cjs';
-export { r as readLiveTokensConfig, a as resolveDataDirs } from '../dataPaths-DBN0RPuT.cjs';
+import { F as FontSource, b as FontStack, G as GradientDiskToken, O as Oklch, H as HarmonyMode, C as ColorsAndType } from '../themeTypes-DSV3Zisf.cjs';
+export { r as readLiveTokensConfig, a as resolveDataDirs } from '../dataPaths-CRfD1LdA.cjs';
 export { C as CURRENT_COMPONENT_SCHEMA_VERSION } from '../index-4N-Orzzi.cjs';
 
 /**

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

@@ -1,5 +1,5 @@
-import { F as FontSource, b as FontStack, G as GradientDiskToken, O as Oklch, H as HarmonyMode, C as ColorsAndType } from '../themeTypes-BAqtv4XO.js';
-export { r as readLiveTokensConfig, a as resolveDataDirs } from '../dataPaths-DBN0RPuT.js';
+import { F as FontSource, b as FontStack, G as GradientDiskToken, O as Oklch, H as HarmonyMode, C as ColorsAndType } from '../themeTypes-DSV3Zisf.js';
+export { r as readLiveTokensConfig, a as resolveDataDirs } from '../dataPaths-CRfD1LdA.js';
 export { C as CURRENT_COMPONENT_SCHEMA_VERSION } from '../index-4N-Orzzi.js';
 
 /**

package/dist-plugin/generateColorsAndType/index.js

@@ -1,6 +1,7 @@
 import {
   DEFAULT_PALETTE_LIGHTNESS,
   DEFAULT_PALETTE_SATURATION,
+  DIRECTION_ANGLES,
   PALETTE_SPECS,
   PALETTE_STEPS,
   SCALES,
@@ -14,7 +15,7 @@ import {
   scaleToCssVar,
   setCurveAnchor,
   syncBaseAnchor
-} from "../chunk-PB2JTK2H.js";
+} from "../chunk-LW4SR7AZ.js";
 import {
   CURRENT_COLORS_AND_TYPE_SCHEMA_VERSION,
   CURRENT_COMPONENT_SCHEMA_VERSION
@@ -25,11 +26,11 @@ import {
   hexToOklch,
   oklchToHex,
   oklchToHexClamped
-} from "../chunk-YR6GPXW2.js";
+} from "../chunk-XWXIMTWZ.js";
 import {
   readLiveTokensConfig,
   resolveDataDirs
-} from "../chunk-D3ZVKOR4.js";
+} from "../chunk-Y5CNFSSV.js";
 
 // src/editor/core/store/editorCore.ts
 import { writable, derived, get } from "svelte/store";
@@ -50,7 +51,8 @@ function makeDefaultGradients() {
     {
       variable: "--gradient-1",
       type: "linear",
-      angle: 90,
+      angle: DIRECTION_ANGLES["to right"],
+      direction: "to right",
       stops: [
         { position: 0, color: "--color-brand-500" },
         { position: 100, color: "--color-accent-500" }
@@ -68,7 +70,8 @@ function makeDefaultGradients() {
     {
       variable: "--gradient-3",
       type: "linear",
-      angle: 90,
+      angle: DIRECTION_ANGLES["to right"],
+      direction: "to right",
       stops: [
         { position: 0, color: "--color-success-500" },
         { position: 100, color: "--color-info-500" }

package/dist-plugin/index.cjs

@@ -64,6 +64,20 @@ function formatColorOpacity(name, opacity) {
 }
 
 // src/editor/core/themes/parsers/gradient.ts
+var LINEAR_DIRECTIONS = [
+  "to top",
+  "to top right",
+  "to right",
+  "to bottom right",
+  "to bottom",
+  "to bottom left",
+  "to left",
+  "to top left"
+];
+function parseDirection(raw) {
+  const norm = raw.trim().toLowerCase().replace(/\s+/g, " ");
+  return LINEAR_DIRECTIONS.includes(norm) ? norm : null;
+}
 var RADIAL_BASE_PX = 100;
 function formatStopColor(s) {
   const opacity = s.opacity ?? 100;
@@ -91,11 +105,15 @@ function formatGradientValue(v) {
     return first ? formatStopColor(first) : "transparent";
   }
   const stops = formatGradientStops(v.stops);
-  if (v.type === "linear") return `linear-gradient(${v.angle}deg, ${stops})`;
+  if (v.type === "linear") {
+    return `linear-gradient(${v.direction ?? `${v.angle}deg`}, ${stops})`;
+  }
   return `radial-gradient(${formatRadialShape(v)} at ${v.centerX ?? 50}% 50%, ${stops})`;
 }
 var NUM = String.raw`-?\d+(?:\.\d+)?`;
-var LINEAR_RE = new RegExp(String.raw`^linear-gradient\(\s*(${NUM})deg\s*,\s*(.+)\)$`, "i");
+var HEADING = String.raw`${NUM}deg|to\s+\w+(?:\s+\w+)?`;
+var LINEAR_RE = new RegExp(String.raw`^linear-gradient\(\s*(${HEADING})\s*,\s*(.+)\)$`, "i");
+var DEG_RE = new RegExp(String.raw`^(${NUM})deg$`, "i");
 var RADIAL_RE = new RegExp(
   String.raw`^radial-gradient\(\s*(circle|circle\s+${NUM}px|ellipse\s+${NUM}px\s+${NUM}px)\s+at\s+(${NUM})%\s+50%\s*,\s*(.+)\)$`,
   "i"
@@ -154,8 +172,12 @@ function parseGradientValue(value) {
   const css = value.trim();
   const linear = css.match(LINEAR_RE);
   if (linear) {
+    const deg = linear[1].match(DEG_RE);
+    const direction = deg ? null : parseDirection(linear[1]);
+    if (!deg && !direction) return null;
     const stops2 = parseStops(linear[2]);
-    return stops2 && { type: "linear", angle: parseFloat(linear[1]), stops: stops2 };
+    if (!stops2) return null;
+    return deg ? { type: "linear", angle: parseFloat(deg[1]), stops: stops2 } : { type: "linear", angle: 0, direction, stops: stops2 };
   }
   const radial = css.match(RADIAL_RE);
   if (!radial) return null;
@@ -259,10 +281,6 @@ function oklchToCss(l, c, h) {
   const cs = trim(c, 4);
   return `oklch(${trim(l, 4)} ${cs} ${cs === "0" ? "0" : trim(h, 2)})`;
 }
-function oklchToCssClamped(l, c, h) {
-  const g = gamutClamp(l, c, h);
-  return oklchToCss(g.l, g.c, g.h);
-}
 var OKLCH_RE = /^oklch\(\s*([\d.]+)(%?)\s+([\d.]+)(%?)\s+([\d.]+)(?:deg)?\s*\)$/i;
 var HEX6_RE = /^#[0-9a-f]{6}$/i;
 function parseOklchCss(value) {
@@ -456,7 +474,7 @@ function scaleStepToX(step, scale) {
   return scale.steps.length > 1 ? idx / (scale.steps.length - 1) * 100 : 50;
 }
 function serializeDerivedValue(value) {
-  return value.kind === "raw" ? value.css : oklchToCssClamped(value.l, value.c, value.h);
+  return value.kind === "raw" ? value.css : oklchToCss(value.l, value.c, value.h);
 }
 function computePaletteOklch(index, base, lightnessCurve, saturationCurve, curveOffset, hueCurve) {
   const { c: baseC } = base;
@@ -1977,6 +1995,7 @@ function resolveDataDirs(opts = {}) {
     colorsAndTypeDir: opts.colorsAndTypeDir ? import_path2.default.resolve(opts.colorsAndTypeDir) : fileConfig.colorsAndTypeDir ? import_path2.default.resolve(fileConfig.colorsAndTypeDir) : sub("colors-and-type"),
     componentConfigsDir: opts.componentConfigsDir ? import_path2.default.resolve(opts.componentConfigsDir) : fileConfig.componentConfigsDir ? import_path2.default.resolve(fileConfig.componentConfigsDir) : sub("component-configs"),
     themesDir: opts.themesDir ? import_path2.default.resolve(opts.themesDir) : fileConfig.themesDir ? import_path2.default.resolve(fileConfig.themesDir) : sub("themes"),
+    sketchPresetsDir: sub("sketch-presets"),
     legacyManifestsDir: fileConfig.manifestsDir ? import_path2.default.resolve(fileConfig.manifestsDir) : void 0
   };
 }
@@ -2040,11 +2059,17 @@ function detectLegacyLayout(input) {
 // vite-plugin/tokensCssMigrations/cssTokenOps.ts
 var DECL_RE = /(^|[\s;{])(--[a-z0-9-]+)\s*:/gi;
 var REF_RE = /var\(\s*(--[a-z0-9-]+)/gi;
+var DECL_VALUE_RE = /(^|[\s;{])(--[a-z0-9-]+)\s*:([^;}]*)/gi;
 function collectDefinedTokens(css) {
   const out = /* @__PURE__ */ new Set();
   for (const m of css.matchAll(DECL_RE)) out.add(m[2]);
   return out;
 }
+function collectTokenValues(css) {
+  const out = /* @__PURE__ */ new Map();
+  for (const m of css.matchAll(DECL_VALUE_RE)) out.set(m[2], m[3].trim());
+  return out;
+}
 function collectReferencedTokens(css) {
   const out = /* @__PURE__ */ new Set();
   for (const m of css.matchAll(REF_RE)) out.add(m[1]);
@@ -2392,6 +2417,61 @@ var tokensCssMigration_2026_08_19_oklchColorValues = {
   }
 };
 
+// vite-plugin/tokensCssMigrations/migrations/2026-08-25-editorial-type-role.ts
+var STACK = [{ name: "--font-editorial", value: "var(--font-sans)" }];
+var BUNDLE2 = [
+  { name: "--editorial-font-family", value: "var(--font-editorial)" },
+  { name: "--editorial-font-size", value: "var(--font-size-md)" },
+  { name: "--editorial-font-weight", value: "var(--font-weight-normal)" },
+  { name: "--editorial-line-height", value: "var(--line-height-normal)" },
+  { name: "--editorial-letter-spacing", value: "var(--letter-spacing-normal)" }
+];
+var tokensCssMigration_2026_08_25_editorialTypeRole = {
+  id: "2026-08-25-editorial-type-role",
+  kind: "additive",
+  description: "Add the editorial type role (--font-editorial and the --editorial-* bundle)",
+  apply(css) {
+    const withStack = ensureScale(css, {
+      anchorPrefixes: ["--font-mono", "--font-serif", "--font-sans", "--font-display"],
+      entries: STACK
+    });
+    return ensureScale(withStack, {
+      sectionComment: "Editorial \u2014 the long-reading role, body face until repointed",
+      anchorPrefixes: [
+        "--eyebrow-",
+        "--code-",
+        "--body-",
+        "--heading-",
+        "--letter-spacing-",
+        "--line-height-",
+        "--font-weight-",
+        "--font-size-",
+        "--font-"
+      ],
+      entries: BUNDLE2
+    });
+  }
+};
+
+// vite-plugin/tokensCssMigrations/migrations/2026-08-26-gradient-stops.ts
+var STOPS_RE = /^(?:linear|radial)-gradient\(\s*[^,]+,\s*(.+)\)$/i;
+var tokensCssMigration_2026_08_26_gradientStops = {
+  id: "2026-08-26-gradient-stops",
+  kind: "additive",
+  description: "Add --gradient-N-stops companions to the gradient slots",
+  apply(css) {
+    const values = collectTokenValues(css);
+    const entries = [];
+    for (const [name, value] of values) {
+      if (!/^--gradient-\d+$/.test(name)) continue;
+      const stops = value.match(STOPS_RE);
+      if (stops) entries.push({ name: `${name}-stops`, value: stops[1].trim() });
+    }
+    if (entries.length === 0) return css;
+    return ensureScale(css, { anchorPrefixes: ["--gradient-"], entries });
+  }
+};
+
 // vite-plugin/tokensCssMigrations/index.ts
 var TOKENS_CSS_MIGRATIONS = [
   tokensCssMigration_2026_05_29_typographyScaleAdditions,
@@ -2401,7 +2481,9 @@ var TOKENS_CSS_MIGRATIONS = [
   tokensCssMigration_2026_06_04_easingColorAndTypescaleAdditions,
   tokensCssMigration_2026_07_20_lineHeightRename,
   tokensCssMigration_2026_07_20_semanticTextStyles,
-  tokensCssMigration_2026_08_19_oklchColorValues
+  tokensCssMigration_2026_08_19_oklchColorValues,
+  tokensCssMigration_2026_08_25_editorialTypeRole,
+  tokensCssMigration_2026_08_26_gradientStops
 ];
 function runTokensCssMigrations(css) {
   return foldMigrations(css, () => true);
@@ -2502,6 +2584,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 CSS_PATH = import_path4.default.resolve(opts.tokensCssPath);
   const GENERATED_CSS_PATH = opts.tokensGeneratedCssPath ? import_path4.default.resolve(opts.tokensGeneratedCssPath) : import_path4.default.join(dataDirs.dataDir, "tokens.generated.css");
   const FONTS_CSS_PATH = opts.fontsCssPath ? import_path4.default.resolve(opts.fontsCssPath) : import_path4.default.join(import_path4.default.dirname(CSS_PATH), "fonts.css");
@@ -2559,6 +2642,7 @@ function themeFileApi(opts) {
     dir: THEMES_DIR,
     packageDir: packageThemesDir
   });
+  const sketchPresetsResource = versionedFileResourceServer({ dir: SKETCH_PRESETS_DIR });
   function ensureColorsAndTypeDir() {
     colorsAndTypeResource.ensureDir();
   }
@@ -3124,6 +3208,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 PRODUCTION_ROUTE = `${API_BASE}/production`;
   async function handleListColorsAndType(_ctx) {
     const files = colorsAndTypeResource.listNames().map((fileName) => {
@@ -3655,6 +3741,61 @@ ${lines.join("\n")}
       }
     });
   }
+  async function handleListSketchPresets({ res }) {
+    const files = sketchPresetsResource.listNames().map((fileName) => {
+      let data = null;
+      try {
+        data = sketchPresetsResource.readJson(fileName);
+      } catch {
+      }
+      return {
+        name: data?.name || fileName,
+        fileName,
+        updatedAt: data?.updatedAt || ""
+      };
+    });
+    jsonResponse(res, 200, { files });
+  }
+  async function handleSketchPresetByName({ params, req, res }) {
+    const [fileName] = params;
+    if (rejectReservedName(res, fileName)) return;
+    const filePath = sketchPresetsResource.filePath(fileName);
+    if (req.method === "GET") {
+      const raw = sketchPresetsResource.readJson(fileName);
+      if (!raw) {
+        jsonResponse(res, 404, { error: "Not found" });
+        return;
+      }
+      jsonResponse(res, 200, { ...raw, _fileName: fileName });
+      return;
+    }
+    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" });
+        return;
+      }
+      body.name = String(body.name || fileName);
+      body.updatedAt = (/* @__PURE__ */ new Date()).toISOString();
+      if (import_fs4.default.existsSync(filePath)) {
+        try {
+          const existing = JSON.parse(import_fs4.default.readFileSync(filePath, "utf-8"));
+          if (existing.createdAt) body.createdAt = existing.createdAt;
+        } catch {
+        }
+      }
+      if (!body.createdAt) body.createdAt = body.updatedAt;
+      sketchPresetsResource.ensureDir();
+      import_fs4.default.writeFileSync(filePath, JSON.stringify(body, null, 2));
+      jsonResponse(res, 200, { ok: true, fileName });
+      return;
+    }
+    if (req.method === "DELETE") {
+      if (import_fs4.default.existsSync(filePath)) import_fs4.default.unlinkSync(filePath);
+      jsonResponse(res, 200, { ok: true });
+      return;
+    }
+  }
   function methodNotAllowed({ res }) {
     jsonResponse(res, 405, { error: "Method not allowed" });
   }
@@ -3731,6 +3872,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: "PUT", pattern: PRODUCTION_ROUTE, handler: handleAdoptLook },
     { method: "GET", pattern: PRODUCTION_ROUTE, handler: methodNotAllowed },
     { method: "POST", pattern: PRODUCTION_ROUTE, handler: methodNotAllowed },

package/dist-plugin/index.d.cts

@@ -1,6 +1,6 @@
 import { Plugin } from 'vite';
 export { ComponentSource, MissingToken, RunResult, TOKENS_CSS_MIGRATIONS, TokensCssMigration, ValidateInput, runTokensCssMigrations, validateTokensCss } from './tokensCssMigrations/index.cjs';
-import './dataPaths-DBN0RPuT.cjs';
+import './dataPaths-CRfD1LdA.cjs';
 
 interface ThemeFileApiOptions {
     tokensCssPath: string;

package/dist-plugin/index.d.ts

@@ -1,6 +1,6 @@
 import { Plugin } from 'vite';
 export { ComponentSource, MissingToken, RunResult, TOKENS_CSS_MIGRATIONS, TokensCssMigration, ValidateInput, runTokensCssMigrations, validateTokensCss } from './tokensCssMigrations/index.js';
-import './dataPaths-DBN0RPuT.js';
+import './dataPaths-CRfD1LdA.js';
 
 interface ThemeFileApiOptions {
     tokensCssPath: string;