cozy-ui 127.3.0 → 127.5.0

package/transpiled/react/utils/Dnd/CustomDrag/DragPreviewWrapper.js

@@ -0,0 +1,63 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import React, { useEffect, useState } from 'react';
+import DragPreview from "cozy-ui/transpiled/react/utils/Dnd/CustomDrag/DragPreview";
+
+var makeStyles = function makeStyles(_ref) {
+  var x = _ref.x,
+      y = _ref.y;
+
+  if (!x || !y) {
+    return {
+      display: 'none'
+    };
+  }
+
+  var transform = "translate(".concat(x, "px, ").concat(y, "px)");
+  return {
+    transform: transform,
+    WebkitTransform: transform
+  };
+};
+
+var DragPreviewWrapper = function DragPreviewWrapper(_ref2) {
+  var item = _ref2.item,
+      itemType = _ref2.itemType,
+      dragId = _ref2.dragId,
+      initialOffset = _ref2.initialOffset,
+      currentOffset = _ref2.currentOffset;
+
+  var _useState = useState({
+    x: null,
+    y: null
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      mousePosition = _useState2[0],
+      setMousePosition = _useState2[1];
+
+  useEffect(function () {
+    var handleMouseMove = function handleMouseMove(e) {
+      setMousePosition({
+        x: e.clientX,
+        y: e.clientY
+      });
+    };
+
+    window.addEventListener('dragover', handleMouseMove);
+    return function () {
+      window.removeEventListener('dragover', handleMouseMove);
+    };
+  }, []);
+
+  if (!initialOffset || !currentOffset || itemType !== dragId) {
+    return null;
+  }
+
+  return /*#__PURE__*/React.createElement("div", {
+    style: makeStyles(mousePosition)
+  }, /*#__PURE__*/React.createElement(DragPreview, {
+    fileName: item.draggedItems[0].name,
+    selectedCount: item.draggedItems.length
+  }));
+};
+
+export default DragPreviewWrapper;

package/transpiled/react/utils/Dnd/DnDConfigWrapper.d.ts

@@ -0,0 +1,2 @@
+export default DnDConfigWrapper;
+declare const DnDConfigWrapper: import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>;

package/transpiled/react/utils/Dnd/DnDConfigWrapper.js

@@ -0,0 +1,55 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import { forwardRef, useEffect, useState } from 'react';
+import { useDragDropManager } from 'react-dnd';
+var DnDConfigWrapper = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var children = _ref.children;
+  var dragDropManager = useDragDropManager();
+  var monitor = dragDropManager.getMonitor();
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      isDragging = _useState2[0],
+      setIsDragging = _useState2[1];
+
+  useEffect(function () {
+    var unsubscribe = monitor.subscribeToStateChange(function () {
+      setIsDragging(monitor.isDragging());
+    });
+    return function () {
+      return unsubscribe();
+    };
+  }, [monitor]);
+  useEffect(function () {
+    if (!isDragging) return;
+    var scrollThreshold = 100;
+    var scrollMaxSpeed = 75;
+    var intervalId = setInterval(function () {
+      var offset = monitor.getClientOffset();
+      var container = ref.current;
+      if (!offset || !container) return;
+
+      var _container$getBoundin = container.getBoundingClientRect(),
+          top = _container$getBoundin.top,
+          bottom = _container$getBoundin.bottom;
+
+      var distanceToTop = offset.y - top;
+      var distanceToBottom = bottom - offset.y;
+
+      if (distanceToTop < scrollThreshold) {
+        var speed = scrollMaxSpeed * (1 - distanceToTop / scrollThreshold);
+        container.scrollBy(0, -speed);
+      } else if (distanceToBottom < scrollThreshold) {
+        var _speed = scrollMaxSpeed * (1 - distanceToBottom / scrollThreshold);
+
+        container.scrollBy(0, _speed);
+      }
+    }, 16); // ~60fps
+
+    return function () {
+      return clearInterval(intervalId);
+    };
+  }, [isDragging, monitor, ref]);
+  return children;
+});
+DnDConfigWrapper.displayName = 'DnDConfigWrapper';
+export default DnDConfigWrapper;