Merge pull request #19124 from storybookjs/norbert/sb-577-addon-links

Addon-links: Move stories into addon

code/addons/links/template/stories/decorator.stories.ts

@@ -0,0 +1,38 @@
+import globalThis from 'global';
+import { withLinks } from '@storybook/addon-links';
+
+export default {
+  component: globalThis.Components.Html,
+  parameters: {
+    chromatic: { disable: true },
+  },
+  decorators: [withLinks],
+};
+
+export const Basic = {
+  args: {
+    content: `
+      <div>
+        <a class="link" href="#" data-sb-story="basic">go to basic</a>
+      </div>
+    `,
+  },
+};
+export const Other = {
+  args: {
+    content: `
+      <div>
+        <a class="link" href="#" data-sb-story="basic">to to basic</a>
+      </div>
+    `,
+  },
+};
+export const Third = {
+  args: {
+    content: `
+      <div>
+        <a class="link" href="#" data-sb-story="other">go to other</a>
+      </div>
+    `,
+  },
+};

code/addons/links/template/stories/linkto.stories.ts

@@ -0,0 +1,44 @@
+import globalThis from 'global';
+import { linkTo } from '@storybook/addon-links';
+
+export default {
+  component: globalThis.Components.Button,
+  args: {
+    children: 'Click Me!',
+  },
+  parameters: {
+    chromatic: { disable: true },
+  },
+};
+
+export const ID = {
+  args: {
+    onClick: linkTo('addons-links-parameters--basic'),
+  },
+};
+export const Title = {
+  args: {
+    onClick: linkTo('addons-links-parameters'),
+  },
+};
+export const Basic = {
+  args: {
+    onClick: linkTo('addons-links-parameters', 'basic'),
+  },
+};
+export const Other = {
+  args: {
+    onClick: linkTo('addons-links-parameters', 'basic'),
+  },
+};
+export const Third = {
+  args: {
+    onClick: linkTo('addons-links-parameters', 'other'),
+  },
+};
+
+export const Callback = {
+  args: {
+    onClick: linkTo('addons-links-parameters', (event: Event) => 'basic'),
+  },
+};

code/addons/links/template/stories/scroll.stories.ts

@@ -0,0 +1,41 @@
+import globalThis from 'global';
+import { withLinks } from '@storybook/addon-links';
+
+export default {
+  component: globalThis.Components.Html,
+  parameters: {
+    chromatic: { disable: true },
+  },
+  decorators: [withLinks],
+};
+
+export const Basic = {
+  args: {
+    content: `
+      <div>
+        <div style="marginBottom:100vh"></div>
+        <a class="link" href="#" data-sb-story="basic">go to basic</a>
+      </div>
+    `,
+  },
+};
+export const Other = {
+  args: {
+    content: `
+      <div>
+        <div style="marginBottom:100vh"></div>
+        <a class="link" href="#" data-sb-story="basic">to to basic</a>
+      </div>
+    `,
+  },
+};
+export const Third = {
+  args: {
+    content: `
+      <div>
+        <div style="marginBottom:100vh"></div>
+        <a class="link" href="#" data-sb-story="other">go to other</a>
+      </div>
+    `,
+  },
+};

code/addons/storyshots/storyshots-core/stories/required_with_context/Welcome.stories.js

@@ -1,6 +1,5 @@
 import React from 'react';
 
-import { linkTo } from '@storybook/addon-links';
 import { Welcome } from '../react-demo';
 
 export default {
@@ -11,6 +10,6 @@ export default {
   },
 };
 
-export const ToStorybook = () => <Welcome showApp={linkTo('Button')} />;
+export const ToStorybook = () => <Welcome showApp={() => {}} />;
 
 ToStorybook.storyName = 'to Storybook';

code/addons/storyshots/storyshots-core/stories/required_with_context/Welcome.stories.mdx

@@ -1,4 +1,3 @@
-import { linkTo } from '@storybook/addon-links';
 import { Welcome } from '../react-demo';
 import { Meta, Story } from '@storybook/addon-docs';
 
@@ -10,5 +9,5 @@ import { Meta, Story } from '@storybook/addon-docs';
 />
 
 <Story name="to Storybook">
-  <Welcome showApp={linkTo('Button')} />
+  <Welcome showApp={() => {}} />
 </Story>

code/examples/angular-cli/src/stories/addons/docs/addon-docs.stories.mdx

@@ -1,7 +1,6 @@
 import { moduleMetadata } from '@storybook/angular';
 import { Story, Meta, ArgsTable } from '@storybook/addon-docs';
 import { Welcome, Button } from '../.././angular-demo';
-import { linkTo } from '@storybook/addon-links';
 import { DocButtonComponent } from './doc-button/doc-button.component';
 
 # Storybook Docs for Angular

code/examples/angular-cli/src/stories/addons/links/addon-links.stories.ts

@@ -1,4 +1,3 @@
-import { linkTo } from '@storybook/addon-links';
 import { Button } from '../../angular-demo';
 
 export default {
@@ -9,7 +8,7 @@ export default {
 export const ButtonWithLinkToAnotherStory = () => ({
   props: {
     text: 'Go to Welcome Story',
-    onClick: linkTo('Welcome'),
+    onClick: () => {},
   },
 });
 

code/examples/angular-cli/src/stories/welcome-angular.stories.ts

@@ -1,5 +1,4 @@
 import type { Meta, StoryFn } from '@storybook/angular';
-import { linkTo } from '@storybook/addon-links';
 import { AppComponent } from '../app/app.component';
 
 export default {
@@ -9,6 +8,6 @@ export default {
 export const ToAngular: StoryFn = () => ({
   component: AppComponent,
   props: {
-    showApp: linkTo('Button'),
+    showApp: () => {},
   },
 });

code/examples/angular-cli/src/stories/welcome-storybook.stories.ts

@@ -1,5 +1,4 @@
 import type { Meta, StoryFn } from '@storybook/angular';
-import { linkTo } from '@storybook/addon-links';
 import { Welcome } from './angular-demo';
 
 export default {
@@ -9,6 +8,6 @@ export default {
 export const ToStorybook: StoryFn = () => ({
   component: Welcome,
   props: {
-    showApp: linkTo('Button'),
+    showApp: () => {},
   },
 });

code/examples/cra-kitchen-sink/src/stories/welcome.stories.js

@@ -1,11 +1,10 @@
 import React from 'react';
-import { linkTo } from '@storybook/addon-links';
 import { Welcome } from '../components/react-demo';
 
 export default {
   title: 'Welcome',
   component: Welcome,
 };
 
-export const Story1 = () => <Welcome showApp={linkTo('Button')} />;
+export const Story1 = () => <Welcome showApp={() => {}} />;
 Story1.title = 'to Storybook';

code/examples/cra-ts-essentials/src/stories/0-Welcome.stories.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import { linkTo } from '@storybook/addon-links';
 import type { ComponentMeta, ComponentStoryFn } from '@storybook/react';
 import { Welcome } from './react-demo';
 
@@ -8,8 +7,6 @@ export default {
   component: Welcome,
 } as ComponentMeta<typeof Welcome>;
 
-export const ToStorybook: ComponentStoryFn<typeof Welcome> = () => (
-  <Welcome showApp={linkTo('Button')} />
-);
+export const ToStorybook: ComponentStoryFn<typeof Welcome> = () => <Welcome showApp={() => {}} />;
 
 ToStorybook.storyName = 'to Storybook';

code/examples/cra-ts-kitchen-sink/src/stories/0-Welcome.stories.tsx

@@ -1,12 +1,11 @@
 import React from 'react';
-import { linkTo } from '@storybook/addon-links';
 import { Welcome } from '../components/react-demo';
 
 export default {
   title: 'Welcome',
   component: Welcome,
 };
 
-export const ToStorybook = () => <Welcome showApp={linkTo('Button')} />;
+export const ToStorybook = () => <Welcome showApp={() => {}} />;
 
 ToStorybook.storyName = 'to Storybook';

code/examples/html-kitchen-sink/stories/welcome.stories.js

@@ -1,11 +1,8 @@
-import { withLinks } from '@storybook/addon-links';
-
 import './welcome.css';
 import welcome from './welcome.html';
 
 export default {
   title: 'Welcome',
-  decorators: [withLinks],
 };
 
 export const Welcome = () => welcome;

code/examples/official-storybook/stories/demo/welcome.stories.js

@@ -1,5 +1,4 @@
 import React from 'react';
-import { linkTo } from '@storybook/addon-links';
 import { Welcome } from '../../components/react-demo';
 
 export default {
@@ -10,5 +9,5 @@ export default {
 // Some other valid values:
 // - 'other-demo-buttonmdx--with-text'
 // - 'Other/Demo/ButtonMdx'
-export const ToStorybook = () => <Welcome showApp={linkTo('Other/Demo/Button')} />;
+export const ToStorybook = () => <Welcome showApp={() => {}} />;
 ToStorybook.storyName = 'to Storybook';