@iwer/devui 1.1.0 → 1.1.1
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/build/iwer-devui.js +41 -4
- package/build/iwer-devui.min.js +15 -15
- package/build/iwer-devui.module.js +41 -4
- package/build/iwer-devui.module.min.js +15 -15
- package/lib/components/header.d.ts +7 -0
- package/lib/components/header.d.ts.map +1 -1
- package/lib/components/header.js +37 -4
- package/lib/components/header.js.map +1 -1
- package/lib/index.d.ts +1 -1
- package/lib/version.d.ts +1 -1
- package/lib/version.js +1 -1
- package/package.json +2 -2
- package/lib/components/fov.d.ts +0 -16
- package/lib/components/fov.d.ts.map +0 -1
- package/lib/components/fov.js +0 -30
- package/lib/components/fov.js.map +0 -1
- package/lib/package.json +0 -55
- package/lib/src/components/analog.d.ts +0 -17
- package/lib/src/components/analog.d.ts.map +0 -1
- package/lib/src/components/analog.js +0 -111
- package/lib/src/components/analog.js.map +0 -1
- package/lib/src/components/binary.d.ts +0 -17
- package/lib/src/components/binary.d.ts.map +0 -1
- package/lib/src/components/binary.js +0 -77
- package/lib/src/components/binary.js.map +0 -1
- package/lib/src/components/controls.d.ts +0 -29
- package/lib/src/components/controls.d.ts.map +0 -1
- package/lib/src/components/controls.js +0 -139
- package/lib/src/components/controls.js.map +0 -1
- package/lib/src/components/fov.d.ts +0 -16
- package/lib/src/components/fov.d.ts.map +0 -1
- package/lib/src/components/fov.js +0 -30
- package/lib/src/components/fov.js.map +0 -1
- package/lib/src/components/header.d.ts +0 -20
- package/lib/src/components/header.d.ts.map +0 -1
- package/lib/src/components/header.js +0 -47
- package/lib/src/components/header.js.map +0 -1
- package/lib/src/components/headset.d.ts +0 -17
- package/lib/src/components/headset.d.ts.map +0 -1
- package/lib/src/components/headset.js +0 -29
- package/lib/src/components/headset.js.map +0 -1
- package/lib/src/components/icons.d.ts +0 -37
- package/lib/src/components/icons.d.ts.map +0 -1
- package/lib/src/components/icons.js +0 -265
- package/lib/src/components/icons.js.map +0 -1
- package/lib/src/components/joystick.d.ts +0 -21
- package/lib/src/components/joystick.d.ts.map +0 -1
- package/lib/src/components/joystick.js +0 -245
- package/lib/src/components/joystick.js.map +0 -1
- package/lib/src/components/keys.d.ts +0 -10
- package/lib/src/components/keys.d.ts.map +0 -1
- package/lib/src/components/keys.js +0 -74
- package/lib/src/components/keys.js.map +0 -1
- package/lib/src/components/mapper.d.ts +0 -22
- package/lib/src/components/mapper.d.ts.map +0 -1
- package/lib/src/components/mapper.js +0 -108
- package/lib/src/components/mapper.js.map +0 -1
- package/lib/src/components/styled.d.ts +0 -70
- package/lib/src/components/styled.d.ts.map +0 -1
- package/lib/src/components/styled.js +0 -272
- package/lib/src/components/styled.js.map +0 -1
- package/lib/src/components/vec3.d.ts +0 -22
- package/lib/src/components/vec3.d.ts.map +0 -1
- package/lib/src/components/vec3.js +0 -123
- package/lib/src/components/vec3.js.map +0 -1
- package/lib/src/index.d.ts +0 -22
- package/lib/src/index.d.ts.map +0 -1
- package/lib/src/index.js +0 -92
- package/lib/src/index.js.map +0 -1
- package/lib/src/scene.d.ts +0 -51
- package/lib/src/scene.d.ts.map +0 -1
- package/lib/src/scene.js +0 -250
- package/lib/src/scene.js.map +0 -1
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
/**
|
|
3
|
-
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
4
|
-
*
|
|
5
|
-
* This source code is licensed under the MIT license found in the
|
|
6
|
-
* LICENSE file in the root directory of this source tree.
|
|
7
|
-
*/
|
|
8
|
-
import { MouseLeft, MouseRight } from './icons.js';
|
|
9
|
-
import { faAngleUp, faArrowRightToBracket, faArrowTurnDown, faCaretDown, faCaretLeft, faCaretRight, faCaretUp, faDeleteLeft, } from '@fortawesome/free-solid-svg-icons';
|
|
10
|
-
import { FAIcon } from './styled.js';
|
|
11
|
-
export const MappedKeyDisplay = {
|
|
12
|
-
KeyA: 'A',
|
|
13
|
-
KeyB: 'B',
|
|
14
|
-
KeyC: 'C',
|
|
15
|
-
KeyD: 'D',
|
|
16
|
-
KeyE: 'E',
|
|
17
|
-
KeyF: 'F',
|
|
18
|
-
KeyG: 'G',
|
|
19
|
-
KeyH: 'H',
|
|
20
|
-
KeyI: 'I',
|
|
21
|
-
KeyJ: 'J',
|
|
22
|
-
KeyK: 'K',
|
|
23
|
-
KeyL: 'L',
|
|
24
|
-
KeyM: 'M',
|
|
25
|
-
KeyN: 'N',
|
|
26
|
-
KeyO: 'O',
|
|
27
|
-
KeyP: 'P',
|
|
28
|
-
KeyQ: 'Q',
|
|
29
|
-
KeyR: 'R',
|
|
30
|
-
KeyS: 'S',
|
|
31
|
-
KeyT: 'T',
|
|
32
|
-
KeyU: 'U',
|
|
33
|
-
KeyV: 'V',
|
|
34
|
-
KeyW: 'W',
|
|
35
|
-
KeyX: 'X',
|
|
36
|
-
KeyY: 'Y',
|
|
37
|
-
KeyZ: 'Z',
|
|
38
|
-
Digit0: '0',
|
|
39
|
-
Digit1: '1',
|
|
40
|
-
Digit2: '2',
|
|
41
|
-
Digit3: '3',
|
|
42
|
-
Digit4: '4',
|
|
43
|
-
Digit5: '5',
|
|
44
|
-
Digit6: '6',
|
|
45
|
-
Digit7: '7',
|
|
46
|
-
Digit8: '8',
|
|
47
|
-
Digit9: '9',
|
|
48
|
-
Tab: _jsx(FAIcon, { icon: faArrowRightToBracket }),
|
|
49
|
-
Backspace: _jsx(FAIcon, { icon: faDeleteLeft }),
|
|
50
|
-
Enter: (_jsx(FAIcon, { style: {
|
|
51
|
-
transform: 'rotate(90deg)',
|
|
52
|
-
}, icon: faArrowTurnDown })),
|
|
53
|
-
ShiftLeft: _jsx(FAIcon, { icon: faAngleUp }),
|
|
54
|
-
ShiftRight: _jsx(FAIcon, { icon: faAngleUp }),
|
|
55
|
-
Space: ' ',
|
|
56
|
-
ArrowUp: _jsx(FAIcon, { icon: faCaretUp }),
|
|
57
|
-
ArrowDown: _jsx(FAIcon, { icon: faCaretDown }),
|
|
58
|
-
ArrowLeft: _jsx(FAIcon, { icon: faCaretLeft }),
|
|
59
|
-
ArrowRight: _jsx(FAIcon, { icon: faCaretRight }),
|
|
60
|
-
Semicolon: ';',
|
|
61
|
-
Equal: '=',
|
|
62
|
-
Comma: ',',
|
|
63
|
-
Minus: '-',
|
|
64
|
-
Period: '.',
|
|
65
|
-
Slash: '/',
|
|
66
|
-
Backquote: '`',
|
|
67
|
-
BracketLeft: '[',
|
|
68
|
-
Backslash: '\\',
|
|
69
|
-
BracketRight: ']',
|
|
70
|
-
Quote: "'",
|
|
71
|
-
MouseLeft: _jsx(MouseLeft, {}),
|
|
72
|
-
MouseRight: _jsx(MouseRight, {}),
|
|
73
|
-
};
|
|
74
|
-
//# sourceMappingURL=keys.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"keys.js","sourceRoot":"","sources":["../../../src/components/keys.tsx"],"names":[],"mappings":";AAAA;;;;;GAKG;AAEH,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AACnD,OAAO,EACN,SAAS,EACT,qBAAqB,EACrB,eAAe,EACf,WAAW,EACX,WAAW,EACX,YAAY,EACZ,SAAS,EACT,YAAY,GACZ,MAAM,mCAAmC,CAAC;AAE3C,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,MAAM,CAAC,MAAM,gBAAgB,GAEzB;IACH,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,IAAI,EAAE,GAAG;IACT,MAAM,EAAE,GAAG;IACX,MAAM,EAAE,GAAG;IACX,MAAM,EAAE,GAAG;IACX,MAAM,EAAE,GAAG;IACX,MAAM,EAAE,GAAG;IACX,MAAM,EAAE,GAAG;IACX,MAAM,EAAE,GAAG;IACX,MAAM,EAAE,GAAG;IACX,MAAM,EAAE,GAAG;IACX,MAAM,EAAE,GAAG;IACX,GAAG,EAAE,KAAC,MAAM,IAAC,IAAI,EAAE,qBAAqB,GAAI;IAC5C,SAAS,EAAE,KAAC,MAAM,IAAC,IAAI,EAAE,YAAY,GAAI;IACzC,KAAK,EAAE,CACN,KAAC,MAAM,IACN,KAAK,EAAE;YACN,SAAS,EAAE,eAAe;SAC1B,EACD,IAAI,EAAE,eAAe,GACpB,CACF;IACD,SAAS,EAAE,KAAC,MAAM,IAAC,IAAI,EAAE,SAAS,GAAI;IACtC,UAAU,EAAE,KAAC,MAAM,IAAC,IAAI,EAAE,SAAS,GAAI;IACvC,KAAK,EAAE,GAAG;IACV,OAAO,EAAE,KAAC,MAAM,IAAC,IAAI,EAAE,SAAS,GAAI;IACpC,SAAS,EAAE,KAAC,MAAM,IAAC,IAAI,EAAE,WAAW,GAAI;IACxC,SAAS,EAAE,KAAC,MAAM,IAAC,IAAI,EAAE,WAAW,GAAI;IACxC,UAAU,EAAE,KAAC,MAAM,IAAC,IAAI,EAAE,YAAY,GAAI;IAC1C,SAAS,EAAE,GAAG;IACd,KAAK,EAAE,GAAG;IACV,KAAK,EAAE,GAAG;IACV,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,GAAG;IACX,KAAK,EAAE,GAAG;IACV,SAAS,EAAE,GAAG;IACd,WAAW,EAAE,GAAG;IAChB,SAAS,EAAE,IAAI;IACf,YAAY,EAAE,GAAG;IACjB,KAAK,EAAE,GAAG;IACV,SAAS,EAAE,KAAC,SAAS,KAAG;IACxB,UAAU,EAAE,KAAC,UAAU,KAAG;CAC1B,CAAC"}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
3
|
-
*
|
|
4
|
-
* This source code is licensed under the MIT license found in the
|
|
5
|
-
* LICENSE file in the root directory of this source tree.
|
|
6
|
-
*/
|
|
7
|
-
import React from 'react';
|
|
8
|
-
export type KeyMapType = Partial<Record<XRHandedness, {
|
|
9
|
-
[key: string]: string;
|
|
10
|
-
}>>;
|
|
11
|
-
export declare const DEFAULT_KEYMAP: KeyMapType;
|
|
12
|
-
type KeyMapStore = {
|
|
13
|
-
keyMap: KeyMapType;
|
|
14
|
-
bindKey: (handedness: 'left' | 'right', action: string, keyCode?: string) => void;
|
|
15
|
-
};
|
|
16
|
-
export declare const useKeyMapStore: import("zustand").UseBoundStore<import("zustand").StoreApi<KeyMapStore>>;
|
|
17
|
-
interface ControllerMapperProps {
|
|
18
|
-
handedness: 'left' | 'right';
|
|
19
|
-
}
|
|
20
|
-
export declare const ControllerMapper: React.FC<ControllerMapperProps>;
|
|
21
|
-
export {};
|
|
22
|
-
//# sourceMappingURL=mapper.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"mapper.d.ts","sourceRoot":"","sources":["../../../src/components/mapper.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,OAAO,KAA8B,MAAM,OAAO,CAAC;AASnD,MAAM,MAAM,UAAU,GAAG,OAAO,CAC/B,MAAM,CAAC,YAAY,EAAE;IAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,CAAC,CAC/C,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,UAuB5B,CAAC;AAEF,KAAK,WAAW,GAAG;IAClB,MAAM,EAAE,UAAU,CAAC;IACnB,OAAO,EAAE,CACR,UAAU,EAAE,MAAM,GAAG,OAAO,EAC5B,MAAM,EAAE,MAAM,EACd,OAAO,CAAC,EAAE,MAAM,KACZ,IAAI,CAAC;CACV,CAAC;AAEF,eAAO,MAAM,cAAc,0EAgBxB,CAAC;AAcJ,UAAU,qBAAqB;IAC9B,UAAU,EAAE,MAAM,GAAG,OAAO,CAAC;CAC7B;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAkF5D,CAAC"}
|
|
@@ -1,108 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
/**
|
|
3
|
-
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
4
|
-
*
|
|
5
|
-
* This source code is licensed under the MIT license found in the
|
|
6
|
-
* LICENSE file in the root directory of this source tree.
|
|
7
|
-
*/
|
|
8
|
-
import { Button, ButtonGroup, Colors, ControlButtonStyles } from './styled.js';
|
|
9
|
-
import { useEffect, useState } from 'react';
|
|
10
|
-
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
11
|
-
import { GamepadIcon } from './icons.js';
|
|
12
|
-
import { MappedKeyDisplay } from './keys.js';
|
|
13
|
-
import { create } from 'zustand';
|
|
14
|
-
import { faBan } from '@fortawesome/free-solid-svg-icons';
|
|
15
|
-
import { styled } from 'styled-components';
|
|
16
|
-
export const DEFAULT_KEYMAP = {
|
|
17
|
-
left: {
|
|
18
|
-
'thumbstick-up': 'KeyW',
|
|
19
|
-
'thumbstick-down': 'KeyS',
|
|
20
|
-
'thumbstick-left': 'KeyA',
|
|
21
|
-
'thumbstick-right': 'KeyD',
|
|
22
|
-
thumbstick: 'KeyR',
|
|
23
|
-
'x-button': 'KeyX',
|
|
24
|
-
'y-button': 'KeyZ',
|
|
25
|
-
trigger: 'KeyQ',
|
|
26
|
-
squeeze: 'KeyE',
|
|
27
|
-
},
|
|
28
|
-
right: {
|
|
29
|
-
'thumbstick-up': 'ArrowUp',
|
|
30
|
-
'thumbstick-down': 'ArrowDown',
|
|
31
|
-
'thumbstick-left': 'ArrowLeft',
|
|
32
|
-
'thumbstick-right': 'ArrowRight',
|
|
33
|
-
thumbstick: 'Slash',
|
|
34
|
-
'a-button': 'Enter',
|
|
35
|
-
'b-button': 'ShiftRight',
|
|
36
|
-
trigger: 'MouseLeft',
|
|
37
|
-
squeeze: 'MouseRight',
|
|
38
|
-
},
|
|
39
|
-
};
|
|
40
|
-
export const useKeyMapStore = create((set) => ({
|
|
41
|
-
keyMap: DEFAULT_KEYMAP,
|
|
42
|
-
bindKey: (handedness, action, keyCode = 'Unmapped') => set((state) => ({
|
|
43
|
-
keyMap: {
|
|
44
|
-
...state.keyMap,
|
|
45
|
-
[handedness]: {
|
|
46
|
-
...state.keyMap[handedness],
|
|
47
|
-
[action]: keyCode,
|
|
48
|
-
},
|
|
49
|
-
},
|
|
50
|
-
})),
|
|
51
|
-
}));
|
|
52
|
-
const Row = styled.div `
|
|
53
|
-
display: flex;
|
|
54
|
-
height: ${ControlButtonStyles.height};
|
|
55
|
-
align-items: center;
|
|
56
|
-
justify-content: space-between;
|
|
57
|
-
margin-bottom: ${ControlButtonStyles.gap};
|
|
58
|
-
|
|
59
|
-
&:last-child {
|
|
60
|
-
margin-bottom: 0;
|
|
61
|
-
}
|
|
62
|
-
`;
|
|
63
|
-
export const ControllerMapper = ({ handedness, }) => {
|
|
64
|
-
const { keyMap, bindKey } = useKeyMapStore();
|
|
65
|
-
const [currentMapping, setCurrentMapping] = useState(null);
|
|
66
|
-
const startMapping = (action) => {
|
|
67
|
-
setCurrentMapping({ action });
|
|
68
|
-
};
|
|
69
|
-
useEffect(() => {
|
|
70
|
-
const handleKeyDown = (event) => {
|
|
71
|
-
if (currentMapping && MappedKeyDisplay[event.code]) {
|
|
72
|
-
bindKey(handedness, currentMapping.action, event.code);
|
|
73
|
-
setCurrentMapping(null);
|
|
74
|
-
}
|
|
75
|
-
};
|
|
76
|
-
const handleMouseDown = (event) => {
|
|
77
|
-
if (currentMapping) {
|
|
78
|
-
const mouseButton = event.button === 0
|
|
79
|
-
? 'MouseLeft'
|
|
80
|
-
: event.button === 2
|
|
81
|
-
? 'MouseRight'
|
|
82
|
-
: null;
|
|
83
|
-
if (mouseButton && MappedKeyDisplay[mouseButton]) {
|
|
84
|
-
bindKey(handedness, currentMapping.action, mouseButton);
|
|
85
|
-
setCurrentMapping(null);
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
};
|
|
89
|
-
const preventDefaultContextMenu = (event) => {
|
|
90
|
-
event.preventDefault();
|
|
91
|
-
};
|
|
92
|
-
window.addEventListener('keydown', handleKeyDown);
|
|
93
|
-
window.addEventListener('mousedown', handleMouseDown);
|
|
94
|
-
window.addEventListener('contextmenu', preventDefaultContextMenu);
|
|
95
|
-
return () => {
|
|
96
|
-
window.removeEventListener('keydown', handleKeyDown);
|
|
97
|
-
window.removeEventListener('mousedown', handleMouseDown);
|
|
98
|
-
window.removeEventListener('contextmenu', preventDefaultContextMenu);
|
|
99
|
-
};
|
|
100
|
-
}, [currentMapping]);
|
|
101
|
-
return Object.keys(keyMap[handedness]).map((action) => (_jsxs(Row, { children: [_jsx(GamepadIcon, { buttonName: action === 'up' ? 'thumbstick' : action, handedness: handedness }), _jsxs(ButtonGroup, { "$reverse": false, children: [_jsx(Button, { "$reverse": false, style: {
|
|
102
|
-
width: '100px',
|
|
103
|
-
background: currentMapping && currentMapping.action === action
|
|
104
|
-
? Colors.gradientLightGreyTranslucent
|
|
105
|
-
: Colors.gradientGreyTranslucent,
|
|
106
|
-
}, onClick: () => startMapping(action), onContextMenu: (e) => e.preventDefault(), children: keyMap[handedness][action] }), _jsx(Button, { style: { width: ControlButtonStyles.widthShort }, "$reverse": false, onClick: () => bindKey(handedness, action), onContextMenu: (e) => e.preventDefault(), children: _jsx(FontAwesomeIcon, { icon: faBan }) })] })] }, action)));
|
|
107
|
-
};
|
|
108
|
-
//# sourceMappingURL=mapper.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"mapper.js","sourceRoot":"","sources":["../../../src/components/mapper.tsx"],"names":[],"mappings":";AAAA;;;;;GAKG;AAEH,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAC/E,OAAc,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAC;AACjE,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AACzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,mCAAmC,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAM3C,MAAM,CAAC,MAAM,cAAc,GAAe;IACzC,IAAI,EAAE;QACL,eAAe,EAAE,MAAM;QACvB,iBAAiB,EAAE,MAAM;QACzB,iBAAiB,EAAE,MAAM;QACzB,kBAAkB,EAAE,MAAM;QAC1B,UAAU,EAAE,MAAM;QAClB,UAAU,EAAE,MAAM;QAClB,UAAU,EAAE,MAAM;QAClB,OAAO,EAAE,MAAM;QACf,OAAO,EAAE,MAAM;KACf;IACD,KAAK,EAAE;QACN,eAAe,EAAE,SAAS;QAC1B,iBAAiB,EAAE,WAAW;QAC9B,iBAAiB,EAAE,WAAW;QAC9B,kBAAkB,EAAE,YAAY;QAChC,UAAU,EAAE,OAAO;QACnB,UAAU,EAAE,OAAO;QACnB,UAAU,EAAE,YAAY;QACxB,OAAO,EAAE,WAAW;QACpB,OAAO,EAAE,YAAY;KACrB;CACD,CAAC;AAWF,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAc,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;IAC3D,MAAM,EAAE,cAAc;IACtB,OAAO,EAAE,CACR,UAA4B,EAC5B,MAAc,EACd,OAAO,GAAG,UAAU,EACnB,EAAE,CACH,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;QACf,MAAM,EAAE;YACP,GAAG,KAAK,CAAC,MAAM;YACf,CAAC,UAAU,CAAC,EAAE;gBACb,GAAG,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC;gBAC3B,CAAC,MAAM,CAAC,EAAE,OAAO;aACjB;SACD;KACD,CAAC,CAAC;CACJ,CAAC,CAAC,CAAC;AAEJ,MAAM,GAAG,GAAG,MAAM,CAAC,GAAG,CAAA;;WAEX,mBAAmB,CAAC,MAAM;;;kBAGnB,mBAAmB,CAAC,GAAG;;;;;CAKxC,CAAC;AAMF,MAAM,CAAC,MAAM,gBAAgB,GAAoC,CAAC,EACjE,UAAU,GACV,EAAE,EAAE;IACJ,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,GAAG,cAAc,EAAE,CAAC;IAE7C,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAE1C,IAAI,CAAC,CAAC;IAEhB,MAAM,YAAY,GAAG,CAAC,MAAc,EAAE,EAAE;QACvC,iBAAiB,CAAC,EAAE,MAAM,EAAE,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACd,MAAM,aAAa,GAAG,CAAC,KAAoB,EAAE,EAAE;YAC9C,IAAI,cAAc,IAAI,gBAAgB,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC;gBACpD,OAAO,CAAC,UAAU,EAAE,cAAc,CAAC,MAAM,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC;gBACvD,iBAAiB,CAAC,IAAI,CAAC,CAAC;YACzB,CAAC;QACF,CAAC,CAAC;QAEF,MAAM,eAAe,GAAG,CAAC,KAAiB,EAAE,EAAE;YAC7C,IAAI,cAAc,EAAE,CAAC;gBACpB,MAAM,WAAW,GAChB,KAAK,CAAC,MAAM,KAAK,CAAC;oBACjB,CAAC,CAAC,WAAW;oBACb,CAAC,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC;wBACpB,CAAC,CAAC,YAAY;wBACd,CAAC,CAAC,IAAI,CAAC;gBACT,IAAI,WAAW,IAAI,gBAAgB,CAAC,WAAW,CAAC,EAAE,CAAC;oBAClD,OAAO,CAAC,UAAU,EAAE,cAAc,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;oBACxD,iBAAiB,CAAC,IAAI,CAAC,CAAC;gBACzB,CAAC;YACF,CAAC;QACF,CAAC,CAAC;QAEF,MAAM,yBAAyB,GAAG,CAAC,KAAiB,EAAE,EAAE;YACvD,KAAK,CAAC,cAAc,EAAE,CAAC;QACxB,CAAC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;QAClD,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,eAAe,CAAC,CAAC;QACtD,MAAM,CAAC,gBAAgB,CAAC,aAAa,EAAE,yBAAyB,CAAC,CAAC;QAElE,OAAO,GAAG,EAAE;YACX,MAAM,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;YACrD,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE,eAAe,CAAC,CAAC;YACzD,MAAM,CAAC,mBAAmB,CAAC,aAAa,EAAE,yBAAyB,CAAC,CAAC;QACtE,CAAC,CAAC;IACH,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IACrB,OAAO,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU,CAAE,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACvD,MAAC,GAAG,eACH,KAAC,WAAW,IACX,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,EACnD,UAAU,EAAE,UAAU,GACrB,EACF,MAAC,WAAW,gBAAW,KAAK,aAC3B,KAAC,MAAM,gBACI,KAAK,EACf,KAAK,EAAE;4BACN,KAAK,EAAE,OAAO;4BACd,UAAU,EACT,cAAc,IAAI,cAAc,CAAC,MAAM,KAAK,MAAM;gCACjD,CAAC,CAAC,MAAM,CAAC,4BAA4B;gCACrC,CAAC,CAAC,MAAM,CAAC,uBAAuB;yBAClC,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,EACnC,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,YAEtC,MAAM,CAAC,UAAU,CAA4B,CAAC,MAAM,CAAC,GAC/C,EACT,KAAC,MAAM,IACN,KAAK,EAAE,EAAE,KAAK,EAAE,mBAAmB,CAAC,UAAU,EAAE,cACtC,KAAK,EACf,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,UAAU,EAAE,MAAM,CAAC,EAC1C,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,cAAc,EAAE,YAExC,KAAC,eAAe,IAAC,IAAI,EAAE,KAAK,GAAI,GACxB,IACI,KA5BL,MAAM,CA6BV,CACN,CAAC,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -1,70 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
3
|
-
*
|
|
4
|
-
* This source code is licensed under the MIT license found in the
|
|
5
|
-
* LICENSE file in the root directory of this source tree.
|
|
6
|
-
*/
|
|
7
|
-
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
8
|
-
export declare const Colors: {
|
|
9
|
-
textWhite: string;
|
|
10
|
-
dangerRed: string;
|
|
11
|
-
dangerRedPressed: string;
|
|
12
|
-
panelBackground: string;
|
|
13
|
-
panelBorder: string;
|
|
14
|
-
buttonBackground: string;
|
|
15
|
-
buttonHovered: string;
|
|
16
|
-
buttonPressed: string;
|
|
17
|
-
gradientGrey: string;
|
|
18
|
-
gradientGreyTranslucent: string;
|
|
19
|
-
gradientLightGreyTranslucent: string;
|
|
20
|
-
};
|
|
21
|
-
export declare const ControlButtonStyles: {
|
|
22
|
-
height: string;
|
|
23
|
-
minWidth: string;
|
|
24
|
-
fontSize: string;
|
|
25
|
-
radiusMiddle: string;
|
|
26
|
-
radiusSolo: string;
|
|
27
|
-
radiusFirst: string;
|
|
28
|
-
radiusLast: string;
|
|
29
|
-
widthLong: string;
|
|
30
|
-
widthShort: string;
|
|
31
|
-
gap: string;
|
|
32
|
-
};
|
|
33
|
-
export declare const Button: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
|
|
34
|
-
$reverse: boolean;
|
|
35
|
-
}>> & string;
|
|
36
|
-
export declare const HeaderButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
|
|
37
|
-
export declare const MappedKeyBlock: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
38
|
-
$pressed: boolean;
|
|
39
|
-
}>> & string;
|
|
40
|
-
export declare const ButtonContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
41
|
-
$reverse: boolean;
|
|
42
|
-
}>> & string;
|
|
43
|
-
export declare const ButtonGroup: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
44
|
-
$reverse: boolean;
|
|
45
|
-
}>> & string;
|
|
46
|
-
export declare const JoystickButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
|
|
47
|
-
export declare const JoystickInner: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
48
|
-
export declare const RangeSelector: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, Omit<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
|
|
49
|
-
ref?: ((instance: HTMLInputElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLInputElement> | null | undefined;
|
|
50
|
-
}>, never>, {
|
|
51
|
-
$reverse: boolean;
|
|
52
|
-
}>> & string;
|
|
53
|
-
export declare const KeyBlockContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
54
|
-
$reverse: boolean;
|
|
55
|
-
}>> & string;
|
|
56
|
-
export declare const KeyRow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
57
|
-
$reverse: boolean;
|
|
58
|
-
}>> & string;
|
|
59
|
-
export declare const ButtonGroupColumn: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
60
|
-
export declare const FAIcon: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("@fortawesome/react-fontawesome").FontAwesomeIconProps, "ref"> & {
|
|
61
|
-
ref?: ((instance: SVGSVGElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<SVGSVGElement> | null | undefined;
|
|
62
|
-
}, never>> & string & Omit<typeof FontAwesomeIcon, keyof import("react").Component<any, {}, any>>;
|
|
63
|
-
export declare const ControlPanel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
64
|
-
export declare const SectionBreak: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHRElement>, HTMLHRElement>, {
|
|
65
|
-
$horizontal?: boolean;
|
|
66
|
-
}>> & string;
|
|
67
|
-
export declare const PanelHeaderButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {
|
|
68
|
-
$isRed?: boolean;
|
|
69
|
-
}>> & string;
|
|
70
|
-
//# sourceMappingURL=styled.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../../../src/components/styled.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,eAAe,EAAE,MAAM,gCAAgC,CAAC;AAGjE,eAAO,MAAM,MAAM;;;;;;;;;;;;CAclB,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;;;;;;;;CAW/B,CAAC;AAEF,eAAO,MAAM,MAAM;cAA6B,OAAO;YA+BtD,CAAC;AAEF,eAAO,MAAM,YAAY,yOAoCxB,CAAC;AAEF,eAAO,MAAM,cAAc;cAA0B,OAAO;YAc3D,CAAC;AAEF,eAAO,MAAM,eAAe;cAA0B,OAAO;YAW5D,CAAC;AAEF,eAAO,MAAM,WAAW;cAA0B,OAAO;YAQxD,CAAC;AAEF,eAAO,MAAM,cAAc,yOAe1B,CAAC;AAEF,eAAO,MAAM,aAAa,6NAQzB,CAAC;AAEF,eAAO,MAAM,aAAa;;;cACf,OAAO;YAsCjB,CAAC;AAEF,eAAO,MAAM,iBAAiB;cAA0B,OAAO;YAM9D,CAAC;AAEF,eAAO,MAAM,MAAM;cAA0B,OAAO;YAKnD,CAAC;AAEF,eAAO,MAAM,iBAAiB,6NAK7B,CAAC;AAEF,eAAO,MAAM,MAAM;;iGAOlB,CAAC;AAEF,eAAO,MAAM,YAAY,6NAaxB,CAAC;AAEF,eAAO,MAAM,YAAY;kBAA6B,OAAO;YAK5D,CAAC;AAGF,eAAO,MAAM,iBAAiB;aAA4B,OAAO;YAwBhE,CAAC"}
|
|
@@ -1,272 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
3
|
-
*
|
|
4
|
-
* This source code is licensed under the MIT license found in the
|
|
5
|
-
* LICENSE file in the root directory of this source tree.
|
|
6
|
-
*/
|
|
7
|
-
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
8
|
-
import { styled } from 'styled-components';
|
|
9
|
-
export const Colors = {
|
|
10
|
-
textWhite: 'rgba(223, 223, 223, 1)',
|
|
11
|
-
dangerRed: 'rgba(243, 151, 143, 1)',
|
|
12
|
-
dangerRedPressed: 'rgba(240, 97, 84,1)',
|
|
13
|
-
panelBackground: 'rgba(38, 38, 38, 0.7)',
|
|
14
|
-
panelBorder: 'rgba(61, 61, 63, 0.7)',
|
|
15
|
-
buttonBackground: 'rgba(61, 61, 63, 0.6)',
|
|
16
|
-
buttonHovered: 'rgba(61, 61, 63, 0.8)',
|
|
17
|
-
buttonPressed: 'rgba(61, 61, 63, 1)',
|
|
18
|
-
gradientGrey: 'linear-gradient(to bottom, #343434, #393939)',
|
|
19
|
-
gradientGreyTranslucent: 'linear-gradient(to bottom, rgba(52, 52, 52, 0.75), rgba(57, 57, 57, 0.75))',
|
|
20
|
-
gradientLightGreyTranslucent: 'linear-gradient(to bottom, rgba(75, 75, 75, 0.75), rgba(80, 80, 80, 0.75))',
|
|
21
|
-
};
|
|
22
|
-
export const ControlButtonStyles = {
|
|
23
|
-
height: '30px',
|
|
24
|
-
minWidth: '30px',
|
|
25
|
-
fontSize: '14px',
|
|
26
|
-
radiusMiddle: '3px',
|
|
27
|
-
radiusSolo: '10px',
|
|
28
|
-
radiusFirst: '10px 3px 3px 10px',
|
|
29
|
-
radiusLast: '3px 10px 10px 3px',
|
|
30
|
-
widthLong: '70px',
|
|
31
|
-
widthShort: '30px',
|
|
32
|
-
gap: '3px',
|
|
33
|
-
};
|
|
34
|
-
export const Button = styled.button `
|
|
35
|
-
background: ${Colors.gradientGreyTranslucent};
|
|
36
|
-
border: none;
|
|
37
|
-
display: flex;
|
|
38
|
-
align-items: center;
|
|
39
|
-
justify-content: center;
|
|
40
|
-
cursor: pointer;
|
|
41
|
-
color: ${Colors.textWhite};
|
|
42
|
-
border: 1px solid transparent;
|
|
43
|
-
border-radius: ${ControlButtonStyles.radiusMiddle};
|
|
44
|
-
font-size: ${ControlButtonStyles.fontSize};
|
|
45
|
-
height: ${ControlButtonStyles.height};
|
|
46
|
-
min-width: ${ControlButtonStyles.minWidth};
|
|
47
|
-
transition: all 0.2s ease-in-out;
|
|
48
|
-
text-transform: none;
|
|
49
|
-
box-shadow: none;
|
|
50
|
-
font-family: Arial, sans-serif;
|
|
51
|
-
|
|
52
|
-
&:first-child {
|
|
53
|
-
border-radius: ${({ $reverse }) => $reverse
|
|
54
|
-
? ControlButtonStyles.radiusLast
|
|
55
|
-
: ControlButtonStyles.radiusFirst};
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
&:last-child {
|
|
59
|
-
border-radius: ${({ $reverse }) => $reverse
|
|
60
|
-
? ControlButtonStyles.radiusFirst
|
|
61
|
-
: ControlButtonStyles.radiusLast};
|
|
62
|
-
}
|
|
63
|
-
`;
|
|
64
|
-
export const HeaderButton = styled.button `
|
|
65
|
-
background-color: transparent;
|
|
66
|
-
border: none;
|
|
67
|
-
display: flex;
|
|
68
|
-
align-items: center;
|
|
69
|
-
justify-content: center;
|
|
70
|
-
cursor: pointer;
|
|
71
|
-
color: ${Colors.textWhite};
|
|
72
|
-
border-radius: 4px;
|
|
73
|
-
font-size: 16px;
|
|
74
|
-
height: 24px;
|
|
75
|
-
min-width: 24px;
|
|
76
|
-
transition: all 0.2s ease-in-out;
|
|
77
|
-
text-transform: none;
|
|
78
|
-
box-shadow: none;
|
|
79
|
-
font-family: Arial, sans-serif;
|
|
80
|
-
|
|
81
|
-
&:hover {
|
|
82
|
-
background-color: ${Colors.buttonPressed};
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
&:active {
|
|
86
|
-
background-color: ${Colors.buttonPressed};
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
&:focus {
|
|
90
|
-
outline: none;
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
&:first-child {
|
|
94
|
-
border-radius: 12px 4px 4px 12px;
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
&:last-child {
|
|
98
|
-
border-radius: 4px 12px 12px 4px;
|
|
99
|
-
}
|
|
100
|
-
`;
|
|
101
|
-
export const MappedKeyBlock = styled.div `
|
|
102
|
-
background-color: ${({ $pressed }) => $pressed ? Colors.buttonPressed : Colors.buttonBackground};
|
|
103
|
-
border: none;
|
|
104
|
-
display: flex;
|
|
105
|
-
align-items: center;
|
|
106
|
-
justify-content: center;
|
|
107
|
-
color: ${Colors.textWhite};
|
|
108
|
-
border-radius: 8px;
|
|
109
|
-
font-size: 14px;
|
|
110
|
-
font-family: Arial, sans-serif;
|
|
111
|
-
height: 30px;
|
|
112
|
-
width: 30px;
|
|
113
|
-
transition: all 0.2s ease-in-out;
|
|
114
|
-
`;
|
|
115
|
-
export const ButtonContainer = styled.div `
|
|
116
|
-
display: flex;
|
|
117
|
-
align-items: center;
|
|
118
|
-
height: 30px;
|
|
119
|
-
margin-bottom: 3px;
|
|
120
|
-
justify-content: flex-start;
|
|
121
|
-
flex-direction: ${({ $reverse }) => ($reverse ? 'row-reverse' : 'row')};
|
|
122
|
-
|
|
123
|
-
&:last-child {
|
|
124
|
-
margin-bottom: 0;
|
|
125
|
-
}
|
|
126
|
-
`;
|
|
127
|
-
export const ButtonGroup = styled.div `
|
|
128
|
-
display: flex;
|
|
129
|
-
flex-direction: ${({ $reverse }) => ($reverse ? 'row-reverse' : 'row')};
|
|
130
|
-
height: 100%;
|
|
131
|
-
justify-content: space-between;
|
|
132
|
-
align-items: center;
|
|
133
|
-
margin: ${({ $reverse }) => ($reverse ? '0 5px 0 0' : '0 0 0 5px')};
|
|
134
|
-
gap: 3px;
|
|
135
|
-
`;
|
|
136
|
-
export const JoystickButton = styled.button `
|
|
137
|
-
background-color: rgba(255, 255, 255, 0.3);
|
|
138
|
-
border: none;
|
|
139
|
-
display: flex;
|
|
140
|
-
justify-content: center;
|
|
141
|
-
align-items: center;
|
|
142
|
-
padding: 0;
|
|
143
|
-
pointer-events: none;
|
|
144
|
-
width: 50px;
|
|
145
|
-
height: 50px;
|
|
146
|
-
border-radius: 50%;
|
|
147
|
-
position: relative;
|
|
148
|
-
margin: 0 5px;
|
|
149
|
-
backdrop-filter: blur(10px);
|
|
150
|
-
-webkit-backdrop-filter: blur(10px);
|
|
151
|
-
`;
|
|
152
|
-
export const JoystickInner = styled.div `
|
|
153
|
-
position: absolute;
|
|
154
|
-
background-color: ${Colors.textWhite};
|
|
155
|
-
border-radius: 50%;
|
|
156
|
-
width: 36px;
|
|
157
|
-
height: 36px;
|
|
158
|
-
cursor: pointer;
|
|
159
|
-
pointer-events: auto;
|
|
160
|
-
`;
|
|
161
|
-
export const RangeSelector = styled.input.attrs({ type: 'range' }) `
|
|
162
|
-
-webkit-appearance: none;
|
|
163
|
-
appearance: none;
|
|
164
|
-
background: ${Colors.gradientGreyTranslucent};
|
|
165
|
-
border: none;
|
|
166
|
-
height: 100%;
|
|
167
|
-
width: ${ControlButtonStyles.widthLong};
|
|
168
|
-
cursor: pointer;
|
|
169
|
-
margin: 0;
|
|
170
|
-
transition: all 0.2s ease-in-out;
|
|
171
|
-
border-radius: ${({ $reverse }) => $reverse
|
|
172
|
-
? ControlButtonStyles.radiusFirst
|
|
173
|
-
: ControlButtonStyles.radiusLast};
|
|
174
|
-
|
|
175
|
-
&::-webkit-slider-thumb {
|
|
176
|
-
-webkit-appearance: none;
|
|
177
|
-
appearance: none;
|
|
178
|
-
width: 8px;
|
|
179
|
-
height: 30px;
|
|
180
|
-
background-color: ${Colors.textWhite};
|
|
181
|
-
border-radius: ${ControlButtonStyles.radiusMiddle};
|
|
182
|
-
}
|
|
183
|
-
|
|
184
|
-
&::-moz-range-thumb {
|
|
185
|
-
width: 10px;
|
|
186
|
-
height: 30px;
|
|
187
|
-
background-color: ${Colors.textWhite};
|
|
188
|
-
border-radius: ${ControlButtonStyles.radiusMiddle};
|
|
189
|
-
}
|
|
190
|
-
|
|
191
|
-
&::-ms-thumb {
|
|
192
|
-
width: 8px;
|
|
193
|
-
height: 24px;
|
|
194
|
-
background-color: ${Colors.textWhite};
|
|
195
|
-
border-radius: ${ControlButtonStyles.radiusMiddle};
|
|
196
|
-
}
|
|
197
|
-
`;
|
|
198
|
-
export const KeyBlockContainer = styled.div `
|
|
199
|
-
display: flex;
|
|
200
|
-
flex-direction: column;
|
|
201
|
-
align-items: ${({ $reverse }) => ($reverse ? 'flex-start' : 'flex-end')};
|
|
202
|
-
justify-content: center;
|
|
203
|
-
margin: ${({ $reverse }) => ($reverse ? '2px -26px 0 0' : '2px 0 0 -26px')};
|
|
204
|
-
`;
|
|
205
|
-
export const KeyRow = styled.div `
|
|
206
|
-
display: flex;
|
|
207
|
-
flex-direction: ${({ $reverse }) => ($reverse ? 'row-reverse' : 'row')};
|
|
208
|
-
align-items: center;
|
|
209
|
-
justify-content: center;
|
|
210
|
-
`;
|
|
211
|
-
export const ButtonGroupColumn = styled.div `
|
|
212
|
-
display: flex;
|
|
213
|
-
flex-direction: column;
|
|
214
|
-
height: 50px;
|
|
215
|
-
justify-content: space-between;
|
|
216
|
-
`;
|
|
217
|
-
export const FAIcon = styled(FontAwesomeIcon) `
|
|
218
|
-
height: 14px;
|
|
219
|
-
min-height: 14px;
|
|
220
|
-
max-height: 14px;
|
|
221
|
-
width: 14px;
|
|
222
|
-
min-width: 14px;
|
|
223
|
-
max-width: 14px;
|
|
224
|
-
`;
|
|
225
|
-
export const ControlPanel = styled.div `
|
|
226
|
-
position: fixed;
|
|
227
|
-
padding: 5px;
|
|
228
|
-
font-family: Arial, sans-serif;
|
|
229
|
-
color: ${Colors.textWhite};
|
|
230
|
-
pointer-events: all;
|
|
231
|
-
background-color: ${Colors.panelBackground};
|
|
232
|
-
border: 1px solid ${Colors.panelBorder};
|
|
233
|
-
backdrop-filter: blur(40px);
|
|
234
|
-
-webkit-backdrop-filter: blur(40px);
|
|
235
|
-
border-radius: 12px;
|
|
236
|
-
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
|
|
237
|
-
overflow: hidden;
|
|
238
|
-
`;
|
|
239
|
-
export const SectionBreak = styled.hr `
|
|
240
|
-
width: ${({ $horizontal }) => ($horizontal ? '100%' : '1px')};
|
|
241
|
-
height: ${({ $horizontal }) => ($horizontal ? '1px' : '100%')};
|
|
242
|
-
background-color: ${Colors.panelBorder};
|
|
243
|
-
border: none;
|
|
244
|
-
`;
|
|
245
|
-
SectionBreak.defaultProps = { $horizontal: true };
|
|
246
|
-
export const PanelHeaderButton = styled.button `
|
|
247
|
-
background-color: transparent;
|
|
248
|
-
border: none;
|
|
249
|
-
display: flex;
|
|
250
|
-
align-items: center;
|
|
251
|
-
justify-content: center;
|
|
252
|
-
cursor: pointer;
|
|
253
|
-
color: ${({ $isRed }) => ($isRed ? Colors.dangerRed : Colors.textWhite)};
|
|
254
|
-
font-size: 12px;
|
|
255
|
-
padding: 3px;
|
|
256
|
-
text-transform: none;
|
|
257
|
-
box-shadow: none;
|
|
258
|
-
|
|
259
|
-
&:hover {
|
|
260
|
-
color: ${({ $isRed }) => ($isRed ? Colors.dangerRedPressed : '#ffffff')};
|
|
261
|
-
}
|
|
262
|
-
|
|
263
|
-
&:active {
|
|
264
|
-
color: ${({ $isRed }) => ($isRed ? Colors.dangerRedPressed : '#ffffff')};
|
|
265
|
-
}
|
|
266
|
-
|
|
267
|
-
&:focus {
|
|
268
|
-
outline: none;
|
|
269
|
-
}
|
|
270
|
-
`;
|
|
271
|
-
PanelHeaderButton.defaultProps = { $isRed: false };
|
|
272
|
-
//# sourceMappingURL=styled.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"styled.js","sourceRoot":"","sources":["../../../src/components/styled.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
export declare function round(number: number, decimalPlaces: number): number;
|
|
2
|
-
type Vector3Like = {
|
|
3
|
-
x: number;
|
|
4
|
-
y: number;
|
|
5
|
-
z: number;
|
|
6
|
-
};
|
|
7
|
-
interface Vector3InputProps {
|
|
8
|
-
vector: Vector3Like;
|
|
9
|
-
label: string;
|
|
10
|
-
multiplier?: number;
|
|
11
|
-
precision?: number;
|
|
12
|
-
onValidInput?: () => void;
|
|
13
|
-
}
|
|
14
|
-
export declare const Vector3Input: ({ vector, label, multiplier, precision, onValidInput, }: Vector3InputProps) => import("react/jsx-runtime").JSX.Element;
|
|
15
|
-
interface Vector3ReadOnlyProps {
|
|
16
|
-
vector: Vector3Like;
|
|
17
|
-
label: string;
|
|
18
|
-
precision?: number;
|
|
19
|
-
}
|
|
20
|
-
export declare const Vector3ReadOnly: ({ label, vector, precision, }: Vector3ReadOnlyProps) => import("react/jsx-runtime").JSX.Element;
|
|
21
|
-
export {};
|
|
22
|
-
//# sourceMappingURL=vec3.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"vec3.d.ts","sourceRoot":"","sources":["../../../src/components/vec3.tsx"],"names":[],"mappings":"AAKA,wBAAgB,KAAK,CAAC,MAAM,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,UAG1D;AAID,KAAK,WAAW,GAAG;IAClB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACV,CAAC;AAEF,UAAU,iBAAiB;IAC1B,MAAM,EAAE,WAAW,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B;AAiDD,eAAO,MAAM,YAAY,4DAMtB,iBAAiB,4CAoGnB,CAAC;AAEF,UAAU,oBAAoB;IAC7B,MAAM,EAAE,WAAW,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,eAAe,kCAIzB,oBAAoB,4CAyBtB,CAAC"}
|