fan-standard-comp 3.1.9 → 3.2.0

package/es/StandardDragModal/DraggableModalInner.js

@@ -0,0 +1,114 @@
+import "antd/es/modal/style";
+import _Modal from "antd/es/modal";
+import { __rest } from "tslib";
+import * as React from 'react';
+import { useEffect, useMemo, useCallback, memo } from 'react';
+import { ResizeHandle } from './ResizeHandle';
+import { useDrag } from './useDrag';
+import { usePrevious } from './usePrevious';
+import { useResize } from './useResize';
+var modalStyle = {
+  margin: 0,
+  paddingBottom: 0,
+  pointerEvents: 'auto'
+};
+function DraggableModalInnerNonMemo(_a) {
+  var id = _a.id,
+    modalState = _a.modalState,
+    dispatch = _a.dispatch,
+    visible = _a.visible,
+    children = _a.children,
+    title = _a.title,
+    initialWidth = _a.initialWidth,
+    initialHeight = _a.initialHeight,
+    otherProps = __rest(_a, ["id", "modalState", "dispatch", "visible", "children", "title", "initialWidth", "initialHeight"]); // Call on mount and unmount.
+  useEffect(function () {
+    dispatch({
+      type: 'mount',
+      id: id,
+      intialState: {
+        initialWidth: initialWidth,
+        initialHeight: initialHeight
+      }
+    });
+    return function () {
+      return dispatch({
+        type: 'unmount',
+        id: id
+      });
+    };
+  }, [dispatch, id, initialWidth, initialHeight]);
+  // Bring this to the front if it's been opened with props.
+  var visiblePrevious = usePrevious(visible);
+  useEffect(function () {
+    if (visible !== visiblePrevious) {
+      if (visible) {
+        dispatch({
+          type: 'show',
+          id: id
+        });
+      } else {
+        dispatch({
+          type: 'hide',
+          id: id
+        });
+      }
+    }
+  }, [visible, visiblePrevious, id, dispatch]);
+  var zIndex = modalState.zIndex,
+    x = modalState.x,
+    y = modalState.y,
+    width = modalState.width,
+    height = modalState.height;
+  var style = useMemo(function () {
+    return Object.assign(Object.assign({}, modalStyle), {
+      top: y,
+      left: x,
+      height: height
+    });
+  }, [y, x, height]);
+  var onFocus = useCallback(function () {
+    return dispatch({
+      type: 'focus',
+      id: id
+    });
+  }, [id, dispatch]);
+  var onDragWithID = useCallback(function (args) {
+    return dispatch(Object.assign({
+      type: 'drag',
+      id: id
+    }, args));
+  }, [dispatch, id]);
+  var onResizeWithID = useCallback(function (args) {
+    return dispatch(Object.assign({
+      type: 'resize',
+      id: id
+    }, args));
+  }, [dispatch, id]);
+  var onMouseDrag = useDrag(x, y, onDragWithID);
+  var onMouseResize = useResize(x, y, width, height, onResizeWithID);
+  var titleElement = useMemo(function () {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "ant-design-draggable-modal-title",
+      onMouseDown: onMouseDrag,
+      onClick: onFocus
+    }, title);
+  }, [onMouseDrag, onFocus, title]);
+  return /*#__PURE__*/React.createElement(_Modal, Object.assign({
+    wrapClassName: "ant-design-draggable-modal",
+    style: style,
+    width: width,
+    destroyOnClose: true,
+    mask: false,
+    maskClosable: false,
+    zIndex: zIndex,
+    title: titleElement,
+    open: visible
+  }, otherProps), children, /*#__PURE__*/React.createElement(ResizeHandle, {
+    onMouseDown: onMouseResize
+  }));
+}
+export var DraggableModalInner = /*#__PURE__*/memo(DraggableModalInnerNonMemo);
+if (process.env.NODE_ENV !== 'production') {
+  DraggableModalInner.displayName = 'DraggableModalInner';
+}

package/es/StandardDragModal/DraggableModalProvider.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+export declare const DraggableModalProvider: ({ children, }: {
+    children: React.ReactNode;
+}) => React.ReactElement;

package/es/StandardDragModal/DraggableModalProvider.js

@@ -0,0 +1,40 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0) { ; } } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import * as React from 'react';
+import { useEffect, useReducer } from 'react';
+import { DraggableModalContext } from './DraggableModalContext';
+import { getWindowSize } from './getWindowSize';
+import { draggableModalReducer, initialModalsState } from './draggableModalReducer';
+export var DraggableModalProvider = function DraggableModalProvider(_ref) {
+  var children = _ref.children;
+  var _useReducer = useReducer(draggableModalReducer, initialModalsState),
+    _useReducer2 = _slicedToArray(_useReducer, 2),
+    state = _useReducer2[0],
+    dispatch = _useReducer2[1];
+  useEffect(function () {
+    var onResize = function onResize() {
+      return dispatch({
+        type: 'windowResize',
+        size: getWindowSize()
+      });
+    };
+    if ((typeof window === "undefined" ? "undefined" : _typeof(window)) === 'object') {
+      window.addEventListener('resize', onResize);
+      onResize();
+    }
+    return function () {
+      (typeof window === "undefined" ? "undefined" : _typeof(window)) === 'object' && window.removeEventListener('resize', onResize);
+    };
+  }, [dispatch]);
+  return /*#__PURE__*/React.createElement(DraggableModalContext.Provider, {
+    value: {
+      state: state,
+      dispatch: dispatch
+    }
+  }, children);
+};

package/es/StandardDragModal/Modal.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import './index.less';
+interface StandardDragModalProps {
+    visible: boolean;
+    title?: string | React.ReactNode;
+    initialWidth?: number;
+    initialHeight?: number;
+    [k: string]: any;
+}
+declare const StandardDragModal: (props: StandardDragModalProps) => JSX.Element;
+export default StandardDragModal;

package/es/StandardDragModal/Modal.js

@@ -0,0 +1,24 @@
+import { __rest } from "tslib";
+import React from 'react';
+import { DraggableModal, DraggableModalProvider } from './index';
+import './index.less';
+var StandardDragModal = function StandardDragModal(props) {
+  var visible = props.visible,
+    onCancel = props.onCancel,
+    onSubmit = props.onSubmit,
+    children = props.children,
+    others = __rest(props, ["visible", "onCancel", "onSubmit", "children"]);
+  var handleOk = function handleOk() {
+    onSubmit && onSubmit();
+  };
+  var handleCancel = function handleCancel() {
+    onCancel && onCancel();
+  };
+  return /*#__PURE__*/React.createElement(DraggableModalProvider, null, /*#__PURE__*/React.createElement(DraggableModal, Object.assign({
+    visible: visible,
+    onOk: handleOk,
+    onCancel: handleCancel,
+    zIndex: 1001
+  }, others), children));
+};
+export default StandardDragModal;

package/es/StandardDragModal/ResizeHandle.d.ts

@@ -0,0 +1,2 @@
+import * as React from 'react';
+export declare const ResizeHandle: (props: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>) => React.ReactElement;

package/es/StandardDragModal/ResizeHandle.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+export var ResizeHandle = function ResizeHandle(props) {
+  return /*#__PURE__*/React.createElement("div", Object.assign({
+    className: "ant-design-draggable-modal-resize-handle"
+  }, props), /*#__PURE__*/React.createElement("div", {
+    className: "ant-design-draggable-modal-resize-handle-inner"
+  }));
+};

package/es/StandardDragModal/clamp.d.ts

@@ -0,0 +1 @@
+export declare const clamp: (min: number, max: number, value: number) => number;

package/es/StandardDragModal/clamp.js

@@ -0,0 +1,3 @@
+export var clamp = function clamp(min, max, value) {
+  return Math.max(min, Math.min(max, value));
+};

package/es/StandardDragModal/draggableModalReducer.d.ts

@@ -0,0 +1,66 @@
+export declare type ModalID = string;
+export interface ModalState {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    zIndex: number;
+    visible: boolean;
+}
+export interface ModalsState {
+    maxZIndex: number;
+    windowSize: {
+        width: number;
+        height: number;
+    };
+    modals: {
+        [key: string]: ModalState;
+    };
+}
+export declare const initialModalsState: ModalsState;
+export declare const initialModalState: ModalState;
+export declare type Action = {
+    type: 'show';
+    id: ModalID;
+} | {
+    type: 'hide';
+    id: ModalID;
+} | {
+    type: 'focus';
+    id: ModalID;
+} | {
+    type: 'unmount';
+    id: ModalID;
+} | {
+    type: 'mount';
+    id: ModalID;
+    intialState: {
+        initialWidth?: number;
+        initialHeight?: number;
+    };
+} | {
+    type: 'windowResize';
+    size: {
+        width: number;
+        height: number;
+    };
+} | {
+    type: 'drag';
+    id: ModalID;
+    x: number;
+    y: number;
+} | {
+    type: 'resize';
+    id: ModalID;
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+};
+export declare const getModalState: ({ state, id, initialWidth, initialHeight, }: {
+    state: ModalsState;
+    id: ModalID;
+    initialWidth?: number;
+    initialHeight?: number;
+}) => ModalState;
+export declare const draggableModalReducer: (state: ModalsState, action: Action) => ModalsState;

package/es/StandardDragModal/draggableModalReducer.js

@@ -0,0 +1,157 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+import { getWindowSize } from './getWindowSize';
+import { clamp } from './clamp';
+var mapObject = function mapObject(o, f) {
+  return Object.assign.apply(Object, [{}].concat(_toConsumableArray(Object.keys(o).map(function (k) {
+    return _defineProperty({}, k, f(o[k]));
+  }))));
+};
+export var initialModalsState = {
+  maxZIndex: 0,
+  windowSize: getWindowSize(),
+  modals: {}
+};
+export var initialModalState = {
+  x: 0,
+  y: 0,
+  width: 800,
+  height: 800,
+  zIndex: 0,
+  visible: false
+};
+var getInitialModalState = function getInitialModalState(_ref2) {
+  var _ref2$initialWidth = _ref2.initialWidth,
+    initialWidth = _ref2$initialWidth === void 0 ? initialModalState.width : _ref2$initialWidth,
+    _ref2$initialHeight = _ref2.initialHeight,
+    initialHeight = _ref2$initialHeight === void 0 ? initialModalState.height : _ref2$initialHeight;
+  return Object.assign(Object.assign({}, initialModalState), {
+    width: initialWidth,
+    height: initialHeight
+  });
+};
+export var getModalState = function getModalState(_ref3) {
+  var state = _ref3.state,
+    id = _ref3.id,
+    initialWidth = _ref3.initialWidth,
+    initialHeight = _ref3.initialHeight;
+  return state.modals[id] || getInitialModalState({
+    initialWidth: initialWidth,
+    initialHeight: initialHeight
+  });
+};
+var getNextZIndex = function getNextZIndex(state, id) {
+  return getModalState({
+    state: state,
+    id: id
+  }).zIndex === state.maxZIndex ? state.maxZIndex : state.maxZIndex + 1;
+};
+var clampDrag = function clampDrag(windowWidth, windowHeight, x, y, width, height) {
+  var maxX = windowWidth - width;
+  var maxY = windowHeight - height;
+  var clampedX = clamp(0, maxX, x);
+  var clampedY = clamp(0, maxY, y);
+  return {
+    x: clampedX,
+    y: clampedY
+  };
+};
+var clampResize = function clampResize(windowWidth, windowHeight, x, y, width, height) {
+  var maxWidth = windowWidth - x;
+  var maxHeight = windowHeight - y;
+  var clampedWidth = clamp(200, maxWidth, width);
+  var clampedHeight = clamp(200, maxHeight, height);
+  return {
+    width: clampedWidth,
+    height: clampedHeight
+  };
+};
+export var draggableModalReducer = function draggableModalReducer(state, action) {
+  switch (action.type) {
+    case 'resize':
+      var size = clampResize(state.windowSize.width, state.windowSize.height, action.x, action.y, action.width, action.height);
+      return Object.assign(Object.assign({}, state), {
+        maxZIndex: getNextZIndex(state, action.id),
+        modals: Object.assign(Object.assign({}, state.modals), _defineProperty({}, action.id, Object.assign(Object.assign(Object.assign({}, state.modals[action.id]), size), {
+          zIndex: getNextZIndex(state, action.id)
+        })))
+      });
+    case 'drag':
+      return Object.assign(Object.assign({}, state), {
+        maxZIndex: getNextZIndex(state, action.id),
+        modals: Object.assign(Object.assign({}, state.modals), _defineProperty({}, action.id, Object.assign(Object.assign(Object.assign({}, state.modals[action.id]), clampDrag(state.windowSize.width, state.windowSize.height, action.x, action.y, state.modals[action.id].width, state.modals[action.id].height)), {
+          zIndex: getNextZIndex(state, action.id)
+        })))
+      });
+    case 'show':
+      {
+        var _modalState = state.modals[action.id];
+        var centerX = state.windowSize.width / 2 - _modalState.width / 2;
+        var centerY = state.windowSize.height / 2 - _modalState.height / 2;
+        var position = clampDrag(state.windowSize.width, state.windowSize.height, centerX, centerY, _modalState.width, _modalState.height);
+        var _size = clampResize(state.windowSize.width, state.windowSize.height, position.x, position.y, _modalState.width, _modalState.height);
+        return Object.assign(Object.assign({}, state), {
+          maxZIndex: state.maxZIndex + 1,
+          modals: Object.assign(Object.assign({}, state.modals), _defineProperty({}, action.id, Object.assign(Object.assign(Object.assign(Object.assign({}, _modalState), position), _size), {
+            zIndex: state.maxZIndex + 1,
+            visible: true
+          })))
+        });
+      }
+    case 'focus':
+      var modalState = state.modals[action.id];
+      return Object.assign(Object.assign({}, state), {
+        maxZIndex: state.maxZIndex + 1,
+        modals: Object.assign(Object.assign({}, state.modals), _defineProperty({}, action.id, Object.assign(Object.assign({}, modalState), {
+          zIndex: state.maxZIndex + 1
+        })))
+      });
+    case 'hide':
+      {
+        var _modalState2 = state.modals[action.id];
+        return Object.assign(Object.assign({}, state), {
+          modals: Object.assign(Object.assign({}, state.modals), _defineProperty({}, action.id, Object.assign(Object.assign({}, _modalState2), {
+            visible: false
+          })))
+        });
+      }
+    case 'mount':
+      var initialState = getInitialModalState(action.intialState);
+      return Object.assign(Object.assign({}, state), {
+        maxZIndex: state.maxZIndex + 1,
+        modals: Object.assign(Object.assign({}, state.modals), _defineProperty({}, action.id, Object.assign(Object.assign({}, initialState), {
+          x: state.windowSize.width / 2 - initialState.width / 2,
+          y: state.windowSize.height / 2 - initialState.height / 2,
+          zIndex: state.maxZIndex + 1
+        })))
+      });
+    case 'unmount':
+      var modalsClone = Object.assign({}, state.modals);
+      delete modalsClone[action.id];
+      return Object.assign(Object.assign({}, state), {
+        modals: modalsClone
+      });
+    case 'windowResize':
+      return Object.assign(Object.assign({}, state), {
+        windowSize: action.size,
+        modals: mapObject(state.modals, function (modalState) {
+          if (!modalState.visible) {
+            return modalState;
+          }
+          var position = clampDrag(state.windowSize.width, state.windowSize.height, modalState.x, modalState.y, modalState.width, modalState.height);
+          var size = clampResize(state.windowSize.width, state.windowSize.height, position.x, position.y, modalState.width, modalState.height);
+          return Object.assign(Object.assign(Object.assign({}, modalState), position), size);
+        })
+      });
+    default:
+      throw new Error();
+  }
+};

package/es/StandardDragModal/getWindowSize.d.ts

@@ -0,0 +1,4 @@
+export declare const getWindowSize: () => {
+    width: number;
+    height: number;
+};

package/es/StandardDragModal/getWindowSize.js

@@ -0,0 +1,6 @@
+export var getWindowSize = function getWindowSize() {
+  return {
+    width: window.innerWidth || 0,
+    height: window.innerHeight || 0
+  };
+};

package/es/StandardDragModal/index.d.ts

@@ -1,11 +1,3 @@
-import React from 'react';
-import 'ant-design-draggable-modal/dist/index.css';
-interface StandardDragModalProps {
-    visible: boolean;
-    title?: string | React.ReactNode;
-    initialWidth?: number;
-    initialHeight?: number;
-    [k: string]: any;
-}
-declare const StandardDragModal: (props: StandardDragModalProps) => JSX.Element;
-export default StandardDragModal;
+export * from './DraggableModal';
+export * from './DraggableModalContext';
+export * from './DraggableModalProvider';

package/es/StandardDragModal/index.js

@@ -1,30 +1,3 @@
-import { __rest } from "tslib";
-import React from 'react';
-import { DraggableModal, DraggableModalProvider } from 'ant-design-draggable-modal';
-import 'ant-design-draggable-modal/dist/index.css';
-
-var StandardDragModal = function StandardDragModal(props) {
-  var visible = props.visible,
-      onCancel = props.onCancel,
-      onSubmit = props.onSubmit,
-      children = props.children,
-      others = __rest(props, ["visible", "onCancel", "onSubmit", "children"]);
-
-  var handleOk = function handleOk() {
-    onSubmit && onSubmit();
-  };
-
-  var handleCancel = function handleCancel() {
-    onCancel && onCancel();
-  };
-
-  return /*#__PURE__*/React.createElement(DraggableModalProvider, null, /*#__PURE__*/React.createElement(DraggableModal, Object.assign({
-    visible: visible,
-    onOk: handleOk,
-    onCancel: handleCancel
-  }, others, {
-    zIndex: 1001
-  }), children));
-};
-
-export default StandardDragModal;
+export * from './DraggableModal';
+export * from './DraggableModalContext';
+export * from './DraggableModalProvider';

package/es/StandardDragModal/index.less

@@ -0,0 +1,65 @@
+/**
+ * NOTE: This is not compiled.
+ */
+
+.ant-design-draggable-modal {
+    pointer-events: none;
+    overflow: hidden !important;
+}
+
+.ant-design-draggable-modal .ant-modal {
+    display: flex;
+    max-width: none;
+    transform-origin: 50% 50% !important;
+}
+
+.ant-design-draggable-modal .ant-modal-content {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+}
+
+.ant-design-draggable-modal .ant-modal-header {
+    flex: 0;
+    padding: 0;
+}
+
+.ant-design-draggable-modal .ant-modal-footer {
+    flex: 0;
+    padding: 16px;
+}
+
+.ant-design-draggable-modal .ant-design-draggable-modal-title {
+    cursor: move;
+    padding: 16px;
+}
+
+.ant-design-draggable-modal .ant-design-draggable-modal-title::before {
+    content: '\00a0';
+}
+
+.ant-design-draggable-modal .ant-modal-body {
+    flex: 1;
+    overflow-y: auto;
+    padding: 16px;
+}
+
+.ant-design-draggable-modal-resize-handle-inner {
+    width: 12px;
+    right: 14px;
+    border: 2px solid grey;
+    height: 12px;
+    bottom: 14px;
+    position: absolute;
+    border-top: 0;
+    border-left: 0;
+}
+
+.ant-design-draggable-modal-resize-handle {
+    right: -10px;
+    width: 44px;
+    bottom: -10px;
+    cursor: se-resize;
+    height: 44px;
+    position: absolute;
+}

package/es/StandardDragModal/useDrag.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+export declare const useDrag: (x: number, y: number, onDrag: (args: {
+    x: number;
+    y: number;
+}) => void) => (e: React.MouseEvent) => void;

package/es/StandardDragModal/useDrag.js

@@ -0,0 +1,66 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0) { ; } } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { useState, useEffect, useCallback } from 'react';
+export var useDrag = function useDrag(x, y, onDrag) {
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    dragging = _useState2[0],
+    setDragging = _useState2[1];
+  var _useState3 = useState({
+      initX: 0,
+      initY: 0,
+      mouseDownX: 0,
+      mouseDownY: 0
+    }),
+    _useState4 = _slicedToArray(_useState3, 2),
+    initialDragState = _useState4[0],
+    setInitialDragState = _useState4[1];
+  var onMouseDown = useCallback(function (e) {
+    e.preventDefault();
+    setInitialDragState({
+      initX: x,
+      initY: y,
+      mouseDownX: e.clientX,
+      mouseDownY: e.clientY
+    });
+    setDragging(true);
+  }, [x, y, setDragging, setInitialDragState]);
+  useEffect(function () {
+    var onMouseMove = function onMouseMove(e) {
+      if (dragging) {
+        var initX = initialDragState.initX,
+          mouseDownX = initialDragState.mouseDownX,
+          initY = initialDragState.initY,
+          mouseDownY = initialDragState.mouseDownY;
+        var dx = e.clientX - mouseDownX;
+        var dy = e.clientY - mouseDownY;
+        var _x = initX + dx;
+        var _y = initY + dy;
+        onDrag({
+          x: _x,
+          y: _y
+        });
+      }
+    };
+    window.addEventListener('mousemove', onMouseMove, {
+      passive: true
+    });
+    return function () {
+      return window.removeEventListener('mousemove', onMouseMove);
+    };
+  }, [initialDragState, dragging, onDrag]);
+  useEffect(function () {
+    var onMouseUp = function onMouseUp() {
+      setDragging(false);
+    };
+    window.addEventListener('mouseup', onMouseUp);
+    return function () {
+      return window.removeEventListener('mouseup', onMouseUp);
+    };
+  }, [setDragging]);
+  return onMouseDown;
+};

package/es/StandardDragModal/usePrevious.d.ts

@@ -0,0 +1 @@
+export declare const usePrevious: <T>(value: T) => T;

package/es/StandardDragModal/usePrevious.js

@@ -0,0 +1,8 @@
+import { useRef, useEffect } from 'react';
+export var usePrevious = function usePrevious(value) {
+  var ref = useRef(value);
+  useEffect(function () {
+    ref.current = value;
+  }, [value]);
+  return ref.current;
+};

package/es/StandardDragModal/useResize.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export declare const useResize: (x: number, y: number, width: number, height: number, onResize: (args: {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}) => void) => (e: React.MouseEvent) => void;