mirror of
https://github.com/storybookjs/storybook.git
synced 2025-04-08 09:02:24 +08:00
43 lines
986 B
Plaintext
43 lines
986 B
Plaintext
```js
|
|
// Button.stories.js
|
|
|
|
import { html } from 'lit';
|
|
|
|
export default {
|
|
component: 'custom-component',
|
|
//👇 Creates specific argTypes
|
|
argTypes: {
|
|
propertyA: {
|
|
options: ['Item One', 'Item Two', 'Item Three'],
|
|
control: { type: 'select' }, // Automatically inferred when 'options' is defined
|
|
},
|
|
propertyB: {
|
|
options: ['Another Item One', 'Another Item Two', 'Another Item Three'],
|
|
},
|
|
},
|
|
};
|
|
|
|
const someFunction = (valuePropertyA, valuePropertyB) => {
|
|
// Do some logic here
|
|
};
|
|
|
|
export const ExampleStory = {
|
|
render: ({ propertyA, propertyB }) => {
|
|
//👇 Assigns the function result to a variable
|
|
const someFunctionResult = someFunction(propertyA, propertyB);
|
|
|
|
return html`
|
|
<custom-component
|
|
.propertyA=${propertyA}
|
|
.propertyB=${propertyB}
|
|
.someProperty=${someFunctionResult}
|
|
></custom-component>
|
|
`;
|
|
},
|
|
args: {
|
|
propertyA: 'Item One',
|
|
propertyB: 'Another Item One',
|
|
},
|
|
};
|
|
```
|