@vaadin/popover 24.7.0-alpha2 → 24.7.0-alpha3
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 +11 -11
- package/src/vaadin-popover.d.ts +2 -1
- package/src/vaadin-popover.js +5 -16
- package/web-types.json +3 -3
- package/web-types.lit.json +3 -3
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/popover",
|
|
3
|
-
"version": "24.7.0-
|
|
3
|
+
"version": "24.7.0-alpha3",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -37,23 +37,23 @@
|
|
|
37
37
|
],
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"@open-wc/dedupe-mixin": "^1.3.0",
|
|
40
|
-
"@vaadin/a11y-base": "24.7.0-
|
|
41
|
-
"@vaadin/component-base": "24.7.0-
|
|
42
|
-
"@vaadin/lit-renderer": "24.7.0-
|
|
43
|
-
"@vaadin/overlay": "24.7.0-
|
|
44
|
-
"@vaadin/vaadin-lumo-styles": "24.7.0-
|
|
45
|
-
"@vaadin/vaadin-material-styles": "24.7.0-
|
|
46
|
-
"@vaadin/vaadin-themable-mixin": "24.7.0-
|
|
40
|
+
"@vaadin/a11y-base": "24.7.0-alpha3",
|
|
41
|
+
"@vaadin/component-base": "24.7.0-alpha3",
|
|
42
|
+
"@vaadin/lit-renderer": "24.7.0-alpha3",
|
|
43
|
+
"@vaadin/overlay": "24.7.0-alpha3",
|
|
44
|
+
"@vaadin/vaadin-lumo-styles": "24.7.0-alpha3",
|
|
45
|
+
"@vaadin/vaadin-material-styles": "24.7.0-alpha3",
|
|
46
|
+
"@vaadin/vaadin-themable-mixin": "24.7.0-alpha3",
|
|
47
47
|
"lit": "^3.0.0"
|
|
48
48
|
},
|
|
49
49
|
"devDependencies": {
|
|
50
|
-
"@vaadin/chai-plugins": "24.7.0-
|
|
51
|
-
"@vaadin/testing-helpers": "^1.
|
|
50
|
+
"@vaadin/chai-plugins": "24.7.0-alpha3",
|
|
51
|
+
"@vaadin/testing-helpers": "^1.1.0",
|
|
52
52
|
"sinon": "^18.0.0"
|
|
53
53
|
},
|
|
54
54
|
"web-types": [
|
|
55
55
|
"web-types.json",
|
|
56
56
|
"web-types.lit.json"
|
|
57
57
|
],
|
|
58
|
-
"gitHead": "
|
|
58
|
+
"gitHead": "dd5cfad6c9b54e676f5b10dffba2233775378f40"
|
|
59
59
|
}
|
package/src/vaadin-popover.d.ts
CHANGED
|
@@ -221,7 +221,8 @@ declare class Popover extends PopoverPositionMixin(
|
|
|
221
221
|
* - outside click (unless `noCloseOnOutsideClick` property is true)
|
|
222
222
|
*
|
|
223
223
|
* When setting `trigger` property to `null`, `undefined` or empty array, the popover
|
|
224
|
-
* can be only opened
|
|
224
|
+
* can be only opened programmatically by changing `opened` property. Note, closing
|
|
225
|
+
* on Escape press or outside click is still allowed unless explicitly disabled.
|
|
225
226
|
*/
|
|
226
227
|
trigger: PopoverTrigger[] | null | undefined;
|
|
227
228
|
|
package/src/vaadin-popover.js
CHANGED
|
@@ -372,7 +372,8 @@ class Popover extends PopoverPositionMixin(
|
|
|
372
372
|
* - outside click (unless `noCloseOnOutsideClick` property is true)
|
|
373
373
|
*
|
|
374
374
|
* When setting `trigger` property to `null`, `undefined` or empty array, the popover
|
|
375
|
-
* can be only opened
|
|
375
|
+
* can be only opened programmatically by changing `opened` property. Note, closing
|
|
376
|
+
* on Escape press or outside click is still allowed unless explicitly disabled.
|
|
376
377
|
*/
|
|
377
378
|
trigger: {
|
|
378
379
|
type: Array,
|
|
@@ -611,7 +612,6 @@ class Popover extends PopoverPositionMixin(
|
|
|
611
612
|
__onGlobalClick(event) {
|
|
612
613
|
if (
|
|
613
614
|
this.opened &&
|
|
614
|
-
!this.__isManual &&
|
|
615
615
|
!this.modal &&
|
|
616
616
|
!event.composedPath().some((el) => el === this._overlayElement || el === this.target) &&
|
|
617
617
|
!this.noCloseOnOutsideClick &&
|
|
@@ -646,13 +646,7 @@ class Popover extends PopoverPositionMixin(
|
|
|
646
646
|
return;
|
|
647
647
|
}
|
|
648
648
|
|
|
649
|
-
if (
|
|
650
|
-
event.key === 'Escape' &&
|
|
651
|
-
!this.noCloseOnEsc &&
|
|
652
|
-
this.opened &&
|
|
653
|
-
!this.__isManual &&
|
|
654
|
-
isLastOverlay(this._overlayElement)
|
|
655
|
-
) {
|
|
649
|
+
if (event.key === 'Escape' && !this.noCloseOnEsc && this.opened && isLastOverlay(this._overlayElement)) {
|
|
656
650
|
// Prevent closing parent overlay (e.g. dialog)
|
|
657
651
|
event.stopPropagation();
|
|
658
652
|
this._openedStateController.close(true);
|
|
@@ -939,7 +933,7 @@ class Popover extends PopoverPositionMixin(
|
|
|
939
933
|
* @private
|
|
940
934
|
*/
|
|
941
935
|
__onEscapePress(e) {
|
|
942
|
-
if (this.noCloseOnEsc
|
|
936
|
+
if (this.noCloseOnEsc) {
|
|
943
937
|
e.preventDefault();
|
|
944
938
|
}
|
|
945
939
|
}
|
|
@@ -949,7 +943,7 @@ class Popover extends PopoverPositionMixin(
|
|
|
949
943
|
* @private
|
|
950
944
|
*/
|
|
951
945
|
__onOutsideClick(e) {
|
|
952
|
-
if (this.noCloseOnOutsideClick
|
|
946
|
+
if (this.noCloseOnOutsideClick) {
|
|
953
947
|
e.preventDefault();
|
|
954
948
|
}
|
|
955
949
|
}
|
|
@@ -959,11 +953,6 @@ class Popover extends PopoverPositionMixin(
|
|
|
959
953
|
return Array.isArray(this.trigger) && this.trigger.includes(trigger);
|
|
960
954
|
}
|
|
961
955
|
|
|
962
|
-
/** @private */
|
|
963
|
-
get __isManual() {
|
|
964
|
-
return this.trigger == null || (Array.isArray(this.trigger) && this.trigger.length === 0);
|
|
965
|
-
}
|
|
966
|
-
|
|
967
956
|
/** @private */
|
|
968
957
|
__updateDimension(overlay, dimension, value) {
|
|
969
958
|
const prop = `--_vaadin-popover-content-${dimension}`;
|
package/web-types.json
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://json.schemastore.org/web-types",
|
|
3
3
|
"name": "@vaadin/popover",
|
|
4
|
-
"version": "24.7.0-
|
|
4
|
+
"version": "24.7.0-alpha3",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"contributions": {
|
|
7
7
|
"html": {
|
|
8
8
|
"elements": [
|
|
9
9
|
{
|
|
10
10
|
"name": "vaadin-popover",
|
|
11
|
-
"description": "`<vaadin-popover>` is a Web Component for creating overlays\nthat are positioned next to specified DOM element (target).\n\nUnlike `<vaadin-tooltip>`, the popover supports rich content\nthat can be provided by using `renderer` function.\n\n### Styling\n\n`<vaadin-popover>` uses `<vaadin-popover-overlay>` internal\nthemable component as the actual visible overlay.\n\nSee [`<vaadin-overlay>`](https://cdn.vaadin.com/vaadin-web-components/24.7.0-
|
|
11
|
+
"description": "`<vaadin-popover>` is a Web Component for creating overlays\nthat are positioned next to specified DOM element (target).\n\nUnlike `<vaadin-tooltip>`, the popover supports rich content\nthat can be provided by using `renderer` function.\n\n### Styling\n\n`<vaadin-popover>` uses `<vaadin-popover-overlay>` internal\nthemable component as the actual visible overlay.\n\nSee [`<vaadin-overlay>`](https://cdn.vaadin.com/vaadin-web-components/24.7.0-alpha3/#/elements/vaadin-overlay) documentation\nfor `<vaadin-popover-overlay>` parts.\n\nIn addition to `<vaadin-overlay>` parts, the following parts are available for styling:\n\nPart name | Description\n-----------------|-------------------------------------------\n`arrow` | Optional arrow pointing to the target when using `theme=\"arrow\"`\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-----------------|----------------------------------------\n`position` | Reflects the `position` property value.\n\nNote: the `theme` attribute value set on `<vaadin-popover>` is\npropagated to the internal `<vaadin-popover-overlay>` component.\n\n### Custom CSS Properties\n\nThe following custom CSS properties are available on the `<vaadin-popover>` element:\n\nCustom CSS property | Description\n---------------------------------|-------------\n`--vaadin-popover-offset-top` | Used as an offset when the popover is aligned vertically below the target\n`--vaadin-popover-offset-bottom` | Used as an offset when the popover is aligned vertically above the target\n`--vaadin-popover-offset-start` | Used as an offset when the popover is aligned horizontally after the target\n`--vaadin-popover-offset-end` | Used as an offset when the popover is aligned horizontally before the target\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
|
|
12
12
|
"attributes": [
|
|
13
13
|
{
|
|
14
14
|
"name": "overlay-class",
|
|
@@ -411,7 +411,7 @@
|
|
|
411
411
|
},
|
|
412
412
|
{
|
|
413
413
|
"name": "trigger",
|
|
414
|
-
"description": "Popover trigger mode, used to configure how the overlay is opened or closed.\nCould be set to multiple by providing an array, e.g. `trigger = ['hover', 'focus']`.\n\nSupported values:\n- `click` (default) - opens and closes on target click.\n- `hover` - opens on target mouseenter, closes on target mouseleave. Moving mouse\nto the popover overlay content keeps the overlay opened.\n- `focus` - opens on target focus, closes on target blur. Moving focus to the\npopover overlay content keeps the overlay opened.\n\nIn addition to the behavior specified by `trigger`, the popover can be closed by:\n- pressing Escape key (unless `noCloseOnEsc` property is true)\n- outside click (unless `noCloseOnOutsideClick` property is true)\n\nWhen setting `trigger` property to `null`, `undefined` or empty array, the popover\ncan be only opened
|
|
414
|
+
"description": "Popover trigger mode, used to configure how the overlay is opened or closed.\nCould be set to multiple by providing an array, e.g. `trigger = ['hover', 'focus']`.\n\nSupported values:\n- `click` (default) - opens and closes on target click.\n- `hover` - opens on target mouseenter, closes on target mouseleave. Moving mouse\nto the popover overlay content keeps the overlay opened.\n- `focus` - opens on target focus, closes on target blur. Moving focus to the\npopover overlay content keeps the overlay opened.\n\nIn addition to the behavior specified by `trigger`, the popover can be closed by:\n- pressing Escape key (unless `noCloseOnEsc` property is true)\n- outside click (unless `noCloseOnOutsideClick` property is true)\n\nWhen setting `trigger` property to `null`, `undefined` or empty array, the popover\ncan be only opened programmatically by changing `opened` property. Note, closing\non Escape press or outside click is still allowed unless explicitly disabled.",
|
|
415
415
|
"value": {
|
|
416
416
|
"type": [
|
|
417
417
|
"Array",
|
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/popover",
|
|
4
|
-
"version": "24.7.0-
|
|
4
|
+
"version": "24.7.0-alpha3",
|
|
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-popover",
|
|
19
|
-
"description": "`<vaadin-popover>` is a Web Component for creating overlays\nthat are positioned next to specified DOM element (target).\n\nUnlike `<vaadin-tooltip>`, the popover supports rich content\nthat can be provided by using `renderer` function.\n\n### Styling\n\n`<vaadin-popover>` uses `<vaadin-popover-overlay>` internal\nthemable component as the actual visible overlay.\n\nSee [`<vaadin-overlay>`](https://cdn.vaadin.com/vaadin-web-components/24.7.0-
|
|
19
|
+
"description": "`<vaadin-popover>` is a Web Component for creating overlays\nthat are positioned next to specified DOM element (target).\n\nUnlike `<vaadin-tooltip>`, the popover supports rich content\nthat can be provided by using `renderer` function.\n\n### Styling\n\n`<vaadin-popover>` uses `<vaadin-popover-overlay>` internal\nthemable component as the actual visible overlay.\n\nSee [`<vaadin-overlay>`](https://cdn.vaadin.com/vaadin-web-components/24.7.0-alpha3/#/elements/vaadin-overlay) documentation\nfor `<vaadin-popover-overlay>` parts.\n\nIn addition to `<vaadin-overlay>` parts, the following parts are available for styling:\n\nPart name | Description\n-----------------|-------------------------------------------\n`arrow` | Optional arrow pointing to the target when using `theme=\"arrow\"`\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n-----------------|----------------------------------------\n`position` | Reflects the `position` property value.\n\nNote: the `theme` attribute value set on `<vaadin-popover>` is\npropagated to the internal `<vaadin-popover-overlay>` component.\n\n### Custom CSS Properties\n\nThe following custom CSS properties are available on the `<vaadin-popover>` element:\n\nCustom CSS property | Description\n---------------------------------|-------------\n`--vaadin-popover-offset-top` | Used as an offset when the popover is aligned vertically below the target\n`--vaadin-popover-offset-bottom` | Used as an offset when the popover is aligned vertically above the target\n`--vaadin-popover-offset-start` | Used as an offset when the popover is aligned horizontally after the target\n`--vaadin-popover-offset-end` | Used as an offset when the popover is aligned horizontally before the target\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
|
|
20
20
|
"extension": true,
|
|
21
21
|
"attributes": [
|
|
22
22
|
{
|
|
@@ -154,7 +154,7 @@
|
|
|
154
154
|
},
|
|
155
155
|
{
|
|
156
156
|
"name": ".trigger",
|
|
157
|
-
"description": "Popover trigger mode, used to configure how the overlay is opened or closed.\nCould be set to multiple by providing an array, e.g. `trigger = ['hover', 'focus']`.\n\nSupported values:\n- `click` (default) - opens and closes on target click.\n- `hover` - opens on target mouseenter, closes on target mouseleave. Moving mouse\nto the popover overlay content keeps the overlay opened.\n- `focus` - opens on target focus, closes on target blur. Moving focus to the\npopover overlay content keeps the overlay opened.\n\nIn addition to the behavior specified by `trigger`, the popover can be closed by:\n- pressing Escape key (unless `noCloseOnEsc` property is true)\n- outside click (unless `noCloseOnOutsideClick` property is true)\n\nWhen setting `trigger` property to `null`, `undefined` or empty array, the popover\ncan be only opened
|
|
157
|
+
"description": "Popover trigger mode, used to configure how the overlay is opened or closed.\nCould be set to multiple by providing an array, e.g. `trigger = ['hover', 'focus']`.\n\nSupported values:\n- `click` (default) - opens and closes on target click.\n- `hover` - opens on target mouseenter, closes on target mouseleave. Moving mouse\nto the popover overlay content keeps the overlay opened.\n- `focus` - opens on target focus, closes on target blur. Moving focus to the\npopover overlay content keeps the overlay opened.\n\nIn addition to the behavior specified by `trigger`, the popover can be closed by:\n- pressing Escape key (unless `noCloseOnEsc` property is true)\n- outside click (unless `noCloseOnOutsideClick` property is true)\n\nWhen setting `trigger` property to `null`, `undefined` or empty array, the popover\ncan be only opened programmatically by changing `opened` property. Note, closing\non Escape press or outside click is still allowed unless explicitly disabled.",
|
|
158
158
|
"value": {
|
|
159
159
|
"kind": "expression"
|
|
160
160
|
}
|