import type { Meta, StoryObj } from '@storybook/react'; import Box from '@mui/material/Box'; import { ComparisonPackageCard } from './ComparisonPackageCard'; import type { ComparisonPackage } from '../../organisms/ComparisonTable'; // ─── Mock data ────────────────────────────────────────────────────────────── const basePackage: ComparisonPackage = { id: 'wollongong-everyday', name: 'Everyday Funeral Package', price: 6966, provider: { name: 'Wollongong City Funerals', location: 'Wollongong', rating: 4.8, reviewCount: 122, verified: true, }, sections: [ { heading: 'Essentials', items: [ { name: 'Allowance for Coffin', info: 'Allowance amount — upgrade options available.', value: { type: 'allowance', amount: 1750 }, }, { name: 'Cremation Certificate/Permit', info: 'Statutory medical referee fee.', value: { type: 'price', amount: 350 }, }, { name: 'Crematorium', info: 'Cremation facility fees.', value: { type: 'price', amount: 660 }, }, { name: 'Professional Service Fee', info: 'Coordination of arrangements.', value: { type: 'price', amount: 3650.9 }, }, { name: 'Transportation Service Fee', info: 'Transfer of the deceased.', value: { type: 'complimentary' }, }, ], }, { heading: 'Optionals', items: [ { name: 'Digital Recording', info: 'Professional video recording.', value: { type: 'complimentary' }, }, { name: 'Online Notice', info: 'Online death notice.', value: { type: 'complimentary' } }, { name: 'Viewing Fee', info: 'One private family viewing.', value: { type: 'included' } }, ], }, { heading: 'Extras', items: [ { name: 'Allowance for Celebrant', info: 'Professional celebrant or MC.', value: { type: 'allowance', amount: 550 }, }, { name: 'Catering', info: 'Post-service catering.', value: { type: 'poa' } }, { name: 'Saturday Service Fee', info: 'Additional fee for Saturday services.', value: { type: 'price', amount: 880 }, }, ], }, ], }; const unverifiedPackage: ComparisonPackage = { ...basePackage, id: 'inglewood-everyday', name: 'Everyday Funeral Package', price: 7200, provider: { name: 'Inglewood Chapel', location: 'Inglewood', rating: 4.2, reviewCount: 45, verified: false, }, }; const recommendedPackage: ComparisonPackage = { ...basePackage, id: 'recommended-premium', name: 'Premium Cremation Service', price: 8450, provider: { name: 'H. Parsons Funeral Directors', location: 'Wentworth', rating: 4.9, reviewCount: 203, verified: true, }, isRecommended: true, }; // ─── Meta ─────────────────────────────────────────────────────────────────── const meta: Meta = { title: 'Molecules/ComparisonPackageCard', component: ComparisonPackageCard, tags: ['autodocs'], parameters: { layout: 'padded', }, decorators: [ (Story) => ( ), ], args: { onArrange: (id) => alert(`Arrange: ${id}`), }, }; export default meta; type Story = StoryObj; /** Verified provider — default appearance used in ComparisonPage mobile tab panel */ export const Verified: Story = { args: { pkg: basePackage, }, }; /** Unverified provider — "Make Enquiry" CTA + soft button variant, no verified badge */ export const Unverified: Story = { args: { pkg: unverifiedPackage, }, }; /** Recommended package — warm banner, selected card state, warm header background */ export const Recommended: Story = { args: { pkg: recommendedPackage, }, }; /** Itemisation unavailable — used when a provider hasn't submitted an itemised breakdown */ export const ItemizedUnavailable: Story = { args: { pkg: { ...unverifiedPackage, itemizedAvailable: false, }, }, };