feat(SW-3636): Storybook structure * New sections in Storybook sidebar * Group Storybook content files and add token files for spacing, border radius and shadows Approved-by: Joakim Jäderberg
54 lines
1.3 KiB
TypeScript
54 lines
1.3 KiB
TypeScript
import type { Meta, StoryObj } from '@storybook/nextjs-vite'
|
|
import { expect } from 'storybook/test'
|
|
import { InfoBox, Props } from './InfoBox'
|
|
import { IconName } from '../Icons/iconName'
|
|
|
|
const meta: Meta<typeof InfoBox> = {
|
|
title: 'Core Components/InfoBox',
|
|
component: InfoBox,
|
|
parameters: {
|
|
layout: 'padded',
|
|
},
|
|
tags: ['autodocs'],
|
|
}
|
|
|
|
export default meta
|
|
type Story = StoryObj<typeof meta>
|
|
|
|
export const Default: Story = {
|
|
args: {
|
|
theme: 'Default',
|
|
icon: IconName.Accessibility,
|
|
heading: 'Heading',
|
|
text: 'This is an informational message',
|
|
},
|
|
argTypes: {
|
|
icon: {
|
|
control: { type: 'select' },
|
|
options: Object.values(IconName),
|
|
},
|
|
theme: {
|
|
control: { type: 'select' },
|
|
options: ['Default', 'SAS-Blue'] satisfies Props['theme'][],
|
|
},
|
|
},
|
|
|
|
play: async ({ canvas, args }) => {
|
|
const article = await canvas.findByRole('article')
|
|
await expect(article).toBeVisible()
|
|
|
|
const heading = await canvas.findByRole('heading', { name: args.heading })
|
|
await expect(heading).toBeVisible()
|
|
|
|
const paragraph = await canvas.findByText(args.text)
|
|
await expect(paragraph).toBeVisible()
|
|
},
|
|
}
|
|
|
|
export const WithoutIcon: Story = {
|
|
args: {
|
|
heading: 'Heading',
|
|
text: 'This is an informational message',
|
|
},
|
|
}
|