51 lines
1.3 KiB
TypeScript
51 lines
1.3 KiB
TypeScript
import { Editor, type EditorState } from "./Editor";
|
|
import type { Dynamic, State2Props } from "./util/extra";
|
|
|
|
|
|
export interface LetInBlockState {
|
|
kind: "let";
|
|
env: any;
|
|
name: string;
|
|
value: EditorState;
|
|
inner: EditorState;
|
|
resolved: undefined | Dynamic;
|
|
}
|
|
|
|
interface LetInBlockProps extends State2Props<LetInBlockState> {
|
|
onResolve: (resolved: EditorState) => void;
|
|
}
|
|
|
|
|
|
export function LetInBlock({state, setState, onResolve}: LetInBlockProps) {
|
|
const {env, name, value, inner, resolved} = state;
|
|
const onChangeName = (e: React.ChangeEvent<HTMLInputElement>) => {
|
|
setState({...state, name: e.target.value});
|
|
}
|
|
return <span className="letIn">
|
|
<div className="decl">
|
|
let <input
|
|
className='editable'
|
|
value={name}
|
|
placeholder="<variable name>"
|
|
onChange={onChangeName}
|
|
/> =
|
|
<Editor
|
|
state={value}
|
|
filter={() => true}
|
|
onResolve={(state: EditorState) => {} }
|
|
onCancel={() => {} }
|
|
setState={(state: EditorState) => {} }
|
|
/>
|
|
in
|
|
</div>
|
|
<div className="inner">
|
|
<Editor
|
|
state={inner}
|
|
filter={() => true}
|
|
onResolve={(state: EditorState) => {} }
|
|
onCancel={() => {} }
|
|
setState={(state: EditorState) => {} }
|
|
/>
|
|
</div>
|
|
</span>
|
|
}
|