@music-loopy/loops/es/components/Divider/index.js

A React component library for Music Loopy Applications and websites

var _excluded = ["variant", "center"];
var _templateObject, _templateObject2, _templateObject3;
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.indexOf(n) >= 0) continue; t[n] = r[n]; } return t; }
function _taggedTemplateLiteralLoose(e, t) { return t || (t = e.slice(0)), e.raw = t, e; }
import styled from 'styled-components';
import PropTypes from 'prop-types';
import React from 'react';
var StyledDivider = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  width: 40%;\n  height: 4px;\n  background-color: ", ";\n  opacity: 0.5;\n"])), function (props) {
  return props.theme.colors[props.variant].color;
});
var Container = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n"])));
var CenteredText = styled.p(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n  font-size: 0.8rem;\n  font-weight: 500;\n  color: ", ";\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 0 10px;\n  text-transform: uppercase;\n  font-weight: 500;\n"])), function (props) {
  return props.theme.colors[props.variant || 'dark'].color;
});
var Divider = function Divider(_ref) {
  var _ref$variant = _ref.variant,
    variant = _ref$variant === void 0 ? 'dark' : _ref$variant,
    center = _ref.center,
    props = _objectWithoutPropertiesLoose(_ref, _excluded);
  return /*#__PURE__*/React.createElement(Container, props, /*#__PURE__*/React.createElement(StyledDivider, {
    variant: variant
  }), center && /*#__PURE__*/React.createElement(CenteredText, {
    variant: center.variant
  }, center.text), /*#__PURE__*/React.createElement(StyledDivider, {
    variant: variant
  }));
};
Divider.propTypes = process.env.NODE_ENV !== "production" ? {
  variant: PropTypes.oneOf(['primary', 'dark', 'light', 'secondary', 'danger', 'success', 'warning']),
  center: PropTypes.shape({
    variant: PropTypes.oneOf(['primary', 'dark', 'light', 'secondary', 'danger', 'success', 'warning']),
    text: PropTypes.string
  })
} : {};
Divider.defaultProps = {
  variant: 'dark'
};
export default Divider;