@varlet/ui 2.16.2 → 2.16.3-alpha.1694267513697

package/es/action-sheet/ActionSheet.mjs

@@ -3,10 +3,10 @@ import VarPopup from '../popup/index.mjs';
 import VarIcon from '../icon/index.mjs';
 import { defineComponent, ref, watch } from 'vue';
 import { props } from './props.mjs';
-import { dt } from '../utils/shared.mjs';
 import { pack } from '../locale/index.mjs';
 import { createNamespace, call } from '../utils/components.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('action-sheet');
@@ -39,9 +39,12 @@ function __render__(_ctx, _cache) {
   }), {
     default: _withCtx(() => [_createElementVNode("div", _mergeProps({
       class: _ctx.classes(_ctx.n(), _ctx.n('$--box'))
-    }, _ctx.$attrs), [_renderSlot(_ctx.$slots, "title", {}, () => [_createElementVNode("div", {
-      class: _normalizeClass(_ctx.n('title'))
-    }, _toDisplayString(_ctx.dt(_ctx.title, _ctx.pack.actionSheetTitle)), 3 /* TEXT, CLASS */)]), _renderSlot(_ctx.$slots, "actions", {}, () => [(_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.actions, action => {
+    }, _ctx.$attrs), [_renderSlot(_ctx.$slots, "title", {}, () => {
+      var _ctx$title;
+      return [_createElementVNode("div", {
+        class: _normalizeClass(_ctx.n('title'))
+      }, _toDisplayString((_ctx$title = _ctx.title) != null ? _ctx$title : _ctx.pack.actionSheetTitle), 3 /* TEXT, CLASS */)];
+    }), _renderSlot(_ctx.$slots, "actions", {}, () => [(_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.actions, action => {
       return _withDirectives((_openBlock(), _createElementBlock("div", {
         class: _normalizeClass(_ctx.classes(_ctx.n('action-item'), action.className, [action.disabled, _ctx.n('--disabled')])),
         key: action.name,
@@ -66,7 +69,7 @@ function __render__(_ctx, _cache) {
   }, 16 /* FULL_PROPS */, ["class", "show", "overlay", "overlay-class", "overlay-style", "lock-scroll", "close-on-click-overlay", "teleport", "safe-area", "onOpen", "onClose", "onClosed", "onOpened", "onRouteChange"]);
 }
 var __sfc__ = defineComponent({
-  name: 'VarActionSheet',
+  name,
   directives: {
     Ripple
   },
@@ -78,7 +81,12 @@ var __sfc__ = defineComponent({
   props,
   setup(props) {
     var popupShow = ref(false);
-    var handleSelect = action => {
+    watch(() => props.show, newValue => {
+      popupShow.value = newValue;
+    }, {
+      immediate: true
+    });
+    function handleSelect(action) {
       if (action.disabled) {
         return;
       }
@@ -88,20 +96,16 @@ var __sfc__ = defineComponent({
       } = props;
       call(onSelect, action);
       closeOnClickAction && call(props['onUpdate:show'], false);
-    };
-    var handlePopupUpdateShow = value => call(props['onUpdate:show'], value);
-    watch(() => props.show, newValue => {
-      popupShow.value = newValue;
-    }, {
-      immediate: true
-    });
+    }
+    function handlePopupUpdateShow(value) {
+      call(props['onUpdate:show'], value);
+    }
     return {
+      popupShow,
+      pack,
       n,
       classes,
       handlePopupUpdateShow,
-      popupShow,
-      pack,
-      dt,
       handleSelect
     };
   }

package/es/app-bar/AppBar.mjs

@@ -3,6 +3,7 @@ import { props } from './props.mjs';
 import { createNamespace, formatElevation } from '../utils/components.mjs';
 import { onSmartMounted } from '@varlet/use';
 var {
+  name,
   n,
   classes
 } = createNamespace('app-bar');
@@ -36,7 +37,7 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarAppBar',
+  name,
   props,
   setup(props, _ref) {
     var {
@@ -44,10 +45,6 @@ var __sfc__ = defineComponent({
     } = _ref;
     var paddingLeft = ref();
     var paddingRight = ref();
-    var computePadding = () => {
-      paddingLeft.value = slots.left ? 0 : undefined;
-      paddingRight.value = slots.right ? 0 : undefined;
-    };
     var rootStyles = computed(() => {
       var {
         image,
@@ -70,13 +67,17 @@ var __sfc__ = defineComponent({
     });
     onSmartMounted(computePadding);
     onUpdated(computePadding);
+    function computePadding() {
+      paddingLeft.value = slots.left ? 0 : undefined;
+      paddingRight.value = slots.right ? 0 : undefined;
+    }
     return {
-      n,
-      classes,
-      formatElevation,
       rootStyles,
       paddingLeft,
-      paddingRight
+      paddingRight,
+      n,
+      classes,
+      formatElevation
     };
   }
 });

package/es/avatar/Avatar.mjs

@@ -6,6 +6,7 @@ import { createNamespace, call } from '../utils/components.mjs';
 import { onSmartMounted } from '@varlet/use';
 var isInternalSize = size => ['mini', 'small', 'normal', 'large'].includes(size);
 var {
+  name,
   n,
   classes
 } = createNamespace('avatar');
@@ -67,7 +68,7 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarAvatar',
+  name,
   directives: {
     Lazy
   },
@@ -76,7 +77,9 @@ var __sfc__ = defineComponent({
     var avatarElement = ref(null);
     var textElement = ref(null);
     var scale = ref(1);
-    var getScale = () => {
+    onSmartMounted(getScale);
+    onUpdated(getScale);
+    function getScale() {
       if (!avatarElement.value || !textElement.value) {
         scale.value = 1;
         return;
@@ -88,8 +91,8 @@ var __sfc__ = defineComponent({
       } else {
         scale.value = avatarElementWidth / textElementWidth;
       }
-    };
-    var handleLoad = e => {
+    }
+    function handleLoad(e) {
       var el = e.currentTarget;
       var {
         lazy,
@@ -102,23 +105,21 @@ var __sfc__ = defineComponent({
       } else {
         call(onLoad, e);
       }
-    };
-    var handleError = e => {
+    }
+    function handleError(e) {
       call(props.onError, e);
-    };
-    var handleClick = e => {
+    }
+    function handleClick(e) {
       call(props.onClick, e);
-    };
-    onSmartMounted(getScale);
-    onUpdated(getScale);
+    }
     return {
-      isInternalSize,
-      toSizeUnit,
-      n,
-      classes,
       avatarElement,
       textElement,
       scale,
+      n,
+      classes,
+      isInternalSize,
+      toSizeUnit,
       handleLoad,
       handleError,
       handleClick

package/es/avatar-group/AvatarGroup.mjs

@@ -3,6 +3,7 @@ import { props } from './props.mjs';
 import { createNamespace } from '../utils/components.mjs';
 import { toSizeUnit } from '../utils/elements.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('avatar-group');
@@ -15,7 +16,7 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarAvatarGroup',
+  name,
   props,
   setup(props) {
     var rootStyles = computed(() => {
@@ -27,10 +28,10 @@ var __sfc__ = defineComponent({
       };
     });
     return {
+      rootStyles,
       n,
       classes,
-      toSizeUnit,
-      rootStyles
+      toSizeUnit
     };
   }
 });

package/es/back-top/BackTop.mjs

@@ -8,6 +8,7 @@ import { getScrollTop, getScrollLeft, scrollTo, getParentScroller, toPxNum, toSi
 import { call, createNamespace } from '../utils/components.mjs';
 import { onSmartUnmounted } from '@varlet/use';
 var {
+  name,
   n,
   classes
 } = createNamespace('back-top');
@@ -42,7 +43,7 @@ function __render__(_ctx, _cache) {
   }, 8 /* PROPS */, ["elevation"])])], 16 /* FULL_PROPS */)], 8 /* PROPS */, ["disabled"]);
 }
 var __sfc__ = defineComponent({
-  name: 'VarBackTop',
+  name,
   components: {
     VarButton,
     VarIcon
@@ -54,27 +55,9 @@ var __sfc__ = defineComponent({
     var backTopEl = ref(null);
     var disabled = ref(true);
     var scroller;
-    var handleClick = event => {
-      call(props.onClick, event);
-      var left = getScrollLeft(scroller);
-      scrollTo(scroller, {
-        left,
-        duration: props.duration,
-        animation: easeInOutCubic
-      });
-    };
     var handleScroll = throttle(() => {
       show.value = getScrollTop(scroller) >= toPxNum(props.visibilityHeight);
     }, 200);
-    var setScroller = () => {
-      scroller = props.target ? getTarget(props.target, 'BackTop') : getParentScroller(backTopEl.value);
-    };
-    var addScrollerEventListener = () => {
-      scroller.addEventListener('scroll', handleScroll);
-    };
-    var removeScrollerEventListener = () => {
-      scroller.removeEventListener('scroll', handleScroll);
-    };
     onMounted(() => {
       setScroller();
       addScrollerEventListener();
@@ -82,6 +65,24 @@ var __sfc__ = defineComponent({
     });
     onActivated(addScrollerEventListener);
     onSmartUnmounted(removeScrollerEventListener);
+    function handleClick(event) {
+      call(props.onClick, event);
+      var left = getScrollLeft(scroller);
+      scrollTo(scroller, {
+        left,
+        duration: props.duration,
+        animation: easeInOutCubic
+      });
+    }
+    function setScroller() {
+      scroller = props.target ? getTarget(props.target, 'BackTop') : getParentScroller(backTopEl.value);
+    }
+    function addScrollerEventListener() {
+      scroller.addEventListener('scroll', handleScroll);
+    }
+    function removeScrollerEventListener() {
+      scroller.removeEventListener('scroll', handleScroll);
+    }
     return {
       disabled,
       show,

package/es/badge/Badge.mjs

@@ -4,6 +4,7 @@ import { computed, defineComponent } from 'vue';
 import { props } from './props.mjs';
 import { createNamespace } from '../utils/components.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('badge');
@@ -35,7 +36,7 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarBadge',
+  name,
   components: {
     VarIcon
   },
@@ -50,9 +51,9 @@ var __sfc__ = defineComponent({
       return value != null && maxValue != null && toNumber(value) > toNumber(maxValue) ? maxValue + "+" : value;
     });
     return {
+      value,
       n,
-      classes,
-      value
+      classes
     };
   }
 });

package/es/bottom-navigation/BottomNavigation.mjs

@@ -7,6 +7,7 @@ import { createNamespace, call } from '../utils/components.mjs';
 import { isNumber, normalizeToArray } from '@varlet/shared';
 import { onSmartMounted } from '@varlet/use';
 var {
+  name,
   n,
   classes
 } = createNamespace('bottom-navigation');
@@ -40,7 +41,7 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarBottomNavigation',
+  name,
   components: {
     VarButton
   },
@@ -59,25 +60,56 @@ var __sfc__ = defineComponent({
       bottomNavigationItems,
       bindBottomNavigationItem
     } = useBottomNavigationItems();
-    var matchBoundary = () => {
-      if (length.value === 0 || matchName() || matchIndex()) {
+    var bottomNavigationProvider = {
+      active,
+      activeColor,
+      inactiveColor,
+      onToggle
+    };
+    bindBottomNavigationItem(bottomNavigationProvider);
+    watch(() => length.value, matchBoundary);
+    watch(() => props.fabProps, newValue => {
+      fabProps.value = _extends({}, defaultFabProps, newValue);
+    }, {
+      immediate: true,
+      deep: true
+    });
+    onSmartMounted(() => {
+      if (!slots.fab) {
         return;
       }
-      handleActiveIndex();
-    };
-    var matchName = () => bottomNavigationItems.find(_ref2 => {
-      var {
-        name
-      } = _ref2;
-      return active.value === name.value;
+      addMarginClass(length.value);
     });
-    var matchIndex = () => bottomNavigationItems.find(_ref3 => {
-      var {
-        index
-      } = _ref3;
-      return active.value === index.value;
+    onUpdated(() => {
+      removeMarginClass();
+      if (!slots.fab) {
+        return;
+      }
+      addMarginClass(length.value);
     });
-    var handleActiveIndex = () => {
+    function matchBoundary() {
+      if (length.value === 0 || matchName() || matchIndex()) {
+        return;
+      }
+      handleActiveIndex();
+    }
+    function matchName() {
+      return bottomNavigationItems.find(_ref2 => {
+        var {
+          name
+        } = _ref2;
+        return active.value === name.value;
+      });
+    }
+    function matchIndex() {
+      return bottomNavigationItems.find(_ref3 => {
+        var {
+          index
+        } = _ref3;
+        return active.value === index.value;
+      });
+    }
+    function handleActiveIndex() {
       if (!isNumber(active.value)) {
         return;
       }
@@ -86,40 +118,40 @@ var __sfc__ = defineComponent({
       } else if (active.value > length.value - 1) {
         call(props['onUpdate:active'], length.value - 1);
       }
-    };
-    var onToggle = changedValue => {
+    }
+    function onToggle(changedValue) {
       if (active.value === changedValue) {
         return;
       }
       props.onBeforeChange ? handleBeforeChange(changedValue) : handleChange(changedValue);
-    };
-    var handleBeforeChange = changedValue => {
+    }
+    function handleBeforeChange(changedValue) {
       var results = normalizeToArray(call(props.onBeforeChange, changedValue));
       Promise.all(results).then(results => {
         if (results.every(Boolean)) {
           handleChange(changedValue);
         }
       });
-    };
-    var handleChange = changedValue => {
+    }
+    function handleChange(changedValue) {
       call(props['onUpdate:active'], changedValue);
       call(props.onChange, changedValue);
-    };
-    var removeMarginClass = () => {
+    }
+    function removeMarginClass() {
       var bottomNavigationItems = getBottomNavigationItems();
       bottomNavigationItems.forEach(dom => {
         dom.classList.remove(RIGHT_HALF_SPACE_CLASS, LEFT_HALF_SPACE_CLASS, RIGHT_SPACE_CLASS);
       });
-    };
-    var addMarginClass = length => {
+    }
+    function addMarginClass(length) {
       var bottomNavigationItems = getBottomNavigationItems();
       var itemsNum = bottomNavigationItems.length;
       var isEven = length % 2 === 0;
       bottomNavigationItems.forEach((bottomNavigationItem, i) => {
         handleMarginClass(isEven, bottomNavigationItem, i, itemsNum);
       });
-    };
-    var handleMarginClass = (isEven, dom, i, length) => {
+    }
+    function handleMarginClass(isEven, dom, i, length) {
       var isLast = i === length - 1;
       if (!isEven && isLast) {
         dom.classList.add(RIGHT_SPACE_CLASS);
@@ -132,45 +164,20 @@ var __sfc__ = defineComponent({
       } else if (isFabRight) {
         dom.classList.add(LEFT_HALF_SPACE_CLASS);
       }
-    };
-    var getBottomNavigationItems = () => Array.from(bottomNavigationDom.value.querySelectorAll("." + nItem()));
-    var handleFabClick = () => {
+    }
+    function getBottomNavigationItems() {
+      return Array.from(bottomNavigationDom.value.querySelectorAll("." + nItem()));
+    }
+    function handleFabClick() {
       call(props.onFabClick);
-    };
-    var bottomNavigationProvider = {
-      active,
-      activeColor,
-      inactiveColor,
-      onToggle
-    };
-    bindBottomNavigationItem(bottomNavigationProvider);
-    watch(() => length.value, matchBoundary);
-    watch(() => props.fabProps, newValue => {
-      fabProps.value = _extends({}, defaultFabProps, newValue);
-    }, {
-      immediate: true,
-      deep: true
-    });
-    onSmartMounted(() => {
-      if (!slots.fab) {
-        return;
-      }
-      addMarginClass(length.value);
-    });
-    onUpdated(() => {
-      removeMarginClass();
-      if (!slots.fab) {
-        return;
-      }
-      addMarginClass(length.value);
-    });
+    }
     return {
-      n,
-      classes,
       length,
       bottomNavigationDom,
-      handleFabClick,
-      fabProps
+      fabProps,
+      n,
+      classes,
+      handleFabClick
     };
   }
 });

package/es/bottom-navigation-item/BottomNavigationItem.mjs

@@ -6,6 +6,7 @@ import { props } from './props.mjs';
 import { useBottomNavigation } from './provide.mjs';
 import { createNamespace, call } from '../utils/components.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('bottom-navigation-item');
@@ -46,7 +47,7 @@ function __render__(_ctx, _cache) {
   }, [_createTextVNode(_toDisplayString(_ctx.label), 1 /* TEXT */)], 64 /* STABLE_FRAGMENT */)) : _createCommentVNode("v-if", true), _renderSlot(_ctx.$slots, "default")], 2 /* CLASS */)], 6 /* CLASS, STYLE */)), [[_directive_ripple]]);
 }
 var __sfc__ = defineComponent({
-  name: 'VarBottomNavigationItem',
+  name,
   components: {
     VarBadge,
     VarIcon
@@ -73,26 +74,28 @@ var __sfc__ = defineComponent({
       name,
       index
     };
-    var computeColorStyle = () => active.value === name.value || active.value === index.value ? activeColor.value : inactiveColor.value;
-    var handleClick = () => {
-      var _name$value;
-      var active = (_name$value = name.value) != null ? _name$value : index.value;
-      call(props.onClick, active);
-      call(bottomNavigation.onToggle, active);
-    };
     bindBottomNavigation(bottomNavigationItemProvider);
     watch(() => badge.value, newValue => {
       badgeProps.value = newValue === true ? defaultBadgeProps : badge.value;
     }, {
       immediate: true
     });
+    function computeColorStyle() {
+      return active.value === name.value || active.value === index.value ? activeColor.value : inactiveColor.value;
+    }
+    function handleClick() {
+      var _name$value;
+      var active = (_name$value = name.value) != null ? _name$value : index.value;
+      call(props.onClick, active);
+      call(bottomNavigation.onToggle, active);
+    }
     return {
-      n,
-      classes,
       index,
       active,
       badge,
       badgeProps,
+      n,
+      classes,
       computeColorStyle,
       handleClick
     };

package/es/breadcrumb/Breadcrumb.mjs

@@ -3,6 +3,7 @@ import { props } from './props.mjs';
 import { useBreadcrumb } from './provide.mjs';
 import { call, createNamespace } from '../utils/components.mjs';
 var {
+  name,
   n,
   classes
 } = createNamespace('breadcrumb');
@@ -26,7 +27,7 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarBreadcrumb',
+  name,
   props,
   setup(props) {
     var {
@@ -36,13 +37,13 @@ var __sfc__ = defineComponent({
     } = useBreadcrumb();
     var isLast = computed(() => index.value === breadcrumb.length.value - 1);
     var parentSeparator = computed(() => breadcrumb.separator.value);
-    var handleClick = e => {
+    bindBreadcrumb(null);
+    function handleClick(e) {
       if (isLast.value) {
         return;
       }
       call(props.onClick, e);
-    };
-    bindBreadcrumb(null);
+    }
     return {
       n,
       classes,

package/es/breadcrumbs/Breadcrumbs.mjs

@@ -3,6 +3,7 @@ import { props } from './props.mjs';
 import { useBreadcrumbsList } from './provide.mjs';
 import { createNamespace } from '../utils/components.mjs';
 var {
+  name,
   n
 } = createNamespace('breadcrumbs');
 import { renderSlot as _renderSlot, normalizeClass as _normalizeClass, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
@@ -13,7 +14,7 @@ function __render__(_ctx, _cache) {
 }
 
 var __sfc__ = defineComponent({
-  name: 'VarBreadcrumbs',
+  name,
   props,
   setup(props) {
     var separator = computed(() => props.separator);

package/es/button/Button.mjs

@@ -8,6 +8,7 @@ import { call, createNamespace, formatElevation } from '../utils/components.mjs'
 import { useButtonGroup } from './provide.mjs';
 import { isArray } from '@varlet/shared';
 var {
+  name,
   n,
   classes
 } = createNamespace('button');
@@ -50,7 +51,7 @@ function __render__(_ctx, _cache) {
   }], [_directive_hover, _ctx.handleHovering, "desktop"]]);
 }
 var __sfc__ = defineComponent({
-  name: 'VarButton',
+  name,
   components: {
     VarLoading,
     VarHoverOverlay
@@ -98,7 +99,7 @@ var __sfc__ = defineComponent({
         outline: mode.value === 'outline'
       };
     });
-    var attemptAutoLoading = result => {
+    function attemptAutoLoading(result) {
       if (props.autoLoading) {
         pending.value = true;
         result = isArray(result) ? result : [result];
@@ -108,8 +109,8 @@ var __sfc__ = defineComponent({
           pending.value = false;
         });
       }
-    };
-    var handleClick = e => {
+    }
+    function handleClick(e) {
       var {
         loading,
         disabled,
@@ -119,8 +120,8 @@ var __sfc__ = defineComponent({
         return;
       }
       attemptAutoLoading(call(onClick, e));
-    };
-    var handleTouchstart = e => {
+    }
+    function handleTouchstart(e) {
       var {
         loading,
         disabled,
@@ -130,13 +131,13 @@ var __sfc__ = defineComponent({
         return;
       }
       attemptAutoLoading(call(onTouchstart, e));
-    };
+    }
     return {
-      n,
-      classes,
       pending,
       states,
       hovering,
+      n,
+      classes,
       handleHovering,
       handleClick,
       handleTouchstart