6fa301f8e7
SW-3396 move my saved cards to design system * Move PaymentOption, PaymentOptionsGroup, PaymentIcons and MySavedCards (renamed SelectPaymentMethod) to design-system * Remove unused svg payment icons * cleanu * cleanup * trackUpdatePaymentMethod: remove hotelId argument that was never passed Approved-by: Anton Gunnarsson
49 lines
1.0 KiB
TypeScript
49 lines
1.0 KiB
TypeScript
'use client'
|
|
|
|
import { Label, RadioGroup } from 'react-aria-components'
|
|
import { useController, useFormContext } from 'react-hook-form'
|
|
|
|
import type { ReactNode } from 'react'
|
|
import { Typography } from '../../../components/Typography'
|
|
|
|
interface PaymentOptionsGroupProps {
|
|
name: string
|
|
label?: string
|
|
children: ReactNode
|
|
className?: string
|
|
onChange?: (newValue: string) => void
|
|
}
|
|
|
|
export function PaymentOptionsGroup({
|
|
name,
|
|
label,
|
|
children,
|
|
className,
|
|
onChange,
|
|
}: PaymentOptionsGroupProps) {
|
|
const { control } = useFormContext()
|
|
|
|
const {
|
|
field: { value, onChange: formOnChange },
|
|
} = useController({
|
|
name,
|
|
control,
|
|
})
|
|
|
|
const handleChange = (newValue: string) => {
|
|
formOnChange(newValue)
|
|
onChange?.(newValue)
|
|
}
|
|
|
|
return (
|
|
<RadioGroup value={value} onChange={handleChange} className={className}>
|
|
{label ? (
|
|
<Typography variant="Title/Overline/sm">
|
|
<Label>{label}</Label>
|
|
</Typography>
|
|
) : null}
|
|
{children}
|
|
</RadioGroup>
|
|
)
|
|
}
|