Personal_mirrors/bitburner-src
1
0
Fork 0
mirror of https://github.com/bitburner-official/bitburner-src.git synced 2024-12-24 07:02:26 +01:00
Code Issues Packages Projects Releases Wiki Activity

convert autocomplete to tooltip

Browse Source
This commit is contained in:
Olivier Gagnon 2021-10-04 17:52:20 -04:00
parent 27fc90c87a
commit 33ea31be87
1 changed files with 37 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/Terminal/ui/TerminalInput.tsx
View File

@ -4,7 +4,7 @@ import { Theme } from "@mui/material/styles";
import makeStyles from "@mui/styles/makeStyles"; import makeStyles from "@mui/styles/makeStyles";
import createStyles from "@mui/styles/createStyles"; import createStyles from "@mui/styles/createStyles";
import TextField from "@mui/material/TextField"; import TextField from "@mui/material/TextField";
import Paper from "@mui/material/Paper"; import Tooltip from "@mui/material/Tooltip";
import { KEY } from "../../utils/helpers/keyCodes"; import { KEY } from "../../utils/helpers/keyCodes";
import { ITerminal } from "../ITerminal"; import { ITerminal } from "../ITerminal";
@ -18,7 +18,6 @@ const useStyles = makeStyles((theme: Theme) =>
createStyles({ createStyles({
textfield: { textfield: {
margin: theme.spacing(0), margin: theme.spacing(0),
width: "100%",
}, },
input: { input: {
backgroundColor: "#000", backgroundColor: "#000",
@ -330,23 +329,30 @@ export function TerminalInput({ terminal, router, player }: IProps): React.React
return ( return (
<> <>
{possibilities.length > 0 && ( <Tooltip
<Paper square> title={
possibilities.length > 0 ? (
<>
<Typography classes={{ root: classes.preformatted }} color={"primary"} paragraph={false}> <Typography classes={{ root: classes.preformatted }} color={"primary"} paragraph={false}>
Possible autocomplete candidate: Possible autocomplete candidate:
</Typography> </Typography>
<Typography classes={{ root: classes.preformatted }} color={"primary"} paragraph={false}> <Typography classes={{ root: classes.preformatted }} color={"primary"} paragraph={false}>
{possibilities.join(" ")} {possibilities.join(" ")}
</Typography> </Typography>
</Paper> </>
)} ) : (
""
)
}
>
<TextField <TextField
fullWidth
color={terminal.action === null ? "primary" : "secondary"} color={terminal.action === null ? "primary" : "secondary"}
autoFocus autoFocus
disabled={terminal.action !== null} disabled={terminal.action !== null}
autoComplete="off" autoComplete="off"
classes={{ root: classes.textfield }}
value={value} value={value}
classes={{ root: classes.textfield }}
onChange={handleValueChange} onChange={handleValueChange}
inputRef={terminalInput} inputRef={terminalInput}
InputProps={{ InputProps={{
@ -354,16 +360,15 @@ export function TerminalInput({ terminal, router, player }: IProps): React.React
id: "terminal-input", id: "terminal-input",
className: classes.input, className: classes.input,
startAdornment: ( startAdornment: (
<>
<Typography color={terminal.action === null ? "primary" : "secondary"} flexShrink={0}> <Typography color={terminal.action === null ? "primary" : "secondary"} flexShrink={0}>
[{player.getCurrentServer().hostname}&nbsp;~{terminal.cwd()}]&gt;&nbsp; [{player.getCurrentServer().hostname}&nbsp;~{terminal.cwd()}]&gt;&nbsp;
</Typography> </Typography>
</>
), ),
spellCheck: false, spellCheck: false,
onKeyDown: onKeyDown, onKeyDown: onKeyDown,
}} }}
></TextField> ></TextField>
</Tooltip>
</> </>
); );
} }