@descope/web-components-ui 1.0.159 → 1.0.160
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/index.cjs.js +43 -36
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +44 -37
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/1000.js +1 -1
- package/dist/umd/descope-phone-field-descope-phone-field-internal-index-js.js +1 -1
- package/package.json +1 -1
- package/src/components/descope-phone-field/descope-phone-field-internal/PhoneFieldInternal.js +1 -1
- package/src/mixins/proxyInputMixin.js +46 -39
package/dist/cjs/index.cjs.js
CHANGED
@@ -1241,12 +1241,14 @@ const proxyInputMixin = (superclass) =>
|
|
1241
1241
|
}
|
1242
1242
|
|
1243
1243
|
get inputElement() {
|
1244
|
+
if (this.#inputElement) return this.#inputElement
|
1245
|
+
|
1244
1246
|
this.warnIfInputElementIsMissing();
|
1245
1247
|
|
1246
1248
|
const inputSlot = this.baseElement.shadowRoot?.querySelector('slot[name="input"]');
|
1247
1249
|
const textAreaSlot = this.baseElement.shadowRoot?.querySelector('slot[name="textarea"]');
|
1248
1250
|
|
1249
|
-
this.#inputElement
|
1251
|
+
this.#inputElement = getNestedInput(inputSlot) || getNestedInput(textAreaSlot);
|
1250
1252
|
|
1251
1253
|
return this.#inputElement;
|
1252
1254
|
}
|
@@ -1273,49 +1275,54 @@ const proxyInputMixin = (superclass) =>
|
|
1273
1275
|
init() {
|
1274
1276
|
super.init?.();
|
1275
1277
|
|
1276
|
-
|
1277
|
-
|
1278
|
-
|
1279
|
-
|
1280
|
-
|
1281
|
-
|
1282
|
-
|
1283
|
-
|
1284
|
-
|
1285
|
-
|
1286
|
-
|
1278
|
+
// on some cases the base element is not ready so the inputElement is empty
|
1279
|
+
// we are deferring this section to make sure the base element is ready
|
1280
|
+
setTimeout(() => {
|
1281
|
+
this.inputElement.addEventListener('input', (e) => {
|
1282
|
+
if (!this.inputElement.checkValidity()) {
|
1283
|
+
this.inputElement.setCustomValidity('');
|
1284
|
+
// after updating the input validity we want to trigger set validity on the wrapping element
|
1285
|
+
// so we will get the updated validity
|
1286
|
+
this.setCustomValidity('');
|
1287
|
+
|
1288
|
+
// Vaadin is getting the input event before us,
|
1289
|
+
// so in order to make sure they use the updated validity
|
1290
|
+
// we calling their fn after updating the input validity
|
1291
|
+
this.baseElement.__onInput(e);
|
1292
|
+
|
1293
|
+
this.#handleErrorMessage();
|
1294
|
+
}
|
1295
|
+
});
|
1287
1296
|
|
1288
|
-
|
1289
|
-
|
1290
|
-
|
1297
|
+
this.baseElement.addEventListener('change', () => {
|
1298
|
+
this.#dispatchChange();
|
1299
|
+
});
|
1291
1300
|
|
1292
|
-
|
1293
|
-
|
1294
|
-
|
1301
|
+
this.#inputElement.addEventListener('blur', () => {
|
1302
|
+
if (!this.checkValidity()) {
|
1303
|
+
this.setAttribute('invalid', 'true');
|
1304
|
+
this.#handleErrorMessage();
|
1305
|
+
}
|
1306
|
+
});
|
1295
1307
|
|
1296
|
-
|
1297
|
-
|
1298
|
-
|
1308
|
+
this.addEventListener('invalid', () => {
|
1309
|
+
if (!this.checkValidity()) {
|
1310
|
+
this.setAttribute('invalid', 'true');
|
1311
|
+
}
|
1299
1312
|
this.#handleErrorMessage();
|
1300
|
-
}
|
1301
|
-
});
|
1302
|
-
|
1303
|
-
this.addEventListener('invalid', () => {
|
1304
|
-
if (!this.checkValidity()) {
|
1305
|
-
this.setAttribute('invalid', 'true');
|
1306
|
-
}
|
1307
|
-
this.#handleErrorMessage();
|
1308
|
-
});
|
1313
|
+
});
|
1309
1314
|
|
1310
|
-
|
1315
|
+
this.handleInternalInputErrorMessage();
|
1311
1316
|
|
1312
|
-
|
1313
|
-
|
1314
|
-
|
1315
|
-
|
1317
|
+
// sync properties
|
1318
|
+
propertyObserver(this, this.inputElement, 'value');
|
1319
|
+
propertyObserver(this, this.inputElement, 'selectionStart');
|
1320
|
+
this.setSelectionRange = this.inputElement.setSelectionRange?.bind(this.inputElement);
|
1316
1321
|
|
1317
|
-
|
1322
|
+
forwardAttrs(this, this.inputElement, { includeAttrs: ['inputmode'] });
|
1323
|
+
});
|
1318
1324
|
}
|
1325
|
+
|
1319
1326
|
};
|
1320
1327
|
|
1321
1328
|
const composedProxyInputMixin = compose(
|