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

Upd. why-storybook.md

Browse Source
This commit is contained in:
Mauricio Rivera 2023-03-21 10:34:43 -05:00
parent 394c46edd4
commit 1adf1dc27e
4 changed files with 81 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/get-started/why-storybook.md
View File

@ -52,6 +52,8 @@ You write stories for granular UI component variation and then use those stories
'preact/histogram-story.js.mdx',
'html/histogram-story.js.mdx',
'html/histogram-story.ts.mdx',
'solid/histogram-story.js.mdx',
'solid/histogram-story.ts.mdx',
]}
usesCsf3
csf2Path="why-storybook#snippet-histogram-story"

23
docs/snippets/solid/histogram-story.js.mdx Normal file
View File

@ -0,0 +1,23 @@
```js
// Histogram.stories.js|jsx
import { Histogram } from './Histogram';
export default {
/* 👇 The title prop is optional.
* See https://storybook.js.org/docs/7.0/solid/configure/overview#configure-story-loading
* to learn how to generate automatic titles
*/
title: 'Histogram',
component: Histogram,
};
export const Default = {
args: {
dataType: 'latency',
showHistogramLabels: true,
histogramAccentColor: '#1EA7FD',
label: 'Latency distribution',
},
};
```

28
docs/snippets/solid/histogram-story.ts-4-9.mdx Normal file
View File

@ -0,0 +1,28 @@
```ts
// Histogram.stories.ts|tsx
import type { Meta, StoryObj } from "storybook-solidjs";
import { Histogram } from './Histogram';
const meta = {
/* 👇 The title prop is optional.
* See https://storybook.js.org/docs/7.0/solid/configure/overview#configure-story-loading
* to learn how to generate automatic titles
*/
title: 'Histogram',
component: Histogram,
} satisfies Meta<typeof Histogram>;
export default meta;
type Story = StoryObj<typeof meta>;
export const Default: Story = {
args: {
dataType: 'latency',
showHistogramLabels: true,
histogramAccentColor: '#1EA7FD',
label: 'Latency distribution',
},
};
```

28
docs/snippets/solid/histogram-story.ts.mdx Normal file
View File

@ -0,0 +1,28 @@
```ts
// Histogram.stories.ts|tsx
import type { Meta, StoryObj } from "storybook-solidjs";
import { Histogram } from './Histogram';
const meta: Meta<typeof Histogram> = {
/* 👇 The title prop is optional.
* See https://storybook.js.org/docs/7.0/solid/configure/overview#configure-story-loading
* to learn how to generate automatic titles
*/
title: 'Histogram',
component: Histogram,
};
export default meta;
type Story = StoryObj<typeof Histogram>;
export const Default: Story = {
args: {
dataType: 'latency',
showHistogramLabels: true,
histogramAccentColor: '#1EA7FD',
label: 'Latency distribution',
},
};
```