@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.
52 lines (48 loc) • 5.63 kB
JavaScript
import * as React from "react";
import styled from "styled-components";
import defaultTokens from "../defaultTokens";
import STOPS from "./consts";
const StyledArrow = styled.svg.withConfig({
displayName: "StopoverArrow__StyledArrow",
componentId: "sc-19ccrmh-0"
})(["vertical-align:middle;fill:currentColor;color:", ";width:50px;height:7px;"], ({
theme
}) => theme.orbit.paletteInkLight);
StyledArrow.defaultProps = {
theme: defaultTokens
};
const Stops = ({
stops
}) => {
if (stops === STOPS.ONE) {
return React.createElement("path", {
d: "M50.0353 3.53564l-3.5357 3.53541-.707-.70704L48.121 4.0354H26.9498c-.2317 1.14087-1.2407 1.99976-2.4499 1.99976-1.2093 0-2.2183-.85889-2.45-1.99976H-.00012234l-8e-8-1H22.0499c.2317-1.14111 1.2405-2.00024 2.45-2.00024 1.2095 0 2.2182.85913 2.4499 2.00024H48.121L45.7926.707276 46.4999 3e-7 50.0353 3.53564zm-27.0354-.00048c0 .82837.6716 1.5 1.5 1.5.8283 0 1.5-.67163 1.5-1.5s-.6717-1.5-1.5-1.5c-.8284 0-1.5.67163-1.5 1.5z"
});
} else if (stops === STOPS.TWO) {
return React.createElement("path", {
d: "M50.0352 3.53564l-.7071.70704-2.8283 2.82836-.7073-.70703 2.3286-2.32861H30.95c-.2317 1.14087-1.2408 1.99976-2.45 1.99976-1.2092 0-2.2183-.85889-2.45-1.99976h-4.1c.0185-.09082.0319-.18359.0402-.27759-.1132 1.27564-1.185 2.27735-2.4902 2.27735-1.2092 0-2.2183-.85889-2.45-1.99976H0v-1h17.0498c.2314-1.14111 1.2407-2.00024 2.4502-2.00024 1.2095 0 2.2188.85913 2.4502 2.00024h4.0996c.2314-1.14111 1.2407-2.00024 2.4502-2.00024 1.2095 0 2.2188.85913 2.4502 2.00024h17.1704L45.7925.707275 46.4995 0l2.8286 2.82837.7071.70727zM18 3.53516c0 .82837.6716 1.5 1.5 1.5s1.5-.67163 1.5-1.5-.6716-1.5-1.5-1.5-1.5.67163-1.5 1.5zm10.5 1.5c.8284 0 1.5-.67163 1.5-1.5s-.6716-1.5-1.5-1.5-1.5.67163-1.5 1.5.6716 1.5 1.5 1.5z"
});
} else if (stops === STOPS.THREE) {
return React.createElement("path", {
d: "M46.4995 0l2.8286 2.82837.7071.70727-.7071.70704-2.8283 2.82836-.7073-.70703 2.3286-2.32861H35.95c-.2317 1.14087-1.2408 1.99976-2.45 1.99976-1.2092 0-2.2183-.85889-2.45-1.99976h-4.1c.0161-.07886.0285-.15918.0368-.24072-.0005.00464-.001.00879-.0014.01343-.0083.0769-.0203.15258-.0354.22729-.2317 1.14087-1.2408 1.99976-2.45 1.99976-1.2092 0-2.2183-.85889-2.45-1.99976h-4.1c-.2317 1.14087-1.2408 1.99976-2.45 1.99976-1.3765 0-2.4934-1.11304-2.5-2.48804.0005.08105.0046.16113.0125.24023.0085.08399.0209.16675.0375.24805H0v-1h13.0498c-.0176.08569-.0305.17358-.0386.26245.1197-1.26929 1.1883-2.26269 2.4888-2.26269 1.3806 0 2.5 1.11938 2.5 2.5 0-.09229-.0049-.18335-.0146-.27295-.0083-.07666-.0201-.15235-.0352-.22681h4.0996c.2314-1.14111 1.2407-2.00024 2.4502-2.00024 1.2095 0 2.2188.85913 2.4502 2.00024h4.0996c.2314-1.14111 1.2407-2.00024 2.4502-2.00024 1.2095 0 2.2188.85913 2.4502 2.00024h12.1704L45.7925.707275 46.4995 0zM15.5 5.03516c.8284 0 1.5-.67163 1.5-1.5s-.6716-1.5-1.5-1.5-1.5.67163-1.5 1.5.6716 1.5 1.5 1.5zm7.5-1.5c0 .82837.6716 1.5 1.5 1.5s1.5-.67163 1.5-1.5-.6716-1.5-1.5-1.5-1.5.67163-1.5 1.5zm10.5 1.5c.8284 0 1.5-.67163 1.5-1.5s-.6716-1.5-1.5-1.5-1.5.67163-1.5 1.5.6716 1.5 1.5 1.5z"
});
} else if (stops === STOPS.FOUR) {
return React.createElement("path", {
d: "M36 3.53516c0 .82842.6716 1.5 1.5 1.5s1.5-.67158 1.5-1.5c0-.82843-.6716-1.5-1.5-1.5s-1.5.67157-1.5 1.5zm-.9965494.13248906C35.0011597 3.62377597 35 3.57960342 35 3.53516c0-1.38072 1.1193-2.5 2.5-2.5 1.3294839 0 2.416601 1.03778231 2.4954234 2.3474725-.0030675-.05274555-.007836-.10502861-.0142234-.1568025-.0081-.06421-.0183-.12769-.031-.19043h8.1709L45.7927.707275 46.5 0l3.5354 3.53564-3.5356 3.5354-.7073-.70703 2.3286-2.32861H39.95a2.4679841 2.4679841 0 0 0 .0008383-.00415845C39.720673 5.1743025 38.7108592 6.03516 37.5 6.03516c-1.21083 0-2.2206243-.86081602-2.4507698-2.00385522L35.05 4.0354h-4.1c.0017-.00854.0034-.01733.0051-.02588C30.7329 5.1626 29.718 6.03516 28.5 6.03516c-1.3188 0-2.3994-1.02149-2.4934-2.31641.0078.10767.0225.21338.0434.31665h-4.1c.0112-.05493.0205-.1106.028-.16675.0054-.03955.0098-.07934.0132-.11963.0056-.06714.0088-.13525.0088-.20385-.0007.16821-.0178.33154-.05.49023-.2322 1.14038-1.241 1.99976-2.45 1.99976-1.2087 0-2.2175-.85938-2.45-1.99976l-.007-.03589c.0022.01196.0046.02393.007.03589h-4.1c-.2317 1.14087-1.2408 1.99976-2.45 1.99976-1.20923 0-2.21826-.85889-2.44995-1.99976H0v-1h8.0498l-.00219.01123C8.2749 1.89966 9.28638 1.03516 10.5 1.03516c1.2095 0 2.2188.85913 2.4502 2.00024h4.0996c.2314-1.14111 1.2407-2.00024 2.4502-2.00024 1.2095 0 2.2188.85913 2.4502 2.00024h4.0996c-.0034.01733-.0066.03467-.0098.052.211-1.16699 1.2322-2.05224 2.46-2.05224 1.3245 0 2.4087 1.031 2.4946 2.33374-.0014-.02369-.0034-.04737-.0056-.0708-.0085-.08912-.0215-.17676-.0388-.2627h4.0996c-.0327.16138-.0498.32861-.0498.49976 0 .04443.00115.0886175.0034375.13250125zm.0457796.36365572a2.4892309 2.4892309 0 0 1-.0118508-.06304804zm4.9015562-.00008263c.0168281-.08359295.0294864-.16869521.0377486-.25508048zM10.5 5.03516c.8284 0 1.5-.67163 1.5-1.5s-.6716-1.5-1.5-1.5c-.82837 0-1.5.67163-1.5 1.5s.67163 1.5 1.5 1.5zm7.5-1.5c0 .82837.6716 1.5 1.5 1.5s1.5-.67163 1.5-1.5-.6716-1.5-1.5-1.5-1.5.67163-1.5 1.5zm10.5 1.5c.8284 0 1.5-.67163 1.5-1.5s-.6716-1.5-1.5-1.5-1.5.67163-1.5 1.5.6716 1.5 1.5 1.5z"
});
}
return React.createElement("path", {
d: "M49.293 4.2L50 3.5l-.706-.7L46.467 0l-.707.7 2.327 2.305H0v.99h48.087L45.76 6.3l.707.7z"
});
};
const StopoverArrow = ({
stops = STOPS.ZERO,
dataTest
}) => React.createElement(StyledArrow, {
preserveAspectRatio: "xMidYMid meet",
viewBox: "0 0 50 7",
"data-test": dataTest
}, React.createElement(Stops, {
stops: stops
}));
export default StopoverArrow;