@movable/ui 3.15.0 → 3.16.0-eslint.1

package/README.md

@@ -65,6 +65,22 @@ yarn add @movable/ui@3.4.1-alpha.0
 
 View all available versions at: https://www.npmjs.com/package/@movable/ui?activeTab=versions
 
+## ESLint Plugin
+
+This package includes an ESLint plugin with rules for consistent usage of `@movable/ui` components. It helps enforce best practices like using `Grid2` instead of deprecated `Grid`.
+
+```bash
+# In your consuming app's .eslintrc
+{
+  "plugins": ["@movable/ui"],
+  "rules": {
+    "@movable/ui/no-deprecated-grid": "error"
+  }
+}
+```
+
+See [eslint-plugin/README.md](./eslint-plugin/README.md) for full documentation.
+
 ## Conventional Commits
 
 This repo has [conventional-commits](https://www.conventionalcommits.org/en/v1.0.0/#summary) We lint for this both pre-commit and on PR actions. It is **required** and will not pass without it.

package/lib/eslint-plugin/configs/recommended.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Recommended ESLint configuration for @movable/ui consumers.
+ *
+ * Enforces best practices for importing and using @movable/ui components.
+ */
+export declare const recommended: {
+    rules: {
+        '@movable/ui/no-deprecated-grid': string;
+    };
+};
+//# sourceMappingURL=recommended.d.ts.map

package/lib/eslint-plugin/configs/recommended.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"recommended.d.ts","sourceRoot":"","sources":["../../../eslint-plugin/configs/recommended.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,eAAO,MAAM,WAAW;;;;CAIvB,CAAC"}

package/lib/eslint-plugin/configs/recommended.js

@@ -0,0 +1,13 @@
+"use strict";
+/**
+ * Recommended ESLint configuration for @movable/ui consumers.
+ *
+ * Enforces best practices for importing and using @movable/ui components.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.recommended = void 0;
+exports.recommended = {
+    rules: {
+        '@movable/ui/no-deprecated-grid': 'error',
+    },
+};

package/lib/eslint-plugin/index.d.ts

@@ -0,0 +1,24 @@
+/**
+ * @movable/ui ESLint Plugin
+ *
+ * Provides shared ESLint rules for Movable Ink applications
+ * consuming the @movable/ui component library.
+ */
+declare const plugin: {
+    meta: {
+        name: string;
+        version: string;
+    };
+    configs: {
+        recommended: {
+            rules: {
+                '@movable/ui/no-deprecated-grid': string;
+            };
+        };
+    };
+    rules: {
+        'no-deprecated-grid': import("eslint").Rule.RuleModule;
+    };
+};
+export = plugin;
+//# sourceMappingURL=index.d.ts.map

package/lib/eslint-plugin/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../eslint-plugin/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAKH,QAAA,MAAM,MAAM;;;;;;;;;;;;;;;CASX,CAAC;AAEF,SAAS,MAAM,CAAC"}

package/lib/eslint-plugin/index.js

@@ -0,0 +1,20 @@
+"use strict";
+/**
+ * @movable/ui ESLint Plugin
+ *
+ * Provides shared ESLint rules for Movable Ink applications
+ * consuming the @movable/ui component library.
+ */
+const recommended_1 = require("./configs/recommended");
+const rules_1 = require("./rules");
+const plugin = {
+    meta: {
+        name: '@movable/ui',
+        version: '1.0.0',
+    },
+    configs: {
+        recommended: recommended_1.recommended,
+    },
+    rules: rules_1.rules,
+};
+module.exports = plugin;

package/lib/eslint-plugin/rules/index.d.ts

@@ -0,0 +1,4 @@
+export declare const rules: {
+    'no-deprecated-grid': import("eslint").Rule.RuleModule;
+};
+//# sourceMappingURL=index.d.ts.map

package/lib/eslint-plugin/rules/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../eslint-plugin/rules/index.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,KAAK;;CAEjB,CAAC"}

package/lib/eslint-plugin/rules/index.js

@@ -0,0 +1,10 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.rules = void 0;
+const no_deprecated_grid_1 = __importDefault(require("./no-deprecated-grid"));
+exports.rules = {
+    'no-deprecated-grid': no_deprecated_grid_1.default,
+};

package/lib/eslint-plugin/rules/no-deprecated-grid.d.ts

@@ -0,0 +1,4 @@
+import type { Rule } from 'eslint';
+declare const rule: Rule.RuleModule;
+export default rule;
+//# sourceMappingURL=no-deprecated-grid.d.ts.map

package/lib/eslint-plugin/rules/no-deprecated-grid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"no-deprecated-grid.d.ts","sourceRoot":"","sources":["../../../eslint-plugin/rules/no-deprecated-grid.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAEnC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,UA4ChB,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/lib/eslint-plugin/rules/no-deprecated-grid.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const rule = {
+    meta: {
+        type: 'suggestion',
+        docs: {
+            description: 'Disallow importing deprecated Grid v1 from MUI',
+            recommended: true,
+        },
+        messages: {
+            noGridV1: "Please use Grid2 from '@mui/material/Grid2' instead. Grid v1 is deprecated.",
+        },
+        schema: [],
+    },
+    create(context) {
+        return {
+            ImportDeclaration(node) {
+                const source = node.source.value;
+                // Check for: import { Grid } from '@mui/material'
+                if (source === '@mui/material') {
+                    for (const specifier of node.specifiers) {
+                        if (specifier.type === 'ImportSpecifier' &&
+                            specifier.imported.type === 'Identifier' &&
+                            specifier.imported.name === 'Grid') {
+                            context.report({
+                                node: specifier,
+                                messageId: 'noGridV1',
+                            });
+                        }
+                    }
+                }
+                // Check for: import Grid from '@mui/material/Grid'
+                if (source === '@mui/material/Grid') {
+                    context.report({
+                        node,
+                        messageId: 'noGridV1',
+                    });
+                }
+            },
+        };
+    },
+};
+exports.default = rule;

package/package.json

@@ -1,21 +1,35 @@
 {
   "name": "@movable/ui",
-  "version": "3.15.0",
+  "version": "3.16.0-eslint.1",
   "description": "Movable Ink's shared MUI components and MUI theme for our vite applications",
   "module": "lib/index.mjs",
   "types": "lib/index.d.ts",
   "files": [
-    "lib"
+    "lib",
+    "lib/eslint-plugin",
+    "scripts"
   ],
+  "exports": {
+    ".": {
+      "import": "./lib/index.mjs",
+      "types": "./lib/index.d.ts"
+    },
+    "./eslint-plugin": {
+      "require": "./lib/eslint-plugin/index.js",
+      "types": "./lib/eslint-plugin/index.d.ts"
+    }
+  },
   "scripts": {
-    "build": "vite build",
+    "build": "vite build && npm run build:eslint-plugin",
+    "build:eslint-plugin": "tsc --project eslint-plugin/tsconfig.json",
     "build-storybook": "storybook build",
     "dev": "vite",
     "lint": "run-p -n lint:src lint:cypress lint:stories",
     "lint:src": "tsc --project ./tsconfig.json && eslint -c ./.eslintrc.json ./src --report-unused-disable-directives --max-warnings 0",
     "lint:cypress": "tsc --project ./cypress/tsconfig.json && eslint -c ./cypress/.eslintrc.json ./cypress --resolve-plugins-relative-to ./cypress --report-unused-disable-directives --max-warnings 0 --no-error-on-unmatched-pattern",
     "lint:stories": "tsc --project ./tsconfig.json && eslint -c ./.eslintrc.json ./stories --report-unused-disable-directives --max-warnings 0",
-    "prepare": "husky install",
+    "prepare": "husky install && npm run link:eslint-plugin",
+    "link:eslint-plugin": "[ -d lib/eslint-plugin ] && mkdir -p node_modules/@movable && ln -sf ../../lib/eslint-plugin node_modules/@movable/eslint-plugin-ui || true",
     "percy:storybook": "PERCY_TOKEN=$PERCY_TOKEN percy exec --parallel -- percy storybook ./storybook-static",
     "percy:upload": "PERCY_TOKEN=$PERCY_TOKEN percy build:finalize",
     "storybook": "storybook dev -p 6006",
@@ -61,6 +75,7 @@
     "@storybook/builder-vite": "^9.1.4",
     "@storybook/react-vite": "^9.1.4",
     "@swc/core": "^1.13.3",
+    "@types/eslint": "^9.6.1",
     "@types/lodash-es": "^4.17.0",
     "@types/react": "^18.2.19",
     "@types/react-dom": "^18.2.7",

package/scripts/postinstall.js

@@ -0,0 +1,31 @@
+#!/usr/bin/env node
+/**
+ * Creates a symlink for ESLint plugin resolution.
+ *
+ * ESLint legacy config resolves `plugins: ["@movable/ui"]` to `@movable/eslint-plugin-ui`.
+ * This script creates that symlink so the plugin works out of the box.
+ *
+ * Only runs when installed as a dependency (inside node_modules), not in the source repo.
+ */
+const fs = require('fs');
+const path = require('path');
+
+// Only run when installed as a dependency (path contains node_modules)
+if (!__dirname.includes('node_modules')) {
+  process.exit(0);
+}
+
+const source = path.resolve(__dirname, '..', 'lib', 'eslint-plugin');
+const target = path.resolve(__dirname, '..', '..', 'eslint-plugin-ui');
+
+// Only create symlink if:
+// 1. The source (built eslint-plugin) exists
+// 2. The target doesn't already exist
+if (fs.existsSync(source) && !fs.existsSync(target)) {
+  try {
+    fs.symlinkSync(source, target, 'dir');
+  } catch (err) {
+    // Silently fail - symlink creation may fail in some environments
+    // The plugin will still work with flat config via direct require
+  }
+}