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

Comparing version 4.2.0-alpha1 to 4.2.0-alpha2

package.json

@@ -13,3 +13,3 @@ {
   "name": "@vaadin/vaadin-combo-box",
-  "version": "4.2.0-alpha1",
+  "version": "4.2.0-alpha2",
   "main": "vaadin-combo-box.js",
@@ -21,2 +21,7 @@ "author": "Vaadin Ltd",
   },
+  "files": [
+    "vaadin-*.js",
+    "src",
+    "theme"
+  ],
   "resolutions": {
@@ -26,39 +31,37 @@ "inherits": "2.0.3",
     "supports-color": "3.1.2",
-    "type-detect": "1.0.0",
-    "@webcomponents/webcomponentsjs": "2.0.0-beta.2"
+    "type-detect": "1.0.0"
   },
   "dependencies": {
-    "@polymer/iron-a11y-keys-behavior": "^3.0.0-pre.15",
-    "@polymer/iron-a11y-announcer": "^3.0.0-pre.15",
-    "@polymer/iron-list": "^3.0.0-pre.15",
-    "@polymer/iron-resizable-behavior": "^3.0.0-pre.15",
+    "@polymer/iron-a11y-keys-behavior": "^3.0.0-pre.18",
+    "@polymer/iron-a11y-announcer": "^3.0.0-pre.18",
+    "@polymer/iron-list": "^3.0.0-pre.18",
+    "@polymer/iron-resizable-behavior": "^3.0.0-pre.18",
     "@polymer/polymer": "^3.0.0",
     "@vaadin/vaadin-control-state-mixin": "^2.1.1",
-    "@vaadin/vaadin-overlay": "^3.1.0-beta2",
-    "@vaadin/vaadin-text-field": "^2.1.0-beta2",
+    "@vaadin/vaadin-overlay": "^3.2.0-alpha1",
+    "@vaadin/vaadin-text-field": "^2.1.1",
     "@vaadin/vaadin-themable-mixin": "^1.2.1",
-    "@vaadin/vaadin-lumo-styles": "^1.1.0-beta1",
-    "@vaadin/vaadin-material-styles": "^1.1.0-beta1",
-    "@vaadin/vaadin-item": "^2.1.0-beta2",
+    "@vaadin/vaadin-lumo-styles": "^1.1.1",
+    "@vaadin/vaadin-material-styles": "^1.1.2",
+    "@vaadin/vaadin-item": "^2.1.0",
     "@vaadin/vaadin-element-mixin": "^2.0.0"
   },
   "devDependencies": {
-    "@polymer/iron-ajax": "^3.0.0-pre.15",
-    "@polymer/iron-component-page": "^3.0.0-pre.15",
-    "@polymer/iron-demo-helpers": "^3.0.0-pre.15",
-    "@polymer/iron-form": "^3.0.0-pre.15",
-    "@polymer/iron-icon": "^3.0.0-pre.15",
-    "@polymer/iron-icons": "^3.0.0-pre.15",
-    "@polymer/iron-input": "^3.0.0-pre.15",
-    "@polymer/iron-test-helpers": "^3.0.0-pre.15",
-    "@polymer/paper-button": "^3.0.0-pre.15",
-    "@polymer/paper-icon-button": "^3.0.0-pre.15",
-    "@polymer/paper-item": "^3.0.0-pre.15",
-    "@polymer/paper-input": "^3.0.0-pre.15",
-    "@polymer/paper-styles": "^3.0.0-pre.15",
-    "@polymer/test-fixture": "^3.0.0-pre.15",
-    "@vaadin/vaadin-button": "^2.1.0-beta2",
-    "wct-browser-legacy": "^0.0.1-pre.11",
+    "@polymer/iron-ajax": "^3.0.0-pre.18",
+    "@polymer/iron-component-page": "^3.0.0-pre.18",
+    "@polymer/iron-demo-helpers": "^3.0.0-pre.18",
+    "@polymer/iron-form": "^3.0.0-pre.18",
+    "@polymer/iron-icon": "^3.0.0-pre.18",
+    "@polymer/iron-icons": "^3.0.0-pre.18",
+    "@polymer/iron-input": "^3.0.0-pre.18",
+    "@polymer/iron-test-helpers": "^3.0.0-pre.18",
+    "@polymer/paper-button": "^3.0.0-pre.18",
+    "@polymer/paper-icon-button": "^3.0.0-pre.18",
+    "@polymer/paper-input": "^3.0.0-pre.18",
+    "@polymer/paper-styles": "^3.0.0-pre.18",
+    "@polymer/test-fixture": "^3.0.0-pre.18",
+    "@vaadin/vaadin-button": "^2.1.0",
+    "wct-browser-legacy": "^1.0.1",
     "@vaadin/vaadin-demo-helpers": "^2.0.1"
   }
 }

src/vaadin-combo-box-dropdown-wrapper.js

@@ -8,8 +8,16 @@ /**
 
-import '@polymer/polymer/lib/utils/debounce.js';
 import '@polymer/iron-list/iron-list.js';
-import '@polymer/iron-resizable-behavior/iron-resizable-behavior.js';
 import './vaadin-combo-box-item.js';
 import './vaadin-combo-box-dropdown.js';
 import { html } from '@polymer/polymer/lib/utils/html-tag.js';
+
+const TOUCH_DEVICE = (() => {
+  try {
+    document.createEvent('TouchEvent');
+    return true;
+  } catch (e) {
+    return false;
+  }
+})();
+
 /**
@@ -43,3 +51,3 @@ * Element for internal use only.
             <template>
-              <vaadin-combo-box-item on-click="_onItemClick" index="[[index]]" item="[[item]]" label="[[getItemLabel(item)]]" selected="[[_isItemSelected(item, _selectedItem)]]" renderer="[[renderer]]" role\$="[[_getAriaRole(index)]]" aria-selected\$="[[_getAriaSelected(_focusedIndex,index)]]" focused="[[_isItemFocused(_focusedIndex,index)]]" touch-device\$="[[touchDevice]]" tabindex="-1">
+              <vaadin-combo-box-item on-click="_onItemClick" index="[[index]]" item="[[item]]" label="[[getItemLabel(item)]]" selected="[[_isItemSelected(item, _selectedItem)]]" renderer="[[renderer]]" role\$="[[_getAriaRole(index)]]" aria-selected\$="[[_getAriaSelected(_focusedIndex,index)]]" focused="[[_isItemFocused(_focusedIndex,index)]]" tabindex="-1">
               </vaadin-combo-box-item>
@@ -65,11 +73,3 @@ </template>
         type: Boolean,
-        reflectToAttribute: true,
-        value: () => {
-          try {
-            document.createEvent('TouchEvent');
-            return true;
-          } catch (e) {
-            return false;
-          }
-        }
+        value: TOUCH_DEVICE
       },
@@ -111,3 +111,2 @@
         type: Number,
-        notify: true,
         value: -1,
@@ -196,7 +195,9 @@ observer: '_focusedIndexChanged'
 
+    const maxHeight = this._maxOverlayHeight(targetRect);
+
     // overlay max height is restrained by the #scroller max height which is set to 65vh in CSS.
-    this.$.dropdown.$.overlay.style.maxHeight = this._maxOverlayHeight(targetRect);
+    this.$.dropdown.$.overlay.style.maxHeight = maxHeight;
 
     // we need to set height for iron-list to make its `firstVisibleIndex` work correctly.
-    this._selector.style.maxHeight = this._maxOverlayHeight(targetRect);
+    this._selector.style.maxHeight = maxHeight;
 
@@ -203,0 +204,0 @@ this.updateViewportBoundaries();

src/vaadin-combo-box-dropdown.js

@@ -71,18 +71,2 @@ /**
       /**
-       * True if the device supports touch events.
-       */
-      touchDevice: {
-        type: Boolean,
-        reflectToAttribute: true,
-        value: () => {
-          try {
-            document.createEvent('TouchEvent');
-            return true;
-          } catch (e) {
-            return false;
-          }
-        }
-      },
-
-      /**
        * The element to position/align the dropdown by.
@@ -208,6 +192,6 @@ */
 
-  _shouldAlignAbove() {
+  _shouldAlignAbove(targetRect) {
     const spaceBelow = (
       window.innerHeight -
-      this.positionTarget.getBoundingClientRect().bottom -
+      targetRect.bottom -
       Math.min(document.body.scrollTop, 0)
@@ -229,3 +213,3 @@ ) / window.innerHeight;
     const targetRect = this.positionTarget.getBoundingClientRect();
-    this.alignedAbove = this._shouldAlignAbove();
+    this.alignedAbove = this._shouldAlignAbove(targetRect);
 
@@ -232,0 +216,0 @@ const overlayRect = this.$.overlay.getBoundingClientRect();

src/vaadin-combo-box-light.js

@@ -8,3 +8,2 @@ /**
 
-import { IronA11yKeysBehavior } from '@polymer/iron-a11y-keys-behavior/iron-a11y-keys-behavior.js';
 import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
@@ -15,3 +14,2 @@ import { ComboBoxMixin } from './vaadin-combo-box-mixin.js';
 import { dashToCamelCase } from '@polymer/polymer/lib/utils/case-map.js';
-import { mixinBehaviors } from '@polymer/polymer/lib/legacy/class.js';
 /**
@@ -63,5 +61,3 @@ * `<vaadin-combo-box-light>` is a customizable version of the `<vaadin-combo-box>` providing
  */
-class ComboBoxLightElement extends ThemableMixin(ComboBoxMixin(mixinBehaviors(
-  [IronA11yKeysBehavior], PolymerElement
-))) {
+class ComboBoxLightElement extends ThemableMixin(ComboBoxMixin(PolymerElement)) {
   static get template() {
@@ -98,2 +94,7 @@ return html`
 
+  constructor() {
+    super();
+    this._boundInputValueChanged = this._inputValueChanged.bind(this);
+  }
+
   ready() {
@@ -114,3 +115,3 @@ super.ready();
     this._revertInputValue();
-    this.listen(this.inputElement, 'input', '_inputValueChanged');
+    this.inputElement.addEventListener('input', this._boundInputValueChanged);
     this._preventInputBlur();
@@ -121,3 +122,3 @@ }
     super.disconnectedCallback();
-    this.unlisten(this.inputElement, 'input', '_inputValueChanged');
+    this.inputElement.removeEventListener('input', this._boundInputValueChanged);
     this._restoreInputBlur();
@@ -124,0 +125,0 @@ }

src/vaadin-combo-box-mixin.js

@@ -6,10 +6,9 @@ /**
 */
-import '@polymer/polymer/polymer-element.js';
+import { microTask } from '@polymer/polymer/lib/utils/async.js';
 
+import { flush } from '@polymer/polymer/lib/utils/flush.js';
 import { templatize } from '@polymer/polymer/lib/utils/templatize.js';
 import { IronA11yAnnouncer } from '@polymer/iron-a11y-announcer/iron-a11y-announcer.js';
+import { IronA11yKeysBehavior } from '@polymer/iron-a11y-keys-behavior/iron-a11y-keys-behavior.js';
 import { FlattenedNodesObserver } from '@polymer/polymer/lib/utils/flattened-nodes-observer.js';
-import { IronA11yKeysBehavior } from '@polymer/iron-a11y-keys-behavior/iron-a11y-keys-behavior.js';
-import { flush } from '@polymer/polymer/lib/utils/flush.js';
-import { microTask } from '@polymer/polymer/lib/utils/async.js';
 
@@ -521,3 +520,3 @@ /**
     // because that will cause problems to say the least.
-    flush && flush();
+    flush();
 
@@ -782,3 +781,3 @@ // With iron-list v1.3.9, calling `notifyResize()` no longer renders
       this.$.overlay._selector.notifyResize();
-      flush && flush();
+      flush();
     }, 1);
@@ -785,0 +784,0 @@ }

src/vaadin-combo-box.js

@@ -8,3 +8,2 @@ /**
 
-import '@polymer/iron-a11y-announcer/iron-a11y-announcer.js';
 import '@vaadin/vaadin-text-field/src/vaadin-text-field.js';
@@ -194,3 +193,3 @@ import { ControlStateMixin } from '@vaadin/vaadin-control-state-mixin/vaadin-control-state-mixin.js';
   static get version() {
-    return '4.2.0-alpha1';
+    return '4.2.0-alpha2';
   }
@@ -197,0 +196,0 @@

theme/lumo/vaadin-combo-box-dropdown-styles.js

@@ -6,3 +6,2 @@ import '@vaadin/vaadin-lumo-styles/spacing.js';
 const $_documentContainer = document.createElement('template');
-$_documentContainer.setAttribute('style', 'display: none;');
 
@@ -9,0 +8,0 @@ $_documentContainer.innerHTML = `<dom-module id="lumo-combo-box-overlay" theme-for="vaadin-combo-box-overlay">

theme/lumo/vaadin-combo-box-item-styles.js

@@ -6,3 +6,2 @@ import '@vaadin/vaadin-lumo-styles/color.js';
 const $_documentContainer = document.createElement('template');
-$_documentContainer.setAttribute('style', 'display: none;');
 
@@ -9,0 +8,0 @@ $_documentContainer.innerHTML = `<dom-module id="lumo-combo-box-item" theme-for="vaadin-combo-box-item">

theme/lumo/vaadin-combo-box-styles.js

@@ -5,3 +5,2 @@ import '@vaadin/vaadin-lumo-styles/font-icons.js';
 const $_documentContainer = document.createElement('template');
-$_documentContainer.setAttribute('style', 'display: none;');
 
@@ -8,0 +7,0 @@ $_documentContainer.innerHTML = `<dom-module id="lumo-combo-box" theme-for="vaadin-combo-box">

theme/material/vaadin-combo-box-dropdown-styles.js

 import '@vaadin/vaadin-material-styles/mixins/menu-overlay.js';
 const $_documentContainer = document.createElement('template');
-$_documentContainer.setAttribute('style', 'display: none;');
 
@@ -5,0 +4,0 @@ $_documentContainer.innerHTML = `<dom-module id="material-combo-box-overlay" theme-for="vaadin-combo-box-overlay">

theme/material/vaadin-combo-box-item-styles.js

@@ -6,3 +6,2 @@ import '@vaadin/vaadin-material-styles/color.js';
 const $_documentContainer = document.createElement('template');
-$_documentContainer.setAttribute('style', 'display: none;');
 
@@ -9,0 +8,0 @@ $_documentContainer.innerHTML = `<dom-module id="material-combo-box-item" theme-for="vaadin-combo-box-item">

theme/material/vaadin-combo-box-styles.js

@@ -6,3 +6,2 @@ import '@vaadin/vaadin-text-field/theme/material/vaadin-text-field.js';
 const $_documentContainer = document.createElement('template');
-$_documentContainer.setAttribute('style', 'display: none;');
 
@@ -9,0 +8,0 @@ $_documentContainer.innerHTML = `<dom-module id="material-combo-box" theme-for="vaadin-combo-box">

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Dev dependency count

16

decreased by-5.88%

Worsened metrics

Total package byte prevSize

89706

decreased by-67.24%

Number of package files

21

decreased by-60.38%

Lines of code

2071

decreased by-7.46%

Dependency changes

• Updated@polymer/iron-a11y-announcer@^3.0.0-pre.18

• Updated@polymer/iron-a11y-keys-behavior@^3.0.0-pre.18

• Updated@polymer/iron-list@^3.0.0-pre.18

• Updated@polymer/iron-resizable-behavior@^3.0.0-pre.18

• Updated@vaadin/vaadin-item@^2.1.0

• Updated@vaadin/vaadin-lumo-styles@^1.1.1

• Updated@vaadin/vaadin-material-styles@^1.1.2

• Updated@vaadin/vaadin-overlay@^3.2.0-alpha1

• Updated@vaadin/vaadin-text-field@^2.1.1