Richie
047d913960
Formatting-only changes across all component and story files. No logic or behaviour changes — only whitespace, line breaks, and trailing commas. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
66 lines
1.6 KiB
TypeScript
66 lines
1.6 KiB
TypeScript
import type { Meta, StoryObj } from '@storybook/react';
|
|
import Box from '@mui/material/Box';
|
|
import { FuneralFinderV2 } from './FuneralFinderV2';
|
|
|
|
const meta: Meta<typeof FuneralFinderV2> = {
|
|
title: 'Organisms/FuneralFinderV2',
|
|
component: FuneralFinderV2,
|
|
parameters: {
|
|
layout: 'padded',
|
|
},
|
|
args: {
|
|
onSearch: (params) => {
|
|
console.log('Search params:', params);
|
|
},
|
|
},
|
|
};
|
|
|
|
export default meta;
|
|
type Story = StoryObj<typeof FuneralFinderV2>;
|
|
|
|
/** Default empty state — all 3 steps ready for input */
|
|
export const Default: Story = {};
|
|
|
|
/** Loading state — CTA shows spinner */
|
|
export const Loading: Story = {
|
|
args: { loading: true },
|
|
};
|
|
|
|
/** Placed below a masthead-style header to preview in context */
|
|
export const BelowMasthead: Story = {
|
|
decorators: [
|
|
(Story) => (
|
|
<Box>
|
|
{/* Simulated masthead */}
|
|
<Box
|
|
sx={{
|
|
bgcolor: 'var(--fa-color-sage-800, #4c5459)',
|
|
color: '#fff',
|
|
py: 6,
|
|
px: 4,
|
|
textAlign: 'center',
|
|
}}
|
|
>
|
|
<Box sx={{ fontSize: '2rem', fontWeight: 700, mb: 1 }}>Funeral Arranger</Box>
|
|
<Box sx={{ opacity: 0.8 }}>Find trusted funeral directors near you</Box>
|
|
</Box>
|
|
{/* Widget below masthead */}
|
|
<Box sx={{ maxWidth: 560, mx: 'auto', mt: -4, px: 2, position: 'relative', zIndex: 1 }}>
|
|
<Story />
|
|
</Box>
|
|
</Box>
|
|
),
|
|
],
|
|
};
|
|
|
|
/** Constrained width — typical sidebar or narrow column */
|
|
export const Narrow: Story = {
|
|
decorators: [
|
|
(Story) => (
|
|
<Box sx={{ maxWidth: 400, mx: 'auto' }}>
|
|
<Story />
|
|
</Box>
|
|
),
|
|
],
|
|
};
|