ExercisesComponents
ExerciseFeedback
Default success and failure handlers for nested exercises
Context provider that supplies default onSuccess / onFailure callbacks to nested exercises. Per-exercise props override these defaults.
Use this when several exercises on a page should share the same feedback (a sound, a notification, analytics). Full examples live under Exercise feedback, including how to import sound files from src so they play after a production build.
Example
import { ExerciseFeedback, YesNo, PickOne } from "@bside-tech/tbx-ui/components";
import { playSuccessSound, playTryAgainSound } from "@/book/sounds";
export function LessonExercises() {
return (
<ExerciseFeedback
onSuccess={playSuccessSound}
onFailure={playTryAgainSound}
>
<YesNo
entries={[
{ text: "The sky is blue.", answer: true },
{ text: "Water boils at 0°C.", answer: false },
]}
/>
<PickOne
entries={[{
text: "Capital of France?",
choices: [
{ value: "london", label: "London" },
{ value: "paris", label: "Paris" },
],
answer: "paris",
}]}
onSuccess={() => {
playSuccessSound();
console.log("capital question correct");
}}
/>
</ExerciseFeedback>
);
}The second exercise still plays the default success sound, then runs its own extra console.log.