@element-plus/nightly 0.0.20250605 → 0.0.20250607

package/es/components/tooltip-v2/src/content2.mjs

@@ -1,52 +1,114 @@
-import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
-import { useAriaProps } from '../../../hooks/use-aria/index.mjs';
+import { defineComponent, inject, ref, computed, unref, watch, onMounted, provide, openBlock, createElementBlock, normalizeStyle, normalizeClass, renderSlot, createVNode, withCtx, Fragment, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
+import { offset } from '@floating-ui/dom';
+import ElVisuallyHidden from '../../visual-hidden/src/visual-hidden.mjs';
+import { tooltipV2RootKey, tooltipV2ContentKey } from './constants.mjs';
+import { tooltipV2ContentProps } from './content.mjs';
+import { tooltipV2CommonProps } from './common.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useFloating, arrowMiddleware } from '../../../hooks/use-floating/index.mjs';
+import { useZIndex } from '../../../hooks/use-z-index/index.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
-const tooltipV2Strategies = ["absolute", "fixed"];
-const tooltipV2Placements = [
-  "top-start",
-  "top-end",
-  "top",
-  "bottom-start",
-  "bottom-end",
-  "bottom",
-  "left-start",
-  "left-end",
-  "left",
-  "right-start",
-  "right-end",
-  "right"
-];
-const tooltipV2ContentProps = buildProps({
-  arrowPadding: {
-    type: definePropType(Number),
-    default: 5
-  },
-  effect: {
-    type: definePropType(String),
-    default: "light"
-  },
-  contentClass: String,
-  placement: {
-    type: definePropType(String),
-    values: tooltipV2Placements,
-    default: "bottom"
-  },
-  reference: {
-    type: definePropType(Object),
-    default: null
-  },
-  offset: {
-    type: Number,
-    default: 8
-  },
-  strategy: {
-    type: definePropType(String),
-    values: tooltipV2Strategies,
-    default: "absolute"
-  },
-  showArrow: Boolean,
-  ...useAriaProps(["ariaLabel"])
+const __default__ = defineComponent({
+  name: "ElTooltipV2Content"
 });
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: { ...tooltipV2ContentProps, ...tooltipV2CommonProps },
+  setup(__props) {
+    const props = __props;
+    const { triggerRef, contentId } = inject(tooltipV2RootKey);
+    const placement = ref(props.placement);
+    const strategy = ref(props.strategy);
+    const arrowRef = ref(null);
+    const { referenceRef, contentRef, middlewareData, x, y, update } = useFloating({
+      placement,
+      strategy,
+      middleware: computed(() => {
+        const middleware = [offset(props.offset)];
+        if (props.showArrow) {
+          middleware.push(arrowMiddleware({
+            arrowRef
+          }));
+        }
+        return middleware;
+      })
+    });
+    const zIndex = useZIndex().nextZIndex();
+    const ns = useNamespace("tooltip-v2");
+    const side = computed(() => {
+      return placement.value.split("-")[0];
+    });
+    const contentStyle = computed(() => {
+      return {
+        position: unref(strategy),
+        top: `${unref(y) || 0}px`,
+        left: `${unref(x) || 0}px`,
+        zIndex
+      };
+    });
+    const arrowStyle = computed(() => {
+      if (!props.showArrow)
+        return {};
+      const { arrow } = unref(middlewareData);
+      return {
+        [`--${ns.namespace.value}-tooltip-v2-arrow-x`]: `${arrow == null ? void 0 : arrow.x}px` || "",
+        [`--${ns.namespace.value}-tooltip-v2-arrow-y`]: `${arrow == null ? void 0 : arrow.y}px` || ""
+      };
+    });
+    const contentClass = computed(() => [
+      ns.e("content"),
+      ns.is("dark", props.effect === "dark"),
+      ns.is(unref(strategy)),
+      props.contentClass
+    ]);
+    watch(arrowRef, () => update());
+    watch(() => props.placement, (val) => placement.value = val);
+    onMounted(() => {
+      watch(() => props.reference || triggerRef.value, (el) => {
+        referenceRef.value = el || void 0;
+      }, {
+        immediate: true
+      });
+    });
+    provide(tooltipV2ContentKey, { arrowRef });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref_key: "contentRef",
+        ref: contentRef,
+        style: normalizeStyle(unref(contentStyle)),
+        "data-tooltip-v2-root": ""
+      }, [
+        !_ctx.nowrap ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          "data-side": unref(side),
+          class: normalizeClass(unref(contentClass))
+        }, [
+          renderSlot(_ctx.$slots, "default", {
+            contentStyle: unref(contentStyle),
+            contentClass: unref(contentClass)
+          }),
+          createVNode(unref(ElVisuallyHidden), {
+            id: unref(contentId),
+            role: "tooltip"
+          }, {
+            default: withCtx(() => [
+              _ctx.ariaLabel ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                createTextVNode(toDisplayString(_ctx.ariaLabel), 1)
+              ], 64)) : renderSlot(_ctx.$slots, "default", { key: 1 })
+            ]),
+            _: 3
+          }, 8, ["id"]),
+          renderSlot(_ctx.$slots, "arrow", {
+            style: normalizeStyle(unref(arrowStyle)),
+            side: unref(side)
+          })
+        ], 10, ["data-side"])) : createCommentVNode("v-if", true)
+      ], 4);
+    };
+  }
+});
+var TooltipV2Content = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "content.vue"]]);
 
-export { tooltipV2ContentProps };
+export { TooltipV2Content as default };
 //# sourceMappingURL=content2.mjs.map

package/es/components/tooltip-v2/src/content2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"content2.mjs","sources":["../../../../../../packages/components/tooltip-v2/src/content.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport { useAriaProps } from '@element-plus/hooks'\n\nimport type { PopperEffect } from '@element-plus/components/popper'\nimport type { ExtractPropTypes } from 'vue'\nimport type { Placement, Strategy, VirtualElement } from '@floating-ui/dom'\n\nconst tooltipV2Strategies = ['absolute', 'fixed'] as const\n\nconst tooltipV2Placements = [\n  'top-start',\n  'top-end',\n  'top',\n  'bottom-start',\n  'bottom-end',\n  'bottom',\n  'left-start',\n  'left-end',\n  'left',\n  'right-start',\n  'right-end',\n  'right',\n] as const\n\nexport const tooltipV2ContentProps = buildProps({\n  arrowPadding: {\n    type: definePropType<number>(Number),\n    default: 5,\n  },\n  effect: {\n    type: definePropType<PopperEffect>(String),\n    default: 'light',\n  },\n  contentClass: String,\n  /**\n   * Placement of tooltip content relative to reference element (when absent it refers to trigger)\n   */\n  placement: {\n    type: definePropType<Placement>(String),\n    values: tooltipV2Placements,\n    default: 'bottom',\n  },\n  /**\n   * Reference element for tooltip content to set its position\n   */\n  reference: {\n    type: definePropType<HTMLElement | VirtualElement | null>(Object),\n    default: null,\n  },\n  offset: {\n    type: Number,\n    default: 8,\n  },\n  strategy: {\n    type: definePropType<Strategy>(String),\n    values: tooltipV2Strategies,\n    default: 'absolute',\n  },\n  showArrow: Boolean,\n  ...useAriaProps(['ariaLabel']),\n} as const)\n\nexport type TooltipV2ContentProps = ExtractPropTypes<\n  typeof tooltipV2ContentProps\n>\n"],"names":[],"mappings":";;;AAEA,MAAM,mBAAmB,GAAG,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;AAClD,MAAM,mBAAmB,GAAG;AAC5B,EAAE,WAAW;AACb,EAAE,SAAS;AACX,EAAE,KAAK;AACP,EAAE,cAAc;AAChB,EAAE,YAAY;AACd,EAAE,QAAQ;AACV,EAAE,YAAY;AACd,EAAE,UAAU;AACZ,EAAE,MAAM;AACR,EAAE,aAAa;AACf,EAAE,WAAW;AACb,EAAE,OAAO;AACT,CAAC,CAAC;AACU,MAAC,qBAAqB,GAAG,UAAU,CAAC;AAChD,EAAE,YAAY,EAAE;AAChB,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,YAAY,EAAE,MAAM;AACtB,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,MAAM,EAAE,mBAAmB;AAC/B,IAAI,OAAO,EAAE,QAAQ;AACrB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,MAAM,EAAE,mBAAmB;AAC/B,IAAI,OAAO,EAAE,UAAU;AACvB,GAAG;AACH,EAAE,SAAS,EAAE,OAAO;AACpB,EAAE,GAAG,YAAY,CAAC,CAAC,WAAW,CAAC,CAAC;AAChC,CAAC;;;;"}
+{"version":3,"file":"content2.mjs","sources":["../../../../../../packages/components/tooltip-v2/src/content.vue"],"sourcesContent":["<template>\n  <div ref=\"contentRef\" :style=\"contentStyle\" data-tooltip-v2-root>\n    <div v-if=\"!nowrap\" :data-side=\"side\" :class=\"contentClass\">\n      <slot :content-style=\"contentStyle\" :content-class=\"contentClass\" />\n      <el-visually-hidden :id=\"contentId\" role=\"tooltip\">\n        <template v-if=\"ariaLabel\">\n          {{ ariaLabel }}\n        </template>\n        <slot v-else />\n      </el-visually-hidden>\n      <slot name=\"arrow\" :style=\"arrowStyle\" :side=\"side\" />\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, inject, onMounted, provide, ref, unref, watch } from 'vue'\nimport { offset } from '@floating-ui/dom'\nimport {\n  arrowMiddleware,\n  useFloating,\n  useNamespace,\n  useZIndex,\n} from '@element-plus/hooks'\nimport ElVisuallyHidden from '@element-plus/components/visual-hidden'\nimport { tooltipV2ContentKey, tooltipV2RootKey } from './constants'\nimport { tooltipV2ContentProps } from './content'\nimport { tooltipV2CommonProps } from './common'\n\nimport type { TooltipV2Sides } from './common'\nimport type { CSSProperties } from 'vue'\nimport type { Middleware } from '@floating-ui/dom'\n\ndefineOptions({\n  name: 'ElTooltipV2Content',\n})\n\nconst props = defineProps({ ...tooltipV2ContentProps, ...tooltipV2CommonProps })\n\nconst { triggerRef, contentId } = inject(tooltipV2RootKey)!\n\nconst placement = ref(props.placement)\nconst strategy = ref(props.strategy)\nconst arrowRef = ref<HTMLElement | null>(null)\n\nconst { referenceRef, contentRef, middlewareData, x, y, update } = useFloating({\n  placement,\n  strategy,\n  middleware: computed(() => {\n    const middleware: Middleware[] = [offset(props.offset)]\n\n    if (props.showArrow) {\n      middleware.push(\n        arrowMiddleware({\n          arrowRef,\n        })\n      )\n    }\n\n    return middleware\n  }),\n})\n\nconst zIndex = useZIndex().nextZIndex()\n\nconst ns = useNamespace('tooltip-v2')\n\nconst side = computed(() => {\n  return placement.value.split('-')[0] as TooltipV2Sides\n})\n\nconst contentStyle = computed<CSSProperties>(() => {\n  return {\n    position: unref(strategy),\n    top: `${unref(y) || 0}px`,\n    left: `${unref(x) || 0}px`,\n    zIndex,\n  }\n})\n\nconst arrowStyle = computed<CSSProperties>(() => {\n  if (!props.showArrow) return {}\n\n  const { arrow } = unref(middlewareData)\n\n  return {\n    [`--${ns.namespace.value}-tooltip-v2-arrow-x`]: `${arrow?.x}px` || '',\n    [`--${ns.namespace.value}-tooltip-v2-arrow-y`]: `${arrow?.y}px` || '',\n  }\n})\n\nconst contentClass = computed(() => [\n  ns.e('content'),\n  ns.is('dark', props.effect === 'dark'),\n  ns.is(unref(strategy)),\n  props.contentClass,\n])\n\nwatch(arrowRef, () => update())\n\nwatch(\n  () => props.placement,\n  (val) => (placement.value = val)\n)\n\nonMounted(() => {\n  watch(\n    () => props.reference || triggerRef.value,\n    (el) => {\n      referenceRef.value = el || undefined\n    },\n    {\n      immediate: true,\n    }\n  )\n})\n\nprovide(tooltipV2ContentKey, { arrowRef })\n</script>\n"],"names":["_openBlock","_createElementBlock","_normalizeStyle","_unref"],"mappings":"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"}

package/es/components/tooltip-v2/src/tooltip.d.ts

@@ -4,7 +4,7 @@ export declare const tooltipV2Props: {
     readonly fullTransition: BooleanConstructor;
     readonly transitionProps: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => TransitionProps) | (() => TransitionProps | null) | ((new (...args: any[]) => TransitionProps) | (() => TransitionProps | null))[], unknown, unknown, null, boolean>;
     readonly teleported: BooleanConstructor;
-    readonly to: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | import("vue").RendererElement) | (() => string | import("vue").RendererElement | null | undefined) | ((new (...args: any[]) => string | import("vue").RendererElement) | (() => string | import("vue").RendererElement | null | undefined))[], unknown, unknown, "body", boolean>;
+    readonly to: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown, "body", boolean>;
     readonly ariaLabel: StringConstructor;
     readonly arrowPadding: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => number) | (() => number) | ((new (...args: any[]) => number) | (() => number))[], unknown, unknown, 5, boolean>;
     readonly effect: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => import("element-plus").PopperEffect) | ((new (...args: any[]) => string) | (() => import("element-plus").PopperEffect))[], unknown, unknown, "light", boolean>;

package/es/components/tooltip-v2/src/tooltip.mjs

@@ -1,7 +1,7 @@
 import { tooltipV2RootProps } from './root.mjs';
 import { tooltipV2TriggerProps } from './trigger.mjs';
-import { tooltipV2ArrowProps } from './arrow2.mjs';
-import { tooltipV2ContentProps } from './content2.mjs';
+import { tooltipV2ArrowProps } from './arrow.mjs';
+import { tooltipV2ContentProps } from './content.mjs';
 import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
 
 const tooltipV2Props = buildProps({
@@ -17,7 +17,7 @@ const tooltipV2Props = buildProps({
   },
   teleported: Boolean,
   to: {
-    type: definePropType(String),
+    type: definePropType([String, Object]),
     default: "body"
   }
 });

package/es/components/tooltip-v2/src/tooltip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.mjs","sources":["../../../../../../packages/components/tooltip-v2/src/tooltip.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport { tooltipV2RootProps } from './root'\nimport { tooltipV2TriggerProps } from './trigger'\nimport { tooltipV2ArrowProps } from './arrow'\nimport { tooltipV2ContentProps } from './content'\n\nimport type { ExtractPropTypes, TeleportProps, TransitionProps } from 'vue'\n\nexport const tooltipV2Props = buildProps({\n  ...tooltipV2RootProps,\n  ...tooltipV2ArrowProps,\n  ...tooltipV2TriggerProps,\n  ...tooltipV2ContentProps,\n  alwaysOn: Boolean,\n  fullTransition: Boolean,\n  transitionProps: {\n    type: definePropType<TransitionProps | null>(Object),\n    default: null,\n  },\n  teleported: Boolean,\n  to: {\n    type: definePropType<TeleportProps['to']>(String),\n    default: 'body',\n  },\n} as const)\n\nexport type TooltipV2Props = ExtractPropTypes<typeof tooltipV2Props>\n"],"names":[],"mappings":";;;;;;AAKY,MAAC,cAAc,GAAG,UAAU,CAAC;AACzC,EAAE,GAAG,kBAAkB;AACvB,EAAE,GAAG,mBAAmB;AACxB,EAAE,GAAG,qBAAqB;AAC1B,EAAE,GAAG,qBAAqB;AAC1B,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,cAAc,EAAE,OAAO;AACzB,EAAE,eAAe,EAAE;AACnB,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,UAAU,EAAE,OAAO;AACrB,EAAE,EAAE,EAAE;AACN,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,CAAC;;;;"}
+{"version":3,"file":"tooltip.mjs","sources":["../../../../../../packages/components/tooltip-v2/src/tooltip.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport { tooltipV2RootProps } from './root'\nimport { tooltipV2TriggerProps } from './trigger'\nimport { tooltipV2ArrowProps } from './arrow'\nimport { tooltipV2ContentProps } from './content'\n\nimport type { ExtractPropTypes, TransitionProps } from 'vue'\n\nexport const tooltipV2Props = buildProps({\n  ...tooltipV2RootProps,\n  ...tooltipV2ArrowProps,\n  ...tooltipV2TriggerProps,\n  ...tooltipV2ContentProps,\n  alwaysOn: Boolean,\n  fullTransition: Boolean,\n  transitionProps: {\n    type: definePropType<TransitionProps | null>(Object),\n    default: null,\n  },\n  teleported: Boolean,\n  to: {\n    type: definePropType<string | HTMLElement>([String, Object]),\n    default: 'body',\n  },\n} as const)\n\nexport type TooltipV2Props = ExtractPropTypes<typeof tooltipV2Props>\n"],"names":[],"mappings":";;;;;;AAKY,MAAC,cAAc,GAAG,UAAU,CAAC;AACzC,EAAE,GAAG,kBAAkB;AACvB,EAAE,GAAG,mBAAmB;AACxB,EAAE,GAAG,qBAAqB;AAC1B,EAAE,GAAG,qBAAqB;AAC1B,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,cAAc,EAAE,OAAO;AACzB,EAAE,eAAe,EAAE;AACnB,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,UAAU,EAAE,OAAO;AACrB,EAAE,EAAE,EAAE;AACN,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,CAAC;;;;"}

package/es/components/tooltip-v2/src/tooltip.vue.d.ts

@@ -8,7 +8,7 @@ declare const __VLS_component: import("vue").DefineComponent<{
     readonly fullTransition: BooleanConstructor;
     readonly transitionProps: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => import("vue").TransitionProps) | (() => import("vue").TransitionProps | null) | ((new (...args: any[]) => import("vue").TransitionProps) | (() => import("vue").TransitionProps | null))[], unknown, unknown, null, boolean>;
     readonly teleported: BooleanConstructor;
-    readonly to: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | import("vue").RendererElement) | (() => string | import("vue").RendererElement | null | undefined) | ((new (...args: any[]) => string | import("vue").RendererElement) | (() => string | import("vue").RendererElement | null | undefined))[], unknown, unknown, "body", boolean>;
+    readonly to: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown, "body", boolean>;
     readonly ariaLabel: StringConstructor;
     readonly arrowPadding: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => number) | (() => number) | ((new (...args: any[]) => number) | (() => number))[], unknown, unknown, 5, boolean>;
     readonly effect: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => import("element-plus").PopperEffect) | ((new (...args: any[]) => string) | (() => import("element-plus").PopperEffect))[], unknown, unknown, "light", boolean>;
@@ -77,7 +77,7 @@ declare const __VLS_component: import("vue").DefineComponent<{
     readonly fullTransition: BooleanConstructor;
     readonly transitionProps: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => import("vue").TransitionProps) | (() => import("vue").TransitionProps | null) | ((new (...args: any[]) => import("vue").TransitionProps) | (() => import("vue").TransitionProps | null))[], unknown, unknown, null, boolean>;
     readonly teleported: BooleanConstructor;
-    readonly to: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | import("vue").RendererElement) | (() => string | import("vue").RendererElement | null | undefined) | ((new (...args: any[]) => string | import("vue").RendererElement) | (() => string | import("vue").RendererElement | null | undefined))[], unknown, unknown, "body", boolean>;
+    readonly to: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown, "body", boolean>;
     readonly ariaLabel: StringConstructor;
     readonly arrowPadding: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => number) | (() => number) | ((new (...args: any[]) => number) | (() => number))[], unknown, unknown, 5, boolean>;
     readonly effect: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => string) | (() => import("element-plus").PopperEffect) | ((new (...args: any[]) => string) | (() => import("element-plus").PopperEffect))[], unknown, unknown, "light", boolean>;
@@ -147,7 +147,7 @@ declare const __VLS_component: import("vue").DefineComponent<{
     readonly width: number;
     readonly offset: number;
     readonly open: import("@element-plus/nightly/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
-    readonly to: import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => string | import("vue").RendererElement) | (() => string | import("vue").RendererElement | null | undefined) | ((new (...args: any[]) => string | import("vue").RendererElement) | (() => string | import("vue").RendererElement | null | undefined))[], unknown, unknown>;
+    readonly to: import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | ((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement))[], unknown, unknown>;
     readonly placement: import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => "top" | "bottom" | "left" | "right" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("@floating-ui/core").Placement) | ((new (...args: any[]) => "top" | "bottom" | "left" | "right" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end") | (() => import("@floating-ui/core").Placement))[], "top" | "bottom" | "left" | "right" | "top-start" | "top-end" | "bottom-start" | "bottom-end" | "right-start" | "right-end" | "left-start" | "left-end", unknown>;
     readonly strategy: import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => "fixed" | "absolute") | (() => import("@floating-ui/core").Strategy) | ((new (...args: any[]) => "fixed" | "absolute") | (() => import("@floating-ui/core").Strategy))[], "fixed" | "absolute", unknown>;
     readonly reference: import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => HTMLElement | import("@floating-ui/dom").VirtualElement) | (() => HTMLElement | import("@floating-ui/dom").VirtualElement | null) | ((new (...args: any[]) => HTMLElement | import("@floating-ui/dom").VirtualElement) | (() => HTMLElement | import("@floating-ui/dom").VirtualElement | null))[], unknown, unknown>;

package/es/components/tooltip-v2/src/tooltip2.mjs

@@ -1,14 +1,14 @@
 import { defineComponent, toRefs, reactive, openBlock, createBlock, normalizeProps, guardReactiveProps, withCtx, createVNode, mergeProps, renderSlot, unref, Transition, createCommentVNode, createElementBlock, Fragment } from 'vue';
 import { pick } from 'lodash-unified';
 import { ElTeleport } from '../../teleport/index.mjs';
-import { tooltipV2ArrowProps } from './arrow2.mjs';
-import { tooltipV2ContentProps } from './content2.mjs';
+import { tooltipV2ArrowProps } from './arrow.mjs';
+import { tooltipV2ContentProps } from './content.mjs';
 import { tooltipV2RootProps } from './root.mjs';
 import { tooltipV2Props } from './tooltip.mjs';
 import { tooltipV2TriggerProps } from './trigger.mjs';
 import TooltipV2Root from './root2.mjs';
-import TooltipV2Arrow from './arrow.mjs';
-import TooltipV2Content from './content.mjs';
+import TooltipV2Arrow from './arrow2.mjs';
+import TooltipV2Content from './content2.mjs';
 import TooltipV2Trigger from './trigger2.mjs';
 import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
 

package/es/components/tooltip-v2/src/tooltip2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip2.mjs","sources":["../../../../../../packages/components/tooltip-v2/src/tooltip.vue"],"sourcesContent":["<template>\n  <tooltip-v2-root v-bind=\"rootProps\">\n    <template #default=\"{ open }\">\n      <tooltip-v2-trigger v-bind=\"triggerProps\" nowrap>\n        <slot name=\"trigger\" />\n      </tooltip-v2-trigger>\n      <el-teleport :to=\"to\" :disabled=\"!teleported\">\n        <template v-if=\"fullTransition\">\n          <transition v-bind=\"transitionProps\">\n            <tooltip-v2-content v-if=\"alwaysOn || open\" v-bind=\"contentProps\">\n              <slot />\n              <template #arrow=\"{ style, side }\">\n                <tooltip-v2-arrow\n                  v-if=\"showArrow\"\n                  v-bind=\"arrowProps\"\n                  :style=\"style\"\n                  :side=\"side\"\n                />\n              </template>\n            </tooltip-v2-content>\n          </transition>\n        </template>\n        <template v-else>\n          <tooltip-v2-content v-if=\"alwaysOn || open\" v-bind=\"contentProps\">\n            <slot />\n            <template #arrow=\"{ style, side }\">\n              <tooltip-v2-arrow\n                v-if=\"showArrow\"\n                v-bind=\"arrowProps\"\n                :style=\"style\"\n                :side=\"side\"\n              />\n            </template>\n          </tooltip-v2-content>\n        </template>\n      </el-teleport>\n    </template>\n  </tooltip-v2-root>\n</template>\n\n<script setup lang=\"ts\">\n// @ts-nocheck\nimport { reactive, toRefs } from 'vue'\nimport { pick } from 'lodash-unified'\nimport ElTeleport from '@element-plus/components/teleport'\nimport { tooltipV2ArrowProps } from './arrow'\nimport { tooltipV2ContentProps } from './content'\nimport { tooltipV2RootProps } from './root'\nimport { tooltipV2Props } from './tooltip'\nimport { tooltipV2TriggerProps } from './trigger'\nimport TooltipV2Root from './root.vue'\nimport TooltipV2Arrow from './arrow.vue'\nimport TooltipV2Content from './content.vue'\nimport TooltipV2Trigger from './trigger.vue'\n\ndefineOptions({\n  name: 'ElTooltipV2',\n})\n\nconst props = defineProps(tooltipV2Props)\n\nconst refedProps = toRefs(props)\n\nconst arrowProps = reactive(pick(refedProps, Object.keys(tooltipV2ArrowProps)))\n\nconst contentProps = reactive(\n  pick(refedProps, Object.keys(tooltipV2ContentProps))\n)\n\nconst rootProps = reactive(pick(refedProps, Object.keys(tooltipV2RootProps)))\n\nconst triggerProps = reactive(\n  pick(refedProps, Object.keys(tooltipV2TriggerProps))\n)\n</script>\n"],"names":["_openBlock","_createBlock","_normalizeProps","_guardReactiveProps","_withCtx","_createVNode","_mergeProps"],"mappings":";;;;;;;;;;;;;;mCAuDc,CAAA;AAAA,EACZ,IAAM,EAAA,aAAA;AACR,CAAA,CAAA,CAAA;;;;;;AAIA,IAAM,MAAA,UAAA,GAAa,OAAO,KAAK,CAAA,CAAA;AAE/B,IAAM,MAAA,UAAA,GAAa,SAAS,IAAK,CAAA,UAAA,EAAY,OAAO,IAAK,CAAA,mBAAmB,CAAC,CAAC,CAAA,CAAA;AAE9E,IAAA,MAAM,YAAe,GAAA,QAAA,CAAA,IAAA,CAAA,UAAA,EAAA,MAAA,CAAA,IAAA,CAAA,qBAAA,CAAA,CAAA,CAAA,CAAA;AAAA,IAAA,MACd,SAAA,GAAA,QAAmB,CAAA,IAAK,wBAAsB,CAAA,kBAAA,CAAA,CAAA,CAAA,CAAA;AAAA,IACrD,MAAA,YAAA,GAAA,QAAA,CAAA,IAAA,CAAA,UAAA,EAAA,MAAA,CAAA,IAAA,CAAA,qBAAA,CAAA,CAAA,CAAA,CAAA;AAEA,IAAM,OAAA,CAAA,IAAA,EAAA;AAEN,MAAA,OAAqBA,SAAA,EAAA,EAAAC,WAAA,CAAA,aAAA,EAAAC,cAAA,CAAAC,kBAAA,CAAA,SAAA,CAAA,CAAA,EAAA;AAAA,QACd,OAAA,EAAAC,OAAmB,CAAA,CAAA,EAAA,IAAA,EAAK;AAAsB,UACrDC,WAAA,CAAA,gBAAA,EAAAC,UAAA,CAAA,YAAA,EAAA,EAAA,MAAA,EAAA,EAAA,EAAA,CAAA,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"tooltip2.mjs","sources":["../../../../../../packages/components/tooltip-v2/src/tooltip.vue"],"sourcesContent":["<template>\n  <tooltip-v2-root v-bind=\"rootProps\">\n    <template #default=\"{ open }\">\n      <tooltip-v2-trigger v-bind=\"triggerProps\" nowrap>\n        <slot name=\"trigger\" />\n      </tooltip-v2-trigger>\n      <el-teleport :to=\"to\" :disabled=\"!teleported\">\n        <template v-if=\"fullTransition\">\n          <transition v-bind=\"transitionProps\">\n            <tooltip-v2-content v-if=\"alwaysOn || open\" v-bind=\"contentProps\">\n              <slot />\n              <template #arrow=\"{ style, side }\">\n                <tooltip-v2-arrow\n                  v-if=\"showArrow\"\n                  v-bind=\"arrowProps\"\n                  :style=\"style\"\n                  :side=\"side\"\n                />\n              </template>\n            </tooltip-v2-content>\n          </transition>\n        </template>\n        <template v-else>\n          <tooltip-v2-content v-if=\"alwaysOn || open\" v-bind=\"contentProps\">\n            <slot />\n            <template #arrow=\"{ style, side }\">\n              <tooltip-v2-arrow\n                v-if=\"showArrow\"\n                v-bind=\"arrowProps\"\n                :style=\"style\"\n                :side=\"side\"\n              />\n            </template>\n          </tooltip-v2-content>\n        </template>\n      </el-teleport>\n    </template>\n  </tooltip-v2-root>\n</template>\n\n<script setup lang=\"ts\">\nimport { reactive, toRefs } from 'vue'\nimport { pick } from 'lodash-unified'\nimport ElTeleport from '@element-plus/components/teleport'\nimport { tooltipV2ArrowProps } from './arrow'\nimport { tooltipV2ContentProps } from './content'\nimport { tooltipV2RootProps } from './root'\nimport { tooltipV2Props } from './tooltip'\nimport { tooltipV2TriggerProps } from './trigger'\nimport TooltipV2Root from './root.vue'\nimport TooltipV2Arrow from './arrow.vue'\nimport TooltipV2Content from './content.vue'\nimport TooltipV2Trigger from './trigger.vue'\n\ndefineOptions({\n  name: 'ElTooltipV2',\n})\n\nconst props = defineProps(tooltipV2Props)\n\nconst refedProps = toRefs(props)\n\nconst arrowProps = reactive(pick(refedProps, Object.keys(tooltipV2ArrowProps)))\n\nconst contentProps = reactive(\n  pick(refedProps, Object.keys(tooltipV2ContentProps))\n)\n\nconst rootProps = reactive(pick(refedProps, Object.keys(tooltipV2RootProps)))\n\nconst triggerProps = reactive(\n  pick(refedProps, Object.keys(tooltipV2TriggerProps))\n)\n</script>\n"],"names":["_openBlock","_createBlock","_normalizeProps","_guardReactiveProps","_withCtx","_createVNode","_mergeProps"],"mappings":";;;;;;;;;;;;;;mCAsDc,CAAA;AAAA,EACZ,IAAM,EAAA,aAAA;AACR,CAAA,CAAA,CAAA;;;;;;AAIA,IAAM,MAAA,UAAA,GAAa,OAAO,KAAK,CAAA,CAAA;AAE/B,IAAM,MAAA,UAAA,GAAa,SAAS,IAAK,CAAA,UAAA,EAAY,OAAO,IAAK,CAAA,mBAAmB,CAAC,CAAC,CAAA,CAAA;AAE9E,IAAA,MAAM,YAAe,GAAA,QAAA,CAAA,IAAA,CAAA,UAAA,EAAA,MAAA,CAAA,IAAA,CAAA,qBAAA,CAAA,CAAA,CAAA,CAAA;AAAA,IAAA,MACd,SAAA,GAAA,QAAmB,CAAA,IAAK,wBAAsB,CAAA,kBAAA,CAAA,CAAA,CAAA,CAAA;AAAA,IACrD,MAAA,YAAA,GAAA,QAAA,CAAA,IAAA,CAAA,UAAA,EAAA,MAAA,CAAA,IAAA,CAAA,qBAAA,CAAA,CAAA,CAAA,CAAA;AAEA,IAAM,OAAA,CAAA,IAAA,EAAA;AAEN,MAAA,OAAqBA,SAAA,EAAA,EAAAC,WAAA,CAAA,aAAA,EAAAC,cAAA,CAAAC,kBAAA,CAAA,SAAA,CAAA,CAAA,EAAA;AAAA,QACd,OAAA,EAAAC,OAAmB,CAAA,CAAA,EAAA,IAAA,EAAK;AAAsB,UACrDC,WAAA,CAAA,gBAAA,EAAAC,UAAA,CAAA,YAAA,EAAA,EAAA,MAAA,EAAA,EAAA,EAAA,CAAA,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/tour/index.mjs

@@ -2,7 +2,7 @@ import Tour from './src/tour2.mjs';
 import TourStep from './src/step2.mjs';
 export { tourEmits, tourProps } from './src/tour.mjs';
 export { tourStepEmits, tourStepProps } from './src/step.mjs';
-export { tourContentEmits, tourContentProps, tourPlacements, tourStrategies } from './src/content.mjs';
+export { tourContentEmits, tourContentProps, tourPlacements, tourStrategies } from './src/content2.mjs';
 import { withInstall, withNoopInstall } from '../../utils/vue/install.mjs';
 
 const ElTour = withInstall(Tour, {

package/es/components/tour/src/content.mjs

@@ -1,48 +1,72 @@
-import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
+import { defineComponent, ref, watch, toRef, computed, inject, openBlock, createElementBlock, normalizeStyle, unref, normalizeClass, createVNode, withCtx, renderSlot, createCommentVNode } from 'vue';
+import ElFocusTrap from '../../focus-trap/src/focus-trap.mjs';
+import { tourContentProps, tourContentEmits } from './content2.mjs';
+import { useFloating, tourKey } from './helper.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
 
-const tourStrategies = ["absolute", "fixed"];
-const tourPlacements = [
-  "top-start",
-  "top-end",
-  "top",
-  "bottom-start",
-  "bottom-end",
-  "bottom",
-  "left-start",
-  "left-end",
-  "left",
-  "right-start",
-  "right-end",
-  "right"
-];
-const tourContentProps = buildProps({
-  placement: {
-    type: definePropType(String),
-    values: tourPlacements,
-    default: "bottom"
-  },
-  reference: {
-    type: definePropType(Object),
-    default: null
-  },
-  strategy: {
-    type: definePropType(String),
-    values: tourStrategies,
-    default: "absolute"
-  },
-  offset: {
-    type: Number,
-    default: 10
-  },
-  showArrow: Boolean,
-  zIndex: {
-    type: Number,
-    default: 2001
+const __default__ = defineComponent({
+  name: "ElTourContent"
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: tourContentProps,
+  emits: tourContentEmits,
+  setup(__props, { emit }) {
+    const props = __props;
+    const placement = ref(props.placement);
+    const strategy = ref(props.strategy);
+    const contentRef = ref(null);
+    const arrowRef = ref(null);
+    watch(() => props.placement, () => {
+      placement.value = props.placement;
+    });
+    const { contentStyle, arrowStyle } = useFloating(toRef(props, "reference"), contentRef, arrowRef, placement, strategy, toRef(props, "offset"), toRef(props, "zIndex"), toRef(props, "showArrow"));
+    const side = computed(() => {
+      return placement.value.split("-")[0];
+    });
+    const { ns } = inject(tourKey);
+    const onCloseRequested = () => {
+      emit("close");
+    };
+    const onFocusoutPrevented = (event) => {
+      if (event.detail.focusReason === "pointer") {
+        event.preventDefault();
+      }
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref_key: "contentRef",
+        ref: contentRef,
+        style: normalizeStyle(unref(contentStyle)),
+        class: normalizeClass(unref(ns).e("content")),
+        "data-side": unref(side),
+        tabindex: "-1"
+      }, [
+        createVNode(unref(ElFocusTrap), {
+          loop: "",
+          trapped: "",
+          "focus-start-el": "container",
+          "focus-trap-el": contentRef.value || void 0,
+          onReleaseRequested: onCloseRequested,
+          onFocusoutPrevented
+        }, {
+          default: withCtx(() => [
+            renderSlot(_ctx.$slots, "default")
+          ]),
+          _: 3
+        }, 8, ["focus-trap-el"]),
+        _ctx.showArrow ? (openBlock(), createElementBlock("span", {
+          key: 0,
+          ref_key: "arrowRef",
+          ref: arrowRef,
+          style: normalizeStyle(unref(arrowStyle)),
+          class: normalizeClass(unref(ns).e("arrow"))
+        }, null, 6)) : createCommentVNode("v-if", true)
+      ], 14, ["data-side"]);
+    };
   }
 });
-const tourContentEmits = {
-  close: () => true
-};
+var ElTourContent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "content.vue"]]);
 
-export { tourContentEmits, tourContentProps, tourPlacements, tourStrategies };
+export { ElTourContent as default };
 //# sourceMappingURL=content.mjs.map

package/es/components/tour/src/content.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"content.mjs","sources":["../../../../../../packages/components/tour/src/content.ts"],"sourcesContent":["import { buildProps, definePropType } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type { Placement, Strategy, VirtualElement } from '@floating-ui/dom'\n\nexport const tourStrategies = ['absolute', 'fixed'] as const\n\nexport const tourPlacements = [\n  'top-start',\n  'top-end',\n  'top',\n  'bottom-start',\n  'bottom-end',\n  'bottom',\n  'left-start',\n  'left-end',\n  'left',\n  'right-start',\n  'right-end',\n  'right',\n] as const\n\nexport const tourContentProps = buildProps({\n  /**\n   * @description position of the guide card relative to the target element\n   */\n  placement: {\n    type: definePropType<Placement>(String),\n    values: tourPlacements,\n    default: 'bottom',\n  },\n  /**\n   * @description the reference dom\n   */\n  reference: {\n    type: definePropType<HTMLElement | VirtualElement | null>(Object),\n    default: null,\n  },\n  /**\n   * @description position strategy of the content\n   */\n  strategy: {\n    type: definePropType<Strategy>(String),\n    values: tourStrategies,\n    default: 'absolute',\n  },\n  /**\n   * @description offset of the arrow\n   */\n  offset: {\n    type: Number,\n    default: 10,\n  },\n  /**\n   * @description @description whether to show the arrow\n   */\n  showArrow: Boolean,\n  /**\n   * @description content's zIndex\n   */\n  zIndex: {\n    type: Number,\n    default: 2001,\n  },\n})\n\nexport type TourContentProps = ExtractPropTypes<typeof tourContentProps>\n\nexport const tourContentEmits = {\n  close: () => true,\n}\nexport type TourContentEmits = typeof tourContentEmits\n"],"names":[],"mappings":";;AACY,MAAC,cAAc,GAAG,CAAC,UAAU,EAAE,OAAO,EAAE;AACxC,MAAC,cAAc,GAAG;AAC9B,EAAE,WAAW;AACb,EAAE,SAAS;AACX,EAAE,KAAK;AACP,EAAE,cAAc;AAChB,EAAE,YAAY;AACd,EAAE,QAAQ;AACV,EAAE,YAAY;AACd,EAAE,UAAU;AACZ,EAAE,MAAM;AACR,EAAE,aAAa;AACf,EAAE,WAAW;AACb,EAAE,OAAO;AACT,EAAE;AACU,MAAC,gBAAgB,GAAG,UAAU,CAAC;AAC3C,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,MAAM,EAAE,cAAc;AAC1B,IAAI,OAAO,EAAE,QAAQ;AACrB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,MAAM,EAAE,cAAc;AAC1B,IAAI,OAAO,EAAE,UAAU;AACvB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE,OAAO;AACpB,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,gBAAgB,GAAG;AAChC,EAAE,KAAK,EAAE,MAAM,IAAI;AACnB;;;;"}
+{"version":3,"file":"content.mjs","sources":["../../../../../../packages/components/tour/src/content.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"contentRef\"\n    :style=\"contentStyle\"\n    :class=\"ns.e('content')\"\n    :data-side=\"side\"\n    tabindex=\"-1\"\n  >\n    <el-focus-trap\n      loop\n      trapped\n      focus-start-el=\"container\"\n      :focus-trap-el=\"contentRef || undefined\"\n      @release-requested=\"onCloseRequested\"\n      @focusout-prevented=\"onFocusoutPrevented\"\n    >\n      <slot />\n    </el-focus-trap>\n    <span\n      v-if=\"showArrow\"\n      ref=\"arrowRef\"\n      :style=\"arrowStyle\"\n      :class=\"ns.e('arrow')\"\n    />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, inject, ref, toRef, watch } from 'vue'\nimport ElFocusTrap from '@element-plus/components/focus-trap'\nimport { tourContentEmits, tourContentProps } from './content'\nimport { tourKey, useFloating } from './helper'\n\ndefineOptions({\n  name: 'ElTourContent',\n})\n\nconst props = defineProps(tourContentProps)\nconst emit = defineEmits(tourContentEmits)\n\nconst placement = ref(props.placement)\nconst strategy = ref(props.strategy)\nconst contentRef = ref<HTMLElement | null>(null)\nconst arrowRef = ref<HTMLElement | null>(null)\n\nwatch(\n  () => props.placement,\n  () => {\n    placement.value = props.placement\n  }\n)\n\nconst { contentStyle, arrowStyle } = useFloating(\n  toRef(props, 'reference'),\n  contentRef,\n  arrowRef,\n  placement,\n  strategy,\n  toRef(props, 'offset'),\n  toRef(props, 'zIndex'),\n  toRef(props, 'showArrow')\n)\n\nconst side = computed(() => {\n  return placement.value.split('-')[0]\n})\n\nconst { ns } = inject(tourKey)!\n\nconst onCloseRequested = () => {\n  emit('close')\n}\n\nconst onFocusoutPrevented = (event: CustomEvent) => {\n  if (event.detail.focusReason === 'pointer') {\n    event.preventDefault()\n  }\n}\n</script>\n"],"names":["_openBlock","_createElementBlock","_unref","_normalizeClass","_createVNode"],"mappings":";;;;;;mCAiCc,CAAA;AAAA,EACZ,IAAM,EAAA,eAAA;AACR,CAAA,CAAA,CAAA;;;;;;;AAKA,IAAM,MAAA,SAAA,GAAY,GAAI,CAAA,KAAA,CAAM,SAAS,CAAA,CAAA;AACrC,IAAM,MAAA,QAAA,GAAW,GAAI,CAAA,KAAA,CAAM,QAAQ,CAAA,CAAA;AACnC,IAAM,MAAA,UAAA,GAAa,IAAwB,IAAI,CAAA,CAAA;AAC/C,IAAM,MAAA,QAAA,GAAW,IAAwB,IAAI,CAAA,CAAA;AAE7C,IAAA,KAAA,CAAA,MAAA,KAAA,CAAA,SAAA,EAAA,MAAA;AAAA,MACE,SAAY,CAAA,KAAA,GAAA,KAAA,CAAA,SAAA,CAAA;AAAA,KAAA,CACZ,CAAM;AACJ,IAAA,MAAA,EAAA,cAAkB,UAAM,EAAA,GAAA,WAAA,CAAA,KAAA,CAAA,KAAA,EAAA,WAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,SAAA,EAAA,QAAA,EAAA,KAAA,CAAA,KAAA,EAAA,QAAA,CAAA,EAAA,KAAA,CAAA,KAAA,EAAA,QAAA,CAAA,EAAA,KAAA,CAAA,KAAA,EAAA,WAAA,CAAA,CAAA,CAAA;AAAA,IAC1B,MAAA,IAAA,GAAA,QAAA,CAAA,MAAA;AAAA,MACF,OAAA,SAAA,CAAA,KAAA,CAAA,KAAA,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAEA,KAAM,CAAA,CAAA;AAA+B,IACnC,MAAA,EAAM,OAAO,MAAW,CAAA,OAAA,CAAA,CAAA;AAAA,IACxB,MAAA,gBAAA,GAAA,MAAA;AAAA,MACA,IAAA,CAAA,OAAA,CAAA,CAAA;AAAA,KACA,CAAA;AAAA,IACA,MAAA,mBAAA,GAAA,CAAA,KAAA,KAAA;AAAA,MACA,IAAA,YAAqB,CAAA,WAAA,KAAA,SAAA,EAAA;AAAA,QACrB,oBAAqB,EAAA,CAAA;AAAA,OACrB;AAAwB,KAC1B,CAAA;AAEA,IAAM,OAAA,CAAA,IAAA,aAAsB;AAC1B,MAAA,OAAOA,SAAU,EAAA,EAAAC,kBAAkB,CAAA,KAAA,EAAA;AAAA,QACpC,OAAA,EAAA,YAAA;AAED,QAAA,GAAQ,EAAA,UAAO;AAEf,QAAA,qBAA+B,CAAAC,KAAA,CAAA,YAAA,CAAA,CAAA;AAC7B,QAAA,KAAY,EAAAC,cAAA,CAAAD,KAAA,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,SAAA,CAAA,CAAA;AAAA,QACd,WAAA,EAAAA,KAAA,CAAA,IAAA,CAAA;AAEA,QAAM,QAAA,EAAA,IAAA;AACJ,OAAI,EAAA;AACF,QAAAE,WAAqB,CAAAF,KAAA,CAAA,WAAA,CAAA,EAAA;AAAA,UACvB,IAAA,EAAA,EAAA;AAAA,UACF,OAAA,EAAA,EAAA;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/tour/src/content2.mjs

@@ -1,72 +1,48 @@
-import { defineComponent, ref, watch, toRef, computed, inject, openBlock, createElementBlock, normalizeStyle, unref, normalizeClass, createVNode, withCtx, renderSlot, createCommentVNode } from 'vue';
-import ElFocusTrap from '../../focus-trap/src/focus-trap.mjs';
-import { tourContentProps, tourContentEmits } from './content.mjs';
-import { useFloating, tourKey } from './helper.mjs';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
 
-const __default__ = defineComponent({
-  name: "ElTourContent"
-});
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: tourContentProps,
-  emits: tourContentEmits,
-  setup(__props, { emit }) {
-    const props = __props;
-    const placement = ref(props.placement);
-    const strategy = ref(props.strategy);
-    const contentRef = ref(null);
-    const arrowRef = ref(null);
-    watch(() => props.placement, () => {
-      placement.value = props.placement;
-    });
-    const { contentStyle, arrowStyle } = useFloating(toRef(props, "reference"), contentRef, arrowRef, placement, strategy, toRef(props, "offset"), toRef(props, "zIndex"), toRef(props, "showArrow"));
-    const side = computed(() => {
-      return placement.value.split("-")[0];
-    });
-    const { ns } = inject(tourKey);
-    const onCloseRequested = () => {
-      emit("close");
-    };
-    const onFocusoutPrevented = (event) => {
-      if (event.detail.focusReason === "pointer") {
-        event.preventDefault();
-      }
-    };
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        ref_key: "contentRef",
-        ref: contentRef,
-        style: normalizeStyle(unref(contentStyle)),
-        class: normalizeClass(unref(ns).e("content")),
-        "data-side": unref(side),
-        tabindex: "-1"
-      }, [
-        createVNode(unref(ElFocusTrap), {
-          loop: "",
-          trapped: "",
-          "focus-start-el": "container",
-          "focus-trap-el": contentRef.value || void 0,
-          onReleaseRequested: onCloseRequested,
-          onFocusoutPrevented
-        }, {
-          default: withCtx(() => [
-            renderSlot(_ctx.$slots, "default")
-          ]),
-          _: 3
-        }, 8, ["focus-trap-el"]),
-        _ctx.showArrow ? (openBlock(), createElementBlock("span", {
-          key: 0,
-          ref_key: "arrowRef",
-          ref: arrowRef,
-          style: normalizeStyle(unref(arrowStyle)),
-          class: normalizeClass(unref(ns).e("arrow"))
-        }, null, 6)) : createCommentVNode("v-if", true)
-      ], 14, ["data-side"]);
-    };
+const tourStrategies = ["absolute", "fixed"];
+const tourPlacements = [
+  "top-start",
+  "top-end",
+  "top",
+  "bottom-start",
+  "bottom-end",
+  "bottom",
+  "left-start",
+  "left-end",
+  "left",
+  "right-start",
+  "right-end",
+  "right"
+];
+const tourContentProps = buildProps({
+  placement: {
+    type: definePropType(String),
+    values: tourPlacements,
+    default: "bottom"
+  },
+  reference: {
+    type: definePropType(Object),
+    default: null
+  },
+  strategy: {
+    type: definePropType(String),
+    values: tourStrategies,
+    default: "absolute"
+  },
+  offset: {
+    type: Number,
+    default: 10
+  },
+  showArrow: Boolean,
+  zIndex: {
+    type: Number,
+    default: 2001
   }
 });
-var ElTourContent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "content.vue"]]);
+const tourContentEmits = {
+  close: () => true
+};
 
-export { ElTourContent as default };
+export { tourContentEmits, tourContentProps, tourPlacements, tourStrategies };
 //# sourceMappingURL=content2.mjs.map