@vadimcomanescu/nadicode-design-system 4.0.7 → 4.0.9

package/dist/components/ui/charts/PieChart.js

@@ -1,4 +1,4 @@
 'use client';
-export { PieChart } from '../../../chunk-U7V6TREO.js';
-import '../../../chunk-WSU2PCA2.js';
+export { PieChart } from '../../../chunk-O4QTL2EQ.js';
+import '../../../chunk-B7ELF2FN.js';
 import '../../../chunk-QYZT24TS.js';

package/dist/components/ui/charts/RadarChart.js

@@ -1,4 +1,4 @@
 'use client';
-export { RadarChart } from '../../../chunk-LDW4LHUM.js';
-import '../../../chunk-WSU2PCA2.js';
+export { RadarChart } from '../../../chunk-UFZH45UL.js';
+import '../../../chunk-B7ELF2FN.js';
 import '../../../chunk-QYZT24TS.js';

package/dist/components/ui/charts/RadialBarChart.js

@@ -1,4 +1,4 @@
 'use client';
-export { RadialBarChart } from '../../../chunk-WAP7DBSW.js';
-import '../../../chunk-WSU2PCA2.js';
+export { RadialBarChart } from '../../../chunk-RAVRFGA5.js';
+import '../../../chunk-B7ELF2FN.js';
 import '../../../chunk-QYZT24TS.js';

package/dist/components/ui/charts/index.js

@@ -1,9 +1,9 @@
-export { RadialBarChart } from '../../../chunk-WAP7DBSW.js';
-export { AreaChart } from '../../../chunk-IPXL7WX7.js';
-export { BarChart } from '../../../chunk-UWHKZX4Y.js';
-export { HeatmapChart } from '../../../chunk-XCZIF75R.js';
-export { LineChart } from '../../../chunk-HRIEX66J.js';
-export { PieChart } from '../../../chunk-U7V6TREO.js';
-export { RadarChart } from '../../../chunk-LDW4LHUM.js';
-import '../../../chunk-WSU2PCA2.js';
+export { RadialBarChart } from '../../../chunk-RAVRFGA5.js';
+export { AreaChart } from '../../../chunk-ZTNHUABC.js';
+export { BarChart } from '../../../chunk-JICACDAV.js';
+export { HeatmapChart } from '../../../chunk-ENZ2HF3I.js';
+export { LineChart } from '../../../chunk-Z2NBLCSD.js';
+export { PieChart } from '../../../chunk-O4QTL2EQ.js';
+export { RadarChart } from '../../../chunk-UFZH45UL.js';
+import '../../../chunk-B7ELF2FN.js';
 import '../../../chunk-QYZT24TS.js';

package/dist/index.js

@@ -6,9 +6,9 @@ export { Slider } from './chunk-EV2V5RWT.js';
 export { ScrollArea, ScrollBar } from './chunk-GLU236NN.js';
 export { Progress } from './chunk-JWQXBRE7.js';
 export { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from './chunk-WH62BE24.js';
-export { Heading, headingVariants } from './chunk-WI547C47.js';
+export { Heading, headingVariants } from './chunk-UXX6HHPS.js';
 export { Popover, PopoverContent, PopoverTrigger } from './chunk-UYT33NG6.js';
-export { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from './chunk-W73JAOHW.js';
+export { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from './chunk-C6MJQDPC.js';
 export { Checkbox } from './chunk-756Q7AC5.js';
 export { Separator } from './chunk-CUZJIDU7.js';
 export { Input } from './chunk-AP3XXYAY.js';
@@ -16,7 +16,7 @@ export { Label } from './chunk-LIBXYD5Q.js';
 export { Skeleton } from './chunk-RASEB2XI.js';
 export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from './chunk-MJ4CB6ZL.js';
 import './chunk-KRBLVZII.js';
-export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './chunk-AH6YSYYT.js';
+export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './chunk-3HHLJH72.js';
 export { Avatar, AvatarFallback, AvatarImage } from './chunk-NAAU5IWU.js';
 export { Button, buttonVariants } from './chunk-7KIDDF3I.js';
 import './chunk-6FOHUNXR.js';

package/dist/lib/patterns.js

@@ -116,14 +116,13 @@ var gridPatterns = [
              radial-gradient(at 0% 100%, rgb(var(--color-border) / 0.5) 0px, transparent 50%)
           `
     },
-    code: `<div className="w-full min-h-dvh bg-surface relative overflow-hidden">
-          <div className="absolute inset-0 opacity-30" 
-              style={{
-                  backgroundImage: "radial-gradient(#000 1px, transparent 1px)",
-                  backgroundSize: "32px 32px"
-              }} 
-          />
-      </div>`
+    code: `<div className="w-full min-h-dvh" style={{
+       backgroundColor: "rgb(var(--color-surface))",
+       backgroundImage: \`
+         radial-gradient(at 100% 0%, rgb(var(--color-secondary) / 0.5) 0px, transparent 50%),
+         radial-gradient(at 0% 100%, rgb(var(--color-border) / 0.5) 0px, transparent 50%)
+       \`
+      }} />`
   },
   {
     id: "galactic-night",

package/dist/lib/tokens.config.d.ts

@@ -336,6 +336,56 @@ export namespace bloomScales {
         12: string;
     };
 }
+export const scaleSemantics: {
+    1: {
+        name: string;
+        role: string;
+    };
+    2: {
+        name: string;
+        role: string;
+    };
+    3: {
+        name: string;
+        role: string;
+    };
+    4: {
+        name: string;
+        role: string;
+    };
+    5: {
+        name: string;
+        role: string;
+    };
+    6: {
+        name: string;
+        role: string;
+    };
+    7: {
+        name: string;
+        role: string;
+    };
+    8: {
+        name: string;
+        role: string;
+    };
+    9: {
+        name: string;
+        role: string;
+    };
+    10: {
+        name: string;
+        role: string;
+    };
+    11: {
+        name: string;
+        role: string;
+    };
+    12: {
+        name: string;
+        role: string;
+    };
+};
 export namespace colorTokens {
     export namespace dark_1 {
         let background: string;

package/dist/tokens.d.ts

@@ -181,8 +181,15 @@ export interface StyleTokens {
     arctic: StyleTokenSet;
     bloom: StyleTokenSet;
 }
+/** Semantic role for each step in a 12-step color scale */
+export interface ScaleSemantic {
+    name: string;
+    role: string;
+}
+export type ScaleSemantics = Record<number, ScaleSemantic>;
 export declare const tokens: DesignTokens;
 export declare const colorTokens: ColorTokens;
 export declare const colorScales: ColorScales;
 export declare const bloomScales: BloomScales;
 export declare const styleTokens: StyleTokens;
+export declare const scaleSemantics: ScaleSemantics;

package/eslint-rules/nadicode/config.js

@@ -83,6 +83,9 @@ export const nadicodeRules = {
   "nadicode/no-handcoded-field": "error",
   "nadicode/require-catalog-component": "error",
   "nadicode/require-catalog-import": "error",
+  "nadicode/restrict-font-weight": "error",
+  "nadicode/no-glass-on-navigation": "error",
+  "nadicode/no-arbitrary-tracking": "error",
 };
 
 function normalizePattern(pattern) {

package/eslint-rules/nadicode/index.js

@@ -70,6 +70,9 @@ import noHandcodedEmptyState from "./rules/no-handcoded-empty-state.js";
 import noHandcodedField from "./rules/no-handcoded-field.js";
 import requireCatalogComponent from "./rules/require-catalog-component.js";
 import requireCatalogImport from "./rules/require-catalog-import.js";
+import restrictFontWeight from "./rules/restrict-font-weight.js";
+import noGlassOnNavigation from "./rules/no-glass-on-navigation.js";
+import noArbitraryTracking from "./rules/no-arbitrary-tracking.js";
 
 export { nadicodeRules, createAllowlistOverrides } from "./config.js";
 
@@ -147,5 +150,8 @@ export const nadicodePlugin = {
     "no-handcoded-field": noHandcodedField,
     "require-catalog-component": requireCatalogComponent,
     "require-catalog-import": requireCatalogImport,
+    "restrict-font-weight": restrictFontWeight,
+    "no-glass-on-navigation": noGlassOnNavigation,
+    "no-arbitrary-tracking": noArbitraryTracking,
   },
 };

package/eslint-rules/nadicode/rules/__tests__/no-arbitrary-tracking.test.js

@@ -0,0 +1,53 @@
+import { RuleTester } from "eslint";
+import { describe } from "vitest";
+import rule from "../no-arbitrary-tracking.js";
+
+const tester = new RuleTester({
+  languageOptions: {
+    ecmaVersion: "latest",
+    sourceType: "module",
+    parserOptions: {
+      ecmaFeatures: { jsx: true },
+    },
+  },
+});
+
+describe("no-arbitrary-tracking", () => {
+  tester.run("no-arbitrary-tracking", rule, {
+    valid: [
+      { code: '<h1 className="tracking-tight text-4xl" />' },
+      { code: '<h2 className="tracking-display" />' },
+      { code: '<span className="tracking-widest uppercase" />' },
+      { code: '<div className={cn("tracking-section", "text-3xl")} />' },
+    ],
+    invalid: [
+      {
+        code: '<h1 className="tracking-[0.18em] text-4xl" />',
+        errors: [
+          {
+            message:
+              "Arbitrary tracking value 'tracking-[0.18em]' is not allowed. Use a design token: tracking-display (-0.04em), tracking-section (-0.03em), tracking-sub (-0.02em), tracking-tight (-0.025em), tracking-normal (0), tracking-wide (0.025em), tracking-wider (0.05em), tracking-widest (0.1em).",
+          },
+        ],
+      },
+      {
+        code: '<span className="tracking-[-0.05em]" />',
+        errors: [
+          {
+            message:
+              "Arbitrary tracking value 'tracking-[-0.05em]' is not allowed. Use a design token: tracking-display (-0.04em), tracking-section (-0.03em), tracking-sub (-0.02em), tracking-tight (-0.025em), tracking-normal (0), tracking-wide (0.025em), tracking-wider (0.05em), tracking-widest (0.1em).",
+          },
+        ],
+      },
+      {
+        code: '<div className={cn("tracking-[0.2em]", "text-sm")} />',
+        errors: [
+          {
+            message:
+              "Arbitrary tracking value 'tracking-[0.2em]' is not allowed. Use a design token: tracking-display (-0.04em), tracking-section (-0.03em), tracking-sub (-0.02em), tracking-tight (-0.025em), tracking-normal (0), tracking-wide (0.025em), tracking-wider (0.05em), tracking-widest (0.1em).",
+          },
+        ],
+      },
+    ],
+  });
+});

package/eslint-rules/nadicode/rules/__tests__/no-glass-on-navigation.test.js

@@ -0,0 +1,62 @@
+import { RuleTester } from "eslint";
+import { describe } from "vitest";
+import rule from "../no-glass-on-navigation.js";
+
+const tester = new RuleTester({
+  languageOptions: {
+    ecmaVersion: "latest",
+    sourceType: "module",
+    parserOptions: {
+      ecmaFeatures: { jsx: true },
+    },
+  },
+});
+
+describe("no-glass-on-navigation", () => {
+  tester.run("no-glass-on-navigation", rule, {
+    valid: [
+      { code: '<Sidebar className="bg-sidebar border-r" />' },
+      { code: '<div className="glass-panel" />' },
+      { code: '<SidebarMenu className="bg-transparent" />' },
+      { code: '<nav className="bg-surface" />' },
+    ],
+    invalid: [
+      {
+        code: '<Sidebar className="glass-sidebar bg-sidebar" />',
+        errors: [
+          {
+            message:
+              "Glass class 'glass-sidebar' is not allowed on navigation element <Sidebar>. Use flat bg-sidebar or bg-surface instead.",
+          },
+        ],
+      },
+      {
+        code: '<nav className="glass-panel" />',
+        errors: [
+          {
+            message:
+              "Glass class 'glass-panel' is not allowed on navigation element <nav>. Use flat bg-sidebar or bg-surface instead.",
+          },
+        ],
+      },
+      {
+        code: '<SidebarMenu className="glass-floating" />',
+        errors: [
+          {
+            message:
+              "Glass class 'glass-floating' is not allowed on navigation element <SidebarMenu>. Use flat bg-sidebar or bg-surface instead.",
+          },
+        ],
+      },
+      {
+        code: '<NavigationShell className={cn("glass-panel", "p-4")} />',
+        errors: [
+          {
+            message:
+              "Glass class 'glass-panel' is not allowed on navigation element <NavigationShell>. Use flat bg-sidebar or bg-surface instead.",
+          },
+        ],
+      },
+    ],
+  });
+});

package/eslint-rules/nadicode/rules/__tests__/restrict-font-weight.test.js

@@ -0,0 +1,75 @@
+import { RuleTester } from "eslint";
+import { describe } from "vitest";
+import rule from "../restrict-font-weight.js";
+
+const tester = new RuleTester({
+  languageOptions: {
+    ecmaVersion: "latest",
+    sourceType: "module",
+    parserOptions: {
+      ecmaFeatures: { jsx: true },
+    },
+  },
+});
+
+describe("restrict-font-weight", () => {
+  tester.run("restrict-font-weight", rule, {
+    valid: [
+      { code: '<div className="font-normal text-lg" />' },
+      { code: '<div className="font-medium" />' },
+      { code: '<div className="font-semibold tracking-tight" />' },
+      { code: '<div className={cn("font-medium", "text-sm")} />' },
+      { code: '<div style={{ fontWeight: 400 }} />' },
+      { code: '<div style={{ fontWeight: 500 }} />' },
+      { code: '<div style={{ fontWeight: 600 }} />' },
+      { code: '<div style={{ fontWeight: "normal" }} />' },
+    ],
+    invalid: [
+      {
+        code: '<div className="font-bold text-lg" />',
+        errors: [
+          {
+            message:
+              "Forbidden font weight 'font-bold'. Use font-normal (400), font-medium (500), or font-semibold (600).",
+          },
+        ],
+      },
+      {
+        code: '<div className="font-extrabold" />',
+        errors: [
+          {
+            message:
+              "Forbidden font weight 'font-extrabold'. Use font-normal (400), font-medium (500), or font-semibold (600).",
+          },
+        ],
+      },
+      {
+        code: '<div className="font-light" />',
+        errors: [
+          {
+            message:
+              "Forbidden font weight 'font-light'. Use font-normal (400), font-medium (500), or font-semibold (600).",
+          },
+        ],
+      },
+      {
+        code: '<div className={cn("font-bold", "text-sm")} />',
+        errors: [
+          {
+            message:
+              "Forbidden font weight 'font-bold'. Use font-normal (400), font-medium (500), or font-semibold (600).",
+          },
+        ],
+      },
+      {
+        code: '<div style={{ fontWeight: 700 }} />',
+        errors: [
+          {
+            message:
+              "Forbidden font weight '700'. Use font-normal (400), font-medium (500), or font-semibold (600).",
+          },
+        ],
+      },
+    ],
+  });
+});

package/eslint-rules/nadicode/rules/no-arbitrary-tracking.js

@@ -0,0 +1,72 @@
+import {
+  getFilename,
+  isTestFile,
+  getClassTokensFromAttribute,
+  getClassTokensFromHelperCall,
+  isClassHelperCall,
+} from "../utils.js";
+
+const ARBITRARY_TRACKING_RE = /\btracking-\[[^\]]*\]/;
+
+function findArbitraryTracking(tokens) {
+  for (const t of tokens) {
+    const match = t.match(ARBITRARY_TRACKING_RE);
+    if (match) return match[0];
+  }
+  return null;
+}
+
+const rule = {
+  meta: {
+    type: "problem",
+    docs: {
+      description:
+        "Disallow arbitrary letter-spacing values. Use design token tracking classes instead.",
+    },
+    schema: [],
+  },
+  create(context) {
+    const filename = getFilename(context);
+    if (isTestFile(filename)) return {};
+
+    function report(node, value) {
+      context.report({
+        node,
+        message:
+          "Arbitrary tracking value '{{value}}' is not allowed. Use a design token: tracking-display (-0.04em), tracking-section (-0.03em), tracking-sub (-0.02em), tracking-tight (-0.025em), tracking-normal (0), tracking-wide (0.025em), tracking-wider (0.05em), tracking-widest (0.1em).",
+        data: { value },
+      });
+    }
+
+    return {
+      JSXAttribute(node) {
+        if (
+          node.name?.name !== "className" &&
+          node.name?.name !== "class"
+        ) {
+          return;
+        }
+
+        if (
+          node.value?.type === "JSXExpressionContainer" &&
+          isClassHelperCall(node.value.expression)
+        ) {
+          return;
+        }
+
+        const tokens = getClassTokensFromAttribute(node);
+        const match = findArbitraryTracking(tokens);
+        if (match) report(node, match);
+      },
+
+      CallExpression(node) {
+        if (!isClassHelperCall(node)) return;
+        const tokens = getClassTokensFromHelperCall(node);
+        const match = findArbitraryTracking(tokens);
+        if (match) report(node, match);
+      },
+    };
+  },
+};
+
+export default rule;

package/eslint-rules/nadicode/rules/no-glass-on-navigation.js

@@ -0,0 +1,115 @@
+import {
+  getFilename,
+  isTestFile,
+  getClassTokensFromAttribute,
+  getClassTokensFromHelperCall,
+  isClassHelperCall,
+} from "../utils.js";
+
+const GLASS_RE = /\bglass-(panel|floating|overlay|sidebar|tab-bar|tab-active)\b/;
+const NAV_ELEMENT_RE =
+  /^(Sidebar|SidebarMenu|SidebarGroup|Nav|NavBar|TabBar|NavigationMenu|NavigationShell)$/i;
+
+function findGlassClass(tokens) {
+  for (const t of tokens) {
+    const match = t.match(GLASS_RE);
+    if (match) return match[0];
+  }
+  return null;
+}
+
+function getJSXElementName(node) {
+  if (!node || node.type !== "JSXOpeningElement") return null;
+  const { name } = node;
+  if (name.type === "JSXIdentifier") return name.name;
+  if (name.type === "JSXMemberExpression" && name.property.type === "JSXIdentifier") {
+    return name.property.name;
+  }
+  return null;
+}
+
+const rule = {
+  meta: {
+    type: "problem",
+    docs: {
+      description:
+        "Disallow glass classes on structural/navigation elements. Use flat bg-sidebar or bg-surface instead.",
+    },
+    schema: [],
+  },
+  create(context) {
+    const filename = getFilename(context);
+    if (isTestFile(filename)) return {};
+
+    function isNavigationElement(elementName) {
+      if (!elementName) return false;
+      if (elementName === "nav") return true;
+      return NAV_ELEMENT_RE.test(elementName);
+    }
+
+    function report(node, glassClass, element) {
+      context.report({
+        node,
+        message:
+          "Glass class '{{glassClass}}' is not allowed on navigation element <{{element}}>. Use flat bg-sidebar or bg-surface instead.",
+        data: { glassClass, element },
+      });
+    }
+
+    return {
+      JSXAttribute(node) {
+        if (
+          node.name?.name !== "className" &&
+          node.name?.name !== "class"
+        ) {
+          return;
+        }
+
+        const openingElement = node.parent;
+        const elementName = getJSXElementName(openingElement);
+        if (!isNavigationElement(elementName)) return;
+
+        // Skip if value is a class helper call — handled by CallExpression
+        if (
+          node.value?.type === "JSXExpressionContainer" &&
+          isClassHelperCall(node.value.expression)
+        ) {
+          return;
+        }
+
+        const tokens = getClassTokensFromAttribute(node);
+        const match = findGlassClass(tokens);
+        if (match) report(node, match, elementName);
+      },
+
+      CallExpression(node) {
+        if (!isClassHelperCall(node)) return;
+
+        // Walk up to find enclosing JSX element
+        let current = node.parent;
+        while (current) {
+          if (current.type === "JSXOpeningElement") {
+            const elementName = getJSXElementName(current);
+            if (isNavigationElement(elementName)) {
+              const tokens = getClassTokensFromHelperCall(node);
+              const match = findGlassClass(tokens);
+              if (match) report(node, match, elementName);
+            }
+            return;
+          }
+          // Stop at component/function boundaries
+          if (
+            current.type === "FunctionDeclaration" ||
+            current.type === "FunctionExpression" ||
+            current.type === "ArrowFunctionExpression"
+          ) {
+            return;
+          }
+          current = current.parent;
+        }
+      },
+    };
+  },
+};
+
+export default rule;

package/eslint-rules/nadicode/rules/restrict-font-weight.js

@@ -0,0 +1,95 @@
+import {
+  getFilename,
+  isTestFile,
+  getClassTokensFromAttribute,
+  getClassTokensFromHelperCall,
+  isClassHelperCall,
+  getStyleObjectProperties,
+  getStaticStyleValue,
+} from "../utils.js";
+
+const FORBIDDEN_WEIGHT_RE =
+  /\bfont-(bold|extrabold|black|light|thin|extralight)\b/;
+
+const ALLOWED_STYLE_VALUES = new Set([
+  "400",
+  "500",
+  "600",
+  "normal",
+  "medium",
+  "semibold",
+]);
+
+function findForbiddenWeight(tokens) {
+  for (const t of tokens) {
+    const match = t.match(FORBIDDEN_WEIGHT_RE);
+    if (match) return match[0];
+  }
+  return null;
+}
+
+const rule = {
+  meta: {
+    type: "problem",
+    docs: {
+      description:
+        "Prevent unauthorized font weights. Only font-normal (400), font-medium (500), and font-semibold (600) are allowed.",
+    },
+    schema: [],
+  },
+  create(context) {
+    const filename = getFilename(context);
+    if (isTestFile(filename)) return {};
+
+    function reportWeight(node, weight) {
+      context.report({
+        node,
+        message:
+          "Forbidden font weight '{{weight}}'. Use font-normal (400), font-medium (500), or font-semibold (600).",
+        data: { weight },
+      });
+    }
+
+    return {
+      JSXAttribute(node) {
+        // className attribute — skip if value is a class helper call
+        if (
+          node.name?.name === "className" ||
+          node.name?.name === "class"
+        ) {
+          if (
+            node.value?.type === "JSXExpressionContainer" &&
+            isClassHelperCall(node.value.expression)
+          ) {
+            return;
+          }
+          const tokens = getClassTokensFromAttribute(node);
+          const match = findForbiddenWeight(tokens);
+          if (match) reportWeight(node, match);
+          return;
+        }
+
+        // style attribute — check fontWeight
+        if (node.name?.name === "style") {
+          const props = getStyleObjectProperties(node);
+          for (const { propertyName, valueNode, reportNode } of props) {
+            if (propertyName !== "fontWeight") continue;
+            const value = getStaticStyleValue(valueNode);
+            if (value !== null && !ALLOWED_STYLE_VALUES.has(String(value))) {
+              reportWeight(reportNode, value);
+            }
+          }
+        }
+      },
+
+      CallExpression(node) {
+        if (!isClassHelperCall(node)) return;
+        const tokens = getClassTokensFromHelperCall(node);
+        const match = findForbiddenWeight(tokens);
+        if (match) reportWeight(node, match);
+      },
+    };
+  },
+};
+
+export default rule;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vadimcomanescu/nadicode-design-system",
-  "version": "4.0.7",
+  "version": "4.0.9",
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"