@vettvangur/design-system 2.0.73 → 2.0.76

package/dist/index.js

@@ -2669,8 +2669,13 @@ const renderApplyLine = (prefix, token, indent = '  ') => {
   }
   if (prefix === 'border') {
     // Tailwind border color utilities are always `border-{token}`.
-    // If the token includes `border-` (e.g. `border-default`), this becomes `border-border-default`.
-    return `${indent}@apply border-${token};\n`;
+    // Our color keys are grouped (e.g. `border-default`), so border colors should always apply as
+    // `border-border-*`. If the token already starts with `border-`, keep it; otherwise namespace it.
+    const t = token.startsWith('border-') ? token : `border-${token}`;
+    if (process$1.env.DS_DEBUG) {
+      console.log('[design-system] button-variants: border token =', token, '=>', `border-${t}`);
+    }
+    return `${indent}@apply border-${t};\n`;
   }
   return `${indent}@apply ${prefix}-${token};\n`;
 };
@@ -3771,7 +3776,7 @@ function generateSpacingCss(scales) {
   const lines = Array.from(map.entries()).map(([k, v]) => `  ${k}: ${v};`);
 
   // manual required defaults
-  ensureVar(lines, '--spacing', '1px');
+  ensureVar(lines, '--spacing', rem(1));
   ensureVar(lines, '--spacing-0', '0');
   ensureVar(lines, '--spacing-auto', 'auto');
   ensureVar(lines, '--spacing-full', '100%');
@@ -3976,12 +3981,49 @@ function rgbaFromColor(color) {
   const r = color?.rgba?.r;
   const g = color?.rgba?.g;
   const b = color?.rgba?.b;
+  const normalizeRgbChannel = v => {
+    if (typeof v !== 'number' || Number.isNaN(v)) {
+      return null;
+    }
+
+    // Figma typically gives channels in 0..1, but some token sources provide 0..255.
+    if (v >= 0 && v <= 1) {
+      return Math.round(v * 255);
+    }
+
+    // Handle 16-bit channels (0..65535) defensively.
+    if (v > 255 && v <= 65535) {
+      return Math.round(Math.max(0, Math.min(255, v / 257)));
+    }
+    return Math.round(Math.max(0, Math.min(255, v)));
+  };
+  const normalizeAlpha = v => {
+    if (typeof v !== 'number' || Number.isNaN(v)) {
+      return null;
+    }
+
+    // Common cases: 0..1, percent (0..100), or 0..255.
+    let a = v;
+    if (a > 1 && a <= 100) {
+      a /= 100;
+    } else if (a > 100 && a <= 255) {
+      a /= 255;
+    }
+    a = Math.max(0, Math.min(1, a));
+
+    // Avoid long float tails from upstream values.
+    const rounded = Number(a.toFixed(4));
+    return String(rounded);
+  };
   if ([r, g, b, a].every(v => typeof v === 'number')) {
-    const rr = Math.round(r * 255);
-    const gg = Math.round(g * 255);
-    const bb = Math.round(b * 255);
-    const aa = Math.max(0, Math.min(1, a));
-    return `rgba(${rr} ${gg} ${bb} / ${aa})`;
+    const rr = normalizeRgbChannel(r);
+    const gg = normalizeRgbChannel(g);
+    const bb = normalizeRgbChannel(b);
+    const aa = normalizeAlpha(a);
+    if ([rr, gg, bb, aa].every(v => v != null)) {
+      // Use legacy comma-separated rgba() for maximum tool compatibility.
+      return `rgba(${rr}, ${gg}, ${bb}, ${aa})`;
+    }
   }
   const hex = String(color?.hex ?? '').trim();
   // supports #RRGGBB or #RRGGBBAA
@@ -3995,7 +4037,10 @@ function rgbaFromColor(color) {
   const gg = parseInt(rgb.slice(2, 4), 16);
   const bb = parseInt(rgb.slice(4, 6), 16);
   const alpha = aa ? parseInt(aa, 16) / 255 : 1;
-  return `rgba(${rr} ${gg} ${bb} / ${alpha})`;
+  const alphaStr = String(Number(Math.max(0, Math.min(1, alpha)).toFixed(4)));
+
+  // Use legacy comma-separated rgba() for maximum tool compatibility.
+  return `rgba(${rr}, ${gg}, ${bb}, ${alphaStr})`;
 }
 
 /**
@@ -4335,7 +4380,13 @@ async function generateTailwind(config, projectType, typography, buttons, colors
   message(pc.yellow('-=[ tailwind ]=-'));
   await generateFontFamily(typography.families, config);
   await generateFontWeight(typography.weights, config);
-  await generateButtons$1(buttons, config);
+  const skipButtonVariants = process.env.DS_SKIP_BUTTON_VARIANTS === '1' || process.env.DS_SKIP_BUTTON_VARIANTS === 'true' || config?.raw?.generators?.tailwind?.buttonVariants === false || config?.raw?.generators?.tailwind?.buttons === false;
+  const enableButtonVariants = process.env.DS_ENABLE_BUTTON_VARIANTS === '1' || process.env.DS_ENABLE_BUTTON_VARIANTS === 'true' || config?.raw?.generators?.tailwind?.buttonVariants === true || config?.raw?.generators?.tailwind?.buttons === true;
+  if (skipButtonVariants || !enableButtonVariants) {
+    message('skipping tailwind button variants generator');
+  } else {
+    await generateButtons$1(buttons, config);
+  }
   await generateBodies(typography.sizes, typography.lineHeights, config);
   await generateHeadlines(typography.sizes, typography.lineHeights, config);
   await generateTypography$1(typography.sizes, typography.lineHeights, config);

package/package.json

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