{content}
+ {toDisplay}
{
diff --git a/tgui/packages/tgui/components/Dimmer.jsx b/tgui/packages/tgui/components/Dimmer.jsx
index 85e046ca0db..5e92ea84fc1 100644
--- a/tgui/packages/tgui/components/Dimmer.jsx
+++ b/tgui/packages/tgui/components/Dimmer.jsx
@@ -5,6 +5,7 @@
*/
import { classes } from 'common/react';
+
import { Box } from './Box';
export const Dimmer = (props) => {
diff --git a/tgui/packages/tgui/components/DraggableControl.jsx b/tgui/packages/tgui/components/DraggableControl.jsx
index 7a8671c17ff..bb55287b02a 100644
--- a/tgui/packages/tgui/components/DraggableControl.jsx
+++ b/tgui/packages/tgui/components/DraggableControl.jsx
@@ -6,6 +6,7 @@
import { clamp } from 'common/math';
import { Component, createRef } from 'react';
+
import { AnimatedNumber } from './AnimatedNumber';
const DEFAULT_UPDATE_RATE = 400;
diff --git a/tgui/packages/tgui/components/Dropdown.tsx b/tgui/packages/tgui/components/Dropdown.tsx
index a69b184c1fa..f09653a6967 100644
--- a/tgui/packages/tgui/components/Dropdown.tsx
+++ b/tgui/packages/tgui/components/Dropdown.tsx
@@ -2,6 +2,7 @@ import { createPopper, VirtualElement } from '@popperjs/core';
import { classes } from 'common/react';
import { Component, ReactNode } from 'react';
import { findDOMNode, render } from 'react-dom';
+
import { Box, BoxProps } from './Box';
import { Button } from './Button';
import { Icon } from './Icon';
diff --git a/tgui/packages/tgui/components/FakeTerminal.jsx b/tgui/packages/tgui/components/FakeTerminal.jsx
index f97f7e6bf3a..d3b7fbe65db 100644
--- a/tgui/packages/tgui/components/FakeTerminal.jsx
+++ b/tgui/packages/tgui/components/FakeTerminal.jsx
@@ -1,6 +1,7 @@
-import { Box } from './Box';
import { Component, Fragment } from 'react';
+import { Box } from './Box';
+
export class FakeTerminal extends Component {
constructor(props) {
super(props);
diff --git a/tgui/packages/tgui/components/Flex.tsx b/tgui/packages/tgui/components/Flex.tsx
index da063f0296f..50dba277958 100644
--- a/tgui/packages/tgui/components/Flex.tsx
+++ b/tgui/packages/tgui/components/Flex.tsx
@@ -5,6 +5,7 @@
*/
import { classes } from 'common/react';
+
import { BoxProps, computeBoxClassName, computeBoxProps, unit } from './Box';
export type FlexProps = Partial<{
diff --git a/tgui/packages/tgui/components/Icon.tsx b/tgui/packages/tgui/components/Icon.tsx
index e8f7f099e90..cf0b55dfa8c 100644
--- a/tgui/packages/tgui/components/Icon.tsx
+++ b/tgui/packages/tgui/components/Icon.tsx
@@ -8,6 +8,7 @@
import { BooleanLike, classes } from 'common/react';
import { ReactNode } from 'react';
+
import { BoxProps, computeBoxClassName, computeBoxProps } from './Box';
const FA_OUTLINE_REGEX = /-o$/;
@@ -23,16 +24,16 @@ type IconPropsUnique = { name: string } & Partial<{
export type IconProps = IconPropsUnique & BoxProps;
export const Icon = (props: IconProps) => {
- let { style = {}, ...restlet } = props;
- const { name, size, spin, className, rotation, ...rest } = restlet;
+ const { name, size, spin, className, rotation, ...rest } = props;
+ const customStyle = rest.style || {};
if (size) {
- style['fontSize'] = size * 100 + '%';
+ customStyle.fontSize = size * 100 + '%';
}
if (rotation) {
- style['transform'] = `rotate(${rotation}deg)`;
+ customStyle.transform = `rotate(${rotation}deg)`;
}
- rest.style = style;
+ rest.style = customStyle;
const boxProps = computeBoxProps(rest);
diff --git a/tgui/packages/tgui/components/Image.tsx b/tgui/packages/tgui/components/Image.tsx
index 33a3850089c..3e1519bfbbf 100644
--- a/tgui/packages/tgui/components/Image.tsx
+++ b/tgui/packages/tgui/components/Image.tsx
@@ -1,4 +1,5 @@
import { ReactNode } from 'react';
+
import { BoxProps, computeBoxProps } from './Box';
import { Tooltip } from './Tooltip';
diff --git a/tgui/packages/tgui/components/InfinitePlane.jsx b/tgui/packages/tgui/components/InfinitePlane.jsx
index 3f2bf598c23..5277f2ad796 100644
--- a/tgui/packages/tgui/components/InfinitePlane.jsx
+++ b/tgui/packages/tgui/components/InfinitePlane.jsx
@@ -1,9 +1,10 @@
-import { computeBoxProps } from './Box';
-import { Stack } from './Stack';
-import { ProgressBar } from './ProgressBar';
-import { Button } from './Button';
import { Component } from 'react';
+import { computeBoxProps } from './Box';
+import { Button } from './Button';
+import { ProgressBar } from './ProgressBar';
+import { Stack } from './Stack';
+
const ZOOM_MIN_VAL = 0.5;
const ZOOM_MAX_VAL = 1.5;
diff --git a/tgui/packages/tgui/components/Input.tsx b/tgui/packages/tgui/components/Input.tsx
index b1d7e8cfb7a..c515627b8c1 100644
--- a/tgui/packages/tgui/components/Input.tsx
+++ b/tgui/packages/tgui/components/Input.tsx
@@ -7,12 +7,14 @@
import { KEY } from 'common/keys';
import { classes } from 'common/react';
import { KeyboardEvent, SyntheticEvent, useEffect, useRef } from 'react';
+
import { Box, BoxProps } from './Box';
type Props = Partial<{
autoFocus: boolean;
autoSelect: boolean;
className: string;
+ disabled: boolean;
fluid: boolean;
maxLength: number;
monospace: boolean;
@@ -37,7 +39,11 @@ export const Input = (props: Props) => {
const {
autoFocus,
autoSelect,
+ className,
+ disabled,
+ fluid,
maxLength,
+ monospace,
onChange,
onEnter,
onEscape,
@@ -45,9 +51,8 @@ export const Input = (props: Props) => {
placeholder,
selfClear,
value,
- ...boxProps
+ ...rest
} = props;
- const { className, fluid, monospace, ...rest } = boxProps;
const inputRef = useRef.
onChange?.(event, event.target.value)}
onChange={(event) => onInput?.(event, event.target.value)}
diff --git a/tgui/packages/tgui/components/KeyListener.tsx b/tgui/packages/tgui/components/KeyListener.tsx
index d401642a3cf..566026f0cb3 100644
--- a/tgui/packages/tgui/components/KeyListener.tsx
+++ b/tgui/packages/tgui/components/KeyListener.tsx
@@ -1,4 +1,5 @@
import { Component } from 'react';
+
import { KeyEvent } from '../events';
import { listenForKeyEvents } from '../hotkeys';
diff --git a/tgui/packages/tgui/components/Knob.jsx b/tgui/packages/tgui/components/Knob.jsx
index 5702c16129a..e9067fc71d6 100644
--- a/tgui/packages/tgui/components/Knob.jsx
+++ b/tgui/packages/tgui/components/Knob.jsx
@@ -6,6 +6,7 @@
import { keyOfMatchingRange, scale } from 'common/math';
import { classes } from 'common/react';
+
import { computeBoxClassName, computeBoxProps } from './Box';
import { DraggableControl } from './DraggableControl';
diff --git a/tgui/packages/tgui/components/LabeledList.tsx b/tgui/packages/tgui/components/LabeledList.tsx
index 0e23cf96683..2c2baa9c34c 100644
--- a/tgui/packages/tgui/components/LabeledList.tsx
+++ b/tgui/packages/tgui/components/LabeledList.tsx
@@ -6,6 +6,7 @@
import { BooleanLike, classes } from 'common/react';
import { PropsWithChildren, ReactNode } from 'react';
+
import { Box, unit } from './Box';
import { Divider } from './Divider';
import { Tooltip } from './Tooltip';
diff --git a/tgui/packages/tgui/components/MenuBar.tsx b/tgui/packages/tgui/components/MenuBar.tsx
index 97ded4397db..acf35e82812 100644
--- a/tgui/packages/tgui/components/MenuBar.tsx
+++ b/tgui/packages/tgui/components/MenuBar.tsx
@@ -6,8 +6,9 @@
import { classes } from 'common/react';
import { Component, createRef, ReactNode, RefObject } from 'react';
-import { Box } from './Box';
+
import { logger } from '../logging';
+import { Box } from './Box';
import { Icon } from './Icon';
type MenuProps = {
diff --git a/tgui/packages/tgui/components/Modal.jsx b/tgui/packages/tgui/components/Modal.jsx
index 0e0181acee6..da17c6e5c84 100644
--- a/tgui/packages/tgui/components/Modal.jsx
+++ b/tgui/packages/tgui/components/Modal.jsx
@@ -5,6 +5,7 @@
*/
import { classes } from 'common/react';
+
import { computeBoxClassName, computeBoxProps } from './Box';
import { Dimmer } from './Dimmer';
diff --git a/tgui/packages/tgui/components/NoticeBox.jsx b/tgui/packages/tgui/components/NoticeBox.jsx
index 09e205b46be..de36715cc2e 100644
--- a/tgui/packages/tgui/components/NoticeBox.jsx
+++ b/tgui/packages/tgui/components/NoticeBox.jsx
@@ -5,6 +5,7 @@
*/
import { classes } from 'common/react';
+
import { Box } from './Box';
export const NoticeBox = (props) => {
diff --git a/tgui/packages/tgui/components/NumberInput.jsx b/tgui/packages/tgui/components/NumberInput.jsx
index 24c7a7d7ac0..f5579731c0b 100644
--- a/tgui/packages/tgui/components/NumberInput.jsx
+++ b/tgui/packages/tgui/components/NumberInput.jsx
@@ -7,6 +7,7 @@
import { clamp } from 'common/math';
import { classes } from 'common/react';
import { Component, createRef } from 'react';
+
import { AnimatedNumber } from './AnimatedNumber';
import { Box } from './Box';
diff --git a/tgui/packages/tgui/components/ProgressBar.tsx b/tgui/packages/tgui/components/ProgressBar.tsx
index 23eef869dfd..9cb442479ea 100644
--- a/tgui/packages/tgui/components/ProgressBar.tsx
+++ b/tgui/packages/tgui/components/ProgressBar.tsx
@@ -4,12 +4,13 @@
* @license MIT
*/
-import { clamp01, scale, keyOfMatchingRange, toFixed } from 'common/math';
+import { clamp01, keyOfMatchingRange, scale, toFixed } from 'common/math';
import { classes } from 'common/react';
-import { BoxProps, computeBoxClassName, computeBoxProps } from './Box';
-import { CSS_COLORS } from '../constants';
import { PropsWithChildren } from 'react';
+import { CSS_COLORS } from '../constants';
+import { BoxProps, computeBoxClassName, computeBoxProps } from './Box';
+
type Props = {
value: number;
} & Partial<{
diff --git a/tgui/packages/tgui/components/RestrictedInput.jsx b/tgui/packages/tgui/components/RestrictedInput.jsx
index 362510fbfa5..3125545bae1 100644
--- a/tgui/packages/tgui/components/RestrictedInput.jsx
+++ b/tgui/packages/tgui/components/RestrictedInput.jsx
@@ -1,8 +1,9 @@
-import { classes } from 'common/react';
+import { KEY_ENTER, KEY_ESCAPE } from 'common/keycodes';
import { clamp } from 'common/math';
+import { classes } from 'common/react';
import { Component, createRef } from 'react';
+
import { Box } from './Box';
-import { KEY_ESCAPE, KEY_ENTER } from 'common/keycodes';
const DEFAULT_MIN = 0;
const DEFAULT_MAX = 10000;
diff --git a/tgui/packages/tgui/components/RoundGauge.jsx b/tgui/packages/tgui/components/RoundGauge.jsx
index 4bbaee433d6..652875f641e 100644
--- a/tgui/packages/tgui/components/RoundGauge.jsx
+++ b/tgui/packages/tgui/components/RoundGauge.jsx
@@ -6,6 +6,7 @@
import { clamp01, keyOfMatchingRange, scale } from 'common/math';
import { classes } from 'common/react';
+
import { AnimatedNumber } from './AnimatedNumber';
import { Box, computeBoxClassName, computeBoxProps } from './Box';
diff --git a/tgui/packages/tgui/components/Section.tsx b/tgui/packages/tgui/components/Section.tsx
index 6640f5a99e0..8c9b8639f5d 100644
--- a/tgui/packages/tgui/components/Section.tsx
+++ b/tgui/packages/tgui/components/Section.tsx
@@ -4,10 +4,11 @@
* @license MIT
*/
-import { BoxProps, computeBoxClassName, computeBoxProps } from './Box';
-import { forwardRef, ReactNode, RefObject, useEffect } from 'react';
-import { addScrollableNode, removeScrollableNode } from '../events';
import { canRender, classes } from 'common/react';
+import { forwardRef, ReactNode, RefObject, useEffect } from 'react';
+
+import { addScrollableNode, removeScrollableNode } from '../events';
+import { BoxProps, computeBoxClassName, computeBoxProps } from './Box';
export type SectionProps = Partial<{
buttons: ReactNode;
diff --git a/tgui/packages/tgui/components/Slider.jsx b/tgui/packages/tgui/components/Slider.jsx
index aa84a417287..7f1aa457c7b 100644
--- a/tgui/packages/tgui/components/Slider.jsx
+++ b/tgui/packages/tgui/components/Slider.jsx
@@ -6,6 +6,7 @@
import { clamp01, keyOfMatchingRange, scale } from 'common/math';
import { classes } from 'common/react';
+
import { computeBoxClassName, computeBoxProps } from './Box';
import { DraggableControl } from './DraggableControl';
diff --git a/tgui/packages/tgui/components/Stack.tsx b/tgui/packages/tgui/components/Stack.tsx
index 223d4632bbb..18ae34c09e8 100644
--- a/tgui/packages/tgui/components/Stack.tsx
+++ b/tgui/packages/tgui/components/Stack.tsx
@@ -6,6 +6,7 @@
import { classes } from 'common/react';
import { RefObject } from 'react';
+
import {
computeFlexClassName,
computeFlexItemClassName,
diff --git a/tgui/packages/tgui/components/StyleableSection.tsx b/tgui/packages/tgui/components/StyleableSection.tsx
index 8a1ea48edb9..53b193707f6 100644
--- a/tgui/packages/tgui/components/StyleableSection.tsx
+++ b/tgui/packages/tgui/components/StyleableSection.tsx
@@ -1,4 +1,5 @@
import { PropsWithChildren, ReactNode } from 'react';
+
import { Box } from './Box';
type Props = Partial<{
diff --git a/tgui/packages/tgui/components/Table.jsx b/tgui/packages/tgui/components/Table.jsx
index f9a59b36c7f..31a0a82d041 100644
--- a/tgui/packages/tgui/components/Table.jsx
+++ b/tgui/packages/tgui/components/Table.jsx
@@ -5,6 +5,7 @@
*/
import { classes } from 'common/react';
+
import { computeBoxClassName, computeBoxProps } from './Box';
export const Table = (props) => {
diff --git a/tgui/packages/tgui/components/Tabs.tsx b/tgui/packages/tgui/components/Tabs.tsx
index 822ce2d89dd..84779bcf748 100644
--- a/tgui/packages/tgui/components/Tabs.tsx
+++ b/tgui/packages/tgui/components/Tabs.tsx
@@ -6,6 +6,7 @@
import { canRender, classes } from 'common/react';
import { PropsWithChildren, ReactNode } from 'react';
+
import { BoxProps, computeBoxClassName, computeBoxProps } from './Box';
import { Icon } from './Icon';
diff --git a/tgui/packages/tgui/components/TextArea.tsx b/tgui/packages/tgui/components/TextArea.tsx
index cc6376d0de2..b8620f5a2df 100644
--- a/tgui/packages/tgui/components/TextArea.tsx
+++ b/tgui/packages/tgui/components/TextArea.tsx
@@ -5,25 +5,27 @@
* @license MIT
*/
+import { KEY } from 'common/keys';
import { classes } from 'common/react';
import {
forwardRef,
- useEffect,
- useState,
RefObject,
- useRef,
+ useEffect,
useImperativeHandle,
+ useRef,
+ useState,
} from 'react';
-import { toInputValue } from './Input';
-import { KEY } from 'common/keys';
-import { Box, BoxProps } from './Box';
import { ChangeEvent, KeyboardEvent } from 'react';
+import { Box, BoxProps } from './Box';
+import { toInputValue } from './Input';
+
type Props = Partial<{
autoFocus: boolean;
autoSelect: boolean;
displayedValue: string;
dontUseTabForIndent: boolean;
+ fluid: boolean;
maxLength: number;
noborder: boolean;
// This fires when: value changes
diff --git a/tgui/packages/tgui/components/TimeDisplay.jsx b/tgui/packages/tgui/components/TimeDisplay.jsx
index bbdd747701c..390dbc93af9 100644
--- a/tgui/packages/tgui/components/TimeDisplay.jsx
+++ b/tgui/packages/tgui/components/TimeDisplay.jsx
@@ -1,6 +1,7 @@
-import { formatTime } from '../format';
import { Component } from 'react';
+import { formatTime } from '../format';
+
// AnimatedNumber Copypaste
const isSafeNumber = (value) => {
return (
diff --git a/tgui/packages/tgui/components/index.ts b/tgui/packages/tgui/components/index.ts
index d80508360a2..556b2933e5a 100644
--- a/tgui/packages/tgui/components/index.ts
+++ b/tgui/packages/tgui/components/index.ts
@@ -14,12 +14,13 @@ export { ByondUi } from './ByondUi';
export { Chart } from './Chart';
export { Collapsible } from './Collapsible';
export { ColorBox } from './ColorBox';
+export { Dialog } from './Dialog';
export { Dimmer } from './Dimmer';
export { Divider } from './Divider';
export { DraggableControl } from './DraggableControl';
export { Dropdown } from './Dropdown';
-export { Flex } from './Flex';
export { FitText } from './FitText';
+export { Flex } from './Flex';
export { Grid } from './Grid';
export { Icon } from './Icon';
export { Image } from './Image';
@@ -33,18 +34,17 @@ export { MenuBar } from './MenuBar';
export { Modal } from './Modal';
export { NoticeBox } from './NoticeBox';
export { NumberInput } from './NumberInput';
-export { ProgressBar } from './ProgressBar';
export { Popper } from './Popper';
+export { ProgressBar } from './ProgressBar';
export { RestrictedInput } from './RestrictedInput';
export { RoundGauge } from './RoundGauge';
export { Section } from './Section';
export { Slider } from './Slider';
-export { StyleableSection } from './StyleableSection';
export { Stack } from './Stack';
+export { StyleableSection } from './StyleableSection';
export { Table } from './Table';
export { Tabs } from './Tabs';
export { TextArea } from './TextArea';
export { TimeDisplay } from './TimeDisplay';
-export { TrackOutsideClicks } from './TrackOutsideClicks';
export { Tooltip } from './Tooltip';
-export { Dialog } from './Dialog';
+export { TrackOutsideClicks } from './TrackOutsideClicks';
diff --git a/tgui/packages/tgui/debug/middleware.js b/tgui/packages/tgui/debug/middleware.js
index 821582df0bb..3f7414335e8 100644
--- a/tgui/packages/tgui/debug/middleware.js
+++ b/tgui/packages/tgui/debug/middleware.js
@@ -5,6 +5,7 @@
*/
import { KEY_BACKSPACE, KEY_F10, KEY_F11, KEY_F12 } from 'common/keycodes';
+
import { globalEvents } from '../events';
import { acquireHotKey } from '../hotkeys';
import {
diff --git a/tgui/packages/tgui/drag.ts b/tgui/packages/tgui/drag.ts
index ee0b312dd2b..584666a97a6 100644
--- a/tgui/packages/tgui/drag.ts
+++ b/tgui/packages/tgui/drag.ts
@@ -4,10 +4,10 @@
* @license MIT
*/
+import { storage } from 'common/storage';
import { vecAdd, vecMultiply, vecScale, vecSubtract } from 'common/vector';
import { createLogger } from './logging';
-import { storage } from 'common/storage';
const logger = createLogger('drag');
const pixelRatio = window.devicePixelRatio ?? 1;
diff --git a/tgui/packages/tgui/events.test.ts b/tgui/packages/tgui/events.test.ts
index c5c4c7f2d78..e7a6c250188 100644
--- a/tgui/packages/tgui/events.test.ts
+++ b/tgui/packages/tgui/events.test.ts
@@ -1,7 +1,7 @@
import {
- KeyEvent,
addScrollableNode,
canStealFocus,
+ KeyEvent,
removeScrollableNode,
setupGlobalEvents,
} from './events';
diff --git a/tgui/packages/tgui/events.ts b/tgui/packages/tgui/events.ts
index 2fceac45f90..cc53d31bfab 100644
--- a/tgui/packages/tgui/events.ts
+++ b/tgui/packages/tgui/events.ts
@@ -6,9 +6,8 @@
* @license MIT
*/
-import { KEY_ALT, KEY_CTRL, KEY_F1, KEY_F12, KEY_SHIFT } from 'common/keycodes';
-
import { EventEmitter } from 'common/events';
+import { KEY_ALT, KEY_CTRL, KEY_F1, KEY_F12, KEY_SHIFT } from 'common/keycodes';
export const globalEvents = new EventEmitter();
let ignoreWindowFocus = false;
@@ -123,7 +122,6 @@ window.addEventListener('focusin', (e) => {
setWindowFocus(true);
if (canStealFocus(e.target as HTMLElement)) {
stealFocus(e.target as HTMLElement);
- return;
}
});
diff --git a/tgui/packages/tgui/hotkeys.ts b/tgui/packages/tgui/hotkeys.ts
index f7176bd0030..be3121bf540 100644
--- a/tgui/packages/tgui/hotkeys.ts
+++ b/tgui/packages/tgui/hotkeys.ts
@@ -5,6 +5,7 @@
*/
import * as keycodes from 'common/keycodes';
+
import { globalEvents, KeyEvent } from './events';
import { createLogger } from './logging';
diff --git a/tgui/packages/tgui/index.tsx b/tgui/packages/tgui/index.tsx
index 13c9356603b..223e532ff79 100644
--- a/tgui/packages/tgui/index.tsx
+++ b/tgui/packages/tgui/index.tsx
@@ -27,17 +27,17 @@ import './styles/themes/wizard.scss';
import './styles/themes/admin.scss';
// SKYRAT ADDITION START
import './styles/themes/clockwork.scss';
+
// SKYRAT ADDITION END
-
-import { configureStore } from './store';
-
-import { captureExternalLinks } from './links';
-import { createRenderer } from './renderer';
import { perf } from 'common/perf';
+import { setupHotReloading } from 'tgui-dev-server/link/client.cjs';
+
+import { setGlobalStore } from './backend';
import { setupGlobalEvents } from './events';
import { setupHotKeys } from './hotkeys';
-import { setupHotReloading } from 'tgui-dev-server/link/client.cjs';
-import { setGlobalStore } from './backend';
+import { captureExternalLinks } from './links';
+import { createRenderer } from './renderer';
+import { configureStore } from './store';
perf.mark('inception', window.performance?.timing?.navigationStart);
perf.mark('init');
diff --git a/tgui/packages/tgui/interfaces/AccountingConsole.tsx b/tgui/packages/tgui/interfaces/AccountingConsole.tsx
index a3f23627753..1e8465c93be 100644
--- a/tgui/packages/tgui/interfaces/AccountingConsole.tsx
+++ b/tgui/packages/tgui/interfaces/AccountingConsole.tsx
@@ -1,3 +1,7 @@
+import { BooleanLike } from 'common/react';
+import { useState } from 'react';
+
+import { useBackend } from '../backend';
import {
BlockQuote,
Collapsible,
@@ -6,10 +10,7 @@ import {
Stack,
Tabs,
} from '../components';
-import { useBackend } from '../backend';
import { Window } from '../layouts';
-import { BooleanLike } from 'common/react';
-import { useState } from 'react';
type Data = {
PlayerAccounts: PlayerAccount[];
diff --git a/tgui/packages/tgui/interfaces/Achievements.jsx b/tgui/packages/tgui/interfaces/Achievements.jsx
index bef15df4bc0..b20df1025cf 100644
--- a/tgui/packages/tgui/interfaces/Achievements.jsx
+++ b/tgui/packages/tgui/interfaces/Achievements.jsx
@@ -1,7 +1,8 @@
+import { useState } from 'react';
+
import { useBackend, useLocalState } from '../backend';
import { Box, Flex, Icon, Table, Tabs, Tooltip } from '../components';
import { Window } from '../layouts';
-import { useState } from 'react';
export const Achievements = (props) => {
const { data } = useBackend();
diff --git a/tgui/packages/tgui/interfaces/AdminFax.jsx b/tgui/packages/tgui/interfaces/AdminFax.jsx
index 47ab1d93660..2ecc8974d42 100644
--- a/tgui/packages/tgui/interfaces/AdminFax.jsx
+++ b/tgui/packages/tgui/interfaces/AdminFax.jsx
@@ -1,15 +1,15 @@
import { useBackend, useLocalState } from '../backend';
import {
- Section,
Box,
- Dropdown,
Button,
- Input,
- TextArea,
Divider,
- NumberInput,
- Tooltip,
+ Dropdown,
+ Input,
Knob,
+ NumberInput,
+ Section,
+ TextArea,
+ Tooltip,
} from '../components';
import { Window } from '../layouts';
diff --git a/tgui/packages/tgui/interfaces/AdminPDA.jsx b/tgui/packages/tgui/interfaces/AdminPDA.jsx
index 84d165a4bfa..09570265a20 100644
--- a/tgui/packages/tgui/interfaces/AdminPDA.jsx
+++ b/tgui/packages/tgui/interfaces/AdminPDA.jsx
@@ -1,5 +1,5 @@
-import { Section, Dropdown, Input, Box, TextArea } from '../components';
import { useBackend, useLocalState } from '../backend';
+import { Box, Dropdown, Input, Section, TextArea } from '../components';
import { Button } from '../components/Button';
import { Window } from '../layouts';
diff --git a/tgui/packages/tgui/interfaces/Adminhelp.tsx b/tgui/packages/tgui/interfaces/Adminhelp.tsx
index 7bc5308b48a..7e29a807f1d 100644
--- a/tgui/packages/tgui/interfaces/Adminhelp.tsx
+++ b/tgui/packages/tgui/interfaces/Adminhelp.tsx
@@ -1,7 +1,8 @@
import { BooleanLike } from 'common/react';
import { useState } from 'react';
+
import { useBackend } from '../backend';
-import { TextArea, Stack, Button, NoticeBox, Input, Box } from '../components';
+import { Box, Button, Input, NoticeBox, Stack, TextArea } from '../components';
import { Window } from '../layouts';
type AdminhelpData = {
diff --git a/tgui/packages/tgui/interfaces/AdventureBrowser.tsx b/tgui/packages/tgui/interfaces/AdventureBrowser.tsx
index 53e1389f04d..cb43f6f319d 100644
--- a/tgui/packages/tgui/interfaces/AdventureBrowser.tsx
+++ b/tgui/packages/tgui/interfaces/AdventureBrowser.tsx
@@ -1,8 +1,8 @@
import { useBackend, useLocalState } from '../backend';
-import { Button, Section, Box, NoticeBox, Table } from '../components';
+import { Box, Button, NoticeBox, Section, Table } from '../components';
+import { formatTime } from '../format';
import { Window } from '../layouts';
import { AdventureDataProvider, AdventureScreen } from './ExodroneConsole';
-import { formatTime } from '../format';
type Adventure = {
ref: string;
diff --git a/tgui/packages/tgui/interfaces/AiRestorer.tsx b/tgui/packages/tgui/interfaces/AiRestorer.tsx
index 9e3ee15c2a0..1add6b5e934 100644
--- a/tgui/packages/tgui/interfaces/AiRestorer.tsx
+++ b/tgui/packages/tgui/interfaces/AiRestorer.tsx
@@ -1,4 +1,5 @@
import { BooleanLike } from 'common/react';
+
import { useBackend } from '../backend';
import {
Box,
diff --git a/tgui/packages/tgui/interfaces/AiVoiceChanger.tsx b/tgui/packages/tgui/interfaces/AiVoiceChanger.tsx
index 09300373e9b..9e248a01033 100644
--- a/tgui/packages/tgui/interfaces/AiVoiceChanger.tsx
+++ b/tgui/packages/tgui/interfaces/AiVoiceChanger.tsx
@@ -1,6 +1,7 @@
import { BooleanLike } from 'common/react';
+
import { useBackend } from '../backend';
-import { Button, Section, Input, Dropdown, LabeledList } from '../components';
+import { Button, Dropdown, Input, LabeledList, Section } from '../components';
import { Window } from '../layouts';
type Data = {
@@ -39,7 +40,7 @@ export const AiVoiceChanger = (props) => {
{ResearchNode(data.starting_research, act)}
diff --git a/tgui/packages/tgui/interfaces/ClockworkSlab.jsx b/tgui/packages/tgui/interfaces/ClockworkSlab.jsx
index f9b0caf1802..63649326f59 100644
--- a/tgui/packages/tgui/interfaces/ClockworkSlab.jsx
+++ b/tgui/packages/tgui/interfaces/ClockworkSlab.jsx
@@ -1,20 +1,21 @@
// THIS IS A SKYRAT UI FILE
import { Fragment } from 'react';
+import { useState } from 'react';
+
import { useBackend } from '../backend';
import {
- Icon,
Box,
Button,
- Section,
- Table,
+ Collapsible,
Divider,
Grid,
+ Icon,
ProgressBar,
- Collapsible,
+ Section,
+ Table,
} from '../components';
-import { Window } from '../layouts';
import { TableRow } from '../components/Table';
-import { useState } from 'react';
+import { Window } from '../layouts';
const brassColor = '#DFC69C';
const tinkerCache = '#B5FD9D';
diff --git a/tgui/packages/tgui/interfaces/ColorMatrixEditor.tsx b/tgui/packages/tgui/interfaces/ColorMatrixEditor.tsx
index ea28df9942a..2b3ae692915 100644
--- a/tgui/packages/tgui/interfaces/ColorMatrixEditor.tsx
+++ b/tgui/packages/tgui/interfaces/ColorMatrixEditor.tsx
@@ -1,12 +1,13 @@
-import { useBackend } from '../backend';
import { toFixed } from 'common/math';
+
+import { useBackend } from '../backend';
import {
Box,
- Stack,
- Section,
+ Button,
ByondUi,
NumberInput,
- Button,
+ Section,
+ Stack,
} from '../components';
import { Window } from '../layouts';
diff --git a/tgui/packages/tgui/interfaces/CommandReport.tsx b/tgui/packages/tgui/interfaces/CommandReport.tsx
index 4e7b75f5294..816cbd86df5 100644
--- a/tgui/packages/tgui/interfaces/CommandReport.tsx
+++ b/tgui/packages/tgui/interfaces/CommandReport.tsx
@@ -56,17 +56,19 @@ const CentComName = (props) => {
const { act, data } = useBackend();
const { command_name, command_name_presets = [], custom_name } = data;
+ const sendName = (value) => {
+ act('update_command_name', {
+ updated_name: value,
+ });
+ };
+
return (
- act('update_command_name', {
- updated_name: value,
- })
- }
+ onSelected={(value) => sendName(value)}
/>
{!!custom_name && (
{
mt={1}
value={command_name}
placeholder={command_name}
- onChange={(_, value) =>
- act('update_command_name', {
- updated_name: value,
- })
- }
+ onChange={(_, value) => sendName(value)}
/>
)}
diff --git a/tgui/packages/tgui/interfaces/CommandReportConsole.jsx b/tgui/packages/tgui/interfaces/CommandReportConsole.jsx
index 5c228f58539..8791d1c416a 100644
--- a/tgui/packages/tgui/interfaces/CommandReportConsole.jsx
+++ b/tgui/packages/tgui/interfaces/CommandReportConsole.jsx
@@ -2,8 +2,8 @@
import { useBackend } from '../backend';
import {
Button,
- NoticeBox,
Input,
+ NoticeBox,
Section,
Stack,
TextArea,
diff --git a/tgui/packages/tgui/interfaces/CommunicationsConsole.jsx b/tgui/packages/tgui/interfaces/CommunicationsConsole.jsx
index 7fb0f5cabd7..e578c468e2a 100644
--- a/tgui/packages/tgui/interfaces/CommunicationsConsole.jsx
+++ b/tgui/packages/tgui/interfaces/CommunicationsConsole.jsx
@@ -1,5 +1,6 @@
import { sortBy } from 'common/collections';
import { capitalize } from 'common/string';
+
import { useBackend, useLocalState } from '../backend';
import {
Blink,
@@ -12,9 +13,9 @@ import {
Section,
TextArea,
} from '../components';
-import { StatusDisplayControls } from './common/StatusDisplayControls';
import { Window } from '../layouts';
import { sanitizeText } from '../sanitize';
+import { StatusDisplayControls } from './common/StatusDisplayControls';
const STATE_BUYING_SHUTTLE = 'buying_shuttle';
const STATE_CHANGING_STATUS = 'changing_status';
diff --git a/tgui/packages/tgui/interfaces/ComponentPrinter.tsx b/tgui/packages/tgui/interfaces/ComponentPrinter.tsx
index b5e93fe2b2c..7c8f16a8c53 100644
--- a/tgui/packages/tgui/interfaces/ComponentPrinter.tsx
+++ b/tgui/packages/tgui/interfaces/ComponentPrinter.tsx
@@ -1,13 +1,14 @@
-import { useBackend } from '../backend';
-import { Material } from './Fabrication/Types';
-import { Window } from '../layouts';
-import { Box, Tooltip, Icon, Stack, Section } from '../components';
-import { Design } from './Fabrication/Types';
-import { MaterialCostSequence } from './Fabrication/MaterialCostSequence';
-import { MaterialMap } from './Fabrication/Types';
import { classes } from 'common/react';
+
+import { useBackend } from '../backend';
+import { Box, Icon, Section, Stack, Tooltip } from '../components';
+import { Window } from '../layouts';
import { DesignBrowser } from './Fabrication/DesignBrowser';
import { MaterialAccessBar } from './Fabrication/MaterialAccessBar';
+import { MaterialCostSequence } from './Fabrication/MaterialCostSequence';
+import { Material } from './Fabrication/Types';
+import { Design } from './Fabrication/Types';
+import { MaterialMap } from './Fabrication/Types';
type ComponentPrinterData = {
designs: Record;
diff --git a/tgui/packages/tgui/interfaces/Crayon.tsx b/tgui/packages/tgui/interfaces/Crayon.tsx
index 3c64d2d45a7..27a36f745cd 100644
--- a/tgui/packages/tgui/interfaces/Crayon.tsx
+++ b/tgui/packages/tgui/interfaces/Crayon.tsx
@@ -1,4 +1,5 @@
import { BooleanLike } from 'common/react';
+
import { useBackend } from '../backend';
import { Button, LabeledList, Section } from '../components';
import { Window } from '../layouts';
diff --git a/tgui/packages/tgui/interfaces/CrewConsole.jsx b/tgui/packages/tgui/interfaces/CrewConsole.jsx
index a7ae6d530b0..7796a56809c 100644
--- a/tgui/packages/tgui/interfaces/CrewConsole.jsx
+++ b/tgui/packages/tgui/interfaces/CrewConsole.jsx
@@ -1,6 +1,7 @@
import { sortBy } from 'common/collections';
+
import { useBackend } from '../backend';
-import { Box, Button, Section, Table, Icon } from '../components';
+import { Box, Button, Icon, Section, Table } from '../components';
import { COLORS } from '../constants';
import { Window } from '../layouts';
diff --git a/tgui/packages/tgui/interfaces/CrewConsoleSkyrat.jsx b/tgui/packages/tgui/interfaces/CrewConsoleSkyrat.jsx
index cb7fd34de8a..6768138a5fe 100644
--- a/tgui/packages/tgui/interfaces/CrewConsoleSkyrat.jsx
+++ b/tgui/packages/tgui/interfaces/CrewConsoleSkyrat.jsx
@@ -1,7 +1,8 @@
// THIS IS A SKYRAT UI FILE
import { sortBy } from 'common/collections';
+
import { useBackend } from '../backend';
-import { Box, Button, Section, Table, Icon } from '../components';
+import { Box, Button, Icon, Section, Table } from '../components';
import { COLORS } from '../constants';
import { Window } from '../layouts';
diff --git a/tgui/packages/tgui/interfaces/CrewConsoleSkyratBlueshield.jsx b/tgui/packages/tgui/interfaces/CrewConsoleSkyratBlueshield.jsx
index 41755b1fab1..fb27deeaeba 100644
--- a/tgui/packages/tgui/interfaces/CrewConsoleSkyratBlueshield.jsx
+++ b/tgui/packages/tgui/interfaces/CrewConsoleSkyratBlueshield.jsx
@@ -1,7 +1,8 @@
// THIS IS A SKYRAT UI FILE
import { sortBy } from 'common/collections';
+
import { useBackend } from '../backend';
-import { Box, Button, Section, Table, Icon } from '../components';
+import { Box, Button, Icon, Section, Table } from '../components';
import { COLORS } from '../constants';
import { Window } from '../layouts';
diff --git a/tgui/packages/tgui/interfaces/CrewManifest.jsx b/tgui/packages/tgui/interfaces/CrewManifest.jsx
index f84b79141a8..73d67bf5158 100644
--- a/tgui/packages/tgui/interfaces/CrewManifest.jsx
+++ b/tgui/packages/tgui/interfaces/CrewManifest.jsx
@@ -1,4 +1,5 @@
import { classes } from 'common/react';
+
import { useBackend } from '../backend';
import { Icon, Section, Table, Tooltip } from '../components';
import { Window } from '../layouts';
diff --git a/tgui/packages/tgui/interfaces/CrossingSignal.tsx b/tgui/packages/tgui/interfaces/CrossingSignal.tsx
index c13b0c1c3d3..e0585318649 100644
--- a/tgui/packages/tgui/interfaces/CrossingSignal.tsx
+++ b/tgui/packages/tgui/interfaces/CrossingSignal.tsx
@@ -1,6 +1,7 @@
import { BooleanLike } from 'common/react';
+
import { useBackend } from '../backend';
-import { Section, LabeledList } from '../components';
+import { LabeledList, Section } from '../components';
import { Window } from '../layouts';
type Data = {
diff --git a/tgui/packages/tgui/interfaces/Cryo.jsx b/tgui/packages/tgui/interfaces/Cryo.jsx
index b2c5054e0f5..de547e93fba 100644
--- a/tgui/packages/tgui/interfaces/Cryo.jsx
+++ b/tgui/packages/tgui/interfaces/Cryo.jsx
@@ -6,8 +6,8 @@ import {
ProgressBar,
Section,
} from '../components';
-import { BeakerContents } from './common/BeakerContents';
import { Window } from '../layouts';
+import { BeakerContents } from './common/BeakerContents';
const damageTypes = [
{
diff --git a/tgui/packages/tgui/interfaces/Crystallizer.tsx b/tgui/packages/tgui/interfaces/Crystallizer.tsx
index c68799fc6e3..f306f5e03e0 100644
--- a/tgui/packages/tgui/interfaces/Crystallizer.tsx
+++ b/tgui/packages/tgui/interfaces/Crystallizer.tsx
@@ -1,3 +1,7 @@
+import { toFixed } from 'common/math';
+import { BooleanLike } from 'common/react';
+
+import { useBackend } from '../backend';
import {
Box,
Button,
@@ -6,12 +10,8 @@ import {
ProgressBar,
Section,
} from '../components';
-
-import { BooleanLike } from 'common/react';
-import { Window } from '../layouts';
import { getGasColor } from '../constants';
-import { toFixed } from 'common/math';
-import { useBackend } from '../backend';
+import { Window } from '../layouts';
type Data = {
on: BooleanLike;
diff --git a/tgui/packages/tgui/interfaces/CyborgBootDebug.jsx b/tgui/packages/tgui/interfaces/CyborgBootDebug.jsx
index fdb4970e1e6..1daed59197a 100644
--- a/tgui/packages/tgui/interfaces/CyborgBootDebug.jsx
+++ b/tgui/packages/tgui/interfaces/CyborgBootDebug.jsx
@@ -1,4 +1,5 @@
import { multiline } from 'common/string';
+
import { useBackend } from '../backend';
import { Button, Input, LabeledList, Section } from '../components';
import { Window } from '../layouts';
diff --git a/tgui/packages/tgui/interfaces/DelamProcedure.tsx b/tgui/packages/tgui/interfaces/DelamProcedure.tsx
index 9729867036a..1dfe78947f3 100644
--- a/tgui/packages/tgui/interfaces/DelamProcedure.tsx
+++ b/tgui/packages/tgui/interfaces/DelamProcedure.tsx
@@ -1,5 +1,5 @@
// THIS IS A SKYRAT UI FILE
-import { Section, BlockQuote, Box, NoticeBox } from '../components';
+import { BlockQuote, Box, NoticeBox, Section } from '../components';
import { Window } from '../layouts';
export const DelamProcedure = () => {
diff --git a/tgui/packages/tgui/interfaces/DepartmentOrders.tsx b/tgui/packages/tgui/interfaces/DepartmentOrders.tsx
index 8823018a14c..5fb8853cdb8 100644
--- a/tgui/packages/tgui/interfaces/DepartmentOrders.tsx
+++ b/tgui/packages/tgui/interfaces/DepartmentOrders.tsx
@@ -1,5 +1,6 @@
import { BooleanLike } from 'common/react';
import { useState } from 'react';
+
import { useBackend } from '../backend';
import {
Box,
diff --git a/tgui/packages/tgui/interfaces/DestinationTagger.tsx b/tgui/packages/tgui/interfaces/DestinationTagger.tsx
index 04ae61aec01..b1acfe192a7 100644
--- a/tgui/packages/tgui/interfaces/DestinationTagger.tsx
+++ b/tgui/packages/tgui/interfaces/DestinationTagger.tsx
@@ -1,8 +1,9 @@
-import { flow } from 'common/fp';
import { map, sortBy } from 'common/collections';
+import { flow } from 'common/fp';
+
import { useBackend } from '../backend';
+import { Button, Section, Stack } from '../components';
import { Window } from '../layouts';
-import { Stack, Section, Button } from '../components';
type DestinationTaggerData = {
locations: string[];
diff --git a/tgui/packages/tgui/interfaces/DestructiveAnalyzer.tsx b/tgui/packages/tgui/interfaces/DestructiveAnalyzer.tsx
index 20af79ae1b9..87aa138bde9 100644
--- a/tgui/packages/tgui/interfaces/DestructiveAnalyzer.tsx
+++ b/tgui/packages/tgui/interfaces/DestructiveAnalyzer.tsx
@@ -1,6 +1,7 @@
import { BooleanLike } from 'common/react';
+
import { useBackend } from '../backend';
-import { Button, Box, Section, NoticeBox, Image } from '../components';
+import { Box, Button, Image, NoticeBox, Section } from '../components';
import { Window } from '../layouts';
type Data = {
diff --git a/tgui/packages/tgui/interfaces/DnaConsole/DnaConsoleEnzymes.jsx b/tgui/packages/tgui/interfaces/DnaConsole/DnaConsoleEnzymes.jsx
index 38baaab8af1..244add6939e 100644
--- a/tgui/packages/tgui/interfaces/DnaConsole/DnaConsoleEnzymes.jsx
+++ b/tgui/packages/tgui/interfaces/DnaConsole/DnaConsoleEnzymes.jsx
@@ -11,8 +11,8 @@ import {
Section,
Stack,
} from '../../components';
-import { GeneticMakeupInfo } from './GeneticMakeupInfo';
import { PULSE_DURATION_MAX, PULSE_STRENGTH_MAX } from './constants';
+import { GeneticMakeupInfo } from './GeneticMakeupInfo';
const GeneticMakeupBufferInfo = (props) => {
const { index, makeup } = props;
diff --git a/tgui/packages/tgui/interfaces/DnaConsole/DnaConsoleSequencer.jsx b/tgui/packages/tgui/interfaces/DnaConsole/DnaConsoleSequencer.jsx
index ce60a256f7f..d307b0e9d37 100644
--- a/tgui/packages/tgui/interfaces/DnaConsole/DnaConsoleSequencer.jsx
+++ b/tgui/packages/tgui/interfaces/DnaConsole/DnaConsoleSequencer.jsx
@@ -1,8 +1,8 @@
import { classes } from 'common/react';
+
import { resolveAsset } from '../../assets';
import { useBackend } from '../../backend';
-import { Box, Button, Section, Stack, Image } from '../../components';
-import { MutationInfo } from './MutationInfo';
+import { Box, Button, Image, Section, Stack } from '../../components';
import {
CLEAR_GENE,
GENE_COLORS,
@@ -12,6 +12,7 @@ import {
SUBJECT_DEAD,
SUBJECT_TRANSFORMING,
} from './constants';
+import { MutationInfo } from './MutationInfo';
const GenomeImage = (props) => {
const { url, selected, onClick } = props;
diff --git a/tgui/packages/tgui/interfaces/DnaConsole/DnaConsoleStorage.jsx b/tgui/packages/tgui/interfaces/DnaConsole/DnaConsoleStorage.jsx
index ba43c56cf3c..43c22b321a0 100644
--- a/tgui/packages/tgui/interfaces/DnaConsole/DnaConsoleStorage.jsx
+++ b/tgui/packages/tgui/interfaces/DnaConsole/DnaConsoleStorage.jsx
@@ -1,16 +1,15 @@
import { uniqBy } from 'common/collections';
+
import { useBackend } from '../../backend';
import {
Box,
Button,
Collapsible,
- Stack,
LabeledList,
Section,
+ Stack,
Tabs,
} from '../../components';
-import { GeneticMakeupInfo } from './GeneticMakeupInfo';
-import { MutationInfo } from './MutationInfo';
import {
STORAGE_CONS_SUBMODE_CHROMOSOMES,
STORAGE_CONS_SUBMODE_MUTATIONS,
@@ -20,6 +19,8 @@ import {
STORAGE_MODE_CONSOLE,
STORAGE_MODE_DISK,
} from './constants';
+import { GeneticMakeupInfo } from './GeneticMakeupInfo';
+import { MutationInfo } from './MutationInfo';
export const DnaConsoleStorage = (props) => {
const { data, act } = useBackend();
diff --git a/tgui/packages/tgui/interfaces/DnaConsole/MutationInfo.jsx b/tgui/packages/tgui/interfaces/DnaConsole/MutationInfo.jsx
index d3b1b9156de..89a1468d953 100644
--- a/tgui/packages/tgui/interfaces/DnaConsole/MutationInfo.jsx
+++ b/tgui/packages/tgui/interfaces/DnaConsole/MutationInfo.jsx
@@ -1,5 +1,6 @@
import { filter, uniqBy } from 'common/collections';
import { flow } from 'common/fp';
+
import { useBackend } from '../../backend';
import {
Box,
diff --git a/tgui/packages/tgui/interfaces/DnaConsole/index.jsx b/tgui/packages/tgui/interfaces/DnaConsole/index.jsx
index 786788b41ff..036155e5393 100644
--- a/tgui/packages/tgui/interfaces/DnaConsole/index.jsx
+++ b/tgui/packages/tgui/interfaces/DnaConsole/index.jsx
@@ -9,10 +9,6 @@ import {
Stack,
} from '../../components';
import { Window } from '../../layouts';
-import { DnaConsoleEnzymes } from './DnaConsoleEnzymes';
-import { DnaConsoleSequencer } from './DnaConsoleSequencer';
-import { DnaConsoleStorage } from './DnaConsoleStorage';
-import { DnaScanner } from './DnaScanner';
import {
CONSOLE_MODE_ENZYMES,
CONSOLE_MODE_FEATURES,
@@ -20,6 +16,10 @@ import {
CONSOLE_MODE_STORAGE,
STORAGE_MODE_CONSOLE,
} from './constants';
+import { DnaConsoleEnzymes } from './DnaConsoleEnzymes';
+import { DnaConsoleSequencer } from './DnaConsoleSequencer';
+import { DnaConsoleStorage } from './DnaConsoleStorage';
+import { DnaScanner } from './DnaScanner';
export const DnaConsole = (props) => {
const { data } = useBackend();
diff --git a/tgui/packages/tgui/interfaces/EightBallVote.tsx b/tgui/packages/tgui/interfaces/EightBallVote.tsx
index 499edaa7493..30ab7baae48 100644
--- a/tgui/packages/tgui/interfaces/EightBallVote.tsx
+++ b/tgui/packages/tgui/interfaces/EightBallVote.tsx
@@ -1,8 +1,9 @@
-import { useBackend } from '../backend';
-import { Box, Button, Grid, Section, NoticeBox } from '../components';
-import { toTitleCase } from 'common/string';
-import { Window } from '../layouts';
import { BooleanLike } from 'common/react';
+import { toTitleCase } from 'common/string';
+
+import { useBackend } from '../backend';
+import { Box, Button, Grid, NoticeBox, Section } from '../components';
+import { Window } from '../layouts';
type Data = {
shaking: BooleanLike;
diff --git a/tgui/packages/tgui/interfaces/Electrolyzer.tsx b/tgui/packages/tgui/interfaces/Electrolyzer.tsx
index 76fc5c829b3..ab912e2ec4a 100644
--- a/tgui/packages/tgui/interfaces/Electrolyzer.tsx
+++ b/tgui/packages/tgui/interfaces/Electrolyzer.tsx
@@ -1,4 +1,5 @@
import { BooleanLike } from 'common/react';
+
import { useBackend } from '../backend';
import { Button, LabeledList, ProgressBar, Section } from '../components';
import { Window } from '../layouts';
diff --git a/tgui/packages/tgui/interfaces/Electropack.jsx b/tgui/packages/tgui/interfaces/Electropack.jsx
index 3eb52ab8946..4b0a14e8b02 100644
--- a/tgui/packages/tgui/interfaces/Electropack.jsx
+++ b/tgui/packages/tgui/interfaces/Electropack.jsx
@@ -1,4 +1,5 @@
import { toFixed } from 'common/math';
+
import { useBackend } from '../backend';
import { Button, LabeledList, NumberInput, Section } from '../components';
import { Window } from '../layouts';
diff --git a/tgui/packages/tgui/interfaces/ElevatorPanel.tsx b/tgui/packages/tgui/interfaces/ElevatorPanel.tsx
index 37fb4f99ec9..bb1998df4b6 100644
--- a/tgui/packages/tgui/interfaces/ElevatorPanel.tsx
+++ b/tgui/packages/tgui/interfaces/ElevatorPanel.tsx
@@ -1,9 +1,10 @@
import { clamp } from 'common/math';
import { BooleanLike } from 'common/react';
+
import { useBackend } from '../backend';
import {
- Box,
Blink,
+ Box,
Button,
Dimmer,
Icon,
diff --git a/tgui/packages/tgui/interfaces/EmotePanel.tsx b/tgui/packages/tgui/interfaces/EmotePanel.tsx
index 622fa86c3bc..7d276024ac3 100644
--- a/tgui/packages/tgui/interfaces/EmotePanel.tsx
+++ b/tgui/packages/tgui/interfaces/EmotePanel.tsx
@@ -1,9 +1,9 @@
-import { useBackend, useLocalState } from '../backend';
-import { Window } from '../layouts';
-import { Button, Section, Flex, Icon, Box } from '../components';
import { BooleanLike } from '../../common/react';
-import { SearchBar } from './Fabrication/SearchBar';
import { capitalizeFirst } from '../../common/string';
+import { useBackend, useLocalState } from '../backend';
+import { Box, Button, Flex, Icon, Section } from '../components';
+import { Window } from '../layouts';
+import { SearchBar } from './Fabrication/SearchBar';
type Emote = {
key: string;
diff --git a/tgui/packages/tgui/interfaces/EngravedMessage.jsx b/tgui/packages/tgui/interfaces/EngravedMessage.jsx
index d66f33b086b..91a2b3b458f 100644
--- a/tgui/packages/tgui/interfaces/EngravedMessage.jsx
+++ b/tgui/packages/tgui/interfaces/EngravedMessage.jsx
@@ -1,4 +1,5 @@
import { decodeHtmlEntities } from 'common/string';
+
import { useBackend } from '../backend';
import { Box, Button, LabeledList, Section, Stack } from '../components';
import { Window } from '../layouts';
diff --git a/tgui/packages/tgui/interfaces/EventPanel.jsx b/tgui/packages/tgui/interfaces/EventPanel.jsx
index e2bdfbd8383..41736971165 100644
--- a/tgui/packages/tgui/interfaces/EventPanel.jsx
+++ b/tgui/packages/tgui/interfaces/EventPanel.jsx
@@ -1,7 +1,8 @@
// THIS IS A SKYRAT UI FILE
-import { useBackend } from '../backend';
-import { Section, Button, NoticeBox, LabeledList, Stack } from '../components';
import { toFixed } from 'common/math';
+
+import { useBackend } from '../backend';
+import { Button, LabeledList, NoticeBox, Section, Stack } from '../components';
import { Window } from '../layouts';
export const EventPanel = (props) => {
diff --git a/tgui/packages/tgui/interfaces/ExaminePanel.jsx b/tgui/packages/tgui/interfaces/ExaminePanel.jsx
index 4feb759b402..7b2bbf91ce2 100644
--- a/tgui/packages/tgui/interfaces/ExaminePanel.jsx
+++ b/tgui/packages/tgui/interfaces/ExaminePanel.jsx
@@ -1,8 +1,8 @@
// THIS IS A SKYRAT UI FILE
-import { useBackend } from '../backend';
-import { Stack, Section, ByondUi } from '../components';
-import { Window } from '../layouts';
import { resolveAsset } from '../assets';
+import { useBackend } from '../backend';
+import { ByondUi, Section, Stack } from '../components';
+import { Window } from '../layouts';
const formatURLs = (text) => {
if (!text) return;
diff --git a/tgui/packages/tgui/interfaces/ExodroneConsole.tsx b/tgui/packages/tgui/interfaces/ExodroneConsole.tsx
index 7077cc93ada..ca26102e224 100644
--- a/tgui/packages/tgui/interfaces/ExodroneConsole.tsx
+++ b/tgui/packages/tgui/interfaces/ExodroneConsole.tsx
@@ -1,3 +1,8 @@
+import { capitalize } from 'common/string';
+import { Fragment } from 'react';
+
+import { resolveAsset } from '../assets';
+import nt_logo from '../assets/bg-nanotrasen.svg';
import { useBackend, useLocalState } from '../backend';
import {
BlockQuote,
@@ -12,12 +17,8 @@ import {
Section,
Stack,
} from '../components';
-import { Window } from '../layouts';
-import { resolveAsset } from '../assets';
import { formatTime } from '../format';
-import { capitalize } from 'common/string';
-import nt_logo from '../assets/bg-nanotrasen.svg';
-import { Fragment } from 'react';
+import { Window } from '../layouts';
type ExplorationEventData = {
name: string;
@@ -871,16 +872,12 @@ const ExodroneConsoleContent = (props) => {
return (
-
-
-
-
-
-
-
-
+
+
+
+
+
diff --git a/tgui/packages/tgui/interfaces/ExoscannerConsole.tsx b/tgui/packages/tgui/interfaces/ExoscannerConsole.tsx
index eb19618866c..4b97f52732f 100644
--- a/tgui/packages/tgui/interfaces/ExoscannerConsole.tsx
+++ b/tgui/packages/tgui/interfaces/ExoscannerConsole.tsx
@@ -4,14 +4,14 @@ import {
Box,
Button,
Icon,
- Modal,
- Section,
LabeledList,
+ Modal,
NoticeBox,
+ Section,
Stack,
} from '../components';
-import { Window } from '../layouts';
import { formatTime } from '../format';
+import { Window } from '../layouts';
type SiteData = {
name: string;
diff --git a/tgui/packages/tgui/interfaces/ExosuitControlConsole.jsx b/tgui/packages/tgui/interfaces/ExosuitControlConsole.jsx
index 2fe72ef4a4c..1987005cfca 100644
--- a/tgui/packages/tgui/interfaces/ExosuitControlConsole.jsx
+++ b/tgui/packages/tgui/interfaces/ExosuitControlConsole.jsx
@@ -1,4 +1,5 @@
import { toFixed } from 'common/math';
+
import { useBackend } from '../backend';
import {
AnimatedNumber,
diff --git a/tgui/packages/tgui/interfaces/ExosuitFabricator.tsx b/tgui/packages/tgui/interfaces/ExosuitFabricator.tsx
index f9a104d8b64..07c0daabe32 100644
--- a/tgui/packages/tgui/interfaces/ExosuitFabricator.tsx
+++ b/tgui/packages/tgui/interfaces/ExosuitFabricator.tsx
@@ -1,13 +1,14 @@
-import { useBackend } from '../backend';
-import { Box, Button, Section, Stack, Icon } from '../components';
-import { Window } from '../layouts';
-import { MaterialAccessBar } from './Fabrication/MaterialAccessBar';
-import { Design, FabricatorData, MaterialMap } from './Fabrication/Types';
-import { DesignBrowser } from './Fabrication/DesignBrowser';
-import { MaterialCostSequence } from './Fabrication/MaterialCostSequence';
-import { Tooltip } from '../components';
import { BooleanLike, classes } from 'common/react';
+import { useBackend } from '../backend';
+import { Box, Button, Icon, Section, Stack } from '../components';
+import { Tooltip } from '../components';
+import { Window } from '../layouts';
+import { DesignBrowser } from './Fabrication/DesignBrowser';
+import { MaterialAccessBar } from './Fabrication/MaterialAccessBar';
+import { MaterialCostSequence } from './Fabrication/MaterialCostSequence';
+import { Design, FabricatorData, MaterialMap } from './Fabrication/Types';
+
type ExosuitFabricatorData = FabricatorData & {
processing: BooleanLike;
};
diff --git a/tgui/packages/tgui/interfaces/ExperimentConfigure.jsx b/tgui/packages/tgui/interfaces/ExperimentConfigure.jsx
index d2ff5abe7d4..0c632afd283 100644
--- a/tgui/packages/tgui/interfaces/ExperimentConfigure.jsx
+++ b/tgui/packages/tgui/interfaces/ExperimentConfigure.jsx
@@ -1,16 +1,17 @@
-import { Window } from '../layouts';
+import { sortBy } from 'common/collections';
+
import { useBackend } from '../backend';
import {
- Section,
Box,
Button,
Flex,
Icon,
LabeledList,
+ Section,
Table,
Tooltip,
} from '../components';
-import { sortBy } from 'common/collections';
+import { Window } from '../layouts';
const ExperimentStages = (props) => {
return (
diff --git a/tgui/packages/tgui/interfaces/Fabrication/DesignBrowser.tsx b/tgui/packages/tgui/interfaces/Fabrication/DesignBrowser.tsx
index 3f63de4144d..c1e66b2182d 100644
--- a/tgui/packages/tgui/interfaces/Fabrication/DesignBrowser.tsx
+++ b/tgui/packages/tgui/interfaces/Fabrication/DesignBrowser.tsx
@@ -1,10 +1,11 @@
import { sortBy } from 'common/collections';
import { classes } from 'common/react';
import { ReactNode } from 'react';
-import { Stack, Section, Icon, Dimmer } from '../../components';
-import { Design, MaterialMap } from './Types';
-import { SearchBar } from './SearchBar';
+
import { useSharedState } from '../../backend';
+import { Dimmer, Icon, Section, Stack } from '../../components';
+import { SearchBar } from './SearchBar';
+import { Design, MaterialMap } from './Types';
/**
* A function that does nothing.
@@ -488,7 +489,7 @@ const CategoryView = (
return (
{body}
diff --git a/tgui/packages/tgui/interfaces/Fabrication/MaterialAccessBar.tsx b/tgui/packages/tgui/interfaces/Fabrication/MaterialAccessBar.tsx
index 6b1c7f6b611..3979815126d 100644
--- a/tgui/packages/tgui/interfaces/Fabrication/MaterialAccessBar.tsx
+++ b/tgui/packages/tgui/interfaces/Fabrication/MaterialAccessBar.tsx
@@ -1,7 +1,8 @@
import { sortBy } from 'common/collections';
import { classes } from 'common/react';
+
import { useLocalState } from '../../backend';
-import { Flex, Button, Stack, AnimatedNumber } from '../../components';
+import { AnimatedNumber, Button, Flex, Stack } from '../../components';
import { formatSiUnit } from '../../format';
import { MaterialIcon } from './MaterialIcon';
import { Material } from './Types';
@@ -97,7 +98,7 @@ const MaterialCounter = (props: MaterialCounterProps) => {
sheets < 1 && 'MaterialDock--disabled',
])}
>
-
+
= {
diff --git a/tgui/packages/tgui/interfaces/Fabrication/SearchBar.tsx b/tgui/packages/tgui/interfaces/Fabrication/SearchBar.tsx
index 0831a349a0b..b7f710b1a38 100644
--- a/tgui/packages/tgui/interfaces/Fabrication/SearchBar.tsx
+++ b/tgui/packages/tgui/interfaces/Fabrication/SearchBar.tsx
@@ -1,5 +1,6 @@
import { Component } from 'react';
-import { Stack, Input, Icon } from '../../components';
+
+import { Icon, Input, Stack } from '../../components';
/**
* The properties of a search bar.
@@ -44,7 +45,7 @@ export class SearchBar extends Component {
this.onInput(v)}
+ onInput={(_e, v) => this.onInput(v)}
value={searchText}
/>
diff --git a/tgui/packages/tgui/interfaces/Fabricator.tsx b/tgui/packages/tgui/interfaces/Fabricator.tsx
index 494a647a030..1b02e9f8639 100644
--- a/tgui/packages/tgui/interfaces/Fabricator.tsx
+++ b/tgui/packages/tgui/interfaces/Fabricator.tsx
@@ -1,19 +1,20 @@
+import { classes } from 'common/react';
+
import { useBackend } from '../backend';
import {
- Stack,
- Section,
- Icon,
- Dimmer,
Box,
- Tooltip,
Button,
+ Dimmer,
+ Icon,
+ Section,
+ Stack,
+ Tooltip,
} from '../components';
import { Window } from '../layouts';
-import { MaterialCostSequence } from './Fabrication/MaterialCostSequence';
-import { MaterialAccessBar } from './Fabrication/MaterialAccessBar';
-import { FabricatorData, Design, MaterialMap } from './Fabrication/Types';
-import { classes } from 'common/react';
import { DesignBrowser } from './Fabrication/DesignBrowser';
+import { MaterialAccessBar } from './Fabrication/MaterialAccessBar';
+import { MaterialCostSequence } from './Fabrication/MaterialCostSequence';
+import { Design, FabricatorData, MaterialMap } from './Fabrication/Types';
export const Fabricator = (props) => {
const { act, data } = useBackend();
@@ -128,16 +129,16 @@ const CustomPrint = (props: CustomPrintProps) => {
])}
>
act('build', {
ref: design.id,
amount: value,
})
}
- />
+ >
+ [Max: {design.maxmult}]
+
);
};
diff --git a/tgui/packages/tgui/interfaces/Fax.tsx b/tgui/packages/tgui/interfaces/Fax.tsx
index 9adda81c8d8..45ff5461a2e 100644
--- a/tgui/packages/tgui/interfaces/Fax.tsx
+++ b/tgui/packages/tgui/interfaces/Fax.tsx
@@ -90,7 +90,7 @@ export const Fax = (props) => {
).map((special: FaxSpecial) => (