tgui-core 1.0.2 → 1.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/{src/components → components}/AnimatedNumber.tsx +185 -185
- package/{src/components → components}/BlockQuote.tsx +15 -15
- package/{src/components → components}/BodyZoneSelector.tsx +149 -149
- package/{src/components → components}/Box.tsx +255 -255
- package/{src/components → components}/Button.tsx +415 -415
- package/{src/components → components}/ByondUi.jsx +121 -121
- package/{src/components → components}/Chart.tsx +160 -160
- package/{src/components → components}/ColorBox.tsx +30 -30
- package/{src/components → components}/Dimmer.tsx +19 -19
- package/{src/components → components}/Divider.tsx +26 -26
- package/{src/components → components}/DmIcon.tsx +72 -72
- package/{src/components → components}/DraggableControl.jsx +282 -282
- package/{src/components → components}/Dropdown.tsx +246 -246
- package/{src/components → components}/Flex.tsx +105 -105
- package/{src/components → components}/Icon.tsx +91 -91
- package/{src/components → components}/Input.tsx +181 -181
- package/{src/components → components}/KeyListener.tsx +40 -40
- package/{src/components → components}/Knob.tsx +185 -185
- package/{src/components → components}/LabeledList.tsx +130 -130
- package/{src/components → components}/MenuBar.tsx +233 -238
- package/{src/components → components}/Modal.tsx +25 -25
- package/{src/components → components}/NoticeBox.tsx +48 -48
- package/{src/components → components}/NumberInput.tsx +328 -328
- package/{src/components → components}/ProgressBar.tsx +79 -79
- package/{src/components → components}/RestrictedInput.jsx +301 -301
- package/{src/components → components}/RoundGauge.tsx +189 -189
- package/{src/components → components}/Section.tsx +125 -125
- package/{src/components → components}/Slider.tsx +173 -173
- package/{src/components → components}/Stack.tsx +101 -101
- package/{src/components → components}/Table.tsx +90 -90
- package/{src/components → components}/Tabs.tsx +90 -90
- package/{src/components → components}/TextArea.tsx +198 -198
- package/{src/components → components}/TimeDisplay.jsx +64 -64
- package/components/index.ts +51 -0
- package/{src/debug/KitchenSink.jsx → debug/KitchenSink.tsx} +56 -56
- package/{src/debug/actions.js → debug/actions.ts} +11 -11
- package/{src/debug/hooks.js → debug/hooks.ts} +10 -10
- package/{src/debug/middleware.js → debug/middleware.ts} +67 -86
- package/{src/debug/reducer.js → debug/reducer.ts} +27 -22
- package/{src/debug/selectors.js → debug/selectors.ts} +7 -7
- package/{src/layouts → layouts}/Layout.tsx +75 -75
- package/{src/layouts → layouts}/NtosWindow.tsx +162 -162
- package/{src/layouts → layouts}/Pane.tsx +56 -56
- package/{src/layouts → layouts}/Window.tsx +227 -227
- package/layouts/index.ts +10 -0
- package/package.json +3 -2
- package/src/assets.ts +43 -43
- package/src/backend.ts +368 -369
- package/src/drag.ts +280 -280
- package/src/events.ts +237 -237
- package/src/hotkeys.ts +212 -212
- package/src/renderer.ts +50 -50
- package/stories/Blink.stories.tsx +20 -0
- package/stories/BlockQuote.stories.tsx +23 -0
- package/stories/Box.stories.tsx +27 -0
- package/stories/Button.stories.tsx +68 -0
- package/stories/ByondUi.stories.tsx +45 -0
- package/stories/Collapsible.stories.tsx +23 -0
- package/stories/Flex.stories.tsx +68 -0
- package/stories/Input.stories.tsx +124 -0
- package/stories/LabeledList.stories.tsx +73 -0
- package/stories/Popper.stories.tsx +58 -0
- package/stories/ProgressBar.stories.tsx +58 -0
- package/stories/Stack.stories.tsx +55 -0
- package/stories/Storage.stories.tsx +46 -0
- package/stories/Themes.stories.tsx +30 -0
- package/stories/Tooltip.stories.tsx +48 -0
- package/stories/common.tsx +19 -0
- package/tsconfig.json +0 -21
- package/src/components/Grid.tsx +0 -44
- /package/{src/common → common}/collections.ts +0 -0
- /package/{src/common → common}/color.ts +0 -0
- /package/{src/common → common}/events.ts +0 -0
- /package/{src/common → common}/exhaustive.ts +0 -0
- /package/{src/common → common}/fp.ts +0 -0
- /package/{src/common → common}/keycodes.ts +0 -0
- /package/{src/common → common}/keys.ts +0 -0
- /package/{src/common → common}/math.ts +0 -0
- /package/{src/common → common}/perf.ts +0 -0
- /package/{src/common → common}/random.ts +0 -0
- /package/{src/common → common}/react.ts +0 -0
- /package/{src/common → common}/redux.ts +0 -0
- /package/{src/common → common}/storage.js +0 -0
- /package/{src/common → common}/string.ts +0 -0
- /package/{src/common → common}/timer.ts +0 -0
- /package/{src/common → common}/type-utils.ts +0 -0
- /package/{src/common → common}/types.ts +0 -0
- /package/{src/common → common}/uuid.ts +0 -0
- /package/{src/common → common}/vector.ts +0 -0
- /package/{src/components → components}/Autofocus.tsx +0 -0
- /package/{src/components → components}/Blink.jsx +0 -0
- /package/{src/components → components}/Collapsible.tsx +0 -0
- /package/{src/components → components}/Dialog.tsx +0 -0
- /package/{src/components → components}/FakeTerminal.jsx +0 -0
- /package/{src/components → components}/FitText.tsx +0 -0
- /package/{src/components → components}/Image.tsx +0 -0
- /package/{src/components → components}/InfinitePlane.jsx +0 -0
- /package/{src/components → components}/LabeledControls.tsx +0 -0
- /package/{src/components → components}/Popper.tsx +0 -0
- /package/{src/components → components}/StyleableSection.tsx +0 -0
- /package/{src/components → components}/Tooltip.tsx +0 -0
- /package/{src/components → components}/TrackOutsideClicks.tsx +0 -0
- /package/{src/components → components}/VirtualList.tsx +0 -0
- /package/{src/debug → debug}/index.ts +0 -0
- /package/{src/styles → styles}/base.scss +0 -0
- /package/{src/styles → styles}/colors.scss +0 -0
- /package/{src/styles → styles}/components/BlockQuote.scss +0 -0
- /package/{src/styles → styles}/components/Button.scss +0 -0
- /package/{src/styles → styles}/components/ColorBox.scss +0 -0
- /package/{src/styles → styles}/components/Dialog.scss +0 -0
- /package/{src/styles → styles}/components/Dimmer.scss +0 -0
- /package/{src/styles → styles}/components/Divider.scss +0 -0
- /package/{src/styles → styles}/components/Dropdown.scss +0 -0
- /package/{src/styles → styles}/components/Flex.scss +0 -0
- /package/{src/styles → styles}/components/Icon.scss +0 -0
- /package/{src/styles → styles}/components/Input.scss +0 -0
- /package/{src/styles → styles}/components/Knob.scss +0 -0
- /package/{src/styles → styles}/components/LabeledList.scss +0 -0
- /package/{src/styles → styles}/components/MenuBar.scss +0 -0
- /package/{src/styles → styles}/components/Modal.scss +0 -0
- /package/{src/styles → styles}/components/NoticeBox.scss +0 -0
- /package/{src/styles → styles}/components/NumberInput.scss +0 -0
- /package/{src/styles → styles}/components/ProgressBar.scss +0 -0
- /package/{src/styles → styles}/components/RoundGauge.scss +0 -0
- /package/{src/styles → styles}/components/Section.scss +0 -0
- /package/{src/styles → styles}/components/Slider.scss +0 -0
- /package/{src/styles → styles}/components/Stack.scss +0 -0
- /package/{src/styles → styles}/components/Table.scss +0 -0
- /package/{src/styles → styles}/components/Tabs.scss +0 -0
- /package/{src/styles → styles}/components/TextArea.scss +0 -0
- /package/{src/styles → styles}/components/Tooltip.scss +0 -0
- /package/{src/styles → styles}/functions.scss +0 -0
- /package/{src/styles → styles}/layouts/Layout.scss +0 -0
- /package/{src/styles → styles}/layouts/NtosHeader.scss +0 -0
- /package/{src/styles → styles}/layouts/NtosWindow.scss +0 -0
- /package/{src/styles → styles}/layouts/TitleBar.scss +0 -0
- /package/{src/styles → styles}/layouts/Window.scss +0 -0
- /package/{src/styles → styles}/main.scss +0 -0
- /package/{src/styles → styles}/reset.scss +0 -0
- /package/{src/styles → styles}/themes/abductor.scss +0 -0
- /package/{src/styles → styles}/themes/admin.scss +0 -0
- /package/{src/styles → styles}/themes/cardtable.scss +0 -0
- /package/{src/styles → styles}/themes/hackerman.scss +0 -0
- /package/{src/styles → styles}/themes/malfunction.scss +0 -0
- /package/{src/styles → styles}/themes/neutral.scss +0 -0
- /package/{src/styles → styles}/themes/ntOS95.scss +0 -0
- /package/{src/styles → styles}/themes/ntos.scss +0 -0
- /package/{src/styles → styles}/themes/ntos_cat.scss +0 -0
- /package/{src/styles → styles}/themes/ntos_darkmode.scss +0 -0
- /package/{src/styles → styles}/themes/ntos_lightmode.scss +0 -0
- /package/{src/styles → styles}/themes/ntos_spooky.scss +0 -0
- /package/{src/styles → styles}/themes/ntos_synth.scss +0 -0
- /package/{src/styles → styles}/themes/ntos_terminal.scss +0 -0
- /package/{src/styles → styles}/themes/paper.scss +0 -0
- /package/{src/styles → styles}/themes/retro.scss +0 -0
- /package/{src/styles → styles}/themes/spookyconsole.scss +0 -0
- /package/{src/styles → styles}/themes/syndicate.scss +0 -0
- /package/{src/styles → styles}/themes/wizard.scss +0 -0
|
@@ -1,26 +1,26 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @file
|
|
3
|
-
* @copyright 2020 Aleksej Komarov
|
|
4
|
-
* @license MIT
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
|
-
import { classes } from '../common/react';
|
|
8
|
-
|
|
9
|
-
type Props = Partial<{
|
|
10
|
-
hidden: boolean;
|
|
11
|
-
vertical: boolean;
|
|
12
|
-
}>;
|
|
13
|
-
|
|
14
|
-
export function Divider(props: Props) {
|
|
15
|
-
const { hidden, vertical } = props;
|
|
16
|
-
|
|
17
|
-
return (
|
|
18
|
-
<div
|
|
19
|
-
className={classes([
|
|
20
|
-
'Divider',
|
|
21
|
-
hidden && 'Divider--hidden',
|
|
22
|
-
vertical ? 'Divider--vertical' : 'Divider--horizontal',
|
|
23
|
-
])}
|
|
24
|
-
/>
|
|
25
|
-
);
|
|
26
|
-
}
|
|
1
|
+
/**
|
|
2
|
+
* @file
|
|
3
|
+
* @copyright 2020 Aleksej Komarov
|
|
4
|
+
* @license MIT
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
import { classes } from '../common/react';
|
|
8
|
+
|
|
9
|
+
type Props = Partial<{
|
|
10
|
+
hidden: boolean;
|
|
11
|
+
vertical: boolean;
|
|
12
|
+
}>;
|
|
13
|
+
|
|
14
|
+
export function Divider(props: Props) {
|
|
15
|
+
const { hidden, vertical } = props;
|
|
16
|
+
|
|
17
|
+
return (
|
|
18
|
+
<div
|
|
19
|
+
className={classes([
|
|
20
|
+
'Divider',
|
|
21
|
+
hidden && 'Divider--hidden',
|
|
22
|
+
vertical ? 'Divider--vertical' : 'Divider--horizontal',
|
|
23
|
+
])}
|
|
24
|
+
/>
|
|
25
|
+
);
|
|
26
|
+
}
|
|
@@ -1,72 +1,72 @@
|
|
|
1
|
-
import { ReactNode, useEffect, useState } from 'react';
|
|
2
|
-
|
|
3
|
-
import { resolveAsset } from '../assets';
|
|
4
|
-
import { fetchRetry } from '../http';
|
|
5
|
-
import { BoxProps } from './Box';
|
|
6
|
-
import { Image } from './Image';
|
|
7
|
-
|
|
8
|
-
enum Direction {
|
|
9
|
-
NORTH = 1,
|
|
10
|
-
SOUTH = 2,
|
|
11
|
-
EAST = 4,
|
|
12
|
-
WEST = 8,
|
|
13
|
-
NORTHEAST = NORTH | EAST,
|
|
14
|
-
NORTHWEST = NORTH | WEST,
|
|
15
|
-
SOUTHEAST = SOUTH | EAST,
|
|
16
|
-
SOUTHWEST = SOUTH | WEST,
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
type Props = {
|
|
20
|
-
/** Required: The path of the icon */
|
|
21
|
-
icon: string;
|
|
22
|
-
/** Required: The state of the icon */
|
|
23
|
-
icon_state: string;
|
|
24
|
-
} & Partial<{
|
|
25
|
-
/** Facing direction. See direction enum. Default is South */
|
|
26
|
-
direction: Direction;
|
|
27
|
-
/** Fallback icon. */
|
|
28
|
-
fallback: ReactNode;
|
|
29
|
-
/** Frame number. Default is 1 */
|
|
30
|
-
frame: number;
|
|
31
|
-
/** Movement state. Default is false */
|
|
32
|
-
movement: boolean;
|
|
33
|
-
}> &
|
|
34
|
-
BoxProps;
|
|
35
|
-
|
|
36
|
-
let refMap: Record<string, string> | undefined;
|
|
37
|
-
|
|
38
|
-
export function DmIcon(props: Props) {
|
|
39
|
-
const {
|
|
40
|
-
className,
|
|
41
|
-
direction = Direction.SOUTH,
|
|
42
|
-
fallback,
|
|
43
|
-
frame = 1,
|
|
44
|
-
icon_state,
|
|
45
|
-
icon,
|
|
46
|
-
movement = false,
|
|
47
|
-
...rest
|
|
48
|
-
} = props;
|
|
49
|
-
|
|
50
|
-
const [iconRef, setIconRef] = useState('');
|
|
51
|
-
|
|
52
|
-
const query = `${iconRef}?state=${icon_state}&dir=${direction}&movement=${movement}&frame=${frame}`;
|
|
53
|
-
|
|
54
|
-
useEffect(() => {
|
|
55
|
-
async function fetchRefMap() {
|
|
56
|
-
const response = await fetchRetry(resolveAsset('icon_ref_map.json'));
|
|
57
|
-
const data = await response.json();
|
|
58
|
-
refMap = data;
|
|
59
|
-
setIconRef(data[icon]);
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
if (!refMap) {
|
|
63
|
-
fetchRefMap();
|
|
64
|
-
} else {
|
|
65
|
-
setIconRef(refMap[icon]);
|
|
66
|
-
}
|
|
67
|
-
}, []);
|
|
68
|
-
|
|
69
|
-
if (!iconRef) return fallback;
|
|
70
|
-
|
|
71
|
-
return <Image fixErrors src={query} {...rest} />;
|
|
72
|
-
}
|
|
1
|
+
import { ReactNode, useEffect, useState } from 'react';
|
|
2
|
+
|
|
3
|
+
import { resolveAsset } from '../src/assets';
|
|
4
|
+
import { fetchRetry } from '../src/http';
|
|
5
|
+
import { BoxProps } from './Box';
|
|
6
|
+
import { Image } from './Image';
|
|
7
|
+
|
|
8
|
+
enum Direction {
|
|
9
|
+
NORTH = 1,
|
|
10
|
+
SOUTH = 2,
|
|
11
|
+
EAST = 4,
|
|
12
|
+
WEST = 8,
|
|
13
|
+
NORTHEAST = NORTH | EAST,
|
|
14
|
+
NORTHWEST = NORTH | WEST,
|
|
15
|
+
SOUTHEAST = SOUTH | EAST,
|
|
16
|
+
SOUTHWEST = SOUTH | WEST,
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
type Props = {
|
|
20
|
+
/** Required: The path of the icon */
|
|
21
|
+
icon: string;
|
|
22
|
+
/** Required: The state of the icon */
|
|
23
|
+
icon_state: string;
|
|
24
|
+
} & Partial<{
|
|
25
|
+
/** Facing direction. See direction enum. Default is South */
|
|
26
|
+
direction: Direction;
|
|
27
|
+
/** Fallback icon. */
|
|
28
|
+
fallback: ReactNode;
|
|
29
|
+
/** Frame number. Default is 1 */
|
|
30
|
+
frame: number;
|
|
31
|
+
/** Movement state. Default is false */
|
|
32
|
+
movement: boolean;
|
|
33
|
+
}> &
|
|
34
|
+
BoxProps;
|
|
35
|
+
|
|
36
|
+
let refMap: Record<string, string> | undefined;
|
|
37
|
+
|
|
38
|
+
export function DmIcon(props: Props) {
|
|
39
|
+
const {
|
|
40
|
+
className,
|
|
41
|
+
direction = Direction.SOUTH,
|
|
42
|
+
fallback,
|
|
43
|
+
frame = 1,
|
|
44
|
+
icon_state,
|
|
45
|
+
icon,
|
|
46
|
+
movement = false,
|
|
47
|
+
...rest
|
|
48
|
+
} = props;
|
|
49
|
+
|
|
50
|
+
const [iconRef, setIconRef] = useState('');
|
|
51
|
+
|
|
52
|
+
const query = `${iconRef}?state=${icon_state}&dir=${direction}&movement=${movement}&frame=${frame}`;
|
|
53
|
+
|
|
54
|
+
useEffect(() => {
|
|
55
|
+
async function fetchRefMap() {
|
|
56
|
+
const response = await fetchRetry(resolveAsset('icon_ref_map.json'));
|
|
57
|
+
const data = await response.json();
|
|
58
|
+
refMap = data;
|
|
59
|
+
setIconRef(data[icon]);
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
if (!refMap) {
|
|
63
|
+
fetchRefMap();
|
|
64
|
+
} else {
|
|
65
|
+
setIconRef(refMap[icon]);
|
|
66
|
+
}
|
|
67
|
+
}, []);
|
|
68
|
+
|
|
69
|
+
if (!iconRef) return fallback;
|
|
70
|
+
|
|
71
|
+
return <Image fixErrors src={query} {...rest} />;
|
|
72
|
+
}
|