diff --git a/EFB/efb-js.patch b/EFB/efb-js.patch index fd2ac0f..60712e2 100644 --- a/EFB/efb-js.patch +++ b/EFB/efb-js.patch @@ -2,7 +2,95 @@ Index: EFB.js =================================================================== --- EFB.js +++ EFB.js -@@ -30209,9 +30209,9 @@ +@@ -29548,18 +29548,17 @@ + "{shift} Z X C V B N M /", + "{space} {close}" + ] + }; +- var Keyboard = (0, import_react4.forwardRef)(({ value, inputRef, onInput, onClose }, ref) => { ++ var Keyboard = (0, import_react4.forwardRef)(({ value, blurRef, onInput, onClose }, ref) => { + const [shift, setShift] = (0, import_react4.useState)(false); + const layout = shift ? defaultLayout.shift : defaultLayout.default; + const handleKeyPress = (key) => { +- var _a; + if (key === "{close}") { + onClose(); + return; + } +- (_a = inputRef.current) == null ? void 0 : _a.focus(); ++ blurRef.current = true; + if (key === "{shift}") { + setShift(!shift); + return; + } +@@ -29603,12 +29602,8 @@ + "button", + { + className: `flex justify-center rounded-md p-4 ${key === "{close}" ? "bg-zinc-700 px-12 focus:bg-zinc-600" : "flex-1 bg-zinc-600"}`, + onMouseDown: () => handleKeyPress(key), +- onMouseUp: () => { +- var _a; +- return (_a = inputRef.current) == null ? void 0 : _a.focus(); +- }, + children: keyIdent + }, + `key-${rowIndex}-${keyIndex}` + ); +@@ -29628,9 +29623,9 @@ + function Input(props) { + const [guid] = (0, import_react5.useState)(v4_default()); + const ref = (0, import_react5.useRef)(null); + const keyboardRef = (0, import_react5.useRef)(null); +- const blurTimeoutRef = (0, import_react5.useRef)(); ++ const blurRef = (0, import_react5.useRef)(false); + const [isFocused, setFocused] = (0, import_react5.useState)(false); + const [showKeyboard, setShowKeyboard] = (0, import_react5.useState)(false); + (0, import_react5.useEffect)(() => { + if (simulator() === 0 /* MSFS */) { +@@ -29660,25 +29655,23 @@ + placeholder: props.placeholder, + disabled: props.disabled, + onFocus: () => { + var _a; +- clearTimeout(blurTimeoutRef.current); + if (!isFocused) { + setFocused(true); + setShowKeyboard(true); + (_a = ref.current) == null ? void 0 : _a.select(); + } + }, + onBlur: (e) => { + var _a; +- if ((_a = keyboardRef.current) == null ? void 0 : _a.contains(e.relatedTarget)) { +- return; +- } +- blurTimeoutRef.current = setTimeout(() => { +- if (props.onBlur) props.onBlur(e.target.value); +- if (isFocused) setFocused(false); ++ if (blurRef.current && isFocused) (_a = ref.current) == null ? void 0 : _a.focus(); ++ else { + setShowKeyboard(false); +- }, 100); ++ setFocused(false); ++ (_a = ref.current) == null ? void 0 : _a.blur(); ++ } ++ blurRef.current = false; + }, + onChange: (e) => { + if (props.onChange) props.onChange(e.target.value); + }, +@@ -29690,9 +29683,9 @@ + Keyboard_default, + { + ref: keyboardRef, + value: String(props.value), +- inputRef: ref, ++ blurRef: blurRef, + onInput: (value) => props.onChange && props.onChange(value), + onClose: () => { + var _a; + setShowKeyboard(false); +@@ -30209,9 +30202,9 @@ { className: "middle none center rounded-lg bg-green-700 px-6 py-3 font-sans text-xs font-bold uppercase text-white shadow-md shadow-green-500/20 transition-all hover:shadow-lg hover:shadow-green-500/40 focus:opacity-[0.85] focus:shadow-none active:opacity-[0.85] active:shadow-none disabled:pointer-events-none disabled:opacity-50 disabled:shadow-none", "data-ripple-light": "true", @@ -13,7 +101,7 @@ Index: EFB.js ) }) }) ] }) }) }); } -@@ -40562,8 +40562,13 @@ +@@ -40562,8 +40555,13 @@ ] }) ] }) }) }); } @@ -27,7 +115,7 @@ Index: EFB.js init_common(); var import_jsx_runtime15 = __toESM(require_jsx_runtime()); var routes = { -@@ -40578,9 +40583,9 @@ +@@ -40578,9 +40576,9 @@ button: { title: "Payload", icon: Weight diff --git a/PackageSources/js-bundle/package.json b/PackageSources/js-bundle/package.json index 265dcd9..9d3bb3e 100644 --- a/PackageSources/js-bundle/package.json +++ b/PackageSources/js-bundle/package.json @@ -1,6 +1,6 @@ { "name": "tfdidesign-md11-load-manager", - "version": "0.1.153", + "version": "0.1.164", "description": "", "main": "index.js", "type": "module", @@ -59,6 +59,7 @@ "typescript": "5.8.3" }, "dependencies": { + "lucide-react": "^0.555.0", "react": "^19.1.0", "react-dom": "^19.1.0", "uuid": "^11.1.0" diff --git a/PackageSources/js-bundle/pnpm-lock.yaml b/PackageSources/js-bundle/pnpm-lock.yaml index 928ce61..2fe1a9e 100644 --- a/PackageSources/js-bundle/pnpm-lock.yaml +++ b/PackageSources/js-bundle/pnpm-lock.yaml @@ -8,6 +8,9 @@ importers: .: dependencies: + lucide-react: + specifier: ^0.555.0 + version: 0.555.0(react@19.1.0) react: specifier: ^19.1.0 version: 19.1.0 @@ -1897,6 +1900,11 @@ packages: lru-cache@5.1.1: resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==} + lucide-react@0.555.0: + resolution: {integrity: sha512-D8FvHUGbxWBRQM90NZeIyhAvkFfsh3u9ekrMvJ30Z6gnpBHS6HC6ldLg7tL45hwiIz/u66eKDtdA23gwwGsAHA==} + peerDependencies: + react: ^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0 + magic-string@0.30.17: resolution: {integrity: sha512-sNPKHvyjVf7gyjwS4xGTaW/mCnF8wnjtifKBEhxfZ7E/S8tQ0rssrwGNn6q8JH/ohItJfSQp9mBtQYuTlH5QnA==} @@ -4842,6 +4850,10 @@ snapshots: dependencies: yallist: 3.1.1 + lucide-react@0.555.0(react@19.1.0): + dependencies: + react: 19.1.0 + magic-string@0.30.17: dependencies: '@jridgewell/sourcemap-codec': 1.5.0 diff --git a/PackageSources/js-bundle/src/components/keyboard/Keyboard.tsx b/PackageSources/js-bundle/src/components/keyboard/Keyboard.tsx new file mode 100644 index 0000000..47509b4 --- /dev/null +++ b/PackageSources/js-bundle/src/components/keyboard/Keyboard.tsx @@ -0,0 +1,107 @@ +import { ArrowBigUp, Delete, Space, X } from 'lucide-react'; +import { forwardRef, RefObject, useState } from 'react'; +import { createPortal } from 'react-dom'; + +const defaultLayout = { + default: [ + '1 2 3 4 5 6 7 8 9 0 {bksp}', + 'q w e r t y u i o p', + 'a s d f g h j k l', + '{shift} z x c v b n m /', + '{space} {close}', + ], + shift: [ + '1 2 3 4 5 6 7 8 9 0 {bksp}', + 'Q W E R T Y U I O P', + 'A S D F G H J K L', + '{shift} Z X C V B N M /', + '{space} {close}', + ], +}; + +const Keyboard = forwardRef< + HTMLDivElement, + { + value: string; + blurRef: RefObject + onInput: (value: string) => void; + onClose: () => void; + } +>(({ value, blurRef, onInput, onClose }, ref) => { + const [shift, setShift] = useState(false); + + const layout = shift ? defaultLayout.shift : defaultLayout.default; + + const handleKeyPress = (key: string) => { + console.log('KEY PRESSED', key); + + if (key === '{close}') { + onClose(); + return; + } + + blurRef.current = true; + + if (key === '{shift}') { + setShift(!shift); + return; + } + + let newValue = value; + + if (key === '{bksp}') { + newValue = value.slice(0, -1); + } else if (key === '{space}') { + newValue = value + ' '; + } else if (key.length === 1) { + newValue = value + key; + } + + onInput(newValue); + }; + + return createPortal( +
console.log('Parent click captured')} + > + {layout.map((row, rowIndex) => ( +
+ {row.split(' ').map((key, keyIndex) => { + let keyIdent = <>{key}; + switch (key) { + case '{shift}': + keyIdent = ; + break; + case '{bksp}': + keyIdent = ; + break; + case '{close}': + keyIdent = ; + break; + case '{space}': + keyIdent = ; + break; + } + + return ( + + ); + })} +
+ ))} +
, + document.body + ); +}); + +export default Keyboard;