@mui/docs 6.0.0-alpha.1 → 6.0.0-alpha.11

package/InfoCard/InfoCard.js

@@ -1,6 +1,3 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["classNameDescription", "classNameTitle", "dense", "description", "icon", "link", "svg", "title", "titleProps"];
 import * as React from 'react';
 import { alpha } from '@mui/material/styles';
 import Box from '@mui/material/Box';
@@ -12,9 +9,9 @@ export function GlowingIconContainer({
   icon
 }) {
   return /*#__PURE__*/_jsx(Box, {
-    sx: theme => _extends({
-      width: 40,
-      height: 40,
+    sx: theme => ({
+      width: 36,
+      height: 36,
       display: 'flex',
       justifyContent: 'center',
       alignItems: 'center',
@@ -23,64 +20,68 @@ export function GlowingIconContainer({
       border: '1px solid',
       borderColor: 'primary.200',
       bgcolor: 'primary.50',
-      boxShadow: `0px 1px 6px 0px ${alpha(theme.palette.primary[500], 0.2)}, 0px 2px 12px 0px rgba(234, 237, 241, 0.3) inset`
-    }, theme.applyDarkStyles({
-      borderColor: alpha(theme.palette.primary[400], 0.25),
-      bgcolor: alpha(theme.palette.primary[900], 0.25),
-      boxShadow: `0 2px 6px 0 ${alpha(theme.palette.primary[600], 0.3)}, 0px 2px 12px 0px rgba(0, 0, 0, 0.25) inset`
-    })),
+      boxShadow: `0px 0 0 2px ${alpha(theme.palette.primary[500], 0.1)}, 0px 2px 12px 0px rgba(234, 237, 241, 0.3) inset`,
+      '& .MuiSvgIcon-root': {
+        fontSize: theme.typography.pxToRem(18)
+      },
+      ...theme.applyDarkStyles({
+        borderColor: alpha(theme.palette.primary[400], 0.25),
+        bgcolor: alpha(theme.palette.primary[900], 0.2),
+        boxShadow: `0 0 0 2px ${alpha(theme.palette.primary[600], 0.1)}, 0px 2px 12px 0px rgba(0, 0, 0, 0.25) inset`
+      })
+    }),
     children: icon
   });
 }
 export function InfoCard(props) {
   const {
-      classNameDescription,
-      classNameTitle,
-      dense,
-      description,
-      icon,
-      link,
-      svg,
-      title,
-      titleProps
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
-  return /*#__PURE__*/_jsxs(Paper, _extends({
+    classNameDescription,
+    classNameTitle,
+    description,
+    icon,
+    link,
+    svg,
+    title,
+    titleProps,
+    ...other
+  } = props;
+  return /*#__PURE__*/_jsxs(Paper, {
     variant: "outlined",
     component: link ? Link : 'div',
-    href: link
-  }, link ? {
-    noLinkStyle: true,
-    // Fix overloading with prefetch={false}, only prefetch on hover.
-    prefetch: false
-  } : {}, {
-    sx: theme => _extends({
-      p: dense ? 2.5 : 3.5,
+    href: link,
+    ...(link ? {
+      noLinkStyle: true,
+      // Fix overloading with prefetch={false}, only prefetch on hover.
+      prefetch: false
+    } : {}),
+    sx: theme => ({
+      p: 2.5,
       height: '100%',
-      background: `${(theme.vars || theme).palette.gradients.linearSubtle}`
-    }, theme.applyDarkStyles({
-      bgcolor: alpha(theme.palette.primaryDark[800], 0.25),
       background: `${(theme.vars || theme).palette.gradients.linearSubtle}`,
-      borderColor: 'primaryDark.700'
-    }))
-  }, other, {
+      ...theme.applyDarkStyles({
+        bgcolor: alpha(theme.palette.primaryDark[800], 0.25),
+        background: `${(theme.vars || theme).palette.gradients.linearSubtle}`,
+        borderColor: 'primaryDark.700'
+      })
+    }),
+    ...other,
     children: [svg && svg, icon && /*#__PURE__*/_jsx(GlowingIconContainer, {
       icon: icon
-    }), /*#__PURE__*/_jsx(Typography, _extends({
-      fontWeight: "bold",
+    }), /*#__PURE__*/_jsx(Typography, {
+      fontWeight: "semiBold",
       component: "h3",
       color: "text.primary",
       variant: "body2",
       mt: icon ? 2 : 0,
       mb: description ? 0.5 : 0,
-      className: classNameTitle
-    }, titleProps, {
+      className: classNameTitle,
+      ...titleProps,
       children: title
-    })), /*#__PURE__*/_jsx(Typography, {
+    }), /*#__PURE__*/_jsx(Typography, {
       variant: "body2",
       color: "text.secondary",
       className: classNameDescription,
       children: description
     })]
-  }));
+  });
 }

package/Link/Link.js

@@ -1,7 +1,3 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["to", "linkAs", "replace", "scroll", "shallow", "prefetch", "legacyBehavior", "locale"],
-  _excluded2 = ["activeClassName", "as", "className", "href", "legacyBehavior", "linkAs", "locale", "noLinkStyle", "prefetch", "replace", "role", "scroll", "shallow"];
 import * as React from 'react';
 import clsx from 'clsx';
 import { useRouter } from 'next/router';
@@ -24,16 +20,16 @@ import { jsx as _jsx } from "react/jsx-runtime";
 const Anchor = styled('a')({});
 const NextLinkComposed = /*#__PURE__*/React.forwardRef(function NextLinkComposed(props, ref) {
   const {
-      to,
-      linkAs,
-      replace,
-      scroll,
-      shallow,
-      prefetch,
-      legacyBehavior = true,
-      locale
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded);
+    to,
+    linkAs,
+    replace,
+    scroll,
+    shallow,
+    prefetch,
+    legacyBehavior = true,
+    locale,
+    ...other
+  } = props;
   return /*#__PURE__*/_jsx(NextLink, {
     href: to,
     prefetch: prefetch,
@@ -44,31 +40,33 @@ const NextLinkComposed = /*#__PURE__*/React.forwardRef(function NextLinkComposed
     passHref: true,
     locale: locale,
     legacyBehavior: legacyBehavior,
-    children: /*#__PURE__*/_jsx(Anchor, _extends({
+    children: /*#__PURE__*/_jsx(Anchor, {
       "data-no-markdown-link": "true",
-      ref: ref
-    }, other))
+      ref: ref,
+      ...other
+    })
   });
 });
 // A styled version of the Next.js Pages Router Link component:
 // https://nextjs.org/docs/pages/api-reference/components/link
 export const Link = /*#__PURE__*/React.forwardRef(function Link(props, ref) {
   const {
-      activeClassName = 'active',
-      as,
-      className: classNameProps,
-      href,
-      legacyBehavior,
-      linkAs: linkAsProp,
-      locale,
-      noLinkStyle,
-      prefetch,
-      replace,
-      // Link don't have roles.
-      scroll,
-      shallow
-    } = props,
-    other = _objectWithoutPropertiesLoose(props, _excluded2);
+    activeClassName = 'active',
+    as,
+    className: classNameProps,
+    href,
+    legacyBehavior,
+    linkAs: linkAsProp,
+    locale,
+    noLinkStyle,
+    prefetch,
+    replace,
+    role,
+    // Link don't have roles.
+    scroll,
+    shallow,
+    ...other
+  } = props;
   const router = useRouter();
   const pathname = typeof href === 'string' ? href : href?.pathname;
   const routerPathname = router.pathname.replace('/[docsTab]', '');
@@ -93,14 +91,18 @@ export const Link = /*#__PURE__*/React.forwardRef(function Link(props, ref) {
     locale
   };
   if (noLinkStyle) {
-    return /*#__PURE__*/_jsx(NextLinkComposed, _extends({
+    return /*#__PURE__*/_jsx(NextLinkComposed, {
       className: className,
-      ref: ref
-    }, nextjsProps, other));
+      ref: ref,
+      ...nextjsProps,
+      ...other
+    });
   }
-  return /*#__PURE__*/_jsx(MuiLink, _extends({
+  return /*#__PURE__*/_jsx(MuiLink, {
     component: NextLinkComposed,
     className: className,
-    ref: ref
-  }, nextjsProps, other));
+    ref: ref,
+    ...nextjsProps,
+    ...other
+  });
 });

package/MarkdownElement/MarkdownElement.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export interface MarkdownElementProps {
+    className?: string;
+    renderedMarkdown?: string;
+}
+export declare const MarkdownElement: React.ForwardRefExoticComponent<MarkdownElementProps & React.RefAttributes<HTMLDivElement>>;