[internal] Remove stylis prefixer

docs/data/material/customization/right-to-left/RtlDemo.js

@@ -2,7 +2,6 @@ import * as React from 'react';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import TextField from '@mui/material/TextField';
 import rtlPlugin from 'stylis-plugin-rtl';
-import { prefixer } from 'stylis';
 import { CacheProvider } from '@emotion/react';
 import createCache from '@emotion/cache';
 
@@ -19,7 +18,7 @@ const theme = (outerTheme) =>
 
 const cacheRtl = createCache({
   key: 'muirtl',
-  stylisPlugins: [prefixer, rtlPlugin],
+  stylisPlugins: [rtlPlugin],
 });
 
 export default function RtlDemo() {

docs/data/material/customization/right-to-left/RtlDemo.tsx

@@ -2,7 +2,6 @@ import * as React from 'react';
 import { createTheme, ThemeProvider, Theme } from '@mui/material/styles';
 import TextField from '@mui/material/TextField';
 import rtlPlugin from 'stylis-plugin-rtl';
-import { prefixer } from 'stylis';
 import { CacheProvider } from '@emotion/react';
 import createCache from '@emotion/cache';
 
@@ -19,7 +18,7 @@ const theme = (outerTheme: Theme) =>
 
 const cacheRtl = createCache({
   key: 'muirtl',
-  stylisPlugins: [prefixer, rtlPlugin],
+  stylisPlugins: [rtlPlugin],
 });
 
 export default function RtlDemo() {

docs/data/material/customization/right-to-left/RtlOptOut.js

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { prefixer } from 'stylis';
 import rtlPlugin from 'stylis-plugin-rtl';
 import { CacheProvider } from '@emotion/react';
 import createCache from '@emotion/cache';
@@ -19,7 +18,7 @@ const Noflip = styled('div')`
 
 const rtlCache = createCache({
   key: 'muirtl',
-  stylisPlugins: [prefixer, rtlPlugin],
+  stylisPlugins: [rtlPlugin],
 });
 
 const ltrCache = createCache({

docs/data/material/customization/right-to-left/RtlOptOut.tsx

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { prefixer } from 'stylis';
 import rtlPlugin from 'stylis-plugin-rtl';
 import { CacheProvider } from '@emotion/react';
 import createCache from '@emotion/cache';
@@ -19,7 +18,7 @@ const Noflip = styled('div')`
 
 const rtlCache = createCache({
   key: 'muirtl',
-  stylisPlugins: [prefixer, rtlPlugin],
+  stylisPlugins: [rtlPlugin],
 });
 
 const ltrCache = createCache({

docs/data/material/customization/right-to-left/right-to-left.md

@@ -85,13 +85,12 @@ If you're using Emotion, use the [CacheProvider](https://emotion.sh/docs/cache-p
 ```jsx
 import { CacheProvider } from '@emotion/react';
 import createCache from '@emotion/cache';
-import { prefixer } from 'stylis';
 import rtlPlugin from 'stylis-plugin-rtl';
 
 // Create rtl cache
 const rtlCache = createCache({
   key: 'muirtl',
-  stylisPlugins: [prefixer, rtlPlugin],
+  stylisPlugins: [rtlPlugin],
 });
 
 function Rtl(props) {

docs/src/createEmotionCache.ts

@@ -1,8 +1,7 @@
 import createCache from '@emotion/cache';
-import { prefixer } from 'stylis';
 import globalSelector from './modules/utils/globalSelector';
 
 export default function createEmotionCache() {
   // TODO remove prepend: true once JSS is out
-  return createCache({ key: 'css', prepend: true, stylisPlugins: [prefixer, globalSelector] });
+  return createCache({ key: 'css', prepend: true, stylisPlugins: [globalSelector] });
 }

docs/src/modules/components/DemoSandbox.js

@@ -2,7 +2,6 @@ import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import { create } from 'jss';
-import { prefixer } from 'stylis';
 import rtlPlugin from 'stylis-plugin-rtl';
 import createCache from '@emotion/cache';
 import { CacheProvider } from '@emotion/react';
@@ -41,16 +40,19 @@ function FramedDemo(props) {
     };
   }, [document]);
 
-  const cache = React.useMemo(
-    () =>
-      createCache({
-        key: `iframe-demo-${theme.direction}`,
-        prepend: true,
-        container: document.head,
-        stylisPlugins: theme.direction === 'rtl' ? [prefixer, rtlPlugin] : [prefixer],
-      }),
-    [document, theme.direction],
-  );
+  const cache = React.useMemo(() => {
+    const cacheOptions = {
+      key: `iframe-demo-${theme.direction}`,
+      prepend: true,
+      container: document.head,
+    };
+
+    if (theme.direction === 'rtl') {
+      cacheOptions.stylisPlugins = [rtlPlugin];
+    }
+
+    return createCache(cacheOptions);
+  }, [document, theme.direction]);
 
   const getWindow = React.useCallback(() => document.defaultView, [document]);
 

docs/src/modules/utils/StyledEngineProvider.js

@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
 import { StyleSheetManager } from 'styled-components';
 import { CacheProvider } from '@emotion/react';
 import createCache from '@emotion/cache';
-import { prefixer } from 'stylis';
 import rtlPlugin from 'stylis-plugin-rtl';
 import { useTheme } from '@mui/material/styles';
 import globalSelector from './globalSelector';
@@ -12,7 +11,7 @@ import globalSelector from './globalSelector';
 const cacheRtl = createCache({
   key: 'rtl',
   prepend: true,
-  stylisPlugins: [prefixer, rtlPlugin, globalSelector],
+  stylisPlugins: [rtlPlugin, globalSelector],
 });
 
 export default function StyledEngineProvider(props) {

test/regressions/fixtures/Snackbar/PositionedSnackbarRtl.js

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import Box from '@mui/material/Box';
-import { prefixer } from 'stylis';
 import rtlPlugin from 'stylis-plugin-rtl';
 import { StyleSheetManager } from 'styled-components';
 import { CacheProvider } from '@emotion/react';
@@ -11,7 +10,7 @@ import Snackbar from '@mui/material/Snackbar';
 // Create rtl cache
 const cacheRtl = createCache({
   key: 'muirtl',
-  stylisPlugins: [prefixer, rtlPlugin],
+  stylisPlugins: [rtlPlugin],
 });
 
 const theme = createTheme({ direction: 'rtl' });

test/regressions/fixtures/Tabs/RTLVerticalTabs.js

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { prefixer } from 'stylis';
 import rtlPlugin from 'stylis-plugin-rtl';
 import { CacheProvider } from '@emotion/react';
 import createCache from '@emotion/cache';
@@ -12,7 +11,7 @@ import Tab from '@mui/material/Tab';
 // Create rtl cache
 const cacheRtl = createCache({
   key: 'muirtl',
-  stylisPlugins: [prefixer, rtlPlugin],
+  stylisPlugins: [rtlPlugin],
 });
 
 export default function RTLVerticalTabs() {

test/regressions/fixtures/Tooltip/PositionedTooltipsRtl.js

@@ -3,7 +3,6 @@ import Box from '@mui/material/Box';
 import Grid from '@mui/material/Grid';
 import Button from '@mui/material/Button';
 import Tooltip from '@mui/material/Tooltip';
-import { prefixer } from 'stylis';
 import rtlPlugin from 'stylis-plugin-rtl';
 import { StyleSheetManager } from 'styled-components';
 import { CacheProvider } from '@emotion/react';
@@ -13,7 +12,7 @@ import createCache from '@emotion/cache';
 // Create rtl cache
 const cacheRtl = createCache({
   key: 'muirtl',
-  stylisPlugins: [prefixer, rtlPlugin],
+  stylisPlugins: [rtlPlugin],
 });
 
 const theme = createTheme({ direction: 'rtl' });