forked from crowetic/commerce
31 lines
782 B
TypeScript
31 lines
782 B
TypeScript
import { FC, MouseEventHandler, memo } from 'react'
|
|
import cn from 'clsx'
|
|
import s from './ProductSliderControl.module.css'
|
|
import { ArrowLeft, ArrowRight } from '@components/icons'
|
|
|
|
interface ProductSliderControl {
|
|
onPrev: MouseEventHandler<HTMLButtonElement>
|
|
onNext: MouseEventHandler<HTMLButtonElement>
|
|
}
|
|
|
|
const ProductSliderControl: FC<ProductSliderControl> = ({ onPrev, onNext }) => (
|
|
<div className={s.control}>
|
|
<button
|
|
className={cn(s.leftControl)}
|
|
onClick={onPrev}
|
|
aria-label="Previous Product Image"
|
|
>
|
|
<ArrowLeft />
|
|
</button>
|
|
<button
|
|
className={cn(s.rightControl)}
|
|
onClick={onNext}
|
|
aria-label="Next Product Image"
|
|
>
|
|
<ArrowRight />
|
|
</button>
|
|
</div>
|
|
)
|
|
|
|
export default memo(ProductSliderControl)
|