React component that lets load Stripe script and shows React Stripe Elements. 

React component that lets load Stripe script and shows React Stripe Elements

ozluy

react-stripe-script-loader

Object.defineProperty(exports, "__esModule", {

var _react = _interopRequireWildcard(require("react"));

function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }

function _readOnlyError(name) { throw new Error("\"" + name + "\" is read-only"); }

function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }

function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

var StripeScriptLoader = function StripeScriptLoader(_ref) {

      loader = _ref$loader === void 0 ? 'Loading...' : _ref$loader;

  var _useState = (0, _react.useState)({}),

      _useState2 = _slicedToArray(_useState, 2),

    var loadScript = function loadScript(src, uniqueId) {

      return new Promise(function (resolve, reject) {

        var scriptElement = document.getElementById(uniqueId);

          var _script = document.createElement('script');

          var handleLoadScriptSuccess = function handleLoadScriptSuccess() {

          var handleLoadScriptFail = function handleLoadScriptFail(event) {

          _script.addEventListener('load', handleLoadScriptSuccess, {

          _script.addEventListener('error', handleLoadScriptFail, {

          document.head.appendChild(_script);

      regeneratorRuntime.mark(function _callee() {

        return regeneratorRuntime.wrap(function _callee$(_context) {

            switch (_context.prev = _context.next) {

                return loadScript(script, uniqueId);

        return _ref2.apply(this, arguments);

      var scriptElement = document.getElementById(uniqueId);

        for (var index = 0; index < iframesList.length; _readOnlyError("index"), index++) {

        for (var index = 0; index < iframesList.length; index++) {

          if (iframesList[index] && iframesList[index].name && (iframesList[index].name.indexOf('__privateStripeMetricsController') === 0 || iframesList[index].name.indexOf('__privateStripeController') === 0)) {

            iframesList[index].parentNode.removeChild(iframesList[index]);

  }, []); // eslint-disable-line react-hooks/exhaustive-deps

  return stripeLoaded.successful ? children : loader;

  "description": "React component that lets load Stripe script and shows React Stripe Elements",

    "test": "echo \"Error: no test specified\" && exit 1",

    "build": "./node_modules/.bin/babel src --out-file index.js"

    "url": "git+https://github.com/ozluy/react-stripe-script-loader.git"

    "url": "https://github.com/ozluy/react-stripe-script-loader/issues"

  "homepage": "https://github.com/ozluy/react-stripe-script-loader#readme",

import React, { useState, useEffect } from 'react'

  const [stripeLoaded, setStripeLoaded] = useState({})

    const loadScript = (src, uniqueId) =>

        const scriptElement = document.getElementById(uniqueId)

          const script = document.createElement('script')

          const handleLoadScriptSuccess = () => resolve({ successful: true })

          const handleLoadScriptFail = event => reject({ error: event })

          script.addEventListener('load', handleLoadScriptSuccess, {

          script.addEventListener('error', handleLoadScriptFail, { once: true })

          document.head.appendChild(script)

      const result = await loadScript(script, uniqueId)

      const scriptElement = document.getElementById(uniqueId)

        const iframesList = document.getElementsByTagName('iframe')

        for (const index = 0; index < iframesList.length; index++) {

        for (let index = 0; index < iframesList.length; index++) {

            (iframesList[index].name.indexOf(

              '__privateStripeMetricsController'

              iframesList[index].name.indexOf('__privateStripeController') ===

            iframesList[index].parentNode.removeChild(iframesList[index])

  }, []) // eslint-disable-line react-hooks/exhaustive-deps

  return stripeLoaded.successful ? children : loader

		{
		"name": "react-stripe-script-loader",
		"version": "1.0.32",
		"version": "1.0.33",
		"description": "React component that lets load Stripe script and shows React Stripe Elements",
		@@ -5,0 +5,0 @@ "main": "index.js",

		@@ -14,4 +14,2 @@ "use strict";

		function _readOnlyError(name) { throw new Error("\"" + name + "\" is read-only"); }

		function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
		@@ -120,3 +118,3 @@

		for (var index = 0; index < iframesList.length; _readOnlyError("index"), index++) {
		for (var index = 0; index < iframesList.length; index++) {
		if (iframesList[index] && iframesList[index].name && (iframesList[index].name.indexOf('__privateStripeMetricsController') === 0 \|\| iframesList[index].name.indexOf('__privateStripeController') === 0)) {
		@@ -123,0 +121,0 @@ iframesList[index].parentNode.removeChild(iframesList[index]);

		@@ -43,3 +43,3 @@ import React, { useState, useEffect } from 'react'
		const iframesList = document.getElementsByTagName('iframe')
		for (const index = 0; index < iframesList.length; index++) {
		for (let index = 0; index < iframesList.length; index++) {
		if (
		@@ -46,0 +46,0 @@ iframesList[index] &&

Worsened metrics