TBX Docs
ExercisesHooks

useCompareGrid

Compare user-filled grid against solution

Used by Crosswords. Per-word validation via legend with position, direction, clue, and solution.

Key returns

PropertyDescription
gridCurrent grid state
setCellSet a cell value
wordResultsValidation result per word
isCorrectWhether grid matches solution
checkValidate grid
resetReset to initial state
getLegendIdGet legend id for a word

Example

import { useCompareGrid } from '@bside-tech/tbx-ui/hooks';

const solutionGrid = [
  ['C', 'A', 'T', ' '],
  [' ', ' ', ' ', ' '],
  ['D', 'O', 'G', ' '],
];

const legend = [
  { clue: 'Feline', solution: 'CAT' },
  { clue: 'Canine', solution: 'DOG' },
];

const { grid, setCell, wordResults, isCorrect, check, reset, getLegendId } = useCompareGrid({
  solutionGrid,
  legend,
  checkOn: 'manual',
});

// User types into cell (row, col)
setCell(0, 0, 'C');
setCell(0, 1, 'A');
setCell(0, 2, 'T');

// After check(), wordResults maps legend id → boolean per word
check();

On this page