@vaadin/field-highlighter 25.0.0-alpha5 → 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.
- package/package.json +20 -20
- package/src/fields/vaadin-select-observer.js +0 -17
- package/src/styles/vaadin-user-tags-overlay-core-styles.js +1 -12
- package/src/vaadin-field-outline.js +2 -2
- package/src/vaadin-user-tag.js +2 -2
- package/src/vaadin-user-tags-overlay.js +2 -2
- package/theme/lumo/vaadin-field-outline-styles.js +0 -1
- package/theme/lumo/vaadin-user-tags-styles.js +6 -0
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/field-highlighter",
|
|
3
|
-
"version": "25.0.0-
|
|
3
|
+
"version": "25.0.0-alpha6",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -33,29 +33,29 @@
|
|
|
33
33
|
"field"
|
|
34
34
|
],
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@vaadin/a11y-base": "25.0.0-
|
|
37
|
-
"@vaadin/component-base": "25.0.0-
|
|
38
|
-
"@vaadin/overlay": "25.0.0-
|
|
39
|
-
"@vaadin/vaadin-lumo-styles": "25.0.0-
|
|
40
|
-
"@vaadin/vaadin-themable-mixin": "25.0.0-
|
|
36
|
+
"@vaadin/a11y-base": "25.0.0-alpha6",
|
|
37
|
+
"@vaadin/component-base": "25.0.0-alpha6",
|
|
38
|
+
"@vaadin/overlay": "25.0.0-alpha6",
|
|
39
|
+
"@vaadin/vaadin-lumo-styles": "25.0.0-alpha6",
|
|
40
|
+
"@vaadin/vaadin-themable-mixin": "25.0.0-alpha6",
|
|
41
41
|
"lit": "^3.0.0"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
|
44
|
-
"@vaadin/chai-plugins": "25.0.0-
|
|
45
|
-
"@vaadin/checkbox": "25.0.0-
|
|
46
|
-
"@vaadin/checkbox-group": "25.0.0-
|
|
47
|
-
"@vaadin/date-picker": "25.0.0-
|
|
48
|
-
"@vaadin/date-time-picker": "25.0.0-
|
|
49
|
-
"@vaadin/item": "25.0.0-
|
|
50
|
-
"@vaadin/list-box": "25.0.0-
|
|
51
|
-
"@vaadin/radio-group": "25.0.0-
|
|
52
|
-
"@vaadin/select": "25.0.0-
|
|
53
|
-
"@vaadin/test-runner-commands": "25.0.0-
|
|
44
|
+
"@vaadin/chai-plugins": "25.0.0-alpha6",
|
|
45
|
+
"@vaadin/checkbox": "25.0.0-alpha6",
|
|
46
|
+
"@vaadin/checkbox-group": "25.0.0-alpha6",
|
|
47
|
+
"@vaadin/date-picker": "25.0.0-alpha6",
|
|
48
|
+
"@vaadin/date-time-picker": "25.0.0-alpha6",
|
|
49
|
+
"@vaadin/item": "25.0.0-alpha6",
|
|
50
|
+
"@vaadin/list-box": "25.0.0-alpha6",
|
|
51
|
+
"@vaadin/radio-group": "25.0.0-alpha6",
|
|
52
|
+
"@vaadin/select": "25.0.0-alpha6",
|
|
53
|
+
"@vaadin/test-runner-commands": "25.0.0-alpha6",
|
|
54
54
|
"@vaadin/testing-helpers": "^2.0.0",
|
|
55
|
-
"@vaadin/text-area": "25.0.0-
|
|
56
|
-
"@vaadin/text-field": "25.0.0-
|
|
57
|
-
"@vaadin/time-picker": "25.0.0-
|
|
55
|
+
"@vaadin/text-area": "25.0.0-alpha6",
|
|
56
|
+
"@vaadin/text-field": "25.0.0-alpha6",
|
|
57
|
+
"@vaadin/time-picker": "25.0.0-alpha6",
|
|
58
58
|
"sinon": "^18.0.0"
|
|
59
59
|
},
|
|
60
|
-
"gitHead": "
|
|
60
|
+
"gitHead": "cd1d084198d2b326c58d44bb39fa4845b71ce551"
|
|
61
61
|
}
|
|
@@ -9,32 +9,15 @@ export class SelectObserver extends FieldObserver {
|
|
|
9
9
|
constructor(select) {
|
|
10
10
|
super(select);
|
|
11
11
|
|
|
12
|
-
this.blurWhileOpened = false;
|
|
13
12
|
this.overlay = select._overlayElement;
|
|
14
13
|
}
|
|
15
14
|
|
|
16
|
-
addListeners(select) {
|
|
17
|
-
super.addListeners(select);
|
|
18
|
-
|
|
19
|
-
select.addEventListener('opened-changed', (event) => {
|
|
20
|
-
// When in phone mode, focus is lost when closing.
|
|
21
|
-
if (select._phone && event.detail.value === false) {
|
|
22
|
-
this.hideOutline(select);
|
|
23
|
-
}
|
|
24
|
-
});
|
|
25
|
-
}
|
|
26
|
-
|
|
27
15
|
onFocusIn(event) {
|
|
28
16
|
if (this.overlay.contains(event.relatedTarget)) {
|
|
29
17
|
// Focus returns on item select, do nothing.
|
|
30
18
|
return;
|
|
31
19
|
}
|
|
32
20
|
|
|
33
|
-
if (!this.component._phone && this.overlay.hasAttribute('closing')) {
|
|
34
|
-
// Focus returns on outside click, do nothing.
|
|
35
|
-
return;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
21
|
super.onFocusIn(event);
|
|
39
22
|
}
|
|
40
23
|
|
|
@@ -7,14 +7,7 @@ import { css } from 'lit';
|
|
|
7
7
|
import { overlayStyles } from '@vaadin/overlay/src/styles/vaadin-overlay-core-styles.js';
|
|
8
8
|
|
|
9
9
|
const userTagsOverlay = css`
|
|
10
|
-
|
|
11
|
-
background: transparent;
|
|
12
|
-
box-shadow: none;
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
:scope [part='overlay'] {
|
|
16
|
-
box-shadow: none;
|
|
17
|
-
background: transparent;
|
|
10
|
+
[part='overlay'] {
|
|
18
11
|
position: relative;
|
|
19
12
|
left: -4px;
|
|
20
13
|
padding: 4px;
|
|
@@ -33,10 +26,6 @@ const userTagsOverlay = css`
|
|
|
33
26
|
right: -4px;
|
|
34
27
|
}
|
|
35
28
|
|
|
36
|
-
:scope [part='content'] {
|
|
37
|
-
padding: 0;
|
|
38
|
-
}
|
|
39
|
-
|
|
40
29
|
:host([opening]),
|
|
41
30
|
:host([closing]) {
|
|
42
31
|
animation: 0.14s user-tags-overlay-dummy-animation;
|
|
@@ -7,7 +7,7 @@ import { html, LitElement } from 'lit';
|
|
|
7
7
|
import { defineCustomElement } from '@vaadin/component-base/src/define.js';
|
|
8
8
|
import { DirMixin } from '@vaadin/component-base/src/dir-mixin.js';
|
|
9
9
|
import { PolylitMixin } from '@vaadin/component-base/src/polylit-mixin.js';
|
|
10
|
-
import {
|
|
10
|
+
import { LumoInjectionMixin } from '@vaadin/vaadin-themable-mixin/lumo-injection-mixin.js';
|
|
11
11
|
import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
|
|
12
12
|
import { fieldOutlineStyles } from './styles/vaadin-field-outline-core-styles.js';
|
|
13
13
|
|
|
@@ -19,7 +19,7 @@ import { fieldOutlineStyles } from './styles/vaadin-field-outline-core-styles.js
|
|
|
19
19
|
* @mixes ThemableMixin
|
|
20
20
|
* @private
|
|
21
21
|
*/
|
|
22
|
-
export class FieldOutline extends ThemableMixin(DirMixin(
|
|
22
|
+
export class FieldOutline extends ThemableMixin(DirMixin(LumoInjectionMixin(PolylitMixin(LitElement)))) {
|
|
23
23
|
static get is() {
|
|
24
24
|
return 'vaadin-field-outline';
|
|
25
25
|
}
|
package/src/vaadin-user-tag.js
CHANGED
|
@@ -7,7 +7,7 @@ import { html, LitElement } from 'lit';
|
|
|
7
7
|
import { defineCustomElement } from '@vaadin/component-base/src/define.js';
|
|
8
8
|
import { DirMixin } from '@vaadin/component-base/src/dir-mixin.js';
|
|
9
9
|
import { PolylitMixin } from '@vaadin/component-base/src/polylit-mixin.js';
|
|
10
|
-
import {
|
|
10
|
+
import { LumoInjectionMixin } from '@vaadin/vaadin-themable-mixin/lumo-injection-mixin.js';
|
|
11
11
|
import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
|
|
12
12
|
import { userTagStyles } from './styles/vaadin-user-tag-core-styles.js';
|
|
13
13
|
|
|
@@ -20,7 +20,7 @@ import { userTagStyles } from './styles/vaadin-user-tag-core-styles.js';
|
|
|
20
20
|
* @mixes ThemableMixin
|
|
21
21
|
* @private
|
|
22
22
|
*/
|
|
23
|
-
export class UserTag extends ThemableMixin(DirMixin(
|
|
23
|
+
export class UserTag extends ThemableMixin(DirMixin(LumoInjectionMixin(PolylitMixin(LitElement)))) {
|
|
24
24
|
static get is() {
|
|
25
25
|
return 'vaadin-user-tag';
|
|
26
26
|
}
|
|
@@ -9,7 +9,7 @@ import { DirMixin } from '@vaadin/component-base/src/dir-mixin.js';
|
|
|
9
9
|
import { PolylitMixin } from '@vaadin/component-base/src/polylit-mixin.js';
|
|
10
10
|
import { OverlayMixin } from '@vaadin/overlay/src/vaadin-overlay-mixin.js';
|
|
11
11
|
import { PositionMixin } from '@vaadin/overlay/src/vaadin-overlay-position-mixin.js';
|
|
12
|
-
import {
|
|
12
|
+
import { LumoInjectionMixin } from '@vaadin/vaadin-themable-mixin/lumo-injection-mixin.js';
|
|
13
13
|
import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
|
|
14
14
|
import { userTagsOverlayStyles } from './styles/vaadin-user-tags-overlay-core-styles.js';
|
|
15
15
|
|
|
@@ -25,7 +25,7 @@ import { userTagsOverlayStyles } from './styles/vaadin-user-tags-overlay-core-st
|
|
|
25
25
|
* @private
|
|
26
26
|
*/
|
|
27
27
|
class UserTagsOverlay extends PositionMixin(
|
|
28
|
-
OverlayMixin(DirMixin(ThemableMixin(
|
|
28
|
+
OverlayMixin(DirMixin(ThemableMixin(LumoInjectionMixin(PolylitMixin(LitElement))))),
|
|
29
29
|
) {
|
|
30
30
|
static get is() {
|
|
31
31
|
return 'vaadin-user-tags-overlay';
|
|
@@ -16,9 +16,15 @@ registerStyles(
|
|
|
16
16
|
overlay,
|
|
17
17
|
css`
|
|
18
18
|
[part='overlay'] {
|
|
19
|
+
box-shadow: none;
|
|
20
|
+
background: transparent;
|
|
19
21
|
will-change: opacity, transform;
|
|
20
22
|
}
|
|
21
23
|
|
|
24
|
+
[part='content'] {
|
|
25
|
+
padding: 0;
|
|
26
|
+
}
|
|
27
|
+
|
|
22
28
|
:host([opening]) [part='overlay'] {
|
|
23
29
|
animation: 0.1s lumo-user-tags-enter ease-out both;
|
|
24
30
|
}
|