npm - @sezzle/sezzle-react-widget - Versions diffs - 2.0.0 → 2.0.3 - Mend

@sezzle/sezzle-react-widget 2.0.0 → 2.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/dist/index.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.es.js","sources":["../src/Helpers/helper.js","../src/Helpers/renderFunctions.js","../src/assets/Modals/modals-4.0.1/modal-en.js","../src/assets/Modals/modals-4.0.1/modal-fr.js","../src/assets/Modals/apModal.js","../src/Components/Modal.js","../node_modules/style-inject/dist/style-inject.es.js","../src/Components/SezzleWidget.js","../src/index.js"],"sourcesContent":["/*\n This function will return the price string\n * @param price - string value\n * @return string\n /\nexport function parsePriceString (price) {\n let formattedPrice = ''\n if (!price) return formattedPrice\n for (var i = 0; i < price.length; i++) {\n if (isNumeric(price[i]) \|\| price[i] === '.' \|\| (price[i] === ',')) {\n // Ignore actual sentence punctuation\n if (i > 0 && price[i] === '.' && isAlphabet(price[i - 1])) continue\n\n formattedPrice += price[i]\n }\n }\n return formattedPrice\n}\n\n/\n Function parses the price from string to float\n * @param price -> String\n * @return float\n /\nexport function parsePrice (price) {\n return parseFloat(parsePriceString(price))\n}\n\n/\n This is helper function for formatPrice\n * @param n char value\n * @return boolean [if it's numeric or not]\n /\nexport function isNumeric (n) {\n return !isNaN(parseFloat(n)) && isFinite(n)\n}\n\n/\n This is helper function for formatPrice\n * @param n char value\n * @return boolean [if it's alphabet or not]\n /\nexport function isAlphabet (n) {\n return /^[a-zA-Z()]+$/.test(n)\n}\n","import { parsePriceString, parsePrice } from './helper'\n\nexport function getFormattedPrice(price, numberOfPayments) {\n let priceString = parsePriceString(price)\n let priceReplacer = parsePrice(price)\n\n let formatter = price.replace(priceString, '{price}')\n\n let sezzleInstallmentPrice = (priceReplacer / numberOfPayments).toFixed(2)\n\n var sezzleInstallmentFormattedPrice = formatter.replace('{price}', sezzleInstallmentPrice)\n\n return sezzleInstallmentFormattedPrice\n};\n","let modalEnglishHTML = `\n<style>@import url(\"https://fonts.googleapis.com/css?family=Comfortaa\");\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@600&display=swap\");\n.sezzle-modal-open {\n position: fixed;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n}\n\n.sezzle-checkout-modal-hidden {\n width: 100%;\n height: 100%;\n -webkit-font-smoothing: antialiased;\n transition: all 0.4s ease;\n margin-top: 0;\n}\n@media screen and (min-width: 0px) and (max-width: 280px) {\n .sezzle-checkout-modal-hidden {\n display: none;\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal {\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n position: absolute;\n box-shadow: 0 10px 20px rgba(5, 31, 52, 0.19), 0 6px 6px rgba(5, 31, 52, 0.2);\n height: auto;\n max-height: 90%;\n width: 343px;\n color: #000000;\n font-family: Comfortaa, \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n background-color: #fff;\n overflow: auto;\n padding: 20px 0;\n border-radius: 10px;\n box-sizing: border-box;\n}\n@media screen and (max-width: 374px) {\n .sezzle-checkout-modal-hidden .sezzle-modal {\n transform: scale(0.9) translate(-55%, -55%);\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal {\n position: absolute;\n right: 16px;\n top: 16px;\n width: 24px;\n height: 24px;\n opacity: 0.2;\n cursor: pointer;\n padding: 0;\n outline: 0;\n background: 0 0;\n border: none;\n box-shadow: none;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal:hover {\n opacity: 1;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal:focus {\n opacity: 0.5;\n}\n@media screen and (max-width: 600px) {\n .sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal {\n opacity: 0.8;\n }\n .sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal:focus {\n opacity: 1;\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal::before {\n position: absolute;\n left: 10px;\n content: \" \";\n top: 0;\n transform: rotate(45deg);\n background-color: #595959;\n width: 2px;\n height: 15px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal::after {\n position: absolute;\n left: 10px;\n content: \" \";\n top: 0;\n transform: rotate(-45deg);\n background-color: #595959;\n width: 2px;\n height: 15px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-logo {\n display: block;\n height: 24px;\n width: 98px;\n margin: 10px auto 0;\n background-image: url(https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg);\n background-repeat: no-repeat;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content {\n height: auto;\n text-align: center;\n padding: 0px 8px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-header {\n display: block;\n text-align: center;\n font-style: normal;\n font-size: 24px;\n font-weight: 700;\n line-height: 30px;\n font-family: \"Comfortaa\";\n color: #000000;\n margin-top: 24px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-row {\n text-align: center;\n font-style: normal;\n font-size: 15px;\n font-weight: 400;\n line-height: 20px;\n color: #000000;\n letter-spacing: -0.3px;\n margin: 16px auto;\n font-family: \"Nunito Sans\";\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay {\n display: flex;\n flex-direction: column;\n align-items: center;\n background: rgba(131, 51, 212, 0.05);\n border-radius: 16px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-row {\n text-align: center;\n font-style: normal;\n font-size: 14px;\n font-weight: 700;\n line-height: 16px;\n font-family: \"Comfortaa\";\n color: #000000;\n margin: 16px 0px 0px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n padding: 16px 8px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .due-today {\n display: flex;\n flex-direction: column;\n align-items: center;\n background: #FFFFFF;\n border: 1px solid #8333D4;\n border-radius: 8px;\n margin: 0px 4px;\n padding: 8px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .future-payments {\n display: flex;\n flex-direction: row;\n align-items: center;\n background: #FFFFFF;\n border: 1px solid #8333D4;\n border-radius: 8px;\n margin: 0px 4px;\n padding: 8px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item :first-child {\n padding: 0px 6px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item .breakdown-row {\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 0px;\n padding: 8px 0px 0px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item .breakdown-row .percentage {\n text-align: center;\n font-style: normal;\n font-size: 15px;\n font-weight: 600;\n line-height: 20px;\n color: #8333D4;\n font-family: \"Nunito Sans\";\n align-items: center;\n letter-spacing: -0.3px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item .breakdown-row .due {\n text-align: center;\n font-style: normal;\n font-size: 12px;\n font-weight: 400;\n line-height: 16px;\n color: #5E5E5E;\n font-family: \"Nunito Sans\";\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-features {\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 8px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-features .single-feature {\n text-align: center;\n font-style: normal;\n font-size: 17px;\n font-weight: 600;\n line-height: 22px;\n color: #000000;\n letter-spacing: -0.3px;\n margin: 8px auto;\n font-family: \"Nunito Sans\";\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo {\n font-size: 14px;\n color: #000000;\n}\n@media screen and (max-width: 600px) {\n .sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo {\n font-size: 12px;\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo::first-letter {\n text-transform: capitalize;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo a {\n color: #000000;\n text-decoration: underline;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo a:visited {\n color: #037269;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo a:hover {\n color: #af0fda;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .terms {\n text-align: center;\n font-style: normal;\n font-size: 11px;\n font-weight: 400;\n line-height: 13px;\n color: #5E5E5E;\n font-family: \"Nunito Sans\";\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal {\n background-image: none;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-logo {\n width: 98px;\n background-image: url(https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg);\n background-repeat: no-repeat;\n background-position: 50%;\n height: 24px;\n margin: 10px auto 20px auto;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content {\n height: auto;\n width: auto;\n text-align: center;\n padding: 0px 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-header {\n font-size: 24px;\n line-height: 30px;\n margin: 10px auto;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-row {\n font-size: 15px;\n line-height: 20px;\n margin: 8px auto;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments {\n height: fit-content;\n margin: 20px auto;\n padding: 20px 0 0;\n border: 1px solid #e5e5e5;\n border-radius: 5px;\n max-width: 502px;\n display: block;\n flex-direction: column;\n align-items: center;\n padding: 0px;\n gap: 24px;\n font-family: \"Nunito sans\";\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-header {\n font-family: \"Nunito Sans\";\n font-style: normal;\n font-weight: 600;\n font-size: 15px;\n line-height: 20px;\n display: block;\n align-items: center;\n text-align: center;\n padding: 15px;\n letter-spacing: -0.3px;\n border-bottom: 1px solid #e5e5e5;\n color: #000000;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-header span {\n font-size: 17px;\n line-height: 22px;\n font-weight: 700;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options {\n font-size: 12px;\n line-height: 14px;\n margin: 0px 20px 0;\n padding: 20px 0px;\n border-bottom: 1px solid #e5e5e5;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan {\n display: flex;\n justify-content: space-between;\n padding-bottom: 10px;\n font-size: 12px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan .monthly-amount span {\n font-size: 17px;\n line-height: 22px;\n color: #8333D4;\n font-weight: 600;\n letter-spacing: -0.3px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan .monthly-amount .per-month {\n font-size: 13px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan .term-length {\n border-radius: 100px;\n background: rgba(41, 211, 162, 0.1);\n color: #00804A;\n padding: 2px 8px;\n font-size: 12px;\n font-weight: 600;\n display: flex;\n align-items: center;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details {\n display: flex;\n justify-content: space-between;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .adjusted-total {\n color: #5E5E5E;\n font-size: 12px;\n width: fit-content;\n text-align: left;\n font-weight: 400;\n line-height: 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .adjusted-total span {\n display: block;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .interest-amount {\n color: #5E5E5E;\n font-size: 12px;\n width: fit-content;\n text-align: left;\n font-weight: 400;\n line-height: 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .interest-amount span {\n display: block;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .sample-apr {\n color: #5E5E5E;\n font-size: 12px;\n width: fit-content;\n text-align: left;\n font-weight: 400;\n line-height: 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .sample-apr span {\n display: block;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments:last-child {\n border: none;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .details {\n font-size: 17px;\n line-height: 22px;\n margin: 16px auto;\n font-weight: 600;\n font-family: \"Nunito Sans\";\n letter-spacing: -0.3px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .terms {\n font-size: 11px;\n line-height: 13px;\n color: #5E5E5E;\n margin: 10px auto 0;\n padding: 24px 0 0;\n border-top: 1px solid #e5e5e5;\n text-align: center;\n font-family: \"Nunito Sans\";\n}</style>\n<section class=\"sezzle-checkout-modal-lightbox close-sezzle-modal\" role=\"dialog\" aria-label=\"Sezzle Information\" lang=\"en\" style=\"display: none; max-height: 100%;\"><div id=\"sezzle-modal-container\" role=\"dialog\" aria-label=\"Sezzle Modal\" aria-description=\"Learn more about Sezzle\" class=\"sezzle-checkout-modal-hidden\"><div class=\"sezzle-modal sezzle-checkout-modal-hidden\"><div><button role=\"button\" aria-label=\"Close Sezzle Modal\" class=\"close-sezzle-modal\"></button></div><div class=\"sezzle-logo\" title=\"Sezzle\"></div><div id=\"sezzle-modal-core-content\" class=\"sezzle-modal-content\">\n <header class=\"sezzle-header\">Buy Now. Pay Later.</header>\n <p class=\"sezzle-row\">Select Sezzle as your payment method at checkout.</p>\n\n <div class=\"sezzle-four-pay\">\n <p class=\"sezzle-row\">Split your order into 4 or more!</p>\n <div class=\"sezzle-pie-area\">\n <div class=\"due-today\">\n <div class=\"payment-item\">\n <div title=\"pie at 25%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\" fill=\"#8333D4\" fill-opacity=\"0.05\"></path>\n <path d=\"M20 -7.62939e-05C22.6264 -7.64088e-05 25.2272 0.51724 27.6537 1.52233C30.0802 2.52743 32.285 4.00062 34.1421 5.85779C35.9993 7.71496 37.4725 9.91974 38.4776 12.3463C39.4827 14.7728 40 17.3735 40 19.9999L30 19.9999C30 18.6867 29.7413 17.3863 29.2388 16.1731C28.7362 14.9598 27.9997 13.8574 27.0711 12.9289C26.1425 12.0003 25.0401 11.2637 23.8268 10.7611C22.6136 10.2586 21.3132 9.99992 20 9.99992L20 -7.62939e-05Z\" fill=\"#8333D4\"></path>\n <path d=\"M40 19.9999C40 22.7613 37.7614 24.9998 35 24.9998C32.2386 24.9998 30 22.7613 30 19.9999C30 17.2385 32.2386 14.9998 35 14.9998C37.7614 14.9998 40 17.2385 40 19.9999Z\" fill=\"#8333D4\"></path>\n <circle cx=\"35\" cy=\"20\" r=\"5\" fill=\"#8333D4\"></circle>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Today</span>\n </p>\n </div>\n </div>\n <div class=\"future-payments\">\n <div class=\"payment-item\">\n <div title=\"pie at 50%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\" fill=\"#8333D4\" fill-opacity=\"0.05\"></path>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M40 20C40 31.0457 31.0457 40 20 40C17.2386 40 15 37.7614 15 35C15 32.2386 17.2386 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10V0C31.0457 0 40 8.9543 40 20Z\" fill=\"#8333D4\"></path>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Week 2</span>\n </p>\n </div>\n <div class=\"payment-item\">\n <div title=\"pie at 75%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\" fill=\"#8333D4\" fill-opacity=\"0.05\"></path>\n <path d=\"M20 -8.74228e-07C23.9556 -1.04713e-06 27.8224 1.17298 31.1114 3.37061C34.4004 5.56824 36.9638 8.69181 38.4776 12.3463C39.9913 16.0009 40.3874 20.0222 39.6157 23.9018C38.844 27.7814 36.9392 31.3451 34.1421 34.1421C31.3451 36.9392 27.7814 38.844 23.9018 39.6157C20.0222 40.3874 16.0009 39.9913 12.3463 38.4776C8.69181 36.9638 5.56824 34.4004 3.37061 31.1114C1.17298 27.8224 -7.48492e-07 23.9556 -8.74228e-07 20L10 20C10 21.9778 10.5865 23.9112 11.6853 25.5557C12.7841 27.2002 14.3459 28.4819 16.1732 29.2388C18.0004 29.9957 20.0111 30.1937 21.9509 29.8079C23.8907 29.422 25.6725 28.4696 27.0711 27.0711C28.4696 25.6725 29.422 23.8907 29.8079 21.9509C30.1937 20.0111 29.9957 18.0004 29.2388 16.1732C28.4819 14.3459 27.2002 12.7841 25.5557 11.6853C23.9112 10.5865 21.9778 10 20 10L20 -8.74228e-07Z\" fill=\"#8333D4\"></path>\n <path d=\"M10 20C10 22.7614 7.76142 25 5 25C2.23858 25 -8.74228e-07 22.7614 -8.74228e-07 20C-8.74228e-07 17.2386 2.23858 15 5 15C7.76142 15 10 17.2386 10 20Z\" fill=\"#8333D4\"></path>\n <circle cx=\"5\" cy=\"20\" r=\"5\" fill=\"#8333D4\"></circle>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Week 4</span>\n </p>\n </div>\n <div class=\"payment-item\">\n <div title=\"pie at 100%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\" fill=\"#8333D4\"></path>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Week 6</span>\n </p>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"sezzle-features\">\n <p class=\"single-feature\">Build your credit with Sezzle</p>\n <p class=\"single-feature\">Flexible payment options</p>\n <p class=\"single-feature\">Trusted by over 10 million consumers</p>\n </div>\n\n <p class=\"terms\">* Sezzle Up is a free credit reporting program shoppers can opt into to have payments reported to credit bureaus.</p>\n <p class=\"terms\">Subject to approval. First payment date and amount may fluctuate based on eligibility and time of merchant order completion.</p>\n </div></div></div>\n </section>\n\n`\n\nexport default modalEnglishHTML\n","let modalFrenchHTML = `\n<style>@import url(\"https://fonts.googleapis.com/css?family=Comfortaa\");\n@import url(\"https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@600&display=swap\");\n.sezzle-modal-open {\n position: fixed;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n}\n\n.sezzle-checkout-modal-hidden {\n width: 100%;\n height: 100%;\n -webkit-font-smoothing: antialiased;\n transition: all 0.4s ease;\n margin-top: 0;\n}\n@media screen and (min-width: 0px) and (max-width: 280px) {\n .sezzle-checkout-modal-hidden {\n display: none;\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal {\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n position: absolute;\n box-shadow: 0 10px 20px rgba(5, 31, 52, 0.19), 0 6px 6px rgba(5, 31, 52, 0.2);\n height: auto;\n max-height: 90%;\n width: 343px;\n color: #000000;\n font-family: Comfortaa, \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n background-color: #fff;\n overflow: auto;\n padding: 20px 0;\n border-radius: 10px;\n box-sizing: border-box;\n}\n@media screen and (max-width: 374px) {\n .sezzle-checkout-modal-hidden .sezzle-modal {\n transform: scale(0.9) translate(-55%, -55%);\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal {\n position: absolute;\n right: 16px;\n top: 16px;\n width: 24px;\n height: 24px;\n opacity: 0.2;\n cursor: pointer;\n padding: 0;\n outline: 0;\n background: 0 0;\n border: none;\n box-shadow: none;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal:hover {\n opacity: 1;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal:focus {\n opacity: 0.5;\n}\n@media screen and (max-width: 600px) {\n .sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal {\n opacity: 0.8;\n }\n .sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal:focus {\n opacity: 1;\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal::before {\n position: absolute;\n left: 10px;\n content: \" \";\n top: 0;\n transform: rotate(45deg);\n background-color: #595959;\n width: 2px;\n height: 15px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal::after {\n position: absolute;\n left: 10px;\n content: \" \";\n top: 0;\n transform: rotate(-45deg);\n background-color: #595959;\n width: 2px;\n height: 15px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-logo {\n display: block;\n height: 24px;\n width: 98px;\n margin: 10px auto 0;\n background-image: url(https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg);\n background-repeat: no-repeat;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content {\n height: auto;\n text-align: center;\n padding: 0px 8px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-header {\n display: block;\n text-align: center;\n font-style: normal;\n font-size: 24px;\n font-weight: 700;\n line-height: 30px;\n font-family: \"Comfortaa\";\n color: #000000;\n margin-top: 24px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-row {\n text-align: center;\n font-style: normal;\n font-size: 15px;\n font-weight: 400;\n line-height: 20px;\n color: #000000;\n letter-spacing: -0.3px;\n margin: 16px auto;\n font-family: \"Nunito Sans\";\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay {\n display: flex;\n flex-direction: column;\n align-items: center;\n background: rgba(131, 51, 212, 0.05);\n border-radius: 16px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-row {\n text-align: center;\n font-style: normal;\n font-size: 14px;\n font-weight: 700;\n line-height: 16px;\n font-family: \"Comfortaa\";\n color: #000000;\n margin: 16px 0px 0px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n padding: 16px 8px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .due-today {\n display: flex;\n flex-direction: column;\n align-items: center;\n background: #FFFFFF;\n border: 1px solid #8333D4;\n border-radius: 8px;\n margin: 0px 4px;\n padding: 8px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .future-payments {\n display: flex;\n flex-direction: row;\n align-items: center;\n background: #FFFFFF;\n border: 1px solid #8333D4;\n border-radius: 8px;\n margin: 0px 4px;\n padding: 8px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item :first-child {\n padding: 0px 6px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item .breakdown-row {\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 0px;\n padding: 8px 0px 0px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item .breakdown-row .percentage {\n text-align: center;\n font-style: normal;\n font-size: 15px;\n font-weight: 600;\n line-height: 20px;\n color: #8333D4;\n font-family: \"Nunito Sans\";\n align-items: center;\n letter-spacing: -0.3px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item .breakdown-row .due {\n text-align: center;\n font-style: normal;\n font-size: 12px;\n font-weight: 400;\n line-height: 16px;\n color: #5E5E5E;\n font-family: \"Nunito Sans\";\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-features {\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 8px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-features .single-feature {\n text-align: center;\n font-style: normal;\n font-size: 17px;\n font-weight: 600;\n line-height: 22px;\n color: #000000;\n letter-spacing: -0.3px;\n margin: 8px auto;\n font-family: \"Nunito Sans\";\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo {\n font-size: 14px;\n color: #000000;\n}\n@media screen and (max-width: 600px) {\n .sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo {\n font-size: 12px;\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo::first-letter {\n text-transform: capitalize;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo a {\n color: #000000;\n text-decoration: underline;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo a:visited {\n color: #037269;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo a:hover {\n color: #af0fda;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .terms {\n text-align: center;\n font-style: normal;\n font-size: 11px;\n font-weight: 400;\n line-height: 13px;\n color: #5E5E5E;\n font-family: \"Nunito Sans\";\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal {\n background-image: none;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-logo {\n width: 98px;\n background-image: url(https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg);\n background-repeat: no-repeat;\n background-position: 50%;\n height: 24px;\n margin: 10px auto 20px auto;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content {\n height: auto;\n width: auto;\n text-align: center;\n padding: 0px 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-header {\n font-size: 24px;\n line-height: 30px;\n margin: 10px auto;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-row {\n font-size: 15px;\n line-height: 20px;\n margin: 8px auto;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments {\n height: fit-content;\n margin: 20px auto;\n padding: 20px 0 0;\n border: 1px solid #e5e5e5;\n border-radius: 5px;\n max-width: 502px;\n display: block;\n flex-direction: column;\n align-items: center;\n padding: 0px;\n gap: 24px;\n font-family: \"Nunito sans\";\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-header {\n font-family: \"Nunito Sans\";\n font-style: normal;\n font-weight: 600;\n font-size: 15px;\n line-height: 20px;\n display: block;\n align-items: center;\n text-align: center;\n padding: 15px;\n letter-spacing: -0.3px;\n border-bottom: 1px solid #e5e5e5;\n color: #000000;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-header span {\n font-size: 17px;\n line-height: 22px;\n font-weight: 700;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options {\n font-size: 12px;\n line-height: 14px;\n margin: 0px 20px 0;\n padding: 20px 0px;\n border-bottom: 1px solid #e5e5e5;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan {\n display: flex;\n justify-content: space-between;\n padding-bottom: 10px;\n font-size: 12px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan .monthly-amount span {\n font-size: 17px;\n line-height: 22px;\n color: #8333D4;\n font-weight: 600;\n letter-spacing: -0.3px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan .monthly-amount .per-month {\n font-size: 13px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan .term-length {\n border-radius: 100px;\n background: rgba(41, 211, 162, 0.1);\n color: #00804A;\n padding: 2px 8px;\n font-size: 12px;\n font-weight: 600;\n display: flex;\n align-items: center;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details {\n display: flex;\n justify-content: space-between;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .adjusted-total {\n color: #5E5E5E;\n font-size: 12px;\n width: fit-content;\n text-align: left;\n font-weight: 400;\n line-height: 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .adjusted-total span {\n display: block;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .interest-amount {\n color: #5E5E5E;\n font-size: 12px;\n width: fit-content;\n text-align: left;\n font-weight: 400;\n line-height: 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .interest-amount span {\n display: block;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .sample-apr {\n color: #5E5E5E;\n font-size: 12px;\n width: fit-content;\n text-align: left;\n font-weight: 400;\n line-height: 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .sample-apr span {\n display: block;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments:last-child {\n border: none;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .details {\n font-size: 17px;\n line-height: 22px;\n margin: 16px auto;\n font-weight: 600;\n font-family: \"Nunito Sans\";\n letter-spacing: -0.3px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .terms {\n font-size: 11px;\n line-height: 13px;\n color: #5E5E5E;\n margin: 10px auto 0;\n padding: 24px 0 0;\n border-top: 1px solid #e5e5e5;\n text-align: center;\n font-family: \"Nunito Sans\";\n}</style>\n<section class=\"sezzle-checkout-modal-lightbox close-sezzle-modal\" role=\"dialog\" aria-label=\"Sezzle Information\" lang=\"en\" style=\"display: none; max-height: 100%;\"><div id=\"sezzle-modal-container\" role=\"dialog\" aria-label=\"Sezzle Modal\" aria-description=\"Learn more about Sezzle\" class=\"sezzle-checkout-modal-hidden\"><div class=\"sezzle-modal sezzle-checkout-modal-hidden\"><div><button role=\"button\" aria-label=\"Close Sezzle Modal\" class=\"close-sezzle-modal\"></button></div><div class=\"sezzle-logo\" title=\"Sezzle\"></div><div id=\"sezzle-modal-core-content\" class=\"sezzle-modal-content\">\n <header class=\"sezzle-header\">Acheter maintenant. Payer plus tard.</header>\n <p class=\"sezzle-row\">Sélectionnez Sezzle comme mode de paiement lors du paiement.</p>\n\n <div class=\"sezzle-four-pay\">\n <p class=\"sezzle-row\">Divisez votre commande en 4 ou plus !</p>\n <div class=\"sezzle-pie-area\">\n <div class=\"due-today\">\n <div class=\"payment-item\">\n <div title=\"graphique circulaire à 25%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\" fill=\"#8333D4\" fill-opacity=\"0.05\"></path>\n <path d=\"M20 -7.62939e-05C22.6264 -7.64088e-05 25.2272 0.51724 27.6537 1.52233C30.0802 2.52743 32.285 4.00062 34.1421 5.85779C35.9993 7.71496 37.4725 9.91974 38.4776 12.3463C39.4827 14.7728 40 17.3735 40 19.9999L30 19.9999C30 18.6867 29.7413 17.3863 29.2388 16.1731C28.7362 14.9598 27.9997 13.8574 27.0711 12.9289C26.1425 12.0003 25.0401 11.2637 23.8268 10.7611C22.6136 10.2586 21.3132 9.99992 20 9.99992L20 -7.62939e-05Z\" fill=\"#8333D4\"></path>\n <path d=\"M40 19.9999C40 22.7613 37.7614 24.9998 35 24.9998C32.2386 24.9998 30 22.7613 30 19.9999C30 17.2385 32.2386 14.9998 35 14.9998C37.7614 14.9998 40 17.2385 40 19.9999Z\" fill=\"#8333D4\"></path>\n <circle cx=\"35\" cy=\"20\" r=\"5\" fill=\"#8333D4\"></circle>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Aujourd'hui</span>\n </p>\n </div>\n </div>\n <div class=\"future-payments\">\n <div class=\"payment-item\">\n <div title=\"graphique circulaire à 50%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\" fill=\"#8333D4\" fill-opacity=\"0.05\"></path>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M40 20C40 31.0457 31.0457 40 20 40C17.2386 40 15 37.7614 15 35C15 32.2386 17.2386 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10V0C31.0457 0 40 8.9543 40 20Z\" fill=\"#8333D4\"></path>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Semaine 2</span>\n </p>\n </div>\n <div class=\"payment-item\">\n <div title=\"graphique circulaire à 75%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\" fill=\"#8333D4\" fill-opacity=\"0.05\"></path>\n <path d=\"M20 -8.74228e-07C23.9556 -1.04713e-06 27.8224 1.17298 31.1114 3.37061C34.4004 5.56824 36.9638 8.69181 38.4776 12.3463C39.9913 16.0009 40.3874 20.0222 39.6157 23.9018C38.844 27.7814 36.9392 31.3451 34.1421 34.1421C31.3451 36.9392 27.7814 38.844 23.9018 39.6157C20.0222 40.3874 16.0009 39.9913 12.3463 38.4776C8.69181 36.9638 5.56824 34.4004 3.37061 31.1114C1.17298 27.8224 -7.48492e-07 23.9556 -8.74228e-07 20L10 20C10 21.9778 10.5865 23.9112 11.6853 25.5557C12.7841 27.2002 14.3459 28.4819 16.1732 29.2388C18.0004 29.9957 20.0111 30.1937 21.9509 29.8079C23.8907 29.422 25.6725 28.4696 27.0711 27.0711C28.4696 25.6725 29.422 23.8907 29.8079 21.9509C30.1937 20.0111 29.9957 18.0004 29.2388 16.1732C28.4819 14.3459 27.2002 12.7841 25.5557 11.6853C23.9112 10.5865 21.9778 10 20 10L20 -8.74228e-07Z\" fill=\"#8333D4\"></path>\n <path d=\"M10 20C10 22.7614 7.76142 25 5 25C2.23858 25 -8.74228e-07 22.7614 -8.74228e-07 20C-8.74228e-07 17.2386 2.23858 15 5 15C7.76142 15 10 17.2386 10 20Z\" fill=\"#8333D4\"></path>\n <circle cx=\"5\" cy=\"20\" r=\"5\" fill=\"#8333D4\"></circle>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Semaine 4</span>\n </p>\n </div>\n <div class=\"payment-item\">\n <div title=\"graphique circulaire à 100%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\" fill=\"#8333D4\"></path>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Semaine 6</span>\n </p>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"sezzle-features\">\n <p class=\"single-feature\">Construisez votre crédit avec Sezzle</p>\n <p class=\"single-feature\">Options de paiement flexibles</p>\n <p class=\"single-feature\">Reconnu par plus de 10 millions de consommateurs</p>\n </div>\n\n <p class=\"terms\"> Sezzle Up est un programme gratuit d'évaluation du crédit auquel les acheteurs peuvent opter pour que les paiements soient signalés aux bureaux de crédit.</p>\n <p class=\"terms\">Soumis à l'approbation. La date et le montant du premier paiement peuvent varier en fonction de l'éligibilité et de l'heure à laquelle la commande du marchand est terminée.</p>\n </div></div></div></section>\n`\n\nexport default modalFrenchHTML\n","let apModalHTML = '<div id=\"afterpay-popup-wrapper\" style=\"position: fixed; z-index: 2147483647; left: 0px; top: 0px; right: 0px; bottom: 0px; overflow: auto;\"><div id=\"afterpay-popup-outer\" style=\"display: flex; place-content: center; align-items: center; width: 100%; min-height: 100%; background-color: rgba(0, 0, 0, 0.8);\"><div id=\"afterpay-popup-inner\" style=\"position: relative; background-color: rgb(255, 255, 255);\"><a href=\"https://www.afterpay.com/purchase-payment-agreement\" target=\"_blank\" style=\"display: block;\"><img src=\"https://static.afterpay.com/us-popup-medium.png\" srcset=\"https://static.afterpay.com/us-popup-medium.png 1x, https://static.afterpay.com/us-popup-medium@2x.png 2x\" style=\"max-width: 597px; display: block; width: 100%;\"></a><a href=\"#\" style=\"position: absolute; right: 8px; top: 8px;\"><svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" viewBox=\"0 0 32 32\" version=\"1.1\" width=\"32px\" height=\"32px\"><g id=\"surface1\"><path style=\" \" d=\"M 16 3 C 8.832031 3 3 8.832031 3 16 C 3 23.167969 8.832031 29 16 29 C 23.167969 29 29 23.167969 29 16 C 29 8.832031 23.167969 3 16 3 Z M 16 5 C 22.085938 5 27 9.914063 27 16 C 27 22.085938 22.085938 27 16 27 C 9.914063 27 5 22.085938 5 16 C 5 9.914063 9.914063 5 16 5 Z M 12.21875 10.78125 L 10.78125 12.21875 L 14.5625 16 L 10.78125 19.78125 L 12.21875 21.21875 L 16 17.4375 L 19.78125 21.21875 L 21.21875 19.78125 L 17.4375 16 L 21.21875 12.21875 L 19.78125 10.78125 L 16 14.5625 Z \"></path></g></svg></a></div></div></div>'\n\nexport default apModalHTML\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport modalEnglishHTML from '../assets/Modals/modals-4.0.1/modal-en.js'\nimport modalFrenchHTML from '../assets/Modals/modals-4.0.1/modal-fr.js'\nimport apModalHTML from '../assets/Modals/apModal.js'\n\nexport default class Modal extends React.Component {\n constructor(props) {\n super(props)\n this.state = {\n modalElement: null\n }\n }\n\n static getDerivedStateFromProps (props, state) {\n if (state.modalElement) return state\n let modalElement\n switch (props.modalType) {\n case 'afterpay':\n modalElement = document.createElement('div')\n modalElement.className = 'sezzle-checkout-modal-lightbox close-sezzle-modal sezzle-ap-modal'\n modalElement.innerHTML = apModalHTML\n modalElement.style.display = 'none'\n break\n default:\n modalElement = document.createElement('div')\n modalElement.className = 'sezzle-checkout-modal-lightbox close-sezzle-modal'\n modalElement.innerHTML = document.querySelector('html').lang && document.querySelector('html').lang.substring(0,2).toLowerCase() === \"fr\" ? modalFrenchHTML : modalEnglishHTML\n modalElement.style.display = 'none'\n }\n state = {...state, modalElement}\n return state\n }\n\n componentDidMount() {\n document.querySelector('html').appendChild(this.state.modalElement)\n\n let sezzleModal\n if (this.props.modalType === 'afterpay') {\n sezzleModal = document.querySelector('.sezzle-ap-modal')\n } else {\n sezzleModal = document.querySelector('.sezzle-modal')\n }\n\n sezzleModal.addEventListener('click', (event) => event.stopPropagation())\n document.querySelectorAll('.close-sezzle-modal').length && document.querySelectorAll('.close-sezzle-modal').forEach((modal) => modal.addEventListener('click', (event) => this.modalCloseHandler(event)))\n }\n\n componentDidUpdate (prevProps, prevState) {\n this.toggleModalVisibility(this.props.toggleModalVisibility)\n }\n\n componentWillUnmount() {\n let modals = document.querySelector('html').getElementsByClassName('sezzle-checkout-modal-lightbox')\n for (let i = 0; i < modals.length; i++){\n document.querySelector('html').removeChild(modals[i])\n }\n }\n\n toggleModalVisibility = (isModalVisible) => {\n isModalVisible ? this.setState({ modalElement: { style: { display: 'block' } } }) : this.setState({ modalElement: { style: { display: 'none' } } })\n }\n\n modalCloseHandler = (event) => {\n this.props.callbackModalClose(this.props.modalType)\n this.setState({ modalElement: { style: { display: 'none' } } })\n }\n\n render() {\n return null\n }\n}\n\nModal.propTypes = {\n toggleModalVisibility: PropTypes.bool,\n modalType: PropTypes.string,\n callbackModalClose: PropTypes.func\n}\n","function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css \|\| typeof document === 'undefined') { return; }\n\n var head = document.head \|\| document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport { getFormattedPrice } from '../Helpers/renderFunctions'\nimport Modal from './Modal'\nimport '../index.css'\n\nexport default class SezzleWidgetText extends React.Component {\n constructor(props) {\n super(props)\n this.state = {\n config: this.props.config,\n sezzle: false,\n afterpay: false,\n modalsToShow: ['sezzle','afterpay']\n }\n }\n\n static getDerivedStateFromProps(props, state) {\n let config = props.config\n state = { ...state, config }\n\n return state\n }\n\n renderSezzleWidgetText() {\n let numberOfPayments = 4\n let logoURLs = {\n 'light': 'https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg',\n 'dark': 'https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor_WhiteWM.svg',\n 'black-flat': 'https://media.sezzle.com/branding/2.0/Sezzle_Logo_BlackAlt.svg',\n 'white-flat': 'https://media.sezzle.com/branding/2.0/Sezzle_Logo_WhiteAlt.svg'\n }\n let template = {\n en: `or ${numberOfPayments} interest-free payments of %%price%% with %%logo%%%%afterpay%%%%min-price%% %%info%%`,\n fr: `ou ${numberOfPayments} paiements de %%price%% sans intérêts avec %%logo%%%%afterpay%%%%min-price%% %%info%%`\n }\n let clickHere = {\n en: `Click here to learn more about Sezzle`,\n fr: `Cliquez pour en savoir plus sur Sezzle`\n }\n let ordersOver = {\n en: ` for orders over`,\n fr: ` pour les achats de plus de`\n }\n let language = document.querySelector('html').lang.substring(0, 2).toLowerCase() \|\| 'en'\n let subtemplates = []\n template[language].split('%%').forEach((subTemplate, index) => {\n switch (subTemplate) {\n case 'price':\n let priceElement = <span className='sezzle-payment-amount sezzle-button-text' key={index}>\n {getFormattedPrice(this.state.config.price, numberOfPayments)}\n </span>\n subtemplates.push(priceElement)\n break\n case 'logo':\n let logoElement = <img alt=\"Sezzle\"\n className={`sezzle-logo szl-${this.state.config.theme === 'dark' \|\| this.state.config.theme === 'white-flat' ? 'dark' : 'light'}-image`} src={logoURLs[this.state.config.theme] \|\| logoURLs.light}\n style={{ transformOrigin: `top-${this.state.config.alignment}`, transform: `scale(${this.state.config.logoSize})`, cursor: 'pointer', width: '74px', height: '18px'}}\n key={index} onClick={() => this.openModal('sezzle')} />\n subtemplates.push(logoElement)\n break\n case 'info':\n let infoElement = <div aria-label={`${clickHere[language]}`} className='sezzle-info-icon' key={index} onClick={() => this.openModal('sezzle')}>ⓘ</div>\n subtemplates.push(infoElement)\n break\n case 'afterpay':\n if (this.state.config.includeAPModal) {\n subtemplates.push(language === \"fr\" ? \"ou\" : \" or \")\n let apLogo = <img className='sezzle-ap-logo ap-modal-info-link no-sezzle-info'\n src={'https://media.sezzle.com/sezzle-credit-website-assets/ap-badge-black-on-mint.svg'}\n onClick={() => this.openModal('afterpay')} key={index}\n alt=\"Afterpay\"\n />\n subtemplates.push(apLogo)\n }\n break\n case 'min-price':\n if (this.state.config.minPrice && !this.state.config.includeAPModal) {\n subtemplates.push(`${ordersOver[language]} $${this.state.config.minPrice}`)\n }\n break\n default:\n subtemplates.push(subTemplate)\n }\n })\n return subtemplates\n }\n\n openModal(modalType) {\n modalType === 'afterpay' ? this.setState({ afterpay: true }) : this.setState({ sezzle: true })\n }\n\n closeModal(modalType) {\n modalType === 'afterpay' ? this.setState({ afterpay: false }) : this.setState({ sezzle: false })\n }\n\n render() {\n return (\n <div className={`sezzle-shopify-info-button sezzle-${this.state.config.merchantId \|\| ''}`}>\n <div aria-haspopup='dialog' role='button' tabIndex='0' className={`sezzle-checkout-button-wrapper sezzle-modal-link sezzle-${this.state.config.merchantId \|\| ''} sezzle-${this.state.config.alignment \|\| 'auto'}`} style={{ cursor: 'pointer' }}>\n <div className={`sezzle-button-text sezzle-${this.state.config.alignment \|\| 'auto'} szl-${this.state.config.theme === 'dark' \|\| this.state.config.theme === 'white-flat' ? 'dark' : 'light'}`} style={{ fontWeight: (this.state.config.fontWeight \|\| 500), fontFamily: (this.state.config.fontFamily \|\| 'inherit'), fontSize: ((this.state.config.fontSize \|\| 14) + 'px'), color: (this.state.config.textColor \|\| 'inherit') }}>\n {this.renderSezzleWidgetText()}\n </div>\n </div>\n {this.state.modalsToShow.map((modal, index) => (\n <Modal modalType={modal} key={index} toggleModalVisibility={this.state[modal]} callbackModalClose={(modal) => this.closeModal(modal)} />\n ))}\n </div>\n )\n }\n}\n\nSezzleWidgetText.propTypes = {\n config: PropTypes.object\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport SezzleWidget from './Components/SezzleWidget'\nimport './index.css'\n\nexport default class SezzleWidgetWrapper extends React.Component {\n constructor(props) {\n super(props)\n this.state = {\n sezzleConfig: {\n price: this.props.price \|\| 0,\n merchantId: this.props.merchantId \|\| '',\n includeAPModal: this.props.includeAPModal \|\| false,\n minPrice: this.props.minPrice \|\| 0,\n theme: this.props.theme \|\| 'light',\n alignment: this.props.alignment \|\| 'auto',\n fontWeight: this.props.fontWeight \|\| 500,\n fontFamily: this.props.fontFamily \|\| 'inherit',\n fontSize: this.props.fontSize \|\| 14,\n textColor: this.props.textColor \|\| 'inherit',\n logoSize: this.props.logoSize \|\| 1,\n modalsToShow: ['sezzle']\n }\n }\n }\n\n static getDerivedStateFromProps(props, state) {\n if (props.price !== state.sezzleConfig.price) {\n let updateState = state\n updateState.sezzleConfig.price = props.price\n return updateState\n }\n state = { ...state }\n\n if (props.includeAPModal) state.sezzleConfig.modalsToShow.push('afterpay')\n return state\n }\n\n render() {\n return (\n <div>\n <SezzleWidget config={this.state.sezzleConfig} />\n </div>\n )\n }\n}\n\nSezzleWidgetWrapper.propTypes = {\n price: PropTypes.string.isRequired,\n merchantId: PropTypes.string.isRequired,\n theme: PropTypes.string,\n alignment: PropTypes.string,\n fontWeight: PropTypes.number,\n fontFamily: PropTypes.string,\n fontSize: PropTypes.number,\n textColor: PropTypes.string,\n logoSize: PropTypes.number,\n includeAPModal: PropTypes.bool\n}\n"],"names":["parsePriceString","price","formattedPrice","i","length","isNumeric","isAlphabet","parsePrice","parseFloat","n","isNaN","isFinite","test","getFormattedPrice","numberOfPayments","priceString","priceReplacer","formatter","replace","sezzleInstallmentPrice","toFixed","sezzleInstallmentFormattedPrice","modalEnglishHTML","modalFrenchHTML","apModalHTML","Modal","props","toggleModalVisibility","isModalVisible","setState","modalElement","style","display","modalCloseHandler","event","callbackModalClose","modalType","state","querySelector","appendChild","sezzleModal","document","addEventListener","stopPropagation","querySelectorAll","forEach","modal","prevProps","prevState","modals","getElementsByClassName","removeChild","createElement","className","innerHTML","lang","substring","toLowerCase","React","Component","propTypes","PropTypes","bool","string","func","SezzleWidgetText","config","logoURLs","template","clickHere","ordersOver","language","subtemplates","split","subTemplate","index","priceElement","push","logoElement","theme","light","transformOrigin","alignment","transform","logoSize","cursor","width","height","openModal","infoElement","includeAPModal","apLogo","minPrice","afterpay","sezzle","merchantId","fontWeight","fontFamily","fontSize","color","textColor","renderSezzleWidgetText","modalsToShow","map","closeModal","object","SezzleWidgetWrapper","SezzleWidget","sezzleConfig","updateState","isRequired","number"],"mappings":"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"}
1	+ {"version":3,"file":"index.es.js","sources":["../src/Helpers/helper.js","../src/Helpers/renderFunctions.js","../src/assets/Modals/modals-4.0.4/modal-en.js","../src/assets/Modals/modals-4.0.4/modal-fr.js","../src/assets/Modals/apModal-en.js","../src/assets/Modals/apModal-fr.js","../src/Components/Modal.js","../node_modules/style-inject/dist/style-inject.es.js","../src/Components/SezzleWidget.js","../src/index.js"],"sourcesContent":["/*\n This function will return the price string\n * @param price - string value\n * @return string\n /\nexport function parsePriceString(price) {\n let formattedPrice = ''\n if (!price) return formattedPrice\n for (let i = 0; i < price.length; i++) {\n if (isNumeric(price[i]) \|\| price[i] === '.' \|\| (price[i] === ',')) {\n // Ignore actual sentence punctuation\n if (i > 0 && price[i] === '.' && isAlphabet(price[i - 1])) continue\n\n formattedPrice += price[i]\n }\n }\n return formattedPrice\n}\n\n/\n Function parses the price from string to float\n * @param price -> String\n * @return float\n /\nexport function parsePrice(price) {\n return parseFloat(parsePriceString(price))\n}\n\n/\n This is helper function for formatPrice\n * @param n char value\n * @return boolean [if it's numeric or not]\n /\nexport function isNumeric(n) {\n return !isNaN(parseFloat(n)) && isFinite(n)\n}\n\n/\n This is helper function for formatPrice\n * @param n char value\n * @return boolean [if it's alphabet or not]\n /\nexport function isAlphabet(n) {\n return /^[a-zA-Z()]+$/.test(n)\n}\n\n/\n This is a helper function for formatting the language\n * @return string\n /\nexport function getLanguage() {\n return document.querySelector('html').lang?.substring(0, 2).toLowerCase()\n}\n\n/\n This is a helper function for formatting the language\n * @return string\n /\nexport function getSupportedLanguage() {\n const supportedLanguages = ['en', 'fr']\n const lang = getLanguage()\n return supportedLanguages.indexOf(lang) > -1 ? lang : 'en'\n}\n","import { parsePriceString, parsePrice } from './helper'\n\nexport function getFormattedPrice(price, numberOfPayments) {\n const priceString = parsePriceString(price)\n const priceReplacer = parsePrice(price)\n\n const formatter = price.replace(priceString, '{price}')\n\n const sezzleInstallmentPrice = (priceReplacer / numberOfPayments).toFixed(2)\n\n const sezzleInstallmentFormattedPrice = formatter.replace('{price}', sezzleInstallmentPrice)\n\n return sezzleInstallmentFormattedPrice\n};\n","const modalEnglishHTML = `\n<style>\n@import url('https://fonts.cdnfonts.com/css/satoshi');\n@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@600&display=swap');\n.sezzle-modal-open {\n position: fixed;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n}\n.sezzle-checkout-modal-hidden {\n width: 100%;\n height: 100%;\n -webkit-font-smoothing: antialiased;\n transition: all 0.4s ease;\n margin-top: 0;\n}\n@media screen and (min-width: 0px) and (max-width: 280px) {\n .sezzle-checkout-modal-hidden {\n display: none;\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal {\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n position: absolute;\n box-shadow: 0 10px 20px rgba(5, 31, 52, 0.19), 0 6px 6px rgba(5, 31, 52, 0.2);\n height: auto;\n max-height: 90%;\n width: 343px;\n color: #000000;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n background-color: #fff;\n overflow: auto;\n padding: 20px 0;\n border-radius: 10px;\n box-sizing: border-box;\n}\n@media screen and (max-width: 374px) {\n .sezzle-checkout-modal-hidden .sezzle-modal {\n transform: scale(0.9) translate(-55%, -55%);\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal {\n position: absolute;\n right: 16px;\n top: 16px;\n width: 24px;\n height: 24px;\n opacity: 0.2;\n cursor: pointer;\n padding: 0;\n outline: 0;\n background: 0 0;\n border: none;\n box-shadow: none;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal:hover {\n opacity: 1;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal:focus {\n opacity: 0.5;\n}\n@media screen and (max-width: 600px) {\n .sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal {\n opacity: 0.8;\n }\n .sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal:focus {\n opacity: 1;\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal::before {\n position: absolute;\n left: 10px;\n content: \" \";\n top: 0;\n transform: rotate(45deg);\n background-color: #595959;\n width: 2px;\n height: 15px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal::after {\n position: absolute;\n left: 10px;\n content: \" \";\n top: 0;\n transform: rotate(-45deg);\n background-color: #595959;\n width: 2px;\n height: 15px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-logo {\n display: block;\n height: 24px;\n width: 98px;\n margin: 10px auto 0;\n background-image: url(https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg);\n background-repeat: no-repeat;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content {\n height: auto;\n text-align: center;\n padding: 0px 16px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-header {\n display: block;\n text-align: center;\n font-style: normal;\n font-size: 24px;\n font-weight: 600;\n line-height: 28px;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n color: #000000;\n margin-top: 24px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-row {\n text-align: center;\n font-style: normal;\n font-size: 15px;\n font-weight: 400;\n line-height: 20px;\n color: #000000;\n letter-spacing: -0.3px;\n margin: 8px auto 24px;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay {\n display: flex;\n flex-direction: column;\n align-items: center;\n background: rgba(131, 51, 212, 0.05);\n border-radius: 16px;\n padding: 16px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-row {\n text-align: center;\n font-style: normal;\n font-size: 15px;\n font-weight: 500;\n line-height: 20px;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n color: #000000;\n margin: 0px 0px 12px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .due-today {\n display: flex;\n flex-direction: column;\n align-items: center;\n background: #FFFFFF;\n border: 1px solid #8333D4;\n border-radius: 8px;\n margin: 0px 4px;\n padding: 16px 0px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .due-today :first-child {\n padding: 0px 6px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .future-payments {\n display: flex;\n flex-direction: row;\n align-items: center;\n background: #FFFFFF;\n border: 1px solid #8333D4;\n border-radius: 8px;\n margin: 0px 4px;\n padding: 0px 4px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .future-payments :first-child {\n padding: 0px 4px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item {\n padding: 16px 2px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item .breakdown-row {\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 0px;\n padding: 8px 0px 0px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item .breakdown-row .percentage {\n text-align: center;\n font-style: normal;\n font-size: 15px;\n font-weight: 500;\n line-height: 20px;\n color: #8333D4;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n align-items: center;\n letter-spacing: -0.3px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item .breakdown-row .due {\n text-align: center;\n font-style: normal;\n font-size: 12px;\n font-weight: 400;\n line-height: 16px;\n color: #5E5E5E;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-features {\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 16px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-features .single-feature {\n text-align: center;\n font-style: normal;\n font-size: 17px;\n font-weight: 600;\n line-height: 22px;\n color: #000000;\n letter-spacing: -0.3px;\n margin: 8px auto;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo {\n font-size: 14px;\n color: #000000;\n}\n@media screen and (max-width: 600px) {\n .sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo {\n font-size: 12px;\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo::first-letter {\n text-transform: capitalize;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo a {\n color: #000000;\n text-decoration: underline;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo a:visited {\n color: #037269;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo a:hover {\n color: #af0fda;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .terms {\n text-align: center;\n font-style: normal;\n font-size: 11px;\n font-weight: 400;\n line-height: 13px;\n color: #5E5E5E;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal {\n background-image: none;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-logo {\n width: 98px;\n background-image: url(https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg);\n background-repeat: no-repeat;\n background-position: 50%;\n height: 24px;\n margin: 10px auto 20px auto;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content {\n height: auto;\n width: auto;\n text-align: center;\n padding: 0px 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-header {\n font-size: 24px;\n line-height: 30px;\n margin: 10px auto;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-row {\n font-size: 15px;\n line-height: 20px;\n margin: 8px auto;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments {\n height: fit-content;\n margin: 20px auto;\n padding: 20px 0 0;\n border: 1px solid #e5e5e5;\n border-radius: 5px;\n max-width: 502px;\n display: block;\n flex-direction: column;\n align-items: center;\n padding: 0px;\n gap: 24px;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-header {\n font-family: Satoshi, \"Open Sans\", sans-serif;\n font-style: normal;\n font-weight: 600;\n font-size: 15px;\n line-height: 20px;\n display: block;\n align-items: center;\n text-align: center;\n padding: 15px;\n letter-spacing: -0.3px;\n border-bottom: 1px solid #e5e5e5;\n color: #000000;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-header span {\n font-size: 17px;\n line-height: 22px;\n font-weight: 700;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options {\n font-size: 12px;\n line-height: 14px;\n margin: 0px 20px 0;\n padding: 20px 0px;\n border-bottom: 1px solid #e5e5e5;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan {\n display: flex;\n justify-content: space-between;\n padding-bottom: 10px;\n font-size: 12px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan .monthly-amount span {\n font-size: 17px;\n line-height: 22px;\n color: #8333D4;\n font-weight: 600;\n letter-spacing: -0.3px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan .monthly-amount .per-month {\n font-size: 13px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan .term-length {\n border-radius: 100px;\n background: rgba(41, 211, 162, 0.1);\n color: #00804A;\n padding: 2px 8px;\n font-size: 12px;\n font-weight: 600;\n display: flex;\n align-items: center;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details {\n display: flex;\n justify-content: space-between;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .adjusted-total {\n color: #5E5E5E;\n font-size: 12px;\n width: fit-content;\n text-align: left;\n font-weight: 400;\n line-height: 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .adjusted-total span {\n display: block;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .interest-amount {\n color: #5E5E5E;\n font-size: 12px;\n width: fit-content;\n text-align: left;\n font-weight: 400;\n line-height: 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .interest-amount span {\n display: block;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .sample-apr {\n color: #5E5E5E;\n font-size: 12px;\n width: fit-content;\n text-align: left;\n font-weight: 400;\n line-height: 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .sample-apr span {\n display: block;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments:last-child {\n border: none;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .details {\n font-size: 17px;\n line-height: 22px;\n margin: 16px auto;\n font-weight: 600;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n letter-spacing: -0.3px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .terms {\n font-size: 11px;\n line-height: 13px;\n color: #5E5E5E;\n margin: 10px auto 0;\n padding: 12px 0 0;\n border-top: 1px solid #e5e5e5;\n text-align: center;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n}\n</style>\n<section class=\"sezzle-checkout-modal-lightbox close-sezzle-modal\" role=\"dialog\" lang=\"en\"\n aria-label=\"Sezzle Information\" aria-description=\"Learn more about Sezzle\" style=\"display: block;\">\n <div id=\"sezzle-modal-container\" role=\"dialog\" aria-label=\"Sezzle Modal\" aria-description=\"Learn more about Sezzle\"\n class=\"sezzle-checkout-modal-hidden\">\n <div class=\"sezzle-modal sezzle-modal-color\">\n <div><button role=\"button\" aria-label=\"Close Sezzle modal.\" class=\"close-sezzle-modal\"></button></div>\n <div class=\"sezzle-logo\" title=\"Sezzle\"></div>\n <div id=\"sezzle-modal-core-content\" class=\"sezzle-modal-content\">\n <header class=\"sezzle-header\">Buy Now. Pay Later.\n </header>\n <p class=\"sezzle-row\">\n Pay in 4 by selecting Sezzle at checkout.\n </p>\n <div class=\"sezzle-four-pay\">\n <p class=\"sezzle-row\">\n Flexible payment plans for your budget\n </p>\n <div class=\"sezzle-pie-area\">\n <div class=\"due-today\">\n <div class=\"payment-item\">\n <div title=\"pie at 25%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\"\n fill=\"#8333D4\" fill-opacity=\"0.05\"></path>\n <path\n d=\"M20 -7.62939e-05C22.6264 -7.64088e-05 25.2272 0.51724 27.6537 1.52233C30.0802 2.52743 32.285 4.00062 34.1421 5.85779C35.9993 7.71496 37.4725 9.91974 38.4776 12.3463C39.4827 14.7728 40 17.3735 40 19.9999L30 19.9999C30 18.6867 29.7413 17.3863 29.2388 16.1731C28.7362 14.9598 27.9997 13.8574 27.0711 12.9289C26.1425 12.0003 25.0401 11.2637 23.8268 10.7611C22.6136 10.2586 21.3132 9.99992 20 9.99992L20 -7.62939e-05Z\"\n fill=\"#8333D4\"></path>\n <path\n d=\"M40 19.9999C40 22.7613 37.7614 24.9998 35 24.9998C32.2386 24.9998 30 22.7613 30 19.9999C30 17.2385 32.2386 14.9998 35 14.9998C37.7614 14.9998 40 17.2385 40 19.9999Z\"\n fill=\"#8333D4\"></path>\n <circle cx=\"35\" cy=\"20\" r=\"5\" fill=\"#8333D4\"></circle>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Today</span>\n </p>\n </div>\n </div>\n <div class=\"future-payments\">\n <div class=\"payment-item\">\n <div title=\"pie at 50%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\"\n fill=\"#8333D4\" fill-opacity=\"0.05\"></path>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n d=\"M40 20C40 31.0457 31.0457 40 20 40C17.2386 40 15 37.7614 15 35C15 32.2386 17.2386 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10V0C31.0457 0 40 8.9543 40 20Z\"\n fill=\"#8333D4\"></path>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Week 2</span>\n </p>\n </div>\n <div class=\"payment-item\">\n <div title=\"pie at 75%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\"\n fill=\"#8333D4\" fill-opacity=\"0.05\"></path>\n <path\n d=\"M20 -8.74228e-07C23.9556 -1.04713e-06 27.8224 1.17298 31.1114 3.37061C34.4004 5.56824 36.9638 8.69181 38.4776 12.3463C39.9913 16.0009 40.3874 20.0222 39.6157 23.9018C38.844 27.7814 36.9392 31.3451 34.1421 34.1421C31.3451 36.9392 27.7814 38.844 23.9018 39.6157C20.0222 40.3874 16.0009 39.9913 12.3463 38.4776C8.69181 36.9638 5.56824 34.4004 3.37061 31.1114C1.17298 27.8224 -7.48492e-07 23.9556 -8.74228e-07 20L10 20C10 21.9778 10.5865 23.9112 11.6853 25.5557C12.7841 27.2002 14.3459 28.4819 16.1732 29.2388C18.0004 29.9957 20.0111 30.1937 21.9509 29.8079C23.8907 29.422 25.6725 28.4696 27.0711 27.0711C28.4696 25.6725 29.422 23.8907 29.8079 21.9509C30.1937 20.0111 29.9957 18.0004 29.2388 16.1732C28.4819 14.3459 27.2002 12.7841 25.5557 11.6853C23.9112 10.5865 21.9778 10 20 10L20 -8.74228e-07Z\"\n fill=\"#8333D4\"></path>\n <path\n d=\"M10 20C10 22.7614 7.76142 25 5 25C2.23858 25 -8.74228e-07 22.7614 -8.74228e-07 20C-8.74228e-07 17.2386 2.23858 15 5 15C7.76142 15 10 17.2386 10 20Z\"\n fill=\"#8333D4\"></path>\n <circle cx=\"5\" cy=\"20\" r=\"5\" fill=\"#8333D4\"></circle>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Week 4</span>\n </p>\n </div>\n <div class=\"payment-item\">\n <div title=\"pie at 100%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\"\n fill=\"#8333D4\"></path>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Week 6</span>\n </p>\n </div>\n </div>\n </div>\n </div>\n <div class=\"sezzle-features\">\n <p class=\"single-feature\">\n No credit check required\n </p>\n <p class=\"single-feature\">\n Instant credit decision\n </p>\n <p class=\"single-feature\">\n Opt in to free credit reporting\n </p>\n </div>\n <p class=\"terms\">Signing up for Sezzle will not impact your credit score. You may opt-in to our free credit\n reporting program, Sezzle Up, to have your payments reported to credit bureaus. Learn more about spending\n power <a href=\"https://sezzle.com/how-it-works\" target=\"_blank\">here</a>.</p>\n <p class=\"terms\">Subject to approval. <a href=\"https://www.sezzle.com/legal\" target=\"_blank\">Click here for\n complete terms.</a> First payment date and amount may fluctuate based on eligibility and time of merchant\n order completion.</p>\n </div>\n </div>\n </div>\n</section>\n\n`\n\nexport default modalEnglishHTML\n","const modalFrenchHTML = `\n<style>\n@import url('https://fonts.cdnfonts.com/css/satoshi');\n@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@600&display=swap');\n.sezzle-modal-open {\n position: fixed;\n top: 0;\n bottom: 0;\n right: 0;\n left: 0;\n}\n.sezzle-checkout-modal-hidden {\n width: 100%;\n height: 100%;\n -webkit-font-smoothing: antialiased;\n transition: all 0.4s ease;\n margin-top: 0;\n}\n@media screen and (min-width: 0px) and (max-width: 280px) {\n .sezzle-checkout-modal-hidden {\n display: none;\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal {\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n position: absolute;\n box-shadow: 0 10px 20px rgba(5, 31, 52, 0.19), 0 6px 6px rgba(5, 31, 52, 0.2);\n height: auto;\n max-height: 90%;\n width: 343px;\n color: #000000;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n background-color: #fff;\n overflow: auto;\n padding: 20px 0;\n border-radius: 10px;\n box-sizing: border-box;\n}\n@media screen and (max-width: 374px) {\n .sezzle-checkout-modal-hidden .sezzle-modal {\n transform: scale(0.9) translate(-55%, -55%);\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal {\n position: absolute;\n right: 16px;\n top: 16px;\n width: 24px;\n height: 24px;\n opacity: 0.2;\n cursor: pointer;\n padding: 0;\n outline: 0;\n background: 0 0;\n border: none;\n box-shadow: none;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal:hover {\n opacity: 1;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal:focus {\n opacity: 0.5;\n}\n@media screen and (max-width: 600px) {\n .sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal {\n opacity: 0.8;\n }\n .sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal:focus {\n opacity: 1;\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal::before {\n position: absolute;\n left: 10px;\n content: \" \";\n top: 0;\n transform: rotate(45deg);\n background-color: #595959;\n width: 2px;\n height: 15px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal div button.close-sezzle-modal::after {\n position: absolute;\n left: 10px;\n content: \" \";\n top: 0;\n transform: rotate(-45deg);\n background-color: #595959;\n width: 2px;\n height: 15px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-logo {\n display: block;\n height: 24px;\n width: 98px;\n margin: 10px auto 0;\n background-image: url(https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg);\n background-repeat: no-repeat;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content {\n height: auto;\n text-align: center;\n padding: 0px 16px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-header {\n display: block;\n text-align: center;\n font-style: normal;\n font-size: 24px;\n font-weight: 600;\n line-height: 28px;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n color: #000000;\n margin-top: 24px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-row {\n text-align: center;\n font-style: normal;\n font-size: 15px;\n font-weight: 400;\n line-height: 20px;\n color: #000000;\n letter-spacing: -0.3px;\n margin: 8px auto 24px;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay {\n display: flex;\n flex-direction: column;\n align-items: center;\n background: rgba(131, 51, 212, 0.05);\n border-radius: 16px;\n padding: 16px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-row {\n text-align: center;\n font-style: normal;\n font-size: 15px;\n font-weight: 500;\n line-height: 20px;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n color: #000000;\n margin: 0px 0px 12px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area {\n display: flex;\n flex-direction: row;\n align-items: flex-start;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .due-today {\n display: flex;\n flex-direction: column;\n align-items: center;\n background: #FFFFFF;\n border: 1px solid #8333D4;\n border-radius: 8px;\n margin: 0px 4px;\n padding: 16px 0px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .due-today :first-child {\n padding: 0px 6px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .future-payments {\n display: flex;\n flex-direction: row;\n align-items: center;\n background: #FFFFFF;\n border: 1px solid #8333D4;\n border-radius: 8px;\n margin: 0px 4px;\n padding: 0px 4px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .future-payments :first-child {\n padding: 0px 4px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item {\n padding: 16px 2px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item .breakdown-row {\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 0px;\n padding: 8px 0px 0px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item .breakdown-row .percentage {\n text-align: center;\n font-style: normal;\n font-size: 15px;\n font-weight: 500;\n line-height: 20px;\n color: #8333D4;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n align-items: center;\n letter-spacing: -0.3px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-four-pay .sezzle-pie-area .payment-item .breakdown-row .due {\n text-align: center;\n font-style: normal;\n font-size: 12px;\n font-weight: 400;\n line-height: 16px;\n color: #5E5E5E;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-features {\n display: flex;\n flex-direction: column;\n align-items: center;\n margin: 16px;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .sezzle-features .single-feature {\n text-align: center;\n font-style: normal;\n font-size: 17px;\n font-weight: 600;\n line-height: 22px;\n color: #000000;\n letter-spacing: -0.3px;\n margin: 8px auto;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo {\n font-size: 14px;\n color: #000000;\n}\n@media screen and (max-width: 600px) {\n .sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo {\n font-size: 12px;\n }\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo::first-letter {\n text-transform: capitalize;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo a {\n color: #000000;\n text-decoration: underline;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo a:visited {\n color: #037269;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .promo a:hover {\n color: #af0fda;\n}\n.sezzle-checkout-modal-hidden .sezzle-modal .sezzle-modal-content .terms {\n text-align: center;\n font-style: normal;\n font-size: 11px;\n font-weight: 400;\n line-height: 13px;\n color: #5E5E5E;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal {\n background-image: none;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-logo {\n width: 98px;\n background-image: url(https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg);\n background-repeat: no-repeat;\n background-position: 50%;\n height: 24px;\n margin: 10px auto 20px auto;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content {\n height: auto;\n width: auto;\n text-align: center;\n padding: 0px 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-header {\n font-size: 24px;\n line-height: 30px;\n margin: 10px auto;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-row {\n font-size: 15px;\n line-height: 20px;\n margin: 8px auto;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments {\n height: fit-content;\n margin: 20px auto;\n padding: 20px 0 0;\n border: 1px solid #e5e5e5;\n border-radius: 5px;\n max-width: 502px;\n display: block;\n flex-direction: column;\n align-items: center;\n padding: 0px;\n gap: 24px;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-header {\n font-family: Satoshi, \"Open Sans\", sans-serif;\n font-style: normal;\n font-weight: 600;\n font-size: 15px;\n line-height: 20px;\n display: block;\n align-items: center;\n text-align: center;\n padding: 15px;\n letter-spacing: -0.3px;\n border-bottom: 1px solid #e5e5e5;\n color: #000000;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-header span {\n font-size: 17px;\n line-height: 22px;\n font-weight: 700;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options {\n font-size: 12px;\n line-height: 14px;\n margin: 0px 20px 0;\n padding: 20px 0px;\n border-bottom: 1px solid #e5e5e5;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan {\n display: flex;\n justify-content: space-between;\n padding-bottom: 10px;\n font-size: 12px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan .monthly-amount span {\n font-size: 17px;\n line-height: 22px;\n color: #8333D4;\n font-weight: 600;\n letter-spacing: -0.3px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan .monthly-amount .per-month {\n font-size: 13px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan .term-length {\n border-radius: 100px;\n background: rgba(41, 211, 162, 0.1);\n color: #00804A;\n padding: 2px 8px;\n font-size: 12px;\n font-weight: 600;\n display: flex;\n align-items: center;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details {\n display: flex;\n justify-content: space-between;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .adjusted-total {\n color: #5E5E5E;\n font-size: 12px;\n width: fit-content;\n text-align: left;\n font-weight: 400;\n line-height: 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .adjusted-total span {\n display: block;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .interest-amount {\n color: #5E5E5E;\n font-size: 12px;\n width: fit-content;\n text-align: left;\n font-weight: 400;\n line-height: 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .interest-amount span {\n display: block;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .sample-apr {\n color: #5E5E5E;\n font-size: 12px;\n width: fit-content;\n text-align: left;\n font-weight: 400;\n line-height: 16px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments .sezzle-lt-payment-options .plan-details .sample-apr span {\n display: block;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .sezzle-lt-payments:last-child {\n border: none;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .details {\n font-size: 17px;\n line-height: 22px;\n margin: 16px auto;\n font-weight: 600;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n letter-spacing: -0.3px;\n}\n.sezzle-checkout-modal-hidden.long-term .sezzle-modal .sezzle-modal-content .terms {\n font-size: 11px;\n line-height: 13px;\n color: #5E5E5E;\n margin: 10px auto 0;\n padding: 12px 0 0;\n border-top: 1px solid #e5e5e5;\n text-align: center;\n font-family: Satoshi, \"Open Sans\", sans-serif;\n}\n\n</style>\n<section class=\"sezzle-checkout-modal-lightbox close-sezzle-modal\" role=\"dialog\" lang=\"fr\"\n aria-label=\"Informations Sezzle\" aria-description=\"En savoir plus sur Sezzle\" style=\"display: block;\">\n <div id=\"sezzle-modal-container\" role=\"dialog\" aria-label=\"Sezzle Modal\" aria-description=\"En savoir plus sur Sezzle\"\n class=\"sezzle-checkout-modal-hidden\">\n <div class=\"sezzle-modal sezzle-modal-color\">\n <div><button role=\"button\" aria-label=\"Fermer Sezzle modal.\" class=\"close-sezzle-modal\"></button></div>\n <div class=\"sezzle-logo\" title=\"Sezzle\"></div>\n <div id=\"sezzle-modal-core-content\" class=\"sezzle-modal-content\">\n <header class=\"sezzle-header\">Acheter maintenant. Payer plus tard.\n </header>\n <p class=\"sezzle-row\">\n Payez en 4 en sélectionnant Sezzle à la caisse.\n </p>\n <div class=\"sezzle-four-pay\">\n <p class=\"sezzle-row\">\n Plans de paiement flexibles pour votre budget\n </p>\n <div class=\"sezzle-pie-area\">\n <div class=\"due-today\">\n <div class=\"payment-item\">\n <div title=\"graphique circulaire à 25%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\"\n fill=\"#8333D4\" fill-opacity=\"0.05\"></path>\n <path\n d=\"M20 -7.62939e-05C22.6264 -7.64088e-05 25.2272 0.51724 27.6537 1.52233C30.0802 2.52743 32.285 4.00062 34.1421 5.85779C35.9993 7.71496 37.4725 9.91974 38.4776 12.3463C39.4827 14.7728 40 17.3735 40 19.9999L30 19.9999C30 18.6867 29.7413 17.3863 29.2388 16.1731C28.7362 14.9598 27.9997 13.8574 27.0711 12.9289C26.1425 12.0003 25.0401 11.2637 23.8268 10.7611C22.6136 10.2586 21.3132 9.99992 20 9.99992L20 -7.62939e-05Z\"\n fill=\"#8333D4\"></path>\n <path\n d=\"M40 19.9999C40 22.7613 37.7614 24.9998 35 24.9998C32.2386 24.9998 30 22.7613 30 19.9999C30 17.2385 32.2386 14.9998 35 14.9998C37.7614 14.9998 40 17.2385 40 19.9999Z\"\n fill=\"#8333D4\"></path>\n <circle cx=\"35\" cy=\"20\" r=\"5\" fill=\"#8333D4\"></circle>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Aujourd'hui</span>\n </p>\n </div>\n </div>\n <div class=\"future-payments\">\n <div class=\"payment-item\">\n <div title=\"graphique circulaire à 50%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\"\n fill=\"#8333D4\" fill-opacity=\"0.05\"></path>\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n d=\"M40 20C40 31.0457 31.0457 40 20 40C17.2386 40 15 37.7614 15 35C15 32.2386 17.2386 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10V0C31.0457 0 40 8.9543 40 20Z\"\n fill=\"#8333D4\"></path>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Semaine 2</span>\n </p>\n </div>\n <div class=\"payment-item\">\n <div title=\"graphique circulaire à 75%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\"\n fill=\"#8333D4\" fill-opacity=\"0.05\"></path>\n <path\n d=\"M20 -8.74228e-07C23.9556 -1.04713e-06 27.8224 1.17298 31.1114 3.37061C34.4004 5.56824 36.9638 8.69181 38.4776 12.3463C39.9913 16.0009 40.3874 20.0222 39.6157 23.9018C38.844 27.7814 36.9392 31.3451 34.1421 34.1421C31.3451 36.9392 27.7814 38.844 23.9018 39.6157C20.0222 40.3874 16.0009 39.9913 12.3463 38.4776C8.69181 36.9638 5.56824 34.4004 3.37061 31.1114C1.17298 27.8224 -7.48492e-07 23.9556 -8.74228e-07 20L10 20C10 21.9778 10.5865 23.9112 11.6853 25.5557C12.7841 27.2002 14.3459 28.4819 16.1732 29.2388C18.0004 29.9957 20.0111 30.1937 21.9509 29.8079C23.8907 29.422 25.6725 28.4696 27.0711 27.0711C28.4696 25.6725 29.422 23.8907 29.8079 21.9509C30.1937 20.0111 29.9957 18.0004 29.2388 16.1732C28.4819 14.3459 27.2002 12.7841 25.5557 11.6853C23.9112 10.5865 21.9778 10 20 10L20 -8.74228e-07Z\"\n fill=\"#8333D4\"></path>\n <path\n d=\"M10 20C10 22.7614 7.76142 25 5 25C2.23858 25 -8.74228e-07 22.7614 -8.74228e-07 20C-8.74228e-07 17.2386 2.23858 15 5 15C7.76142 15 10 17.2386 10 20Z\"\n fill=\"#8333D4\"></path>\n <circle cx=\"5\" cy=\"20\" r=\"5\" fill=\"#8333D4\"></circle>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Semaine 4</span>\n </p>\n </div>\n <div class=\"payment-item\">\n <div title=\"graphique circulaire à 100%\">\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M40 20C40 31.0457 31.0457 40 20 40C8.9543 40 0 31.0457 0 20C0 8.9543 8.9543 0 20 0C31.0457 0 40 8.9543 40 20ZM10 20C10 25.5228 14.4772 30 20 30C25.5228 30 30 25.5228 30 20C30 14.4772 25.5228 10 20 10C14.4772 10 10 14.4772 10 20Z\"\n fill=\"#8333D4\"></path>\n </svg>\n </div>\n <p class=\"breakdown-row\">\n <span class=\"percentage\">25%</span>\n <span class=\"due\">Semaine 6</span>\n </p>\n </div>\n </div>\n </div>\n </div>\n <div class=\"sezzle-features\">\n <p class=\"single-feature\">\n Aucune vérification de crédit requise\n </p>\n <p class=\"single-feature\">\n Décision de crédit instantanée\n </p>\n <p class=\"single-feature\">\n Optez pour le rapport de crédit gratuite\n </p>\n </div>\n <p class=\"terms\">L'inscription à Sezzle n'aura aucune incidence sur votre pointage de crédit. Vous pouvez\n accepter de participer à notre programme gratuit d'évaluation du crédit, Sezzle Up, afin que vos paiements\n soient signalés aux bureaux de crédit. Pour en savoir plus sur le pouvoir d'achat, <a\n href=\"https://sezzle.com/how-it-works\" target=\"_blank\">cliquez ici.</a></p>\n <p class=\"terms\">Sous réserve d'approbation. <a href=\"https://www.sezzle.com/legal\" target=\"_blank\">Cliquez ici\n pour l'intégralité des conditions.</a> La date et le montant du premier paiement peuvent varier en fonction\n de l'éligibilité et de la date de finalisation de la commande auprès du vendeu.</p>\n </div>\n </div>\n </div>\n</section>\n`\n\nexport default modalFrenchHTML\n","const apModalEnglishHTML = `<div id=\"afterpay-modal-component\">\n<style>\n .afterpay-modal-overlay {\n position: fixed;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.5);\n opacity: 0;\n visibility: hidden;\n transform: scale(1.1);\n transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;\n z-index: 999999999;\n }\n\n #afterpay-modal-component .visible {\n opacity: 1;\n visibility: visible;\n transform: scale(1);\n transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;\n }\n\n #afterpay-modal-component #afterpay-modal {\n background-color: #fff;\n color: #000;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n border-radius: 2px;\n width: 774px;\n max-width: 100vw;\n max-height: 100%;\n line-height: 1.1;\n display: block;\n overflow: auto;\n }\n\n #afterpay-modal-component #afterpay-modal.afterpay-modal-is-apr {\n border-radius: 0px;\n max-width: 100%;\n width: 476px;\n }\n\n @media (min-width:473px) and (min-height:686px) {\n #afterpay-modal-component #afterpay-modal.afterpay-modal-is-apr {\n border-radius: 12px;\n }\n }\n\n #afterpay-modal-component #afterpay-modal .afterpay-close-button {\n position: absolute;\n z-index: 3;\n background-color: transparent;\n min-width: 0;\n top: 18px;\n right: 18px;\n border: 0;\n cursor: pointer;\n }\n\n #afterpay-modal-component button {\n min-width: 80px;\n background-color: #848e97;\n border-color: #848e97;\n border-style: solid;\n border-radius: 2px;\n padding: 3px;\n color: white;\n cursor: pointer;\n display: none;\n }\n\n #afterpay-modal-component button:hover {\n background-color: #6c757d;\n border-color: #6c757d;\n }\n\n .afterpay-loading-indicator {\n display: block;\n background-color: transparent;\n width: 80px;\n position: absolute;\n left: 50%;\n top: 50%;\n }\n\n .afterpay-loading-indicator::after {\n content: \" \";\n display: block;\n width: 40px;\n height: 40px;\n border-radius: 50%;\n border: 5px solid #b2fce4;\n border-color: #b2fce4 transparent #b2fce4 transparent;\n animation: afterpay-loading-indicator 1.2s linear infinite;\n }\n\n @keyframes afterpay-loading-indicator {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n }\n\n .modal-content .error-container {\n padding: 25px;\n text-align: center;\n background-color: #b2fce4;\n opacity: 0;\n visibility: hidden;\n }\n\n .modal-content.error .error-container {\n opacity: 1;\n visibility: visible;\n font-family: 'Italian Plate No2 Expanded', sans-serif;\n }\n\n @media (-ms-high-contrast:none),\n (-ms-high-contrast:active) {\n #afterpay-modal-component #afterpay-modal {\n bottom: auto;\n }\n }\n</style>\n<div class=\"afterpay-modal-overlay visible\">\n <div class=\"afterpay-loading-indicator\" style=\"display: none;\"></div>\n <div id=\"afterpay-modal\" role=\"dialog\" tabindex=\"-1\" aria-modal=\"true\" aria-describedby=\"afterpay-modal-container\" aria-label=\"Afterpay\">\n <button class=\"afterpay-close-button\" id=\"afterpay-modal-close-button\" tabindex=\"1\" autofocus=\"false\" aria-label=\"Afterpay modal close button\" style=\"display: block;\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" focusable=\"false\" width=\"20\" height=\"20\" viewBox=\"0 0 30 30\" aria-hidden=\"true\">\n <defs>\n <style>\n .a {\n fill: none;\n stroke: #808284;\n stroke-linecap: round;\n stroke-linejoin: round;\n stroke-width: 2px;\n }\n </style>\n </defs>\n <title>Afterpay modal close button</title>\n <line class=\"a\" x1=\"1\" y1=\"1\" x2=\"29\" y2=\"29\"></line>\n <line class=\"a\" x1=\"1\" y1=\"29\" x2=\"29\" y2=\"1\"></line>\n </svg>\n </button>\n <div class=\"modal-content\">\n <div id=\"afterpay-modal-container\" class=\"afterpay-modal-wrapper\">\n <div class=\"grid-container\">\n <div class=\"row-0\">\n <div class=\"afterpay-modal-logo\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"0 0 1150 222\" class=\"afterpay-logo-black\" aria-label=\"Afterpay logo\">\n <path d=\"M1132 45.3l-34.6-19.8-35.1-20.1a34.9 34.9 0 00-52.2 30.2V40c0 2.5 1.3 4.8 3.5 6l16.3 9.3a6.8 6.8 0 0010.1-6V38.9c0-5.3 5.7-8.6 10.3-6l32 18.4 31.9 18.3a6.9 6.9 0 010 11.9l-31.9 18.3-32 18.4a6.9 6.9 0 01-10.3-6v-5.3c0-26.8-29-43.6-52.2-30.2l-35.1 20-34.6 19.9a35 35 0 000 60.5l34.6 19.8 35.1 20a34.9 34.9 0 0052.2-30.1v-4.5c0-2.5-1.3-4.8-3.5-6l-16.3-9.3a6.8 6.8 0 00-10.1 5.9v10.7c0 5.3-5.7 8.6-10.3 6l-32-18.4-31.9-18.3a6.9 6.9 0 010-12l31.9-18.2 32-18.4a6.9 6.9 0 0110.3 6v5.3c0 26.8 29 43.6 52.2 30.2l35.1-20.1 34.6-19.8a35 35 0 000-60.5zm-227 6.6l-81 167.3h-33.6l30.3-62.5L773 51.9h34.5l30.6 70.2 33.4-70.2H905zM95.1 111.3c0-20-14.5-34-32.3-34s-32.3 14.3-32.3 34c0 19.5 14.5 34 32.3 34s32.3-14 32.3-34m.3 59.4v-15.4a47.6 47.6 0 01-37.5 17.3C25.3 172.6.6 146.5.6 111.3c0-35 25.7-61.5 58-61.5 15.2 0 28 6.7 36.8 17v-15h29.2v118.9H95.4zm171.2-26.4c-10.2 0-13.1-3.8-13.1-13.8V77.8h18.8v-26h-18.8v-29h-29.9v29H185V40.2c0-10 3.8-13.8 14.3-13.8h6.6v-23h-14.4c-24.7 0-36.4 8-36.4 32.8V52h-16.6v25.8h16.6v92.9H185v-93h38.6V136c0 24.2 9.3 34.7 33.5 34.7h15.4v-26.4h-5.9zM374 100.6c-2.1-15.4-14.7-24.7-29.5-24.7-14.7 0-26.9 9-29.9 24.7H374zM314.3 119a29.6 29.6 0 0030.7 27.6c12.6 0 22.3-6 28-15.4h30.7c-7.1 25.2-29.7 41.3-59.4 41.3a58.5 58.5 0 01-61.1-61.1A60 60 0 01345 49.7a59.5 59.5 0 0160.4 69.4h-91.1zm282.2-7.8a33 33 0 00-32.3-34c-17.8 0-32.3 14.3-32.3 34 0 19.5 14.5 34 32.3 34a32.9 32.9 0 0032.3-34m-94.1 107.9V51.9h29.2v15.4a47.2 47.2 0 0137.5-17.6c32.1 0 57.3 26.4 57.3 61.3s-25.7 61.5-58 61.5a46 46 0 01-35.9-16v62.6h-30.1zm229.3-108c0-20-14.5-34-32.3-34-17.8 0-32.3 14.4-32.3 34s14.5 34 32.3 34c17.8 0 32.3-14 32.3-34m.3 59.5v-15.4a47.6 47.6 0 01-37.5 17.3c-32.6 0-57.3-26.1-57.3-61.3 0-35 25.7-61.5 58-61.5 15.2 0 28 6.7 36.8 17v-15h29.2v118.9H732zM449.7 63.5s7.4-13.8 25.7-13.8c7.8 0 12.8 2.7 12.8 2.7v30.3s-11-6.8-21.1-5.4c-10.1 1.4-16.5 10.6-16.5 23v70.3h-30.2V51.9h29.2v11.6h.1z\"></path>\n </svg>\n </div>\n </div>\n <div class=\"row-1\">\n <h3 class=\"afterpay-modal-headline\">Shop now. <span>Pay later.</span>\n <div>Always interest-free.</div>\n </h3>\n </div>\n <div class=\"process-step-1 process-icon-container\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"0 0 52 72\" class=\"process-icon shopping-cart\" aria-label=\"Step 1\">\n <path class=\"c1\" d=\"M26 55.47a27.28 27.28 0 01-4-3c-2.13-1.87-4.52-4.49-4.44-7.36a5 5 0 01.37-1.75 4.27 4.27 0 018.13.25 4.27 4.27 0 018.13-.25 5 5 0 01.37 1.75c.08 2.87-2.31 5.49-4.44 7.36a27.28 27.28 0 01-4 3\"></path>\n <path class=\"c1\" fill=\"#000\" d=\"M10.5 35V17a15.5 15.5 0 0131 0v18\"></path>\n <path class=\"c1\" transform=\"rotate(90 85.5 -4.5)\" d=\"M110.5 30.5h45.79a4.21 4.21 0 014.21 4.21v40.58a4.21 4.21 0 01-4.21 4.21H110.5v-49z\"></path>\n </svg>\n </div>\n <div class=\"process-step-1 process-subheading\">Add your favourites to cart</div>\n <div class=\"process-step-2 process-icon-container\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"0 0 82 56\" class=\"process-icon afterpay-desktop\" aria-label=\"Step 2\">\n <path class=\"c1\" d=\"M36.5 52.49h9\"></path>\n <path class=\"c1\" d=\"M10.43 1.5h61.14a3.93 3.93 0 013.93 3.93V50.5h-69V5.43a3.93 3.93 0 013.93-3.93z\"></path>\n <path d=\"M54.75 17.52L50.3 15l-4.51-2.59a4.48 4.48 0 00-6.71 3.89v.58a.89.89 0 00.44.77l2.1 1.2a.86.86 0 001.3-.75v-1.41a.89.89 0 011.33-.77l4.12 2.37 4.11 2.36a.88.88 0 010 1.53l-4.11 2.36-4.12 2.36a.88.88 0 01-1.33-.76v-.69a4.48 4.48 0 00-6.71-3.89l-4.51 2.59-4.45 2.55a4.49 4.49 0 000 7.78L31.7 37l4.51 2.59a4.48 4.48 0 006.71-3.89v-.58a.88.88 0 00-.44-.77l-2.1-1.2a.86.86 0 00-1.3.75v1.38a.89.89 0 01-1.33.77l-4.12-2.37-4.11-2.36a.88.88 0 010-1.53l4.11-2.36 4.12-2.36a.88.88 0 011.33.76v.69a4.48 4.48 0 006.71 3.89l4.51-2.59 4.45-2.55a4.49 4.49 0 000-7.75z\"></path>\n <rect class=\"c1\" width=\"79\" height=\"4\" x=\"1.5\" y=\"50.49\" rx=\"2\"></rect>\n </svg>\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"0 0 52 82\" class=\"process-icon afterpay-mobile\" aria-label=\"Step 2\">\n <rect class=\"c1\" width=\"79\" height=\"49\" x=\"86.5\" y=\"16.5\" rx=\"4.21\" transform=\"rotate(90 76 -9)\"></rect>\n <path class=\"c1\" d=\"M1.49 10.5h49\"></path>\n <path class=\"c1\" d=\"M1.49 75.5h49\"></path>\n <path class=\"c1\" d=\"M21.49 6.5h9\"></path>\n <path d=\"M39.75 32.52L35.3 30l-4.51-2.59a4.48 4.48 0 00-6.71 3.89v.58a.89.89 0 00.44.77l2.1 1.2a.86.86 0 001.3-.75v-1.41a.89.89 0 011.33-.77l4.12 2.37 4.11 2.36a.88.88 0 010 1.53l-4.11 2.36-4.12 2.36a.88.88 0 01-1.33-.76v-.69a4.48 4.48 0 00-6.71-3.89l-4.51 2.59-4.45 2.55a4.49 4.49 0 000 7.78L16.7 52l4.51 2.59a4.48 4.48 0 006.71-3.89v-.58a.88.88 0 00-.44-.77l-2.1-1.2a.86.86 0 00-1.3.75v1.38a.89.89 0 01-1.33.77l-4.12-2.37-4.11-2.36a.88.88 0 010-1.53l4.11-2.36 4.12-2.36a.88.88 0 011.33.76v.69a4.48 4.48 0 006.71 3.89l4.51-2.59 4.45-2.55a4.49 4.49 0 000-7.75z\"></path>\n </svg>\n </div>\n <div class=\"process-step-2 process-subheading\">Select Afterpay at checkout</div>\n <div class=\"process-step-3 process-icon-container\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"0 0 82 56\" class=\"process-icon sign-up-desktop\" aria-label=\"Step 3\">\n <path class=\"c1\" d=\"M52.51 28.12l4.43 4.45L65.5 24\"></path>\n <circle class=\"c1\" cx=\"31\" cy=\"26\" r=\"14.5\"></circle>\n <circle class=\"c1\" cx=\"31\" cy=\"21.8\" r=\"6.09\"></circle>\n <path class=\"c1\" d=\"M20.92 36.42a8.43 8.43 0 018-5.8h4.2a8.45 8.45 0 018 5.8M36.5 52.49h9\"></path>\n <path class=\"c1\" d=\"M10.43 1.5h61.14a3.93 3.93 0 013.93 3.94V50.5h-69V5.45a3.93 3.93 0 013.93-3.93z\"></path>\n <rect class=\"c1\" width=\"79\" height=\"4\" x=\"1.5\" y=\"50.49\" rx=\"2\"></rect>\n </svg>\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"0 0 52 82\" class=\"process-icon sign-up-mobile\" aria-label=\"Step 3\">\n <rect class=\"c1\" width=\"79\" height=\"49\" x=\"86.5\" y=\"16.5\" rx=\"4.21\" transform=\"rotate(90 76 -9)\"></rect>\n <path class=\"c1\" d=\"M21.46 58.06l4.43 4.45 8.55-8.58M1.5 10.5h48.99M1.5 75.5h48.99M21.5 6.5h9\"></path>\n <circle class=\"c1\" cx=\"26\" cy=\"34\" r=\"14.5\"></circle>\n <circle class=\"c1\" cx=\"26\" cy=\"29.8\" r=\"6.09\"></circle>\n <path class=\"c1\" d=\"M15.93 44.42a8.43 8.43 0 018-5.8h4.2a8.45 8.45 0 018 5.79\"></path>\n </svg>\n </div>\n <div class=\"process-step-3 process-subheading\">Log into or create your Afterpay account, instant approval decision</div>\n <div class=\"process-step-4 process-icon-container\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"14 7 79 79\" class=\"process-icon four-payments\" aria-label=\"Step 4\">\n <path class=\"c1\" d=\"M50,15.5A34.5,34.5,0,0,0,15.5,50H50Z\"></path>\n <path class=\"c1\" d=\"M15.5,50A34.5,34.5,0,0,0,50,84.5V50Z\"></path>\n <path class=\"c1\" d=\"M50,84.5h0A34.5,34.5,0,0,0,84.5,50H50Z\"></path>\n <path class=\"c1\" d=\"M57,8.5h0V43h34.5A34.5,34.5,0,0,0,57,8.5Z\"></path>\n </svg>\n </div>\n <div class=\"process-step-4 process-subheading\">Your purchase will be split into 4 payments, payable every 2 weeks</div>\n <div class=\"row-3\">\n <div class=\"disclaimer\">You must be of the age of majority in your province or territory, a resident of Canada, and meet additional eligibility criteria to qualify. Estimated payment amounts shown on product pages exclude taxes and shipping charges, which are added at checkout. Click <a href=\"https://www.afterpay.com/en-CA/instalment-agreement\" aria-label=\"Afterpay Terms (New Window)\" target=\"_blank\" rel=\"noopener\" class=\"disclaimer-link\" tabindex=\"1\">here</a> for complete terms. <br>\n <br>\n <span>© 2020 Afterpay Canada</span>\n </div>\n </div>\n </div>\n </div>\n <style type=\"text/css\">\n body.afterpay-modal-body,\n html.afterpay-modal-html {\n height: 100%\n }\n\n body.afterpay-modal-body {\n margin: 0;\n background-color: #b2fce4\n }\n\n body.afterpay-modal-body.theme-white {\n background: #fff\n }\n\n :-moz-ui-invalid:not(output) {\n box-shadow: none\n }\n\n .afterpay-modal-wrapper {\n min-height: 100%;\n padding: 0 24px;\n background: #b2fce4\n }\n\n .afterpay-modal-wrapper.theme-white {\n background: #fff\n }\n\n .afterpay-modal-wrapper {\n box-sizing: border-box;\n text-decoration: none;\n font-family: 'Italian Plate No2 Expanded', sans-serif;\n color: #000\n }\n\n .grid-container {\n display: grid;\n margin: 0 auto;\n max-width: 800px;\n text-align: center;\n font-size: 16px;\n grid-template-rows: auto;\n grid-template-columns: repeat(4, 25%);\n grid-template-areas: \"logo logo logo logo\"\"headline headline headline headline\"\"body-a body-b body-c body-d\"\"body-e body-f body-g body-h\"\"cbt-block cbt-block cbt-block cbt-block\"\"footer footer footer footer\"\n }\n\n .row-0 {\n grid-area: logo;\n padding-top: 45px\n }\n\n .row-1 {\n grid-area: headline;\n padding: 3% 0 8% 0\n }\n\n .process-step-1.process-icon-container {\n grid-area: body-a\n }\n\n .process-step-2.process-icon-container {\n grid-area: body-b\n }\n\n .process-step-3.process-icon-container {\n grid-area: body-c\n }\n\n .process-step-4.process-icon-container {\n grid-area: body-d\n }\n\n .process-step-1.process-subheading {\n grid-area: body-e\n }\n\n .process-step-2.process-subheading {\n grid-area: body-f\n }\n\n .process-step-3.process-subheading {\n grid-area: body-g\n }\n\n .process-step-4.process-subheading {\n grid-area: body-h\n }\n\n .row-3 {\n grid-area: footer\n }\n\n .grid-container>div {\n align-content: stretch\n }\n\n .afterpay-modal-logo svg {\n width: 100%;\n max-width: 275px;\n height: auto\n }\n\n h3.afterpay-modal-headline {\n margin: 0;\n font-size: 44px;\n font-weight: 600;\n line-height: 1.1\n }\n\n .process-icon-container {\n align-self: end\n }\n\n .process-icon-container svg {\n width: auto;\n height: auto;\n max-width: 110px;\n max-height: 95px\n }\n\n .process-icon-container svg .c1 {\n fill: none;\n stroke: #000;\n stroke-linecap: round;\n stroke-linejoin: round;\n stroke-width: 2px\n }\n\n .process-subheading {\n padding: 10% 3% 0 3%;\n font-weight: 600;\n line-height: 1.25\n }\n\n svg.afterpay-mobile,\n svg.sign-up-mobile {\n display: none\n }\n\n .row-3 {\n padding: 8% 0 40px 0\n }\n\n .disclaimer {\n font-size: 12px\n }\n\n .disclaimer-link {\n color: #000;\n text-decoration: underline\n }\n\n .disclaimer-link:active {\n color: #000\n }\n\n .afterpay-footer-example {\n margin-top: 1.875em;\n font-size: x-small;\n font-weight: 600\n }\n\n .afterpay-underline {\n text-decoration: underline\n }\n\n .afterpay-bold {\n font-weight: 700\n }\n\n .afterpay-reference-symbol {\n font-weight: 400;\n font-size: .5em;\n vertical-align: text-top\n }\n\n @media (max-width:768px) {\n .grid-container {\n max-width: 500px;\n grid-template-columns: auto;\n grid-template-areas: \"logo logo\"\"headline headline\"\"body-a body-b\"\"body-e body-f\"\"body-c body-d\"\"body-g body-h\"\"cbt-block cbt-block\"\"footer footer\"\n }\n\n .row-1 {\n padding: 3% 0 20px 0\n }\n\n .process-icon-container {\n padding: 24px 0 0 0\n }\n }\n\n @media (max-width:600px) {\n .afterpay-modal-wrapper {\n padding: 0\n }\n\n .grid-container {\n padding: 30px;\n text-align: left;\n grid-template-columns: auto;\n grid-template-areas: \"logo logo\"\"headline headline\"\"body-a body-e\"\"body-b body-f\"\"body-c body-g\"\"body-d body-h\"\"cbt-block cbt-block\"\"footer footer\"\n }\n\n .row-0 {\n padding-top: 0\n }\n\n .row-1 {\n padding: 20px 0 8% 0\n }\n\n h3.afterpay-modal-headline {\n font-size: 40px\n }\n\n svg.afterpay-desktop,\n svg.sign-up-desktop {\n display: none\n }\n\n svg.afterpay-mobile,\n svg.sign-up-mobile {\n display: block\n }\n\n .process-icon-container {\n align-self: start;\n padding: 12px 0\n }\n\n .process-icon-container svg {\n min-width: 30px;\n max-height: 65px\n }\n\n .process-subheading {\n padding: 6px 0 6px 12px;\n align-self: center\n }\n\n .row-3 {\n padding: 8% 0 20px 0\n }\n }\n\n @media (max-width:420px) {\n .afterpay-modal-logo svg {\n max-width: 200px\n }\n\n h3.afterpay-modal-headline {\n font-size: 36px\n }\n }\n\n @media (max-width:335px) {\n h3.afterpay-modal-headline {\n font-size: 32px\n }\n }\n\n @media (max-width:260px) {\n .grid-container {\n font-size: 14px\n }\n\n h3.afterpay-modal-headline {\n font-size: 28px\n }\n }\n </style>\n <style type=\"text/css\">\n @media (-ms-high-contrast:none),\n (-ms-high-contrast:active) {\n .afterpay-modal-wrapper .grid-container {\n display: -ms-grid;\n -ms-grid-rows: auto;\n -ms-grid-columns: (25%)[4];\n font-size: 14px\n }\n\n .afterpay-modal-wrapper .grid-container .row-0 {\n -ms-grid-row: 1;\n -ms-grid-column: 1;\n -ms-grid-column-span: 4;\n padding-top: 0\n }\n\n .afterpay-modal-wrapper .grid-container .row-0 .afterpay-modal-logo svg {\n height: 15vh\n }\n\n .afterpay-modal-wrapper .grid-container .row-1 {\n -ms-grid-row: 2;\n -ms-grid-column: 1;\n -ms-grid-column-span: 4;\n padding: 20px 0 45px 0\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-1.process-icon-container {\n -ms-grid-row: 3;\n -ms-grid-column: 1\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-2.process-icon-container {\n -ms-grid-row: 3;\n -ms-grid-column: 2\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-3.process-icon-container {\n -ms-grid-row: 3;\n -ms-grid-column: 3\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-4.process-icon-container {\n -ms-grid-row: 3;\n -ms-grid-column: 4;\n grid-area: body-d\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-1.process-subheading {\n -ms-grid-row: 4;\n -ms-grid-column: 1;\n grid-area: body-e\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-2.process-subheading {\n -ms-grid-row: 4;\n -ms-grid-column: 2;\n grid-area: body-f\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-3.process-subheading {\n -ms-grid-row: 4;\n -ms-grid-column: 3\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-4.process-subheading {\n -ms-grid-row: 4;\n -ms-grid-column: 4\n }\n\n .afterpay-modal-wrapper .grid-container .row-3 {\n -ms-grid-row: 5;\n -ms-grid-column: 1;\n -ms-grid-column-span: 4;\n padding: 80px 0 40px 0\n }\n }\n </style>\n <script id=\"post-events-to-parent\">\n ! function() {\n try {\n var t = window && window.parent;\n t && t !== window.self && \"function\" == typeof t.postMessage && (t.postMessage(\"Afterpay.ready\", \"\"), document.addEventListener(\"keyup\", function(e) {\n e = e.key \|\| e.keyCode;\n \"Escape\" !== e && \"Esc\" !== e && 27 !== e \|\| t.postMessage(\"Afterpay.keyup.esc\", \"\")\n }))\n } catch (e) {}\n }()\n </script>\n </div>\n </div>\n</div>\n</div>`\n\nexport default apModalEnglishHTML\n","const apModalFrenchHTML = `<div id=\"afterpay-modal-component\">\n<style>\n .afterpay-modal-overlay {\n position: fixed;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.5);\n opacity: 0;\n visibility: hidden;\n transform: scale(1.1);\n transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;\n z-index: 999999999;\n }\n\n #afterpay-modal-component .visible {\n opacity: 1;\n visibility: visible;\n transform: scale(1);\n transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;\n }\n\n #afterpay-modal-component #afterpay-modal {\n background-color: #fff;\n color: #000;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n border-radius: 2px;\n width: 774px;\n max-width: 100vw;\n max-height: 100%;\n line-height: 1.1;\n display: block;\n overflow: auto;\n }\n\n #afterpay-modal-component #afterpay-modal.afterpay-modal-is-apr {\n border-radius: 0px;\n max-width: 100%;\n width: 476px;\n }\n\n @media (min-width:473px) and (min-height:686px) {\n #afterpay-modal-component #afterpay-modal.afterpay-modal-is-apr {\n border-radius: 12px;\n }\n }\n\n #afterpay-modal-component #afterpay-modal .afterpay-close-button {\n position: absolute;\n z-index: 3;\n background-color: transparent;\n min-width: 0;\n top: 18px;\n right: 18px;\n border: 0;\n cursor: pointer;\n }\n\n #afterpay-modal-component button {\n min-width: 80px;\n background-color: #848e97;\n border-color: #848e97;\n border-style: solid;\n border-radius: 2px;\n padding: 3px;\n color: white;\n cursor: pointer;\n display: none;\n }\n\n #afterpay-modal-component button:hover {\n background-color: #6c757d;\n border-color: #6c757d;\n }\n\n .afterpay-loading-indicator {\n display: block;\n background-color: transparent;\n width: 80px;\n position: absolute;\n left: 50%;\n top: 50%;\n }\n\n .afterpay-loading-indicator::after {\n content: \" \";\n display: block;\n width: 40px;\n height: 40px;\n border-radius: 50%;\n border: 5px solid #b2fce4;\n border-color: #b2fce4 transparent #b2fce4 transparent;\n animation: afterpay-loading-indicator 1.2s linear infinite;\n }\n\n @keyframes afterpay-loading-indicator {\n 0% {\n transform: rotate(0deg);\n }\n\n 100% {\n transform: rotate(360deg);\n }\n }\n\n .modal-content .error-container {\n padding: 25px;\n text-align: center;\n background-color: #b2fce4;\n opacity: 0;\n visibility: hidden;\n }\n\n .modal-content.error .error-container {\n opacity: 1;\n visibility: visible;\n font-family: 'Italian Plate No2 Expanded', sans-serif;\n }\n\n @media (-ms-high-contrast:none),\n (-ms-high-contrast:active) {\n #afterpay-modal-component #afterpay-modal {\n bottom: auto;\n }\n }\n</style>\n<div class=\"afterpay-modal-overlay visible\">\n <div class=\"afterpay-loading-indicator\" style=\"display: none;\"></div>\n <div id=\"afterpay-modal\" role=\"dialog\" tabindex=\"-1\" aria-modal=\"true\" aria-describedby=\"afterpay-modal-container\" aria-label=\"Afterpay\">\n <button class=\"afterpay-close-button\" id=\"afterpay-modal-close-button\" tabindex=\"1\" autofocus=\"false\" aria-label=\"Bouton de fermeture modal Afterpay\" style=\"display: block;\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" focusable=\"false\" width=\"20\" height=\"20\" viewBox=\"0 0 30 30\" aria-hidden=\"true\">\n <defs>\n <style>\n .a {\n fill: none;\n stroke: #808284;\n stroke-linecap: round;\n stroke-linejoin: round;\n stroke-width: 2px;\n }\n </style>\n </defs>\n <title>Bouton de fermeture modal Afterpay</title>\n <line class=\"a\" x1=\"1\" y1=\"1\" x2=\"29\" y2=\"29\"></line>\n <line class=\"a\" x1=\"1\" y1=\"29\" x2=\"29\" y2=\"1\"></line>\n </svg>\n </button>\n <div class=\"modal-content\">\n <div id=\"afterpay-modal-container\" class=\"afterpay-modal-wrapper\">\n <div class=\"grid-container\">\n <div class=\"row-0\">\n <div class=\"afterpay-modal-logo\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"0 0 1150 222\" class=\"afterpay-logo-black\" aria-label=\"Afterpay logo\">\n <path d=\"M1132 45.3l-34.6-19.8-35.1-20.1a34.9 34.9 0 00-52.2 30.2V40c0 2.5 1.3 4.8 3.5 6l16.3 9.3a6.8 6.8 0 0010.1-6V38.9c0-5.3 5.7-8.6 10.3-6l32 18.4 31.9 18.3a6.9 6.9 0 010 11.9l-31.9 18.3-32 18.4a6.9 6.9 0 01-10.3-6v-5.3c0-26.8-29-43.6-52.2-30.2l-35.1 20-34.6 19.9a35 35 0 000 60.5l34.6 19.8 35.1 20a34.9 34.9 0 0052.2-30.1v-4.5c0-2.5-1.3-4.8-3.5-6l-16.3-9.3a6.8 6.8 0 00-10.1 5.9v10.7c0 5.3-5.7 8.6-10.3 6l-32-18.4-31.9-18.3a6.9 6.9 0 010-12l31.9-18.2 32-18.4a6.9 6.9 0 0110.3 6v5.3c0 26.8 29 43.6 52.2 30.2l35.1-20.1 34.6-19.8a35 35 0 000-60.5zm-227 6.6l-81 167.3h-33.6l30.3-62.5L773 51.9h34.5l30.6 70.2 33.4-70.2H905zM95.1 111.3c0-20-14.5-34-32.3-34s-32.3 14.3-32.3 34c0 19.5 14.5 34 32.3 34s32.3-14 32.3-34m.3 59.4v-15.4a47.6 47.6 0 01-37.5 17.3C25.3 172.6.6 146.5.6 111.3c0-35 25.7-61.5 58-61.5 15.2 0 28 6.7 36.8 17v-15h29.2v118.9H95.4zm171.2-26.4c-10.2 0-13.1-3.8-13.1-13.8V77.8h18.8v-26h-18.8v-29h-29.9v29H185V40.2c0-10 3.8-13.8 14.3-13.8h6.6v-23h-14.4c-24.7 0-36.4 8-36.4 32.8V52h-16.6v25.8h16.6v92.9H185v-93h38.6V136c0 24.2 9.3 34.7 33.5 34.7h15.4v-26.4h-5.9zM374 100.6c-2.1-15.4-14.7-24.7-29.5-24.7-14.7 0-26.9 9-29.9 24.7H374zM314.3 119a29.6 29.6 0 0030.7 27.6c12.6 0 22.3-6 28-15.4h30.7c-7.1 25.2-29.7 41.3-59.4 41.3a58.5 58.5 0 01-61.1-61.1A60 60 0 01345 49.7a59.5 59.5 0 0160.4 69.4h-91.1zm282.2-7.8a33 33 0 00-32.3-34c-17.8 0-32.3 14.3-32.3 34 0 19.5 14.5 34 32.3 34a32.9 32.9 0 0032.3-34m-94.1 107.9V51.9h29.2v15.4a47.2 47.2 0 0137.5-17.6c32.1 0 57.3 26.4 57.3 61.3s-25.7 61.5-58 61.5a46 46 0 01-35.9-16v62.6h-30.1zm229.3-108c0-20-14.5-34-32.3-34-17.8 0-32.3 14.4-32.3 34s14.5 34 32.3 34c17.8 0 32.3-14 32.3-34m.3 59.5v-15.4a47.6 47.6 0 01-37.5 17.3c-32.6 0-57.3-26.1-57.3-61.3 0-35 25.7-61.5 58-61.5 15.2 0 28 6.7 36.8 17v-15h29.2v118.9H732zM449.7 63.5s7.4-13.8 25.7-13.8c7.8 0 12.8 2.7 12.8 2.7v30.3s-11-6.8-21.1-5.4c-10.1 1.4-16.5 10.6-16.5 23v70.3h-30.2V51.9h29.2v11.6h.1z\"></path>\n </svg>\n </div>\n </div>\n <div class=\"row-1\">\n <h3 class=\"afterpay-modal-headline\">Magasinez maintenant. <span>Payez plus tard.</span>\n <div>Toujours sans intérêts.</div>\n </h3>\n </div>\n <div class=\"process-step-1 process-icon-container\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"0 0 52 72\" class=\"process-icon shopping-cart\" aria-label=\"Step 1\">\n <path class=\"c1\" d=\"M26 55.47a27.28 27.28 0 01-4-3c-2.13-1.87-4.52-4.49-4.44-7.36a5 5 0 01.37-1.75 4.27 4.27 0 018.13.25 4.27 4.27 0 018.13-.25 5 5 0 01.37 1.75c.08 2.87-2.31 5.49-4.44 7.36a27.28 27.28 0 01-4 3\"></path>\n <path class=\"c1\" fill=\"#000\" d=\"M10.5 35V17a15.5 15.5 0 0131 0v18\"></path>\n <path class=\"c1\" transform=\"rotate(90 85.5 -4.5)\" d=\"M110.5 30.5h45.79a4.21 4.21 0 014.21 4.21v40.58a4.21 4.21 0 01-4.21 4.21H110.5v-49z\"></path>\n </svg>\n </div>\n <div class=\"process-step-1 process-subheading\">Ajoutez votre liste de souhaits au panier.</div>\n <div class=\"process-step-2 process-icon-container\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"0 0 82 56\" class=\"process-icon afterpay-desktop\" aria-label=\"Step 2\">\n <path class=\"c1\" d=\"M36.5 52.49h9\"></path>\n <path class=\"c1\" d=\"M10.43 1.5h61.14a3.93 3.93 0 013.93 3.93V50.5h-69V5.43a3.93 3.93 0 013.93-3.93z\"></path>\n <path d=\"M54.75 17.52L50.3 15l-4.51-2.59a4.48 4.48 0 00-6.71 3.89v.58a.89.89 0 00.44.77l2.1 1.2a.86.86 0 001.3-.75v-1.41a.89.89 0 011.33-.77l4.12 2.37 4.11 2.36a.88.88 0 010 1.53l-4.11 2.36-4.12 2.36a.88.88 0 01-1.33-.76v-.69a4.48 4.48 0 00-6.71-3.89l-4.51 2.59-4.45 2.55a4.49 4.49 0 000 7.78L31.7 37l4.51 2.59a4.48 4.48 0 006.71-3.89v-.58a.88.88 0 00-.44-.77l-2.1-1.2a.86.86 0 00-1.3.75v1.38a.89.89 0 01-1.33.77l-4.12-2.37-4.11-2.36a.88.88 0 010-1.53l4.11-2.36 4.12-2.36a.88.88 0 011.33.76v.69a4.48 4.48 0 006.71 3.89l4.51-2.59 4.45-2.55a4.49 4.49 0 000-7.75z\"></path>\n <rect class=\"c1\" width=\"79\" height=\"4\" x=\"1.5\" y=\"50.49\" rx=\"2\"></rect>\n </svg>\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"0 0 52 82\" class=\"process-icon afterpay-mobile\" aria-label=\"Step 2\">\n <rect class=\"c1\" width=\"79\" height=\"49\" x=\"86.5\" y=\"16.5\" rx=\"4.21\" transform=\"rotate(90 76 -9)\"></rect>\n <path class=\"c1\" d=\"M1.49 10.5h49\"></path>\n <path class=\"c1\" d=\"M1.49 75.5h49\"></path>\n <path class=\"c1\" d=\"M21.49 6.5h9\"></path>\n <path d=\"M39.75 32.52L35.3 30l-4.51-2.59a4.48 4.48 0 00-6.71 3.89v.58a.89.89 0 00.44.77l2.1 1.2a.86.86 0 001.3-.75v-1.41a.89.89 0 011.33-.77l4.12 2.37 4.11 2.36a.88.88 0 010 1.53l-4.11 2.36-4.12 2.36a.88.88 0 01-1.33-.76v-.69a4.48 4.48 0 00-6.71-3.89l-4.51 2.59-4.45 2.55a4.49 4.49 0 000 7.78L16.7 52l4.51 2.59a4.48 4.48 0 006.71-3.89v-.58a.88.88 0 00-.44-.77l-2.1-1.2a.86.86 0 00-1.3.75v1.38a.89.89 0 01-1.33.77l-4.12-2.37-4.11-2.36a.88.88 0 010-1.53l4.11-2.36 4.12-2.36a.88.88 0 011.33.76v.69a4.48 4.48 0 006.71 3.89l4.51-2.59 4.45-2.55a4.49 4.49 0 000-7.75z\"></path>\n </svg>\n </div>\n <div class=\"process-step-2 process-subheading\">Sélectionnez Afterpay lors de l'achat.</div>\n <div class=\"process-step-3 process-icon-container\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"0 0 82 56\" class=\"process-icon sign-up-desktop\" aria-label=\"Step 3\">\n <path class=\"c1\" d=\"M52.51 28.12l4.43 4.45L65.5 24\"></path>\n <circle class=\"c1\" cx=\"31\" cy=\"26\" r=\"14.5\"></circle>\n <circle class=\"c1\" cx=\"31\" cy=\"21.8\" r=\"6.09\"></circle>\n <path class=\"c1\" d=\"M20.92 36.42a8.43 8.43 0 018-5.8h4.2a8.45 8.45 0 018 5.8M36.5 52.49h9\"></path>\n <path class=\"c1\" d=\"M10.43 1.5h61.14a3.93 3.93 0 013.93 3.94V50.5h-69V5.45a3.93 3.93 0 013.93-3.93z\"></path>\n <rect class=\"c1\" width=\"79\" height=\"4\" x=\"1.5\" y=\"50.49\" rx=\"2\"></rect>\n </svg>\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"0 0 52 82\" class=\"process-icon sign-up-mobile\" aria-label=\"Step 3\">\n <rect class=\"c1\" width=\"79\" height=\"49\" x=\"86.5\" y=\"16.5\" rx=\"4.21\" transform=\"rotate(90 76 -9)\"></rect>\n <path class=\"c1\" d=\"M21.46 58.06l4.43 4.45 8.55-8.58M1.5 10.5h48.99M1.5 75.5h48.99M21.5 6.5h9\"></path>\n <circle class=\"c1\" cx=\"26\" cy=\"34\" r=\"14.5\"></circle>\n <circle class=\"c1\" cx=\"26\" cy=\"29.8\" r=\"6.09\"></circle>\n <path class=\"c1\" d=\"M15.93 44.42a8.43 8.43 0 018-5.8h4.2a8.45 8.45 0 018 5.79\"></path>\n </svg>\n </div>\n <div class=\"process-step-3 process-subheading\">Connectez-vous ou créer votre compte Afterpay, réponse instantanée.</div>\n <div class=\"process-step-4 process-icon-container\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" role=\"img\" viewBox=\"14 7 79 79\" class=\"process-icon four-payments\" aria-label=\"Step 4\">\n <path class=\"c1\" d=\"M50,15.5A34.5,34.5,0,0,0,15.5,50H50Z\"></path>\n <path class=\"c1\" d=\"M15.5,50A34.5,34.5,0,0,0,50,84.5V50Z\"></path>\n <path class=\"c1\" d=\"M50,84.5h0A34.5,34.5,0,0,0,84.5,50H50Z\"></path>\n <path class=\"c1\" d=\"M57,8.5h0V43h34.5A34.5,34.5,0,0,0,57,8.5Z\"></path>\n </svg>\n </div>\n <div class=\"process-step-4 process-subheading\">4 paiements échelonnés, toutes les 2 semaines.</div>\n <div class=\"row-3\">\n <div class=\"disclaimer\">Vous devez avoir l'âge de la majorité établie dans votre province ou territoire et être un résident du Canada. Des critères d'éligibilité supplémentaires sont applicables. <br>\n <br>Les montants estimés figurant sur les pages de produits ne comprennent pas les taxes et les frais d'expédition, qui sont ajoutés lors du passage en caisse. Cliquez <a href=\"https://www.afterpay.com/fr-CA/instalment-agreement\" aria-label=\"Lire les mentions légales de Afterpay (Nouvelle fenêtre)\" target=\"_blank\" rel=\"noopener\" class=\"disclaimer-link\" tabindex=\"1\">ici</a> pour consulter les mentions légales. <span>© 2020 Afterpay Canada</span>\n </div>\n </div>\n </div>\n </div>\n <style type=\"text/css\">\n body.afterpay-modal-body,\n html.afterpay-modal-html {\n height: 100%\n }\n\n body.afterpay-modal-body {\n margin: 0;\n background-color: #b2fce4\n }\n\n body.afterpay-modal-body.theme-white {\n background: #fff\n }\n\n :-moz-ui-invalid:not(output) {\n box-shadow: none\n }\n\n .afterpay-modal-wrapper {\n min-height: 100%;\n padding: 0 24px;\n background: #b2fce4\n }\n\n .afterpay-modal-wrapper.theme-white {\n background: #fff\n }\n\n .afterpay-modal-wrapper * {\n box-sizing: border-box;\n text-decoration: none;\n font-family: 'Italian Plate No2 Expanded', sans-serif;\n color: #000\n }\n\n .grid-container {\n display: grid;\n margin: 0 auto;\n max-width: 800px;\n text-align: center;\n font-size: 16px;\n grid-template-rows: auto;\n grid-template-columns: repeat(4, 25%);\n grid-template-areas: \"logo logo logo logo\"\"headline headline headline headline\"\"body-a body-b body-c body-d\"\"body-e body-f body-g body-h\"\"cbt-block cbt-block cbt-block cbt-block\"\"footer footer footer footer\"\n }\n\n .row-0 {\n grid-area: logo;\n padding-top: 45px\n }\n\n .row-1 {\n grid-area: headline;\n padding: 3% 0 8% 0\n }\n\n .process-step-1.process-icon-container {\n grid-area: body-a\n }\n\n .process-step-2.process-icon-container {\n grid-area: body-b\n }\n\n .process-step-3.process-icon-container {\n grid-area: body-c\n }\n\n .process-step-4.process-icon-container {\n grid-area: body-d\n }\n\n .process-step-1.process-subheading {\n grid-area: body-e\n }\n\n .process-step-2.process-subheading {\n grid-area: body-f\n }\n\n .process-step-3.process-subheading {\n grid-area: body-g\n }\n\n .process-step-4.process-subheading {\n grid-area: body-h\n }\n\n .row-3 {\n grid-area: footer\n }\n\n .grid-container>div {\n align-content: stretch\n }\n\n .afterpay-modal-logo svg {\n width: 100%;\n max-width: 275px;\n height: auto\n }\n\n h3.afterpay-modal-headline {\n margin: 0;\n font-size: 44px;\n font-weight: 600;\n line-height: 1.1\n }\n\n .process-icon-container {\n align-self: end\n }\n\n .process-icon-container svg {\n width: auto;\n height: auto;\n max-width: 110px;\n max-height: 95px\n }\n\n .process-icon-container svg .c1 {\n fill: none;\n stroke: #000;\n stroke-linecap: round;\n stroke-linejoin: round;\n stroke-width: 2px\n }\n\n .process-subheading {\n padding: 10% 3% 0 3%;\n font-weight: 600;\n line-height: 1.25\n }\n\n svg.afterpay-mobile,\n svg.sign-up-mobile {\n display: none\n }\n\n .row-3 {\n padding: 8% 0 40px 0\n }\n\n .disclaimer {\n font-size: 12px\n }\n\n .disclaimer-link {\n color: #000;\n text-decoration: underline\n }\n\n .disclaimer-link:active {\n color: #000\n }\n\n .afterpay-footer-example {\n margin-top: 1.875em;\n font-size: x-small;\n font-weight: 600\n }\n\n .afterpay-underline {\n text-decoration: underline\n }\n\n .afterpay-bold {\n font-weight: 700\n }\n\n .afterpay-reference-symbol {\n font-weight: 400;\n font-size: .5em;\n vertical-align: text-top\n }\n\n .footer-terms {\n margin: 1.875em auto 0;\n font-size: x-small;\n color: #888d8d\n }\n\n .afterpay-footer-example {\n margin: inherit\n }\n\n @media (min-width:700px) {\n .process-step-4 .process-subheading {\n max-width: 170px\n }\n }\n\n @media (max-width:768px) {\n .grid-container {\n max-width: 500px;\n grid-template-columns: auto;\n grid-template-areas: \"logo logo\"\"headline headline\"\"body-a body-b\"\"body-e body-f\"\"body-c body-d\"\"body-g body-h\"\"cbt-block cbt-block\"\"footer footer\"\n }\n\n .row-1 {\n padding: 3% 0 20px 0\n }\n\n .process-icon-container {\n padding: 24px 0 0 0\n }\n }\n\n @media (max-width:600px) {\n .afterpay-modal-wrapper {\n padding: 0\n }\n\n .grid-container {\n padding: 30px;\n text-align: left;\n grid-template-columns: auto;\n grid-template-areas: \"logo logo\"\"headline headline\"\"body-a body-e\"\"body-b body-f\"\"body-c body-g\"\"body-d body-h\"\"cbt-block cbt-block\"\"footer footer\"\n }\n\n .row-0 {\n padding-top: 0\n }\n\n .row-1 {\n padding: 20px 0 8% 0\n }\n\n h3.afterpay-modal-headline {\n font-size: 40px\n }\n\n svg.afterpay-desktop,\n svg.sign-up-desktop {\n display: none\n }\n\n svg.afterpay-mobile,\n svg.sign-up-mobile {\n display: block\n }\n\n .process-icon-container {\n align-self: start;\n padding: 12px 0\n }\n\n h3.afterpay-modal-headline>p>span {\n padding: 2px 2px;\n display: table;\n text-align: center\n }\n\n .process-icon-container svg {\n max-height: 65px\n }\n\n .process-icon-container svg.four-payments {\n max-height: 55px\n }\n\n .process-subheading {\n padding: 6px 0 6px 5px;\n align-self: center\n }\n\n .row-3 {\n padding: 8% 0 20px 0\n }\n }\n\n @media (max-width:420px) {\n .afterpay-modal-logo svg {\n max-width: 200px\n }\n\n h3.afterpay-modal-headline {\n font-size: 36px\n }\n }\n\n @media (max-width:335px) {\n h3.afterpay-modal-headline {\n font-size: 32px\n }\n }\n\n @media (max-width:260px) {\n .grid-container {\n font-size: 14px\n }\n\n h3.afterpay-modal-headline {\n font-size: 28px\n }\n }\n </style>\n <style type=\"text/css\">\n @media (-ms-high-contrast:none),\n (-ms-high-contrast:active) {\n .afterpay-modal-wrapper .grid-container {\n display: -ms-grid;\n -ms-grid-rows: auto;\n -ms-grid-columns: (25%)[4];\n font-size: 14px\n }\n\n .afterpay-modal-wrapper .grid-container .row-0 {\n -ms-grid-row: 1;\n -ms-grid-column: 1;\n -ms-grid-column-span: 4;\n padding-top: 0\n }\n\n .afterpay-modal-wrapper .grid-container .row-0 .afterpay-modal-logo svg {\n height: 15vh\n }\n\n .afterpay-modal-wrapper .grid-container .row-1 {\n -ms-grid-row: 2;\n -ms-grid-column: 1;\n -ms-grid-column-span: 4;\n padding: 20px 0 45px 0\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-1.process-icon-container {\n -ms-grid-row: 3;\n -ms-grid-column: 1\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-2.process-icon-container {\n -ms-grid-row: 3;\n -ms-grid-column: 2\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-3.process-icon-container {\n -ms-grid-row: 3;\n -ms-grid-column: 3\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-4.process-icon-container {\n -ms-grid-row: 3;\n -ms-grid-column: 4;\n grid-area: body-d\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-1.process-subheading {\n -ms-grid-row: 4;\n -ms-grid-column: 1;\n grid-area: body-e\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-2.process-subheading {\n -ms-grid-row: 4;\n -ms-grid-column: 2;\n grid-area: body-f\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-3.process-subheading {\n -ms-grid-row: 4;\n -ms-grid-column: 3\n }\n\n .afterpay-modal-wrapper .grid-container .process-step-4.process-subheading {\n -ms-grid-row: 4;\n -ms-grid-column: 4\n }\n\n .afterpay-modal-wrapper .grid-container .row-3 {\n -ms-grid-row: 5;\n -ms-grid-column: 1;\n -ms-grid-column-span: 4;\n padding: 80px 0 40px 0\n }\n }\n </style>\n <script id=\"post-events-to-parent\">\n ! function() {\n try {\n var t = window && window.parent;\n t && t !== window.self && \"function\" == typeof t.postMessage && (t.postMessage(\"Afterpay.ready\", \"\"), document.addEventListener(\"keyup\", function(e) {\n e = e.key \|\| e.keyCode;\n \"Escape\" !== e && \"Esc\" !== e && 27 !== e \|\| t.postMessage(\"Afterpay.keyup.esc\", \"\")\n }))\n } catch (e) {}\n }()\n </script>\n </div>\n </div>\n</div>\n</div>`\n\nexport default apModalFrenchHTML\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport { getSupportedLanguage } from '../Helpers/helper'\nimport modalEnglishHTML from '../assets/Modals/modals-4.0.4/modal-en.js'\nimport modalFrenchHTML from '../assets/Modals/modals-4.0.4/modal-fr.js'\nimport apModalEnglishHTML from '../assets/Modals/apModal-en.js'\nimport apModalFrenchHTML from '../assets/Modals/apModal-fr.js'\n\nexport default class Modal extends React.Component {\n constructor(props) {\n super(props)\n this.state = {\n modalElement: null,\n isModalVisible: false\n }\n }\n\n static getDerivedStateFromProps(props, state) {\n if (!state.modalElement) {\n const modalElement = document.createElement('div')\n const currentLang = getSupportedLanguage()\n switch (props.modalType) {\n case 'afterpay':\n modalElement.className = 'sezzle-checkout-modal-lightbox close-sezzle-modal sezzle-ap-modal'\n modalElement.innerHTML = currentLang === 'fr' ? apModalFrenchHTML : apModalEnglishHTML\n break\n default:\n modalElement.className = 'sezzle-checkout-modal-lightbox close-sezzle-modal'\n modalElement.innerHTML = currentLang === 'fr' ? modalFrenchHTML : modalEnglishHTML\n }\n state = { ...state, modalElement }\n }\n state.modalElement.style.display = state.isModalVisible ? 'block' : 'none'\n return state\n }\n\n componentDidMount() {\n document.querySelector('html').appendChild(this.state.modalElement)\n\n let sezzleModal\n if (this.props.modalType === 'afterpay') {\n sezzleModal = document.querySelector('.sezzle-ap-modal')\n } else {\n sezzleModal = document.querySelector('.sezzle-modal')\n }\n\n sezzleModal.addEventListener('click', (event) => event.stopPropagation())\n document.querySelectorAll('.close-sezzle-modal').length && document.querySelectorAll('.close-sezzle-modal').forEach((modal) => modal.addEventListener('click', (event) => this.modalCloseHandler(event)))\n }\n\n componentDidUpdate(prevProps, prevState) {\n this.toggleModalVisibility(this.props.toggleModalVisibility)\n }\n\n componentWillUnmount() {\n const modals = document.querySelector('html').getElementsByClassName('sezzle-checkout-modal-lightbox')\n for (let i = 0; i < modals.length; i++) {\n document.querySelector('html').removeChild(modals[i])\n }\n }\n\n toggleModalVisibility = (isModalVisible) => {\n if (isModalVisible !== this.state.isModalVisible) {\n this.setState({ ...this.state, isModalVisible })\n }\n }\n\n modalCloseHandler = (event) => {\n this.props.callbackModalClose(this.props.modalType)\n }\n\n render() {\n return null\n }\n}\n\nModal.propTypes = {\n toggleModalVisibility: PropTypes.bool,\n modalType: PropTypes.string,\n callbackModalClose: PropTypes.func\n}\n","function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css \|\| typeof document === 'undefined') { return; }\n\n var head = document.head \|\| document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport { getSupportedLanguage } from '../Helpers/helper'\nimport { getFormattedPrice } from '../Helpers/renderFunctions'\nimport Modal from './Modal'\nimport '../index.css'\n\nexport default class SezzleWidgetText extends React.Component {\n constructor(props) {\n super(props)\n this.state = {\n config: this.props.config,\n sezzle: false,\n afterpay: false,\n modalsToShow: ['sezzle', 'afterpay']\n }\n }\n\n static getDerivedStateFromProps(props, state) {\n const config = props.config\n state = { ...state, config }\n\n return state\n }\n\n renderSezzleWidgetText() {\n const numberOfPayments = 4\n const logoURLs = {\n light: 'https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor.svg',\n dark: 'https://media.sezzle.com/branding/2.0/Sezzle_Logo_FullColor_WhiteWM.svg',\n 'black-flat': 'https://media.sezzle.com/branding/2.0/Sezzle_Logo_BlackAlt.svg',\n 'white-flat': 'https://media.sezzle.com/branding/2.0/Sezzle_Logo_WhiteAlt.svg'\n }\n const template = {\n en: `or ${numberOfPayments} interest-free payments of %%price%% with %%logo%%%%afterpay%%%%min-price%% %%info%%`,\n fr: `ou ${numberOfPayments} paiements de %%price%% sans intérêts avec %%logo%%%%afterpay%%%%min-price%% %%info%%`\n }\n const clickHere = {\n en: 'Click here to learn more about Sezzle',\n fr: 'Cliquez ici pour en savoir plus sur Sezzle'\n }\n const ordersOver = {\n en: ' for orders over',\n fr: ' pour les achats de plus de'\n }\n const language = getSupportedLanguage()\n const subtemplates = []\n template[language].split('%%').forEach((subTemplate, index) => {\n switch (subTemplate) {\n case 'price':\n // eslint-disable-next-line no-case-declarations\n const priceElement = <span className='sezzle-payment-amount sezzle-button-text' key={index}>\n {getFormattedPrice(this.state.config.price, numberOfPayments)}\n </span>\n subtemplates.push(priceElement)\n break\n case 'logo':\n // eslint-disable-next-line no-case-declarations\n const logoElement = <img alt=\"Sezzle\"\n className={`sezzle-logo szl-${this.state.config.theme === 'dark' \|\| this.state.config.theme === 'white-flat' ? 'dark' : 'light'}-image`} src={logoURLs[this.state.config.theme] \|\| logoURLs.light}\n style={{ transformOrigin: `top-${this.state.config.alignment}`, transform: `scale(${this.state.config.logoSize})`, cursor: 'pointer', width: '74px', height: '18px' }}\n key={index} onClick={() => this.openModal('sezzle')} />\n subtemplates.push(logoElement)\n break\n case 'info':\n // eslint-disable-next-line no-case-declarations\n const infoElement = <div aria-label={`${clickHere[language]}`} className='sezzle-info-icon' key={index} onClick={() => this.openModal('sezzle')}>ⓘ</div>\n subtemplates.push(infoElement)\n break\n case 'afterpay':\n if (this.state.config.includeAPModal) {\n subtemplates.push(language === 'fr' ? ' ou ' : ' or ')\n const apLogo = <img className='sezzle-ap-logo ap-modal-info-link no-sezzle-info'\n src={'https://media.sezzle.com/sezzle-credit-website-assets/ap-badge-black-on-mint.svg'}\n onClick={() => this.openModal('afterpay')} key={index}\n alt=\"Afterpay\"\n />\n subtemplates.push(apLogo)\n }\n break\n case 'min-price':\n if (this.state.config.minPrice && !this.state.config.includeAPModal) {\n subtemplates.push(`${ordersOver[language]} $${this.state.config.minPrice}`)\n }\n break\n default:\n subtemplates.push(subTemplate)\n }\n })\n return subtemplates\n }\n\n openModal(modalType) {\n modalType === 'afterpay' ? this.setState({ afterpay: true }) : this.setState({ sezzle: true })\n }\n\n closeModal(modalType) {\n modalType === 'afterpay' ? this.setState({ afterpay: false }) : this.setState({ sezzle: false })\n }\n\n render() {\n return (\n <div className={`sezzle-shopify-info-button sezzle-${this.state.config.merchantId \|\| ''}`}>\n <div aria-haspopup='dialog' role='button' tabIndex='0' className={`sezzle-checkout-button-wrapper sezzle-modal-link sezzle-${this.state.config.merchantId \|\| ''} sezzle-${this.state.config.alignment \|\| 'auto'}`} style={{ cursor: 'pointer' }}>\n <div className={`sezzle-button-text sezzle-${this.state.config.alignment \|\| 'auto'} szl-${this.state.config.theme === 'dark' \|\| this.state.config.theme === 'white-flat' ? 'dark' : 'light'}`} style={{ fontWeight: (this.state.config.fontWeight \|\| 500), fontFamily: (this.state.config.fontFamily \|\| 'inherit'), fontSize: ((this.state.config.fontSize \|\| 14) + 'px'), color: (this.state.config.textColor \|\| 'inherit') }}>\n {this.renderSezzleWidgetText()}\n </div>\n </div>\n {this.state.modalsToShow.map((modal, index) => (\n <Modal modalType={modal} key={index} toggleModalVisibility={this.state[modal]} callbackModalClose={(modal) => this.closeModal(modal)} />\n ))}\n </div>\n )\n }\n}\n\nSezzleWidgetText.propTypes = {\n config: PropTypes.object\n}\n","import React from 'react'\nimport PropTypes from 'prop-types'\nimport SezzleWidget from './Components/SezzleWidget'\nimport './index.css'\n\nexport default class SezzleWidgetWrapper extends React.Component {\n constructor(props) {\n super(props)\n this.state = {\n sezzleConfig: {\n price: this.props.price \|\| 0,\n merchantId: this.props.merchantId \|\| '',\n includeAPModal: this.props.includeAPModal \|\| false,\n minPrice: this.props.minPrice \|\| 0,\n theme: this.props.theme \|\| 'light',\n alignment: this.props.alignment \|\| 'auto',\n fontWeight: this.props.fontWeight \|\| 500,\n fontFamily: this.props.fontFamily \|\| 'inherit',\n fontSize: this.props.fontSize \|\| 14,\n textColor: this.props.textColor \|\| 'inherit',\n logoSize: this.props.logoSize \|\| 1,\n modalsToShow: ['sezzle']\n }\n }\n }\n\n static getDerivedStateFromProps(props, state) {\n if (props.price !== state.sezzleConfig.price) {\n const updateState = state\n updateState.sezzleConfig.price = props.price\n return updateState\n }\n state = { ...state }\n if (props.includeAPModal && state.sezzleConfig.modalsToShow.indexOf('afterpay') === -1) {\n state.sezzleConfig.modalsToShow.push('afterpay')\n }\n return state\n }\n\n render() {\n return (\n <div>\n <SezzleWidget config={this.state.sezzleConfig} />\n </div>\n )\n }\n}\n\nSezzleWidgetWrapper.propTypes = {\n price: PropTypes.string.isRequired,\n merchantId: PropTypes.string.isRequired,\n theme: PropTypes.string,\n alignment: PropTypes.string,\n fontWeight: PropTypes.number,\n fontFamily: PropTypes.string,\n fontSize: PropTypes.number,\n textColor: PropTypes.string,\n logoSize: PropTypes.number,\n minPrice: PropTypes.number,\n includeAPModal: PropTypes.bool\n}\n"],"names":["parsePriceString","price","formattedPrice","i","length","isNumeric","isAlphabet","parsePrice","parseFloat","n","isNaN","isFinite","test","getLanguage","_document$querySelect","document","querySelector","lang","substring","toLowerCase","getSupportedLanguage","supportedLanguages","indexOf","getFormattedPrice","numberOfPayments","priceString","priceReplacer","formatter","replace","sezzleInstallmentPrice","toFixed","sezzleInstallmentFormattedPrice","modalEnglishHTML","modalFrenchHTML","apModalEnglishHTML","apModalFrenchHTML","Modal","_React$Component","_inherits","_super","_createSuper","props","_this","_classCallCheck","call","_defineProperty","_assertThisInitialized","isModalVisible","state","setState","_objectSpread","event","callbackModalClose","modalType","modalElement","_createClass","key","value","componentDidMount","_this2","appendChild","sezzleModal","addEventListener","stopPropagation","querySelectorAll","forEach","modal","modalCloseHandler","componentDidUpdate","prevProps","prevState","toggleModalVisibility","componentWillUnmount","modals","getElementsByClassName","removeChild","render","getDerivedStateFromProps","createElement","currentLang","className","innerHTML","style","display","React","Component","propTypes","PropTypes","bool","string","func","SezzleWidgetText","config","sezzle","afterpay","modalsToShow","renderSezzleWidgetText","logoURLs","light","dark","template","en","concat","fr","clickHere","ordersOver","language","subtemplates","split","subTemplate","index","priceElement","push","logoElement","alt","theme","src","transformOrigin","alignment","transform","logoSize","cursor","width","height","onClick","openModal","infoElement","includeAPModal","apLogo","minPrice","closeModal","_this3","merchantId","role","tabIndex","fontWeight","fontFamily","fontSize","color","textColor","map","object","SezzleWidgetWrapper","sezzleConfig","SezzleWidget","updateState","isRequired","number"],"mappings":"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","x_google_ignoreList":[7]}