@mui/codemod 9.0.0-alpha.4 → 9.0.0-beta.0

package/v9.0.0/system-props/test-cases/system-props.expected.js

@@ -0,0 +1,175 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _material = require("@mui/material");
+var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
+var _Stack = _interopRequireDefault(require("@mui/material/Stack"));
+var _Link2 = _interopRequireDefault(require("@mui/material/Link"));
+var _DialogContentText = _interopRequireDefault(require("@mui/material/DialogContentText"));
+var _TimelineContent = _interopRequireDefault(require("@mui/lab/TimelineContent"));
+var _TimelineOppositeContent = _interopRequireDefault(require("@mui/lab/TimelineOppositeContent"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _Link;
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+  sx: {
+    typography: "body1"
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+  sx: {
+    color: "palette.main",
+    display: 'block'
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid, {
+  container: true,
+  sx: {
+    flexDirection: `column`
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Grid2, {
+  container: true,
+  sx: {
+    flexDirection: `column`
+  }
+});
+const sx = {
+  display: 'flex'
+};
+const ml = 2;
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+  sx: {
+    color: "#fff",
+    mb: 5
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+  sx: {
+    color: "hsl(200 30% 30%)",
+    mb: 5
+  }
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+  variant: "body1",
+  sx: [{
+    color: "primary.main",
+    ml: ml
+  }, ...(Array.isArray(sx) ? sx : [sx])]
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+  variant: "body1",
+  sx: [{
+    color: "divider",
+    ml: ml
+  }, ...(Array.isArray(sx) ? sx : [sx])]
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+  variant: "body1",
+  sx: [{
+    color: "inherit",
+    ml: ml
+  }, ...(Array.isArray(sx) ? sx : [sx])]
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+  startDecorator: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+    textColor: "text.secondary",
+    sx: {
+      fontSize: "lg"
+    },
+    children: "$"
+  }),
+  sx: {
+    fontSize: "xl4",
+    lineHeight: 1,
+    alignItems: 'flex-start'
+  },
+  children: "25"
+});
+function Copyright(props) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Typography.default, {
+    variant: "body2",
+    align: "center",
+    ...props,
+    sx: [{
+      color: "text.secondary"
+    }, ...(Array.isArray(props.sx) ? props.sx : [props.sx])],
+    children: ['Copyright © ', _Link || (_Link = /*#__PURE__*/(0, _jsxRuntime.jsx)(_Link2.default, {
+      color: "inherit",
+      href: "https://mui.com/",
+      children: "Your Website"
+    })), ' ', new Date().getFullYear(), '.']
+  });
+}
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Stack.default, {
+  sx: [{
+    flex: "1"
+  }, ...(Array.isArray(sx) ? sx : [sx])]
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+  sx: [{
+    typography: "body1"
+  }, foo.bar ? {
+    opacity: 0
+  } : sx]
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Link2.default, {
+  color: "inherit",
+  href: "https://mui.com/",
+  children: "Sitemark"
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Link2.default, {
+  variant: "body2",
+  href: "#",
+  sx: {
+    color: "text.secondary"
+  },
+  children: "Features"
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Link2.default, {
+  color: "primary",
+  href: "#",
+  children: "Primary Link"
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_DialogContentText.default, {
+  sx: {
+    color: "text.secondary"
+  },
+  children: "Some content"
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_DialogContentText.default, {
+  sx: {
+    color: "inherit",
+    mt: 2
+  },
+  children: "Inherited"
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_DialogContentText.default, {
+  color: "primary",
+  children: "Primary"
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_TimelineOppositeContent.default, {
+  sx: {
+    color: "text.secondary"
+  },
+  children: "09:30 am"
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_TimelineContent.default, {
+  sx: {
+    color: "inherit"
+  },
+  children: "Eat"
+});
+
+// Dynamic color values (expression, not string literal)
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+  color: dynamicColor,
+  sx: {
+    mb: 2
+  },
+  children: "Dynamic"
+});
+/*#__PURE__*/(0, _jsxRuntime.jsx)(_Link2.default, {
+  color: linkColor,
+  href: "#",
+  children: "Dynamic Link"
+});