import React, { useState } from "react";
import { CinematicLine } from "./CinematicLine";
import Typography from "@mui/material/Typography";
import Button from "@mui/material/Button";
interface IProps {
lines: string[];
auto?: boolean;
onDone?: () => void;
}
export function CinematicText(props: IProps): React.ReactElement {
const [i, setI] = useState(0);
const [done, setDone] = useState(false);
function advance(): void {
const newI = i + 1;
setI(newI);
if (newI >= props.lines.length) {
if (props.onDone && props.auto) props.onDone();
setDone(true);
}
}
return (
<>
{props.lines.slice(0, i).map((line, i) => (
{line}
))}
{props.lines.length > i && }
{!props.auto && props.onDone && done && }
>
);
}