@kiwicom/orbit-components/lib/primitives/BadgePrimitive/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").default;

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

exports.__esModule = true;
exports.default = exports.StyledBadge = void 0;

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

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

var _CarrierLogo = _interopRequireWildcard(require("../../CarrierLogo"));

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

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

const StyledBadge = (0, _styledComponents.default)(({
  className,
  children,
  dataTest,
  ariaLabel,
  id
}) => /*#__PURE__*/React.createElement("div", {
  className: className,
  id: id,
  "data-test": dataTest,
  "aria-label": ariaLabel
}, children)).withConfig({
  displayName: "BadgePrimitive__StyledBadge",
  componentId: "sc-1ibxlos-0"
})(["", ""], ({
  theme,
  borderColor,
  background,
  foregroundColor
}) => (0, _styledComponents.css)(["position:relative;font-family:", ";display:inline-flex;flex:0 0 auto;box-sizing:border-box;justify-content:center;align-items:center;min-height:", ";line-height:14px;font-size:", ";font-weight:", ";background:", ";color:", ";border-radius:", ";padding:", ";border:", ";", "{position:absolute;", ":-2px;}"], theme.orbit.fontFamily, theme.orbit.heightBadge, theme.orbit.fontSizeTextSmall, theme.orbit.fontWeightMedium, background, foregroundColor, theme.orbit.borderRadiusBadge, theme.orbit.paddingBadge, borderColor && `1px solid ${borderColor}`, _CarrierLogo.StyledCarrierLogo, _rtl.left)); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198

exports.StyledBadge = StyledBadge;
StyledBadge.defaultProps = {
  theme: _defaultTheme.default
};
const IconContainer = (0, _styledComponents.default)(({
  className,
  children
}) => /*#__PURE__*/React.createElement("div", {
  className: className
}, children)).withConfig({
  displayName: "BadgePrimitive__IconContainer",
  componentId: "sc-1ibxlos-1"
})(["", ""], ({
  theme,
  hasContent
}) => (0, _styledComponents.css)(["display:flex;flex-shrink:0;margin:", ";svg{height:", ";width:", ";}"], hasContent && (0, _rtl.rtlSpacing)(theme.orbit.marginBadgeIcon), theme.orbit.widthIconSmall, theme.orbit.heightIconSmall)); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198

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

const StyledBadgeContent = _styledComponents.default.div.withConfig({
  displayName: "BadgePrimitive__StyledBadgeContent",
  componentId: "sc-1ibxlos-2"
})(["", ""], ({
  theme,
  $isCarrier
}) => (0, _styledComponents.css)(["padding:5px 0;line-height:1;margin-", ":", "px;"], _rtl.left, $isCarrier && parseInt(theme.orbit.widthIconMedium, 10) - parseInt(theme.orbit.spaceXXSmall, 10))); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198


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

const BadgePrimitive = ({
  icon,
  children,
  ariaLabel,
  dataTest,
  id,
  background,
  foregroundColor,
  borderColor,
  carriers
}) => {
  return /*#__PURE__*/React.createElement(StyledBadge, {
    background: background,
    foregroundColor: foregroundColor,
    id: id,
    dataTest: dataTest,
    ariaLabel: ariaLabel,
    borderColor: borderColor
  }, carriers && /*#__PURE__*/React.createElement(_CarrierLogo.default, {
    carriers: carriers,
    rounded: true,
    size: "medium"
  }), icon && /*#__PURE__*/React.createElement(IconContainer, {
    hasContent: !!children
  }, icon), /*#__PURE__*/React.createElement(StyledBadgeContent, {
    $isCarrier: carriers && carriers.length > 0
  }, children));
};

var _default = BadgePrimitive;
exports.default = _default;