@varlet/ui 1.27.11 → 1.27.14-alpha.1655708896947

package/es/action-sheet/index.js

@@ -1,6 +1,6 @@
 import VarActionSheet from './ActionSheet.js'
 import { nextTick, reactive } from 'vue';
-import { inBrowser } from '../utils/shared';
+import { inBrowser } from '@varlet/shared';
 import { mountInstance } from '../utils/components';
 var singletonOptions;
 

package/es/app-bar/appBar.css

@@ -1 +1 @@
-:root { --app-bar-color: var(--color-primary); --app-bar-title-padding: 0 12px; --app-bar-text-color: #fff; --app-bar-height: 54px; --app-bar-left-gap: 6px; --app-bar-right-gap: 6px;}.var-app-bar { position: relative; display: flex; justify-content: center; align-items: center; height: var(--app-bar-height); background: var(--app-bar-color); color: var(--app-bar-text-color); transition: background-color 0.25s;}.var-app-bar__title { flex: 1; display: flex; justify-content: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: var(--app-bar-title-padding);}.var-app-bar__left,.var-app-bar__right { display: flex; align-items: center; height: 100%; z-index: 2;}.var-app-bar__left { position: absolute; top: 0; left: var(--app-bar-left-gap);}.var-app-bar__right { position: absolute; top: 0; right: var(--app-bar-right-gap);}
+:root { --app-bar-color: var(--color-primary); --app-bar-title-padding: 0 12px; --app-bar-text-color: #fff; --app-bar-height: 54px; --app-bar-left-gap: 6px; --app-bar-right-gap: 6px;}.var-app-bar { position: relative; display: flex; width: 100%; justify-content: center; align-items: center; height: var(--app-bar-height); background: var(--app-bar-color); color: var(--app-bar-text-color); transition: background-color 0.25s;}.var-app-bar__title { flex: 1; display: flex; justify-content: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: var(--app-bar-title-padding);}.var-app-bar__left,.var-app-bar__right { display: flex; align-items: center; height: 100%; z-index: 2;}.var-app-bar__left { position: absolute; top: 0; left: var(--app-bar-left-gap);}.var-app-bar__right { position: absolute; top: 0; right: var(--app-bar-right-gap);}

package/es/app-bar/appBar.less

@@ -17,6 +17,7 @@
 .var-app-bar {
   position: relative;
   display: flex;
+  width: 100%;
   justify-content: center;
   align-items: center;
   height: var(--app-bar-height);

package/es/back-top/BackTop.js

@@ -2,14 +2,15 @@ import { defineComponent, ref, onMounted, onBeforeUnmount } from 'vue';
 import VarButton from '../button';
 import VarIcon from '../icon';
 import { props } from './props';
-import { isString, easeInOutCubic, throttle, isObject } from '../utils/shared';
+import { isString, throttle, isObject } from '@varlet/shared';
+import { easeInOutCubic } from '../utils/shared';
 import { getScrollTop, getScrollLeft, scrollTo, getParentScroller, toPxNum, toSizeUnit } from '../utils/elements';
 import { call, createNamespace } from '../utils/components';
 var {
   n,
   classes
 } = createNamespace('back-top');
-import { renderSlot as _renderSlot, resolveComponent as _resolveComponent, createVNode as _createVNode, withCtx as _withCtx, withModifiers as _withModifiers, normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, Teleport as _Teleport, openBlock as _openBlock, createBlock as _createBlock } from "vue";
+import { renderSlot as _renderSlot, resolveComponent as _resolveComponent, createVNode as _createVNode, withCtx as _withCtx, withModifiers as _withModifiers, mergeProps as _mergeProps, createElementVNode as _createElementVNode, Teleport as _Teleport, openBlock as _openBlock, createBlock as _createBlock } from "vue";
 export function render(_ctx, _cache) {
   var _component_var_icon = _resolveComponent("var-icon");
 
@@ -18,17 +19,18 @@ export function render(_ctx, _cache) {
   return _openBlock(), _createBlock(_Teleport, {
     to: "body",
     disabled: _ctx.disabled
-  }, [_createElementVNode("div", {
-    class: _normalizeClass(_ctx.classes(_ctx.n(), [_ctx.show, _ctx.n('--active')])),
+  }, [_createElementVNode("div", _mergeProps({
+    class: _ctx.classes(_ctx.n(), [_ctx.show, _ctx.n('--active')]),
     ref: "backTopEl",
-    style: _normalizeStyle({
+    style: {
       right: _ctx.toSizeUnit(_ctx.right),
       bottom: _ctx.toSizeUnit(_ctx.bottom)
-    }),
+    }
+  }, _ctx.$attrs, {
     onClick: _cache[0] || (_cache[0] = _withModifiers(function () {
       return _ctx.click && _ctx.click(...arguments);
     }, ["stop"]))
-  }, [_renderSlot(_ctx.$slots, "default", {}, () => [_createVNode(_component_var_button, {
+  }), [_renderSlot(_ctx.$slots, "default", {}, () => [_createVNode(_component_var_button, {
     type: "primary",
     round: "",
     "var-back-top-cover": ""
@@ -39,8 +41,8 @@ export function render(_ctx, _cache) {
     _: 1
     /* STABLE */
 
-  })])], 6
-  /* CLASS, STYLE */
+  })])], 16
+  /* FULL_PROPS */
   )], 8
   /* PROPS */
   , ["disabled"]);
@@ -52,6 +54,7 @@ export default defineComponent({
     VarButton,
     VarIcon
   },
+  inheritAttrs: false,
   props,
 
   setup(props) {

package/es/badge/Badge.js

@@ -1,7 +1,7 @@
 import VarIcon from '../icon';
+import { toNumber } from '@varlet/shared';
 import { computed, defineComponent } from 'vue';
 import { props } from './props';
-import { toNumber } from '../utils/shared';
 import { createNamespace } from '../utils/components';
 var {
   n,

package/es/bottom-navigation/BottomNavigation.js

@@ -5,7 +5,7 @@ import { defineComponent, ref, computed, onMounted, onUpdated, watch } from 'vue
 import { props } from './props';
 import { useBottomNavigationItems } from './provide';
 import { createNamespace, call } from '../utils/components';
-import { isNumber } from '../utils/shared';
+import { isNumber } from '@varlet/shared';
 var {
   n,
   classes

package/es/card/card.css

@@ -1 +1 @@
-:root { --card-padding: 0 0 15px 0; --card-background: #fff; --card-border-radius: 4px; --card-image-width: 100%; --card-row-image-width: 140px; --card-image-height: 200px; --card-row-height: 140px; --card-title-color: #333; --card-title-font-size: 20px; --card-title-padding: 0 12px; --card-title-margin: 15px 0 0 0; --card-title-row-margin: 12px 0; --card-subtitle-color: rgba(0, 0, 0, 0.6); --card-subtitle-font-size: 14px; --card-subtitle-padding: 0 12px; --card-subtitle-margin: 10px 0 0 0; --card-subtitle-row-margin: -8px 0 0 0; --card-description-color: rgba(0, 0, 0, 0.6); --card-description-font-size: 14px; --card-description-margin: 20px 0 0 0; --card-description-padding: 0 13px; --card-footer-padding: 0 12px; --card-footer-right: 13px; --card-footer-bottom: 9px; --card-footer-margin: 30px 0 0px 0; --card-line-height: 22px; --card-row-line-height: 1.5; --card-floating-buttons-bottom: 16px; --card-floating-buttons-right: 16px; --card-floating-buttons-color: #fff; --card-close-button-icon-size: 24px; --card-close-button-size: 56px; --card-close-button-primary-color: #212121;}.var-card { border-radius: var(--card-border-radius); overflow: hidden;}.var-card__floater { display: flex; flex-direction: column; position: static; line-height: var(--card-line-height); background: var(--card-background); transition-timing-function: cubic-bezier(0.45, 0.19, 0.06, 0.89);}.var-card__container { padding: var(--card-padding); flex-grow: 1; min-width: 0;}.var-card--layout-row .var-card__floater { min-height: var(--card-row-height); height: 100%; flex-direction: row; position: relative; line-height: var(--card-row-line-height);}.var-card__image { width: var(--card-image-width); height: var(--card-image-height); display: block;}.var-card--layout-row .var-card__image { width: var(--card-row-image-width); height: auto; display: block; flex-shrink: 0;}.var-card__title { font-size: var(--card-title-font-size); padding: var(--card-title-padding); margin: var(--card-title-margin); color: var(--card-title-color); word-break: break-word;}.var-card--layout-row .var-card__title { max-width: 100%; overflow: hidden; margin: var(--card-title-row-margin); text-overflow: ellipsis; white-space: nowrap;}.var-card__subtitle { font-size: var(--card-subtitle-font-size); color: var(--card-subtitle-color); padding: var(--card-subtitle-padding); margin: var(--card-subtitle-margin); word-break: break-word;}.var-card--layout-row .var-card__subtitle { margin: var(--card-subtitle-row-margin); text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}.var-card__description { font-size: var(--card-description-font-size); color: var(--card-description-color); margin: var(--card-description-margin); padding: var(--card-description-padding); word-break: break-all;}.var-card__footer { display: flex; justify-content: flex-end; padding: var(--card-footer-padding); margin: var(--card-footer-margin);}.var-card--layout-row .var-card__footer { position: absolute; padding: 0; right: var(--card-footer-right); bottom: var(--card-footer-bottom);}.var-card__content { overflow: hidden; transition-timing-function: cubic-bezier(0.45, 0.19, 0.06, 0.89);}.var-card__floating-buttons { position: fixed; bottom: var(--card-floating-buttons-bottom); right: var(--card-floating-buttons-right); color: var(--card-floating-buttons-color);}.var-card__close-button[var-card-cover] { padding: var(--card-close-button-padding); width: var(--card-close-button-size); height: var(--card-close-button-size); background-color: var(--card-close-button-primary-color);}.var-card__close-button-icon[var-card-cover] { font-size: var(--card-close-button-icon-size);}
+:root { --card-padding: 0 0 15px 0; --card-background: #fff; --card-border-radius: 4px; --card-image-width: 100%; --card-row-image-width: 140px; --card-image-height: 200px; --card-row-height: 140px; --card-title-color: #333; --card-title-font-size: 20px; --card-title-padding: 0 12px; --card-title-margin: 15px 0 0 0; --card-title-row-margin: 12px 0; --card-subtitle-color: rgba(0, 0, 0, 0.6); --card-subtitle-font-size: 14px; --card-subtitle-padding: 0 12px; --card-subtitle-margin: 10px 0 0 0; --card-subtitle-row-margin: -8px 0 0 0; --card-description-color: rgba(0, 0, 0, 0.6); --card-description-font-size: 14px; --card-description-margin: 20px 0 0 0; --card-description-padding: 0 13px; --card-footer-padding: 0 12px; --card-footer-right: 13px; --card-footer-bottom: 9px; --card-footer-margin: 30px 0 0px 0; --card-line-height: 22px; --card-row-line-height: 1.5; --card-floating-buttons-bottom: 16px; --card-floating-buttons-right: 16px; --card-floating-buttons-color: #fff; --card-close-button-icon-size: 24px; --card-close-button-size: 56px; --card-close-button-primary-color: #212121;}.var-card { border-radius: var(--card-border-radius); overflow: hidden; width: 100%;}.var-card__floater { display: flex; flex-direction: column; position: static; line-height: var(--card-line-height); background: var(--card-background); transition-timing-function: cubic-bezier(0.45, 0.19, 0.06, 0.89);}.var-card__container { padding: var(--card-padding); flex-grow: 1; min-width: 0;}.var-card--layout-row .var-card__floater { min-height: var(--card-row-height); height: 100%; flex-direction: row; position: relative; line-height: var(--card-row-line-height);}.var-card__image { width: var(--card-image-width); height: var(--card-image-height); display: block;}.var-card--layout-row .var-card__image { width: var(--card-row-image-width); height: auto; display: block; flex-shrink: 0;}.var-card__title { font-size: var(--card-title-font-size); padding: var(--card-title-padding); margin: var(--card-title-margin); color: var(--card-title-color); word-break: break-word;}.var-card--layout-row .var-card__title { max-width: 100%; overflow: hidden; margin: var(--card-title-row-margin); text-overflow: ellipsis; white-space: nowrap;}.var-card__subtitle { font-size: var(--card-subtitle-font-size); color: var(--card-subtitle-color); padding: var(--card-subtitle-padding); margin: var(--card-subtitle-margin); word-break: break-word;}.var-card--layout-row .var-card__subtitle { margin: var(--card-subtitle-row-margin); text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}.var-card__description { font-size: var(--card-description-font-size); color: var(--card-description-color); margin: var(--card-description-margin); padding: var(--card-description-padding); word-break: break-all;}.var-card__footer { display: flex; justify-content: flex-end; padding: var(--card-footer-padding); margin: var(--card-footer-margin);}.var-card--layout-row .var-card__footer { position: absolute; padding: 0; right: var(--card-footer-right); bottom: var(--card-footer-bottom);}.var-card__content { overflow: hidden; transition-timing-function: cubic-bezier(0.45, 0.19, 0.06, 0.89);}.var-card__floating-buttons { position: fixed; bottom: var(--card-floating-buttons-bottom); right: var(--card-floating-buttons-right); color: var(--card-floating-buttons-color);}.var-card__close-button[var-card-cover] { padding: var(--card-close-button-padding); width: var(--card-close-button-size); height: var(--card-close-button-size); background-color: var(--card-close-button-primary-color);}.var-card__close-button-icon[var-card-cover] { font-size: var(--card-close-button-icon-size);}

package/es/card/card.less

@@ -71,6 +71,7 @@
 .var-card {
   border-radius: var(--card-border-radius);
   overflow: hidden;
+  width: 100%;
 
   &__floater {
     display: flex;

package/es/cell/cell.css

@@ -1 +1 @@
-:root { --cell-color: var(--color-text); --cell-font-size: var(--font-size-md); --cell-desc-font-size: var(--font-size-sm); --cell-desc-color: rgba(0, 0, 0, 0.6); --cell-padding: 10px 12px; --cell-min-height: 40px; --cell-border-color: #bcc2cb; --cell-border-left: 12px; --cell-border-right: 12px; --cell-icon-right: 8px; --cell-extra-left: 8px;}.var-cell { align-items: center; display: flex; min-height: var(--cell-min-height); outline: none; padding: var(--cell-padding); position: relative; box-sizing: border-box; font-size: var(--cell-font-size); color: var(--cell-color);}.var-cell--border::after { position: absolute; box-sizing: border-box; content: ' '; pointer-events: none; right: var(--cell-border-right); bottom: 0; left: var(--cell-border-left); border-bottom: 1px solid var(--cell-border-color); transform: scaleY(0.5);}.var-cell__icon { margin-right: var(--cell-icon-right); flex: 0;}.var-cell__content { flex: 1; overflow: hidden;}.var-cell__title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}.var-cell__desc { font-size: var(--cell-desc-font-size); color: var(--cell-desc-color);}.var-cell__extra { flex: 0; margin-left: var(--cell-extra-left);}
+:root { --cell-color: var(--color-text); --cell-font-size: var(--font-size-md); --cell-desc-font-size: var(--font-size-sm); --cell-desc-color: rgba(0, 0, 0, 0.6); --cell-padding: 10px 12px; --cell-min-height: 40px; --cell-border-color: #bcc2cb; --cell-border-left: 12px; --cell-border-right: 12px; --cell-icon-right: 8px; --cell-extra-left: 8px;}.var-cell { align-items: center; display: flex; min-height: var(--cell-min-height); outline: none; width: 100%; padding: var(--cell-padding); position: relative; box-sizing: border-box; font-size: var(--cell-font-size); color: var(--cell-color);}.var-cell--border::after { position: absolute; box-sizing: border-box; content: ' '; pointer-events: none; right: var(--cell-border-right); bottom: 0; left: var(--cell-border-left); border-bottom: 1px solid var(--cell-border-color); transform: scaleY(0.5);}.var-cell__icon { margin-right: var(--cell-icon-right); flex: 0;}.var-cell__content { flex: 1; overflow: hidden;}.var-cell__title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}.var-cell__desc { font-size: var(--cell-desc-font-size); color: var(--cell-desc-color);}.var-cell__extra { flex: 0; margin-left: var(--cell-extra-left);}

package/es/cell/cell.less

@@ -29,6 +29,7 @@
   display: flex;
   min-height: var(--cell-min-height);
   outline: none;
+  width: 100%;
   padding: var(--cell-padding);
   position: relative;
   box-sizing: border-box;

package/es/checkbox-group/CheckboxGroup.js

@@ -4,7 +4,7 @@ import { props } from './props';
 import { useValidation, createNamespace, call } from '../utils/components';
 import { useCheckboxes } from './provide';
 import { useForm } from '../form/provide';
-import { uniq } from '../utils/shared';
+import { uniq } from '@varlet/shared';
 var {
   n,
   classes

package/es/col/Col.js

@@ -1,5 +1,5 @@
 import { defineComponent, ref, computed, watch } from 'vue';
-import { isPlainObject, toNumber } from '../utils/shared';
+import { isPlainObject, toNumber } from '@varlet/shared';
 import { props } from './props';
 import { useRow } from './provide';
 import { toSizeUnit } from '../utils/elements';

package/es/collapse/Collapse.js

@@ -2,7 +2,7 @@ import { computed, defineComponent, nextTick, watch } from 'vue';
 import { useCollapseItem } from './provide';
 import { props } from './props';
 import { call, createNamespace } from '../utils/components';
-import { isArray } from '../utils/shared';
+import { isArray } from '@varlet/shared';
 var {
   n
 } = createNamespace('collapse');

package/es/collapse/CollapseSfc.css

@@ -1 +1 @@
-.var-collapse { position: relative;}
+.var-collapse { position: relative; width: 100%;}

package/es/collapse/CollapseSfc.less

@@ -1 +1 @@
-.var-collapse { position: relative;}
+.var-collapse { position: relative; width: 100%;}

package/es/collapse-item/CollapseItem.js

@@ -1,6 +1,6 @@
 import { defineComponent, ref, nextTick, watch, computed } from 'vue';
 import { requestAnimationFrame } from '../utils/elements';
-import { isArray } from '../utils/shared';
+import { isArray } from '@varlet/shared';
 import { createNamespace } from '../utils/components';
 import { useCollapse } from './provide';
 import { props } from './props';

package/es/countdown/Countdown.js

@@ -1,7 +1,7 @@
 import { defineComponent, ref, watch } from 'vue';
 import { props } from './props';
 import { requestAnimationFrame, cancelAnimationFrame } from '../utils/elements';
-import { toNumber, parseFormat } from '../utils/shared';
+import { toNumber } from '@varlet/shared';
 import { call, createNamespace } from '../utils/components';
 var {
   n
@@ -39,6 +39,33 @@ export default defineComponent({
       milliseconds: 0
     });
 
+    var parseFormat = (format, time) => {
+      var scannedTimes = Object.values(time);
+      var scannedFormats = ['DD', 'HH', 'mm', 'ss'];
+      var padValues = [24, 60, 60, 1000];
+      scannedFormats.forEach((scannedFormat, index) => {
+        if (!format.includes(scannedFormat)) {
+          scannedTimes[index + 1] += scannedTimes[index] * padValues[index];
+        } else {
+          format = format.replace(scannedFormat, String(scannedTimes[index]).padStart(2, '0'));
+        }
+      });
+
+      if (format.includes('S')) {
+        var ms = String(scannedTimes[scannedTimes.length - 1]).padStart(3, '0');
+
+        if (format.includes('SSS')) {
+          format = format.replace('SSS', ms);
+        } else if (format.includes('SS')) {
+          format = format.replace('SS', ms.slice(0, 2));
+        } else {
+          format = format.replace('S', ms.slice(0, 1));
+        }
+      }
+
+      return format;
+    };
+
     var formatTime = durationTime => {
       var days = Math.floor(durationTime / DAY);
       var hours = Math.floor(durationTime % DAY / HOUR);

package/es/counter/Counter.js

@@ -4,7 +4,7 @@ import Ripple from '../ripple';
 import { defineComponent, ref, watch, computed, nextTick } from 'vue';
 import { Decimal } from 'decimal.js';
 import { props } from './props';
-import { toNumber } from '../utils/shared';
+import { toNumber } from '@varlet/shared';
 import { toSizeUnit } from '../utils/elements';
 import { useForm } from '../form/provide';
 import { useValidation, createNamespace, call } from '../utils/components';

package/es/date-picker/DatePicker.js

@@ -4,7 +4,7 @@ import MonthPickerPanel from './src/month-picker-panel.js'
 import YearPickerPanel from './src/year-picker-panel.js'
 import DayPickerPanel from './src/day-picker-panel.js'
 import { props, MONTH_LIST, WEEK_HEADER } from './props';
-import { isArray, toNumber } from '../utils/shared';
+import { isArray, toNumber } from '@varlet/shared';
 import { nextTickFrame } from '../utils/elements';
 import { createNamespace, call } from '../utils/components';
 import { pack } from '../locale';

package/es/date-picker/date-picker.css

@@ -1 +1 @@
-:root { --date-picker-border-radius: 4px; --date-picker-font-size: var(--font-size-md); --date-picker-min-width: 290px; --date-picker-height: 385px; --date-picker-main-color: rgba(0, 0, 0, 0.87); --date-picker-title-padding: 16px; --date-picker-title-background: var(--color-primary); --date-picker-title-color: #fff; --date-picker-title-year-font-size: var(--font-size-md); --date-picker-title-year-font-weight: 500; --date-picker-title-year-margin-bottom: 8px; --date-picker-title-date-height: 48px; --date-picker-title-date-font-size: 34px; --date-picker-title-date-font-weight: 500; --date-picker-title-date-range-font-size: 20px; --date-picker-body-background-color: rgba(0, 0, 0, 0); --picker-header-padding: 4px 16px; --month-picker-padding: 0 12px; --month-picker-item-width: 33%; --month-picker-item-height: 56px; --month-picker-item-button-max-width: 140px; --year-picker-font-weight: 400; --year-picker-item-padding: 8px 0; --year-picker-item-active-font-size: 26px; --year-picker-item-active-font-weight: 500; --year-picker-item-active-font-padding: 10px 0; --year-picker-item-active-color: var(--color-primary); --day-picker-content-item-width: 14.28%; --day-picker-content-item-font-size: var(--font-size-sm); --day-picker-content-item-padding: 2px 0; --day-picker-content-item-button-width: 32px; --day-picker-content-item-button-height: 32px; --day-picker-content-item-button-font-size: var(--font-size-sm); --day-picker-head-item-color: rgba(0, 0, 0, 0.38); --day-picker-head-item-padding: 8px 0; --day-picker-head-item-font-weight: 600;}.var-date-picker { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); border-radius: var(--date-picker-border-radius); contain: layout style; display: flex; flex-direction: column; font-size: var(--date-picker-font-size); position: relative; min-width: var(--date-picker-min-width); height: var(--date-picker-height); overflow: hidden;}.var-date-picker ul { list-style: none; margin: 0; padding: 0;}.var-date-picker__title { padding: var(--date-picker-title-padding); color: var(--date-picker-title-color); background: var(--date-picker-title-background); display: flex; justify-content: space-between; flex-direction: column; flex-wrap: wrap;}.var-date-picker__title-year { opacity: 0.6; cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); align-items: center; display: inline-flex; font-size: var(--date-picker-title-year-font-size); font-weight: var(--date-picker-title-year-font-weight); margin-bottom: var(--date-picker-title-year-margin-bottom); transition: 0.3s var(--cubic-bezier);}.var-date-picker__title-year--active { opacity: 1;}.var-date-picker__title-date { height: var(--date-picker-title-date-height); overflow: hidden; font-size: var(--date-picker-title-date-font-size); text-align: left; font-weight: var(--date-picker-title-date-font-weight); position: relative; cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); display: flex; align-items: center; opacity: 0.6; transition: 0.3s var(--cubic-bezier);}.var-date-picker__title-date--active { opacity: 1;}.var-date-picker__title-date--range { font-size: var(--date-picker-title-date-range-font-size);}.var-date-picker__body { flex: 1; position: relative; overflow: auto; background-color: var(--date-picker-body-background-color);}.var-date-picker .var-picker-header { padding: var(--picker-header-padding); align-items: center; display: flex; justify-content: space-between; position: relative;}.var-date-picker .var-picker-header__value { flex: 1; text-align: center; position: relative; overflow: hidden; font-weight: 700; cursor: pointer; user-select: none;}.var-date-picker .var-picker-header__value div { width: 100%;}.var-date-picker .var-month-picker__content { padding: var(--month-picker-padding);}.var-date-picker .var-month-picker__content ul { display: flex; flex-wrap: wrap; justify-content: space-between;}.var-date-picker .var-month-picker__content ul li { width: var(--month-picker-item-width); display: flex; height: var(--month-picker-item-height); align-items: center; justify-content: center;}.var-date-picker .var-month-picker__button[var-month-picker-cover] { width: 100%; max-width: var(--month-picker-item-button-max-width);}.var-date-picker .var-month-picker__button[var-date-picker-color-cover='true'] { color: var(--date-picker-main-color);}.var-date-picker .var-month-picker__button--disabled { color: var(--color-text-disabled) !important; cursor: not-allowed;}.var-date-picker .var-year-picker { width: 100%; height: 100%; font-weight: var(--year-picker-font-weight); padding: 0; margin: 0; list-style-type: none; overflow: auto; text-align: center;}.var-date-picker .var-year-picker__item { padding: var(--year-picker-item-padding); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}.var-date-picker .var-year-picker__item--active { font-size: var(--year-picker-item-active-font-size); font-weight: var(--year-picker-item-active-font-weight); padding: var(--year-picker-item-active-font-padding); color: var(--year-picker-item-active-color);}.var-date-picker .var-day-picker__content ul { display: flex; flex-wrap: wrap;}.var-date-picker .var-day-picker__content ul li { position: relative; display: flex; justify-content: center; width: var(--day-picker-content-item-width); font-size: var(--day-picker-content-item-font-size); padding: var(--day-picker-content-item-padding);}.var-date-picker .var-day-picker__head li { color: var(--day-picker-head-item-color); padding: var(--day-picker-head-item-padding); font-weight: var(--day-picker-head-item-font-weight);}.var-date-picker .var-day-picker__button[var-day-picker-cover] { width: var(--day-picker-content-item-button-width); height: var(--day-picker-content-item-button-height); font-size: var(--day-picker-content-item-button-font-size);}.var-date-picker .var-day-picker__button:not(.var-day-picker__button--usable) { cursor: unset;}.var-date-picker .var-day-picker__button[var-date-picker-color-cover='true'] { color: var(--date-picker-main-color);}.var-date-picker .var-day-picker__button--disabled { color: var(--color-text-disabled) !important; cursor: not-allowed;}.var-date-picker-translatey-enter-from { opacity: 0; transform: translateY(100%);}.var-date-picker-translatey-enter-active,.var-date-picker-reverse-translatey-enter-active { transition: 0.3s var(--cubic-bezier);}.var-date-picker-translatey-leave-active,.var-date-picker-reverse-translatey-leave-active { position: absolute; transition: 0.3s var(--cubic-bezier);}.var-date-picker-translatey-leave-to { opacity: 0; transform: translateY(-100%);}.var-date-picker-reverse-translatey-enter-from { opacity: 0; transform: translateY(-100%);}.var-date-picker-reverse-translatey-leave-to { opacity: 0; transform: translateY(100%);}.var-date-picker-panel-fade-enter-from,.var-date-picker-panel-fade-leave-to { transition: 0.3s var(--cubic-bezier); opacity: 0;}.var-date-picker-panel-fade-leave-active { position: absolute;}.var-date-picker-translatex-enter-from { opacity: 0; transform: translateX(100%);}.var-date-picker-reverse-translatex-enter-from { opacity: 0; transform: translateX(-100%);}.var-date-picker-translatex-enter-active,.var-date-picker-reverse-translatex-enter-active { transition: 0.3s var(--cubic-bezier);}.var-date-picker-translatex-leave-active,.var-date-picker-reverse-translatex-leave-active { position: absolute; transition: 0.3s var(--cubic-bezier);}.var-date-picker-translatex-leave-to { opacity: 0; transform: translateX(-100%);}.var-date-picker-reverse-translatex-leave-to { opacity: 0; transform: translateX(100%);}
+:root { --date-picker-border-radius: 4px; --date-picker-font-size: var(--font-size-md); --date-picker-min-width: 290px; --date-picker-height: 385px; --date-picker-main-color: rgba(0, 0, 0, 0.87); --date-picker-title-padding: 16px; --date-picker-title-background: var(--color-primary); --date-picker-title-color: #fff; --date-picker-title-year-font-size: var(--font-size-md); --date-picker-title-year-font-weight: 500; --date-picker-title-year-margin-bottom: 8px; --date-picker-title-date-height: 48px; --date-picker-title-date-font-size: 34px; --date-picker-title-date-font-weight: 500; --date-picker-title-date-range-font-size: 20px; --date-picker-body-background-color: rgba(0, 0, 0, 0); --picker-header-padding: 4px 16px; --month-picker-padding: 0 12px; --month-picker-item-width: 33%; --month-picker-item-height: 56px; --month-picker-item-button-max-width: 140px; --year-picker-font-weight: 400; --year-picker-item-padding: 8px 0; --year-picker-item-active-font-size: 26px; --year-picker-item-active-font-weight: 500; --year-picker-item-active-font-padding: 10px 0; --year-picker-item-active-color: var(--color-primary); --day-picker-content-item-width: 14.28%; --day-picker-content-item-font-size: var(--font-size-sm); --day-picker-content-item-padding: 2px 0; --day-picker-content-item-button-width: 32px; --day-picker-content-item-button-height: 32px; --day-picker-content-item-button-font-size: var(--font-size-sm); --day-picker-head-item-color: rgba(0, 0, 0, 0.38); --day-picker-head-item-padding: 8px 0; --day-picker-head-item-font-weight: 600;}.var-date-picker { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); border-radius: var(--date-picker-border-radius); contain: layout style; display: flex; width: 100%; flex-direction: column; font-size: var(--date-picker-font-size); position: relative; min-width: var(--date-picker-min-width); height: var(--date-picker-height); overflow: hidden;}.var-date-picker ul { list-style: none; margin: 0; padding: 0;}.var-date-picker__title { padding: var(--date-picker-title-padding); color: var(--date-picker-title-color); background: var(--date-picker-title-background); display: flex; justify-content: space-between; flex-direction: column; flex-wrap: wrap;}.var-date-picker__title-year { opacity: 0.6; cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); align-items: center; display: inline-flex; font-size: var(--date-picker-title-year-font-size); font-weight: var(--date-picker-title-year-font-weight); margin-bottom: var(--date-picker-title-year-margin-bottom); transition: 0.3s var(--cubic-bezier);}.var-date-picker__title-year--active { opacity: 1;}.var-date-picker__title-date { height: var(--date-picker-title-date-height); overflow: hidden; font-size: var(--date-picker-title-date-font-size); text-align: left; font-weight: var(--date-picker-title-date-font-weight); position: relative; cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); display: flex; align-items: center; opacity: 0.6; transition: 0.3s var(--cubic-bezier);}.var-date-picker__title-date--active { opacity: 1;}.var-date-picker__title-date--range { font-size: var(--date-picker-title-date-range-font-size);}.var-date-picker__body { flex: 1; position: relative; overflow: auto; background-color: var(--date-picker-body-background-color);}.var-date-picker .var-picker-header { padding: var(--picker-header-padding); align-items: center; display: flex; justify-content: space-between; position: relative;}.var-date-picker .var-picker-header__value { flex: 1; text-align: center; position: relative; overflow: hidden; font-weight: 700; cursor: pointer; user-select: none;}.var-date-picker .var-picker-header__value div { width: 100%;}.var-date-picker .var-month-picker__content { padding: var(--month-picker-padding);}.var-date-picker .var-month-picker__content ul { display: flex; flex-wrap: wrap; justify-content: space-between;}.var-date-picker .var-month-picker__content ul li { width: var(--month-picker-item-width); display: flex; height: var(--month-picker-item-height); align-items: center; justify-content: center;}.var-date-picker .var-month-picker__button[var-month-picker-cover] { width: 100%; max-width: var(--month-picker-item-button-max-width);}.var-date-picker .var-month-picker__button[var-date-picker-color-cover='true'] { color: var(--date-picker-main-color);}.var-date-picker .var-month-picker__button--disabled { color: var(--color-text-disabled) !important; cursor: not-allowed;}.var-date-picker .var-year-picker { width: 100%; height: 100%; font-weight: var(--year-picker-font-weight); padding: 0; margin: 0; list-style-type: none; overflow: auto; text-align: center;}.var-date-picker .var-year-picker__item { padding: var(--year-picker-item-padding); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}.var-date-picker .var-year-picker__item--active { font-size: var(--year-picker-item-active-font-size); font-weight: var(--year-picker-item-active-font-weight); padding: var(--year-picker-item-active-font-padding); color: var(--year-picker-item-active-color);}.var-date-picker .var-day-picker__content ul { display: flex; flex-wrap: wrap;}.var-date-picker .var-day-picker__content ul li { position: relative; display: flex; justify-content: center; width: var(--day-picker-content-item-width); font-size: var(--day-picker-content-item-font-size); padding: var(--day-picker-content-item-padding);}.var-date-picker .var-day-picker__head li { color: var(--day-picker-head-item-color); padding: var(--day-picker-head-item-padding); font-weight: var(--day-picker-head-item-font-weight);}.var-date-picker .var-day-picker__button[var-day-picker-cover] { width: var(--day-picker-content-item-button-width); height: var(--day-picker-content-item-button-height); font-size: var(--day-picker-content-item-button-font-size);}.var-date-picker .var-day-picker__button:not(.var-day-picker__button--usable) { cursor: unset;}.var-date-picker .var-day-picker__button[var-date-picker-color-cover='true'] { color: var(--date-picker-main-color);}.var-date-picker .var-day-picker__button--disabled { color: var(--color-text-disabled) !important; cursor: not-allowed;}.var-date-picker-translatey-enter-from { opacity: 0; transform: translateY(100%);}.var-date-picker-translatey-enter-active,.var-date-picker-reverse-translatey-enter-active { transition: 0.3s var(--cubic-bezier);}.var-date-picker-translatey-leave-active,.var-date-picker-reverse-translatey-leave-active { position: absolute; transition: 0.3s var(--cubic-bezier);}.var-date-picker-translatey-leave-to { opacity: 0; transform: translateY(-100%);}.var-date-picker-reverse-translatey-enter-from { opacity: 0; transform: translateY(-100%);}.var-date-picker-reverse-translatey-leave-to { opacity: 0; transform: translateY(100%);}.var-date-picker-panel-fade-enter-from,.var-date-picker-panel-fade-leave-to { transition: 0.3s var(--cubic-bezier); opacity: 0;}.var-date-picker-panel-fade-leave-active { position: absolute;}.var-date-picker-translatex-enter-from { opacity: 0; transform: translateX(100%);}.var-date-picker-reverse-translatex-enter-from { opacity: 0; transform: translateX(-100%);}.var-date-picker-translatex-enter-active,.var-date-picker-reverse-translatex-enter-active { transition: 0.3s var(--cubic-bezier);}.var-date-picker-translatex-leave-active,.var-date-picker-reverse-translatex-leave-active { position: absolute; transition: 0.3s var(--cubic-bezier);}.var-date-picker-translatex-leave-to { opacity: 0; transform: translateX(-100%);}.var-date-picker-reverse-translatex-leave-to { opacity: 0; transform: translateX(100%);}

package/es/date-picker/date-picker.less

@@ -79,6 +79,7 @@
   border-radius: var(--date-picker-border-radius);
   contain: layout style;
   display: flex;
+  width: 100%;
   flex-direction: column;
   font-size: var(--date-picker-font-size);
   position: relative;

package/es/date-picker/src/day-picker-panel.js

@@ -7,7 +7,7 @@ import PanelHeader from './panel-header.js'
 import VarButton from '../../button';
 import { defineComponent, ref, computed, watch, onMounted, reactive } from 'vue';
 import { WEEK_HEADER } from '../props';
-import { toNumber } from '../../utils/shared';
+import { toNumber } from '@varlet/shared';
 import { createNamespace } from '../../utils/components';
 import { pack } from '../../locale';
 dayjs.extend(isSameOrBefore);

package/es/date-picker/src/month-picker-panel.js

@@ -7,7 +7,7 @@ import isSameOrAfter from 'dayjs/esm/plugin/isSameOrAfter';
 import { MONTH_LIST } from '../props';
 import PanelHeader from './panel-header.js'
 import VarButton from '../../button';
-import { toNumber } from '../../utils/shared';
+import { toNumber } from '@varlet/shared';
 import { createNamespace } from '../../utils/components';
 import { pack } from '../../locale';
 dayjs.extend(isSameOrBefore);

package/es/date-picker/src/panel-header.js

@@ -1,7 +1,7 @@
 import VarButton from '../../button';
 import VarIcon from '../../icon';
 import { defineComponent, ref, computed, watch } from 'vue';
-import { toNumber } from '../../utils/shared';
+import { toNumber } from '@varlet/shared';
 import { createNamespace } from '../../utils/components';
 import { pack } from '../../locale';
 var {

package/es/date-picker/src/year-picker-panel.js

@@ -1,6 +1,6 @@
 import { defineComponent, computed, onMounted } from 'vue';
 import dayjs from 'dayjs/esm';
-import { toNumber } from '../../utils/shared';
+import { toNumber } from '@varlet/shared';
 import { createNamespace } from '../../utils/components';
 var {
   n,

package/es/dialog/index.js

@@ -1,6 +1,6 @@
 import VarDialog from './Dialog.js'
 import { reactive, nextTick } from 'vue';
-import { inBrowser, isNumber, isString } from '../utils/shared';
+import { inBrowser, isNumber, isString } from '@varlet/shared';
 import { mountInstance } from '../utils/components';
 var singletonOptions;
 

package/es/divider/Divider.js

@@ -2,7 +2,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 
 import { defineComponent, computed, reactive, onMounted, onUpdated, toRefs } from 'vue';
 import { toSizeUnit } from '../utils/elements';
-import { isBool, toNumber } from '../utils/shared';
+import { isBoolean, toNumber } from '@varlet/shared';
 import { props } from './props';
 import { createNamespace } from '../utils/components';
 var {
@@ -35,7 +35,7 @@ export default defineComponent({
     var state = reactive({
       withText: false
     });
-    var isInset = computed(() => isBool(props.inset) ? props.inset : true);
+    var isInset = computed(() => isBoolean(props.inset) ? props.inset : true);
     var style = computed(() => {
       var {
         inset,
@@ -45,7 +45,7 @@ export default defineComponent({
       var baseStyle = {
         margin
       };
-      if (isBool(inset) || inset === 0) return _extends({}, baseStyle); // -18px -> -18
+      if (isBoolean(inset) || inset === 0) return _extends({}, baseStyle); // -18px -> -18
 
       var _inset = toNumber(inset); // -18px -> 18px
 

package/es/icon/Icon.js

@@ -3,7 +3,7 @@ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
 
 import { defineComponent, watch, ref, nextTick } from 'vue';
-import { isURL, toNumber } from '../utils/shared';
+import { isURL, toNumber } from '@varlet/shared';
 import { props } from './props';
 import { toSizeUnit } from '../utils/elements';
 import { createNamespace } from '../utils/components';

package/es/image-preview/ImagePreview.js

@@ -4,7 +4,7 @@ import VarIcon from '../icon';
 import VarPopup from '../popup';
 import { defineComponent, ref, computed, watch } from 'vue';
 import { props } from './props';
-import { toNumber } from '../utils/shared';
+import { toNumber } from '@varlet/shared';
 import { call, createNamespace } from '../utils/components';
 var {
   n,

package/es/image-preview/index.js

@@ -1,6 +1,6 @@
 import VarImagePreview from './ImagePreview.js'
 import { nextTick, reactive } from 'vue';
-import { inBrowser, isArray, isString } from '../utils/shared';
+import { inBrowser, isArray, isString } from '@varlet/shared';
 import { mountInstance } from '../utils/components';
 var singletonOptions;
 

package/es/index-bar/IndexBar.js

@@ -3,7 +3,8 @@ function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
 
 import { computed, defineComponent, ref, watch, onMounted, onBeforeUnmount } from 'vue';
-import { easeInOutCubic, isPlainObject, toNumber } from '../utils/shared';
+import { isPlainObject, toNumber } from '@varlet/shared';
+import { easeInOutCubic } from '../utils/shared';
 import { doubleRaf, getParentScroller, getScrollLeft, getScrollTop, nextTickFrame, requestAnimationFrame, scrollTo as varScrollTo, toPxNum } from '../utils/elements';
 import { useIndexAnchors } from './provide';
 import { props } from './props';

package/es/input/Input.js

@@ -2,7 +2,7 @@ import VarFormDetails from '../form-details';
 import VarIcon from '../icon';
 import { defineComponent, getCurrentInstance, ref, computed, nextTick, onMounted } from 'vue';
 import { props } from './props';
-import { isEmpty } from '../utils/shared';
+import { isEmpty } from '@varlet/shared';
 import { useValidation, createNamespace, call } from '../utils/components';
 import { useForm } from '../form/provide';
 var {

package/es/lazy/index.js

@@ -5,7 +5,8 @@ function _asyncToGenerator(fn) { return function () { var self = this, args = ar
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 import { getAllParentScroller, inViewport } from '../utils/elements';
-import { createCache, removeItem, throttle } from '../utils/shared';
+import { removeItem, throttle } from '@varlet/shared';
+import { createCache } from '../utils/shared';
 import { call } from '../utils/components';
 var BACKGROUND_IMAGE_ARG_NAME = 'background-image';
 var LAZY_LOADING = 'lazy-loading';

package/es/list/List.js

@@ -7,7 +7,8 @@ import Ripple from '../ripple';
 import { defineComponent, onMounted, onUnmounted, ref, nextTick } from 'vue';
 import { getParentScroller, toPxNum } from '../utils/elements';
 import { props } from './props';
-import { isNumber, dt } from '../utils/shared';
+import { isNumber } from '@varlet/shared';
+import { dt } from '../utils/shared';
 import { createNamespace, call } from '../utils/components';
 import { pack } from '../locale';
 var {

package/es/pagination/Pagination.js

@@ -5,7 +5,7 @@ import VarCell from '../cell';
 import VarInput from '../input';
 import { defineComponent, ref, computed, watch } from 'vue';
 import { props } from './porps';
-import { isNumber, toNumber } from '../utils/shared';
+import { isNumber, toNumber } from '@varlet/shared';
 import { pack } from '../locale';
 import { createNamespace } from '../utils/components';
 var {

package/es/pagination/pagination.css

@@ -1 +1 @@
-:root { --pagination-font-size: var(--font-size-md); --pagination-active-color: #fff; --pagination-active-bg-color: var(--color-primary); --pagination-hover-bg-color: #edf5ff; --pagination-total-margin: 0 12px; --pagination-total-line-height: 24px; --pagination-item-width: 32px; --pagination-item-height: 32px; --pagination-item-margin: 0 6px; --pagination-item-background: #fff; --pagination-item-border-radius: 4px; --pagination-list-bg-color: #fff; --pagination-list-active-bg-color: #edf5ff; --pagination-list-active-color: var(--color-primary); --pagination-input-width: 32px; --pagination-simple-padding: 0 0 2px 0; --pagination-disabled-color: var(--color-text-disabled); --pagination-bg-disabled-color: var(--color-disabled); --pagination-size-line-height: 24px;}.pagination-flex-nowrap { display: flex; white-space: nowrap; align-items: center;}.var-pagination { display: flex; align-items: center; list-style: none; margin: 0; font-size: var(--pagination-font-size); padding: 0;}.var-pagination__item { display: inline-flex; min-width: var(--pagination-item-width); align-items: center; justify-content: center; margin: var(--pagination-item-margin); height: var(--pagination-item-height); cursor: pointer; border-radius: var(--pagination-item-border-radius); outline: none; transition: all 0.25s; user-select: none; background-color: var(--pagination-item-background);}.var-pagination__item:hover { background-color: var(--pagination-hover-bg-color);}.var-pagination__item--active { color: var(--pagination-active-color); background-color: var(--pagination-active-bg-color) !important;}.var-pagination__item--hide { display: none;}.var-pagination__item--disabled { cursor: default; color: var(--pagination-disabled-color); background-color: unset;}.var-pagination__item--disabled:hover { background-color: unset;}.var-pagination__item--disabled--hover:hover { background-color: inherit;}.var-pagination__item--disabled--active { background-color: var(--pagination-bg-disabled-color);}.var-pagination__item--disabled--active:hover { background-color: var(--pagination-bg-disabled-color);}.var-pagination__prev { margin-left: 0;}.var-pagination__total { display: flex; white-space: nowrap; align-items: center; line-height: var(--pagination-total-line-height); margin: var(--pagination-total-margin);}.var-pagination__size { display: flex; white-space: nowrap; align-items: center; line-height: var(--pagination-size-line-height); margin: var(--pagination-item-margin);}.var-pagination__size--open { display: flex; align-items: center; cursor: pointer;}.var-pagination__size--open--disabled { cursor: default;}.var-pagination__list { background-color: var(--pagination-list-bg-color); cursor: pointer; transition: all 0.25s;}.var-pagination__list:hover { color: var(--pagination-list-active-color); background-color: var(--pagination-hover-bg-color);}.var-pagination__list--active { background-color: var(--pagination-list-active-bg-color) !important; color: var(--pagination-list-active-color);}.var-pagination__quickly,.var-pagination__simple { display: flex; white-space: nowrap; align-items: center;}.var-pagination__quickly [var-pagination-cover],.var-pagination__simple [var-pagination-cover] { width: var(--pagination-input-width);}.var-pagination__quickly [var-pagination-cover] .var-input__wrap,.var-pagination__simple [var-pagination-cover] .var-input__wrap { padding: 0;}.var-pagination__quickly [var-pagination-cover] .var-input__input,.var-pagination__simple [var-pagination-cover] .var-input__input { height: auto; text-align: center;}.var-pagination__quickly { margin: var(--pagination-item-margin);}.var-pagination__quickly [var-pagination-cover] { margin-left: 6px;}.var-pagination__size--open-icon[var-pagination-cover] { font-size: inherit;}.var-pagination--simple-padding { padding: var(--pagination-simple-padding);}
+:root { --pagination-font-size: var(--font-size-md); --pagination-active-color: #fff; --pagination-active-bg-color: var(--color-primary); --pagination-hover-bg-color: #edf5ff; --pagination-total-margin: 0 12px; --pagination-total-line-height: 24px; --pagination-item-width: 32px; --pagination-item-height: 32px; --pagination-item-margin: 0 6px; --pagination-item-background: #fff; --pagination-item-border-radius: 4px; --pagination-list-bg-color: #fff; --pagination-list-active-bg-color: #edf5ff; --pagination-list-active-color: var(--color-primary); --pagination-input-width: 32px; --pagination-simple-padding: 0 0 2px 0; --pagination-disabled-color: var(--color-text-disabled); --pagination-bg-disabled-color: var(--color-disabled); --pagination-size-line-height: 24px;}.pagination-flex-nowrap { display: flex; white-space: nowrap; align-items: center;}.var-pagination { display: flex; align-items: center; list-style: none; width: 100%; margin: 0; font-size: var(--pagination-font-size); padding: 0;}.var-pagination__item { display: inline-flex; min-width: var(--pagination-item-width); align-items: center; justify-content: center; margin: var(--pagination-item-margin); height: var(--pagination-item-height); cursor: pointer; border-radius: var(--pagination-item-border-radius); outline: none; transition: all 0.25s; user-select: none; background-color: var(--pagination-item-background);}.var-pagination__item:hover { background-color: var(--pagination-hover-bg-color);}.var-pagination__item--active { color: var(--pagination-active-color); background-color: var(--pagination-active-bg-color) !important;}.var-pagination__item--hide { display: none;}.var-pagination__item--disabled { cursor: default; color: var(--pagination-disabled-color); background-color: unset;}.var-pagination__item--disabled:hover { background-color: unset;}.var-pagination__item--disabled--hover:hover { background-color: inherit;}.var-pagination__item--disabled--active { background-color: var(--pagination-bg-disabled-color);}.var-pagination__item--disabled--active:hover { background-color: var(--pagination-bg-disabled-color);}.var-pagination__prev { margin-left: 0;}.var-pagination__total { display: flex; white-space: nowrap; align-items: center; line-height: var(--pagination-total-line-height); margin: var(--pagination-total-margin);}.var-pagination__size { display: flex; white-space: nowrap; align-items: center; line-height: var(--pagination-size-line-height); margin: var(--pagination-item-margin);}.var-pagination__size--open { display: flex; align-items: center; cursor: pointer;}.var-pagination__size--open--disabled { cursor: default;}.var-pagination__list { background-color: var(--pagination-list-bg-color); cursor: pointer; transition: all 0.25s;}.var-pagination__list:hover { color: var(--pagination-list-active-color); background-color: var(--pagination-hover-bg-color);}.var-pagination__list--active { background-color: var(--pagination-list-active-bg-color) !important; color: var(--pagination-list-active-color);}.var-pagination__quickly,.var-pagination__simple { display: flex; white-space: nowrap; align-items: center;}.var-pagination__quickly [var-pagination-cover],.var-pagination__simple [var-pagination-cover] { width: var(--pagination-input-width);}.var-pagination__quickly [var-pagination-cover] .var-input__wrap,.var-pagination__simple [var-pagination-cover] .var-input__wrap { padding: 0;}.var-pagination__quickly [var-pagination-cover] .var-input__input,.var-pagination__simple [var-pagination-cover] .var-input__input { height: auto; text-align: center;}.var-pagination__quickly { margin: var(--pagination-item-margin);}.var-pagination__quickly [var-pagination-cover] { margin-left: 6px;}.var-pagination__size--open-icon[var-pagination-cover] { font-size: inherit;}.var-pagination--simple-padding { padding: var(--pagination-simple-padding);}

package/es/pagination/pagination.less

@@ -51,6 +51,7 @@
   display: flex;
   align-items: center;
   list-style: none;
+  width: 100%;
   margin: 0;
   font-size: var(--pagination-font-size);
   padding: 0;

package/es/picker/Picker.js

@@ -2,7 +2,8 @@ import VarButton from '../button';
 import VarPopup from '../popup';
 import { defineComponent, watch, ref, computed, Transition, toRaw } from 'vue';
 import { props } from './props';
-import { isArray, dt } from '../utils/shared';
+import { isArray } from '@varlet/shared';
+import { dt } from '../utils/shared';
 import { toPxNum, getTranslate } from '../utils/elements';
 import { pack } from '../locale';
 import { createNamespace, call } from '../utils/components';

package/es/picker/index.js

@@ -1,6 +1,6 @@
 import VarPicker from './Picker.js'
 import { nextTick, reactive } from 'vue';
-import { isArray } from '../utils/shared';
+import { isArray } from '@varlet/shared';
 import { mountInstance } from '../utils/components';
 var singletonOptions;
 

package/es/progress/Progress.js

@@ -1,6 +1,6 @@
 import { defineComponent, computed } from 'vue';
 import { props } from './props';
-import { toNumber } from '../utils/shared';
+import { toNumber } from '@varlet/shared';
 import { toSizeUnit, multiplySizeUnit, toPxNum } from '../utils/elements';
 import { createNamespace } from '../utils/components';
 var {

package/es/pull-refresh/PullRefresh.js

@@ -6,7 +6,7 @@ import VarIcon from '../icon';
 import { defineComponent, ref, computed, watch, onMounted } from 'vue';
 import { getParentScroller, getScrollTop } from '../utils/elements';
 import { props } from './props';
-import { toNumber } from '../utils/shared';
+import { toNumber } from '@varlet/shared';
 import { createNamespace } from '../utils/components';
 var {
   n,

package/es/pull-refresh/pullRefresh.css

@@ -1 +1 @@
-:root { --pull-refresh-size: 40px; --pull-refresh-background: #fff; --pull-refresh-color: var(--color-primary); --pull-refresh-success-color: var(--color-success); --pull-refresh-icon-size: 25px;}.var-pull-refresh { overflow: hidden; position: relative; user-select: none;}.var-pull-refresh__control { display: flex; width: var(--pull-refresh-size); height: var(--pull-refresh-size); align-items: center; justify-content: center; background-color: var(--pull-refresh-background); border-radius: 50%; position: absolute; left: 50%; z-index: 90; color: var(--pull-refresh-color);}.var-pull-refresh__control-success { color: var(--pull-refresh-success-color);}.var-pull-refresh__icon[var-pull-refresh-cover] { font-size: var(--pull-refresh-icon-size);}.var-pull-refresh__animation { transform: rotate(0deg); animation: iconRotate 0.6s infinite linear;}@keyframes iconRotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); }}
+:root { --pull-refresh-size: 40px; --pull-refresh-background: #fff; --pull-refresh-color: var(--color-primary); --pull-refresh-success-color: var(--color-success); --pull-refresh-icon-size: 25px;}.var-pull-refresh { overflow: hidden; position: relative; user-select: none; width: 100%;}.var-pull-refresh__control { display: flex; width: var(--pull-refresh-size); height: var(--pull-refresh-size); align-items: center; justify-content: center; background-color: var(--pull-refresh-background); border-radius: 50%; position: absolute; left: 50%; z-index: 90; color: var(--pull-refresh-color);}.var-pull-refresh__control-success { color: var(--pull-refresh-success-color);}.var-pull-refresh__icon[var-pull-refresh-cover] { font-size: var(--pull-refresh-icon-size);}.var-pull-refresh__animation { transform: rotate(0deg); animation: iconRotate 0.6s infinite linear;}@keyframes iconRotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); }}

package/es/pull-refresh/pullRefresh.less

@@ -16,6 +16,7 @@
   overflow: hidden;
   position: relative;
   user-select: none;
+  width: 100%;
 
   &__control {
     display: flex;

package/es/rate/Rate.js

@@ -5,7 +5,7 @@ import { defineComponent, nextTick } from 'vue';
 import { useForm } from '../form/provide';
 import { useValidation, call, createNamespace } from '../utils/components';
 import { toSizeUnit } from '../utils/elements';
-import { toNumber } from '../utils/shared';
+import { toNumber } from '@varlet/shared';
 import { props } from './props';
 var {
   n
@@ -23,7 +23,7 @@ export function render(_ctx, _cache) {
   var _directive_ripple = _resolveDirective("ripple");
 
   return _openBlock(), _createElementBlock("div", {
-    class: _normalizeClass(_ctx.n('warp'))
+    class: _normalizeClass(_ctx.n('wrap'))
   }, [_createElementVNode("div", {
     class: _normalizeClass(_ctx.n())
   }, [(_openBlock(true), _createElementBlock(_Fragment, null, _renderList(_ctx.toNumber(_ctx.count), val => {

package/es/rate/rate.css

@@ -1 +1 @@
-:root { --rate-disabled-color: var(--color-text-disabled); --rate-error-color: var(--color-danger); --rate-action-padding: 4px; --rate-primary-color: var(--color-primary);}.var-rate { display: flex; transform: translateX(calc(-1 * var(--rate-action-padding)));}.var-rate__content { padding: var(--rate-action-padding); box-sizing: unset; cursor: pointer; display: flex; width: 24px; height: 24px; margin-right: 2px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}.var-rate__content-icon[var-rate-cover] { font-size: 24px;}.var-rate--primary { color: var(--rate-primary-color);}.var-rate--disabled { color: var(--rate-disabled-color); cursor: not-allowed;}.var-rate--error { color: var(--rate-error-color);}
+:root { --rate-disabled-color: var(--color-text-disabled); --rate-error-color: var(--color-danger); --rate-action-padding: 4px; --rate-primary-color: var(--color-primary);}.var-rate { display: flex; transform: translateX(calc(-1 * var(--rate-action-padding)));}.var-rate__wrap { width: 100%;}.var-rate__content { padding: var(--rate-action-padding); box-sizing: unset; cursor: pointer; display: flex; width: 24px; height: 24px; margin-right: 2px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}.var-rate__content-icon[var-rate-cover] { font-size: 24px;}.var-rate--primary { color: var(--rate-primary-color);}.var-rate--disabled { color: var(--rate-disabled-color); cursor: not-allowed;}.var-rate--error { color: var(--rate-error-color);}

package/es/rate/rate.less

@@ -14,6 +14,10 @@
   display: flex;
   transform: translateX(calc(-1 * var(--rate-action-padding)));
 
+  &__wrap {
+    width: 100%;
+  }
+
   &__content {
     padding: var(--rate-action-padding);
     box-sizing: unset;