{"version":3,"sources":["webpack:///./node_modules/file-saver/dist/FileSaver.min.js","webpack:///./src/utils/Instructions.ts","webpack:///./src/pages/integration-builder/sections/Build.tsx","webpack:///./src/components/integration-builder/accordion/index.tsx"],"names":["c","a","b","d","XMLHttpRequest","open","responseType","onload","g","response","onerror","console","error","send","status","e","dispatchEvent","MouseEvent","document","createEvent","initMouseEvent","window","f","self","global","navigator","test","userAgent","saveAs","HTMLAnchorElement","prototype","h","i","URL","webkitURL","j","createElement","name","download","rel","href","origin","location","target","createObjectURL","setTimeout","revokeObjectURL","msSaveOrOpenBlob","autoBom","warn","type","Blob","title","body","innerText","HTMLElement","safari","FileReader","k","onloadend","result","replace","readAsDataURL","l","m","module","exports","scratchInstructions","mode","language","paymentModel","threeDs","instructions","cloneInstructions","withAnalytics","Build","_options$find","_options$find2","integrationType","options","parameters","useContext","CheckoutSimulatorContext","selectedIndex","setSelectedIndex","useState","fptiData","fpti","selectedBackendLanguage","find","option","value","getSetupInstructions","setupInstructions","Array","isArray","instruction","_options$2","_options$3","optionValue","languageValue","includes","_parameters","_parameters$buttons","buttons","React","className","styles","checkout_simulator__accordion_container","Accordion","number","color","heading","defaultCollapsed","content","Fragment","checkout_simulator__subtitle_wrapper","checkout_simulator__fragment_subtitle","Tooltip","description","windowId","imagePosition","SegmentedController","tabs","label","id","panelId","selectedTabIdx","onClick","event","clickHandler","tab","getAttribute","SegmentedControllerPanel","tabId","dangerouslySetInnerHTML","__html","Button","checkout_simulator__download_button","secondary","handleDownload","_window$PAYPAL","_window$PAYPAL$analyt","languageBack","file","repositoryMap","node","html","react","zippedSamplesUrl","FileSaver","split","at","PAYPAL","analytics","instance","record","data","_objectSpread","component","space_key","link","event_action","page_name","page","event_name","pu","removeGAParam","_ref","collapsed","setCollapsed","handleChevronClick","ChevronDown","ChevronUp","style","height","transition","opacity"],"mappings":"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","file":"b9b041f39dc3568dd313b944196020ea562c7d57-6d2814078eb2e47a7e62.js","sourcesContent":["(function (a, b) {\n if (\"function\" == typeof define && define.amd) define([], b);else if (\"undefined\" != typeof exports) b();else {\n b(), a.FileSaver = {\n exports: {}\n }.exports;\n }\n})(this, function () {\n \"use strict\";\n\n function b(a, b) {\n return \"undefined\" == typeof b ? b = {\n autoBom: !1\n } : \"object\" != typeof b && (console.warn(\"Deprecated: Expected third argument to be a object\"), b = {\n autoBom: !b\n }), b.autoBom && /^\\s*(?:text\\/\\S*|application\\/xml|\\S*\\/\\S*\\+xml)\\s*;.*charset\\s*=\\s*utf-8/i.test(a.type) ? new Blob([\"\\uFEFF\", a], {\n type: a.type\n }) : a;\n }\n function c(a, b, c) {\n var d = new XMLHttpRequest();\n d.open(\"GET\", a), d.responseType = \"blob\", d.onload = function () {\n g(d.response, b, c);\n }, d.onerror = function () {\n console.error(\"could not download file\");\n }, d.send();\n }\n function d(a) {\n var b = new XMLHttpRequest();\n b.open(\"HEAD\", a, !1);\n try {\n b.send();\n } catch (a) {}\n return 200 <= b.status && 299 >= b.status;\n }\n function e(a) {\n try {\n a.dispatchEvent(new MouseEvent(\"click\"));\n } catch (c) {\n var b = document.createEvent(\"MouseEvents\");\n b.initMouseEvent(\"click\", !0, !0, window, 0, 0, 0, 80, 20, !1, !1, !1, !1, 0, null), a.dispatchEvent(b);\n }\n }\n var f = \"object\" == typeof window && window.window === window ? window : \"object\" == typeof self && self.self === self ? self : \"object\" == typeof global && global.global === global ? global : void 0,\n a = f.navigator && /Macintosh/.test(navigator.userAgent) && /AppleWebKit/.test(navigator.userAgent) && !/Safari/.test(navigator.userAgent),\n g = f.saveAs || (\"object\" != typeof window || window !== f ? function () {} : \"download\" in HTMLAnchorElement.prototype && !a ? function (b, g, h) {\n var i = f.URL || f.webkitURL,\n j = document.createElement(\"a\");\n g = g || b.name || \"download\", j.download = g, j.rel = \"noopener\", \"string\" == typeof b ? (j.href = b, j.origin === location.origin ? e(j) : d(j.href) ? c(b, g, h) : e(j, j.target = \"_blank\")) : (j.href = i.createObjectURL(b), setTimeout(function () {\n i.revokeObjectURL(j.href);\n }, 4E4), setTimeout(function () {\n e(j);\n }, 0));\n } : \"msSaveOrOpenBlob\" in navigator ? function (f, g, h) {\n if (g = g || f.name || \"download\", \"string\" != typeof f) navigator.msSaveOrOpenBlob(b(f, h), g);else if (d(f)) c(f, g, h);else {\n var i = document.createElement(\"a\");\n i.href = f, i.target = \"_blank\", setTimeout(function () {\n e(i);\n });\n }\n } : function (b, d, e, g) {\n if (g = g || open(\"\", \"_blank\"), g && (g.document.title = g.document.body.innerText = \"downloading...\"), \"string\" == typeof b) return c(b, d, e);\n var h = \"application/octet-stream\" === b.type,\n i = /constructor/i.test(f.HTMLElement) || f.safari,\n j = /CriOS\\/[\\d]+/.test(navigator.userAgent);\n if ((j || h && i || a) && \"undefined\" != typeof FileReader) {\n var k = new FileReader();\n k.onloadend = function () {\n var a = k.result;\n a = j ? a : a.replace(/^data:[^;]*;/, \"data:attachment/file;\"), g ? g.location.href = a : location = a, g = null;\n }, k.readAsDataURL(b);\n } else {\n var l = f.URL || f.webkitURL,\n m = l.createObjectURL(b);\n g ? g.location = m : location.href = m, g = null, setTimeout(function () {\n l.revokeObjectURL(m);\n }, 4E4);\n }\n });\n f.saveAs = g.saveAs = g, \"undefined\" != typeof module && (module.exports = g);\n});","export const scratchInstructions = [\n {\n type: 'standard',\n mode: 'scratch',\n language: 'html',\n paymentModel: 'onetime-payment',\n threeDs: 'no_3ds',\n instructions: `
PayPal Checkout HTML/JavaScript with NodeJS
\n
HTML
\n \n
Create a folder named client.
\n
\n Inside of the client folder create two files: checkout.html and app.js. Copy paste the provided code snippets for these files.\n
\n Optional: Customize your code.\n
\n
\n
In the checkout.html file, replace test client ID in the SDK script tag with your own sandbox Business Account app client ID. These credentials are available in the Developer Dashboard.
\n \n
NodeJS
\n \n
Create a folder named server.
\n
Create a file named server.js. Copy paste the code provided in the code snippets for this file.
\n
Create a .env file and pass the following variables:
Create a package.json file. Copy paste the contents of this sample package.json file into your own package.json file. This file defines the dependencies used inside the server.js file. The dependencies needed are:
Use a tool like Create-React-App or Vite to manage the local development workflow for your React code. When building it for prod, deploy it to a static folder and have your Node.js web server serve up that static directory.
\n
Create a React application inside a folder called client with an App.jsx file and copy paste the code snippets that correspond to this file.
\n
Optional: Customize your code.
\n
Inside your App.jsx file, locate the initialOptions object, and replace PAYPAL_CLIENT_ID with your own sandbox Business Account app client ID. These credentials are available in the Developer Dashboard.
\n \n
NodeJS
\n \n
Create a folder called server and create a server.js file and copy paste the code snippets that correspond to this file.
\n
Create a .env file and pass the following variables:
In the package.json file, replace the content with the content of this sample package.json file. This file defines the dependencies used inside the server.js file. The dependencies needed are:
Create a package.json file in the root of your project. Copy paste the contents of this sample package.json file into your own package.json file. This file defines the dependencies used inside the server.js file. The dependencies needed are:
Create a package.json file in the root of your project. Copy paste the contents of this sample package.json file into your own package.json file. This file defines the dependencies used inside the server.js file. The dependencies needed are:
Use a tool like Create-React-App or Vite to manage the local development workflow for your React code. When building it for prod, deploy it to a static folder and have your Node.js web server serve up that static directory.
\n
Create a React application inside a folder called client with an App.jsx and PaymentForm.jsx files and copy paste the code snippets that correspond to these file.
\n
Create a PaymentForm.module.css file and copy paste the code snippets that correspond to this file.
\n
Optional: Customize your code.
\n
Inside your App.jsx file, locate the initialOptions object, and replace PAYPAL_CLIENT_ID with your own sandbox Business Account app client ID. These credentials are available in the Developer Dashboard.
\n \n
NodeJS
\n \n
Create a folder called server and create a server.js file and copy paste the code snippets that correspond to this file.
\n
Create a .env file and pass the following variables:
In the package.json file, replace the content with the content of this sample package.json file. This file defines the dependencies used inside the server.js file. The dependencies needed are:
\n Inside of the client folder create two files: checkout.html and app.js. Copy paste the provided code snippets for these files.\n
\n Optional: Customize your code.\n
\n
\n
In the checkout.html file, replace test client ID in the SDK script tag with your own sandbox Business Account app client ID. These credentials are available in the Developer Dashboard.
\n \n
NodeJS
\n \n
Create a folder named server.
\n
Create a file named server.js. Copy paste the code provided in the code snippets for this file.
\n
Create a .env file and pass the following variables:
Create a package.json file. Copy paste the contents of this sample package.json file into your own package.json file. This file defines the dependencies used inside the server.js file. The dependencies needed are:
Use a tool like Create-React-App or Vite to manage the local development workflow for your React code. When building it for prod, deploy it to a static folder and have your Node.js web server serve up that static directory.
\n
Create a React application inside a folder called client with an App.jsx file and copy paste the code snippets that correspond to this file.
\n
Optional: Customize your code.
\n
Inside your App.jsx file, locate the initialOptions object, and replace PAYPAL_CLIENT_ID with your own sandbox Business Account app client ID. These credentials are available in the Developer Dashboard.
\n \n
NodeJS
\n \n
Create a folder called server and create a server.js file and copy paste the code snippets that correspond to this file.
\n
Create a .env file and pass the following variables:
In the package.json file, replace the content with the content of this sample package.json file. This file defines the dependencies used inside the server.js file. The dependencies needed are:
Clone the existing HTML and NodeJS combination from the Github repo.
\n
Optional: Customize your code.
\n
In the checkout.html file, replace test client ID in the SDK script tag with your own sandbox Business Account app client ID. These credentials are available in the Developer Dashboard.
\n
Rename the .env.example file to .env and pass the following variables
Clone the existing React and NodeJS combination from the Github repo.
\n
Optional: Customize your code.
\n
Inside your src folder of the React app find the App.jsx file, locate the initialOptions object inside of this file, and replace PAYPAL_CLIENT_ID with your own sandbox Business Account app client ID. These credentials are available in the Developer Dashboard.
\n
Rename the .env.example file to .env and pass the following variables
Clone the existing React and NodeJS combination from the Github repo.
\n
Optional: Customize your code.
\n
Inside your src folder of the React app find the App.jsx file, locate the initialOptions object inside of this file, and replace PAYPAL_CLIENT_ID with your own sandbox Business Account app client ID. These credentials are available in the Developer Dashboard.
\n
Rename the .env.example file to .env and pass the following variables
Clone the existing HTML and NodeJS combination from the Github repo.
\n
Optional: Customize your code.
\n
In the checkout.html file, replace test client ID in the SDK script tag with your own sandbox Business Account app client ID. These credentials are available in the Developer Dashboard.
\n
Rename the .env.example file to .env and pass the following variables
Clone the existing React and NodeJS combination from the Github repo.
\n
Optional: Customize your code.
\n
Inside your src folder of the React app find the App.jsx file, locate the initialOptions object inside of this file, and replace PAYPAL_CLIENT_ID with your own sandbox Business Account app client ID. These credentials are available in the Developer Dashboard.
\n
Rename the .env.example file to .env and pass the following variables