@kiwicom/orbit-components/lib/Tile/components/TileWrapper/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.StyledTileWrapper = void 0;
var React = _interopRequireWildcard(require("react"));
var _styledComponents = _interopRequireWildcard(require("styled-components"));
var _transition = _interopRequireDefault(require("../../../utils/transition"));
var _TileHeader = require("../TileHeader");
var _defaultTheme = _interopRequireDefault(require("../../../defaultTheme"));
var _common = require("../../../utils/common");
var _mediaQuery = _interopRequireDefault(require("../../../utils/mediaQuery"));
const StyledTileWrapper = _styledComponents.default.div.withConfig({
  displayName: "TileWrapper__StyledTileWrapper",
  componentId: "sc-sysfih-0"
})(["", ""], ({
  theme
}) => (0, _styledComponents.css)(["display:block;width:100%;box-sizing:border-box;font-family:", ";color:", ";text-decoration:none;background:", ";border-radius:", ";box-shadow:", ";transition:", ";:hover{box-shadow:", ";", "{color:", ";}}", ""], theme.orbit.fontFamily, theme.orbit.paletteInkDark, theme.orbit.paletteWhite, theme.orbit.borderRadiusLarge, theme.orbit.boxShadowAction, (0, _transition.default)(["box-shadow"], "fast", "ease-in-out"), theme.orbit.boxShadowActionActive, _TileHeader.StyledIconRight, theme.orbit.paletteInkLightHover, _mediaQuery.default.desktop((0, _styledComponents.css)(["border-radius:", ";"], theme.orbit.borderRadiusNormal))));
exports.StyledTileWrapper = StyledTileWrapper;
StyledTileWrapper.defaultProps = {
  theme: _defaultTheme.default
};
const StyledTileAnchor = _styledComponents.default.a.withConfig({
  displayName: "TileWrapper__StyledTileAnchor",
  componentId: "sc-sysfih-1"
})(["", ""], ({
  theme
}) => (0, _styledComponents.css)(["display:block;height:100%;width:100%;outline:none;text-decoration:none;color:", ";&:focus{", ";", "{color:", ";}}&:link,&:visited{color:", ";font-weight:", ";}"], theme.orbit.paletteInkDark, _common.defaultFocus, _TileHeader.StyledIconRight, theme.orbit.paletteInkLightHover, theme.orbit.paletteInkDark, theme.orbit.fontWeightLinks));
StyledTileAnchor.defaultProps = {
  theme: _defaultTheme.default
};
const TileWrapper = ({
  href,
  external,
  dataTest,
  onClick,
  onKeyDown,
  children,
  as,
  tabIndex,
  role,
  ariaExpanded,
  ariaControls,
  id,
  htmlTitle
}) => /*#__PURE__*/React.createElement(StyledTileWrapper, {
  "data-test": dataTest,
  onClick: onClick,
  onKeyDown: onKeyDown,
  as: as,
  tabIndex: tabIndex,
  role: role,
  "aria-expanded": ariaExpanded,
  "aria-controls": ariaControls,
  id: id
}, href ? /*#__PURE__*/React.createElement(StyledTileAnchor, {
  target: href && external ? "_blank" : undefined,
  rel: href && external ? "noopener" : undefined,
  href: href || undefined,
  title: htmlTitle
}, children) : children);
var _default = TileWrapper;
exports.default = _default;