auth0-lock
Version:
Auth0 Lock
201 lines (198 loc) • 10.1 kB
JavaScript
;
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.isRecaptcha = exports.ReCAPTCHA = void 0;
var _createRef = require("../../utils/createRef");
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
var noop = function noop() {};
var RECAPTCHA_V2_PROVIDER = 'recaptcha_v2';
var RECAPTCHA_ENTERPRISE_PROVIDER = 'recaptcha_enterprise';
var isRecaptcha = function isRecaptcha(provider) {
return provider === RECAPTCHA_ENTERPRISE_PROVIDER || provider === RECAPTCHA_V2_PROVIDER;
};
exports.isRecaptcha = isRecaptcha;
var getRecaptchaProvider = function getRecaptchaProvider(provider) {
switch (provider) {
case RECAPTCHA_V2_PROVIDER:
return window.grecaptcha;
case RECAPTCHA_ENTERPRISE_PROVIDER:
return window.grecaptcha.enterprise;
}
};
var scriptForProvider = function scriptForProvider(provider, lang, callback) {
switch (provider) {
case RECAPTCHA_V2_PROVIDER:
return "https://www.recaptcha.net/recaptcha/api.js?hl=".concat(lang, "&onload=").concat(callback);
case RECAPTCHA_ENTERPRISE_PROVIDER:
return "https://www.recaptcha.net/recaptcha/enterprise.js?render=explicit&hl=".concat(lang, "&onload=").concat(callback);
}
};
var ReCAPTCHA = /*#__PURE__*/function (_React$Component) {
_inherits(ReCAPTCHA, _React$Component);
var _super = _createSuper(ReCAPTCHA);
function ReCAPTCHA(props) {
var _this;
_classCallCheck(this, ReCAPTCHA);
_this = _super.call(this, props);
_this.state = {};
//this version of react doesn't have React.createRef
_this.ref = (0, _createRef.createRef)();
_this.changeHandler = function (value) {
_this.setState({
value: value
}, function () {
_this.props.onChange(value);
});
};
_this.expiredHandler = function () {
var value = '';
_this.setState({
value: value
}, function () {
_this.props.onChange(value);
_this.props.onExpired();
});
};
_this.erroredHandler = function () {
var value = '';
_this.setState({
value: value
}, function () {
_this.props.onChange(value);
_this.props.onErrored();
});
};
return _this;
}
_createClass(ReCAPTCHA, [{
key: "componentWillUnmount",
value: function componentWillUnmount() {
if (!this.scriptNode) {
return;
}
document.body.removeChild(this.scriptNode);
}
}, {
key: "componentDidMount",
value: function componentDidMount() {
var _this2 = this;
ReCAPTCHA.loadScript(this.props, document.body, function (err, scriptNode) {
_this2.scriptNode = scriptNode;
var provider = getRecaptchaProvider(_this2.props.provider);
// if this is enterprise then we change this to window.grecaptcha.enterprise.render
_this2.widgetId = provider.render(_this2.ref.current, {
callback: _this2.changeHandler,
'expired-callback': _this2.expiredHandler,
'error-callback': _this2.erroredHandler,
sitekey: _this2.props.sitekey
});
});
}
}, {
key: "reset",
value: function reset() {
var provider = getRecaptchaProvider(this.props.provider);
provider.reset(this.widgetId);
}
}, {
key: "render",
value: function render() {
/*
This is an override for the following conflicting css-rule:
@media screen and (max-width: 480px)
html.auth0-lock-html body > * {
display: none;
}
*/
var fixInterval = setInterval(function () {
var iframes = Array.from(document.querySelectorAll("iframe[src*=\"recaptcha\"]"));
var containers = iframes.map(function (iframe) {
return iframe.parentNode.parentNode;
}).filter(function (container) {
return container && container.parentNode === document.body && container.style.display !== 'block';
});
if (containers.length === 0) {
return;
}
containers.forEach(function (iframe) {
iframe.style.display = 'block';
});
clearInterval(fixInterval);
}, 300);
return /*#__PURE__*/_react.default.createElement("div", {
className: this.props.isValid ? 'auth0-lock-recaptcha-block' : 'auth0-lock-recaptcha-block auth0-lock-recaptcha-block-error'
}, /*#__PURE__*/_react.default.createElement("div", {
className: "auth0-lock-recaptchav2",
ref: this.ref
}));
}
}, {
key: "componentDidUpdate",
value: function componentDidUpdate(prevProps, prevState) {
if (prevProps.value !== this.props.value && this.props.value === '') {
this.reset();
}
}
}], [{
key: "loadScript",
value: function loadScript(props) {
var element = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : document.body;
var callback = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : noop;
var callbackName = "recatpchaCallback_".concat(Math.floor(Math.random() * 1000001));
var scriptUrl = scriptForProvider(props.provider, props.hl, callbackName);
var script = document.createElement('script');
window[callbackName] = function () {
delete window[callbackName];
callback(null, script);
};
script.src = scriptUrl;
script.async = true;
element.appendChild(script);
}
}, {
key: "getDerivedStateFromProps",
value: function getDerivedStateFromProps(nextProps, prevState) {
if (nextProps.value !== prevState.value) {
return {
value: nextProps.value
};
} else {
return null;
}
}
}]);
return ReCAPTCHA;
}(_react.default.Component);
exports.ReCAPTCHA = ReCAPTCHA;
ReCAPTCHA.displayName = 'ReCAPTCHA';
ReCAPTCHA.propTypes = {
provider: _propTypes.default.string.isRequired,
sitekey: _propTypes.default.string.isRequired,
onChange: _propTypes.default.func,
onExpired: _propTypes.default.func,
onErrored: _propTypes.default.func,
hl: _propTypes.default.string,
value: _propTypes.default.string,
isValid: _propTypes.default.bool
};
ReCAPTCHA.defaultProps = {
onChange: noop,
onExpired: noop,
onErrored: noop
};