bump dependencies + proper toolbar line breaks

This commit is contained in:
Joeri Exelmans 2025-06-05 10:24:46 +02:00
parent 4a89ccd5d1
commit 9bab65167b
6 changed files with 349 additions and 308 deletions

View file

@ -17,16 +17,16 @@
"react-dom": "^19.1.0" "react-dom": "^19.1.0"
}, },
"devDependencies": { "devDependencies": {
"@eslint/js": "^9.27.0", "@eslint/js": "^9.28.0",
"@types/react": "^19.1.5", "@types/react": "^19.1.6",
"@types/react-dom": "^19.1.5", "@types/react-dom": "^19.1.6",
"@vitejs/plugin-react-swc": "^3.10.0", "@vitejs/plugin-react-swc": "^3.10.1",
"eslint": "^9.27.0", "eslint": "^9.28.0",
"eslint-plugin-react-hooks": "^5.2.0", "eslint-plugin-react-hooks": "^5.2.0",
"eslint-plugin-react-refresh": "^0.4.20", "eslint-plugin-react-refresh": "^0.4.20",
"globals": "^16.1.0", "globals": "^16.2.0",
"typescript": "~5.8.3", "typescript": "~5.8.3",
"typescript-eslint": "^8.32.1", "typescript-eslint": "^8.33.1",
"vite": "^6.3.5" "vite": "^6.3.5"
} }
} }

567
pnpm-lock.yaml generated

File diff suppressed because it is too large Load diff

View file

@ -54,6 +54,7 @@ footer a {
border-radius: 5px; border-radius: 5px;
padding: 0 6px 0 6px; padding: 0 6px 0 6px;
margin: 0 4px 0 4px; margin: 0 4px 0 4px;
/* display: inline-block; */
} }
.command.highlighted { .command.highlighted {

View file

@ -169,35 +169,45 @@ export function App() {
return ( return (
<> <>
<header> <header>
<button disabled={appState.history.length===1} onClick={onUndo}>Undo ({appState.history.length-1}) <kbd>Ctrl</kbd>+<kbd>Z</kbd></button> <span className="line">
<button disabled={appState.future.length===0} onClick={onRedo}>Redo ({appState.future.length}) <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>Z</kbd></button> <button disabled={appState.history.length===1} onClick={onUndo}>Undo ({appState.history.length-1}) <kbd>Ctrl</kbd>+<kbd>Z</kbd></button>
<button onClick={onCopy}>Copy <kbd>Ctrl</kbd>+<kbd>C</kbd></button> <button disabled={appState.future.length===0} onClick={onRedo}>Redo ({appState.future.length}) <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>Z</kbd></button>
<button onClick={onPaste}>Paste <kbd>Ctrl</kbd>+<kbd>V</kbd></button> <button onClick={onCopy}>Copy <kbd>Ctrl</kbd>+<kbd>C</kbd></button>
{ <button onClick={onPaste}>Paste <kbd>Ctrl</kbd>+<kbd>V</kbd></button>
actionShortcuts.map(([_, keys, descr], i) => </span>
<span key={i} className={'command' + (highlighted[i] ? (' highlighted') : '')}> <span className="line">
{keys.map((key, j) => <kbd key={j}>{key}</kbd>)} <span className="line">
&nbsp; {
{descr} actionShortcuts.map(([_, keys, descr], i) =>
</span>) <span key={i} className={'command' + (highlighted[i] ? (' highlighted') : '')}>
} {keys.map((key, j) => <kbd key={j}>{key}</kbd>)}
<select onChange={onSelectExample} value={-1}> &nbsp;
<option value={-1}>load example...</option> {descr}
{ </span>)
examples.map(([name], i) => { }
return <option key={i} value={i}>{name}</option>; </span>
}) <span className="line">
} <select onChange={onSelectExample} value={-1}>
</select> <option value={-1}>load example...</option>
<button className="factoryReset" onClick={factoryReset}> {
FACTORY RESET examples.map(([name], i) => {
</button> return <option key={i} value={i}>{name}</option>;
<label> })
<input type="checkbox" }
checked={syntacticSugar} </select>
onChange={e => setSyntacticSugar(e.target.checked)}/> <button className="factoryReset" onClick={factoryReset}>
syntactic sugar FACTORY RESET
</label> </button>
<span className="line">
<label>
<input type="checkbox"
checked={syntacticSugar}
onChange={e => setSyntacticSugar(e.target.checked)}/>
syntactic sugar
</label>
</span>
</span>
</span>
</header> </header>
<main onKeyDown={onKeyDown}> <main onKeyDown={onKeyDown}>
@ -224,7 +234,7 @@ export function App() {
</main> </main>
<footer> <footer>
<a href="https://deemz.org/git/joeri/dope2-webapp">Source code</a> <a href="https://deemz.org/git/research/dope2-webapp">Source code</a>
</footer> </footer>
</> </>
) )

View file

@ -11,7 +11,6 @@ import { Type as TypeBlock, TypeInfoBlock } from "../other/Type";
import type { ExprBlockState, State2Props } from "./ExprBlock"; import type { ExprBlockState, State2Props } from "./ExprBlock";
import "./InputBlock.css"; import "./InputBlock.css";
import { evalExpr } from "../../eval/eval";
interface Literal { interface Literal {
kind: "literal"; kind: "literal";

View file

@ -38,3 +38,7 @@ kbd {
color: white; color: white;
background: dodgerblue; background: dodgerblue;
} }
span.line {
display: inline-block;
}