@neatui/css 5.1.10 → 5.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neatui/css",
-  "version": "5.1.10",
+  "version": "5.2.0",
   "description": "NeatUI constrained atomic design system — SCSS source for production themes, plus preview CSS with default light/dark",
   "main": "./neatui.scss",
   "sass": "./neatui.scss",
@@ -38,6 +38,7 @@
     "index.scss",
     "index.js",
     "GUIDE.md",
+    "CHANGELOG.md",
     "MIGRATION-4.0.md",
     "MIGRATION-4.1.md",
     "README.md"

package/tokens/grammar.cjs

@@ -40,6 +40,7 @@ function buildGrammarSpec(tokens) {
       expandResponsive: Boolean(def.expandResponsivePrefixes),
       values: collectManagedValues(tokens, def),
       intent: def.intent || '',
+      ...(def.responsivePrefixes ? { responsivePrefixes: def.responsivePrefixes } : {}),
     };
   }
 
@@ -89,14 +90,15 @@ function createValidatorFromSpec(spec) {
       expandResponsive: Boolean(def.expandResponsive),
       values: new Set(def.values || []),
       intent: def.intent || '',
+      responsivePrefixes: new Set(def.responsivePrefixes || spec.responsivePrefixes || ['mob', 'pad']),
     };
   }
 
-  function stripResponsivePrefix(token) {
+  function stripResponsivePrefix(token, allowedPrefixes = responsivePrefixes) {
     const match = /^([a-z]+):(.+)$/i.exec(token);
     if (!match) return { prefix: null, base: token };
     const [, prefix, base] = match;
-    if (!responsivePrefixes.has(prefix)) {
+    if (!allowedPrefixes.has(prefix)) {
       return { prefix: null, base: token, unknownPrefix: prefix };
     }
     return { prefix, base };
@@ -157,7 +159,7 @@ function createValidatorFromSpec(spec) {
       };
     }
 
-    const { prefix, base, unknownPrefix } = stripResponsivePrefix(token);
+    const { prefix, base, unknownPrefix } = stripResponsivePrefix(token, def.responsivePrefixes);
     if (unknownPrefix) {
       return {
         kind: 'attr',
@@ -257,7 +259,7 @@ function createValidatorFromSpec(spec) {
   function looksLikeNeatuiClass(token) {
     const base = String(token || '').replace(/^(?:mob|pad):/, '');
     if (!base) return false;
-    if (/^(?:co|bg|fs|lh|r|o|z)-/.test(base)) return true;
+    if (/^(?:co|bg|fs|lh|r|o|z|gap)-/.test(base)) return true;
     if (/^-?(?:n|nx|ny|nt|nr|nb|nl|m|mx|my|mt|mr|mb|ml)-/.test(base)) return true;
     if (/^(?:w|min-w|max-w|h|min-h|max-h)-/.test(base)) return true;
     // Common utility drift that should fail loudly

package/tokens/neatui.tokens.json

@@ -442,6 +442,21 @@
         "fit.modes",
         "fit.anchors"
       ]
+    },
+    "ui-grid": {
+      "intent": "等宽列数、九宫格对齐及纵向拉伸；间距使用共用的 gap-* class。",
+      "managed": true,
+      "valueGroups": [
+        "grid.columns",
+        "grid.coordinates",
+        "grid.behaviors"
+      ],
+      "expandResponsivePrefixes": true,
+      "responsivePrefixes": [
+        "mob",
+        "pad",
+        "dpc"
+      ]
     }
   },
   "fit": {
@@ -568,6 +583,192 @@
       "pattern": "^(?:h|min-h|max-h)-({grade})(?:\\*[sml])?$",
       "intent": "高度等级。",
       "example": "h-mm"
+    },
+    {
+      "id": "gap",
+      "pattern": "^gap-(no|xs|ss|sm|sl|ms|mm|ml|ls|lm|ll|xl)$",
+      "intent": "Flex / Grid 共用行列间距。",
+      "example": "gap-mm"
+    }
+  ],
+  "grid": {
+    "columns": [
+      {
+        "value": "1",
+        "intent": "1 列等宽网格。",
+        "group": "columns"
+      },
+      {
+        "value": "2",
+        "intent": "2 列等宽网格。",
+        "group": "columns"
+      },
+      {
+        "value": "3",
+        "intent": "3 列等宽网格。",
+        "group": "columns"
+      },
+      {
+        "value": "4",
+        "intent": "4 列等宽网格。",
+        "group": "columns"
+      },
+      {
+        "value": "5",
+        "intent": "5 列等宽网格。",
+        "group": "columns"
+      },
+      {
+        "value": "6",
+        "intent": "6 列等宽网格。",
+        "group": "columns"
+      },
+      {
+        "value": "7",
+        "intent": "7 列等宽网格。",
+        "group": "columns"
+      },
+      {
+        "value": "8",
+        "intent": "8 列等宽网格。",
+        "group": "columns"
+      },
+      {
+        "value": "9",
+        "intent": "9 列等宽网格。",
+        "group": "columns"
+      },
+      {
+        "value": "10",
+        "intent": "10 列等宽网格。",
+        "group": "columns"
+      },
+      {
+        "value": "11",
+        "intent": "11 列等宽网格。",
+        "group": "columns"
+      },
+      {
+        "value": "12",
+        "intent": "12 列等宽网格。",
+        "group": "columns"
+      }
+    ],
+    "coordinates": [
+      {
+        "value": "lt",
+        "intent": "网格子项在单元格内靠左、顶部对齐；整组行顶部对齐。",
+        "group": "alignment"
+      },
+      {
+        "value": "lm",
+        "intent": "网格子项在单元格内靠左、垂直居中；整组行垂直居中。",
+        "group": "alignment"
+      },
+      {
+        "value": "lb",
+        "intent": "网格子项在单元格内靠左、底部对齐；整组行底部对齐。",
+        "group": "alignment"
+      },
+      {
+        "value": "ct",
+        "intent": "网格子项在单元格内水平居中、顶部对齐；整组行顶部对齐。",
+        "group": "alignment"
+      },
+      {
+        "value": "cm",
+        "intent": "网格子项在单元格内水平居中、垂直居中；整组行垂直居中。",
+        "group": "alignment"
+      },
+      {
+        "value": "cb",
+        "intent": "网格子项在单元格内水平居中、底部对齐；整组行底部对齐。",
+        "group": "alignment"
+      },
+      {
+        "value": "rt",
+        "intent": "网格子项在单元格内靠右、顶部对齐；整组行顶部对齐。",
+        "group": "alignment"
+      },
+      {
+        "value": "rm",
+        "intent": "网格子项在单元格内靠右、垂直居中；整组行垂直居中。",
+        "group": "alignment"
+      },
+      {
+        "value": "rb",
+        "intent": "网格子项在单元格内靠右、底部对齐；整组行底部对齐。",
+        "group": "alignment"
+      }
+    ],
+    "behaviors": [
+      {
+        "value": "block",
+        "intent": "网格项纵向拉伸。",
+        "group": "behavior"
+      }
+    ]
+  },
+  "gap": [
+    {
+      "value": "no",
+      "cssValue": "0",
+      "intent": "Flex / Grid 共用 0 行列间距。"
+    },
+    {
+      "value": "xs",
+      "cssValue": "1px",
+      "intent": "Flex / Grid 共用 1px 行列间距。"
+    },
+    {
+      "value": "ss",
+      "cssValue": ".25em",
+      "intent": "Flex / Grid 共用 .25em 行列间距。"
+    },
+    {
+      "value": "sm",
+      "cssValue": ".5em",
+      "intent": "Flex / Grid 共用 .5em 行列间距。"
+    },
+    {
+      "value": "sl",
+      "cssValue": ".75em",
+      "intent": "Flex / Grid 共用 .75em 行列间距。"
+    },
+    {
+      "value": "ms",
+      "cssValue": "1em",
+      "intent": "Flex / Grid 共用 1em 行列间距。"
+    },
+    {
+      "value": "mm",
+      "cssValue": "1.5em",
+      "intent": "Flex / Grid 共用 1.5em 行列间距。"
+    },
+    {
+      "value": "ml",
+      "cssValue": "2em",
+      "intent": "Flex / Grid 共用 2em 行列间距。"
+    },
+    {
+      "value": "ls",
+      "cssValue": "2.5em",
+      "intent": "Flex / Grid 共用 2.5em 行列间距。"
+    },
+    {
+      "value": "lm",
+      "cssValue": "3em",
+      "intent": "Flex / Grid 共用 3em 行列间距。"
+    },
+    {
+      "value": "ll",
+      "cssValue": "4em",
+      "intent": "Flex / Grid 共用 4em 行列间距。"
+    },
+    {
+      "value": "xl",
+      "cssValue": "5em",
+      "intent": "Flex / Grid 共用 5em 行列间距。"
     }
   ]
 }