IlyaSobolev/DocSpace-buildtools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

web: components: Added new property 'scale' to the Button component

Browse Source
This commit is contained in:
Alexey Safronov 2019-07-31 21:16:29 +03:00
parent fb8b4be622
commit f0063afabe
3 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/ASC.Web.Components/src/components/button/index.js
View File

@ -60,6 +60,8 @@ const StyledButton = styled(ButtonWrapper).attrs((props) => ({
: (props.primary ? '#A6DCF2' : '#FFFFFF'))
};
${props => props.scale && `width: 100%;`}
padding: ${props =>
(props.size === 'big' && (props.primary
? (props.icon
@ -195,6 +197,7 @@ Button.propTypes = {
label: PropTypes.string,
primary: PropTypes.bool,
size: PropTypes.oneOf(['base', 'medium', 'big']),
scale: PropTypes.bool,
icon: PropTypes.node,
tabIndex: PropTypes.number,
@ -211,6 +214,7 @@ Button.defaultProps = {
label: '',
primary: false,
size: 'base',
scale: false,
icon: null,
tabIndex: -1,

3
web/ASC.Web.Storybook/stories/buttons/base/README.md
View File

@ -22,7 +22,8 @@ Button is used for a action on a page.
| ------------------ | -------- | :------: | --------------------------- | --------- | ------------------------------------------------------------------------------------------------------------------------------------------------ |
| `label` | `string` | - | - | - | Button text |
| `primary` | `bool` | - | - | - | Tells when the button should be primary |
| `size` | `oneOf` | - | `base`, `middle`, `big`, `huge` | `base` | Size of button |
| `size` | `oneOf` | - | `base`, `middle`, `big` | `base` | Size of button |
| `scale` | `bool` | - | - | false | Scale width of button to 100% |
| `isDisabled` | `bool` | - | - | - | Tells when the button should present a disabled state |
| `isLoading` | `bool` | - | - | - | Tells when the button should show loader icon |
| `onClick` | `func` | ✅ | - | - | What the button will trigger when clicked |

1
web/ASC.Web.Storybook/stories/buttons/base/base.button.stories.js
View File

@ -24,6 +24,7 @@ storiesOf('Components|Buttons', module)
label={text('label', 'Base button')}
primary={boolean('primary', true)}
size={select('size', sizeOptions, 'big')}
scale={boolean('scale', false)}
isLoading={boolean('isLoading', false)}
isHovered={boolean('isHovered', false)}