react-feedback-surveys 1.6.1 → 1.7.0
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/README.md +53 -5
- package/dist/index.css +1 -1
- package/dist/index.d.ts +43 -4
- package/dist/index.js +459 -294
- package/package.json +13 -13
package/README.md
CHANGED
|
@@ -51,6 +51,7 @@
|
|
|
51
51
|
- **Multiple scale styles** – emoji, stars, numbers, thumbs
|
|
52
52
|
- **Flexible placement** – embed inline or display as popup overlay
|
|
53
53
|
- **Follow-up feedback** – optional text input or multiple choice responses
|
|
54
|
+
- **Optional email collection** – close the loop by capturing a respondent's email when no user identity is known
|
|
54
55
|
- **Fully customizable** – CSS variables and custom class names
|
|
55
56
|
- **Zero dependencies**
|
|
56
57
|
- **TypeScript support**
|
|
@@ -101,7 +102,8 @@ import 'react-feedback-surveys/index.css';
|
|
|
101
102
|
maxLabel="Very satisfied"
|
|
102
103
|
responseType="text"
|
|
103
104
|
textQuestion="We'd love to hear your thoughts — what can we improve?"
|
|
104
|
-
|
|
105
|
+
textButtonSendLabel="Send"
|
|
106
|
+
textButtonSkipLabel="Skip"
|
|
105
107
|
thankYouMessage="Thanks for your feedback!"
|
|
106
108
|
onScoreSubmit={({ value }) => {/* ... */}}
|
|
107
109
|
onFeedbackSubmit={({ value, text }) => {/* ... */}}
|
|
@@ -130,7 +132,8 @@ import 'react-feedback-surveys/index.css';
|
|
|
130
132
|
question="Are you satisfied with the result?"
|
|
131
133
|
responseType="text"
|
|
132
134
|
textQuestion="We'd love to hear your thoughts — what can we improve?"
|
|
133
|
-
|
|
135
|
+
textButtonSendLabel="Send"
|
|
136
|
+
textButtonSkipLabel="Skip"
|
|
134
137
|
thankYouMessage="Thank you for your feedback!"
|
|
135
138
|
onScoreSubmit={({ value }) => {/* ... */}}
|
|
136
139
|
onFeedbackSubmit={({ value, text }) => {/* ... */}}
|
|
@@ -163,7 +166,8 @@ import 'react-feedback-surveys/index.css';
|
|
|
163
166
|
maxLabel="Very likely"
|
|
164
167
|
responseType="text"
|
|
165
168
|
textQuestion="We'd love to hear your thoughts — what can we improve?"
|
|
166
|
-
|
|
169
|
+
textButtonSendLabel="Send"
|
|
170
|
+
textButtonSkipLabel="Skip"
|
|
167
171
|
thankYouMessage="Thank you for your feedback!"
|
|
168
172
|
onScoreSubmit={({ value }) => {/* ... */}}
|
|
169
173
|
onFeedbackSubmit={({ value, text }) => {/* ... */}}
|
|
@@ -194,7 +198,8 @@ import 'react-feedback-surveys/index.css';
|
|
|
194
198
|
maxLabel="Very easy"
|
|
195
199
|
responseType="text"
|
|
196
200
|
textQuestion="We'd love to hear your thoughts — what can we improve?"
|
|
197
|
-
|
|
201
|
+
textButtonSendLabel="Send"
|
|
202
|
+
textButtonSkipLabel="Skip"
|
|
198
203
|
thankYouMessage="Thank you for your feedback!"
|
|
199
204
|
onScoreSubmit={({ value }) => {/* ... */}}
|
|
200
205
|
onFeedbackSubmit={({ value, text }) => {/* ... */}}
|
|
@@ -296,9 +301,16 @@ Most props are shared across all survey widgets. Each widget differs only in its
|
|
|
296
301
|
| `maxLabel` | `string` | - | Right label for the scale. |
|
|
297
302
|
| `responseType` | `null \| 'text' \| 'choices'` | - | Enables optional follow-up feedback. |
|
|
298
303
|
| `textQuestion` | `string` | - | Follow-up question displayed when `responseType` is defined. |
|
|
299
|
-
| `
|
|
304
|
+
| `textButtonSendLabel` | `string` | - | Submit label for the feedback screen. |
|
|
305
|
+
| `textButtonSkipLabel` | `string` | - | Skip label for the feedback screen. |
|
|
300
306
|
| `choiceOptions` | `string[] \| null` | - | Predefined choices (when `responseType === 'choices'`). |
|
|
301
307
|
| `thankYouMessage` | `string` | required | Message shown after submission. |
|
|
308
|
+
| `collectContact` | `boolean` | - | Enables an optional email collection step before the success screen. |
|
|
309
|
+
| `userId` | `string` | - | Existing user identity. When provided, the email collection step is skipped. |
|
|
310
|
+
| `contactQuestion` | `string` | - | Question shown on the email collection screen. |
|
|
311
|
+
| `contactSubtext` | `string` | - | Descriptive text shown above the email input. |
|
|
312
|
+
| `contactButtonSendLabel` | `string` | - | Submit label for the email collection screen. |
|
|
313
|
+
| `contactButtonSkipLabel` | `string` | - | Skip label for the email collection screen. |
|
|
302
314
|
|
|
303
315
|
#### ClassNamesConfig Type
|
|
304
316
|
|
|
@@ -311,6 +323,7 @@ interface ClassNamesConfig {
|
|
|
311
323
|
body?: string; // Main content region (rating scale, feedback form or success)
|
|
312
324
|
rating?: string; // Additional class applied when rating screen is active
|
|
313
325
|
feedback?: string; // Additional class applied when feedback screen is active
|
|
326
|
+
contact?: string; // Additional class applied when email collection screen is active
|
|
314
327
|
success?: string; // Additional class applied when success screen is active
|
|
315
328
|
close?: string; // Close button
|
|
316
329
|
};
|
|
@@ -331,12 +344,14 @@ interface ClassNamesConfig {
|
|
|
331
344
|
|--------------------|---------------------------------------------------|----------|-------------------------------------------------------------------------------------------------------------|
|
|
332
345
|
| `onScoreSubmit` | `(payload: ScorePayload) => void \| Promise<void>` | - | Fires immediately when a score is selected, before any follow-up feedback screen. Captures the raw rating. |
|
|
333
346
|
| `onFeedbackSubmit` | `(payload: FeedbackPayload) => void \| Promise<void>` | - | Fires when feedback is submitted. Includes the selected score and the user's text(s). |
|
|
347
|
+
| `onContactSubmit` | `(payload: ContactPayload) => void \| Promise<void>` | - | Fires when the respondent submits an email on the optional email collection screen. Not called when the step is skipped or not shown. |
|
|
334
348
|
|
|
335
349
|
**Event Payload Types:**
|
|
336
350
|
|
|
337
351
|
```typescript
|
|
338
352
|
type ScorePayload = { value: number };
|
|
339
353
|
type FeedbackPayload = { value: number; text?: string | string[] };
|
|
354
|
+
type ContactPayload = { value?: number; text?: string | string[]; email: string };
|
|
340
355
|
```
|
|
341
356
|
|
|
342
357
|
> **Event behavior**
|
|
@@ -357,6 +372,8 @@ The actual `value` returned depends on the survey type:
|
|
|
357
372
|
Invoked when the user completes the follow-up step and submits their feedback (only applies when `responseType` is `text` or `choices`).
|
|
358
373
|
This callback provides both the original score and the user's input.
|
|
359
374
|
|
|
375
|
+
The feedback step is always optional: respondents can submit feedback or skip it via the `textButtonSkipLabel` button (or by submitting with empty input), and either action advances to the next screen. `onFeedbackSubmit` only fires when feedback text or choices are actually submitted; it is **not** called when the step is skipped.
|
|
376
|
+
|
|
360
377
|
**Arguments:**
|
|
361
378
|
- `value: number` — the same score previously passed to `onScoreSubmit`
|
|
362
379
|
- `text: string | string[]` — depends on `responseType`:
|
|
@@ -368,6 +385,36 @@ You should listen to **both** `onScoreSubmit` and `onFeedbackSubmit`.
|
|
|
368
385
|
A user may select a score but abandon the follow-up screen (close the widget, navigate away, refresh, etc.).
|
|
369
386
|
Handling both events ensures you capture at least the rating even when additional feedback is not provided — and still receive extended data when it is.
|
|
370
387
|
|
|
388
|
+
#### `onContactSubmit`
|
|
389
|
+
|
|
390
|
+
When `collectContact` is `true` and no `userId` is provided, an optional email collection screen is shown after the rating/feedback screens and before the success screen. This lets you "close the feedback loop" by capturing an email for a respondent whose identity isn't already known to the host app.
|
|
391
|
+
|
|
392
|
+
- If `userId` is provided, the step is skipped entirely — the widget assumes identity is already known.
|
|
393
|
+
- The step is always optional: respondents can submit an email or skip it, and either action advances to the success screen.
|
|
394
|
+
- `onContactSubmit` only fires when the respondent actually submits an email; it is **not** called when the step is skipped or not shown.
|
|
395
|
+
|
|
396
|
+
**Arguments:**
|
|
397
|
+
- `value?: number` — the selected rating, if any.
|
|
398
|
+
- `text?: string | string[]` — the submitted feedback text or choices, if any.
|
|
399
|
+
- `email: string` — the email address entered by the respondent.
|
|
400
|
+
|
|
401
|
+
```tsx
|
|
402
|
+
<CSAT5Survey
|
|
403
|
+
scaleStyle="numbers"
|
|
404
|
+
question="How would you rate your satisfaction with our product?"
|
|
405
|
+
responseType="text"
|
|
406
|
+
textQuestion="We'd love to hear your thoughts — what can we improve?"
|
|
407
|
+
thankYouMessage="Thanks for your feedback!"
|
|
408
|
+
collectContact
|
|
409
|
+
userId={currentUser?.id}
|
|
410
|
+
contactQuestion="Mind sharing your email so we can follow up?"
|
|
411
|
+
contactButtonSendLabel="Submit"
|
|
412
|
+
contactButtonSkipLabel="Skip"
|
|
413
|
+
onScoreSubmit={({ value }) => {/* ... */}}
|
|
414
|
+
onFeedbackSubmit={({ value, text }) => {/* ... */}}
|
|
415
|
+
onContactSubmit={({ value, text, email }) => {/* attribute the feedback to this email */}}
|
|
416
|
+
/>
|
|
417
|
+
```
|
|
371
418
|
|
|
372
419
|
### Scale Style Options
|
|
373
420
|
|
|
@@ -580,6 +627,7 @@ Reference: available keys
|
|
|
580
627
|
| `base.body` | Main content region (rating scale, feedback form or success) |
|
|
581
628
|
| `base.rating` | Additional class applied when rating screen is active |
|
|
582
629
|
| `base.feedback` | Additional class applied when feedback screen is active |
|
|
630
|
+
| `base.contact` | Additional class applied when email collection screen is active |
|
|
583
631
|
| `base.success` | Additional class applied when success screen is active |
|
|
584
632
|
| `base.close` | Close button |
|
|
585
633
|
| `scale.base` | Container around the scale style |
|
package/dist/index.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
:root,:host{--_color-text:var(--ft-color-text,30 8% 14%);--_color-bg:var(--ft-color-bg,0 0% 100%);--_color-muted:var(--ft-color-muted,222 11% 46%);--_color-error:var(--ft-color-error,32 95% 44%);--_color-border:var(--ft-color-border,214 14% 83%);--_color-outline:var(--ft-color-outline,218 14% 65%);--_color-shadow:var(--ft-color-shadow,0 0% 0%);--_color-control:var(--ft-color-control,214 20% 96%);--_popup-z-index:var(--ft-popup-z-index,49);--_popup-head-offset:var(--ft-popup-head-offset,0);--_surface-padding:var(--ft-surface-padding,24px);--_surface-padding-mobile:var(--ft-surface-padding-mobile,20px);--_surface-radius:var(--ft-surface-radius,8px)}._base_d3jtv_1{padding:var(--_surface-padding);background-color:hsl(var(--_color-bg)/100%);border-radius:var(--_surface-radius);box-shadow:0 0 10px hsl(var(--_color-shadow)/20%);display:inline-block;position:relative;overflow:auto}@media (width<=399px){._base_d3jtv_1{padding:var(--_surface-padding-mobile)}}._base_1vr2h_1{--_popup-head-offset:32px;z-index:var(--_popup-z-index);box-sizing:border-box;max-width:calc(100vw - var(--_surface-padding) * 2);max-height:calc(100vh - var(--_surface-padding) * 2);transform-origin:50% 100%;margin:0;display:flex;position:fixed}@media (width<=399px){._base_1vr2h_1{max-width:calc(100vw - var(--_surface-padding-mobile) * 2);max-height:calc(100vh - var(--_surface-padding-mobile) * 2)}}._animated_1vr2h_19{opacity:0;animation:.12s ease-in-out forwards _fadeForward_1vr2h_1}@keyframes _fadeForward_1vr2h_1{0%{opacity:0;transform:translateY(8px)scale(.92)}to{opacity:1;transform:translateY(0)scale(1)}}._topLeft_1vr2h_34{top:var(--_surface-padding);left:var(--_surface-padding)}@media (width<=399px){._topLeft_1vr2h_34{top:var(--_surface-padding-mobile);left:var(--_surface-padding-mobile)}}._topRight_1vr2h_45{top:var(--_surface-padding);right:var(--_surface-padding)}@media (width<=399px){._topRight_1vr2h_45{top:var(--_surface-padding-mobile);right:var(--_surface-padding-mobile)}}._bottomRight_1vr2h_56{right:var(--_surface-padding);bottom:var(--_surface-padding)}@media (width<=399px){._bottomRight_1vr2h_56{right:var(--_surface-padding-mobile);bottom:var(--_surface-padding-mobile)}}._bottomLeft_1vr2h_67{bottom:var(--_surface-padding);left:var(--_surface-padding)}@media (width<=399px){._bottomLeft_1vr2h_67{bottom:var(--_surface-padding-mobile);left:var(--_surface-padding-mobile)}}._close_1vr2h_78{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._close_1vr2h_78:disabled{cursor:default}._close_1vr2h_78{top:var(--_surface-padding);width:24px;height:24px;color:hsl(var(--_color-outline)/100%);transition:color .15s;position:absolute;inset-inline-end:var(--_surface-padding)}._close_1vr2h_78:hover{color:hsl(var(--_color-text)/100%)}._close_1vr2h_78:before,._close_1vr2h_78:after{content:"";background-color:currentColor;border-radius:1px;position:absolute;top:50%;left:50%;transform:rotate(45deg)}._close_1vr2h_78:before{width:16px;height:2px;margin:-1px 0 0 -8px}._close_1vr2h_78:after{width:2px;height:16px;margin:-8px 0 0 -1px}@media (width<=399px){._close_1vr2h_78{top:var(--_surface-padding-mobile);inset-inline-end:var(--_surface-padding-mobile)}}._choices_f81xp_1{margin:0 0 12px}._choice_f81xp_1{display:flex}._choice_f81xp_1+._choice_f81xp_1{margin-top:12px}._label_f81xp_12{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:flex-start;gap:8px;display:inline-flex;position:relative}._sr_f81xp_21{white-space:nowrap;clip-path:inset(50%);border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}._checkbox_f81xp_33{white-space:nowrap;clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}._check_f81xp_33{border:1px solid hsl(var(--_color-border)/100%);border-radius:4px;min-width:20px;height:20px}._label_f81xp_12:hover ._check_f81xp_33{border-color:hsl(var(--_color-text)/100%)}._checkbox_f81xp_33:checked+._check_f81xp_33{background-color:hsl(var(--_color-text)/100%);border-color:hsl(var(--_color-text)/100%);position:relative}._checkbox_f81xp_33:checked+._check_f81xp_33:after{content:"";border:2px solid;border-color:transparent transparent hsl(var(--_color-bg)/100%) hsl(var(--_color-bg)/100%);pointer-events:none;width:10px;height:7px;position:absolute;top:50%;left:50%;transform:translate(-45%,-75%)rotate(-45deg)}._input_f81xp_70{height:32px;margin-top:8px}._textarea_f81xp_75{height:192px}._input_f81xp_70,._textarea_f81xp_75{box-sizing:border-box;width:100%;color:hsl(var(--_color-text)/100%);background-color:hsl(var(--_color-bg)/100%);border:1px solid hsl(var(--_color-border)/100%);border-radius:var(--_surface-radius);outline:0 solid hsl(var(--_color-outline)/14%);resize:none;padding:8px 12px;font-size:16px;line-height:1.5;transition:background-color .15s,border-color .15s,outline-width .2s}._input_f81xp_70:focus,._textarea_f81xp_75:focus{outline:4px solid hsl(var(--_color-outline)/14%)}._input_f81xp_70._invalid_f81xp_98,._textarea_f81xp_75._invalid_f81xp_98{border-color:hsl(var(--_color-error)/100%)}._submit_f81xp_103{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._submit_f81xp_103:disabled{cursor:default}._submit_f81xp_103{text-align:center;color:hsl(var(--_color-bg)/100%);background-color:hsl(var(--_color-text)/100%);border-radius:var(--_surface-radius);padding:8px 32px;font-size:16px;font-weight:400;transition:opacity .2s}._submit_f81xp_103:hover{opacity:.85}._submit_f81xp_103{width:100%;margin-top:16px}._success_f81xp_135{text-align:center;padding:16px 0 32px;font-size:16px;font-weight:600;line-height:1.5}._base_1ilpx_1{text-align:center;padding:0 24px}._icon_1ilpx_6{display:inline-block}._base_1xpqq_1{color:hsl(var(--_color-text)/100%);padding:0;font-family:Helvetica Neue,Arial Nova,Helvetica,Arial,sans-serif}._head_1xpqq_7{padding-block:0 20px;padding-inline:0 var(--_popup-head-offset);gap:8px;display:flex}._title_1xpqq_14{flex:1 0;font-family:inherit;font-size:16px;font-style:normal;font-weight:500;line-height:1.4}._base_1e603_1{margin:12px 0 0;display:flex}._label_1e603_6{max-width:50%;color:hsl(var(--_color-muted)/100%);flex:0 0 50%;font-size:14px;line-height:1.4286}._between_1e603_14{justify-content:space-between}._between_1e603_14 ._label_1e603_6{flex:0 0 50%;max-width:50%}._between_1e603_14 ._label_1e603_6:first-child{text-align:start}._between_1e603_14 ._label_1e603_6:last-child{text-align:end}._center_1e603_28 ._label_1e603_6{flex:0 0 50%;max-width:50%}._center_1e603_28 ._label_1e603_6:first-child{text-align:end;padding-right:8px}._center_1e603_28 ._label_1e603_6:last-child{text-align:start;padding-left:8px}._center_1e603_28 ._text_1e603_40{text-align:center;min-width:56px;display:inline-block}@media (width<=599px){._center_1e603_28 ._text_1e603_40{min-width:48px}}._list_grany_1{justify-content:center;gap:16px;display:flex}._icon_grany_7{transition:transform .12s;transform:scale(1)}._button_grany_12{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_grany_12:disabled{cursor:default}._button_grany_12{background-color:hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}._button_grany_12:hover ._icon_grany_7{transform:scale(1.15)}._button_grany_12:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}@media (width<=399px){._button_grany_12{width:48px;height:48px}}._list_1yzyr_1{justify-content:center;gap:16px;display:flex}._icon_1yzyr_7{transition:transform .12s;transform:scale(1)}._button_1yzyr_12{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_1yzyr_12:disabled{cursor:default}._button_1yzyr_12{background-color:hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}._button_1yzyr_12:hover ._icon_1yzyr_7{transform:scale(1.15)}._button_1yzyr_12:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._base_113r0_1{max-width:100%}._rating_113r0_5,._feedback_113r0_6,._success_113r0_7{width:280px}@media (width<=399px){._rating_113r0_5,._feedback_113r0_6,._success_113r0_7{width:100%}}._list_1vfe4_1{justify-content:space-between;display:flex}._icon_1vfe4_6{transition:transform .12s;transform:scale(1)}._button_1vfe4_11{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_1vfe4_11:disabled{cursor:default}._button_1vfe4_11{background-color:hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}._button_1vfe4_11:hover ._icon_1vfe4_6{transform:scale(1.15)}._button_1vfe4_11:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}@media (width<=399px){._button_1vfe4_11{width:48px;height:48px}}._list_16sag_1{justify-content:space-between;display:flex}._button_16sag_6{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_16sag_6:disabled{cursor:default}._button_16sag_6{width:40px;height:40px;color:hsl(var(--_color-muted)/100%);background-color:hsl(var(--_color-control)/100%);box-shadow:0 0 0 0 hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;font-size:18px;font-weight:700;transition:color .12s,box-shadow .12s;display:flex}._button_16sag_6:hover{color:hsl(var(--_color-text)/100%);box-shadow:0 0 0 2px hsl(var(--_color-control)/100%)}._button_16sag_6:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._list_1kpxu_1{justify-content:space-between;display:flex}._icon_1kpxu_6{transition:transform .12s;transform:scale(1)}._button_1kpxu_11{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_1kpxu_11:disabled{cursor:default}._button_1kpxu_11{justify-content:center;align-items:center;width:40px;height:40px;display:flex}._button_1kpxu_11:hover ._icon_1kpxu_6{transform:scale(1.1)}._button_1kpxu_11:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._base_m4qio_1{max-width:100%}._rating_m4qio_5,._feedback_m4qio_6,._success_m4qio_7{width:320px}@media (width<=399px){._rating_m4qio_5,._feedback_m4qio_6,._success_m4qio_7{width:100%}}._list_whbas_1{justify-content:space-between;gap:6px;display:flex}@media (width<=599px){._list_whbas_1{flex-direction:column-reverse;gap:4px}}._button_whbas_13{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_whbas_13:disabled{cursor:default}._button_whbas_13{text-align:center;width:40px;height:40px;color:hsl(var(--_color-muted)/100%);background-color:hsl(var(--_color-control)/100%);box-shadow:0 0 0 0 hsl(var(--_color-control)/100%);border-radius:50%;font-size:18px;font-weight:700;transition:color .12s,box-shadow .12s;display:inline-block}._button_whbas_13:hover{color:hsl(var(--_color-text)/100%);box-shadow:0 0 0 2px hsl(var(--_color-control)/100%)}@media (width<=599px){._button_whbas_13:hover{box-shadow:none}}._button_whbas_13:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._button_whbas_13 ._score_whbas_52{display:inline}._button_whbas_13 ._label_whbas_55{display:none}@media (width<=599px){._button_whbas_13 ._label_whbas_55{display:inline}._button_whbas_13{border-radius:6px;width:100%;height:auto;padding:6px;font-size:14px;line-height:20px}._labels_whbas_75{display:none}}._base_12no3_1{max-width:100%}._rating_12no3_5{width:340px}@media (width<=599px){._rating_12no3_5{width:280px}}@media (width<=399px){._rating_12no3_5{width:100%}}._feedback_12no3_19,._success_12no3_20{width:280px}@media (width<=599px){._feedback_12no3_19,._success_12no3_20{width:100%}}._list_divjm_1{justify-content:space-between;gap:6px;display:flex}@media (width<=599px){._list_divjm_1{flex-direction:column-reverse;gap:4px}}._button_divjm_13{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_divjm_13:disabled{cursor:default}._button_divjm_13{text-align:center;width:40px;height:40px;color:hsl(var(--_color-muted)/100%);background-color:hsl(var(--_color-control)/100%);box-shadow:0 0 0 0 hsl(var(--_color-control)/100%);border-radius:50%;font-size:18px;font-weight:700;transition:color .12s,box-shadow .12s;display:block}._button_divjm_13:hover{color:hsl(var(--_color-text)/100%);box-shadow:0 0 0 2px hsl(var(--_color-control)/100%)}@media (width<=599px){._button_divjm_13:hover{box-shadow:none}}._button_divjm_13:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._button_divjm_13 ._score_divjm_52{display:inline}._button_divjm_13 ._label_divjm_55{display:none}@media (width<=599px){._button_divjm_13 ._label_divjm_55{display:inline}._button_divjm_13{border-radius:6px;width:100%;height:auto;padding:6px;font-size:14px;line-height:20px}._labels_divjm_75{display:none}}._base_1invl_1{max-width:100%}._rating_1invl_5{width:520px}@media (width<=599px){._rating_1invl_5{width:320px}}@media (width<=399px){._rating_1invl_5{width:100%}}._feedback_1invl_19,._success_1invl_20{width:280px}@media (width<=599px){._feedback_1invl_19,._success_1invl_20{width:100%}}
|
|
1
|
+
:root,:host{--_color-text:var(--ft-color-text,30 8% 14%);--_color-bg:var(--ft-color-bg,0 0% 100%);--_color-muted:var(--ft-color-muted,222 11% 46%);--_color-error:var(--ft-color-error,32 95% 44%);--_color-border:var(--ft-color-border,214 14% 83%);--_color-outline:var(--ft-color-outline,218 14% 65%);--_color-shadow:var(--ft-color-shadow,0 0% 0%);--_color-control:var(--ft-color-control,214 20% 96%);--_popup-z-index:var(--ft-popup-z-index,49);--_popup-head-offset:var(--ft-popup-head-offset,0);--_surface-padding:var(--ft-surface-padding,24px);--_surface-padding-mobile:var(--ft-surface-padding-mobile,20px);--_surface-radius:var(--ft-surface-radius,8px)}._base_d5qlz_1{padding:var(--_surface-padding);background-color:hsl(var(--_color-bg)/100%);border-radius:var(--_surface-radius);box-shadow:0 0 10px hsl(var(--_color-shadow)/20%);display:block;position:relative;overflow:auto}@media (width<=399px){._base_d5qlz_1{padding:var(--_surface-padding-mobile)}}._base_1vr2h_1{--_popup-head-offset:32px;z-index:var(--_popup-z-index);box-sizing:border-box;max-width:calc(100vw - var(--_surface-padding) * 2);max-height:calc(100vh - var(--_surface-padding) * 2);transform-origin:50% 100%;margin:0;display:flex;position:fixed}@media (width<=399px){._base_1vr2h_1{max-width:calc(100vw - var(--_surface-padding-mobile) * 2);max-height:calc(100vh - var(--_surface-padding-mobile) * 2)}}._animated_1vr2h_19{opacity:0;animation:.12s ease-in-out forwards _fadeForward_1vr2h_1}@keyframes _fadeForward_1vr2h_1{0%{opacity:0;transform:translateY(8px)scale(.92)}to{opacity:1;transform:translateY(0)scale(1)}}._topLeft_1vr2h_34{top:var(--_surface-padding);left:var(--_surface-padding)}@media (width<=399px){._topLeft_1vr2h_34{top:var(--_surface-padding-mobile);left:var(--_surface-padding-mobile)}}._topRight_1vr2h_45{top:var(--_surface-padding);right:var(--_surface-padding)}@media (width<=399px){._topRight_1vr2h_45{top:var(--_surface-padding-mobile);right:var(--_surface-padding-mobile)}}._bottomRight_1vr2h_56{right:var(--_surface-padding);bottom:var(--_surface-padding)}@media (width<=399px){._bottomRight_1vr2h_56{right:var(--_surface-padding-mobile);bottom:var(--_surface-padding-mobile)}}._bottomLeft_1vr2h_67{bottom:var(--_surface-padding);left:var(--_surface-padding)}@media (width<=399px){._bottomLeft_1vr2h_67{bottom:var(--_surface-padding-mobile);left:var(--_surface-padding-mobile)}}._close_1vr2h_78{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._close_1vr2h_78:disabled{cursor:default}._close_1vr2h_78{top:var(--_surface-padding);width:24px;height:24px;color:hsl(var(--_color-outline)/100%);transition:color .15s;position:absolute;inset-inline-end:var(--_surface-padding)}._close_1vr2h_78:hover{color:hsl(var(--_color-text)/100%)}._close_1vr2h_78:before,._close_1vr2h_78:after{content:"";background-color:currentColor;border-radius:1px;position:absolute;top:50%;left:50%;transform:rotate(45deg)}._close_1vr2h_78:before{width:16px;height:2px;margin:-1px 0 0 -8px}._close_1vr2h_78:after{width:2px;height:16px;margin:-8px 0 0 -1px}@media (width<=399px){._close_1vr2h_78{top:var(--_surface-padding-mobile);inset-inline-end:var(--_surface-padding-mobile)}}._sr_clg7k_1{white-space:nowrap;clip-path:inset(50%);border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}._subtext_clg7k_13{margin:0 0 16px;line-height:1.25}._input_clg7k_18{box-sizing:border-box;width:100%;color:hsl(var(--_color-text)/100%);background-color:hsl(var(--_color-bg)/100%);border:1px solid hsl(var(--_color-border)/100%);border-radius:var(--_surface-radius);outline:0 solid hsl(var(--_color-outline)/14%);padding:4px 12px;font-family:inherit;font-size:16px;line-height:1.5;transition:background-color .15s,border-color .15s,outline-width .2s}._input_clg7k_18:focus{outline:4px solid hsl(var(--_color-outline)/14%)}._input_clg7k_18._invalid_clg7k_35{border-color:hsl(var(--_color-error)/100%)}._input_clg7k_18._invalid_clg7k_35:focus{outline-color:hsl(var(--_color-error)/14%)}._submit_clg7k_42{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._submit_clg7k_42:disabled{cursor:default}._submit_clg7k_42{text-align:center;color:hsl(var(--_color-bg)/100%);background-color:hsl(var(--_color-text)/100%);border-radius:var(--_surface-radius);padding:8px 32px;font-size:16px;font-weight:400;transition:opacity .2s}._submit_clg7k_42:hover{opacity:.85}._submit_clg7k_42{width:100%;margin-top:16px}._skip_clg7k_74{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._skip_clg7k_74:disabled{cursor:default}._skip_clg7k_74{text-align:center;width:100%;color:hsl(var(--_color-muted)/100%);cursor:pointer;margin-top:8px;padding:4px;font-size:16px;font-weight:500;line-height:1.5;display:block}._skip_clg7k_74:hover{color:hsl(var(--_color-text)/100%)}._choices_nhux3_1{margin:0 0 12px}._choice_nhux3_1{display:flex}._choice_nhux3_1+._choice_nhux3_1{margin-top:12px}._label_nhux3_12{cursor:pointer;-webkit-user-select:none;user-select:none;align-items:flex-start;gap:8px;display:inline-flex;position:relative}._sr_nhux3_21{white-space:nowrap;clip-path:inset(50%);border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}._checkbox_nhux3_33{white-space:nowrap;clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}._check_nhux3_33{border:1px solid hsl(var(--_color-border)/100%);border-radius:4px;min-width:20px;height:20px}._label_nhux3_12:hover ._check_nhux3_33{border-color:hsl(var(--_color-text)/100%)}._checkbox_nhux3_33:focus-visible+._check_nhux3_33{outline:4px solid hsl(var(--_color-outline)/14%)}._checkbox_nhux3_33:checked+._check_nhux3_33{background-color:hsl(var(--_color-text)/100%);border-color:hsl(var(--_color-text)/100%);position:relative}._checkbox_nhux3_33:checked+._check_nhux3_33:after{content:"";border:2px solid;border-color:transparent transparent hsl(var(--_color-bg)/100%) hsl(var(--_color-bg)/100%);pointer-events:none;width:10px;height:4px;position:absolute;top:50%;left:50%;transform:translate(-45%,-75%)rotate(-45deg)}._input_nhux3_74{margin-top:8px;padding:4px 12px}._textarea_nhux3_79{height:120px;padding:8px 12px}._input_nhux3_74,._textarea_nhux3_79{box-sizing:border-box;width:100%;color:hsl(var(--_color-text)/100%);background-color:hsl(var(--_color-bg)/100%);border:1px solid hsl(var(--_color-border)/100%);border-radius:var(--_surface-radius);outline:0 solid hsl(var(--_color-outline)/14%);resize:none;font-family:inherit;font-size:16px;line-height:1.5;transition:background-color .15s,border-color .15s,outline-width .2s}._input_nhux3_74:focus,._textarea_nhux3_79:focus{outline:4px solid hsl(var(--_color-outline)/14%)}._submit_nhux3_104{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._submit_nhux3_104:disabled{cursor:default}._submit_nhux3_104{text-align:center;color:hsl(var(--_color-bg)/100%);background-color:hsl(var(--_color-text)/100%);border-radius:var(--_surface-radius);padding:8px 32px;font-size:16px;font-weight:400;transition:opacity .2s}._submit_nhux3_104:hover{opacity:.85}._submit_nhux3_104{width:100%;margin-top:16px}._skip_nhux3_136{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._skip_nhux3_136:disabled{cursor:default}._skip_nhux3_136{text-align:center;width:100%;color:hsl(var(--_color-muted)/100%);cursor:pointer;margin-top:8px;padding:4px;font-size:16px;font-weight:500;line-height:1.5;display:block}._skip_nhux3_136:hover{color:hsl(var(--_color-text)/100%)}._success_nhux3_166{text-align:center;padding:16px 0 32px;font-size:16px;font-weight:600;line-height:1.5}._base_1ilpx_1{text-align:center;padding:0 24px}._icon_1ilpx_6{display:inline-block}._base_1xpqq_1{color:hsl(var(--_color-text)/100%);padding:0;font-family:Helvetica Neue,Arial Nova,Helvetica,Arial,sans-serif}._head_1xpqq_7{padding-block:0 20px;padding-inline:0 var(--_popup-head-offset);gap:8px;display:flex}._title_1xpqq_14{flex:1 0;font-family:inherit;font-size:16px;font-style:normal;font-weight:500;line-height:1.4}._base_nswpf_1{margin:12px 0 0;display:flex}._label_nswpf_6{box-sizing:border-box;max-width:50%;color:hsl(var(--_color-muted)/100%);flex:0 0 50%;font-size:14px;line-height:1.4286}._between_nswpf_15{justify-content:space-between}._between_nswpf_15 ._label_nswpf_6{flex:0 0 50%;max-width:50%}._between_nswpf_15 ._label_nswpf_6:first-child{text-align:start}._between_nswpf_15 ._label_nswpf_6:last-child{text-align:end}._center_nswpf_29 ._label_nswpf_6{flex:0 0 50%;max-width:50%}._center_nswpf_29 ._label_nswpf_6:first-child{text-align:end;padding-right:8px}._center_nswpf_29 ._label_nswpf_6:last-child{text-align:start;padding-left:8px}._center_nswpf_29 ._text_nswpf_41{text-align:center;min-width:56px;display:inline-block}@media (width<=599px){._center_nswpf_29 ._text_nswpf_41{min-width:48px}}._list_grany_1{justify-content:center;gap:16px;display:flex}._icon_grany_7{transition:transform .12s;transform:scale(1)}._button_grany_12{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_grany_12:disabled{cursor:default}._button_grany_12{background-color:hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}._button_grany_12:hover ._icon_grany_7{transform:scale(1.15)}._button_grany_12:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}@media (width<=399px){._button_grany_12{width:48px;height:48px}}._list_1yzyr_1{justify-content:center;gap:16px;display:flex}._icon_1yzyr_7{transition:transform .12s;transform:scale(1)}._button_1yzyr_12{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_1yzyr_12:disabled{cursor:default}._button_1yzyr_12{background-color:hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}._button_1yzyr_12:hover ._icon_1yzyr_7{transform:scale(1.15)}._button_1yzyr_12:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._base_1nccq_1{max-width:100%}._rating_1nccq_5,._feedback_1nccq_6,._contact_1nccq_7,._success_1nccq_8{width:280px}@media (width<=399px){._rating_1nccq_5,._feedback_1nccq_6,._contact_1nccq_7,._success_1nccq_8{width:100%}}._list_1vfe4_1{justify-content:space-between;display:flex}._icon_1vfe4_6{transition:transform .12s;transform:scale(1)}._button_1vfe4_11{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_1vfe4_11:disabled{cursor:default}._button_1vfe4_11{background-color:hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex}._button_1vfe4_11:hover ._icon_1vfe4_6{transform:scale(1.15)}._button_1vfe4_11:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}@media (width<=399px){._button_1vfe4_11{width:48px;height:48px}}._list_16sag_1{justify-content:space-between;display:flex}._button_16sag_6{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_16sag_6:disabled{cursor:default}._button_16sag_6{width:40px;height:40px;color:hsl(var(--_color-muted)/100%);background-color:hsl(var(--_color-control)/100%);box-shadow:0 0 0 0 hsl(var(--_color-control)/100%);border-radius:50%;justify-content:center;align-items:center;font-size:18px;font-weight:700;transition:color .12s,box-shadow .12s;display:flex}._button_16sag_6:hover{color:hsl(var(--_color-text)/100%);box-shadow:0 0 0 2px hsl(var(--_color-control)/100%)}._button_16sag_6:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._list_1kpxu_1{justify-content:space-between;display:flex}._icon_1kpxu_6{transition:transform .12s;transform:scale(1)}._button_1kpxu_11{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_1kpxu_11:disabled{cursor:default}._button_1kpxu_11{justify-content:center;align-items:center;width:40px;height:40px;display:flex}._button_1kpxu_11:hover ._icon_1kpxu_6{transform:scale(1.1)}._button_1kpxu_11:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._base_sfbnw_1{max-width:100%}._rating_sfbnw_5,._feedback_sfbnw_6,._contact_sfbnw_7,._success_sfbnw_8{width:320px}@media (width<=399px){._rating_sfbnw_5,._feedback_sfbnw_6,._contact_sfbnw_7,._success_sfbnw_8{width:100%}}._list_whbas_1{justify-content:space-between;gap:6px;display:flex}@media (width<=599px){._list_whbas_1{flex-direction:column-reverse;gap:4px}}._button_whbas_13{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_whbas_13:disabled{cursor:default}._button_whbas_13{text-align:center;width:40px;height:40px;color:hsl(var(--_color-muted)/100%);background-color:hsl(var(--_color-control)/100%);box-shadow:0 0 0 0 hsl(var(--_color-control)/100%);border-radius:50%;font-size:18px;font-weight:700;transition:color .12s,box-shadow .12s;display:inline-block}._button_whbas_13:hover{color:hsl(var(--_color-text)/100%);box-shadow:0 0 0 2px hsl(var(--_color-control)/100%)}@media (width<=599px){._button_whbas_13:hover{box-shadow:none}}._button_whbas_13:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._button_whbas_13 ._score_whbas_52{display:inline}._button_whbas_13 ._label_whbas_55{display:none}@media (width<=599px){._button_whbas_13 ._label_whbas_55{display:inline}._button_whbas_13{border-radius:6px;width:100%;height:auto;padding:6px;font-size:14px;line-height:20px}._labels_whbas_75{display:none}}._base_tj93m_1{max-width:100%}._rating_tj93m_5{width:340px}@media (width<=599px){._rating_tj93m_5{width:280px}}@media (width<=399px){._rating_tj93m_5{width:100%}}._feedback_tj93m_19,._contact_tj93m_20,._success_tj93m_21{width:280px}@media (width<=599px){._feedback_tj93m_19,._contact_tj93m_20,._success_tj93m_21{width:100%}}._list_divjm_1{justify-content:space-between;gap:6px;display:flex}@media (width<=599px){._list_divjm_1{flex-direction:column-reverse;gap:4px}}._button_divjm_13{appearance:none;text-align:center;box-shadow:none;cursor:pointer;background-color:#0000;border:none;margin:0;padding:0;font-family:inherit}._button_divjm_13:disabled{cursor:default}._button_divjm_13{text-align:center;width:40px;height:40px;color:hsl(var(--_color-muted)/100%);background-color:hsl(var(--_color-control)/100%);box-shadow:0 0 0 0 hsl(var(--_color-control)/100%);border-radius:50%;font-size:18px;font-weight:700;transition:color .12s,box-shadow .12s;display:block}._button_divjm_13:hover{color:hsl(var(--_color-text)/100%);box-shadow:0 0 0 2px hsl(var(--_color-control)/100%)}@media (width<=599px){._button_divjm_13:hover{box-shadow:none}}._button_divjm_13:focus-visible{outline:2px solid hsl(var(--_color-outline)/100%)}._button_divjm_13 ._score_divjm_52{display:inline}._button_divjm_13 ._label_divjm_55{display:none}@media (width<=599px){._button_divjm_13 ._label_divjm_55{display:inline}._button_divjm_13{border-radius:6px;width:100%;height:auto;padding:6px;font-size:14px;line-height:20px}._labels_divjm_75{display:none}}._base_kj5ew_1{max-width:100%}._rating_kj5ew_5{width:520px}@media (width<=599px){._rating_kj5ew_5{width:320px}}@media (width<=399px){._rating_kj5ew_5{width:100%}}._feedback_kj5ew_19,._contact_kj5ew_20,._success_kj5ew_21{width:280px}@media (width<=599px){._feedback_kj5ew_19,._contact_kj5ew_20,._success_kj5ew_21{width:100%}}
|
|
2
2
|
/*$vite$:1*/
|
package/dist/index.d.ts
CHANGED
|
@@ -7,6 +7,25 @@ export declare interface CES7SurveyProps extends SharedSurveyProps {
|
|
|
7
7
|
scaleStyle: 'numbers';
|
|
8
8
|
}
|
|
9
9
|
|
|
10
|
+
/**
|
|
11
|
+
* Callback function for contact submission
|
|
12
|
+
* @param payload - The collected contact data
|
|
13
|
+
* @returns void or Promise<void> for async operations
|
|
14
|
+
*/
|
|
15
|
+
export declare type ContactCallback = (payload: ContactSubmitPayload) => void | Promise<void>;
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* Payload sent when submitting collected contact
|
|
19
|
+
*/
|
|
20
|
+
export declare interface ContactSubmitPayload {
|
|
21
|
+
/** Selected rating value */
|
|
22
|
+
value?: number;
|
|
23
|
+
/** Submitted feedback text or selected choices */
|
|
24
|
+
text?: string | string[];
|
|
25
|
+
/** Respondent's email address */
|
|
26
|
+
email: string;
|
|
27
|
+
}
|
|
28
|
+
|
|
10
29
|
export declare const CSAT2Survey: default_2.FC<CSAT2SurveyProps>;
|
|
11
30
|
|
|
12
31
|
export declare interface CSAT2SurveyProps extends SharedSurveyProps {
|
|
@@ -57,6 +76,8 @@ export declare interface RootClassNames {
|
|
|
57
76
|
rating?: string;
|
|
58
77
|
/** Feedback screen wrapper */
|
|
59
78
|
feedback?: string;
|
|
79
|
+
/** Contact screen wrapper */
|
|
80
|
+
contact?: string;
|
|
60
81
|
/** Success screen wrapper */
|
|
61
82
|
success?: string;
|
|
62
83
|
/** Close button element */
|
|
@@ -103,15 +124,31 @@ export declare interface SharedSurveyProps {
|
|
|
103
124
|
/** Follow-up feedback question (screen 2) */
|
|
104
125
|
textQuestion?: string;
|
|
105
126
|
/** Submit button text */
|
|
106
|
-
|
|
127
|
+
textButtonSendLabel?: string;
|
|
128
|
+
/** Skip button text */
|
|
129
|
+
textButtonSkipLabel?: string;
|
|
107
130
|
/** Optional predefined choices for feedback */
|
|
108
131
|
choiceOptions?: string[] | null;
|
|
109
132
|
/** Success message text */
|
|
110
133
|
thankYouMessage: string;
|
|
134
|
+
/** Enables an optional email collection step before the success screen. Skipped when `userId` is already provided */
|
|
135
|
+
collectContact?: boolean;
|
|
136
|
+
/** Existing user identity, if already known. When provided, the email collection step is skipped */
|
|
137
|
+
userId?: string;
|
|
138
|
+
/** Question shown on the contact collection screen */
|
|
139
|
+
contactQuestion?: string;
|
|
140
|
+
/** Descriptive text shown above the email input */
|
|
141
|
+
contactSubtext?: string;
|
|
142
|
+
/** Submit button text for the contact collection screen */
|
|
143
|
+
contactButtonSendLabel?: string;
|
|
144
|
+
/** Skip button text for the contact collection screen */
|
|
145
|
+
contactButtonSkipLabel?: string;
|
|
111
146
|
/** Callback when score data is submitted */
|
|
112
147
|
onScoreSubmit?: SurveyCallback;
|
|
113
148
|
/** Callback when survey data is submitted */
|
|
114
149
|
onFeedbackSubmit?: SurveyCallback;
|
|
150
|
+
/** Callback when contact is submitted */
|
|
151
|
+
onContactSubmit?: ContactCallback;
|
|
115
152
|
}
|
|
116
153
|
|
|
117
154
|
export declare const Surface: React.FC<SurfaceProps>;
|
|
@@ -131,10 +168,12 @@ export declare type SurveyCallback = (payload: SurveySubmitPayload) => void | Pr
|
|
|
131
168
|
export declare type SurveyScreen =
|
|
132
169
|
/** Rating screen (first screen) */
|
|
133
170
|
'rating'
|
|
134
|
-
/** Final "thanks" message screen */
|
|
135
|
-
| 'success'
|
|
136
171
|
/** Feedback input screen */
|
|
137
|
-
| 'feedback'
|
|
172
|
+
| 'feedback'
|
|
173
|
+
/** Optional email/contact collection screen */
|
|
174
|
+
| 'contact'
|
|
175
|
+
/** Final "thanks" message screen */
|
|
176
|
+
| 'success';
|
|
138
177
|
|
|
139
178
|
/**
|
|
140
179
|
* Payload sent when submitting survey data
|