@kiwicom/orbit-components/lib/deprecated/Card/CardHeader/index.js

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.StyledCardHeader = void 0;

var React = _interopRequireWildcard(require("react"));

var _styledComponents = _interopRequireWildcard(require("styled-components"));

var _defaultTheme = _interopRequireDefault(require("../../../defaultTheme"));

var _Heading = _interopRequireWildcard(require("../../../Heading"));

var _Text = _interopRequireDefault(require("../../../Text"));

var _rtl = require("../../../utils/rtl");

var _mediaQuery = _interopRequireDefault(require("../../../utils/mediaQuery"));

var StyledCardHeader = _styledComponents.default.div.withConfig({
  displayName: "CardHeader__StyledCardHeader",
  componentId: "sc-4ssel7-0"
})(["position:relative;width:100%;padding:", ";box-sizing:border-box;color:", ";", ""], function (_ref) {
  var theme = _ref.theme;
  return theme.orbit.spaceMedium;
}, function (_ref2) {
  var theme = _ref2.theme;
  return theme.orbit.colorHeading;
}, _mediaQuery.default.desktop((0, _styledComponents.css)(["padding:", ";"], function (_ref3) {
  var theme = _ref3.theme;
  return theme.orbit.spaceLarge;
})));

exports.StyledCardHeader = StyledCardHeader;
StyledCardHeader.defaultProps = {
  theme: _defaultTheme.default
};

var StyledHeadingWrapper = _styledComponents.default.div.withConfig({
  displayName: "CardHeader__StyledHeadingWrapper",
  componentId: "sc-4ssel7-1"
})(["display:flex;align-items:center;", "{width:100%;}"], _Heading.StyledHeading);

var StyledSubTitle = _styledComponents.default.div.withConfig({
  displayName: "CardHeader__StyledSubTitle",
  componentId: "sc-4ssel7-2"
})(["display:flex;margin-top:", ";"], function (_ref4) {
  var theme = _ref4.theme;
  return theme.orbit.spaceXXSmall;
});

StyledSubTitle.defaultProps = {
  theme: _defaultTheme.default
};

var StyledIcon = _styledComponents.default.div.withConfig({
  displayName: "CardHeader__StyledIcon",
  componentId: "sc-4ssel7-3"
})(["color:", ";display:flex;align-items:center;margin:", ";"], function (_ref5) {
  var theme = _ref5.theme;
  return theme.orbit.colorHeading;
}, function (_ref6) {
  var theme = _ref6.theme;
  return (0, _rtl.rtlSpacing)("0 ".concat(theme.orbit.spaceSmall, " 0 0"));
});

StyledIcon.defaultProps = {
  theme: _defaultTheme.default
};

var CardHeader = function CardHeader(_ref7) {
  var icon = _ref7.icon,
      title = _ref7.title,
      subTitle = _ref7.subTitle,
      actions = _ref7.actions,
      dataTest = _ref7.dataTest,
      dataA11ySection = _ref7.dataA11ySection;
  return /*#__PURE__*/React.createElement(StyledCardHeader, {
    "data-test": dataTest
  }, /*#__PURE__*/React.createElement(StyledHeadingWrapper, null, icon && /*#__PURE__*/React.createElement(StyledIcon, null, icon), /*#__PURE__*/React.createElement(_Heading.default, {
    type: "title3",
    as: "h2",
    dataA11ySection: dataA11ySection
  }, title), actions), subTitle && /*#__PURE__*/React.createElement(StyledSubTitle, null, /*#__PURE__*/React.createElement(_Text.default, null, subTitle)));
};

CardHeader.displayName = "CardHeader";
var _default = CardHeader;
exports.default = _default;