@varlet/ui 1.26.0 → 1.26.1-alpha.1644652196468

package/es/button/Button.js

@@ -2,7 +2,7 @@ import Ripple from '../ripple';
 import VarLoading from '../loading';
 import { defineComponent, ref } from 'vue';
 import { props } from './props';
-import { resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, renderSlot as _renderSlot, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, normalizeStyle as _normalizeStyle, resolveDirective as _resolveDirective, withDirectives as _withDirectives, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
+import { resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, renderSlot as _renderSlot, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, normalizeStyle as _normalizeStyle, resolveDirective as _resolveDirective, createElementBlock as _createElementBlock, withDirectives as _withDirectives, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
 
 var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
 

package/es/checkbox/Checkbox.js

@@ -6,7 +6,7 @@ import { props } from './props';
 import { useValidation } from '../utils/components';
 import { useCheckboxGroup } from './provide';
 import { useForm } from '../form/provide';
-import { renderSlot as _renderSlot, resolveComponent as _resolveComponent, normalizeClass as _normalizeClass, createVNode as _createVNode, normalizeStyle as _normalizeStyle, resolveDirective as _resolveDirective, createElementVNode as _createElementVNode, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
+import { renderSlot as _renderSlot, resolveComponent as _resolveComponent, normalizeClass as _normalizeClass, createVNode as _createVNode, normalizeStyle as _normalizeStyle, resolveDirective as _resolveDirective, openBlock as _openBlock, createElementBlock as _createElementBlock, withDirectives as _withDirectives, createElementVNode as _createElementVNode, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
 
 var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
 
@@ -25,7 +25,7 @@ export function render(_ctx, _cache) {
     onClick: _cache[0] || (_cache[0] = function () {
       return _ctx.handleClick && _ctx.handleClick(...arguments);
     })
-  }, [_createElementVNode("div", _hoisted_1, [_withDirectives(_createElementVNode("div", {
+  }, [_createElementVNode("div", _hoisted_1, [_withDirectives((_openBlock(), _createElementBlock("div", {
     class: _normalizeClass(["var-checkbox__action", [_ctx.checked ? 'var-checkbox--checked' : 'var-checkbox--unchecked', _ctx.errorMessage || _ctx.checkboxGroupErrorMessage ? 'var-checkbox--error' : null, _ctx.formDisabled || _ctx.disabled ? 'var-checkbox--disabled' : null]]),
     style: _normalizeStyle({
       color: _ctx.checked ? _ctx.checkedColor : _ctx.uncheckedColor
@@ -50,7 +50,7 @@ export function render(_ctx, _cache) {
   /* PROPS */
   , ["class", "size"])])], 6
   /* CLASS, STYLE */
-  ), [[_directive_ripple, {
+  )), [[_directive_ripple, {
     disabled: _ctx.formReadonly || _ctx.readonly || _ctx.formDisabled || _ctx.disabled || !_ctx.ripple
   }]]), _createElementVNode("div", {
     class: _normalizeClass(["var-checkbox__text", [_ctx.errorMessage || _ctx.checkboxGroupErrorMessage ? 'var-checkbox--error' : null, _ctx.formDisabled || _ctx.disabled ? 'var-checkbox--disabled' : null]])

package/es/list/List.js

@@ -9,7 +9,7 @@ import { getParentScroller, toPxNum } from '../utils/elements';
 import { props } from './props';
 import { isNumber, dt } from '../utils/shared';
 import { pack } from '../locale';
-import { renderSlot as _renderSlot, toDisplayString as _toDisplayString, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, createVNode as _createVNode, createCommentVNode as _createCommentVNode, createTextVNode as _createTextVNode, resolveDirective as _resolveDirective, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
+import { renderSlot as _renderSlot, toDisplayString as _toDisplayString, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, createVNode as _createVNode, createCommentVNode as _createCommentVNode, createTextVNode as _createTextVNode, resolveDirective as _resolveDirective, openBlock as _openBlock, createElementBlock as _createElementBlock, withDirectives as _withDirectives, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
 
 var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
 
@@ -48,16 +48,14 @@ export function render(_ctx, _cache) {
   /* TEXT */
   )]) : _createCommentVNode("v-if", true), _ctx.error ? _renderSlot(_ctx.$slots, "error", {
     key: 2
-  }, () => [_withDirectives(_createElementVNode("div", {
+  }, () => [_withDirectives((_openBlock(), _createElementBlock("div", {
     class: "var-list__error",
     onClick: _cache[0] || (_cache[0] = function () {
       return _ctx.load && _ctx.load(...arguments);
     })
   }, [_createTextVNode(_toDisplayString(_ctx.dt(_ctx.errorText, _ctx.pack.listErrorText)), 1
   /* TEXT */
-  )], 512
-  /* NEED_PATCH */
-  ), [[_directive_ripple]])]) : _createCommentVNode("v-if", true), _createElementVNode("div", _hoisted_5, null, 512
+  )])), [[_directive_ripple]])]) : _createCommentVNode("v-if", true), _createElementVNode("div", _hoisted_5, null, 512
   /* NEED_PATCH */
   )], 512
   /* NEED_PATCH */

package/es/option/Option.js

@@ -3,7 +3,7 @@ import Ripple from '../ripple';
 import { defineComponent, computed, ref, watch } from 'vue';
 import { useSelect } from './provide';
 import { props } from './props';
-import { normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, withModifiers as _withModifiers, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, renderSlot as _renderSlot, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, resolveDirective as _resolveDirective, withDirectives as _withDirectives, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
+import { normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, withModifiers as _withModifiers, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, renderSlot as _renderSlot, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, resolveDirective as _resolveDirective, createElementBlock as _createElementBlock, withDirectives as _withDirectives, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
 
 var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
 

package/es/pagination/Pagination.js

@@ -7,7 +7,7 @@ import { defineComponent, ref, computed, watch } from 'vue';
 import { props } from './porps';
 import { isNumber, toNumber } from '../utils/shared';
 import { pack } from '../locale';
-import { renderSlot as _renderSlot, resolveComponent as _resolveComponent, createVNode as _createVNode, normalizeClass as _normalizeClass, resolveDirective as _resolveDirective, createElementVNode as _createElementVNode, withDirectives as _withDirectives, withKeys as _withKeys, toDisplayString as _toDisplayString, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, renderList as _renderList, Fragment as _Fragment, createTextVNode as _createTextVNode, withCtx as _withCtx, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
+import { renderSlot as _renderSlot, resolveComponent as _resolveComponent, createVNode as _createVNode, normalizeClass as _normalizeClass, resolveDirective as _resolveDirective, openBlock as _openBlock, createElementBlock as _createElementBlock, withDirectives as _withDirectives, withKeys as _withKeys, toDisplayString as _toDisplayString, createElementVNode as _createElementVNode, createCommentVNode as _createCommentVNode, renderList as _renderList, Fragment as _Fragment, createTextVNode as _createTextVNode, withCtx as _withCtx, createBlock as _createBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
 
 var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
 
@@ -30,7 +30,7 @@ export function render(_ctx, _cache) {
 
   var _directive_ripple = _resolveDirective("ripple");
 
-  return _openBlock(), _createElementBlock("ul", _hoisted_1, [_withDirectives(_createElementVNode("li", {
+  return _openBlock(), _createElementBlock("ul", _hoisted_1, [_withDirectives((_openBlock(), _createElementBlock("li", {
     class: _normalizeClass(["var-pagination__item var-pagination__prev", {
       'var-pagination__item-disabled': _ctx.current <= 1 || _ctx.disabled,
       'var-pagination__item-hover': _ctx.simple,
@@ -41,7 +41,7 @@ export function render(_ctx, _cache) {
     name: "chevron-left"
   })])], 2
   /* CLASS */
-  ), [[_directive_ripple, {
+  )), [[_directive_ripple, {
     disabled: _ctx.current <= 1 || _ctx.disabled
   }]]), _ctx.simple ? (_openBlock(), _createElementBlock("li", {
     key: 0,
@@ -83,7 +83,7 @@ export function render(_ctx, _cache) {
     }]]);
   }), 128
   /* KEYED_FRAGMENT */
-  )), _withDirectives(_createElementVNode("li", {
+  )), _withDirectives((_openBlock(), _createElementBlock("li", {
     class: _normalizeClass(["var-pagination__item var-pagination__next", {
       'var-pagination__item-disabled': _ctx.current >= _ctx.pageCount || _ctx.disabled,
       'var-pagination__item-hover': _ctx.simple,
@@ -94,7 +94,7 @@ export function render(_ctx, _cache) {
     name: "chevron-right"
   })])], 2
   /* CLASS */
-  ), [[_directive_ripple, {
+  )), [[_directive_ripple, {
     disabled: _ctx.current >= _ctx.pageCount || _ctx.disabled
   }]]), _ctx.showSizeChanger ? (_openBlock(), _createElementBlock("li", {
     key: 2,

package/es/picker/Picker.js

@@ -90,6 +90,7 @@ export function render(_ctx, _cache) {
         onTouchend: $event => _ctx.handleTouchend($event, c)
       }, [_createElementVNode("div", {
         class: "var-picker__scroller",
+        ref_for: true,
         ref: el => _ctx.getScrollEl(el, c),
         style: _normalizeStyle({
           transform: "translateY(" + c.translate + "px)",

package/es/radio/Radio.js

@@ -6,7 +6,7 @@ import { props } from './props';
 import { useValidation } from '../utils/components';
 import { useRadioGroup } from './provide';
 import { useForm } from '../form/provide';
-import { renderSlot as _renderSlot, resolveComponent as _resolveComponent, normalizeClass as _normalizeClass, createVNode as _createVNode, normalizeStyle as _normalizeStyle, resolveDirective as _resolveDirective, createElementVNode as _createElementVNode, withDirectives as _withDirectives, mergeProps as _mergeProps, openBlock as _openBlock, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
+import { renderSlot as _renderSlot, resolveComponent as _resolveComponent, normalizeClass as _normalizeClass, createVNode as _createVNode, normalizeStyle as _normalizeStyle, resolveDirective as _resolveDirective, openBlock as _openBlock, createElementBlock as _createElementBlock, withDirectives as _withDirectives, createElementVNode as _createElementVNode, mergeProps as _mergeProps, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
 
 var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
 
@@ -25,7 +25,7 @@ export function render(_ctx, _cache) {
     onClick: _cache[0] || (_cache[0] = function () {
       return _ctx.handleClick && _ctx.handleClick(...arguments);
     })
-  }, _ctx.$attrs), [_withDirectives(_createElementVNode("div", {
+  }, _ctx.$attrs), [_withDirectives((_openBlock(), _createElementBlock("div", {
     class: _normalizeClass(["var-radio__action", [_ctx.checked ? 'var-radio--checked' : 'var-radio--unchecked', _ctx.errorMessage || _ctx.radioGroupErrorMessage ? 'var-radio--error' : null, _ctx.formDisabled || _ctx.disabled ? 'var-radio--disabled' : null]]),
     style: _normalizeStyle({
       color: _ctx.checked ? _ctx.checkedColor : _ctx.uncheckedColor
@@ -50,7 +50,7 @@ export function render(_ctx, _cache) {
   /* PROPS */
   , ["class", "size"])])], 6
   /* CLASS, STYLE */
-  ), [[_directive_ripple, {
+  )), [[_directive_ripple, {
     disabled: _ctx.formReadonly || _ctx.readonly || _ctx.formDisabled || _ctx.disabled || !_ctx.ripple
   }]]), _createElementVNode("div", {
     class: _normalizeClass(["var-radio__text", [_ctx.errorMessage || _ctx.radioGroupErrorMessage ? 'var-radio--error' : null, _ctx.formDisabled || _ctx.disabled ? 'var-radio--disabled' : null]])

package/es/select/Select.js

@@ -83,7 +83,7 @@ export function render(_ctx, _cache) {
         type: _ctx.errorMessage ? 'danger' : undefined,
         key: l,
         onClick: _cache[0] || (_cache[0] = _withModifiers(() => {}, ["stop"])),
-        onClose: e => _ctx.handleClose(l)
+        onClose: () => _ctx.handleClose(l)
       }, {
         default: _withCtx(() => [_createTextVNode(_toDisplayString(l), 1
         /* TEXT */

package/es/switch/Switch.js

@@ -6,7 +6,7 @@ import { props } from './props';
 import VarFormDetails from '../form-details';
 import VarLoading from '../loading';
 import Ripple from '../ripple';
-import { normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, resolveDirective as _resolveDirective, withDirectives as _withDirectives, createVNode as _createVNode, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
+import { normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, resolveDirective as _resolveDirective, createElementBlock as _createElementBlock, withDirectives as _withDirectives, createVNode as _createVNode, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
 
 var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
 
@@ -31,7 +31,7 @@ export function render(_ctx, _cache) {
     class: _normalizeClass(["var-switch__track", [_ctx.modelValue === _ctx.activeValue ? 'var-switch__track-active' : null, _ctx.errorMessage ? 'var-switch__track-error' : null]])
   }, null, 6
   /* CLASS, STYLE */
-  ), _withDirectives(_createElementVNode("div", {
+  ), _withDirectives((_openBlock(), _createElementBlock("div", {
     class: "var-switch__ripple",
     style: _normalizeStyle(_ctx.styleComputed.ripple)
   }, [_createElementVNode("div", {
@@ -46,7 +46,7 @@ export function render(_ctx, _cache) {
   /* CLASS, STYLE */
   )], 4
   /* STYLE */
-  ), [[_directive_ripple, {
+  )), [[_directive_ripple, {
     disabled: !_ctx.ripple || _ctx.disabled || _ctx.loading || _ctx.formDisabled
   }]])], 6
   /* CLASS, STYLE */

package/es/tab/Tab.js

@@ -2,7 +2,7 @@ import Ripple from '../ripple';
 import { defineComponent, ref, computed, watch } from 'vue';
 import { props } from './props';
 import { useTabs } from './provide';
-import { renderSlot as _renderSlot, normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, resolveDirective as _resolveDirective, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
+import { renderSlot as _renderSlot, normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, resolveDirective as _resolveDirective, openBlock as _openBlock, createElementBlock as _createElementBlock, withDirectives as _withDirectives } from "vue";
 export function render(_ctx, _cache) {
   var _directive_ripple = _resolveDirective("ripple");
 

package/es/time-picker/TimePicker.js

@@ -4,7 +4,7 @@ import Clock from './clock.js'
 import { props, hoursAmpm, hours24 } from './props';
 import { toNumber } from '../utils/shared';
 import { getNumberTime, getIsDisableMinute, getIsDisableSecond } from './utils';
-import { toDisplayString as _toDisplayString, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, normalizeStyle as _normalizeStyle, resolveComponent as _resolveComponent, createVNode as _createVNode, Transition as _Transition, withCtx as _withCtx, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
+import { toDisplayString as _toDisplayString, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, normalizeStyle as _normalizeStyle, resolveComponent as _resolveComponent, createBlock as _createBlock, Transition as _Transition, withCtx as _withCtx, createVNode as _createVNode, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
 
 var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
 
@@ -80,7 +80,7 @@ export function render(_ctx, _cache) {
   }, [_createVNode(_Transition, {
     name: "var-time-picker-panel-fade"
   }, {
-    default: _withCtx(() => [_createVNode(_component_clock, {
+    default: _withCtx(() => [(_openBlock(), _createBlock(_component_clock, {
       key: _ctx.type,
       ref: "inner",
       type: _ctx.type,
@@ -99,7 +99,7 @@ export function render(_ctx, _cache) {
       onChangePreventUpdate: _ctx.changePreventUpdate
     }, null, 8
     /* PROPS */
-    , ["type", "ampm", "color", "is-inner", "format", "allowed-time", "rad", "time", "prevent-next-update", "use-seconds", "max", "min", "onUpdate", "onChangePreventUpdate"])]),
+    , ["type", "ampm", "color", "is-inner", "format", "allowed-time", "rad", "time", "prevent-next-update", "use-seconds", "max", "min", "onUpdate", "onChangePreventUpdate"]))]),
     _: 1
     /* STABLE */
 

package/es/varlet.esm.js

@@ -2368,7 +2368,7 @@ function render$N(_ctx, _cache) {
     onClick: _cache[0] || (_cache[0] = function() {
       return _ctx.handleClick && _ctx.handleClick(...arguments);
     })
-  }, [createElementVNode("div", _hoisted_1$A, [withDirectives(createElementVNode("div", {
+  }, [createElementVNode("div", _hoisted_1$A, [withDirectives((openBlock(), createElementBlock("div", {
     class: normalizeClass(["var-checkbox__action", [_ctx.checked ? "var-checkbox--checked" : "var-checkbox--unchecked", _ctx.errorMessage || _ctx.checkboxGroupErrorMessage ? "var-checkbox--error" : null, _ctx.formDisabled || _ctx.disabled ? "var-checkbox--disabled" : null]]),
     style: normalizeStyle({
       color: _ctx.checked ? _ctx.checkedColor : _ctx.uncheckedColor
@@ -2387,7 +2387,7 @@ function render$N(_ctx, _cache) {
     name: "checkbox-blank-outline",
     size: _ctx.iconSize,
     "var-checkbox-cover": ""
-  }, null, 8, ["class", "size"])])], 6), [[_directive_ripple, {
+  }, null, 8, ["class", "size"])])], 6)), [[_directive_ripple, {
     disabled: _ctx.formReadonly || _ctx.readonly || _ctx.formDisabled || _ctx.disabled || !_ctx.ripple
   }]]), createElementVNode("div", {
     class: normalizeClass(["var-checkbox__text", [_ctx.errorMessage || _ctx.checkboxGroupErrorMessage ? "var-checkbox--error" : null, _ctx.formDisabled || _ctx.disabled ? "var-checkbox--disabled" : null]])
@@ -6050,7 +6050,7 @@ var padZoneStr = function padZoneStr2(instance) {
   var minutes = Math.abs(negMinutes);
   var hourOffset = Math.floor(minutes / 60);
   var minuteOffset = minutes % 60;
-  return "" + (negMinutes <= 0 ? "+" : "-") + padStart(hourOffset, 2, "0") + ":" + padStart(minuteOffset, 2, "0");
+  return (negMinutes <= 0 ? "+" : "-") + padStart(hourOffset, 2, "0") + ":" + padStart(minuteOffset, 2, "0");
 };
 var monthDiff = function monthDiff2(a, b) {
   if (a.date() < b.date())
@@ -10324,12 +10324,12 @@ function render$p(_ctx, _cache) {
     key: 1
   }, () => [createElementVNode("div", _hoisted_4$6, toDisplayString(_ctx.dt(_ctx.finishedText, _ctx.pack.listFinishedText)), 1)]) : createCommentVNode("v-if", true), _ctx.error ? renderSlot(_ctx.$slots, "error", {
     key: 2
-  }, () => [withDirectives(createElementVNode("div", {
+  }, () => [withDirectives((openBlock(), createElementBlock("div", {
     class: "var-list__error",
     onClick: _cache[0] || (_cache[0] = function() {
       return _ctx.load && _ctx.load(...arguments);
     })
-  }, [createTextVNode(toDisplayString(_ctx.dt(_ctx.errorText, _ctx.pack.listErrorText)), 1)], 512), [[_directive_ripple]])]) : createCommentVNode("v-if", true), createElementVNode("div", _hoisted_5$6, null, 512)], 512);
+  }, [createTextVNode(toDisplayString(_ctx.dt(_ctx.errorText, _ctx.pack.listErrorText)), 1)])), [[_directive_ripple]])]) : createCommentVNode("v-if", true), createElementVNode("div", _hoisted_5$6, null, 512)], 512);
 }
 var List = defineComponent({
   render: render$p,
@@ -10772,7 +10772,7 @@ function render$n(_ctx, _cache) {
   var _component_var_cell = resolveComponent("var-cell");
   var _component_var_menu = resolveComponent("var-menu");
   var _directive_ripple = resolveDirective("ripple");
-  return openBlock(), createElementBlock("ul", _hoisted_1$f, [withDirectives(createElementVNode("li", {
+  return openBlock(), createElementBlock("ul", _hoisted_1$f, [withDirectives((openBlock(), createElementBlock("li", {
     class: normalizeClass(["var-pagination__item var-pagination__prev", {
       "var-pagination__item-disabled": _ctx.current <= 1 || _ctx.disabled,
       "var-pagination__item-hover": _ctx.simple,
@@ -10781,7 +10781,7 @@ function render$n(_ctx, _cache) {
     onClick: _cache[0] || (_cache[0] = ($event) => _ctx.clickItem("prev"))
   }, [renderSlot(_ctx.$slots, "prev", {}, () => [createVNode(_component_var_icon, {
     name: "chevron-left"
-  })])], 2), [[_directive_ripple, {
+  })])], 2)), [[_directive_ripple, {
     disabled: _ctx.current <= 1 || _ctx.disabled
   }]]), _ctx.simple ? (openBlock(), createElementBlock("li", {
     key: 0,
@@ -10811,7 +10811,7 @@ function render$n(_ctx, _cache) {
     }, [createTextVNode(toDisplayString(item), 1)], 10, _hoisted_2$b)), [[_directive_ripple, {
       disabled: _ctx.disabled
     }]]);
-  }), 128)), withDirectives(createElementVNode("li", {
+  }), 128)), withDirectives((openBlock(), createElementBlock("li", {
     class: normalizeClass(["var-pagination__item var-pagination__next", {
       "var-pagination__item-disabled": _ctx.current >= _ctx.pageCount || _ctx.disabled,
       "var-pagination__item-hover": _ctx.simple,
@@ -10820,7 +10820,7 @@ function render$n(_ctx, _cache) {
     onClick: _cache[4] || (_cache[4] = ($event) => _ctx.clickItem("next"))
   }, [renderSlot(_ctx.$slots, "next", {}, () => [createVNode(_component_var_icon, {
     name: "chevron-right"
-  })])], 2), [[_directive_ripple, {
+  })])], 2)), [[_directive_ripple, {
     disabled: _ctx.current >= _ctx.pageCount || _ctx.disabled
   }]]), _ctx.showSizeChanger ? (openBlock(), createElementBlock("li", {
     key: 2,
@@ -11185,6 +11185,7 @@ function render$m(_ctx, _cache) {
         onTouchend: ($event) => _ctx.handleTouchend($event, c)
       }, [createElementVNode("div", {
         class: "var-picker__scroller",
+        ref_for: true,
         ref: (el) => _ctx.getScrollEl(el, c),
         style: normalizeStyle({
           transform: "translateY(" + c.translate + "px)",
@@ -11949,7 +11950,7 @@ function render$j(_ctx, _cache) {
     onClick: _cache[0] || (_cache[0] = function() {
       return _ctx.handleClick && _ctx.handleClick(...arguments);
     })
-  }, _ctx.$attrs), [withDirectives(createElementVNode("div", {
+  }, _ctx.$attrs), [withDirectives((openBlock(), createElementBlock("div", {
     class: normalizeClass(["var-radio__action", [_ctx.checked ? "var-radio--checked" : "var-radio--unchecked", _ctx.errorMessage || _ctx.radioGroupErrorMessage ? "var-radio--error" : null, _ctx.formDisabled || _ctx.disabled ? "var-radio--disabled" : null]]),
     style: normalizeStyle({
       color: _ctx.checked ? _ctx.checkedColor : _ctx.uncheckedColor
@@ -11968,7 +11969,7 @@ function render$j(_ctx, _cache) {
     "var-radio-cover": "",
     name: "radio-blank",
     size: _ctx.iconSize
-  }, null, 8, ["class", "size"])])], 6), [[_directive_ripple, {
+  }, null, 8, ["class", "size"])])], 6)), [[_directive_ripple, {
     disabled: _ctx.formReadonly || _ctx.readonly || _ctx.formDisabled || _ctx.disabled || !_ctx.ripple
   }]]), createElementVNode("div", {
     class: normalizeClass(["var-radio__text", [_ctx.errorMessage || _ctx.radioGroupErrorMessage ? "var-radio--error" : null, _ctx.formDisabled || _ctx.disabled ? "var-radio--disabled" : null]])
@@ -12682,7 +12683,7 @@ function render$f(_ctx, _cache) {
         key: l,
         onClick: _cache[0] || (_cache[0] = withModifiers(() => {
         }, ["stop"])),
-        onClose: (e) => _ctx.handleClose(l)
+        onClose: () => _ctx.handleClose(l)
       }, {
         default: withCtx(() => [createTextVNode(toDisplayString(l), 1)]),
         _: 2
@@ -14379,7 +14380,7 @@ function render$8(_ctx, _cache) {
   }, [createElementVNode("div", {
     style: normalizeStyle(_ctx.styleComputed.track),
     class: normalizeClass(["var-switch__track", [_ctx.modelValue === _ctx.activeValue ? "var-switch__track-active" : null, _ctx.errorMessage ? "var-switch__track-error" : null]])
-  }, null, 6), withDirectives(createElementVNode("div", {
+  }, null, 6), withDirectives((openBlock(), createElementBlock("div", {
     class: "var-switch__ripple",
     style: normalizeStyle(_ctx.styleComputed.ripple)
   }, [createElementVNode("div", {
@@ -14388,7 +14389,7 @@ function render$8(_ctx, _cache) {
   }, [_ctx.loading ? (openBlock(), createBlock(_component_var_loading, {
     key: 0,
     radius: _ctx.toNumber(_ctx.size) / 2 - 2
-  }, null, 8, ["radius"])) : createCommentVNode("v-if", true)], 6)], 4), [[_directive_ripple, {
+  }, null, 8, ["radius"])) : createCommentVNode("v-if", true)], 6)], 4)), [[_directive_ripple, {
     disabled: !_ctx.ripple || _ctx.disabled || _ctx.loading || _ctx.formDisabled
   }]])], 6), createVNode(_component_var_form_details, {
     "error-message": _ctx.errorMessage
@@ -15547,7 +15548,7 @@ var Clock = defineComponent({
         } = allowedTime;
         var _disableAmpmHours3 = hoursAmpm.filter((hour) => !hours(toNumber(hour)));
         var _disable24Hours3 = hours24.filter((hour) => !hours(toNumber(hour)));
-        disableHour.value = [...new Set([...disableHour.value, ..._disableAmpmHours3, ..._disable24Hours3])];
+        disableHour.value = [.../* @__PURE__ */ new Set([...disableHour.value, ..._disableAmpmHours3, ..._disable24Hours3])];
       }
       disable24HourIndex.value = disableHour.value.map((hour) => hours24.findIndex((hour24) => hour === hour24)).filter((hour) => hour >= 0);
     }, {
@@ -15623,7 +15624,7 @@ function render$1(_ctx, _cache) {
   }, [createVNode(Transition, {
     name: "var-time-picker-panel-fade"
   }, {
-    default: withCtx(() => [createVNode(_component_clock, {
+    default: withCtx(() => [(openBlock(), createBlock(_component_clock, {
       key: _ctx.type,
       ref: "inner",
       type: _ctx.type,
@@ -15640,7 +15641,7 @@ function render$1(_ctx, _cache) {
       min: _ctx.min,
       onUpdate: _ctx.update,
       onChangePreventUpdate: _ctx.changePreventUpdate
-    }, null, 8, ["type", "ampm", "color", "is-inner", "format", "allowed-time", "rad", "time", "prevent-next-update", "use-seconds", "max", "min", "onUpdate", "onChangePreventUpdate"])]),
+    }, null, 8, ["type", "ampm", "color", "is-inner", "format", "allowed-time", "rad", "time", "prevent-next-update", "use-seconds", "max", "min", "onUpdate", "onChangePreventUpdate"]))]),
     _: 1
   })], 544)])], 2);
 }

package/highlight/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "framework": "vue",
-  "version": "1.25.1",
+  "version": "1.26.0",
   "name": "VARLET",
   "contributions": {
     "html": {

package/lib/checkbox/Checkbox.js

@@ -40,7 +40,7 @@ function render(_ctx, _cache) {
     onClick: _cache[0] || (_cache[0] = function () {
       return _ctx.handleClick && _ctx.handleClick(...arguments);
     })
-  }, [(0, _vue.createElementVNode)("div", _hoisted_1, [(0, _vue.withDirectives)((0, _vue.createElementVNode)("div", {
+  }, [(0, _vue.createElementVNode)("div", _hoisted_1, [(0, _vue.withDirectives)(((0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
     class: (0, _vue.normalizeClass)(["var-checkbox__action", [_ctx.checked ? 'var-checkbox--checked' : 'var-checkbox--unchecked', _ctx.errorMessage || _ctx.checkboxGroupErrorMessage ? 'var-checkbox--error' : null, _ctx.formDisabled || _ctx.disabled ? 'var-checkbox--disabled' : null]]),
     style: (0, _vue.normalizeStyle)({
       color: _ctx.checked ? _ctx.checkedColor : _ctx.uncheckedColor
@@ -65,7 +65,7 @@ function render(_ctx, _cache) {
   /* PROPS */
   , ["class", "size"])])], 6
   /* CLASS, STYLE */
-  ), [[_directive_ripple, {
+  )), [[_directive_ripple, {
     disabled: _ctx.formReadonly || _ctx.readonly || _ctx.formDisabled || _ctx.disabled || !_ctx.ripple
   }]]), (0, _vue.createElementVNode)("div", {
     class: (0, _vue.normalizeClass)(["var-checkbox__text", [_ctx.errorMessage || _ctx.checkboxGroupErrorMessage ? 'var-checkbox--error' : null, _ctx.formDisabled || _ctx.disabled ? 'var-checkbox--disabled' : null]])

package/lib/list/List.js

@@ -62,16 +62,14 @@ function render(_ctx, _cache) {
   /* TEXT */
   )]) : (0, _vue.createCommentVNode)("v-if", true), _ctx.error ? (0, _vue.renderSlot)(_ctx.$slots, "error", {
     key: 2
-  }, () => [(0, _vue.withDirectives)((0, _vue.createElementVNode)("div", {
+  }, () => [(0, _vue.withDirectives)(((0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
     class: "var-list__error",
     onClick: _cache[0] || (_cache[0] = function () {
       return _ctx.load && _ctx.load(...arguments);
     })
   }, [(0, _vue.createTextVNode)((0, _vue.toDisplayString)(_ctx.dt(_ctx.errorText, _ctx.pack.listErrorText)), 1
   /* TEXT */
-  )], 512
-  /* NEED_PATCH */
-  ), [[_directive_ripple]])]) : (0, _vue.createCommentVNode)("v-if", true), (0, _vue.createElementVNode)("div", _hoisted_5, null, 512
+  )])), [[_directive_ripple]])]) : (0, _vue.createCommentVNode)("v-if", true), (0, _vue.createElementVNode)("div", _hoisted_5, null, 512
   /* NEED_PATCH */
   )], 512
   /* NEED_PATCH */

package/lib/pagination/Pagination.js

@@ -46,7 +46,7 @@ function render(_ctx, _cache) {
 
   var _directive_ripple = (0, _vue.resolveDirective)("ripple");
 
-  return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("ul", _hoisted_1, [(0, _vue.withDirectives)((0, _vue.createElementVNode)("li", {
+  return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("ul", _hoisted_1, [(0, _vue.withDirectives)(((0, _vue.openBlock)(), (0, _vue.createElementBlock)("li", {
     class: (0, _vue.normalizeClass)(["var-pagination__item var-pagination__prev", {
       'var-pagination__item-disabled': _ctx.current <= 1 || _ctx.disabled,
       'var-pagination__item-hover': _ctx.simple,
@@ -57,7 +57,7 @@ function render(_ctx, _cache) {
     name: "chevron-left"
   })])], 2
   /* CLASS */
-  ), [[_directive_ripple, {
+  )), [[_directive_ripple, {
     disabled: _ctx.current <= 1 || _ctx.disabled
   }]]), _ctx.simple ? ((0, _vue.openBlock)(), (0, _vue.createElementBlock)("li", {
     key: 0,
@@ -99,7 +99,7 @@ function render(_ctx, _cache) {
     }]]);
   }), 128
   /* KEYED_FRAGMENT */
-  )), (0, _vue.withDirectives)((0, _vue.createElementVNode)("li", {
+  )), (0, _vue.withDirectives)(((0, _vue.openBlock)(), (0, _vue.createElementBlock)("li", {
     class: (0, _vue.normalizeClass)(["var-pagination__item var-pagination__next", {
       'var-pagination__item-disabled': _ctx.current >= _ctx.pageCount || _ctx.disabled,
       'var-pagination__item-hover': _ctx.simple,
@@ -110,7 +110,7 @@ function render(_ctx, _cache) {
     name: "chevron-right"
   })])], 2
   /* CLASS */
-  ), [[_directive_ripple, {
+  )), [[_directive_ripple, {
     disabled: _ctx.current >= _ctx.pageCount || _ctx.disabled
   }]]), _ctx.showSizeChanger ? ((0, _vue.openBlock)(), (0, _vue.createElementBlock)("li", {
     key: 2,

package/lib/picker/Picker.js

@@ -105,6 +105,7 @@ function render(_ctx, _cache) {
         onTouchend: $event => _ctx.handleTouchend($event, c)
       }, [(0, _vue.createElementVNode)("div", {
         class: "var-picker__scroller",
+        ref_for: true,
         ref: el => _ctx.getScrollEl(el, c),
         style: (0, _vue.normalizeStyle)({
           transform: "translateY(" + c.translate + "px)",

package/lib/radio/Radio.js

@@ -40,7 +40,7 @@ function render(_ctx, _cache) {
     onClick: _cache[0] || (_cache[0] = function () {
       return _ctx.handleClick && _ctx.handleClick(...arguments);
     })
-  }, _ctx.$attrs), [(0, _vue.withDirectives)((0, _vue.createElementVNode)("div", {
+  }, _ctx.$attrs), [(0, _vue.withDirectives)(((0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
     class: (0, _vue.normalizeClass)(["var-radio__action", [_ctx.checked ? 'var-radio--checked' : 'var-radio--unchecked', _ctx.errorMessage || _ctx.radioGroupErrorMessage ? 'var-radio--error' : null, _ctx.formDisabled || _ctx.disabled ? 'var-radio--disabled' : null]]),
     style: (0, _vue.normalizeStyle)({
       color: _ctx.checked ? _ctx.checkedColor : _ctx.uncheckedColor
@@ -65,7 +65,7 @@ function render(_ctx, _cache) {
   /* PROPS */
   , ["class", "size"])])], 6
   /* CLASS, STYLE */
-  ), [[_directive_ripple, {
+  )), [[_directive_ripple, {
     disabled: _ctx.formReadonly || _ctx.readonly || _ctx.formDisabled || _ctx.disabled || !_ctx.ripple
   }]]), (0, _vue.createElementVNode)("div", {
     class: (0, _vue.normalizeClass)(["var-radio__text", [_ctx.errorMessage || _ctx.radioGroupErrorMessage ? 'var-radio--error' : null, _ctx.formDisabled || _ctx.disabled ? 'var-radio--disabled' : null]])

package/lib/select/Select.js

@@ -101,7 +101,7 @@ function render(_ctx, _cache) {
         type: _ctx.errorMessage ? 'danger' : undefined,
         key: l,
         onClick: _cache[0] || (_cache[0] = (0, _vue.withModifiers)(() => {}, ["stop"])),
-        onClose: e => _ctx.handleClose(l)
+        onClose: () => _ctx.handleClose(l)
       }, {
         default: (0, _vue.withCtx)(() => [(0, _vue.createTextVNode)((0, _vue.toDisplayString)(l), 1
         /* TEXT */

package/lib/switch/Switch.js

@@ -46,7 +46,7 @@ function render(_ctx, _cache) {
     class: (0, _vue.normalizeClass)(["var-switch__track", [_ctx.modelValue === _ctx.activeValue ? 'var-switch__track-active' : null, _ctx.errorMessage ? 'var-switch__track-error' : null]])
   }, null, 6
   /* CLASS, STYLE */
-  ), (0, _vue.withDirectives)((0, _vue.createElementVNode)("div", {
+  ), (0, _vue.withDirectives)(((0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
     class: "var-switch__ripple",
     style: (0, _vue.normalizeStyle)(_ctx.styleComputed.ripple)
   }, [(0, _vue.createElementVNode)("div", {
@@ -61,7 +61,7 @@ function render(_ctx, _cache) {
   /* CLASS, STYLE */
   )], 4
   /* STYLE */
-  ), [[_directive_ripple, {
+  )), [[_directive_ripple, {
     disabled: !_ctx.ripple || _ctx.disabled || _ctx.loading || _ctx.formDisabled
   }]])], 6
   /* CLASS, STYLE */

package/lib/time-picker/TimePicker.js

@@ -93,7 +93,7 @@ function render(_ctx, _cache) {
   }, [(0, _vue.createVNode)(_vue.Transition, {
     name: "var-time-picker-panel-fade"
   }, {
-    default: (0, _vue.withCtx)(() => [(0, _vue.createVNode)(_component_clock, {
+    default: (0, _vue.withCtx)(() => [((0, _vue.openBlock)(), (0, _vue.createBlock)(_component_clock, {
       key: _ctx.type,
       ref: "inner",
       type: _ctx.type,
@@ -112,7 +112,7 @@ function render(_ctx, _cache) {
       onChangePreventUpdate: _ctx.changePreventUpdate
     }, null, 8
     /* PROPS */
-    , ["type", "ampm", "color", "is-inner", "format", "allowed-time", "rad", "time", "prevent-next-update", "use-seconds", "max", "min", "onUpdate", "onChangePreventUpdate"])]),
+    , ["type", "ampm", "color", "is-inner", "format", "allowed-time", "rad", "time", "prevent-next-update", "use-seconds", "max", "min", "onUpdate", "onChangePreventUpdate"]))]),
     _: 1
     /* STABLE */
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/ui",
-  "version": "1.26.0",
+  "version": "1.26.1-alpha.1644652196468",
   "description": "A material like components library",
   "module": "es/index.js",
   "main": "lib/index.js",
@@ -39,19 +39,19 @@
   },
   "gitHead": "ee9c3866bedad96c86365b0f9888a3a6bb781b1f",
   "dependencies": {
-    "@varlet/icons": "1.26.0",
+    "@varlet/icons": "1.26.1-alpha.1644652196468",
     "dayjs": "^1.10.4",
     "decimal.js": "^10.2.1"
   },
   "devDependencies": {
-    "@varlet/cli": "1.26.0",
-    "@varlet/touch-emulator": "1.26.0",
+    "@varlet/cli": "1.26.1-alpha.1644652196468",
+    "@varlet/touch-emulator": "1.26.1-alpha.1644652196468",
     "@vue/test-utils": "2.0.0-rc.6",
-    "@vue/runtime-core": "^3.2.16",
+    "@vue/runtime-core": "3.2.25",
     "typescript": "^4.4.4",
     "lodash-es": "^4.17.21",
     "clipboard": "^2.0.6",
-    "vue": "3.2.16",
+    "vue": "3.2.25",
     "vue-router": "4.0.12",
     "live-server": "^1.2.1"
   },