Overview

TBX provides a set of interactive exercise components for building textbooks and learning materials. Each component integrates with ExerciseGroup for grouped scoring and supports checkOn for manual or automatic validation.

Import

All exercise components are imported from @bside-tech/tbx-ui:

import { YesNo, PickOne, PickMulti, InlineText, InlineChoices } from '@bside-tech/tbx-ui/components';
import { ConnectPoints, Crosswords, FindWords, SortList, GroupItems, MarkWords } from '@bside-tech/tbx-ui/components';
import { ExerciseGroup, ExerciseLayout, ExerciseResults, ExerciseValidation } from '@bside-tech/tbx-ui/components';
import { useExerciseGroup, useFillBlanksExercise, usePickMultiExercise } from '@bside-tech/tbx-ui/hooks';

Global styles

Exercise styles must be loaded globally. Add the following import to src/book/custom.css:

@import "@bside-tech/tbx-ui/styles";

This is required for all exercise components to render correctly.

What's in this section

• Common patterns — Shared behavior across all exercises: labels, checkOn, classNames, and ExerciseGroup integration
• Hooks — Low-level hooks for building custom exercise types
• Components — Building blocks used by exercises: ExerciseLayout, ExerciseGroup, ExerciseResults, ExerciseValidation

Browse the Catalogue for the full list of built-in exercise types with examples and props.