@varlet/ui 2.16.1 → 2.16.3-alpha.1694267513697

package/es/fab/Fab.mjs

@@ -20,11 +20,12 @@ function _isSlot(s) {
   return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !_isVNode(s);
 }
 var {
+  name,
   classes,
   n
 } = createNamespace('fab');
 export default defineComponent({
-  name: 'VarFab',
+  name,
   inheritAttrs: false,
   props,
   setup(props, _ref) {
@@ -35,7 +36,18 @@ export default defineComponent({
     var isActive = useVModel(props, 'active');
     var host = ref(null);
     var dragRef = ref(null);
-    var handleClick = (e, value, childrenLength) => {
+    watch(() => props.trigger, () => {
+      isActive.value = false;
+    });
+    watch(() => props.disabled, () => {
+      isActive.value = false;
+    });
+    watch(() => [props.position, props.fixed, props.top, props.bottom, props.left, props.right], () => {
+      var _dragRef$value;
+      (_dragRef$value = dragRef.value) == null ? void 0 : _dragRef$value.reset();
+    });
+    useClickOutside(host, 'click', handleClickOutside);
+    function handleClick(e, value, childrenLength) {
       e.stopPropagation();
       if (props.trigger !== 'click' || props.disabled) {
         return;
@@ -47,15 +59,15 @@ export default defineComponent({
       isActive.value = value;
       call(props.onClick, isActive.value, e);
       call(isActive.value ? props.onOpen : props.onClose);
-    };
-    var handleMouse = (value, childrenLength) => {
+    }
+    function handleMouse(value, childrenLength) {
       if (props.trigger !== 'hover' || props.disabled || childrenLength === 0) {
         return;
       }
       isActive.value = value;
       call(isActive.value ? props.onOpen : props.onClose);
-    };
-    var handleClickOutside = () => {
+    }
+    function handleClickOutside() {
       if (props.trigger !== 'click' || props.disabled) {
         return;
       }
@@ -63,8 +75,8 @@ export default defineComponent({
         isActive.value = false;
         call(props.onClose);
       }
-    };
-    var renderTrigger = () => {
+    }
+    function renderTrigger() {
       if (slots.trigger) {
         return props.show ? slots.trigger({
           active: isActive.value
@@ -88,18 +100,7 @@ export default defineComponent({
           "animationClass": n('--trigger-icon-animation')
         }, null)]
       }), [[_vShow, props.show]]);
-    };
-    watch(() => props.trigger, () => {
-      isActive.value = false;
-    });
-    watch(() => props.disabled, () => {
-      isActive.value = false;
-    });
-    watch(() => [props.position, props.fixed, props.top, props.bottom, props.left, props.right], () => {
-      var _dragRef$value;
-      (_dragRef$value = dragRef.value) == null ? void 0 : _dragRef$value.reset();
-    });
-    useClickOutside(host, 'click', handleClickOutside);
+    }
     return () => {
       var _slot;
       var _call;

package/es/field-decorator/FieldDecorator.mjs

@@ -5,6 +5,7 @@ import { isEmpty, getStyle } from '@varlet/shared';
 import { createNamespace, call } from '../utils/components.mjs';
 import { onWindowResize, onSmartMounted } from '@varlet/use';
 var {
+  name,
   n,
   classes
 } = createNamespace('field-decorator');
@@ -78,7 +79,7 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarFieldDecorator',
+  name,
   components: {
     VarIcon
   },
@@ -89,9 +90,12 @@ var __sfc__ = defineComponent({
     } = _ref;
     var placeholderTextEl = ref(null);
     var legendWidth = ref('');
-    var color = computed(() => !props.errorMessage ? props.isFocus ? props.focusColor : props.blurColor : undefined);
     var isFloating = computed(() => props.hint && (!isEmpty(props.value) || props.isFocus || slots['prepend-icon']));
-    var computePlaceholderState = () => {
+    var color = computed(() => !props.errorMessage ? props.isFocus ? props.focusColor : props.blurColor : undefined);
+    onWindowResize(resize);
+    onSmartMounted(resize);
+    onUpdated(resize);
+    function computePlaceholderState() {
       var {
         hint,
         value,
@@ -103,8 +107,8 @@ var __sfc__ = defineComponent({
       if (isFloating.value) {
         return n('--placeholder-hint');
       }
-    };
-    var resize = () => {
+    }
+    function resize() {
       var {
         size,
         hint,
@@ -118,16 +122,13 @@ var __sfc__ = defineComponent({
       var placeholderTextStyle = getStyle(placeholderTextEl.value);
       var placeholderSpace = "var(--field-decorator-outlined-" + size + "-placeholder-space)";
       legendWidth.value = "calc(" + placeholderTextStyle.width + " * 0.75 + " + placeholderSpace + " * 2)";
-    };
-    var handleClear = e => {
+    }
+    function handleClear(e) {
       call(props.onClear, e);
-    };
-    var handleClick = e => {
+    }
+    function handleClick(e) {
       call(props.onClick, e);
-    };
-    onWindowResize(resize);
-    onSmartMounted(resize);
-    onUpdated(resize);
+    }
     return {
       placeholderTextEl,
       color,

package/es/form/Form.mjs

@@ -8,6 +8,7 @@ import { find } from '@varlet/shared';
 import { getParentScroller, getTop, scrollTo, toPxNum } from '../utils/elements.mjs';
 import { linear } from '../utils/shared.mjs';
 var {
+  name,
   n
 } = createNamespace('form');
 import { renderSlot as _renderSlot, normalizeClass as _normalizeClass, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
@@ -24,7 +25,7 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarForm',
+  name,
   props,
   setup(props) {
     var disabled = computed(() => props.disabled);
@@ -33,7 +34,12 @@ var __sfc__ = defineComponent({
       formItems,
       bindFormItems
     } = useFormItems();
-    var scroll = formItemElement => {
+    var formProvider = {
+      disabled,
+      readonly
+    };
+    bindFormItems(formProvider);
+    function scroll(formItemElement) {
       // wait form-details animation end
       setTimeout(() => {
         var scroller = getParentScroller(formItemElement);
@@ -44,26 +50,30 @@ var __sfc__ = defineComponent({
           animation: linear
         });
       }, 300);
-    };
-    var handleSubmit = /*#__PURE__*/function () {
-      var _ref = _asyncToGenerator(function* (event) {
+    }
+    function handleSubmit(_x) {
+      return _handleSubmit.apply(this, arguments);
+    }
+    function _handleSubmit() {
+      _handleSubmit = _asyncToGenerator(function* (event) {
         event.preventDefault();
         var valid = yield validate();
         call(props.onSubmit, valid);
       });
-      return function handleSubmit(_x) {
-        return _ref.apply(this, arguments);
-      };
-    }();
-    var handleReset = event => {
+      return _handleSubmit.apply(this, arguments);
+    }
+    function handleReset(event) {
       event.preventDefault();
       reset();
       call(props.onReset);
-    };
+    }
 
     // expose
-    var validate = /*#__PURE__*/function () {
-      var _ref2 = _asyncToGenerator(function* () {
+    function validate() {
+      return _validate.apply(this, arguments);
+    } // expose
+    function _validate() {
+      _validate = _asyncToGenerator(function* () {
         var res = yield Promise.all(formItems.map(_ref3 => {
           var {
             validate
@@ -82,31 +92,26 @@ var __sfc__ = defineComponent({
         }
         return res.every(result => result === true);
       });
-      return function validate() {
-        return _ref2.apply(this, arguments);
-      };
-    }();
-
-    // expose
-    var reset = () => formItems.forEach(_ref4 => {
-      var {
-        reset
-      } = _ref4;
-      return reset();
-    });
+      return _validate.apply(this, arguments);
+    }
+    function reset() {
+      return formItems.forEach(_ref => {
+        var {
+          reset
+        } = _ref;
+        return reset();
+      });
+    }
 
     // expose
-    var resetValidation = () => formItems.forEach(_ref5 => {
-      var {
-        resetValidation
-      } = _ref5;
-      return resetValidation();
-    });
-    var formProvider = {
-      disabled,
-      readonly
-    };
-    bindFormItems(formProvider);
+    function resetValidation() {
+      return formItems.forEach(_ref2 => {
+        var {
+          resetValidation
+        } = _ref2;
+        return resetValidation();
+      });
+    }
     return {
       n,
       handleSubmit,

package/es/form-details/FormDetails.mjs

@@ -2,6 +2,7 @@ import { defineComponent } from 'vue';
 import { createNamespace } from '../utils/components.mjs';
 import { props } from './props.mjs';
 var {
+  name,
   n
 } = createNamespace('form-details');
 import { toDisplayString as _toDisplayString, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, Transition as _Transition, withCtx as _withCtx, createVNode as _createVNode, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, renderSlot as _renderSlot, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
@@ -38,7 +39,7 @@ function __render__(_ctx, _cache) {
   }, 8 /* PROPS */, ["name"]);
 }
 var __sfc__ = defineComponent({
-  name: 'VarFormDetails',
+  name,
   props,
   setup: () => ({
     n

package/es/hover-overlay/HoverOverlay.mjs

@@ -2,6 +2,7 @@ import { defineComponent } from 'vue';
 import { props } from './props.mjs';
 import { createNamespace } from '../utils/components.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('hover-overlay');
@@ -13,14 +14,12 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarHoverOverlay',
+  name,
   props,
-  setup() {
-    return {
-      n,
-      classes
-    };
-  }
+  setup: () => ({
+    n,
+    classes
+  })
 });
 __sfc__.render = __render__;
 export default __sfc__;

package/es/icon/Icon.mjs

@@ -6,6 +6,7 @@ import { props } from './props.mjs';
 import { toSizeUnit } from '../utils/elements.mjs';
 import { createNamespace } from '../utils/components.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('icon');
@@ -25,13 +26,19 @@ function __render__(_ctx, _cache) {
   }, null, 8 /* PROPS */, ["class", "style", "src", "onClick"]);
 }
 var __sfc__ = defineComponent({
-  name: 'VarIcon',
+  name,
   props,
   setup(props) {
     var nextName = ref('');
     var animateInProgress = ref(false);
-    var handleNameChange = /*#__PURE__*/function () {
-      var _ref = _asyncToGenerator(function* (newName, oldName) {
+    watch(() => props.name, handleNameChange, {
+      immediate: true
+    });
+    function handleNameChange(_x, _x2) {
+      return _handleNameChange.apply(this, arguments);
+    }
+    function _handleNameChange() {
+      _handleNameChange = _asyncToGenerator(function* (newName, oldName) {
         var {
           transition
         } = props;
@@ -48,18 +55,13 @@ var __sfc__ = defineComponent({
           animateInProgress.value = false;
         }, toNumber(transition));
       });
-      return function handleNameChange(_x, _x2) {
-        return _ref.apply(this, arguments);
-      };
-    }();
-    watch(() => props.name, handleNameChange, {
-      immediate: true
-    });
+      return _handleNameChange.apply(this, arguments);
+    }
     return {
-      n,
-      classes,
       nextName,
       animateInProgress,
+      n,
+      classes,
       isURL,
       toNumber,
       toSizeUnit

package/es/image/Image.mjs

@@ -5,6 +5,7 @@ import { props } from './props.mjs';
 import { toSizeUnit } from '../utils/elements.mjs';
 import { createNamespace, call } from '../utils/components.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('image');
@@ -13,6 +14,7 @@ var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
 var _hoisted_1 = ["alt", "title", "lazy-loading", "lazy-error"];
 var _hoisted_2 = ["alt", "title", "src"];
 function __render__(_ctx, _cache) {
+  var _ctx$src;
   var _directive_lazy = _resolveDirective("lazy");
   var _directive_ripple = _resolveDirective("ripple");
   return _withDirectives((_openBlock(), _createElementBlock("div", {
@@ -38,7 +40,7 @@ function __render__(_ctx, _cache) {
     onClick: _cache[1] || (_cache[1] = function () {
       return _ctx.handleClick && _ctx.handleClick(...arguments);
     })
-  }, null, 46 /* CLASS, STYLE, PROPS, HYDRATE_EVENTS */, _hoisted_1)), [[_directive_lazy, _ctx.src]]) : _createCommentVNode("v-if", true), !_ctx.lazy && !_ctx.showErrorSlot ? (_openBlock(), _createElementBlock("img", {
+  }, null, 46 /* CLASS, STYLE, PROPS, HYDRATE_EVENTS */, _hoisted_1)), [[_directive_lazy, (_ctx$src = _ctx.src) != null ? _ctx$src : '']]) : _createCommentVNode("v-if", true), !_ctx.lazy && !_ctx.showErrorSlot ? (_openBlock(), _createElementBlock("img", {
     key: 1,
     class: _normalizeClass(_ctx.n('image')),
     alt: _ctx.alt,
@@ -63,7 +65,7 @@ function __render__(_ctx, _cache) {
   }]]);
 }
 var __sfc__ = defineComponent({
-  name: 'VarImage',
+  name,
   directives: {
     Lazy,
     Ripple
@@ -74,12 +76,15 @@ var __sfc__ = defineComponent({
       slots
     } = _ref;
     var showErrorSlot = ref(false);
-    var handleError = e => {
+    watch(() => props.src, () => {
+      showErrorSlot.value = false;
+    });
+    function handleError(e) {
       // the value of showErrorSlot depends on whether there is an error slot
       showErrorSlot.value = !!slots.error;
       call(props.onError, e);
-    };
-    var handleLoad = e => {
+    }
+    function handleLoad(e) {
       var el = e.currentTarget;
       if (props.lazy) {
         if (el._lazy.state === 'success') {
@@ -92,17 +97,14 @@ var __sfc__ = defineComponent({
       } else {
         call(props.onLoad, e);
       }
-    };
-    var handleClick = e => {
+    }
+    function handleClick(e) {
       call(props.onClick, e);
-    };
-    watch(() => props.src, () => {
-      showErrorSlot.value = false;
-    });
+    }
     return {
+      showErrorSlot,
       n,
       classes,
-      showErrorSlot,
       toSizeUnit,
       handleLoad,
       handleError,

package/es/image-preview/ImagePreview.mjs

@@ -8,6 +8,7 @@ import { useEventListener, useTouch } from '@varlet/use';
 import { props } from './props.mjs';
 import { call, createNamespace } from '../utils/components.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('image-preview');
@@ -110,7 +111,7 @@ function __render__(_ctx, _cache) {
   }, 8 /* PROPS */, ["class", "transition", "show", "lock-scroll", "teleport", "onOpen", "onClose", "onClosed", "onOpened", "onRouteChange"]);
 }
 var __sfc__ = defineComponent({
-  name: 'VarImagePreview',
+  name,
   components: {
     VarSwipe,
     VarSwipeItem,
@@ -124,8 +125,8 @@ var __sfc__ = defineComponent({
     var scale = ref(1);
     var translateX = ref(0);
     var translateY = ref(0);
-    var transitionTimingFunction = ref(undefined);
-    var transitionDuration = ref(undefined);
+    var transitionTimingFunction = ref();
+    var transitionDuration = ref();
     var canSwipe = ref(true);
     var swipeRef = ref(null);
     var {
@@ -137,13 +138,6 @@ var __sfc__ = defineComponent({
       moveTouch,
       endTouch
     } = useTouch();
-    var targets = {
-      start: null,
-      prev: null
-    };
-    var closeRunner = null;
-    var longPressRunner = null;
-    var isLongPress = false;
     var initialIndex = computed(() => {
       // For compatibility with current, temporarily keep this computed method
       // Current will be replaced by initialIndex in the future
@@ -165,7 +159,20 @@ var __sfc__ = defineComponent({
       } = props;
       return show && imagePreventDefault;
     });
-    var zoomIn = () => {
+    var closeRunner = null;
+    var longPressRunner = null;
+    var isLongPress = false;
+    var targets = {
+      start: null,
+      prev: null
+    };
+    useEventListener(() => document, 'contextmenu', preventImageDefault);
+    watch(() => props.show, newShow => {
+      popupShow.value = newShow;
+    }, {
+      immediate: true
+    });
+    function zoomIn() {
       scale.value = toNumber(props.zoom);
       canSwipe.value = false;
       targets.prev = null;
@@ -173,8 +180,8 @@ var __sfc__ = defineComponent({
         transitionTimingFunction.value = 'linear';
         transitionDuration.value = '0s';
       }, ANIMATION_DURATION);
-    };
-    var zoomOut = () => {
+    }
+    function zoomOut() {
       scale.value = 1;
       translateX.value = 0;
       translateY.value = 0;
@@ -182,26 +189,26 @@ var __sfc__ = defineComponent({
       targets.prev = null;
       transitionTimingFunction.value = undefined;
       transitionDuration.value = undefined;
-    };
-    var isDoubleTouch = target => {
+    }
+    function isDoubleTouch(target) {
       if (!targets.prev) {
         return false;
       }
       return distance.value <= DISTANCE_OFFSET && performance.now() - startTime.value <= EVENT_DELAY && targets.prev === target;
-    };
-    var isTapTouch = target => {
+    }
+    function isTapTouch(target) {
       if (!target || !targets.start || !targets.prev) {
         return false;
       }
       return distance.value <= DISTANCE_OFFSET && performance.now() - startTime.value < TAP_DELAY && (target === targets.start || target.parentNode === targets.start);
-    };
-    var handleTouchcancel = () => {
+    }
+    function handleTouchcancel() {
       endTouch();
       window.clearTimeout(longPressRunner);
       isLongPress = false;
       targets.start = null;
-    };
-    var handleTouchend = event => {
+    }
+    function handleTouchend(event) {
       endTouch();
       window.clearTimeout(longPressRunner);
 
@@ -215,8 +222,8 @@ var __sfc__ = defineComponent({
         isTap && close();
         targets.start = null;
       }, EVENT_DELAY);
-    };
-    var handleTouchstart = (event, idx) => {
+    }
+    function handleTouchstart(event, idx) {
       window.clearTimeout(closeRunner);
       window.clearTimeout(longPressRunner);
       var target = event.currentTarget;
@@ -231,8 +238,8 @@ var __sfc__ = defineComponent({
       }
       startTouch(event);
       targets.prev = target;
-    };
-    var getZoom = target => {
+    }
+    function getZoom(target) {
       var {
         offsetWidth,
         offsetHeight
@@ -248,8 +255,8 @@ var __sfc__ = defineComponent({
         rootRadio: offsetHeight / offsetWidth,
         zoom: toNumber(props.zoom)
       };
-    };
-    var getLimitX = target => {
+    }
+    function getLimitX(target) {
       var {
         zoom,
         imageRadio,
@@ -262,8 +269,8 @@ var __sfc__ = defineComponent({
       }
       var displayWidth = imageRadio > rootRadio ? height / imageRadio : width;
       return Math.max(0, (zoom * displayWidth - width) / 2) / zoom;
-    };
-    var getLimitY = target => {
+    }
+    function getLimitY(target) {
       var {
         zoom,
         imageRadio,
@@ -276,8 +283,8 @@ var __sfc__ = defineComponent({
       }
       var displayHeight = imageRadio > rootRadio ? height : width * imageRadio;
       return Math.max(0, (zoom * displayHeight - height) / 2) / zoom;
-    };
-    var handleTouchmove = event => {
+    }
+    function handleTouchmove(event) {
       if (!targets.prev) {
         return;
       }
@@ -293,45 +300,37 @@ var __sfc__ = defineComponent({
         translateY.value = clamp(translateY.value + moveY.value, -limitY, limitY);
       }
       targets.prev = target;
-    };
-    var close = () => {
+    }
+    function close() {
       if (scale.value > 1) {
         zoomOut();
         setTimeout(() => call(props['onUpdate:show'], false), ANIMATION_DURATION);
         return;
       }
       call(props['onUpdate:show'], false);
-    };
+    }
 
     // expose
-    var prev = options => {
+    function prev(options) {
       var _swipeRef$value;
       (_swipeRef$value = swipeRef.value) == null ? void 0 : _swipeRef$value.prev(options);
-    };
+    }
 
     // expose
-    var next = options => {
+    function next(options) {
       var _swipeRef$value2;
       (_swipeRef$value2 = swipeRef.value) == null ? void 0 : _swipeRef$value2.next(options);
-    };
+    }
 
     // expose
-    var to = (idx, options) => {
+    function to(idx, options) {
       var _swipeRef$value3;
       (_swipeRef$value3 = swipeRef.value) == null ? void 0 : _swipeRef$value3.to(idx, options);
-    };
-    var preventImageDefault = event => {
+    }
+    function preventImageDefault(event) {
       props.imagePreventDefault && props.show && event.preventDefault();
-    };
-    useEventListener(() => document, 'contextmenu', preventImageDefault);
-    watch(() => props.show, newShow => {
-      popupShow.value = newShow;
-    }, {
-      immediate: true
-    });
+    }
     return {
-      n,
-      classes,
       swipeRef,
       isPreventDefault,
       initialIndex,
@@ -342,6 +341,8 @@ var __sfc__ = defineComponent({
       canSwipe,
       transitionTimingFunction,
       transitionDuration,
+      n,
+      classes,
       handleTouchstart,
       handleTouchmove,
       handleTouchend,