Personal_mirrors/bitburner-src
1
0
Fork 0
mirror of https://github.com/bitburner-official/bitburner-src.git synced 2024-11-23 08:03:48 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1280 from danielyxie/mui5

Browse Source 
Mui5
This commit is contained in:
hydroflame 2021-09-16 20:14:47 -04:00 committed by GitHub
commit 6d70d9708f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
56 changed files with 2070 additions and 1273 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
css/menupages.scss
View File

@ -8,9 +8,6 @@
-ms-overflow-style: none; /* for Internet Explorer, Edge */ -ms-overflow-style: none; /* for Internet Explorer, Edge */
scrollbar-width: none; /* for Firefox */ scrollbar-width: none; /* for Firefox */
flex-grow: 1; flex-grow: 1;
overflow-y: scroll;
height: 100vh;
bottom: 0px;
} }
#generic-react-container::-webkit-scrollbar { #generic-react-container::-webkit-scrollbar {

4
dist/engine.bundle.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/engineStyle.bundle.js vendored
View File

@ -1,2 +1,2 @@
!function(n){function t(t){for(var e,i,f=t[0],c=t[1],l=t[2],a=0,s=[];a<f.length;a++)i=f[a],Object.prototype.hasOwnProperty.call(r,i)&&r[i]&&s.push(r[i][0]),r[i]=0;for(e in c)Object.prototype.hasOwnProperty.call(c,e)&&(n[e]=c[e]);for(p&&p(t);s.length;)s.shift()();return u.push.apply(u,l||[]),o()}function o(){for(var n,t=0;t<u.length;t++){for(var o=u[t],e=!0,f=1;f<o.length;f++){var c=o[f];0!==r[c]&&(e=!1)}e&&(u.splice(t--,1),n=i(i.s=o[0]))}return n}var e={},r={2:0},u=[];function i(t){if(e[t])return e[t].exports;var o=e[t]={i:t,l:!1,exports:{}};return n[t].call(o.exports,o,o.exports,i),o.l=!0,o.exports}i.m=n,i.c=e,i.d=function(n,t,o){i.o(n,t)||Object.defineProperty(n,t,{enumerable:!0,get:o})},i.r=function(n){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(n,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(n,"__esModule",{value:!0})},i.t=function(n,t){if(1&t&&(n=i(n)),8&t)return n;if(4&t&&"object"==typeof n&&n&&n.__esModule)return n;var o=Object.create(null);if(i.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:n}),2&t&&"string"!=typeof n)for(var e in n)i.d(o,e,function(t){return n[t]}.bind(null,e));return o},i.n=function(n){var t=n&&n.__esModule?function(){return n.default}:function(){return n};return i.d(t,"a",t),t},i.o=function(n,t){return Object.prototype.hasOwnProperty.call(n,t)},i.p="";var f=window.webpackJsonp=window.webpackJsonp||[],c=f.push.bind(f);f.push=t,f=f.slice();for(var l=0;l<f.length;l++)t(f[l]);var p=c;u.push([1045,0]),o()}({1045:function(n,t,o){"use strict";o.r(t);o(1046),o(1048),o(1050),o(1052),o(1054),o(1056),o(1058),o(1060),o(1062),o(1064),o(1066),o(1068),o(1070),o(1072),o(1074),o(1076),o(1078),o(1080),o(1082),o(1084),o(1086),o(1088),o(1090),o(1092),o(1094),o(1096),o(1098),o(1100),o(1102),o(1104),o(1106)},1048:function(n,t,o){},1050:function(n,t,o){},1052:function(n,t,o){},1054:function(n,t,o){},1056:function(n,t,o){},1058:function(n,t,o){},1060:function(n,t,o){},1062:function(n,t,o){},1064:function(n,t,o){},1066:function(n,t,o){},1068:function(n,t,o){},1070:function(n,t,o){},1072:function(n,t,o){},1074:function(n,t,o){},1076:function(n,t,o){},1078:function(n,t,o){},1080:function(n,t,o){},1082:function(n,t,o){},1084:function(n,t,o){},1086:function(n,t,o){},1088:function(n,t,o){},1090:function(n,t,o){},1092:function(n,t,o){},1094:function(n,t,o){},1096:function(n,t,o){},1098:function(n,t,o){},1100:function(n,t,o){},1102:function(n,t,o){},1104:function(n,t,o){},1106:function(n,t,o){}}); !function(n){function t(t){for(var e,i,f=t[0],c=t[1],l=t[2],a=0,s=[];a<f.length;a++)i=f[a],Object.prototype.hasOwnProperty.call(r,i)&&r[i]&&s.push(r[i][0]),r[i]=0;for(e in c)Object.prototype.hasOwnProperty.call(c,e)&&(n[e]=c[e]);for(p&&p(t);s.length;)s.shift()();return u.push.apply(u,l||[]),o()}function o(){for(var n,t=0;t<u.length;t++){for(var o=u[t],e=!0,f=1;f<o.length;f++){var c=o[f];0!==r[c]&&(e=!1)}e&&(u.splice(t--,1),n=i(i.s=o[0]))}return n}var e={},r={2:0},u=[];function i(t){if(e[t])return e[t].exports;var o=e[t]={i:t,l:!1,exports:{}};return n[t].call(o.exports,o,o.exports,i),o.l=!0,o.exports}i.m=n,i.c=e,i.d=function(n,t,o){i.o(n,t)||Object.defineProperty(n,t,{enumerable:!0,get:o})},i.r=function(n){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(n,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(n,"__esModule",{value:!0})},i.t=function(n,t){if(1&t&&(n=i(n)),8&t)return n;if(4&t&&"object"==typeof n&&n&&n.__esModule)return n;var o=Object.create(null);if(i.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:n}),2&t&&"string"!=typeof n)for(var e in n)i.d(o,e,function(t){return n[t]}.bind(null,e));return o},i.n=function(n){var t=n&&n.__esModule?function(){return n.default}:function(){return n};return i.d(t,"a",t),t},i.o=function(n,t){return Object.prototype.hasOwnProperty.call(n,t)},i.p="";var f=window.webpackJsonp=window.webpackJsonp||[],c=f.push.bind(f);f.push=t,f=f.slice();for(var l=0;l<f.length;l++)t(f[l]);var p=c;u.push([1249,0]),o()}({1249:function(n,t,o){"use strict";o.r(t);o(1250),o(1252),o(1254),o(1256),o(1258),o(1260),o(1262),o(1264),o(1266),o(1268),o(1270),o(1272),o(1274),o(1276),o(1278),o(1280),o(1282),o(1284),o(1286),o(1288),o(1290),o(1292),o(1294),o(1296),o(1298),o(1300),o(1302),o(1304),o(1306),o(1308),o(1310)},1252:function(n,t,o){},1254:function(n,t,o){},1256:function(n,t,o){},1258:function(n,t,o){},1260:function(n,t,o){},1262:function(n,t,o){},1264:function(n,t,o){},1266:function(n,t,o){},1268:function(n,t,o){},1270:function(n,t,o){},1272:function(n,t,o){},1274:function(n,t,o){},1276:function(n,t,o){},1278:function(n,t,o){},1280:function(n,t,o){},1282:function(n,t,o){},1284:function(n,t,o){},1286:function(n,t,o){},1288:function(n,t,o){},1290:function(n,t,o){},1292:function(n,t,o){},1294:function(n,t,o){},1296:function(n,t,o){},1298:function(n,t,o){},1300:function(n,t,o){},1302:function(n,t,o){},1304:function(n,t,o){},1306:function(n,t,o){},1308:function(n,t,o){},1310:function(n,t,o){}});
//# sourceMappingURL=engineStyle.bundle.js.map //# sourceMappingURL=engineStyle.bundle.js.map

124
dist/engineStyle.css vendored
View File

@ -1226,117 +1226,11 @@ button {
/** /**
* Styling for the Character Overview Panel (top-right panel) * Styling for the Character Overview Panel (top-right panel)
*/ */
#character-overview-wrapper { #character-overview {
position: fixed; position: fixed;
top: 0; top: 0;
right: 0; } right: 0; }
#character-overview-container {
display: none;
position: absolute;
/* Stay in place */
right: 0;
top: 0;
height: auto;
/* Full height */
padding: 10px 2px;
border: 2px solid var(--my-highlight-color);
width: auto;
max-width: 280px;
overflow: auto;
/* Enable scroll if needed */
background-color: rgba(57, 54, 54, 0.9);
/* Fallback color */
z-index: 1; }
#character-overview-text {
color: #faffdf; }
#character-overview-text table {
border-collapse: collapse;
margin: auto; }
#character-overview-text td {
padding: 2px;
vertical-align: middle; }
.character-stat-text {
color: #fff;
background-color: #444; }
.character-stat-cell {
text-align: right; }
#character-str-wrapper td,
#character-cha-wrapper td {
padding-top: 10px; }
.character-divider td {
border-top: 1px #aaa solid;
padding-top: 10px; }
#character-hp-wrapper {
color: #dd3434; }
.character-hp-cell {
color: #dd3434; }
#character-money-wrapper {
color: #ffd700; }
.character-money-cell {
color: #ffd700; }
#character-hack-wrapper {
color: #adff2f; }
.character-hack-cell {
color: #adff2f; }
#character-cha-wrapper {
color: #a671d1; }
.character-cha-cell {
color: #a671d1; }
#character-int-wrapper {
color: #6495ed; }
.character-int-cell {
color: #6495ed; }
.character-combat-cell {
color: #faffdf; }
#character-work-wrapper {
color: #adff2f; }
.character-work-cell {
color: #adff2f; }
.character-overview-btn {
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;
-webkit-box-shadow: 1px 1px 3px #000;
-moz-box-shadow: 1px 1px 3px #000;
box-shadow: 1px 1px 3px #000;
color: #cecece;
display: inline-block;
font-size: 14px;
font-weight: bold;
height: 25px;
background-color: #000;
padding: 5px 8px; }
.character-quick-options {
margin-top: 10px;
text-align: center; }
.character-overview-btn:hover,
.character-overview-btn:focus {
color: #fff;
text-decoration: none;
cursor: pointer; }
/* COLORS */ /* COLORS */
/* Attributes */ /* Attributes */
#terminal-container { #terminal-container {
@ -1639,17 +1533,15 @@ button {
/* Attributes */ /* Attributes */
/* CSS for different main menu pages, such as character info, script editor, etc (but excluding /* CSS for different main menu pages, such as character info, script editor, etc (but excluding
terminal which has its own page) */ terminal which has its own page) */
.generic-menupage-container { #generic-react-container {
padding-left: 2px;
-ms-overflow-style: none; -ms-overflow-style: none;
/* for Internet Explorer, Edge */ /* for Internet Explorer, Edge */
scrollbar-width: none; scrollbar-width: none;
/* for Firefox */ /* for Firefox */
flex-grow: 1; } flex-grow: 1;
overflow-y: scroll;
#generic-react-container { height: 100vh;
padding: 10px; bottom: 0px; }
overflow-y: scroll; }
#generic-react-container::-webkit-scrollbar { #generic-react-container::-webkit-scrollbar {
display: none; display: none;
@ -3041,7 +2933,9 @@ input[type="checkbox"] {
overflow-x: auto; overflow-x: auto;
overflow: visible; overflow: visible;
top: 10px; top: 10px;
width: 45%; } width: 45%;
vertical-align: top;
margin-top: 10px; }
.cmpy-mgmt-industry-overview-panel { .cmpy-mgmt-industry-overview-panel {
border: 1px solid #fff; border: 1px solid #fff;

225
dist/vendor.bundle.js vendored
View File

File diff suppressed because one or more lines are too long

27
index.html
View File

@ -42,21 +42,7 @@
<div id="mainmenu-container" style="display: flex; flex-direction: row"> <div id="mainmenu-container" style="display: flex; flex-direction: row">
<!-- Main menu --> <!-- Main menu -->
<div id="sidebar" style=""></div> <div id="sidebar" style=""></div>
<!-- Terminal page --> <div id="generic-react-container"></div>
<div id="terminal-container" style="flex-grow: 1">
<table id="terminal">
<tr id="terminal-input">
<td id="terminal-input-td" tabindex="2">
$
<input type="text" id="terminal-input-text-box" class="terminal-input" tabindex="1" onfocus="this.value = this.value;" autocomplete="off"/>
</td>
</tr>
</table>
</div>
<div class="generic-menupage-container">
<div id="generic-react-container"></div>
</div>
</div> </div>
<div id="infiltration-container" class="generic-fullscreen-container"></div> <div id="infiltration-container" class="generic-fullscreen-container"></div>
@ -89,16 +75,7 @@
</div> </div>
<!-- Character Overview Screen --> <!-- Character Overview Screen -->
<div id="character-overview-wrapper"> <div id="character-overview"></div>
<div id="character-overview-container">
<div id="character-overview-text">
<!-- ReactJS Component -->
</div>
<div class="character-quick-options noselect">
<button id="character-overview-save-button" class="character-overview-btn">Save Game</button>
</div>
</div>
</div>
<!-- Status text --> <!-- Status text -->
<div id="status-text-container"> <div id="status-text-container">

1579
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

8
package.json
View File

@ -10,9 +10,13 @@
"url": "https://github.com/danielyxie/bitburner/issues" "url": "https://github.com/danielyxie/bitburner/issues"
}, },
"dependencies": { "dependencies": {
"@material-ui/core": "^4.11.3", "@emotion/react": "^11.4.1",
"@material-ui/icons": "^4.11.2", "@emotion/styled": "^11.3.0",
"@monaco-editor/react": "^4.2.2", "@monaco-editor/react": "^4.2.2",
"@mui/icons-material": "^5.0.0-rc.1",
"@mui/lab": "^5.0.0-alpha.46",
"@mui/material": "^5.0.0-rc.1",
"@mui/styles": "^5.0.0-rc.1",
"@types/js-beautify": "^1.13.2", "@types/js-beautify": "^1.13.2",
"@types/numeral": "0.0.25", "@types/numeral": "0.0.25",
"@types/react": "^17.0.21", "@types/react": "^17.0.21",

2
src/Casino/Blackjack.tsx
View File

@ -5,7 +5,7 @@ import { Money } from "../ui/React/Money";
import { Game } from "./Game"; import { Game } from "./Game";
import { Deck } from "./CardDeck/Deck"; import { Deck } from "./CardDeck/Deck";
import { Hand } from "./CardDeck/Hand"; import { Hand } from "./CardDeck/Hand";
import { InputAdornment } from "@material-ui/core"; import { InputAdornment } from "@mui/material";
import { ReactCard } from "./CardDeck/ReactCard"; import { ReactCard } from "./CardDeck/ReactCard";
import { MuiTextField } from "../ui/React/MuiTextField"; import { MuiTextField } from "../ui/React/MuiTextField";
import { MuiButton } from "../ui/React/MuiButton"; import { MuiButton } from "../ui/React/MuiButton";

2
src/DevMenu.tsx
View File

@ -3,7 +3,7 @@ import { Bladeburner } from "./Bladeburner/Bladeburner";
import { IEngine } from "./IEngine"; import { IEngine } from "./IEngine";
import React from "react"; import React from "react";
import { Theme } from "./ui/React/Theme"; import { TTheme as Theme } from "./ui/React/Theme";
import { General } from "./DevMenu/ui/General"; import { General } from "./DevMenu/ui/General";
import { Stats } from "./DevMenu/ui/Stats"; import { Stats } from "./DevMenu/ui/Stats";

28
src/DevMenu/ui/Adjuster.tsx
View File

@ -1,11 +1,11 @@
import React, { useState } from "react"; import React, { useState } from "react";
import AddIcon from "@material-ui/icons/Add"; import AddIcon from "@mui/icons-material/Add";
import RemoveIcon from "@material-ui/icons/Remove"; import RemoveIcon from "@mui/icons-material/Remove";
import IconButton from "@material-ui/core/IconButton"; import IconButton from "@mui/material/IconButton";
import ExposureZeroIcon from "@material-ui/icons/ExposureZero"; import ClearIcon from "@mui/icons-material/Clear";
import DoubleArrowIcon from "@material-ui/icons/DoubleArrow"; import DoubleArrowIcon from "@mui/icons-material/DoubleArrow";
import TextField from "@material-ui/core/TextField"; import TextField from "@mui/material/TextField";
import Tooltip from "@material-ui/core/Tooltip"; import Tooltip from "@mui/material/Tooltip";
interface IProps { interface IProps {
label: string; label: string;
@ -37,12 +37,12 @@ export function Adjuster(props: IProps): React.ReactElement {
startAdornment: ( startAdornment: (
<> <>
<Tooltip title="Add a lot"> <Tooltip title="Add a lot">
<IconButton color="primary" onClick={tons}> <IconButton color="primary" onClick={tons} size="large">
<DoubleArrowIcon style={{ transform: "rotate(-90deg)" }} /> <DoubleArrowIcon style={{ transform: "rotate(-90deg)" }} />
</IconButton> </IconButton>
</Tooltip> </Tooltip>
<Tooltip title="Add"> <Tooltip title="Add">
<IconButton color="primary" onClick={() => add(typeof value !== "string" ? value : 0)}> <IconButton color="primary" onClick={() => add(typeof value !== "string" ? value : 0)} size="large">
<AddIcon /> <AddIcon />
</IconButton> </IconButton>
</Tooltip> </Tooltip>
@ -51,13 +51,17 @@ export function Adjuster(props: IProps): React.ReactElement {
endAdornment: ( endAdornment: (
<> <>
<Tooltip title="Remove"> <Tooltip title="Remove">
<IconButton color="primary" onClick={() => subtract(typeof value !== "string" ? value : 0)}> <IconButton
color="primary"
onClick={() => subtract(typeof value !== "string" ? value : 0)}
size="large"
>
<RemoveIcon /> <RemoveIcon />
</IconButton> </IconButton>
</Tooltip> </Tooltip>
<Tooltip title="Reset"> <Tooltip title="Reset">
<IconButton color="primary" onClick={reset}> <IconButton color="primary" onClick={reset} size="large">
<ExposureZeroIcon /> <ClearIcon />
</IconButton> </IconButton>
</Tooltip> </Tooltip>
</> </>

28
src/DevMenu/ui/Augmentations.tsx
View File

@ -1,18 +1,18 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Select from "@material-ui/core/Select"; import Select, { SelectChangeEvent } from "@mui/material/Select";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
import { AugmentationNames } from "../../Augmentation/data/AugmentationNames"; import { AugmentationNames } from "../../Augmentation/data/AugmentationNames";
import MenuItem from "@material-ui/core/MenuItem"; import MenuItem from "@mui/material/MenuItem";
import IconButton from "@material-ui/core/IconButton"; import IconButton from "@mui/material/IconButton";
import ReplyAllIcon from "@material-ui/icons/ReplyAll"; import ReplyAllIcon from "@mui/icons-material/ReplyAll";
import ReplyIcon from "@material-ui/icons/Reply"; import ReplyIcon from "@mui/icons-material/Reply";
import ClearIcon from "@material-ui/icons/Clear"; import ClearIcon from "@mui/icons-material/Clear";
interface IProps { interface IProps {
player: IPlayer; player: IPlayer;
@ -21,7 +21,7 @@ interface IProps {
export function Augmentations(props: IProps): React.ReactElement { export function Augmentations(props: IProps): React.ReactElement {
const [augmentation, setAugmentation] = useState("Augmented Targeting I"); const [augmentation, setAugmentation] = useState("Augmented Targeting I");
function setAugmentationDropdown(event: React.ChangeEvent<{ value: unknown }>): void { function setAugmentationDropdown(event: SelectChangeEvent<string>): void {
setAugmentation(event.target.value as string); setAugmentation(event.target.value as string);
} }
function queueAug(): void { function queueAug(): void {
@ -59,17 +59,17 @@ export function Augmentations(props: IProps): React.ReactElement {
value={augmentation} value={augmentation}
startAdornment={ startAdornment={
<> <>
<IconButton color="primary" onClick={queueAllAugs}> <IconButton color="primary" onClick={queueAllAugs} size="large">
<ReplyAllIcon /> <ReplyAllIcon />
</IconButton> </IconButton>
<IconButton color="primary" onClick={queueAug}> <IconButton color="primary" onClick={queueAug} size="large">
<ReplyIcon /> <ReplyIcon />
</IconButton> </IconButton>
</> </>
} }
endAdornment={ endAdornment={
<> <>
<IconButton color="primary" onClick={clearAugs}> <IconButton color="primary" onClick={clearAugs} size="large">
<ClearIcon /> <ClearIcon />
</IconButton> </IconButton>
</> </>

8
src/DevMenu/ui/Bladeburner.tsx
View File

@ -1,9 +1,9 @@
import React from "react"; import React from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import { Adjuster } from "./Adjuster"; import { Adjuster } from "./Adjuster";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";

16
src/DevMenu/ui/CodingContracts.tsx
View File

@ -1,19 +1,19 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import Select from "@material-ui/core/Select"; import Select, { SelectChangeEvent } from "@mui/material/Select";
import MenuItem from "@material-ui/core/MenuItem"; import MenuItem from "@mui/material/MenuItem";
import { generateContract, generateRandomContract, generateRandomContractOnHome } from "../../CodingContractGenerator"; import { generateContract, generateRandomContract, generateRandomContractOnHome } from "../../CodingContractGenerator";
import { CodingContractTypes } from "../../CodingContracts"; import { CodingContractTypes } from "../../CodingContracts";
export function CodingContracts(): React.ReactElement { export function CodingContracts(): React.ReactElement {
const [codingcontract, setCodingcontract] = useState("Find Largest Prime Factor"); const [codingcontract, setCodingcontract] = useState("Find Largest Prime Factor");
function setCodingcontractDropdown(event: React.ChangeEvent<{ value: unknown }>): void { function setCodingcontractDropdown(event: SelectChangeEvent<string>): void {
setCodingcontract(event.target.value as string); setCodingcontract(event.target.value as string);
} }

16
src/DevMenu/ui/Companies.tsx
View File

@ -1,21 +1,21 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import Select from "@material-ui/core/Select"; import Select, { SelectChangeEvent } from "@mui/material/Select";
import { Companies as AllCompanies } from "../../Company/Companies"; import { Companies as AllCompanies } from "../../Company/Companies";
import MenuItem from "@material-ui/core/MenuItem"; import MenuItem from "@mui/material/MenuItem";
import { Adjuster } from "./Adjuster"; import { Adjuster } from "./Adjuster";
const bigNumber = 1e12; const bigNumber = 1e12;
export function Companies(): React.ReactElement { export function Companies(): React.ReactElement {
const [company, setCompany] = useState("ECorp"); const [company, setCompany] = useState("ECorp");
function setCompanyDropdown(event: React.ChangeEvent<{ value: unknown }>): void { function setCompanyDropdown(event: SelectChangeEvent<string>): void {
setCompany(event.target.value as string); setCompany(event.target.value as string);
} }
function resetCompanyRep(): void { function resetCompanyRep(): void {

10
src/DevMenu/ui/Corporation.tsx
View File

@ -1,11 +1,11 @@
import React from "react"; import React from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import { Adjuster } from "./Adjuster"; import { Adjuster } from "./Adjuster";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";

30
src/DevMenu/ui/Factions.tsx
View File

@ -1,21 +1,21 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import Select from "@material-ui/core/Select"; import Select, { SelectChangeEvent } from "@mui/material/Select";
import { Adjuster } from "./Adjuster"; import { Adjuster } from "./Adjuster";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
import { Factions as AllFaction } from "../../Faction/Factions"; import { Factions as AllFaction } from "../../Faction/Factions";
import FormControl from "@material-ui/core/FormControl"; import FormControl from "@mui/material/FormControl";
import MenuItem from "@material-ui/core/MenuItem"; import MenuItem from "@mui/material/MenuItem";
import IconButton from "@material-ui/core/IconButton"; import IconButton from "@mui/material/IconButton";
import ReplyAllIcon from "@material-ui/icons/ReplyAll"; import ReplyAllIcon from "@mui/icons-material/ReplyAll";
import ReplyIcon from "@material-ui/icons/Reply"; import ReplyIcon from "@mui/icons-material/Reply";
import InputLabel from "@material-ui/core/InputLabel"; import InputLabel from "@mui/material/InputLabel";
const bigNumber = 1e12; const bigNumber = 1e12;
@ -26,7 +26,7 @@ interface IProps {
export function Factions(props: IProps): React.ReactElement { export function Factions(props: IProps): React.ReactElement {
const [faction, setFaction] = useState("Illuminati"); const [faction, setFaction] = useState("Illuminati");
function setFactionDropdown(event: React.ChangeEvent<{ value: unknown }>): void { function setFactionDropdown(event: SelectChangeEvent<string>): void {
setFaction(event.target.value as string); setFaction(event.target.value as string);
} }
@ -119,10 +119,10 @@ export function Factions(props: IProps): React.ReactElement {
value={faction} value={faction}
startAdornment={ startAdornment={
<> <>
<IconButton color="primary" onClick={receiveAllInvites}> <IconButton color="primary" onClick={receiveAllInvites} size="large">
<ReplyAllIcon /> <ReplyAllIcon />
</IconButton> </IconButton>
<IconButton color="primary" onClick={receiveInvite}> <IconButton color="primary" onClick={receiveInvite} size="large">
<ReplyIcon /> <ReplyIcon />
</IconButton> </IconButton>
</> </>

8
src/DevMenu/ui/Gang.tsx
View File

@ -1,9 +1,9 @@
import React from "react"; import React from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import { Adjuster } from "./Adjuster"; import { Adjuster } from "./Adjuster";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";

10
src/DevMenu/ui/General.tsx
View File

@ -1,11 +1,11 @@
import React from "react"; import React from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import { Money } from "../../ui/React/Money"; import { Money } from "../../ui/React/Money";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
import { hackWorldDaemon } from "../../RedPill"; import { hackWorldDaemon } from "../../RedPill";

16
src/DevMenu/ui/Programs.tsx
View File

@ -1,15 +1,15 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import Select from "@material-ui/core/Select"; import Select, { SelectChangeEvent } from "@mui/material/Select";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
import { Programs as AllPrograms } from "../../Programs/Programs"; import { Programs as AllPrograms } from "../../Programs/Programs";
import MenuItem from "@material-ui/core/MenuItem"; import MenuItem from "@mui/material/MenuItem";
interface IProps { interface IProps {
player: IPlayer; player: IPlayer;
@ -17,7 +17,7 @@ interface IProps {
export function Programs(props: IProps): React.ReactElement { export function Programs(props: IProps): React.ReactElement {
const [program, setProgram] = useState("NUKE.exe"); const [program, setProgram] = useState("NUKE.exe");
function setProgramDropdown(event: React.ChangeEvent<{ value: unknown }>): void { function setProgramDropdown(event: SelectChangeEvent<string>): void {
setProgram(event.target.value as string); setProgram(event.target.value as string);
} }
function addProgram(): void { function addProgram(): void {

16
src/DevMenu/ui/Servers.tsx
View File

@ -1,20 +1,20 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import Select from "@material-ui/core/Select"; import Select, { SelectChangeEvent } from "@mui/material/Select";
import { AllServers } from "../../Server/AllServers"; import { AllServers } from "../../Server/AllServers";
import { HacknetServer } from "../../Hacknet/HacknetServer"; import { HacknetServer } from "../../Hacknet/HacknetServer";
import { GetServerByHostname } from "../../Server/ServerHelpers"; import { GetServerByHostname } from "../../Server/ServerHelpers";
import MenuItem from "@material-ui/core/MenuItem"; import MenuItem from "@mui/material/MenuItem";
export function Servers(): React.ReactElement { export function Servers(): React.ReactElement {
const [server, setServer] = useState("home"); const [server, setServer] = useState("home");
function setServerDropdown(event: React.ChangeEvent<{ value: unknown }>): void { function setServerDropdown(event: SelectChangeEvent<string>): void {
setServer(event.target.value as string); setServer(event.target.value as string);
} }
function rootServer(): void { function rootServer(): void {

10
src/DevMenu/ui/Sleeves.tsx
View File

@ -1,11 +1,11 @@
import React from "react"; import React from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
interface IProps { interface IProps {

12
src/DevMenu/ui/SourceFiles.tsx
View File

@ -1,14 +1,14 @@
import React from "react"; import React from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import { PlayerOwnedSourceFile } from "../../SourceFile/PlayerOwnedSourceFile"; import { PlayerOwnedSourceFile } from "../../SourceFile/PlayerOwnedSourceFile";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
import ButtonGroup from "@material-ui/core/ButtonGroup"; import ButtonGroup from "@mui/material/ButtonGroup";
// Update as additional BitNodes get implemented // Update as additional BitNodes get implemented
const validSFN = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12]; const validSFN = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];

10
src/DevMenu/ui/Stats.tsx
View File

@ -1,11 +1,11 @@
import React from "react"; import React from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import { Adjuster } from "./Adjuster"; import { Adjuster } from "./Adjuster";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";

12
src/DevMenu/ui/StockMarket.tsx
View File

@ -1,12 +1,12 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import TextField from "@material-ui/core/TextField"; import TextField from "@mui/material/TextField";
import { Money } from "../../ui/React/Money"; import { Money } from "../../ui/React/Money";
import { dialogBoxCreate } from "../../../utils/DialogBox"; import { dialogBoxCreate } from "../../../utils/DialogBox";
import { StockMarket as SM } from "../../StockMarket/StockMarket"; import { StockMarket as SM } from "../../StockMarket/StockMarket";

10
src/DevMenu/ui/TimeSkip.tsx
View File

@ -1,11 +1,11 @@
import React from "react"; import React from "react";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
import { saveObject } from "../../SaveObject"; import { saveObject } from "../../SaveObject";
import { IEngine } from "../../IEngine"; import { IEngine } from "../../IEngine";

24
src/Diagnostic/FileDiagnosticModal.tsx
View File

@ -3,18 +3,18 @@ import { AllServers } from "../Server/AllServers";
import { Modal } from "../ui/React/Modal"; import { Modal } from "../ui/React/Modal";
import { numeralWrapper } from "../ui/numeralFormat"; import { numeralWrapper } from "../ui/numeralFormat";
import Table from "@material-ui/core/Table"; import Table from "@mui/material/Table";
import TableBody from "@material-ui/core/TableBody"; import TableBody from "@mui/material/TableBody";
import TableCell from "@material-ui/core/TableCell"; import TableCell from "@mui/material/TableCell";
import TableContainer from "@material-ui/core/TableContainer"; import TableContainer from "@mui/material/TableContainer";
import TableHead from "@material-ui/core/TableHead"; import TableHead from "@mui/material/TableHead";
import TableRow from "@material-ui/core/TableRow"; import TableRow from "@mui/material/TableRow";
import Typography from "@material-ui/core/Typography"; import Typography from "@mui/material/Typography";
import Paper from "@material-ui/core/Paper"; import Paper from "@mui/material/Paper";
import Accordion from "@material-ui/core/Accordion"; import Accordion from "@mui/material/Accordion";
import AccordionSummary from "@material-ui/core/AccordionSummary"; import AccordionSummary from "@mui/material/AccordionSummary";
import AccordionDetails from "@material-ui/core/AccordionDetails"; import AccordionDetails from "@mui/material/AccordionDetails";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
interface IServerProps { interface IServerProps {
ip: string; ip: string;

2
src/Infiltration/ui/BackwardGame.tsx
View File

@ -1,5 +1,5 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
import { IMinigameProps } from "./IMinigameProps"; import { IMinigameProps } from "./IMinigameProps";
import { KeyHandler } from "./KeyHandler"; import { KeyHandler } from "./KeyHandler";
import { GameTimer } from "./GameTimer"; import { GameTimer } from "./GameTimer";

2
src/Infiltration/ui/BracketGame.tsx
View File

@ -1,5 +1,5 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
import { IMinigameProps } from "./IMinigameProps"; import { IMinigameProps } from "./IMinigameProps";
import { KeyHandler } from "./KeyHandler"; import { KeyHandler } from "./KeyHandler";
import { GameTimer } from "./GameTimer"; import { GameTimer } from "./GameTimer";

2
src/Infiltration/ui/BribeGame.tsx
View File

@ -1,5 +1,5 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
import { IMinigameProps } from "./IMinigameProps"; import { IMinigameProps } from "./IMinigameProps";
import { KeyHandler } from "./KeyHandler"; import { KeyHandler } from "./KeyHandler";
import { GameTimer } from "./GameTimer"; import { GameTimer } from "./GameTimer";

2
src/Infiltration/ui/CheatCodeGame.tsx
View File

@ -1,5 +1,5 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
import { IMinigameProps } from "./IMinigameProps"; import { IMinigameProps } from "./IMinigameProps";
import { KeyHandler } from "./KeyHandler"; import { KeyHandler } from "./KeyHandler";
import { GameTimer } from "./GameTimer"; import { GameTimer } from "./GameTimer";

2
src/Infiltration/ui/Countdown.tsx
View File

@ -1,5 +1,5 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
interface IProps { interface IProps {
onFinish: () => void; onFinish: () => void;

2
src/Infiltration/ui/Cyberpunk2077Game.tsx
View File

@ -1,5 +1,5 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
import { IMinigameProps } from "./IMinigameProps"; import { IMinigameProps } from "./IMinigameProps";
import { KeyHandler } from "./KeyHandler"; import { KeyHandler } from "./KeyHandler";
import { GameTimer } from "./GameTimer"; import { GameTimer } from "./GameTimer";

2
src/Infiltration/ui/Game.tsx
View File

@ -1,7 +1,7 @@
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
import { IEngine } from "../../IEngine"; import { IEngine } from "../../IEngine";
import React, { useState } from "react"; import React, { useState } from "react";
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
import { Countdown } from "./Countdown"; import { Countdown } from "./Countdown";
import { BracketGame } from "./BracketGame"; import { BracketGame } from "./BracketGame";
import { SlashGame } from "./SlashGame"; import { SlashGame } from "./SlashGame";

6
src/Infiltration/ui/GameTimer.tsx
View File

@ -1,7 +1,7 @@
import LinearProgress from "@material-ui/core/LinearProgress"; import LinearProgress from "@mui/material/LinearProgress";
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import { withStyles } from "@material-ui/core/styles"; import withStyles from '@mui/styles/withStyles';
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
const TimerProgress = withStyles(() => ({ const TimerProgress = withStyles(() => ({
bar: { bar: {

2
src/Infiltration/ui/Intro.tsx
View File

@ -2,7 +2,7 @@ import { IPlayer } from "../../PersonObjects/IPlayer";
import { IEngine } from "../../IEngine"; import { IEngine } from "../../IEngine";
import React from "react"; import React from "react";
import { StdButton } from "../../ui/React/StdButton"; import { StdButton } from "../../ui/React/StdButton";
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
interface IProps { interface IProps {
Player: IPlayer; Player: IPlayer;

2
src/Infiltration/ui/MinesweeperGame.tsx
View File

@ -1,5 +1,5 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
import { IMinigameProps } from "./IMinigameProps"; import { IMinigameProps } from "./IMinigameProps";
import { KeyHandler } from "./KeyHandler"; import { KeyHandler } from "./KeyHandler";
import { GameTimer } from "./GameTimer"; import { GameTimer } from "./GameTimer";

2
src/Infiltration/ui/SlashGame.tsx
View File

@ -1,5 +1,5 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
import { IMinigameProps } from "./IMinigameProps"; import { IMinigameProps } from "./IMinigameProps";
import { KeyHandler } from "./KeyHandler"; import { KeyHandler } from "./KeyHandler";
import { GameTimer } from "./GameTimer"; import { GameTimer } from "./GameTimer";

2
src/Infiltration/ui/Victory.tsx
View File

@ -3,7 +3,7 @@ import { IEngine } from "../../IEngine";
import { Factions } from "../../Faction/Factions"; import { Factions } from "../../Faction/Factions";
import React, { useState } from "react"; import React, { useState } from "react";
import { StdButton } from "../../ui/React/StdButton"; import { StdButton } from "../../ui/React/StdButton";
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
import { Money } from "../../ui/React/Money"; import { Money } from "../../ui/React/Money";
import { Reputation } from "../../ui/React/Reputation"; import { Reputation } from "../../ui/React/Reputation";
import { BitNodeMultipliers } from "../../BitNode/BitNodeMultipliers"; import { BitNodeMultipliers } from "../../BitNode/BitNodeMultipliers";

2
src/Infiltration/ui/WireCuttingGame.tsx
View File

@ -1,5 +1,5 @@
import React, { useState } from "react"; import React, { useState } from "react";
import Grid from "@material-ui/core/Grid"; import Grid from "@mui/material/Grid";
import { IMinigameProps } from "./IMinigameProps"; import { IMinigameProps } from "./IMinigameProps";
import { KeyHandler } from "./KeyHandler"; import { KeyHandler } from "./KeyHandler";
import { GameTimer } from "./GameTimer"; import { GameTimer } from "./GameTimer";

4
src/Programs/ui/ProgramsRoot.tsx
View File

@ -2,8 +2,8 @@ import React, { useState, useEffect } from "react";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
import { getAvailableCreatePrograms } from "../ProgramHelpers"; import { getAvailableCreatePrograms } from "../ProgramHelpers";
import { Box, ButtonGroup, Tooltip, Typography } from "@material-ui/core"; import { Box, ButtonGroup, Tooltip, Typography } from "@mui/material";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
interface IProps { interface IProps {
player: IPlayer; player: IPlayer;

135
src/Sidebar/ui/SidebarRoot.tsx
View File

@ -1,47 +1,49 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import clsx from "clsx"; import clsx from "clsx";
import { createStyles, makeStyles, Theme } from "@material-ui/core/styles"; import { styled, useTheme, Theme, CSSObject } from "@mui/material/styles";
import Drawer from "@material-ui/core/Drawer"; import createStyles from "@mui/styles/createStyles";
import List from "@material-ui/core/List"; import makeStyles from "@mui/styles/makeStyles";
import Divider from "@material-ui/core/Divider"; import MuiDrawer from "@mui/material/Drawer";
import ChevronLeftIcon from "@material-ui/icons/ChevronLeft"; import List from "@mui/material/List";
import ChevronRightIcon from "@material-ui/icons/ChevronRight"; import Divider from "@mui/material/Divider";
import ListItem from "@material-ui/core/ListItem"; import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
import ListItemIcon from "@material-ui/core/ListItemIcon"; import ChevronRightIcon from "@mui/icons-material/ChevronRight";
import ListItemText from "@material-ui/core/ListItemText"; import ListItem from "@mui/material/ListItem";
import Typography from "@material-ui/core/Typography"; import ListItemIcon from "@mui/material/ListItemIcon";
import Collapse from "@material-ui/core/Collapse"; import ListItemText from "@mui/material/ListItemText";
import Typography from "@mui/material/Typography";
import Collapse from "@mui/material/Collapse";
import { Theme as BBTheme, colors } from "../../ui/React/Theme"; import { TTheme as BBTheme, colors } from "../../ui/React/Theme";
import ComputerIcon from "@material-ui/icons/Computer"; import ComputerIcon from "@mui/icons-material/Computer";
import LastPageIcon from "@material-ui/icons/LastPage"; // Terminal import LastPageIcon from "@mui/icons-material/LastPage"; // Terminal
import CreateIcon from "@material-ui/icons/Create"; // Create Script import CreateIcon from "@mui/icons-material/Create"; // Create Script
import StorageIcon from "@material-ui/icons/Storage"; // Active Scripts import StorageIcon from "@mui/icons-material/Storage"; // Active Scripts
import BugReportIcon from "@material-ui/icons/BugReport"; // Create Program import BugReportIcon from "@mui/icons-material/BugReport"; // Create Program
import EqualizerIcon from "@material-ui/icons/Equalizer"; // Stats import EqualizerIcon from "@mui/icons-material/Equalizer"; // Stats
import ContactsIcon from "@material-ui/icons/Contacts"; // Factions import ContactsIcon from "@mui/icons-material/Contacts"; // Factions
import DoubleArrowIcon from "@material-ui/icons/DoubleArrow"; // Augmentations import DoubleArrowIcon from "@mui/icons-material/DoubleArrow"; // Augmentations
import AccountTreeIcon from "@material-ui/icons/AccountTree"; // Hacknet import AccountTreeIcon from "@mui/icons-material/AccountTree"; // Hacknet
import PeopleAltIcon from "@material-ui/icons/PeopleAlt"; // Sleeves import PeopleAltIcon from "@mui/icons-material/PeopleAlt"; // Sleeves
import LocationCityIcon from "@material-ui/icons/LocationCity"; // City import LocationCityIcon from "@mui/icons-material/LocationCity"; // City
import AirplanemodeActiveIcon from "@material-ui/icons/AirplanemodeActive"; // Travel import AirplanemodeActiveIcon from "@mui/icons-material/AirplanemodeActive"; // Travel
import WorkIcon from "@material-ui/icons/Work"; // Job import WorkIcon from "@mui/icons-material/Work"; // Job
import TrendingUpIcon from "@material-ui/icons/TrendingUp"; // Stock Market import TrendingUpIcon from "@mui/icons-material/TrendingUp"; // Stock Market
import FormatBoldIcon from "@material-ui/icons/FormatBold"; // Bladeburner import FormatBoldIcon from "@mui/icons-material/FormatBold"; // Bladeburner
import BusinessIcon from "@material-ui/icons/Business"; // Corp import BusinessIcon from "@mui/icons-material/Business"; // Corp
import SportsMmaIcon from "@material-ui/icons/SportsMma"; // Gang import SportsMmaIcon from "@mui/icons-material/SportsMma"; // Gang
import CheckIcon from "@material-ui/icons/Check"; // Milestones import CheckIcon from "@mui/icons-material/Check"; // Milestones
import HelpIcon from "@material-ui/icons/Help"; // Tutorial import HelpIcon from "@mui/icons-material/Help"; // Tutorial
import SettingsIcon from "@material-ui/icons/Settings"; // options import SettingsIcon from "@mui/icons-material/Settings"; // options
import DeveloperBoardIcon from "@material-ui/icons/DeveloperBoard"; // Dev import DeveloperBoardIcon from "@mui/icons-material/DeveloperBoard"; // Dev
// import MemoryIcon from "@material-ui/icons/Memory"; // import MemoryIcon from "@mui/icons-material/Memory";
// import ShareIcon from "@material-ui/icons/Share"; // import ShareIcon from "@mui/icons-material/Share";
import AccountBoxIcon from "@material-ui/icons/AccountBox"; import AccountBoxIcon from "@mui/icons-material/AccountBox";
import PublicIcon from "@material-ui/icons/Public"; import PublicIcon from "@mui/icons-material/Public";
import LiveHelpIcon from "@material-ui/icons/LiveHelp"; import LiveHelpIcon from "@mui/icons-material/LiveHelp";
import ExpandLessIcon from "@material-ui/icons/ExpandLess"; import ExpandLessIcon from "@mui/icons-material/ExpandLess";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
import { IEngine } from "../../IEngine"; import { IEngine } from "../../IEngine";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
@ -57,11 +59,50 @@ import { KEY } from "../../../utils/helpers/keyCodes";
import { FconfSettings } from "../../Fconf/FconfSettings"; import { FconfSettings } from "../../Fconf/FconfSettings";
import { Page, routing } from "../../ui/navigationTracking"; import { Page, routing } from "../../ui/navigationTracking";
const drawerWidth = 240;
const openedMixin = (theme: Theme): CSSObject => ({
width: drawerWidth,
transition: theme.transitions.create("width", {
easing: theme.transitions.easing.sharp,
duration: theme.transitions.duration.enteringScreen,
}),
overflowX: "hidden",
});
const closedMixin = (theme: Theme): CSSObject => ({
transition: theme.transitions.create("width", {
easing: theme.transitions.easing.sharp,
duration: theme.transitions.duration.leavingScreen,
}),
overflowX: "hidden",
width: `calc(${theme.spacing(7)} + 1px)`,
[theme.breakpoints.up("sm")]: {
width: `calc(${theme.spacing(9)} + 1px)`,
},
});
const Drawer = styled(MuiDrawer, { shouldForwardProp: (prop) => prop !== "open" })(({ theme, open }) => ({
width: drawerWidth,
flexShrink: 0,
whiteSpace: "nowrap",
boxSizing: "border-box",
...(open && {
...openedMixin(theme),
"& .MuiDrawer-paper": openedMixin(theme),
}),
...(!open && {
...closedMixin(theme),
"& .MuiDrawer-paper": closedMixin(theme),
}),
}));
const useStyles = makeStyles((theme: Theme) => const useStyles = makeStyles((theme: Theme) =>
createStyles({ createStyles({
drawer: { drawer: {
width: theme.spacing(31), width: theme.spacing(31),
flexShrink: 0, flexShrink: 0,
display: "flex",
whiteSpace: "nowrap", whiteSpace: "nowrap",
}, },
drawerOpen: { drawerOpen: {
@ -338,19 +379,7 @@ export function SidebarRoot(props: IProps): React.ReactElement {
const toggleDrawer = (): void => setOpen((old) => !old); const toggleDrawer = (): void => setOpen((old) => !old);
return ( return (
<BBTheme> <BBTheme>
<Drawer <Drawer open={open} anchor="left" variant="permanent">
variant="permanent"
className={clsx(classes.drawer, {
[classes.drawerOpen]: open,
[classes.drawerClose]: !open,
})}
classes={{
paper: clsx({
[classes.drawerOpen]: open,
[classes.drawerClose]: !open,
}),
}}
>
<ListItem button onClick={toggleDrawer}> <ListItem button onClick={toggleDrawer}>
<ListItemIcon>{!open ? <ChevronRightIcon /> : <ChevronLeftIcon />}</ListItemIcon> <ListItemIcon>{!open ? <ChevronRightIcon /> : <ChevronLeftIcon />}</ListItemIcon>
<ListItemText primary={<Typography color="primary">Bitburner v{CONSTANTS.Version}</Typography>} /> <ListItemText primary={<Typography color="primary">Bitburner v{CONSTANTS.Version}</Typography>} />

3
src/Terminal/Terminal.ts
View File

@ -77,7 +77,7 @@ export class Terminal implements ITerminal {
commandHistory: string[] = []; commandHistory: string[] = [];
commandHistoryIndex = 0; commandHistoryIndex = 0;
outputHistory: (Output | Link)[] = [{ text: `Bitburner v${CONSTANTS.Version}`, color: "primary" }]; outputHistory: (Output | Link)[] = [new Output(`Bitburner v${CONSTANTS.Version}`, "primary")];
// True if a Coding Contract prompt is opened // True if a Coding Contract prompt is opened
contractOpen = false; contractOpen = false;
@ -489,6 +489,7 @@ export class Terminal implements ITerminal {
} }
clear(): void { clear(): void {
// TODO: remove this once we figure out the height issue.
this.outputHistory = [new Output(`Bitburner v${CONSTANTS.Version}`, "primary")]; this.outputHistory = [new Output(`Bitburner v${CONSTANTS.Version}`, "primary")];
this.hasChanges = true; this.hasChanges = true;
} }

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

@ -1,7 +1,9 @@
import React, { useState, useEffect, useRef } from "react"; import React, { useState, useEffect, useRef } from "react";
import Typography from "@material-ui/core/Typography"; import Typography from "@mui/material/Typography";
import { makeStyles, createStyles, Theme } from "@material-ui/core/styles"; import { Theme } from "@mui/material/styles";
import TextField from "@material-ui/core/TextField"; import makeStyles from "@mui/styles/makeStyles";
import createStyles from "@mui/styles/createStyles";
import TextField from "@mui/material/TextField";
import { KEY } from "../../../utils/helpers/keyCodes"; import { KEY } from "../../../utils/helpers/keyCodes";
import { ITerminal } from "../ITerminal"; import { ITerminal } from "../ITerminal";
import { IEngine } from "../../IEngine"; import { IEngine } from "../../IEngine";
@ -13,21 +15,21 @@ import { FconfSettings } from "../../Fconf/FconfSettings";
const useStyles = makeStyles((theme: Theme) => const useStyles = makeStyles((theme: Theme) =>
createStyles({ createStyles({
textfield: { textfield: {
margin: theme.spacing(0), margin: 0,
width: "100%", width: "100%",
}, },
input: { input: {
backgroundColor: "#000", backgroundColor: "#000",
}, },
nopadding: { nopadding: {
padding: theme.spacing(0), padding: 0,
}, },
preformatted: { preformatted: {
whiteSpace: "pre-wrap", whiteSpace: "pre-wrap",
margin: theme.spacing(0), margin: 0,
}, },
list: { list: {
padding: theme.spacing(0), padding: 0,
height: "100%", height: "100%",
}, },
}), }),
@ -334,6 +336,7 @@ export function TerminalInput({ terminal, engine, player }: IProps): React.React
</> </>
)} )}
<TextField <TextField
variant="standard"
color={terminal.action === null ? "primary" : "secondary"} color={terminal.action === null ? "primary" : "secondary"}
autoFocus autoFocus
disabled={terminal.action !== null} disabled={terminal.action !== null}

85
src/Terminal/ui/TerminalRoot.tsx
View File

@ -1,10 +1,12 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect, useRef } from "react";
import Typography from "@material-ui/core/Typography"; import Typography from "@mui/material/Typography";
import List from "@material-ui/core/List"; import List from "@mui/material/List";
import ListItem from "@material-ui/core/ListItem"; import ListItem from "@mui/material/ListItem";
import { Link as MuiLink } from "@material-ui/core"; import { Link as MuiLink } from "@mui/material";
import { makeStyles, createStyles, Theme } from "@material-ui/core/styles"; import { Theme } from "@mui/material/styles";
import Box from "@material-ui/core/Box"; import makeStyles from "@mui/styles/makeStyles";
import createStyles from "@mui/styles/createStyles";
import Box from "@mui/material/Box";
import { ITerminal, Output, Link } from "../ITerminal"; import { ITerminal, Output, Link } from "../ITerminal";
import { IEngine } from "../../IEngine"; import { IEngine } from "../../IEngine";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
@ -45,6 +47,7 @@ interface IProps {
} }
export function TerminalRoot({ terminal, engine, player }: IProps): React.ReactElement { export function TerminalRoot({ terminal, engine, player }: IProps): React.ReactElement {
const scrollHook = useRef<HTMLDivElement>(null);
const setRerender = useState(false)[1]; const setRerender = useState(false)[1];
function rerender(): void { function rerender(): void {
setRerender((old) => !old); setRerender((old) => !old);
@ -57,36 +60,46 @@ export function TerminalRoot({ terminal, engine, player }: IProps): React.ReactE
return () => clearInterval(id); return () => clearInterval(id);
}, []); }, []);
const hook = scrollHook.current;
if (hook !== null) {
setTimeout(() => hook.scrollIntoView(true), 10);
}
const classes = useStyles(); const classes = useStyles();
return ( return (
<Box position="fixed" bottom="0" width="100%" px={1}> <>
<List classes={{ root: classes.list }}> <Box width="100%" minHeight="100vh" px={1}>
{terminal.outputHistory.map((item, i) => { <List classes={{ root: classes.list }}>
if (item instanceof Output) {terminal.outputHistory.map((item, i) => {
return ( if (item instanceof Output)
<ListItem key={i} classes={{ root: classes.nopadding }}> return (
<Typography classes={{ root: classes.preformatted }} color={item.color} paragraph={false}> <ListItem key={i} classes={{ root: classes.nopadding }}>
{item.text} <Typography classes={{ root: classes.preformatted }} color={item.color} paragraph={false}>
</Typography> {item.text}
</ListItem> </Typography>
); </ListItem>
if (item instanceof Link) );
return ( if (item instanceof Link)
<ListItem key={i} classes={{ root: classes.nopadding }}> return (
<MuiLink <ListItem key={i} classes={{ root: classes.nopadding }}>
classes={{ root: classes.preformatted }} <MuiLink
color={"secondary"} classes={{ root: classes.preformatted }}
paragraph={false} color={"secondary"}
onClick={() => terminal.connectToServer(player, item.hostname)} paragraph={false}
> onClick={() => terminal.connectToServer(player, item.hostname)}
&gt;&nbsp;{item.hostname} >
</MuiLink> &gt;&nbsp;{item.hostname}
</ListItem> </MuiLink>
); </ListItem>
})} );
</List> })}
{terminal.action !== null && <ActionTimer terminal={terminal} />} </List>
<TerminalInput player={player} engine={engine} terminal={terminal} /> {terminal.action !== null && <ActionTimer terminal={terminal} />}
</Box> <div ref={scrollHook}></div>
</Box>
<Box position="sticky" bottom={0} width="100%" px={1}>
<TerminalInput player={player} engine={engine} terminal={terminal} />
</Box>
</>
); );
} }

504
src/ThirdParty/raphael.min.js vendored
View File

@ -2613,265 +2613,263 @@
}); });
}; };
})(ce)); })(ce));
return ( return (ue.attr = function (t, r) {
(ue.attr = function (t, r) { if (t && e.is(t, T) && e.is(t[0], "object"))
if (t && e.is(t, T) && e.is(t[0], "object")) for (var i = 0, n = t.length; i < n; i++) this.items[i].attr(t[i]);
for (var i = 0, n = t.length; i < n; i++) this.items[i].attr(t[i]); else for (var a = 0, s = this.items.length; a < s; a++) this.items[a].attr(t, r);
else for (var a = 0, s = this.items.length; a < s; a++) this.items[a].attr(t, r); return this;
return this; }),
}), (ue.clear = function () {
(ue.clear = function () { for (; this.length; ) this.pop();
for (; this.length; ) this.pop(); }),
}), (ue.splice = function (t, e, r) {
(ue.splice = function (t, e, r) { (t = t < 0 ? w(this.length + t, 0) : t), (e = w(0, k(this.length - t, e)));
(t = t < 0 ? w(this.length + t, 0) : t), (e = w(0, k(this.length - t, e))); var i,
var i, n = [],
n = [], a = [],
a = [], s = [];
s = []; for (i = 2; i < arguments.length; i++) s.push(arguments[i]);
for (i = 2; i < arguments.length; i++) s.push(arguments[i]); for (i = 0; i < e; i++) a.push(this[t + i]);
for (i = 0; i < e; i++) a.push(this[t + i]); for (; i < this.length - t; i++) n.push(this[t + i]);
for (; i < this.length - t; i++) n.push(this[t + i]); var o = s.length;
var o = s.length; for (i = 0; i < o + n.length; i++) this.items[t + i] = this[t + i] = i < o ? s[i] : n[i - o];
for (i = 0; i < o + n.length; i++) this.items[t + i] = this[t + i] = i < o ? s[i] : n[i - o]; for (i = this.items.length = this.length -= e - o; this[i]; ) delete this[i++];
for (i = this.items.length = this.length -= e - o; this[i]; ) delete this[i++]; return new he(a);
return new he(a); }),
}), (ue.exclude = function (t) {
(ue.exclude = function (t) { for (var e = 0, r = this.length; e < r; e++) if (this[e] == t) return this.splice(e, 1), !0;
for (var e = 0, r = this.length; e < r; e++) if (this[e] == t) return this.splice(e, 1), !0; }),
}), (ue.animate = function (t, r, i, n) {
(ue.animate = function (t, r, i, n) { (e.is(i, "function") || !i) && (n = i || null);
(e.is(i, "function") || !i) && (n = i || null); var a,
s,
o = this.items.length,
l = o,
h = this;
if (!o) return this;
n &&
(s = function () {
!--o && n.call(h);
}),
(i = e.is(i, "string") ? i : s);
var u = e.animation(t, r, i, s);
for (a = this.items[--l].animate(u); l--; )
this.items[l] && !this.items[l].removed && this.items[l].animateWith(a, u, u),
(this.items[l] && !this.items[l].removed) || o--;
return this;
}),
(ue.insertAfter = function (t) {
for (var e = this.items.length; e--; ) this.items[e].insertAfter(t);
return this;
}),
(ue.getBBox = function () {
for (var t = [], e = [], r = [], i = [], n = this.items.length; n--; )
if (!this.items[n].removed) {
var a = this.items[n].getBBox();
t.push(a.x), e.push(a.y), r.push(a.x + a.width), i.push(a.y + a.height);
}
return {
x: (t = k[c](0, t)),
y: (e = k[c](0, e)),
x2: (r = w[c](0, r)),
y2: (i = w[c](0, i)),
width: r - t,
height: i - e,
};
}),
(ue.clone = function (t) {
t = this.paper.set();
for (var e = 0, r = this.items.length; e < r; e++) t.push(this.items[e].clone());
return t;
}),
(ue.toString = function () {
return "Raphaël‘s set";
}),
(ue.glow = function (t) {
var e = this.paper.set();
return (
this.forEach(function (r, i) {
var n = r.glow(t);
n != null &&
n.forEach(function (t, r) {
e.push(t);
});
}),
e
);
}),
(ue.isPointInside = function (t, e) {
var r = !1;
return (
this.forEach(function (i) {
if (i.isPointInside(t, e)) return (r = !0), !1;
}),
r
);
}),
(e.registerFont = function (t) {
if (!t.face) return t;
this.fonts = this.fonts || {};
var e = { w: t.w, face: {}, glyphs: {} },
r = t.face["font-family"];
for (var i in t.face) t.face[o](i) && (e.face[i] = t.face[i]);
if ((this.fonts[r] ? this.fonts[r].push(e) : (this.fonts[r] = [e]), !t.svg))
for (var n in ((e.face["units-per-em"] = F(t.face["units-per-em"], 10)), t.glyphs))
if (t.glyphs[o](n)) {
var a = t.glyphs[n];
if (
((e.glyphs[n] = {
w: a.w,
k: {},
d:
a.d &&
"M" +
a.d.replace(/[mlcxtrv]/g, function (t) {
return (
{
l: "L",
c: "C",
x: "z",
t: "m",
r: "l",
v: "c",
}[t] || "M"
);
}) +
"z",
}),
a.k)
)
for (var s in a.k) a[o](s) && (e.glyphs[n].k[s] = a.k[s]);
}
return t;
}),
(i.getFont = function (t, r, i, n) {
if (
((n = n || "normal"),
(i = i || "normal"),
(r = +r || { normal: 400, bold: 700, lighter: 300, bolder: 800 }[r] || 400),
e.fonts)
) {
var a, var a,
s, s = e.fonts[t];
o = this.items.length, if (!s) {
l = o, var l = new RegExp("(^|\\s)" + t.replace(/[^\w\d\s+!~.:_-]/g, d) + "(\\s|$)", "i");
h = this; for (var h in e.fonts)
if (!o) return this; if (e.fonts[o](h) && l.test(h)) {
n && s = e.fonts[h];
(s = function () { break;
!--o && n.call(h);
}),
(i = e.is(i, "string") ? i : s);
var u = e.animation(t, r, i, s);
for (a = this.items[--l].animate(u); l--; )
this.items[l] && !this.items[l].removed && this.items[l].animateWith(a, u, u),
(this.items[l] && !this.items[l].removed) || o--;
return this;
}),
(ue.insertAfter = function (t) {
for (var e = this.items.length; e--; ) this.items[e].insertAfter(t);
return this;
}),
(ue.getBBox = function () {
for (var t = [], e = [], r = [], i = [], n = this.items.length; n--; )
if (!this.items[n].removed) {
var a = this.items[n].getBBox();
t.push(a.x), e.push(a.y), r.push(a.x + a.width), i.push(a.y + a.height);
}
return {
x: (t = k[c](0, t)),
y: (e = k[c](0, e)),
x2: (r = w[c](0, r)),
y2: (i = w[c](0, i)),
width: r - t,
height: i - e,
};
}),
(ue.clone = function (t) {
t = this.paper.set();
for (var e = 0, r = this.items.length; e < r; e++) t.push(this.items[e].clone());
return t;
}),
(ue.toString = function () {
return "Raphaël‘s set";
}),
(ue.glow = function (t) {
var e = this.paper.set();
return (
this.forEach(function (r, i) {
var n = r.glow(t);
n != null &&
n.forEach(function (t, r) {
e.push(t);
});
}),
e
);
}),
(ue.isPointInside = function (t, e) {
var r = !1;
return (
this.forEach(function (i) {
if (i.isPointInside(t, e)) return (r = !0), !1;
}),
r
);
}),
(e.registerFont = function (t) {
if (!t.face) return t;
this.fonts = this.fonts || {};
var e = { w: t.w, face: {}, glyphs: {} },
r = t.face["font-family"];
for (var i in t.face) t.face[o](i) && (e.face[i] = t.face[i]);
if ((this.fonts[r] ? this.fonts[r].push(e) : (this.fonts[r] = [e]), !t.svg))
for (var n in ((e.face["units-per-em"] = F(t.face["units-per-em"], 10)), t.glyphs))
if (t.glyphs[o](n)) {
var a = t.glyphs[n];
if (
((e.glyphs[n] = {
w: a.w,
k: {},
d:
a.d &&
"M" +
a.d.replace(/[mlcxtrv]/g, function (t) {
return (
{
l: "L",
c: "C",
x: "z",
t: "m",
r: "l",
v: "c",
}[t] || "M"
);
}) +
"z",
}),
a.k)
)
for (var s in a.k) a[o](s) && (e.glyphs[n].k[s] = a.k[s]);
} }
return t;
}),
(i.getFont = function (t, r, i, n) {
if (
((n = n || "normal"),
(i = i || "normal"),
(r = +r || { normal: 400, bold: 700, lighter: 300, bolder: 800 }[r] || 400),
e.fonts)
) {
var a,
s = e.fonts[t];
if (!s) {
var l = new RegExp("(^|\\s)" + t.replace(/[^\w\d\s+!~.:_-]/g, d) + "(\\s|$)", "i");
for (var h in e.fonts)
if (e.fonts[o](h) && l.test(h)) {
s = e.fonts[h];
break;
}
}
if (s)
for (
var u = 0, c = s.length;
u < c &&
((a = s[u]).face["font-weight"] != r ||
(a.face["font-style"] != i && a.face["font-style"]) ||
a.face["font-stretch"] != n);
u++
);
return a;
} }
}), if (s)
(i.print = function (t, r, i, a, s, o, l, h) {
(o = o || "middle"), (l = w(k(l || 0, 1), -1)), (h = w(k(h || 1, 3), 1));
var u,
c = x(i)[v](d),
f = 0,
p = 0,
g = d;
if ((e.is(a, "string") && (a = this.getFont(a)), a)) {
u = (s || 16) / a.face["units-per-em"];
for ( for (
var y = a.face.bbox[v](n), var u = 0, c = s.length;
m = +y[0], u < c &&
b = y[3] - y[1], ((a = s[u]).face["font-weight"] != r ||
_ = 0, (a.face["font-style"] != i && a.face["font-style"]) ||
B = +y[1] + (o == "baseline" ? b + +a.face.descent : b / 2), a.face["font-stretch"] != n);
C = 0, u++
S = c.length; );
C < S; return a;
C++ }
) { }),
if (c[C] == "\n") (f = 0), (T = 0), (p = 0), (_ += b * h); (i.print = function (t, r, i, a, s, o, l, h) {
else { (o = o || "middle"), (l = w(k(l || 0, 1), -1)), (h = w(k(h || 1, 3), 1));
var A = (p && a.glyphs[c[C - 1]]) || {}, var u,
T = a.glyphs[c[C]]; c = x(i)[v](d),
(f += p ? (A.w || a.w) + ((A.k && A.k[c[C]]) || 0) + a.w * l : 0), (p = 1); f = 0,
} p = 0,
T && g = d;
T.d && if ((e.is(a, "string") && (a = this.getFont(a)), a)) {
(g += e.transformPath(T.d, ["t", f * u, _ * u, "s", u, u, m, B, "t", (t - m) / u, (r - B) / u])); u = (s || 16) / a.face["units-per-em"];
for (
var y = a.face.bbox[v](n),
m = +y[0],
b = y[3] - y[1],
_ = 0,
B = +y[1] + (o == "baseline" ? b + +a.face.descent : b / 2),
C = 0,
S = c.length;
C < S;
C++
) {
if (c[C] == "\n") (f = 0), (T = 0), (p = 0), (_ += b * h);
else {
var A = (p && a.glyphs[c[C - 1]]) || {},
T = a.glyphs[c[C]];
(f += p ? (A.w || a.w) + ((A.k && A.k[c[C]]) || 0) + a.w * l : 0), (p = 1);
} }
T &&
T.d &&
(g += e.transformPath(T.d, ["t", f * u, _ * u, "s", u, u, m, B, "t", (t - m) / u, (r - B) / u]));
} }
return this.path(g).attr({ fill: "#000", stroke: "none" }); }
}), return this.path(g).attr({ fill: "#000", stroke: "none" });
(i.add = function (t) { }),
if (e.is(t, "array")) (i.add = function (t) {
for (var r, i = this.set(), n = 0, s = t.length; n < s; n++) if (e.is(t, "array"))
(r = t[n] || {}), a[o](r.type) && i.push(this[r.type]().attr(r)); for (var r, i = this.set(), n = 0, s = t.length; n < s; n++)
return i; (r = t[n] || {}), a[o](r.type) && i.push(this[r.type]().attr(r));
}), return i;
(e.format = function (t, r) { }),
var i = e.is(r, T) ? [0][f](r) : arguments; (e.format = function (t, r) {
return ( var i = e.is(r, T) ? [0][f](r) : arguments;
t && return (
e.is(t, "string") && t &&
i.length - 1 && e.is(t, "string") &&
(t = t.replace(s, function (t, e) { i.length - 1 &&
return i[++e] == null ? d : i[e]; (t = t.replace(s, function (t, e) {
})), return i[++e] == null ? d : i[e];
t || d })),
); t || d
}), );
(e.fullfill = }),
((oe = /\{([^\}]+)\}/g), (e.fullfill =
(le = /(?:(?:^|\.)(.+?)(?=\[|\.|$|\()|\[('|")(.+?)\2\])(\(\))?/g), ((oe = /\{([^\}]+)\}/g),
function (t, e) { (le = /(?:(?:^|\.)(.+?)(?=\[|\.|$|\()|\[('|")(.+?)\2\])(\(\))?/g),
return String(t).replace(oe, function (t, r) { function (t, e) {
return (function (t, e, r) { return String(t).replace(oe, function (t, r) {
var i = r; return (function (t, e, r) {
return ( var i = r;
e.replace(le, function (t, e, r, n, a) { return (
(e = e || n), i && (e in i && (i = i[e]), typeof i == "function" && a && (i = i())); e.replace(le, function (t, e, r, n, a) {
}), (e = e || n), i && (e in i && (i = i[e]), typeof i == "function" && a && (i = i()));
(i = (i == null || i == r ? t : i) + "") }),
); (i = (i == null || i == r ? t : i) + "")
})(t, r, e); );
}); })(t, r, e);
})), });
(e.ninja = function () { })),
if (h.was) l.win.Raphael = h.is; (e.ninja = function () {
else { if (h.was) l.win.Raphael = h.is;
window.Raphael = void 0; else {
try { window.Raphael = void 0;
delete window.Raphael; try {
} catch (t) {} delete window.Raphael;
} } catch (t) {}
return e; }
}), return e;
(e.st = ue), }),
t.on("raphael.DOMload", function () { (e.st = ue),
r = !0; t.on("raphael.DOMload", function () {
}), r = !0;
(function (t, r, i) { }),
t.readyState == null && (function (t, r, i) {
t.addEventListener && t.readyState == null &&
(t.addEventListener( t.addEventListener &&
"DOMContentLoaded", (t.addEventListener(
(i = function () { "DOMContentLoaded",
t.removeEventListener("DOMContentLoaded", i, !1), (t.readyState = "complete"); (i = function () {
}), t.removeEventListener("DOMContentLoaded", i, !1), (t.readyState = "complete");
!1, }),
), !1,
(t.readyState = "loading")), ),
(function r() { (t.readyState = "loading")),
/in/.test(t.readyState) ? setTimeout(r, 9) : e.eve("raphael.DOMload"); (function r() {
})(); /in/.test(t.readyState) ? setTimeout(r, 9) : e.eve("raphael.DOMload");
})(document), })();
e })(document),
); e;
}.apply(e, i)) || (t.exports = n); }.apply(e, i)) || (t.exports = n);
}, },
function (t, e, r) { function (t, e, r) {

14
src/engine.jsx
View File

@ -26,7 +26,7 @@ import { SidebarRoot } from "./Sidebar/ui/SidebarRoot";
import { CorporationRoot } from "./Corporation/ui/CorporationRoot"; import { CorporationRoot } from "./Corporation/ui/CorporationRoot";
import { ResleeveRoot } from "./PersonObjects/Resleeving/ui/ResleeveRoot"; import { ResleeveRoot } from "./PersonObjects/Resleeving/ui/ResleeveRoot";
import { GameOptionsRoot } from "./ui/React/GameOptionsRoot"; import { GameOptionsRoot } from "./ui/React/GameOptionsRoot";
import { Theme } from "./ui/React/Theme"; import { TTheme as Theme } from "./ui/React/Theme";
import { SleeveRoot } from "./PersonObjects/Sleeve/ui/SleeveRoot"; import { SleeveRoot } from "./PersonObjects/Sleeve/ui/SleeveRoot";
import { displayInfiltrationContent } from "./Infiltration/Helper"; import { displayInfiltrationContent } from "./Infiltration/Helper";
import { import {
@ -408,6 +408,7 @@ const Engine = {
}, },
displayCharacterOverviewInfo: function () { displayCharacterOverviewInfo: function () {
console.log("rendering");
ReactDOM.render( ReactDOM.render(
<Theme> <Theme>
<CharacterOverview player={Player} save={() => saveObject.saveGame(Engine.indexedDb)} /> <CharacterOverview player={Player} save={() => saveObject.saveGame(Engine.indexedDb)} />
@ -803,7 +804,12 @@ const Engine = {
removeLoadingScreen(); removeLoadingScreen();
} }
ReactDOM.render(<SidebarRoot engine={this} player={Player} />, document.getElementById("sidebar")); ReactDOM.render(
<Theme>
<SidebarRoot engine={this} player={Player} />
</Theme>,
document.getElementById("sidebar"),
);
}, },
setDisplayElements: function () { setDisplayElements: function () {
@ -834,6 +840,8 @@ const Engine = {
// Initialization // Initialization
init: function () { init: function () {
// Player was working cancel button // Player was working cancel button
Engine.displayCharacterOverviewInfo();
if (Player.isWorking) { if (Player.isWorking) {
var cancelButton = document.getElementById("work-in-progress-cancel-button"); var cancelButton = document.getElementById("work-in-progress-cancel-button");
cancelButton.addEventListener("click", function () { cancelButton.addEventListener("click", function () {
@ -863,8 +871,6 @@ const Engine = {
} }
Engine.loadWorkInProgressContent(); Engine.loadWorkInProgressContent();
Engine.displayCharacterOverviewInfo();
} else { } else {
Engine.loadTerminalContent(); Engine.loadTerminalContent();
} }

26
src/ui/React/CharacterOverview.tsx
View File

@ -1,23 +1,23 @@
// Root React Component for the Corporation UI // Root React Component for the Corporation UI
import React, { useState, useEffect } from "react"; import React, { useState, useEffect } from "react";
import { makeStyles } from "@material-ui/core/styles"; import makeStyles from '@mui/styles/makeStyles';
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
import { numeralWrapper } from "../../ui/numeralFormat"; import { numeralWrapper } from "../../ui/numeralFormat";
import { Reputation } from "./Reputation"; import { Reputation } from "./Reputation";
import Table from "@material-ui/core/Table"; import Table from "@mui/material/Table";
import TableBody from "@material-ui/core/TableBody"; import TableBody from "@mui/material/TableBody";
import TableCell from "@material-ui/core/TableCell"; import TableCell from "@mui/material/TableCell";
import TableContainer from "@material-ui/core/TableContainer"; import TableContainer from "@mui/material/TableContainer";
import TableHead from "@material-ui/core/TableHead"; import TableHead from "@mui/material/TableHead";
import TableRow from "@material-ui/core/TableRow"; import TableRow from "@mui/material/TableRow";
import Paper from "@material-ui/core/Paper"; import Paper from "@mui/material/Paper";
import Box from "@material-ui/core/Box"; import Box from "@mui/material/Box";
import Typography from "@material-ui/core/Typography"; import Typography from "@mui/material/Typography";
import Divider from "@material-ui/core/Divider"; import Divider from "@mui/material/Divider";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import Collapse from "@material-ui/core/Collapse"; import Collapse from "@mui/material/Collapse";
import { colors } from "./Theme"; import { colors } from "./Theme";

4
src/ui/React/ConfirmationModal.tsx
View File

@ -1,8 +1,8 @@
import React from "react"; import React from "react";
import { Modal } from "./Modal"; import { Modal } from "./Modal";
import Button from "@material-ui/core/Button"; import Button from "@mui/material/Button";
import Typography from "@material-ui/core/Typography"; import Typography from "@mui/material/Typography";
interface IProps { interface IProps {
open: boolean; open: boolean;

50
src/ui/React/GameOptionsRoot.tsx
View File

@ -2,20 +2,23 @@ import React, { useState } from "react";
import { IPlayer } from "../../PersonObjects/IPlayer"; import { IPlayer } from "../../PersonObjects/IPlayer";
import { makeStyles, createStyles, Theme } from "@material-ui/core/styles"; import { Theme } from "@mui/material/styles";
import Typography from "@material-ui/core/Typography"; import makeStyles from "@mui/styles/makeStyles";
import Slider from "@material-ui/core/Slider"; import createStyles from "@mui/styles/createStyles";
import Grid from "@material-ui/core/Grid"; import Typography from "@mui/material/Typography";
import FormControlLabel from "@material-ui/core/FormControlLabel"; import Slider from "@mui/material/Slider";
import Switch from "@material-ui/core/Switch"; import Grid from "@mui/material/Grid";
import Select from "@material-ui/core/Select"; import FormControlLabel from "@mui/material/FormControlLabel";
import MenuItem from "@material-ui/core/MenuItem"; import Switch from "@mui/material/Switch";
import Button from "@material-ui/core/Button"; import Select, { SelectChangeEvent } from "@mui/material/Select";
import Box from "@material-ui/core/Box"; import MenuItem from "@mui/material/MenuItem";
import List from "@material-ui/core/List"; import Button from "@mui/material/Button";
import ListItem from "@material-ui/core/ListItem"; import Box from "@mui/material/Box";
import Link from "@material-ui/core/Link"; import List from "@mui/material/List";
import Tooltip from "@material-ui/core/Tooltip"; import ListItem from "@mui/material/ListItem";
import Link from "@mui/material/Link";
import Tooltip from "@mui/material/Tooltip";
import { FileDiagnosticModal } from "../../Diagnostic/FileDiagnosticModal"; import { FileDiagnosticModal } from "../../Diagnostic/FileDiagnosticModal";
import { ConfirmationModal } from "./ConfirmationModal"; import { ConfirmationModal } from "./ConfirmationModal";
@ -24,12 +27,12 @@ import { Settings } from "../../Settings/Settings";
const useStyles = makeStyles((theme: Theme) => const useStyles = makeStyles((theme: Theme) =>
createStyles({ createStyles({
root: { root: {
width: theme.spacing(50), width: 50,
padding: theme.spacing(2), padding: 2,
userSelect: "none", userSelect: "none",
}, },
pad: { pad: {
padding: theme.spacing(2), padding: 2,
}, },
}), }),
); );
@ -142,7 +145,7 @@ export function GameOptionsRoot(props: IProps): React.ReactElement {
setDisableTextEffects(event.target.checked); setDisableTextEffects(event.target.checked);
Settings.DisableTextEffects = event.target.checked; Settings.DisableTextEffects = event.target.checked;
} }
function handleLocaleChange(event: React.ChangeEvent<{ value: unknown }>): void { function handleLocaleChange(event: SelectChangeEvent<string>): void {
setLocale(event.target.value as string); setLocale(event.target.value as string);
Settings.Locale = event.target.value as string; Settings.Locale = event.target.value as string;
} }
@ -544,10 +547,13 @@ export function GameOptionsRoot(props: IProps): React.ReactElement {
</Grid> </Grid>
<FileDiagnosticModal open={diagnosticOpen} onClose={() => setDiagnosticOpen(false)} /> <FileDiagnosticModal open={diagnosticOpen} onClose={() => setDiagnosticOpen(false)} />
<ConfirmationModal <ConfirmationModal
onConfirm={() => {props.delete(); setDeleteOpen(false);}} onConfirm={() => {
open={deleteGameOpen} props.delete();
onClose={() => setDeleteOpen(false)} setDeleteOpen(false);
confirmationText={"Really delete your game? (It's permanent!)"} }}
open={deleteGameOpen}
onClose={() => setDeleteOpen(false)}
confirmationText={"Really delete your game? (It's permanent!)"}
/> />
</div> </div>
); );

12
src/ui/React/Modal.tsx
View File

@ -1,8 +1,10 @@
import React from "react"; import React from "react";
import { makeStyles, createStyles, Theme } from "@material-ui/core"; import { Theme } from "@mui/material";
import M from "@material-ui/core/Modal"; import makeStyles from "@mui/styles/makeStyles";
import Backdrop from "@material-ui/core/Backdrop"; import createStyles from "@mui/styles/createStyles";
import Fade from "@material-ui/core/Fade"; import M from "@mui/material/Modal";
import Backdrop from "@mui/material/Backdrop";
import Fade from "@mui/material/Fade";
const useStyles = makeStyles((theme: Theme) => const useStyles = makeStyles((theme: Theme) =>
createStyles({ createStyles({
@ -15,7 +17,7 @@ const useStyles = makeStyles((theme: Theme) =>
backgroundColor: theme.palette.background.paper, backgroundColor: theme.palette.background.paper,
border: "2px solid " + theme.palette.primary.main, border: "2px solid " + theme.palette.primary.main,
boxShadow: theme.shadows[5], boxShadow: theme.shadows[5],
padding: theme.spacing(2, 4, 3), padding: 2,
maxWidth: "80%", maxWidth: "80%",
maxHeight: "80%", maxHeight: "80%",
overflow: "auto", overflow: "auto",

3
src/ui/React/MuiButton.tsx
View File

@ -4,7 +4,8 @@
*/ */
import React from "react"; import React from "react";
import { Button, ButtonProps, makeStyles } from "@material-ui/core"; import { Button, ButtonProps } from "@mui/material";
import makeStyles from '@mui/styles/makeStyles';
const useStyles = makeStyles({ const useStyles = makeStyles({
// Tries to emulate StdButton in buttons.scss // Tries to emulate StdButton in buttons.scss
root: { root: {

4
src/ui/React/MuiPaper.tsx
View File

@ -4,7 +4,9 @@
*/ */
import React from "react"; import React from "react";
import { Paper, PaperProps, makeStyles } from "@material-ui/core"; import { Paper, PaperProps } from "@mui/material";
import makeStyles from '@mui/styles/makeStyles';
const useStyles = makeStyles({ const useStyles = makeStyles({
root: { root: {

4
src/ui/React/MuiTextField.tsx
View File

@ -4,7 +4,9 @@
*/ */
import React from "react"; import React from "react";
import { makeStyles, TextField, TextFieldProps } from "@material-ui/core"; import { TextField, TextFieldProps } from "@mui/material";
import makeStyles from '@mui/styles/makeStyles';
const backgroundColorStyles = { const backgroundColorStyles = {
backgroundColor: "rgba(57, 54, 54, 0.9)", backgroundColor: "rgba(57, 54, 54, 0.9)",

3
src/ui/React/Select.tsx
View File

@ -4,7 +4,8 @@
*/ */
import React from "react"; import React from "react";
import { Select as MuiSelect, SelectProps, makeStyles } from "@material-ui/core"; import { Select as MuiSelect, SelectProps } from "@mui/material";
import makeStyles from '@mui/styles/makeStyles';
import { colors } from "./Theme"; import { colors } from "./Theme";
const useStyles = makeStyles({ const useStyles = makeStyles({

205
src/ui/React/Theme.tsx
View File

@ -1,5 +1,10 @@
import React from "react"; import React from "react";
import { createMuiTheme, ThemeProvider } from "@material-ui/core/styles"; import { createTheme, ThemeProvider, Theme, StyledEngineProvider, adaptV4Theme } from "@mui/material/styles";
declare module "@mui/styles/defaultTheme" {
// eslint-disable-next-line @typescript-eslint/no-empty-interface
interface DefaultTheme extends Theme {}
}
export const colors = { export const colors = {
primarylight: "#0f0", primarylight: "#0f0",
@ -27,7 +32,7 @@ export const colors = {
int: "#6495ed", int: "#6495ed",
}; };
export const theme = createMuiTheme({ export const theme = createTheme({
palette: { palette: {
primary: { primary: {
light: colors.primarylight, light: colors.primarylight,
@ -54,138 +59,174 @@ export const theme = createMuiTheme({
textTransform: "none", textTransform: "none",
}, },
}, },
overrides: { components: {
MuiInputBase: { MuiInputBase: {
root: { styleOverrides: {
backgroundColor: colors.well, root: {
}, backgroundColor: colors.well,
input: { },
color: colors.primary, input: {
"&::placeholder": { color: colors.primary,
userSelect: "none", "&::placeholder": {
color: colors.primarydark, userSelect: "none",
color: colors.primarydark,
},
}, },
}, },
}, },
MuiInput: { MuiInput: {
root: { styleOverrides: {
backgroundColor: colors.well, root: {
borderBottomColor: "#fff", backgroundColor: colors.well,
}, borderBottomColor: "#fff",
underline: {
"&:hover": {
borderBottomColor: colors.primarydark,
}, },
"&:before": { underline: {
borderBottomColor: colors.primary, "&:hover": {
}, borderBottomColor: colors.primarydark,
"&:after": { },
borderBottomColor: colors.primarylight, "&:before": {
borderBottomColor: colors.primary,
},
"&:after": {
borderBottomColor: colors.primarylight,
},
}, },
}, },
}, },
MuiInputLabel: { MuiInputLabel: {
root: { styleOverrides: {
color: colors.primarydark, // why is this switched? root: {
userSelect: "none", color: colors.primarydark, // why is this switched?
"&:before": { userSelect: "none",
color: colors.primarylight, "&:before": {
color: colors.primarylight,
},
}, },
}, },
}, },
MuiButton: { MuiButton: {
root: { styleOverrides: {
backgroundColor: "#333", root: {
border: "1px solid " + colors.well, backgroundColor: "#333",
color: colors.primary, border: "1px solid " + colors.well,
margin: "5px", color: colors.primary,
padding: "3px 5px", margin: "5px",
"&:hover": { padding: "3px 5px",
backgroundColor: colors.black, "&:hover": {
}, backgroundColor: colors.black,
},
borderRadius: 0, borderRadius: 0,
},
}, },
}, },
MuiSelect: { MuiSelect: {
icon: { styleOverrides: {
color: colors.primary, icon: {
color: colors.primary,
},
}, },
}, },
MuiMenu: { MuiMenu: {
list: { styleOverrides: {
backgroundColor: colors.well, list: {
backgroundColor: colors.well,
},
}, },
}, },
MuiMenuItem: { MuiMenuItem: {
root: { styleOverrides: {
color: colors.primary, root: {
color: colors.primary,
},
}, },
}, },
MuiAccordionSummary: { MuiAccordionSummary: {
root: { styleOverrides: {
backgroundColor: "#111", root: {
backgroundColor: "#111",
},
}, },
}, },
MuiAccordionDetails: { MuiAccordionDetails: {
root: { styleOverrides: {
backgroundColor: colors.black, root: {
backgroundColor: colors.black,
},
}, },
}, },
MuiIconButton: { MuiIconButton: {
root: { styleOverrides: {
color: colors.primary, root: {
color: colors.primary,
},
}, },
}, },
MuiTooltip: { MuiTooltip: {
tooltip: { styleOverrides: {
fontSize: "1em", tooltip: {
color: colors.primary, fontSize: "1em",
backgroundColor: colors.well, color: colors.primary,
borderRadius: 0, backgroundColor: colors.well,
border: "2px solid white", borderRadius: 0,
border: "2px solid white",
},
}, },
}, },
MuiSvgIcon: { MuiSvgIcon: {
root: { styleOverrides: {
color: colors.primary, root: {
color: colors.primary,
},
}, },
}, },
MuiDrawer: { MuiDrawer: {
paper: { styleOverrides: {
"&::-webkit-scrollbar": { paper: {
// webkit "&::-webkit-scrollbar": {
display: "none", // webkit
display: "none",
},
scrollbarWidth: "none", // firefox
backgroundColor: colors.black,
},
paperAnchorDockedLeft: {
borderRight: "1px solid " + colors.welllight,
}, },
scrollbarWidth: "none", // firefox
backgroundColor: colors.black,
},
paperAnchorDockedLeft: {
borderRight: "1px solid " + colors.welllight,
}, },
}, },
MuiDivider: { MuiDivider: {
root: { styleOverrides: {
backgroundColor: colors.welllight, root: {
backgroundColor: colors.welllight,
},
}, },
}, },
MuiFormControlLabel: { MuiFormControlLabel: {
root: { styleOverrides: {
color: colors.primary, root: {
color: colors.primary,
},
}, },
}, },
MuiSwitch: { MuiSwitch: {
switchBase: { styleOverrides: {
color: colors.primarydark, switchBase: {
}, color: colors.primarydark,
track: { },
backgroundColor: colors.welllight, track: {
backgroundColor: colors.welllight,
},
}, },
}, },
MuiPaper: { MuiPaper: {
root: { styleOverrides: {
backgroundColor: colors.black, root: {
border: "1px solid " + colors.welllight, backgroundColor: colors.black,
border: "1px solid " + colors.welllight,
},
}, },
}, },
}, },
@ -195,6 +236,8 @@ interface IProps {
children: JSX.Element[] | JSX.Element; children: JSX.Element[] | JSX.Element;
} }
export const Theme = ({ children }: IProps): React.ReactElement => ( export const TTheme = ({ children }: IProps): React.ReactElement => (
<ThemeProvider theme={theme}>{children}</ThemeProvider> <StyledEngineProvider injectFirst>
<ThemeProvider theme={theme}>{children}</ThemeProvider>
</StyledEngineProvider>
); );