@flesler/cursor-canvas-web 1.2.0 → 1.3.0

package/dist/{host-tokens-Dh2BFFjv.js → host-tokens-Bt6GPXN1.js}

@@ -50,28 +50,27 @@ const s = {
   diffRemovedLine: "#CF2D5614",
   diffStripAdded: "#1F8A65CC",
   diffStripRemoved: "#CF2D56CC"
-}, C = {
+}, v = {
   accent: "#1084FE",
   buttonBackground: "#1084FE",
   buttonForeground: "#070707",
   buttonHoverBackground: "#459FFE",
   link: "#80BEFE",
   strokeFocused: "#1084FE"
-}, B = {
+}, S = {
   accent: "#0C64C1",
   buttonBackground: "#0C64C1",
   buttonForeground: "#FAFAFA",
   buttonHoverBackground: "#1084FE",
   link: "#0C64C1",
   strokeFocused: "#0C64C1"
-}, A = {
+}, y = {
   ...s,
-  ...C
-}, b = {
+  ...v
+}, m = {
   ...l,
-  ...B
+  ...S
 }, E = {
-  gray: "#8888A8E0",
   purple: "#7B64B8F0",
   green: "#1F8A65E8",
   yellow: "#E8C030E0",
@@ -80,18 +79,11 @@ const s = {
   blue: "#2E79B5E0",
   orange: "#F0A040E0",
   red: "#C04848E0"
-}, k = {
-  gray: "#8888A8E0",
-  purple: "#7B64B8F0",
-  green: "#1F8A65E8",
-  yellow: "#E8C030E0",
-  cyan: "#2A9A8AE0",
-  pink: "#C85898E0",
-  blue: "#2E79B5E0",
+}, p = {
+  ...E,
   orange: "#F0A088E0",
   red: "#CF2D56E0"
-}, y = {
-  gray: "#777777E0",
+}, f = {
   purple: "#9159FEF0",
   green: "#00C972E8",
   yellow: "#FF9800E0",
@@ -100,9 +92,29 @@ const s = {
   blue: "#1084FEE0",
   orange: "#FF6700E0",
   red: "#FF263CE0"
-}, v = {
-  ...y
-}, K = E, N = [
+};
+function g(e, r) {
+  return {
+    gray: r.foregroundTertiary,
+    ...e
+  };
+}
+const C = g(
+  E,
+  s
+), P = g(
+  p,
+  l
+);
+g(
+  f,
+  y
+);
+g(
+  f,
+  m
+);
+const U = C, j = [
   "blue",
   "purple",
   "green",
@@ -154,7 +166,7 @@ const s = {
   vibrantTeal: "#00BCA6E0",
   muted: "#777777E0",
   neutralLine: "#777777D0"
-}, S = [
+}, T = [
   i.green,
   i.lightBlue,
   i.indigo,
@@ -167,7 +179,7 @@ const s = {
   i.mintGreen,
   i.muted,
   i.vibrantTeal
-], P = [
+], x = [
   a.green,
   a.lightBlue,
   a.indigo,
@@ -180,14 +192,14 @@ const s = {
   a.mintGreen,
   a.muted,
   a.vibrantTeal
-], h = {
+], B = {
   fontFamily: "inherit",
   h1: { fontSize: "24px", lineHeight: "30px", fontWeight: 590 },
   h2: { fontSize: "18px", lineHeight: "24px", fontWeight: 590 },
   h3: { fontSize: "16px", lineHeight: "22px", fontWeight: 590 },
   body: { fontSize: "14px", lineHeight: "20px", fontWeight: 400 },
   small: { fontSize: "12px", lineHeight: "16px", fontWeight: 400 }
-}, T = 'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif', x = {
+}, D = 'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif', L = {
   "0.5": 2,
   1: 4,
   "1.5": 6,
@@ -203,7 +215,7 @@ const s = {
   8: 32,
   9: 36,
   10: 40
-}, m = {
+}, b = {
   none: 0,
   xs: 2,
   sm: 4,
@@ -211,16 +223,16 @@ const s = {
   lg: 8,
   xl: 12,
   full: 9999
-}, D = {
-  ...m,
+}, H = {
+  ...b,
   md: 8,
   lg: 10,
   xl: 14
-}, L = {
-  ...h,
-  fontFamily: T
+}, G = {
+  ...B,
+  fontFamily: D
 };
-function F(e, n) {
+function h(e, r) {
   return {
     bg: {
       editor: e.editor,
@@ -258,155 +270,157 @@ function F(e, n) {
       stripAdded: e.diffStripAdded,
       stripRemoved: e.diffStripRemoved
     },
-    category: n
+    category: r
   };
 }
-const U = F(
+const J = h(
   s,
-  E
-), j = F(
+  C
+), V = h(
   l,
-  k
+  P
 );
-function u(e) {
-  const n = e.trim(), o = /^#([0-9a-f]{3,8})$/i.exec(n);
+function F(e) {
+  const r = e.trim(), o = /^#([0-9a-f]{3,8})$/i.exec(r);
   if (!o)
     return;
-  const r = o[1];
-  if (r.length === 3 || r.length === 4) {
-    const t = (f) => f + f, c = parseInt(t(r[0]), 16), d = parseInt(t(r[1]), 16), g = parseInt(t(r[2]), 16);
-    return { r: c, g: d, b: g };
+  const n = o[1];
+  if (n.length === 3 || n.length === 4) {
+    const t = (k) => k + k, d = parseInt(t(n[0]), 16), c = parseInt(t(n[1]), 16), u = parseInt(t(n[2]), 16);
+    return { r: d, g: c, b: u };
   }
-  if (r.length === 6 || r.length === 8) {
-    const t = parseInt(r.slice(0, 2), 16), c = parseInt(r.slice(2, 4), 16), d = parseInt(r.slice(4, 6), 16);
-    return { r: t, g: c, b: d };
+  if (n.length === 6 || n.length === 8) {
+    const t = parseInt(n.slice(0, 2), 16), d = parseInt(n.slice(2, 4), 16), c = parseInt(n.slice(4, 6), 16);
+    return { r: t, g: d, b: c };
   }
 }
-function G(e) {
-  const n = (o) => {
-    const r = o / 255;
-    return r <= 0.03928 ? r / 12.92 : ((r + 0.055) / 1.055) ** 2.4;
+function I(e) {
+  const r = (o) => {
+    const n = o / 255;
+    return n <= 0.03928 ? n / 12.92 : ((n + 0.055) / 1.055) ** 2.4;
   };
-  return 0.2126 * n(e.r) + 0.7152 * n(e.g) + 0.0722 * n(e.b);
+  return 0.2126 * r(e.r) + 0.7152 * r(e.g) + 0.0722 * r(e.b);
 }
-function H(e, n, o) {
-  const r = Math.min(1, Math.max(0, o));
+function R(e, r, o) {
+  const n = Math.min(1, Math.max(0, o));
   return {
-    r: Math.round(e.r * (1 - r) + n.r * r),
-    g: Math.round(e.g * (1 - r) + n.g * r),
-    b: Math.round(e.b * (1 - r) + n.b * r)
+    r: Math.round(e.r * (1 - n) + r.r * n),
+    g: Math.round(e.g * (1 - n) + r.g * n),
+    b: Math.round(e.b * (1 - n) + r.b * n)
   };
 }
-function I(e) {
-  const n = (o) => o.toString(16).padStart(2, "0");
-  return `#${n(e.r)}${n(e.g)}${n(e.b)}`;
+function M(e) {
+  const r = (o) => o.toString(16).padStart(2, "0");
+  return `#${r(e.r)}${r(e.g)}${r(e.b)}`;
 }
-function p(e) {
+function A(e) {
   return e === "grok" ? "grok" : "cursor";
 }
-function R(e, n) {
+function O(e, r) {
   let o = e;
-  if (typeof n.editorBackground == "string" && u(n.editorBackground)) {
-    const r = n.editorBackground;
+  if (typeof r.editorBackground == "string" && F(r.editorBackground)) {
+    const n = r.editorBackground;
     o = {
       ...o,
-      editor: r,
-      chrome: r,
-      sidebar: r,
-      elevated: r
+      editor: n,
+      chrome: n,
+      sidebar: n,
+      elevated: n
     };
   }
-  if (typeof n.editorForeground == "string" && u(n.editorForeground)) {
-    const r = n.editorForeground;
+  if (typeof r.editorForeground == "string" && F(r.editorForeground)) {
+    const n = r.editorForeground;
     o = {
       ...o,
-      foreground: r,
-      foregroundSecondary: r,
-      foregroundTertiary: r,
-      foregroundQuaternary: r
+      foreground: n,
+      foregroundSecondary: n,
+      foregroundTertiary: n,
+      foregroundQuaternary: n
     };
   }
   return o;
 }
-function M(e, n) {
-  const o = u(n);
+function q(e, r) {
+  const o = F(r);
   if (!o)
     return e;
-  const r = H(o, { r: 255, g: 255, b: 255 }, 0.12), t = G(o) > 0.45 ? "#141414" : "#FAFAFA";
+  const n = R(o, { r: 255, g: 255, b: 255 }, 0.12), t = I(o) > 0.45 ? "#141414" : "#FAFAFA";
   return {
     ...e,
-    accent: n,
-    buttonBackground: n,
-    buttonHoverBackground: I(r),
-    link: n,
-    strokeFocused: n,
+    accent: r,
+    buttonBackground: r,
+    buttonHoverBackground: M(n),
+    link: r,
+    strokeFocused: r,
     buttonForeground: t
   };
 }
-const O = /* @__PURE__ */ new Set(["light", "hc-light"]);
-function q(e) {
-  return O.has(e);
+const Q = /* @__PURE__ */ new Set(["light", "hc-light"]);
+function W(e) {
+  return Q.has(e);
 }
-function Q(e, n) {
-  const o = p(n == null ? void 0 : n.brand), r = q(e);
-  let t, c;
-  return o === "grok" ? (t = r ? b : A, c = r ? v : y) : (t = r ? l : s, c = r ? k : E), t = R(t, n ?? {}), o !== "grok" && typeof (n == null ? void 0 : n.primary) == "string" && (t = M(t, n.primary)), { tokens: F(t, c), palette: t, brand: o };
+function z(e, r) {
+  const o = A(r == null ? void 0 : r.brand), n = W(e);
+  let t;
+  o === "grok" ? t = n ? m : y : t = n ? l : s, t = O(t, r ?? {}), o !== "grok" && typeof (r == null ? void 0 : r.primary) == "string" && (t = q(t, r.primary));
+  const c = g(o === "grok" ? f : n ? p : E, t);
+  return { tokens: h(t, c), palette: t, brand: o };
 }
-function W(e) {
+function Y(e) {
   return e === "grok" ? {
     palette: a,
-    sequence: P
-  } : { palette: i, sequence: S };
+    sequence: x
+  } : { palette: i, sequence: T };
 }
-function z(e) {
-  return e === "grok" ? D : m;
+function $(e) {
+  return e === "grok" ? H : b;
 }
-function Y(e) {
-  return e === "grok" ? L : h;
+function _(e) {
+  return e === "grok" ? G : B;
 }
-function $() {
-  var n;
+function K() {
+  var r;
   if (typeof window > "u")
     return;
   const e = window.__cursorCanvas;
-  return (n = e == null ? void 0 : e.state) == null ? void 0 : n.theme;
+  return (r = e == null ? void 0 : e.state) == null ? void 0 : r.theme;
 }
-function _(e, n) {
+function N(e, r) {
   let o = typeof (e == null ? void 0 : e.kind) == "string" && e.kind.length > 0 ? e.kind : void 0;
-  o || (n ? o = n : typeof window < "u" && window.matchMedia ? o = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light" : o = "dark");
-  const r = {
-    brand: p(e == null ? void 0 : e.brand),
+  o || (r ? o = r : typeof window < "u" && window.matchMedia ? o = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light" : o = "dark");
+  const n = {
+    brand: A(e == null ? void 0 : e.brand),
     primary: typeof (e == null ? void 0 : e.primary) == "string" ? e.primary : void 0,
     editorBackground: typeof (e == null ? void 0 : e.editorBackground) == "string" ? e.editorBackground : void 0,
     editorForeground: typeof (e == null ? void 0 : e.editorForeground) == "string" ? e.editorForeground : void 0
-  }, { tokens: t, palette: c, brand: d } = Q(o, r), g = W(d);
+  }, { tokens: t, palette: d, brand: c } = z(o, n), u = Y(c);
   return {
     ...t,
     kind: o,
-    brand: d,
+    brand: c,
     tokens: t,
-    palette: c,
+    palette: d,
     category: t.category,
-    radius: z(d),
-    typography: Y(d),
-    chart: g,
-    spacing: x
+    radius: $(c),
+    typography: _(c),
+    chart: u,
+    spacing: L
   };
 }
-function w(e) {
-  const n = $();
-  return _(n, e);
+function X(e) {
+  const r = K();
+  return N(r, e);
 }
 export {
-  A as a,
-  b,
+  y as a,
+  m as b,
   s as c,
   l as d,
-  U as e,
-  j as f,
-  E as g,
-  k as h,
-  K as i,
-  w as r,
-  N as u
+  J as e,
+  V as f,
+  C as g,
+  P as h,
+  U as i,
+  X as r,
+  j as u
 };

package/dist/host-tokens-Lz69pkRj.cjs

@@ -0,0 +1 @@
+"use strict";const g={foreground:"#E4E4E4EB",foregroundSecondary:"#E4E4E48D",foregroundTertiary:"#E4E4E45E",foregroundQuaternary:"#E4E4E442",editor:"#181818",chrome:"#141414",sidebar:"#141414",elevated:"#181818",fillPrimary:"#E4E4E430",fillSecondary:"#E4E4E41E",fillTertiary:"#E4E4E411",fillQuaternary:"#E4E4E40A",strokePrimary:"#E4E4E433",strokeSecondary:"#E4E4E41F",strokeTertiary:"#E4E4E414",strokeFocused:"#599CE7",accent:"#599CE7",buttonBackground:"#599CE7",buttonForeground:"#191c22",buttonHoverBackground:"#6AABE9",link:"#87c3ff",diffInsertedLine:"#3FA26633",diffRemovedLine:"#B8004933",diffStripAdded:"#3FA2668F",diffStripRemoved:"#FC6B838F"},u={foreground:"#141414F0",foregroundSecondary:"#141414BD",foregroundTertiary:"#1414148A",foregroundQuaternary:"#1414145C",editor:"#FCFCFC",chrome:"#F8F8F8",sidebar:"#F3F3F3",elevated:"#FCFCFC",fillPrimary:"#14141433",fillSecondary:"#14141424",fillTertiary:"#14141414",fillQuaternary:"#1414140F",strokePrimary:"#14141433",strokeSecondary:"#1414141F",strokeTertiary:"#14141414",strokeFocused:"#3685BF",accent:"#3685BF",buttonBackground:"#3685BF",buttonForeground:"#FCFCFC",buttonHoverBackground:"#2E76AB",link:"#3685BF",diffInsertedLine:"#1F8A651F",diffRemovedLine:"#CF2D5614",diffStripAdded:"#1F8A65CC",diffStripRemoved:"#CF2D56CC"},P={accent:"#1084FE",buttonBackground:"#1084FE",buttonForeground:"#070707",buttonHoverBackground:"#459FFE",link:"#80BEFE",strokeFocused:"#1084FE"},S={accent:"#0C64C1",buttonBackground:"#0C64C1",buttonForeground:"#FAFAFA",buttonHoverBackground:"#1084FE",link:"#0C64C1",strokeFocused:"#0C64C1"},E={...g,...P},f={...u,...S},h={purple:"#7B64B8F0",green:"#1F8A65E8",yellow:"#E8C030E0",cyan:"#2A9A8AE0",pink:"#C85898E0",blue:"#2E79B5E0",orange:"#F0A040E0",red:"#C04848E0"},p={...h,orange:"#F0A088E0",red:"#CF2D56E0"},k={purple:"#9159FEF0",green:"#00C972E8",yellow:"#FF9800E0",cyan:"#00BCA6E0",pink:"#FF309BE0",blue:"#1084FEE0",orange:"#FF6700E0",red:"#FF263CE0"};function s(e,r){return{gray:r.foregroundTertiary,...e}}const y=s(h,g),B=s(p,u);s(k,E);s(k,f);const T=y,L=["blue","purple","green","yellow","cyan","pink","orange","red","gray"],i={green:"#1F8A65E8",darkGreen:"#0D855AE0",lightGreen:"#52B896E0",mintGreen:"#7DCAB0E0",blue:"#2E79B5E0",lightBlue:"#70B0D8E0",indigo:"#5A6CC0F0",lightIndigo:"#9AAADCE0",purple:"#7B64B8F0",lightPurple:"#AA98D8E0",warmPink:"#C85898E0",lightPink:"#E8A0C4E0",brightOrange:"#F0A040E0",deepOrange:"#C06028E0",goldenYellow:"#E8C030E0",darkAmber:"#C04848E0",warmPeach:"#F0A088E0",vibrantTeal:"#2A9A8AE0",muted:"#8888A8E0",neutralLine:"#888899D0"},a={green:"#00C972E8",darkGreen:"#009957E0",lightGreen:"#38D591E0",mintGreen:"#78E2B4E0",blue:"#1084FEE0",lightBlue:"#459FFEE0",indigo:"#0C64C1F0",lightIndigo:"#80BEFEE0",purple:"#9159FEF0",lightPurple:"#A97EFEE0",warmPink:"#FF309BE0",lightPink:"#FF5EB1E0",brightOrange:"#FF6700E0",deepOrange:"#C24E00E0",goldenYellow:"#FF9800E0",darkAmber:"#FF263CE0",warmPeach:"#FF8838E0",vibrantTeal:"#00BCA6E0",muted:"#777777E0",neutralLine:"#777777D0"},x=[i.green,i.lightBlue,i.indigo,i.brightOrange,i.deepOrange,i.goldenYellow,i.warmPink,i.warmPeach,i.purple,i.mintGreen,i.muted,i.vibrantTeal],D=[a.green,a.lightBlue,a.indigo,a.brightOrange,a.deepOrange,a.goldenYellow,a.warmPink,a.warmPeach,a.purple,a.mintGreen,a.muted,a.vibrantTeal],A={fontFamily:"inherit",h1:{fontSize:"24px",lineHeight:"30px",fontWeight:590},h2:{fontSize:"18px",lineHeight:"24px",fontWeight:590},h3:{fontSize:"16px",lineHeight:"22px",fontWeight:590},body:{fontSize:"14px",lineHeight:"20px",fontWeight:400},small:{fontSize:"12px",lineHeight:"16px",fontWeight:400}},G='ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif',H={"0.5":2,1:4,"1.5":6,2:8,"2.5":10,3:12,"3.5":14,4:16,"4.5":18,5:20,6:24,7:28,8:32,9:36,10:40},b={none:0,xs:2,sm:4,md:6,lg:8,xl:12,full:9999},I={...b,md:8,lg:10,xl:14},R={...A,fontFamily:G};function m(e,r){return{bg:{editor:e.editor,chrome:e.chrome,elevated:e.elevated},text:{primary:e.foreground,secondary:e.foregroundSecondary,tertiary:e.foregroundTertiary,quaternary:e.foregroundQuaternary,link:e.link,onAccent:e.buttonForeground},stroke:{primary:e.strokePrimary,secondary:e.strokeSecondary,tertiary:e.strokeTertiary,focused:e.strokeFocused},fill:{primary:e.fillPrimary,secondary:e.fillSecondary,tertiary:e.fillTertiary,quaternary:e.fillQuaternary},accent:{primary:e.accent,control:e.buttonBackground,controlHover:e.buttonHoverBackground},diff:{insertedLine:e.diffInsertedLine,removedLine:e.diffRemovedLine,stripAdded:e.diffStripAdded,stripRemoved:e.diffStripRemoved},category:r}}const q=m(g,y),M=m(u,B);function F(e){const r=e.trim(),o=/^#([0-9a-f]{3,8})$/i.exec(r);if(!o)return;const n=o[1];if(n.length===3||n.length===4){const t=C=>C+C,d=parseInt(t(n[0]),16),c=parseInt(t(n[1]),16),l=parseInt(t(n[2]),16);return{r:d,g:c,b:l}}if(n.length===6||n.length===8){const t=parseInt(n.slice(0,2),16),d=parseInt(n.slice(2,4),16),c=parseInt(n.slice(4,6),16);return{r:t,g:d,b:c}}}function O(e){const r=o=>{const n=o/255;return n<=.03928?n/12.92:((n+.055)/1.055)**2.4};return .2126*r(e.r)+.7152*r(e.g)+.0722*r(e.b)}function Q(e,r,o){const n=Math.min(1,Math.max(0,o));return{r:Math.round(e.r*(1-n)+r.r*n),g:Math.round(e.g*(1-n)+r.g*n),b:Math.round(e.b*(1-n)+r.b*n)}}function W(e){const r=o=>o.toString(16).padStart(2,"0");return`#${r(e.r)}${r(e.g)}${r(e.b)}`}function v(e){return e==="grok"?"grok":"cursor"}function z(e,r){let o=e;if(typeof r.editorBackground=="string"&&F(r.editorBackground)){const n=r.editorBackground;o={...o,editor:n,chrome:n,sidebar:n,elevated:n}}if(typeof r.editorForeground=="string"&&F(r.editorForeground)){const n=r.editorForeground;o={...o,foreground:n,foregroundSecondary:n,foregroundTertiary:n,foregroundQuaternary:n}}return o}function Y(e,r){const o=F(r);if(!o)return e;const n=Q(o,{r:255,g:255,b:255},.12),t=O(o)>.45?"#141414":"#FAFAFA";return{...e,accent:r,buttonBackground:r,buttonHoverBackground:W(n),link:r,strokeFocused:r,buttonForeground:t}}const $=new Set(["light","hc-light"]);function _(e){return $.has(e)}function K(e,r){const o=v(r==null?void 0:r.brand),n=_(e);let t;o==="grok"?t=n?f:E:t=n?u:g,t=z(t,r??{}),o!=="grok"&&typeof(r==null?void 0:r.primary)=="string"&&(t=Y(t,r.primary));const c=s(o==="grok"?k:n?p:h,t);return{tokens:m(t,c),palette:t,brand:o}}function N(e){return e==="grok"?{palette:a,sequence:D}:{palette:i,sequence:x}}function U(e){return e==="grok"?I:b}function j(e){return e==="grok"?R:A}function J(){var r;if(typeof window>"u")return;const e=window.__cursorCanvas;return(r=e==null?void 0:e.state)==null?void 0:r.theme}function V(e,r){let o=typeof(e==null?void 0:e.kind)=="string"&&e.kind.length>0?e.kind:void 0;o||(r?o=r:typeof window<"u"&&window.matchMedia?o=window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light":o="dark");const n={brand:v(e==null?void 0:e.brand),primary:typeof(e==null?void 0:e.primary)=="string"?e.primary:void 0,editorBackground:typeof(e==null?void 0:e.editorBackground)=="string"?e.editorBackground:void 0,editorForeground:typeof(e==null?void 0:e.editorForeground)=="string"?e.editorForeground:void 0},{tokens:t,palette:d,brand:c}=K(o,n),l=N(c);return{...t,kind:o,brand:c,tokens:t,palette:d,category:t.category,radius:U(c),typography:j(c),chart:l,spacing:H}}function X(e){const r=J();return V(r,e)}exports.canvasPaletteDark=g;exports.canvasPaletteGrokDark=E;exports.canvasPaletteGrokLight=f;exports.canvasPaletteLight=u;exports.canvasTokens=q;exports.canvasTokensLight=M;exports.categoryPaletteDark=y;exports.categoryPaletteLight=B;exports.colorPalette=T;exports.resolveThemeForColorScheme=X;exports.usageColorSequence=L;

package/dist/runtime.cjs

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),r=require("react"),u=require("react-dom/client"),l=require("@mantine/core"),g=require("./host-tokens-Cjzmp0z_.cjs");function d(t){return[t,t,t,t,t,t,t,t,t,t]}function f(t){const{typography:e,radius:n}=t;return l.createTheme({primaryColor:"accent",colors:{accent:d(t.palette.accent)},fontFamily:e.fontFamily,defaultRadius:`${n.md}`,radius:{xs:`${n.xs}px`,sm:`${n.sm}px`,md:`${n.md}px`,lg:`${n.lg}px`,xl:`${n.xl}px`},headings:{fontFamily:e.fontFamily,fontWeight:String(e.h1.fontWeight),sizes:{h1:{fontSize:e.h1.fontSize,lineHeight:e.h1.lineHeight,fontWeight:String(e.h1.fontWeight)},h2:{fontSize:e.h2.fontSize,lineHeight:e.h2.lineHeight,fontWeight:String(e.h2.fontWeight)},h3:{fontSize:e.h3.fontSize,lineHeight:e.h3.lineHeight,fontWeight:String(e.h3.fontWeight)},h4:{fontSize:e.body.fontSize,lineHeight:e.body.lineHeight,fontWeight:String(e.body.fontWeight)}}}})}function y(t){const e=window.matchMedia("(prefers-color-scheme: dark)");return e.addEventListener("change",t),()=>e.removeEventListener("change",t)}function S(){return window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}function p(t){const e=r.useSyncExternalStore(y,S,()=>"light");return t==="dark"?"dark":t==="light"?"light":e}function m({children:t,defaultColorScheme:e="auto"}){const n=p(e),o=r.useMemo(()=>g.resolveThemeForColorScheme(n),[n]),s=r.useMemo(()=>f(o),[o]);return i.jsx(l.MantineProvider,{theme:s,defaultColorScheme:e,forceColorScheme:n,children:i.jsxs("div",{"data-cursor-canvas-host":!0,style:{minHeight:"inherit",background:o.bg.editor,color:o.text.primary,fontFamily:o.typography.fontFamily},children:[i.jsx("style",{children:`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),r=require("react"),u=require("react-dom/client"),l=require("@mantine/core"),g=require("./host-tokens-Lz69pkRj.cjs");function d(t){return[t,t,t,t,t,t,t,t,t,t]}function f(t){const{typography:e,radius:n}=t;return l.createTheme({primaryColor:"accent",colors:{accent:d(t.palette.accent)},fontFamily:e.fontFamily,defaultRadius:`${n.md}`,radius:{xs:`${n.xs}px`,sm:`${n.sm}px`,md:`${n.md}px`,lg:`${n.lg}px`,xl:`${n.xl}px`},headings:{fontFamily:e.fontFamily,fontWeight:String(e.h1.fontWeight),sizes:{h1:{fontSize:e.h1.fontSize,lineHeight:e.h1.lineHeight,fontWeight:String(e.h1.fontWeight)},h2:{fontSize:e.h2.fontSize,lineHeight:e.h2.lineHeight,fontWeight:String(e.h2.fontWeight)},h3:{fontSize:e.h3.fontSize,lineHeight:e.h3.lineHeight,fontWeight:String(e.h3.fontWeight)},h4:{fontSize:e.body.fontSize,lineHeight:e.body.lineHeight,fontWeight:String(e.body.fontWeight)}}}})}function y(t){const e=window.matchMedia("(prefers-color-scheme: dark)");return e.addEventListener("change",t),()=>e.removeEventListener("change",t)}function S(){return window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}function p(t){const e=r.useSyncExternalStore(y,S,()=>"light");return t==="dark"?"dark":t==="light"?"light":e}function m({children:t,defaultColorScheme:e="auto"}){const n=p(e),o=r.useMemo(()=>g.resolveThemeForColorScheme(n),[n]),s=r.useMemo(()=>f(o),[o]);return i.jsx(l.MantineProvider,{theme:s,defaultColorScheme:e,forceColorScheme:n,children:i.jsxs("div",{"data-cursor-canvas-host":!0,style:{minHeight:"inherit",background:o.bg.editor,color:o.text.primary,fontFamily:o.typography.fontFamily},children:[i.jsx("style",{children:`
           [data-cursor-canvas-host] svg[viewBox][width='100%'] {
             max-height: unset !important;
           }

package/dist/runtime.js

@@ -2,7 +2,7 @@ import { jsx as i, jsxs as f } from "react/jsx-runtime";
 import { useMemo as c, useSyncExternalStore as l, StrictMode as g } from "react";
 import { createRoot as d } from "react-dom/client";
 import { MantineProvider as u, createTheme as y } from "@mantine/core";
-import { r as p } from "./host-tokens-Dh2BFFjv.js";
+import { r as p } from "./host-tokens-Bt6GPXN1.js";
 function S(t) {
   return [t, t, t, t, t, t, t, t, t, t];
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@flesler/cursor-canvas-web",
   "private": false,
-  "version": "1.2.0",
+  "version": "1.3.0",
   "repository": "github:flesler/cursor-canvas-web",
   "type": "module",
   "description": "Deploy your Cursor canvases to the web.",
@@ -56,6 +56,7 @@
     "test": "vitest run",
     "test:watch": "vitest",
     "sync:sdk": "bash scripts/sync-cursor-sdk-snapshot.sh",
+    "patch:vendor-paths": "tsx scripts/patch-vendor-paths.ts",
     "check:sdk-exports": "tsx scripts/diff-sdk-exports.ts --strict",
     "generate:contract-consumer": "tsx scripts/generate-contract-consumer.ts && npm run eslint -- --fix src/contract/consumer.ts",
     "test:contract": "npm run check:sdk-exports && npm run generate:contract-consumer && tsc --noEmit && npm run build:lib",
@@ -68,7 +69,7 @@
     "test:demo-screenshots": "bash scripts/test-demo-screenshots.sh",
     "test:demo-screenshots:update": "bash scripts/test-demo-screenshots.sh --update",
     "test:render-compat": "bash scripts/test-render-compat.sh",
-    "ci:local": "npm run typecheck && npm run lint && npm test && npm run test:contract:ci",
+    "ci:local": "npm run typecheck && npm run lint:fix && npm test && npm run test:contract:ci",
     "prepare": "[ \"$CI\" != \"true\" ] && [ -d node_modules/husky ] && husky || true",
     "prepublishOnly": "npm run typecheck && npm test && npm run check:sdk-exports && npm run build:lib"
   },

package/src/superset/chart-extra.d.ts

@@ -2,17 +2,17 @@
  * Superset chart options, passed through the `extra` prop. The Cursor IDE
  * ignores `extra`, so the same canvas renders there with SDK defaults.
  */
-import type { YAxisProps } from 'recharts';
+import type { YAxisProps } from 'recharts'
 
 /** Recharts `scale` shortcuts (`auto` + d3 scale names). */
-export type CanvasChartScale = NonNullable<YAxisProps['scale']>;
+export type CanvasChartScale = NonNullable<YAxisProps['scale']>
 
 /**
  * Recharts props forwarded to the value axis: Y on column and line charts, X on
  * horizontal bar charts. Non-linear scales default `domain` to `[1, 'dataMax']`.
  */
 export type CanvasChartValueAxisExtra = Pick<
-  Omit<YAxisProps, 'ref'>,
+	Omit<YAxisProps, 'ref'>,
   | 'scale'
   | 'domain'
   | 'type'
@@ -23,17 +23,17 @@ export type CanvasChartValueAxisExtra = Pick<
   | 'padding'
   | 'unit'
   | 'name'
->;
+>
 
 export type CanvasChartExtra = {
-  valueAxis?: CanvasChartValueAxisExtra;
-};
+	valueAxis?: CanvasChartValueAxisExtra
+}
 
-export type CanvasBarChartExtra = CanvasChartExtra;
+export type CanvasBarChartExtra = CanvasChartExtra
 
 export type CanvasLineChartExtra = CanvasChartExtra & {
-  /** Curved (`monotone`) segments; the IDE draws straight segments. */
-  smooth?: boolean;
-  /** Stack the filled areas. Requires `fill`. */
-  stacked?: boolean;
-};
+	/** Curved (`monotone`) segments; the IDE draws straight segments. */
+	smooth?: boolean;
+	/** Stack the filled areas. Requires `fill`. */
+	stacked?: boolean
+}

package/src/superset/index.d.ts

@@ -4,22 +4,22 @@
  *
  * Superset props on SDK components go under `extra`, which the IDE ignores.
  */
-import type { JSX } from 'react';
-import type { BarChartProps as SdkBarChartProps, LineChartProps as SdkLineChartProps } from '../vendor/canvas-sdk/index.js';
-import type { CanvasBarChartExtra, CanvasLineChartExtra } from './chart-extra.js';
+import type { JSX } from 'react'
+import type { BarChartProps as SdkBarChartProps, LineChartProps as SdkLineChartProps } from '../vendor/canvas-sdk/index.js'
+import type { CanvasBarChartExtra, CanvasLineChartExtra } from './chart-extra.js'
 
-export * from '../vendor/canvas-sdk/index.js';
-export type * from './chart-extra.js';
+export * from '../vendor/canvas-sdk/index.js'
+export type * from './chart-extra.js'
 
 export type BarChartProps = SdkBarChartProps & {
-  extra?: CanvasBarChartExtra;
-};
+	extra?: CanvasBarChartExtra
+}
 
 export type LineChartProps = SdkLineChartProps & {
-  extra?: CanvasLineChartExtra;
-  /** @deprecated Use `extra.smooth`. */
-  smooth?: boolean;
-};
+	extra?: CanvasLineChartExtra;
+	/** @deprecated Use `extra.smooth`. */
+	smooth?: boolean
+}
 
-export declare function BarChart(props: BarChartProps): JSX.Element;
-export declare function LineChart(props: LineChartProps): JSX.Element;
+export declare function BarChart(props: BarChartProps): JSX.Element
+export declare function LineChart(props: LineChartProps): JSX.Element

package/src/vendor/canvas/SKILL.md

@@ -64,7 +64,7 @@ The trigger is **user intent**, not response shape. Ask: would the user benefit
 - A **legend** when more than one series is shown, with the exact series names from the source data.
 - The **source and time range** in a small caption (e.g. "Source: Datadog · last 7 days"). If a value is a transformation (mean, p95, normalized, smoothed), say so in the label.
 
-**Component discovery:** prefer built-in `cursor/canvas` components over hand-rolled markup. The full public surface (components, hooks, prop types, tokens) is declared in `~/.cursor/skills-cursor/canvas/sdk/index.d.ts` and its sibling `.d.ts` files — read them when you need exact exports, prop shapes, or hook signatures rather than guessing. Referencing an export that does not exist is the most common runtime error.
+**Component discovery:** prefer built-in `cursor/canvas` components over hand-rolled markup. The full public surface (components, hooks, prop types, tokens) is declared in `../canvas-sdk/index.d.ts` and its sibling `.d.ts` files — read them when you need exact exports, prop shapes, or hook signatures rather than guessing. Referencing an export that does not exist is the most common runtime error.
 
 Apply the Design guidance below as you write, and complete its Pre-delivery self-check before returning the canvas.