@descope/web-components-ui 1.0.307 → 1.0.309
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.cjs.js +61 -47
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +63 -47
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/4978.js +1 -1
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-multi-selection-group-index-js.js +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-index-js.js +1 -1
- package/dist/umd/button-selection-group-fields-descope-button-selection-group-item-index-js.js +1 -1
- package/dist/umd/descope-button-index-js.js +1 -1
- package/dist/umd/descope-recaptcha-index-js.js +1 -1
- package/dist/umd/descope-upload-file-index-js.js +1 -1
- package/dist/umd/descope-user-attribute-index-js.js +1 -1
- package/dist/umd/descope-user-auth-method-index-js.js +1 -1
- package/dist/umd/mapping-fields-descope-mappings-field-index-js.js +1 -1
- package/dist/umd/mapping-fields-descope-saml-group-mappings-index-js.js +1 -1
- package/package.json +1 -1
- package/src/components/descope-button/ButtonClass.js +1 -1
- package/src/components/descope-recaptcha/RecaptchaClass.js +50 -32
- package/src/mixins/componentsContextMixin.js +0 -4
package/dist/index.esm.js
CHANGED
@@ -545,21 +545,8 @@ const componentNameValidationMixin = (superclass) =>
|
|
545
545
|
}
|
546
546
|
};
|
547
547
|
|
548
|
-
// create a dispatch event function that also calls to the onevent function in case it's set
|
549
|
-
// usage example:
|
550
|
-
// #dispatchSomething = createDispatchEvent.bind(this, 'something' { ...options })
|
551
|
-
// this will dispatch a new event when called, but also call to "onsomething"
|
552
|
-
function createDispatchEvent(eventName, options = {}) {
|
553
|
-
const event = new Event(eventName, options);
|
554
|
-
|
555
|
-
this[`on${eventName}`]?.(event); // in case we got an event callback as property
|
556
|
-
this.dispatchEvent(event);
|
557
|
-
}
|
558
|
-
|
559
548
|
const componentsContextMixin = (superclass) =>
|
560
549
|
class ComponentsContextMixinClass extends superclass {
|
561
|
-
#dispatchComponentsContext = createDispatchEvent.bind(this, 'components-context');
|
562
|
-
|
563
550
|
updateComponentsContext(componentsContext) {
|
564
551
|
this.dispatchEvent(
|
565
552
|
new CustomEvent('components-context', {
|
@@ -702,6 +689,17 @@ const createBaseClass = ({ componentName, baseSelector = '' }) => {
|
|
702
689
|
)(DescopeBaseClass);
|
703
690
|
};
|
704
691
|
|
692
|
+
// create a dispatch event function that also calls to the onevent function in case it's set
|
693
|
+
// usage example:
|
694
|
+
// #dispatchSomething = createDispatchEvent.bind(this, 'something' { ...options })
|
695
|
+
// this will dispatch a new event when called, but also call to "onsomething"
|
696
|
+
function createDispatchEvent(eventName, options = {}) {
|
697
|
+
const event = new Event(eventName, options);
|
698
|
+
|
699
|
+
this[`on${eventName}`]?.(event); // in case we got an event callback as property
|
700
|
+
this.dispatchEvent(event);
|
701
|
+
}
|
702
|
+
|
705
703
|
const createProxy = ({
|
706
704
|
componentName,
|
707
705
|
wrappedEleName,
|
@@ -1406,8 +1404,6 @@ const IconClass = compose(
|
|
1406
1404
|
componentNameValidationMixin
|
1407
1405
|
)(RawIcon);
|
1408
1406
|
|
1409
|
-
customElements.define(componentName$T, IconClass);
|
1410
|
-
|
1411
1407
|
const clickableMixin = (superclass) =>
|
1412
1408
|
class ClickableMixinClass extends superclass {
|
1413
1409
|
get isLoading() {
|
@@ -6708,8 +6704,10 @@ class RawRecaptcha extends BaseClass {
|
|
6708
6704
|
|
6709
6705
|
attributeChangedCallback(attrName, oldValue, newValue) {
|
6710
6706
|
super.attributeChangedCallback?.(attrName, oldValue, newValue);
|
6711
|
-
if (
|
6712
|
-
|
6707
|
+
if (oldValue !== newValue) {
|
6708
|
+
if (attrName === 'enabled') {
|
6709
|
+
this.#toggleRecaptcha(newValue === 'true');
|
6710
|
+
}
|
6713
6711
|
}
|
6714
6712
|
}
|
6715
6713
|
|
@@ -6779,73 +6777,89 @@ class RawRecaptcha extends BaseClass {
|
|
6779
6777
|
#toggleRecaptcha(enabled) {
|
6780
6778
|
this.renderRecaptcha(enabled);
|
6781
6779
|
if (enabled) {
|
6782
|
-
this.#loadRecaptchaScript();
|
6783
6780
|
this.#createOnLoadScript();
|
6781
|
+
if (!document.getElementById('recaptcha-script')) {
|
6782
|
+
this.#loadRecaptchaScript();
|
6783
|
+
} else {
|
6784
|
+
window.onRecaptchaLoadCallback();
|
6785
|
+
}
|
6784
6786
|
}
|
6785
6787
|
}
|
6786
6788
|
|
6787
6789
|
#loadRecaptchaScript() {
|
6788
|
-
|
6789
|
-
|
6790
|
-
|
6791
|
-
|
6792
|
-
|
6793
|
-
|
6794
|
-
document.body.appendChild(script);
|
6795
|
-
} else {
|
6796
|
-
window.onRecaptchaLoadCallback();
|
6797
|
-
}
|
6790
|
+
const script = document.createElement('script');
|
6791
|
+
script.src = this.scriptURL;
|
6792
|
+
script.async = true;
|
6793
|
+
script.id = 'recaptcha-script';
|
6794
|
+
script.defer = true;
|
6795
|
+
document.body.appendChild(script);
|
6798
6796
|
}
|
6799
6797
|
|
6800
|
-
|
6801
|
-
|
6802
|
-
|
6803
|
-
}
|
6798
|
+
get grecaptchaInstance() {
|
6799
|
+
return this.enterprise ? window.grecaptcha?.enterprise : window.grecaptcha;
|
6800
|
+
}
|
6804
6801
|
|
6802
|
+
#createOnLoadScript() {
|
6805
6803
|
window.onRecaptchaLoadCallback = () => {
|
6806
6804
|
const currentNode = this.recaptchaEle;
|
6805
|
+
|
6807
6806
|
// if there are child nodes, it means that the recaptcha was already rendered
|
6808
6807
|
if (currentNode.hasChildNodes()) {
|
6809
6808
|
return;
|
6810
6809
|
}
|
6811
|
-
|
6812
|
-
|
6813
|
-
: window.grecaptcha;
|
6810
|
+
|
6811
|
+
const { grecaptchaInstance } = this;
|
6814
6812
|
|
6815
6813
|
if (!grecaptchaInstance) {
|
6816
6814
|
return;
|
6817
6815
|
}
|
6818
6816
|
|
6819
6817
|
setTimeout(() => {
|
6820
|
-
|
6818
|
+
// returns recaptchaWidgetId
|
6819
|
+
const recaptchaWidgetId = grecaptchaInstance.render(currentNode, {
|
6821
6820
|
sitekey: this.siteKey,
|
6822
6821
|
badge: 'inline',
|
6823
6822
|
size: 'invisible',
|
6824
6823
|
});
|
6824
|
+
|
6825
6825
|
grecaptchaInstance.ready(() => {
|
6826
6826
|
// clone the node and append it to the body so that it can be used by the grepcaptcha script
|
6827
|
-
const cloneNode = currentNode
|
6827
|
+
const cloneNode = currentNode
|
6828
|
+
.querySelector('textarea[name^="g-recaptcha-response"]')
|
6829
|
+
?.cloneNode();
|
6828
6830
|
if (cloneNode) {
|
6829
6831
|
cloneNode.style.display = 'none';
|
6830
6832
|
document.body.appendChild(cloneNode);
|
6831
6833
|
}
|
6834
|
+
|
6835
|
+
// cleaning up the recaptcha element we added to the body
|
6836
|
+
const removeCloneNode = () => {
|
6837
|
+
cloneNode.remove();
|
6838
|
+
};
|
6839
|
+
|
6832
6840
|
if (this.siteKey) {
|
6833
|
-
|
6834
|
-
|
6835
|
-
|
6836
|
-
|
6841
|
+
// we should pass recaptchaWidgetId, but this does not allow us to run execute multiple times
|
6842
|
+
// also calling grecaptchaInstance.reset() does not work
|
6843
|
+
const exec = grecaptchaInstance?.execute(recaptchaWidgetId, { action: this.action });
|
6844
|
+
exec
|
6845
|
+
.then((token) => {
|
6846
|
+
this.updateComponentsContext({
|
6847
|
+
risktoken: token,
|
6848
|
+
riskaction: this.action,
|
6849
|
+
});
|
6850
|
+
|
6851
|
+
removeCloneNode();
|
6852
|
+
})
|
6853
|
+
.catch((e) => {
|
6854
|
+
removeCloneNode();
|
6855
|
+
// eslint-disable-next-line no-console
|
6856
|
+
console.warn('could not execute recaptcha', e);
|
6837
6857
|
});
|
6838
|
-
});
|
6839
6858
|
}
|
6840
6859
|
});
|
6841
6860
|
}, 0);
|
6842
6861
|
};
|
6843
6862
|
}
|
6844
|
-
|
6845
|
-
connectedCallback() {
|
6846
|
-
super.connectedCallback?.();
|
6847
|
-
this.#toggleRecaptcha(this.enabled);
|
6848
|
-
}
|
6849
6863
|
}
|
6850
6864
|
|
6851
6865
|
const RecaptchaClass = compose(draggableMixin)(RawRecaptcha);
|
@@ -9230,6 +9244,8 @@ const AvatarClass = compose(
|
|
9230
9244
|
|
9231
9245
|
customElements.define(componentName$8, AvatarClass);
|
9232
9246
|
|
9247
|
+
customElements.define(componentName$T, IconClass);
|
9248
|
+
|
9233
9249
|
const componentName$7 = getComponentName('mappings-field-internal');
|
9234
9250
|
|
9235
9251
|
const BaseInputClass$2 = createBaseInputClass({ componentName: componentName$7, baseSelector: 'div' });
|