richie/Parsons
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

format: Apply Prettier to existing codebase

Browse Source 
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>
This commit is contained in:
Richie
2026-03-27 16:42:16 +11:00
parent aa7cdeecf0
commit 047d913960
46 changed files with 1510 additions and 886 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/molecules/AddOnOption/AddOnOption.stories.tsx
View File

@@ -150,7 +150,8 @@ export const ServiceAddOns: Story = {
export const WithoutPrice: Story = {
args: {
name: 'Order of service booklet',
description: 'Complimentary printed booklet with the service programme and a photo of your loved one.',
description:
'Complimentary printed booklet with the service programme and a photo of your loved one.',
},
};
@@ -160,13 +161,7 @@ export const WithoutPrice: Story = {
export const WithoutDescription: Story = {
render: function Render() {
const [checked, setChecked] = React.useState(false);
return (
<AddOnOption
name="Include GST in pricing"
checked={checked}
onChange={setChecked}
/>
);
return <AddOnOption name="Include GST in pricing" checked={checked} onChange={setChecked} />;
},
};
@@ -176,7 +171,8 @@ export const WithoutDescription: Story = {
export const Disabled: Story = {
args: {
name: 'Catering',
description: 'Not available at this venue. Please contact the venue directly for catering options.',
description:
'Not available at this venue. Please contact the venue directly for catering options.',
price: 1200,
disabled: true,
},

32
src/components/molecules/AddOnOption/AddOnOption.tsx
View File

@@ -54,7 +54,19 @@ export interface AddOnOptionProps {
* ```
*/
export const AddOnOption = React.forwardRef<HTMLDivElement, AddOnOptionProps>(
({ name, description, price, checked = false, onChange, disabled = false, maxDescriptionLines, sx }, ref) => {
(
{
name,
description,
price,
checked = false,
onChange,
disabled = false,
maxDescriptionLines,
sx,
},
ref,
) => {
const switchId = React.useId();
const [expanded, setExpanded] = React.useState(false);
const [isClamped, setIsClamped] = React.useState(false);
@@ -129,10 +141,7 @@ export const AddOnOption = React.forwardRef<HTMLDivElement, AddOnOptionProps>(
{/* Price — tucks directly under heading */}
{price != null && (
<Typography
variant="body2"
color="text.secondary"
>
<Typography variant="body2" color="text.secondary">
${price.toLocaleString('en-AU')}
</Typography>
)}
@@ -146,12 +155,13 @@ export const AddOnOption = React.forwardRef<HTMLDivElement, AddOnOptionProps>(
color="text.secondary"
sx={{
mt: 0.5,
...(maxDescriptionLines && !expanded && {
display: '-webkit-box',
WebkitLineClamp: maxDescriptionLines,
WebkitBoxOrient: 'vertical',
overflow: 'hidden',
}),
...(maxDescriptionLines &&
!expanded && {
display: '-webkit-box',
WebkitLineClamp: maxDescriptionLines,
WebkitBoxOrient: 'vertical',
overflow: 'hidden',
}),
}}
>
{description}

100
src/components/molecules/LineItem/LineItem.stories.tsx
View File

@@ -88,15 +88,54 @@ export const PackageContents: Story = {
Essentials
</Typography>
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
<LineItem name="Accommodation" price={1500} info="Refrigerated holding of the deceased prior to the funeral service." />
<LineItem name="Death Registration Certificate" price={1500} info="Lodgement of death registration with NSW Registry of Births, Deaths & Marriages." />
<LineItem name="Doctor Fee for Cremation" price={1500} info="Statutory medical referee fee required for all cremations in NSW." />
<LineItem name="NSW Government Levy — Cremation" price={1500} info="NSW Government cremation levy as set by the Department of Health." />
<LineItem name="Professional Mortuary Care" price={1500} info="Preparation and care of the deceased." />
<LineItem name="Professional Service Fee" price={1500} info="Coordination of all funeral arrangements and services." />
<LineItem name="Allowance for Coffin" price={1500} isAllowance info="Allowance amount — upgrade options available during arrangement." />
<LineItem name="Allowance for Crematorium" price={1500} isAllowance info="Allowance for crematorium fees — varies by location." />
<LineItem name="Allowance for Hearse" price={1500} isAllowance info="Allowance for hearse transfer — distance surcharges may apply." />
<LineItem
name="Accommodation"
price={1500}
info="Refrigerated holding of the deceased prior to the funeral service."
/>
<LineItem
name="Death Registration Certificate"
price={1500}
info="Lodgement of death registration with NSW Registry of Births, Deaths & Marriages."
/>
<LineItem
name="Doctor Fee for Cremation"
price={1500}
info="Statutory medical referee fee required for all cremations in NSW."
/>
<LineItem
name="NSW Government Levy — Cremation"
price={1500}
info="NSW Government cremation levy as set by the Department of Health."
/>
<LineItem
name="Professional Mortuary Care"
price={1500}
info="Preparation and care of the deceased."
/>
<LineItem
name="Professional Service Fee"
price={1500}
info="Coordination of all funeral arrangements and services."
/>
<LineItem
name="Allowance for Coffin"
price={1500}
isAllowance
info="Allowance amount — upgrade options available during arrangement."
/>
<LineItem
name="Allowance for Crematorium"
price={1500}
isAllowance
info="Allowance for crematorium fees — varies by location."
/>
<LineItem
name="Allowance for Hearse"
price={1500}
isAllowance
info="Allowance for hearse transfer — distance surcharges may apply."
/>
</Box>
<Divider sx={{ my: 3 }} />
@@ -105,7 +144,10 @@ export const PackageContents: Story = {
Complimentary Items
</Typography>
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
<LineItem name="Dressing Fee" info="Dressing and preparation of the deceased — included at no charge." />
<LineItem
name="Dressing Fee"
info="Dressing and preparation of the deceased — included at no charge."
/>
<LineItem name="Viewing Fee" info="One private family viewing — included at no charge." />
</Box>
@@ -117,12 +159,38 @@ export const PackageContents: Story = {
Extras
</Typography>
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
<LineItem name="Allowance for Flowers" price={1500} isAllowance info="Seasonal floral arrangements for the service." />
<LineItem name="Allowance for Master of Ceremonies" price={1500} isAllowance info="Professional celebrant or MC for the funeral service." />
<LineItem name="After Business Hours Service Surcharge" price={1500} info="Additional fee for services held outside standard business hours." />
<LineItem name="After Hours Prayers" price={1500} info="Evening prayer service at the funeral home." />
<LineItem name="Coffin Bearing by Funeral Directors" price={1500} info="Professional pallbearing by funeral directors." />
<LineItem name="Digital Recording" price={1500} info="Professional video recording of the funeral service." />
<LineItem
name="Allowance for Flowers"
price={1500}
isAllowance
info="Seasonal floral arrangements for the service."
/>
<LineItem
name="Allowance for Master of Ceremonies"
price={1500}
isAllowance
info="Professional celebrant or MC for the funeral service."
/>
<LineItem
name="After Business Hours Service Surcharge"
price={1500}
info="Additional fee for services held outside standard business hours."
/>
<LineItem
name="After Hours Prayers"
price={1500}
info="Evening prayer service at the funeral home."
/>
<LineItem
name="Coffin Bearing by Funeral Directors"
price={1500}
info="Professional pallbearing by funeral directors."
/>
<LineItem
name="Digital Recording"
price={1500}
info="Professional video recording of the funeral service."
/>
</Box>
</Box>
),

5
src/components/molecules/LineItem/LineItem.tsx
View File

@@ -48,8 +48,9 @@ export const LineItem = React.forwardRef<HTMLDivElement, LineItemProps>(
({ name, info, price, isAllowance = false, priceLabel, variant = 'default', sx }, ref) => {
const isTotal = variant === 'total';
const formattedPrice = priceLabel
?? (price != null ? `$${price.toLocaleString('en-AU')}${isAllowance ? '*' : ''}` : undefined);
const formattedPrice =
priceLabel ??
(price != null ? `$${price.toLocaleString('en-AU')}${isAllowance ? '*' : ''}` : undefined);
return (
<Box

9
src/components/molecules/ProviderCard/ProviderCard.stories.tsx
View File

@@ -68,7 +68,8 @@ export const Default: Story = {
reviewCount: 127,
capabilityLabel: 'Online Arrangement',
capabilityColor: 'success',
capabilityDescription: 'Complete your arrangement entirely online — no in-person visit required.',
capabilityDescription:
'Complete your arrangement entirely online — no in-person visit required.',
startingPrice: 900,
},
};
@@ -311,11 +312,7 @@ export const EdgeCases: Story = {
onClick={() => {}}
/>
{/* Minimal — just name and location */}
<ProviderCard
name="Minimal Card"
location="Hobart"
onClick={() => {}}
/>
<ProviderCard name="Minimal Card" location="Hobart" onClick={() => {}} />
</Box>
),
};

29
src/components/molecules/ProviderCard/ProviderCard.tsx
View File

@@ -144,12 +144,7 @@ export const ProviderCard = React.forwardRef<HTMLDivElement, ProviderCardProps>(
>
{/* Verified badge */}
<Box sx={{ position: 'absolute', top: 12, right: 12 }}>
<Badge
variant="filled"
color="brand"
size="medium"
icon={<VerifiedOutlinedIcon />}
>
<Badge variant="filled" color="brand" size="medium" icon={<VerifiedOutlinedIcon />}>
Verified
</Badge>
</Box>
@@ -219,9 +214,7 @@ export const ProviderCard = React.forwardRef<HTMLDivElement, ProviderCardProps>(
>
{/* Location */}
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>
<LocationOnOutlinedIcon
sx={{ fontSize: 14, color: 'text.secondary' }}
/>
<LocationOnOutlinedIcon sx={{ fontSize: 14, color: 'text.secondary' }} />
<Typography variant="caption" color="text.secondary">
{location}
</Typography>
@@ -233,10 +226,7 @@ export const ProviderCard = React.forwardRef<HTMLDivElement, ProviderCardProps>(
sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}
aria-label={`Rated ${rating} out of 5${reviewCount != null ? `, ${reviewCount} reviews` : ''}`}
>
<StarRoundedIcon
sx={{ fontSize: 14, color: 'warning.main' }}
aria-hidden
/>
<StarRoundedIcon sx={{ fontSize: 14, color: 'warning.main' }} aria-hidden />
<Typography variant="caption" color="text.secondary">
{rating}
{reviewCount != null && ` (${reviewCount.toLocaleString('en-AU')})`}
@@ -249,17 +239,8 @@ export const ProviderCard = React.forwardRef<HTMLDivElement, ProviderCardProps>(
{capabilityLabel && (
<Box>
{capabilityDescription ? (
<Tooltip
title={capabilityDescription}
arrow
placement="top"
enterTouchDelay={0}
>
<Badge
color={capabilityColor}
size="medium"
sx={{ cursor: 'help' }}
>
<Tooltip title={capabilityDescription} arrow placement="top" enterTouchDelay={0}>
<Badge color={capabilityColor} size="medium" sx={{ cursor: 'help' }}>
{capabilityLabel}
<InfoOutlinedIcon />
</Badge>

3
src/components/molecules/ProviderCardCompact/ProviderCardCompact.stories.tsx
View File

@@ -2,7 +2,8 @@ import type { Meta, StoryObj } from '@storybook/react';
import Box from '@mui/material/Box';
import { ProviderCardCompact } from './ProviderCardCompact';
const DEMO_IMAGE = 'https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=400&h=300&fit=crop';
const DEMO_IMAGE =
'https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=400&h=300&fit=crop';
const meta: Meta<typeof ProviderCardCompact> = {
title: 'Molecules/ProviderCardCompact',

10
src/components/molecules/ProviderCardCompact/ProviderCardCompact.tsx
View File

@@ -101,10 +101,7 @@ export const ProviderCardCompact = React.forwardRef<HTMLDivElement, ProviderCard
{/* Location */}
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>
<LocationOnOutlinedIcon
sx={{ fontSize: 16, color: 'text.secondary' }}
aria-hidden
/>
<LocationOnOutlinedIcon sx={{ fontSize: 16, color: 'text.secondary' }} aria-hidden />
<Typography variant="body2" color="text.secondary">
{location}
</Typography>
@@ -118,7 +115,10 @@ export const ProviderCardCompact = React.forwardRef<HTMLDivElement, ProviderCard
aria-hidden
/>
<Typography variant="caption" color="text.secondary">
{rating} Rating{reviewCount != null ? ` (${reviewCount} ${reviewCount === 1 ? 'Review' : 'Reviews'})` : ''}
{rating} Rating
{reviewCount != null
? ` (${reviewCount} ${reviewCount === 1 ? 'Review' : 'Reviews'})`
: ''}
</Typography>
</Box>
)}

14
src/components/molecules/SearchBar/SearchBar.stories.tsx
View File

@@ -149,13 +149,7 @@ export const Loading: Story = {
const [value, setValue] = React.useState('Parsons funeral');
return (
<SearchBar
value={value}
onChange={setValue}
placeholder="Search..."
showButton
loading
/>
<SearchBar value={value} onChange={setValue} placeholder="Search..." showButton loading />
);
},
};
@@ -200,11 +194,7 @@ export const ProviderSearch: Story = {
setResults([]);
return;
}
setResults(
providers.filter((p) =>
p.toLowerCase().includes(query.toLowerCase()),
),
);
setResults(providers.filter((p) => p.toLowerCase().includes(query.toLowerCase())));
};
return (

12
src/components/molecules/ServiceOption/ServiceOption.stories.tsx
View File

@@ -252,17 +252,9 @@ export const EdgeCases: Story = {
onClick={() => {}}
/>
{/* No description */}
<ServiceOption
name="Flowers"
price={250}
selected
onClick={() => {}}
/>
<ServiceOption name="Flowers" price={250} selected onClick={() => {}} />
{/* No price, no description */}
<ServiceOption
name="Contact us for pricing"
onClick={() => {}}
/>
<ServiceOption name="Contact us for pricing" onClick={() => {}} />
</Box>
),
};

27
src/components/molecules/ServiceOption/ServiceOption.tsx
View File

@@ -55,7 +55,19 @@ export interface ServiceOptionProps {
* ```
*/
export const ServiceOption = React.forwardRef<HTMLDivElement, ServiceOptionProps>(
({ name, description, price, selected = false, disabled = false, onClick, maxDescriptionLines, sx }, ref) => {
(
{
name,
description,
price,
selected = false,
disabled = false,
onClick,
maxDescriptionLines,
sx,
},
ref,
) => {
const [expanded, setExpanded] = React.useState(false);
const [isClamped, setIsClamped] = React.useState(false);
const descRef = React.useRef<HTMLElement>(null);
@@ -123,12 +135,13 @@ export const ServiceOption = React.forwardRef<HTMLDivElement, ServiceOptionProps
color="text.secondary"
sx={{
mt: 0.5,
...(maxDescriptionLines && !expanded && {
display: '-webkit-box',
WebkitLineClamp: maxDescriptionLines,
WebkitBoxOrient: 'vertical',
overflow: 'hidden',
}),
...(maxDescriptionLines &&
!expanded && {
display: '-webkit-box',
WebkitLineClamp: maxDescriptionLines,
WebkitBoxOrient: 'vertical',
overflow: 'hidden',
}),
}}
>
{description}

10
src/components/molecules/StepIndicator/StepIndicator.stories.tsx
View File

@@ -106,7 +106,15 @@ export const Interactive: Story = {
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 3 }}>
<StepIndicator steps={arrangementSteps} currentStep={step} />
<Box sx={{ p: 3, bgcolor: 'background.paper', borderRadius: 1, border: '1px solid', borderColor: 'divider' }}>
<Box
sx={{
p: 3,
bgcolor: 'background.paper',
borderRadius: 1,
border: '1px solid',
borderColor: 'divider',
}}
>
<Typography variant="h5" sx={{ mb: 1 }}>
{arrangementSteps[step].label}
</Typography>

19
src/components/molecules/VenueCard/VenueCard.stories.tsx
View File

@@ -161,12 +161,7 @@ export const EdgeCases: Story = {
onClick={() => {}}
/>
{/* Minimal — just name, image, location */}
<VenueCard
name="Minimal Venue"
imageUrl={VENUE_BEACH}
location="Kiama"
onClick={() => {}}
/>
<VenueCard name="Minimal Venue" imageUrl={VENUE_BEACH} location="Kiama" onClick={() => {}} />
</Box>
),
};
@@ -186,9 +181,7 @@ export const Responsive: Story = {
<Box sx={{ display: 'flex', gap: 3, alignItems: 'start', flexWrap: 'wrap' }}>
{[280, 340, 420].map((width) => (
<Box key={width} sx={{ width }}>
<Box sx={{ mb: 1, fontSize: 12, color: 'text.secondary' }}>
{width}px
</Box>
<Box sx={{ mb: 1, fontSize: 12, color: 'text.secondary' }}>{width}px</Box>
<VenueCard
name="West Chapel"
imageUrl={VENUE_CHAPEL}
@@ -218,9 +211,7 @@ export const OnDifferentBackgrounds: Story = {
render: () => (
<Box sx={{ display: 'flex', gap: 3 }}>
<Box sx={{ width: 360, p: 3, backgroundColor: 'background.default' }}>
<Box sx={{ mb: 1, fontSize: 12, color: 'text.secondary' }}>
White surface
</Box>
<Box sx={{ mb: 1, fontSize: 12, color: 'text.secondary' }}>White surface</Box>
<VenueCard
name="West Chapel"
imageUrl={VENUE_CHAPEL}
@@ -237,9 +228,7 @@ export const OnDifferentBackgrounds: Story = {
backgroundColor: 'var(--fa-color-surface-subtle)',
}}
>
<Box sx={{ mb: 1, fontSize: 12, color: 'text.secondary' }}>
Grey surface (neutral.50)
</Box>
<Box sx={{ mb: 1, fontSize: 12, color: 'text.secondary' }}>Grey surface (neutral.50)</Box>
<VenueCard
name="Macquarie Park Gardens"
imageUrl={VENUE_GARDEN}

16
src/components/molecules/VenueCard/VenueCard.tsx
View File

@@ -112,9 +112,7 @@ export const VenueCard = React.forwardRef<HTMLDivElement, VenueCardProps>(
>
{/* Location */}
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>
<LocationOnOutlinedIcon
sx={{ fontSize: 14, color: 'text.secondary' }}
/>
<LocationOnOutlinedIcon sx={{ fontSize: 14, color: 'text.secondary' }} />
<Typography variant="caption" color="text.secondary">
{location}
</Typography>
@@ -126,10 +124,7 @@ export const VenueCard = React.forwardRef<HTMLDivElement, VenueCardProps>(
sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}
aria-label={`Capacity: ${capacity} guests`}
>
<PeopleOutlinedIcon
sx={{ fontSize: 14, color: 'text.secondary' }}
aria-hidden
/>
<PeopleOutlinedIcon sx={{ fontSize: 14, color: 'text.secondary' }} aria-hidden />
<Typography variant="caption" color="text.secondary">
{capacity} guests
</Typography>
@@ -143,12 +138,7 @@ export const VenueCard = React.forwardRef<HTMLDivElement, VenueCardProps>(
<Typography variant="body2" color="text.secondary">
From
</Typography>
<Typography
variant="h6"
component="span"
color="primary"
sx={{ fontWeight: 600 }}
>
<Typography variant="h6" component="span" color="primary" sx={{ fontWeight: 600 }}>
${price.toLocaleString('en-AU')}
</Typography>
</Box>