Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x | 'use client'
import { AbacusReact } from '@soroban/abacus-react'
interface AbacusTargetProps {
number: number // The complement number to display
}
/**
* Displays a small abacus showing a complement number inline in the equation
* Used to help learners recognize the abacus representation of complement numbers
*/
export function AbacusTarget({ number }: AbacusTargetProps) {
return (
<div
style={{
display: 'inline-flex',
alignItems: 'center',
justifyContent: 'center',
lineHeight: 0,
}}
>
<AbacusReact
value={number}
columns={1}
compact={true}
interactive={false}
showNumbers={false}
hideInactiveBeads={true}
scaleFactor={0.72}
/>
</div>
)
}
|