Page

H5P equivalent

H5P Interactive Book (page)

When to use

Use Page as a child of InteractiveBook — one chapter or section in a paginated handbook. Pages can contain any allowed content blocks and assessments.

Do not mount Page directly under Lesson; always wrap with InteractiveBook.

Requirements

  • Each Page needs blockId and title.

  • Book navigation and resume state are handled by the parent compound.

Try it

Documentation demo

Use the Live demo, React, AI prompt, and Packaging / Manifest tabs below. Embedded demos disable telemetry, xAPI, and the LMS bridge. For production delivery, use the CLI template src/courseConfig.ts and LMS Go-Live.

Open demo in full tab 

<InteractiveBook blockId="policy-digest" title="Policy digest">
  <Page blockId="reporting" title="Reporting">
    <Text>Report incidents within one hour.</Text>
    <TrueFalse checkId="page-tf" question="Forwarding suspicious mail counts as reporting." answer={false} />
  </Page>
</InteractiveBook>

Copy into Cursor, Copilot, or ChatGPT after the vibe coding starter context:

Read lessonkit.json and src/App.tsx before editing.

Add a Page block (H5P-style: Interactive Book (page)) like this example inside the active <Lesson>:

<InteractiveBook blockId="policy-digest" title="Policy digest">
  <Page blockId="reporting" title="Reporting">
    <Text>Report incidents within one hour.</Text>
    <TrueFalse checkId="page-tf" question="Forwarding suspicious mail counts as reporting." answer={false} />
  </Page>
</InteractiveBook>

Requirements:
- Import only from @lessonkit/react; use block types from block-catalog.v3.json.
- Keep existing courseId, lessonId, and navigation stable unless I ask to add a lesson.
- Mount only inside the documented parent compound (see component page When to use).
Packaging notes:
`Page` has no manifest entry — it is a child of [`InteractiveBook`](interactive-book.md).
- Each `Page` needs a stable **`blockId`** for compound resume when persistence is enabled.
- The parent book owns navigation and stored state.
- Mirror any nested **`checkId`** values in `course.assessments[]` like standalone assessments.

- After edits, list changed files and what to verify in the browser (lessonkit dev).

Workflow tips: https://lessonkit.readthedocs.io/en/latest/guides/vibe-coding/prompting-and-workflows.html

Page has no manifest entry — it is a child of InteractiveBook.

  • Each Page needs a stable blockId for compound resume when persistence is enabled.

  • The parent book owns navigation and stored state.

  • Mirror any nested checkId values in course.assessments[] like standalone assessments.

See also