Skip to content

Instantly share code, notes, and snippets.

@allmarkedup
Created August 27, 2016 11:22
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save allmarkedup/4e94581dc046876f0db87463961e2e7e to your computer and use it in GitHub Desktop.
Save allmarkedup/4e94581dc046876f0db87463961e2e7e to your computer and use it in GitHub Desktop.
Example react component for fractal
import React, { PropTypes } from 'react';
const STYLE_PREFIX = 'c-button';
const Button = (props) => {
const buttonProps = {
className: `${STYLE_PREFIX}`,
disabled: props.disabled,
type: props.submit ? 'submit' : 'button'
};
props.modifiers.forEach((modifier) => {
buttonProps.className += ` ${STYLE_PREFIX}--${modifier}`;
});
if (props.onClick) {
buttonProps.onClick = props.onClick;
}
if (props.ariaLabel) {
buttonProps['aria-label'] = props.ariaLabel;
}
return (
<button
{...buttonProps}
>
{props.label}
</button>
);
};
Button.propTypes = {
label: PropTypes.string.isRequired,
};
Button.defaultProps = {
disabled: false,
label: 'Label',
modifiers: [],
onClick: () => {},
submit: false
};
export default Button;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment