@descope/web-components-ui 1.0.125 → 1.0.127

package/dist/index.d.ts

@@ -21,7 +21,7 @@ export { LinkClass } from './components/descope-link';
 export { LogoClass } from './components/descope-logo';
 export { NumberFieldClass } from './components/descope-number-field';
 export { PasscodeClass } from './components/descope-passcode';
-export { PasswordFieldClass } from './components/descope-password-field';
+export { PasswordClass } from './components/descope-password';
 export { TextClass } from './components/descope-text';
 export { TextAreaClass } from './components/descope-text-area';
 export { TextFieldClass } from './components/descope-text-field';

package/dist/index.esm.js

@@ -878,6 +878,10 @@ const proxyInputMixin = (superclass) =>
 			}, 0);
 		}
 
+		get name () {
+			return this.getAttribute('name');
+		}
+
 		get inputElement() {
 			this.warnIfInputElementIsMissing();
 
@@ -2756,7 +2760,7 @@ const passwordDraggableMixin = (superclass) => class PasswordDraggableMixinClass
 	}
 };
 
-const componentName$8 = getComponentName('password-field');
+const componentName$8 = getComponentName('password');
 
 const {
 	host: host$4,
@@ -2780,7 +2784,7 @@ const {
 	errorMessage: { selector: '::part(error-message)' }
 };
 
-const PasswordFieldClass = compose(
+const PasswordClass = compose(
 	createStyleMixin({
 		mappings: {
 			hostWidth: { ...host$4, property: 'width' },
@@ -2834,7 +2838,7 @@ const PasswordFieldClass = compose(
 				min-width: 10em;
 				max-width: 100%;
 				box-sizing: border-box;				
-				padding: calc(var(${PasswordFieldClass.cssVarList.inputOutlineWidth}) + var(${PasswordFieldClass.cssVarList.inputOutlineOffset}));
+				padding: calc(var(${PasswordClass.cssVarList.inputOutlineWidth}) + var(${PasswordClass.cssVarList.inputOutlineOffset}));
 			}
 			vaadin-password-field {
 				width: 100%;
@@ -2871,7 +2875,7 @@ const PasswordFieldClass = compose(
 			}
 
 			vaadin-password-field-button[focus-ring] {
-				box-shadow: 0 0 0 2px var(${PasswordFieldClass.cssVarList.inputOutlineColor});
+				box-shadow: 0 0 0 2px var(${PasswordClass.cssVarList.inputOutlineColor});
 			}
 		`,
 		excludeAttrsSync: ['tabindex'],
@@ -2879,7 +2883,7 @@ const PasswordFieldClass = compose(
 	})
 );
 
-customElements.define(componentName$8, PasswordFieldClass);
+customElements.define(componentName$8, PasswordClass);
 
 const componentName$7 = getComponentName('text-area');
 
@@ -4924,8 +4928,8 @@ const NewPasswordClass = compose(
 			fontSize: [
 				host,
 				{
-					selector: PasswordFieldClass.componentName,
-					property: PasswordFieldClass.cssVarList.fontSize
+					selector: PasswordClass.componentName,
+					property: PasswordClass.cssVarList.fontSize
 				}
 			],
 			fontFamily: [
@@ -4982,7 +4986,7 @@ const NewPasswordClass = compose(
 			display: flex;
 			   flex-direction: column;
 		}
-		descope-password-field {
+		descope-password {
 			display: block;
 			width: 100%;
 		}
@@ -5080,10 +5084,10 @@ class NewPasswordInternal extends BaseInputClass {
 	}
 
 	renderInputs(shouldRenderConfirm) {
-		let template = `<descope-password-field data-id="password"></descope-password-field>`;
+		let template = `<descope-password data-id="password"></descope-password>`;
 
 		if (shouldRenderConfirm) {
-			template += `<descope-password-field data-id="confirm"></descope-password-field>`;
+			template += `<descope-password data-id="confirm"></descope-password>`;
 		}
 
 		this.wrapperEle.innerHTML = template;
@@ -5724,9 +5728,9 @@ var textField$1 = /*#__PURE__*/Object.freeze({
 	vars: vars$j
 });
 
-const vars$i = PasswordFieldClass.cssVarList;
+const vars$i = PasswordClass.cssVarList;
 
-const passwordField = {
+const password = {
 	[vars$i.hostWidth]: refs.width,
 	[vars$i.fontSize]: refs.fontSize,
 	[vars$i.fontFamily]: refs.fontFamily,
@@ -5746,9 +5750,9 @@ const passwordField = {
 	[vars$i.inputOutlineOffset]: refs.outlineOffset,
 };
 
-var passwordField$1 = /*#__PURE__*/Object.freeze({
+var password$1 = /*#__PURE__*/Object.freeze({
 	__proto__: null,
-	default: passwordField,
+	default: password,
 	vars: vars$i
 });
 
@@ -6468,7 +6472,7 @@ const newPassword = {
 	[vars$1.spaceBetweenInputs]: '1em',
 
 	_required: {
-		// NewPassword doesn't pass `required` attribute to its PasswordFields.
+		// NewPassword doesn't pass `required` attribute to its Password components.
 		// That's why we fake the required indicator on each input.
 		// We do that by injecting `::after` element, and populating it with requiredIndicator content.
 		[vars$1.inputsRequiredIndicator]: refs.requiredIndicator, // used to populate required content for NewPassword input fields outside the theme
@@ -6484,7 +6488,7 @@ var newPassword$1 = /*#__PURE__*/Object.freeze({
 const components = {
 	button: button$1,
 	textField: textField$1,
-	passwordField: passwordField$1,
+	password: password$1,
 	numberField: numberField$1,
 	emailField: emailField$1,
 	textArea: textArea$1,
@@ -6511,5 +6515,5 @@ const vars = Object.keys(components).reduce((acc, comp) => ({ ...acc, [comp]: co
 const defaultTheme = { globals, components: theme };
 const themeVars = { globals: vars$m, components: vars };
 
-export { ButtonClass, CheckboxClass, ContainerClass, DividerClass, EmailFieldClass, ImageClass, LinkClass, LoaderLinearClass, LoaderRadialClass, LogoClass, NewPasswordClass, NumberFieldClass, PasscodeClass, PasswordFieldClass, PhoneFieldClass, SwitchToggleClass, TextAreaClass, TextClass, TextFieldClass, componentsThemeManager, createComponentsTheme, defaultTheme, genColor, globalsThemeToStyle, themeToStyle, themeVars };
+export { ButtonClass, CheckboxClass, ContainerClass, DividerClass, EmailFieldClass, ImageClass, LinkClass, LoaderLinearClass, LoaderRadialClass, LogoClass, NewPasswordClass, NumberFieldClass, PasscodeClass, PasswordClass, PhoneFieldClass, SwitchToggleClass, TextAreaClass, TextClass, TextFieldClass, componentsThemeManager, createComponentsTheme, defaultTheme, genColor, globalsThemeToStyle, themeToStyle, themeVars };
 //# sourceMappingURL=index.esm.js.map