@papernote/ui 1.10.23 → 1.10.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@papernote/ui",
-  "version": "1.10.23",
+  "version": "1.10.25",
   "type": "module",
   "description": "A modern React component library with a paper notebook aesthetic - minimal, professional, and expressive",
   "main": "dist/index.js",

package/src/components/DataGrid.tsx

@@ -747,19 +747,17 @@ export const DataGrid = forwardRef<DataGridHandle, DataGridProps>(
         if (column.type === 'currency' && !isNaN(numVal)) {
           const decimals = column.format?.decimals ?? 2;
           const prefix = column.format?.prefix ?? '$';
-          return `${prefix}${numVal.toFixed(decimals)}`;
+          return `${prefix}${numVal.toLocaleString('en-US', { minimumFractionDigits: decimals, maximumFractionDigits: decimals })}`;
         }
 
         if (column.type === 'percent' && !isNaN(numVal)) {
-          const decimals = column.format?.decimals ?? 1;
-          return `${(numVal * 100).toFixed(decimals)}%`;
+          const decimals = column.format?.decimals ?? 2;
+          return `${(numVal * 100).toLocaleString('en-US', { minimumFractionDigits: decimals, maximumFractionDigits: decimals })}%`;
         }
 
         if (column.type === 'number' && !isNaN(numVal)) {
-          const decimals = column.format?.decimals;
-          if (decimals !== undefined) {
-            return numVal.toFixed(decimals);
-          }
+          const decimals = column.format?.decimals ?? 0;
+          return numVal.toLocaleString('en-US', { minimumFractionDigits: decimals, maximumFractionDigits: decimals });
         }
 
         return String(value);

package/tailwind.config.js

@@ -4,6 +4,15 @@ export default {
     "./index.html",
     "./src/**/*.{js,ts,jsx,tsx}",
   ],
+  // Safelist dynamic classes used in DataGrid column grouping
+  // These are applied programmatically and won't be detected by content scanning
+  safelist: [
+    // Column group color banding (used in DataGrid.tsx)
+    'bg-sky-100', 'bg-sky-50', 'bg-sky-100/50',
+    'bg-amber-100', 'bg-amber-50', 'bg-amber-100/50',
+    'bg-emerald-100', 'bg-emerald-50', 'bg-emerald-100/50',
+    'bg-pink-100', 'bg-pink-50', 'bg-pink-100/50',
+  ],
   theme: {
     extend: {
       colors: {