import _isNil from "ramda/src/isNil";
var _excluded = ["as", "barColor", "children", "className", "grow"];
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
import React from 'react';
import styled, { css } from 'styled-components';
import { isFunction } from '../../common/utils';
var getColor = function getColor(props) {
  var barColor = props.barColor,
    theme = props.theme;
  if (isFunction(barColor)) {
    return barColor(theme);
  }
  return 'transparent';
};
var barStyles = css(["position:relative;&::before{content:'';display:block;width:100%;height:", "px;background:", ";position:absolute;top:0;left:0;", "{border-top-left-radius:", ";border-top-right-radius:", ";}}"], function (p) {
  return p.theme.spacing.unit(2);
}, function (p) {
  return getColor(p);
}, function (p) {
  return p.theme.media.greaterThan(p.theme.breakpoints.sm);
}, function (p) {
  return p.theme.borderRadius8;
}, function (p) {
  return p.theme.borderRadius8;
});
var StyledCard = styled.div.withConfig({
  displayName: "Card__StyledCard",
  componentId: "sc-1e5czjc-0"
})(["background:", ";box-shadow:0 2px 2px 0 ", ";", ";&&{", ";}", "{border-radius:", ";}"], function (_ref) {
  var theme = _ref.theme;
  return theme.color.card;
}, function (_ref2) {
  var theme = _ref2.theme;
  return theme.color.shadowCard;
}, function (p) {
  return p.barColor ? barStyles : "";
}, function (p) {
  return !_isNil(p.grow) && "flex-grow: ".concat(p.grow);
}, function (p) {
  return p.theme.media.greaterThan(p.theme.breakpoints.sm);
}, function (_ref3) {
  var theme = _ref3.theme;
  return theme.borderRadius8;
});
export var Card = React.forwardRef(function (_ref4, ref) {
  var as = _ref4.as,
    barColor = _ref4.barColor,
    children = _ref4.children,
    className = _ref4.className,
    grow = _ref4.grow,
    rest = _objectWithoutProperties(_ref4, _excluded);
  return React.createElement(StyledCard, _extends({
    className: className,
    as: as,
    barColor: barColor,
    ref: ref,
    grow: grow
  }, rest), children);
});
Card.displayName = 'Card';