bkui-vue 0.0.2-beta.116 → 0.0.2-beta.118

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.
@@ -198,6 +198,9 @@
198
198
  .bk-date-picker-rel .clear-action:hover {
199
199
  color: var(--gray-color);
200
200
  }
201
+ .bk-date-picker-rel .clear-action.hidden {
202
+ visibility: hidden;
203
+ }
201
204
  .bk-date-picker-rel .icon-wrapper {
202
205
  position: absolute;
203
206
  top: 0;
@@ -145,6 +145,7 @@ declare const _default: import("vue").DefineComponent<{
145
145
  handleBlur: (e: any) => void;
146
146
  handleKeydown: (e: KeyboardEvent) => void;
147
147
  handleInputChange: (e: any) => void;
148
+ handleInputInput: (e: any) => void;
148
149
  handleClear: () => void;
149
150
  onPick: (_dates: any, visible: boolean, type: any, shortcut: any) => void;
150
151
  onPickSuccess: () => void;
@@ -170,6 +171,7 @@ declare const _default: import("vue").DefineComponent<{
170
171
  timeEnterMode: import("vue").Ref<boolean>;
171
172
  shortcut: import("vue").Ref<any>;
172
173
  onSelectionModeChange: import("vue").Ref<(_type: any) => SelectionModeType>;
174
+ tmpValue: import("vue").Ref<any>;
173
175
  }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "input" | "clear" | "update:modelValue" | "pick-success" | "pick-first" | "open-change" | "shortcut-change")[], "change" | "input" | "clear" | "update:modelValue" | "pick-success" | "pick-first" | "open-change" | "shortcut-change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
174
176
  readonly type: {
175
177
  readonly type: import("vue").PropType<import("./interface").PickerTypeType>;
@@ -91,6 +91,9 @@
91
91
  &:hover {
92
92
  color: @gray-color;
93
93
  }
94
+ &.hidden {
95
+ visibility: hidden;
96
+ }
94
97
  }
95
98
 
96
99
  .icon-wrapper {
@@ -444,6 +444,9 @@
444
444
  .bk-date-picker-rel .clear-action:hover {
445
445
  color: var(--gray-color);
446
446
  }
447
+ .bk-date-picker-rel .clear-action.hidden {
448
+ visibility: hidden;
449
+ }
447
450
  .bk-date-picker-rel .icon-wrapper {
448
451
  position: absolute;
449
452
  top: 0;
@@ -261,6 +261,7 @@ declare const BkDatePicker: {
261
261
  handleBlur: (e: any) => void;
262
262
  handleKeydown: (e: KeyboardEvent) => void;
263
263
  handleInputChange: (e: any) => void;
264
+ handleInputInput: (e: any) => void;
264
265
  handleClear: () => void;
265
266
  onPick: (_dates: any, visible: boolean, type: any, shortcut: any) => void;
266
267
  onPickSuccess: () => void;
@@ -286,6 +287,7 @@ declare const BkDatePicker: {
286
287
  timeEnterMode: import("vue").Ref<boolean>;
287
288
  shortcut: import("vue").Ref<any>;
288
289
  onSelectionModeChange: import("vue").Ref<(_type: any) => import("./interface").SelectionModeType>;
290
+ tmpValue: import("vue").Ref<any>;
289
291
  }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "input" | "clear" | "update:modelValue" | "pick-success" | "pick-first" | "open-change" | "shortcut-change")[], string, {
290
292
  readonly type: import("./interface").PickerTypeType;
291
293
  readonly disabled: boolean;
@@ -495,6 +497,7 @@ declare const BkDatePicker: {
495
497
  handleBlur: (e: any) => void;
496
498
  handleKeydown: (e: KeyboardEvent) => void;
497
499
  handleInputChange: (e: any) => void;
500
+ handleInputInput: (e: any) => void;
498
501
  handleClear: () => void;
499
502
  onPick: (_dates: any, visible: boolean, type: any, shortcut: any) => void;
500
503
  onPickSuccess: () => void;
@@ -520,6 +523,7 @@ declare const BkDatePicker: {
520
523
  timeEnterMode: import("vue").Ref<boolean>;
521
524
  shortcut: import("vue").Ref<any>;
522
525
  onSelectionModeChange: import("vue").Ref<(_type: any) => import("./interface").SelectionModeType>;
526
+ tmpValue: import("vue").Ref<any>;
523
527
  }> & {} & import("vue").ComponentCustomProperties & {};
524
528
  __isFragment?: never;
525
529
  __isTeleport?: never;
@@ -678,6 +682,7 @@ declare const BkDatePicker: {
678
682
  handleBlur: (e: any) => void;
679
683
  handleKeydown: (e: KeyboardEvent) => void;
680
684
  handleInputChange: (e: any) => void;
685
+ handleInputInput: (e: any) => void;
681
686
  handleClear: () => void;
682
687
  onPick: (_dates: any, visible: boolean, type: any, shortcut: any) => void;
683
688
  onPickSuccess: () => void;
@@ -703,6 +708,7 @@ declare const BkDatePicker: {
703
708
  timeEnterMode: import("vue").Ref<boolean>;
704
709
  shortcut: import("vue").Ref<any>;
705
710
  onSelectionModeChange: import("vue").Ref<(_type: any) => import("./interface").SelectionModeType>;
711
+ tmpValue: import("vue").Ref<any>;
706
712
  }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "input" | "clear" | "update:modelValue" | "pick-success" | "pick-first" | "open-change" | "shortcut-change")[], "change" | "input" | "clear" | "update:modelValue" | "pick-success" | "pick-first" | "open-change" | "shortcut-change", {
707
713
  readonly type: import("./interface").PickerTypeType;
708
714
  readonly disabled: boolean;
@@ -2311,12 +2311,12 @@ var timeParts = ['hours', 'minutes', 'seconds'];
2311
2311
  handleWheel(type);
2312
2312
  wheelTimer.value = setTimeout(function () {
2313
2313
  stopWheel(domRef);
2314
- }, 400);
2314
+ }, 0);
2315
2315
  } else {
2316
2316
  clearTimeout(wheelTimer);
2317
2317
  wheelTimer.value = setTimeout(function () {
2318
2318
  stopWheel(domRef);
2319
- }, 400);
2319
+ }, 100);
2320
2320
  }
2321
2321
  }, 32), {
2322
2322
  passive: true
@@ -4185,7 +4185,9 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
4185
4185
  internalFocus: false,
4186
4186
  timeEnterMode: true,
4187
4187
  shortcut: shortcut,
4188
- onSelectionModeChange: onSelectionModeChange
4188
+ onSelectionModeChange: onSelectionModeChange,
4189
+ // for 编辑时,mouseleave 事件中缓存的 value
4190
+ tmpValue: initialValue
4189
4191
  });
4190
4192
  onSelectionModeChange(props.type);
4191
4193
  function onSelectionModeChange(_type) {
@@ -4407,6 +4409,8 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
4407
4409
  // return;
4408
4410
  // }
4409
4411
  state.showClose = false;
4412
+ emitChange(props.type);
4413
+ state.internalValue = state.tmpValue;
4410
4414
  };
4411
4415
  var emitChange = function emitChange(type) {
4412
4416
  (0,external_vue_namespaceObject.nextTick)(function () {
@@ -4439,6 +4443,21 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
4439
4443
  state.forceInputRerender = state.forceInputRerender + 1;
4440
4444
  }
4441
4445
  };
4446
+ var handleInputInput = function handleInputInput(e) {
4447
+ var _props$disabledDate2;
4448
+ var isArrayValue = props.type.includes('range') || props.multiple;
4449
+ var oldValue = visualValue.value;
4450
+ var newValue = e.target.value;
4451
+ var newDate = parseDate(newValue, props.type, props.multiple, props.format);
4452
+ var valueToTest = isArrayValue ? newDate : newDate[0];
4453
+ var isDisabled = (_props$disabledDate2 = props.disabledDate) === null || _props$disabledDate2 === void 0 ? void 0 : _props$disabledDate2.call(props, valueToTest);
4454
+ var isValidDate = newDate.reduce(function (valid, date) {
4455
+ return valid && date instanceof Date;
4456
+ }, true);
4457
+ if (newValue !== oldValue && !isDisabled && isValidDate) {
4458
+ state.tmpValue = newDate;
4459
+ }
4460
+ };
4442
4461
  var handleFocus = function handleFocus(e) {
4443
4462
  if (props.readonly) {
4444
4463
  return;
@@ -4642,6 +4661,7 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
4642
4661
  handleBlur: handleBlur,
4643
4662
  handleKeydown: handleKeydown,
4644
4663
  handleInputChange: handleInputChange,
4664
+ handleInputInput: handleInputInput,
4645
4665
  handleClear: handleClear,
4646
4666
  onPick: onPick,
4647
4667
  onPickSuccess: onPickSuccess,
@@ -4721,7 +4741,8 @@ function date_picker_objectSpread(target) { for (var i = 1; i < arguments.length
4721
4741
  "onClick": this.handleFocus,
4722
4742
  "onBlur": this.handleBlur,
4723
4743
  "onKeydown": this.handleKeydown,
4724
- "onChange": this.handleInputChange
4744
+ "onChange": this.handleInputChange,
4745
+ "onInput": this.handleInputInput
4725
4746
  }, null), this.clearable && this.showClose ? (0,external_vue_namespaceObject.createVNode)(external_icon_namespaceObject.Close, {
4726
4747
  "onClick": this.handleClear,
4727
4748
  "class": "clear-action"
@@ -1013,6 +1013,10 @@ var inputEmitEventsType = (_inputEmitEventsType = {}, _defineProperty(_inputEmit
1013
1013
  focus: function focus() {
1014
1014
  inputRef.value.focus();
1015
1015
  },
1016
+ blur: function blur() {
1017
+ inputRef.value.blur();
1018
+ isFocused.value = false;
1019
+ },
1016
1020
  clear: clear
1017
1021
  });
1018
1022
  function detectOverflow() {
@@ -570,6 +570,7 @@ declare const BkSelect: {
570
570
  inputRef: import("vue").Ref<HTMLElement>;
571
571
  handleRemoveTag: (val: string) => void;
572
572
  focus: () => void;
573
+ blur: () => void;
573
574
  handleInput: (e: any) => void;
574
575
  handleKeydown: (e: any) => void;
575
576
  resolveClassName: (cls: string) => string;
@@ -650,6 +651,7 @@ declare const BkSelect: {
650
651
  inputRef: import("vue").Ref<HTMLElement>;
651
652
  handleRemoveTag: (val: string) => void;
652
653
  focus: () => void;
654
+ blur: () => void;
653
655
  handleInput: (e: any) => void;
654
656
  handleKeydown: (e: any) => void;
655
657
  resolveClassName: (cls: string) => string;
@@ -1337,6 +1339,7 @@ declare const BkSelect: {
1337
1339
  inputRef: import("vue").Ref<HTMLElement>;
1338
1340
  handleRemoveTag: (val: string) => void;
1339
1341
  focus: () => void;
1342
+ blur: () => void;
1340
1343
  handleInput: (e: any) => void;
1341
1344
  handleKeydown: (e: any) => void;
1342
1345
  resolveClassName: (cls: string) => string;
@@ -1417,6 +1420,7 @@ declare const BkSelect: {
1417
1420
  inputRef: import("vue").Ref<HTMLElement>;
1418
1421
  handleRemoveTag: (val: string) => void;
1419
1422
  focus: () => void;
1423
+ blur: () => void;
1420
1424
  handleInput: (e: any) => void;
1421
1425
  handleKeydown: (e: any) => void;
1422
1426
  resolveClassName: (cls: string) => string;
@@ -2049,6 +2053,7 @@ declare const BkSelect: {
2049
2053
  inputRef: import("vue").Ref<HTMLElement>;
2050
2054
  handleRemoveTag: (val: string) => void;
2051
2055
  focus: () => void;
2056
+ blur: () => void;
2052
2057
  handleInput: (e: any) => void;
2053
2058
  handleKeydown: (e: any) => void;
2054
2059
  resolveClassName: (cls: string) => string;
@@ -2129,6 +2134,7 @@ declare const BkSelect: {
2129
2134
  inputRef: import("vue").Ref<HTMLElement>;
2130
2135
  handleRemoveTag: (val: string) => void;
2131
2136
  focus: () => void;
2137
+ blur: () => void;
2132
2138
  handleInput: (e: any) => void;
2133
2139
  handleKeydown: (e: any) => void;
2134
2140
  resolveClassName: (cls: string) => string;
@@ -1133,6 +1133,10 @@ const external_tag_namespaceObject = external_tag_x({ ["default"]: () => __WEBPA
1133
1133
  var _inputRef$value;
1134
1134
  (_inputRef$value = inputRef.value) === null || _inputRef$value === void 0 ? void 0 : _inputRef$value.focus();
1135
1135
  };
1136
+ var blur = function blur() {
1137
+ var _inputRef$value2;
1138
+ (_inputRef$value2 = inputRef.value) === null || _inputRef$value2 === void 0 ? void 0 : _inputRef$value2.blur();
1139
+ };
1136
1140
  var handleInput = function handleInput(e) {
1137
1141
  emit('update:modelValue', e.target.value);
1138
1142
  };
@@ -1200,6 +1204,7 @@ const external_tag_namespaceObject = external_tag_x({ ["default"]: () => __WEBPA
1200
1204
  inputRef: inputRef,
1201
1205
  handleRemoveTag: handleRemoveTag,
1202
1206
  focus: focus,
1207
+ blur: blur,
1203
1208
  handleInput: handleInput,
1204
1209
  handleKeydown: handleKeydown,
1205
1210
  resolveClassName: resolveClassName
@@ -1362,7 +1367,7 @@ function select_objectSpread(target) { for (var i = 1; i < arguments.length; i++
1362
1367
  displayKey: external_shared_namespaceObject.PropTypes.string.def('label'),
1363
1368
  withValidate: external_shared_namespaceObject.PropTypes.bool.def(true),
1364
1369
  showSelectedIcon: external_shared_namespaceObject.PropTypes.bool.def(true),
1365
- inputSearch: external_shared_namespaceObject.PropTypes.bool.def(true),
1370
+ inputSearch: external_shared_namespaceObject.PropTypes.bool.def(false),
1366
1371
  enableVirtualRender: external_shared_namespaceObject.PropTypes.bool.def(false),
1367
1372
  allowEmptyValues: external_shared_namespaceObject.PropTypes.array.def([]),
1368
1373
  autoFocus: external_shared_namespaceObject.PropTypes.bool.def(false),
@@ -1614,6 +1619,7 @@ function select_objectSpread(target) { for (var i = 1; i < arguments.length; i++
1614
1619
  var handleBlur = function handleBlur() {
1615
1620
  if (!isFocus.value) return;
1616
1621
  isFocus.value = false;
1622
+ blurInput();
1617
1623
  emit('blur');
1618
1624
  };
1619
1625
  var _usePopover = usePopover({
@@ -1761,6 +1767,7 @@ function select_objectSpread(target) { for (var i = 1; i < arguments.length; i++
1761
1767
  }));
1762
1768
  emit('select', option.optionID);
1763
1769
  }
1770
+ focusInput();
1764
1771
  } else {
1765
1772
  // 单选
1766
1773
  selected.value = [{
@@ -1770,8 +1777,8 @@ function select_objectSpread(target) { for (var i = 1; i < arguments.length; i++
1770
1777
  emitChange(option.optionID);
1771
1778
  emit('select', option.optionID);
1772
1779
  hidePopover();
1780
+ handleBlur();
1773
1781
  }
1774
- focusInput();
1775
1782
  };
1776
1783
  // 聚焦输入框
1777
1784
  var focusInput = function focusInput() {
@@ -1790,6 +1797,18 @@ function select_objectSpread(target) { for (var i = 1; i < arguments.length; i++
1790
1797
  }
1791
1798
  }, 0);
1792
1799
  };
1800
+ // 失焦输入框
1801
+ var blurInput = function blurInput() {
1802
+ setTimeout(function () {
1803
+ if (multipleMode.value === 'tag') {
1804
+ var _selectTagInputRef$va2;
1805
+ (_selectTagInputRef$va2 = selectTagInputRef.value) === null || _selectTagInputRef$va2 === void 0 ? void 0 : _selectTagInputRef$va2.blur();
1806
+ } else {
1807
+ var _inputRef$value2;
1808
+ (_inputRef$value2 = inputRef.value) === null || _inputRef$value2 === void 0 ? void 0 : _inputRef$value2.blur();
1809
+ }
1810
+ }, 0);
1811
+ };
1793
1812
  // 清空事件
1794
1813
  var handleClear = function handleClear(e) {
1795
1814
  e.stopPropagation();
@@ -435,6 +435,9 @@
435
435
  margin-right: 6px;
436
436
  pointer-events: none;
437
437
  }
438
+ .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option .bk-select-checkbox .bk-checkbox-original {
439
+ opacity: 0;
440
+ }
438
441
  .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option-item {
439
442
  overflow: hidden;
440
443
  text-overflow: ellipsis;
@@ -444,6 +444,7 @@ declare const _default: import("vue").DefineComponent<{
444
444
  inputRef: import("vue").Ref<HTMLElement>;
445
445
  handleRemoveTag: (val: string) => void;
446
446
  focus: () => void;
447
+ blur: () => void;
447
448
  handleInput: (e: any) => void;
448
449
  handleKeydown: (e: any) => void;
449
450
  resolveClassName: (cls: string) => string;
@@ -524,6 +525,7 @@ declare const _default: import("vue").DefineComponent<{
524
525
  inputRef: import("vue").Ref<HTMLElement>;
525
526
  handleRemoveTag: (val: string) => void;
526
527
  focus: () => void;
528
+ blur: () => void;
527
529
  handleInput: (e: any) => void;
528
530
  handleKeydown: (e: any) => void;
529
531
  resolveClassName: (cls: string) => string;
@@ -353,6 +353,9 @@
353
353
  .@{bk-prefix}-select-checkbox {
354
354
  margin-right: 6px;
355
355
  pointer-events: none;
356
+ .@{bk-prefix}-checkbox-original {
357
+ opacity: 0;
358
+ }
356
359
  }
357
360
 
358
361
  &-item {
@@ -804,6 +804,9 @@
804
804
  margin-right: 6px;
805
805
  pointer-events: none;
806
806
  }
807
+ .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option .bk-select-checkbox .bk-checkbox-original {
808
+ opacity: 0;
809
+ }
807
810
  .bk-popover.bk-pop2-content.bk-select-popover .bk-select-content-wrapper .bk-select-option-item {
808
811
  overflow: hidden;
809
812
  text-overflow: ellipsis;
@@ -44,6 +44,7 @@ declare const _default: import("vue").DefineComponent<{
44
44
  inputRef: import("vue").Ref<HTMLElement>;
45
45
  handleRemoveTag: (val: string) => void;
46
46
  focus: () => void;
47
+ blur: () => void;
47
48
  handleInput: (e: any) => void;
48
49
  handleKeydown: (e: any) => void;
49
50
  resolveClassName: (cls: string) => string;
@@ -763,7 +763,7 @@ var stepsProps = {
763
763
  }, [this.defaultSteps.map(function (step, index) {
764
764
  var _this$$slots, _this$$slots2, _this$$slots3;
765
765
  return (0,external_vue_namespaceObject.createVNode)("div", {
766
- "class": [_this.resolveClassName('step'), !step.title ? _this.resolveClassName('step-no-content') : '', isDone(index) ? 'done' : '', isCurrent(index) ? 'current' : '', isCurrent(index) && _this.status === 'error' ? 'isError' : '', step.status && isCurrent(index) ? ["".concat(_this.resolveClassName("step-".concat(step.status)))] : '']
766
+ "class": [_this.resolveClassName('step'), !step.title ? _this.resolveClassName('step-no-content') : '', isDone(index) ? 'done' : '', isCurrent(index) ? 'current' : '', isCurrent(index) && _this.status === 'error' ? 'is-error' : '', step.status && isCurrent(index) ? ["".concat(_this.resolveClassName("step-".concat(step.status)))] : '']
767
767
  }, [(0,external_vue_namespaceObject.createVNode)("span", {
768
768
  "class": ["".concat(_this.resolveClassName('step-indicator')), "".concat(_this.resolveClassName("step-".concat(iconType(step) ? 'icon' : 'number'))), "".concat(_this.resolveClassName("step-icon".concat(step.status)))],
769
769
  "style": {
@@ -237,10 +237,12 @@
237
237
  .bk-steps .bk-step:last-child .bk-step-title::after {
238
238
  display: none;
239
239
  }
240
- .bk-steps .bk-step.done .bk-step-title,
241
- .bk-steps .bk-step.done .bk-step-description {
240
+ .bk-steps .bk-step.done .bk-step-title {
242
241
  color: var(--default-color);
243
242
  }
243
+ .bk-steps .bk-step.done .bk-step-description {
244
+ color: #979ba5;
245
+ }
244
246
  .bk-steps .bk-step.done .bk-steps-icon {
245
247
  margin-bottom: 3px;
246
248
  font-size: 22px;
@@ -248,6 +250,12 @@
248
250
  .bk-steps .bk-step.done .bk-step-iconerror .bk-steps-icon {
249
251
  font-size: 14px;
250
252
  }
253
+ .bk-steps .bk-step.done:has(+ .current.is-error) .bk-step-title::after,
254
+ .bk-steps .bk-step.done:has( + .current.bk-step-error) .bk-step-title::after,
255
+ .bk-steps .bk-step.done:has(+ .current.is-error) .bk-step-indicator::after,
256
+ .bk-steps .bk-step.done:has( + .current.bk-step-error) .bk-step-indicator::after {
257
+ background-image: linear-gradient(to right, var(--danger-color) 50%, transparent 0%);
258
+ }
251
259
  .bk-steps .bk-step.current .bk-step-number,
252
260
  .bk-steps .bk-step.current .bk-step-icon,
253
261
  .bk-steps .bk-step.current .bk-step-text {
@@ -265,11 +273,11 @@
265
273
  .bk-steps .bk-step.current.bk-step-error .bk-step-description {
266
274
  color: var(--danger-color);
267
275
  }
268
- .bk-steps .bk-step.isError .bk-step-indicator {
276
+ .bk-steps .bk-step.is-error .bk-step-indicator {
269
277
  background-color: var(--danger-color) !important;
270
278
  border-color: var(--danger-color) !important;
271
279
  }
272
- .bk-steps .bk-step.isError .bk-step-content .bk-step-title {
280
+ .bk-steps .bk-step.is-error .bk-step-content .bk-step-title {
273
281
  color: var(--danger-color) !important;
274
282
  }
275
283
  .bk-steps-primary .bk-step.done .bk-step-number,
@@ -387,6 +395,10 @@
387
395
  background-size: 1px 6px;
388
396
  content: '';
389
397
  }
398
+ .bk-steps-vertical .bk-step.done:has(+ .current.is-error)::after,
399
+ .bk-steps-vertical .bk-step.done:has( + .current.bk-step-error)::after {
400
+ background-image: linear-gradient(var(--danger-color) 50%, transparent 0%);
401
+ }
390
402
  .bk-steps-vertical .bk-step .bk-step-title {
391
403
  display: flex;
392
404
  height: 100%;
@@ -139,10 +139,12 @@
139
139
  }
140
140
 
141
141
  &.done {
142
- .@{bk-prefix}-step-title,
143
- .@{bk-prefix}-step-description {
142
+ .@{bk-prefix}-step-title {
144
143
  color: @default-color;
145
144
  }
145
+ .@{bk-prefix}-step-description {
146
+ color: #979ba5;
147
+ }
146
148
 
147
149
  .@{bk-prefix}-steps-icon {
148
150
  margin-bottom: 3px;
@@ -154,6 +156,16 @@
154
156
  font-size: 14px;
155
157
  }
156
158
  }
159
+
160
+ &:has(+ .current.is-error),
161
+ &:has(+ .current.@{bk-prefix}-step-error) {
162
+ .@{bk-prefix}-step-title,
163
+ .@{bk-prefix}-step-indicator {
164
+ &::after {
165
+ background-image: linear-gradient(to right, @danger-color 50%, transparent 0%);
166
+ }
167
+ }
168
+ }
157
169
  }
158
170
 
159
171
  &.current {
@@ -181,7 +193,7 @@
181
193
  }
182
194
  }
183
195
 
184
- &.isError {
196
+ &.is-error {
185
197
  .@{bk-prefix}-step-indicator {
186
198
  background-color: @danger-color !important;
187
199
  border-color: @danger-color !important;
@@ -288,6 +300,15 @@
288
300
  content: '';
289
301
  }
290
302
 
303
+ &.done {
304
+ &:has(+ .current.is-error),
305
+ &:has(+ .current.@{bk-prefix}-step-error) {
306
+ &::after {
307
+ background-image: linear-gradient(@danger-color 50%, transparent 0%);
308
+ }
309
+ }
310
+ }
311
+
291
312
  .@{bk-prefix}-step-title {
292
313
  display: flex;
293
314
  height: 100%;
@@ -483,10 +483,12 @@
483
483
  .bk-steps .bk-step:last-child .bk-step-title::after {
484
484
  display: none;
485
485
  }
486
- .bk-steps .bk-step.done .bk-step-title,
487
- .bk-steps .bk-step.done .bk-step-description {
486
+ .bk-steps .bk-step.done .bk-step-title {
488
487
  color: var(--default-color);
489
488
  }
489
+ .bk-steps .bk-step.done .bk-step-description {
490
+ color: #979ba5;
491
+ }
490
492
  .bk-steps .bk-step.done .bk-steps-icon {
491
493
  margin-bottom: 3px;
492
494
  font-size: 22px;
@@ -494,6 +496,12 @@
494
496
  .bk-steps .bk-step.done .bk-step-iconerror .bk-steps-icon {
495
497
  font-size: 14px;
496
498
  }
499
+ .bk-steps .bk-step.done:has(+ .current.is-error) .bk-step-title::after,
500
+ .bk-steps .bk-step.done:has( + .current.bk-step-error) .bk-step-title::after,
501
+ .bk-steps .bk-step.done:has(+ .current.is-error) .bk-step-indicator::after,
502
+ .bk-steps .bk-step.done:has( + .current.bk-step-error) .bk-step-indicator::after {
503
+ background-image: linear-gradient(to right, var(--danger-color) 50%, transparent 0%);
504
+ }
497
505
  .bk-steps .bk-step.current .bk-step-number,
498
506
  .bk-steps .bk-step.current .bk-step-icon,
499
507
  .bk-steps .bk-step.current .bk-step-text {
@@ -511,11 +519,11 @@
511
519
  .bk-steps .bk-step.current.bk-step-error .bk-step-description {
512
520
  color: var(--danger-color);
513
521
  }
514
- .bk-steps .bk-step.isError .bk-step-indicator {
522
+ .bk-steps .bk-step.is-error .bk-step-indicator {
515
523
  background-color: var(--danger-color) !important;
516
524
  border-color: var(--danger-color) !important;
517
525
  }
518
- .bk-steps .bk-step.isError .bk-step-content .bk-step-title {
526
+ .bk-steps .bk-step.is-error .bk-step-content .bk-step-title {
519
527
  color: var(--danger-color) !important;
520
528
  }
521
529
  .bk-steps-primary .bk-step.done .bk-step-number,
@@ -633,6 +641,10 @@
633
641
  background-size: 1px 6px;
634
642
  content: '';
635
643
  }
644
+ .bk-steps-vertical .bk-step.done:has(+ .current.is-error)::after,
645
+ .bk-steps-vertical .bk-step.done:has( + .current.bk-step-error)::after {
646
+ background-image: linear-gradient(var(--danger-color) 50%, transparent 0%);
647
+ }
636
648
  .bk-steps-vertical .bk-step .bk-step-title {
637
649
  display: flex;
638
650
  height: 100%;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "bkui-vue",
3
- "version": "0.0.2-beta.116",
3
+ "version": "0.0.2-beta.118",
4
4
  "workspaces": {
5
5
  "packages": [
6
6
  "packages/!(**.bak)*",