@descope/web-components-ui 1.0.184 → 1.0.186
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.cjs.js +22 -20
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +22 -20
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/descope-recaptcha-index-js.js +1 -1
- package/dist/umd/descope-upload-file-index-js.js +1 -1
- package/package.json +1 -1
- package/src/components/descope-recaptcha/RecaptchaClass.js +21 -19
- package/src/components/descope-upload-file/UploadFileClass.js +1 -1
package/dist/index.esm.js
CHANGED
@@ -5619,7 +5619,7 @@ customElements.define(componentName$6, NewPasswordClass);
|
|
5619
5619
|
|
5620
5620
|
const componentName$5 = getComponentName('recaptcha');
|
5621
5621
|
|
5622
|
-
const observedAttributes$1 = ['
|
5622
|
+
const observedAttributes$1 = ['enabled', 'site-key', 'action', 'enterprise'];
|
5623
5623
|
|
5624
5624
|
const BaseClass = createBaseClass({
|
5625
5625
|
componentName: componentName$5,
|
@@ -5632,18 +5632,18 @@ class RawRecaptcha extends BaseClass {
|
|
5632
5632
|
|
5633
5633
|
attributeChangedCallback(attrName, oldValue, newValue) {
|
5634
5634
|
super.attributeChangedCallback?.(attrName, oldValue, newValue);
|
5635
|
-
if (attrName === '
|
5635
|
+
if (attrName === 'enabled') {
|
5636
5636
|
this.#toggleRecaptcha(newValue === 'true');
|
5637
5637
|
}
|
5638
5638
|
}
|
5639
5639
|
|
5640
|
-
renderRecaptcha(
|
5641
|
-
if (
|
5642
|
-
this.recaptchaEle.style.display = 'none';
|
5643
|
-
this.mockRecaptchaEle.style.display = '';
|
5644
|
-
} else {
|
5640
|
+
renderRecaptcha(enabled) {
|
5641
|
+
if (enabled) {
|
5645
5642
|
this.recaptchaEle.style.display = '';
|
5646
5643
|
this.mockRecaptchaEle.style.display = 'none';
|
5644
|
+
} else {
|
5645
|
+
this.recaptchaEle.style.display = 'none';
|
5646
|
+
this.mockRecaptchaEle.style.display = '';
|
5647
5647
|
}
|
5648
5648
|
}
|
5649
5649
|
|
@@ -5652,16 +5652,19 @@ class RawRecaptcha extends BaseClass {
|
|
5652
5652
|
|
5653
5653
|
this.attachShadow({ mode: 'open' }).innerHTML = `
|
5654
5654
|
<style>
|
5655
|
-
|
5655
|
+
:host {
|
5656
|
+
display: inline-flex;
|
5657
|
+
}
|
5658
|
+
:host > div {
|
5659
|
+
display: flex;
|
5660
|
+
}
|
5661
|
+
:host #recaptcha {
|
5656
5662
|
width: 100%;
|
5657
|
-
|
5663
|
+
height: 100%;
|
5658
5664
|
}
|
5659
5665
|
:host img {
|
5660
5666
|
width: 256px;
|
5661
5667
|
}
|
5662
|
-
:host {
|
5663
|
-
display: inline-flex;
|
5664
|
-
}
|
5665
5668
|
</style>
|
5666
5669
|
<div>
|
5667
5670
|
<span id="recaptcha"></span>
|
@@ -5685,8 +5688,8 @@ class RawRecaptcha extends BaseClass {
|
|
5685
5688
|
return this.getAttribute('action') || 'load';
|
5686
5689
|
}
|
5687
5690
|
|
5688
|
-
get
|
5689
|
-
return this.getAttribute('
|
5691
|
+
get enabled() {
|
5692
|
+
return this.getAttribute('enabled') === 'true';
|
5690
5693
|
}
|
5691
5694
|
|
5692
5695
|
get scriptURL() {
|
@@ -5697,9 +5700,9 @@ class RawRecaptcha extends BaseClass {
|
|
5697
5700
|
return url.toString();
|
5698
5701
|
}
|
5699
5702
|
|
5700
|
-
#toggleRecaptcha(
|
5701
|
-
this.renderRecaptcha(
|
5702
|
-
if (
|
5703
|
+
#toggleRecaptcha(enabled) {
|
5704
|
+
this.renderRecaptcha(enabled);
|
5705
|
+
if (enabled) {
|
5703
5706
|
this.#loadRecaptchaScript();
|
5704
5707
|
this.#createOnLoadScript();
|
5705
5708
|
}
|
@@ -5765,8 +5768,7 @@ class RawRecaptcha extends BaseClass {
|
|
5765
5768
|
|
5766
5769
|
connectedCallback() {
|
5767
5770
|
super.connectedCallback?.();
|
5768
|
-
|
5769
|
-
this.#toggleRecaptcha(this.disabled);
|
5771
|
+
this.#toggleRecaptcha(this.enabled);
|
5770
5772
|
}
|
5771
5773
|
}
|
5772
5774
|
|
@@ -5966,7 +5968,7 @@ class RawUploadFile extends BaseInputClass {
|
|
5966
5968
|
const { host: host$1, wrapper, icon, title, description, requiredIndicator: requiredIndicator$1 } = {
|
5967
5969
|
host: { selector: () => ':host' },
|
5968
5970
|
wrapper: { selector: () => ':host > div' },
|
5969
|
-
icon: { selector: () => '
|
5971
|
+
icon: { selector: () => '::slotted(*)' },
|
5970
5972
|
title: { selector: () => '.title' },
|
5971
5973
|
description: { selector: () => '.description' },
|
5972
5974
|
requiredIndicator: { selector: () => '.title::after' },
|