-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #1 from storybookjs/docs-of-demo
Demonstration of Docs
- Loading branch information
Showing
12 changed files
with
370 additions
and
31 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| * { | ||
| font-family: | ||
| system-ui, | ||
| -apple-system, | ||
| BlinkMacSystemFont, | ||
| 'Segoe UI', | ||
| Roboto, | ||
| Oxygen, | ||
| Ubuntu, | ||
| Cantarell, | ||
| 'Open Sans', | ||
| 'Helvetica Neue', | ||
| sans-serif; | ||
| } | ||
|
|
||
| pre, | ||
| code, | ||
| kbd, | ||
| samp { | ||
| font-family: ui-monospace, Menlo, Monaco, 'Cascadia Mono', 'Segoe UI Mono', | ||
| 'Roboto Mono', 'Oxygen Mono', 'Ubuntu Monospace', 'Source Code Pro', | ||
| 'Fira Mono', 'Droid Sans Mono', 'Courier New', monospace; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,118 @@ | ||
| import { | ||
| Meta, | ||
| Story, | ||
| Canvas, | ||
| Primary, | ||
| Title, | ||
| Stories, | ||
| Description, | ||
| Controls, | ||
| ArgTypes, | ||
| useOf, | ||
| } from '@storybook/blocks'; | ||
| import * as RegularStories from './Docs.stories.ts'; | ||
| import { NoArgs, TrueArgs, FalseArgs } from './Docs.stories.ts'; | ||
| import { UseOf } from './UseOf.tsx'; | ||
| import DocsComponent from './DocsComponent.svelte'; | ||
|
|
||
| <Meta of={RegularStories} name='Attached to Regular CSF' /> | ||
|
|
||
| # Attached to Regular CSF stories | ||
|
|
||
| ## Story Doc Block | ||
|
|
||
| ### `<Story of={RegularStories.NoArgs} />` | ||
|
|
||
| <Story of={RegularStories.NoArgs} /> | ||
|
|
||
| ### `<Story of={TrueArgs} />` | ||
|
|
||
| <Story of={TrueArgs} /> | ||
|
|
||
| ## `<Story />` | ||
|
|
||
| <Story /> | ||
|
|
||
| ## Canvas Doc Block | ||
|
|
||
| ### `<Canvas of={RegularStories.NoArgs} />` | ||
|
|
||
| <Canvas of={RegularStories.NoArgs} /> | ||
|
|
||
| ### `<Canvas of={TrueArgs} />` | ||
|
|
||
| <Canvas of={TrueArgs} /> | ||
|
|
||
| ### `<Canvas of={FalseArgs} />` | ||
|
|
||
| <Canvas of={FalseArgs} /> | ||
|
|
||
| ## `<Primary />` | ||
|
|
||
| <Primary /> | ||
|
|
||
| ## `<Controls of={RegularStories.NoArgs} />` | ||
|
|
||
| <Controls of={RegularStories.NoArgs} /> | ||
|
|
||
| ## `<ArgTypes of={RegularStories.NoArgs} />` | ||
|
|
||
| <ArgTypes of={RegularStories.NoArgs} /> | ||
|
|
||
| ## Description Doc Block | ||
|
|
||
| ### `<Description of={RegularStories.NoArgs} />` | ||
|
|
||
| <Description of={RegularStories.NoArgs} /> | ||
|
|
||
| ### `<Description of={RegularStories} />` | ||
|
|
||
| <Description of={RegularStories} /> | ||
|
|
||
| ## `<Stories />` | ||
|
|
||
| <Stories /> | ||
|
|
||
| ## `useOf` hook | ||
|
|
||
| ### `useOf(RegularStories)` | ||
|
|
||
| The CSF file: | ||
|
|
||
| <UseOf of={RegularStories} /> | ||
|
|
||
| ### `useOf(RegularStories.default)` | ||
|
|
||
| The meta: | ||
|
|
||
| <UseOf of={RegularStories.default} /> | ||
|
|
||
| ### `useOf(TrueArgs)` | ||
|
|
||
| A story: | ||
|
|
||
| <UseOf of={TrueArgs} /> | ||
|
|
||
| ### `useOf(DocsComponent)` | ||
|
|
||
| The Svelte component: | ||
|
|
||
| <UseOf of={DocsComponent} /> | ||
|
|
||
| ### `useOf("meta")` | ||
|
|
||
| The meta of the attached stories: | ||
|
|
||
| <UseOf of='meta' /> | ||
|
|
||
| ### `useOf("story")` | ||
|
|
||
| The primary story of the attached stories: | ||
|
|
||
| <UseOf of='story' /> | ||
|
|
||
| ### `useOf("component")` | ||
|
|
||
| The component of the attached stories: | ||
|
|
||
| <UseOf of='component' /> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,118 @@ | ||
| import { | ||
| Meta, | ||
| Story, | ||
| Canvas, | ||
| Primary, | ||
| Title, | ||
| Stories, | ||
| Description, | ||
| Controls, | ||
| ArgTypes, | ||
| useOf, | ||
| } from '@storybook/blocks'; | ||
| import * as SvelteStories from './Docs.stories.svelte'; | ||
| import { NoArgs, TrueArgs, FalseArgs } from './Docs.stories.svelte'; | ||
| import { UseOf } from './UseOf.tsx'; | ||
| import DocsComponent from './DocsComponent.svelte'; | ||
|
|
||
| <Meta of={SvelteStories} name='Attached to Svelte CSF' /> | ||
|
|
||
| # Attached to Regular CSF stories | ||
|
|
||
| ## Story Doc Block | ||
|
|
||
| ### `<Story of={SvelteStories.NoArgs} />` | ||
|
|
||
| <Story of={SvelteStories.NoArgs} /> | ||
|
|
||
| ### `<Story of={TrueArgs} />` | ||
|
|
||
| <Story of={TrueArgs} /> | ||
|
|
||
| ## `<Story />` | ||
|
|
||
| <Story /> | ||
|
|
||
| ## Canvas Doc Block | ||
|
|
||
| ### `<Canvas of={SvelteStories.NoArgs} />` | ||
|
|
||
| <Canvas of={SvelteStories.NoArgs} /> | ||
|
|
||
| ### `<Canvas of={TrueArgs} />` | ||
|
|
||
| <Canvas of={TrueArgs} /> | ||
|
|
||
| ### `<Canvas of={FalseArgs} />` | ||
|
|
||
| <Canvas of={FalseArgs} /> | ||
|
|
||
| ## `<Primary />` | ||
|
|
||
| <Primary /> | ||
|
|
||
| ## `<Controls of={SvelteStories.NoArgs} />` | ||
|
|
||
| <Controls of={SvelteStories.NoArgs} /> | ||
|
|
||
| ## `<ArgTypes of={SvelteStories.NoArgs} />` | ||
|
|
||
| <ArgTypes of={SvelteStories.NoArgs} /> | ||
|
|
||
| ## Description Doc Block | ||
|
|
||
| ### `<Description of={SvelteStories.NoArgs} />` | ||
|
|
||
| <Description of={SvelteStories.NoArgs} /> | ||
|
|
||
| ### `<Description of={SvelteStories} />` | ||
|
|
||
| <Description of={SvelteStories} /> | ||
|
|
||
| ## `<Stories />` | ||
|
|
||
| <Stories /> | ||
|
|
||
| ## `useOf` hook | ||
|
|
||
| ### `useOf(SvelteStories)` | ||
|
|
||
| The CSF file: | ||
|
|
||
| <UseOf of={SvelteStories} /> | ||
|
|
||
| ### `useOf(SvelteStories.default)` | ||
|
|
||
| The meta: | ||
|
|
||
| <UseOf of={SvelteStories.default} /> | ||
|
|
||
| ### `useOf(TrueArgs)` | ||
|
|
||
| A story: | ||
|
|
||
| <UseOf of={TrueArgs} /> | ||
|
|
||
| ### `useOf(DocsComponent)` | ||
|
|
||
| The Svelte component: | ||
|
|
||
| <UseOf of={DocsComponent} /> | ||
|
|
||
| ### `useOf("meta")` | ||
|
|
||
| The meta of the attached stories: | ||
|
|
||
| <UseOf of='meta' /> | ||
|
|
||
| ### `useOf("story")` | ||
|
|
||
| The primary story of the attached stories: | ||
|
|
||
| <UseOf of='story' /> | ||
|
|
||
| ### `useOf("component")` | ||
|
|
||
| The component of the attached stories: | ||
|
|
||
| <UseOf of='component' /> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,25 @@ | ||
| <script lang="ts" context="module"> | ||
| import DocsComponent from './DocsComponent.svelte'; | ||
| import type { Meta } from '@storybook/svelte'; | ||
| import { Story, Template } from '@storybook/addon-svelte-csf'; | ||
| /** | ||
| * This is a description for the `meta` of regular CSF. | ||
| */ | ||
| export const meta = { | ||
| title: 'Docs/Svelte CSF', | ||
| component: DocsComponent, | ||
| tags: ['autodocs'], | ||
| } satisfies Meta<DocsComponent>; | ||
| </script> | ||
|
|
||
| <Template let:args> | ||
| <DocsComponent {...args} /> | ||
| </Template> | ||
|
|
||
| <!-- This is a description for the _primary_ story, `NoArgs`. --> | ||
| <Story name="NoArgs" /> | ||
|
|
||
| <Story name="TrueArgs" args={{ someBoolProp: true }}/> | ||
|
|
||
| <Story name="FalseArgs" args={{ someBoolProp: false }}/> |
Oops, something went wrong.