chore: add cursor pointer for option card (#12119)

This commit is contained in:
AkaraChen 2024-12-27 20:20:25 +08:00 committed by GitHub
parent 309fd76ddf
commit 9d86056f1c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -15,13 +15,15 @@ type OptionCardHeaderProps = {
isActive?: boolean isActive?: boolean
activeClassName?: string activeClassName?: string
effectImg?: string effectImg?: string
disabled?: boolean
} }
export const OptionCardHeader: FC<OptionCardHeaderProps> = (props) => { export const OptionCardHeader: FC<OptionCardHeaderProps> = (props) => {
const { icon, title, description, isActive, activeClassName, effectImg } = props const { icon, title, description, isActive, activeClassName, effectImg, disabled } = props
return <div className={classNames( return <div className={classNames(
'flex h-full overflow-hidden rounded-t-xl relative', 'flex h-full overflow-hidden rounded-t-xl relative',
isActive && activeClassName, isActive && activeClassName,
!disabled && 'cursor-pointer',
)}> )}>
<div className='size-14 flex items-center justify-center relative overflow-hidden'> <div className='size-14 flex items-center justify-center relative overflow-hidden'>
{isActive && effectImg && <Image src={effectImg} className='absolute top-0 left-0 w-full h-full' alt='' width={56} height={56} />} {isActive && effectImg && <Image src={effectImg} className='absolute top-0 left-0 w-full h-full' alt='' width={56} height={56} />}
@ -63,7 +65,7 @@ export const OptionCard: FC<OptionCardProps> = forwardRef((props, ref) => {
(isActive && !noHighlight) (isActive && !noHighlight)
? 'border-[1.5px] border-components-option-card-option-selected-border' ? 'border-[1.5px] border-components-option-card-option-selected-border'
: 'border border-components-option-card-option-border', : 'border border-components-option-card-option-border',
disabled && 'opacity-50', disabled && 'opacity-50 cursor-not-allowed',
className, className,
)} )}
style={{ style={{
@ -83,6 +85,7 @@ export const OptionCard: FC<OptionCardProps> = forwardRef((props, ref) => {
isActive={isActive && !noHighlight} isActive={isActive && !noHighlight}
activeClassName={activeHeaderClassName} activeClassName={activeHeaderClassName}
effectImg={effectImg} effectImg={effectImg}
disabled={disabled}
/> />
{/** Body */} {/** Body */}
{isActive && (children || actions) && <div className='py-3 px-4 bg-components-panel-bg rounded-b-xl'> {isActive && (children || actions) && <div className='py-3 px-4 bg-components-panel-bg rounded-b-xl'>