\n {shouldShowBackButton && (\n
\n );\n }\n}\nexport default UserDetailsBanner;\n","import { isExternalFlow } from './productIntegrationUtils';\nimport templateData from './getTemplateData';\nimport AppStore from '../stores/AppStore';\n\nfunction isNna(country) {\n return (\n ['US'].indexOf(country) >= 0 &&\n templateData.nnaExperienceStatus &&\n !isExternalFlow() &&\n templateData?.pxp?.showNnaExp?.experiment &&\n !templateData.memberMandatory &&\n AppStore.getDonationRecurring() !== 'checked'\n );\n}\n\nexport default isNna;\n","// See WR documentation: https://github.paypal.com/pages/Globalization-R/worldready-js/docs/about.html\n\nimport {\n WorldReady,\n NumberFormat,\n CurrencyFormat,\n PhoneNumberFormat,\n DateInputMaskFormat,\n RelativeTimeFormat,\n DateTimeFormat,\n} from '@paypalcorp/worldready';\n\nlet worldReady;\nconst getLocale = () => {\n const { country = 'US', language = 'en' } =\n JSON.parse(document.getElementById('templateData').innerHTML) || {};\n return `${language}-${country}`;\n};\n\nexport const initializeWorldReady = () => {\n if (!worldReady) {\n let worldReadyData = JSON.parse(\n document.getElementById('worldReady').textContent\n );\n WorldReady.load(worldReadyData);\n console.log('WorldReady has loaded!');\n\n const locale = getLocale();\n worldReady = new WorldReady(locale);\n }\n};\n\n/**\n * It returns a WorldReady instance\n * @returns a WorldReady instance.\n */\nexport const getWorldReady = () => {\n return worldReady;\n};\n\n/**\n * It takes a number and returns a localized number string\n * @param value - The number to format.\n * @param [options] - An object with the following properties: { maximumFractionDigits }\n * Example input: 1000\n * Example output: '1,000.00'\n */\nexport const formatNumber = (value, options = {}) =>\n new NumberFormat(worldReady, options).format(value);\n\n/**\n * It takes a string, and returns a number\n * @param value - The value to be formatted.\n * @param [options] - An object with the following properties:\n * Example input: '1,000.00'\n * Example output: 1000\n */\nexport const wrNormalizeNumber = (value, options = {}) =>\n new NumberFormat(worldReady, options).parse(value);\n\n/**\n * It takes a value and an options object, and returns a formatted currency string\n * @param value - The value to format.\n * @param options - An object containing the following properties: { currency, maximumFractionDigits, style }\n * Example input: 1000, currency: 'USD'\n * Example output: '$1,000.00'\n */\nexport const formatCurrency = (value, options) =>\n options && new CurrencyFormat(worldReady, options).format(value);\n\n/**\n * It takes a number and an options object, and returns an array of objects\n * @param value - The value to be formatted.\n * @param options - An object with the following properties: { style }\n * Input: 1234.5\n * Output: [\n * { type: \"currencySymbol\", value: \"$\" },\n * { type: \"integer\", value: \"1\" },\n * { type: \"group\", value: \",\" },\n * { type: \"integer\", value: \"234\" },\n * { type: \"decimal\", value: \".\" },\n * { type: \"fraction\", value: \"50\" },\n * { type: \"literal\", value: \" \" },\n * { type: \"currencyCode\", value: \"USD\" }\n * ] (considering locale is en-US)\n */\nexport const formatCurrencyToParts = (value, options) =>\n options && new CurrencyFormat(worldReady, options).formatToParts(value);\n\n/**\n * \"If the options object has a phoneRegion property, and the phoneObject is truthy, then format the\n * phoneObject using the PhoneNumberFormat class.\"\n *\n * The PhoneNumberFormat class is a class that I wrote to format phone numbers. It's not part of the\n * Google libphonenumber library\n * @param [options] - An object with the following properties:\n * @param phoneObject - The phone number object returned by the parsePhoneNumberFromString function.\n * Input: { countryCode: \"1\", nationalNumber: \"4088430088\" }\n * Output: \"+1 408-843-0088\" (considering phoneRegion is US)\n */\nexport const formatPhoneNumber = (options = {}, phoneObject) =>\n options.phoneRegion &&\n phoneObject &&\n new PhoneNumberFormat(options).format(phoneObject);\n\n/**\n * It takes a phone number and a phone region and returns a parsed phone number\n * @param options - The options object that you pass to the PhoneNumberFormat constructor.\n * @param phoneNumber - The phone number to parse.\n * Input: \"+1 408-843-0088\" (considering phoneRegion is US)\n * Output: { countryCode: \"1\", nationalNumber: \"4088430088\" }\n */\nexport const parsePhoneNumber = (options, phoneNumber) =>\n options.phoneRegion &&\n phoneNumber &&\n new PhoneNumberFormat(options).parse(phoneNumber);\n\n/**\n * It returns a new instance of the DateInputMaskFormat class, which is a class that extends the\n * InputMaskFormat class\n * @param options - An object with the following properties:\n * Input: { style: 'date-short' }\n * Output: \"mm/dd/yy\" (considering locale is en-US)\n */\nexport const getDateMaskFormat = (options) =>\n new DateInputMaskFormat(worldReady, options).format();\n\n/**\n * It returns a string that represents the relative time between the given date and the current time\n * @param date - The date to format.\n * @param options - An object with the following properties:\n */\nexport const getRelativeTime = (date, options) =>\n new RelativeTimeFormat(worldReady, options).format(date);\n\n/**\n * It takes a date and an optional options object, and returns a string\n * @param date - The date to format.\n * @param [options] - An object with the following properties:\n */\nexport const formatDate = (date, options = {}) =>\n new DateTimeFormat(worldReady, options).format(date);\n\ninitializeWorldReady();\n","import AppStore from '../../stores/AppStore';\nimport * as AppActions from '../../actions/AppActions';\nimport { formatAmount, normalizeNumber } from '../../utility/formator';\nimport TemplateData from '../../utility/getTemplateData';\nimport { getParameterByName } from '../../utility/queryStringHelper';\nimport templateData from '../../utility/getTemplateData';\n\nexport const isOptInCoverFee = () => {\n return AppStore.getCoverFeeOptInStatus() === 'checked';\n};\n\nexport const isAtLandingPage = () => {\n const isGuestReviewPage =\n window.location.pathname.includes('guest') ||\n ![undefined, null].includes(getParameterByName('signup')) ||\n getParameterByName('countryChange');\n return !isGuestReviewPage;\n};\n\nexport const computeFeeAmount = () => {\n const donationAmount = parseFloat(AppStore.getDonationAmount()),\n flatFee = parseFloat(TemplateData.flatFee),\n feeRate = parseFloat(TemplateData.feeRate) * 0.01;\n\n if (donationAmount > 0) {\n // X is the full amount the donor needs to pay for the charity to receive $100\n // X - .03X - $0.30 = $100\n // If X is the full amount the donor needs to pay for the charity to receive Y\n // X - feeRate*X - flatFee = Y\n // X = (Y + flatFee) / (1 - feeRate)\n const totalAmountAfterFee = (donationAmount + flatFee) / (1 - feeRate),\n feeAmount = totalAmountAfterFee - donationAmount;\n return feeAmount;\n }\n\n return 0;\n};\n\nexport const computeAmountAfterFee = (donationAmount, feeAmount) => {\n const totalAmount = parseFloat(donationAmount) + normalizeNumber(feeAmount);\n\n return totalAmount.toString();\n};\n\nexport const setFeeAmountInStore = () => {\n const feeAmount = computeFeeAmount(),\n currencyCode = AppStore.getDonationCode(),\n formatedFeeAmount = formatAmount({\n currency: currencyCode,\n value: feeAmount,\n style: 'international',\n }),\n formatedFeeAmountValue = feeAmount;\n\n AppActions.changeFeeAmount({ feeAmount: formatedFeeAmountValue });\n AppActions.changeFormatedFeeAmount({\n formatedFeeAmount,\n });\n};\n\nexport const updateDonationAmount = (amount) => {\n const currencyCode = AppStore.getDonationCode(),\n formatedAmount = formatAmount({\n currency: currencyCode,\n value: amount,\n });\n AppActions.changeAmount({ amount });\n AppActions.changeFormatedAmount({ formatedAmount });\n};\n\nexport const restoreDonationAmount = () => {\n const rawAmount = AppStore.getAmountBeforeFee() || TemplateData.rawAmount;\n updateDonationAmount(rawAmount.toString());\n};\n\nexport const optOutCoverFee = () => {\n AppActions.changeCoverFee({ coverFee: 'unchecked' });\n AppActions.changeFeeAmount({ feeAmount: 0 });\n AppActions.changeFormatedAmount({ formatedFeeAmount: '' });\n};\n\nexport const shouldSelectPresetAmount = (amount) => {\n if (!amount) {\n return false;\n }\n if (templateData.presetAmounts?.length === 3) {\n const presetAmounts = TemplateData.presetAmounts;\n return presetAmounts.map(Number).includes(Number(amount));\n }\n};\n","import React, { useContext } from 'react';\nimport PropTypes from 'prop-types';\nimport { HeadingText } from '@paypalcorp/pp-react';\nimport ReturnToMerchantLink from '../../components/returnToMerchant';\nimport { isExternalFlow } from '../../utility/productIntegrationUtils';\nimport CloseButton from '../../components/CloseButton';\nimport {\n Message,\n Context as WorldReadyContext,\n} from '@paypalcorp/worldready-react';\nimport { MessageFormat } from '@paypalcorp/worldready';\n\nconst ReceiverEligibilityErrorTile = ({ organizationName, returnUrl }) => {\n const worldReady = useContext(WorldReadyContext);\n\n return (\n <>\n {isExternalFlow() && \n
\n \n {loggedInMessage} \n
\n \n \n
\n {children}
;\n};\n\nexport const BackgroundBanner = ({ bannerURL }) => {\n return \n 
\n
\n );\n};\n\nconst InititalsLogo = ({ initialLogo, initialColor }) => {\n return (\n \n \n
\n );\n}\n","import React from 'react';\nimport { CaptionText, Col, Row } from '@paypalcorp/pp-react';\nimport PropTypes from 'prop-types';\n\nfunction ConfirmationTransactionId(props) {\n return (\n \n
\n );\n }\n}\n\nOfferSaveButton.propTypes = {\n offerProgram: PropTypes.object.isRequired,\n txnStatement: PropTypes.string,\n};\n\nexport default OfferSaveButton;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { BodyText } from '@paypalcorp/pp-react-text';\nimport { Row, Col } from '@paypalcorp/pp-react';\nimport OfferDetail from './offerDetail';\nimport OfferSaveButton from './offerSaveButton';\nimport { Message } from '@paypalcorp/worldready-react';\n\nclass OfferConfirmation extends React.Component {\n render() {\n const { offerProgram } = this.props;\n return (\n \n \n
\n \n \n
\n
\n );\n }\n}\n\nOfferConfirmation.propTypes = {\n offerProgram: PropTypes.object.isRequired,\n txnId: PropTypes.string,\n};\n\nexport default OfferConfirmation;\n","import React, { useState, useContext } from 'react';\nimport PropTypes from 'prop-types';\nimport { Alert } from '@paypalcorp/pp-react';\nimport { MessageFormat } from '@paypalcorp/worldready';\nimport { Context as WorldReadyContext } from '@paypalcorp/worldready-react';\n\nconst className = 'sign_up_alert';\n\nconst SignUpAlert = (props) => {\n const worldReady = useContext(WorldReadyContext);\n const [hideAlert, setHideAlert] = useState(false);\n\n const buttonCloseMsgFmt = new MessageFormat(worldReady, {\n id: 'common.header.button.close',\n });\n\n const handleCloseButton = () => {\n setHideAlert(true);\n };\n if (props.signUpStatus && !hideAlert) {\n return (\n \n \n
\n \n \n \n {this.props.returnText}\n \n
\n );\n }\n}\n\nexport default ConfirmationReturnText;\n\nConfirmationReturnText.propTypes = {\n returnText: PropTypes.string,\n};\n","import React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport { Link } from '@paypalcorp/pp-react-links';\nimport { isExternalFlow } from '../utility/productIntegrationUtils';\nimport { trackLinkClick } from '../fpti/fpti';\nimport { EVENT_NAME } from '../utility/constants';\n\nexport class ConfirmationReturnTo extends Component {\n constructor(props) {\n super(props);\n }\n\n redirectUrl = () => {\n trackLinkClick('merchant_redirect', {\n eventName: EVENT_NAME.DONATE_SUCCESS_MERCHANT_SITE_PRESSED,\n });\n this.props.handleRedirect();\n };\n\n render() {\n if (isExternalFlow()) {\n return null;\n }\n\n return (\n \n \n {this.props.returnto}\n \n
\n );\n }\n}\n\nexport default ConfirmationReturnTo;\n\nConfirmationReturnTo.propTypes = {\n returnto: PropTypes.string,\n handleRedirect: PropTypes.func,\n};\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport templateData from '../../utility/getTemplateData';\nimport { showSpinnerOverlay } from '../../utility/helper';\nimport { fetcher } from '../../utility/domUtils';\nimport _get from 'lodash/get';\nimport { isInContext } from '../../utility/inContextDonation';\nimport { isExternalFlow } from '../../utility/productIntegrationUtils';\nimport isEmpty from 'lodash/isEmpty';\nimport { KEY_DOWN } from '../../utility/constants';\nimport { MessageFormat } from '@paypalcorp/worldready';\nimport { Context as WorldReadyContext } from '@paypalcorp/worldready-react';\n\nclass PostTransaction extends React.Component {\n constructor(props) {\n super(props);\n const { postdata = {}, syncReturnUrl = '' } = this.props || {};\n\n let postBackArray = [];\n\n Object.keys(postdata).forEach(function (key) {\n postBackArray.push({\n name: key,\n value: postdata[key],\n });\n });\n\n this.state = {\n orgName: this.props.orgName,\n redirectMethod: this.props.method,\n redirectUrl: this.props.action,\n syncReturnUrl,\n postBackArray,\n isRedirecting: false,\n allowRedirect: true,\n };\n }\n\n componentDidMount() {\n const { hideSuccessPage } = templateData;\n const { syncReturnUrl, redirectUrl } = this.state;\n document.addEventListener('mousedown', this.stopRedirect, true);\n document.addEventListener('keydown', this.handleKeyDown, true);\n\n // Disable redirection to merchant when DNW is in popup mode\n if (!isInContext() && (!isEmpty(syncReturnUrl) || !isEmpty(redirectUrl))) {\n this.setState({\n isRedirecting: true,\n });\n\n setTimeout(\n () => {\n const { allowRedirect } = this.state;\n if (allowRedirect) {\n this.handleRedirect();\n }\n },\n hideSuccessPage ? 1000 : 15000\n );\n }\n\n // No need to handle refresh case\n // As user will be automatically redirected back\n // In case if some is required, listening to UPDATE_CONFIRMATION\n // AppDispatcher.register(function(payload) {\n //\t if (payload.action && (payload.action.actionType === 'UPDATE_CONFIRMATION')) {}\n // });\n }\n\n stopRedirect = () => {\n const { allowRedirect } = this.state;\n if (allowRedirect) {\n this.setState({\n allowRedirect: false,\n isRedirecting: false,\n });\n }\n document.removeEventListener('mousedown', this.stopRedirect, true);\n document.removeEventListener('keydown', this.handleKeyDown, true);\n };\n\n handleKeyDown = (event) => {\n const keyPressed = event.which;\n if (\n KEY_DOWN.TAB === keyPressed ||\n KEY_DOWN.UP_ARROW === keyPressed ||\n KEY_DOWN.LEFT_ARROW === keyPressed ||\n KEY_DOWN.DOWN_ARROW === keyPressed ||\n KEY_DOWN.RIGHT_ARROW === keyPressed\n ) {\n this.stopRedirect();\n }\n };\n\n /*\n * handleRedirect\n */\n handleRedirect = () => {\n const { hideSuccessPage } = templateData;\n\n if (hideSuccessPage) {\n this.redirect();\n return;\n }\n\n if (this.shouldShowSpinner()) {\n showSpinnerOverlay();\n }\n fetcher('/donate/sessionlogout').finally(() => {\n this.redirect();\n });\n };\n\n shouldShowSpinner = () => {\n let { syncReturnUrl = '', redirectUrl = '' } = this.state || {};\n if (\n isExternalFlow() &&\n templateData.ismobile &&\n templateData.hideLandingPage &&\n !syncReturnUrl.includes('http') &&\n !redirectUrl.includes('http')\n ) {\n return false;\n } else {\n return true;\n }\n };\n\n redirect = () => {\n let {\n syncReturnUrl = '',\n redirectUrl = '',\n redirectMethod = '',\n } = this.state || {};\n\n if (redirectMethod === 'POST' && syncReturnUrl) {\n this.postBackForm.submit();\n } else if (redirectMethod === 'GET' && syncReturnUrl) {\n if (\n syncReturnUrl.indexOf('http') !== 0 &&\n syncReturnUrl.indexOf('//') !== 0 &&\n !isExternalFlow()\n ) {\n syncReturnUrl = '//' + syncReturnUrl;\n }\n window.location.href = syncReturnUrl;\n } else {\n if (\n redirectUrl.indexOf('http') !== 0 &&\n redirectUrl.indexOf('//') !== 0 &&\n !isExternalFlow()\n ) {\n redirectUrl = '//' + redirectUrl;\n }\n window.location.href = redirectUrl;\n }\n };\n\n render = () => {\n if (this.state.orgName && this.state.isRedirecting) {\n const { orgName } = this.state;\n let redirectText = new MessageFormat(this.context, {\n id: 'confirmation.postTransaction.label.redirectText',\n }).format({ orgName });\n document.getElementById('spinnerText').innerHTML = redirectText;\n }\n\n return (\n \n {\n this.postBackForm = form;\n }}\n >\n {' '}\n {this.state.postBackArray.map(function (obj) {\n return (\n
\n );\n };\n}\n\nPostTransaction.propTypes = {\n method: PropTypes.string,\n action: PropTypes.string,\n orgName: PropTypes.string,\n syncReturnUrl: PropTypes.string.isRequired,\n};\n\nPostTransaction.defaultProps = {\n method: 'GET',\n};\nPostTransaction.contextType = WorldReadyContext;\n\nexport default PostTransaction;\n","import React from 'react';\nimport ConfirmationReturnText from './ConfirmationReturnText';\nimport ConfirmationReturnTo from './ConfirmationReturnTo';\nimport PostTransaction from '../pages/confirmation/postTransaction';\n\nexport default function ConfirmationRedirect({\n autoRedirectMethod,\n autoRedirectUrl,\n handleRedirect,\n orgName,\n postBackData,\n returnText,\n returnTo,\n syncReturnUrl,\n}) {\n return (\n <>\n \n \n {doneContent}\n \n
\n );\n};\n\nDoneLink.propTypes = {\n doneContent: PropTypes.string,\n syncReturnUrl: PropTypes.string,\n redirectUrl: PropTypes.string,\n};\n\nexport default DoneLink;\n","import React, { useState, useEffect, useContext } from 'react';\nimport TemplateData from '../utility/getTemplateData';\nimport { BodyText, Avatar, Row } from '@paypalcorp/pp-react';\nimport ConfirmationSocialShare from './ConfirmationSocialShare';\nimport ConfirmationTransactionId from './ConfirmationTransactionId';\nimport OfferConfirmation from '../components/offerConfirmation';\nimport PropTypes from 'prop-types';\nimport SignUpAlert from '../components/guest/SignUpAlert';\nimport VoucherFlowDisclaimer from '../components/voucherFlowDisclaimer';\nimport ConfirmationRedirect from './ConfirmationRedirect';\nimport { endCustomCPLTrackingForConfirmationPage } from '../utility/cpl';\nimport {\n isInContext,\n isMobileOrInContext,\n onComplete,\n isMWebNoReturnURL,\n} from '../utility/inContextDonation';\nimport { isPPFundraising } from '../utility/productIntegrationUtils';\nimport CloseButton from '../components/CloseButton';\nimport classNames from 'classnames';\nimport DoneLink from './DoneLink';\nimport { BannerImage } from '@paypalcorp/donate-react';\nimport { isCampaigns } from '../utility/productIntegrationUtils';\nimport { addFeature } from '../fpti/helper';\nimport { FEATURES } from '../fpti/fptiConstants';\nimport { MessageFormat } from '@paypalcorp/worldready';\nimport { Context as WorldReadyContext } from '@paypalcorp/worldready-react';\nimport { fetcher } from '../utility/domUtils';\nconst SOCIAL_EXP_GET = '/donate/api/socialExperiment/';\n\nfunction ConfirmationView(props) {\n const worldReady = useContext(WorldReadyContext);\n const getSocialMessage = (id, params) => {\n return new MessageFormat(worldReady, {\n id: isCampaigns()\n ? `landing.social.${id}`\n : `confirmation.confirmation.social.${id}`,\n }).format(params);\n };\n const {\n autoRedirect,\n autoRedirectUrl,\n autoRedirectMethod,\n footer,\n handleRedirect,\n hostedButtonId,\n illustration,\n isSignUp,\n isVoucherFlow,\n message,\n offerProgram,\n orgName,\n postBackData,\n returnTo,\n returnText,\n signUpProps,\n syncReturnUrl,\n txnId,\n personalizedMessages,\n isExternalFlow,\n campaignId,\n amount,\n } = props;\n\n useEffect(() => {\n endCustomCPLTrackingForConfirmationPage();\n }, []);\n\n useEffect(() => {\n onComplete(postBackData);\n }, []);\n\n const [isSocialShareLoading, setIsSocialShareLoading] = useState(\n !!props.hostedButtonId\n );\n const [enableMatchSocialShare, setEnableMatchSocialShare] = useState(false);\n\n const [socialShareMessages, setSocialShareMessages] = useState({\n social: {\n emailSubject: getSocialMessage('emailSubject', {\n donationName: '{donationName}',\n }),\n emailBody: getSocialMessage('emailBody', {\n donationName: '{donationName}',\n url: '{url}',\n }),\n mobileText: getSocialMessage('mobileText', {\n donationName: '{donationName}',\n }),\n facebookMessage: getSocialMessage('facebookMessage', {\n donationName: '{donationName}',\n url: '{url}',\n }),\n twitterMessage: getSocialMessage('twitterMessage', {\n donationName: '{donationName}',\n }),\n whatsappMessage: getSocialMessage('whatsappMessage', {\n donationName: '{donationName}',\n }),\n copyLinkHeader: getSocialMessage('copyLinkHeader'),\n copyLinkSubheaderBefore: getSocialMessage('copyLinkSubheaderBefore'),\n copyLinkSubheader: getSocialMessage('copyLinkSubheader'),\n copiedText: getSocialMessage('copiedText'),\n copyText: getSocialMessage('copyText'),\n subheader: getSocialMessage('subheader'),\n shareGeneric: getSocialMessage('shareGeneric'),\n shareWithMatch: getSocialMessage('shareWithMatch'),\n ...(!isCampaigns()\n ? {\n unhosted: {\n emailSubject: getSocialMessage('unhosted.emailSubject'),\n emailBody: getSocialMessage('unhosted.emailBody', {\n url: '{url}',\n }),\n mobileText: getSocialMessage('unhosted.mobileText'),\n facebookMessage: getSocialMessage('unhosted.facebookMessage'),\n twitterMessage: getSocialMessage('unhosted.twitterMessage'),\n whatsappMessage: getSocialMessage('unhosted.whatsappMessage', {\n url: '{url}',\n }),\n },\n }\n : {}),\n },\n });\n\n useEffect(() => {\n // For A/B Testing the general share content vs. the match content for hosted button\n if (hostedButtonId) {\n const generalSocialShareMessages = {\n social: {\n ...socialShareMessages.social,\n copyLinkHeader: getSocialMessage('copyLinkHeaderNew'),\n copyLinkSubheader: getSocialMessage('generalShareCopyLinkSubHeader'),\n emailSubject: getSocialMessage('generalShareMsgEmailSubject', {\n donationName: '{donationName}',\n }),\n emailBody: getSocialMessage('generalShareEmailBody', {\n donationName: '{donationName}',\n url: '{url}',\n }),\n facebookMessage: getSocialMessage('generalShareFacebookMessage', {\n donationName: '{donationName}',\n }),\n twitterMessage: getSocialMessage('generalShareTwitterMessage', {\n donationName: '{donationName}',\n }),\n whatsappMessage: getSocialMessage('generalShareWhatsappMessage', {\n donationName: '{donationName}',\n }),\n },\n };\n\n const matchSocialShareMessages = {\n social: {\n ...socialShareMessages.social,\n copyLinkHeader: getSocialMessage('copyLinkHeaderNew'),\n copyLinkSubheader: getSocialMessage(\n 'matchMyDonationCopyLinkSubHeader'\n ),\n emailSubject: getSocialMessage('matchMyDonationEmailSubject', {\n donationName: '{donationName}',\n }),\n emailBody: getSocialMessage('matchMyDonationEmailBody', {\n amount: `${amount}`,\n donationName: '{donationName}',\n url: '{url}',\n }),\n facebookMessage: getSocialMessage('matchMyDonationFacebookMessage', {\n amount: `${amount}`,\n donationName: '{donationName}',\n }),\n twitterMessage: getSocialMessage('matchMyDonationTwitterMessage', {\n amount: `${amount}`,\n donationName: '{donationName}',\n }),\n whatsappMessage: getSocialMessage('matchMyDonationWhatsappMessage', {\n amount: `${amount}`,\n donationName: '{donationName}',\n }),\n },\n };\n\n fetcher(`${SOCIAL_EXP_GET}?token=${TemplateData.token}`)\n .then((response) => response.json())\n .then((result) => {\n // Show match social share content if elmo falls under test group\n if (result?.data?.clientData?.enableNewSocialSharingMsg) {\n setSocialShareMessages(matchSocialShareMessages);\n setEnableMatchSocialShare(true);\n } else {\n setSocialShareMessages(generalSocialShareMessages);\n }\n setIsSocialShareLoading(false);\n })\n .catch(() => {\n setSocialShareMessages(generalSocialShareMessages);\n setIsSocialShareLoading(false);\n });\n }\n }, []);\n\n const socialShareLoadingShimmer = () => {\n return (\n \n \n
\n );\n };\n\n function showSocialShare() {\n if (TemplateData.socialSharePreference) {\n addFeature(FEATURES.SOCIAL_SHARE_PREFERENCE);\n return isSocialShareLoading ? (\n socialShareLoadingShimmer()\n ) : (\n \n {isSignUp &&
\n );\n}\n\nConfirmationView.propTypes = {\n amount: PropTypes.string,\n autoRedirectMethod: PropTypes.string,\n autoRedirect: PropTypes.bool,\n autoRedirectUrl: PropTypes.string,\n footer: PropTypes.object,\n handleRedirect: PropTypes.func,\n hostedButtonId: PropTypes.string,\n isVoucherFlow: PropTypes.bool,\n illustration: PropTypes.object,\n isSignUp: PropTypes.bool,\n message: PropTypes.object,\n offerProgram: PropTypes.object,\n orgName: PropTypes.string,\n postBackData: PropTypes.object,\n redirect: PropTypes.func,\n returnTo: PropTypes.string,\n returnText: PropTypes.string,\n signUpProps: PropTypes.object,\n syncReturnUrl: PropTypes.string,\n txnId: PropTypes.string,\n personalizedMessages: PropTypes.object,\n isExternalFlow: PropTypes.bool,\n isOfacPending: PropTypes.bool,\n campaignId: PropTypes.string,\n};\n\nexport default ConfirmationView;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { getPersonalizedMessages } from '../utility/personalizedMessages';\nimport { GN_CONTENT_TOUCHPOINT } from '../utility/constants';\nimport isNna from '../utility/nna';\nimport templateData from '../utility/getTemplateData';\nimport { MessageFormat } from '@paypalcorp/worldready';\nimport { Context as WorldReadyContext } from '@paypalcorp/worldready-react';\nimport MessageWithHTML from '../components/MessageWithHtml';\n\nexport default function withConfirmationMessages(\n WrappedComponent,\n renderedView\n) {\n class CmHOC extends React.Component {\n static propTypes = {\n amount: PropTypes.string,\n confirmationNumber: PropTypes.string,\n giftaidFlag: PropTypes.bool,\n isVoucherFlow: PropTypes.bool,\n orgName: PropTypes.string,\n postBackData: PropTypes.object,\n rp_status: PropTypes.bool,\n signUpStatus: PropTypes.bool,\n receiptId: PropTypes.string,\n isExternalFlow: PropTypes.bool,\n isCampaigns: PropTypes.bool,\n personalizedMessages: PropTypes.object,\n selectedRecurringFrequency: PropTypes.string,\n };\n\n isSuccessView = () => renderedView === 'success';\n\n getGiftAidConfText = () => {\n let giftaidFrequencyLabel = 'giftAidRecurring';\n switch (this.props.selectedRecurringFrequency) {\n case 'Week':\n giftaidFrequencyLabel = 'giftAidRecurringWeek';\n break;\n case 'Year':\n giftaidFrequencyLabel = 'giftAidRecurringYear';\n break;\n default:\n giftaidFrequencyLabel = 'giftAidRecurring';\n break;\n }\n if (this.props.giftaidFlag && this.isSuccessView()) {\n return new MessageFormat(this.context, {\n id: `confirmation.confirmation.label.${\n this.props.rp_status ? giftaidFrequencyLabel : 'giftAid'\n }`,\n }).format();\n }\n return '';\n };\n\n getYourDonationLabel = (personalizedMessages) => {\n if (this.props.isExternalFlow && personalizedMessages.success_header) {\n return personalizedMessages.success_header.replace(\n '\n {isExternalFlow &&
\n {!isInContext() && autoRedirect && autoRedirectUrl && (\n {illustration}
\n )}\n \n {message}\n\n {isExternalFlow && personalizedMessages.success_subheader ? (\n \n {personalizedMessages.success_subheader}\n \n ) : null}\n\n {isVoucherFlow && (\n
\n \n
\n );\n }\n}\n\nexport default ConfirmationCheckmark;\n\nConfirmationCheckmark.propTypes = {\n confirmationNumber: PropTypes.string,\n};\n","import React, { Component } from 'react';\nimport PropTypes from 'prop-types';\nimport { HeadingText } from '@paypalcorp/pp-react';\n\nclass ConfirmationAmount extends Component {\n render() {\n return (\n \n {isPPCampaign() || isGNC() ? (\n \n \n ) : (\n
\n \n
\n )}\n \n \n {orgSuccess}\n \n )}\n
\n );\n};\n\nConfirmationMessage.propTypes = {\n yourDonation: PropTypes.object,\n giftaidFlag: PropTypes.bool,\n extraDonateAmount: PropTypes.string,\n giftAid: PropTypes.string,\n orgSuccess: PropTypes.object,\n};\n\nexport default ConfirmationMessage;\n","import React, { useEffect } from 'react';\nimport { Row, Col } from '@paypalcorp/pp-react';\nimport ConfirmationCheckmark from './ConfirmationCheckmark';\nimport ConfirmationMessage from './ConfirmationMessage';\nimport ConfirmationView from './ConfirmationView';\nimport withConfirmationData from './withConfirmationData';\nimport withConfirmationMessages from './withConfirmationMessages';\nimport withTheme from '../components/withTheme';\nimport PropTypes from 'prop-types';\nimport * as AppActions from '../actions/AppActions';\nimport { addClass } from '../utility/domUtils';\nimport { isInContext } from '../utility/inContextDonation';\n\nfunction SuccessView(props) {\n const {\n confirmationNumber,\n extraDonateAmount,\n giftAidConfText,\n giftaidFlag,\n rp_status,\n yourDonation,\n yourRPdonation,\n orgSuccess,\n } = props;\n\n // Disabling 'Pull to Refresh' to thwart POST requests to /donate/guest/confirmation logged in calkibana.\n useEffect(() => {\n document.body.classList?.add('no-pulltorefresh');\n }, []);\n\n useEffect(() => {\n AppActions.showLanguageSelector(false);\n }, []);\n\n useEffect(() => {\n if (isInContext) {\n addClass('#mainWrapper', ['in-context-success-page']);\n }\n }, []);\n\n const SuccessMessage = () => (\n \n \n
\n );\n return (\n \n
\n \n \n {`\"${description}\"`}\n
\n \n \n
\n );\n}\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { Col, Row, Link } from '@paypalcorp/pp-react';\nimport { Message } from '@paypalcorp/worldready-react';\nimport templateData from '../../utility/getTemplateData';\nimport MessageWithHTML from '../MessageWithHtml';\n\nexport const Help = () => (\n \n
\n
\n
\n
\n (\n \n {innerMessage}\n \n )}\n />\n
\n \n \n {this.state.displayMe && (\n \n
\n \n )}\n \n );\n }\n}\n\nexport default CancelAndReturn;\n","export const PAGE_SPEC = {\n LANDING_PAGE: {\n pgrp: 'main:donate:wps::landing',\n page: 'main:donate:wps::landing:web::',\n tmpl: 'main:donate:wps::landing',\n },\n GUEST_FORM: {\n pgrp: 'main:donate:wps:guest:guestform',\n page: 'main:donate:wps:guest:guestform:web::',\n tmpl: 'main:donate:wps:guest:guestform:web::',\n },\n GUEST_SUCCESS_PAGE: {\n pgrp: 'main:donate:wps:guest:success',\n page: 'main:donate:wps:guest:success:web::',\n tmpl: 'main:donate:wps:guest:success:web::',\n },\n GUEST_SIGNUP_SUCCESS_PAGE: {\n pgrp: 'main:donate:wps:guest:upgrade',\n page: 'main:donate:wps:guest:upgrade:web::',\n tmpl: 'main:donate:wps:guest:upgrade:web::',\n },\n GUEST_PENDING_PAGE: {\n pgrp: 'main:donate:wps:guest:pending',\n page: 'main:donate:wps:guest:pending:web::',\n tmpl: 'main:donate:wps:guest:pending:web::',\n },\n GUEST_FAILURE_PAGE: {\n url: '/donate/error/payment',\n pgrp: 'main:donate:wps:guest:failure',\n page: 'main:donate:wps:guest:failure:web::',\n tmpl: 'main:donate:wps:guest:failure:web::',\n },\n ONBOARDING_GUEST_FORM: {\n comp: 'donatenodeweb', // Overriding the comp to tell that this event is fired by DNW\n pgrp: 'main:donate:wps:signup:signupform',\n page: 'main:donate:wps:signup:signupform:web::',\n tmpl: 'main:donate:wps:signup:signupform:web::',\n },\n ONBOARDING_GUEST_SUCCESS_PAGE: {\n pgrp: 'main:donate:wps:signup:success',\n page: 'main:donate:wps:signup:success:web::',\n tmpl: 'main:donate:wps:signup:success:web::',\n },\n ONBOARDING_GUEST_PENDING_PAGE: {\n pgrp: 'main:donate:wps:signup:pending',\n page: 'main:donate:wps:signup:pending:web::',\n tmpl: 'main:donate:wps:signup:pending:web::',\n },\n MEMBER_SUCCESS_PAGE: {\n url: '/donate/member/confirmation',\n pgrp: 'main:donate:wps:member:success',\n page: 'main:donate:wps:member:success:web::',\n tmpl: 'main:donate:wps:member:success:web::',\n },\n MEMBER_PENDING_PAGE: {\n url: '/donate/member/pending',\n pgrp: 'main:donate:wps:member:pending',\n page: 'main:donate:wps:member:pending:web::',\n tmpl: 'main:donate:wps:member:pending:web::',\n },\n MEMBER_FAILURE_PAGE: {\n url: '/donate/member/error',\n pgrp: 'main:donate:wps:member:failure',\n page: 'main:donate:wps:member:failure:web::',\n tmpl: 'main:donate:wps:member:failure:web::',\n },\n RECURRING_SUCCESS_PAGE: {\n url: '/donate/member/confirmation-rec',\n pgrp: 'main:donate:wps:member:success',\n page: 'main:donate:wps:member:success:web::',\n tmpl: 'main:donate:wps:member:success:web::',\n },\n MEMBER_REVIEW_PAGE: {\n url: '/donate/member',\n pgrp: 'main:donate:wps:member:review',\n page: 'main:donate:wps:member:review:web::',\n tmpl: 'main:donate:wps:member:review:web::',\n },\n CROSS_BORDER_PAGE: {\n url: '/donate/guest/crossborder',\n pgrp: 'main:donate:wps:guest:crossborder',\n page: 'main:donate:wps:guest:crossborder:web::',\n tmpl: 'main:donate:wps:guest:crossborder:web::',\n },\n THREE_DS_IFRAME: {\n pgrp: 'main:donate:wps:guest:3DS-challenge',\n page: 'main:donate:wps:guest:3DS-challenge:::',\n tmpl: 'main:donate:wps:guest:3DS-challenge:::',\n },\n THREE_DS_IFRAME_ONBRD: {\n pgrp: 'main:onbrd:signup:donate:3DS-challenge',\n page: 'main:onbrd:signup:donate:3DS-challenge:::',\n tmpl: 'main:onbrd:signup:donate:3DS-challenge:::',\n },\n UNILATERAL_ERROR_PAGE: {\n pgrp: 'main:donate:wps:guest:unilateral',\n page: 'main:donate:wps:guest:unilateral:web::',\n tmpl: 'main:donate:wps:guest:unilateral:web::',\n },\n CAPTURE_ORDER_PAGE: {\n pgrp: 'main:donate:wps:{flow}:captureOrder',\n page: 'main:donate:wps:{flow}:captureOrder:web::',\n tmpl: 'main:donate:wps:{flow}:captureOrder:web::',\n },\n WEBSCR_ERROR_PAGE: {\n pgrp: 'main:donate:wps::error',\n page: 'main:donate:wps::error:web::',\n tmpl: 'main:donate:wps::error:web::',\n },\n GENERIC_ERROR_PAGE: {\n pgrp: 'main:donate:wps:generic:failure',\n page: 'main:donate:wps:generic:failure:web::',\n tmpl: 'main:donate:wps:generic:failure:web::',\n },\n CRS_ERROR_PAGE: {\n pgrp: 'main:donate:wps:crs:failure',\n page: 'main:donate:wps:crs:failure:web::',\n tmpl: 'main:donate:wps:crs:failure:web::',\n },\n};\n\nexport const CPL_PAGE_SPEC = {\n LANDING_PAGE: {\n pgrp: 'main:donate:wps::landing:landingPageComponent',\n page: 'main:donate:wps::landing:landingPageComponent:web::',\n action: 'landing_page_loaded',\n uicomp: 'landingPageComponent',\n uitype: 'page',\n },\n GUEST_FORM: {\n pgrp: 'main:donate:wps:guest:guestform:guestFormComponent',\n page: 'main:donate:wps:guest:guestform:guestFormComponent:web:',\n action: 'guest_form_loaded',\n uicomp: 'guestForm',\n },\n TESLA_GUEST_FORM: {\n pgrp: 'main:onbrd:signup:donate:guestFormComponent',\n page: 'main:onbrd:signup:donate:guestFormComponent:web:',\n action: 'tesla_form_loaded',\n uicomp: 'teslaForm',\n },\n};\n\nexport const LINK_NAME = {\n ACCOUNT_HOME: 'myAccount',\n ANONYMOUS_CHECKBOX: 'anonymous_checkbox',\n ANONYMOUS_TOOLTIP: 'anonymousTooltip',\n BACK: 'back',\n CANCEL: 'cancel',\n CHANGE_COUNTRY: 'changeCountry',\n COVER_FEE_CHECKBOX: 'cover_fee_checkbox',\n CURRENCY_CONVERSION: 'showCurrencyConversionModal',\n DONE: 'done',\n GUEST_FORM_PAYMENT_SUBMIT_BUTTON: 'donate',\n NOT_YOU: 'not-you',\n NOTE_PAD: 'note_pad',\n ONBOARDING_FORM_PAYMENT_SUBMIT_BUTTON: 'guestPaymentBtn',\n PRESET_AMOUNT: 'presetAmount',\n PROGRAM_SELECTED: 'campaignSelected',\n RECURRING_CHECKBOX: 'recurringChkBx',\n REPORT_LINK: 'reportInappropriateContent',\n RETURN: 'return_to_merchant',\n SOCIAL_SHARE: 'social_share',\n SOCIAL_SHARE_DISMISS: 'close_social_share',\n UNIFIED_LOGIN: 'requestUnifiedLogin',\n VOUCHER: 'voucher',\n VOUCHER_PRINT: 'voucherprint',\n VOUCHER_SHARE: 'vouchershare',\n LIKE: 'like',\n UNLIKE: 'unlike',\n};\n\nexport const FPTI_TAGS = {\n ACCOUNT_TYPE: 'account_type',\n ACTION: 'action',\n AMOUNT: 'amount',\n AMOUNT_EDIT_ALLOWED: 'allow_amount_edit',\n AUTH_STATE: 'authState',\n CAMPAIGN: 'campaign',\n CAMPAIGN_ID: 'campaign_id',\n CHALLENGE_END_TIME: 'challenge_end_time',\n CHALLENGE_START_TIME: 'challenge_start_time',\n CHALLENGE_STATUS: 'challenge_status', // for 3ds\n CHARITY_NAME: 'charityname',\n CHECKBOX: 'checkbox',\n COUNTRY: 'country',\n CONTINGENCY_RESOLVED: 'contingency_resolved',\n CURRENCY: 'currency',\n DONOR_IP_COUNTRY: 'acct_cntry',\n EVENT_NAME: 'event_name',\n ECCD: 'eccd', // error code\n ENABLED_FREQUENCY: 'enabled_frequency',\n ERPG: 'erpg', // error message\n ERR_CODE: 'error_code',\n ERR_DESC: 'error_desc',\n ERR_FIELD: 'erfd',\n EXPERIMENT_ID: 'xe',\n FEE_AMOUNT: 'fee_amt',\n FEE_CURRENCY: 'fee_curr',\n FEE_PAYER: 'fee_payer',\n FI_NETWORK: 'sel_fmx_tp', // payment card network\n FI_ID: 'fi_id',\n FI_OPERATION: 'fi_operation',\n FI_TYPE: 'fi_type', // payment card type\n FLOW: 'flow',\n LINK: 'link',\n LINK_NAME: 'link_name',\n NONANONYMOUS: 'nonanonymous',\n NPID: 'crid', // non-profit ID\n NOTE_ALLOWED: 'is_allow_note',\n NOTE_ADDED: 'has_note',\n INTEGRATION_IDENTIFIER: 'integration_identifier',\n IS_CVV_SENT: 'is_cvv_sent',\n IS_RECURRING: 'is_recurring',\n IS_SIGNUP: 'user_opts_signup',\n IS_3DS_ELIGIBLE: 'is_3ds_eligible',\n ORDER_ID: 'order_id',\n OFFER_TYPE: 'offer_type',\n PAGE_LINK: 'pgln',\n PAGE_NAME: 'page',\n PAGE_GROUP: 'pgrp',\n PAGE_GROUP_LINK: 'pglk',\n PRODUCT: 'product',\n RESP_DURATION: 'resp_duration', // for 3ds\n SCREEN: 'screen',\n SELECTED_PRESET_BUTTON_ID: 'opsel',\n SENDER_ID: 'encr_cust_id',\n SELECTED_FREQUENCY: 'selected_frequency',\n STATUS: 'status',\n STATUS_CODE: 'status_code',\n SWITCH: 'switch',\n TOKEN: 'token',\n THREE_DS_DCC_START_TIME: 'dcc_start_time',\n THREE_DS_DCC_END_TIME: 'dcc_end_time',\n THREE_DS_LOOKUP_END_TIME: 'lookup_end_time',\n THREE_DS_LOOKUP_START_TIME: 'lookup_start_time',\n THREE_DS_REF_ID: '3ds_ref_id',\n THREE_DS_RESP_DURATION: 'resp_duration',\n THREE_DS_SPINNER_START_TIME: 'spinner_start_time',\n THREE_DS_SPINNER_END_TIME: 'spinner_end_time',\n THREE_DS_VERSION: '3ds_version',\n TREATMENT_ID: 'xt',\n TXN_ID: 'trid',\n UI_TYPE: 'ui_type', // full_page/popup/popup_blocked\n URL: 'url',\n UOB_BUNDLE_TYPE: 'onboardingBundleType',\n VERSION: 'version',\n FEATURE: 'feature',\n SOURCE: 'source',\n UPDATE_ID: 'update_id',\n DISMISS_METHOD: 'dismiss_method',\n COUNT: 'count',\n STATE: 'state',\n};\n\nexport const CLOSE_SHEET_REASONS = {\n BACKDROP_CLICK: 'backdropClick',\n CLOSE_BUTTON: 'closeButton',\n ESC: 'ESC',\n SWIPE_DOWN: 'swipeDown',\n};\n\nexport const DISMISS_METHODS = {\n CLOSE: 'close',\n BACKGROUND: 'background',\n};\n\nexport const LOADING_STATES = {\n POPULATED: 'populated',\n EMPTY: 'empty',\n};\n\nexport const FEATURES = {\n CTF: 'CTF',\n RECURRING: 'recurring',\n PRESET: 'preset',\n ANONYMOUS: 'anonymous',\n CHARITY_NOTE: 'charityNote',\n DONATION_AMOUNT_EDITABLE: 'donationAmountEditable',\n GUEST: 'guest',\n GIFT_AID: 'giftAid',\n MAILING_ADDRESS: 'mailingAddress',\n SOCIAL_SHARE_PREFERENCE: 'socialSharePreference',\n};\n","import React from 'react';\nimport { IconButton, CloseIcon } from '@paypalcorp/pp-react';\nimport { closeWindow, isInContext } from '../utility/inContextDonation';\nimport TemplateData from '../utility/getTemplateData';\nimport { getDismissEventName } from '../utility/productIntegrationUtils';\nimport { Message } from '@paypalcorp/worldready-react';\nimport PropTypes from 'prop-types';\nimport { trackLinkClick } from '../fpti/fpti';\nimport { LINK_NAME } from '../fpti/fptiConstants';\n\nexport default function CloseButton(props) {\n const handleClose = () => {\n trackLinkClick(LINK_NAME.CANCEL, {\n eventName: getDismissEventName(),\n });\n if (isInContext()) {\n closeWindow();\n return;\n }\n window.location.href = TemplateData.charityCancelUrl;\n };\n\n return (\n ', 'g'), '\\r\\n')\n .replace('{donationName}', orgName)\n .replace('{url}', shareableUrl)\n ),\n mobile: true,\n mobileTitle: encodeURIComponent(\n emailSubject.replace('{donationName}', orgName)\n ),\n mobileText: mobileText.replace('{donationName}', orgName),\n facebook: true,\n facebookMessage: facebookMessage\n .replace('{donationName}', orgName)\n .replace('{url}', shareableUrl),\n facebookMessenger: true,\n whatsapp: true,\n whatsappMessage: encodeURIComponent(\n whatsappMessage\n .replace(new RegExp('
', 'g'), '\\r\\n')\n .replace('{donationName}', orgName)\n ),\n twitter: true,\n twitterMessage: twitterMessage.replace('{donationName}', orgName),\n copyLink: isInContext() && isExternalFlow() ? false : true,\n copyLinkHeader,\n copyLinkSubheaderBefore,\n copyLinkSubheader,\n copyLinkCopy: copyText,\n copyLinkCopied: copiedText,\n title: socialTitle,\n sheet: messages.sheet,\n };\n\n return socialCampaign;\n}\n\nexport default getSocialCampaign;\n","import React from 'react';\nimport PropTypes from 'prop-types';\nimport { IconButton, EmailIcon } from '@paypalcorp/pp-react';\n\nfunction SocialShareEmail({ url, handleAnalytics, linkTitle }) {\n const mailToHandle = () => {\n handleAnalytics('email');\n window.location.href = url;\n };\n\n return (\n
\n {isCopied ? (\n \n \n {messages.copy}\n \n )}\n
\n \n \n )\n );\n}\n\nCopyLink.propTypes = {\n url: PropTypes.string,\n analytics: PropTypes.func,\n messages: PropTypes.object,\n};\n\nCopyLink.defaultProps = {\n analytics: null,\n};\n\nexport default CopyLink;\n","import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport {\n Dialog,\n BodyText,\n CaptionText,\n ActionMenu,\n Button,\n ShareFacebookIcon,\n EmailIcon,\n ShareMessengerIcon,\n ShareWhatsappIcon,\n ShareTwitterIcon,\n LinkIcon,\n CheckmarkBackgroundSmIcon,\n} from '@paypalcorp/pp-react';\nimport { StyleSheet, css } from '../../utility/paypalAphrodite';\nimport SocialShareEmail from './socialShareEmail';\nimport SocialShareMobile from './socialShareMobile';\nimport SocialShareFacebook from './socialShareFacebook';\nimport SocialShareMessenger from './socialShareMessenger';\nimport SocialShareWhatsapp from './socialShareWhatsapp';\nimport SocialShareTwitter from './socialShareTwitter';\nimport SocialShareCopyLink from './socialShareCopyLink';\nimport Illustration from '../illustrations/Illustration';\nimport CopyLink from '../CopyLink';\nimport { isInContext, isMobileOrTablet } from '../../utility/inContextDonation';\nimport { isExternalFlow } from '../../utility/productIntegrationUtils';\nimport { EVENT_NAME } from '../../utility/constants';\nimport { copyToClipboard } from '../../setup/lib/copyToClipBoard';\nimport templateData from '../../utility/getTemplateData';\nimport { trackLinkClick, trackPageIM } from '../../fpti/fpti';\nimport { FPTI_TAGS, LINK_NAME } from '../../fpti/fptiConstants';\nimport { PAYPAL_THEME } from '@paypalcorp/pp-react-theme';\nimport { isCampaigns } from '../../utility/productIntegrationUtils';\nimport { Col } from '@paypalcorp/pp-react';\n\nconst { sysColorBackgroundHighContrast } = PAYPAL_THEME;\n\nconst styles = StyleSheet.create({\n socialContainer: {\n display: 'flex',\n ':nth-child(1n) > *': {\n marginRight: 10,\n },\n },\n socialContainerMobile: {\n marginLeft: 10,\n },\n shareMenu: {\n flexDirection: 'column',\n },\n copyLinkModal: {\n paddingBottom: 30,\n },\n copyLinkContainer: {\n margin: '0 0 60px',\n },\n copyLinkHeader: {\n color: sysColorBackgroundHighContrast,\n marginTop: 20,\n marginBottom: 0,\n fontSize: '1.6rem',\n },\n copyLinkSubheader: {\n color: sysColorBackgroundHighContrast,\n marginTop: 28,\n marginRight: 'auto',\n fontSize: '1.15rem',\n },\n});\n\nexport default function SocialShare({\n shareUrl,\n socialCampaign,\n isMobile,\n ...props\n}) {\n const [isModalOpen, setIsModalOpen] = useState(false);\n const [isShareMenuOpen, setIsShareMenuOpen] = useState(false);\n const [isCopied, setIsCopied] = useState(false);\n\n const encodedUrl = encodeURIComponent(shareUrl);\n const appId = '321983581337375';\n const emailUrl = `mailto:?subject=${socialCampaign.emailSubject}&body=${socialCampaign.emailBody}`;\n const facebookUrl = `https://www.facebook.com/dialog/share?app_id=${appId}&display=popup"e=${socialCampaign.facebookMessage}&href=${encodedUrl}`;\n const fbMessengerUrl = isMobile\n ? `fb-messenger://share/?link=${encodedUrl}&app_id=${appId}"e=${socialCampaign.facebookMessage}`\n : `https://www.facebook.com/dialog/send?app_id=${appId}&display=popup&link=${encodedUrl}&redirect_uri=${templateData.paypalHostName}`;\n const whatsappUrl = `https://${\n isMobile ? 'api' : 'web'\n }.whatsapp.com/send?&text=${socialCampaign.whatsappMessage}%20${encodedUrl}`;\n const twitterUrl = `https://twitter.com/intent/tweet?url=${encodedUrl}&text=${socialCampaign.twitterMessage}`;\n const socialShareAltText = socialCampaign.title;\n const isActionMenu = props.renderMode === 'sheet' ? true : false;\n const socialItems = isActionMenu ? generateMenuOptions() : [];\n\n function handleSocialLinkClick(url, type) {\n window.open(\n url,\n 'popup',\n 'toolbar=0,status=0,width=640,height=340,scrollable=true'\n );\n handleAnalytics(`social_share_${type}`);\n }\n\n function handleOpenCopyModal() {\n setIsModalOpen(true);\n }\n\n function handleMobileClick() {\n if (navigator.share) {\n navigator.share({\n title: socialCampaign.mobileTitle,\n text: socialCampaign.mobileText,\n url: shareUrl,\n });\n } else {\n window.open(\n shareUrl,\n 'popup',\n 'toolbar=0,status=0,width=640,height=340,scrollable=true'\n );\n }\n handleAnalytics('mobile_share');\n }\n\n function handleMenuSelection(index) {\n if (socialItems[index].type === 'copy_link') {\n copyToClipboard('copy-link-text');\n setIsCopied(true);\n handleAnalytics('copy_link');\n\n setTimeout(() => {\n setIsCopied(false);\n }, 3000);\n } else {\n if (socialItems[index].type === 'email') {\n handleAnalytics('email');\n window.open(socialItems[index].url);\n } else if (socialItems[index].type === 'mobile_share') {\n handleMobileClick();\n } else {\n handleSocialLinkClick(\n socialItems[index].url,\n socialItems[index].title.toLowerCase()\n );\n }\n setIsCopied(false);\n setIsShareMenuOpen(false);\n }\n }\n\n function handleAnalytics(type) {\n if (props.analytics) {\n props.analytics(type);\n }\n }\n\n function generateMenuOptions() {\n let options = [];\n\n if (socialCampaign.email) {\n options.push({\n title: socialCampaign.sheet.email,\n url: emailUrl,\n type: 'email',\n itemLeft: (\n \n
\n \n {this.state.bannerUrl ? (\n
\n \n \n {displayBannerImage()}\n {hasLogo &&
\n );\n};\n\nHeaderDNW.propTypes = {\n isLanding: PropTypes.bool,\n};\n\nexport default HeaderDNW;\n","import React from 'react';\nimport { CaptionText, HeadingText } from '@paypalcorp/pp-react-text';\nimport { CausesIcon } from '@paypalcorp/pp-react-icons';\nimport PropTypes from 'prop-types';\nimport { Message } from '@paypalcorp/worldready-react';\n\nconst GNCSubheader = ({ organizationName, purpose }) => {\n return (\n \n
\n );\n};\n\nGNCSubheader.propTypes = {\n organizationName: PropTypes.string,\n purpose: PropTypes.string,\n};\n\nexport default GNCSubheader;\n","import React from 'react';\nimport { CaptionText, HeadingText } from '@paypalcorp/pp-react';\nimport PropTypes from 'prop-types';\nimport { Message } from '@paypalcorp/worldready-react';\n\nconst GNSubheader = ({ organizationName, purpose }) => {\n return (\n \n \n {purpose}\n \n
\n \n \n \n
\n \n
\n );\n};\n\nGNSubheader.propTypes = {\n organizationName: PropTypes.string,\n purpose: PropTypes.string,\n};\n\nexport default GNSubheader;\n","import React from 'react';\nimport BannerHeader, { Avatar, Banner } from './bannerHeader';\nimport { isGNC, isPPCampaign } from '../../utility/productIntegrationUtils';\nimport GNCSubheader from './GNCSubheader';\nimport GNSubheader from './GNSubheader';\nimport templateData from '../../utility/getTemplateData';\n\nconst GNHeader = () => {\n const organizationName = templateData.donationName,\n purpose = templateData.charityName,\n bannerUrl = templateData.bannerUrl,\n logoUrl = templateData.logoUrl,\n initialColor = templateData.initialColor,\n initialLogo = templateData.initialLogo;\n\n return (\n \n \n {organizationName}}\n />\n \n \n {purpose}\n \n
\n \n \n \n {isGNC() && (\n
\n );\n};\n\nexport default GNHeader;\n","import React from 'react';\nimport HeaderDNW from '../headerDNW';\nimport GNHeader from '../GN/gnHeader';\nimport PropTypes from 'prop-types';\nimport { isExternalFlow } from '../../utility/productIntegrationUtils';\n\nconst DonateHeader = ({ isLanding }) => {\n return (\n \n {isExternalFlow() ? (\n
\n );\n};\n\nDonateHeader.propTypes = {\n isLanding: PropTypes.bool,\n};\n\nexport default DonateHeader;\n"],"sourceRoot":""}