@roo-ui/components/dist/ErrorMessage/ErrorMessage.js

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _styledSystem = require('styled-system');

var _styledComponents = require('styled-components');

var _styledComponents2 = _interopRequireDefault(_styledComponents);

var _polished = require('polished');

var _Text = require('../Text');

var _Text2 = _interopRequireDefault(_Text);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var ErrorMessage = (0, _styledComponents2.default)(_Text2.default).withConfig({
  displayName: 'ErrorMessage'
})(['padding:', ';position:relative;width:100%;display:block;text-align:left;&:after{content:\'\';height:0;width:0;position:absolute;border:solid transparent;border-width:', ';}', ' ', ' ', ' ', ''], (0, _styledSystem.themeGet)('space.3'), (0, _polished.rem)('10px'), function (props) {
  return props.arrow === 'top' && (0, _styledComponents.css)(['&:after{bottom:100%;left:', ';border-bottom-color:', ';}'], (0, _styledSystem.themeGet)('space.3'), (0, _styledSystem.themeGet)('colors.ui.errorBackground'));
}, function (props) {
  return props.arrow === 'left' && (0, _styledComponents.css)(['&:after{top:50%;right:100%;transform:translateY(-50%);border-right-color:', ';}'], (0, _styledSystem.themeGet)('colors.ui.errorBackground'));
}, function (props) {
  return props.arrow === 'right' && (0, _styledComponents.css)(['&:after{top:50%;left:100%;transform:translateY(-50%);border-left-color:', ';}'], (0, _styledSystem.themeGet)('colors.ui.errorBackground'));
}, function (props) {
  return props.arrow === 'bottom' && (0, _styledComponents.css)(['&:after{top:100%;left:', ';border-top-color:', ';}'], (0, _styledSystem.themeGet)('space.3'), (0, _styledSystem.themeGet)('colors.ui.errorBackground'));
});

ErrorMessage.propTypes = {
  arrow: _propTypes2.default.oneOf(['top', 'right', 'bottom', 'left'])
};

ErrorMessage.defaultProps = {
  bg: 'ui.errorBackground',
  arrow: null,
  blacklist: Object.keys(ErrorMessage.propTypes)
};

exports.default = ErrorMessage;