@rainbow-oh/yee-c 0.1.0 → 0.3.0

package/dist/cjs/Tour/index.js

@@ -0,0 +1,36 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Tour/index.ts
+var Tour_exports = {};
+__export(Tour_exports, {
+  default: () => Tour_default
+});
+module.exports = __toCommonJS(Tour_exports);
+var import_tour = __toESM(require("./tour"));
+var Tour_default = import_tour.default;

package/dist/cjs/Tour/interface.d.ts

@@ -0,0 +1,118 @@
+/// <reference types="react" />
+import type { Placement } from '../Trigger/interface';
+import type { DataAttributeProps } from '../utils/types';
+export type TourTarget = (() => HTMLElement | null) | string | HTMLElement;
+export type TourSemanticDOM = 'highlight' | 'content' | 'header' | 'body' | 'footer';
+export interface TourStep {
+    /**
+     * The element to highlight, supports a finder function, a CSS selector string, or an HTMLElement
+     */
+    target: TourTarget;
+    /**
+     * Card title
+     */
+    title?: React.ReactNode;
+    /**
+     * Card description
+     */
+    description?: React.ReactNode;
+    /**
+     * Card placement relative to the highlighted target
+     * @default 'bottom'
+     */
+    placement?: Placement;
+    /**
+     * Whether to show the card arrow
+     */
+    arrow?: boolean;
+    /**
+     * Custom step class name
+     */
+    className?: string;
+}
+export interface TourProps extends DataAttributeProps {
+    /**
+     * Custom prefix class name
+     */
+    prefixCls?: string;
+    /**
+     * Custom root class name
+     */
+    className?: string;
+    /**
+     * Custom root style
+     */
+    style?: React.CSSProperties;
+    /**
+     * Semantic structure class names
+     */
+    classNames?: Partial<Record<TourSemanticDOM, string>>;
+    /**
+     * Semantic structure styles
+     */
+    styles?: Partial<Record<TourSemanticDOM, React.CSSProperties>>;
+    /**
+     * Whether the tour is visible (controlled)
+     */
+    open: boolean;
+    /**
+     * Tour steps
+     */
+    steps: TourStep[];
+    /**
+     * Controlled current step index
+     */
+    current?: number;
+    /**
+     * Default current step index
+     */
+    defaultCurrent?: number;
+    /**
+     * Callback when the tour is closed / skipped
+     */
+    onClose?: () => void;
+    /**
+     * Callback when all steps are finished
+     */
+    onFinish?: () => void;
+    /**
+     * Callback when current step changes
+     */
+    onChange?: (current: number) => void;
+    /**
+     * Default card placement relative to the highlighted target
+     * @default 'bottom'
+     */
+    placement?: Placement;
+    /**
+     * Whether to show the card arrow by default
+     */
+    arrow?: boolean;
+    /**
+     * Whether to show the mask layer (highlight cutout + click lock)
+     * @default true
+     */
+    mask?: boolean;
+    /**
+     * Whether the close button is shown at the top-right of the card
+     * @default true
+     */
+    closable?: boolean;
+    /**
+     * Custom close icon
+     */
+    closeIcon?: React.ReactNode;
+    /**
+     * Whether clicking the mask closes the tour
+     * @default false
+     */
+    maskClosable?: boolean;
+    /**
+     * Custom step indicators renderer, receives (current, total)
+     */
+    indicatorsRender?: (current: number, total: number) => React.ReactNode;
+    /**
+     * Options passed to target.scrollIntoView on each step
+     */
+    scrollIntoViewOptions?: boolean | ScrollIntoViewOptions;
+}

package/dist/cjs/Tour/interface.js

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Tour/interface.ts
+var interface_exports = {};
+module.exports = __toCommonJS(interface_exports);

package/dist/cjs/Tour/style/index.less

@@ -0,0 +1,103 @@
+@pls: .yee-tour;
+
+@{pls} {
+  position: fixed;
+  inset: 0;
+  z-index: var(--yee-tour-mask-z-index);
+  pointer-events: none;
+
+  // ① click-intercept layer (box-shadow receives no pointer events, so a
+  //    transparent full-screen layer is needed to lock interaction + carry maskClosable)
+  &-mask {
+    position: absolute;
+    inset: 0;
+    pointer-events: auto;
+    background-color: transparent;
+
+    // No target to cut out → the mask itself becomes the full-screen dim layer.
+    &-full {
+      background-color: var(--yee-tour-mask-color);
+    }
+  }
+
+  // ② highlight cutout via a huge box-shadow; top/left/width/height come from
+  //    motion inline styles, position/shape/visuals from here
+  &-highlight {
+    position: fixed;
+    box-sizing: border-box;
+    border-radius: var(--yee-tour-highlight-border-radius);
+    box-shadow: 0 0 0 9999px var(--yee-tour-mask-color);
+    z-index: 1;
+    pointer-events: none;
+  }
+}
+
+// card
+.yee-tour-content {
+  position: fixed;
+  z-index: 2;
+  pointer-events: auto;
+  box-sizing: border-box;
+  width: var(--yee-tour-content-width);
+  max-width: calc(100vw - 48px);
+  padding: var(--yee-tour-content-padding);
+  background-color: var(--yee-tour-content-bg-color);
+  border-radius: var(--yee-tour-content-border-radius);
+  box-shadow: var(--yee-tour-content-box-shadow);
+
+  .yee-tour-close {
+    position: absolute;
+    top: var(--yee-tour-close-top);
+    inset-inline-end: var(--yee-tour-close-right);
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0;
+    border: none;
+    background: transparent;
+    color: var(--yee-tour-close-color);
+    cursor: pointer;
+    opacity: 0.55;
+    transition: opacity var(--yee-tour-transition-duration) linear;
+
+    &:hover {
+      opacity: 1;
+    }
+  }
+
+  .yee-tour-header {
+    margin-bottom: var(--yee-tour-header-margin-bottom);
+    padding-inline-end: var(--yee-tour-close-size);
+    color: var(--yee-tour-title-color);
+    font-size: var(--yee-tour-title-font-size);
+    font-weight: var(--yee-tour-title-font-weight);
+    line-height: var(--yee-tour-title-line-height);
+  }
+
+  .yee-tour-body {
+    color: var(--yee-tour-description-color);
+    font-size: var(--yee-tour-description-font-size);
+    line-height: var(--yee-tour-description-line-height);
+  }
+
+  .yee-tour-footer {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: var(--yee-tour-button-gap);
+    margin-top: var(--yee-tour-footer-margin-top);
+  }
+
+  .yee-tour-indicators {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--yee-tour-indicator-gap);
+  }
+
+  .yee-tour-buttons {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--yee-tour-button-gap);
+    margin-left: auto;
+  }
+}

package/dist/cjs/Tour/tour.d.ts

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

package/dist/cjs/Tour/tour.js

@@ -0,0 +1,403 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Tour/tour.tsx
+var tour_exports = {};
+__export(tour_exports, {
+  default: () => tour_default
+});
+module.exports = __toCommonJS(tour_exports);
+var import_clsx = __toESM(require("clsx"));
+var import_lucide_react = require("lucide-react");
+var import_react = require("motion/react");
+var import_react2 = __toESM(require("react"));
+var import_react_dom = require("react-dom");
+var import_Button = __toESM(require("../Button"));
+var import_Config_Provider = require("../Config-Provider");
+var import_useEsc = __toESM(require("../hooks/useEsc"));
+var import_useLatest = __toESM(require("../hooks/useLatest"));
+var import_useMergedState = __toESM(require("../hooks/useMergedState"));
+var import_locale = require("../locale");
+var import_mergeContextToProps = __toESM(require("../utils/mergeContextToProps"));
+var import_style = require("./style/index.less");
+var GAP = 12;
+var resolveTarget = (target) => {
+  if (!target)
+    return null;
+  if (typeof target === "function") {
+    try {
+      return target();
+    } catch (e) {
+      return null;
+    }
+  }
+  if (typeof target === "string") {
+    if (typeof document === "undefined")
+      return null;
+    return document.querySelector(target);
+  }
+  return target;
+};
+var SIDE_PREFIXES = ["top", "bottom", "left", "right"];
+var parsePlacement = (p) => {
+  var _a;
+  if (!p)
+    return { side: "bottom", align: "center" };
+  const side = (_a = SIDE_PREFIXES.find((s) => p.startsWith(s))) != null ? _a : "bottom";
+  const rest = p.slice(side.length);
+  let align = "center";
+  if (side === "top" || side === "bottom") {
+    if (rest === "Left")
+      align = "start";
+    else if (rest === "Right")
+      align = "end";
+  } else if (rest === "Top") {
+    align = "start";
+  } else if (rest === "Bottom") {
+    align = "end";
+  }
+  return { side, align };
+};
+var OPPOSITE_SIDE = {
+  top: "bottom",
+  bottom: "top",
+  left: "right",
+  right: "left"
+};
+var computeCardPos = (rect, placement, size, gap) => {
+  const { width: cw, height: ch } = size;
+  const { top, left, width, height } = rect;
+  if (cw === 0 || ch === 0) {
+    return { top, left };
+  }
+  const vw = window.innerWidth;
+  const vh = window.innerHeight;
+  const { side: preferredSide, align } = parsePlacement(placement);
+  const layoutFor = (side2) => {
+    if (side2 === "top" || side2 === "bottom") {
+      const main2 = side2 === "top" ? top - ch - gap : top + height + gap;
+      let cross2;
+      if (align === "start")
+        cross2 = left;
+      else if (align === "end")
+        cross2 = left + width - cw;
+      else
+        cross2 = left + width / 2 - cw / 2;
+      return { top: main2, left: cross2 };
+    }
+    const main = side2 === "left" ? left - cw - gap : left + width + gap;
+    let cross;
+    if (align === "start")
+      cross = top;
+    else if (align === "end")
+      cross = top + height - ch;
+    else
+      cross = top + height / 2 - ch / 2;
+    return { top: cross, left: main };
+  };
+  const fits = (side2, pos2) => {
+    if (side2 === "top")
+      return pos2.top >= gap;
+    if (side2 === "bottom")
+      return pos2.top + ch <= vh - gap;
+    if (side2 === "left")
+      return pos2.left >= gap;
+    return pos2.left + cw <= vw - gap;
+  };
+  let side = preferredSide;
+  let pos = layoutFor(side);
+  const flippedSide = OPPOSITE_SIDE[side];
+  const flipped = layoutFor(flippedSide);
+  if (!fits(side, pos) && fits(flippedSide, flipped)) {
+    side = flippedSide;
+    pos = flipped;
+  }
+  return {
+    top: Math.max(gap, Math.min(pos.top, vh - ch - gap)),
+    left: Math.max(gap, Math.min(pos.left, vw - cw - gap))
+  };
+};
+var Tour = (baseprops) => {
+  var _a, _c;
+  const { tour: tourCtx } = (0, import_react2.useContext)(import_Config_Provider.GlobalContext);
+  const props = (0, import_mergeContextToProps.default)(baseprops, tourCtx);
+  const { locale } = (0, import_locale.useLocale)();
+  const tourLocale = (_a = locale == null ? void 0 : locale.tour) != null ? _a : {
+    previous: "Previous",
+    next: "Next",
+    finish: "Finish",
+    skip: "Skip"
+  };
+  const _b = props, {
+    prefixCls = "yee-tour",
+    className,
+    style,
+    classNames,
+    styles,
+    open,
+    steps = [],
+    current,
+    defaultCurrent = 0,
+    onClose,
+    onFinish,
+    onChange,
+    placement = "bottom",
+    mask = true,
+    closable = true,
+    closeIcon,
+    maskClosable = false,
+    indicatorsRender,
+    scrollIntoViewOptions = true
+  } = _b, rest = __objRest(_b, [
+    "prefixCls",
+    "className",
+    "style",
+    "classNames",
+    "styles",
+    "open",
+    "steps",
+    "current",
+    "defaultCurrent",
+    "onClose",
+    "onFinish",
+    "onChange",
+    "placement",
+    "mask",
+    "closable",
+    "closeIcon",
+    "maskClosable",
+    "indicatorsRender",
+    "scrollIntoViewOptions"
+  ]);
+  const [mergedCurrent, setMergedCurrent] = (0, import_useMergedState.default)(
+    defaultCurrent,
+    {
+      value: current,
+      defaultValue: defaultCurrent
+    }
+  );
+  const step = steps[mergedCurrent];
+  const total = steps.length;
+  const isLast = mergedCurrent >= total - 1;
+  const stepPlacement = (_c = step == null ? void 0 : step.placement) != null ? _c : placement;
+  const targetEl = (0, import_react2.useMemo)(
+    () => resolveTarget(step == null ? void 0 : step.target),
+    [step, open]
+  );
+  const [rect, setRect] = (0, import_react2.useState)(null);
+  const rafRef = (0, import_react2.useRef)(null);
+  const scrollIntoViewOptionsRef = (0, import_useLatest.default)(scrollIntoViewOptions);
+  (0, import_react2.useLayoutEffect)(() => {
+    if (!open || !targetEl) {
+      setRect(null);
+      return;
+    }
+    const update = () => {
+      if (rafRef.current !== null)
+        cancelAnimationFrame(rafRef.current);
+      rafRef.current = requestAnimationFrame(() => {
+        setRect(targetEl.getBoundingClientRect());
+      });
+    };
+    update();
+    const scrollTargetIfNeeded = () => {
+      var _a2;
+      const opts = scrollIntoViewOptionsRef.current;
+      if (opts === false)
+        return;
+      if (opts === true) {
+        const vr = targetEl.getBoundingClientRect();
+        const inViewport = vr.top >= 0 && vr.left >= 0 && vr.bottom <= window.innerHeight && vr.right <= window.innerWidth;
+        if (inViewport)
+          return;
+      }
+      try {
+        (_a2 = targetEl.scrollIntoView) == null ? void 0 : _a2.call(targetEl, opts);
+      } catch (e) {
+      }
+    };
+    scrollTargetIfNeeded();
+    window.addEventListener("resize", update);
+    window.addEventListener("scroll", update, true);
+    return () => {
+      if (rafRef.current !== null)
+        cancelAnimationFrame(rafRef.current);
+      window.removeEventListener("resize", update);
+      window.removeEventListener("scroll", update, true);
+    };
+  }, [open, targetEl, mergedCurrent]);
+  (0, import_useEsc.default)({ enabled: open, onEsc: () => onClose == null ? void 0 : onClose() });
+  const handleNext = (0, import_react2.useCallback)(() => {
+    if (isLast) {
+      onFinish == null ? void 0 : onFinish();
+      return;
+    }
+    const nextCur = mergedCurrent + 1;
+    setMergedCurrent(nextCur);
+    onChange == null ? void 0 : onChange(nextCur);
+  }, [isLast, mergedCurrent, onChange, onFinish, setMergedCurrent]);
+  const handlePrev = (0, import_react2.useCallback)(() => {
+    if (mergedCurrent <= 0)
+      return;
+    const prevCur = mergedCurrent - 1;
+    setMergedCurrent(prevCur);
+    onChange == null ? void 0 : onChange(prevCur);
+  }, [mergedCurrent, onChange, setMergedCurrent]);
+  const cardRef = (0, import_react2.useRef)(null);
+  const [cardSize, setCardSize] = (0, import_react2.useState)({ width: 0, height: 0 });
+  (0, import_react2.useLayoutEffect)(() => {
+    if (!open)
+      return;
+    const node = cardRef.current;
+    if (!node)
+      return;
+    const r = node.getBoundingClientRect();
+    setCardSize({ width: r.width, height: r.height });
+  }, [open, step]);
+  const cardPos = (0, import_react2.useMemo)(() => {
+    if (!cardSize.width || !cardSize.height)
+      return null;
+    if (rect)
+      return computeCardPos(rect, stepPlacement, cardSize, GAP);
+    return {
+      top: window.innerHeight / 2 - cardSize.height / 2,
+      left: window.innerWidth / 2 - cardSize.width / 2
+    };
+  }, [rect, stepPlacement, cardSize]);
+  if (!open || typeof document === "undefined" || !step) {
+    return null;
+  }
+  return (0, import_react_dom.createPortal)(
+    /* @__PURE__ */ import_react2.default.createElement("div", __spreadValues({ className: (0, import_clsx.default)(prefixCls, className), style }, rest), mask ? /* @__PURE__ */ import_react2.default.createElement(
+      "div",
+      {
+        className: (0, import_clsx.default)(
+          `${prefixCls}-mask`,
+          !rect && `${prefixCls}-mask-full`
+        ),
+        onClick: maskClosable ? onClose : void 0
+      }
+    ) : null, mask && rect ? /* @__PURE__ */ import_react2.default.createElement(
+      import_react.motion.div,
+      {
+        className: (0, import_clsx.default)(`${prefixCls}-highlight`, classNames == null ? void 0 : classNames.highlight),
+        initial: false,
+        animate: {
+          top: rect.top,
+          left: rect.left,
+          width: rect.width,
+          height: rect.height
+        },
+        transition: { type: "spring", visualDuration: 0.3, bounce: 0.2 },
+        style: styles == null ? void 0 : styles.highlight
+      }
+    ) : null, /* @__PURE__ */ import_react2.default.createElement(
+      import_react.motion.div,
+      {
+        ref: cardRef,
+        className: (0, import_clsx.default)(
+          `${prefixCls}-content`,
+          classNames == null ? void 0 : classNames.content,
+          step == null ? void 0 : step.className
+        ),
+        initial: false,
+        animate: cardPos ? { top: cardPos.top, left: cardPos.left } : { top: 0, left: 0 },
+        transition: { type: "spring", visualDuration: 0.3, bounce: 0.2 },
+        style: __spreadValues({
+          position: "fixed",
+          visibility: cardPos ? "visible" : "hidden"
+        }, styles == null ? void 0 : styles.content)
+      },
+      closable ? /* @__PURE__ */ import_react2.default.createElement(
+        import_Button.default,
+        {
+          type: "text",
+          className: `${prefixCls}-close`,
+          onClick: onClose,
+          size: "small",
+          icon: closeIcon != null ? closeIcon : /* @__PURE__ */ import_react2.default.createElement(import_lucide_react.X, { size: 16 }),
+          "aria-label": tourLocale.skip
+        }
+      ) : null,
+      (step == null ? void 0 : step.title) ? /* @__PURE__ */ import_react2.default.createElement(
+        "div",
+        {
+          className: (0, import_clsx.default)(`${prefixCls}-header`, classNames == null ? void 0 : classNames.header),
+          style: styles == null ? void 0 : styles.header
+        },
+        step.title
+      ) : null,
+      /* @__PURE__ */ import_react2.default.createElement(
+        "div",
+        {
+          className: (0, import_clsx.default)(`${prefixCls}-body`, classNames == null ? void 0 : classNames.body),
+          style: styles == null ? void 0 : styles.body
+        },
+        step == null ? void 0 : step.description
+      ),
+      /* @__PURE__ */ import_react2.default.createElement(
+        "div",
+        {
+          className: (0, import_clsx.default)(`${prefixCls}-footer`, classNames == null ? void 0 : classNames.footer),
+          style: styles == null ? void 0 : styles.footer
+        },
+        /* @__PURE__ */ import_react2.default.createElement("span", { className: `${prefixCls}-indicators` }, indicatorsRender ? indicatorsRender(mergedCurrent, total) : `${mergedCurrent + 1} / ${total}`),
+        /* @__PURE__ */ import_react2.default.createElement("span", { className: `${prefixCls}-buttons` }, mergedCurrent > 0 ? /* @__PURE__ */ import_react2.default.createElement(import_Button.default, { size: "small", onClick: handlePrev }, tourLocale.previous) : null, /* @__PURE__ */ import_react2.default.createElement(import_Button.default, { type: "primary", size: "small", onClick: handleNext }, isLast ? tourLocale.finish : tourLocale.next))
+      )
+    )),
+    document.body
+  );
+};
+Tour.displayName = "Tour";
+var tour_default = Tour;