import React from 'react'; import PropTypes from 'prop-types'; import classNames from 'classnames'; export const WizardStep = props => { const stepClass = classNames({ 'wizard-step--active': props.active, 'wizard-step--complete': props.complete, 'wizard-step--disabled': props.disabled }, 'wizard-step', props.className); return ( !props.disabled && props.onClick()}>
{ !props.complete ? props.icon : props.successIcon }
{ props.children }
) }; WizardStep.defaultProps = { successIcon: (), onClick: () => {} } WizardStep.propTypes = { active: PropTypes.bool, complete: PropTypes.bool, disabled: PropTypes.bool, className: PropTypes.string, id: PropTypes.string.required, onClick: PropTypes.func.required, icon: PropTypes.node, successIcon: PropTypes.node, children: PropTypes.node }