Choice Interaction
Choice interactions model single-choice or multiple-choice questions with a prompt and a list of selectable options.
Install
pnpm add @citolab/prose-qtiThe choice interaction is exposed as a subpath export from @citolab/prose-qti, so you import it from @citolab/prose-qti/components/choice and register the custom elements with @citolab/prose-qti/components/choice/register.
Usage
Use the register side effect once, then call the insert command from your editor integration:
import '@citolab/prose-qti/components/choice/register';import { insertChoiceInteraction } from '@citolab/prose-qti/components/choice';
insertChoiceInteraction(view.state, view.dispatch, view);This package integrates with @qti-components/choice-interaction through the shared qti-components ecosystem.
What it does
- Inserts a
qti-choice-interactionnode with a prompt and placeholder choices. - Supports editing choice text directly in the editor.
- Supports single- and multiple-response authoring through interaction attributes.
- Works with conversion flows that turn selected text blocks into choice structures.
In the editor
- Edit the prompt by clicking into the prompt area and typing.
- Edit choice text by clicking into any choice and typing.
- Add a choice by pressing
Enterat the end of a choice — a new sibling choice is inserted automatically. - Mark correct responses by clicking the radio button or checkbox next to a choice.