Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@paypal/react-paypal-js

Package Overview
Dependencies
Maintainers
31
Versions
66
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@paypal/react-paypal-js - npm Package Compare versions

Comparing version 6.0.2 to 7.0.0

dist/cjs/react-paypal-js.js

10

CHANGELOG.md

@@ -5,2 +5,12 @@ # Changelog

## [7.0.0](https://github.com/paypal/react-paypal-js/compare/v6.0.2...v7.0.0) (2021-06-04)
### ⚠ BREAKING CHANGES
- new file names for built files in dist folder.
### Features
- improve dist folder structure ([b032f77](https://github.com/paypal/react-paypal-js/commit/b032f77ceeb0181123741c0b3422ac19af94131d))
### [6.0.2](https://github.com/paypal/react-paypal-js/compare/v6.0.1...v6.0.2) (2021-06-04)

@@ -7,0 +17,0 @@

3

dist/components/PayPalButtons.d.ts
import { FunctionComponent, ReactElement } from "react";
import type { PayPalButtonsComponentOptions } from "@paypal/paypal-js/types/components/buttons";
export interface PayPalButtonsComponentProps extends PayPalButtonsComponentOptions {
export interface PayPalButtonsComponentProps
extends PayPalButtonsComponentOptions {
/**

@@ -5,0 +6,0 @@ * Used to re-render the component.

import { FunctionComponent } from "react";
import type { PayPalMessagesComponentOptions } from "@paypal/paypal-js/types/components/messages";
export interface PayPalMessagesComponentProps extends PayPalMessagesComponentOptions {
export interface PayPalMessagesComponentProps
extends PayPalMessagesComponentOptions {
forceReRender?: unknown[];

@@ -5,0 +6,0 @@ className?: string;

import type { PayPalNamespace } from "@paypal/paypal-js";
export declare const DEFAULT_PAYPAL_NAMESPACE = "paypal";
export declare function getPayPalWindowNamespace(namespace?: string): PayPalNamespace;
export declare function getPayPalWindowNamespace(
namespace?: string
): PayPalNamespace;

@@ -6,35 +6,204 @@ var _excluded = ["loadingStatus"],

function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _toConsumableArray(arr) {
return (
_arrayWithoutHoles(arr) ||
_iterableToArray(arr) ||
_unsupportedIterableToArray(arr) ||
_nonIterableSpread()
);
}
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _nonIterableSpread() {
throw new TypeError(
"Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."
);
}
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _iterableToArray(iter) {
if (
(typeof Symbol !== "undefined" && iter[Symbol.iterator] != null) ||
iter["@@iterator"] != null
)
return Array.from(iter);
}
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _arrayWithoutHoles(arr) {
if (Array.isArray(arr)) return _arrayLikeToArray(arr);
}
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _slicedToArray(arr, i) {
return (
_arrayWithHoles(arr) ||
_iterableToArrayLimit(arr, i) ||
_unsupportedIterableToArray(arr, i) ||
_nonIterableRest()
);
}
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _nonIterableRest() {
throw new TypeError(
"Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."
);
}
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _unsupportedIterableToArray(o, minLen) {
if (!o) return;
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
var n = Object.prototype.toString.call(o).slice(8, -1);
if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(o);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))
return _arrayLikeToArray(o, minLen);
}
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _arrayLikeToArray(arr, len) {
if (len == null || len > arr.length) len = arr.length;
for (var i = 0, arr2 = new Array(len); i < len; i++) {
arr2[i] = arr[i];
}
return arr2;
}
function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]); if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _iterableToArrayLimit(arr, i) {
var _i =
arr &&
((typeof Symbol !== "undefined" && arr[Symbol.iterator]) ||
arr["@@iterator"]);
if (_i == null) return;
var _arr = [];
var _n = true;
var _d = false;
var _s, _e;
try {
for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
_arr.push(_s.value);
if (i && _arr.length === i) break;
}
} catch (err) {
_d = true;
_e = err;
} finally {
try {
if (!_n && _i["return"] != null) _i["return"]();
} finally {
if (_d) throw _e;
}
}
return _arr;
}
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
function _arrayWithHoles(arr) {
if (Array.isArray(arr)) return arr;
}
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutProperties(source, excluded) {
if (source == null) return {};
var target = _objectWithoutPropertiesLoose(source, excluded);
var key, i;
if (Object.getOwnPropertySymbols) {
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
for (i = 0; i < sourceSymbolKeys.length; i++) {
key = sourceSymbolKeys[i];
if (excluded.indexOf(key) >= 0) continue;
if (!Object.prototype.propertyIsEnumerable.call(source, key))
continue;
target[key] = source[key];
}
}
return target;
}
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
function _objectWithoutPropertiesLoose(source, excluded) {
if (source == null) return {};
var target = {};
var sourceKeys = Object.keys(source);
var key, i;
for (i = 0; i < sourceKeys.length; i++) {
key = sourceKeys[i];
if (excluded.indexOf(key) >= 0) continue;
target[key] = source[key];
}
return target;
}
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
function ownKeys(object, enumerableOnly) {
var keys = Object.keys(object);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) {
symbols = symbols.filter(function (sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
}
keys.push.apply(keys, symbols);
}
return keys;
}
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _objectSpread(target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i] != null ? arguments[i] : {};
if (i % 2) {
ownKeys(Object(source), true).forEach(function (key) {
_defineProperty(target, key, source[key]);
});
} else if (Object.getOwnPropertyDescriptors) {
Object.defineProperties(
target,
Object.getOwnPropertyDescriptors(source)
);
} else {
ownKeys(Object(source)).forEach(function (key) {
Object.defineProperty(
target,
key,
Object.getOwnPropertyDescriptor(source, key)
);
});
}
}
return target;
}
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _defineProperty(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true,
});
} else {
obj[key] = value;
}
return obj;
}
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
function _typeof(obj) {
"@babel/helpers - typeof";
if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
_typeof = function _typeof(obj) {
return typeof obj;
};
} else {
_typeof = function _typeof(obj) {
return obj &&
typeof Symbol === "function" &&
obj.constructor === Symbol &&
obj !== Symbol.prototype
? "symbol"
: typeof obj;
};
}
return _typeof(obj);
}
import React, { createContext, useContext, useReducer, useEffect, useRef, useState } from 'react';
import React, {
createContext,
useContext,
useReducer,
useEffect,
useRef,
useState,
} from "react";
/*!

@@ -58,118 +227,136 @@ * paypal-js v3.1.11 (2021-06-03T21:16:51.218Z)

function findScript(url, attributes) {
var currentScript = document.querySelector("script[src=\"" + url + "\"]");
if (currentScript === null) return null;
var nextScript = createScriptElement(url, attributes); // ignore the data-uid-auto attribute that gets auto-assigned to every script tag
var currentScript = document.querySelector('script[src="' + url + '"]');
if (currentScript === null) return null;
var nextScript = createScriptElement(url, attributes); // ignore the data-uid-auto attribute that gets auto-assigned to every script tag
var currentScriptDataset = Object.assign({}, currentScript.dataset);
delete currentScriptDataset.uidAuto; // check if the new script has the same number of data attributes
var currentScriptDataset = Object.assign({}, currentScript.dataset);
delete currentScriptDataset.uidAuto; // check if the new script has the same number of data attributes
if (Object.keys(currentScriptDataset).length !== Object.keys(nextScript.dataset).length) {
return null;
}
if (
Object.keys(currentScriptDataset).length !==
Object.keys(nextScript.dataset).length
) {
return null;
}
var isExactMatch = true; // check if the data attribute values are the same
var isExactMatch = true; // check if the data attribute values are the same
Object.keys(currentScriptDataset).forEach(function (key) {
if (currentScriptDataset[key] !== nextScript.dataset[key]) {
isExactMatch = false;
}
});
return isExactMatch ? currentScript : null;
Object.keys(currentScriptDataset).forEach(function (key) {
if (currentScriptDataset[key] !== nextScript.dataset[key]) {
isExactMatch = false;
}
});
return isExactMatch ? currentScript : null;
}
function insertScriptElement(_a) {
var url = _a.url,
attributes = _a.attributes,
onSuccess = _a.onSuccess,
onError = _a.onError;
var newScript = createScriptElement(url, attributes);
newScript.onerror = onError;
newScript.onload = onSuccess;
document.head.insertBefore(newScript, document.head.firstElementChild);
var url = _a.url,
attributes = _a.attributes,
onSuccess = _a.onSuccess,
onError = _a.onError;
var newScript = createScriptElement(url, attributes);
newScript.onerror = onError;
newScript.onload = onSuccess;
document.head.insertBefore(newScript, document.head.firstElementChild);
}
function processOptions(options) {
var sdkBaseURL = "https://www.paypal.com/sdk/js";
var sdkBaseURL = "https://www.paypal.com/sdk/js";
if (options.sdkBaseURL) {
sdkBaseURL = options.sdkBaseURL;
delete options.sdkBaseURL;
}
if (options.sdkBaseURL) {
sdkBaseURL = options.sdkBaseURL;
delete options.sdkBaseURL;
}
var processedMerchantIDAttributes = processMerchantID(options["merchant-id"], options["data-merchant-id"]);
var newOptions = Object.assign({}, options, processedMerchantIDAttributes);
var processedMerchantIDAttributes = processMerchantID(
options["merchant-id"],
options["data-merchant-id"]
);
var newOptions = Object.assign({}, options, processedMerchantIDAttributes);
var _a = Object.keys(newOptions).filter(function (key) {
return typeof newOptions[key] !== "undefined" && newOptions[key] !== null && newOptions[key] !== "";
}).reduce(function (accumulator, key) {
var value = newOptions[key].toString();
var _a = Object.keys(newOptions)
.filter(function (key) {
return (
typeof newOptions[key] !== "undefined" &&
newOptions[key] !== null &&
newOptions[key] !== ""
);
})
.reduce(
function (accumulator, key) {
var value = newOptions[key].toString();
if (key.substring(0, 5) === "data-") {
accumulator.dataAttributes[key] = value;
} else {
accumulator.queryParams[key] = value;
}
if (key.substring(0, 5) === "data-") {
accumulator.dataAttributes[key] = value;
} else {
accumulator.queryParams[key] = value;
}
return accumulator;
}, {
queryParams: {},
dataAttributes: {}
}),
queryParams = _a.queryParams,
dataAttributes = _a.dataAttributes;
return accumulator;
},
{
queryParams: {},
dataAttributes: {},
}
),
queryParams = _a.queryParams,
dataAttributes = _a.dataAttributes;
return {
url: sdkBaseURL + "?" + objectToQueryString(queryParams),
dataAttributes: dataAttributes
};
return {
url: sdkBaseURL + "?" + objectToQueryString(queryParams),
dataAttributes: dataAttributes,
};
}
function objectToQueryString(params) {
var queryString = "";
Object.keys(params).forEach(function (key) {
if (queryString.length !== 0) queryString += "&";
queryString += key + "=" + params[key];
});
return queryString;
var queryString = "";
Object.keys(params).forEach(function (key) {
if (queryString.length !== 0) queryString += "&";
queryString += key + "=" + params[key];
});
return queryString;
}
function createScriptElement(url, attributes) {
if (attributes === void 0) {
attributes = {};
}
if (attributes === void 0) {
attributes = {};
}
var newScript = document.createElement("script");
newScript.src = url;
Object.keys(attributes).forEach(function (key) {
newScript.setAttribute(key, attributes[key]);
var newScript = document.createElement("script");
newScript.src = url;
Object.keys(attributes).forEach(function (key) {
newScript.setAttribute(key, attributes[key]);
if (key === "data-csp-nonce") {
newScript.setAttribute("nonce", attributes["data-csp-nonce"]);
}
});
return newScript;
if (key === "data-csp-nonce") {
newScript.setAttribute("nonce", attributes["data-csp-nonce"]);
}
});
return newScript;
}
function processMerchantID(merchantID, dataMerchantID) {
var newMerchantID = "";
var newDataMerchantID = "";
var newMerchantID = "";
var newDataMerchantID = "";
if (Array.isArray(merchantID)) {
if (merchantID.length > 1) {
newMerchantID = "*";
newDataMerchantID = merchantID.toString();
} else {
newMerchantID = merchantID.toString();
if (Array.isArray(merchantID)) {
if (merchantID.length > 1) {
newMerchantID = "*";
newDataMerchantID = merchantID.toString();
} else {
newMerchantID = merchantID.toString();
}
} else if (typeof merchantID === "string" && merchantID.length > 0) {
newMerchantID = merchantID;
} else if (
typeof dataMerchantID === "string" &&
dataMerchantID.length > 0
) {
newMerchantID = "*";
newDataMerchantID = dataMerchantID;
}
} else if (typeof merchantID === "string" && merchantID.length > 0) {
newMerchantID = merchantID;
} else if (typeof dataMerchantID === "string" && dataMerchantID.length > 0) {
newMerchantID = "*";
newDataMerchantID = dataMerchantID;
}
return {
"merchant-id": newMerchantID,
"data-merchant-id": newDataMerchantID
};
return {
"merchant-id": newMerchantID,
"data-merchant-id": newDataMerchantID,
};
}

@@ -184,35 +371,39 @@ /**

function loadScript(options, PromisePonyfill) {
if (PromisePonyfill === void 0) {
PromisePonyfill = getDefaultPromiseImplementation();
}
if (PromisePonyfill === void 0) {
PromisePonyfill = getDefaultPromiseImplementation();
}
validateArguments(options, PromisePonyfill); // resolve with null when running in Node
validateArguments(options, PromisePonyfill); // resolve with null when running in Node
if (typeof window === "undefined") return PromisePonyfill.resolve(null);
if (typeof window === "undefined") return PromisePonyfill.resolve(null);
var _a = processOptions(options),
url = _a.url,
dataAttributes = _a.dataAttributes;
var _a = processOptions(options),
url = _a.url,
dataAttributes = _a.dataAttributes;
var namespace = dataAttributes["data-namespace"] || "paypal";
var existingWindowNamespace = getPayPalWindowNamespace$1(namespace); // resolve with the existing global paypal namespace when a script with the same params already exists
var namespace = dataAttributes["data-namespace"] || "paypal";
var existingWindowNamespace = getPayPalWindowNamespace$1(namespace); // resolve with the existing global paypal namespace when a script with the same params already exists
if (findScript(url, dataAttributes) && existingWindowNamespace) {
return PromisePonyfill.resolve(existingWindowNamespace);
}
if (findScript(url, dataAttributes) && existingWindowNamespace) {
return PromisePonyfill.resolve(existingWindowNamespace);
}
return loadCustomScript({
url: url,
attributes: dataAttributes
}, PromisePonyfill).then(function () {
var newWindowNamespace = getPayPalWindowNamespace$1(namespace);
return loadCustomScript(
{
url: url,
attributes: dataAttributes,
},
PromisePonyfill
).then(function () {
var newWindowNamespace = getPayPalWindowNamespace$1(namespace);
if (newWindowNamespace) {
return newWindowNamespace;
}
if (newWindowNamespace) {
return newWindowNamespace;
}
throw new Error("The window." + namespace + " global variable is not available.");
});
throw new Error(
"The window." + namespace + " global variable is not available."
);
});
}

@@ -227,64 +418,70 @@ /**

function loadCustomScript(options, PromisePonyfill) {
if (PromisePonyfill === void 0) {
PromisePonyfill = getDefaultPromiseImplementation();
}
if (PromisePonyfill === void 0) {
PromisePonyfill = getDefaultPromiseImplementation();
}
validateArguments(options, PromisePonyfill);
var url = options.url,
attributes = options.attributes;
validateArguments(options, PromisePonyfill);
var url = options.url,
attributes = options.attributes;
if (typeof url !== "string" || url.length === 0) {
throw new Error("Invalid url.");
}
if (typeof url !== "string" || url.length === 0) {
throw new Error("Invalid url.");
}
if (typeof attributes !== "undefined" && _typeof(attributes) !== "object") {
throw new Error("Expected attributes to be an object.");
}
if (typeof attributes !== "undefined" && _typeof(attributes) !== "object") {
throw new Error("Expected attributes to be an object.");
}
return new PromisePonyfill(function (resolve, reject) {
// resolve with undefined when running in Node
if (typeof window === "undefined") return resolve();
insertScriptElement({
url: url,
attributes: attributes,
onSuccess: function onSuccess() {
return resolve();
},
onError: function onError() {
return reject(new Error("The script \"" + url + "\" failed to load."));
}
return new PromisePonyfill(function (resolve, reject) {
// resolve with undefined when running in Node
if (typeof window === "undefined") return resolve();
insertScriptElement({
url: url,
attributes: attributes,
onSuccess: function onSuccess() {
return resolve();
},
onError: function onError() {
return reject(
new Error('The script "' + url + '" failed to load.')
);
},
});
});
});
}
function getDefaultPromiseImplementation() {
if (typeof Promise === "undefined") {
throw new Error("Promise is undefined. To resolve the issue, use a Promise polyfill.");
}
if (typeof Promise === "undefined") {
throw new Error(
"Promise is undefined. To resolve the issue, use a Promise polyfill."
);
}
return Promise;
return Promise;
}
function getPayPalWindowNamespace$1(namespace) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
return window[namespace];
// eslint-disable-next-line @typescript-eslint/no-explicit-any
return window[namespace];
}
function validateArguments(options, PromisePonyfill) {
if (_typeof(options) !== "object" || options === null) {
throw new Error("Expected an options object.");
}
if (_typeof(options) !== "object" || options === null) {
throw new Error("Expected an options object.");
}
if (typeof PromisePonyfill !== "undefined" && typeof PromisePonyfill !== "function") {
throw new Error("Expected PromisePonyfill to be a function.");
}
if (
typeof PromisePonyfill !== "undefined" &&
typeof PromisePonyfill !== "function"
) {
throw new Error("Expected PromisePonyfill to be a function.");
}
}
var SCRIPT_LOADING_STATE = {
INITIAL: "initial",
PENDING: "pending",
REJECTED: "rejected",
RESOLVED: "resolved"
INITIAL: "initial",
PENDING: "pending",
REJECTED: "rejected",
RESOLVED: "resolved",
};

@@ -295,111 +492,146 @@ var ScriptContext = createContext(null);

function scriptReducer(state, action) {
switch (action.type) {
case "setLoadingStatus":
return {
options: _objectSpread({}, state.options),
loadingStatus: action.value
};
switch (action.type) {
case "setLoadingStatus":
return {
options: _objectSpread({}, state.options),
loadingStatus: action.value,
};
case "resetOptions":
// destroy existing script to make sure only one script loads at a time
destroySDKScript(state.options["data-react-paypal-script-id"]);
return {
loadingStatus: SCRIPT_LOADING_STATE.PENDING,
options: _objectSpread(_objectSpread({}, action.value), {}, {
"data-react-paypal-script-id": "".concat(getNewScriptID())
})
};
case "resetOptions":
// destroy existing script to make sure only one script loads at a time
destroySDKScript(state.options["data-react-paypal-script-id"]);
return {
loadingStatus: SCRIPT_LOADING_STATE.PENDING,
options: _objectSpread(
_objectSpread({}, action.value),
{},
{
"data-react-paypal-script-id": "".concat(
getNewScriptID()
),
}
),
};
default:
{
return state;
}
}
default: {
return state;
}
}
}
function getNewScriptID() {
return "react-paypal-js-".concat(Math.random().toString(36).substring(7));
return "react-paypal-js-".concat(Math.random().toString(36).substring(7));
}
function destroySDKScript(reactPayPalScriptID) {
var scriptNode = document.querySelector("script[data-react-paypal-script-id=\"".concat(reactPayPalScriptID, "\"]"));
if (scriptNode === null) return;
var scriptNode = document.querySelector(
'script[data-react-paypal-script-id="'.concat(reactPayPalScriptID, '"]')
);
if (scriptNode === null) return;
if (scriptNode.parentNode) {
scriptNode.parentNode.removeChild(scriptNode);
}
if (scriptNode.parentNode) {
scriptNode.parentNode.removeChild(scriptNode);
}
}
function usePayPalScriptReducer() {
var scriptContext = useContext(ScriptContext);
var dispatchContext = useContext(ScriptDispatchContext);
var scriptContext = useContext(ScriptContext);
var dispatchContext = useContext(ScriptDispatchContext);
if (scriptContext === null || dispatchContext === null) {
throw new Error("usePayPalScriptReducer must be used within a PayPalScriptProvider");
}
if (scriptContext === null || dispatchContext === null) {
throw new Error(
"usePayPalScriptReducer must be used within a PayPalScriptProvider"
);
}
var loadingStatus = scriptContext.loadingStatus,
restScriptContext = _objectWithoutProperties(scriptContext, _excluded);
var loadingStatus = scriptContext.loadingStatus,
restScriptContext = _objectWithoutProperties(scriptContext, _excluded);
var derivedStatusContext = _objectSpread(_objectSpread({}, restScriptContext), {}, {
isInitial: loadingStatus === SCRIPT_LOADING_STATE.INITIAL,
isPending: loadingStatus === SCRIPT_LOADING_STATE.PENDING,
isResolved: loadingStatus === SCRIPT_LOADING_STATE.RESOLVED,
isRejected: loadingStatus === SCRIPT_LOADING_STATE.REJECTED
});
var derivedStatusContext = _objectSpread(
_objectSpread({}, restScriptContext),
{},
{
isInitial: loadingStatus === SCRIPT_LOADING_STATE.INITIAL,
isPending: loadingStatus === SCRIPT_LOADING_STATE.PENDING,
isResolved: loadingStatus === SCRIPT_LOADING_STATE.RESOLVED,
isRejected: loadingStatus === SCRIPT_LOADING_STATE.REJECTED,
}
);
return [derivedStatusContext, dispatchContext];
return [derivedStatusContext, dispatchContext];
}
var PayPalScriptProvider = function PayPalScriptProvider(_ref) {
var options = _ref.options,
children = _ref.children,
_ref$deferLoading = _ref.deferLoading,
deferLoading = _ref$deferLoading === void 0 ? false : _ref$deferLoading;
var initialState = {
options: _objectSpread(_objectSpread({}, options), {}, {
"data-react-paypal-script-id": "".concat(getNewScriptID())
}),
loadingStatus: deferLoading ? SCRIPT_LOADING_STATE.INITIAL : SCRIPT_LOADING_STATE.PENDING
};
var options = _ref.options,
children = _ref.children,
_ref$deferLoading = _ref.deferLoading,
deferLoading = _ref$deferLoading === void 0 ? false : _ref$deferLoading;
var initialState = {
options: _objectSpread(
_objectSpread({}, options),
{},
{
"data-react-paypal-script-id": "".concat(getNewScriptID()),
}
),
loadingStatus: deferLoading
? SCRIPT_LOADING_STATE.INITIAL
: SCRIPT_LOADING_STATE.PENDING,
};
var _useReducer = useReducer(scriptReducer, initialState),
_useReducer2 = _slicedToArray(_useReducer, 2),
state = _useReducer2[0],
dispatch = _useReducer2[1];
var _useReducer = useReducer(scriptReducer, initialState),
_useReducer2 = _slicedToArray(_useReducer, 2),
state = _useReducer2[0],
dispatch = _useReducer2[1];
useEffect(function () {
if (deferLoading === false && state.loadingStatus === SCRIPT_LOADING_STATE.INITIAL) {
return dispatch({
type: "setLoadingStatus",
value: SCRIPT_LOADING_STATE.PENDING
});
}
useEffect(
function () {
if (
deferLoading === false &&
state.loadingStatus === SCRIPT_LOADING_STATE.INITIAL
) {
return dispatch({
type: "setLoadingStatus",
value: SCRIPT_LOADING_STATE.PENDING,
});
}
if (state.loadingStatus !== SCRIPT_LOADING_STATE.PENDING) return;
var isSubscribed = true;
loadScript(state.options).then(function () {
if (isSubscribed) {
dispatch({
type: "setLoadingStatus",
value: SCRIPT_LOADING_STATE.RESOLVED
});
}
})["catch"](function () {
if (isSubscribed) {
dispatch({
type: "setLoadingStatus",
value: SCRIPT_LOADING_STATE.REJECTED
});
}
});
return function () {
isSubscribed = false;
};
}, [options, deferLoading, state.loadingStatus]);
return React.createElement(ScriptContext.Provider, {
value: state
}, React.createElement(ScriptDispatchContext.Provider, {
value: dispatch
}, children));
if (state.loadingStatus !== SCRIPT_LOADING_STATE.PENDING) return;
var isSubscribed = true;
loadScript(state.options)
.then(function () {
if (isSubscribed) {
dispatch({
type: "setLoadingStatus",
value: SCRIPT_LOADING_STATE.RESOLVED,
});
}
})
["catch"](function () {
if (isSubscribed) {
dispatch({
type: "setLoadingStatus",
value: SCRIPT_LOADING_STATE.REJECTED,
});
}
});
return function () {
isSubscribed = false;
};
},
[options, deferLoading, state.loadingStatus]
);
return React.createElement(
ScriptContext.Provider,
{
value: state,
},
React.createElement(
ScriptDispatchContext.Provider,
{
value: dispatch,
},
children
)
);
};

@@ -410,5 +642,8 @@

function getPayPalWindowNamespace() {
var namespace = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : DEFAULT_PAYPAL_NAMESPACE;
// eslint-disable-next-line @typescript-eslint/no-explicit-any
return window[namespace];
var namespace =
arguments.length > 0 && arguments[0] !== undefined
? arguments[0]
: DEFAULT_PAYPAL_NAMESPACE;
// eslint-disable-next-line @typescript-eslint/no-explicit-any
return window[namespace];
}

@@ -426,139 +661,182 @@ /**

var PayPalButtons = function PayPalButtons(_ref2) {
var _ref2$className = _ref2.className,
className = _ref2$className === void 0 ? "" : _ref2$className,
_ref2$disabled = _ref2.disabled,
disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
_ref2$children = _ref2.children,
children = _ref2$children === void 0 ? null : _ref2$children,
_ref2$forceReRender = _ref2.forceReRender,
forceReRender = _ref2$forceReRender === void 0 ? [] : _ref2$forceReRender,
buttonProps = _objectWithoutProperties(_ref2, _excluded2);
var _ref2$className = _ref2.className,
className = _ref2$className === void 0 ? "" : _ref2$className,
_ref2$disabled = _ref2.disabled,
disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
_ref2$children = _ref2.children,
children = _ref2$children === void 0 ? null : _ref2$children,
_ref2$forceReRender = _ref2.forceReRender,
forceReRender =
_ref2$forceReRender === void 0 ? [] : _ref2$forceReRender,
buttonProps = _objectWithoutProperties(_ref2, _excluded2);
var buttonsContainerRef = useRef(null);
var buttons = useRef(null);
var buttonsContainerRef = useRef(null);
var buttons = useRef(null);
var _usePayPalScriptReduc = usePayPalScriptReducer(),
_usePayPalScriptReduc2 = _slicedToArray(_usePayPalScriptReduc, 1),
_usePayPalScriptReduc3 = _usePayPalScriptReduc2[0],
isResolved = _usePayPalScriptReduc3.isResolved,
options = _usePayPalScriptReduc3.options;
var _usePayPalScriptReduc = usePayPalScriptReducer(),
_usePayPalScriptReduc2 = _slicedToArray(_usePayPalScriptReduc, 1),
_usePayPalScriptReduc3 = _usePayPalScriptReduc2[0],
isResolved = _usePayPalScriptReduc3.isResolved,
options = _usePayPalScriptReduc3.options;
var _useState = useState(null),
_useState2 = _slicedToArray(_useState, 2),
initActions = _useState2[0],
setInitActions = _useState2[1];
var _useState = useState(null),
_useState2 = _slicedToArray(_useState, 2),
initActions = _useState2[0],
setInitActions = _useState2[1];
var _useState3 = useState(true),
_useState4 = _slicedToArray(_useState3, 2),
isEligible = _useState4[0],
setIsEligible = _useState4[1];
var _useState3 = useState(true),
_useState4 = _slicedToArray(_useState3, 2),
isEligible = _useState4[0],
setIsEligible = _useState4[1];
var _useState5 = useState(null),
_useState6 = _slicedToArray(_useState5, 2),
setErrorState = _useState6[1];
var _useState5 = useState(null),
_useState6 = _slicedToArray(_useState5, 2),
setErrorState = _useState6[1];
function closeButtonsComponent() {
if (buttons.current !== null) {
buttons.current.close()["catch"](function () {// ignore errors when closing the component
});
}
} // useEffect hook for rendering the buttons
function closeButtonsComponent() {
if (buttons.current !== null) {
buttons.current.close()["catch"](function () {
// ignore errors when closing the component
});
}
} // useEffect hook for rendering the buttons
useEffect(function () {
// verify the sdk script has successfully loaded
if (isResolved === false) {
return closeButtonsComponent;
}
useEffect(function () {
// verify the sdk script has successfully loaded
if (isResolved === false) {
return closeButtonsComponent;
}
var paypalWindowNamespace = getPayPalWindowNamespace(
options["data-namespace"]
); // verify dependency on window object
var paypalWindowNamespace = getPayPalWindowNamespace(options["data-namespace"]); // verify dependency on window object
if (
paypalWindowNamespace === undefined ||
paypalWindowNamespace.Buttons === undefined
) {
setErrorState(function () {
throw new Error(getErrorMessage$2(options));
});
return closeButtonsComponent;
}
if (paypalWindowNamespace === undefined || paypalWindowNamespace.Buttons === undefined) {
setErrorState(function () {
throw new Error(getErrorMessage$2(options));
});
return closeButtonsComponent;
}
var decoratedOnInit = function decoratedOnInit(data, actions) {
setInitActions(actions);
var decoratedOnInit = function decoratedOnInit(data, actions) {
setInitActions(actions);
if (typeof buttonProps.onInit === "function") {
buttonProps.onInit(data, actions);
}
};
if (typeof buttonProps.onInit === "function") {
buttonProps.onInit(data, actions);
}
};
buttons.current = paypalWindowNamespace.Buttons(
_objectSpread(
_objectSpread({}, buttonProps),
{},
{
onInit: decoratedOnInit,
}
)
); // only render the button when eligible
buttons.current = paypalWindowNamespace.Buttons(_objectSpread(_objectSpread({}, buttonProps), {}, {
onInit: decoratedOnInit
})); // only render the button when eligible
if (buttons.current.isEligible() === false) {
setIsEligible(false);
return closeButtonsComponent;
}
if (buttons.current.isEligible() === false) {
setIsEligible(false);
return closeButtonsComponent;
}
if (buttonsContainerRef.current === null) {
return closeButtonsComponent;
}
if (buttonsContainerRef.current === null) {
return closeButtonsComponent;
}
buttons.current
.render(buttonsContainerRef.current)
["catch"](function (err) {
// component failed to render, possibly because it was closed or destroyed.
if (
buttonsContainerRef.current === null ||
buttonsContainerRef.current.children.length === 0
) {
// paypal buttons container is no longer in the DOM, we can safely ignore the error
return;
} // paypal buttons container is still in the DOM
buttons.current.render(buttonsContainerRef.current)["catch"](function (err) {
// component failed to render, possibly because it was closed or destroyed.
if (buttonsContainerRef.current === null || buttonsContainerRef.current.children.length === 0) {
// paypal buttons container is no longer in the DOM, we can safely ignore the error
return;
} // paypal buttons container is still in the DOM
setErrorState(function () {
throw new Error(
"Failed to render <PayPalButtons /> component. ".concat(
err
)
);
});
});
return closeButtonsComponent;
}, [isResolved].concat(_toConsumableArray(forceReRender), [
buttonProps.fundingSource,
])); // useEffect hook for managing disabled state
useEffect(
function () {
if (initActions === null) {
return;
}
setErrorState(function () {
throw new Error("Failed to render <PayPalButtons /> component. ".concat(err));
});
});
return closeButtonsComponent;
}, [isResolved].concat(_toConsumableArray(forceReRender), [buttonProps.fundingSource])); // useEffect hook for managing disabled state
if (disabled === true) {
initActions.disable()["catch"](function () {
// ignore errors when disabling the component
});
} else {
initActions.enable()["catch"](function () {
// ignore errors when enabling the component
});
}
},
[disabled, initActions]
);
var isDisabledStyle = disabled
? {
opacity: 0.33,
}
: {};
var classNames = ""
.concat(className, " ")
.concat(disabled ? "paypal-buttons-disabled" : "")
.trim();
useEffect(function () {
if (initActions === null) {
return;
if (isEligible === false) {
return children;
}
if (disabled === true) {
initActions.disable()["catch"](function () {// ignore errors when disabling the component
});
} else {
initActions.enable()["catch"](function () {// ignore errors when enabling the component
});
}
}, [disabled, initActions]);
var isDisabledStyle = disabled ? {
opacity: 0.33
} : {};
var classNames = "".concat(className, " ").concat(disabled ? "paypal-buttons-disabled" : "").trim();
if (isEligible === false) {
return children;
}
return React.createElement("div", {
ref: buttonsContainerRef,
style: isDisabledStyle,
className: classNames
});
return React.createElement("div", {
ref: buttonsContainerRef,
style: isDisabledStyle,
className: classNames,
});
};
function getErrorMessage$2(_ref3) {
var _ref3$components = _ref3.components,
components = _ref3$components === void 0 ? "" : _ref3$components,
_ref3$dataNamespace = _ref3["data-namespace"],
dataNamespace = _ref3$dataNamespace === void 0 ? DEFAULT_PAYPAL_NAMESPACE : _ref3$dataNamespace;
var errorMessage = "Unable to render <PayPalButtons /> because window.".concat(dataNamespace, ".Buttons is undefined."); // the JS SDK includes the Buttons component by default when no 'components' are specified.
// The 'buttons' component must be included in the 'components' list when using it with other components.
var _ref3$components = _ref3.components,
components = _ref3$components === void 0 ? "" : _ref3$components,
_ref3$dataNamespace = _ref3["data-namespace"],
dataNamespace =
_ref3$dataNamespace === void 0
? DEFAULT_PAYPAL_NAMESPACE
: _ref3$dataNamespace;
var errorMessage =
"Unable to render <PayPalButtons /> because window.".concat(
dataNamespace,
".Buttons is undefined."
); // the JS SDK includes the Buttons component by default when no 'components' are specified.
// The 'buttons' component must be included in the 'components' list when using it with other components.
if (components.length && !components.includes("buttons")) {
var expectedComponents = "".concat(components, ",buttons");
errorMessage += "\nTo fix the issue, add 'buttons' to the list of components passed to the parent PayPalScriptProvider:" + "\n`<PayPalScriptProvider options={{ components: '".concat(expectedComponents, "'}}>`.");
}
if (components.length && !components.includes("buttons")) {
var expectedComponents = "".concat(components, ",buttons");
errorMessage +=
"\nTo fix the issue, add 'buttons' to the list of components passed to the parent PayPalScriptProvider:" +
"\n`<PayPalScriptProvider options={{ components: '".concat(
expectedComponents,
"'}}>`."
);
}
return errorMessage;
return errorMessage;
}

@@ -588,187 +866,254 @@ /**

var PayPalMarks = function PayPalMarks(_ref4) {
var _ref4$className = _ref4.className,
className = _ref4$className === void 0 ? "" : _ref4$className,
markProps = _objectWithoutProperties(_ref4, _excluded3);
var _ref4$className = _ref4.className,
className = _ref4$className === void 0 ? "" : _ref4$className,
markProps = _objectWithoutProperties(_ref4, _excluded3);
var _usePayPalScriptReduc4 = usePayPalScriptReducer(),
_usePayPalScriptReduc5 = _slicedToArray(_usePayPalScriptReduc4, 1),
_usePayPalScriptReduc6 = _usePayPalScriptReduc5[0],
isResolved = _usePayPalScriptReduc6.isResolved,
options = _usePayPalScriptReduc6.options;
var _usePayPalScriptReduc4 = usePayPalScriptReducer(),
_usePayPalScriptReduc5 = _slicedToArray(_usePayPalScriptReduc4, 1),
_usePayPalScriptReduc6 = _usePayPalScriptReduc5[0],
isResolved = _usePayPalScriptReduc6.isResolved,
options = _usePayPalScriptReduc6.options;
var markContainerRef = useRef(null);
var mark = useRef(null);
var markContainerRef = useRef(null);
var mark = useRef(null);
var _useState7 = useState(null),
_useState8 = _slicedToArray(_useState7, 2),
setErrorState = _useState8[1];
var _useState7 = useState(null),
_useState8 = _slicedToArray(_useState7, 2),
setErrorState = _useState8[1];
useEffect(function () {
// verify the sdk script has successfully loaded
if (isResolved === false) {
return;
} // don't rerender when already rendered
useEffect(
function () {
// verify the sdk script has successfully loaded
if (isResolved === false) {
return;
} // don't rerender when already rendered
if (mark.current !== null) {
return;
}
if (mark.current !== null) {
return;
}
var paypalWindowNamespace = getPayPalWindowNamespace(
options["data-namespace"]
); // verify dependency on window object
var paypalWindowNamespace = getPayPalWindowNamespace(options["data-namespace"]); // verify dependency on window object
if (
paypalWindowNamespace === undefined ||
paypalWindowNamespace.Marks === undefined
) {
setErrorState(function () {
throw new Error(getErrorMessage$1(options));
});
return;
}
if (paypalWindowNamespace === undefined || paypalWindowNamespace.Marks === undefined) {
setErrorState(function () {
throw new Error(getErrorMessage$1(options));
});
return;
}
mark.current = paypalWindowNamespace.Marks(
_objectSpread({}, markProps)
); // only render the mark when eligible
mark.current = paypalWindowNamespace.Marks(_objectSpread({}, markProps)); // only render the mark when eligible
if (mark.current.isEligible() === false) {
return;
}
if (mark.current.isEligible() === false) {
return;
}
if (markContainerRef.current === null) {
return;
}
if (markContainerRef.current === null) {
return;
}
mark.current
.render(markContainerRef.current)
["catch"](function (err) {
// component failed to render, possibly because it was closed or destroyed.
if (
markContainerRef.current === null ||
markContainerRef.current.children.length === 0
) {
// paypal marks container is no longer in the DOM, we can safely ignore the error
return;
} // paypal marks container is still in the DOM
mark.current.render(markContainerRef.current)["catch"](function (err) {
// component failed to render, possibly because it was closed or destroyed.
if (markContainerRef.current === null || markContainerRef.current.children.length === 0) {
// paypal marks container is no longer in the DOM, we can safely ignore the error
return;
} // paypal marks container is still in the DOM
setErrorState(function () {
throw new Error("Failed to render <PayPalMarks /> component. ".concat(err));
});
setErrorState(function () {
throw new Error(
"Failed to render <PayPalMarks /> component. ".concat(
err
)
);
});
});
},
[isResolved, markProps.fundingSource]
);
return React.createElement("div", {
ref: markContainerRef,
className: className,
});
}, [isResolved, markProps.fundingSource]);
return React.createElement("div", {
ref: markContainerRef,
className: className
});
};
function getErrorMessage$1(_ref5) {
var _ref5$components = _ref5.components,
components = _ref5$components === void 0 ? "" : _ref5$components,
_ref5$dataNamespace = _ref5["data-namespace"],
dataNamespace = _ref5$dataNamespace === void 0 ? DEFAULT_PAYPAL_NAMESPACE : _ref5$dataNamespace;
var errorMessage = "Unable to render <PayPalMarks /> because window.".concat(dataNamespace, ".Marks is undefined."); // the JS SDK does not load the Marks component by default. It must be passed into the "components" query parameter.
var _ref5$components = _ref5.components,
components = _ref5$components === void 0 ? "" : _ref5$components,
_ref5$dataNamespace = _ref5["data-namespace"],
dataNamespace =
_ref5$dataNamespace === void 0
? DEFAULT_PAYPAL_NAMESPACE
: _ref5$dataNamespace;
var errorMessage =
"Unable to render <PayPalMarks /> because window.".concat(
dataNamespace,
".Marks is undefined."
); // the JS SDK does not load the Marks component by default. It must be passed into the "components" query parameter.
if (!components.includes("marks")) {
var expectedComponents = components ? "".concat(components, ",marks") : "marks";
errorMessage += "\nTo fix the issue, add 'marks' to the list of components passed to the parent PayPalScriptProvider:" + "\n`<PayPalScriptProvider options={{ components: '".concat(expectedComponents, "'}}>`.");
}
if (!components.includes("marks")) {
var expectedComponents = components
? "".concat(components, ",marks")
: "marks";
errorMessage +=
"\nTo fix the issue, add 'marks' to the list of components passed to the parent PayPalScriptProvider:" +
"\n`<PayPalScriptProvider options={{ components: '".concat(
expectedComponents,
"'}}>`."
);
}
return errorMessage;
return errorMessage;
}
var PayPalMessages = function PayPalMessages(_ref6) {
var _ref6$className = _ref6.className,
className = _ref6$className === void 0 ? "" : _ref6$className,
_ref6$forceReRender = _ref6.forceReRender,
forceReRender = _ref6$forceReRender === void 0 ? [] : _ref6$forceReRender,
messageProps = _objectWithoutProperties(_ref6, _excluded4);
var _ref6$className = _ref6.className,
className = _ref6$className === void 0 ? "" : _ref6$className,
_ref6$forceReRender = _ref6.forceReRender,
forceReRender =
_ref6$forceReRender === void 0 ? [] : _ref6$forceReRender,
messageProps = _objectWithoutProperties(_ref6, _excluded4);
var _usePayPalScriptReduc7 = usePayPalScriptReducer(),
_usePayPalScriptReduc8 = _slicedToArray(_usePayPalScriptReduc7, 1),
_usePayPalScriptReduc9 = _usePayPalScriptReduc8[0],
isResolved = _usePayPalScriptReduc9.isResolved,
options = _usePayPalScriptReduc9.options;
var _usePayPalScriptReduc7 = usePayPalScriptReducer(),
_usePayPalScriptReduc8 = _slicedToArray(_usePayPalScriptReduc7, 1),
_usePayPalScriptReduc9 = _usePayPalScriptReduc8[0],
isResolved = _usePayPalScriptReduc9.isResolved,
options = _usePayPalScriptReduc9.options;
var messagesContainerRef = useRef(null);
var messages = useRef(null);
var messagesContainerRef = useRef(null);
var messages = useRef(null);
var _useState9 = useState(null),
_useState10 = _slicedToArray(_useState9, 2),
setErrorState = _useState10[1];
var _useState9 = useState(null),
_useState10 = _slicedToArray(_useState9, 2),
setErrorState = _useState10[1];
useEffect(function () {
// verify the sdk script has successfully loaded
if (isResolved === false) {
return;
}
useEffect(function () {
// verify the sdk script has successfully loaded
if (isResolved === false) {
return;
}
var paypalWindowNamespace = getPayPalWindowNamespace(options["data-namespace"]); // verify dependency on window object
var paypalWindowNamespace = getPayPalWindowNamespace(
options["data-namespace"]
); // verify dependency on window object
if (paypalWindowNamespace === undefined || paypalWindowNamespace.Messages === undefined) {
setErrorState(function () {
throw new Error(getErrorMessage(options));
});
return;
}
if (
paypalWindowNamespace === undefined ||
paypalWindowNamespace.Messages === undefined
) {
setErrorState(function () {
throw new Error(getErrorMessage(options));
});
return;
}
messages.current = paypalWindowNamespace.Messages(_objectSpread({}, messageProps));
messages.current = paypalWindowNamespace.Messages(
_objectSpread({}, messageProps)
);
if (messagesContainerRef.current === null) {
return;
}
if (messagesContainerRef.current === null) {
return;
}
messages.current.render(messagesContainerRef.current)["catch"](function (err) {
// component failed to render, possibly because it was closed or destroyed.
if (messagesContainerRef.current === null || messagesContainerRef.current.children.length === 0) {
// paypal messages container is no longer in the DOM, we can safely ignore the error
return;
} // paypal messages container is still in the DOM
messages.current
.render(messagesContainerRef.current)
["catch"](function (err) {
// component failed to render, possibly because it was closed or destroyed.
if (
messagesContainerRef.current === null ||
messagesContainerRef.current.children.length === 0
) {
// paypal messages container is no longer in the DOM, we can safely ignore the error
return;
} // paypal messages container is still in the DOM
setErrorState(function () {
throw new Error("Failed to render <PayPalMessages /> component. ".concat(err));
});
setErrorState(function () {
throw new Error(
"Failed to render <PayPalMessages /> component. ".concat(
err
)
);
});
});
}, [isResolved].concat(_toConsumableArray(forceReRender)));
return React.createElement("div", {
ref: messagesContainerRef,
className: className,
});
}, [isResolved].concat(_toConsumableArray(forceReRender)));
return React.createElement("div", {
ref: messagesContainerRef,
className: className
});
};
function getErrorMessage(_ref7) {
var _ref7$components = _ref7.components,
components = _ref7$components === void 0 ? "" : _ref7$components,
_ref7$dataNamespace = _ref7["data-namespace"],
dataNamespace = _ref7$dataNamespace === void 0 ? DEFAULT_PAYPAL_NAMESPACE : _ref7$dataNamespace;
var errorMessage = "Unable to render <PayPalMessages /> because window.".concat(dataNamespace, ".Messages is undefined."); // the JS SDK does not load the Messages component by default. It must be passed into the "components" query parameter.
var _ref7$components = _ref7.components,
components = _ref7$components === void 0 ? "" : _ref7$components,
_ref7$dataNamespace = _ref7["data-namespace"],
dataNamespace =
_ref7$dataNamespace === void 0
? DEFAULT_PAYPAL_NAMESPACE
: _ref7$dataNamespace;
var errorMessage =
"Unable to render <PayPalMessages /> because window.".concat(
dataNamespace,
".Messages is undefined."
); // the JS SDK does not load the Messages component by default. It must be passed into the "components" query parameter.
if (!components.includes("messages")) {
var expectedComponents = components ? "".concat(components, ",messages") : "messages";
errorMessage += "\nTo fix the issue, add 'messages' to the list of components passed to the parent PayPalScriptProvider:" + "\n`<PayPalScriptProvider options={{ components: '".concat(expectedComponents, "'}}>`.");
}
if (!components.includes("messages")) {
var expectedComponents = components
? "".concat(components, ",messages")
: "messages";
errorMessage +=
"\nTo fix the issue, add 'messages' to the list of components passed to the parent PayPalScriptProvider:" +
"\n`<PayPalScriptProvider options={{ components: '".concat(
expectedComponents,
"'}}>`."
);
}
return errorMessage;
return errorMessage;
}
var FUNDING = {
PAYPAL: 'paypal',
VENMO: 'venmo',
APPLEPAY: 'applepay',
ITAU: 'itau',
CREDIT: 'credit',
PAYLATER: 'paylater',
CARD: 'card',
IDEAL: 'ideal',
SEPA: 'sepa',
BANCONTACT: 'bancontact',
GIROPAY: 'giropay',
SOFORT: 'sofort',
EPS: 'eps',
MYBANK: 'mybank',
P24: 'p24',
VERKKOPANKKI: 'verkkopankki',
PAYU: 'payu',
BLIK: 'blik',
TRUSTLY: 'trustly',
ZIMPLER: 'zimpler',
MAXIMA: 'maxima',
OXXO: 'oxxo',
BOLETO: 'boleto',
WECHATPAY: 'wechatpay',
MERCADOPAGO: 'mercadopago'
PAYPAL: "paypal",
VENMO: "venmo",
APPLEPAY: "applepay",
ITAU: "itau",
CREDIT: "credit",
PAYLATER: "paylater",
CARD: "card",
IDEAL: "ideal",
SEPA: "sepa",
BANCONTACT: "bancontact",
GIROPAY: "giropay",
SOFORT: "sofort",
EPS: "eps",
MYBANK: "mybank",
P24: "p24",
VERKKOPANKKI: "verkkopankki",
PAYU: "payu",
BLIK: "blik",
TRUSTLY: "trustly",
ZIMPLER: "zimpler",
MAXIMA: "maxima",
OXXO: "oxxo",
BOLETO: "boleto",
WECHATPAY: "wechatpay",
MERCADOPAGO: "mercadopago",
};
export { FUNDING, PayPalButtons, PayPalMarks, PayPalMessages, PayPalScriptProvider, usePayPalScriptReducer };
export {
FUNDING,
PayPalButtons,
PayPalMarks,
PayPalMessages,
PayPalScriptProvider,
usePayPalScriptReducer,
};

@@ -1,10 +0,12 @@

'use strict';
"use strict";
Object.defineProperty(exports, '__esModule', { value: true });
Object.defineProperty(exports, "__esModule", { value: true });
var React = require('react');
var React = require("react");
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
function _interopDefaultLegacy(e) {
return e && typeof e === "object" && "default" in e ? e : { default: e };
}
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var React__default = /*#__PURE__*/ _interopDefaultLegacy(React);

@@ -28,118 +30,136 @@ /*!

function findScript(url, attributes) {
var currentScript = document.querySelector("script[src=\"" + url + "\"]");
if (currentScript === null) return null;
var nextScript = createScriptElement(url, attributes); // ignore the data-uid-auto attribute that gets auto-assigned to every script tag
var currentScript = document.querySelector('script[src="' + url + '"]');
if (currentScript === null) return null;
var nextScript = createScriptElement(url, attributes); // ignore the data-uid-auto attribute that gets auto-assigned to every script tag
var currentScriptDataset = Object.assign({}, currentScript.dataset);
delete currentScriptDataset.uidAuto; // check if the new script has the same number of data attributes
var currentScriptDataset = Object.assign({}, currentScript.dataset);
delete currentScriptDataset.uidAuto; // check if the new script has the same number of data attributes
if (Object.keys(currentScriptDataset).length !== Object.keys(nextScript.dataset).length) {
return null;
}
if (
Object.keys(currentScriptDataset).length !==
Object.keys(nextScript.dataset).length
) {
return null;
}
var isExactMatch = true; // check if the data attribute values are the same
var isExactMatch = true; // check if the data attribute values are the same
Object.keys(currentScriptDataset).forEach(function (key) {
if (currentScriptDataset[key] !== nextScript.dataset[key]) {
isExactMatch = false;
}
});
return isExactMatch ? currentScript : null;
Object.keys(currentScriptDataset).forEach(function (key) {
if (currentScriptDataset[key] !== nextScript.dataset[key]) {
isExactMatch = false;
}
});
return isExactMatch ? currentScript : null;
}
function insertScriptElement(_a) {
var url = _a.url,
attributes = _a.attributes,
onSuccess = _a.onSuccess,
onError = _a.onError;
var newScript = createScriptElement(url, attributes);
newScript.onerror = onError;
newScript.onload = onSuccess;
document.head.insertBefore(newScript, document.head.firstElementChild);
var url = _a.url,
attributes = _a.attributes,
onSuccess = _a.onSuccess,
onError = _a.onError;
var newScript = createScriptElement(url, attributes);
newScript.onerror = onError;
newScript.onload = onSuccess;
document.head.insertBefore(newScript, document.head.firstElementChild);
}
function processOptions(options) {
var sdkBaseURL = "https://www.paypal.com/sdk/js";
var sdkBaseURL = "https://www.paypal.com/sdk/js";
if (options.sdkBaseURL) {
sdkBaseURL = options.sdkBaseURL;
delete options.sdkBaseURL;
}
if (options.sdkBaseURL) {
sdkBaseURL = options.sdkBaseURL;
delete options.sdkBaseURL;
}
var processedMerchantIDAttributes = processMerchantID(options["merchant-id"], options["data-merchant-id"]);
var newOptions = Object.assign({}, options, processedMerchantIDAttributes);
var processedMerchantIDAttributes = processMerchantID(
options["merchant-id"],
options["data-merchant-id"]
);
var newOptions = Object.assign({}, options, processedMerchantIDAttributes);
var _a = Object.keys(newOptions).filter(function (key) {
return typeof newOptions[key] !== "undefined" && newOptions[key] !== null && newOptions[key] !== "";
}).reduce(function (accumulator, key) {
var value = newOptions[key].toString();
var _a = Object.keys(newOptions)
.filter(function (key) {
return (
typeof newOptions[key] !== "undefined" &&
newOptions[key] !== null &&
newOptions[key] !== ""
);
})
.reduce(
function (accumulator, key) {
var value = newOptions[key].toString();
if (key.substring(0, 5) === "data-") {
accumulator.dataAttributes[key] = value;
} else {
accumulator.queryParams[key] = value;
}
if (key.substring(0, 5) === "data-") {
accumulator.dataAttributes[key] = value;
} else {
accumulator.queryParams[key] = value;
}
return accumulator;
}, {
queryParams: {},
dataAttributes: {}
}),
queryParams = _a.queryParams,
dataAttributes = _a.dataAttributes;
return accumulator;
},
{
queryParams: {},
dataAttributes: {},
}
),
queryParams = _a.queryParams,
dataAttributes = _a.dataAttributes;
return {
url: sdkBaseURL + "?" + objectToQueryString(queryParams),
dataAttributes: dataAttributes
};
return {
url: sdkBaseURL + "?" + objectToQueryString(queryParams),
dataAttributes: dataAttributes,
};
}
function objectToQueryString(params) {
var queryString = "";
Object.keys(params).forEach(function (key) {
if (queryString.length !== 0) queryString += "&";
queryString += key + "=" + params[key];
});
return queryString;
var queryString = "";
Object.keys(params).forEach(function (key) {
if (queryString.length !== 0) queryString += "&";
queryString += key + "=" + params[key];
});
return queryString;
}
function createScriptElement(url, attributes) {
if (attributes === void 0) {
attributes = {};
}
if (attributes === void 0) {
attributes = {};
}
var newScript = document.createElement("script");
newScript.src = url;
Object.keys(attributes).forEach(function (key) {
newScript.setAttribute(key, attributes[key]);
var newScript = document.createElement("script");
newScript.src = url;
Object.keys(attributes).forEach(function (key) {
newScript.setAttribute(key, attributes[key]);
if (key === "data-csp-nonce") {
newScript.setAttribute("nonce", attributes["data-csp-nonce"]);
}
});
return newScript;
if (key === "data-csp-nonce") {
newScript.setAttribute("nonce", attributes["data-csp-nonce"]);
}
});
return newScript;
}
function processMerchantID(merchantID, dataMerchantID) {
var newMerchantID = "";
var newDataMerchantID = "";
var newMerchantID = "";
var newDataMerchantID = "";
if (Array.isArray(merchantID)) {
if (merchantID.length > 1) {
newMerchantID = "*";
newDataMerchantID = merchantID.toString();
} else {
newMerchantID = merchantID.toString();
if (Array.isArray(merchantID)) {
if (merchantID.length > 1) {
newMerchantID = "*";
newDataMerchantID = merchantID.toString();
} else {
newMerchantID = merchantID.toString();
}
} else if (typeof merchantID === "string" && merchantID.length > 0) {
newMerchantID = merchantID;
} else if (
typeof dataMerchantID === "string" &&
dataMerchantID.length > 0
) {
newMerchantID = "*";
newDataMerchantID = dataMerchantID;
}
} else if (typeof merchantID === "string" && merchantID.length > 0) {
newMerchantID = merchantID;
} else if (typeof dataMerchantID === "string" && dataMerchantID.length > 0) {
newMerchantID = "*";
newDataMerchantID = dataMerchantID;
}
return {
"merchant-id": newMerchantID,
"data-merchant-id": newDataMerchantID
};
return {
"merchant-id": newMerchantID,
"data-merchant-id": newDataMerchantID,
};
}

@@ -154,35 +174,39 @@ /**

function loadScript(options, PromisePonyfill) {
if (PromisePonyfill === void 0) {
PromisePonyfill = getDefaultPromiseImplementation();
}
if (PromisePonyfill === void 0) {
PromisePonyfill = getDefaultPromiseImplementation();
}
validateArguments(options, PromisePonyfill); // resolve with null when running in Node
validateArguments(options, PromisePonyfill); // resolve with null when running in Node
if (typeof window === "undefined") return PromisePonyfill.resolve(null);
if (typeof window === "undefined") return PromisePonyfill.resolve(null);
var _a = processOptions(options),
url = _a.url,
dataAttributes = _a.dataAttributes;
var _a = processOptions(options),
url = _a.url,
dataAttributes = _a.dataAttributes;
var namespace = dataAttributes["data-namespace"] || "paypal";
var existingWindowNamespace = getPayPalWindowNamespace$1(namespace); // resolve with the existing global paypal namespace when a script with the same params already exists
var namespace = dataAttributes["data-namespace"] || "paypal";
var existingWindowNamespace = getPayPalWindowNamespace$1(namespace); // resolve with the existing global paypal namespace when a script with the same params already exists
if (findScript(url, dataAttributes) && existingWindowNamespace) {
return PromisePonyfill.resolve(existingWindowNamespace);
}
if (findScript(url, dataAttributes) && existingWindowNamespace) {
return PromisePonyfill.resolve(existingWindowNamespace);
}
return loadCustomScript({
url: url,
attributes: dataAttributes
}, PromisePonyfill).then(function () {
var newWindowNamespace = getPayPalWindowNamespace$1(namespace);
return loadCustomScript(
{
url: url,
attributes: dataAttributes,
},
PromisePonyfill
).then(function () {
var newWindowNamespace = getPayPalWindowNamespace$1(namespace);
if (newWindowNamespace) {
return newWindowNamespace;
}
if (newWindowNamespace) {
return newWindowNamespace;
}
throw new Error("The window." + namespace + " global variable is not available.");
});
throw new Error(
"The window." + namespace + " global variable is not available."
);
});
}

@@ -197,57 +221,63 @@ /**

function loadCustomScript(options, PromisePonyfill) {
if (PromisePonyfill === void 0) {
PromisePonyfill = getDefaultPromiseImplementation();
}
if (PromisePonyfill === void 0) {
PromisePonyfill = getDefaultPromiseImplementation();
}
validateArguments(options, PromisePonyfill);
var url = options.url,
attributes = options.attributes;
validateArguments(options, PromisePonyfill);
var url = options.url,
attributes = options.attributes;
if (typeof url !== "string" || url.length === 0) {
throw new Error("Invalid url.");
}
if (typeof url !== "string" || url.length === 0) {
throw new Error("Invalid url.");
}
if (typeof attributes !== "undefined" && typeof attributes !== "object") {
throw new Error("Expected attributes to be an object.");
}
if (typeof attributes !== "undefined" && typeof attributes !== "object") {
throw new Error("Expected attributes to be an object.");
}
return new PromisePonyfill(function (resolve, reject) {
// resolve with undefined when running in Node
if (typeof window === "undefined") return resolve();
insertScriptElement({
url: url,
attributes: attributes,
onSuccess: function onSuccess() {
return resolve();
},
onError: function onError() {
return reject(new Error("The script \"" + url + "\" failed to load."));
}
return new PromisePonyfill(function (resolve, reject) {
// resolve with undefined when running in Node
if (typeof window === "undefined") return resolve();
insertScriptElement({
url: url,
attributes: attributes,
onSuccess: function onSuccess() {
return resolve();
},
onError: function onError() {
return reject(
new Error('The script "' + url + '" failed to load.')
);
},
});
});
});
}
function getDefaultPromiseImplementation() {
if (typeof Promise === "undefined") {
throw new Error("Promise is undefined. To resolve the issue, use a Promise polyfill.");
}
if (typeof Promise === "undefined") {
throw new Error(
"Promise is undefined. To resolve the issue, use a Promise polyfill."
);
}
return Promise;
return Promise;
}
function getPayPalWindowNamespace$1(namespace) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
return window[namespace];
// eslint-disable-next-line @typescript-eslint/no-explicit-any
return window[namespace];
}
function validateArguments(options, PromisePonyfill) {
if (typeof options !== "object" || options === null) {
throw new Error("Expected an options object.");
}
if (typeof options !== "object" || options === null) {
throw new Error("Expected an options object.");
}
if (typeof PromisePonyfill !== "undefined" && typeof PromisePonyfill !== "function") {
throw new Error("Expected PromisePonyfill to be a function.");
}
if (
typeof PromisePonyfill !== "undefined" &&
typeof PromisePonyfill !== "function"
) {
throw new Error("Expected PromisePonyfill to be a function.");
}
}

@@ -291,5 +321,6 @@

function destroySDKScript(reactPayPalScriptID) {
const scriptNode = document.querySelector(`script[data-react-paypal-script-id="${reactPayPalScriptID}"]`);
if (scriptNode === null)
return;
const scriptNode = document.querySelector(
`script[data-react-paypal-script-id="${reactPayPalScriptID}"]`
);
if (scriptNode === null) return;
if (scriptNode.parentNode) {

@@ -303,3 +334,5 @@ scriptNode.parentNode.removeChild(scriptNode);

if (scriptContext === null || dispatchContext === null) {
throw new Error("usePayPalScriptReducer must be used within a PayPalScriptProvider");
throw new Error(
"usePayPalScriptReducer must be used within a PayPalScriptProvider"
);
}

@@ -316,3 +349,3 @@ const { loadingStatus, ...restScriptContext } = scriptContext;

}
const PayPalScriptProvider = ({ options, children, deferLoading = false, }) => {
const PayPalScriptProvider = ({ options, children, deferLoading = false }) => {
const initialState = {

@@ -329,4 +362,6 @@ options: {

React.useEffect(() => {
if (deferLoading === false &&
state.loadingStatus === SCRIPT_LOADING_STATE.INITIAL) {
if (
deferLoading === false &&
state.loadingStatus === SCRIPT_LOADING_STATE.INITIAL
) {
return dispatch({

@@ -337,22 +372,21 @@ type: "setLoadingStatus",

}
if (state.loadingStatus !== SCRIPT_LOADING_STATE.PENDING)
return;
if (state.loadingStatus !== SCRIPT_LOADING_STATE.PENDING) return;
let isSubscribed = true;
loadScript(state.options)
.then(() => {
if (isSubscribed) {
dispatch({
type: "setLoadingStatus",
value: SCRIPT_LOADING_STATE.RESOLVED,
});
}
})
if (isSubscribed) {
dispatch({
type: "setLoadingStatus",
value: SCRIPT_LOADING_STATE.RESOLVED,
});
}
})
.catch(() => {
if (isSubscribed) {
dispatch({
type: "setLoadingStatus",
value: SCRIPT_LOADING_STATE.REJECTED,
});
}
});
if (isSubscribed) {
dispatch({
type: "setLoadingStatus",
value: SCRIPT_LOADING_STATE.REJECTED,
});
}
});
return () => {

@@ -362,4 +396,11 @@ isSubscribed = false;

}, [options, deferLoading, state.loadingStatus]);
return (React__default['default'].createElement(ScriptContext.Provider, { value: state },
React__default['default'].createElement(ScriptDispatchContext.Provider, { value: dispatch }, children)));
return React__default["default"].createElement(
ScriptContext.Provider,
{ value: state },
React__default["default"].createElement(
ScriptDispatchContext.Provider,
{ value: dispatch },
children
)
);
};

@@ -383,3 +424,9 @@

*/
const PayPalButtons = ({ className = "", disabled = false, children = null, forceReRender = [], ...buttonProps }) => {
const PayPalButtons = ({
className = "",
disabled = false,
children = null,
forceReRender = [],
...buttonProps
}) => {
const buttonsContainerRef = React.useRef(null);

@@ -404,6 +451,10 @@ const buttons = React.useRef(null);

}
const paypalWindowNamespace = getPayPalWindowNamespace(options["data-namespace"]);
const paypalWindowNamespace = getPayPalWindowNamespace(
options["data-namespace"]
);
// verify dependency on window object
if (paypalWindowNamespace === undefined ||
paypalWindowNamespace.Buttons === undefined) {
if (
paypalWindowNamespace === undefined ||
paypalWindowNamespace.Buttons === undefined
) {
setErrorState(() => {

@@ -434,4 +485,6 @@ throw new Error(getErrorMessage$2(options));

// component failed to render, possibly because it was closed or destroyed.
if (buttonsContainerRef.current === null ||
buttonsContainerRef.current.children.length === 0) {
if (
buttonsContainerRef.current === null ||
buttonsContainerRef.current.children.length === 0
) {
// paypal buttons container is no longer in the DOM, we can safely ignore the error

@@ -442,3 +495,5 @@ return;

setErrorState(() => {
throw new Error(`Failed to render <PayPalButtons /> component. ${err}`);
throw new Error(
`Failed to render <PayPalButtons /> component. ${err}`
);
});

@@ -457,4 +512,3 @@ });

});
}
else {
} else {
initActions.enable().catch(() => {

@@ -466,9 +520,18 @@ // ignore errors when enabling the component

const isDisabledStyle = disabled ? { opacity: 0.33 } : {};
const classNames = `${className} ${disabled ? "paypal-buttons-disabled" : ""}`.trim();
const classNames = `${className} ${
disabled ? "paypal-buttons-disabled" : ""
}`.trim();
if (isEligible === false) {
return children;
}
return (React__default['default'].createElement("div", { ref: buttonsContainerRef, style: isDisabledStyle, className: classNames }));
return React__default["default"].createElement("div", {
ref: buttonsContainerRef,
style: isDisabledStyle,
className: classNames,
});
};
function getErrorMessage$2({ components = "", "data-namespace": dataNamespace = DEFAULT_PAYPAL_NAMESPACE, }) {
function getErrorMessage$2({
components = "",
"data-namespace": dataNamespace = DEFAULT_PAYPAL_NAMESPACE,
}) {
let errorMessage = `Unable to render <PayPalButtons /> because window.${dataNamespace}.Buttons is undefined.`;

@@ -481,3 +544,3 @@ // the JS SDK includes the Buttons component by default when no 'components' are specified.

"\nTo fix the issue, add 'buttons' to the list of components passed to the parent PayPalScriptProvider:" +
`\n\`<PayPalScriptProvider options={{ components: '${expectedComponents}'}}>\`.`;
`\n\`<PayPalScriptProvider options={{ components: '${expectedComponents}'}}>\`.`;
}

@@ -523,6 +586,10 @@ return errorMessage;

}
const paypalWindowNamespace = getPayPalWindowNamespace(options["data-namespace"]);
const paypalWindowNamespace = getPayPalWindowNamespace(
options["data-namespace"]
);
// verify dependency on window object
if (paypalWindowNamespace === undefined ||
paypalWindowNamespace.Marks === undefined) {
if (
paypalWindowNamespace === undefined ||
paypalWindowNamespace.Marks === undefined
) {
setErrorState(() => {

@@ -543,4 +610,6 @@ throw new Error(getErrorMessage$1(options));

// component failed to render, possibly because it was closed or destroyed.
if (markContainerRef.current === null ||
markContainerRef.current.children.length === 0) {
if (
markContainerRef.current === null ||
markContainerRef.current.children.length === 0
) {
// paypal marks container is no longer in the DOM, we can safely ignore the error

@@ -551,9 +620,17 @@ return;

setErrorState(() => {
throw new Error(`Failed to render <PayPalMarks /> component. ${err}`);
throw new Error(
`Failed to render <PayPalMarks /> component. ${err}`
);
});
});
}, [isResolved, markProps.fundingSource]);
return React__default['default'].createElement("div", { ref: markContainerRef, className: className });
return React__default["default"].createElement("div", {
ref: markContainerRef,
className: className,
});
};
function getErrorMessage$1({ components = "", "data-namespace": dataNamespace = DEFAULT_PAYPAL_NAMESPACE, }) {
function getErrorMessage$1({
components = "",
"data-namespace": dataNamespace = DEFAULT_PAYPAL_NAMESPACE,
}) {
let errorMessage = `Unable to render <PayPalMarks /> because window.${dataNamespace}.Marks is undefined.`;

@@ -565,3 +642,3 @@ // the JS SDK does not load the Marks component by default. It must be passed into the "components" query parameter.

"\nTo fix the issue, add 'marks' to the list of components passed to the parent PayPalScriptProvider:" +
`\n\`<PayPalScriptProvider options={{ components: '${expectedComponents}'}}>\`.`;
`\n\`<PayPalScriptProvider options={{ components: '${expectedComponents}'}}>\`.`;
}

@@ -571,3 +648,7 @@ return errorMessage;

const PayPalMessages = ({ className = "", forceReRender = [], ...messageProps }) => {
const PayPalMessages = ({
className = "",
forceReRender = [],
...messageProps
}) => {
const [{ isResolved, options }] = usePayPalScriptReducer();

@@ -582,6 +663,10 @@ const messagesContainerRef = React.useRef(null);

}
const paypalWindowNamespace = getPayPalWindowNamespace(options["data-namespace"]);
const paypalWindowNamespace = getPayPalWindowNamespace(
options["data-namespace"]
);
// verify dependency on window object
if (paypalWindowNamespace === undefined ||
paypalWindowNamespace.Messages === undefined) {
if (
paypalWindowNamespace === undefined ||
paypalWindowNamespace.Messages === undefined
) {
setErrorState(() => {

@@ -598,4 +683,6 @@ throw new Error(getErrorMessage(options));

// component failed to render, possibly because it was closed or destroyed.
if (messagesContainerRef.current === null ||
messagesContainerRef.current.children.length === 0) {
if (
messagesContainerRef.current === null ||
messagesContainerRef.current.children.length === 0
) {
// paypal messages container is no longer in the DOM, we can safely ignore the error

@@ -606,9 +693,17 @@ return;

setErrorState(() => {
throw new Error(`Failed to render <PayPalMessages /> component. ${err}`);
throw new Error(
`Failed to render <PayPalMessages /> component. ${err}`
);
});
});
}, [isResolved, ...forceReRender]);
return React__default['default'].createElement("div", { ref: messagesContainerRef, className: className });
return React__default["default"].createElement("div", {
ref: messagesContainerRef,
className: className,
});
};
function getErrorMessage({ components = "", "data-namespace": dataNamespace = DEFAULT_PAYPAL_NAMESPACE, }) {
function getErrorMessage({
components = "",
"data-namespace": dataNamespace = DEFAULT_PAYPAL_NAMESPACE,
}) {
let errorMessage = `Unable to render <PayPalMessages /> because window.${dataNamespace}.Messages is undefined.`;

@@ -622,3 +717,3 @@ // the JS SDK does not load the Messages component by default. It must be passed into the "components" query parameter.

"\nTo fix the issue, add 'messages' to the list of components passed to the parent PayPalScriptProvider:" +
`\n\`<PayPalScriptProvider options={{ components: '${expectedComponents}'}}>\`.`;
`\n\`<PayPalScriptProvider options={{ components: '${expectedComponents}'}}>\`.`;
}

@@ -629,27 +724,27 @@ return errorMessage;

var FUNDING = {
PAYPAL: 'paypal',
VENMO: 'venmo',
APPLEPAY: 'applepay',
ITAU: 'itau',
CREDIT: 'credit',
PAYLATER: 'paylater',
CARD: 'card',
IDEAL: 'ideal',
SEPA: 'sepa',
BANCONTACT: 'bancontact',
GIROPAY: 'giropay',
SOFORT: 'sofort',
EPS: 'eps',
MYBANK: 'mybank',
P24: 'p24',
VERKKOPANKKI: 'verkkopankki',
PAYU: 'payu',
BLIK: 'blik',
TRUSTLY: 'trustly',
ZIMPLER: 'zimpler',
MAXIMA: 'maxima',
OXXO: 'oxxo',
BOLETO: 'boleto',
WECHATPAY: 'wechatpay',
MERCADOPAGO: 'mercadopago'
PAYPAL: "paypal",
VENMO: "venmo",
APPLEPAY: "applepay",
ITAU: "itau",
CREDIT: "credit",
PAYLATER: "paylater",
CARD: "card",
IDEAL: "ideal",
SEPA: "sepa",
BANCONTACT: "bancontact",
GIROPAY: "giropay",
SOFORT: "sofort",
EPS: "eps",
MYBANK: "mybank",
P24: "p24",
VERKKOPANKKI: "verkkopankki",
PAYU: "payu",
BLIK: "blik",
TRUSTLY: "trustly",
ZIMPLER: "zimpler",
MAXIMA: "maxima",
OXXO: "oxxo",
BOLETO: "boleto",
WECHATPAY: "wechatpay",
MERCADOPAGO: "mercadopago",
};

@@ -656,0 +751,0 @@

@@ -12,3 +12,4 @@ import React, { FunctionComponent } from "react";

};
declare type ScriptLoadingState = typeof SCRIPT_LOADING_STATE[keyof typeof SCRIPT_LOADING_STATE];
declare type ScriptLoadingState =
typeof SCRIPT_LOADING_STATE[keyof typeof SCRIPT_LOADING_STATE];
interface ScriptContextDerivedState {

@@ -21,9 +22,11 @@ options: ReactPayPalScriptOptions;

}
declare type ScriptReducerAction = {
type: "setLoadingStatus";
value: ScriptLoadingState;
} | {
type: "resetOptions";
value: ReactPayPalScriptOptions;
};
declare type ScriptReducerAction =
| {
type: "setLoadingStatus";
value: ScriptLoadingState;
}
| {
type: "resetOptions";
value: ReactPayPalScriptOptions;
};
declare type ScriptReducerDispatch = (action: ScriptReducerAction) => void;

@@ -30,0 +33,0 @@ declare function usePayPalScriptReducer(): [

{
"name": "@paypal/react-paypal-js",
"version": "6.0.2",
"version": "7.0.0",
"description": "React components for the PayPal JS SDK",

@@ -15,4 +15,4 @@ "keywords": [

],
"main": "dist/react-paypal.node.js",
"module": "dist/react-paypal.esm.js",
"main": "index.js",
"module": "dist/esm/react-paypal-js.js",
"types": "dist/index.d.ts",

@@ -45,3 +45,3 @@ "scripts": {

"dependencies": {
"@paypal/paypal-js": "^3.1.11",
"@paypal/paypal-js": "^4.0.0",
"@paypal/sdk-constants": "^1.0.106"

@@ -83,2 +83,4 @@ },

"rollup": "^2.50.6",
"rollup-plugin-cleanup": "^3.2.1",
"rollup-plugin-terser": "^7.0.2",
"shelljs": "^0.8.4",

@@ -85,0 +87,0 @@ "standard-version": "^9.3.0",

@@ -9,2 +9,3 @@ # react-paypal-js

<a href="https://www.npmjs.com/package/@paypal/react-paypal-js"><img src="https://img.shields.io/npm/v/@paypal/react-paypal-js.svg?style=flat-square" alt="npm version"></a>
<a href="https://bundlephobia.com/result?p=@paypal/react-paypal-js"><img src="https://img.shields.io/bundlephobia/minzip/@paypal/react-paypal-js.svg?style=flat-square" alt="bundle size"></a>
<a href="https://www.npmtrends.com/@paypal/react-paypal-js"><img src="https://img.shields.io/npm/dm/@paypal/react-paypal-js.svg?style=flat-square" alt="npm downloads"></a>

@@ -11,0 +12,0 @@ <a href="https://github.com/paypal/react-paypal-js/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/@paypal/react-paypal-js.svg?style=flat-square" alt="apache license"></a>

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc