church-website/src/components/Collapsible/Collapsible.stories.tsx
2026-04-16 14:25:00 +02:00

66 lines
1.9 KiB
TypeScript

import { Meta, StoryObj } from '@storybook/react'
import { Collapsible } from './Collapsible'
const meta: Meta<typeof Collapsible> = {
component: Collapsible,
}
type Story = StoryObj<typeof Collapsible>
export default meta
export const Default: Story = {
args: {
title: 'Wann finden die Gottesdienste statt?',
children: 'Unsere Gottesdienste finden jeden Sonntag um 10:00 Uhr statt.',
},
}
export const OpenByDefault: Story = {
args: {
title: 'Wo kann ich parken?',
defaultOpen: true,
children:
'Direkt vor der Kirche stehen Parkplätze zur Verfügung. Weitere Parkplätze finden Sie in den umliegenden Straßen.',
},
}
export const LongContent: Story = {
args: {
title: 'Wie kann ich Mitglied werden?',
children: (
<>
<p>
Um Mitglied unserer Gemeinde zu werden, können Sie sich direkt an das
Pfarrbüro wenden. Dort erhalten Sie alle notwendigen Informationen und
Formulare.
</p>
<p>
Wir freuen uns über jedes neue Mitglied und laden Sie herzlich ein,
unsere Gemeinschaft kennenzulernen. Neben den regelmäßigen
Gottesdiensten gibt es zahlreiche Gruppen und Veranstaltungen, an
denen Sie teilnehmen können.
</p>
<p>
Bei Fragen stehen Ihnen unsere Mitarbeiter gerne telefonisch, per
E-Mail oder persönlich zur Verfügung.
</p>
</>
),
},
}
export const ListOfThree: Story = {
render: () => (
<div>
<Collapsible title="Wann finden die Gottesdienste statt?">
Unsere Gottesdienste finden jeden Sonntag um 10:00 Uhr statt.
</Collapsible>
<Collapsible title="Wo kann ich parken?">
Direkt vor der Kirche stehen Parkplätze zur Verfügung.
</Collapsible>
<Collapsible title="Wie erreiche ich das Pfarrbüro?">
Das Pfarrbüro ist montags bis freitags von 9:00 bis 12:00 Uhr geöffnet.
</Collapsible>
</div>
),
}