From a73ca99e1224e358d22b915090f1dc6abc3d46eb Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Mon, 4 Sep 2023 23:04:36 +0200 Subject: [PATCH 1/7] [core] Deeper import of modules --- .eslintrc.js | 9 +-------- .../autocomplete/UseAutocompletePopper.js | 2 +- .../autocomplete/UseAutocompletePopper.tsx | 2 +- packages/mui-base/src/FormControl/FormControl.tsx | 2 +- packages/mui-base/tsconfig.build.json | 3 ++- packages/mui-lab/tsconfig.build.json | 2 +- packages/mui-material/scripts/rollup.config.mjs | 4 ++++ .../src/ListSubheader/listSubheaderClasses.ts | 2 +- packages/mui-system/tsconfig.build.json | 3 ++- packages/mui-utils/src/integerPropType.d.ts | 15 +++++++++++++++ packages/mui-utils/tsconfig.build.json | 1 + tsconfig.json | 2 ++ 12 files changed, 32 insertions(+), 15 deletions(-) create mode 100644 packages/mui-utils/src/integerPropType.d.ts diff --git a/.eslintrc.js b/.eslintrc.js index bdace1247ab77d..e15c9c6197d333 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -67,13 +67,6 @@ module.exports = { { patterns: [ '@mui/*/*/*', - // Begin block: Packages with files instead of packages in the top level - // Importing from the top level pulls in CommonJS instead of ES modules - // Allowing /icons as to reduce cold-start of dev builds significantly. - // There's nothing to tree-shake when importing from /icons this way: - // '@mui/icons-material/*/', - '@mui/utils/*', - // End block // Macros are fine since their import path is transpiled away '!@mui/utils/macros', '@mui/utils/macros/*', @@ -333,7 +326,7 @@ module.exports = { 'error', { patterns: [ - // Allow deeper imports for TypeScript types. TODO? + // Allow deeper imports for TypeScript types. TODO remove '@mui/*/*/*/*', // Macros are fine since they're transpiled into something else '!@mui/utils/macros/*.macro', diff --git a/docs/data/base/components/autocomplete/UseAutocompletePopper.js b/docs/data/base/components/autocomplete/UseAutocompletePopper.js index b6512af0934b97..8897b328599234 100644 --- a/docs/data/base/components/autocomplete/UseAutocompletePopper.js +++ b/docs/data/base/components/autocomplete/UseAutocompletePopper.js @@ -2,7 +2,7 @@ import * as React from 'react'; import { useAutocomplete } from '@mui/base/useAutocomplete'; import { Popper } from '@mui/base/Popper'; import { styled } from '@mui/system'; -import { unstable_useForkRef as useForkRef } from '@mui/utils'; +import useForkRef from '@mui/utils/useForkRef'; // TODO import from @mui/base, private package const Autocomplete = React.forwardRef(function Autocomplete(props, ref) { const { diff --git a/docs/data/base/components/autocomplete/UseAutocompletePopper.tsx b/docs/data/base/components/autocomplete/UseAutocompletePopper.tsx index 3b2d59777f5396..174e88c038c654 100644 --- a/docs/data/base/components/autocomplete/UseAutocompletePopper.tsx +++ b/docs/data/base/components/autocomplete/UseAutocompletePopper.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { useAutocomplete, UseAutocompleteProps } from '@mui/base/useAutocomplete'; import { Popper } from '@mui/base/Popper'; import { styled } from '@mui/system'; -import { unstable_useForkRef as useForkRef } from '@mui/utils'; +import useForkRef from '@mui/utils/useForkRef'; // TODO import from @mui/base, private package const Autocomplete = React.forwardRef(function Autocomplete( props: UseAutocompleteProps<(typeof top100Films)[number], false, false, false>, diff --git a/packages/mui-base/src/FormControl/FormControl.tsx b/packages/mui-base/src/FormControl/FormControl.tsx index f5959d15700ab1..ac8d39dcebd98a 100644 --- a/packages/mui-base/src/FormControl/FormControl.tsx +++ b/packages/mui-base/src/FormControl/FormControl.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import PropTypes from 'prop-types'; -import { unstable_useControlled as useControlled } from '@mui/utils'; +import useControlled from '@mui/utils/useControlled'; // TODO import from ../useControlled import { PolymorphicComponent } from '../utils/PolymorphicComponent'; import { FormControlContext } from './FormControlContext'; import { getFormControlUtilityClass } from './formControlClasses'; diff --git a/packages/mui-base/tsconfig.build.json b/packages/mui-base/tsconfig.build.json index bc9de8db7f41fd..7696cbeba02fc7 100644 --- a/packages/mui-base/tsconfig.build.json +++ b/packages/mui-base/tsconfig.build.json @@ -11,5 +11,6 @@ "rootDir": "./src" }, "include": ["src/**/*.ts*"], - "exclude": ["src/**/*.spec.ts*", "src/**/*.test.ts*"] + "exclude": ["src/**/*.spec.ts*", "src/**/*.test.ts*"], + "references": [{ "path": "../mui-utils/tsconfig.build.json" }] } diff --git a/packages/mui-lab/tsconfig.build.json b/packages/mui-lab/tsconfig.build.json index f3c9573d726cf3..c6951939ebf57c 100644 --- a/packages/mui-lab/tsconfig.build.json +++ b/packages/mui-lab/tsconfig.build.json @@ -1,7 +1,7 @@ { // This config is for emitting declarations (.d.ts) only // Actual .ts source files are transpiled via babel - "extends": "./tsconfig.json", + "extends": "./tsconfig", "compilerOptions": { "noEmit": false, "declaration": true, diff --git a/packages/mui-material/scripts/rollup.config.mjs b/packages/mui-material/scripts/rollup.config.mjs index eb89d37c285116..7130eceb36e99c 100644 --- a/packages/mui-material/scripts/rollup.config.mjs +++ b/packages/mui-material/scripts/rollup.config.mjs @@ -101,6 +101,10 @@ const nestedFolder = { return resolveNestedImport('mui-base', importee); } + if (importee.indexOf('@mui/utils/') === 0) { + return resolveNestedImport('mui-utils', importee); + } + if (importee.indexOf('@mui/private-theming/') === 0) { return resolveNestedImport('mui-private-theming', importee); } diff --git a/packages/mui-material/src/ListSubheader/listSubheaderClasses.ts b/packages/mui-material/src/ListSubheader/listSubheaderClasses.ts index 908966f5d0d709..d8ae4c3f5199ed 100644 --- a/packages/mui-material/src/ListSubheader/listSubheaderClasses.ts +++ b/packages/mui-material/src/ListSubheader/listSubheaderClasses.ts @@ -1,4 +1,4 @@ -import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils'; +import generateUtilityClasses from '@mui/utils/generateUtilityClasses'; // TODO import from @mui/base, private package import generateUtilityClass from '../generateUtilityClass'; export interface ListSubheaderClasses { diff --git a/packages/mui-system/tsconfig.build.json b/packages/mui-system/tsconfig.build.json index bc9de8db7f41fd..7696cbeba02fc7 100644 --- a/packages/mui-system/tsconfig.build.json +++ b/packages/mui-system/tsconfig.build.json @@ -11,5 +11,6 @@ "rootDir": "./src" }, "include": ["src/**/*.ts*"], - "exclude": ["src/**/*.spec.ts*", "src/**/*.test.ts*"] + "exclude": ["src/**/*.spec.ts*", "src/**/*.test.ts*"], + "references": [{ "path": "../mui-utils/tsconfig.build.json" }] } diff --git a/packages/mui-utils/src/integerPropType.d.ts b/packages/mui-utils/src/integerPropType.d.ts new file mode 100644 index 00000000000000..823171e8acecf7 --- /dev/null +++ b/packages/mui-utils/src/integerPropType.d.ts @@ -0,0 +1,15 @@ +import PropTypes from 'prop-types'; + +declare function integerPropType( + props: { [key: string]: any }, + propName: string, + componentName: string, + location: string, + propFullName: string, +): Error | null; + +declare namespace integerPropType { + let isRequired: PropTypes.Validator; +} + +export default integerPropType; diff --git a/packages/mui-utils/tsconfig.build.json b/packages/mui-utils/tsconfig.build.json index f3106abb0f596c..873e49e4b48cf8 100644 --- a/packages/mui-utils/tsconfig.build.json +++ b/packages/mui-utils/tsconfig.build.json @@ -3,6 +3,7 @@ // Actual .ts source files are transpiled via babel "extends": "./tsconfig.json", "compilerOptions": { + "composite": true, "declaration": true, "noEmit": false, "emitDeclarationOnly": true, diff --git a/tsconfig.json b/tsconfig.json index 607b998b6a5e77..f18dfa4f29d3ca 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -33,6 +33,8 @@ "@mui/types": ["./packages/mui-types"], "@mui/base": ["./packages/mui-base/src"], "@mui/base/*": ["./packages/mui-base/src/*"], + "@mui/utils": ["./packages/mui-utils/src"], + "@mui/utils/*": ["./packages/mui-utils/src/*"], "@mui/docs": ["./packages/mui-docs/src"], "@mui/docs/*": ["./packages/mui-docs/src/*"], "@mui/material-next": ["./packages/mui-material-next/src"], From 48cb7432fd1160ea1ea1f2a7d99f7ebb1c2fa591 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Sun, 10 Sep 2023 01:49:53 +0200 Subject: [PATCH 2/7] one concern at a time --- docs/data/base/components/autocomplete/UseAutocompletePopper.js | 2 +- .../data/base/components/autocomplete/UseAutocompletePopper.tsx | 2 +- packages/mui-base/src/FormControl/FormControl.tsx | 2 +- packages/mui-material/src/ListSubheader/listSubheaderClasses.ts | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/data/base/components/autocomplete/UseAutocompletePopper.js b/docs/data/base/components/autocomplete/UseAutocompletePopper.js index 8897b328599234..1953f2a977ee5c 100644 --- a/docs/data/base/components/autocomplete/UseAutocompletePopper.js +++ b/docs/data/base/components/autocomplete/UseAutocompletePopper.js @@ -2,7 +2,7 @@ import * as React from 'react'; import { useAutocomplete } from '@mui/base/useAutocomplete'; import { Popper } from '@mui/base/Popper'; import { styled } from '@mui/system'; -import useForkRef from '@mui/utils/useForkRef'; // TODO import from @mui/base, private package +import useForkRef from '@mui/utils/useForkRef'; const Autocomplete = React.forwardRef(function Autocomplete(props, ref) { const { diff --git a/docs/data/base/components/autocomplete/UseAutocompletePopper.tsx b/docs/data/base/components/autocomplete/UseAutocompletePopper.tsx index 174e88c038c654..64a624887ccdf0 100644 --- a/docs/data/base/components/autocomplete/UseAutocompletePopper.tsx +++ b/docs/data/base/components/autocomplete/UseAutocompletePopper.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { useAutocomplete, UseAutocompleteProps } from '@mui/base/useAutocomplete'; import { Popper } from '@mui/base/Popper'; import { styled } from '@mui/system'; -import useForkRef from '@mui/utils/useForkRef'; // TODO import from @mui/base, private package +import useForkRef from '@mui/utils/useForkRef'; const Autocomplete = React.forwardRef(function Autocomplete( props: UseAutocompleteProps<(typeof top100Films)[number], false, false, false>, diff --git a/packages/mui-base/src/FormControl/FormControl.tsx b/packages/mui-base/src/FormControl/FormControl.tsx index ac8d39dcebd98a..1ee347e07059a1 100644 --- a/packages/mui-base/src/FormControl/FormControl.tsx +++ b/packages/mui-base/src/FormControl/FormControl.tsx @@ -1,7 +1,7 @@ 'use client'; import * as React from 'react'; import PropTypes from 'prop-types'; -import useControlled from '@mui/utils/useControlled'; // TODO import from ../useControlled +import useControlled from '@mui/utils/useControlled'; import { PolymorphicComponent } from '../utils/PolymorphicComponent'; import { FormControlContext } from './FormControlContext'; import { getFormControlUtilityClass } from './formControlClasses'; diff --git a/packages/mui-material/src/ListSubheader/listSubheaderClasses.ts b/packages/mui-material/src/ListSubheader/listSubheaderClasses.ts index d8ae4c3f5199ed..693e66f905b5f2 100644 --- a/packages/mui-material/src/ListSubheader/listSubheaderClasses.ts +++ b/packages/mui-material/src/ListSubheader/listSubheaderClasses.ts @@ -1,4 +1,4 @@ -import generateUtilityClasses from '@mui/utils/generateUtilityClasses'; // TODO import from @mui/base, private package +import generateUtilityClasses from '@mui/utils/generateUtilityClasses'; import generateUtilityClass from '../generateUtilityClass'; export interface ListSubheaderClasses { From bc15e4b52ed2eb7f798a74d565c04903953e8934 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Sun, 10 Sep 2023 02:13:11 +0200 Subject: [PATCH 3/7] revert changes --- packages/mui-lab/tsconfig.build.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mui-lab/tsconfig.build.json b/packages/mui-lab/tsconfig.build.json index c6951939ebf57c..f3c9573d726cf3 100644 --- a/packages/mui-lab/tsconfig.build.json +++ b/packages/mui-lab/tsconfig.build.json @@ -1,7 +1,7 @@ { // This config is for emitting declarations (.d.ts) only // Actual .ts source files are transpiled via babel - "extends": "./tsconfig", + "extends": "./tsconfig.json", "compilerOptions": { "noEmit": false, "declaration": true, From c656dac1a010020622b37f3d1543f43b42c23aea Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Sun, 10 Sep 2023 02:21:16 +0200 Subject: [PATCH 4/7] try without --- packages/mui-utils/src/integerPropType.d.ts | 15 --------------- 1 file changed, 15 deletions(-) delete mode 100644 packages/mui-utils/src/integerPropType.d.ts diff --git a/packages/mui-utils/src/integerPropType.d.ts b/packages/mui-utils/src/integerPropType.d.ts deleted file mode 100644 index 823171e8acecf7..00000000000000 --- a/packages/mui-utils/src/integerPropType.d.ts +++ /dev/null @@ -1,15 +0,0 @@ -import PropTypes from 'prop-types'; - -declare function integerPropType( - props: { [key: string]: any }, - propName: string, - componentName: string, - location: string, - propFullName: string, -): Error | null; - -declare namespace integerPropType { - let isRequired: PropTypes.Validator; -} - -export default integerPropType; From 1d4dadf6c14a858e68d6fd2f9df86ee52e747af3 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Sun, 10 Sep 2023 02:30:10 +0200 Subject: [PATCH 5/7] Revert "try without" This reverts commit c656dac1a010020622b37f3d1543f43b42c23aea. --- packages/mui-utils/src/integerPropType.d.ts | 15 +++++++++++++++ 1 file changed, 15 insertions(+) create mode 100644 packages/mui-utils/src/integerPropType.d.ts diff --git a/packages/mui-utils/src/integerPropType.d.ts b/packages/mui-utils/src/integerPropType.d.ts new file mode 100644 index 00000000000000..823171e8acecf7 --- /dev/null +++ b/packages/mui-utils/src/integerPropType.d.ts @@ -0,0 +1,15 @@ +import PropTypes from 'prop-types'; + +declare function integerPropType( + props: { [key: string]: any }, + propName: string, + componentName: string, + location: string, + propFullName: string, +): Error | null; + +declare namespace integerPropType { + let isRequired: PropTypes.Validator; +} + +export default integerPropType; From b6cdc94bc8888841f7264ee593934368b5ae71f4 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Sun, 10 Sep 2023 02:42:03 +0200 Subject: [PATCH 6/7] simpler type --- packages/mui-utils/src/integerPropType.d.ts | 12 +----------- 1 file changed, 1 insertion(+), 11 deletions(-) diff --git a/packages/mui-utils/src/integerPropType.d.ts b/packages/mui-utils/src/integerPropType.d.ts index 823171e8acecf7..36935fad6774f5 100644 --- a/packages/mui-utils/src/integerPropType.d.ts +++ b/packages/mui-utils/src/integerPropType.d.ts @@ -1,15 +1,5 @@ import PropTypes from 'prop-types'; -declare function integerPropType( - props: { [key: string]: any }, - propName: string, - componentName: string, - location: string, - propFullName: string, -): Error | null; - -declare namespace integerPropType { - let isRequired: PropTypes.Validator; -} +declare const integerPropType: PropTypes.Requireable; export default integerPropType; From b87e4b933345d7fad7dae3727c83561f6f1c3256 Mon Sep 17 00:00:00 2001 From: Olivier Tassinari Date: Sun, 10 Sep 2023 02:53:31 +0200 Subject: [PATCH 7/7] in the tests as well --- packages/mui-utils/src/capitalize/capitalize.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mui-utils/src/capitalize/capitalize.test.js b/packages/mui-utils/src/capitalize/capitalize.test.js index f78b1e5fa79200..3ae75b0bdc83c9 100644 --- a/packages/mui-utils/src/capitalize/capitalize.test.js +++ b/packages/mui-utils/src/capitalize/capitalize.test.js @@ -1,5 +1,5 @@ import { expect } from 'chai'; -import capitalize from './capitalize'; +import capitalize from '@mui/utils/capitalize'; describe('capitalize', () => { it('should work', () => {