@mquan/mochi 0.1.0

package/dist/shared/design/tokens.js

@@ -0,0 +1,110 @@
+// Design tokens — the visual language. TS-shaped for ergonomic imports;
+// scripts/gen-tokens-css.ts flattens this into :root { --color-canvas: ... }
+// in web/src/design/tokens.css so non-React contexts (e.g. ShikiViewer's
+// overlay CSS) can consume the same values.
+//
+// Palette: dark mode, calm and professional, aligned with the existing
+// mochi shell (which inherits from miso). GitHub-dark / Primer-dark for
+// neutrals + accents, WCAG AA against canvas + panel. No neon, no gradient
+// backgrounds. Light theme deferred (tokens are structured to swap via
+// :root attribute later — out of scope for v1).
+export const tokens = {
+    color: {
+        canvas: "#0D1117",
+        panel: "#161B22",
+        overlay: "rgba(1, 4, 9, 0.7)",
+        text_primary: "#C9D1D9",
+        text_secondary: "#8B949E",
+        text_muted: "#6E7681",
+        text_inverse: "#0D1117",
+        accent: {
+            primary: {
+                fg: "#79C0FF",
+                bg: "rgba(56, 139, 253, 0.15)",
+                stroke: "#58A6FF",
+            },
+            success: {
+                fg: "#56D364",
+                bg: "rgba(46, 160, 67, 0.15)",
+                stroke: "#2EA043",
+            },
+            warning: {
+                fg: "#E3B341",
+                bg: "rgba(187, 128, 9, 0.15)",
+                stroke: "#BB8009",
+            },
+            error: {
+                fg: "#F85149",
+                bg: "rgba(218, 54, 51, 0.15)",
+                stroke: "#DA3633",
+            },
+            info: {
+                fg: "#79C0FF",
+                bg: "rgba(56, 139, 253, 0.15)",
+                stroke: "#58A6FF",
+            },
+            neutral: {
+                fg: "#8B949E",
+                bg: "rgba(139, 148, 158, 0.1)",
+                stroke: "#30363D",
+            },
+        },
+        border_default: "#30363D",
+        border_emphasis: "#484F58",
+        focus_ring: "#58A6FF",
+    },
+    space: {
+        xs: "4px",
+        sm: "8px",
+        md: "16px",
+        lg: "24px",
+        xl: "32px",
+        xxl: "48px",
+    },
+    radius: {
+        sm: "4px",
+        md: "8px",
+        lg: "12px",
+        pill: "999px",
+    },
+    shadow: {
+        e1: "0 1px 2px rgba(31, 35, 40, 0.06), 0 1px 1px rgba(31, 35, 40, 0.04)",
+        e2: "0 4px 8px rgba(31, 35, 40, 0.08), 0 2px 4px rgba(31, 35, 40, 0.04)",
+        e3: "0 12px 24px rgba(31, 35, 40, 0.12), 0 4px 8px rgba(31, 35, 40, 0.06)",
+    },
+    font: {
+        family_ui: "system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Helvetica, Arial, sans-serif",
+        family_mono: "ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace",
+        size: {
+            xs: "11px",
+            sm: "12px",
+            md: "14px",
+            lg: "16px",
+            xl: "20px",
+            xxl: "24px",
+        },
+        weight: {
+            regular: 400,
+            medium: 500,
+            semibold: 600,
+            bold: 700,
+        },
+        lineHeight: {
+            tight: 1.25,
+            normal: 1.5,
+            relaxed: 1.7,
+        },
+    },
+    motion: {
+        fast: "150ms ease-out",
+        medium: "250ms ease-out",
+        slow: "400ms ease-out",
+    },
+    zIndex: {
+        base: 0,
+        raised: 10,
+        overlay: 100,
+        tooltip: 1000,
+    },
+};
+//# sourceMappingURL=tokens.js.map

package/dist/shared/design/tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.js","sourceRoot":"","sources":["../../../shared/design/tokens.ts"],"names":[],"mappings":"AAAA,wEAAwE;AACxE,6EAA6E;AAC7E,yEAAyE;AACzE,4CAA4C;AAC5C,EAAE;AACF,uEAAuE;AACvE,wEAAwE;AACxE,2EAA2E;AAC3E,uEAAuE;AACvE,gDAAgD;AAEhD,MAAM,CAAC,MAAM,MAAM,GAAG;IACpB,KAAK,EAAE;QACL,MAAM,EAAE,SAAS;QACjB,KAAK,EAAE,SAAS;QAChB,OAAO,EAAE,oBAAoB;QAE7B,YAAY,EAAE,SAAS;QACvB,cAAc,EAAE,SAAS;QACzB,UAAU,EAAE,SAAS;QACrB,YAAY,EAAE,SAAS;QAEvB,MAAM,EAAE;YACN,OAAO,EAAE;gBACP,EAAE,EAAE,SAAS;gBACb,EAAE,EAAE,0BAA0B;gBAC9B,MAAM,EAAE,SAAS;aAClB;YACD,OAAO,EAAE;gBACP,EAAE,EAAE,SAAS;gBACb,EAAE,EAAE,yBAAyB;gBAC7B,MAAM,EAAE,SAAS;aAClB;YACD,OAAO,EAAE;gBACP,EAAE,EAAE,SAAS;gBACb,EAAE,EAAE,yBAAyB;gBAC7B,MAAM,EAAE,SAAS;aAClB;YACD,KAAK,EAAE;gBACL,EAAE,EAAE,SAAS;gBACb,EAAE,EAAE,yBAAyB;gBAC7B,MAAM,EAAE,SAAS;aAClB;YACD,IAAI,EAAE;gBACJ,EAAE,EAAE,SAAS;gBACb,EAAE,EAAE,0BAA0B;gBAC9B,MAAM,EAAE,SAAS;aAClB;YACD,OAAO,EAAE;gBACP,EAAE,EAAE,SAAS;gBACb,EAAE,EAAE,0BAA0B;gBAC9B,MAAM,EAAE,SAAS;aAClB;SACF;QAED,cAAc,EAAE,SAAS;QACzB,eAAe,EAAE,SAAS;QAC1B,UAAU,EAAE,SAAS;KACtB;IAED,KAAK,EAAE;QACL,EAAE,EAAE,KAAK;QACT,EAAE,EAAE,KAAK;QACT,EAAE,EAAE,MAAM;QACV,EAAE,EAAE,MAAM;QACV,EAAE,EAAE,MAAM;QACV,GAAG,EAAE,MAAM;KACZ;IAED,MAAM,EAAE;QACN,EAAE,EAAE,KAAK;QACT,EAAE,EAAE,KAAK;QACT,EAAE,EAAE,MAAM;QACV,IAAI,EAAE,OAAO;KACd;IAED,MAAM,EAAE;QACN,EAAE,EAAE,oEAAoE;QACxE,EAAE,EAAE,oEAAoE;QACxE,EAAE,EAAE,sEAAsE;KAC3E;IAED,IAAI,EAAE;QACJ,SAAS,EACP,0FAA0F;QAC5F,WAAW,EACT,4FAA4F;QAC9F,IAAI,EAAE;YACJ,EAAE,EAAE,MAAM;YACV,EAAE,EAAE,MAAM;YACV,EAAE,EAAE,MAAM;YACV,EAAE,EAAE,MAAM;YACV,EAAE,EAAE,MAAM;YACV,GAAG,EAAE,MAAM;SACZ;QACD,MAAM,EAAE;YACN,OAAO,EAAE,GAAG;YACZ,MAAM,EAAE,GAAG;YACX,QAAQ,EAAE,GAAG;YACb,IAAI,EAAE,GAAG;SACV;QACD,UAAU,EAAE;YACV,KAAK,EAAE,IAAI;YACX,MAAM,EAAE,GAAG;YACX,OAAO,EAAE,GAAG;SACb;KACF;IAED,MAAM,EAAE;QACN,IAAI,EAAE,gBAAgB;QACtB,MAAM,EAAE,gBAAgB;QACxB,IAAI,EAAE,gBAAgB;KACvB;IAED,MAAM,EAAE;QACN,IAAI,EAAE,CAAC;QACP,MAAM,EAAE,EAAE;QACV,OAAO,EAAE,GAAG;QACZ,OAAO,EAAE,IAAI;KACd;CACO,CAAC"}