import e,{Suspense as n}from"react";import"../../../node_modules/prop-types/index.js";import t from"../../../node_modules/next/router.js";import a from"../../common/Loading/Loading.js";import{p as r}from"../../../_virtual/index.js_commonjs-module";var i=e.lazy((function(){return import("../../Typography/Paragraph/index.js")})),o=e.lazy((function(){return import("../../Typography/Heading.js")})),l=e.lazy((function(){return import("../../Media/Image.js")})),m=function(){return e.createElement(a,null)};function d(t){var a=t.title,r=t.subTitle,d=t.content,c=t.mediaUrl,s=t.headingLumo,p=t.textColor,g=t.isImageFullHeight,f=t.imageSideArrangement,x=t.onContentChange,h=t.onTitleChange,u=t.onImageChange,b="/static/icons/app-image-upload.svg";return e.createElement(e.Fragment,null,e.createElement("div",{className:"Voice__media variant-b"},e.createElement(n,{fallback:m()},e.createElement(o,{text:a,align:"left",fontSize:"26",lineHeight:"44",letterSpacing:"-1",fontFamily:"Roboto, Noto",lumo:null!=s&&""!==s?s:"secondary-base",onTextEditorChange:h})),e.createElement("div",{className:"media-wrapper "+("left"===f?"voice-media-reverse":"")},e.createElement("div",{className:"Imagery__Frame "+("true"===g?"full-cover":"")},e.createElement(n,{fallback:m()},e.createElement("div",{className:"d-none d-sm-block"},e.createElement(l,{src:c||b,onImageChange:u,alt:a,width:"true"===g?"800":"400",height:null,classes:""})),e.createElement("div",{className:"d-sm-none d-block"},e.createElement(l,{src:c||b,onImageChange:u,alt:a})))),e.createElement("div",null,e.createElement("span",{className:"content-vertical-line"}),e.createElement("div",{className:"content-details"},e.createElement("div",{className:"d-sm-none d-block"},e.createElement(n,{fallback:m()},e.createElement(i,{onTextEditorChange:x,content:d,color:p||"black",align:"left",fontSize:"1.125rem",lineHeight:"1.43",fontFamily:"Bressay",letterSpacing:"0",textTransform:"normal",lumo:"primary-dark"}))),e.createElement("div",{className:"d-none d-sm-block"},e.createElement(n,{fallback:m()},e.createElement(i,{onTextEditorChange:x,content:d,align:"left",fontSize:"15px",lineHeight:"1.43",fontFamily:"Roboto",letterSpacing:"0",color:p||"black",textTransform:"normal",lumo:"primary-dark"})),e.createElement("div",{className:"author"},r)))))),e.createElement("style",{jsx:!0},"\n        .Voice__media {\n          max-width: 1200px;\n          margin: auto;\n        }\n\n        .Voice__media p.Paragraph::before {\n          content: '';\n          width: 6px;\n          height: 43px;\n          background: #00a651;\n          position: absolute;\n          left: -26px;\n          margin: -4px 0 0 -3px;\n        }\n\n        .media {\n          align-items: center !important;\n        }\n\n        :global(.media-body) {\n          padding-top: 0 !important;\n        }\n\n        :global(.Paragraph) {\n          margin-bottom: 2rem;\n        }\n\n        .content-vertical-line {\n          border-left: 6px solid grey;\n          content: '';\n          height: 40px;\n          position: absolute;\n        }\n\n        .content-details {\n          padding-left: 2rem;\n        }\n\n        .image-framed {\n          width: inherit;\n        }\n        .Paragraph {\n          max-width: 29.5625em;\n        }\n        .Imagery__Frame {\n          padding-top: "+("true"===g?"0px":"24px")+";\n        }\n        .image-framed {\n          width: inherit;\n        }\n        .media-left {\n          width: 500px;\n        }\n\n        .media-wrapper {\n          display: flex;\n          align-items: flex-start;\n        }\n\n        :global(.Imagery__Frame.media-left) {\n          padding-right: 3.5rem;\n        }\n\n        @media (max-width: 991px) {\n          .media-wrapper {\n            align-items: left;\n            flex-direction: column;\n          }\n        }\n\n        @media (min-width: 992px) {\n          .media-wrapper {\n            align-items: center;\n            flex-direction: row;\n          }\n        }\n\n        @media (min-width: 768px) {\n          .voice-media-reverse {\n            flex-direction: row-reverse !important;\n          }\n\n          :global(.voice-media-reverse .media-body) {\n            padding-left: 21px !important;\n          }\n        }\n      "))}d.propTypes={title:r.exports.string,subTitle:r.exports.string,content:r.exports.string,mediaUrl:r.exports.string,onVoiceMediaChange:r.exports.func,isImageFullHeight:r.exports.string};var c=t.withRouter(d);export default c;
//# sourceMappingURL=VoiceMedia2.js.map
