button {
margin-right: 8px !important;
margin-bottom: 8px !important;
}
import {render} from 'react-dom';
import Button from '@jetbrains/ring-ui/components/button/button';
import {CaretDownIcon} from '@jetbrains/ring-ui/components/icon';
render(Button.factory({}, 'Button default'),
document.getElementById('button'));
render(Button.factory({
icon: CaretDownIcon
}, 'Button icon'), document.getElementById('button-icon'));
render(Button.factory({
short: true,
}, '...'), document.getElementById('button-short'));
var container = document.getElementById('buttons');
['active', 'blue', 'danger', 'delayed', 'loader',
'primary'].forEach(modifier => {
var node = document.createElement('span');
container.appendChild(node);
render(Button.factory({
[modifier]: true
}, 'Button ' + modifier), node);
});