@vaadin/scroller 25.0.0-alpha7 → 25.0.0-alpha8

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 +8 -8
  2. package/src/styles/vaadin-scroller-base-styles.js +46 -48
  3. package/src/vaadin-scroller.d.ts +1 -1
  4. package/src/vaadin-scroller.js +2 -2
  5. package/web-types.json +2 -2
  6. package/web-types.lit.json +2 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/scroller",
3
- "version": "25.0.0-alpha7",
3
+ "version": "25.0.0-alpha8",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -37,20 +37,20 @@
37
37
  ],
38
38
  "dependencies": {
39
39
  "@open-wc/dedupe-mixin": "^1.3.0",
40
- "@vaadin/a11y-base": "25.0.0-alpha7",
41
- "@vaadin/component-base": "25.0.0-alpha7",
42
- "@vaadin/vaadin-lumo-styles": "25.0.0-alpha7",
43
- "@vaadin/vaadin-themable-mixin": "25.0.0-alpha7",
40
+ "@vaadin/a11y-base": "25.0.0-alpha8",
41
+ "@vaadin/component-base": "25.0.0-alpha8",
42
+ "@vaadin/vaadin-lumo-styles": "25.0.0-alpha8",
43
+ "@vaadin/vaadin-themable-mixin": "25.0.0-alpha8",
44
44
  "lit": "^3.0.0"
45
45
  },
46
46
  "devDependencies": {
47
- "@vaadin/chai-plugins": "25.0.0-alpha7",
48
- "@vaadin/test-runner-commands": "25.0.0-alpha7",
47
+ "@vaadin/chai-plugins": "25.0.0-alpha8",
48
+ "@vaadin/test-runner-commands": "25.0.0-alpha8",
49
49
  "@vaadin/testing-helpers": "^2.0.0"
50
50
  },
51
51
  "web-types": [
52
52
  "web-types.json",
53
53
  "web-types.lit.json"
54
54
  ],
55
- "gitHead": "87f72707ce6866892f8be5782fa0da008e87dcbc"
55
+ "gitHead": "ebf53673d5f639d2b1b6f2b31f640f530643ee2f"
56
56
  }
package/src/styles/vaadin-scroller-base-styles.js CHANGED
@@ -7,53 +7,51 @@ import '@vaadin/component-base/src/style-props.js';
7
7
  import { css } from 'lit';
8
8
 
9
9
  export const scrollerStyles = css`
10
- @layer base {
11
- :host {
12
- display: block;
13
- overflow: auto;
14
- outline: none;
15
- }
16
-
17
- :host([focus-ring]) {
18
- outline: var(--vaadin-focus-ring-width) solid var(--vaadin-focus-ring-color);
19
- }
20
-
21
- :host([hidden]) {
22
- display: none !important;
23
- }
24
-
25
- :host([scroll-direction='vertical']) {
26
- overflow-x: hidden;
27
- }
28
-
29
- :host([scroll-direction='horizontal']) {
30
- overflow-y: hidden;
31
- }
32
-
33
- :host([scroll-direction='none']) {
34
- overflow: hidden;
35
- }
36
-
37
- :host([theme~='overflow-indicators'])::before,
38
- :host([theme~='overflow-indicators'])::after {
39
- content: '';
40
- display: none;
41
- position: sticky;
42
- inset: 0;
43
- z-index: 9999;
44
- height: 1px;
45
- margin-bottom: -1px;
46
- background: var(--vaadin-scroller-border-color, var(--vaadin-border-color));
47
- }
48
-
49
- :host([theme~='overflow-indicators'])::after {
50
- margin-bottom: 0;
51
- margin-top: -1px;
52
- }
53
-
54
- :host([theme~='overflow-indicators'][overflow~='top'])::before,
55
- :host([theme~='overflow-indicators'][overflow~='bottom'])::after {
56
- display: block;
57
- }
10
+ :host {
11
+ display: block;
12
+ overflow: auto;
13
+ outline: none;
14
+ }
15
+
16
+ :host([focus-ring]) {
17
+ outline: var(--vaadin-focus-ring-width) solid var(--vaadin-focus-ring-color);
18
+ }
19
+
20
+ :host([hidden]) {
21
+ display: none !important;
22
+ }
23
+
24
+ :host([scroll-direction='vertical']) {
25
+ overflow-x: hidden;
26
+ }
27
+
28
+ :host([scroll-direction='horizontal']) {
29
+ overflow-y: hidden;
30
+ }
31
+
32
+ :host([scroll-direction='none']) {
33
+ overflow: hidden;
34
+ }
35
+
36
+ :host([theme~='overflow-indicators'])::before,
37
+ :host([theme~='overflow-indicators'])::after {
38
+ content: '';
39
+ display: none;
40
+ position: sticky;
41
+ inset: 0;
42
+ z-index: 9999;
43
+ height: 1px;
44
+ margin-bottom: -1px;
45
+ background: var(--vaadin-scroller-border-color, var(--vaadin-border-color));
46
+ }
47
+
48
+ :host([theme~='overflow-indicators'])::after {
49
+ margin-bottom: 0;
50
+ margin-top: -1px;
51
+ }
52
+
53
+ :host([theme~='overflow-indicators'][overflow~='top'])::before,
54
+ :host([theme~='overflow-indicators'][overflow~='bottom'])::after {
55
+ display: block;
58
56
  }
59
57
  `;
package/src/vaadin-scroller.d.ts CHANGED
@@ -10,7 +10,7 @@ import { ScrollerMixin } from './vaadin-scroller-mixin.js';
10
10
  /**
11
11
  * `<vaadin-scroller>` provides a simple way to enable scrolling when its content is overflowing.
12
12
  *
13
- * ```
13
+ * ```html
14
14
  * <vaadin-scroller>
15
15
  * <div>Content</div>
16
16
  * </vaadin-scroller>
package/src/vaadin-scroller.js CHANGED
@@ -16,7 +16,7 @@ import { ScrollerMixin } from './vaadin-scroller-mixin.js';
16
16
  /**
17
17
  * `<vaadin-scroller>` provides a simple way to enable scrolling when its content is overflowing.
18
18
  *
19
- * ```
19
+ * ```html
20
20
  * <vaadin-scroller>
21
21
  * <div>Content</div>
22
22
  * </vaadin-scroller>
@@ -35,7 +35,7 @@ import { ScrollerMixin } from './vaadin-scroller-mixin.js';
35
35
  * @mixes ElementMixin
36
36
  * @mixes ScrollerMixin
37
37
  */
38
- class Scroller extends ScrollerMixin(ElementMixin(ThemableMixin(LumoInjectionMixin(PolylitMixin(LitElement))))) {
38
+ class Scroller extends ScrollerMixin(ElementMixin(ThemableMixin(PolylitMixin(LumoInjectionMixin(LitElement))))) {
39
39
  static get is() {
40
40
  return 'vaadin-scroller';
41
41
  }
package/web-types.json CHANGED
@@ -1,14 +1,14 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/scroller",
4
- "version": "25.0.0-alpha7",
4
+ "version": "25.0.0-alpha8",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
8
8
  "elements": [
9
9
  {
10
10
  "name": "vaadin-scroller",
11
- "description": "`<vaadin-scroller>` provides a simple way to enable scrolling when its content is overflowing.\n\n```\n<vaadin-scroller>\n <div>Content</div>\n</vaadin-scroller>\n```\nThe following attributes are exposed for styling:\n\nAttribute | Description\n-------------| -----------\n`focus-ring` | Set when the element is focused using the keyboard.\n`focused` | Set when the element is focused.\n`overflow` | Set to `top`, `bottom`, `start`, `end`, all of them, or none.",
11
+ "description": "`<vaadin-scroller>` provides a simple way to enable scrolling when its content is overflowing.\n\n```html\n<vaadin-scroller>\n <div>Content</div>\n</vaadin-scroller>\n```\nThe following attributes are exposed for styling:\n\nAttribute | Description\n-------------| -----------\n`focus-ring` | Set when the element is focused using the keyboard.\n`focused` | Set when the element is focused.\n`overflow` | Set to `top`, `bottom`, `start`, `end`, all of them, or none.",
12
12
  "attributes": [
13
13
  {
14
14
  "name": "scroll-direction",
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/scroller",
4
- "version": "25.0.0-alpha7",
4
+ "version": "25.0.0-alpha8",
5
5
  "description-markup": "markdown",
6
6
  "framework": "lit",
7
7
  "framework-config": {
@@ -16,7 +16,7 @@
16
16
  "elements": [
17
17
  {
18
18
  "name": "vaadin-scroller",
19
- "description": "`<vaadin-scroller>` provides a simple way to enable scrolling when its content is overflowing.\n\n```\n<vaadin-scroller>\n <div>Content</div>\n</vaadin-scroller>\n```\nThe following attributes are exposed for styling:\n\nAttribute | Description\n-------------| -----------\n`focus-ring` | Set when the element is focused using the keyboard.\n`focused` | Set when the element is focused.\n`overflow` | Set to `top`, `bottom`, `start`, `end`, all of them, or none.",
19
+ "description": "`<vaadin-scroller>` provides a simple way to enable scrolling when its content is overflowing.\n\n```html\n<vaadin-scroller>\n <div>Content</div>\n</vaadin-scroller>\n```\nThe following attributes are exposed for styling:\n\nAttribute | Description\n-------------| -----------\n`focus-ring` | Set when the element is focused using the keyboard.\n`focused` | Set when the element is focused.\n`overflow` | Set to `top`, `bottom`, `start`, `end`, all of them, or none.",
20
20
  "extension": true,
21
21
  "attributes": [
22
22
  {