pushfeedback 0.1.45 → 0.1.46

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 (39) hide show
  1. package/dist/cjs/feedback-button_2.cjs.entry.js +8267 -0
  2. package/dist/cjs/index-b596cc3a.js +1551 -0
  3. package/dist/cjs/index.cjs.js +2 -0
  4. package/dist/cjs/loader.cjs.js +22 -0
  5. package/dist/cjs/pushfeedback.cjs.js +23 -0
  6. package/dist/collection/collection-manifest.json +13 -0
  7. package/dist/collection/components/feedback-button/feedback-button.css +71 -0
  8. package/dist/collection/components/feedback-button/feedback-button.js +671 -0
  9. package/dist/collection/components/feedback-modal/feedback-modal.css +388 -0
  10. package/dist/collection/components/feedback-modal/feedback-modal.js +845 -0
  11. package/dist/collection/index.js +1 -0
  12. package/dist/{pushfeedback/feedback-button.entry.js → components/feedback-button.js} +63 -8
  13. package/dist/components/feedback-modal.js +6 -0
  14. package/dist/{pushfeedback/feedback-modal.entry.js → components/feedback-modal2.js} +67 -44
  15. package/dist/components/index.js +3 -0
  16. package/dist/esm/feedback-button_2.entry.js +8262 -0
  17. package/dist/esm/index-deb00b84.js +1523 -0
  18. package/dist/esm/index.js +1 -0
  19. package/dist/esm/loader.js +18 -0
  20. package/dist/esm/polyfills/core-js.js +11 -0
  21. package/dist/esm/polyfills/css-shim.js +1 -0
  22. package/dist/esm/polyfills/dom.js +79 -0
  23. package/dist/esm/polyfills/es5-html-element.js +1 -0
  24. package/dist/esm/polyfills/index.js +34 -0
  25. package/dist/esm/polyfills/system.js +6 -0
  26. package/dist/esm/pushfeedback.js +18 -0
  27. package/dist/index.cjs.js +1 -0
  28. package/dist/index.js +1 -0
  29. package/dist/pushfeedback/index.esm.js +0 -1
  30. package/dist/pushfeedback/p-90e8ba79.js +2 -0
  31. package/dist/pushfeedback/p-fa888cd3.entry.js +22 -0
  32. package/dist/pushfeedback/pushfeedback.css +1 -108
  33. package/dist/pushfeedback/pushfeedback.esm.js +1 -148
  34. package/package.json +1 -1
  35. package/dist/pushfeedback/app-globals-0f993ce5.js +0 -3
  36. package/dist/pushfeedback/css-shim-b7d3d95f.js +0 -4
  37. package/dist/pushfeedback/dom-64053c71.js +0 -73
  38. package/dist/pushfeedback/index-6a05f159.js +0 -3371
  39. package/dist/pushfeedback/shadow-css-98135883.js +0 -387
package/dist/collection/components/feedback-modal/feedback-modal.css ADDED
@@ -0,0 +1,388 @@
1
+ .text-center {
2
+ flex-grow: 1;
3
+ text-align: center;
4
+ }
5
+
6
+ .feedback-modal-wrapper {
7
+ position: absolute;
8
+ z-index: var(--feedback-modal-modal-wrapper-z-index);
9
+ }
10
+
11
+ .feedback-overlay {
12
+ background-color: var(--feedback-modal-screenshot-bg-color);
13
+ height: 100%;
14
+ left: 0;
15
+ position: fixed;
16
+ top: 0;
17
+ width: 100%;
18
+ z-index: var(--feedback-modal-screnshot-z-index);
19
+ }
20
+
21
+ .feedback-modal {
22
+ display: inline-block;
23
+ position: relative;
24
+ }
25
+
26
+ .feedback-modal-content {
27
+ background-color: var(--feedback-modal-content-bg-color);
28
+ border-color: 1px solid var(--feedback-modal-header-text-color);
29
+ border-radius: var(--feedback-modal-content-border-radius);
30
+ box-shadow: 0px 1px 2px 0px rgba(60, 64, 67, .30), 0px 2px 6px 2px rgba(60, 64, 67, .15);
31
+ box-sizing: border-box;
32
+ color: var(--feedback-modal-content-text-color);
33
+ display: flex;
34
+ flex-direction: column;
35
+ font-family: var(--feedback-modal-content-font-family);
36
+ left: 50%;
37
+ max-width: 90%;
38
+ padding: 20px;
39
+ position: fixed;
40
+ top: 50%;
41
+ transform: translate(-50%, -50%);
42
+ width: 100%;
43
+ z-index: var(--feedback-modal-content-z-index);
44
+ }
45
+
46
+ .feedback-modal-header {
47
+ align-items: center;
48
+ color: var(--feedback-modal-header-text-color);
49
+ display: flex;
50
+ font-family: var(--feedback-modal-header-font-family);
51
+ font-size: var(--feedback-header-font-size);
52
+ font-weight: var(--feedback-modal-header-font-weight);
53
+ justify-content: space-between;
54
+ margin-bottom: 20px;
55
+ }
56
+
57
+ .feedback-modal-rating-buttons {
58
+ width: 100%;
59
+ margin-bottom: 20px;
60
+ }
61
+
62
+ .feedback-modal-rating-button {
63
+ padding: 0;
64
+ background-color: transparent;
65
+ border: transparent;
66
+ margin-right: 5px;
67
+ cursor: pointer;
68
+ }
69
+
70
+ .feedback-modal-rating-buttons--thumbs .feedback-modal-rating-button {
71
+ border: 1px solid var(--feedback-modal-button-border-color);
72
+ border-radius: var(--feedback-modal-button-border-radius);
73
+ color: var(--feedback-modal-button-text-color);
74
+ font-size: var(--feedback-modal-button-font-size);
75
+ font-family: var(--feedback-modal-content-font-family);
76
+ font-weight: 500;
77
+ margin-right: 10px;
78
+ justify-content: center;
79
+ padding: 5px 10px;
80
+ }
81
+
82
+ .feedback-modal-rating-buttons--thumbs .feedback-modal-rating-button:hover,
83
+ .feedback-modal-rating-buttons--thumbs .feedback-modal-rating-button--selected {
84
+ background-color: var(--feedback-modal-button-bg-color-active);
85
+ border: 1px solid var(--feedback-modal-button-border-color-active);
86
+ color: var(--feedback-modal-button-text-color-active);
87
+ }
88
+
89
+ .feedback-modal-rating-buttons--thumbs .feedback-modal-rating-button:hover svg,
90
+ .feedback-modal-rating-buttons--thumbs .feedback-modal-rating-button--selected svg {
91
+ stroke: var(--feedback-modal-rating-button-selected-color);
92
+ }
93
+
94
+ .feedback-modal-rating-buttons svg {
95
+ stroke: var(--feedback-modal-rating-button-color);
96
+ cursor: pointer;
97
+ }
98
+
99
+ .feedback-modal-rating-buttons--stars .feedback-modal-rating-button--selected svg {
100
+ fill: var(--feedback-modal-rating-button-stars-selected-color);
101
+ stroke: var(--feedback-modal-rating-button-stars-selected-color);
102
+ }
103
+
104
+ .feedback-modal-text textarea {
105
+ background-color: var(--feedback-modal-input-bg-color);
106
+ border: 1px solid var(--feedback-modal-input-border-color);
107
+ border-radius: var(--feedback-modal-input-border-radius);
108
+ box-sizing: border-box;
109
+ color: var(--feedback-modal-input-text-color);
110
+ font-family: var(--feedback-modal-content-font-family);
111
+ font-size: var(--feedback-modal-input-font-size);
112
+ margin-bottom: 20px;
113
+ height: 100px;
114
+ min-height: 100px;
115
+ padding: 10px;
116
+ resize: vertical;
117
+ width: 100%;
118
+ }
119
+
120
+
121
+ .feedback-modal-email input {
122
+ background-color: var(--feedback-modal-input-bg-color);
123
+ border: 1px solid var(--feedback-modal-input-border-color);
124
+ border-radius: var(--feedback-modal-input-border-radius);
125
+ box-sizing: border-box;
126
+ color: var(--feedback-modal-input-text-color);
127
+ font-family: var(--feedback-modal-content-font-family);
128
+ font-size: var(--feedback-modal-input-font-size);
129
+ margin-bottom: 20px;
130
+ height: 40px;
131
+ padding: 10px;
132
+ width: 100%;
133
+ margin-bottom: 20px;
134
+ }
135
+
136
+ .feedback-modal-privacy {
137
+ font-family: var(--feedback-modal-content-font-family);
138
+ font-size: var(--feedback-modal-input-font-size);
139
+ margin-bottom: 20px;
140
+ }
141
+
142
+
143
+ .feedback-modal-text textarea:focus, .feedback-modal-email input:focus {
144
+ border: 1px solid var(--feedback-modal-input-border-color-focused);
145
+ outline: none;
146
+ }
147
+
148
+ .feedback-modal-buttons {
149
+ display: flex;
150
+ flex-direction: column;
151
+ }
152
+
153
+ .feedback-modal-buttons .feedback-modal-button {
154
+ margin-bottom: 20px;
155
+ }
156
+
157
+ .feedback-modal-button {
158
+ align-items: center;
159
+ background-color: transparent;
160
+ border: 1px solid var(--feedback-modal-button-border-color);
161
+ border-radius: var(--feedback-modal-button-border-radius);
162
+ color: var(--feedback-modal-button-text-color);
163
+ cursor: pointer;
164
+ display: flex;
165
+ font-size: var(--feedback-modal-button-font-size);
166
+ font-family: var(--feedback-modal-content-font-family);
167
+ font-weight: 500;
168
+ justify-content: center;
169
+ min-height: 40px;
170
+ padding: 5px 10px;
171
+ }
172
+
173
+ .feedback-modal-button svg {
174
+ margin-right: 6px;
175
+ }
176
+
177
+ .feedback-modal-button path {
178
+ fill: var(--feedback-modal-button-icon-color);
179
+ }
180
+
181
+ .feedback-modal-button:hover path,
182
+ .feedback-modal-button--active path {
183
+ fill: var(--feedback-modal-button-icon-color-active);
184
+ }
185
+
186
+ .feedback-modal-button--submit {
187
+ background-color: var(--feedback-modal-button-submit-bg-color);
188
+ border: 1px solid var(--feedback-modal-button-border-color-active);
189
+ color: var(--feedback-modal-button-submit-text-color);
190
+ }
191
+
192
+ .feedback-modal-button:hover,
193
+ .feedback-modal-button--active {
194
+ background-color: var(--feedback-modal-button-bg-color-active);
195
+ border: 1px solid var(--feedback-modal-button-border-color-active);
196
+ color: var(--feedback-modal-button-text-color-active);
197
+ }
198
+
199
+ .feedback-modal-button--submit:hover{
200
+ background-color: var(--feedback-modal-button-submit-bg-color-hover);
201
+ border: 1px solid var(--feedback-modal-button-submit-border-color-hover);
202
+ color: var(--feedback-modal-button-submit-text-color-hover);
203
+ }
204
+
205
+
206
+ .feedback-modal-input-heading{
207
+ display: block;
208
+ font-size: 14px;
209
+ font-weight: 300;
210
+ padding-bottom: 10px;
211
+ font-family: var(--feedback-modal-content-font-family);
212
+ }
213
+
214
+ .feedback-modal-footer {
215
+ font-size: 12px;
216
+ text-align: center;
217
+ }
218
+
219
+ .feedback-modal-footer a {
220
+ color: var(--feedback-modal-footer-link);
221
+ font-weight: 500;
222
+ text-decoration: none;
223
+ }
224
+
225
+ .feedback-logo {
226
+ align-items: center;
227
+ display: flex;
228
+ justify-content: center;
229
+ margin-top: 5px;
230
+ }
231
+
232
+ .feedback-logo a {
233
+ margin-left: 3px;
234
+ }
235
+
236
+ .feedback-modal-close {
237
+ background-color: var(--feedback-modal-close-bg-color);
238
+ border: 0;
239
+ border-radius: 50%;
240
+ cursor: pointer;
241
+ height: 22px;
242
+ margin-left: auto;
243
+ padding: 0;
244
+ width: 22px;
245
+ }
246
+
247
+ .feedback-modal-close svg {
248
+ stroke: var(--feedback-modal-close-color);
249
+ }
250
+
251
+
252
+ .feedback-modal-screenshot {
253
+ background-color: var(--feedback-modal-screenshot-bg-color);
254
+ height: 100%;
255
+ left: 0;
256
+ position: fixed;
257
+ top: 0;
258
+ width: 100%;
259
+ z-index: var(--feedback-modal-screnshot-z-index);
260
+ }
261
+
262
+ .feedback-modal-screenshot-header {
263
+ align-items: center;
264
+ background-color: var(--feedback-modal-screenshot-header-bg-color);
265
+ border-radius: var(--feedback-modal-content-border-radius);
266
+ box-shadow: 0px 1px 2px 0px rgba(60, 64, 67, .30), 0px 2px 6px 2px rgba(60, 64, 67, .15);
267
+ box-sizing: border-box;
268
+ color: var(--feedback-modal-screenshot-header-text-color);
269
+ cursor: pointer;
270
+ display: flex;
271
+ font-family: var(--feedback-modal-content-font-family);
272
+ left: 50%;
273
+ top: 20px;
274
+ transform: translateX(-50%);
275
+ padding: 10px;
276
+ position: fixed;
277
+ width: max-content;
278
+ z-index: var(--feedback-modal-screenshot-header-z-index);
279
+ }
280
+
281
+ .feedback-modal-screenshot-close {
282
+ height: 24px;
283
+ padding-left: 10px;
284
+ width: 24px;
285
+ }
286
+
287
+ .feedback-modal-screenshot-close svg {
288
+ stroke: var(--feedback-modal-close-color);
289
+ }
290
+
291
+ .feedback-modal-message {
292
+ font-size: var(--feedback-modal-message-font-size);
293
+ margin-top: 0;
294
+ }
295
+
296
+
297
+ .feedback-modal-element-hover {
298
+ background-color: transparent;
299
+ cursor: pointer;
300
+ border: 1px solid var(--feedback-modal-element-hover-border-color);
301
+ }
302
+
303
+
304
+ .feedback-modal-element-selected {
305
+ background-color: transparent;
306
+ border: 1px solid var(--feedback-modal-element-selected-border-color);
307
+ }
308
+
309
+ @media screen and (min-width: 768px) {
310
+
311
+ .feedback-modal-content {
312
+ max-width: 600px;
313
+ }
314
+
315
+ .feedback-modal-content.feedback-modal-content--bottom-right {
316
+ bottom: var(--feedback-modal-content-position-bottom);
317
+ left: initial;
318
+ right: var(--feedback-modal-content-position-right);
319
+ top: initial;
320
+ transform: initial;
321
+ }
322
+
323
+ .feedback-modal-content.feedback-modal-content--bottom-left {
324
+ bottom: var(--feedback-modal-content-position-bottom);
325
+ left: var(--feedback-modal-content-position-left);
326
+ top: initial;
327
+ transform: initial;
328
+ }
329
+
330
+ .feedback-modal-content.feedback-modal-content--top-right {
331
+ right: var(--feedback-modal-content-position-right);
332
+ top: var(--feedback-modal-content-position-top);
333
+ transform: initial;
334
+ }
335
+
336
+ .feedback-modal-content.feedback-modal-content--top-left {
337
+ left: var(--feedback-modal-content-position-left);
338
+ top: var(--feedback-modal-content-position-top);
339
+ transform: initial;
340
+ }
341
+
342
+ .feedback-modal-content.feedback-modal-content--center-left {
343
+ left: 5px;
344
+ right: auto;
345
+ top: 50%;
346
+ transform: translateY(-50%);
347
+ }
348
+
349
+ .feedback-modal-content.feedback-modal-content--center-right {
350
+ left: auto;
351
+ right: 5px;
352
+ top: 50%;
353
+ transform: translateY(-50%);
354
+ }
355
+
356
+
357
+ .feedback-modal-content.feedback-modal-content--sidebar-left.feedback-modal-content--open,
358
+ .feedback-modal-content.feedback-modal-content--sidebar-right.feedback-modal-content--open{
359
+ transform: translateX(0);
360
+ }
361
+
362
+ .feedback-modal-content.feedback-modal-content--sidebar-left {
363
+ max-width: 300px;
364
+ left: 0;
365
+ right: auto;
366
+ height: 100vh;
367
+ top: 0;
368
+ transform: translateX(-100%);
369
+ transition: transform 0.5s ease-in-out;
370
+ border-radius: 0;
371
+ }
372
+
373
+ .feedback-modal-content.feedback-modal-content--sidebar-right {
374
+ max-width: 300px;
375
+ left: auto;
376
+ right: 0;
377
+ height: 100vh;
378
+ top: 0;
379
+ transform: translateX(100%);
380
+ transition: transform 0.5s ease-in-out;
381
+ border-radius: 0;
382
+ }
383
+
384
+ .feedback-modal-text textarea {
385
+ height: 150px;
386
+ min-height: 150px;
387
+ }
388
+ }