storybook/docs/snippets/web-components/list-story-template.ts.mdx
2023-02-16 09:13:06 +08:00

46 lines
791 B
Plaintext

```ts
// List.stories.ts
import type { Meta, StoryObj } from '@storybook/web-components';
import { html } from 'lit';
import { repeat } from 'lit/directives/repeat.js';
const meta: Meta = {
title: 'List',
component: 'demo-list',
};
export default meta;
type Story = StoryObj;
//👇 The ListTemplate construct will be spread to the existing stories.
const ListTemplate = {
render: ({ items, ...args }) => {
return html`
<demo-list>
${repeat(items, (item) => html`<demo-list-item>${item}</demo-list-item>`)}
</demo-list>
`;
},
};
export const Empty: Story = {
...ListTemplate,
args: {
items: [],
},
};
export const OneItem: Story = {
...ListTemplate,
args: {
items: [
{
...Unchecked.args,
},
],
},
};
```