Merge pull request #144 from bensladden/interactjs

Interactjs
bensladden · May 31, 2020 · 96bde65 · 96bde65
2 parents bdd3ca0 + 8e493cd
commit 96bde65
Show file tree

Hide file tree

Showing 13 changed files with 16,750 additions and 11,030 deletions.
diff --git a/dist/vue-responsive-dash.common.js b/dist/vue-responsive-dash.common.js
diff --git a/dist/vue-responsive-dash.common.js.map b/dist/vue-responsive-dash.common.js.map
diff --git a/dist/vue-responsive-dash.umd.js b/dist/vue-responsive-dash.umd.js
diff --git a/dist/vue-responsive-dash.umd.js.map b/dist/vue-responsive-dash.umd.js.map
diff --git a/dist/vue-responsive-dash.umd.min.js b/dist/vue-responsive-dash.umd.min.js
diff --git a/dist/vue-responsive-dash.umd.min.js.map b/dist/vue-responsive-dash.umd.min.js.map
diff --git a/docs/api/README.md b/docs/api/README.md
@@ -65,6 +65,8 @@ There are also slots around the item for custom drag icons (again see examples)
 | resizeHandleSize | `Number` |  false |  `8` | The area where resize can be selected on the item |
 | draggableZIndex | `Number` | false | `1` | The zIndex applied to the draggable area to make sure it is above the items in the slot |
 | resizableZIndex | `Number` | false | `1` | The zIndex applied to each resizeable area to make sure it is above the items in the main slot |
+| moveHold | `Number` | false | `0` | The amount of time in ms required to hold the item before it can be moved |
+| resizeHold | `Number` | false | `0` | The amount of time in ms required to hold the item before it can be resized |
 
 ### Events
 | Name | Description |

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue-responsive-dash",
-  "version": "0.3.30",
+  "version": "0.4.00",
   "keywords": [
     "vuejs",
     "vue",
@@ -38,6 +38,7 @@
   },
   "license": "MIT",
   "devDependencies": {
+    "@interactjs/types": "^1.9.14",
     "@types/jest": "^25.2.1",
     "@vue/cli-plugin-babel": "^4.3.1",
     "@vue/cli-plugin-eslint": "^4.3.1",
@@ -64,8 +65,10 @@
     "vue": "^2.6.11"
   },
   "dependencies": {
+    "@interactjs/actions": "^1.9.14",
+    "@interactjs/auto-start": "^1.9.14",
+    "@interactjs/interact": "^1.9.14",
     "ste-simple-events": "^1.6.11",
-    "vue-displace": "^0.2.7",
     "vue-element-resize-detector": "^1.0.6"
   }
 }
diff --git a/src/App.vue b/src/App.vue
@@ -25,6 +25,7 @@
           :resizable="resizable"
           :draggable="draggable"
           :maxWidth="3"
+          :moveHold="moveHold"
         >
           <div class="content">{{ JSON.stringify(item, null, 2) }}</div>
         </Dash-Item>
@@ -53,6 +54,7 @@
     <button @click="enableRowHeightLimits = !enableRowHeightLimits">
       Toggle Row Height Limits ({{ enableRowHeightLimits }})
     </button>
+    <input type="number" min="0" max="5000" v-model.number="moveHold" />
   </div>
 </template>
 
@@ -73,6 +75,7 @@ export default {
       compact: true,
       draggable: true,
       resizable: true,
+      moveHold: 0,
       margin: { x: 20, y: 20 },
       layouts: [
         {