@varlet/ui 2.13.5-alpha.1690452851997 → 2.13.5-alpha.1690486822677

package/es/index.bundle.mjs

@@ -244,7 +244,7 @@ import './time-picker/style/index.mjs'
 import './tooltip/style/index.mjs'
 import './uploader/style/index.mjs'
 
-const version = '2.13.5-alpha.1690452851997'
+const version = '2.13.5-alpha.1690486822677'
 
 function install(app) {
   ActionSheet.install && app.use(ActionSheet)

package/es/index.mjs

@@ -162,7 +162,7 @@ export * from './time-picker/index.mjs'
 export * from './tooltip/index.mjs'
 export * from './uploader/index.mjs'
 
-const version = '2.13.5-alpha.1690452851997'
+const version = '2.13.5-alpha.1690486822677'
 
 function install(app) {
   ActionSheet.install && app.use(ActionSheet)

package/es/menu/Menu.mjs

@@ -1,4 +1,4 @@
-import { createNamespace, formatElevation } from '../utils/components.mjs';
+import { createNamespace, formatElevation, useTeleport } from '../utils/components.mjs';
 import { defineComponent } from 'vue';
 import { props } from './props.mjs';
 import { usePopover } from './usePopover.mjs';
@@ -22,7 +22,8 @@ function __render__(_ctx, _cache) {
       return _ctx.handleHostMouseleave && _ctx.handleHostMouseleave(...arguments);
     })
   }, [_renderSlot(_ctx.$slots, "default"), (_openBlock(), _createBlock(_Teleport, {
-    to: _ctx.teleport
+    to: _ctx.teleport,
+    disabled: _ctx.teleportDisabled
   }, [_createVNode(_Transition, {
     name: _ctx.n(),
     onAfterEnter: _ctx.onOpened,
@@ -45,13 +46,16 @@ function __render__(_ctx, _cache) {
       })
     }, [_renderSlot(_ctx.$slots, "menu")], 38 /* CLASS, STYLE, HYDRATE_EVENTS */), [[_vShow, _ctx.show]])]),
     _: 3 /* FORWARDED */
-  }, 8 /* PROPS */, ["name", "onAfterEnter", "onAfterLeave"])], 8 /* PROPS */, ["to"]))], 34 /* CLASS, HYDRATE_EVENTS */);
+  }, 8 /* PROPS */, ["name", "onAfterEnter", "onAfterLeave"])], 8 /* PROPS */, ["to", "disabled"]))], 34 /* CLASS, HYDRATE_EVENTS */);
 }
 
 var __sfc__ = defineComponent({
   name: 'VarMenu',
   props,
   setup(props) {
+    var {
+      disabled: teleportDisabled
+    } = useTeleport();
     var {
       popover,
       host,
@@ -78,6 +82,7 @@ var __sfc__ = defineComponent({
       hostSize,
       show,
       zIndex,
+      teleportDisabled,
       formatElevation,
       toSizeUnit,
       n,

package/es/menu/props.mjs

@@ -5,6 +5,9 @@ function triggerValidator(trigger) {
 function placementValidator(alignment) {
   return ['top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end', 'right', 'right-start', 'right-end', 'left', 'left-start', 'left-end', 'cover-top', 'cover-top-start', 'cover-top-end', 'cover-bottom', 'cover-bottom-start', 'cover-bottom-end', 'cover-left', 'cover-right'].includes(alignment);
 }
+function strategyValidator(strategy) {
+  return ['absolute', 'fixed'].includes(strategy);
+}
 export var props = {
   show: {
     type: Boolean,
@@ -27,6 +30,11 @@ export var props = {
     default: 'cover-top-start',
     validator: placementValidator
   },
+  strategy: {
+    type: String,
+    default: 'absolute',
+    validator: strategyValidator
+  },
   offsetX: {
     type: [Number, String],
     default: 0

package/es/menu/usePopover.mjs

@@ -144,12 +144,17 @@ export function usePopover(options) {
     call(options.onClosed);
   };
   var getPosition = () => {
+    var {
+      offsetX,
+      offsetY,
+      placement
+    } = options;
     computeHostSize();
     var offset = {
-      x: toPxNum(options.offsetX),
-      y: toPxNum(options.offsetY)
+      x: toPxNum(offsetX),
+      y: toPxNum(offsetY)
     };
-    switch (options.placement) {
+    switch (placement) {
       case 'cover-top':
         return {
           placement: 'bottom',
@@ -202,7 +207,7 @@ export function usePopover(options) {
       case 'left-start':
       case 'left-end':
         return {
-          placement: options.placement,
+          placement,
           skidding: offset.y,
           distance: -offset.x
         };
@@ -210,7 +215,7 @@ export function usePopover(options) {
       case 'top-start':
       case 'top-end':
         return {
-          placement: options.placement,
+          placement,
           skidding: offset.x,
           distance: -offset.y
         };
@@ -218,7 +223,7 @@ export function usePopover(options) {
       case 'bottom-start':
       case 'bottom-end':
         return {
-          placement: options.placement,
+          placement,
           skidding: offset.x,
           distance: offset.y
         };
@@ -226,7 +231,7 @@ export function usePopover(options) {
       case 'right-start':
       case 'right-end':
         return {
-          placement: options.placement,
+          placement,
           skidding: offset.y,
           distance: offset.x
         };
@@ -263,7 +268,8 @@ export function usePopover(options) {
     }];
     return {
       placement,
-      modifiers
+      modifiers,
+      strategy: options.strategy
     };
   };
   var getReference = () => options.reference ? host.value.querySelector(options.reference) : host.value;
@@ -291,9 +297,7 @@ export function usePopover(options) {
     call(options['onUpdate:show'], false);
   };
   useClickOutside(getReference, 'click', handleClickOutside);
-  watch(() => options.offsetX, resize);
-  watch(() => options.offsetY, resize);
-  watch(() => options.placement, resize);
+  watch(() => [options.offsetX, options.offsetY, options.placement, options.strategy], resize);
   watch(() => options.disabled, close);
   onMounted(() => {
     var _getReference;

package/es/tooltip/Tooltip.mjs

@@ -1,4 +1,4 @@
-import { createNamespace } from '../utils/components.mjs';
+import { createNamespace, useTeleport } from '../utils/components.mjs';
 import { defineComponent } from 'vue';
 import { toSizeUnit } from '../utils/elements.mjs';
 import { usePopover } from '../menu/usePopover.mjs';
@@ -22,7 +22,8 @@ function __render__(_ctx, _cache) {
       return _ctx.handleHostMouseleave && _ctx.handleHostMouseleave(...arguments);
     })
   }, [_renderSlot(_ctx.$slots, "default"), (_openBlock(), _createBlock(_Teleport, {
-    to: _ctx.teleport
+    to: _ctx.teleport,
+    disabled: _ctx.teleportDisabled
   }, [_createVNode(_Transition, {
     name: _ctx.n(),
     onAfterEnter: _ctx.onOpened,
@@ -50,13 +51,16 @@ function __render__(_ctx, _cache) {
       class: _normalizeClass(_ctx.classes(_ctx.n('content-container'), _ctx.n("--" + _ctx.type)))
     }, [_renderSlot(_ctx.$slots, "content", {}, () => [_createTextVNode(_toDisplayString(_ctx.content), 1 /* TEXT */)])], 6 /* CLASS, STYLE */)], 38 /* CLASS, STYLE, HYDRATE_EVENTS */), [[_vShow, _ctx.show]])]),
     _: 3 /* FORWARDED */
-  }, 8 /* PROPS */, ["name", "onAfterEnter", "onAfterLeave"])], 8 /* PROPS */, ["to"]))], 34 /* CLASS, HYDRATE_EVENTS */);
+  }, 8 /* PROPS */, ["name", "onAfterEnter", "onAfterLeave"])], 8 /* PROPS */, ["to", "disabled"]))], 34 /* CLASS, HYDRATE_EVENTS */);
 }
 
 var __sfc__ = defineComponent({
   name: 'VarTooltip',
   props,
   setup(props) {
+    var {
+      disabled: teleportDisabled
+    } = useTeleport();
     var {
       popover,
       host,
@@ -84,6 +88,7 @@ var __sfc__ = defineComponent({
       hostSize,
       show,
       zIndex,
+      teleportDisabled,
       n,
       classes,
       handleHostClick,

package/es/tooltip/props.mjs

@@ -8,6 +8,9 @@ function placementValidator(alignment) {
 function typeValidator(type) {
   return ['default', 'primary', 'info', 'success', 'warning', 'danger'].includes(type);
 }
+function strategyValidator(strategy) {
+  return ['absolute', 'fixed'].includes(strategy);
+}
 export var props = {
   type: {
     type: String,
@@ -41,6 +44,11 @@ export var props = {
     default: 'bottom',
     validator: placementValidator
   },
+  strategy: {
+    type: String,
+    default: 'absolute',
+    validator: strategyValidator
+  },
   offsetX: {
     type: [Number, String],
     default: 0