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

Wyświetl plik

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