GitHub/storybook
1
0
Fork 0
mirror of https://github.com/storybookjs/storybook.git synced 2025-04-03 05:04:51 +08:00
Code Issues Packages Projects Releases Wiki Activity

Now handled in page anchor and link to other sb stories

Browse Source
This commit is contained in:
patrick.lafrance 2019-12-02 22:37:25 -05:00
parent f26a37654a
commit c33cb80a85
3 changed files with 32 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
addons/docs/src/blocks/mdx.tsx
View File

@ -1,7 +1,8 @@
import React, { FC, SyntheticEvent } from 'react';
import { Source } from '@storybook/components';
import { Code, components } from '@storybook/components/html';
import { document } from 'global';
import { document, window } from 'global';
import { isNil } from 'lodash';
import { DocsContext, DocsContextProps } from './DocsContext';
import { scrollToElement } from './utils';
@ -69,15 +70,31 @@ const AnchorInPage: FC<AnchorInPageProps> = ({ href, children }) => (
interface AnchorMdxProps {
href: string;
target: string;
}
export const AnchorMdx: React.FC<AnchorMdxProps> = ({ href, children, ...rest }) => {
if (href.startsWith('#')) {
return <AnchorInPage href={href}>{children}</AnchorInPage>;
export const AnchorMdx: React.FC<AnchorMdxProps> = ({ href, target, children, ...rest }) => {
if (!isNil(href)) {
if (href.startsWith('#')) {
// Enable scrolling for in-page anchors.
return <AnchorInPage href={href}>{children}</AnchorInPage>;
}
if (target !== '_blank') {
// 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.
const parentUrl = new URL(window.parent.location.href);
const newHref = `${parentUrl.origin}${href}`;
return (
<A href={newHref} target={target} {...rest}>
{children}
</A>
);
}
}
// External URL dont need any modification.
return (
<A href={href} {...rest}>
<A href={href} target={target} {...rest}>
{children}
</A>
);

6
examples/official-storybook/stories/addon-docs/docs-only.stories.mdx
View File

@ -7,3 +7,9 @@ import { Meta } from '@storybook/addon-docs/blocks';
This file is a documentation-only MDX file, i.e. it doesn't contain any `<Story>` definitions.
Therefore, it shows up in the navigation UI as a document icon.
<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
## Bottom
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc faucibus urna id nibh mollis, varius facilisis sapien scelerisque. Pellentesque lobortis convallis mi, at accumsan nisl sollicitudin id. Aliquam vitae elementum libero. Nulla blandit est turpis, a consectetur ante rhoncus a. Integer eu quam eu mauris pharetra elementum. Donec ex nisl, tincidunt ut tincidunt id, bibendum ut sem. Sed in congue tortor, a congue dolor. Fusce a magna vel nulla laoreet sagittis.

4
examples/official-storybook/stories/addon-docs/markdown.stories.mdx
View File

@ -133,6 +133,10 @@ Right aligned columns
[link with title](https://hichroma.com 'Insert title!')
[link to in page anchor h1](#h1-heading)
[link to another story](/?path=/docs/addons-docs-docs-only--page#bottom)
## Images
![Minion](https://octodex.github.com/images/minion.png)