@descope/web-components-ui 1.0.320 → 1.0.322
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 +131 -6
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/index.esm.js +190 -65
- package/dist/index.esm.js.map +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-descope-new-password-internal-index-js.js +1 -1
- package/dist/umd/descope-new-password-index-js.js +1 -1
- package/dist/umd/descope-password-index-js.js +1 -1
- package/package.json +1 -1
- package/src/components/descope-email-field/EmailFieldClass.js +65 -1
- package/src/components/descope-password/PasswordClass.js +69 -3
- package/src/{components/descope-password/helpers.js → helpers/externalInputs.js} +5 -5
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
// since on load we can only sample the color of the placeholder,
|
|
2
2
|
// we need to temporarily populate the input in order to sample the value color
|
|
3
|
-
const getValueColor = (ele, computedStyle) => {
|
|
3
|
+
export const getValueColor = (ele, computedStyle) => {
|
|
4
4
|
// eslint-disable-next-line no-param-reassign
|
|
5
5
|
ele.value = '_';
|
|
6
6
|
|
|
@@ -21,18 +21,18 @@ export const createExternalInputSlot = (slotName, targetSlotName) => {
|
|
|
21
21
|
return slotEle;
|
|
22
22
|
};
|
|
23
23
|
|
|
24
|
-
export const createExternalInputEle = (targetSlotName, autocompleteType) => {
|
|
24
|
+
export const createExternalInputEle = (targetSlotName, type, autocompleteType) => {
|
|
25
25
|
const inputEle = document.createElement('input');
|
|
26
26
|
|
|
27
27
|
inputEle.setAttribute('slot', targetSlotName);
|
|
28
|
-
inputEle.setAttribute('type',
|
|
28
|
+
inputEle.setAttribute('type', type);
|
|
29
29
|
inputEle.setAttribute('data-hidden-input', 'true');
|
|
30
30
|
inputEle.setAttribute('autocomplete', autocompleteType);
|
|
31
31
|
|
|
32
32
|
return inputEle;
|
|
33
33
|
};
|
|
34
34
|
|
|
35
|
-
export const applyExternalInputStyles = (sourceInputEle, targetInputEle) => {
|
|
35
|
+
export const applyExternalInputStyles = (sourceInputEle, targetInputEle, customStyle) => {
|
|
36
36
|
const computedStyle = getComputedStyle(sourceInputEle);
|
|
37
37
|
const height = computedStyle.getPropertyValue('height');
|
|
38
38
|
const paddingLeft = computedStyle.getPropertyValue('padding-left');
|
|
@@ -48,7 +48,6 @@ export const applyExternalInputStyles = (sourceInputEle, targetInputEle) => {
|
|
|
48
48
|
targetInputEle.style = `
|
|
49
49
|
all: unset !important;
|
|
50
50
|
position: absolute !important;
|
|
51
|
-
width: calc(100% - 3em) !important;
|
|
52
51
|
background-color: transparent !important;
|
|
53
52
|
color: ${valueColor} !important;
|
|
54
53
|
height: ${height} !important;
|
|
@@ -58,5 +57,6 @@ export const applyExternalInputStyles = (sourceInputEle, targetInputEle) => {
|
|
|
58
57
|
font-family: ${fontFamily} !important;
|
|
59
58
|
letter-spacing: ${letterSpacing} !important;
|
|
60
59
|
caret-color: ${caretColor} !important;
|
|
60
|
+
${customStyle || ''}
|
|
61
61
|
`;
|
|
62
62
|
};
|