Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-01-22 14:39:45 -05:00
Code Issues Activity

➕ Add React-DnD dependency bundle.

Browse source
This commit is contained in:
Andrey Antukh 2019-08-08 16:24:29 +02:00
parent fcc7351552
commit dbf754880e
10 changed files with 4309 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
frontend/src/uxbox/main/ui/workspace/sortable.cljs Normal file
View file

@ -0,0 +1,36 @@
;; This Source Code Form is subject to the terms of the Mozilla Public
;; License, v. 2.0. If a copy of the MPL was not distributed with this
;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
;;
;; Copyright (c) 2019 Andrey Antukh <niwi@niwi.nz>
(ns uxbox.main.ui.workspace.sortable
"A sortable React Hook implementation."
(:require
[rumext.alpha :as mf]
[rumext.util :as mfu]
[uxbox.util.rdnd :as rdnd]))
;; --- Page Item
(defn use-sortable
[{:keys [type data on-hover on-drop]
:or {on-hover (constantly nil)
on-drop (constantly nil)}
:as options}]
(let [ref (mf/use-ref* nil)
[_, drop] (rdnd/useDrop
#js {:accept type
:hover (fn [item monitor]
(when (.-current ref)
(on-hover (unchecked-get item "data") monitor)))
:drop (fn [item monitor]
(when (.-current ref)
(on-drop (unchecked-get item "data") monitor)))})
[props, drag] (rdnd/useDrag
#js {:item #js {:type type :data data}
:collect (fn [monitor]
#js {:dragging? (.isDragging monitor)})})]
[(mfu/obj->map props)
(drag (drop ref))]))

14
frontend/src/uxbox/util/rdnd.cljs Normal file
View file

@ -0,0 +1,14 @@
;; This Source Code Form is subject to the terms of the Mozilla Public
;; License, v. 2.0. If a copy of the MPL was not distributed with this
;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
;;
;; Copyright (c) 2019 Andrey Antukh <niwi@niwi.nz>
(ns uxbox.util.rdnd
(:require [vendor.react-dnd]))
(def useDrop js/ReactDnd.useDrop)
(def useDrag js/ReactDnd.useDrag)
(def provider js/ReactDnd.DndProvider)
(def html5 js/ReactDnd.HTML5Backend)

7
frontend/vendor/deps.cljs vendored
View file

@ -11,9 +11,14 @@
{:file "react-color/react-color.bundle.js"
:file-min "react-color/react-color.bundle.min.js"
:requires ["cljsjs.react"]
:provides ["vendor.react-color"]}]
:provides ["vendor.react-color"]}
{:file "react-dnd/react-dnd.bundle.js"
:file-min "react-dnd/react-dnd.bundle.min.js"
:requires ["cljsjs.react"]
:provides ["vendor.react-dnd"]}]
:externs ["main.externs.js"
"snapsvg/externs.js"
"jszip/externs.js"
"react-color/externs.js"
"react-dnd/externs.js"
"datefns/externs.js"]}

108
frontend/vendor/package-lock.json generated vendored
View file

@ -952,18 +952,51 @@
"resolved": "https://registry.npmjs.org/@icons/material/-/material-0.2.4.tgz",
"integrity": "sha512-QPcGmICAPbGLGb6F/yNf/KzKqvFx8z5qx3D1yFqVAjoFmXK35EgyW+cJ57Te3CNsmzblwtzakLGFqHPqrfb4Tw=="
},
"@types/asap": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/@types/asap/-/asap-2.0.0.tgz",
"integrity": "sha512-upIS0Gt9Mc8eEpCbYMZ1K8rhNosfKUtimNcINce+zLwJF5UpM3Vv7yz3S5l/1IX+DxTa8lTkUjqynvjRXyJzsg=="
},
"@types/estree": {
"version": "0.0.39",
"resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.39.tgz",
"integrity": "sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==",
"dev": true
},
"@types/hoist-non-react-statics": {
"version": "3.3.1",
"resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz",
"integrity": "sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA==",
"requires": {
"@types/react": "*",
"hoist-non-react-statics": "^3.3.0"
}
},
"@types/invariant": {
"version": "2.2.30",
"resolved": "https://registry.npmjs.org/@types/invariant/-/invariant-2.2.30.tgz",
"integrity": "sha512-98fB+yo7imSD2F7PF7GIpELNgtLNgo5wjivu0W5V4jx+KVVJxo6p/qN4zdzSTBWy4/sN3pPyXwnhRSD28QX+ag=="
},
"@types/node": {
"version": "12.6.8",
"resolved": "https://registry.npmjs.org/@types/node/-/node-12.6.8.tgz",
"integrity": "sha512-aX+gFgA5GHcDi89KG5keey2zf0WfZk/HAQotEamsK2kbey+8yGKcson0hbK8E+v0NArlCJQCqMP161YhV6ZXLg==",
"dev": true
},
"@types/prop-types": {
"version": "15.7.1",
"resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.1.tgz",
"integrity": "sha512-CFzn9idOEpHrgdw8JsoTkaDDyRWk1jrzIV8djzcgpq0y9tG4B4lFT+Nxh52DVpDXV+n4+NPNv7M1Dj5uMp6XFg=="
},
"@types/react": {
"version": "16.8.25",
"resolved": "https://registry.npmjs.org/@types/react/-/react-16.8.25.tgz",
"integrity": "sha512-ydAAkLnNTC4oYSxJ3zwK/4QcVmEecACJ4ZdxXITbxz/dhahBSDKY6OQ1uawAW6rE/7kfHccxulYLSAIZVrSq0A==",
"requires": {
"@types/prop-types": "*",
"csstype": "^2.2.0"
}
},
"@types/resolve": {
"version": "0.0.8",
"resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.8.tgz",
@ -973,6 +1006,11 @@
"@types/node": "*"
}
},
"@types/shallowequal": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/@types/shallowequal/-/shallowequal-1.1.1.tgz",
"integrity": "sha512-Lhni3aX80zbpdxRuWhnuYPm8j8UQaa571lHP/xI4W+7BAFhSIhRReXnqjEgT/XzPoXZTJkCqstFMJ8CZTK6IlQ=="
},
"abstract-leveldown": {
"version": "0.12.4",
"resolved": "https://registry.npmjs.org/abstract-leveldown/-/abstract-leveldown-0.12.4.tgz",
@ -1056,6 +1094,11 @@
"dev": true,
"optional": true
},
"asap": {
"version": "2.0.6",
"resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
"integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY="
},
"asn1.js": {
"version": "4.10.1",
"resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.10.1.tgz",
@ -1623,6 +1666,11 @@
"randomfill": "^1.0.3"
}
},
"csstype": {
"version": "2.6.6",
"resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.6.tgz",
"integrity": "sha512-RpFbQGUE74iyPgvr46U9t1xoQBM8T4BL8SxrN66Le2xYAPSaDJJKeztV3awugusb3g3G9iL8StmkBBXhcbbXhg=="
},
"date-fns": {
"version": "1.30.1",
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-1.30.1.tgz",
@ -1729,6 +1777,18 @@
"randombytes": "^2.0.0"
}
},
"dnd-core": {
"version": "9.3.4",
"resolved": "https://registry.npmjs.org/dnd-core/-/dnd-core-9.3.4.tgz",
"integrity": "sha512-sDzBiGXgpj9bQhs8gtPWFIKMg4WY8ywI9RI81rRAUWI4oNj/Sm/ztjS67UjCvMa+fWoQ2WNIV3U9oDqeBN0+2g==",
"requires": {
"@types/asap": "^2.0.0",
"@types/invariant": "^2.2.30",
"asap": "^2.0.6",
"invariant": "^2.2.4",
"redux": "^4.0.1"
}
},
"electron-to-chromium": {
"version": "1.3.207",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.207.tgz",
@ -2707,6 +2767,14 @@
"minimalistic-crypto-utils": "^1.0.1"
}
},
"hoist-non-react-statics": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.0.tgz",
"integrity": "sha512-0XsbTXxgiaCDYDIWFcwkmerZPSwywfUqYmwT4jzewKTQSWoE6FCMoUVOeBJWK3E/CrWbxRG3m5GzY4lnIwGRBA==",
"requires": {
"react-is": "^16.7.0"
}
},
"idb-wrapper": {
"version": "1.7.2",
"resolved": "https://registry.npmjs.org/idb-wrapper/-/idb-wrapper-1.7.2.tgz",
@ -2739,7 +2807,6 @@
"version": "2.2.4",
"resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
"integrity": "sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==",
"dev": true,
"requires": {
"loose-envify": "^1.0.0"
}
@ -3639,6 +3706,26 @@
"tinycolor2": "^1.4.1"
}
},
"react-dnd": {
"version": "9.3.4",
"resolved": "https://registry.npmjs.org/react-dnd/-/react-dnd-9.3.4.tgz",
"integrity": "sha512-UUtyoHFRrryMxVMEGYa3EdZIdibnys/ax7ZRs6CKpETHlnJQOFhHE3rpI+ManvKS0o3MFc1DZ+aoudAFtrOvFA==",
"requires": {
"@types/hoist-non-react-statics": "^3.3.1",
"@types/shallowequal": "^1.1.1",
"dnd-core": "^9.3.4",
"hoist-non-react-statics": "^3.3.0",
"shallowequal": "^1.1.0"
}
},
"react-dnd-html5-backend": {
"version": "9.3.4",
"resolved": "https://registry.npmjs.org/react-dnd-html5-backend/-/react-dnd-html5-backend-9.3.4.tgz",
"integrity": "sha512-s+Xu0j7fHV9bLMSaOCuX76baQKcZfycAx0EzDmkxcFXPBiiFlI8l6rzwURdSJCjNcvLYXd8MLb4VkSNSq5ISZQ==",
"requires": {
"dnd-core": "^9.3.4"
}
},
"react-is": {
"version": "16.8.6",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.8.6.tgz",
@ -3679,6 +3766,15 @@
"readable-stream": "^2.0.2"
}
},
"redux": {
"version": "4.0.4",
"resolved": "https://registry.npmjs.org/redux/-/redux-4.0.4.tgz",
"integrity": "sha512-vKv4WdiJxOWKxK0yRoaK3Y4pxxB0ilzVx6dszU2W8wLxlb2yikRph4iV/ymtdJ6ZxpBLFbyrxklnT5yBbQSl3Q==",
"requires": {
"loose-envify": "^1.4.0",
"symbol-observable": "^1.2.0"
}
},
"regenerate": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.0.tgz",
@ -3973,6 +4069,11 @@
"safe-buffer": "^5.0.1"
}
},
"shallowequal": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz",
"integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ=="
},
"slash": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz",
@ -4212,6 +4313,11 @@
"has-flag": "^3.0.0"
}
},
"symbol-observable": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.2.0.tgz",
"integrity": "sha512-e900nM8RRtGhlV36KGEU9k65K3mPb1WV70OdjfxlG2EAuM1noi/E/BaW/uMhL7bPEssK8QV57vN3esixjUvcXQ=="
},
"terser": {
"version": "4.1.2",
"resolved": "https://registry.npmjs.org/terser/-/terser-4.1.2.tgz",

5
frontend/vendor/package.json vendored
View file

@ -7,7 +7,8 @@
"build": "NODE_ENV=production rollup -c",
"minify:react-color": "terser react-color/react-color.bundle.js -c -m -o react-color/react-color.bundle.min.js",
"minify:datefns": "terser datefns/datefns.bundle.js -c -m -o datefns/datefns.bundle.min.js",
"dist": "npm run build && npm run minify:react-color && npm run minify:datefns"
"minify:react-dnd": "terser react-dnd/react-dnd.bundle.js -c -m -o react-dnd/react-dnd.bundle.min.js",
"dist": "npm run build && npm run minify:react-color && npm run minify:datefns && npm run minify:react-dnd"
},
"author": "",
"license": "MPL2",
@ -29,6 +30,8 @@
"dependencies": {
"date-fns": "^1.30.1",
"react-color": "^2.17.3",
"react-dnd": "^9.3.4",
"react-dnd-html5-backend": "^9.3.4",
"snapsvg": "^0.5.1"
}
}

5
frontend/vendor/react-dnd/externs.js vendored Normal file
View file

@ -0,0 +1,5 @@
var ReactDnd = {};
ReactDnd.useDrag = function() {};
ReactDnd.useDrop = function() {};
ReactDnd.DndProvider = function() {};
ReactDnd.HTML5Backend = function() {};

4106
frontend/vendor/react-dnd/react-dnd.bundle.js vendored Normal file
View file

File diff suppressed because it is too large Load diff

1
frontend/vendor/react-dnd/react-dnd.bundle.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

18
frontend/vendor/react-dnd/react-dnd.js vendored Normal file
View file

@ -0,0 +1,18 @@
import { useDrag, useDrop } from "react-dnd/dist/esm/hooks";
import { DndProvider } from "react-dnd/dist/esm/common";
import HTML5Backend from "react-dnd-html5-backend";
if (typeof self !== "undefined") { init(self); }
else if (typeof global !== "undefined") { init(global); }
else if (typeof window !== "undefined") { init(window); }
else { throw new Error("unsupported execution environment"); }
function init(g) {
g.ReactDnd = {
useDrag,
useDrop,
DndProvider,
HTML5Backend
};
}

12
frontend/vendor/rollup.config.js vendored
View file

@ -40,6 +40,18 @@ export default [{
format: 'iife',
},
plugins: plugins
}, {
input: "./react-dnd/react-dnd.js",
external: ["react"],
output: {
globals: {
"react": "React",
},
compact: true,
file: './react-dnd/react-dnd.bundle.js',
format: 'iife',
},
plugins: plugins
}, {
input: "./datefns/datefns.js",
output: {