first commit

frontend/node_modules/@rc-component/tour/es/Mask.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { PosInfo } from './hooks/useTarget';
+export interface MaskProps {
+    prefixCls?: string;
+    pos: PosInfo;
+    rootClassName?: string;
+    showMask?: boolean;
+    style?: React.CSSProperties;
+    fill?: string;
+    open?: boolean;
+    animated?: boolean | {
+        placeholder: boolean;
+    };
+    zIndex?: number;
+    disabledInteraction?: boolean;
+}
+declare const Mask: (props: MaskProps) => React.JSX.Element;
+export default Mask;

frontend/node_modules/@rc-component/tour/es/Mask.js

@@ -0,0 +1,99 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import React from 'react';
+import classNames from 'classnames';
+import Portal from '@rc-component/portal';
+import useId from "rc-util/es/hooks/useId";
+var COVER_PROPS = {
+  fill: 'transparent',
+  pointerEvents: 'auto'
+};
+var Mask = function Mask(props) {
+  var prefixCls = props.prefixCls,
+    rootClassName = props.rootClassName,
+    pos = props.pos,
+    showMask = props.showMask,
+    _props$style = props.style,
+    style = _props$style === void 0 ? {} : _props$style,
+    _props$fill = props.fill,
+    fill = _props$fill === void 0 ? "rgba(0,0,0,0.5)" : _props$fill,
+    open = props.open,
+    animated = props.animated,
+    zIndex = props.zIndex,
+    disabledInteraction = props.disabledInteraction;
+  var id = useId();
+  var maskId = "".concat(prefixCls, "-mask-").concat(id);
+  var mergedAnimated = _typeof(animated) === 'object' ? animated === null || animated === void 0 ? void 0 : animated.placeholder : animated;
+  var isSafari = typeof navigator !== 'undefined' && /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
+  var maskRectSize = isSafari ? {
+    width: '100%',
+    height: '100%'
+  } : {
+    width: '100vw',
+    height: '100vh'
+  };
+  return /*#__PURE__*/React.createElement(Portal, {
+    open: open,
+    autoLock: true
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames("".concat(prefixCls, "-mask"), rootClassName),
+    style: _objectSpread({
+      position: 'fixed',
+      left: 0,
+      right: 0,
+      top: 0,
+      bottom: 0,
+      zIndex: zIndex,
+      pointerEvents: pos && !disabledInteraction ? 'none' : 'auto'
+    }, style)
+  }, showMask ? /*#__PURE__*/React.createElement("svg", {
+    style: {
+      width: '100%',
+      height: '100%'
+    }
+  }, /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("mask", {
+    id: maskId
+  }, /*#__PURE__*/React.createElement("rect", _extends({
+    x: "0",
+    y: "0"
+  }, maskRectSize, {
+    fill: "white"
+  })), pos && /*#__PURE__*/React.createElement("rect", {
+    x: pos.left,
+    y: pos.top,
+    rx: pos.radius,
+    width: pos.width,
+    height: pos.height,
+    fill: "black",
+    className: mergedAnimated ? "".concat(prefixCls, "-placeholder-animated") : ''
+  }))), /*#__PURE__*/React.createElement("rect", {
+    x: "0",
+    y: "0",
+    width: "100%",
+    height: "100%",
+    fill: fill,
+    mask: "url(#".concat(maskId, ")")
+  }), pos && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("rect", _extends({}, COVER_PROPS, {
+    x: "0",
+    y: "0",
+    width: "100%",
+    height: pos.top
+  })), /*#__PURE__*/React.createElement("rect", _extends({}, COVER_PROPS, {
+    x: "0",
+    y: "0",
+    width: pos.left,
+    height: "100%"
+  })), /*#__PURE__*/React.createElement("rect", _extends({}, COVER_PROPS, {
+    x: "0",
+    y: pos.top + pos.height,
+    width: "100%",
+    height: "calc(100vh - ".concat(pos.top + pos.height, "px)")
+  })), /*#__PURE__*/React.createElement("rect", _extends({}, COVER_PROPS, {
+    x: pos.left + pos.width,
+    y: "0",
+    width: "calc(100vw - ".concat(pos.left + pos.width, "px)"),
+    height: "100%"
+  })))) : null));
+};
+export default Mask;

frontend/node_modules/@rc-component/tour/es/Tour.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import type { TourProps } from './interface';
+export type { TourProps };
+declare const Tour: React.FC<TourProps>;
+export default Tour;

frontend/node_modules/@rc-component/tour/es/Tour.js

@@ -0,0 +1,209 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["prefixCls", "steps", "defaultCurrent", "current", "onChange", "onClose", "onFinish", "open", "mask", "arrow", "rootClassName", "placement", "renderPanel", "gap", "animated", "scrollIntoViewOptions", "zIndex", "closeIcon", "closable", "builtinPlacements", "disabledInteraction"];
+import * as React from 'react';
+import Portal from '@rc-component/portal';
+import Trigger from '@rc-component/trigger';
+import classNames from 'classnames';
+import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
+import useMergedState from "rc-util/es/hooks/useMergedState";
+import { useMemo } from 'react';
+import { useClosable } from "./hooks/useClosable";
+import useTarget from "./hooks/useTarget";
+import Mask from "./Mask";
+import { getPlacements } from "./placements";
+import TourStep from "./TourStep";
+import { getPlacement } from "./util";
+var CENTER_PLACEHOLDER = {
+  left: '50%',
+  top: '50%',
+  width: 1,
+  height: 1
+};
+var defaultScrollIntoViewOptions = {
+  block: 'center',
+  inline: 'center'
+};
+var Tour = function Tour(props) {
+  var _props$prefixCls = props.prefixCls,
+    prefixCls = _props$prefixCls === void 0 ? 'rc-tour' : _props$prefixCls,
+    _props$steps = props.steps,
+    steps = _props$steps === void 0 ? [] : _props$steps,
+    defaultCurrent = props.defaultCurrent,
+    current = props.current,
+    onChange = props.onChange,
+    onClose = props.onClose,
+    _onFinish = props.onFinish,
+    open = props.open,
+    _props$mask = props.mask,
+    mask = _props$mask === void 0 ? true : _props$mask,
+    _props$arrow = props.arrow,
+    arrow = _props$arrow === void 0 ? true : _props$arrow,
+    rootClassName = props.rootClassName,
+    placement = props.placement,
+    renderPanel = props.renderPanel,
+    gap = props.gap,
+    animated = props.animated,
+    _props$scrollIntoView = props.scrollIntoViewOptions,
+    scrollIntoViewOptions = _props$scrollIntoView === void 0 ? defaultScrollIntoViewOptions : _props$scrollIntoView,
+    _props$zIndex = props.zIndex,
+    zIndex = _props$zIndex === void 0 ? 1001 : _props$zIndex,
+    closeIcon = props.closeIcon,
+    closable = props.closable,
+    builtinPlacements = props.builtinPlacements,
+    disabledInteraction = props.disabledInteraction,
+    restProps = _objectWithoutProperties(props, _excluded);
+  var triggerRef = React.useRef();
+  var _useMergedState = useMergedState(0, {
+      value: current,
+      defaultValue: defaultCurrent
+    }),
+    _useMergedState2 = _slicedToArray(_useMergedState, 2),
+    mergedCurrent = _useMergedState2[0],
+    setMergedCurrent = _useMergedState2[1];
+  var _useMergedState3 = useMergedState(undefined, {
+      value: open,
+      postState: function postState(origin) {
+        return mergedCurrent < 0 || mergedCurrent >= steps.length ? false : origin !== null && origin !== void 0 ? origin : true;
+      }
+    }),
+    _useMergedState4 = _slicedToArray(_useMergedState3, 2),
+    mergedOpen = _useMergedState4[0],
+    setMergedOpen = _useMergedState4[1];
+
+  // Record if already rended in the DOM to avoid `findDOMNode` issue
+  var _React$useState = React.useState(mergedOpen),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    hasOpened = _React$useState2[0],
+    setHasOpened = _React$useState2[1];
+  var openRef = React.useRef(mergedOpen);
+  useLayoutEffect(function () {
+    if (mergedOpen) {
+      if (!openRef.current) {
+        setMergedCurrent(0);
+      }
+      setHasOpened(true);
+    }
+    openRef.current = mergedOpen;
+  }, [mergedOpen]);
+  var _ref = steps[mergedCurrent] || {},
+    target = _ref.target,
+    stepPlacement = _ref.placement,
+    stepStyle = _ref.style,
+    stepArrow = _ref.arrow,
+    stepClassName = _ref.className,
+    stepMask = _ref.mask,
+    _ref$scrollIntoViewOp = _ref.scrollIntoViewOptions,
+    stepScrollIntoViewOptions = _ref$scrollIntoViewOp === void 0 ? defaultScrollIntoViewOptions : _ref$scrollIntoViewOp,
+    stepCloseIcon = _ref.closeIcon,
+    stepClosable = _ref.closable;
+  var mergedClosable = useClosable(stepClosable, stepCloseIcon, closable, closeIcon);
+  var mergedMask = mergedOpen && (stepMask !== null && stepMask !== void 0 ? stepMask : mask);
+  var mergedScrollIntoViewOptions = stepScrollIntoViewOptions !== null && stepScrollIntoViewOptions !== void 0 ? stepScrollIntoViewOptions : scrollIntoViewOptions;
+  var _useTarget = useTarget(target, open, gap, mergedScrollIntoViewOptions),
+    _useTarget2 = _slicedToArray(_useTarget, 2),
+    posInfo = _useTarget2[0],
+    targetElement = _useTarget2[1];
+  var mergedPlacement = getPlacement(targetElement, placement, stepPlacement);
+
+  // ========================= arrow =========================
+  var mergedArrow = targetElement ? typeof stepArrow === 'undefined' ? arrow : stepArrow : false;
+  var arrowPointAtCenter = _typeof(mergedArrow) === 'object' ? mergedArrow.pointAtCenter : false;
+  useLayoutEffect(function () {
+    var _triggerRef$current;
+    (_triggerRef$current = triggerRef.current) === null || _triggerRef$current === void 0 ? void 0 : _triggerRef$current.forceAlign();
+  }, [arrowPointAtCenter, mergedCurrent]);
+
+  // ========================= Change =========================
+  var onInternalChange = function onInternalChange(nextCurrent) {
+    setMergedCurrent(nextCurrent);
+    onChange === null || onChange === void 0 ? void 0 : onChange(nextCurrent);
+  };
+  var mergedBuiltinPlacements = useMemo(function () {
+    if (builtinPlacements) {
+      return typeof builtinPlacements === 'function' ? builtinPlacements({
+        arrowPointAtCenter: arrowPointAtCenter
+      }) : builtinPlacements;
+    }
+    return getPlacements(arrowPointAtCenter);
+  }, [builtinPlacements, arrowPointAtCenter]);
+
+  // ========================= Render =========================
+  // Skip if not init yet
+  if (targetElement === undefined || !hasOpened) {
+    return null;
+  }
+  var handleClose = function handleClose() {
+    setMergedOpen(false);
+    onClose === null || onClose === void 0 ? void 0 : onClose(mergedCurrent);
+  };
+  var getPopupElement = function getPopupElement() {
+    return /*#__PURE__*/React.createElement(TourStep, _extends({
+      arrow: mergedArrow,
+      key: "content",
+      prefixCls: prefixCls,
+      total: steps.length,
+      renderPanel: renderPanel,
+      onPrev: function onPrev() {
+        onInternalChange(mergedCurrent - 1);
+      },
+      onNext: function onNext() {
+        onInternalChange(mergedCurrent + 1);
+      },
+      onClose: handleClose,
+      current: mergedCurrent,
+      onFinish: function onFinish() {
+        handleClose();
+        _onFinish === null || _onFinish === void 0 ? void 0 : _onFinish();
+      }
+    }, steps[mergedCurrent], {
+      closable: mergedClosable
+    }));
+  };
+  var mergedShowMask = typeof mergedMask === 'boolean' ? mergedMask : !!mergedMask;
+  var mergedMaskStyle = typeof mergedMask === 'boolean' ? undefined : mergedMask;
+
+  // when targetElement is not exist, use body as triggerDOMNode
+  var getTriggerDOMNode = function getTriggerDOMNode(node) {
+    return node || targetElement || document.body;
+  };
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Mask, {
+    zIndex: zIndex,
+    prefixCls: prefixCls,
+    pos: posInfo,
+    showMask: mergedShowMask,
+    style: mergedMaskStyle === null || mergedMaskStyle === void 0 ? void 0 : mergedMaskStyle.style,
+    fill: mergedMaskStyle === null || mergedMaskStyle === void 0 ? void 0 : mergedMaskStyle.color,
+    open: mergedOpen,
+    animated: animated,
+    rootClassName: rootClassName,
+    disabledInteraction: disabledInteraction
+  }), /*#__PURE__*/React.createElement(Trigger, _extends({}, restProps, {
+    builtinPlacements: mergedBuiltinPlacements,
+    ref: triggerRef,
+    popupStyle: stepStyle,
+    popupPlacement: mergedPlacement,
+    popupVisible: mergedOpen,
+    popupClassName: classNames(rootClassName, stepClassName),
+    prefixCls: prefixCls,
+    popup: getPopupElement,
+    forceRender: false,
+    destroyPopupOnHide: true,
+    zIndex: zIndex,
+    getTriggerDOMNode: getTriggerDOMNode,
+    arrow: !!mergedArrow
+  }), /*#__PURE__*/React.createElement(Portal, {
+    open: mergedOpen,
+    autoLock: true
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames(rootClassName, "".concat(prefixCls, "-target-placeholder")),
+    style: _objectSpread(_objectSpread({}, posInfo || CENTER_PLACEHOLDER), {}, {
+      position: 'fixed',
+      pointerEvents: 'none'
+    })
+  }))));
+};
+export default Tour;

frontend/node_modules/@rc-component/tour/es/TourStep/DefaultPanel.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import type { TourStepProps } from '../interface';
+export type DefaultPanelProps = Exclude<TourStepProps, "closable"> & {
+    closable: Exclude<TourStepProps["closable"], boolean>;
+};
+export default function DefaultPanel(props: DefaultPanelProps): React.JSX.Element;

frontend/node_modules/@rc-component/tour/es/TourStep/DefaultPanel.js

@@ -0,0 +1,63 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import classNames from 'classnames';
+import pickAttrs from "rc-util/es/pickAttrs";
+export default function DefaultPanel(props) {
+  var _closable$closeIcon;
+  var prefixCls = props.prefixCls,
+    current = props.current,
+    total = props.total,
+    title = props.title,
+    description = props.description,
+    onClose = props.onClose,
+    onPrev = props.onPrev,
+    onNext = props.onNext,
+    onFinish = props.onFinish,
+    className = props.className,
+    closable = props.closable;
+  var ariaProps = pickAttrs(closable || {}, true);
+  var closeIcon = (_closable$closeIcon = closable === null || closable === void 0 ? void 0 : closable.closeIcon) !== null && _closable$closeIcon !== void 0 ? _closable$closeIcon : /*#__PURE__*/React.createElement("span", {
+    className: "".concat(prefixCls, "-close-x")
+  }, "\xD7");
+  var mergedClosable = !!closable;
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames("".concat(prefixCls, "-content"), className)
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-inner")
+  }, mergedClosable && /*#__PURE__*/React.createElement("button", _extends({
+    type: "button",
+    onClick: onClose,
+    "aria-label": "Close"
+  }, ariaProps, {
+    className: "".concat(prefixCls, "-close")
+  }), closeIcon), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-header")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-title")
+  }, title)), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-description")
+  }, description), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-footer")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-sliders")
+  }, total > 1 ? _toConsumableArray(Array.from({
+    length: total
+  }).keys()).map(function (item, index) {
+    return /*#__PURE__*/React.createElement("span", {
+      key: item,
+      className: index === current ? 'active' : ''
+    });
+  }) : null), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-buttons")
+  }, current !== 0 ? /*#__PURE__*/React.createElement("button", {
+    className: "".concat(prefixCls, "-prev-btn"),
+    onClick: onPrev
+  }, "Prev") : null, current === total - 1 ? /*#__PURE__*/React.createElement("button", {
+    className: "".concat(prefixCls, "-finish-btn"),
+    onClick: onFinish
+  }, "Finish") : /*#__PURE__*/React.createElement("button", {
+    className: "".concat(prefixCls, "-next-btn"),
+    onClick: onNext
+  }, "Next")))));
+}

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

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import { type DefaultPanelProps } from './DefaultPanel';
+import type { TourStepProps, TourStepInfo } from '../interface';
+export type { TourStepProps, TourStepInfo, };
+declare const TourStep: (props: DefaultPanelProps) => React.JSX.Element;
+export default TourStep;

frontend/node_modules/@rc-component/tour/es/TourStep/index.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import DefaultPanel from "./DefaultPanel";
+var TourStep = function TourStep(props) {
+  var current = props.current,
+    renderPanel = props.renderPanel;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, typeof renderPanel === 'function' ? renderPanel(props, current) : /*#__PURE__*/React.createElement(DefaultPanel, props));
+};
+export default TourStep;

frontend/node_modules/@rc-component/tour/es/hooks/useClosable.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import type { TourProps } from '../interface';
+import type { TourStepInfo } from '../TourStep';
+export declare function useClosable(stepClosable: TourStepInfo['closable'], stepCloseIcon: TourStepInfo['closeIcon'], closable: TourProps['closable'], closeIcon: TourProps['closeIcon']): {
+    closeIcon?: React.ReactNode;
+} & React.AriaAttributes;

frontend/node_modules/@rc-component/tour/es/hooks/useClosable.js

@@ -0,0 +1,37 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import * as React from 'react';
+function isConfigObj(closable) {
+  return closable !== null && _typeof(closable) === 'object';
+}
+/**
+ * Convert `closable` to ClosableConfig.
+ * When `preset` is true, will auto fill ClosableConfig with default value.
+ */
+function getClosableConfig(closable, closeIcon, preset) {
+  if (closable === false || closeIcon === false && (!isConfigObj(closable) || !closable.closeIcon)) {
+    return null;
+  }
+  var mergedCloseIcon = typeof closeIcon !== 'boolean' ? closeIcon : undefined;
+  if (isConfigObj(closable)) {
+    var _closable$closeIcon;
+    return _objectSpread(_objectSpread({}, closable), {}, {
+      closeIcon: (_closable$closeIcon = closable.closeIcon) !== null && _closable$closeIcon !== void 0 ? _closable$closeIcon : mergedCloseIcon
+    });
+  }
+
+  // When StepClosable no need auto fill, but RootClosable need this.
+  return preset || closable || closeIcon ? {
+    closeIcon: mergedCloseIcon
+  } : 'empty';
+}
+export function useClosable(stepClosable, stepCloseIcon, closable, closeIcon) {
+  return React.useMemo(function () {
+    var stepClosableConfig = getClosableConfig(stepClosable, stepCloseIcon, false);
+    var rootClosableConfig = getClosableConfig(closable, closeIcon, true);
+    if (stepClosableConfig !== 'empty') {
+      return stepClosableConfig;
+    }
+    return rootClosableConfig;
+  }, [closable, closeIcon, stepClosable, stepCloseIcon]);
+}

frontend/node_modules/@rc-component/tour/es/hooks/useTarget.d.ts

@@ -0,0 +1,13 @@
+import type { TourStepInfo } from '..';
+export interface Gap {
+    offset?: number | [number, number];
+    radius?: number;
+}
+export interface PosInfo {
+    left: number;
+    top: number;
+    height: number;
+    width: number;
+    radius: number;
+}
+export default function useTarget(target: TourStepInfo['target'], open: boolean, gap?: Gap, scrollIntoViewOptions?: boolean | ScrollIntoViewOptions): [PosInfo, HTMLElement];

frontend/node_modules/@rc-component/tour/es/hooks/useTarget.js

@@ -0,0 +1,86 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import useEvent from "rc-util/es/hooks/useEvent";
+import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
+import { useMemo, useState } from 'react';
+import { isInViewPort } from "../util";
+function isValidNumber(val) {
+  return typeof val === 'number' && !Number.isNaN(val);
+}
+export default function useTarget(target, open, gap, scrollIntoViewOptions) {
+  // ========================= Target =========================
+  // We trade `undefined` as not get target by function yet.
+  // `null` as empty target.
+  var _useState = useState(undefined),
+    _useState2 = _slicedToArray(_useState, 2),
+    targetElement = _useState2[0],
+    setTargetElement = _useState2[1];
+  useLayoutEffect(function () {
+    var nextElement = typeof target === 'function' ? target() : target;
+    setTargetElement(nextElement || null);
+  });
+
+  // ========================= Align ==========================
+  var _useState3 = useState(null),
+    _useState4 = _slicedToArray(_useState3, 2),
+    posInfo = _useState4[0],
+    setPosInfo = _useState4[1];
+  var updatePos = useEvent(function () {
+    if (targetElement) {
+      // Exist target element. We should scroll and get target position
+      if (!isInViewPort(targetElement) && open) {
+        targetElement.scrollIntoView(scrollIntoViewOptions);
+      }
+      var _targetElement$getBou = targetElement.getBoundingClientRect(),
+        left = _targetElement$getBou.left,
+        top = _targetElement$getBou.top,
+        width = _targetElement$getBou.width,
+        height = _targetElement$getBou.height;
+      var nextPosInfo = {
+        left: left,
+        top: top,
+        width: width,
+        height: height,
+        radius: 0
+      };
+      setPosInfo(function (origin) {
+        if (JSON.stringify(origin) !== JSON.stringify(nextPosInfo)) {
+          return nextPosInfo;
+        }
+        return origin;
+      });
+    } else {
+      // Not exist target which means we just show in center
+      setPosInfo(null);
+    }
+  });
+  var getGapOffset = function getGapOffset(index) {
+    var _ref;
+    return (_ref = Array.isArray(gap === null || gap === void 0 ? void 0 : gap.offset) ? gap === null || gap === void 0 ? void 0 : gap.offset[index] : gap === null || gap === void 0 ? void 0 : gap.offset) !== null && _ref !== void 0 ? _ref : 6;
+  };
+  useLayoutEffect(function () {
+    updatePos();
+    // update when window resize
+    window.addEventListener('resize', updatePos);
+    return function () {
+      window.removeEventListener('resize', updatePos);
+    };
+  }, [targetElement, open, updatePos]);
+
+  // ======================== PosInfo =========================
+  var mergedPosInfo = useMemo(function () {
+    if (!posInfo) {
+      return posInfo;
+    }
+    var gapOffsetX = getGapOffset(0);
+    var gapOffsetY = getGapOffset(1);
+    var gapRadius = isValidNumber(gap === null || gap === void 0 ? void 0 : gap.radius) ? gap === null || gap === void 0 ? void 0 : gap.radius : 2;
+    return {
+      left: posInfo.left - gapOffsetX,
+      top: posInfo.top - gapOffsetY,
+      width: posInfo.width + gapOffsetX * 2,
+      height: posInfo.height + gapOffsetY * 2,
+      radius: gapRadius
+    };
+  }, [posInfo, gap]);
+  return [mergedPosInfo, targetElement];
+}

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

@@ -0,0 +1,3 @@
+import Tour from './Tour';
+export type { TourProps, TourStepInfo, TourStepProps } from './interface';
+export default Tour;

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

@@ -0,0 +1,2 @@
+import Tour from "./Tour";
+export default Tour;

frontend/node_modules/@rc-component/tour/es/interface.d.ts

@@ -0,0 +1,68 @@
+import type { TriggerProps } from '@rc-component/trigger';
+import type { PlacementType } from './placements';
+import type { CSSProperties, ReactNode } from 'react';
+import type { Gap } from './hooks/useTarget';
+import { type DefaultPanelProps } from './TourStep/DefaultPanel';
+export interface TourStepInfo {
+    arrow?: boolean | {
+        pointAtCenter: boolean;
+    };
+    target?: HTMLElement | (() => HTMLElement) | null | (() => null);
+    title: ReactNode;
+    description?: ReactNode;
+    placement?: PlacementType;
+    mask?: boolean | {
+        style?: React.CSSProperties;
+        color?: string;
+    };
+    className?: string;
+    style?: CSSProperties;
+    scrollIntoViewOptions?: boolean | ScrollIntoViewOptions;
+    closeIcon?: ReactNode;
+    closable?: boolean | ({
+        closeIcon?: ReactNode;
+    } & React.AriaAttributes);
+}
+export interface TourStepProps extends TourStepInfo {
+    prefixCls?: string;
+    total?: number;
+    current?: number;
+    onClose?: () => void;
+    onFinish?: () => void;
+    renderPanel?: (step: TourStepProps, current: number) => ReactNode;
+    onPrev?: () => void;
+    onNext?: () => void;
+}
+export interface TourProps extends Pick<TriggerProps, 'onPopupAlign'> {
+    steps?: TourStepInfo[];
+    open?: boolean;
+    defaultCurrent?: number;
+    current?: number;
+    onChange?: (current: number) => void;
+    onClose?: (current: number) => void;
+    onFinish?: () => void;
+    closeIcon?: TourStepProps['closeIcon'];
+    closable?: TourStepProps['closable'];
+    mask?: boolean | {
+        style?: React.CSSProperties;
+        color?: string;
+    };
+    arrow?: boolean | {
+        pointAtCenter: boolean;
+    };
+    rootClassName?: string;
+    placement?: PlacementType;
+    prefixCls?: string;
+    renderPanel?: (props: DefaultPanelProps, current: number) => ReactNode;
+    gap?: Gap;
+    animated?: boolean | {
+        placeholder: boolean;
+    };
+    scrollIntoViewOptions?: boolean | ScrollIntoViewOptions;
+    zIndex?: number;
+    getPopupContainer?: TriggerProps['getPopupContainer'];
+    builtinPlacements?: TriggerProps['builtinPlacements'] | ((config?: {
+        arrowPointAtCenter?: boolean;
+    }) => TriggerProps['builtinPlacements']);
+    disabledInteraction?: boolean;
+}

frontend/node_modules/@rc-component/tour/es/interface.js

@@ -0,0 +1 @@
+export {};

frontend/node_modules/@rc-component/tour/es/placements.d.ts

@@ -0,0 +1,4 @@
+import type { BuildInPlacements } from '@rc-component/trigger';
+export type PlacementType = 'left' | 'leftTop' | 'leftBottom' | 'right' | 'rightTop' | 'rightBottom' | 'top' | 'topLeft' | 'topRight' | 'bottom' | 'bottomLeft' | 'bottomRight' | 'center';
+export declare function getPlacements(arrowPointAtCenter?: boolean): BuildInPlacements;
+export declare const placements: BuildInPlacements;

frontend/node_modules/@rc-component/tour/es/placements.js

@@ -0,0 +1,68 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+var autoAdjustOverflow = {
+  adjustX: 1,
+  adjustY: 1
+};
+var targetOffset = [0, 0];
+var basePlacements = {
+  left: {
+    points: ['cr', 'cl'],
+    offset: [-8, 0]
+  },
+  right: {
+    points: ['cl', 'cr'],
+    offset: [8, 0]
+  },
+  top: {
+    points: ['bc', 'tc'],
+    offset: [0, -8]
+  },
+  bottom: {
+    points: ['tc', 'bc'],
+    offset: [0, 8]
+  },
+  topLeft: {
+    points: ['bl', 'tl'],
+    offset: [0, -8]
+  },
+  leftTop: {
+    points: ['tr', 'tl'],
+    offset: [-8, 0]
+  },
+  topRight: {
+    points: ['br', 'tr'],
+    offset: [0, -8]
+  },
+  rightTop: {
+    points: ['tl', 'tr'],
+    offset: [8, 0]
+  },
+  bottomRight: {
+    points: ['tr', 'br'],
+    offset: [0, 8]
+  },
+  rightBottom: {
+    points: ['bl', 'br'],
+    offset: [8, 0]
+  },
+  bottomLeft: {
+    points: ['tl', 'bl'],
+    offset: [0, 8]
+  },
+  leftBottom: {
+    points: ['br', 'bl'],
+    offset: [-8, 0]
+  }
+};
+export function getPlacements() {
+  var arrowPointAtCenter = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+  var placements = {};
+  Object.keys(basePlacements).forEach(function (key) {
+    placements[key] = _objectSpread(_objectSpread({}, basePlacements[key]), {}, {
+      autoArrow: arrowPointAtCenter,
+      targetOffset: targetOffset
+    });
+  });
+  return placements;
+}
+export var placements = getPlacements();

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

@@ -0,0 +1,3 @@
+import type { PlacementType } from './placements';
+export declare function isInViewPort(element: HTMLElement): boolean;
+export declare function getPlacement(targetElement?: HTMLElement | null, placement?: PlacementType, stepPlacement?: PlacementType): PlacementType;

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

@@ -0,0 +1,14 @@
+export function isInViewPort(element) {
+  var viewWidth = window.innerWidth || document.documentElement.clientWidth;
+  var viewHeight = window.innerHeight || document.documentElement.clientHeight;
+  var _element$getBoundingC = element.getBoundingClientRect(),
+    top = _element$getBoundingC.top,
+    right = _element$getBoundingC.right,
+    bottom = _element$getBoundingC.bottom,
+    left = _element$getBoundingC.left;
+  return top >= 0 && left >= 0 && right <= viewWidth && bottom <= viewHeight;
+}
+export function getPlacement(targetElement, placement, stepPlacement) {
+  var _ref;
+  return (_ref = stepPlacement !== null && stepPlacement !== void 0 ? stepPlacement : placement) !== null && _ref !== void 0 ? _ref : targetElement === null ? 'center' : 'bottom';
+}