From 28bf895e31b5b6db01d1708a7cf4d9e7dab75e86 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Wed, 13 Mar 2024 22:39:59 +0100 Subject: [PATCH 1/2] Don't transform MDX anchors if their hrefs starts with http:// --- code/ui/blocks/src/blocks/mdx.tsx | 76 ++++++++++++++++--------------- 1 file changed, 39 insertions(+), 37 deletions(-) diff --git a/code/ui/blocks/src/blocks/mdx.tsx b/code/ui/blocks/src/blocks/mdx.tsx index 453f5c9ff8ed..1659eef1dc79 100644 --- a/code/ui/blocks/src/blocks/mdx.tsx +++ b/code/ui/blocks/src/blocks/mdx.tsx @@ -96,45 +96,47 @@ export const AnchorMdx: FC> = (props) => { const { href, target, children, ...rest } = props; const context = useContext(DocsContext); - if (href) { - // Enable scrolling for in-page anchors. - if (href.startsWith('#')) { - return {children}; - } - - // Links to other pages of SB should use the base URL of the top level iframe instead of the base URL of the preview iframe. - if (target !== '_blank' && !href.startsWith('https://')) { - return ( - ) => { - // Cmd/Ctrl/Shift/Alt + Click should trigger default browser behaviour. Same applies to non-left clicks - const LEFT_BUTTON = 0; - const isLeftClick = - event.button === LEFT_BUTTON && - !event.altKey && - !event.ctrlKey && - !event.metaKey && - !event.shiftKey; - - if (isLeftClick) { - event.preventDefault(); - // use the A element's href, which has been modified for - // local paths without a `?path=` query param prefix - navigate(context, event.currentTarget.getAttribute('href')); - } - }} - target={target} - {...rest} - > - {children} - - ); - } + if (!href) { + return ; } - // External URL dont need any modification. - return ; + // Enable scrolling for in-page anchors. + if (href.startsWith('#')) { + return {children}; + } + + // links to external locations don't need any modifications. + if (target === '_blank' || /^https?:\/\//.test(href)) { + return ; + } + + // Links to other pages of SB should use the base URL of the top level iframe instead of the base URL of the preview iframe. + return ( + ) => { + // Cmd/Ctrl/Shift/Alt + Click should trigger default browser behaviour. Same applies to non-left clicks + const LEFT_BUTTON = 0; + const isLeftClick = + event.button === LEFT_BUTTON && + !event.altKey && + !event.ctrlKey && + !event.metaKey && + !event.shiftKey; + + if (isLeftClick) { + event.preventDefault(); + // use the A element's href, which has been modified for + // local paths without a `?path=` query param prefix + navigate(context, event.currentTarget.getAttribute('href')); + } + }} + target={target} + {...rest} + > + {children} + + ); }; const SUPPORTED_MDX_HEADERS = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6'] as const; From e057e62a515894303a6a985090d2d516bc433a63 Mon Sep 17 00:00:00 2001 From: Jeppe Reinhold Date: Wed, 13 Mar 2024 22:50:42 +0100 Subject: [PATCH 2/2] collabse conditions --- code/ui/blocks/src/blocks/mdx.tsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/code/ui/blocks/src/blocks/mdx.tsx b/code/ui/blocks/src/blocks/mdx.tsx index 1659eef1dc79..fe9c8c24f5c9 100644 --- a/code/ui/blocks/src/blocks/mdx.tsx +++ b/code/ui/blocks/src/blocks/mdx.tsx @@ -96,7 +96,8 @@ export const AnchorMdx: FC> = (props) => { const { href, target, children, ...rest } = props; const context = useContext(DocsContext); - if (!href) { + // links to external locations don't need any modifications. + if (!href || target === '_blank' || /^https?:\/\//.test(href)) { return ; } @@ -105,11 +106,6 @@ export const AnchorMdx: FC> = (props) => { return {children}; } - // links to external locations don't need any modifications. - if (target === '_blank' || /^https?:\/\//.test(href)) { - return ; - } - // Links to other pages of SB should use the base URL of the top level iframe instead of the base URL of the preview iframe. return (