🔧 chore: bigger img on userselectitem

This commit is contained in:
Andre H 2024-02-29 09:15:18 +07:00
parent f77f7c120a
commit a5b4103515
2 changed files with 3 additions and 7 deletions

View File

@ -12,7 +12,7 @@ export const userSelectItemTheme = tv({
'cursor-pointer', 'cursor-pointer',
], ],
content: ['flex', 'gap-3', 'items-center'], content: ['flex', 'gap-3', 'items-center'],
img: ['h-5', 'w-5'], img: ['h-10', 'w-10', 'rounded-lg'],
selectedIcon: ['h-5', 'w-5', 'text-controls-primary'], selectedIcon: ['h-5', 'w-5', 'text-controls-primary'],
label: ['text-sm', 'text-elements-high-em', 'tracking-[-0.006em]'], label: ['text-sm', 'text-elements-high-em', 'tracking-[-0.006em]'],
}, },

View File

@ -32,14 +32,10 @@ const UserSelectItem = forwardRef<HTMLLIElement, UserSelectItemProps>(
({ className, selected, hovered, option, ...props }, ref) => { ({ className, selected, hovered, option, ...props }, ref) => {
const theme = userSelectItemTheme(); const theme = userSelectItemTheme();
const { value, label, imgSrc } = option; const { value, label, imgSrc = './logo.svg' } = option;
const renderLeftImage = useMemo( const renderLeftImage = useMemo(
() => ( () => <img src={imgSrc} alt={`${value}-logo`} className={theme.img()} />,
<div className="grid place-items-center w-10 h-10 rounded-lg bg-blue-400">
<img src={imgSrc} alt={`${value}-logo`} className={theme.img()} />
</div>
),
[imgSrc, value], [imgSrc, value],
); );