braze NPS survey (#15)

* braze NPS survey

* readme

* readme

.prettierrc

@@ -0,0 +1,9 @@
+{
+  "tabWidth": 2,
+  "useTabs": false,
+  "singleQuote": true,
+  "semi": true,
+  "trailingComma": "es5",
+  "bracketSameLine": true,
+  "htmlWhitespaceSensitivity": "ignore"
+}

README.md

@@ -35,6 +35,7 @@ The following templates are all mobile and desktop responsive! Simply swap out t
 | [Braze Survey Modal][103] | :iphone: :computer: | A survey templates which logs custom attributes for retargeting. | [<img alt="screenshot" src="braze-templates/3-braze-dashboard-survey-modal/mobile.png" height="300"/>][103] |
 | [Braze SMS Modal][104] | :iphone: :computer: | Collect phone numbers to use with Braze SMS. | [<img alt="screenshot" src="braze-templates/4-sms-capture-modal/screenshot.gif" width="300"/>][103] |
 | [Braze Email Capture Modal][105] | :iphone: :computer: | Collect email addresses to use within Braze. | [<img alt="screenshot" src="braze-templates/5-email-capture-modal/screenshot.gif" width="300"/>][103] |
+| [Braze NPS][106] | :computer: | NPS Survey for quantitative and qualitative feedback. | [<img alt="screenshot" src="braze-templates/6-braze-nps/screenshot.gif" width="300" />][106]
 
 ## Community Gallery
 
@@ -61,3 +62,4 @@ To view our legacy templates which used `.zip` files, [click here][5].
 [103]: braze-templates/3-braze-dashboard-survey-modal
 [104]: braze-templates/4-sms-capture-modal
 [105]: braze-templates/5-email-capture-modal
+[106]: braze-templates/6-braze-nps

braze-templates/6-braze-nps/README.md

@@ -0,0 +1,17 @@
+# Instructions
+
+Replace the following variables to customize your NPS Survey:
+
+| variable         | description                                                                             | required? |
+| ---------------- | --------------------------------------------------------------------------------------- | --------- |
+| `SURVEY_ID`      | This ID will be used to log a custom event and custom attribute upon survey submission. | Yes       |
+| `QUANT_QUESTION` | The initial question presented in the survey.                                           | Yes       |
+| `QUAL_QUESTION`  | The followup question presented with a feedback textarea.                               | No        |
+| `AVATAR_IMAGE`   | An optional image to display on top of the survey.                                      | No        |
+| `THANKYOU_TEXT`  | The "Thank You" message displayed after completing the survey.                          | No        |
+| `SUBHEADER_TEXT` | An optional smaller text to display underneath the initial question.                    | No        |
+| `CHOICES`        | An ordered list of choice names. You can remove choices for fewer options.              | No        |
+
+# Demo
+
+<img alt="screenshot" src="screenshot.gif" height="500"/>