@truconsent/consent-banner-react
Version:
React consent-banner components (in-page & modal)
3 lines (2 loc) • 4.91 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react","react-dom"],t):t((e||self).consentBannerReact={},e.react,e.reactDom)}(this,function(e,t,a){function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=/*#__PURE__*/n(t),c=/*#__PURE__*/n(a);function r(e){var a,n,c=e.banner,r=e.purpose,s=t.useState(!1),o=s[0],d=s[1],u=t.useState(!1),i=u[0],f=u[1],p=t.useState(!1),E=p[0],h=p[1];/*#__PURE__*/return l.default.createElement("div",{className:"mcm-card"},/*#__PURE__*/l.default.createElement("div",{className:"mcm-card-header"},/*#__PURE__*/l.default.createElement("div",null,/*#__PURE__*/l.default.createElement("h2",null,r.name),/*#__PURE__*/l.default.createElement("p",{className:"mcm-purpose-desc"},r.description)),/*#__PURE__*/l.default.createElement("div",{className:"mcm-card-actions"},r.is_mandatory&&/*#__PURE__*/l.default.createElement("span",{className:"badge mandatory"},"Mandatory"),/*#__PURE__*/l.default.createElement("span",{className:"badge expiry"},"Expiry Type: ",{"7a203e84-016b-4f61-b776-2375dd1755e4":"One Year"}[n=r.expiry_period]||n),/*#__PURE__*/l.default.createElement("label",{className:"switch"},/*#__PURE__*/l.default.createElement("input",{type:"checkbox",defaultChecked:!0}),/*#__PURE__*/l.default.createElement("span",{className:"track"}),/*#__PURE__*/l.default.createElement("span",{className:"thumb"})),/*#__PURE__*/l.default.createElement("span",{className:"toggle-label"},"Accept"))),/*#__PURE__*/l.default.createElement("div",{className:"accordion"},/*#__PURE__*/l.default.createElement("button",{className:"accordion-btn",onClick:function(){return d(!o)}},"Data Elements",/*#__PURE__*/l.default.createElement(m,{open:o})),o&&/*#__PURE__*/l.default.createElement("div",{className:"panel"},c.data_elements.map(function(e){/*#__PURE__*/return l.default.createElement("span",{key:e.id,className:"pill"},e.name)})),/*#__PURE__*/l.default.createElement("button",{className:"accordion-btn",onClick:function(){return f(!i)}},"Legal Entities",/*#__PURE__*/l.default.createElement(m,{open:i})),i&&/*#__PURE__*/l.default.createElement("div",{className:"panel"},c.legal_entities.map(function(e){/*#__PURE__*/return l.default.createElement("span",{key:e.id,className:"pill"},e.name)})),/*#__PURE__*/l.default.createElement("button",{className:"accordion-btn",onClick:function(){return h(!E)}},"Tools",/*#__PURE__*/l.default.createElement(m,{open:E})),E&&/*#__PURE__*/l.default.createElement("div",{className:"panel"},null==(a=c.tools)?void 0:a.map(function(e,t){/*#__PURE__*/return l.default.createElement("span",{key:t,className:"pill"},e)}))))}function m(e){/*#__PURE__*/return l.default.createElement("svg",{className:"chevron "+(e.open?"open":""),width:"16",height:"16",viewBox:"0 0 24 24"},/*#__PURE__*/l.default.createElement("path",{d:"M6 9l6 6 6-6",fill:"none",stroke:"#333",strokeWidth:"2"}))}e.TruConsentModal=function(e){var a=e.bannerId,n=e.apiBaseUrl,m=void 0===n?"https://7nd6pu6evh.execute-api.ap-south-1.amazonaws.com/dev/banners":n,s=e.logoUrl,o=void 0===s?'data:image/svg+xml;utf8,\n<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 100 100">\n <rect width="100" height="100" fill="#8e44ad"/>\n <text x="50" y="55" font-size="50" text-anchor="middle" fill="#fff" font-family="Arial">M</text>\n</svg>':s,d=e.companyName,u=void 0===d?"Mars Financial Technologies Private Limited":d,i=t.useState(null),f=i[0],p=i[1];return t.useEffect(function(){a&&fetch(m+"/"+a).then(function(e){return e.json()}).then(function(e){return p(e)}).catch(console.error)},[a,m]),f?c.default.createPortal(/*#__PURE__*/l.default.createElement("div",{className:"mcm-overlay"},/*#__PURE__*/l.default.createElement("div",{className:"mcm-container"},/*#__PURE__*/l.default.createElement("header",{className:"mcm-header"},/*#__PURE__*/l.default.createElement("img",{src:o,alt:"Logo",className:"mcm-logo"}),/*#__PURE__*/l.default.createElement("div",{className:"mcm-header-text"},/*#__PURE__*/l.default.createElement("h1",null,"Consents by ",u),/*#__PURE__*/l.default.createElement("p",null,"You have all the rights to decline consents which you feel are not required by ",u,"."))),/*#__PURE__*/l.default.createElement("div",{className:"mcm-separator"}),/*#__PURE__*/l.default.createElement("div",{className:"mcm-body"},f.purposes.map(function(e){/*#__PURE__*/return l.default.createElement(r,{key:e.id,banner:f,purpose:e})})),/*#__PURE__*/l.default.createElement("div",{className:"mcm-separator"}),/*#__PURE__*/l.default.createElement("footer",{className:"mcm-footer"},/*#__PURE__*/l.default.createElement("button",{className:"mcm-btn reject"},"Reject All"),/*#__PURE__*/l.default.createElement("button",{className:"mcm-btn consent"},"I Consent")))),document.body):null}});
//# sourceMappingURL=TruConsentModal.umd.js.map