@vaadin/vaadin-app-layout - npm Package Compare versions

Comparing version 22.0.0-alpha3 to 22.0.0-alpha4

package.json

 {
   "name": "@vaadin/vaadin-app-layout",
-  "version": "22.0.0-alpha3",
+  "version": "22.0.0-alpha4",
   "description": "vaadin-app-layout",
@@ -30,7 +30,7 @@ "main": "vaadin-app-layout.js",
     "@polymer/polymer": "^3.0.0",
-    "@vaadin/vaadin-button": "^22.0.0-alpha3",
-    "@vaadin/vaadin-element-mixin": "^22.0.0-alpha3",
-    "@vaadin/vaadin-lumo-styles": "^22.0.0-alpha3",
-    "@vaadin/vaadin-material-styles": "^22.0.0-alpha3",
-    "@vaadin/vaadin-themable-mixin": "^22.0.0-alpha3"
+    "@vaadin/button": "^22.0.0-alpha4",
+    "@vaadin/vaadin-element-mixin": "^22.0.0-alpha4",
+    "@vaadin/vaadin-lumo-styles": "^22.0.0-alpha4",
+    "@vaadin/vaadin-material-styles": "^22.0.0-alpha4",
+    "@vaadin/vaadin-themable-mixin": "^22.0.0-alpha4"
   },
@@ -40,3 +40,3 @@ "devDependencies": {
     "@vaadin/testing-helpers": "^0.2.1",
-    "@vaadin/vaadin-tabs": "^22.0.0-alpha3",
+    "@vaadin/vaadin-tabs": "^22.0.0-alpha4",
     "sinon": "^9.2.1"
@@ -47,3 +47,3 @@ },
   },
-  "gitHead": "efd855b1c0a7c4998f43670a17b0c7fdfe14ff9d"
+  "gitHead": "86c025abd605d5a4a3c0ae36eb07c34704cee1f2"
 }

src/vaadin-app-layout.js

@@ -11,4 +11,4 @@ /**
 import { ElementMixin } from '@vaadin/vaadin-element-mixin/vaadin-element-mixin.js';
-import { mixinBehaviors } from '@polymer/polymer/lib/legacy/class';
-import { IronResizableBehavior } from '@polymer/iron-resizable-behavior';
+import { mixinBehaviors } from '@polymer/polymer/lib/legacy/class.js';
+import { IronResizableBehavior } from '@polymer/iron-resizable-behavior/iron-resizable-behavior.js';
 import './safe-area-inset.js';
@@ -15,0 +15,0 @@ import './detect-ios-navbar.js';

src/vaadin-drawer-toggle.d.ts

@@ -1,2 +0,2 @@
-import { ButtonElement } from '@vaadin/vaadin-button/src/vaadin-button.js';
+import { Button } from '@vaadin/button/src/vaadin-button.js';
 
@@ -12,3 +12,3 @@ /**
  */
-declare class DrawerToggleElement extends ButtonElement {
+declare class DrawerToggleElement extends Button {
   ariaLabel: string | null | undefined;
@@ -15,0 +15,0 @@ }

src/vaadin-drawer-toggle.js

@@ -7,3 +7,3 @@ /**
 import { html } from '@polymer/polymer/lib/utils/html-tag.js';
-import { ButtonElement } from '@vaadin/vaadin-button/src/vaadin-button.js';
+import { Button } from '@vaadin/button/src/vaadin-button.js';
 
@@ -18,4 +18,6 @@ /**
  * ```
+ *
+ * @extends Button
  */
-class DrawerToggleElement extends ButtonElement {
+class DrawerToggleElement extends Button {
   static get template() {
@@ -36,12 +38,2 @@ return html`
 
-        #button {
-          position: absolute;
-          top: 0;
-          left: 0;
-          width: 100%;
-          height: 100%;
-          opacity: 0;
-          cursor: inherit;
-        }
-
         [part='icon'],
@@ -73,3 +65,2 @@ [part='icon']::after,
       </slot>
-      <button id="button" type="button" aria-label$="[[ariaLabel]]"></button>
     `;
@@ -86,3 +77,4 @@ }
         type: String,
-        value: 'Toggle'
+        value: 'Toggle',
+        reflectToAttribute: true
       }
@@ -97,3 +89,3 @@ };
       if (!this.disabled) {
-        this._fireClick();
+        this.__fireClick();
       }
@@ -104,3 +96,3 @@ });
       if (/^( |SpaceBar|Enter)$/.test(event.key) && !this.disabled) {
-        this._fireClick();
+        this.__fireClick();
       }
@@ -110,3 +102,4 @@ });
 
-  _fireClick() {
+  /** @private */
+  __fireClick() {
     this.dispatchEvent(new CustomEvent('drawer-toggle-click', { bubbles: true, composed: true }));
@@ -113,0 +106,0 @@ }

theme/lumo/vaadin-drawer-toggle-styles.js

 import { registerStyles, css } from '@vaadin/vaadin-themable-mixin/register-styles.js';
-import '@vaadin/vaadin-button/theme/lumo/vaadin-button-styles.js';
+import '@vaadin/button/theme/lumo/vaadin-button-styles.js';
 import '@vaadin/vaadin-lumo-styles/font-icons.js';
@@ -4,0 +4,0 @@

theme/material/vaadin-drawer-toggle-styles.js

 import { registerStyles, css } from '@vaadin/vaadin-themable-mixin/register-styles.js';
-import '@vaadin/vaadin-button/theme/material/vaadin-button-styles.js';
+import '@vaadin/button/theme/material/vaadin-button-styles.js';
 import '@vaadin/vaadin-material-styles/color.js';
@@ -4,0 +4,0 @@

No alert changes

Worsened metrics

Total package byte prevSize

52652

decreased by-0.43%

Lines of code

1045

decreased by-0.57%

Dependency changes

• + Added@vaadin/button@^22.0.0-alpha4

• - Removed@vaadin/vaadin-button@^22.0.0-alpha3

• - Removed@vaadin/vaadin-button@22.1.0(transitive)

• Updated@vaadin/vaadin-element-mixin@^22.0.0-alpha4

• Updated@vaadin/vaadin-lumo-styles@^22.0.0-alpha4

• Updated@vaadin/vaadin-material-styles@^22.0.0-alpha4

• Updated@vaadin/vaadin-themable-mixin@^22.0.0-alpha4