mirror of
https://github.com/roleypoly/roleypoly.git
synced 2025-06-18 02:19:09 +00:00
chore: restructure project into yarn workspaces, remove next
This commit is contained in:
parent
49e308507e
commit
8d06327c03
266 changed files with 16466 additions and 3350 deletions
38
packages/design-system/atoms/button/Button.tsx
Normal file
38
packages/design-system/atoms/button/Button.tsx
Normal file
|
@ -0,0 +1,38 @@
|
|||
import * as React from 'react';
|
||||
import {
|
||||
Button as StyledButton,
|
||||
ButtonComposerOptions,
|
||||
IconContainer,
|
||||
} from './Button.styled';
|
||||
|
||||
export type ButtonProps = Partial<ButtonComposerOptions> & {
|
||||
children: React.ReactNode;
|
||||
icon?: React.ReactNode;
|
||||
loading?: boolean;
|
||||
onClick?: () => void;
|
||||
disabled?: boolean;
|
||||
};
|
||||
|
||||
export const Button = (props: ButtonProps) => {
|
||||
const modifiers: ButtonProps['modifiers'] = [];
|
||||
if (props.loading) {
|
||||
modifiers.push('withLoading');
|
||||
}
|
||||
|
||||
if (props.icon) {
|
||||
modifiers.push('withIcon');
|
||||
}
|
||||
|
||||
return (
|
||||
<StyledButton
|
||||
size={props.size || 'large'}
|
||||
color={props.color || 'primary'}
|
||||
modifiers={modifiers}
|
||||
onClick={props.onClick}
|
||||
disabled={props.disabled}
|
||||
>
|
||||
{props.icon && <IconContainer>{props.icon}</IconContainer>}
|
||||
<div>{props.children}</div>
|
||||
</StyledButton>
|
||||
);
|
||||
};
|
Loading…
Add table
Add a link
Reference in a new issue