@cascivo/tokens 0.3.1 → 0.3.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cascivo/tokens",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "private": false,
   "description": "Three-level CSS design tokens (primitive → semantic → component)",
   "keywords": [

package/src/index.css

@@ -214,6 +214,37 @@
     --cascivo-chart-grid: var(--cascivo-gray-200);
     --cascivo-chart-axis: var(--cascivo-gray-400);
 
+    /* ── Code Editor (@cascivo/editor) ──────────────────────────
+       Defined once here, not per-theme, to keep theme token parity. Chrome and
+       the syntax palette reference theme-overridden semantic/chart tokens, so
+       they adapt across light/dark/warm (and every theme) automatically; the
+       literal fallbacks keep a theme-less `@cascivo/editor` import readable. */
+
+    /* Chrome */
+    --cascivo-editor-bg: var(--cascivo-color-surface, oklch(0.985 0.002 264));
+    --cascivo-editor-fg: var(--cascivo-color-foreground, oklch(0.205 0.005 264));
+    --cascivo-editor-gutter-bg: var(--cascivo-color-surface-2, oklch(0.967 0.003 264));
+    --cascivo-editor-gutter-fg: var(--cascivo-color-text-muted, oklch(0.55 0.018 264));
+    --cascivo-editor-current-line: var(--cascivo-color-active-bg, oklch(0.55 0.02 264 / 8%));
+    --cascivo-editor-selection: var(--cascivo-color-accent-muted, oklch(0.882 0.095 250));
+    --cascivo-editor-border: var(--cascivo-color-border, oklch(0.928 0.006 264));
+
+    /* Syntax palette — one token per TokenKind */
+    --cascivo-editor-syntax-keyword: var(--cascivo-color-accent, oklch(0.52 0.2 250));
+    --cascivo-editor-syntax-string: var(--cascivo-chart-3, oklch(0.52 0.13 150));
+    --cascivo-editor-syntax-number: var(--cascivo-chart-6, oklch(0.55 0.16 40));
+    --cascivo-editor-syntax-comment: var(--cascivo-color-foreground-muted, oklch(0.55 0.018 264));
+    --cascivo-editor-syntax-function: var(--cascivo-chart-5, oklch(0.5 0.16 265));
+    --cascivo-editor-syntax-type: var(--cascivo-chart-7, oklch(0.52 0.15 320));
+    --cascivo-editor-syntax-operator: var(--cascivo-color-foreground-muted, oklch(0.5 0.04 264));
+    --cascivo-editor-syntax-punctuation: var(--cascivo-color-text-subtle, oklch(0.446 0.018 264));
+    --cascivo-editor-syntax-variable: var(--cascivo-editor-fg);
+    --cascivo-editor-syntax-tag: var(--cascivo-color-accent, oklch(0.52 0.2 250));
+    --cascivo-editor-syntax-attr: var(--cascivo-chart-6, oklch(0.55 0.16 40));
+    --cascivo-editor-syntax-regexp: var(--cascivo-chart-3, oklch(0.52 0.13 150));
+    --cascivo-editor-syntax-boolean: var(--cascivo-chart-6, oklch(0.55 0.16 40));
+    --cascivo-editor-syntax-property: var(--cascivo-chart-2, oklch(0.5 0.13 240));
+
     /* ── Brand (apps/logo/OG only — never used in component CSS) ── */
     --cascivo-brand-primary: oklch(
       0.55 0.15 240

package/src/tokens.d.ts

@@ -98,6 +98,27 @@ export type CascivoToken =
   | '--cascivo-ease-in'
   | '--cascivo-ease-in-out'
   | '--cascivo-ease-out'
+  | '--cascivo-editor-bg'
+  | '--cascivo-editor-border'
+  | '--cascivo-editor-current-line'
+  | '--cascivo-editor-fg'
+  | '--cascivo-editor-gutter-bg'
+  | '--cascivo-editor-gutter-fg'
+  | '--cascivo-editor-selection'
+  | '--cascivo-editor-syntax-attr'
+  | '--cascivo-editor-syntax-boolean'
+  | '--cascivo-editor-syntax-comment'
+  | '--cascivo-editor-syntax-function'
+  | '--cascivo-editor-syntax-keyword'
+  | '--cascivo-editor-syntax-number'
+  | '--cascivo-editor-syntax-operator'
+  | '--cascivo-editor-syntax-property'
+  | '--cascivo-editor-syntax-punctuation'
+  | '--cascivo-editor-syntax-regexp'
+  | '--cascivo-editor-syntax-string'
+  | '--cascivo-editor-syntax-tag'
+  | '--cascivo-editor-syntax-type'
+  | '--cascivo-editor-syntax-variable'
   | '--cascivo-focus-ring'
   | '--cascivo-font-bold'
   | '--cascivo-font-display'

package/tokens.json

@@ -1079,6 +1079,153 @@
     "value": "0.5",
     "canonical": true
   },
+  {
+    "name": "--cascivo-editor-bg",
+    "category": "other",
+    "role": "editor-bg",
+    "value": "var(--cascivo-color-surface, oklch(0.985 0.002 264))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-border",
+    "category": "other",
+    "role": "editor-border",
+    "value": "var(--cascivo-color-border, oklch(0.928 0.006 264))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-current-line",
+    "category": "other",
+    "role": "editor-current-line",
+    "value": "var(--cascivo-color-active-bg, oklch(0.55 0.02 264 / 8%))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-fg",
+    "category": "other",
+    "role": "editor-fg",
+    "value": "var(--cascivo-color-foreground, oklch(0.205 0.005 264))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-gutter-bg",
+    "category": "other",
+    "role": "editor-gutter-bg",
+    "value": "var(--cascivo-color-surface-2, oklch(0.967 0.003 264))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-gutter-fg",
+    "category": "other",
+    "role": "editor-gutter-fg",
+    "value": "var(--cascivo-color-text-muted, oklch(0.55 0.018 264))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-selection",
+    "category": "other",
+    "role": "editor-selection",
+    "value": "var(--cascivo-color-accent-muted, oklch(0.882 0.095 250))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-attr",
+    "category": "other",
+    "role": "editor-syntax-attr",
+    "value": "var(--cascivo-chart-6, oklch(0.55 0.16 40))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-boolean",
+    "category": "other",
+    "role": "editor-syntax-boolean",
+    "value": "var(--cascivo-chart-6, oklch(0.55 0.16 40))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-comment",
+    "category": "other",
+    "role": "editor-syntax-comment",
+    "value": "var(--cascivo-color-foreground-muted, oklch(0.55 0.018 264))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-function",
+    "category": "other",
+    "role": "editor-syntax-function",
+    "value": "var(--cascivo-chart-5, oklch(0.5 0.16 265))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-keyword",
+    "category": "other",
+    "role": "editor-syntax-keyword",
+    "value": "var(--cascivo-color-accent, oklch(0.52 0.2 250))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-number",
+    "category": "other",
+    "role": "editor-syntax-number",
+    "value": "var(--cascivo-chart-6, oklch(0.55 0.16 40))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-operator",
+    "category": "other",
+    "role": "editor-syntax-operator",
+    "value": "var(--cascivo-color-foreground-muted, oklch(0.5 0.04 264))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-property",
+    "category": "other",
+    "role": "editor-syntax-property",
+    "value": "var(--cascivo-chart-2, oklch(0.5 0.13 240))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-punctuation",
+    "category": "other",
+    "role": "editor-syntax-punctuation",
+    "value": "var(--cascivo-color-text-subtle, oklch(0.446 0.018 264))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-regexp",
+    "category": "other",
+    "role": "editor-syntax-regexp",
+    "value": "var(--cascivo-chart-3, oklch(0.52 0.13 150))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-string",
+    "category": "other",
+    "role": "editor-syntax-string",
+    "value": "var(--cascivo-chart-3, oklch(0.52 0.13 150))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-tag",
+    "category": "other",
+    "role": "editor-syntax-tag",
+    "value": "var(--cascivo-color-accent, oklch(0.52 0.2 250))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-type",
+    "category": "other",
+    "role": "editor-syntax-type",
+    "value": "var(--cascivo-chart-7, oklch(0.52 0.15 320))",
+    "canonical": true
+  },
+  {
+    "name": "--cascivo-editor-syntax-variable",
+    "category": "other",
+    "role": "editor-syntax-variable",
+    "value": "var(--cascivo-editor-fg)",
+    "canonical": true
+  },
   {
     "name": "--cascivo-hover-opacity",
     "category": "other",