{footer}
</div>
</Popover>
);
});
Modal.Types = {
DANGER: 'danger',
INFO: 'info',
VALID: 'valid'
};
Modal.propTypes = {
type: PropTypes.string.describe('Used to change the color of the modal and buttons. Use Modal.Types.DANGER, Modal.Types.INFO, or Modal.Types.VALID.'),
icon: PropTypes.string.describe('The Icon to display in the top right corner.'),
iconSize: PropTypes.number.describe('The size of the Icon in the top right corner.'),
title: PropTypes.string.isRequired.describe('The title of the modal.'),
subtitle: PropTypes.node.describe('The subtitle of the modal. Usually a string or <span>.'),
cancelText: PropTypes.string.describe('String for the cancel button. Defaults to "Cancel".'),
onCancel: PropTypes.func.describe('Called when the cancel button is clicked.'),
canCancel: PropTypes.bool.describe('Determines whether this modal can be cancelled. Defaults to true. Useful to prevent the user from attempting to cancel a modal when a related request is in-flight.'),
showCancel: PropTypes.bool.describe('Determines whether to show the cancel button. Defaults to true.'),
confirmText: PropTypes.string.describe('String for the confirm button. Defaults to "Okay".'),
onConfirm: PropTypes.func.describe('Called when the confirm button is clicked.'),
disabled: PropTypes.bool.describe('If true, the confirm button will be disabled.'),
progress: PropTypes.bool.describe('Passed to the confirm button.'),
customFooter: PropTypes.node.describe('used to fill any custom footer use case.'),
textModal: PropTypes.bool.describe('Used for modals that contain only text to pad the text.'),
width: PropTypes.number.describe('custom width of modal.'),
buttonsInCenter: PropTypes.bool.describe('If true, the buttons will appear in the center of the modal, instead of to the right. By default, the buttons appear on the right unless the modal contains no children, in which case they appear in the center.'),
};
let padding = (props.padding || 20) + 'px';
return (
<div
className={[styles.label, centered].join(' ')}
style={{ padding: '0 ' + padding }}>
<div className={styles.text}>
{props.text}
{props.help ? <span className={styles.help}>{props.help}</span> : null}
</div>
{props.description ? <div className={styles.description}>{props.description}</div> : null}
</div>
);
};
export default Label;
Label.PropTypes = {
text: PropTypes.node.describe(
'The main text/node of the label.'
),
description: PropTypes.node.describe(
'The secondary text/node of the label.'
),
padding: PropTypes.number.describe(
'Allows you to override the left-right padding of the label.'
),
help: PropTypes.node.describe(
'The component to be rendered as a help for this label.'
)
};