Migrate vuedraggable to npm package

package-lock.json

@@ -9628,6 +9628,11 @@
         "websocket-driver": "^0.7.4"
       }
     },
+    "sortablejs": {
+      "version": "1.10.2",
+      "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.10.2.tgz",
+      "integrity": "sha512-YkPGufevysvfwn5rfdlGyrGjt7/CRHwvRPogD/lC+TnvcN29jDpCifKP+rBqf+LRldfXSTh+0CGLcSg0VIxq3A=="
+    },
     "source-map": {
       "version": "0.5.7",
       "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
@@ -10461,6 +10466,14 @@
       "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
       "dev": true
     },
+    "vuedraggable": {
+      "version": "2.24.3",
+      "resolved": "https://registry.npmjs.org/vuedraggable/-/vuedraggable-2.24.3.tgz",
+      "integrity": "sha512-6/HDXi92GzB+Hcs9fC6PAAozK1RLt1ewPTLjK0anTYguXLAeySDmcnqE8IC0xa7shvSzRjQXq3/+dsZ7ETGF3g==",
+      "requires": {
+        "sortablejs": "1.10.2"
+      }
+    },
     "watchpack": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.2.0.tgz",

package.json

@@ -15,7 +15,8 @@
     "mousetrap": "^1.6.5",
     "pako": "^2.0.4",
     "tween.js": "^16.6.0",
-    "vue": "^2.6.11"
+    "vue": "^2.6.11",
+    "vuedraggable": "^2.24.3"
   },
   "devDependencies": {
     "@babel/core": "^7.12.16",

public/index.html

@@ -68,8 +68,6 @@
   <script type="text/javascript" src="lib/v-tooltip.min.js"></script>
   <script type="text/javascript" src="lib/vis-network.min.js"></script>
   <script type="text/javascript" src="lib/deepmerge.js"></script>
-  <script type="text/javascript" src="lib/Sortable.min.js"></script>
-  <script type="text/javascript" src="lib/vuedraggable.umd.min.js"></script>
   <script type="text/javascript" src="lib/vue-split-pane.min.js"></script>
   <script type="text/javascript" src="lib/chevrotain.min.js"></script>
   <script type="text/javascript" src="lib/codemirror.js"></script>

public/slider_test.html

@@ -109,7 +109,6 @@
 
 <script type="text/javascript" src="lib/vue.js"></script>
 <script type="text/javascript" src="lib/v-tooltip.min.js"></script>
-<script type="text/javascript" src="public/lib/vuedraggable.js"></script>
 <script type="text/javascript" src="javascripts/DragDropTouch.js"></script>
 <script type="text/javascript" src="javascripts/longpress.js"></script>
 

src/components/tabs/automator/AutomatorBlockEditor.vue

@@ -1,10 +1,12 @@
 <script>
 import AutomatorSingleBlock from "./AutomatorSingleBlock";
+import draggable from "vuedraggable";
 
 export default {
   name: "AutomatorBlockEditor",
   components: {
-    AutomatorSingleBlock
+    AutomatorSingleBlock,
+    draggable
   },
   computed: {
     lineNumbersCount() {

src/components/tabs/automator/AutomatorBlocks.vue

@@ -1,6 +1,11 @@
 <script>
+import draggable from "vuedraggable";
+
 export default {
   name: "AutomatorBlocks",
+  components: {
+    draggable
+  },
   data() {
     return {
       blocks: automatorBlocks.filter(b => !AUTOMATOR_BLOCKS_BLACKLIST.includes(b.cmd))

src/components/tabs/automator/AutomatorSingleBlock.vue

@@ -1,6 +1,11 @@
 <script>
+import draggable from "vuedraggable";
+
 export default {
   name: "AutomatorSingleBlock",
+  components: {
+    draggable
+  },
   props: {
     block: {
       type: Object,