@varlet/ui 2.20.5 → 3.0.0-alpha.1704352780759

package/es/image-preview/props.mjs

@@ -24,8 +24,6 @@ const props = __spreadValues(__spreadValues({
     type: Array,
     default: () => []
   },
-  /** @deprecated Use initialIndex to instead. */
-  current: String,
   initialIndex: {
     type: [String, Number],
     default: 0

package/es/index-bar/IndexBar.mjs

@@ -87,7 +87,7 @@ const __sfc__ = defineComponent({
     const anchorNameList = ref([]);
     const active = ref();
     const sticky = computed(() => props2.sticky);
-    const cssMode = computed(() => props2.stickyCssMode || props2.cssMode);
+    const cssMode = computed(() => props2.stickyCssMode);
     const stickyOffsetTop = computed(() => toPxNum(props2.stickyOffsetTop));
     const zIndex = computed(() => props2.zIndex);
     const { length, indexAnchors, bindIndexAnchors } = useIndexAnchors();

package/es/index-bar/props.mjs

@@ -8,8 +8,6 @@ const props = {
     type: [String, Number],
     default: 0
   },
-  /** @deprecated Use stickyCssMode to instead. */
-  cssMode: Boolean,
   stickyCssMode: Boolean,
   hideList: Boolean,
   zIndex: {

package/es/index.bundle.mjs

@@ -259,7 +259,7 @@ import './tooltip/style/index.mjs'
 import './uploader/style/index.mjs'
 import './watermark/style/index.mjs'
 
-const version = '2.20.5'
+const version = '3.0.0-alpha.1704352780759'
 
 function install(app) {
   ActionSheet.install && app.use(ActionSheet)

package/es/index.mjs

@@ -172,7 +172,7 @@ export * from './tooltip/index.mjs'
 export * from './uploader/index.mjs'
 export * from './watermark/index.mjs'
 
-const version = '2.20.5'
+const version = '3.0.0-alpha.1704352780759'
 
 function install(app) {
   ActionSheet.install && app.use(ActionSheet)

package/es/input/Input.mjs

@@ -46,6 +46,9 @@ function __render__(_ctx, _cache) {
           onClear: _ctx.handleClear
         })),
         _createSlots({
+          "clear-icon": _withCtx(() => [
+            _renderSlot(_ctx.$slots, "clear-icon")
+          ]),
           "append-icon": _withCtx(() => [
             _renderSlot(_ctx.$slots, "append-icon")
           ]),

package/es/loading-bar/index.mjs

@@ -14,9 +14,6 @@ const internalProps = {
   error: false
 };
 const props = reactive(internalProps);
-const mergeConfig = (options) => {
-  Object.assign(props, options);
-};
 const setDefaultOptions = (options) => {
   Object.assign(props, options);
   setOptions = options;
@@ -88,8 +85,6 @@ const LoadingBar = {
   start,
   finish,
   error,
-  /** @deprecated Use setDefaultOptions to instead. */
-  mergeConfig,
   setDefaultOptions,
   resetDefaultOptions
 };

package/es/progress/Progress.mjs

@@ -71,7 +71,7 @@ function __render__(_ctx, _cache) {
                 "div",
                 {
                   key: 1,
-                  class: _normalizeClass(_ctx.classes(_ctx.n("linear-certain"), _ctx.n(`linear--${_ctx.type}`), [_ctx.ripple, _ctx.n("linear-ripple")])),
+                  class: _normalizeClass(_ctx.classes(_ctx.n("linear-certain"), _ctx.n(`linear--${_ctx.type}`))),
                   style: _normalizeStyle({ background: _ctx.progressColor, width: _ctx.linearProps.width })
                 },
                 null,

package/es/progress/progress.css

@@ -1 +1 @@
-:root { --progress-font-size: var(--font-size-sm); --progress-ripple-color: #fff; --progress-track-color: #d8d8d8; --progress-label-color: #555; --progress-background: var(--color-primary); --progress-default-color: #f5f5f5; --progress-primary-color: var(--color-primary); --progress-danger-color: var(--color-danger); --progress-success-color: var(--color-success); --progress-warning-color: var(--color-warning); --progress-info-color: var(--color-info); --progress-linear-border-radius: 0px;}.var-progress { position: relative; font-size: var(--progress-font-size);}.var-progress__linear { display: flex; align-items: center;}.var-progress__linear-block { flex: 1; position: relative; overflow: hidden; height: 4px; border-radius: var(--progress-linear-border-radius);}.var-progress__linear-certain { width: 100%; height: 100%; border-radius: var(--progress-linear-border-radius);}.var-progress__linear-ripple::after { position: absolute; width: 0; background-color: var(--progress-ripple-color); height: 100%; opacity: 0; animation: ripple 1.8s cubic-bezier(0.4, 0, 0.2, 1) infinite; content: '';}.var-progress__linear-background { background-color: var(--progress-track-color);}.var-progress__linear-certain { position: absolute; background-color: var(--progress-background); top: 0; left: 0; transition: all 0.2s, background-color 0.8s;}.var-progress__linear-label { margin-left: 8px; flex: 0; color: var(--progress-label-color);}.var-progress__linear-indeterminate div { bottom: 0; height: inherit; left: 0; position: absolute; right: auto; top: 0; width: auto; will-change: left, right; border-radius: var(--progress-linear-border-radius);}.var-progress__linear-indeterminate div:first-child { animation: progress-linear-long 2.2s infinite;}.var-progress__linear-indeterminate div:last-child { animation: progress-linear-short 2.2s infinite;}.var-progress__linear--success { background-color: var(--progress-success-color);}.var-progress__linear--default { background-color: var(--progress-default-color);}.var-progress__linear--primary { background-color: var(--progress-primary-color);}.var-progress__linear--warning { background-color: var(--progress-warning-color);}.var-progress__linear--danger { background-color: var(--progress-danger-color);}.var-progress__linear--info { background-color: var(--progress-info-color);}@keyframes progress-linear-long { 0% { left: -90%; right: 100%; } 60% { left: -90%; right: 100%; } 100% { left: 100%; right: -35%; }}@keyframes progress-linear-short { 0% { left: -200%; right: 100%; } 60% { left: 107%; right: -8%; } 100% { left: 107%; right: -8%; }}@keyframes ripple { 0% { width: 0; opacity: 0.1; } 20% { width: 0; opacity: 0.5; } 80% { width: 100%; opacity: 0; }}.var-progress__circle { position: relative; width: 40px; height: 40px;}.var-progress__circle-background { stroke: var(--progress-track-color); z-index: 1;}.var-progress__circle-certain { transition: all 0.2s; stroke: var(--progress-background); position: absolute;}.var-progress__circle-label { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: var(--progress-label-color);}.var-progress__circle--success { stroke: var(--progress-success-color);}.var-progress__circle--default { stroke: var(--progress-default-color);}.var-progress__circle--primary { stroke: var(--progress-primary-color);}.var-progress__circle--warning { stroke: var(--progress-warning-color);}.var-progress__circle--danger { stroke: var(--progress-danger-color);}.var-progress__circle--info { stroke: var(--progress-info-color);}.var-progress__circle-indeterminate svg { animation: progress-circle-rotate 1.4s linear infinite; transform-origin: center center; transition: all 0.2s ease-in-out; width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 0;}.var-progress__circle-overlay { animation: progress-circle-dash 1.4s ease-in-out infinite, progress-circle-rotate 1.4s linear infinite; stroke-dasharray: 25, 200; stroke-dashoffset: 0; stroke-linecap: round; transform-origin: center center; transform: rotate(-90deg); z-index: 2;}@keyframes progress-circle-dash { 0% { stroke-dasharray: 1, 200; stroke-dashoffset: 0; } 50% { stroke-dasharray: 100, 200; stroke-dashoffset: -15px; } 100% { stroke-dasharray: 100, 200; stroke-dashoffset: -124px; }}@keyframes progress-circle-rotate { 100% { transform: rotate(270deg); }}
+:root { --progress-font-size: var(--font-size-sm); --progress-track-color: #d8d8d8; --progress-label-color: #555; --progress-background: var(--color-primary); --progress-default-color: #f5f5f5; --progress-primary-color: var(--color-primary); --progress-danger-color: var(--color-danger); --progress-success-color: var(--color-success); --progress-warning-color: var(--color-warning); --progress-info-color: var(--color-info); --progress-linear-border-radius: 0px;}.var-progress { position: relative; font-size: var(--progress-font-size);}.var-progress__linear { display: flex; align-items: center;}.var-progress__linear-block { flex: 1; position: relative; overflow: hidden; height: 4px; border-radius: var(--progress-linear-border-radius);}.var-progress__linear-certain { width: 100%; height: 100%; border-radius: var(--progress-linear-border-radius);}.var-progress__linear-background { background-color: var(--progress-track-color);}.var-progress__linear-certain { position: absolute; background-color: var(--progress-background); top: 0; left: 0; transition: all 0.2s, background-color 0.8s;}.var-progress__linear-label { margin-left: 8px; flex: 0; color: var(--progress-label-color);}.var-progress__linear-indeterminate div { bottom: 0; height: inherit; left: 0; position: absolute; right: auto; top: 0; width: auto; will-change: left, right; border-radius: var(--progress-linear-border-radius);}.var-progress__linear-indeterminate div:first-child { animation: progress-linear-long 2.2s infinite;}.var-progress__linear-indeterminate div:last-child { animation: progress-linear-short 2.2s infinite;}.var-progress__linear--success { background-color: var(--progress-success-color);}.var-progress__linear--default { background-color: var(--progress-default-color);}.var-progress__linear--primary { background-color: var(--progress-primary-color);}.var-progress__linear--warning { background-color: var(--progress-warning-color);}.var-progress__linear--danger { background-color: var(--progress-danger-color);}.var-progress__linear--info { background-color: var(--progress-info-color);}@keyframes progress-linear-long { 0% { left: -90%; right: 100%; } 60% { left: -90%; right: 100%; } 100% { left: 100%; right: -35%; }}@keyframes progress-linear-short { 0% { left: -200%; right: 100%; } 60% { left: 107%; right: -8%; } 100% { left: 107%; right: -8%; }}.var-progress__circle { position: relative; width: 40px; height: 40px;}.var-progress__circle-background { stroke: var(--progress-track-color); z-index: 1;}.var-progress__circle-certain { transition: all 0.2s; stroke: var(--progress-background); position: absolute;}.var-progress__circle-label { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); color: var(--progress-label-color);}.var-progress__circle--success { stroke: var(--progress-success-color);}.var-progress__circle--default { stroke: var(--progress-default-color);}.var-progress__circle--primary { stroke: var(--progress-primary-color);}.var-progress__circle--warning { stroke: var(--progress-warning-color);}.var-progress__circle--danger { stroke: var(--progress-danger-color);}.var-progress__circle--info { stroke: var(--progress-info-color);}.var-progress__circle-indeterminate svg { animation: progress-circle-rotate 1.4s linear infinite; transform-origin: center center; transition: all 0.2s ease-in-out; width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 0;}.var-progress__circle-overlay { animation: progress-circle-dash 1.4s ease-in-out infinite, progress-circle-rotate 1.4s linear infinite; stroke-dasharray: 25, 200; stroke-dashoffset: 0; stroke-linecap: round; transform-origin: center center; transform: rotate(-90deg); z-index: 2;}@keyframes progress-circle-dash { 0% { stroke-dasharray: 1, 200; stroke-dashoffset: 0; } 50% { stroke-dasharray: 100, 200; stroke-dashoffset: -15px; } 100% { stroke-dasharray: 100, 200; stroke-dashoffset: -124px; }}@keyframes progress-circle-rotate { 100% { transform: rotate(270deg); }}

package/es/progress/props.mjs

@@ -9,7 +9,6 @@ const props = {
   },
   color: [String, Object],
   trackColor: String,
-  ripple: Boolean,
   value: {
     type: [Number, String],
     default: 0

package/es/select/Select.mjs

@@ -80,6 +80,9 @@ function __render__(_ctx, _cache) {
               onClear: _ctx.handleClear
             })),
             _createSlots({
+              "clear-icon": _withCtx(() => [
+                _renderSlot(_ctx.$slots, "clear-icon")
+              ]),
               "append-icon": _withCtx(() => [
                 _renderSlot(_ctx.$slots, "append-icon")
               ]),

package/es/snackbar/core.mjs

@@ -16,7 +16,7 @@ const ICON_TYPE_DICT = {
   error: "error",
   loading: ""
 };
-import { renderSlot as _renderSlot, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, normalizeStyle as _normalizeStyle, vShow as _vShow, withDirectives as _withDirectives, createElementBlock as _createElementBlock } from "vue";
+import { renderSlot as _renderSlot, toDisplayString as _toDisplayString, createTextVNode as _createTextVNode, normalizeClass as _normalizeClass, createElementVNode as _createElementVNode, resolveComponent as _resolveComponent, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode, createElementBlock as _createElementBlock, normalizeStyle as _normalizeStyle, vShow as _vShow, withDirectives as _withDirectives } from "vue";
 function __render__(_ctx, _cache) {
   const _component_var_icon = _resolveComponent("var-icon");
   const _component_var_loading = _resolveComponent("var-loading");
@@ -81,9 +81,10 @@ function __render__(_ctx, _cache) {
             2
             /* CLASS */
           ),
-          _createElementVNode(
+          _ctx.$slots.action ? (_openBlock(), _createElementBlock(
             "div",
             {
+              key: 0,
               class: _normalizeClass(_ctx.n("action"))
             },
             [
@@ -91,7 +92,7 @@ function __render__(_ctx, _cache) {
             ],
             2
             /* CLASS */
-          )
+          )) : _createCommentVNode("v-if", true)
         ],
         6
         /* CLASS, STYLE */

package/es/step/step.css

@@ -1 +1 @@
-:root { --step-tag-size: 20px; --step-tag-background: #9e9e9e; --step-tag-font-size: var(--font-size-md); --step-tag-color: #fff; --step-tag-active-color: var(--color-primary); --step-tag-margin: 4px 0; --step-tag-icon-size: var(--font-size-lg); --step-content-font-size: var(--font-size-md); --step-content-color: rgba(0, 0, 0, 0.38); --step-content-active-color: #000; --step-line-background: #000; --step-line-gap: 8px; --step-min-size: calc(20px + 8px); --step-line-size: calc(100% - calc(20px + 8px)); --step-vertical-tag-margin: 0 4px; --step-vertical-min-height: 50px;}.tag { width: var(--step-tag-size); height: var(--step-tag-size); background: var(--step-tag-background); display: flex; font-size: var(--step-tag-font-size); align-items: center; justify-content: center; border-radius: 50%; color: var(--step-tag-color); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: 0.3s var(--cubic-bezier);}.content { font-size: var(--step-content-font-size); color: var(--step-content-color); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: 0.3s var(--cubic-bezier);}.var-step { position: relative; flex: 1; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}.var-step:last-child .var-step__horizontal-line { width: 0;}.var-step:last-child .var-step__vertical-line { height: 0;}.var-step__horizontal { display: flex; flex-direction: column; align-items: center;}.var-step__horizontal-tag { margin: var(--step-tag-margin); width: var(--step-tag-size); height: var(--step-tag-size); background: var(--step-tag-background); display: flex; font-size: var(--step-tag-font-size); align-items: center; justify-content: center; border-radius: 50%; color: var(--step-tag-color); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: 0.3s var(--cubic-bezier);}.var-step__horizontal-tag--active { background: var(--step-tag-active-color);}.var-step__horizontal-content { font-size: var(--step-content-font-size); color: var(--step-content-color); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: 0.3s var(--cubic-bezier);}.var-step__horizontal-content--active { color: var(--step-content-active-color);}.var-step__horizontal-line { position: absolute; top: calc(var(--step-min-size) / 2); left: calc(50% + var(--step-min-size) / 2); width: var(--step-line-size); height: 1px; transform: scaleY(0.5); background: var(--step-line-background);}.var-step__vertical { display: flex; height: 100%; min-height: var(--step-vertical-min-height);}.var-step__vertical-tag { flex-shrink: 0; margin: var(--step-vertical-tag-margin); width: var(--step-tag-size); height: var(--step-tag-size); background: var(--step-tag-background); display: flex; font-size: var(--step-tag-font-size); align-items: center; justify-content: center; border-radius: 50%; color: var(--step-tag-color); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: 0.3s var(--cubic-bezier);}.var-step__vertical-tag--active { background: var(--step-tag-active-color);}.var-step__vertical-content { font-size: var(--step-content-font-size); color: var(--step-content-color); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: 0.3s var(--cubic-bezier);}.var-step__vertical-content--active { color: var(--step-content-active-color);}.var-step__vertical-line { position: absolute; height: var(--step-line-size); left: calc(var(--step-min-size) / 2); top: calc(var(--step-min-size) - var(--step-line-gap) / 2); width: 1px; transform: scaleX(0.5); background: var(--step-line-background);}.var-step__icon[var-step-cover] { font-size: var(--step-tag-icon-size);}
+:root { --step-tag-size: 20px; --step-tag-background: #9e9e9e; --step-tag-font-size: var(--font-size-md); --step-tag-color: #fff; --step-tag-active-color: var(--color-primary); --step-tag-margin: 4px 0; --step-tag-icon-size: var(--font-size-lg); --step-content-font-size: var(--font-size-md); --step-content-color: rgba(0, 0, 0, 0.38); --step-content-active-color: #000; --step-line-background: #000; --step-line-gap: 8px; --step-vertical-tag-margin: 0 4px; --step-vertical-min-height: 50px;}.tag { width: var(--step-tag-size); height: var(--step-tag-size); background: var(--step-tag-background); display: flex; font-size: var(--step-tag-font-size); align-items: center; justify-content: center; border-radius: 50%; color: var(--step-tag-color); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: 0.3s var(--cubic-bezier);}.content { font-size: var(--step-content-font-size); color: var(--step-content-color); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: 0.3s var(--cubic-bezier);}.var-step { position: relative; flex: 1; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}.var-step:last-child .var-step__horizontal-line { width: 0;}.var-step:last-child .var-step__vertical-line { height: 0;}.var-step__horizontal { display: flex; flex-direction: column; align-items: center;}.var-step__horizontal-tag { margin: var(--step-tag-margin); width: var(--step-tag-size); height: var(--step-tag-size); background: var(--step-tag-background); display: flex; font-size: var(--step-tag-font-size); align-items: center; justify-content: center; border-radius: 50%; color: var(--step-tag-color); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: 0.3s var(--cubic-bezier);}.var-step__horizontal-tag--active { background: var(--step-tag-active-color);}.var-step__horizontal-content { font-size: var(--step-content-font-size); color: var(--step-content-color); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: 0.3s var(--cubic-bezier);}.var-step__horizontal-content--active { color: var(--step-content-active-color);}.var-step__horizontal-line { position: absolute; top: calc(calc(var(--step-tag-size) + var(--step-line-gap)) / 2); left: calc(50% + calc(var(--step-tag-size) + var(--step-line-gap)) / 2); width: calc(100% - calc(var(--step-tag-size) + var(--step-line-gap))); height: 1px; transform: scaleY(0.5); background: var(--step-line-background);}.var-step__vertical { display: flex; height: 100%; min-height: var(--step-vertical-min-height);}.var-step__vertical-tag { flex-shrink: 0; margin: var(--step-vertical-tag-margin); width: var(--step-tag-size); height: var(--step-tag-size); background: var(--step-tag-background); display: flex; font-size: var(--step-tag-font-size); align-items: center; justify-content: center; border-radius: 50%; color: var(--step-tag-color); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: 0.3s var(--cubic-bezier);}.var-step__vertical-tag--active { background: var(--step-tag-active-color);}.var-step__vertical-content { font-size: var(--step-content-font-size); color: var(--step-content-color); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: 0.3s var(--cubic-bezier);}.var-step__vertical-content--active { color: var(--step-content-active-color);}.var-step__vertical-line { position: absolute; height: calc(100% - calc(var(--step-tag-size) + var(--step-line-gap))); left: calc(calc(var(--step-tag-size) + var(--step-line-gap)) / 2); top: calc(calc(var(--step-tag-size) + var(--step-line-gap)) - var(--step-line-gap) / 2); width: 1px; transform: scaleX(0.5); background: var(--step-line-background);}.var-step__icon[var-step-cover] { font-size: var(--step-tag-icon-size);}