+
});
diff --git a/src/components/Panels.scss b/src/components/Panels.scss
index e9ebc0c..6770fdb 100644
--- a/src/components/Panels.scss
+++ b/src/components/Panels.scss
@@ -39,13 +39,17 @@
&.main {
flex: 1;
+ pointer-events: all;
}
&>header {
background: #00000040;
margin: -4px;
padding: 12px;
- text-transform: capitalize;
+
+ &>.title {
+ text-transform: capitalize;
+ }
}
&>*:not(.debug):not(.header):not(.gap) {
diff --git a/src/components/scriptEditor/ScriptEditorView.scss b/src/components/scriptEditor/ScriptEditorView.scss
new file mode 100644
index 0000000..30c15f8
--- /dev/null
+++ b/src/components/scriptEditor/ScriptEditorView.scss
@@ -0,0 +1,11 @@
+.script-editor {
+ flex: 1;
+ min-height: 0;
+ display: flex;
+ flex-direction: column;
+
+ .blockly-container {
+ flex: 1;
+ min-height: 0;
+ }
+}
\ No newline at end of file
diff --git a/src/components/scriptEditor/ScriptEditorView.tsx b/src/components/scriptEditor/ScriptEditorView.tsx
new file mode 100644
index 0000000..850e8e1
--- /dev/null
+++ b/src/components/scriptEditor/ScriptEditorView.tsx
@@ -0,0 +1,84 @@
+import { useEffect, useRef } from "react";
+import { observer } from "mobx-react-lite";
+import { runInAction } from "mobx";
+import * as Blockly from "blockly";
+import type { ObjectType } from "../../types";
+import './ScriptEditorView.scss';
+
+const TOOLBOX: Blockly.utils.toolbox.ToolboxDefinition = {
+ kind: 'flyoutToolbox',
+ contents: [
+ { kind: 'block', type: 'controls_if' },
+ { kind: 'block', type: 'controls_repeat_ext' },
+ { kind: 'block', type: 'logic_compare' },
+ { kind: 'block', type: 'math_number' },
+ { kind: 'block', type: 'math_arithmetic' },
+ { kind: 'block', type: 'text' },
+ { kind: 'block', type: 'text_print' },
+ ],
+};
+
+type ScriptEditorViewProps = {
+ objectType: ObjectType;
+}
+
+export const ScriptEditorView = observer(function ({ objectType }: ScriptEditorViewProps) {
+ const containerRef = useRef