@descope/web-components-ui 1.0.309 → 1.0.310
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.cjs.js +47 -3
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +52 -6
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/4392.js +1 -1
- package/dist/umd/4978.js +1 -1
- package/dist/umd/DescopeDev.js +1 -1
- package/dist/umd/descope-email-field-index-js.js +4 -4
- package/dist/umd/descope-new-password-index-js.js +1 -1
- package/dist/umd/descope-number-field-index-js.js +1 -1
- package/dist/umd/descope-passcode-index-js.js +1 -1
- package/dist/umd/descope-text-field-index-js.js +2 -2
- 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/dist/umd/phone-fields-descope-phone-field-descope-phone-field-internal-index-js.js +1 -1
- package/dist/umd/phone-fields-descope-phone-field-index-js.js +1 -1
- package/dist/umd/phone-fields-descope-phone-input-box-field-descope-phone-input-box-internal-index-js.js +2 -2
- package/dist/umd/phone-fields-descope-phone-input-box-field-index-js.js +1 -1
- package/package.json +2 -2
- package/src/components/descope-text-field/TextFieldClass.js +25 -0
- package/src/components/descope-text-field/textFieldMappings.js +21 -2
- package/src/components/phone-fields/descope-phone-field/descope-phone-field-internal/PhoneFieldInternal.js +2 -2
- package/src/components/phone-fields/descope-phone-input-box-field/descope-phone-input-box-internal/PhoneFieldInternalInputBox.js +3 -1
- package/src/mixins/proxyInputMixin.js +1 -1
package/dist/index.esm.js
CHANGED
@@ -959,7 +959,7 @@ const getNestedInput = (ele) => {
|
|
959
959
|
let nonSlotEle = ele;
|
960
960
|
for (let i = 0; i < nestingLevel; i++) {
|
961
961
|
[nonSlotEle] = nonSlotEle.assignedElements();
|
962
|
-
if (nonSlotEle
|
962
|
+
if (nonSlotEle?.localName !== 'slot') return nonSlotEle;
|
963
963
|
}
|
964
964
|
return undefined;
|
965
965
|
};
|
@@ -2451,6 +2451,10 @@ const {
|
|
2451
2451
|
errorMessage: errorMessage$a,
|
2452
2452
|
disabledPlaceholder,
|
2453
2453
|
inputDisabled,
|
2454
|
+
externalInput,
|
2455
|
+
externalInputDisabled,
|
2456
|
+
externalPlaceholder,
|
2457
|
+
externalDisabledPlaceholder,
|
2454
2458
|
} = {
|
2455
2459
|
host: { selector: () => ':host' },
|
2456
2460
|
label: { selector: '::part(label)' },
|
@@ -2462,6 +2466,10 @@ const {
|
|
2462
2466
|
inputDisabled: { selector: 'input:disabled' },
|
2463
2467
|
helperText: { selector: '::part(helper-text)' },
|
2464
2468
|
errorMessage: { selector: '::part(error-message)' },
|
2469
|
+
externalInput: { selector: () => '::slotted(input)' },
|
2470
|
+
externalInputDisabled: { selector: () => '::slotted(input:disabled)' },
|
2471
|
+
externalPlaceholder: { selector: () => '::slotted(input:placeholder-shown)' },
|
2472
|
+
externalDisabledPlaceholder: { selector: () => '::slotted(input:disabled::placeholder)' },
|
2465
2473
|
};
|
2466
2474
|
|
2467
2475
|
var textFieldMappings = {
|
@@ -2487,8 +2495,12 @@ var textFieldMappings = {
|
|
2487
2495
|
inputValueTextColor: [
|
2488
2496
|
{ ...inputField$6, property: 'color' },
|
2489
2497
|
{ ...inputDisabled, property: '-webkit-text-fill-color' },
|
2498
|
+
{ ...externalInputDisabled, property: '-webkit-text-fill-color' },
|
2499
|
+
],
|
2500
|
+
inputCaretTextColor: [
|
2501
|
+
{ ...input, property: 'color' },
|
2502
|
+
{ ...externalInput, property: 'color' },
|
2490
2503
|
],
|
2491
|
-
inputCaretTextColor: { ...input, property: 'color' },
|
2492
2504
|
|
2493
2505
|
labelRequiredIndicator: { ...requiredIndicator$9, property: 'content' },
|
2494
2506
|
|
@@ -2501,6 +2513,8 @@ var textFieldMappings = {
|
|
2501
2513
|
inputHorizontalPadding: [
|
2502
2514
|
{ ...input, property: 'padding-left' },
|
2503
2515
|
{ ...input, property: 'padding-right' },
|
2516
|
+
{ ...externalInput, property: 'padding-left' },
|
2517
|
+
{ ...externalInput, property: 'padding-right' },
|
2504
2518
|
],
|
2505
2519
|
|
2506
2520
|
inputOutlineColor: { ...inputField$6, property: 'outline-color' },
|
@@ -2508,11 +2522,16 @@ var textFieldMappings = {
|
|
2508
2522
|
inputOutlineWidth: { ...inputField$6, property: 'outline-width' },
|
2509
2523
|
inputOutlineOffset: { ...inputField$6, property: 'outline-offset' },
|
2510
2524
|
|
2511
|
-
inputTextAlign:
|
2525
|
+
inputTextAlign: [
|
2526
|
+
{ ...input, property: 'text-align' },
|
2527
|
+
{ ...externalInput, property: 'text-align' },
|
2528
|
+
],
|
2512
2529
|
|
2513
2530
|
inputPlaceholderColor: [
|
2514
2531
|
{ ...placeholder$3, property: 'color' },
|
2532
|
+
{ ...externalPlaceholder, property: 'color' },
|
2515
2533
|
{ ...disabledPlaceholder, property: '-webkit-text-fill-color' },
|
2534
|
+
{ ...externalDisabledPlaceholder, property: '-webkit-text-fill-color' },
|
2516
2535
|
],
|
2517
2536
|
};
|
2518
2537
|
|
@@ -3008,6 +3027,31 @@ const customMixin$7 = (superclass) =>
|
|
3008
3027
|
this.baseElement._setType(newVal);
|
3009
3028
|
}
|
3010
3029
|
}
|
3030
|
+
|
3031
|
+
// webauthn is not working when the native input element is nested inside multiple shadow roots
|
3032
|
+
// so we need to be able move the input outside the shadow root for some cases
|
3033
|
+
get isExternalInput() {
|
3034
|
+
return this.getAttribute('external-input') === 'true';
|
3035
|
+
}
|
3036
|
+
|
3037
|
+
constructor() {
|
3038
|
+
super();
|
3039
|
+
|
3040
|
+
if (this.isExternalInput) {
|
3041
|
+
const origInput = this.baseElement.querySelector('input');
|
3042
|
+
this.inputSlot = document.createElement('slot');
|
3043
|
+
|
3044
|
+
this.focus = () => {
|
3045
|
+
origInput.focus();
|
3046
|
+
};
|
3047
|
+
|
3048
|
+
this.inputSlot.setAttribute('name', 'input');
|
3049
|
+
this.inputSlot.setAttribute('slot', 'input');
|
3050
|
+
this.baseElement.appendChild(this.inputSlot);
|
3051
|
+
|
3052
|
+
this.appendChild(origInput);
|
3053
|
+
}
|
3054
|
+
}
|
3011
3055
|
};
|
3012
3056
|
|
3013
3057
|
const TextFieldClass = compose(
|
@@ -5336,7 +5380,7 @@ const componentName$v = getComponentName('phone-field-internal');
|
|
5336
5380
|
|
5337
5381
|
const commonAttrs$1 = ['disabled', 'size', 'bordered', 'invalid', 'readonly'];
|
5338
5382
|
const countryAttrs = ['country-input-placeholder', 'default-code', 'restrict-countries'];
|
5339
|
-
const phoneAttrs = ['phone-input-placeholder', 'maxlength'];
|
5383
|
+
const phoneAttrs = ['phone-input-placeholder', 'maxlength', 'autocomplete', 'name'];
|
5340
5384
|
const mapAttrs$1 = {
|
5341
5385
|
'country-input-placeholder': 'placeholder',
|
5342
5386
|
'phone-input-placeholder': 'placeholder',
|
@@ -5363,7 +5407,7 @@ let PhoneFieldInternal$1 = class PhoneFieldInternal extends BaseInputClass$6 {
|
|
5363
5407
|
${CountryCodes.map((item) => comboBoxItem(item)).join('')}
|
5364
5408
|
</descope-combo-box>
|
5365
5409
|
<div class="separator"></div>
|
5366
|
-
<descope-text-field type="tel"></descope-text-field>
|
5410
|
+
<descope-text-field type="tel" external-input="true"></descope-text-field>
|
5367
5411
|
</div>
|
5368
5412
|
`;
|
5369
5413
|
|
@@ -5758,6 +5802,8 @@ const observedAttributes$2 = [
|
|
5758
5802
|
'invalid',
|
5759
5803
|
'readonly',
|
5760
5804
|
'phone-input-placeholder',
|
5805
|
+
'name',
|
5806
|
+
'autocomplete',
|
5761
5807
|
];
|
5762
5808
|
const mapAttrs = {
|
5763
5809
|
'phone-input-placeholder': 'placeholder',
|
@@ -5775,7 +5821,7 @@ class PhoneFieldInternal extends BaseInputClass$5 {
|
|
5775
5821
|
|
5776
5822
|
this.innerHTML = `
|
5777
5823
|
<div>
|
5778
|
-
<descope-text-field tabindex="1"></descope-text-field>
|
5824
|
+
<descope-text-field tabindex="1" external-input="true"></descope-text-field>
|
5779
5825
|
</div>
|
5780
5826
|
`;
|
5781
5827
|
|