[core] Upgrade monorepo (#7849)

Co-authored-by: Lukas <llukas.tyla@gmail.com>
mui · Feb 9, 2023 · fafef05 · fafef05
1 parent c6ab151
commit fafef05
Show file tree

Hide file tree

Showing 23 changed files with 113 additions and 157 deletions.
diff --git a/babel.config.js b/babel.config.js
@@ -14,6 +14,7 @@ const defaultAlias = {
  '@mui/x-license-pro': resolveAliasPath('./packages/x-license-pro/src'),
  '@mui/x-date-pickers': resolveAliasPath('./packages/x-date-pickers/src'),
  '@mui/x-date-pickers-pro': resolveAliasPath('./packages/x-date-pickers-pro/src'),
+ '@mui/markdown': '@mui/monorepo/packages/markdown',
  'typescript-to-proptypes': '@mui/monorepo/packages/typescript-to-proptypes/src',
  docs: resolveAliasPath('./node_modules/@mui/monorepo/docs'),
  test: resolveAliasPath('./test'),

diff --git a/docs/babel.config.js b/docs/babel.config.js
@@ -9,7 +9,7 @@ const alias = {
  '@mui/x-date-pickers-pro': '../packages/x-date-pickers-pro/src',
  '@mui/x-license-pro': '../packages/x-license-pro/src',
  '@mui/docs': '../node_modules/@mui/monorepo/packages/mui-docs/src',
- '@mui/markdown': '../node_modules/@mui/monorepo/docs/packages/markdown',
+ '@mui/markdown': '../node_modules/@mui/monorepo/packages/markdown',
  '@mui/monorepo': '../node_modules/@mui/monorepo',
  '@mui/joy': '../node_modules/@mui/monorepo/packages/mui-joy/src',
  docs: '../node_modules/@mui/monorepo/docs', // TODO remove

diff --git a/docs/config.js b/docs/config.js
@@ -0,0 +1 @@
+module.exports = require('@mui/monorepo/docs/config');
diff --git a/docs/data/data-grid/demo/PopularFeaturesDemo.js b/docs/data/data-grid/demo/PopularFeaturesDemo.js
@@ -129,7 +129,7 @@ export const featuresSet = [
  },
  {
  id: 12,
- name: 'Aggretation and Summary rows',
+ name: 'Aggregation and Summary rows',
  description: 'Set summary footer rows or inline summaries with row grouping',
  plan: 'Premium',
  detailPage: '/aggregation/',

diff --git a/docs/data/data-grid/demo/PopularFeaturesDemo.tsx b/docs/data/data-grid/demo/PopularFeaturesDemo.tsx
@@ -144,7 +144,7 @@ export const featuresSet: Row[] = [
  },
  {
  id: 12,
- name: 'Aggretation and Summary rows',
+ name: 'Aggregation and Summary rows',
  description: 'Set summary footer rows or inline summaries with row grouping',
  plan: 'Premium',
  detailPage: '/aggregation/',

diff --git a/docs/data/date-pickers/date-field/CustomUIDateField.js b/docs/data/date-pickers/date-field/CustomUIDateField.js
@@ -1,26 +1,13 @@
 import * as React from 'react';
 import dayjs from 'dayjs';
-import { CssVarsProvider } from '@mui/joy/styles';
 import Stack from '@mui/material/Stack';
 import FormControlLabel from '@mui/material/FormControlLabel';
-import FormLabel from '@mui/joy/FormLabel';
-import JoyTextField from '@mui/joy/TextField';
+import FormLabel from '@mui/material/FormLabel';
 import InputUnstyled from '@mui/base/InputUnstyled';
 import { LocalizationProvider } from '@mui/x-date-pickers';
 import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
 import { unstable_useDateField as useDateField } from '@mui/x-date-pickers/DateField';
 
-const JoyDateField = (props) => {
- const { inputRef, inputProps } = useDateField(props);
-
- return (
- <JoyTextField
- {...inputProps}
- componentsProps={{ input: { componentsProps: { input: { ref: inputRef } } } }}
- />
- );
-};
-
 const UnstyledDateField = (props) => {
  const { inputRef, inputProps } = useDateField(props);
 
@@ -47,28 +34,21 @@ export default function CustomUIDateField() {
  const handleChange = (newValue) => setValue(newValue);
 
  return (
- <CssVarsProvider>
- <LocalizationProvider dateAdapter={AdapterDayjs}>
- <Stack spacing={2}>
- <JoyDateField
- label="Using @mui/joy TextField"
- value={value}
- onChange={handleChange}
- />
- <FormControlLabel
- label={<FormLabel>Using unstyled input</FormLabel>}
- control={<UnstyledDateField value={value} onChange={handleChange} />}
- labelPlacement="top"
- sx={{ alignItems: 'stretch' }}
- />
- <FormControlLabel
- label={<FormLabel>Using browser input</FormLabel>}
- control={<BrowserInputDateField value={value} onChange={handleChange} />}
- labelPlacement="top"
- sx={{ alignItems: 'stretch' }}
- />
- </Stack>
- </LocalizationProvider>
- </CssVarsProvider>
+ <LocalizationProvider dateAdapter={AdapterDayjs}>
+ <Stack spacing={2}>
+ <FormControlLabel
+ label={<FormLabel>Using unstyled input</FormLabel>}
+ control={<UnstyledDateField value={value} onChange={handleChange} />}
+ labelPlacement="top"
+ sx={{ margin: 0 }}
+ />
+ <FormControlLabel
+ label={<FormLabel>Using browser input</FormLabel>}
+ control={<BrowserInputDateField value={value} onChange={handleChange} />}
+ labelPlacement="top"
+ sx={{ margin: 0 }}
+ />
+ </Stack>
+ </LocalizationProvider>
  );
 }
diff --git a/docs/data/date-pickers/date-field/CustomUIDateField.tsx b/docs/data/date-pickers/date-field/CustomUIDateField.tsx
@@ -1,12 +1,8 @@
 import * as React from 'react';
 import dayjs, { Dayjs } from 'dayjs';
-import { CssVarsProvider } from '@mui/joy/styles';
 import Stack from '@mui/material/Stack';
 import FormControlLabel from '@mui/material/FormControlLabel';
-import FormLabel from '@mui/joy/FormLabel';
-import JoyTextField, {
- TextFieldProps as JoyTextFieldProps,
-} from '@mui/joy/TextField';
+import FormLabel from '@mui/material/FormLabel';
 import InputUnstyled, { InputUnstyledProps } from '@mui/base/InputUnstyled';
 import { LocalizationProvider } from '@mui/x-date-pickers';
 import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
@@ -15,21 +11,6 @@ import {
  UseDateFieldComponentProps,
 } from '@mui/x-date-pickers/DateField';
 
-type JoyDateFieldProps = UseDateFieldComponentProps<Dayjs, Dayjs, JoyTextFieldProps>;
-
-const JoyDateField = (props: JoyDateFieldProps) => {
- const { inputRef, inputProps } = useDateField<Dayjs, Dayjs, JoyDateFieldProps>(
- props,
- );
-
- return (
- <JoyTextField
- {...inputProps}
- componentsProps={{ input: { componentsProps: { input: { ref: inputRef } } } }}
- />
- );
-};
-
 type UnstyledDateFieldProps = UseDateFieldComponentProps<
  Dayjs,
  Dayjs,
@@ -72,28 +53,21 @@ export default function CustomUIDateField() {
  const handleChange = (newValue: Dayjs | null) => setValue(newValue);
 
  return (
- <CssVarsProvider>
- <LocalizationProvider dateAdapter={AdapterDayjs}>
- <Stack spacing={2}>
- <JoyDateField
- label="Using @mui/joy TextField"
- value={value}
- onChange={handleChange}
- />
- <FormControlLabel
- label={<FormLabel>Using unstyled input</FormLabel>}
- control={<UnstyledDateField value={value} onChange={handleChange} />}
- labelPlacement="top"
- sx={{ alignItems: 'stretch' }}
- />
- <FormControlLabel
- label={<FormLabel>Using browser input</FormLabel>}
- control={<BrowserInputDateField value={value} onChange={handleChange} />}
- labelPlacement="top"
- sx={{ alignItems: 'stretch' }}
- />
- </Stack>
- </LocalizationProvider>
- </CssVarsProvider>
+ <LocalizationProvider dateAdapter={AdapterDayjs}>
+ <Stack spacing={2}>
+ <FormControlLabel
+ label={<FormLabel>Using unstyled input</FormLabel>}
+ control={<UnstyledDateField value={value} onChange={handleChange} />}
+ labelPlacement="top"
+ sx={{ margin: 0 }}
+ />
+ <FormControlLabel
+ label={<FormLabel>Using browser input</FormLabel>}
+ control={<BrowserInputDateField value={value} onChange={handleChange} />}
+ labelPlacement="top"
+ sx={{ margin: 0 }}
+ />
+ </Stack>
+ </LocalizationProvider>
  );
 }
diff --git a/docs/data/date-pickers/date-field/CustomUIDateField.tsx.preview b/docs/data/date-pickers/date-field/CustomUIDateField.tsx.preview
@@ -0,0 +1,16 @@
+<LocalizationProvider dateAdapter={AdapterDayjs}>
+ <Stack spacing={2}>
+ <FormControlLabel
+ label={<FormLabel>Using unstyled input</FormLabel>}
+ control={<UnstyledDateField value={value} onChange={handleChange} />}
+ labelPlacement="top"
+ sx={{ margin: 0 }}
+ />
+ <FormControlLabel
+ label={<FormLabel>Using browser input</FormLabel>}
+ control={<BrowserInputDateField value={value} onChange={handleChange} />}
+ labelPlacement="top"
+ sx={{ margin: 0 }}
+ />
+ </Stack>
+</LocalizationProvider>
diff --git a/docs/data/pages.ts b/docs/data/pages.ts
@@ -2,8 +2,8 @@ import type { MuiPage } from '@mui/monorepo/docs/src/MuiPage';
 
 const pages: MuiPage[] = [
  {
- pathname: '/x/introduction',
- scopePathnames: ['/x/introduction'],
+ pathname: '/x/introduction-group',
+ title: 'Introduction',
  icon: 'DescriptionIcon',
  children: [
  { pathname: `/x/introduction`, title: 'Overview' },
@@ -14,9 +14,8 @@ const pages: MuiPage[] = [
  ],
  },
  {
- pathname: '/x/react-data-grid',
- scopePathnames: ['/x/api/data-grid'],
- title: 'Data grid',
+ pathname: '/x/react-data-grid-group',
+ title: 'Data Grid',
  icon: 'TableViewIcon',
  children: [
  { pathname: '/x/react-data-grid', title: 'Overview' },
@@ -26,7 +25,6 @@ const pages: MuiPage[] = [
  { pathname: '/x/react-data-grid/layout' },
  {
  pathname: '/x/react-data-grid/columns',
- scopePathnames: ['/x/react-data-grid/column-'],
  children: [
  { pathname: '/x/react-data-grid/column-definition' },
  { pathname: '/x/react-data-grid/column-dimensions' },
@@ -40,7 +38,6 @@ const pages: MuiPage[] = [
  },
  {
  pathname: '/x/react-data-grid/rows',
- scopePathnames: ['/x/react-data-grid/row-', '/x/react-data-grid/master-detail'],
  children: [
  { pathname: '/x/react-data-grid/row-definition' },
  { pathname: '/x/react-data-grid/row-updates' },
@@ -64,14 +61,8 @@ const pages: MuiPage[] = [
  { pathname: '/x/react-data-grid/virtualization' },
  { pathname: '/x/react-data-grid/accessibility' },
  {
- pathname: '/x/react-data-grid/row-grouping',
+ pathname: '/x/react-data-grid-group-pivot',
  title: 'Group & Pivot',
- scopePathnames: [
- '/x/react-data-grid/row-grouping',
- '/x/react-data-grid/tree-data',
- '/x/react-data-grid/aggregation',
- '/x/react-data-grid/pivoting',
- ],
  children: [
  { pathname: '/x/react-data-grid/row-grouping', plan: 'premium' },
  { pathname: '/x/react-data-grid/tree-data', plan: 'pro' },
@@ -81,12 +72,7 @@ const pages: MuiPage[] = [
  },
  {
  title: 'Advanced',
- pathname: '/x/react-data-grid/api-object',
- scopePathnames: [
- '/x/react-data-grid/api-object',
- '/x/react-data-grid/events',
- '/x/react-data-grid/state',
- ],
+ pathname: '/x/react-data-grid/advanced',
  children: [
  { pathname: '/x/react-data-grid/api-object', title: 'API object' },
  { pathname: '/x/react-data-grid/events' },
@@ -96,14 +82,13 @@ const pages: MuiPage[] = [
  {
  title: 'Recipes',
  pathname: '/x/react-data-grid/recipes',
- scopePathnames: ['/x/react-data-grid/recipes-'],
  children: [
  { pathname: '/x/react-data-grid/recipes-editing', title: 'Editing' },
  { pathname: '/x/react-data-grid/recipes-row-grouping', title: 'Row grouping' },
  ],
  },
  {
- pathname: '/x/api/data-grid',
+ pathname: '/x/api/data-grid-group',
  title: 'API Reference',
  children: [
  { pathname: '/x/api/data-grid', title: 'Index' },
@@ -144,8 +129,7 @@ const pages: MuiPage[] = [
  },
  {
  pathname: '/x/react-date-pickers',
- scopePathnames: ['/x/api/date-pickers'],
- title: 'Date and Time pickers',
+ title: 'Date and Time Pickers',
  icon: 'DatePickerIcon',
  children: [
  { pathname: '/x/react-date-pickers/getting-started' },
@@ -170,7 +154,7 @@ const pages: MuiPage[] = [
  plan: 'pro',
  },
  {
- pathname: '/x/api/date-pickers',
+ pathname: '/x/api/date-pickers-group',
  title: 'API Reference',
  children: [
  { pathname: '/x/api/date-pickers', title: 'Index' },

diff --git a/docs/next.config.js b/docs/next.config.js
@@ -6,7 +6,12 @@ const pkg = require('../package.json');
 const dataGridPkg = require('../packages/grid/x-data-grid/package.json');
 const datePickersPkg = require('../packages/x-date-pickers/package.json');
 const { findPages } = require('./src/modules/utils/find');
-const { LANGUAGES, LANGUAGES_SSR } = require('./src/modules/constants');
+const {
+ LANGUAGES,
+ LANGUAGES_SSR,
+ LANGUAGES_IN_PROGRESS,
+ LANGUAGES_IGNORE_PAGES,
+} = require('./config');
 
 const workspaceRoot = path.join(__dirname, '../');
 
@@ -62,7 +67,15 @@ module.exports = withDocsInfra({
  oneOf: [
  {
  resourceQuery: /@mui\/markdown/,
- use: require.resolve('@mui/monorepo/docs/packages/markdown/loader'),
+ use: [
+ {
+ loader: require.resolve('@mui/monorepo/packages/markdown/loader'),
+ options: {
+ ignoreLanguagePages: LANGUAGES_IGNORE_PAGES,
+ languagesInProgress: LANGUAGES_IN_PROGRESS,
+ },
+ },
+ ],
  },
  ],
  },

diff --git a/docs/pages/_app.js b/docs/pages/_app.js
@@ -201,15 +201,19 @@ function AppWrapper(props) {
  }
  }, []);
 
- const activePage = findActivePage(pages, router.pathname);
-
  let fonts = [];
  if (router.pathname.match(/onepirate/)) {
  fonts = [
  'https://fonts.googleapis.com/css?family=Roboto+Condensed:700|Work+Sans:300,400&display=swap',
  ];
  }
 
+ const pageContextValue = React.useMemo(() => {
+ const { activePage, activePageParents } = findActivePage(pages, router.pathname);
+
+ return { activePage, activePageParents, pages };
+ }, [router.pathname]);
+
  return (
  <React.Fragment>
  <NextHead>
@@ -220,7 +224,7 @@ function AppWrapper(props) {
  <UserLanguageProvider defaultUserLanguage={pageProps.userLanguage}>
  <CodeCopyProvider>
  <CodeVariantProvider>
- <PageContext.Provider value={{ activePage, pages }}>
+ <PageContext.Provider value={pageContextValue}>
  <ThemeProvider>
  <DocsStyledEngineProvider cacheLtr={emotionCache}>
  {children}

diff --git a/docs/public/static/sponsors/doit-dark.svg b/docs/public/static/sponsors/doit-dark.svg
diff --git a/docs/public/static/sponsors/doit-square.svg b/docs/public/static/sponsors/doit-square.svg
diff --git a/docs/public/static/sponsors/megafamous.png b/docs/public/static/sponsors/megafamous.png