@nxds/core 0.10.0 → 0.11.0

package/dist/runtime/index.cjs

@@ -2303,6 +2303,13 @@ var CHART_PALETTE_REFERENCES = [
   { palette: "rose", light: "600", dark: "200" },
   { palette: "indigo", light: "600", dark: "200" }
 ];
+var SYNTAX_PALETTE_REFERENCES = {
+  keyword: CHART_PALETTE_REFERENCES[3],
+  string: CHART_PALETTE_REFERENCES[1],
+  function: CHART_PALETTE_REFERENCES[4],
+  type: CHART_PALETTE_REFERENCES[0],
+  constant: CHART_PALETTE_REFERENCES[2]
+};
 
 // src/lib/apca-pairs.ts
 var COLOR_FAMILIES = [
@@ -2317,6 +2324,8 @@ var CATEGORICAL_INDICES = CHART_PALETTE_REFERENCES.map(
   (_, index) => index + 1
 );
 var CHART_STAGGER_LC = 4.5;
+var DIFF_SURFACES = ["success-subtle", "error-subtle"];
+var CODE_SURFACES = ["container", "container-hover", ...DIFF_SURFACES];
 var FOCUS_SURFACES = [
   "background",
   "container",
@@ -2376,11 +2385,23 @@ var APCA_PAIRS = [
     ink(`${family}-subtle-foreground`, `${family}-subtle-active`, "ui")
   ]),
   ...CATEGORICAL_INDICES.flatMap(
-    (index) => ["container", "background"].map((bg) => ({
+    (index) => ["container", "container-hover", "background"].map((bg) => ({
       ...ink(`chart-categorical-${index}`, bg, "ui"),
       offset: (index - 1) * CHART_STAGGER_LC
     }))
   ),
+  ...CODE_SURFACES.flatMap(
+    (bg) => Object.keys(SYNTAX_PALETTE_REFERENCES).map(
+      (role) => ink(`syntax-${role}`, bg, "ui")
+    )
+  ),
+  // codeBlockTheme also colours code with the text tokens, which already read
+  // on container and container-hover.
+  ...DIFF_SURFACES.flatMap((bg) => [
+    text("foreground", bg, "ui"),
+    text("muted-foreground", bg, "ui"),
+    text("muted-foreground-subtle", bg, "incidental")
+  ]),
   // Focus is the primary accent (components.md § Focus States), so it shares
   // one solved color with primary-subtle-foreground.
   ...FOCUS_SURFACES.flatMap((surface) => [
@@ -4461,6 +4482,14 @@ function deriveChart(mode) {
     ])
   );
 }
+function deriveSyntax(mode) {
+  return Object.fromEntries(
+    Object.entries(SYNTAX_PALETTE_REFERENCES).map(([role, reference]) => [
+      `--nx-color-syntax-${role}`,
+      getPaletteShade(reference.palette, reference[mode])
+    ])
+  );
+}
 function deriveAlpha(surfaceTone, mode, profile) {
   const tone = SURFACE_TONE[surfaceTone];
   const dark = mode === "dark";
@@ -4576,6 +4605,7 @@ function deriveThemeMode(input, mode) {
     ...deriveSecondary(mode),
     ...deriveStatus(mode),
     ...deriveChart(mode),
+    ...deriveSyntax(mode),
     ...deriveAlpha(surfaceTone, mode, profile),
     "--nx-color-focus-error": getPaletteShade(
       STATUS_PALETTE_FAMILIES.error,
@@ -5008,6 +5038,13 @@ var CHART_TOKEN_NAMES = [
   "chart-categorical-4",
   "chart-categorical-5"
 ];
+var SYNTAX_TOKEN_NAMES = [
+  "syntax-keyword",
+  "syntax-string",
+  "syntax-function",
+  "syntax-type",
+  "syntax-constant"
+];
 var FOCUS_TOKEN_NAMES = ["focus-default", "focus-error"];
 var ALPHA_TOKEN_NAMES = [
   "background-hover-alpha",
@@ -5026,6 +5063,7 @@ var SEMANTIC_TOKEN_REGISTRY = [
   ...metas("brand", BRAND_TOKEN_NAMES),
   ...metas("status", STATUS_TOKEN_NAMES),
   ...metas("chart", CHART_TOKEN_NAMES),
+  ...metas("syntax", SYNTAX_TOKEN_NAMES),
   ...metas("focus", FOCUS_TOKEN_NAMES),
   ...metas("alpha", ALPHA_TOKEN_NAMES)
 ];