@vettvangur/design-system 2.0.67 → 2.0.69

package/dist/index.js

@@ -3555,112 +3555,139 @@ async function generateTypography$1(fontSizes, lineHeights, config) {
   message(`finished generating typography`);
 }
 
-/**
- * design-system :: src/generators/tailwind/scales.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/scales.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
  */
 
-/**
- * Kebab.
- *
- * @param s - Value.
- * @returns Result of the operation.
- *
- * @generated
- * @example
- * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
- * // import { kebab } from '@vettvangur/design-system'
- *
- * kebab(s)
+/**
+ * Kebab.
+ *
+ * @param s - Value.
+ * @returns Result of the operation.
+ *
+ * @generated
+ * @example
+ * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
+ * // import { kebab } from '@vettvangur/design-system'
+ *
+ * kebab(s)
  */
 function kebab$1(s) {
   return String(s).trim().toLowerCase().replace(/\s+/g, '-').replace(/[^a-z0-9-]/g, '-').replace(/-+/g, '-').replace(/^-|-$/g, '');
 }
 
-/**
- * Mode key.
- *
- * @param raw - Value.
- * @returns Result of the operation.
- *
- * @generated
- * @example
- * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
- * // import { modeKey } from '@vettvangur/design-system'
- *
- * modeKey(raw)
+/**
+ * Mode key.
+ *
+ * @param raw - Value.
+ * @returns Result of the operation.
+ *
+ * @generated
+ * @example
+ * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
+ * // import { modeKey } from '@vettvangur/design-system'
+ *
+ * modeKey(raw)
  */
 function modeKey(raw) {
   return kebab$1(raw);
 }
 
-/**
- * Pick number.
- *
- * @param values - Value.
- * @param preferredMode - Value.
- * @returns Result of the operation.
- *
- * @generated
- * @example
- * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
- * // import { pickNumber } from '@vettvangur/design-system'
- *
- * pickNumber(values, preferredMode)
+/**
+ * Pick number.
+ *
+ * @param values - Value.
+ * @param preferredMode - Value.
+ * @returns Result of the operation.
+ *
+ * @generated
+ * @example
+ * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
+ * // import { pickNumber } from '@vettvangur/design-system'
+ *
+ * pickNumber(values, preferredMode)
  */
 function pickNumber(values, preferredMode) {
   if (!values || typeof values !== 'object') {
     return null;
   }
-  const direct = values[preferredMode];
-  if (typeof direct === 'number') {
+  const parseNumberLike = v => {
+    if (typeof v === 'number') {
+      return Number.isFinite(v) ? v : null;
+    }
+    if (typeof v !== 'string') {
+      return null;
+    }
+
+    // Accept numeric strings and common px strings from Figma variables.
+    // Examples: "2", "2px", "0px".
+    const s = v.trim();
+    if (!s) {
+      return null;
+    }
+
+    // Radius/spacing/border tokens are expected to be integer pixel values.
+    // If decimals are present, keep behavior explicit by rejecting them.
+    const m = /^-?\d+(?:px)?$/i.exec(s);
+    if (!m) {
+      return null;
+    }
+    const n = Number.parseInt(s.replace(/px$/i, ''), 10);
+    return Number.isFinite(n) ? n : null;
+  };
+  const direct = parseNumberLike(values[preferredMode]);
+  if (direct != null) {
     return direct;
   }
   const normalizedPreferred = modeKey(preferredMode) ;
-  if (normalizedPreferred && typeof values[normalizedPreferred] === 'number') {
-    return values[normalizedPreferred];
+  if (normalizedPreferred) {
+    const n = parseNumberLike(values[normalizedPreferred]);
+    if (n != null) {
+      return n;
+    }
   }
   const first = Object.values(values)[0];
-  return typeof first === 'number' ? first : null;
+  return parseNumberLike(first);
 }
 
-/**
- * Render theme.
- *
- * @param lines - Value.
- * @returns String result.
- *
- * @generated
- * @example
- * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
- * // import { renderTheme } from '@vettvangur/design-system'
- *
- * renderTheme(lines)
+/**
+ * Render theme.
+ *
+ * @param lines - Value.
+ * @returns String result.
+ *
+ * @generated
+ * @example
+ * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
+ * // import { renderTheme } from '@vettvangur/design-system'
+ *
+ * renderTheme(lines)
  */
 function renderTheme$1(lines) {
   return `@theme {\n${lines.join('\n')}\n}\n`;
 }
 
-/**
- * Ensure var.
- *
- * @param lines - Value.
- * @param varName - Value.
- * @param value - Value.
- * @returns Nothing.
- *
- * @generated
- * @example
- * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
- * // import { ensureVar } from '@vettvangur/design-system'
- *
- * ensureVar(lines, varName, value)
+/**
+ * Ensure var.
+ *
+ * @param lines - Value.
+ * @param varName - Value.
+ * @param value - Value.
+ * @returns Nothing.
+ *
+ * @generated
+ * @example
+ * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
+ * // import { ensureVar } from '@vettvangur/design-system'
+ *
+ * ensureVar(lines, varName, value)
  */
 function ensureVar(lines, varName, value) {
   const exists = lines.some(l => l.startsWith(`  ${varName}:`));
@@ -3670,20 +3697,20 @@ function ensureVar(lines, varName, value) {
 }
 
 // Hoisted: unit policy lives here
-/**
- * Add rem.
- *
- * @param map - Value.
- * @param name - Name or identifier.
- * @param n - Value.
- * @returns Nothing.
- *
- * @generated
- * @example
- * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
- * // import { addRem } from '@vettvangur/design-system'
- *
- * addRem(map, name, n)
+/**
+ * Add rem.
+ *
+ * @param map - Value.
+ * @param name - Name or identifier.
+ * @param n - Value.
+ * @returns Nothing.
+ *
+ * @generated
+ * @example
+ * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
+ * // import { addRem } from '@vettvangur/design-system'
+ *
+ * addRem(map, name, n)
  */
 function addRem(map, name, n) {
   if (n == null) {
@@ -3695,18 +3722,18 @@ function addRem(map, name, n) {
   map.set(name, n === 0 ? '0' : rem(n));
 }
 
-/**
- * Generate spacing css.
- *
- * @param scales - Value.
- * @returns String result.
- *
- * @generated
- * @example
- * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
- * // import { generateSpacingCss } from '@vettvangur/design-system'
- *
- * generateSpacingCss(scales)
+/**
+ * Generate spacing css.
+ *
+ * @param scales - Value.
+ * @returns String result.
+ *
+ * @generated
+ * @example
+ * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
+ * // import { generateSpacingCss } from '@vettvangur/design-system'
+ *
+ * generateSpacingCss(scales)
  */
 function generateSpacingCss(scales) {
   const map = new Map();
@@ -3746,18 +3773,18 @@ function generateSpacingCss(scales) {
   return `/* AUTO-GENERATED - DO NOT EDIT BY HAND */\n\n${renderTheme$1(lines)}`;
 }
 
-/**
- * Generate border css.
- *
- * @param scales - Value.
- * @returns String result.
- *
- * @generated
- * @example
- * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
- * // import { generateBorderCss } from '@vettvangur/design-system'
- *
- * generateBorderCss(scales)
+/**
+ * Generate border css.
+ *
+ * @param scales - Value.
+ * @returns String result.
+ *
+ * @generated
+ * @example
+ * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
+ * // import { generateBorderCss } from '@vettvangur/design-system'
+ *
+ * generateBorderCss(scales)
  */
 function generateBorderCss(scales) {
   const map = new Map();
@@ -3775,34 +3802,63 @@ function generateBorderCss(scales) {
   return `/* AUTO-GENERATED - DO NOT EDIT BY HAND */\n\n${renderTheme$1(lines)}`;
 }
 
-/**
- * Generate radius css.
- *
- * @param scales - Value.
- * @returns String result.
- *
- * @generated
- * @example
- * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
- * // import { generateRadiusCss } from '@vettvangur/design-system'
- *
- * generateRadiusCss(scales)
+/**
+ * Generate radius css.
+ *
+ * @param scales - Value.
+ * @returns String result.
+ *
+ * @generated
+ * @example
+ * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
+ * // import { generateRadiusCss } from '@vettvangur/design-system'
+ *
+ * generateRadiusCss(scales)
  */
 function generateRadiusCss(scales) {
+  const debug = !!process$1.env.DS_DEBUG;
+  const input = scales?.radius || {};
+  const inputKeys = Object.keys(input);
+  if (debug) {
+    console.log('[design-system] radius: token count =', inputKeys.length);
+    if (inputKeys.length) {
+      console.log('[design-system] radius: token key sample =', inputKeys.slice(0, 25).join(', '));
+    }
+  }
   const map = new Map();
-  for (const [tokenKey, token] of Object.entries(scales?.radius || {})) {
+  let skippedManual = 0;
+  let skippedNull = 0;
+  const skippedNullSample = [];
+  for (const [tokenKey, token] of Object.entries(input)) {
     const k = kebab$1(tokenKey);
 
     // skip these entirely (manual vars below)
     if (k === 'round' || k === 'circle') {
+      skippedManual++;
       continue;
     }
     const v = pickNumber(token?.values, 'Mode 1');
     if (v == null) {
+      skippedNull++;
+      if (debug && skippedNullSample.length < 8) {
+        const values = token?.values && typeof token.values === 'object' ? token.values : null;
+        skippedNullSample.push({
+          key: tokenKey,
+          type: token?.type ?? null,
+          modes: values ? Object.keys(values).slice(0, 10) : [],
+          valuesSample: values ? Object.fromEntries(Object.entries(values).slice(0, 3)) : null
+        });
+      }
       continue;
     }
     addRem(map, `--radius-${k}`, v);
   }
+  if (debug) {
+    console.log('[design-system] radius: emitted =', map.size, '| skipped(manual)=', skippedManual, '| skipped(null)=', skippedNull);
+    if (skippedNullSample.length) {
+      console.log('[design-system] radius: skipped(null) sample =', JSON.stringify(skippedNullSample, null, 2));
+    }
+  }
   const lines = Array.from(map.entries()).map(([k, v]) => `  ${k}: ${v};`);
 
   // manual required defaults
@@ -3812,18 +3868,18 @@ function generateRadiusCss(scales) {
   return `/* AUTO-GENERATED - DO NOT EDIT BY HAND */\n\n${renderTheme$1(lines)}`;
 }
 
-/**
- * Generate scales.
- *
- * @param variableSet - Value.
- * @param config - Configuration object.
- * @returns Nothing.
- *
- * @example
- * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
- * // import { generateScales } from '@vettvangur/design-system'
- *
- * await generateScales(variableSet, {})
+/**
+ * Generate scales.
+ *
+ * @param variableSet - Value.
+ * @param config - Configuration object.
+ * @returns Nothing.
+ *
+ * @example
+ * // design-system (src/tools/javascript/design-system/src/generators/tailwind/scales.mjs)
+ * // import { generateScales } from '@vettvangur/design-system'
+ *
+ * await generateScales(variableSet, {})
  */
 async function generateScales(variableSet, config) {
   message('generating spacing/border/radius theme variables');
@@ -3834,6 +3890,10 @@ async function generateScales(variableSet, config) {
   const spacingCss = generateSpacingCss(variableSet);
   const borderCss = generateBorderCss(variableSet);
   const radiusCss = generateRadiusCss(variableSet);
+  if (process$1.env.DS_DEBUG) {
+    const outPath = path.join(outDir, 'radius.css');
+    console.log('[design-system] radius: writing', outPath);
+  }
   await fs$1.writeFile(path.join(outDir, 'spacing.css'), spacingCss, 'utf8');
   await fs$1.writeFile(path.join(outDir, 'border.css'), borderCss, 'utf8');
   await fs$1.writeFile(path.join(outDir, 'radius.css'), radiusCss, 'utf8');

package/package.json

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