UNPKG

@kiwicom/orbit-components

Version:

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

94 lines (86 loc) 3.55 kB
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty"; import * as React from "react"; import styled, { css } from "styled-components"; import { ICON_SIZES, ICON_COLORS } from "./consts"; import defaultTheme from "../defaultTheme"; export var getSize = function getSize(size) { return function (_ref) { var _tokens; var theme = _ref.theme; var tokens = (_tokens = {}, _defineProperty(_tokens, ICON_SIZES.SMALL, theme.orbit.widthIconSmall), _defineProperty(_tokens, ICON_SIZES.MEDIUM, theme.orbit.widthIconMedium), _defineProperty(_tokens, ICON_SIZES.LARGE, theme.orbit.widthIconLarge), _tokens); return tokens[size] || tokens[ICON_SIZES.MEDIUM]; }; }; var getColor = function getColor() { return function (_ref2) { var _tokens2; var theme = _ref2.theme, color = _ref2.color; var tokens = (_tokens2 = {}, _defineProperty(_tokens2, ICON_COLORS.PRIMARY, theme.orbit.colorIconPrimary), _defineProperty(_tokens2, ICON_COLORS.SECONDARY, theme.orbit.colorIconSecondary), _defineProperty(_tokens2, ICON_COLORS.TERTIARY, theme.orbit.colorIconTertiary), _defineProperty(_tokens2, ICON_COLORS.INFO, theme.orbit.colorIconInfo), _defineProperty(_tokens2, ICON_COLORS.SUCCESS, theme.orbit.colorIconSuccess), _defineProperty(_tokens2, ICON_COLORS.WARNING, theme.orbit.colorIconWarning), _defineProperty(_tokens2, ICON_COLORS.CRITICAL, theme.orbit.colorIconCritical), _tokens2); return tokens[color]; }; }; var reverse = function reverse(_ref3) { var reverseOnRtl = _ref3.reverseOnRtl, theme = _ref3.theme; return reverseOnRtl && theme.rtl && css(["transform:scale(-1,1);"]); }; var StyledIcon = styled(function (_ref4) { var className = _ref4.className, viewBox = _ref4.viewBox, dataTest = _ref4.dataTest, children = _ref4.children, ariaHidden = _ref4.ariaHidden, ariaLabel = _ref4.ariaLabel; return /*#__PURE__*/React.createElement("svg", { className: className, viewBox: viewBox, "data-test": dataTest, preserveAspectRatio: "xMidYMid meet", "aria-hidden": ariaHidden ? "true" : undefined, "aria-label": ariaLabel }, children); }).withConfig({ displayName: "Icon__StyledIcon", componentId: "sc-1pnzn3g-0" })(["display:inline-block;width:", ";height:", ";flex-shrink:0;vertical-align:middle;fill:currentColor;color:", ";", ";"], function (_ref5) { var size = _ref5.size; return getSize(size); }, function (_ref6) { var size = _ref6.size; return getSize(size); }, function (_ref7) { var color = _ref7.color, customColor = _ref7.customColor; return customColor || color && getColor(); }, reverse); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198 StyledIcon.defaultProps = { theme: defaultTheme }; var OrbitIcon = function OrbitIcon(props) { var size = props.size, color = props.color, customColor = props.customColor, className = props.className, children = props.children, viewBox = props.viewBox, dataTest = props.dataTest, ariaHidden = props.ariaHidden, reverseOnRtl = props.reverseOnRtl, ariaLabel = props.ariaLabel; return /*#__PURE__*/React.createElement(StyledIcon, { viewBox: viewBox, size: size, className: className, dataTest: dataTest, customColor: customColor, color: color, ariaHidden: ariaHidden, reverseOnRtl: reverseOnRtl, ariaLabel: ariaLabel }, children); }; OrbitIcon.defaultProps = { size: ICON_SIZES.MEDIUM }; export default OrbitIcon;