<ed-pb> component

A webcomponent to easily write problems in education.

import "@ed-components/ed-components/ed-pb";

Usage

This wrapper component allows to easily write problems with ed-components.

Some specific markdown is wrapped inside an adapted ed-components.

  1. Task-list are wrapped into <ed-choice> for single and multiple-choice answers.
  2. Unordered lists with score metadata(:100:) are wrapped into <ed-ans> for text answers, when the page defines it: <ed-ans> is a work in progress, not part of the bundle. Otherwise the question is left without answer.
  3. Unordered lists with num metadata(:num:) are wrapped into <ed-num> for numeric answers.
  4. Unordered lists with say metadata(:say:) are wrapped into <ed-speech> for spoken answers, in the page language.

A question is written the same way in a problem and in its element alone, see the Educational Markdown specification.

<ed-pb>
# You can include a title

## Exercice

> This is a note. Who'd have noted?

1.  Each numeric element list  is turned into a question.

    You can provide some context, and even include sub-questions.

    Under the hood the two sub-answers here use `ed-choice` component.

    
    1. Subquestion 2.1.

       A gfm task-list with _one checked answer_ will be turned into a **single choice question**.

       - [ ] first false answer
       - [x] This is true
       - [ ] third false answer
    
    1. Subquestion 2.2.

       A gfm task-list with _more than one checked answer_ will be turned into a **multiple choice question**.

       - [ ] first false answer
       - [x] This is true
       - [x] This is also true
       - [ ] false also

    However you can use unordered lists in your markdown content. 
    
    - Hello
    - World

1. You can also use `ed-num` component for numeric answers.
   
   1. How many Wonders of the ancient World were present during classical
      antiquity?

      - :num: 7

   1. How many Wonders of the ancient World are still in existence?

      - :num: 1
       
</ed-pb>

Feedbacks

A blockquote right after the list of a choice, numeric or speech question is its feedback, such as the solution, shown once the learner answered (see the feedbacks of ed-choice and ed-num).

<ed-pb>
1. What is $E$ in $E=mc^2$?

   - [ ] mass
     > No, $m$ is the mass.
   - [x] energy

   > $E$ is the energy, $m$ the mass and $c$ the speed of light.

1. How many Wonders of the ancient World are still in existence?

   - :num: 1

   > Only the Great Pyramid of Giza.
</ed-pb>

emd attribute

You can provide the emd content as an attribute to allow re-rendering the component on change. In that case, innerHTML content is totally ignored.

<ed-pb emd="# Hello emd
1. Are you happy with educational markdown?
   - [x] Yes
   - [ ] No">
_This content wiil not be used_
</ed-pb>

Credits

This component rely on micromark to parse markdown in the client-side.