Button: element -> iconElement

environments/review-update-zap-0lcnba/deployments/4741
Alex Gleason 2024-07-28 22:32:04 -05:00
rodzic 82547b4378
commit 04e0ea6635
Nie znaleziono w bazie danych klucza dla tego podpisu
ID klucza GPG: 7211D1F99744FBB7
2 zmienionych plików z 9 dodań i 9 usunięć

Wyświetl plik

@ -17,8 +17,8 @@ interface IButton {
className?: string;
/** Prevent the button from being clicked. */
disabled?: boolean;
/** Specifies the media element type as 'svg' or 'img'. */
element?: 'svg' | 'img';
/** Specifies the icon element as 'svg' or 'img'. */
iconElement?: 'svg' | 'img';
/** URL to an SVG icon to render inside the button. */
icon?: string;
/** Action when the button is clicked. */
@ -41,7 +41,7 @@ const Button = React.forwardRef<HTMLButtonElement, IButton>((props, ref): JSX.El
block = false,
children,
disabled = false,
element,
iconElement,
icon,
onClick,
size = 'md',
@ -66,7 +66,7 @@ const Button = React.forwardRef<HTMLButtonElement, IButton>((props, ref): JSX.El
return null;
}
return <Icon src={icon} className='h-4 w-4' element={element} />;
return <Icon src={icon} className='h-4 w-4' element={iconElement} />;
};
const handleClick: React.MouseEventHandler<HTMLButtonElement> = React.useCallback((event) => {

Wyświetl plik

@ -71,11 +71,11 @@ const ZapPayRequestForm = ({ account, status }: IZapPayRequestForm) => {
</div>
<div className='flex justify-center '>
<Button onClick={() => setZapAmount(50)} className='m-1' type='button' element='img' icon={coinIcon} theme={zapAmount === 50 ? 'primary' : 'muted'} text='50' />
<Button onClick={() => setZapAmount(200)} className='m-1' type='button' element='img' icon={coinStack} theme={zapAmount === 200 ? 'primary' : 'muted'} text='200' />
<Button onClick={() => setZapAmount(1_000)} className='m-1' type='button' element='img' icon={pileCoin} theme={zapAmount === 1_000 ? 'primary' : 'muted'} text='1K' />
<Button onClick={() => setZapAmount(3_000)} className='m-1' type='button' element='img' icon={moneyBag} theme={zapAmount === 3_000 ? 'primary' : 'muted'} text='3K' />
<Button onClick={() => setZapAmount(5_000)} className='m-1' type='button' element='img' icon={chestIcon} theme={zapAmount === 5_000 ? 'primary' : 'muted'} text='5K' />
<Button onClick={() => setZapAmount(50)} className='m-1' type='button' iconElement='img' icon={coinIcon} theme={zapAmount === 50 ? 'primary' : 'muted'} text='50' />
<Button onClick={() => setZapAmount(200)} className='m-1' type='button' iconElement='img' icon={coinStack} theme={zapAmount === 200 ? 'primary' : 'muted'} text='200' />
<Button onClick={() => setZapAmount(1_000)} className='m-1' type='button' iconElement='img' icon={pileCoin} theme={zapAmount === 1_000 ? 'primary' : 'muted'} text='1K' />
<Button onClick={() => setZapAmount(3_000)} className='m-1' type='button' iconElement='img' icon={moneyBag} theme={zapAmount === 3_000 ? 'primary' : 'muted'} text='3K' />
<Button onClick={() => setZapAmount(5_000)} className='m-1' type='button' iconElement='img' icon={chestIcon} theme={zapAmount === 5_000 ? 'primary' : 'muted'} text='5K' />
</div>
<div className='flex justify-center'>