pushfeedback 0.1.45 → 0.1.47

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