Flip Direction
Demonstrates different flip directions for the flashcards.
Demo
What is the capital of Alaska?
Juneau
1/7
Code Example
export function FlipDirectionDemo() {
const [dir, setDir] = useState<FlipDirection>('bt')
const flipArrayHook = useFlashcardArray({
deckLength: deck.length,
flipDirection: dir,
})
return (
<Fragment>
<FlashcardArray
deck={deck}
flipArrayHook={flipArrayHook}
/>
<select
value={dir}
onChange={(e) => setDir(e.target.value as FlipDirection)}
>
<option value='bt'>Bottom to Top</option>
<option value='tb'>Top to Bottom</option>
<option value='ltr'>Left to Right</option>
<option value='rtl'>Right to Left</option>
</select>
</Fragment>
)
}