UNPKG

@shopgate/engage

Version:
4 lines 3.78 kB
function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import React,{Fragment}from'react';import{css}from'glamor';import classNames from'classnames';import PropTypes from'prop-types';import{Card,Link}from'@shopgate/engage/components';import{themeConfig}from'@shopgate/pwa-common/helpers/config';import CheckoutSectionInfo from"./CheckoutSectionInfo";import CheckoutSectionMessages from"./CheckoutSectionMessages";import{i18n}from"../../../core/helpers/i18n";var variables=themeConfig.variables;var styles={headline:css({fontSize:'1.25rem',fontWeight:'normal',margin:"0 0 ".concat(variables.gap.small,"px 0"),color:'var(--color-text-high-emphasis)',textTransform:'none'}),card:css({display:'flex',flexDirection:'row',fontSize:15,width:'100%',overflow:'inherit !important',marginBottom:variables.gap.big,boxShadow:'none',background:'var(--color-background-accent)',padding:"".concat(variables.gap.small,"px ").concat(variables.gap.big,"px"),margin:0}),cardWithForm:css({background:'inherit !important',boxShadow:'none !important',padding:'0px !important'}).toString(),table:css({' td':{padding:"".concat(variables.gap.xsmall,"px 0")},' td:last-child':{textAlign:'right',whiteSpace:'pre-wrap',paddingLeft:variables.gap.xsmall},' tr:nth-last-child(2) td':{paddingBottom:8},' tr:last-child td':{paddingTop:8,borderTop:'1px solid #979797',fontWeight:'600'}}),actionsContainer:css({flex:1,display:'table',width:'100%'}).toString(),link:css({fontSize:'0.875rem',color:'var(--color-primary)',textTransform:'uppercase'}).toString(),actions:css({paddingTop:8}).toString(),labelWithInfoIcon:css({paddingRight:variables.gap.small}).toString()};/** * CheckoutSection component * @returns {JSX} */var CheckoutSection=function CheckoutSection(_ref){var title=_ref.title,className=_ref.className,content=_ref.content,children=_ref.children,hasForm=_ref.hasForm,editLink=_ref.editLink,editLabel=_ref.editLabel,id=_ref.id;return React.createElement(Fragment,null,title&&React.createElement("h3",{className:styles.headline,id:id},i18n.text(title)),React.createElement(Card,{className:classNames(styles.card.toString(),_defineProperty({},styles.cardWithForm.toString(),hasForm)),id:!title?id:null},React.createElement("div",{className:"".concat(styles.actionsContainer," ").concat(className)},children||null,content&&React.createElement("table",{className:styles.table},React.createElement("tbody",null,content.map(function(_ref2){var label=_ref2.label,text=_ref2.text,info=_ref2.info,messages=_ref2.messages;var hasMessages=Array.isArray(messages)&&messages.length>0;var hasError=false;if(hasMessages){hasError=!!messages.find(function(_ref3){var type=_ref3.type;return type==='error';});}return React.createElement(Fragment,{key:label},React.createElement("tr",null,React.createElement("td",null,React.createElement(Fragment,null,React.createElement("span",{className:classNames(_defineProperty({},styles.labelWithInfoIcon,!!info))},label),!hasError&&React.createElement(CheckoutSectionInfo,{text:info}))),React.createElement("td",null,text)),hasMessages&&React.createElement("tr",null,React.createElement("td",{colSpan:"2",style:{textAlign:'left',paddingLeft:0}},React.createElement(CheckoutSectionMessages,{messages:messages}),hasError&&React.createElement(CheckoutSectionInfo,{text:info,renderIcon:false}))));})))),editLink?React.createElement("div",{className:styles.actions},React.createElement(Link,{tag:"a",className:styles.link,href:editLink},i18n.text(editLabel))):null));};CheckoutSection.defaultProps={title:null,className:'',children:null,content:null,hasForm:false,editLink:null,editLabel:'checkout.billing.edit',id:null};export default CheckoutSection;