@varlet/ui 1.27.2 → 1.27.5

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.
@@ -88,8 +88,8 @@ export function render(_ctx, _cache) {
88
88
  return _ctx.triggerAction && _ctx.triggerAction(...arguments);
89
89
  })
90
90
  }, [_createElementVNode("input", {
91
- class: _normalizeClass(_ctx.n('action-input')),
92
91
  ref: "input",
92
+ class: _normalizeClass(_ctx.n('action-input')),
93
93
  type: "file",
94
94
  multiple: _ctx.multiple,
95
95
  accept: _ctx.accept,
@@ -165,7 +165,7 @@ export default defineComponent({
165
165
  props,
166
166
 
167
167
  setup(props) {
168
- var input = ref();
168
+ var input = ref(null);
169
169
  var showPreview = ref(false);
170
170
  var currentPreview = ref(null);
171
171
  var maxlengthText = computed(() => {
@@ -433,8 +433,8 @@ export default defineComponent({
433
433
  isHTMLSupportImage,
434
434
  formDisabled: form == null ? void 0 : form.disabled,
435
435
  formReadonly: form == null ? void 0 : form.readonly,
436
- triggerAction,
437
436
  preview,
437
+ triggerAction,
438
438
  handleChange,
439
439
  handleRemove,
440
440
  getSuccess,
@@ -1 +1 @@
1
- :root { --uploader-action-background: #f7f8fa; --uploader-action-icon-color: #888; --uploader-action-icon-size: 24px; --uploader-action-margin: 0 10px 10px 0; --uploader-file-size: 80px; --uploader-file-margin: 0 10px 10px 0; --uploader-file-name-background: #f7f8fa; --uploader-file-name-color: #888; --uploader-file-name-font-size: 12px; --uploader-file-name-padding: 10px; --uploader-file-text-align: center; --uploader-file-close-background: rgba(0, 0, 0, 0.3); --uploader-file-close-size: 24px; --uploader-file-close-icon-font-size: 14px; --uploader-file-close-icon-color: #fff; --uploader-file-cover-fit: cover; --uploader-file-cover-background: #f7f8fa; --uploader-preview-video-width: 100vw; --uploader-preview-video-height: 100vw; --uploader-file-indicator-height: 4px; --uploader-file-indicator-normal-color: var(--color-disabled); --uploader-file-indicator-success-color: var(--color-success); --uploader-file-indicator-error-color: var(--color-danger); --uploader-disabled-color: var(--color-disabled); --uploader-disabled-text-color: var(--color-text-disabled); --uploader-loading-background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, 0.3), hsla(0, 0%, 100%, 0));}@keyframes var-uploader-loading-animation { from { transform: translateX(-100%); } to { transform: translateX(100%); }}.var-uploader { width: 100%;}.var-uploader__file-list { width: 100%; display: flex; flex-wrap: wrap;}.var-uploader__file { position: relative; width: var(--uploader-file-size); height: var(--uploader-file-size); margin: var(--uploader-file-margin); overflow: hidden; cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}.var-uploader__file-name { position: absolute; width: 100%; height: 100%; line-height: calc(var(--uploader-file-size) - var(--uploader-file-name-padding) * 2); font-size: var(--uploader-file-name-font-size); z-index: 0; background: var(--uploader-file-name-background); padding: var(--uploader-file-name-padding); color: var(--uploader-file-name-color); text-align: var(--uploader-file-text-align); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; user-select: none; transition: background-color 0.25s;}.var-uploader__file-cover { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background: var(--uploader-file-cover-background); object-fit: var(--uploader-file-cover-fit); pointer-events: none; transition: background-color 0.25s;}.var-uploader__file-close { position: absolute; top: 0; right: 0; z-index: 2; border-top: var(--uploader-file-close-size) solid var(--uploader-file-close-background); border-left: var(--uploader-file-close-size) solid transparent;}.var-uploader__file-close-icon[var-uploader-cover] { position: absolute; top: calc(-1 * var(--uploader-file-close-size)); right: 0; font-size: var(--uploader-file-close-icon-font-size); color: var(--uploader-file-close-icon-color);}.var-uploader__file-indicator { position: absolute; left: 0; bottom: 0; z-index: 2; width: 100%; height: var(--uploader-file-indicator-height); transition: all 0.25s; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background: var(--uploader-file-indicator-normal-color);}.var-uploader__action { position: relative; display: flex; justify-content: center; align-items: center; color: var(--uploader-action-icon-color); width: var(--uploader-file-size); height: var(--uploader-file-size); background: var(--uploader-action-background); margin: var(--uploader-action-margin); transition: background-color 0.25s; cursor: pointer;}.var-uploader__action-icon[var-uploader-cover] { font-size: var(--uploader-action-icon-size);}.var-uploader__action-input { display: block; z-index: 1; width: 0; height: 0; opacity: 0;}.var-uploader__preview[var-uploader-cover] { background: #000; box-shadow: none;}.var-uploader__preview-video { width: var(--uploader-preview-video-width); height: var(--uploader-preview-video-height);}.var-uploader--loading::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; animation: var-uploader-loading-animation 0.6s infinite; background: var(--uploader-loading-background); transition: background-color 0.25s;}.var-uploader--success { background: var(--uploader-file-indicator-success-color);}.var-uploader--error { background: var(--uploader-file-indicator-error-color);}.var-uploader--disabled { background: var(--uploader-disabled-color); color: var(--uploader-disabled-text-color); cursor: not-allowed;}
1
+ :root { --uploader-action-background: #f7f8fa; --uploader-action-icon-color: #888; --uploader-action-icon-size: 24px; --uploader-action-margin: 0 10px 10px 0; --uploader-file-size: 80px; --uploader-file-margin: 0 10px 10px 0; --uploader-file-name-background: #f7f8fa; --uploader-file-name-color: #888; --uploader-file-name-font-size: 12px; --uploader-file-name-padding: 10px; --uploader-file-text-align: center; --uploader-file-close-background: rgba(0, 0, 0, 0.3); --uploader-file-close-size: 24px; --uploader-file-close-icon-font-size: 14px; --uploader-file-close-icon-color: #fff; --uploader-file-cover-fit: cover; --uploader-file-cover-background: #f7f8fa; --uploader-preview-video-width: 100vw; --uploader-preview-video-height: 100vw; --uploader-file-indicator-height: 4px; --uploader-file-indicator-normal-color: var(--color-disabled); --uploader-file-indicator-success-color: var(--color-success); --uploader-file-indicator-error-color: var(--color-danger); --uploader-disabled-color: var(--color-disabled); --uploader-disabled-text-color: var(--color-text-disabled); --uploader-loading-background: linear-gradient(90deg, hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, 0.3), hsla(0, 0%, 100%, 0));}@keyframes var-uploader-loading-animation { from { transform: translateX(-100%); } to { transform: translateX(100%); }}.var-uploader { width: 100%;}.var-uploader__file-list { width: 100%; display: flex; flex-wrap: wrap;}.var-uploader__file { position: relative; width: var(--uploader-file-size); height: var(--uploader-file-size); margin: var(--uploader-file-margin); overflow: hidden; cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}.var-uploader__file-name { position: absolute; width: 100%; height: 100%; line-height: calc(var(--uploader-file-size) - var(--uploader-file-name-padding) * 2); font-size: var(--uploader-file-name-font-size); z-index: 0; background: var(--uploader-file-name-background); padding: var(--uploader-file-name-padding); color: var(--uploader-file-name-color); text-align: var(--uploader-file-text-align); white-space: nowrap; text-overflow: ellipsis; overflow: hidden; user-select: none; transition: background-color 0.25s;}.var-uploader__file-cover { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background: var(--uploader-file-cover-background); object-fit: var(--uploader-file-cover-fit); pointer-events: none; transition: background-color 0.25s;}.var-uploader__file-close { position: absolute; top: 0; right: 0; z-index: 2; border-top: var(--uploader-file-close-size) solid var(--uploader-file-close-background); border-left: var(--uploader-file-close-size) solid transparent;}.var-uploader__file-close-icon[var-uploader-cover] { position: absolute; top: calc(-1 * var(--uploader-file-close-size)); right: 0; font-size: var(--uploader-file-close-icon-font-size); color: var(--uploader-file-close-icon-color);}.var-uploader__file-indicator { position: absolute; left: 0; bottom: 0; z-index: 2; width: 100%; height: var(--uploader-file-indicator-height); transition: all 0.25s; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background: var(--uploader-file-indicator-normal-color);}.var-uploader__action { position: relative; display: flex; justify-content: center; align-items: center; color: var(--uploader-action-icon-color); width: var(--uploader-file-size); height: var(--uploader-file-size); background: var(--uploader-action-background); margin: var(--uploader-action-margin); transition: background-color 0.25s; cursor: pointer;}.var-uploader__action-icon[var-uploader-cover] { font-size: var(--uploader-action-icon-size);}.var-uploader__action-input { display: block; width: 0; height: 0; visibility: hidden;}.var-uploader__preview[var-uploader-cover] { background: #000; box-shadow: none;}.var-uploader__preview-video { width: var(--uploader-preview-video-width); height: var(--uploader-preview-video-height);}.var-uploader--loading::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; animation: var-uploader-loading-animation 0.6s infinite; background: var(--uploader-loading-background); transition: background-color 0.25s;}.var-uploader--success { background: var(--uploader-file-indicator-success-color);}.var-uploader--error { background: var(--uploader-file-indicator-error-color);}.var-uploader--disabled { background: var(--uploader-disabled-color); color: var(--uploader-disabled-text-color); cursor: not-allowed;}
@@ -170,10 +170,9 @@
170
170
 
171
171
  &__action-input {
172
172
  display: block;
173
- z-index: 1;
174
173
  width: 0;
175
174
  height: 0;
176
- opacity: 0;
175
+ visibility: hidden;
177
176
  }
178
177
 
179
178
  &__preview[var-uploader-cover] {
package/es/varlet.esm.js CHANGED
@@ -13023,7 +13023,7 @@ var Rate = defineComponent({
13023
13023
  } = transformValue(val);
13024
13024
  return {
13025
13025
  [n$j("content")]: true,
13026
- [n$j("--disabled")]: form == null ? void 0 : form.disabled.value,
13026
+ [n$j("--disabled")]: (form == null ? void 0 : form.disabled.value) || props2.disabled,
13027
13027
  [n$j("--error")]: errorMessage.value,
13028
13028
  [n$j("--primary")]: type !== "empty" && !color
13029
13029
  };
@@ -16840,8 +16840,8 @@ function render(_ctx, _cache) {
16840
16840
  return _ctx.triggerAction && _ctx.triggerAction(...arguments);
16841
16841
  })
16842
16842
  }, [createElementVNode("input", {
16843
- class: normalizeClass(_ctx.n("action-input")),
16844
16843
  ref: "input",
16844
+ class: normalizeClass(_ctx.n("action-input")),
16845
16845
  type: "file",
16846
16846
  multiple: _ctx.multiple,
16847
16847
  accept: _ctx.accept,
@@ -16897,7 +16897,7 @@ var Uploader = defineComponent({
16897
16897
  },
16898
16898
  props,
16899
16899
  setup(props2) {
16900
- var input2 = ref();
16900
+ var input2 = ref(null);
16901
16901
  var showPreview = ref(false);
16902
16902
  var currentPreview = ref(null);
16903
16903
  var maxlengthText = computed(() => {
@@ -17122,8 +17122,8 @@ var Uploader = defineComponent({
17122
17122
  isHTMLSupportImage,
17123
17123
  formDisabled: form == null ? void 0 : form.disabled,
17124
17124
  formReadonly: form == null ? void 0 : form.readonly,
17125
- triggerAction,
17126
17125
  preview,
17126
+ triggerAction,
17127
17127
  handleChange,
17128
17128
  handleRemove,
17129
17129
  getSuccess,
@@ -17226,9 +17226,9 @@ var skeleton = "";
17226
17226
  var SkeletonSfc = "";
17227
17227
  var slider = "";
17228
17228
  var SliderSfc = "";
17229
- var SnackbarSfc = "";
17230
17229
  var snackbar = "";
17231
17230
  var coreSfc = "";
17231
+ var SnackbarSfc = "";
17232
17232
  var space = "";
17233
17233
  var step = "";
17234
17234
  var StepSfc = "";
@@ -1269,7 +1269,7 @@
1269
1269
  },
1270
1270
  "var-rate/disabled-color": {
1271
1271
  "type": "string",
1272
- "description": "禁止评分时图标的颜色,只有在 `disabled` 为 `true` 时才有效,优先级高于 `color`、`empty-color` 默认值:-"
1272
+ "description": "禁止评分时图标的颜色,只有在 `disabled` 为 `true` 时才有效,优先级高于 `color`、`empty-color` 默认值:#aaa"
1273
1273
  },
1274
1274
  "var-rate/readonly": {
1275
1275
  "type": "boolean",
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
3
3
  "framework": "vue",
4
- "version": "1.27.1",
4
+ "version": "1.27.4",
5
5
  "name": "VARLET",
6
6
  "contributions": {
7
7
  "html": {
@@ -3780,7 +3780,7 @@
3780
3780
  {
3781
3781
  "name": "disabled-color",
3782
3782
  "description": "禁止评分时图标的颜色,只有在 `disabled` 为 `true` 时才有效,优先级高于 `color`、`empty-color`",
3783
- "default": "-",
3783
+ "default": "#aaa",
3784
3784
  "value": {
3785
3785
  "type": "string",
3786
3786
  "kind": "expression"
package/lib/rate/Rate.js CHANGED
@@ -122,7 +122,7 @@ var _default = (0, _vue.defineComponent)({
122
122
  } = transformValue(val);
123
123
  return {
124
124
  [n('content')]: true,
125
- [n('--disabled')]: form == null ? void 0 : form.disabled.value,
125
+ [n('--disabled')]: (form == null ? void 0 : form.disabled.value) || props.disabled,
126
126
  [n('--error')]: errorMessage.value,
127
127
  [n('--primary')]: type !== 'empty' && !color
128
128
  };
package/lib/rate/rate.css CHANGED
@@ -1 +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; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}.var-rate--disabled { color: var(--rate-disabled-color) !important;}.var-rate--error { color: var(--rate-error-color) !important;}.var-rate--primary { color: var(--rate-primary-color);}
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; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}.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);}
@@ -18,18 +18,20 @@
18
18
  padding: var(--rate-action-padding);
19
19
  box-sizing: unset;
20
20
  cursor: pointer;
21
+ display: flex;
21
22
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
22
23
  }
23
24
 
24
- &--disabled {
25
- color: var(--rate-disabled-color) !important;
25
+ &--primary {
26
+ color: var(--rate-primary-color);
26
27
  }
27
28
 
28
- &--error {
29
- color: var(--rate-error-color) !important;
29
+ &--disabled {
30
+ color: var(--rate-disabled-color);
31
+ cursor: not-allowed;
30
32
  }
31
33
 
32
- &--primary {
33
- color: var(--rate-primary-color);
34
+ &--error {
35
+ color: var(--rate-error-color);
34
36
  }
35
37
  }