@varlet/ui 2.11.3-alpha.1685455534947 → 2.11.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  import VarIcon from '../icon/index.mjs';
2
- import { defineComponent, ref, computed, watch } from 'vue';
2
+ import { defineComponent, ref, computed, onUpdated } from 'vue';
3
3
  import { props } from './props.mjs';
4
4
  import { isEmpty } from '@varlet/shared';
5
5
  import { createNamespace, call } from '../utils/components.mjs';
@@ -38,7 +38,7 @@ function __render__(_ctx, _cache) {
38
38
  class: _normalizeClass(_ctx.classes(_ctx.n('middle'), [!_ctx.hint, _ctx.n('--middle-non-hint')]))
39
39
  }, [_renderSlot(_ctx.$slots, "default")], 2
40
40
  /* CLASS */
41
- ), _ctx.hint ? (_openBlock(), _createElementBlock("label", {
41
+ ), _ctx.placeholder && _ctx.hint ? (_openBlock(), _createElementBlock("label", {
42
42
  key: 0,
43
43
  class: _normalizeClass(_ctx.classes(_ctx.n('placeholder'), _ctx.n('$--ellipsis'), [_ctx.isFocus, _ctx.n('--focus')], [_ctx.formDisabled || _ctx.disabled, _ctx.n('--disabled')], [_ctx.errorMessage, _ctx.n('--error')], _ctx.computePlaceholderState())),
44
44
  style: _normalizeStyle({
@@ -76,7 +76,7 @@ function __render__(_ctx, _cache) {
76
76
  style: _normalizeStyle({
77
77
  width: _ctx.legendWidth
78
78
  })
79
- }, [_ctx.hint ? (_openBlock(), _createBlock(_Teleport, {
79
+ }, [_ctx.placeholder && _ctx.hint ? (_openBlock(), _createBlock(_Teleport, {
80
80
  key: 0,
81
81
  to: "body"
82
82
  }, [_createElementVNode("span", {
@@ -146,10 +146,11 @@ var __sfc__ = defineComponent({
146
146
  var {
147
147
  size,
148
148
  hint,
149
- variant
149
+ variant,
150
+ placeholder
150
151
  } = props;
151
152
 
152
- if (!hint || variant !== 'outlined') {
153
+ if (!placeholder || !hint || variant !== 'outlined') {
153
154
  legendWidth.value = '';
154
155
  return;
155
156
  }
@@ -168,7 +169,7 @@ var __sfc__ = defineComponent({
168
169
  };
169
170
 
170
171
  useMounted(resize);
171
- watch(() => [props.size, props.hint, props.variant], resize);
172
+ onUpdated(resize);
172
173
  useEventListener(() => window, 'resize', resize);
173
174
  return {
174
175
  placeholderTextEl,
@@ -1,6 +1,6 @@
1
1
  import Ripple from '../ripple/index.mjs';
2
2
  import Lazy from '../lazy/index.mjs';
3
- import { defineComponent } from 'vue';
3
+ import { watch, defineComponent, ref } from 'vue';
4
4
  import { props } from './props.mjs';
5
5
  import { toSizeUnit } from '../utils/elements.mjs';
6
6
  import { createNamespace, call } from '../utils/components.mjs';
@@ -8,11 +8,11 @@ var {
8
8
  n,
9
9
  classes
10
10
  } = createNamespace('image');
11
- import { normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, resolveDirective as _resolveDirective, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
11
+ import { normalizeClass as _normalizeClass, normalizeStyle as _normalizeStyle, resolveDirective as _resolveDirective, withDirectives as _withDirectives, openBlock as _openBlock, createElementBlock as _createElementBlock, createCommentVNode as _createCommentVNode, renderSlot as _renderSlot, pushScopeId as _pushScopeId, popScopeId as _popScopeId } from "vue";
12
12
 
13
13
  var _withScopeId = n => (_pushScopeId(""), n = n(), _popScopeId(), n);
14
14
 
15
- var _hoisted_1 = ["alt", "title", "lazy-error", "lazy-loading"];
15
+ var _hoisted_1 = ["alt", "title", "lazy-loading", "lazy-error"];
16
16
  var _hoisted_2 = ["alt", "title", "src"];
17
17
 
18
18
  function __render__(_ctx, _cache) {
@@ -25,30 +25,27 @@ function __render__(_ctx, _cache) {
25
25
  style: _normalizeStyle({
26
26
  width: _ctx.toSizeUnit(_ctx.width),
27
27
  height: _ctx.toSizeUnit(_ctx.height),
28
- 'border-radius': _ctx.toSizeUnit(_ctx.radius)
28
+ borderRadius: _ctx.toSizeUnit(_ctx.radius)
29
29
  })
30
- }, [_ctx.lazy ? _withDirectives((_openBlock(), _createElementBlock("img", {
30
+ }, [_ctx.lazy && !_ctx.showErrorSlot ? _withDirectives((_openBlock(), _createElementBlock("img", {
31
31
  key: 0,
32
32
  class: _normalizeClass(_ctx.n('image')),
33
33
  alt: _ctx.alt,
34
34
  title: _ctx.title,
35
- "lazy-error": _ctx.error,
36
35
  "lazy-loading": _ctx.loading,
36
+ "lazy-error": _ctx.error,
37
37
  style: _normalizeStyle({
38
38
  objectFit: _ctx.fit
39
39
  }),
40
40
  onLoad: _cache[0] || (_cache[0] = function () {
41
41
  return _ctx.handleLoad && _ctx.handleLoad(...arguments);
42
42
  }),
43
- onError: _cache[1] || (_cache[1] = function () {
44
- return _ctx.handleError && _ctx.handleError(...arguments);
45
- }),
46
- onClick: _cache[2] || (_cache[2] = function () {
43
+ onClick: _cache[1] || (_cache[1] = function () {
47
44
  return _ctx.handleClick && _ctx.handleClick(...arguments);
48
45
  })
49
46
  }, null, 46
50
47
  /* CLASS, STYLE, PROPS, HYDRATE_EVENTS */
51
- , _hoisted_1)), [[_directive_lazy, _ctx.src]]) : (_openBlock(), _createElementBlock("img", {
48
+ , _hoisted_1)), [[_directive_lazy, _ctx.src]]) : _createCommentVNode("v-if", true), !_ctx.lazy && !_ctx.showErrorSlot ? (_openBlock(), _createElementBlock("img", {
52
49
  key: 1,
53
50
  class: _normalizeClass(_ctx.n('image')),
54
51
  alt: _ctx.alt,
@@ -57,18 +54,20 @@ function __render__(_ctx, _cache) {
57
54
  objectFit: _ctx.fit
58
55
  }),
59
56
  src: _ctx.src,
60
- onLoad: _cache[3] || (_cache[3] = function () {
57
+ onLoad: _cache[2] || (_cache[2] = function () {
61
58
  return _ctx.handleLoad && _ctx.handleLoad(...arguments);
62
59
  }),
63
- onError: _cache[4] || (_cache[4] = function () {
60
+ onError: _cache[3] || (_cache[3] = function () {
64
61
  return _ctx.handleError && _ctx.handleError(...arguments);
65
62
  }),
66
- onClick: _cache[5] || (_cache[5] = function () {
63
+ onClick: _cache[4] || (_cache[4] = function () {
67
64
  return _ctx.handleClick && _ctx.handleClick(...arguments);
68
65
  })
69
66
  }, null, 46
70
67
  /* CLASS, STYLE, PROPS, HYDRATE_EVENTS */
71
- , _hoisted_2))], 6
68
+ , _hoisted_2)) : _createCommentVNode("v-if", true), _ctx.showErrorSlot ? _renderSlot(_ctx.$slots, "error", {
69
+ key: 2
70
+ }) : _createCommentVNode("v-if", true)], 6
72
71
  /* CLASS, STYLE */
73
72
  )), [[_directive_ripple, {
74
73
  disabled: !_ctx.ripple
@@ -83,38 +82,46 @@ var __sfc__ = defineComponent({
83
82
  },
84
83
  props,
85
84
 
86
- setup(props) {
85
+ setup(props, _ref) {
86
+ var {
87
+ slots
88
+ } = _ref;
89
+ var showErrorSlot = ref(false);
90
+
91
+ var handleError = e => {
92
+ // the value of showErrorSlot depends on whether there is an error slot
93
+ showErrorSlot.value = !!slots.error;
94
+ call(props.onError, e);
95
+ };
96
+
87
97
  var handleLoad = e => {
88
98
  var el = e.currentTarget;
89
- var {
90
- lazy,
91
- onLoad,
92
- onError
93
- } = props;
94
99
 
95
- if (lazy) {
96
- el._lazy.state === 'success' && call(onLoad, e);
97
- el._lazy.state === 'error' && call(onError, e);
100
+ if (props.lazy) {
101
+ if (el._lazy.state === 'success') {
102
+ call(props.onLoad, e);
103
+ return;
104
+ }
105
+
106
+ if (el._lazy.state === 'error') {
107
+ handleError(e);
108
+ }
98
109
  } else {
99
- call(onLoad, e);
110
+ call(props.onLoad, e);
100
111
  }
101
112
  };
102
113
 
103
- var handleError = e => {
104
- var {
105
- lazy,
106
- onError
107
- } = props;
108
- !lazy && call(onError, e);
109
- };
110
-
111
114
  var handleClick = e => {
112
115
  call(props.onClick, e);
113
116
  };
114
117
 
118
+ watch(() => props.src, () => {
119
+ showErrorSlot.value = false;
120
+ });
115
121
  return {
116
122
  n,
117
123
  classes,
124
+ showErrorSlot,
118
125
  toSizeUnit,
119
126
  handleLoad,
120
127
  handleError,
@@ -241,7 +241,7 @@ import './time-picker/style/index.mjs'
241
241
  import './tooltip/style/index.mjs'
242
242
  import './uploader/style/index.mjs'
243
243
 
244
- const version = '2.11.3-alpha.1685455534947'
244
+ const version = '2.11.3'
245
245
 
246
246
  function install(app) {
247
247
  ActionSheet.install && app.use(ActionSheet)
package/es/index.mjs CHANGED
@@ -160,7 +160,7 @@ export * from './time-picker/index.mjs'
160
160
  export * from './tooltip/index.mjs'
161
161
  export * from './uploader/index.mjs'
162
162
 
163
- const version = '2.11.3-alpha.1685455534947'
163
+ const version = '2.11.3'
164
164
 
165
165
  function install(app) {
166
166
  ActionSheet.install && app.use(ActionSheet)
@@ -1 +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-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--simple { background: transparent;}.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__input,.var-pagination__simple [var-pagination-cover] .var-input__input { height: auto; text-align: center;}.var-pagination__quickly-line,.var-pagination__simple-line { height: 1px; background: transparent;}.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;}
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-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--simple { background: transparent;}.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-field-decorator__middle,.var-pagination__simple [var-pagination-cover] .var-field-decorator__middle { 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-line,.var-pagination__simple-line { height: 1px; background: transparent;}.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;}
@@ -2,7 +2,7 @@ import VarButton from '../button/index.mjs';
2
2
  import VarPopup from '../popup/index.mjs';
3
3
  import { defineComponent, watch, ref, computed, Transition, toRaw } from 'vue';
4
4
  import { props } from './props.mjs';
5
- import { isArray } from '@varlet/shared';
5
+ import { clamp, clampArrayRange, isArray } from '@varlet/shared';
6
6
  import { dt } from '../utils/shared.mjs';
7
7
  import { toPxNum, getTranslateY, requestAnimationFrame } from '../utils/elements.mjs';
8
8
  import { pack } from '../locale/index.mjs';
@@ -185,31 +185,15 @@ var __sfc__ = defineComponent({
185
185
  call(props['onUpdate:show'], value);
186
186
  };
187
187
 
188
- var boundaryTranslate = scrollColumn => {
189
- var startTranslate = optionHeight.value + center.value;
190
- var endTranslate = center.value - scrollColumn.column.texts.length * optionHeight.value;
191
-
192
- if (scrollColumn.translate >= startTranslate) {
193
- scrollColumn.translate = startTranslate;
194
- }
195
-
196
- if (scrollColumn.translate <= endTranslate) {
197
- scrollColumn.translate = endTranslate;
198
- }
199
- };
200
-
201
- var boundaryIndex = (scrollColumn, index) => {
202
- var {
203
- length
204
- } = scrollColumn.column.texts;
205
- index = index >= length ? length - 1 : index;
206
- index = index <= 0 ? 0 : index;
207
- return index;
188
+ var clampTranslate = scrollColumn => {
189
+ var minTranslate = center.value - scrollColumn.column.texts.length * optionHeight.value;
190
+ var maxTranslate = optionHeight.value + center.value;
191
+ scrollColumn.translate = clamp(scrollColumn.translate, minTranslate, maxTranslate);
208
192
  };
209
193
 
210
194
  var getTargetIndex = (scrollColumn, viewTranslate) => {
211
195
  var index = Math.round((center.value - viewTranslate) / optionHeight.value);
212
- return boundaryIndex(scrollColumn, index);
196
+ return clampArrayRange(index, scrollColumn.column.texts);
213
197
  };
214
198
 
215
199
  var updateTranslate = scrollColumn => {
@@ -268,7 +252,7 @@ var __sfc__ = defineComponent({
268
252
  var deltaY = scrollColumn.prevY !== undefined ? clientY - scrollColumn.prevY : 0;
269
253
  scrollColumn.prevY = clientY;
270
254
  scrollColumn.translate += deltaY;
271
- boundaryTranslate(scrollColumn);
255
+ clampTranslate(scrollColumn);
272
256
  var now = performance.now();
273
257
 
274
258
  if (now - scrollColumn.momentumTime > MOMENTUM_RECORD_TIME) {
@@ -1 +1 @@
1
- :root { --picker-background: #fff; --picker-toolbar-height: 44px; --picker-confirm-button-text-color: var(--color-primary); --picker-cancel-button-text-color: #888; --picker-picked-border: 1px solid rgba(0, 0, 0, 0.12); --picker-title-font-size: 16px; --picker-toolbar-padding: 0 4px; --picker-mask-background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4)), linear-gradient(0deg, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4));}.var-picker { width: 100%; background: var(--picker-background); user-select: none; transition: 0.25s background-color;}.var-picker__popup[var-picker-cover] { width: 100%;}.var-picker__columns { position: relative; display: flex; width: 100%; cursor: grab;}.var-picker__column { flex: 1; overflow: hidden;}.var-picker__text { overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}.var-picker__scroller { width: 100%; transition-timing-function: cubic-bezier(0.23, 1, 0.68, 1);}.var-picker__option { display: flex; justify-content: center; align-items: center; width: 100%; padding: 0 4px;}.var-picker__picked { position: absolute; z-index: 2; pointer-events: none; width: 100%; left: 0; border-top: var(--picker-picked-border); border-bottom: var(--picker-picked-border); transition: 0.25s border;}.var-picker__mask { position: absolute; pointer-events: none; top: 0; left: 0; width: 100%; height: 100%; background-image: var(--picker-mask-background-image); background-repeat: no-repeat; background-position: top, bottom;}.var-picker__toolbar { display: flex; justify-content: space-between; align-items: center; width: 100%; height: var(--picker-toolbar-height); padding: var(--picker-toolbar-padding);}.var-picker__confirm-button[var-picker-cover] { color: var(--picker-confirm-button-text-color);}.var-picker__cancel-button[var-picker-cover] { color: var(--picker-cancel-button-text-color);}.var-picker__title { font-size: var(--picker-title-font-size);}
1
+ :root { --picker-background: #fff; --picker-toolbar-height: 44px; --picker-confirm-button-text-color: var(--color-primary); --picker-cancel-button-text-color: #888; --picker-picked-border: 1px solid rgba(0, 0, 0, 0.12); --picker-title-font-size: var(--font-size-lg); --picker-title-text-color: #555; --picker-option-font-size: var(--font-size-lg); --picker-option-text-color: #555; --picker-toolbar-padding: 0 4px; --picker-mask-background-image: linear-gradient(180deg, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4)), linear-gradient(0deg, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4));}.var-picker { width: 100%; background: var(--picker-background); user-select: none; transition: 0.25s background-color;}.var-picker__popup[var-picker-cover] { width: 100%;}.var-picker__columns { position: relative; display: flex; width: 100%; cursor: grab;}.var-picker__column { flex: 1; overflow: hidden;}.var-picker__text { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--picker-option-text-color); font-size: var(--picker-option-font-size);}.var-picker__scroller { width: 100%; transition-timing-function: cubic-bezier(0.23, 1, 0.68, 1);}.var-picker__option { display: flex; justify-content: center; align-items: center; width: 100%; padding: 0 4px;}.var-picker__picked { position: absolute; z-index: 2; pointer-events: none; width: 100%; left: 0; border-top: var(--picker-picked-border); border-bottom: var(--picker-picked-border); transition: 0.25s border;}.var-picker__mask { position: absolute; pointer-events: none; top: 0; left: 0; width: 100%; height: 100%; background-image: var(--picker-mask-background-image); background-repeat: no-repeat; background-position: top, bottom;}.var-picker__toolbar { display: flex; justify-content: space-between; align-items: center; width: 100%; height: var(--picker-toolbar-height); padding: var(--picker-toolbar-padding);}.var-picker__confirm-button[var-picker-cover] { color: var(--picker-confirm-button-text-color);}.var-picker__cancel-button[var-picker-cover] { color: var(--picker-cancel-button-text-color);}.var-picker__title { color: var(--picker-title-text-color); font-size: var(--picker-title-font-size);}
@@ -44,10 +44,6 @@ function __render__(_ctx, _cache) {
44
44
  /* CLASS */
45
45
  ), _createElementVNode("div", {
46
46
  class: _normalizeClass([_ctx.n('icon')])
47
- }, [_renderSlot(_ctx.$slots, "icon")], 2
48
- /* CLASS */
49
- ), _createElementVNode("div", {
50
- class: _normalizeClass(_ctx.n('action'))
51
47
  }, [_ctx.iconName ? (_openBlock(), _createBlock(_component_var_icon, {
52
48
  key: 0,
53
49
  name: _ctx.iconName
@@ -61,7 +57,11 @@ function __render__(_ctx, _cache) {
61
57
  radius: _ctx.loadingRadius
62
58
  }, null, 8
63
59
  /* PROPS */
64
- , ["type", "size", "color", "radius"])) : _createCommentVNode("v-if", true), _renderSlot(_ctx.$slots, "action")], 2
60
+ , ["type", "size", "color", "radius"])) : _createCommentVNode("v-if", true), _renderSlot(_ctx.$slots, "icon")], 2
61
+ /* CLASS */
62
+ ), _createElementVNode("div", {
63
+ class: _normalizeClass(_ctx.n('action'))
64
+ }, [_renderSlot(_ctx.$slots, "action")], 2
65
65
  /* CLASS */
66
66
  )], 6
67
67
  /* CLASS, STYLE */
@@ -1 +1 @@
1
- :root { --snackbar-width: 256px; --snackbar-color: rgba(255, 255, 255, 0.87); --snackbar-border-radius: 4px; --snackbar-background: #333; --snackbar-font-size: var(--font-size-md); --snackbar-margin: 6px 24px; --snackbar-border-color: currentColor; --snackbar-success-background: var(--color-success); --snackbar-info-background: var(--color-info); --snackbar-error-background: var(--color-danger); --snackbar-warning-background: var(--color-warning); --snackbar-content-padding: 14px 16px; --snackbar-action-margin: 0 16px 0 0;}.var-transition-group { position: fixed; left: 0; right: 0; top: 0; bottom: 0; pointer-events: none;}.var-pointer-auto { pointer-events: auto;}.var-snackbar { display: flex; justify-content: center; align-items: baseline; left: 0; right: 0; bottom: 0; transition: all 0.15s var(--cubic-bezier);}.var-snackbar__transition { top: 0; position: fixed;}.var-snackbar__transition .var-snackbar__wrapper { position: absolute;}.var-snackbar__transition .var-snackbar__wrapper-top { top: 5%;}.var-snackbar__transition .var-snackbar__wrapper-center { top: 45%;}.var-snackbar__transition .var-snackbar__wrapper-bottom { bottom: 5%;}.var-snackbar__wrapper { width: var(--snackbar-width); display: flex; border-radius: var(--snackbar-border-radius); color: var(--snackbar-color); background: var(--snackbar-background); font-size: var(--snackbar-font-size); margin: var(--snackbar-margin); align-items: center; border-color: var(--snackbar-border-color); pointer-events: auto; transition: 0.3s var(--cubic-bezier);}.var-snackbar__wrapper-success { background: var(--snackbar-success-background);}.var-snackbar__wrapper-info { background: var(--snackbar-info-background);}.var-snackbar__wrapper-warning { background: var(--snackbar-warning-background);}.var-snackbar__wrapper-error { background: var(--snackbar-error-background);}.var-snackbar__content { flex-grow: 1; padding: var(--snackbar-content-padding);}.var-snackbar__action { margin: var(--snackbar-action-margin); display: flex;}.var-snackbar__vertical { flex-direction: column; align-items: flex-start;}.var-snackbar__vertical .var-snackbar__action { align-self: flex-end; margin-bottom: 8px;}.var-snackbar-fade-enter-from,.var-snackbar-fade-leave-to { opacity: 0; transform: translateY(-30px);}
1
+ :root { --snackbar-width: 256px; --snackbar-color: rgba(255, 255, 255, 0.87); --snackbar-border-radius: 4px; --snackbar-background: #333; --snackbar-font-size: var(--font-size-md); --snackbar-margin: 6px 24px; --snackbar-border-color: currentColor; --snackbar-success-background: var(--color-success); --snackbar-info-background: var(--color-info); --snackbar-error-background: var(--color-danger); --snackbar-warning-background: var(--color-warning); --snackbar-content-padding: 14px 16px; --snackbar-action-margin: 0 8px 0; --snackbar-vertical-action-margin: 0 8px 8px 0;}.var-transition-group { position: fixed; left: 0; right: 0; top: 0; bottom: 0; pointer-events: none;}.var-pointer-auto { pointer-events: auto;}.var-snackbar { display: flex; justify-content: center; align-items: baseline; left: 0; right: 0; bottom: 0; transition: all 0.15s var(--cubic-bezier);}.var-snackbar__transition { top: 0; position: fixed;}.var-snackbar__transition .var-snackbar__wrapper { position: absolute;}.var-snackbar__transition .var-snackbar__wrapper-top { top: 5%;}.var-snackbar__transition .var-snackbar__wrapper-center { top: 45%;}.var-snackbar__transition .var-snackbar__wrapper-bottom { bottom: 5%;}.var-snackbar__wrapper { width: var(--snackbar-width); display: flex; border-radius: var(--snackbar-border-radius); color: var(--snackbar-color); background: var(--snackbar-background); font-size: var(--snackbar-font-size); margin: var(--snackbar-margin); align-items: center; border-color: var(--snackbar-border-color); pointer-events: auto; transition: 0.3s var(--cubic-bezier);}.var-snackbar__wrapper-success { background: var(--snackbar-success-background);}.var-snackbar__wrapper-info { background: var(--snackbar-info-background);}.var-snackbar__wrapper-warning { background: var(--snackbar-warning-background);}.var-snackbar__wrapper-error { background: var(--snackbar-error-background);}.var-snackbar__content { flex-grow: 1; padding: var(--snackbar-content-padding);}.var-snackbar__action { margin: var(--snackbar-action-margin); display: flex;}.var-snackbar__vertical { flex-direction: column; align-items: flex-start;}.var-snackbar__vertical .var-snackbar__action { align-self: flex-end; margin: var(--snackbar-vertical-action-margin);}.var-snackbar-fade-enter-from,.var-snackbar-fade-leave-to { opacity: 0; transform: translateY(-30px);}