From 153edf847c89cd2feabd884bd358af216d643cdb Mon Sep 17 00:00:00 2001 From: patrickjahr Date: Tue, 16 Apr 2024 08:50:39 +0200 Subject: [PATCH] feat(list): add story for list component --- .../components/list/list.component.stories.ts | 123 ++++++++++++++++++ 1 file changed, 123 insertions(+) create mode 100644 libs/sketch/src/lib/components/list/list.component.stories.ts diff --git a/libs/sketch/src/lib/components/list/list.component.stories.ts b/libs/sketch/src/lib/components/list/list.component.stories.ts new file mode 100644 index 0000000..7cfc31e --- /dev/null +++ b/libs/sketch/src/lib/components/list/list.component.stories.ts @@ -0,0 +1,123 @@ +import { + applicationConfig, + Meta, + moduleMetadata, + StoryObj, +} from '@storybook/angular'; +import { ListComponent } from './list.component'; +import { provideRouter } from '@angular/router'; +import { CommonModule } from '@angular/common'; +import { ListItemComponent } from './components/list-item/list-item.component'; +import { ListProviderDirective } from './directives/list-provider.directive'; +import { ListItemActiveDirective } from './directives/list-item-active.directive'; + +const meta: Meta = { + component: ListComponent, + title: 'ListComponent', + decorators: [ + applicationConfig({ + providers: [ + provideRouter([ + { + matcher: (segments) => + segments.length && segments[0].path + ? { consumed: segments } + : null, + component: ListComponent, + }, + ]), + ], + }), + moduleMetadata({ + imports: [ + CommonModule, + ListItemComponent, + ListProviderDirective, + ListItemActiveDirective, + ], + }), + ], +}; +export default meta; +type Story = StoryObj; + +export const Default: Story = { + render: (args) => ({ + props: args, + template: ` + + Label 1 + + + Label 2 + + + Label 3 + + + Label 4 + + `, + }), +}; + +export const Nested: Story = { + render: (args) => ({ + props: args, + template: ` + + Label 1 + + + Label 11 + + + Label 12 + + + Label 13 + + + Label 14 + + + + + Label 2 + + + Label 21 + + + Label 22 + + + + + Label 3 + + + Label 31 + + + Label 32 + + + Label 33 + + + + + Label 4 + + + Label 41 + + + Label 42 + + + + `, + }), +};