pushfeedback 0.1.63 → 0.1.64
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/dist/cjs/feedback-button_2.cjs.entry.js +101 -94
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/pushfeedback.cjs.js +1 -1
- package/dist/collection/components/feedback-button/feedback-button.js +212 -212
- package/dist/collection/components/feedback-modal/feedback-modal.js +212 -206
- package/dist/components/feedback-button.js +74 -74
- package/dist/components/feedback-modal2.js +73 -66
- package/dist/esm/feedback-button_2.entry.js +101 -94
- package/dist/esm/loader.js +1 -1
- package/dist/esm/pushfeedback.js +1 -1
- package/dist/pushfeedback/{p-90a99a78.entry.js → p-1c7756d1.entry.js} +2 -2
- package/dist/pushfeedback/pushfeedback.esm.js +1 -1
- package/dist/types/components/feedback-button/feedback-button.d.ts +24 -24
- package/dist/types/components/feedback-modal/feedback-modal.d.ts +22 -22
- package/package.json +11 -3
|
@@ -10,39 +10,39 @@ const FeedbackButton$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
|
|
|
10
10
|
this.__attachShadow();
|
|
11
11
|
this.feedbackSent = createEvent(this, "feedbackSent", 7);
|
|
12
12
|
this.feedbackError = createEvent(this, "feedbackError", 7);
|
|
13
|
-
this.
|
|
13
|
+
this.buttonPosition = 'default';
|
|
14
|
+
this.buttonStyle = 'default';
|
|
15
|
+
this.hideIcon = false;
|
|
16
|
+
this.hideMobile = false;
|
|
17
|
+
this.sessionId = '';
|
|
18
|
+
this.submit = false;
|
|
14
19
|
this.customFont = false;
|
|
15
|
-
this.errorMessage = "Please try again later.";
|
|
16
|
-
this.errorMessage403 = "The request URL does not match the one defined in PushFeedback for this project.";
|
|
17
|
-
this.errorMessage404 = "We could not find the provided project id in PushFeedback.";
|
|
18
|
-
this.modalTitle = 'Share your feedback';
|
|
19
|
-
this.modalTitleSuccess = 'Thanks for your feedback!';
|
|
20
|
-
this.modalTitleError = "Oops!";
|
|
21
|
-
this.modalPosition = 'center';
|
|
22
|
-
this.sendButtonText = 'Send';
|
|
23
|
-
this.successMessage = "";
|
|
24
|
-
this.project = '';
|
|
25
|
-
this.screenshotButtonText = 'Add a screenshot';
|
|
26
|
-
this.screenshotTopbarText = 'Select an element on this page';
|
|
27
|
-
this.hideEmail = false;
|
|
28
20
|
this.emailAddress = '';
|
|
29
|
-
this.
|
|
30
|
-
this.
|
|
21
|
+
this.fetchData = true;
|
|
22
|
+
this.hideEmail = false;
|
|
23
|
+
this.hidePrivacyPolicy = true;
|
|
31
24
|
this.hideRating = false;
|
|
25
|
+
this.hideScreenshotButton = false;
|
|
26
|
+
this.modalPosition = 'center';
|
|
27
|
+
this.project = '';
|
|
32
28
|
this.rating = undefined;
|
|
33
29
|
this.ratingMode = 'thumbs';
|
|
34
|
-
this.
|
|
35
|
-
this.
|
|
30
|
+
this.emailPlaceholder = 'Email address (optional)';
|
|
31
|
+
this.errorMessage = 'Please try again later.';
|
|
32
|
+
this.errorMessage403 = 'The request URL does not match the one defined in PushFeedback for this project.';
|
|
33
|
+
this.errorMessage404 = 'We could not find the provided project id in PushFeedback.';
|
|
36
34
|
this.footerText = '';
|
|
37
|
-
this.
|
|
38
|
-
this.
|
|
39
|
-
this.
|
|
40
|
-
this.
|
|
41
|
-
this.hidePrivacyPolicy = true;
|
|
42
|
-
this.hideMobile = false;
|
|
35
|
+
this.messagePlaceholder = 'Comments';
|
|
36
|
+
this.modalTitle = 'Share your feedback';
|
|
37
|
+
this.modalTitleError = 'Oops!';
|
|
38
|
+
this.modalTitleSuccess = 'Thanks for your feedback!';
|
|
43
39
|
this.privacyPolicyText = "I have read and expressly consent to the terms of the <a href='https://pushfeedback.com/privacy'>Privacy Policy</a>.";
|
|
44
|
-
this.
|
|
45
|
-
this.
|
|
40
|
+
this.ratingPlaceholder = 'Was this page helpful?';
|
|
41
|
+
this.ratingStarsPlaceholder = 'How would you rate this page?';
|
|
42
|
+
this.screenshotButtonText = 'Add a screenshot';
|
|
43
|
+
this.screenshotTopbarText = 'Select an element on this page';
|
|
44
|
+
this.sendButtonText = 'Send';
|
|
45
|
+
this.successMessage = '';
|
|
46
46
|
}
|
|
47
47
|
componentWillLoad() {
|
|
48
48
|
if (!this.sessionId) {
|
|
@@ -61,7 +61,7 @@ const FeedbackButton$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
|
|
|
61
61
|
if (this.isSafariBrowser()) {
|
|
62
62
|
adjustement = 5;
|
|
63
63
|
}
|
|
64
|
-
buttonContent.style.right = `${(buttonContent.offsetWidth + adjustement) / 2 * -1}px`;
|
|
64
|
+
buttonContent.style.right = `${((buttonContent.offsetWidth + adjustement) / 2) * -1}px`;
|
|
65
65
|
}
|
|
66
66
|
if (!this.customFont) {
|
|
67
67
|
this.loadInterFont();
|
|
@@ -71,34 +71,34 @@ const FeedbackButton$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
|
|
|
71
71
|
this.feedbackModal = document.createElement('feedback-modal');
|
|
72
72
|
const props = [
|
|
73
73
|
'customFont',
|
|
74
|
+
'emailAddress',
|
|
75
|
+
'fetchData',
|
|
76
|
+
'hideEmail',
|
|
77
|
+
'hidePrivacyPolicy',
|
|
78
|
+
'hideRating',
|
|
79
|
+
'hideScreenshotButton',
|
|
80
|
+
'modalPosition',
|
|
81
|
+
'project',
|
|
82
|
+
'rating',
|
|
83
|
+
'ratingMode',
|
|
84
|
+
'emailPlaceholder',
|
|
74
85
|
'errorMessage',
|
|
75
86
|
'errorMessage403',
|
|
76
87
|
'errorMessage404',
|
|
88
|
+
'footerText',
|
|
89
|
+
'messagePlaceholder',
|
|
77
90
|
'modalTitle',
|
|
78
|
-
'modalTitleSuccess',
|
|
79
91
|
'modalTitleError',
|
|
80
|
-
'
|
|
81
|
-
'
|
|
82
|
-
'successMessage',
|
|
83
|
-
'project',
|
|
84
|
-
'screenshotButtonText',
|
|
85
|
-
'screenshotTopbarText',
|
|
86
|
-
'hideEmail',
|
|
87
|
-
'emailAddress',
|
|
88
|
-
'emailPlaceholder',
|
|
89
|
-
'messagePlaceholder',
|
|
90
|
-
'hideRating',
|
|
91
|
-
'rating',
|
|
92
|
-
'ratingMode',
|
|
92
|
+
'modalTitleSuccess',
|
|
93
|
+
'privacyPolicyText',
|
|
93
94
|
'ratingPlaceholder',
|
|
94
95
|
'ratingStarsPlaceholder',
|
|
95
|
-
'
|
|
96
|
-
'
|
|
97
|
-
'
|
|
98
|
-
'
|
|
99
|
-
'fetchData',
|
|
96
|
+
'screenshotButtonText',
|
|
97
|
+
'screenshotTopbarText',
|
|
98
|
+
'sendButtonText',
|
|
99
|
+
'successMessage',
|
|
100
100
|
];
|
|
101
|
-
props.forEach(prop => {
|
|
101
|
+
props.forEach((prop) => {
|
|
102
102
|
this.feedbackModal[prop] = this[prop];
|
|
103
103
|
});
|
|
104
104
|
document.body.appendChild(this.feedbackModal);
|
|
@@ -134,15 +134,15 @@ const FeedbackButton$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
|
|
|
134
134
|
project: this.project,
|
|
135
135
|
rating: this.rating || -1,
|
|
136
136
|
ratingMode: this.ratingMode,
|
|
137
|
-
message:
|
|
137
|
+
message: '',
|
|
138
138
|
session: localStorage.getItem('pushfeedback_sessionid') || '',
|
|
139
139
|
};
|
|
140
140
|
const res = await fetch('https://app.pushfeedback.com/api/feedback/', {
|
|
141
141
|
method: 'POST',
|
|
142
142
|
body: JSON.stringify(body),
|
|
143
143
|
headers: {
|
|
144
|
-
'Content-Type': 'application/json'
|
|
145
|
-
}
|
|
144
|
+
'Content-Type': 'application/json',
|
|
145
|
+
},
|
|
146
146
|
});
|
|
147
147
|
if (res.status === 201) {
|
|
148
148
|
const feedback_with_id = Object.assign(Object.assign({}, body), { id: await res.json() });
|
|
@@ -171,39 +171,39 @@ const FeedbackButton$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElem
|
|
|
171
171
|
get el() { return this; }
|
|
172
172
|
static get style() { return feedbackButtonCss; }
|
|
173
173
|
}, [1, "feedback-button", {
|
|
174
|
+
"buttonPosition": [1, "button-position"],
|
|
175
|
+
"buttonStyle": [1, "button-style"],
|
|
176
|
+
"hideIcon": [4, "hide-icon"],
|
|
177
|
+
"hideMobile": [4, "hide-mobile"],
|
|
174
178
|
"sessionId": [1537, "session-id"],
|
|
179
|
+
"submit": [4],
|
|
175
180
|
"customFont": [4, "custom-font"],
|
|
181
|
+
"emailAddress": [1, "email-address"],
|
|
182
|
+
"fetchData": [4, "fetch-data"],
|
|
183
|
+
"hideEmail": [4, "hide-email"],
|
|
184
|
+
"hidePrivacyPolicy": [4, "hide-privacy-policy"],
|
|
185
|
+
"hideRating": [4, "hide-rating"],
|
|
186
|
+
"hideScreenshotButton": [4, "hide-screenshot-button"],
|
|
187
|
+
"modalPosition": [1, "modal-position"],
|
|
188
|
+
"project": [1],
|
|
189
|
+
"rating": [2],
|
|
190
|
+
"ratingMode": [1, "rating-mode"],
|
|
191
|
+
"emailPlaceholder": [1, "email-placeholder"],
|
|
176
192
|
"errorMessage": [1, "error-message"],
|
|
177
193
|
"errorMessage403": [1, "error-message-4-0-3"],
|
|
178
194
|
"errorMessage404": [1, "error-message-4-0-4"],
|
|
195
|
+
"footerText": [1, "footer-text"],
|
|
196
|
+
"messagePlaceholder": [1, "message-placeholder"],
|
|
179
197
|
"modalTitle": [1, "modal-title"],
|
|
180
|
-
"modalTitleSuccess": [1, "modal-title-success"],
|
|
181
198
|
"modalTitleError": [1, "modal-title-error"],
|
|
182
|
-
"
|
|
183
|
-
"
|
|
184
|
-
"successMessage": [1, "success-message"],
|
|
185
|
-
"project": [1],
|
|
186
|
-
"screenshotButtonText": [1, "screenshot-button-text"],
|
|
187
|
-
"screenshotTopbarText": [1, "screenshot-topbar-text"],
|
|
188
|
-
"hideEmail": [4, "hide-email"],
|
|
189
|
-
"emailAddress": [1, "email-address"],
|
|
190
|
-
"emailPlaceholder": [1, "email-placeholder"],
|
|
191
|
-
"messagePlaceholder": [1, "message-placeholder"],
|
|
192
|
-
"hideRating": [4, "hide-rating"],
|
|
193
|
-
"rating": [2],
|
|
194
|
-
"ratingMode": [1, "rating-mode"],
|
|
199
|
+
"modalTitleSuccess": [1, "modal-title-success"],
|
|
200
|
+
"privacyPolicyText": [1, "privacy-policy-text"],
|
|
195
201
|
"ratingPlaceholder": [1, "rating-placeholder"],
|
|
196
202
|
"ratingStarsPlaceholder": [1, "rating-stars-placeholder"],
|
|
197
|
-
"
|
|
198
|
-
"
|
|
199
|
-
"
|
|
200
|
-
"
|
|
201
|
-
"hideScreenshotButton": [4, "hide-screenshot-button"],
|
|
202
|
-
"hidePrivacyPolicy": [4, "hide-privacy-policy"],
|
|
203
|
-
"hideMobile": [4, "hide-mobile"],
|
|
204
|
-
"privacyPolicyText": [1, "privacy-policy-text"],
|
|
205
|
-
"fetchData": [4, "fetch-data"],
|
|
206
|
-
"submit": [4]
|
|
203
|
+
"screenshotButtonText": [1, "screenshot-button-text"],
|
|
204
|
+
"screenshotTopbarText": [1, "screenshot-topbar-text"],
|
|
205
|
+
"sendButtonText": [1, "send-button-text"],
|
|
206
|
+
"successMessage": [1, "success-message"]
|
|
207
207
|
}]);
|
|
208
208
|
function defineCustomElement$1() {
|
|
209
209
|
if (typeof customElements === "undefined") {
|
|
@@ -8804,7 +8804,7 @@ const FeedbackModal = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
|
|
|
8804
8804
|
clearTimeout(this.scrollTimeout);
|
|
8805
8805
|
this.scrollTimeout = setTimeout(() => {
|
|
8806
8806
|
document.documentElement.classList.remove('feedback-modal-screenshot-closing');
|
|
8807
|
-
document.documentElement.style.top =
|
|
8807
|
+
document.documentElement.style.top = '';
|
|
8808
8808
|
window.removeEventListener('scroll', this.onScrollDebounced);
|
|
8809
8809
|
}, 200);
|
|
8810
8810
|
};
|
|
@@ -8831,8 +8831,8 @@ const FeedbackModal = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
|
|
|
8831
8831
|
method: 'POST',
|
|
8832
8832
|
body: JSON.stringify(body),
|
|
8833
8833
|
headers: {
|
|
8834
|
-
'Content-Type': 'application/json'
|
|
8835
|
-
}
|
|
8834
|
+
'Content-Type': 'application/json',
|
|
8835
|
+
},
|
|
8836
8836
|
});
|
|
8837
8837
|
if (res.status === 201) {
|
|
8838
8838
|
const feedback_with_id = Object.assign(Object.assign({}, body), { id: await res.json() });
|
|
@@ -8916,7 +8916,7 @@ const FeedbackModal = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
|
|
|
8916
8916
|
const rect = elementUnder.getBoundingClientRect();
|
|
8917
8917
|
this.screenshotModal.style.display = '';
|
|
8918
8918
|
// Get the bounding box of the element selected
|
|
8919
|
-
this.elementSelected.style.position =
|
|
8919
|
+
this.elementSelected.style.position = 'absolute';
|
|
8920
8920
|
this.elementSelected.style.left = `${rect.left}px`;
|
|
8921
8921
|
this.elementSelected.style.top = `${rect.top}px`;
|
|
8922
8922
|
this.elementSelected.style.width = `${rect.width}px`;
|
|
@@ -8924,33 +8924,33 @@ const FeedbackModal = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
|
|
|
8924
8924
|
this.elementSelected.classList.add('feedback-modal-element-hover');
|
|
8925
8925
|
// Set the background color of nonselected areas
|
|
8926
8926
|
// Top
|
|
8927
|
-
this.topSide.style.position =
|
|
8927
|
+
this.topSide.style.position = 'absolute';
|
|
8928
8928
|
this.topSide.style.left = `${rect.left}px`;
|
|
8929
8929
|
this.topSide.style.top = '0px';
|
|
8930
8930
|
this.topSide.style.width = `${rect.width + borderOffset}px`;
|
|
8931
8931
|
this.topSide.style.height = `${rect.top}px`;
|
|
8932
|
-
this.topSide.style.backgroundColor =
|
|
8932
|
+
this.topSide.style.backgroundColor = 'rgba(0, 0, 0, 0.4)';
|
|
8933
8933
|
// Left
|
|
8934
|
-
this.leftSide.style.position =
|
|
8934
|
+
this.leftSide.style.position = 'absolute';
|
|
8935
8935
|
this.leftSide.style.left = '0px';
|
|
8936
8936
|
this.leftSide.style.top = '0px';
|
|
8937
8937
|
this.leftSide.style.width = `${rect.left}px`;
|
|
8938
8938
|
this.leftSide.style.height = '100vh';
|
|
8939
|
-
this.leftSide.style.backgroundColor =
|
|
8939
|
+
this.leftSide.style.backgroundColor = 'rgba(0, 0, 0, 0.4)';
|
|
8940
8940
|
// Bottom
|
|
8941
|
-
this.bottomSide.style.position =
|
|
8941
|
+
this.bottomSide.style.position = 'absolute';
|
|
8942
8942
|
this.bottomSide.style.left = `${rect.left}px`;
|
|
8943
8943
|
this.bottomSide.style.top = `${rect.bottom + borderOffset}px`;
|
|
8944
8944
|
this.bottomSide.style.width = `${rect.width + borderOffset}px`;
|
|
8945
8945
|
this.bottomSide.style.height = '100vh';
|
|
8946
|
-
this.bottomSide.style.backgroundColor =
|
|
8946
|
+
this.bottomSide.style.backgroundColor = 'rgba(0, 0, 0, 0.4)';
|
|
8947
8947
|
// Right
|
|
8948
|
-
this.rightSide.style.position =
|
|
8948
|
+
this.rightSide.style.position = 'absolute';
|
|
8949
8949
|
this.rightSide.style.left = `${rect.right + borderOffset}px`;
|
|
8950
8950
|
this.rightSide.style.top = '0px';
|
|
8951
8951
|
this.rightSide.style.width = '100%';
|
|
8952
8952
|
this.rightSide.style.height = '100vh';
|
|
8953
|
-
this.rightSide.style.backgroundColor =
|
|
8953
|
+
this.rightSide.style.backgroundColor = 'rgba(0, 0, 0, 0.4)';
|
|
8954
8954
|
// Restore the visibility of the screenshot-modal
|
|
8955
8955
|
this.screenshotModal.style.backgroundColor = 'transparent';
|
|
8956
8956
|
};
|
|
@@ -9002,36 +9002,36 @@ const FeedbackModal = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
|
|
|
9002
9002
|
this.overlayVisible = false;
|
|
9003
9003
|
this.isAnimating = false;
|
|
9004
9004
|
this.customFont = false;
|
|
9005
|
-
this.errorMessage = "Please try again later.";
|
|
9006
|
-
this.errorMessage403 = "The request URL does not match the one defined in PushFeedback for this project.";
|
|
9007
|
-
this.errorMessage404 = "We could not find the provided project ID in PushFeedback.";
|
|
9008
|
-
this.modalTitle = 'Share your feedback';
|
|
9009
|
-
this.modalTitleSuccess = 'Thanks for your feedback!';
|
|
9010
|
-
this.modalTitleError = "Oops!";
|
|
9011
|
-
this.modalPosition = 'center';
|
|
9012
|
-
this.sendButtonText = 'Send';
|
|
9013
|
-
this.successMessage = "";
|
|
9014
|
-
this.project = '';
|
|
9015
|
-
this.screenshotButtonText = 'Add a screenshot';
|
|
9016
|
-
this.screenshotTopbarText = 'Select an element on this page';
|
|
9017
|
-
this.hideEmail = false;
|
|
9018
9005
|
this.emailAddress = '';
|
|
9019
|
-
this.
|
|
9020
|
-
this.messagePlaceholder = 'Comments';
|
|
9021
|
-
this.hideRating = false;
|
|
9022
|
-
this.rating = undefined;
|
|
9006
|
+
this.hideEmail = false;
|
|
9023
9007
|
this.ratingMode = 'thumbs';
|
|
9024
|
-
this.ratingPlaceholder = 'Was this page helpful?';
|
|
9025
|
-
this.ratingStarsPlaceholder = 'How would you rate this page?';
|
|
9026
|
-
this.footerText = '';
|
|
9027
|
-
this.showModal = false;
|
|
9028
|
-
this.showScreenshotMode = false;
|
|
9029
|
-
this.showScreenshotTopBar = false;
|
|
9030
9008
|
this.hasSelectedElement = false;
|
|
9031
|
-
this.hideScreenshotButton = false;
|
|
9032
9009
|
this.hidePrivacyPolicy = true;
|
|
9033
|
-
this.
|
|
9010
|
+
this.hideRating = false;
|
|
9011
|
+
this.hideScreenshotButton = false;
|
|
9012
|
+
this.project = '';
|
|
9013
|
+
this.showScreenshotMode = false;
|
|
9014
|
+
this.showScreenshotTopBar = false;
|
|
9015
|
+
this.showModal = false;
|
|
9016
|
+
this.rating = undefined;
|
|
9034
9017
|
this.fetchData = true;
|
|
9018
|
+
this.emailPlaceholder = 'Email address (optional)';
|
|
9019
|
+
this.errorMessage = 'Please try again later.';
|
|
9020
|
+
this.errorMessage403 = 'The request URL does not match the one defined in PushFeedback for this project.';
|
|
9021
|
+
this.errorMessage404 = 'We could not find the provided project ID in PushFeedback.';
|
|
9022
|
+
this.messagePlaceholder = 'Comments';
|
|
9023
|
+
this.footerText = '';
|
|
9024
|
+
this.modalPosition = 'center';
|
|
9025
|
+
this.modalTitle = 'Share your feedback';
|
|
9026
|
+
this.modalTitleError = 'Oops!';
|
|
9027
|
+
this.modalTitleSuccess = 'Thanks for your feedback!';
|
|
9028
|
+
this.privacyPolicyText = "I have read and expressly consent to the terms of the <a href='https://pushfeedback.com/privacy'>Privacy Policy</a>.";
|
|
9029
|
+
this.ratingPlaceholder = 'Was this page helpful?';
|
|
9030
|
+
this.ratingStarsPlaceholder = 'How would you rate this page?';
|
|
9031
|
+
this.sendButtonText = 'Send';
|
|
9032
|
+
this.screenshotButtonText = 'Add a screenshot';
|
|
9033
|
+
this.screenshotTopbarText = 'Select an element on this page';
|
|
9034
|
+
this.successMessage = '';
|
|
9035
9035
|
}
|
|
9036
9036
|
componentWillLoad() {
|
|
9037
9037
|
if (this.fetchData)
|
|
@@ -9040,7 +9040,7 @@ const FeedbackModal = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
|
|
|
9040
9040
|
if (this.rating) {
|
|
9041
9041
|
this.selectedRating = this.rating;
|
|
9042
9042
|
}
|
|
9043
|
-
if (this.ratingMode ==
|
|
9043
|
+
if (this.ratingMode == 'thumbs' && this.rating == 0) {
|
|
9044
9044
|
this.selectedRating = 5;
|
|
9045
9045
|
}
|
|
9046
9046
|
}
|
|
@@ -9079,11 +9079,12 @@ const FeedbackModal = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
|
|
|
9079
9079
|
y: window.scrollY,
|
|
9080
9080
|
width: window.innerWidth,
|
|
9081
9081
|
height: window.innerHeight,
|
|
9082
|
-
})
|
|
9082
|
+
})
|
|
9083
|
+
.then((canvas) => {
|
|
9083
9084
|
const dataUrl = canvas.toDataURL();
|
|
9084
9085
|
resolve(dataUrl);
|
|
9085
9086
|
})
|
|
9086
|
-
.catch(error => {
|
|
9087
|
+
.catch((error) => {
|
|
9087
9088
|
console.error(error);
|
|
9088
9089
|
reject(error);
|
|
9089
9090
|
});
|
|
@@ -9100,16 +9101,22 @@ const FeedbackModal = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
|
|
|
9100
9101
|
this.selectedRating = newRating;
|
|
9101
9102
|
}
|
|
9102
9103
|
render() {
|
|
9103
|
-
return (h("div", { class: `feedback-modal-wrapper ${this.customFont ? 'feedback-modal-wrapper--custom-font' : ''}` }, this.showScreenshotMode && (h("div", { class: "feedback-modal-screenshot", ref: el => (this.screenshotModal = el), onMouseMove: this.handleMouseOverScreenShot }, h("div", { class: "feedback-modal-screenshot-element-selected", ref: el => (this.elementSelected = el), onClick: this.handleMouseClickedSelectedElement }), h("div", { class: "top-side", ref: el => (this.topSide = el) }), h("div", { class: "left-side", ref: el => (this.leftSide = el) }), h("div", { class: "bottom-side", ref: el => (this.bottomSide = el) }), h("div", { class: "right-side", ref: el => (this.rightSide = el) }), this.showScreenshotTopBar && (h("div", { class: "feedback-modal-screenshot-header", onClick: this.closeScreenShot }, h("span", null, this.screenshotTopbarText), h("span", { class: "feedback-modal-screenshot-close" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "#191919", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", class: "feather feather-x" }, h("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), h("line", { x1: "6", y1: "6", x2: "18", y2: "18" }))))))), this.showModal && (h("div", { class: `feedback-overlay ${this.isAnimating ? 'feedback-overlay--visible' : ''}` })), this.showModal && (h("div", { class: `feedback-modal-content feedback-modal-content--${this.modalPosition} ${this.isAnimating ? 'feedback-modal-content--open' : ''}`, ref: el => (this.modalContent = el) }, h("div", { class: "feedback-modal-header" }, !this.formSuccess && !this.formError ? (h("span", null, this.modalTitle)) : this.formSuccess ? (h("span", null, this.modalTitleSuccess)) : h("span", null, this.modalTitleError), h("button", { class: "feedback-modal-close", onClick: this.close }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "#191919", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", class: "feather feather-x" }, h("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), h("line", { x1: "6", y1: "6", x2: "18", y2: "18" })))), h("div", { class: "feedback-modal-body" }, !this.formSuccess && !this.formError ? (h("form", { onSubmit: this.handleSubmit }, !this.hideRating && (h("div", { class: "feedback-modal-rating" }, this.ratingMode === 'thumbs' ? (h("div", { class: "feedback-modal-rating-content" }, h("span", { class: "feedback-modal-input-heading" }, this.ratingPlaceholder), h("div", { class: "feedback-modal-rating-buttons feedback-modal-rating-buttons--thumbs" }, h("button", { title: "Yes", class: `feedback-modal-rating-button ${this.selectedRating === 1
|
|
9104
|
+
return (h("div", { class: `feedback-modal-wrapper ${this.customFont ? 'feedback-modal-wrapper--custom-font' : ''}` }, this.showScreenshotMode && (h("div", { class: "feedback-modal-screenshot", ref: (el) => (this.screenshotModal = el), onMouseMove: this.handleMouseOverScreenShot }, h("div", { class: "feedback-modal-screenshot-element-selected", ref: (el) => (this.elementSelected = el), onClick: this.handleMouseClickedSelectedElement }), h("div", { class: "top-side", ref: (el) => (this.topSide = el) }), h("div", { class: "left-side", ref: (el) => (this.leftSide = el) }), h("div", { class: "bottom-side", ref: (el) => (this.bottomSide = el) }), h("div", { class: "right-side", ref: (el) => (this.rightSide = el) }), this.showScreenshotTopBar && (h("div", { class: "feedback-modal-screenshot-header", onClick: this.closeScreenShot }, h("span", null, this.screenshotTopbarText), h("span", { class: "feedback-modal-screenshot-close" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "#191919", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", class: "feather feather-x" }, h("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), h("line", { x1: "6", y1: "6", x2: "18", y2: "18" }))))))), this.showModal && (h("div", { class: `feedback-overlay ${this.isAnimating ? 'feedback-overlay--visible' : ''}` })), this.showModal && (h("div", { class: `feedback-modal-content feedback-modal-content--${this.modalPosition} ${this.isAnimating ? 'feedback-modal-content--open' : ''}`, ref: (el) => (this.modalContent = el) }, h("div", { class: "feedback-modal-header" }, !this.formSuccess && !this.formError ? (h("span", null, this.modalTitle)) : this.formSuccess ? (h("span", null, this.modalTitleSuccess)) : (h("span", null, this.modalTitleError)), h("button", { class: "feedback-modal-close", onClick: this.close }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "#191919", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round", class: "feather feather-x" }, h("line", { x1: "18", y1: "6", x2: "6", y2: "18" }), h("line", { x1: "6", y1: "6", x2: "18", y2: "18" })))), h("div", { class: "feedback-modal-body" }, !this.formSuccess && !this.formError ? (h("form", { onSubmit: this.handleSubmit }, !this.hideRating && (h("div", { class: "feedback-modal-rating" }, this.ratingMode === 'thumbs' ? (h("div", { class: "feedback-modal-rating-content" }, h("span", { class: "feedback-modal-input-heading" }, this.ratingPlaceholder), h("div", { class: "feedback-modal-rating-buttons feedback-modal-rating-buttons--thumbs" }, h("button", { title: "Yes", class: `feedback-modal-rating-button ${this.selectedRating === 1
|
|
9105
|
+
? 'feedback-modal-rating-button--selected'
|
|
9106
|
+
: ''}`, onClick: (event) => {
|
|
9104
9107
|
event.preventDefault();
|
|
9105
9108
|
this.handleRatingChange(1);
|
|
9106
|
-
} }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "#5F6368", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: "M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3" }))), h("button", { title: "No", class: `feedback-modal-rating-button ${this.selectedRating === 5
|
|
9109
|
+
} }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "#5F6368", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: "M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3" }))), h("button", { title: "No", class: `feedback-modal-rating-button ${this.selectedRating === 5
|
|
9110
|
+
? 'feedback-modal-rating-button--selected'
|
|
9111
|
+
: ''}`, onClick: (event) => {
|
|
9107
9112
|
event.preventDefault();
|
|
9108
9113
|
this.handleRatingChange(5);
|
|
9109
|
-
} }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "#5F6368", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: "M10 15v4a3 3 0 0 0 3 3l4-9V2H5.72a2 2 0 0 0-2 1.7l-1.38 9a2 2 0 0 0 2 2.3zm7-13h2.67A2.31 2.31 0 0 1 22 4v7a2.31 2.31 0 0 1-2.33 2H17" })))))) : (h("div", { class: "feedback-modal-rating-content" }, h("span", { class: "feedback-modal-input-heading" }, this.ratingStarsPlaceholder), h("div", { class: "feedback-modal-rating-buttons feedback-modal-rating-buttons--stars" }, [1, 2, 3, 4, 5].map((rating) => (h("button", { key: rating, class: `feedback-modal-rating-button ${this.selectedRating >= rating
|
|
9114
|
+
} }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "#5F6368", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("path", { d: "M10 15v4a3 3 0 0 0 3 3l4-9V2H5.72a2 2 0 0 0-2 1.7l-1.38 9a2 2 0 0 0 2 2.3zm7-13h2.67A2.31 2.31 0 0 1 22 4v7a2.31 2.31 0 0 1-2.33 2H17" })))))) : (h("div", { class: "feedback-modal-rating-content" }, h("span", { class: "feedback-modal-input-heading" }, this.ratingStarsPlaceholder), h("div", { class: "feedback-modal-rating-buttons feedback-modal-rating-buttons--stars" }, [1, 2, 3, 4, 5].map((rating) => (h("button", { key: rating, class: `feedback-modal-rating-button ${this.selectedRating >= rating
|
|
9115
|
+
? 'feedback-modal-rating-button--selected'
|
|
9116
|
+
: ''}`, onClick: (event) => {
|
|
9110
9117
|
event.preventDefault();
|
|
9111
9118
|
this.handleRatingChange(rating);
|
|
9112
|
-
} }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "28", viewBox: "0 0 24 24", fill: "none", stroke: "#5F6368", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polygon", { points: "12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2" })))))))))), h("div", { class: "feedback-modal-text" }, h("textarea", { placeholder: this.messagePlaceholder, value: this.formMessage, onInput: (event) => this.handleMessageInput(event) })), !this.hideEmail && (h("div", { class: "feedback-modal-email" }, h("input", { placeholder: this.emailPlaceholder, type: "email", onInput: (event) => this.handleEmailInput(event), value: this.formEmail }))), h("div", { class: "feedback-verification" }, h("input", { type: "text", name: "verification", style: { display: 'none' }, onInput: (event) => this.handleVerification(event), value: this.formVerification })), !this.hidePrivacyPolicy && (h("div", { class: "feedback-modal-privacy" }, h("input", { type: "checkbox", id: "privacyPolicy", onChange: (ev) => this.handleCheckboxChange(ev), required: true }), h("span", { innerHTML: this.privacyPolicyText }))), h("div", { class: `feedback-modal-buttons ${this.hideScreenshotButton ? 'single' : ''}` }, !this.hideScreenshotButton && (h("button", { type: "button", class: `feedback-modal-button feedback-modal-button--screenshot ${this.encodedScreenshot ?
|
|
9119
|
+
} }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "28", height: "28", viewBox: "0 0 24 24", fill: "none", stroke: "#5F6368", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }, h("polygon", { points: "12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2" })))))))))), h("div", { class: "feedback-modal-text" }, h("textarea", { placeholder: this.messagePlaceholder, value: this.formMessage, onInput: (event) => this.handleMessageInput(event) })), !this.hideEmail && (h("div", { class: "feedback-modal-email" }, h("input", { placeholder: this.emailPlaceholder, type: "email", onInput: (event) => this.handleEmailInput(event), value: this.formEmail }))), h("div", { class: "feedback-verification" }, h("input", { type: "text", name: "verification", style: { display: 'none' }, onInput: (event) => this.handleVerification(event), value: this.formVerification })), !this.hidePrivacyPolicy && (h("div", { class: "feedback-modal-privacy" }, h("input", { type: "checkbox", id: "privacyPolicy", onChange: (ev) => this.handleCheckboxChange(ev), required: true }), h("span", { innerHTML: this.privacyPolicyText }))), h("div", { class: `feedback-modal-buttons ${this.hideScreenshotButton ? 'single' : ''}` }, !this.hideScreenshotButton && (h("button", { type: "button", class: `feedback-modal-button feedback-modal-button--screenshot ${this.encodedScreenshot ? 'feedback-modal-button--active' : ''}`, onClick: this.openScreenShot, disabled: this.sending }, h("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24", viewBox: "0 -960 960 960", width: "24" }, h("path", { d: "M680-80v-120H560v-80h120v-120h80v120h120v80H760v120h-80ZM200-200v-200h80v120h120v80H200Zm0-360v-200h200v80H280v120h-80Zm480 0v-120H560v-80h200v200h-80Z" })), this.screenshotButtonText)), h("button", { class: "feedback-modal-button feedback-modal-button--submit", type: "submit", disabled: this.sending }, this.sendButtonText)))) : this.formSuccess && !this.formError ? (h("div", { class: "feedback-modal-success" }, h("p", { class: "feedback-modal-message" }, this.successMessage))) : this.formError && this.formErrorStatus == 404 ? (h("p", { class: "feedback-modal-message" }, this.errorMessage404)) : this.formError && this.formErrorStatus == 403 ? (h("p", { class: "feedback-modal-message" }, this.errorMessage403)) : this.formError ? (h("p", { class: "feedback-modal-message" }, this.errorMessage)) : (h("span", null))), h("div", { class: "feedback-modal-footer" }, h("div", { class: "feedback-logo", style: { display: this.whitelabel ? 'none' : 'block' } }, "Powered by", ' ', h("a", { target: "_blank", href: "https://pushfeedback.com" }, "PushFeedback.com")), this.footerText && (h("div", { class: "feedback-footer-text" }, h("span", { innerHTML: this.footerText }))))))));
|
|
9113
9120
|
}
|
|
9114
9121
|
componentDidRender() {
|
|
9115
9122
|
if (this.showModal) {
|
|
@@ -9129,36 +9136,36 @@ const FeedbackModal = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
|
|
|
9129
9136
|
static get style() { return feedbackModalCss; }
|
|
9130
9137
|
}, [1, "feedback-modal", {
|
|
9131
9138
|
"customFont": [4, "custom-font"],
|
|
9139
|
+
"emailAddress": [1, "email-address"],
|
|
9140
|
+
"hideEmail": [4, "hide-email"],
|
|
9141
|
+
"ratingMode": [1, "rating-mode"],
|
|
9142
|
+
"hasSelectedElement": [1540, "has-selected-element"],
|
|
9143
|
+
"hidePrivacyPolicy": [4, "hide-privacy-policy"],
|
|
9144
|
+
"hideRating": [4, "hide-rating"],
|
|
9145
|
+
"hideScreenshotButton": [4, "hide-screenshot-button"],
|
|
9146
|
+
"project": [1],
|
|
9147
|
+
"showScreenshotMode": [1540, "show-screenshot-mode"],
|
|
9148
|
+
"showScreenshotTopBar": [1540, "show-screenshot-top-bar"],
|
|
9149
|
+
"showModal": [1540, "show-modal"],
|
|
9150
|
+
"rating": [2],
|
|
9151
|
+
"fetchData": [4, "fetch-data"],
|
|
9152
|
+
"emailPlaceholder": [1, "email-placeholder"],
|
|
9132
9153
|
"errorMessage": [1, "error-message"],
|
|
9133
9154
|
"errorMessage403": [1, "error-message-4-0-3"],
|
|
9134
9155
|
"errorMessage404": [1, "error-message-4-0-4"],
|
|
9156
|
+
"messagePlaceholder": [1, "message-placeholder"],
|
|
9157
|
+
"footerText": [1, "footer-text"],
|
|
9158
|
+
"modalPosition": [1, "modal-position"],
|
|
9135
9159
|
"modalTitle": [1, "modal-title"],
|
|
9136
|
-
"modalTitleSuccess": [1, "modal-title-success"],
|
|
9137
9160
|
"modalTitleError": [1, "modal-title-error"],
|
|
9138
|
-
"
|
|
9161
|
+
"modalTitleSuccess": [1, "modal-title-success"],
|
|
9162
|
+
"privacyPolicyText": [1, "privacy-policy-text"],
|
|
9163
|
+
"ratingPlaceholder": [1, "rating-placeholder"],
|
|
9164
|
+
"ratingStarsPlaceholder": [1, "rating-stars-placeholder"],
|
|
9139
9165
|
"sendButtonText": [1, "send-button-text"],
|
|
9140
|
-
"successMessage": [1, "success-message"],
|
|
9141
|
-
"project": [1],
|
|
9142
9166
|
"screenshotButtonText": [1, "screenshot-button-text"],
|
|
9143
9167
|
"screenshotTopbarText": [1, "screenshot-topbar-text"],
|
|
9144
|
-
"
|
|
9145
|
-
"emailAddress": [1, "email-address"],
|
|
9146
|
-
"emailPlaceholder": [1, "email-placeholder"],
|
|
9147
|
-
"messagePlaceholder": [1, "message-placeholder"],
|
|
9148
|
-
"hideRating": [4, "hide-rating"],
|
|
9149
|
-
"rating": [2],
|
|
9150
|
-
"ratingMode": [1, "rating-mode"],
|
|
9151
|
-
"ratingPlaceholder": [1, "rating-placeholder"],
|
|
9152
|
-
"ratingStarsPlaceholder": [1, "rating-stars-placeholder"],
|
|
9153
|
-
"footerText": [1, "footer-text"],
|
|
9154
|
-
"showModal": [1540, "show-modal"],
|
|
9155
|
-
"showScreenshotMode": [1540, "show-screenshot-mode"],
|
|
9156
|
-
"showScreenshotTopBar": [1540, "show-screenshot-top-bar"],
|
|
9157
|
-
"hasSelectedElement": [1540, "has-selected-element"],
|
|
9158
|
-
"hideScreenshotButton": [4, "hide-screenshot-button"],
|
|
9159
|
-
"hidePrivacyPolicy": [4, "hide-privacy-policy"],
|
|
9160
|
-
"privacyPolicyText": [1, "privacy-policy-text"],
|
|
9161
|
-
"fetchData": [4, "fetch-data"],
|
|
9168
|
+
"successMessage": [1, "success-message"],
|
|
9162
9169
|
"sending": [32],
|
|
9163
9170
|
"formMessage": [32],
|
|
9164
9171
|
"formEmail": [32],
|