@v-c/tour 1.0.2 → 1.1.0-rc.1

package/dist/Mask.d.ts

@@ -16,6 +16,10 @@ export interface MaskProps {
     classNames?: Partial<Record<SemanticName, string>>;
     styles?: Partial<Record<SemanticName, CSSProperties>>;
     getPopupContainer?: TourProps['getPopupContainer'];
+    onEsc?: (info: {
+        top: boolean;
+        event: KeyboardEvent;
+    }) => void;
 }
 declare const Mask: import('vue').DefineSetupFnComponent<MaskProps, {}, {}, MaskProps & {}, import('vue').PublicProps>;
 export default Mask;

package/dist/Mask.js

@@ -1,15 +1,16 @@
 import { Fragment, createVNode, defineComponent, mergeProps, useId } from "vue";
 import Portal from "@v-c/portal";
 import { clsx } from "@v-c/util";
+//#region src/Mask.tsx
 var COVER_PROPS = {
 	"fill": "transparent",
 	"pointer-events": "auto"
 };
-var Mask_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
+var Mask = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 	const id = useId();
 	const isSafari = typeof navigator !== "undefined" && /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
 	return () => {
-		const { prefixCls, rootClassName, pos, showMask, fill = "rgba(0,0,0,0.5)", open, animated, zIndex, disabledInteraction, styles, classNames: tourClassNames, getPopupContainer } = props;
+		const { prefixCls, rootClassName, pos, showMask, fill = "rgba(0,0,0,0.5)", open, animated, zIndex, disabledInteraction, styles, classNames: tourClassNames, getPopupContainer, onEsc } = props;
 		const maskId = `${prefixCls}-mask-${id}`;
 		const mergedAnimated = typeof animated === "object" ? animated?.placeholder : animated;
 		const maskRectSize = isSafari ? {
@@ -23,7 +24,8 @@ var Mask_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 		return createVNode(Portal, {
 			"open": open,
 			"autoLock": !inlineMode,
-			"getContainer": getPopupContainer
+			"getContainer": getPopupContainer,
+			"onEsc": onEsc
 		}, { default: () => [createVNode("div", {
 			"class": clsx(`${prefixCls}-mask`, rootClassName, tourClassNames?.mask),
 			"style": {
@@ -147,7 +149,13 @@ var Mask_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 			default: void 0
 		},
 		getPopupContainer: {
-			type: [Function, Boolean],
+			type: Boolean,
+			required: false,
+			skipCheck: true,
+			default: void 0
+		},
+		onEsc: {
+			type: Function,
 			required: false,
 			default: void 0
 		}
@@ -155,4 +163,5 @@ var Mask_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 	name: "TourMask",
 	inheritAttrs: false
 });
-export { Mask_default as default };
+//#endregion
+export { Mask as default };

package/dist/Placeholder.js

@@ -1,6 +1,7 @@
 import { computed, createVNode, defineComponent, mergeProps } from "vue";
 import Portal from "@v-c/portal";
-var Placeholder_default = /* @__PURE__ */ defineComponent((props, { expose, attrs }) => {
+//#region src/Placeholder.tsx
+var Placeholder = /* @__PURE__ */ defineComponent((props, { expose, attrs }) => {
 	expose({
 		getDom: () => {
 			return props?.domRef.value ?? props?.fallbackDOM?.();
@@ -19,13 +20,11 @@ var Placeholder_default = /* @__PURE__ */ defineComponent((props, { expose, attr
 	props: {
 		domRef: {
 			type: Object,
-			required: true,
-			default: void 0
+			required: true
 		},
 		fallbackDOM: {
 			type: Function,
-			required: true,
-			default: void 0
+			required: true
 		},
 		open: {
 			type: Boolean,
@@ -51,4 +50,5 @@ var Placeholder_default = /* @__PURE__ */ defineComponent((props, { expose, attr
 	name: "TourPlaceholder",
 	inheritAttrs: false
 });
-export { Placeholder_default as default };
+//#endregion
+export { Placeholder as default };

package/dist/Tour.js

@@ -1,13 +1,14 @@
-import Mask_default from "./Mask.js";
-import Placeholder_default from "./Placeholder.js";
+import Mask from "./Mask.js";
+import Placeholder from "./Placeholder.js";
 import { useClosable } from "./hooks/useClosable.js";
 import { getPlacement } from "./util.js";
 import useTarget from "./hooks/useTarget.js";
 import { getPlacements } from "./placements.js";
-import TourStep_default from "./TourStep/index.js";
-import { Fragment, computed, createVNode, defineComponent, mergeProps, nextTick, shallowRef, unref, watch } from "vue";
+import TourStep from "./TourStep/index.js";
+import { Fragment, computed, createVNode, defineComponent, mergeProps, nextTick, onBeforeUnmount, shallowRef, unref, watch } from "vue";
 import { clsx } from "@v-c/util";
 import { Trigger } from "@v-c/trigger";
+//#region src/Tour.tsx
 var CENTER_PLACEHOLDER = {
 	left: "50%",
 	top: "50%",
@@ -18,7 +19,7 @@ var defaultScrollIntoViewOptions = {
 	block: "center",
 	inline: "center"
 };
-var Tour_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
+var Tour = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 	const triggerRef = shallowRef();
 	const placeholderRef = shallowRef(null);
 	const inlineMode = computed(() => props?.getPopupContainer === false);
@@ -87,6 +88,41 @@ var Tour_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 		setInternalOpen(false);
 		props?.onClose?.(mergedCurrent.value);
 	};
+	const mergedKeyboard = computed(() => props?.keyboard ?? true);
+	const handleEscClose = ({ event }) => {
+		if (mergedKeyboard.value && mergedClosable.value !== null) {
+			event.preventDefault();
+			handleClose();
+		}
+	};
+	const isEditableTarget = (e) => {
+		const target = e.target;
+		if (!target) return false;
+		const tagName = target.tagName.toLowerCase();
+		return tagName === "input" || tagName === "textarea" || target.isContentEditable;
+	};
+	const keyboardHandler = (e) => {
+		if (isEditableTarget(e)) return;
+		if (mergedKeyboard.value && e.key === "ArrowLeft" && mergedCurrent.value > 0) {
+			e.preventDefault();
+			onInternalChange(mergedCurrent.value - 1);
+		}
+		if (mergedKeyboard.value && e.key === "ArrowRight" && mergedCurrent.value < steps.value.length - 1) {
+			e.preventDefault();
+			onInternalChange(mergedCurrent.value + 1);
+		}
+	};
+	watch(mergedOpen, (open, _, onCleanup) => {
+		if (open) {
+			window.addEventListener("keydown", keyboardHandler);
+			onCleanup(() => {
+				window.removeEventListener("keydown", keyboardHandler);
+			});
+		} else window.removeEventListener("keydown", keyboardHandler);
+	}, { immediate: true });
+	onBeforeUnmount(() => {
+		window.removeEventListener("keydown", keyboardHandler);
+	});
 	const fallbackDOM = () => {
 		return targetElement.value || (typeof document !== "undefined" ? document.body : null);
 	};
@@ -109,7 +145,7 @@ var Tour_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 			...style || {}
 		};
 		if (attrStyle && typeof attrStyle === "object") Object.assign(placeholderStyle, attrStyle);
-		const popupElement = createVNode(TourStep_default, mergeProps({
+		const popupElement = createVNode(TourStep, mergeProps({
 			"styles": styles,
 			"classNames": classNames,
 			"arrow": mergedArrow.value,
@@ -131,7 +167,7 @@ var Tour_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 			}
 		}, stepInfo.value, { "closable": mergedClosable.value }), null);
 		if (targetElement.value === void 0 || !hasOpened.value) return null;
-		return createVNode(Fragment, null, [createVNode(Mask_default, {
+		return createVNode(Fragment, null, [createVNode(Mask, {
 			"getPopupContainer": getPopupContainer,
 			"styles": styles,
 			"classNames": classNames,
@@ -144,7 +180,8 @@ var Tour_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 			"open": mergedOpen.value,
 			"animated": animated,
 			"rootClassName": rootClassName,
-			"disabledInteraction": disabledInteraction
+			"disabledInteraction": disabledInteraction,
+			"onEsc": handleEscClose
 		}, null), createVNode(Trigger, mergeProps(restAttrs, {
 			"getPopupContainer": getPopupContainer,
 			"builtinPlacements": mergedBuiltinPlacements.value,
@@ -160,7 +197,7 @@ var Tour_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 			"zIndex": zIndex,
 			"arrow": !!mergedArrow.value,
 			"onPopupAlign": onPopupAlign
-		}), { default: () => [createVNode(Placeholder_default, {
+		}), { default: () => [createVNode(Placeholder, {
 			"open": mergedOpen.value,
 			"autoLock": !inlineMode.value,
 			"getContainer": getPopupContainer,
@@ -317,6 +354,11 @@ var Tour_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 			required: false,
 			default: void 0
 		},
+		keyboard: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
 		onPopupAlign: {
 			type: Function,
 			required: false,
@@ -326,4 +368,5 @@ var Tour_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 	name: "VcTour",
 	inheritAttrs: false
 });
-export { Tour_default as default };
+//#endregion
+export { Tour as default };

package/dist/TourStep/DefaultPanel.js

@@ -1,7 +1,8 @@
 import { createTextVNode, createVNode, defineComponent, mergeProps } from "vue";
 import { clsx } from "@v-c/util";
 import pickAttrs from "@v-c/util/dist/pickAttrs";
-var DefaultPanel_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
+//#region src/TourStep/DefaultPanel.tsx
+var DefaultPanel = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 	return () => {
 		const { prefixCls, current, total, title, description, onClose, onPrev, onNext, onFinish, closable, classNames: tourClassNames, styles } = props;
 		const ariaProps = pickAttrs(closable || {}, true);
@@ -16,7 +17,10 @@ var DefaultPanel_default = /* @__PURE__ */ defineComponent((props, { attrs }) =>
 				"type": "button",
 				"onClick": onClose,
 				"aria-label": "Close"
-			}, ariaProps, { "class": `${prefixCls}-close` }), [closeIcon]),
+			}, ariaProps, {
+				"class": clsx(`${prefixCls}-close`, tourClassNames?.close),
+				"style": styles?.close
+			}), [closeIcon]),
 			createVNode("div", {
 				"class": clsx(`${prefixCls}-header`, tourClassNames?.header),
 				"style": styles?.header
@@ -128,8 +132,7 @@ var DefaultPanel_default = /* @__PURE__ */ defineComponent((props, { attrs }) =>
 				Boolean,
 				Array
 			],
-			required: true,
-			default: void 0
+			required: true
 		},
 		description: {
 			type: [
@@ -196,4 +199,5 @@ var DefaultPanel_default = /* @__PURE__ */ defineComponent((props, { attrs }) =>
 	name: "TourDefaultPanel",
 	inheritAttrs: false
 });
-export { DefaultPanel_default as default };
+//#endregion
+export { DefaultPanel as default };

package/dist/TourStep/index.js

@@ -1,12 +1,13 @@
-import DefaultPanel_default from "./DefaultPanel.js";
+import DefaultPanel from "./DefaultPanel.js";
 import { Fragment, createVNode, defineComponent } from "vue";
-var TourStep_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
+//#region src/TourStep/index.tsx
+var TourStep = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 	return () => {
 		const { current, renderPanel } = props;
 		return createVNode(Fragment, null, [typeof renderPanel === "function" ? renderPanel({
 			...props,
 			...attrs
-		}, current) : createVNode(DefaultPanel_default, props, null)]);
+		}, current) : createVNode(DefaultPanel, props, null)]);
 	};
 }, {
 	props: {
@@ -85,8 +86,7 @@ var TourStep_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 				Boolean,
 				Array
 			],
-			required: true,
-			default: void 0
+			required: true
 		},
 		description: {
 			type: [
@@ -153,4 +153,5 @@ var TourStep_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
 	name: "TourStep",
 	inheritAttrs: false
 });
-export { TourStep_default as default };
+//#endregion
+export { TourStep as default };

package/dist/hooks/useClosable.js

@@ -1,7 +1,12 @@
 import { computed } from "vue";
+//#region src/hooks/useClosable.tsx
 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;
 	const mergedCloseIcon = typeof closeIcon !== "boolean" ? closeIcon : void 0;
@@ -19,4 +24,5 @@ function useClosable(stepClosable, stepCloseIcon, closable, closeIcon) {
 		return rootCloseableConfig;
 	});
 }
+//#endregion
 export { useClosable };

package/dist/hooks/useTarget.js

@@ -2,6 +2,7 @@ import { isInViewPort } from "../util.js";
 import { computed, nextTick, onMounted, shallowRef, watch } from "vue";
 import canUseDom from "@v-c/util/dist/Dom/canUseDom";
 import { resolveToElement } from "@v-c/util/dist/vnode";
+//#region src/hooks/useTarget.ts
 function isValidNumber(val) {
 	return typeof val === "number" && !Number.isNaN(val);
 }
@@ -73,4 +74,5 @@ function useTarget(target, open, gap, scrollIntoViewOptions, inlineMode, placeho
 		};
 	}), targetElement];
 }
+//#endregion
 export { useTarget as default };

package/dist/index.js

@@ -1,3 +1,5 @@
-import Tour_default from "./Tour.js";
-var src_default = Tour_default;
+import Tour from "./Tour.js";
+//#region src/index.tsx
+var src_default = Tour;
+//#endregion
 export { src_default as default };

package/dist/interface.d.ts

@@ -4,7 +4,7 @@ import { AriaAttributes, CSSProperties, Ref } from 'vue';
 import { Gap } from './hooks/useTarget.ts';
 import { PlacementType } from './placements';
 import { DefaultPanelProps } from './TourStep/DefaultPanel.tsx';
-export type SemanticName = 'section' | 'footer' | 'actions' | 'header' | 'title' | 'description' | 'mask';
+export type SemanticName = 'section' | 'footer' | 'actions' | 'header' | 'title' | 'description' | 'mask' | 'close';
 export type HTMLAriaDataAttributes = AriaAttributes & {
     [key: `data-${string}`]: unknown;
     role?: string;
@@ -78,4 +78,5 @@ export interface TourProps extends Pick<TriggerProps, 'onPopupAlign'> {
         arrowPointAtCenter?: boolean;
     }) => TriggerProps['builtinPlacements']);
     disabledInteraction?: boolean;
+    keyboard?: boolean;
 }

package/dist/placements.js

@@ -1,3 +1,4 @@
+//#region src/placements.tsx
 var targetOffset = [0, 0];
 var basePlacements = {
 	left: {
@@ -50,15 +51,16 @@ var basePlacements = {
 	}
 };
 function getPlacements(arrowPointAtCenter = false) {
-	const placements$1 = {};
+	const placements = {};
 	Object.keys(basePlacements).forEach((key) => {
-		placements$1[key] = {
+		placements[key] = {
 			...basePlacements[key],
 			autoArrow: arrowPointAtCenter,
 			targetOffset
 		};
 	});
-	return placements$1;
+	return placements;
 }
-const placements = getPlacements();
+var placements = getPlacements();
+//#endregion
 export { getPlacements, placements };

package/dist/util.js

@@ -1,3 +1,4 @@
+//#region src/util.ts
 function isInViewPort(element) {
 	const viewWidth = window.innerWidth || document.documentElement.clientWidth;
 	const viewHeight = window.innerHeight || document.documentElement.clientHeight;
@@ -7,4 +8,5 @@ function isInViewPort(element) {
 function getPlacement(targetElement, placement, stepPlacement) {
 	return stepPlacement ?? placement ?? (targetElement === null ? "center" : "bottom");
 }
+//#endregion
 export { getPlacement, isInViewPort };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@v-c/tour",
   "type": "module",
-  "version": "1.0.2",
+  "version": "1.1.0-rc.1",
   "publishConfig": {
     "access": "public"
   },
@@ -15,7 +15,7 @@
     ".": {
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js",
-      "require": "./dist/index.cjs"
+      "default": "./dist/index.js"
     },
     "./dist/*": "./dist/*",
     "./package.json": "./package.json"
@@ -29,9 +29,9 @@
     "vue": "^3.0.0"
   },
   "dependencies": {
-    "@v-c/portal": "^1.0.5",
-    "@v-c/trigger": "^1.0.5",
-    "@v-c/util": "^1.0.8"
+    "@v-c/portal": "^1.0.8",
+    "@v-c/trigger": "^1.0.14",
+    "@v-c/util": "^1.0.19"
   },
   "scripts": {
     "build": "vite build",

package/dist/Mask.cjs

@@ -1,165 +0,0 @@
-Object.defineProperties(exports, {
-	__esModule: { value: true },
-	[Symbol.toStringTag]: { value: "Module" }
-});
-const require_rolldown_runtime = require("./_virtual/rolldown_runtime.cjs");
-let vue = require("vue");
-let _v_c_portal = require("@v-c/portal");
-_v_c_portal = require_rolldown_runtime.__toESM(_v_c_portal);
-let _v_c_util = require("@v-c/util");
-var COVER_PROPS = {
-	"fill": "transparent",
-	"pointer-events": "auto"
-};
-var Mask = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs }) => {
-	const id = (0, vue.useId)();
-	const isSafari = typeof navigator !== "undefined" && /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
-	return () => {
-		const { prefixCls, rootClassName, pos, showMask, fill = "rgba(0,0,0,0.5)", open, animated, zIndex, disabledInteraction, styles, classNames: tourClassNames, getPopupContainer } = props;
-		const maskId = `${prefixCls}-mask-${id}`;
-		const mergedAnimated = typeof animated === "object" ? animated?.placeholder : animated;
-		const maskRectSize = isSafari ? {
-			width: "100%",
-			height: "100%"
-		} : {
-			width: "100vw",
-			height: "100vh"
-		};
-		const inlineMode = getPopupContainer === false;
-		return (0, vue.createVNode)(_v_c_portal.default, {
-			"open": open,
-			"autoLock": !inlineMode,
-			"getContainer": getPopupContainer
-		}, { default: () => [(0, vue.createVNode)("div", {
-			"class": (0, _v_c_util.clsx)(`${prefixCls}-mask`, rootClassName, tourClassNames?.mask),
-			"style": {
-				position: inlineMode ? "absolute" : "fixed",
-				left: `0px`,
-				right: `0px`,
-				top: `0px`,
-				bottom: `0px`,
-				zIndex,
-				pointerEvents: pos && !disabledInteraction ? "none" : "auto",
-				...attrs.style,
-				...styles?.mask
-			}
-		}, [showMask ? (0, vue.createVNode)("svg", { "style": {
-			width: "100%",
-			height: "100%"
-		} }, [
-			(0, vue.createVNode)("defs", null, [(0, vue.createVNode)("mask", { "id": maskId }, [(0, vue.createVNode)("rect", (0, vue.mergeProps)({
-				"x": "0",
-				"y": "0"
-			}, maskRectSize, { "fill": "white" }), null), pos && (0, vue.createVNode)("rect", {
-				"x": pos.left,
-				"y": pos.top,
-				"rx": pos.radius,
-				"width": pos.width,
-				"height": pos.height,
-				"fill": "black",
-				"class": mergedAnimated ? `${prefixCls}-placeholder-animated` : ""
-			}, null)])]),
-			(0, vue.createVNode)("rect", {
-				"x": "0",
-				"y": "0",
-				"width": "100%",
-				"height": "100%",
-				"fill": fill,
-				"mask": `url(#${maskId})`
-			}, null),
-			pos && (0, vue.createVNode)(vue.Fragment, null, [
-				(0, vue.createVNode)("rect", (0, vue.mergeProps)(COVER_PROPS, {
-					"x": "0",
-					"y": "0",
-					"width": "100%",
-					"height": Math.max(pos.top, 0)
-				}), null),
-				(0, vue.createVNode)("rect", (0, vue.mergeProps)(COVER_PROPS, {
-					"x": "0",
-					"y": "0",
-					"width": Math.max(pos.left, 0),
-					"height": "100%"
-				}), null),
-				(0, vue.createVNode)("rect", (0, vue.mergeProps)(COVER_PROPS, {
-					"x": "0",
-					"y": pos.top + pos.height,
-					"width": "100%",
-					"height": `calc(100% - ${pos.top + pos.height}px)`
-				}), null),
-				(0, vue.createVNode)("rect", (0, vue.mergeProps)(COVER_PROPS, {
-					"x": pos.left + pos.width,
-					"y": "0",
-					"width": `calc(100% - ${pos.left + pos.width}px)`,
-					"height": "100%"
-				}), null)
-			])
-		]) : null])] });
-	};
-}, {
-	props: {
-		prefixCls: {
-			type: String,
-			required: false,
-			default: void 0
-		},
-		pos: {
-			type: [Object, null],
-			required: false,
-			default: void 0
-		},
-		rootClassName: {
-			type: String,
-			required: false,
-			default: void 0
-		},
-		showMask: {
-			type: Boolean,
-			required: false,
-			default: void 0
-		},
-		fill: {
-			type: String,
-			required: false,
-			default: void 0
-		},
-		open: {
-			type: Boolean,
-			required: false,
-			default: void 0
-		},
-		animated: {
-			type: [Boolean, Object],
-			required: false,
-			default: void 0
-		},
-		zIndex: {
-			type: Number,
-			required: false,
-			default: void 0
-		},
-		disabledInteraction: {
-			type: Boolean,
-			required: false,
-			default: void 0
-		},
-		classNames: {
-			type: Object,
-			required: false,
-			default: void 0
-		},
-		styles: {
-			type: Object,
-			required: false,
-			default: void 0
-		},
-		getPopupContainer: {
-			type: [Function, Boolean],
-			required: false,
-			default: void 0
-		}
-	},
-	name: "TourMask",
-	inheritAttrs: false
-});
-var Mask_default = Mask;
-exports.default = Mask_default;

package/dist/Placeholder.cjs

@@ -1,61 +0,0 @@
-Object.defineProperties(exports, {
-	__esModule: { value: true },
-	[Symbol.toStringTag]: { value: "Module" }
-});
-const require_rolldown_runtime = require("./_virtual/rolldown_runtime.cjs");
-let vue = require("vue");
-let _v_c_portal = require("@v-c/portal");
-_v_c_portal = require_rolldown_runtime.__toESM(_v_c_portal);
-var Placeholder = /* @__PURE__ */ (0, vue.defineComponent)((props, { expose, attrs }) => {
-	expose({
-		getDom: () => {
-			return props?.domRef.value ?? props?.fallbackDOM?.();
-		},
-		__$el: (0, vue.computed)(() => props?.domRef?.value ?? props?.fallbackDOM?.())
-	});
-	return () => {
-		const { open, autoLock, getContainer } = props;
-		return (0, vue.createVNode)(_v_c_portal.default, {
-			"open": open,
-			"autoLock": autoLock,
-			"getContainer": getContainer
-		}, { default: () => [(0, vue.createVNode)("div", (0, vue.mergeProps)({ "ref": props.domRef }, attrs), null)] });
-	};
-}, {
-	props: {
-		domRef: {
-			type: Object,
-			required: true,
-			default: void 0
-		},
-		fallbackDOM: {
-			type: Function,
-			required: true,
-			default: void 0
-		},
-		open: {
-			type: Boolean,
-			required: false,
-			default: void 0
-		},
-		autoLock: {
-			type: Boolean,
-			required: false,
-			default: void 0
-		},
-		getContainer: {
-			type: [
-				String,
-				Function,
-				Boolean
-			],
-			required: false,
-			skipCheck: true,
-			default: void 0
-		}
-	},
-	name: "TourPlaceholder",
-	inheritAttrs: false
-});
-var Placeholder_default = Placeholder;
-exports.default = Placeholder_default;