@nxds/core 0.9.1 → 0.10.0

package/dist/runtime/catalogue.d.cts

@@ -15,8 +15,8 @@ type DeepReadonly<T> = T extends object ? {
 type CatalogueFamily = 'borderwidth' | 'breakpoint' | 'color' | 'motion' | 'radius' | 'shadow' | 'spacing' | 'typography' | 'z-index';
 /**
  * Canonical identity: an identifier in the `--nx-*` custom property scheme.
- * Most tokens declare it in the generated CSS. Typography and shadow styles
- * and breakpoints do not; they declare a theme property or a utility instead.
+ * Most tokens declare it in the generated CSS. Typography styles and
+ * breakpoints do not; they declare a utility or a theme property instead.
  */
 type CatalogueTokenName = `--nx-${string}`;
 /** Another name that maps onto the canonical token. */
@@ -52,7 +52,7 @@ interface CatalogueDeclaration {
 interface CatalogueVariant {
     /**
      * The theme mode the value applies in (`light` / `dark` for a runtime
-     * colour or a shadow layer), or `null` when it applies in both.
+     * colour or a shadow), or `null` when it applies in both.
      */
     readonly mode: Mode | null;
     /**
@@ -68,8 +68,8 @@ interface CatalogueVariant {
     readonly authoredValue: TokenValue | null;
     /**
      * What the generated CSS declares: one custom property for a scalar or a
-     * shadow style (`--nx-spacing-4`, or `--breakpoint-md` and `--shadow-sm` for
-     * a token declared only under `@theme`), or the `@utility` body for a
+     * shadow style (`--nx-spacing-4`, `--nx-shadow-sm`, or `--breakpoint-md`
+     * for a token declared only under `@theme`), or the `@utility` body for a
      * typography style.
      */
     readonly declarations: readonly CatalogueDeclaration[];
@@ -106,6 +106,7 @@ interface CatalogueToken {
 /**
  * Every nxds token, identified by its `--nx-*` name: primitives, runtime
  * colours, spacing, z-index, breakpoints, and typography and shadow styles.
+ * Shadow layer primitives only compose the shadow styles.
  * Runtime colours are computed from `DEFAULT_NXDS_APPEARANCE` in explicit
  * light and dark modes; each variant records the appearance it used.
  */

package/dist/runtime/catalogue.d.ts

@@ -15,8 +15,8 @@ type DeepReadonly<T> = T extends object ? {
 type CatalogueFamily = 'borderwidth' | 'breakpoint' | 'color' | 'motion' | 'radius' | 'shadow' | 'spacing' | 'typography' | 'z-index';
 /**
  * Canonical identity: an identifier in the `--nx-*` custom property scheme.
- * Most tokens declare it in the generated CSS. Typography and shadow styles
- * and breakpoints do not; they declare a theme property or a utility instead.
+ * Most tokens declare it in the generated CSS. Typography styles and
+ * breakpoints do not; they declare a utility or a theme property instead.
  */
 type CatalogueTokenName = `--nx-${string}`;
 /** Another name that maps onto the canonical token. */
@@ -52,7 +52,7 @@ interface CatalogueDeclaration {
 interface CatalogueVariant {
     /**
      * The theme mode the value applies in (`light` / `dark` for a runtime
-     * colour or a shadow layer), or `null` when it applies in both.
+     * colour or a shadow), or `null` when it applies in both.
      */
     readonly mode: Mode | null;
     /**
@@ -68,8 +68,8 @@ interface CatalogueVariant {
     readonly authoredValue: TokenValue | null;
     /**
      * What the generated CSS declares: one custom property for a scalar or a
-     * shadow style (`--nx-spacing-4`, or `--breakpoint-md` and `--shadow-sm` for
-     * a token declared only under `@theme`), or the `@utility` body for a
+     * shadow style (`--nx-spacing-4`, `--nx-shadow-sm`, or `--breakpoint-md`
+     * for a token declared only under `@theme`), or the `@utility` body for a
      * typography style.
      */
     readonly declarations: readonly CatalogueDeclaration[];
@@ -106,6 +106,7 @@ interface CatalogueToken {
 /**
  * Every nxds token, identified by its `--nx-*` name: primitives, runtime
  * colours, spacing, z-index, breakpoints, and typography and shadow styles.
+ * Shadow layer primitives only compose the shadow styles.
  * Runtime colours are computed from `DEFAULT_NXDS_APPEARANCE` in explicit
  * light and dark modes; each variant records the appearance it used.
  */

package/dist/runtime/catalogue.js

@@ -2502,10 +2502,33 @@ var color_default = {
   }
 };
 
+// src/lib/token-scales.generated.ts
+var PRIMITIVE_PALETTE_NAMES = [
+  "green",
+  "emerald",
+  "teal",
+  "cyan",
+  "sky",
+  "indigo",
+  "violet",
+  "purple",
+  "fuchsia",
+  "pink",
+  "slate",
+  "rose",
+  "lime",
+  "yellow",
+  "blue",
+  "gray",
+  "zinc",
+  "neutral",
+  "stone",
+  "red",
+  "orange",
+  "amber"
+];
+
 // src/lib/primitive-palette.ts
-var PRIMITIVE_PALETTE_NAMES = Object.keys(color_default).filter(
-  (name) => name !== "white" && name !== "black"
-);
 var rampCache = /* @__PURE__ */ new Map();
 function getPaletteRamp(palette) {
   if (!PRIMITIVE_PALETTE_NAMES.includes(palette)) {
@@ -3168,6 +3191,15 @@ function formatShadowStyle(tokenPath, value, primitiveMap) {
   const isInset = tokenPath.length === 1 && tokenPath[0] === "inner";
   return formatShadowComposite(value, primitiveMap, isInset);
 }
+function inlineVariables(value, values) {
+  return value.replace(/var\((--[\w-]+)\)/g, (reference, name) => {
+    const literal = values.get(name);
+    if (literal === void 0) {
+      throw new Error(`inlineVariables: ${reference} has no value`);
+    }
+    return literal;
+  });
+}
 var TYPOGRAPHY_PROPERTIES = [
   ["fontFamily", "font-family"],
   ["fontSize", "font-size"],
@@ -11208,21 +11240,46 @@ function typographyStyleEntry(lookup) {
     };
   };
 }
-function shadowStyleEntry(lookup) {
-  return ({ leaf }) => {
+function shadowLayerSets(layers, lookup) {
+  const sets = /* @__PURE__ */ new Map();
+  for (const { preset, mode, leaf } of layers) {
+    const key = `${preset}/${mode}`;
+    const set = sets.get(key) ?? { preset, mode, values: /* @__PURE__ */ new Map() };
+    set.values.set(
+      primitiveName("shadow", leaf.path),
+      resolveValue(leaf.value, lookup, leaf.type, leaf.path)
+    );
+    sets.set(key, set);
+  }
+  return [...sets.values()];
+}
+function shadowStyleTokens(layers, lookup) {
+  const sets = shadowLayerSets(layers, lookup);
+  return styleLeaves("shadow", SHADOW_STYLES_FILE).map(({ leaf }) => {
     const key = pathToCssVarPrefixed(leaf.path, "shadow");
-    const property = `--${key}`;
+    const name = `--nx-${key}`;
+    const composite = formatShadowStyle(leaf.path, leaf.value, lookup);
     return {
-      name: `--nx-${key}`,
-      aliases: [cssVariable(property)],
-      declarations: [
-        {
-          property,
-          value: formatShadowStyle(leaf.path, leaf.value, lookup)
-        }
-      ]
+      name,
+      family: "shadow",
+      group: leafGroup("shadow", leaf.path),
+      type: leaf.type,
+      description: leaf.description ?? null,
+      aliases: [cssVariable(`--${key}`)],
+      control: PRESET_CONTROLS.shadow ?? null,
+      variants: sets.map(({ preset, mode, values }) => ({
+        mode,
+        preset,
+        source: { file: SHADOW_STYLES_FILE, path: leaf.path },
+        appearance: null,
+        authoredValue: structuredClone(leaf.value),
+        declarations: [
+          { property: name, value: inlineVariables(composite, values) }
+        ],
+        references: []
+      }))
     };
-  };
+  });
 }
 function styleLeaves(family, file) {
   return fileLeaves(family, file, SINGLE_SOURCE).filter(
@@ -11284,8 +11341,13 @@ function runtimeColorTokens() {
 function createTokenCatalogue() {
   const primitives = PRIMITIVE_FAMILIES.flatMap(primitiveLeaves);
   const lookup = primitiveLookup(primitives);
+  const shadowLayers = primitives.filter(({ family }) => family === "shadow");
   return [
-    ...authoredTokens(primitives, lookup, primitiveEntry(lookup)),
+    ...authoredTokens(
+      primitives.filter((leaf) => leaf.family !== "shadow"),
+      lookup,
+      primitiveEntry(lookup)
+    ),
     ...runtimeColorTokens(),
     ...authoredTokens(spacingLeaves(), lookup, spacingEntry),
     ...authoredTokens(
@@ -11303,11 +11365,7 @@ function createTokenCatalogue() {
       lookup,
       typographyStyleEntry(lookup)
     ),
-    ...authoredTokens(
-      styleLeaves("shadow", SHADOW_STYLES_FILE),
-      lookup,
-      shadowStyleEntry(lookup)
-    )
+    ...shadowStyleTokens(shadowLayers, lookup)
   ];
 }
 export {