57 lines
1.6 KiB
TypeScript
57 lines
1.6 KiB
TypeScript
import { Button } from '../../Button'
|
|
import { MaterialIcon } from '../../Icons/MaterialIcon'
|
|
import { Typography } from '../../Typography'
|
|
import styles from '../rate-card.module.css'
|
|
import { variants } from '../variants'
|
|
|
|
interface NoRateAvailableCardProps {
|
|
variant: 'Regular' | 'Campaign' | 'Code' | 'Points'
|
|
rateTitle: string
|
|
paymentTerm: string
|
|
bannerText?: string
|
|
noPricesAvailableText: string
|
|
}
|
|
|
|
export default function NoRateAvailableCard({
|
|
variant,
|
|
rateTitle,
|
|
paymentTerm,
|
|
bannerText,
|
|
noPricesAvailableText,
|
|
}: NoRateAvailableCardProps) {
|
|
const classNames = variants({
|
|
variant,
|
|
})
|
|
|
|
return (
|
|
<div className={classNames}>
|
|
{bannerText && (
|
|
<Typography variant="Tag/sm">
|
|
<p className={styles.banner}>{bannerText}</p>
|
|
</Typography>
|
|
)}
|
|
<div className={styles.container}>
|
|
<header>
|
|
<Typography variant="Tag/sm">
|
|
<h3 className={`${styles.title} ${styles.textDisabled}`}>
|
|
<Button variant="Icon" size="Small">
|
|
<MaterialIcon icon="info" size={20} color="Icon/Default" />
|
|
</Button>
|
|
{`${rateTitle} / ${paymentTerm}`}
|
|
</h3>
|
|
</Typography>
|
|
</header>
|
|
<div>
|
|
<div className={styles.noPricesAvailableContainer}>
|
|
<Typography variant="Body/Supporting text (caption)/smBold">
|
|
<p className={styles.noPricesAvailableText}>
|
|
{noPricesAvailableText}
|
|
</p>
|
|
</Typography>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|