@cascivo/tokens 0.3.5 → 0.3.8

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2024 urbanisierung
+Copyright (c) cascivo contributors
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/package.json

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

package/src/index.css

@@ -249,21 +249,25 @@
     --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 */
+    /* Syntax palette — one token per TokenKind. String/number/type/property (and
+       their aliases regexp/attr/boolean) are pinned to text-safe darker values
+       instead of the raw chart hues, which are tuned for 3:1 fills and fall below
+       WCAG AA 4.5:1 as code text on the light editor surface. Dark-surface themes
+       restore the brighter chart hues below (they clear 4.5:1 on a dark bg). */
     --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-string: oklch(0.53 0.13 135);
+    --cascivo-editor-syntax-number: oklch(0.54 0.15 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-type: oklch(0.54 0.12 350);
     --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));
+    --cascivo-editor-syntax-attr: oklch(0.54 0.15 40);
+    --cascivo-editor-syntax-regexp: oklch(0.53 0.13 135);
+    --cascivo-editor-syntax-boolean: oklch(0.54 0.15 40);
+    --cascivo-editor-syntax-property: oklch(0.53 0.12 240);
 
     /* ── Brand (apps/logo/OG only — never used in component CSS) ── */
     --cascivo-brand-primary: oklch(
@@ -313,6 +317,22 @@
     --cascivo-target-min-coarse: 2.75rem; /* 44px — Apple HIG comfortable touch target        */
   }
 
+  /* Dark-surface themes: restore the brighter chart hues for editor syntax, which
+     clear WCAG AA 4.5:1 on a dark editor background (the light-theme darkened
+     literals above would be too low-contrast there). */
+  [data-theme='dark'],
+  [data-theme='midnight'],
+  [data-theme='terminal'],
+  [data-theme='cyberpunk'] {
+    --cascivo-editor-syntax-string: var(--cascivo-chart-3);
+    --cascivo-editor-syntax-regexp: var(--cascivo-chart-3);
+    --cascivo-editor-syntax-number: var(--cascivo-chart-6);
+    --cascivo-editor-syntax-attr: var(--cascivo-chart-6);
+    --cascivo-editor-syntax-boolean: var(--cascivo-chart-6);
+    --cascivo-editor-syntax-type: var(--cascivo-chart-7);
+    --cascivo-editor-syntax-property: var(--cascivo-chart-2);
+  }
+
   /* All cascade motion derives from the duration tokens, so collapsing them
      disables every transition/animation library-wide. Continuous progress
      indicators (Spinner) use literal durations and opt out deliberately. */

package/src/tokens.d.ts

@@ -58,6 +58,7 @@ export type CascivoToken =
   | '--cascivo-color-foreground-muted'
   | '--cascivo-color-info'
   | '--cascivo-color-info-content'
+  | '--cascivo-color-info-foreground'
   | '--cascivo-color-info-subtle'
   | '--cascivo-color-primary'
   | '--cascivo-color-primary-active'
@@ -322,6 +323,7 @@ export type CascivoColorToken =
   | '--cascivo-color-foreground-muted'
   | '--cascivo-color-info'
   | '--cascivo-color-info-content'
+  | '--cascivo-color-info-foreground'
   | '--cascivo-color-info-subtle'
   | '--cascivo-color-primary'
   | '--cascivo-color-primary-active'

package/tokens.json

@@ -227,7 +227,7 @@
     "name": "--cascivo-chart-axis",
     "category": "color",
     "role": "chart-axis",
-    "value": "var(--cascivo-gray-400)",
+    "value": "oklch(0.5 0.016 264)",
     "canonical": true
   },
   {
@@ -399,7 +399,7 @@
     "name": "--cascivo-color-foreground-muted",
     "category": "color",
     "role": "color-foreground-muted",
-    "value": "oklch(0.554 0.018 264)",
+    "value": "oklch(0.5 0.018 264)",
     "canonical": false,
     "aliasOf": "--cascivo-color-text-muted"
   },
@@ -417,6 +417,13 @@
     "value": "oklch(1 0 0)",
     "canonical": true
   },
+  {
+    "name": "--cascivo-color-info-foreground",
+    "category": "color",
+    "role": "color-info-foreground",
+    "value": "oklch(0.45 0.19 250)",
+    "canonical": true
+  },
   {
     "name": "--cascivo-color-info-subtle",
     "category": "color",
@@ -557,7 +564,7 @@
     "name": "--cascivo-color-text-muted",
     "category": "color",
     "role": "color-text-muted",
-    "value": "var(--cascivo-gray-400)",
+    "value": "oklch(0.5 0.016 264)",
     "canonical": true
   },
   {
@@ -1132,14 +1139,14 @@
     "name": "--cascivo-editor-syntax-attr",
     "category": "other",
     "role": "editor-syntax-attr",
-    "value": "var(--cascivo-chart-6, oklch(0.55 0.16 40))",
+    "value": "oklch(0.54 0.15 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))",
+    "value": "oklch(0.54 0.15 40)",
     "canonical": true
   },
   {
@@ -1167,7 +1174,7 @@
     "name": "--cascivo-editor-syntax-number",
     "category": "other",
     "role": "editor-syntax-number",
-    "value": "var(--cascivo-chart-6, oklch(0.55 0.16 40))",
+    "value": "oklch(0.54 0.15 40)",
     "canonical": true
   },
   {
@@ -1181,7 +1188,7 @@
     "name": "--cascivo-editor-syntax-property",
     "category": "other",
     "role": "editor-syntax-property",
-    "value": "var(--cascivo-chart-2, oklch(0.5 0.13 240))",
+    "value": "oklch(0.53 0.12 240)",
     "canonical": true
   },
   {
@@ -1195,14 +1202,14 @@
     "name": "--cascivo-editor-syntax-regexp",
     "category": "other",
     "role": "editor-syntax-regexp",
-    "value": "var(--cascivo-chart-3, oklch(0.52 0.13 150))",
+    "value": "oklch(0.53 0.13 135)",
     "canonical": true
   },
   {
     "name": "--cascivo-editor-syntax-string",
     "category": "other",
     "role": "editor-syntax-string",
-    "value": "var(--cascivo-chart-3, oklch(0.52 0.13 150))",
+    "value": "oklch(0.53 0.13 135)",
     "canonical": true
   },
   {
@@ -1216,7 +1223,7 @@
     "name": "--cascivo-editor-syntax-type",
     "category": "other",
     "role": "editor-syntax-type",
-    "value": "var(--cascivo-chart-7, oklch(0.52 0.15 320))",
+    "value": "oklch(0.54 0.12 350)",
     "canonical": true
   },
   {