Retitle all 49 stories into a sidebar that makes the DDD seam visible: Foundations (curriculum) -> Design System (Atoms/Molecules/Organisms/ Templates/Devtools, everything in shared/ui + shared/layout) -> Domein (Registratie/Herregistratie/Auth/Brief, everything in a context's ui/). Pin the order via storySort. Add layers.mdx explaining the split and linking the enforcing eslint rules; document the story-title convention in CLAUDE.md. Fix a stale "status banner" reference in atomic-design.mdx left over from WP-13's upload-status-banner deletion. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
36 lines
1.1 KiB
TypeScript
36 lines
1.1 KiB
TypeScript
import type { Meta, StoryObj } from '@storybook/angular';
|
|
import { applicationConfig } from '@storybook/angular';
|
|
import { provideRouter } from '@angular/router';
|
|
import { BreadcrumbComponent } from './breadcrumb.component';
|
|
|
|
const meta: Meta<BreadcrumbComponent> = {
|
|
title: 'Design System/Molecules/Breadcrumb',
|
|
component: BreadcrumbComponent,
|
|
decorators: [applicationConfig({ providers: [provideRouter([])] })],
|
|
render: (args) => ({
|
|
props: args,
|
|
// Rendered inside a mock .titlebar .title so the story reflects the real chrome.
|
|
template: `<div class="titlebar" style="padding: 1rem"><div class="title"><app-breadcrumb [items]="items" /></div></div>`,
|
|
}),
|
|
};
|
|
export default meta;
|
|
type Story = StoryObj<BreadcrumbComponent>;
|
|
|
|
export const TweeNiveaus: Story = {
|
|
args: {
|
|
items: [
|
|
{ label: 'Mijn omgeving', link: '/dashboard' },
|
|
{ label: 'Inschrijven in het BIG-register' },
|
|
],
|
|
},
|
|
};
|
|
export const DrieNiveaus: Story = {
|
|
args: {
|
|
items: [
|
|
{ label: 'Mijn omgeving', link: '/dashboard' },
|
|
{ label: 'Registratie', link: '/registratie' },
|
|
{ label: 'Inschrijven' },
|
|
],
|
|
},
|
|
};
|