@shoper/phoenix_design_system 1.15.11-20 → 1.15.11-21
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/build/cjs/packages/phoenix/src/components/messages/base_message.js +15 -18
- package/build/cjs/packages/phoenix/src/components/messages/base_message.js.map +1 -1
- package/build/cjs/packages/phoenix/src/components/messages/base_message_content.js +0 -1
- package/build/cjs/packages/phoenix/src/components/messages/base_message_content.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/messages/base_message.d.ts +1 -2
- package/build/esm/packages/phoenix/src/components/messages/base_message.js +15 -18
- package/build/esm/packages/phoenix/src/components/messages/base_message.js.map +1 -1
- package/build/esm/packages/phoenix/src/components/messages/base_message_content.js +0 -1
- package/build/esm/packages/phoenix/src/components/messages/base_message_content.js.map +1 -1
- package/package.json +1 -1
|
@@ -30,11 +30,10 @@ class BaseMessage extends phoenix_light_lit_element.PhoenixLightLitElement {
|
|
|
30
30
|
});
|
|
31
31
|
};
|
|
32
32
|
this._setupEventListeners = () => {
|
|
33
|
-
document.addEventListener('
|
|
34
|
-
document.addEventListener('mouseleave', this.closeFromEvent);
|
|
33
|
+
document.addEventListener('mouseover', this._toggleTooltipFromEvent);
|
|
35
34
|
if (!this.mouseonly) {
|
|
36
|
-
document.addEventListener('focusin', this.
|
|
37
|
-
document.addEventListener('focusout', this.
|
|
35
|
+
document.addEventListener('focusin', this.open);
|
|
36
|
+
document.addEventListener('focusout', this.close);
|
|
38
37
|
}
|
|
39
38
|
};
|
|
40
39
|
this._positionMessage = () => {
|
|
@@ -43,11 +42,17 @@ class BaseMessage extends phoenix_light_lit_element.PhoenixLightLitElement {
|
|
|
43
42
|
(_a = this._$messageContent) === null || _a === void 0 ? void 0 : _a.setAttribute('direction', this._positionController.position(true));
|
|
44
43
|
});
|
|
45
44
|
};
|
|
46
|
-
this.
|
|
45
|
+
this._toggleTooltipFromEvent = (ev) => {
|
|
46
|
+
var _a;
|
|
47
|
+
if (!ev.target)
|
|
48
|
+
return;
|
|
47
49
|
const $target = ev.target;
|
|
48
|
-
const
|
|
49
|
-
|
|
50
|
+
const isInsideMessageContent = $target.closest && $target.closest(`[id="${(_a = this._$baseMessageContent) === null || _a === void 0 ? void 0 : _a.id}"]`);
|
|
51
|
+
const isInsideMessageContainer = !!this.contains($target);
|
|
52
|
+
if (!isInsideMessageContent && !isInsideMessageContainer) {
|
|
53
|
+
this.close();
|
|
50
54
|
return;
|
|
55
|
+
}
|
|
51
56
|
this.open();
|
|
52
57
|
};
|
|
53
58
|
this.open = () => {
|
|
@@ -59,13 +64,6 @@ class BaseMessage extends phoenix_light_lit_element.PhoenixLightLitElement {
|
|
|
59
64
|
this.opened = true;
|
|
60
65
|
}, base_message_constants.MESSAGE_SHOW_DELAY_IN_MS);
|
|
61
66
|
};
|
|
62
|
-
this.closeFromEvent = (ev) => {
|
|
63
|
-
const $target = ev.target;
|
|
64
|
-
const $messageChildContainer = $target.closest(base_message_constants.LIST_OF_MESSAGE_CHILDREN.join(', '));
|
|
65
|
-
if ($messageChildContainer)
|
|
66
|
-
return;
|
|
67
|
-
this.close();
|
|
68
|
-
};
|
|
69
67
|
this.close = () => {
|
|
70
68
|
this._shouldDelayClosing = Date.now() - this._tooltipOpenTime > base_message_constants.MESSAGE_TIME_TO_DELAY_CLOSING_IN_MS;
|
|
71
69
|
clearTimeout(this._openTimeout);
|
|
@@ -120,11 +118,10 @@ class BaseMessage extends phoenix_light_lit_element.PhoenixLightLitElement {
|
|
|
120
118
|
}
|
|
121
119
|
disconnectedCallback() {
|
|
122
120
|
super.disconnectedCallback();
|
|
123
|
-
document.removeEventListener('
|
|
124
|
-
document.removeEventListener('mouseleave', this.closeFromEvent);
|
|
121
|
+
document.removeEventListener('mouseover', this._toggleTooltipFromEvent);
|
|
125
122
|
if (!this.mouseonly) {
|
|
126
|
-
document.removeEventListener('focusin', this.
|
|
127
|
-
document.removeEventListener('focusout', this.
|
|
123
|
+
document.removeEventListener('focusin', this.open);
|
|
124
|
+
document.removeEventListener('focusout', this.close);
|
|
128
125
|
}
|
|
129
126
|
}
|
|
130
127
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA,iBAAiB,qDAAyD;AAC1E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA,wBAAwB,4CAAgD;AACxE;AACA;AACA,iBAAiB,qDAAyD;AAC1E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -23,9 +23,8 @@ export declare class BaseMessage extends PhoenixLightLitElement implements IBase
|
|
|
23
23
|
private static _appendMessagePortal;
|
|
24
24
|
private _setupEventListeners;
|
|
25
25
|
protected _positionMessage: () => void;
|
|
26
|
-
|
|
26
|
+
private _toggleTooltipFromEvent;
|
|
27
27
|
open: () => void;
|
|
28
|
-
closeFromEvent: (ev: MouseEvent) => void;
|
|
29
28
|
close: () => void;
|
|
30
29
|
disconnectedCallback(): void;
|
|
31
30
|
}
|
|
@@ -26,11 +26,10 @@ class BaseMessage extends PhoenixLightLitElement {
|
|
|
26
26
|
});
|
|
27
27
|
};
|
|
28
28
|
this._setupEventListeners = () => {
|
|
29
|
-
document.addEventListener('
|
|
30
|
-
document.addEventListener('mouseleave', this.closeFromEvent);
|
|
29
|
+
document.addEventListener('mouseover', this._toggleTooltipFromEvent);
|
|
31
30
|
if (!this.mouseonly) {
|
|
32
|
-
document.addEventListener('focusin', this.
|
|
33
|
-
document.addEventListener('focusout', this.
|
|
31
|
+
document.addEventListener('focusin', this.open);
|
|
32
|
+
document.addEventListener('focusout', this.close);
|
|
34
33
|
}
|
|
35
34
|
};
|
|
36
35
|
this._positionMessage = () => {
|
|
@@ -39,11 +38,17 @@ class BaseMessage extends PhoenixLightLitElement {
|
|
|
39
38
|
(_a = this._$messageContent) === null || _a === void 0 ? void 0 : _a.setAttribute('direction', this._positionController.position(true));
|
|
40
39
|
});
|
|
41
40
|
};
|
|
42
|
-
this.
|
|
41
|
+
this._toggleTooltipFromEvent = (ev) => {
|
|
42
|
+
var _a;
|
|
43
|
+
if (!ev.target)
|
|
44
|
+
return;
|
|
43
45
|
const $target = ev.target;
|
|
44
|
-
const
|
|
45
|
-
|
|
46
|
+
const isInsideMessageContent = $target.closest && $target.closest(`[id="${(_a = this._$baseMessageContent) === null || _a === void 0 ? void 0 : _a.id}"]`);
|
|
47
|
+
const isInsideMessageContainer = !!this.contains($target);
|
|
48
|
+
if (!isInsideMessageContent && !isInsideMessageContainer) {
|
|
49
|
+
this.close();
|
|
46
50
|
return;
|
|
51
|
+
}
|
|
47
52
|
this.open();
|
|
48
53
|
};
|
|
49
54
|
this.open = () => {
|
|
@@ -55,13 +60,6 @@ class BaseMessage extends PhoenixLightLitElement {
|
|
|
55
60
|
this.opened = true;
|
|
56
61
|
}, MESSAGE_SHOW_DELAY_IN_MS);
|
|
57
62
|
};
|
|
58
|
-
this.closeFromEvent = (ev) => {
|
|
59
|
-
const $target = ev.target;
|
|
60
|
-
const $messageChildContainer = $target.closest(LIST_OF_MESSAGE_CHILDREN.join(', '));
|
|
61
|
-
if ($messageChildContainer)
|
|
62
|
-
return;
|
|
63
|
-
this.close();
|
|
64
|
-
};
|
|
65
63
|
this.close = () => {
|
|
66
64
|
this._shouldDelayClosing = Date.now() - this._tooltipOpenTime > MESSAGE_TIME_TO_DELAY_CLOSING_IN_MS;
|
|
67
65
|
clearTimeout(this._openTimeout);
|
|
@@ -116,11 +114,10 @@ class BaseMessage extends PhoenixLightLitElement {
|
|
|
116
114
|
}
|
|
117
115
|
disconnectedCallback() {
|
|
118
116
|
super.disconnectedCallback();
|
|
119
|
-
document.removeEventListener('
|
|
120
|
-
document.removeEventListener('mouseleave', this.closeFromEvent);
|
|
117
|
+
document.removeEventListener('mouseover', this._toggleTooltipFromEvent);
|
|
121
118
|
if (!this.mouseonly) {
|
|
122
|
-
document.removeEventListener('focusin', this.
|
|
123
|
-
document.removeEventListener('focusout', this.
|
|
119
|
+
document.removeEventListener('focusin', this.open);
|
|
120
|
+
document.removeEventListener('focusout', this.close);
|
|
124
121
|
}
|
|
125
122
|
}
|
|
126
123
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA,eAAe,qDAAyD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA,uCAAuC,4CAAgD;AACvF;AACA;AACA,eAAe,qDAAyD;AACxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
package/package.json
CHANGED