@shopgate/engage/checkout/components/Checkout/CheckoutHeader.js

Shopgate's ENGAGE library.

import React from'react';import{css}from'glamor';import PropTypes from'prop-types';import{ResponsiveContainer}from'@shopgate/engage/components';import{i18n}from"../../../core/helpers/i18n";import{ResponsiveBackButton}from"../ResponsiveBackButton";var styles={title:css({padding:16,display:'flex',flexDirection:'row',alignItems:'flex-end'}),headline:css({fontSize:'2.125rem',fontWeight:'normal',margin:0,lineHeight:'2.25rem'}),step:css({fontSize:'1rem',lineHeight:1,color:'var(--color-secondary)',paddingLeft:16,margin:0,fontWeight:'400',paddingBottom:2})};/**
 * CheckoutSection component
 * @returns {JSX}
 */var CheckoutTitle=function CheckoutTitle(_ref){var stepFrom=_ref.stepFrom,stepTo=_ref.stepTo,headline=_ref.headline;return React.createElement(ResponsiveContainer,{webOnly:true,breakpoint:">xs"},React.createElement(ResponsiveBackButton,null),React.createElement("div",{className:styles.title},React.createElement("h1",{className:styles.headline},i18n.text(headline)),stepFrom!==null?React.createElement("h2",{className:styles.step},i18n.text('checkout.steps',{from:stepFrom,to:stepTo})):null));};CheckoutTitle.defaultProps={stepFrom:null,stepTo:null,headline:'titles.checkout'};export default CheckoutTitle;