Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix resolution of @mui/material-ui in docs #43108

Merged
merged 3 commits into from
Jul 31, 2024
Merged

Fix resolution of @mui/material-ui in docs #43108

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
0860af4
Some fixes
Janpot Jul 29, 2024
df1a2dd
Box Stack
Janpot Jul 29, 2024
c8049b7
Merge branch 'next' into some-esm-fixes
Janpot Jul 30, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion docs/data/material/components/autocomplete/AutocompleteHint.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import * as React from 'react';
import TextField from '@mui/material/TextField';
import Autocomplete from '@mui/material/Autocomplete';
import { Box, Typography } from '@mui/material';
import Box from '@mui/material/Box';
import Typography from '@mui/material/Typography';

export default function AutocompleteHint() {
const hint = React.useRef('');
Expand Down
3 changes: 2 additions & 1 deletion docs/data/material/components/autocomplete/AutocompleteHint.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import * as React from 'react';
import TextField from '@mui/material/TextField';
import Autocomplete from '@mui/material/Autocomplete';
import { Box, Typography } from '@mui/material';
import Box from '@mui/material/Box';
import Typography from '@mui/material/Typography';

export default function AutocompleteHint() {
const hint = React.useRef('');
Expand Down
3 changes: 2 additions & 1 deletion docs/data/material/components/box/BoxSx.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import * as React from 'react';
import { Box, ThemeProvider } from '@mui/material';
import Box from '@mui/material/Box';
import { ThemeProvider } from '@mui/material/styles';

export default function BoxSx() {
return (
Expand Down
3 changes: 2 additions & 1 deletion docs/data/material/components/box/BoxSx.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import * as React from 'react';
import { Box, ThemeProvider } from '@mui/material';
import Box from '@mui/material/Box';
import { ThemeProvider } from '@mui/material/styles';

export default function BoxSx() {
return (
Expand Down
2 changes: 1 addition & 1 deletion docs/data/material/components/cards/ActionAreaCard.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import Card from '@mui/material/Card';
import CardContent from '@mui/material/CardContent';
import CardMedia from '@mui/material/CardMedia';
import Typography from '@mui/material/Typography';
import { CardActionArea } from '@mui/material';
import CardActionArea from '@mui/material/CardActionArea';

export default function ActionAreaCard() {
return (
Expand Down
2 changes: 1 addition & 1 deletion docs/data/material/components/cards/ActionAreaCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import Card from '@mui/material/Card';
import CardContent from '@mui/material/CardContent';
import CardMedia from '@mui/material/CardMedia';
import Typography from '@mui/material/Typography';
import { CardActionArea } from '@mui/material';
import CardActionArea from '@mui/material/CardActionArea';

export default function ActionAreaCard() {
return (
Expand Down
4 changes: 3 additions & 1 deletion docs/data/material/components/cards/MultiActionAreaCard.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,9 @@ import Card from '@mui/material/Card';
import CardContent from '@mui/material/CardContent';
import CardMedia from '@mui/material/CardMedia';
import Typography from '@mui/material/Typography';
import { Button, CardActionArea, CardActions } from '@mui/material';
import Button from '@mui/material/Button';
import CardActionArea from '@mui/material/CardActionArea';
import CardActions from '@mui/material/CardActions';

export default function MultiActionAreaCard() {
return (
Expand Down
4 changes: 3 additions & 1 deletion docs/data/material/components/cards/MultiActionAreaCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,9 @@ import Card from '@mui/material/Card';
import CardContent from '@mui/material/CardContent';
import CardMedia from '@mui/material/CardMedia';
import Typography from '@mui/material/Typography';
import { Button, CardActionArea, CardActions } from '@mui/material';
import Button from '@mui/material/Button';
import CardActionArea from '@mui/material/CardActionArea';
import CardActions from '@mui/material/CardActions';

export default function MultiActionAreaCard() {
return (
Expand Down
10 changes: 4 additions & 6 deletions docs/data/material/components/masonry/MasonryWithVariableHeightItems.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,10 @@ import * as React from 'react';
import { styled } from '@mui/material/styles';
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
import Masonry from '@mui/lab/Masonry';
import {
Accordion,
AccordionDetails,
AccordionSummary,
Typography,
} from '@mui/material';
import Accordion from '@mui/material/Accordion';
import AccordionDetails from '@mui/material/AccordionDetails';
import AccordionSummary from '@mui/material/AccordionSummary';
import Typography from '@mui/material/Typography';
import Box from '@mui/material/Box';
import Paper from '@mui/material/Paper';

Expand Down
10 changes: 4 additions & 6 deletions docs/data/material/components/masonry/MasonryWithVariableHeightItems.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,10 @@ import * as React from 'react';
import { styled } from '@mui/material/styles';
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
import Masonry from '@mui/lab/Masonry';
import {
Accordion,
AccordionDetails,
AccordionSummary,
Typography,
} from '@mui/material';
import Accordion from '@mui/material/Accordion';
import AccordionDetails from '@mui/material/AccordionDetails';
import AccordionSummary from '@mui/material/AccordionSummary';
import Typography from '@mui/material/Typography';
import Box from '@mui/material/Box';
import Paper from '@mui/material/Paper';

Expand Down
5 changes: 3 additions & 2 deletions docs/data/material/customization/palette/AddingColorTokens.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import * as React from 'react';
import { createTheme, ThemeProvider } from '@mui/material/styles';
import { blue } from '@mui/material/colors';
import { Box, Stack } from '@mui/system';
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Also replacing this import from @mui/system to @mui/material. This didn't seem intentional, but correct me if I'm wrong

import { Typography } from '@mui/material';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography';

const theme = createTheme({
palette: {
Expand Down
5 changes: 3 additions & 2 deletions docs/data/material/customization/palette/AddingColorTokens.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import * as React from 'react';
import { createTheme, ThemeProvider } from '@mui/material/styles';
import { blue } from '@mui/material/colors';
import { Box, Stack } from '@mui/system';
import { Typography } from '@mui/material';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography';

declare module '@mui/material/styles' {
interface PaletteColor {
Expand Down
5 changes: 3 additions & 2 deletions docs/data/material/customization/palette/ManuallyProvideCustomColor.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import * as React from 'react';
import { createTheme, ThemeProvider } from '@mui/material/styles';
import Button from '@mui/material/Button';
import { Box, Stack } from '@mui/system';
import { Typography } from '@mui/material';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography';

// Augment the palette to include an ochre color

Expand Down
5 changes: 3 additions & 2 deletions docs/data/material/customization/palette/ManuallyProvideCustomColor.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import * as React from 'react';
import { createTheme, ThemeProvider } from '@mui/material/styles';
import Button from '@mui/material/Button';
import { Box, Stack } from '@mui/system';
import { Typography } from '@mui/material';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography';

// Augment the palette to include an ochre color
declare module '@mui/material/styles' {
Expand Down
5 changes: 3 additions & 2 deletions docs/data/material/customization/palette/ManuallyProvidePaletteColor.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,10 @@ import * as React from 'react';
import PropTypes from 'prop-types';
import { createTheme, ThemeProvider } from '@mui/material/styles';
import Button from '@mui/material/Button';
import { Box, Stack } from '@mui/system';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import { unstable_capitalize as capitalize } from '@mui/utils';
import { Typography } from '@mui/material';
import Typography from '@mui/material/Typography';

const theme = createTheme({
palette: {
Expand Down
5 changes: 3 additions & 2 deletions docs/data/material/customization/palette/ManuallyProvidePaletteColor.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
import * as React from 'react';
import { createTheme, ThemeProvider } from '@mui/material/styles';
import Button from '@mui/material/Button';
import { Box, Stack } from '@mui/system';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import { unstable_capitalize as capitalize } from '@mui/utils';
import { Typography } from '@mui/material';
import Typography from '@mui/material/Typography';

const theme = createTheme({
palette: {
Expand Down
5 changes: 3 additions & 2 deletions docs/data/material/customization/palette/TonalOffset.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,9 @@ import * as React from 'react';
import PropTypes from 'prop-types';
import { createTheme, ThemeProvider, useTheme } from '@mui/material/styles';
import { blue } from '@mui/material/colors';
import { Box, Stack } from '@mui/system';
import { Typography } from '@mui/material';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography';

const defaultTonalOffsetTheme = createTheme({
palette: {
Expand Down
5 changes: 3 additions & 2 deletions docs/data/material/customization/palette/TonalOffset.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import * as React from 'react';
import { createTheme, ThemeProvider, useTheme } from '@mui/material/styles';
import { blue } from '@mui/material/colors';
import { Box, Stack } from '@mui/system';
import { Typography } from '@mui/material';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography';

const defaultTonalOffsetTheme = createTheme({
palette: {
Expand Down
5 changes: 3 additions & 2 deletions docs/data/material/customization/palette/UsingAugmentColor.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import * as React from 'react';
import { createTheme, ThemeProvider } from '@mui/material/styles';
import Button from '@mui/material/Button';
import { Box, Stack } from '@mui/system';
import { Typography } from '@mui/material';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography';

// Augment the palette to include a salmon color

Expand Down
5 changes: 3 additions & 2 deletions docs/data/material/customization/palette/UsingAugmentColor.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import * as React from 'react';
import { createTheme, ThemeProvider } from '@mui/material/styles';
import Button from '@mui/material/Button';
import { Box, Stack } from '@mui/system';
import { Typography } from '@mui/material';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography';

// Augment the palette to include a salmon color
declare module '@mui/material/styles' {
Expand Down
5 changes: 3 additions & 2 deletions docs/data/material/customization/palette/UsingStylesUtils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,9 @@ import {
getContrastRatio,
} from '@mui/material/styles';
import Button from '@mui/material/Button';
import { Box, Stack } from '@mui/system';
import { Typography } from '@mui/material';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography';

// Augment the palette to include a violet color

Expand Down
5 changes: 3 additions & 2 deletions docs/data/material/customization/palette/UsingStylesUtils.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,9 @@ import {
getContrastRatio,
} from '@mui/material/styles';
import Button from '@mui/material/Button';
import { Box, Stack } from '@mui/system';
import { Typography } from '@mui/material';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import Typography from '@mui/material/Typography';

// Augment the palette to include a violet color
declare module '@mui/material/styles' {
Expand Down
3 changes: 2 additions & 1 deletion docs/data/system/experimental-api/configure-the-sx-prop/ChangeTheBehaviorSxProp.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import * as React from 'react';
import { Box, Stack } from '@mui/system';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import { createTheme, ThemeProvider } from '@mui/material/styles';

// Retain type safety.
Expand Down
3 changes: 2 additions & 1 deletion docs/data/system/experimental-api/configure-the-sx-prop/ChangeTheBehaviorSxProp.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import * as React from 'react';
import { Box, Stack } from '@mui/system';
import Box from '@mui/material/Box';
import Stack from '@mui/material/Stack';
import { createTheme, ThemeProvider } from '@mui/material/styles';

// Retain type safety.
Expand Down
6 changes: 6 additions & 0 deletions docs/next.config.mjs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -98,8 +98,14 @@ export default withDocsInfra({
...config.resolve.alias,

// for 3rd party packages with dependencies in this repository
'@mui/material$': path.resolve(workspaceRoot, 'packages/mui-material/src/index.js'),
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm confused:

'@mui/material$' seems like is added to handle top-level imports from @mui/material, but we're also removing those imports in this PR? 🤔

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

but we're also removing those imports in this PR?

Yes, but they're supposed to work, so I left this fix in

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So the fix actually works but this PR includes the changed imports as they're recommended, is that correct?

Copy link
Member Author

@Janpot Janpot Jul 30, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, just remember I didn't remove all instances of the top-level import, only the ones in public demos as that is recommended indeed.

'@mui/material': path.resolve(workspaceRoot, 'packages/mui-material/src'),

'@mui/docs': path.resolve(workspaceRoot, 'packages/mui-docs/src'),
'@mui/icons-material$': path.resolve(
workspaceRoot,
'packages/mui-icons-material/lib/esm/index.js',
),
'@mui/icons-material': path.resolve(workspaceRoot, 'packages/mui-icons-material/lib/esm'),
'@mui/lab': path.resolve(workspaceRoot, 'packages/mui-lab/src'),
'@mui/styled-engine': path.resolve(workspaceRoot, 'packages/mui-styled-engine/src'),
Expand Down
5 changes: 3 additions & 2 deletions docs/src/modules/components/ApiPage/list/ExpandableApiItem.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
import * as React from 'react';
import clsx from 'clsx';
import { alpha, styled } from '@mui/material/styles';
import { alpha, styled, SxProps } from '@mui/material/styles';
import KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp';
import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
import { Divider, IconButton, SxProps } from '@mui/material';
import Divider from '@mui/material/Divider';
import IconButton from '@mui/material/IconButton';
import {
brandingDarkTheme as darkTheme,
brandingLightTheme as lightTheme,
Expand Down
2 changes: 1 addition & 1 deletion docs/src/pages/premium-themes/onepirate/modules/form/FormButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import * as React from 'react';
import { ButtonProps } from '@mui/material';
import { ButtonProps } from '@mui/material/Button';
import Button from '../components/Button';
import defer from './defer';

Expand Down