@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.
62 lines (59 loc) • 2.1 kB
JavaScript
import * as React from "react";
import styled from "styled-components";
import StyledRelative from "../primitives/StyledRelative";
import defaultTheme from "../../../defaultTheme";
import CustomBadge from "./CustomBadge";
import Badge from "../../../Badge";
import Text from "../../../Text";
import Stack from "../../../Stack";
import StyledIconWrapper from "../primitives/StyledIconWrapper";
import StyledProgressLine from "../primitives/StyledProgressLine";
import StyledText from "../primitives/StyledText";
const StyledIndent = styled.div.withConfig({
displayName: "TimelineStepMobile__StyledIndent",
componentId: "sc-xl9v41-0"
})(["padding-left:", ";"], ({
theme
}) => theme.orbit.spaceXSmall); // $FlowFixMe: https://github.com/flow-typed/flow-typed/issues/3653#issuecomment-568539198
StyledIndent.defaultProps = {
theme: defaultTheme
};
const TimelineStepMobile = ({
type,
subLabel,
label,
nextType,
typeIcon,
children,
last
}) => {
return /*#__PURE__*/React.createElement(StyledRelative, null, /*#__PURE__*/React.createElement(Stack, {
flex: true,
spaceAfter: "large",
align: "stretch",
desktop: {
align: "start"
}
}, /*#__PURE__*/React.createElement(StyledIconWrapper, {
mobile: true
}, typeIcon), !last && /*#__PURE__*/React.createElement(StyledProgressLine, {
status: nextType,
"data-test": "progressLine"
}), /*#__PURE__*/React.createElement(Stack, {
flex: true,
shrink: true,
direction: "column",
spacing: "XSmall"
}, /*#__PURE__*/React.createElement(Stack, {
flex: true,
spacing: "XSmall",
align: "center"
}, !type ? /*#__PURE__*/React.createElement(CustomBadge, null, label) : /*#__PURE__*/React.createElement(Badge, {
type: type
}, label), subLabel && /*#__PURE__*/React.createElement(StyledText, null, /*#__PURE__*/React.createElement(Text, {
size: "small"
}, subLabel))), /*#__PURE__*/React.createElement(StyledIndent, null, /*#__PURE__*/React.createElement(Text, {
type: type ? "primary" : "secondary"
}, children)))));
};
export default TimelineStepMobile;