@descope/web-components-ui 1.0.124 → 1.0.126

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

@@ -2756,7 +2756,7 @@ const passwordDraggableMixin = (superclass) => class PasswordDraggableMixinClass
 	}
 };
 
-const componentName$8 = getComponentName('password-field');
+const componentName$8 = getComponentName('password');
 
 const {
 	host: host$4,
@@ -2780,7 +2780,7 @@ const {
 	errorMessage: { selector: '::part(error-message)' }
 };
 
-const PasswordFieldClass = compose(
+const PasswordClass = compose(
 	createStyleMixin({
 		mappings: {
 			hostWidth: { ...host$4, property: 'width' },
@@ -2834,7 +2834,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 +2871,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 +2879,7 @@ const PasswordFieldClass = compose(
 	})
 );
 
-customElements.define(componentName$8, PasswordFieldClass);
+customElements.define(componentName$8, PasswordClass);
 
 const componentName$7 = getComponentName('text-area');
 
@@ -3136,9 +3136,10 @@ const ComboBoxClass = compose(
 		selector: '',
 		mappings: {
 			backgroundColor: { selector: 'vaadin-combo-box-scroller' },
-			fontFamily: { selector: 'vaadin-combo-box-item' },
-			// TODO: this mapping doesn't work, needs fixing.
-			cursor: { selector: 'vaadin-combo-box-item' },
+			cursor: { selector: 'vaadin-combo-box-item' }, // TODO: this mapping doesn't work, needs fixing.
+			minHeight: { selector: 'vaadin-combo-box-overlay' },
+			margin: { selector: 'vaadin-combo-box-overlay' },
+			fontFamily: { selector: 'vaadin-combo-box-item' }
 		},
 		forward: {
 			include: false,
@@ -4923,8 +4924,8 @@ const NewPasswordClass = compose(
 			fontSize: [
 				host,
 				{
-					selector: PasswordFieldClass.componentName,
-					property: PasswordFieldClass.cssVarList.fontSize
+					selector: PasswordClass.componentName,
+					property: PasswordClass.cssVarList.fontSize
 				}
 			],
 			fontFamily: [
@@ -4981,7 +4982,7 @@ const NewPasswordClass = compose(
 			display: flex;
 			   flex-direction: column;
 		}
-		descope-password-field {
+		descope-password {
 			display: block;
 			width: 100%;
 		}
@@ -5079,10 +5080,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;
@@ -5723,9 +5724,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,
@@ -5745,9 +5746,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
 });
 
@@ -6399,6 +6400,9 @@ const comboBox = {
 		[vars$4.inputDropdownButtonCursor]: 'default'
 	},
 
+	[vars$4.overlay.minHeight]: '400px',
+	[vars$4.overlay.margin]: '0 auto'
+
 	// [vars.overlayCursor]: 'pointer',
 	// [vars.overlayBackground]: globalRefs.colors.surface.light,
 	// [vars.overlayBorder]: `2px solid red`,
@@ -6464,7 +6468,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
@@ -6480,7 +6484,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,
@@ -6507,5 +6511,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