From 7b0848a4ae1e5380a2daf49981c488e916601128 Mon Sep 17 00:00:00 2001 From: Petro Silenius Date: Wed, 2 Nov 2022 15:10:00 +0100 Subject: [PATCH] [examples] Next.js examples v13 - links (#34970) --- examples/nextjs-with-typescript/src/Link.tsx | 25 ++++++++++++++++-- examples/nextjs/src/Link.js | 27 ++++++++++++++++++-- 2 files changed, 48 insertions(+), 4 deletions(-) diff --git a/examples/nextjs-with-typescript/src/Link.tsx b/examples/nextjs-with-typescript/src/Link.tsx index 1baf5f7d60ebca..c46e023517272b 100644 --- a/examples/nextjs-with-typescript/src/Link.tsx +++ b/examples/nextjs-with-typescript/src/Link.tsx @@ -17,7 +17,17 @@ interface NextLinkComposedProps export const NextLinkComposed = React.forwardRef( function NextLinkComposed(props, ref) { - const { to, linkAs, replace, scroll, shallow, prefetch, locale, ...other } = props; + const { + to, + linkAs, + replace, + scroll, + shallow, + prefetch, + legacyBehavior = true, + locale, + ...other + } = props; return ( @@ -53,6 +64,7 @@ const Link = React.forwardRef(function Link(props, as, className: classNameProps, href, + legacyBehavior, linkAs: linkAsProp, locale, noLinkStyle, @@ -82,7 +94,16 @@ const Link = React.forwardRef(function Link(props, } const linkAs = linkAsProp || as; - const nextjsProps = { to: href, linkAs, replace, scroll, shallow, prefetch, locale }; + const nextjsProps = { + to: href, + linkAs, + replace, + scroll, + shallow, + prefetch, + legacyBehavior, + locale, + }; if (noLinkStyle) { return ; diff --git a/examples/nextjs/src/Link.js b/examples/nextjs/src/Link.js index 64c1604552b916..0d0eba9cdb0eef 100644 --- a/examples/nextjs/src/Link.js +++ b/examples/nextjs/src/Link.js @@ -10,7 +10,17 @@ import { styled } from '@mui/material/styles'; const Anchor = styled('a')({}); export const NextLinkComposed = React.forwardRef(function NextLinkComposed(props, ref) { - const { to, linkAs, replace, scroll, shallow, prefetch, locale, ...other } = props; + const { + to, + linkAs, + replace, + scroll, + shallow, + prefetch, + legacyBehavior = true, + locale, + ...other + } = props; return ( @@ -30,6 +41,7 @@ export const NextLinkComposed = React.forwardRef(function NextLinkComposed(props NextLinkComposed.propTypes = { href: PropTypes.any, + legacyBehavior: PropTypes.bool, linkAs: PropTypes.oneOfType([PropTypes.object, PropTypes.string]), locale: PropTypes.string, passHref: PropTypes.bool, @@ -48,6 +60,7 @@ const Link = React.forwardRef(function Link(props, ref) { as, className: classNameProps, href, + legacyBehavior, linkAs: linkAsProp, locale, noLinkStyle, @@ -77,7 +90,16 @@ const Link = React.forwardRef(function Link(props, ref) { } const linkAs = linkAsProp || as; - const nextjsProps = { to: href, linkAs, replace, scroll, shallow, prefetch, locale }; + const nextjsProps = { + to: href, + linkAs, + replace, + scroll, + shallow, + prefetch, + legacyBehavior, + locale, + }; if (noLinkStyle) { return ; @@ -99,6 +121,7 @@ Link.propTypes = { as: PropTypes.oneOfType([PropTypes.object, PropTypes.string]), className: PropTypes.string, href: PropTypes.any, + legacyBehavior: PropTypes.bool, linkAs: PropTypes.oneOfType([PropTypes.object, PropTypes.string]), locale: PropTypes.string, noLinkStyle: PropTypes.bool,