first commit

frontend/node_modules/@rc-component/portal/es/Context.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+export declare type QueueCreate = (appendFunc: VoidFunction) => void;
+declare const OrderContext: React.Context<QueueCreate>;
+export default OrderContext;

frontend/node_modules/@rc-component/portal/es/Context.js

@@ -0,0 +1,3 @@
+import * as React from 'react';
+var OrderContext = /*#__PURE__*/React.createContext(null);
+export default OrderContext;

frontend/node_modules/@rc-component/portal/es/Portal.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+export declare type ContainerType = Element | DocumentFragment;
+export declare type GetContainer = string | ContainerType | (() => ContainerType) | false;
+export interface PortalProps {
+    /** Customize container element. Default will create a div in document.body when `open` */
+    getContainer?: GetContainer;
+    children?: React.ReactNode;
+    /** Show the portal children */
+    open?: boolean;
+    /** Remove `children` when `open` is `false`. Set `false` will not handle remove process */
+    autoDestroy?: boolean;
+    /** Lock screen scroll when open */
+    autoLock?: boolean;
+    /** @private debug name. Do not use in prod */
+    debug?: string;
+}
+declare const Portal: React.ForwardRefExoticComponent<PortalProps & React.RefAttributes<any>>;
+export default Portal;

frontend/node_modules/@rc-component/portal/es/Portal.js

@@ -0,0 +1,104 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import { createPortal } from 'react-dom';
+import canUseDom from "rc-util/es/Dom/canUseDom";
+import warning from "rc-util/es/warning";
+import { supportRef, useComposeRef } from "rc-util/es/ref";
+import OrderContext from "./Context";
+import useDom from "./useDom";
+import useScrollLocker from "./useScrollLocker";
+import { inlineMock } from "./mock";
+var getPortalContainer = function getPortalContainer(getContainer) {
+  if (getContainer === false) {
+    return false;
+  }
+  if (!canUseDom() || !getContainer) {
+    return null;
+  }
+  if (typeof getContainer === 'string') {
+    return document.querySelector(getContainer);
+  }
+  if (typeof getContainer === 'function') {
+    return getContainer();
+  }
+  return getContainer;
+};
+var Portal = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var open = props.open,
+    autoLock = props.autoLock,
+    getContainer = props.getContainer,
+    debug = props.debug,
+    _props$autoDestroy = props.autoDestroy,
+    autoDestroy = _props$autoDestroy === void 0 ? true : _props$autoDestroy,
+    children = props.children;
+  var _React$useState = React.useState(open),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    shouldRender = _React$useState2[0],
+    setShouldRender = _React$useState2[1];
+  var mergedRender = shouldRender || open;
+
+  // ========================= Warning =========================
+  if (process.env.NODE_ENV !== 'production') {
+    warning(canUseDom() || !open, "Portal only work in client side. Please call 'useEffect' to show Portal instead default render in SSR.");
+  }
+
+  // ====================== Should Render ======================
+  React.useEffect(function () {
+    if (autoDestroy || open) {
+      setShouldRender(open);
+    }
+  }, [open, autoDestroy]);
+
+  // ======================== Container ========================
+  var _React$useState3 = React.useState(function () {
+      return getPortalContainer(getContainer);
+    }),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    innerContainer = _React$useState4[0],
+    setInnerContainer = _React$useState4[1];
+  React.useEffect(function () {
+    var customizeContainer = getPortalContainer(getContainer);
+
+    // Tell component that we check this in effect which is safe to be `null`
+    setInnerContainer(customizeContainer !== null && customizeContainer !== void 0 ? customizeContainer : null);
+  });
+  var _useDom = useDom(mergedRender && !innerContainer, debug),
+    _useDom2 = _slicedToArray(_useDom, 2),
+    defaultContainer = _useDom2[0],
+    queueCreate = _useDom2[1];
+  var mergedContainer = innerContainer !== null && innerContainer !== void 0 ? innerContainer : defaultContainer;
+
+  // ========================= Locker ==========================
+  useScrollLocker(autoLock && open && canUseDom() && (mergedContainer === defaultContainer || mergedContainer === document.body));
+
+  // =========================== Ref ===========================
+  var childRef = null;
+  if (children && supportRef(children) && ref) {
+    var _ref = children;
+    childRef = _ref.ref;
+  }
+  var mergedRef = useComposeRef(childRef, ref);
+
+  // ========================= Render ==========================
+  // Do not render when nothing need render
+  // When innerContainer is `undefined`, it may not ready since user use ref in the same render
+  if (!mergedRender || !canUseDom() || innerContainer === undefined) {
+    return null;
+  }
+
+  // Render inline
+  var renderInline = mergedContainer === false || inlineMock();
+  var reffedChildren = children;
+  if (ref) {
+    reffedChildren = /*#__PURE__*/React.cloneElement(children, {
+      ref: mergedRef
+    });
+  }
+  return /*#__PURE__*/React.createElement(OrderContext.Provider, {
+    value: queueCreate
+  }, renderInline ? reffedChildren : /*#__PURE__*/createPortal(reffedChildren, mergedContainer));
+});
+if (process.env.NODE_ENV !== 'production') {
+  Portal.displayName = 'Portal';
+}
+export default Portal;

frontend/node_modules/@rc-component/portal/es/index.d.ts

@@ -0,0 +1,6 @@
+import Portal from './Portal';
+import type { PortalProps } from './Portal';
+import { inlineMock } from './mock';
+export type { PortalProps };
+export { inlineMock };
+export default Portal;

frontend/node_modules/@rc-component/portal/es/index.js

@@ -0,0 +1,4 @@
+import Portal from "./Portal";
+import { inlineMock } from "./mock";
+export { inlineMock };
+export default Portal;

frontend/node_modules/@rc-component/portal/es/mock.d.ts

@@ -0,0 +1,2 @@
+export declare let inline: boolean;
+export declare function inlineMock(nextInline?: boolean): boolean;

frontend/node_modules/@rc-component/portal/es/mock.js

@@ -0,0 +1,7 @@
+export var inline = false;
+export function inlineMock(nextInline) {
+  if (typeof nextInline === 'boolean') {
+    inline = nextInline;
+  }
+  return inline;
+}

frontend/node_modules/@rc-component/portal/es/useDom.d.ts

@@ -0,0 +1,6 @@
+import type { QueueCreate } from './Context';
+/**
+ * Will add `div` to document. Nest call will keep order
+ * @param render Render DOM in document
+ */
+export default function useDom(render: boolean, debug?: string): [HTMLDivElement, QueueCreate];

frontend/node_modules/@rc-component/portal/es/useDom.js

@@ -0,0 +1,74 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
+import canUseDom from "rc-util/es/Dom/canUseDom";
+import OrderContext from "./Context";
+var EMPTY_LIST = [];
+
+/**
+ * Will add `div` to document. Nest call will keep order
+ * @param render Render DOM in document
+ */
+export default function useDom(render, debug) {
+  var _React$useState = React.useState(function () {
+      if (!canUseDom()) {
+        return null;
+      }
+      var defaultEle = document.createElement('div');
+      if (process.env.NODE_ENV !== 'production' && debug) {
+        defaultEle.setAttribute('data-debug', debug);
+      }
+      return defaultEle;
+    }),
+    _React$useState2 = _slicedToArray(_React$useState, 1),
+    ele = _React$useState2[0];
+
+  // ========================== Order ==========================
+  var appendedRef = React.useRef(false);
+  var queueCreate = React.useContext(OrderContext);
+  var _React$useState3 = React.useState(EMPTY_LIST),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    queue = _React$useState4[0],
+    setQueue = _React$useState4[1];
+  var mergedQueueCreate = queueCreate || (appendedRef.current ? undefined : function (appendFn) {
+    setQueue(function (origin) {
+      var newQueue = [appendFn].concat(_toConsumableArray(origin));
+      return newQueue;
+    });
+  });
+
+  // =========================== DOM ===========================
+  function append() {
+    if (!ele.parentElement) {
+      document.body.appendChild(ele);
+    }
+    appendedRef.current = true;
+  }
+  function cleanup() {
+    var _ele$parentElement;
+    (_ele$parentElement = ele.parentElement) === null || _ele$parentElement === void 0 ? void 0 : _ele$parentElement.removeChild(ele);
+    appendedRef.current = false;
+  }
+  useLayoutEffect(function () {
+    if (render) {
+      if (queueCreate) {
+        queueCreate(append);
+      } else {
+        append();
+      }
+    } else {
+      cleanup();
+    }
+    return cleanup;
+  }, [render]);
+  useLayoutEffect(function () {
+    if (queue.length) {
+      queue.forEach(function (appendFn) {
+        return appendFn();
+      });
+      setQueue(EMPTY_LIST);
+    }
+  }, [queue]);
+  return [ele, mergedQueueCreate];
+}

frontend/node_modules/@rc-component/portal/es/useScrollLocker.d.ts

@@ -0,0 +1 @@
+export default function useScrollLocker(lock?: boolean): void;

frontend/node_modules/@rc-component/portal/es/useScrollLocker.js

@@ -0,0 +1,29 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import { updateCSS, removeCSS } from "rc-util/es/Dom/dynamicCSS";
+import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
+import { getTargetScrollBarSize } from "rc-util/es/getScrollBarSize";
+import { isBodyOverflowing } from "./util";
+var UNIQUE_ID = "rc-util-locker-".concat(Date.now());
+var uuid = 0;
+export default function useScrollLocker(lock) {
+  var mergedLock = !!lock;
+  var _React$useState = React.useState(function () {
+      uuid += 1;
+      return "".concat(UNIQUE_ID, "_").concat(uuid);
+    }),
+    _React$useState2 = _slicedToArray(_React$useState, 1),
+    id = _React$useState2[0];
+  useLayoutEffect(function () {
+    if (mergedLock) {
+      var scrollbarSize = getTargetScrollBarSize(document.body).width;
+      var isOverflow = isBodyOverflowing();
+      updateCSS("\nhtml body {\n  overflow-y: hidden;\n  ".concat(isOverflow ? "width: calc(100% - ".concat(scrollbarSize, "px);") : '', "\n}"), id);
+    } else {
+      removeCSS(id);
+    }
+    return function () {
+      removeCSS(id);
+    };
+  }, [mergedLock, id]);
+}

frontend/node_modules/@rc-component/portal/es/util.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Test usage export. Do not use in your production
+ */
+export declare function isBodyOverflowing(): boolean;

frontend/node_modules/@rc-component/portal/es/util.js

@@ -0,0 +1,6 @@
+/**
+ * Test usage export. Do not use in your production
+ */
+export function isBodyOverflowing() {
+  return document.body.scrollHeight > (window.innerHeight || document.documentElement.clientHeight) && window.innerWidth > document.body.offsetWidth;
+}