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