@vaadin/app-layout 25.0.0-alpha4 → 25.0.0-alpha6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/package.json +9 -9
  2. package/src/styles/vaadin-app-layout-base-styles.js +10 -10
  3. package/src/vaadin-app-layout.js +2 -1
  4. package/src/vaadin-drawer-toggle.js +2 -1
  5. package/web-types.json +1 -1
  6. package/web-types.lit.json +1 -1
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/app-layout",
3
- "version": "25.0.0-alpha4",
3
+ "version": "25.0.0-alpha6",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -37,16 +37,16 @@
37
37
  ],
38
38
  "dependencies": {
39
39
  "@open-wc/dedupe-mixin": "^1.3.0",
40
- "@vaadin/a11y-base": "25.0.0-alpha4",
41
- "@vaadin/button": "25.0.0-alpha4",
42
- "@vaadin/component-base": "25.0.0-alpha4",
43
- "@vaadin/vaadin-lumo-styles": "25.0.0-alpha4",
44
- "@vaadin/vaadin-themable-mixin": "25.0.0-alpha4",
40
+ "@vaadin/a11y-base": "25.0.0-alpha6",
41
+ "@vaadin/button": "25.0.0-alpha6",
42
+ "@vaadin/component-base": "25.0.0-alpha6",
43
+ "@vaadin/vaadin-lumo-styles": "25.0.0-alpha6",
44
+ "@vaadin/vaadin-themable-mixin": "25.0.0-alpha6",
45
45
  "lit": "^3.0.0"
46
46
  },
47
47
  "devDependencies": {
48
- "@vaadin/chai-plugins": "25.0.0-alpha4",
49
- "@vaadin/test-runner-commands": "25.0.0-alpha4",
48
+ "@vaadin/chai-plugins": "25.0.0-alpha6",
49
+ "@vaadin/test-runner-commands": "25.0.0-alpha6",
50
50
  "@vaadin/testing-helpers": "^2.0.0",
51
51
  "sinon": "^18.0.0"
52
52
  },
@@ -54,5 +54,5 @@
54
54
  "web-types.json",
55
55
  "web-types.lit.json"
56
56
  ],
57
- "gitHead": "ce4421f0daf26027b863b91787a474e4cc264344"
57
+ "gitHead": "cd1d084198d2b326c58d44bb39fa4845b71ce551"
58
58
  }
package/src/styles/vaadin-app-layout-base-styles.js CHANGED
@@ -63,20 +63,20 @@ export const appLayoutStyles = css`
63
63
  top: 0;
64
64
  inset-inline: 0;
65
65
  transition: inset-inline-start var(--vaadin-app-layout-transition-duration);
66
- padding-top: max(var(--vaadin-app-layout-navbar-padding-top, var(--_vaadin-padding)), var(--safe-area-inset-top));
67
- padding-bottom: var(--vaadin-app-layout-navbar-padding-bottom, var(--_vaadin-padding));
66
+ padding-top: max(var(--vaadin-app-layout-navbar-padding-top, var(--vaadin-padding)), var(--safe-area-inset-top));
67
+ padding-bottom: var(--vaadin-app-layout-navbar-padding-bottom, var(--vaadin-padding));
68
68
  padding-inline-start: max(
69
- var(--vaadin-app-layout-navbar-padding-inline-start, var(--_vaadin-padding)),
69
+ var(--vaadin-app-layout-navbar-padding-inline-start, var(--vaadin-padding)),
70
70
  var(--safe-area-inset-left)
71
71
  );
72
72
  /* stylelint-disable-next-line declaration-block-no-redundant-longhand-properties */
73
73
  padding-inline-end: max(
74
- var(--vaadin-app-layout-navbar-padding-inline-end, var(--_vaadin-padding)),
74
+ var(--vaadin-app-layout-navbar-padding-inline-end, var(--vaadin-padding)),
75
75
  var(--safe-area-inset-right)
76
76
  );
77
77
  z-index: 1;
78
- gap: var(--vaadin-app-layout-navbar-gap, var(--_vaadin-gap-container-inline));
79
- background: var(--vaadin-app-layout-navbar-background, var(--_vaadin-background-container));
78
+ gap: var(--vaadin-app-layout-navbar-gap, var(--vaadin-gap-container-inline));
79
+ background: var(--vaadin-app-layout-navbar-background, var(--vaadin-background-container));
80
80
  }
81
81
 
82
82
  :host([primary-section='drawer'][drawer-opened]:not([overlay])) [part='navbar'] {
@@ -90,9 +90,9 @@ export const appLayoutStyles = css`
90
90
  [part='navbar'][bottom] {
91
91
  top: auto;
92
92
  bottom: 0;
93
- padding-top: var(--vaadin-app-layout-navbar-padding-top, var(--_vaadin-padding));
93
+ padding-top: var(--vaadin-app-layout-navbar-padding-top, var(--vaadin-padding));
94
94
  padding-bottom: max(
95
- var(--vaadin-app-layout-navbar-padding-bottom, var(--_vaadin-padding)),
95
+ var(--vaadin-app-layout-navbar-padding-bottom, var(--vaadin-padding)),
96
96
  var(--safe-area-inset-bottom)
97
97
  );
98
98
  }
@@ -117,7 +117,7 @@ export const appLayoutStyles = css`
117
117
  visibility: hidden;
118
118
  display: flex;
119
119
  flex-direction: column;
120
- background: var(--vaadin-app-layout-drawer-background, var(--_vaadin-background));
120
+ background: var(--vaadin-app-layout-drawer-background, var(--vaadin-background-color));
121
121
  }
122
122
 
123
123
  :host([drawer-opened]) [part='drawer'] {
@@ -146,7 +146,7 @@ export const appLayoutStyles = css`
146
146
  :host([overlay]) [part='drawer'] {
147
147
  top: 0;
148
148
  bottom: 0;
149
- box-shadow: var(--vaadin-overlay-box-shadow, 0 8px 24px -4px hsl(0 0 0 / 0.3));
149
+ box-shadow: var(--vaadin-overlay-box-shadow, 0 8px 24px -4px rgba(0, 0, 0, 0.3));
150
150
  }
151
151
 
152
152
  :host([overlay]) [part='drawer'],
package/src/vaadin-app-layout.js CHANGED
@@ -9,6 +9,7 @@ import { html, LitElement } from 'lit';
9
9
  import { defineCustomElement } from '@vaadin/component-base/src/define.js';
10
10
  import { ElementMixin } from '@vaadin/component-base/src/element-mixin.js';
11
11
  import { PolylitMixin } from '@vaadin/component-base/src/polylit-mixin.js';
12
+ import { LumoInjectionMixin } from '@vaadin/vaadin-themable-mixin/lumo-injection-mixin.js';
12
13
  import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
13
14
  import { appLayoutStyles } from './styles/vaadin-app-layout-core-styles.js';
14
15
  import { AppLayoutMixin } from './vaadin-app-layout-mixin.js';
@@ -107,7 +108,7 @@ import { AppLayoutMixin } from './vaadin-app-layout-mixin.js';
107
108
  * @mixes ElementMixin
108
109
  * @mixes ThemableMixin
109
110
  */
110
- class AppLayout extends AppLayoutMixin(ElementMixin(ThemableMixin(PolylitMixin(LitElement)))) {
111
+ class AppLayout extends AppLayoutMixin(ElementMixin(ThemableMixin(LumoInjectionMixin(PolylitMixin(LitElement))))) {
111
112
  static get is() {
112
113
  return 'vaadin-app-layout';
113
114
  }
package/src/vaadin-drawer-toggle.js CHANGED
@@ -10,6 +10,7 @@ import { defineCustomElement } from '@vaadin/component-base/src/define.js';
10
10
  import { DirMixin } from '@vaadin/component-base/src/dir-mixin.js';
11
11
  import { isEmptyTextNode } from '@vaadin/component-base/src/dom-utils.js';
12
12
  import { PolylitMixin } from '@vaadin/component-base/src/polylit-mixin.js';
13
+ import { LumoInjectionMixin } from '@vaadin/vaadin-themable-mixin/lumo-injection-mixin.js';
13
14
  import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
14
15
  import { drawerToggle } from './styles/vaadin-drawer-toggle-core-styles.js';
15
16
 
@@ -28,7 +29,7 @@ import { drawerToggle } from './styles/vaadin-drawer-toggle-core-styles.js';
28
29
  * @mixes DirMixin
29
30
  * @mixes ThemableMixin
30
31
  */
31
- class DrawerToggle extends ButtonMixin(DirMixin(ThemableMixin(PolylitMixin(LitElement)))) {
32
+ class DrawerToggle extends ButtonMixin(DirMixin(ThemableMixin(LumoInjectionMixin(PolylitMixin(LitElement))))) {
32
33
  static get is() {
33
34
  return 'vaadin-drawer-toggle';
34
35
  }
package/web-types.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/app-layout",
4
- "version": "25.0.0-alpha4",
4
+ "version": "25.0.0-alpha6",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
package/web-types.lit.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/app-layout",
4
- "version": "25.0.0-alpha4",
4
+ "version": "25.0.0-alpha6",
5
5
  "description-markup": "markdown",
6
6
  "framework": "lit",
7
7
  "framework-config": {