@vettvangur/design-system 2.0.37 → 2.0.38

package/dist/index.js

@@ -3523,15 +3523,15 @@ async function generateShadows(variableSet, config) {
   message(`finished generating shadows (${lines.length})`);
 }
 
-/**
- * design-system :: src/generators/tailwind/screens.mjs.
- *
- * Design token tooling: pulls from Figma and generates platform outputs (Razor/Astro/Tailwind).
- *
- * These docs are generated from inline JSDoc in the repo and are intended for contributors.
- *
- * @generated
- * @module design-system
+/**
+ * design-system :: src/generators/tailwind/screens.mjs.
+ *
+ * Design token tooling: pulls from Figma and generates platform outputs (Razor/Astro/Tailwind).
+ *
+ * These docs are generated from inline JSDoc in the repo and are intended for contributors.
+ *
+ * @generated
+ * @module design-system
  */
 const BASE_SCREENS = {
   'phone-xs': 0,
@@ -3565,33 +3565,36 @@ function buildScreensCss(extra = {}) {
   const keys = Object.keys(merged).sort((a, b) => a.localeCompare(b, 'en'));
   const lines = ['/* AUTO-GENERATED - DO NOT EDIT BY HAND */', '', '@theme {'];
   for (const key of keys) {
-    lines.push(`  --breakpoint-${key}: ${merged[key]};`);
+    // Base breakpoints are pixel values and should be remified.
+    // Figma-provided Screens values are already authored as unit-less values.
+    const v = Object.hasOwn(BASE_SCREENS, key) ? rem(merged[key]) : String(merged[key]);
+    lines.push(`  --breakpoint-${key}: ${v};`);
   }
   lines.push('}', '');
   return `${lines.join('\n')}\n`;
 }
 
-/**
- * Generate screens.
- *
- * Writes `screens.css` containing the built-in breakpoints plus any additional
- * breakpoint values found in the Figma variable collection named `Screens`.
- *
- * The Figma variable collection is expected to be present under
- * `figmaVariables.screens.tokens` (collection keys are kebab-cased).
- *
- * Existing built-in breakpoints are never removed. If Figma provides a token
- * with the same key as a built-in breakpoint, the built-in value wins.
- *
- * @param figmaVariables - Raw Figma variables map (from `src/figma/index.mjs`).
- * @param config - Configuration object.
- * @returns Nothing.
- *
- * @example
- * // design-system (src/tools/javascript/design-system/src/generators/tailwind/screens.mjs)
- * // import { generateScreens } from '@vettvangur/design-system'
- *
- * await generateScreens({ screens: { tokens: { kiosk: { values: { Default: 1920 } } } } }, { paths: { styles: './src/styles' } })
+/**
+ * Generate screens.
+ *
+ * Writes `screens.css` containing the built-in breakpoints plus any additional
+ * breakpoint values found in the Figma variable collection named `Screens`.
+ *
+ * The Figma variable collection is expected to be present under
+ * `figmaVariables.screens.tokens` (collection keys are kebab-cased).
+ *
+ * Existing built-in breakpoints are never removed. If Figma provides a token
+ * with the same key as a built-in breakpoint, the built-in value wins.
+ *
+ * @param figmaVariables - Raw Figma variables map (from `src/figma/index.mjs`).
+ * @param config - Configuration object.
+ * @returns Nothing.
+ *
+ * @example
+ * // design-system (src/tools/javascript/design-system/src/generators/tailwind/screens.mjs)
+ * // import { generateScreens } from '@vettvangur/design-system'
+ *
+ * await generateScreens({ screens: { tokens: { kiosk: { values: { Default: 1920 } } } } }, { paths: { styles: './src/styles' } })
  */
 async function generateScreens(figmaVariables, config) {
   message('generating breakpoints...');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vettvangur/design-system",
-  "version": "2.0.37",
+  "version": "2.0.38",
   "description": "",
   "access": "public",
   "type": "module",