@descope/web-components-ui 1.0.155 → 1.0.157
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.cjs.js +0 -1
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +38 -18
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/descope-passcode-descope-passcode-internal-index-js.js +1 -1
- package/package.json +1 -1
- package/src/components/descope-passcode/descope-passcode-internal/PasscodeInternal.js +38 -17
- package/src/theme/components/uploadFile.js +0 -1
package/dist/index.esm.js
CHANGED
@@ -2419,10 +2419,6 @@ class PasscodeInternal extends BaseInputClass$3 {
|
|
2419
2419
|
}
|
2420
2420
|
}
|
2421
2421
|
|
2422
|
-
get pattern() {
|
2423
|
-
return `^$|^\\d{${this.digits},}$`;
|
2424
|
-
}
|
2425
|
-
|
2426
2422
|
getValidity() {
|
2427
2423
|
if (this.isRequired && !this.value) {
|
2428
2424
|
return { valueMissing: true };
|
@@ -2476,29 +2472,50 @@ class PasscodeInternal extends BaseInputClass$3 {
|
|
2476
2472
|
focusElement(currentInput);
|
2477
2473
|
}
|
2478
2474
|
|
2475
|
+
parseInputValue(input) {
|
2476
|
+
const charArr = getSanitizedCharacters(input.value);
|
2477
|
+
|
2478
|
+
if (!charArr.length) {
|
2479
|
+
// if we got an invalid value we want to clear the input
|
2480
|
+
input.value = '';
|
2481
|
+
} else this.fillDigits(charArr, input);
|
2482
|
+
}
|
2483
|
+
|
2479
2484
|
initInputs() {
|
2485
|
+
let currentInput;
|
2486
|
+
|
2480
2487
|
this.inputs.forEach((input) => {
|
2488
|
+
input.addEventListener('change', (e) => {
|
2489
|
+
if (currentInput !== e.target) {
|
2490
|
+
this.parseInputValue(input);
|
2491
|
+
}
|
2492
|
+
});
|
2493
|
+
|
2481
2494
|
// sanitize the input
|
2482
|
-
input.addEventListener('input', (
|
2483
|
-
|
2495
|
+
input.addEventListener('input', (e) => {
|
2496
|
+
// when using iPhone's code autofill we get only `change` events.
|
2497
|
+
// In other scenarios we get `input` AND `change` events.
|
2498
|
+
// In order to be parse the digits properly in iPhone, we need to listen to `change` event
|
2499
|
+
// and validate it was not preceeded by an `input` event.
|
2500
|
+
// To do so, we're keeping a reference to the input element in `input` events,
|
2501
|
+
// and only if there the reference is null, then we're assuming no `input` event was preceeding,
|
2502
|
+
// and we're parsing the digits.
|
2503
|
+
currentInput = e.target;
|
2504
|
+
setTimeout(() => {
|
2505
|
+
currentInput = null;
|
2506
|
+
if (e.inputType === 'deleteContentBackward') {
|
2507
|
+
focusElement(this.getPrevInput(input));
|
2508
|
+
}
|
2509
|
+
});
|
2484
2510
|
|
2485
|
-
|
2486
|
-
// if we got an invalid value we want to clear the input
|
2487
|
-
input.value = '';
|
2488
|
-
} else this.fillDigits(charArr, input);
|
2511
|
+
this.parseInputValue(input);
|
2489
2512
|
});
|
2490
2513
|
|
2491
2514
|
// we want backspace to focus on the previous digit
|
2492
2515
|
input.onkeydown = ({ key }) => {
|
2493
2516
|
// when user deletes a digit, we want to focus the previous digit
|
2494
2517
|
if (key === 'Backspace') {
|
2495
|
-
|
2496
|
-
if (!input.selectionStart) {
|
2497
|
-
input.setSelectionRange(1, 1);
|
2498
|
-
}
|
2499
|
-
setTimeout(() => {
|
2500
|
-
focusElement(this.getPrevInput(input));
|
2501
|
-
});
|
2518
|
+
input.setSelectionRange(1, 1);
|
2502
2519
|
} else if (key.length === 1) {
|
2503
2520
|
// we want only characters and not command keys
|
2504
2521
|
input.value = ''; // we are clearing the previous value so we can override it with the new value
|
@@ -2524,6 +2541,10 @@ class PasscodeInternal extends BaseInputClass$3 {
|
|
2524
2541
|
}
|
2525
2542
|
}
|
2526
2543
|
}
|
2544
|
+
|
2545
|
+
get pattern() {
|
2546
|
+
return `^$|^\\d{${this.digits},}$`;
|
2547
|
+
}
|
2527
2548
|
}
|
2528
2549
|
|
2529
2550
|
const componentName$b = getComponentName('text-field');
|
@@ -6763,7 +6784,6 @@ const uploadFile = {
|
|
6763
6784
|
|
6764
6785
|
[vars$1.fontSize]: '16px',
|
6765
6786
|
[vars$1.titleFontWeight]: '500',
|
6766
|
-
[vars$1.fileNameFontWeight]: '300',
|
6767
6787
|
[vars$1.lineHeight]: '1em',
|
6768
6788
|
|
6769
6789
|
[vars$1.borderWidth]: refs.borderWidth,
|