Interactive Components

Interactive Components exports a CodeBlockRenderer that can be used when using react-markdown.
Here are the list of components that it currently supports

Sort Game

https://aarvalabs.imfast.io/home/sel_smiley.png
https://aarvalabs.imfast.io/arjunsundararajan/chatbot.png
https://aarvalabs.imfast.io/arjunsundararajan/aarva2.png
https://aarvalabs.imfast.io/arjunsundararajan/books_changed_my_mind.png
https://aarvalabs.imfast.io/arjunsundararajan/wsdt.png
https://aarvalabs.imfast.io/home/precis_promo_1.png

Audio

https://aarvalabs.imfast.io/home/activity/listening_spot_the_error_1.mp3

SortPoll

---
pollId: "interactive_test_sortpoll"
---
This is choice 11
this is choice 22
This is choice 33

Photo

---
image: https://aarvalabs.imfast.io/home/sel_smiley.png
align: right
size: 25%
---

Single Question

---
questionId: interactive_test_singlequestion
question: Who are you man ? 
lines: 3
---

Screen Shot

https://aarvalabs.imfast.io/home/precis_promo_1.png

Question Set

---
questionId: interactive_test_questionset
title: "Beta Participant Survey"
---
---
type: multiplechoice
question: "What's your age ?"
choices: ["10-25", "26-40", "41-100"]
---
+++
---
type: text
question: Who are you man ? 
lines: 3
---

Card

---
title: "Spot the error"
text: "Activity for 8-12 year olds"
link: "/page/activity_listening_spot_the_error_1"
---

CardDeck

---
title: Listening 
---
<b>Guess What?</b> game to develop the skill for listening clues! 
+++
Guess what is brown and green and grows very  tall 

TREE
+++
Guess what has four wheels and goes vrooom

CAR
+++
Guess what has head foot and four legs 

BED
+++
Guess what lets you in and out

DOOR
+++
Guess what is round, square , or other shapes and holds clothes together? 

BUTTONS
+++
Guess what is <describe the child> (child’s name)

Flip Card

---
front: "Example with image "
frontImage: "https://aarvalabs.imfast.io/home/sel_smiley.png"
back: "Back - Fancy purple"
backImage: "https://aarvalabs.imfast.io/arjunsundararajan/wsdt.png"
---