@vaadin/vaadin-combo-box - npm Package Compare versions

package.json

		{
		"name": "@vaadin/vaadin-combo-box",
		"version": "21.0.0-alpha9",
		"version": "21.0.0-beta1",
		"description": "Web Component for displaying a list of items with filtering",
		@@ -31,10 +31,10 @@ "main": "vaadin-combo-box.js",
		"@polymer/polymer": "^3.0.0",
		"@vaadin/vaadin-control-state-mixin": "^21.0.0-alpha9",
		"@vaadin/vaadin-element-mixin": "^21.0.0-alpha9",
		"@vaadin/vaadin-item": "^21.0.0-alpha9",
		"@vaadin/vaadin-lumo-styles": "^21.0.0-alpha9",
		"@vaadin/vaadin-material-styles": "^21.0.0-alpha9",
		"@vaadin/vaadin-overlay": "^21.0.0-alpha9",
		"@vaadin/vaadin-text-field": "^21.0.0-alpha9",
		"@vaadin/vaadin-themable-mixin": "^21.0.0-alpha9"
		"@vaadin/vaadin-control-state-mixin": "21.0.0-beta1",
		"@vaadin/vaadin-element-mixin": "21.0.0-beta1",
		"@vaadin/vaadin-item": "21.0.0-beta1",
		"@vaadin/vaadin-lumo-styles": "21.0.0-beta1",
		"@vaadin/vaadin-material-styles": "21.0.0-beta1",
		"@vaadin/vaadin-overlay": "21.0.0-beta1",
		"@vaadin/vaadin-text-field": "21.0.0-beta1",
		"@vaadin/vaadin-themable-mixin": "21.0.0-beta1"
		},
		@@ -46,4 +46,4 @@ "devDependencies": {
		"@vaadin/testing-helpers": "^0.2.1",
		"@vaadin/vaadin-dialog": "^21.0.0-alpha9",
		"@vaadin/vaadin-template-renderer": "^21.0.0-alpha9",
		"@vaadin/vaadin-dialog": "21.0.0-beta1",
		"@vaadin/vaadin-template-renderer": "21.0.0-beta1",
		"sinon": "^9.2.0"
		@@ -54,3 +54,3 @@ },
		},
		"gitHead": "72059f699ad36f58e1bb0a40aa7d3a411587e22b"
		"gitHead": "7d08834d03228105c2ea72213a385ddf35125f79"
		}

src/interfaces.d.ts

		@@ -57,3 +57,3 @@ import { ComboBoxElement } from './vaadin-combo-box';
		*/
		export type ComboBoxSelectedItemChangedEvent<TItem> = CustomEvent<{ value: TItem }>;
		export type ComboBoxSelectedItemChangedEvent<TItem> = CustomEvent<{ value: TItem \| null \| undefined }>;

		@@ -60,0 +60,0 @@ export interface ComboBoxEventMap<TItem> extends HTMLElementEventMap {

src/vaadin-combo-box-dropdown.js

		@@ -23,2 +23,4 @@ /**

		const ONE_THIRD = 0.3;

		/**
		@@ -225,2 +227,8 @@ * An element used internally by `<vaadin-combo-box>`. Not intended to be used separately.

		_shouldAlignLeft(targetRect) {
		const spaceRight = (window.innerWidth - targetRect.right) / window.innerWidth;

		return spaceRight < ONE_THIRD;
		}

		_shouldAlignAbove(targetRect) {
		@@ -230,3 +238,3 @@ const spaceBelow =

		return spaceBelow < 0.3;
		return spaceBelow < ONE_THIRD;
		}
		@@ -260,6 +268,9 @@
		const targetRect = this.positionTarget.getBoundingClientRect();
		const alignedLeft = this._shouldAlignLeft(targetRect);
		this.alignedAbove = this._shouldAlignAbove(targetRect);

		const overlayRect = this.$.overlay.getBoundingClientRect();
		this._translateX = targetRect.left - overlayRect.left + (this._translateX \|\| 0);
		this._translateX = alignedLeft
		? targetRect.right - overlayRect.right + (this._translateX \|\| 0)
		: targetRect.left - overlayRect.left + (this._translateX \|\| 0);
		this._translateY =
		@@ -266,0 +277,0 @@ targetRect.top - overlayRect.top + (this._translateY \|\| 0) + this._verticalOffset(overlayRect, targetRect);

src/vaadin-combo-box-item.js

		@@ -102,3 +102,3 @@ /**
		static get observers() {
		return ['_rendererOrItemChanged(renderer, index, item.*, selected, focused)', '_updateLabel(label, renderer)'];
		return ['__rendererOrItemChanged(renderer, index, item.*, selected, focused)', '__updateLabel(label, renderer)'];
		}
		@@ -120,3 +120,9 @@

		_render() {
		/**
		* Requests an update for the content of the item.
		* While performing the update, it invokes the renderer passed in the `renderer` property.
		*
		* It is not guaranteed that the update happens immediately (synchronously) after it is requested.
		*/
		requestContentUpdate() {
		if (!this.renderer) {
		@@ -136,3 +142,4 @@ return;

		_rendererOrItemChanged(renderer, index, item, _selected, _focused) {
		/** @private */
		__rendererOrItemChanged(renderer, index, item, _selected, _focused) {
		if (item === undefined \|\| index === undefined) {
		@@ -148,7 +155,8 @@ return;
		this._oldRenderer = renderer;
		this._render();
		this.requestContentUpdate();
		}
		}

		_updateLabel(label, renderer) {
		/** @private */
		__updateLabel(label, renderer) {
		if (renderer) return;
		@@ -155,0 +163,0 @@

src/vaadin-combo-box-mixin.d.ts

		@@ -145,3 +145,13 @@ import { ComboBoxRenderer } from './interfaces';
		/**
		* Requests an update for the content of items.
		* While performing the update, it invokes the renderer (passed in the `renderer` property) once an item.
		*
		* It is not guaranteed that the update happens immediately (synchronously) after it is requested.
		*/
		requestContentUpdate(): void;

		/**
		* Manually invoke existing renderer.
		*
		* @deprecated Since Vaadin 21, `render()` is deprecated. Please use `requestContentUpdate()` instead.
		*/
		@@ -148,0 +158,0 @@ render(): void;

src/vaadin-combo-box-mixin.js

		@@ -308,8 +308,26 @@ /**
		/**
		* Requests an update for the content of items.
		* While performing the update, it invokes the renderer (passed in the `renderer` property) once an item.
		*
		* It is not guaranteed that the update happens immediately (synchronously) after it is requested.
		*/
		requestContentUpdate() {
		if (!this.$.overlay._selector) {
		return;
		}

		this.$.overlay._selector.querySelectorAll('vaadin-combo-box-item').forEach((item) => {
		item.requestContentUpdate();
		});
		}

		/**
		* Manually invoke existing renderer.
		*
		* @deprecated Since Vaadin 21, `render()` is deprecated. Please use `requestContentUpdate()` instead.
		*/
		render() {
		if (this.$.overlay._selector) {
		this.$.overlay._selector.querySelectorAll('vaadin-combo-box-item').forEach((item) => item._render());
		}
		console.warn('WARNING: Since Vaadin 21, render() is deprecated. Please use requestContentUpdate() instead.');

		this.requestContentUpdate();
		}
		@@ -316,0 +334,0 @@

src/vaadin-combo-box.js

New alerts