kopia lustrzana https://gitlab.com/soapbox-pub/soapbox
Button: element -> iconElement
rodzic
82547b4378
commit
04e0ea6635
|
@ -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) => {
|
||||
|
|
|
@ -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'>
|
||||
|
|
Ładowanie…
Reference in New Issue