react-vertical-timeline-component
Version:
Vertical timeline for React.js
33 lines • 1.46 kB
JavaScript
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
var VerticalTimeline = function VerticalTimeline(_ref) {
var _ref$animate = _ref.animate,
animate = _ref$animate === void 0 ? true : _ref$animate,
_ref$className = _ref.className,
className = _ref$className === void 0 ? '' : _ref$className,
_ref$layout = _ref.layout,
layout = _ref$layout === void 0 ? '2-columns' : _ref$layout,
_ref$lineColor = _ref.lineColor,
lineColor = _ref$lineColor === void 0 ? '#FFF' : _ref$lineColor,
children = _ref.children;
if (typeof window === 'object') {
document.documentElement.style.setProperty('--line-color', lineColor);
}
return /*#__PURE__*/React.createElement("div", {
className: classNames(className, 'vertical-timeline', {
'vertical-timeline--animate': animate,
'vertical-timeline--two-columns': layout === '2-columns',
'vertical-timeline--one-column-left': layout === '1-column' || layout === '1-column-left',
'vertical-timeline--one-column-right': layout === '1-column-right'
})
}, children);
};
VerticalTimeline.propTypes = {
children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]).isRequired,
className: PropTypes.string,
animate: PropTypes.bool,
layout: PropTypes.oneOf(['1-column-left', '1-column', '2-columns', '1-column-right']),
lineColor: PropTypes.string
};
export default VerticalTimeline;