import React, { PropsWithChildren, useMemo } from 'react'
import { Icon } from '@chakra-ui/react'
import ButtonWithIcon, { ImageButtonProps, ImageButtonVariant } from './ImageButton'
export enum ButtonLinkImageType {
Arrow,
Download,
External,
}
const icons = {
[ButtonLinkImageType.Arrow]: {
[ImageButtonVariant.White]:
,
[ImageButtonVariant.Black]:
,
[ImageButtonVariant.Current]:
},
[ButtonLinkImageType.Download]: {
[ImageButtonVariant.White]:
,
[ImageButtonVariant.Black]:
,
[ImageButtonVariant.Current]:
},
[ButtonLinkImageType.External]: {
[ImageButtonVariant.White]:
,
[ImageButtonVariant.Black]:
,
[ImageButtonVariant.Current]:
,
},
}
// Icon komponenta s switch pro různé typy ikon
export const ButtonIcon = ({
imageType,
variant
}: {
imageType: ButtonLinkImageType,
variant: ImageButtonVariant
}) => {
return icons?.[imageType]?.[variant] ?? icons[ButtonLinkImageType.Arrow][ImageButtonVariant.Current]
}
type Props = PropsWithChildren & {
target?: '_blank' | '_self'
iconType?: ButtonLinkImageType
}>
const ButtonLink = ({
variant,
iconType,
target,
children,
}: Props) => {
const icon = useMemo(() => {
return icons[iconType][variant]
}, [iconType, variant])
return (
{children}
)
}
ButtonLink.defaultProps = {
variant: ImageButtonVariant.Current,
iconType: ButtonLinkImageType.Arrow
}
export default ButtonLink