fixed dragability after new statment is added

src/components/TextBox.vue

@@ -1,20 +1,17 @@
 <script setup lang="ts">
 import { ref } from "vue";
 import { RichTextBox } from "../types.ts";
-
+import { stepX, stepY } from "../support/const.ts";
 const props = defineProps({
   value: {
     type: RichTextBox,
   },
-  // statement: { type: String, required: true },
-  // startingX:  { type: Number, default: 0 },
-  // startingY:  { type: Number, default: 0 },
 });
 </script>
 
 <template>
   <Draggable
-    :grid="[5, 5]"
+    :grid="[stepX, stepY]"
     :default-position="{ x: props.value.x, y: props.value.y }"
   >
     <div style="display: flex; bottom: 10px; right: 0">

src/pages/Editor.vue

@@ -11,6 +11,7 @@ import VarDeclEditor from './VarDeclEditor.vue'
 import ExpressionEditor from './ExpressionEditor.vue'
 import TextBox from '../components/TextBox.vue'
 import {RichTextBox} from "../types.ts";
+import { stepX, stepY } from "../support/const.ts";
 
 const math = new MathPage(uuidv4())
 const statements = ref<MathStatement[]>([])
@@ -114,15 +115,18 @@ function richUpdateValue() {
     <q-page-container id="editor" >
 <!--      <WrapperBox />-->
 
-      <span v-for="statement in statements">
+      <span v-for="statement in statements" style="display: flex">
         <Draggable
-            :grid="[25, 25]"
+            :grid="[stepX, stepY]"
         >
+        <div>
           <Statement
             :key="statementsKey"
             :statement="statement"
             :evaluation="evaluation"
           />
+        </div>
+
         </Draggable>
       </span>
 

src/support/const.ts

@@ -0,0 +1,2 @@
+export const stepX = 5
+export const stepY = 5

src/support/parse.ts

@@ -269,6 +269,9 @@ export class MathStatement {
 
         /** The raw statement input by the user. */
         public readonly raw: string,
+
+        public x: Number = 0,
+        public y: Number = 0,
     ) {}
 
     /** Parse the raw statement to an AST. */

src/types.ts

@@ -98,5 +98,7 @@ export class RichTextBox {
         public text: string = '',
         public x: Number = 0,
         public y: Number = 0,
-        ) {}
+        ) {
+   
+    }
 }