HTML form based component for gathering customer satisfaction data
npm install @springernature/global-customer-satisfaction-inputThe Global Customer Satisfaction Input component is the frontend for an overall solution for gathering customer satisfaction feedback, the documentation for which can be found here: https://customer-satisfaction-survey.public.springernature.app/docs/introduction.
The component comprises a set of 5 pictographic radio inputs used to collect a satisfaction score from our customers. The user is able to submit one of the following scores: Awful, Bad, OK, Good, Great.
It is a JavaScript dependent component. When a user interacts with the component an event is dispatched to window.dataLayer allowing customer satisfaction score data and context data scraped from the page to be sent to Google Tag Manager and Google Cloud Big Query.
Projects that do not use Elements section below.shell
npm install @springernature/global-customer-satisfaction-input
`
You will also need to ensure you have its dependencies installed: Brand Context.`shell
npm install @springernature/brand-context@32.0.0
`$3
Include the necessary Sass files in your project in this order (if they are not already there!):
`sass
@import '@springernature/brand-context/[YOUR BRAND HERE]/scss/core.scss';
@import '@springernature/brand-context/[YOUR BRAND HERE]/scss/enhanced.scss';
@import '@springernature/global-customer-satisfaction-input/scss/10-settings/default.scss';
@import '@springernature/global-customer-satisfaction-input/scss/50-components/customer-satisfaction-input';
@import '@springernature/brand-context/default/scss/60-utilities/hiding.scss';
`$3
Include the component JavaScript in your application bundle:
`js
import {customerSatisfactionInput} from '@springernature/global-customer-satisfaction-input';customerSatisfactionInput();
`$3
Consume the component's Handlebars view template found in the /view/ directoryIf you are unable to consume view templates in your project you can still use this component. Use the component demo to generate the HTML. This can be done as follows:
1. Edit the JSON data file found at
/demo/context.json and define the data you need for your instance (see below Data section)
2. Run npm run demo -- -p global-customer-satisfaction-input
3. Copy the