feat(SW-1435): Added RateCard component to design system * feat(SW-1435): Added new component: RateCard to design system * feat: added reward night points rate card * fix: set svg icon color to "currentColor" to make them more reusable * fix: added click handler for info icon * fix: added selectedRate Approved-by: Arvid Norlin
109 lines
2.2 KiB
TypeScript
109 lines
2.2 KiB
TypeScript
import type { Meta, StoryObj } from '@storybook/react'
|
|
|
|
import { RateCard } from './RateCard'
|
|
|
|
const meta: Meta<typeof RateCard> = {
|
|
title: 'Components/RateCard/Campaign',
|
|
component: RateCard,
|
|
decorators: [
|
|
(Story) => (
|
|
<div style={{ maxWidth: '400px' }}>
|
|
<Story />
|
|
</div>
|
|
),
|
|
],
|
|
argTypes: {
|
|
title: { control: 'text' },
|
|
},
|
|
}
|
|
|
|
export default meta
|
|
|
|
type Story = StoryObj<typeof RateCard>
|
|
|
|
export const Default: Story = {
|
|
args: {
|
|
variant: 'Campaign',
|
|
title: 'NON-REFUNDABLE / PAY NOW',
|
|
bannerText: 'Campaign ∙ Breakfast included',
|
|
rate: {
|
|
label: "Valentine's Special",
|
|
price: '198',
|
|
unit: 'EUR/NIGHT',
|
|
},
|
|
approximateRate: {
|
|
price: '198 EUR',
|
|
label: 'Approx.',
|
|
},
|
|
referenceRate: {
|
|
price: '249 EUR',
|
|
label: 'Lowest past price (last 30 days)',
|
|
},
|
|
},
|
|
}
|
|
|
|
export const Package: Story = {
|
|
args: {
|
|
variant: 'Campaign',
|
|
title: 'NON-REFUNDABLE / PAY NOW',
|
|
bannerText: 'WDCPHG ∙ Breakfast included',
|
|
rate: {
|
|
label: 'Luxurious wine & dine in Copenhagen',
|
|
price: '1989',
|
|
unit: 'EUR/NIGHT',
|
|
},
|
|
approximateRate: {
|
|
price: '1989 EUR',
|
|
label: 'Approx.',
|
|
},
|
|
},
|
|
}
|
|
|
|
export const CampaignLoggedIn: Story = {
|
|
args: {
|
|
variant: 'Campaign',
|
|
title: 'NON-REFUNDABLE / PAY NOW',
|
|
bannerText: 'SUM2025 ∙ Breakfast included',
|
|
rate: {
|
|
label: 'Luxurious wine & dine in Copenhagen',
|
|
price: '198',
|
|
unit: 'EUR/NIGHT',
|
|
},
|
|
approximateRate: {
|
|
price: '198 EUR',
|
|
label: 'Approx.',
|
|
},
|
|
comparisonRate: {
|
|
price: '249',
|
|
unit: 'EUR/NIGHT',
|
|
},
|
|
isHighlightedRate: true,
|
|
},
|
|
}
|
|
|
|
export const CampaignOmnibus: Story = {
|
|
args: {
|
|
variant: 'Campaign',
|
|
title: 'NON-REFUNDABLE / PAY NOW',
|
|
bannerText: 'WDCPHG ∙ Breakfast included',
|
|
rate: {
|
|
label: 'Luxurious wine & dine in Copenhagen',
|
|
price: '198',
|
|
unit: 'EUR/NIGHT',
|
|
},
|
|
memberRate: {
|
|
label: 'Member price',
|
|
price: '150',
|
|
unit: 'EUR/NIGHT',
|
|
},
|
|
approximateRate: {
|
|
price: '198 EUR',
|
|
label: 'Approx.',
|
|
},
|
|
referenceRate: {
|
|
price: '101 EUR',
|
|
label: 'Lowest past price (last 30 days)',
|
|
},
|
|
},
|
|
}
|