Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

chore(site): mark MUI components and Stack as deprecated#20973

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.

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

Already on GitHub?Sign in to your account

Draft
jaaydenh wants to merge2 commits intomain
base:main
Choose a base branch
Loading
fromchore/mark-mui-stack-deprecated
Draft
Show file tree
Hide file tree
Changes fromall commits
Commits
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
37 changes: 28 additions & 9 deletionsbiome.jsonc
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -44,15 +44,34 @@
"level": "error",
"options": {
"paths": {
"@mui/material": "Use @mui/material/<name> instead. See: https://material-ui.com/guides/minimizing-bundle-size/.",
"@mui/material/Avatar": "Use components/Avatar/Avatar instead.",
"@mui/material/Alert": "Use components/Alert/Alert instead.",
"@mui/material/Popover": "Use components/Popover/Popover instead.",
"@mui/material/Typography": "Use native HTML elements instead. Eg: <span>, <p>, <h1>, etc.",
"@mui/material/Box": "Use a <div> instead.",
"@mui/material/Button": "Use a components/Button/Button instead.",
"@mui/material/styles": "Import from @emotion/react instead.",
"@mui/material/Table*": "Import from components/Table/Table instead.",
"@mui/material": "DEPRECATED: Use @mui/material/<name> instead. See: https://material-ui.com/guides/minimizing-bundle-size/.",
"@mui/material/Avatar": "DEPRECATED: Use components/Avatar/Avatar instead.",
"@mui/material/Alert": "DEPRECATED: Use components/Alert/Alert instead.",
"@mui/material/Popover": "DEPRECATED: Use components/Popover/Popover instead.",
"@mui/material/Typography": "DEPRECATED: Use native HTML elements instead. Eg: <span>, <p>, <h1>, etc.",
"@mui/material/Box": "DEPRECATED: Use a <div> with Tailwind classes instead.",
"@mui/material/Button": "DEPRECATED: Use components/Button/Button instead.",
"@mui/material/styles": "DEPRECATED: Use Tailwind CSS instead.",
"@mui/material/Table*": "DEPRECATED: Import from components/Table/Table instead.",
"@mui/material/Stack": "DEPRECATED: Use Tailwind flex utilities instead (e.g., <div className='flex flex-col gap-4'>).",
"@mui/material/TextField": "DEPRECATED: Use shadcn/ui Input component instead.",
"@mui/material/IconButton": "DEPRECATED: Use components/Button/Button with icon instead.",
"@mui/material/MenuItem": "DEPRECATED: Use shadcn/ui DropdownMenu components instead.",
"@mui/material/MenuList": "DEPRECATED: Use shadcn/ui DropdownMenu components instead.",
"@mui/material/Tooltip": "DEPRECATED: Use shadcn/ui Tooltip component instead.",
"@mui/material/Skeleton": "DEPRECATED: Use shadcn/ui Skeleton component instead.",
"@mui/material/CircularProgress": "DEPRECATED: Use lucide-react icons or shadcn/ui components instead.",
"@mui/material/Checkbox": "DEPRECATED: Use shadcn/ui Checkbox component instead.",
"@mui/material/Link": "DEPRECATED: Use Next.js Link or native <a> tags instead.",
"@mui/material/CssBaseline": "DEPRECATED: MUI CssBaseline is deprecated. Use Tailwind CSS base styles.",
"@mui/system": "DEPRECATED: MUI system is deprecated. Use Tailwind CSS instead.",
"@mui/utils": "DEPRECATED: MUI utils is deprecated. Use native alternatives or utility libraries.",
"@mui/x-tree-view": "DEPRECATED: MUI TreeView is deprecated. Use a Tailwind-compatible alternative.",
"@emotion/css": "DEPRECATED: Emotion CSS is deprecated. Use Tailwind CSS instead.",
"@emotion/react": "DEPRECATED: Emotion React is deprecated. Use Tailwind CSS instead.",
"@emotion/styled": "DEPRECATED: Emotion styled is deprecated. Use Tailwind CSS instead.",
"@emotion/cache": "DEPRECATED: Emotion cache is deprecated. Use Tailwind CSS instead.",
"components/Stack/Stack": "DEPRECATED: Stack component is deprecated. Use Tailwind flex utilities instead (e.g., <div className='flex flex-col gap-4'>).",
"lodash": "Use lodash/<name> instead."
}
}
Expand Down
11 changes: 11 additions & 0 deletionssite/src/@types/mui.d.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,14 @@
/**
* @deprecated MUI components and types are deprecated. Migrate to shadcn/ui components and Tailwind CSS.
* This file extends MUI types for legacy compatibility only.
*/

// biome-ignore lint/style/noRestrictedImports: base theme types
import type { PaletteColor, PaletteColorOptions } from "@mui/material/styles";

/**
* @deprecated MUI theme module is deprecated. Migrate to Tailwind CSS theme system.
*/
declare module "@mui/material/styles" {
interface Palette {
neutral: PaletteColor;
Expand All@@ -13,6 +21,9 @@ declare module "@mui/material/styles" {
}
}

/**
* @deprecated MUI Checkbox is deprecated. Use shadcn/ui Checkbox component instead.
*/
declare module "@mui/material/Checkbox" {
interface CheckboxPropsSizeOverrides {
xsmall: true;
Expand Down
8 changes: 8 additions & 0 deletionssite/src/components/Stack/Stack.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
import type { CSSObject } from "@emotion/react";
import { forwardRef } from "react";

/**
* @deprecated Stack component is deprecated. Use Tailwind flex utilities instead.
* Example: <div className="flex flex-col gap-4">...</div>
*/
type StackProps = {
className?: string;
direction?: "column" | "row";
Expand All@@ -10,6 +14,10 @@ type StackProps = {
wrap?: CSSObject["flexWrap"];
} & React.HTMLProps<HTMLDivElement>;

/**
* @deprecated Stack component is deprecated. Use Tailwind flex utilities instead.
* Example: <div className="flex flex-col gap-4">...</div>
*/
export const Stack = forwardRef<HTMLDivElement, StackProps>((props, ref) => {
const {
children,
Expand Down
2 changes: 2 additions & 0 deletionssite/src/contexts/ThemeProvider.tsx
View file
Open in desktop
Original file line numberDiff line numberDiff line change
Expand Up@@ -3,7 +3,9 @@ import {
CacheProvider,
ThemeProvider as EmotionThemeProvider,
} from "@emotion/react";
/** @deprecated MUI CssBaseline is deprecated. Migrate to shadcn/ui components and Tailwind CSS. */
import CssBaseline from "@mui/material/CssBaseline";
/** @deprecated MUI components are deprecated. Migrate to shadcn/ui components and Tailwind CSS. */
import {
ThemeProvider as MuiThemeProvider,
StyledEngineProvider,
Expand Down
6 changes: 6 additions & 0 deletionssite/src/theme/dark/mui.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
/**
* @deprecated MUI dark theme is deprecated. Migrate to Tailwind CSS theme system.
* This file provides MUI theme configuration for legacy compatibility only.
*/

/** @deprecated MUI createTheme is deprecated. Migrate to Tailwind CSS theme system. */
// biome-ignore lint/style/noRestrictedImports: createTheme
import { createTheme } from "@mui/material/styles";
import { BODY_FONT_FAMILY, borderRadius } from "../constants";
Expand Down
1 change: 1 addition & 0 deletionssite/src/theme/index.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
/**@deprecated MUI Theme type is deprecated. Migrate to Tailwind CSS theme system. */
// biome-ignore lint/style/noRestrictedImports: We still use `Theme` as a basis for our actual theme, for now.
importtype{ThemeasMuiTheme}from"@mui/material/styles";
importtype*asmonacofrom"monaco-editor";
Expand Down
6 changes: 6 additions & 0 deletionssite/src/theme/light/mui.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,9 @@
/**
* @deprecated MUI light theme is deprecated. Migrate to Tailwind CSS theme system.
* This file provides MUI theme configuration for legacy compatibility only.
*/

/** @deprecated MUI createTheme is deprecated. Migrate to Tailwind CSS theme system. */
// biome-ignore lint/style/noRestrictedImports: createTheme
import { createTheme } from "@mui/material/styles";
import { BODY_FONT_FAMILY, borderRadius } from "../constants";
Expand Down
7 changes: 7 additions & 0 deletionssite/src/theme/mui.ts
View file
Open in desktop
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
/**
* @deprecated MUI theme configuration is deprecated. Migrate to Tailwind CSS theme system.
* This file provides MUI theme overrides for legacy compatibility only.
*/

/** @deprecated MUI Alert classes are deprecated. Use shadcn/ui Alert component instead. */
// biome-ignore lint/style/noRestrictedImports: we use the classes for customization
import { alertClasses } from "@mui/material/Alert";
/** @deprecated MUI ThemeOptions is deprecated. Migrate to Tailwind CSS theme system. */
// biome-ignore lint/style/noRestrictedImports: we use the MUI theme as a base
import type { ThemeOptions } from "@mui/material/styles";
import {
Expand Down
Loading
[8]ページ先頭
©2009-2025 Movatter.jp