import type { Meta, StoryObj } from "@storybook/react"; import { SummaryDisplay } from "./SummaryDisplay"; const meta: Meta = { title: "Widgets/Onboarding/Display/SummaryDisplay", component: SummaryDisplay, parameters: { layout: "centered", }, tags: ["autodocs"], }; export default meta; type Story = StoryObj; export const Default: Story = { args: { sections: [ { title: "Company Information", items: [ { label: "Company Name", value: "Acme Corporation" }, { label: "Industry", value: "Technology" }, { label: "Team Size", value: "50-100 employees" }, ], }, { title: "Preferences", items: [ { label: "Timezone", value: "Pacific Time (UTC-8)" }, { label: "Language", value: "English" }, ], }, ], }, }; export const SingleSection: Story = { args: { sections: [ { title: "Account Details", items: [ { label: "Email", value: "admin@acme.com" }, { label: "Plan", value: "Enterprise" }, { label: "Billing", value: "Annual" }, ], }, ], }, }; export const MultipleSections: Story = { args: { sections: [ { title: "Company", items: [ { label: "Name", value: "Acme Corp" }, { label: "Website", value: "https://acme.com" }, ], }, { title: "Team", items: [ { label: "Size", value: "25 members" }, { label: "Departments", value: "Engineering, Sales, Marketing" }, ], }, { title: "Products", items: [ { label: "Selected", value: "Analytics Pro, API Access" }, { label: "Add-ons", value: "Premium Support" }, ], }, { title: "Settings", items: [ { label: "Notifications", value: "Enabled" }, { label: "Two-factor auth", value: "Required" }, ], }, ], }, }; export const WithLongValues: Story = { args: { sections: [ { title: "Configuration", items: [ { label: "Description", value: "This is a very long description that might wrap to multiple lines to demonstrate how the component handles longer content.", }, { label: "Tags", value: "technology, software, enterprise, cloud, analytics, automation, integration", }, ], }, ], }, };