[core] Restrict import path with ESLint (#41970)

mui · May 1, 2024 · 5b31379 · 5b31379
1 parent 571d504
commit 5b31379
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 24 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,8 +1,8 @@
 const path = require('path');
 const { rules: baseStyleRules } = require('eslint-config-airbnb-base/rules/style');
 
-const forbidTopLevelMessage = [
- 'Prefer one level nested imports to avoid bundling everything in dev mode',
+const OneLevelImportMessage = [
+ 'Prefer one level nested imports to avoid bundling everything in dev mode or breaking CJS/ESM split.',
  'See https://github.com/mui/material-ui/pull/24147 for the kind of win it can unlock.',
 ].join('\n');
 // This only applies to packages published from this monorepo.
@@ -65,7 +65,20 @@ module.exports = {
  'no-restricted-imports': [
  'error',
  {
- patterns: ['@mui/*/*/*'],
+ patterns: [
+ {
+ group: [
+ '@mui/*/*/*',
+ '@pigment-css/*/*/*',
+ '@base_ui/*/*/*',
+ // Allow any import depth with any internal packages
+ '!@mui/internal-*/**',
+ // TODO delete, @mui/docs should be @mui/internal-docs
+ '!@mui/docs/**',
+ ],
+ message: OneLevelImportMessage,
+ },
+ ],
  },
  ],
  'no-continue': 'off',
@@ -331,23 +344,6 @@ module.exports = {
  'import/export': 'off', // Not sure why it doesn't work
  },
  },
- {
- files: ['*.tsx'],
- excludedFiles: '*.spec.tsx',
- rules: {
- // WARNING: If updated, make sure these rules are merged with `no-restricted-imports` (#ts-source-files)
- 'no-restricted-imports': [
- 'error',
- {
- patterns: [
- // Allow deeper imports for TypeScript types. TODO remove
- '@mui/*/*/*/*',
- ],
- },
- ],
- },
- },
- // Files used for generating TypeScript declaration files (#ts-source-files)
  {
  files: ['packages/*/src/**/*.tsx'],
  excludedFiles: '*.spec.tsx',
@@ -429,11 +425,11 @@ module.exports = {
  paths: [
  {
  name: '@mui/material',
- message: forbidTopLevelMessage,
+ message: OneLevelImportMessage,
  },
  {
  name: '@mui/lab',
- message: forbidTopLevelMessage,
+ message: OneLevelImportMessage,
  },
  ],
  },

diff --git a/apps/pigment-css-vite-app/src/Slider/ZeroSlider.tsx b/apps/pigment-css-vite-app/src/Slider/ZeroSlider.tsx
@@ -10,7 +10,7 @@ import {
 import { isHostComponent, useSlotProps } from '@mui/base/utils';
 import { styled } from '@pigment-css/react';
 import { capitalize } from '@mui/material/utils';
-import SliderValueLabel from '@mui/material/Slider/SliderValueLabel';
+import { SliderValueLabel } from '@mui/material/Slider';
 import { useSlider, valueToPercent } from '@mui/base/useSlider';
 import { alpha, lighten, darken } from '@mui/system/colorManipulator';
 import type { Theme } from '@mui/material/styles';

diff --git a/docs/src/pages/premium-themes/onepirate/modules/components/Snackbar.tsx b/docs/src/pages/premium-themes/onepirate/modules/components/Snackbar.tsx
@@ -6,7 +6,7 @@ import Slide from '@mui/material/Slide';
 import CloseIcon from '@mui/icons-material/Close';
 import InfoIcon from '@mui/icons-material/Info';
 import IconButton from '@mui/material/IconButton';
-import { TransitionProps } from '@mui/material/transitions/transition';
+import { TransitionProps } from '@mui/material/transitions';
 
 const styles = ({ theme }: { theme: Theme }) =>
  ({