Plan Quiz Section
A three-question which-plan-fits quiz with choice cards, progress dots, back and next, and a recommended plan with reasons, a call to action and a compare link.
Preview
Not sure?
Which plan fits?
Three quick questions and we’ll point you to the right plan. You can change plans any time.
Compare all plans →- Question 1 (current)
- Question 2
- Question 3
- Result
How many people will use it?
Not sure?
Your match
Compare all plans →- Question 1 (answered)
- Question 2 (answered)
- Question 3 (answered)
- Result
We’d suggest
Team
€12 / personShared studies, boards and comments.
- Priced for small teams that share studies.
- Boards and comments for synthesising together.
- Roles and guest access are included.
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| questions | QuizQuestion[] | — | Questions { id, question, options: { id, label, hint?, icon?, scores, why? }[] }. |
| plans | QuizPlan[] | — | Plans { id, name, price, blurb?, href }; earlier plans win ties. |
| defaultAnswers | Record<string, string> | {} | Answers at first; all answered starts on the result. |
| compareHref | string | — | Compare all plans link. |
| onResult | (plan, answers) => void | — | Called when the result is shown. |
| title | ReactNode | "Which plan fits?" | Section heading. |
| description | ReactNode | — | Line under the heading. |
| eyebrow | ReactNode | "Not sure?" | Label above the heading. |
| headingLevel | 2 | 3 | 2 | Heading level of the title. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.