@kdcloudjs/kdesign 1.7.63 → 1.7.65

package/es/base-data/base-data.js

@@ -2,9 +2,9 @@ import _extends from "@babel/runtime-corejs3/helpers/extends";
 import _toConsumableArray from "@babel/runtime-corejs3/helpers/toConsumableArray";
 import _defineProperty from "@babel/runtime-corejs3/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
-import _spliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/splice";
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
+import _spliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/splice";
 import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
 import _JSON$stringify from "@babel/runtime-corejs3/core-js-stable/json/stringify";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
@@ -17,6 +17,7 @@ import { getCompProps } from '../_utils';
 import { Input, Icon, Tabs, Empty, Spin, Checkbox } from '../index';
 import usePopper from '../_utils/usePopper';
 var InternalBaseData = function InternalBaseData(props, ref) {
+  var _context2;
   var _useContext = useContext(ConfigContext),
     getPrefixCls = _useContext.getPrefixCls,
     prefixCls = _useContext.prefixCls,
@@ -102,8 +103,12 @@ var InternalBaseData = function InternalBaseData(props, ref) {
   }, [seletedOptions]);
   // 记录每个选项的开始与结束下标
   var setValIndxPosition = useCallback(function () {
+    var _context;
+    var str = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
     var arr = [];
-    inputValue.split(delimiter).reduce(function (pre, next) {
+    _filterInstanceProperty(_context = (str || inputValue).split(delimiter)).call(_context, function (item) {
+      return !!item;
+    }).reduce(function (pre, next) {
       arr.push({
         start: pre,
         end: pre + next.length
@@ -112,6 +117,13 @@ var InternalBaseData = function InternalBaseData(props, ref) {
     }, 0);
     return arr;
   }, [delimiter, inputValue]);
+  var initInputValue = _filterInstanceProperty(_context2 = searchInfo.current.editOptions || []).call(_context2, function (item) {
+    return !!item;
+  }).reduce(function (pre, next, index, arr) {
+    var _context3, _context4;
+    return _concatInstanceProperty(_context3 = _concatInstanceProperty(_context4 = "".concat(pre)).call(_context4, next[optionLabelProp])).call(_context3, index !== arr.length - 1 ? delimiter : '');
+  }, '');
+  var initIndexPos = setValIndxPosition(initInputValue);
   useEffect(function () {
     var list = setValIndxPosition();
     setIndxPosList(list);
@@ -130,18 +142,17 @@ var InternalBaseData = function InternalBaseData(props, ref) {
     searchInfo.current.editOptions = _toConsumableArray(seletedItems);
   }, [value, isMultiple]);
   useEffect(function () {
-    var _a;
+    var _a, _b;
     if (!searchInfo.current.previousEditValue) return;
     var posList = setValIndxPosition();
     var preValueArr = getStrToArr(searchInfo.current.previousEditValue, delimiter);
     var valueArr = getStrToArr(inputValue, delimiter);
-    var selectionStart = ((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.selectionStart) || 0;
+    var selectionStart = ((_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.input) === null || _b === void 0 ? void 0 : _b.selectionStart) || 0;
     var index = findSelectionIndex(selectionStart, posList);
     searchInfo.current.searchIndex = index;
     // 新增一个
     var list = _toConsumableArray(searchInfo.current.editOptions || []);
     if (valueArr.length - preValueArr.length === 1) {
-      searchInfo.current.deleteEndIndx = index;
       _spliceInstanceProperty(list).call(list, index, 0, null);
     }
     if (valueArr.length < preValueArr.length) {
@@ -158,22 +169,35 @@ var InternalBaseData = function InternalBaseData(props, ref) {
         end = _findDeleteInterval.end;
       list === null || list === void 0 ? void 0 : _spliceInstanceProperty(list).call(list, start, end - start + 1);
     }
+    // 判断每次单个按del键时删除了分隔符后下一次触发
+    if (searchInfo.current.deleteEndIndx > 0 && selectionStart !== searchInfo.current.deleteEndIndx) {
+      var _findDeleteInterval2 = findDeleteInterval(selectionStart, searchInfo.current.deleteEndIndx, initIndexPos),
+        _start = _findDeleteInterval2.start,
+        _end = _findDeleteInterval2.end;
+      // 单个删除时找到合理的下标触发
+      if (_start !== null && _end !== null && _start <= _end) {
+        list === null || list === void 0 ? void 0 : _spliceInstanceProperty(list).call(list, _start, _end - _start + 1);
+        searchInfo.current.deleteEndIndx = 0;
+      }
+    }
     searchInfo.current.editOptions = list;
     searchInfo.current.previousEditValue = inputValue;
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [delimiter, inputValue, isMultiple, setValIndxPosition]);
   var getStrToArr = function getStrToArr() {
-    var _context;
+    var _context5;
     var str = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
     var delimiter = arguments.length > 1 ? arguments[1] : undefined;
-    return _filterInstanceProperty(_context = str.split(delimiter)).call(_context, function (item) {
+    return _filterInstanceProperty(_context5 = str.split(delimiter)).call(_context5, function (item) {
       return item;
     });
   };
   // 当选中项文字超出输入框时，显示共多少项
   useLayoutEffect(function () {
-    if (!inputRef.current) return;
-    if (inputRef.current.scrollWidth - inputRef.current.offsetWidth > 0) {
+    var _a;
+    var inputDom = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.input;
+    if (!inputDom) return;
+    if (inputDom.scrollWidth - inputDom.offsetWidth > 0) {
       setShowTotal(true);
     } else {
       setShowTotal(false);
@@ -181,32 +205,49 @@ var InternalBaseData = function InternalBaseData(props, ref) {
   }, [inputRef, inputValue]);
   // 通过选中项显示input文字， optionLabelProp为回填到选择框的属性
   var setValueBySeleted = useCallback(function () {
-    var _context4;
+    var _context8;
     var defaultInputValue = seletedOptions.reduce(function (pre, next, index, arr) {
-      var _context2, _context3;
-      return _concatInstanceProperty(_context2 = _concatInstanceProperty(_context3 = "".concat(pre)).call(_context3, next[optionLabelProp])).call(_context2, index !== arr.length - 1 ? delimiter : '');
+      var _context6, _context7;
+      return _concatInstanceProperty(_context6 = _concatInstanceProperty(_context7 = "".concat(pre)).call(_context7, next[optionLabelProp])).call(_context6, index !== arr.length - 1 ? delimiter : '');
     }, '');
     searchInfo.current.previousInputValue = defaultInputValue;
     setInputValue(defaultInputValue);
-    searchInfo.current.previousEditValue = _concatInstanceProperty(_context4 = "".concat(defaultInputValue)).call(_context4, delimiter);
+    searchInfo.current.previousEditValue = _concatInstanceProperty(_context8 = "".concat(defaultInputValue)).call(_context8, delimiter);
   }, [delimiter, optionLabelProp, seletedOptions]);
   useEffect(function () {
     setValueBySeleted();
   }, [setValueBySeleted]);
+  var findDeletedChar = function findDeletedChar(prev, current) {
+    if (prev.length > current.length) {
+      for (var i = 0; i < prev.length; i++) {
+        if (prev[i] !== current[i]) {
+          return prev[i];
+        }
+      }
+      return prev[prev.length - 1];
+    }
+    return null;
+  };
   var changeInputText = function changeInputText(e) {
+    var _a;
     setOptionShow(true);
     var textValue = e.target.value;
     var val = textValue;
-    if (isMultiple && inputRef.current && textValue && textValue.length > inputValue.length) {
-      var selectionStart = inputRef.current.selectionStart || 0; // selectionStart: 光标前面有几个字符
+    var inputDom = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.input;
+    var selectionStart = inputDom.selectionStart || 0; // selectionStart: 光标前面有几个字符
+    if (isMultiple && inputDom && textValue && textValue.length > inputValue.length) {
       searchInfo.current.selectionStart = selectionStart;
       var isInHead = selectionStart === 1 && textValue[1] !== delimiter && textValue.length !== 1; // 在首部添加
       var isInMid = selectionStart !== textValue.length && textValue[selectionStart - 2] === delimiter && textValue[selectionStart] !== delimiter;
       if (isInHead || isInMid) {
-        inputRef.current.value = val = textValue.substring(0, selectionStart) + delimiter + textValue.substring(selectionStart, textValue.length);
-        setCursorPosition(inputRef.current, selectionStart);
+        inputDom.value = val = textValue.substring(0, selectionStart) + delimiter + textValue.substring(selectionStart, textValue.length);
+        setCursorPosition(inputDom, selectionStart);
       }
     }
+    // 单个删除时 当删除的字符为分隔符delimiter 记录位置
+    if (findDeletedChar(searchInfo.current.previousEditValue || '', textValue) === delimiter) {
+      searchInfo.current.deleteEndIndx = selectionStart;
+    }
     setInputValue(val);
     handleChange(val);
   };
@@ -216,6 +257,7 @@ var InternalBaseData = function InternalBaseData(props, ref) {
     onSearch === null || onSearch === void 0 ? void 0 : onSearch(str);
   };
   var getQueryStr = function getQueryStr(queryStr) {
+    var _a, _b;
     if (!isMultiple) {
       return queryStr;
     }
@@ -224,7 +266,7 @@ var InternalBaseData = function InternalBaseData(props, ref) {
         // 只有一条记录
         return queryStr;
       }
-      var selectionStart = inputRef.current.selectionStart || 0;
+      var selectionStart = ((_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.input) === null || _b === void 0 ? void 0 : _b.selectionStart) || 0;
       var startIndex = _sliceInstanceProperty(queryStr).call(queryStr, 0, selectionStart).lastIndexOf(delimiter) + 1; // 光标前面最近分隔符index
       var endIndex = _sliceInstanceProperty(queryStr).call(queryStr, selectionStart).indexOf(delimiter);
       endIndex = endIndex === -1 ? queryStr.length : selectionStart + endIndex; // 光标后面最近分隔符index
@@ -234,26 +276,26 @@ var InternalBaseData = function InternalBaseData(props, ref) {
     return queryStr;
   };
   var handleFocus = function handleFocus() {
-    var _context5;
+    var _context9;
     if (disabled) return;
     setFocused(true);
-    isMultiple && seletedOptions.length && setInputValue(_concatInstanceProperty(_context5 = "".concat(inputValue)).call(_context5, delimiter));
+    isMultiple && seletedOptions.length && setInputValue(_concatInstanceProperty(_context9 = "".concat(inputValue)).call(_context9, delimiter));
   };
   var handleBlur = function handleBlur() {
-    var _context6, _context7;
+    var _context10, _context11;
     if (disabled) return;
     setFocused(false);
     setInputValue(searchInfo.current.previousInputValue);
-    searchInfo.current.previousEditValue = _concatInstanceProperty(_context6 = "".concat(searchInfo.current.previousInputValue)).call(_context6, delimiter);
+    searchInfo.current.previousEditValue = _concatInstanceProperty(_context10 = "".concat(searchInfo.current.previousInputValue)).call(_context10, delimiter);
     // 多选失去焦点时，通过editOptions去改写选中项
-    var list = _filterInstanceProperty(_context7 = searchInfo.current.editOptions || []).call(_context7, function (item) {
+    var list = _filterInstanceProperty(_context11 = searchInfo.current.editOptions || []).call(_context11, function (item) {
       return item;
     }) || [];
     if (_JSON$stringify(list) !== _JSON$stringify(seletedOptions)) {
-      var _context8;
-      onChange === null || onChange === void 0 ? void 0 : onChange(_mapInstanceProperty(_context8 = _filterInstanceProperty(list).call(list, function (item) {
+      var _context12;
+      onChange === null || onChange === void 0 ? void 0 : onChange(_mapInstanceProperty(_context12 = _filterInstanceProperty(list).call(list, function (item) {
         return item;
-      })).call(_context8, function (v) {
+      })).call(_context12, function (v) {
         return v.value;
       }), _filterInstanceProperty(list).call(list, function (item) {
         return item;
@@ -265,12 +307,14 @@ var InternalBaseData = function InternalBaseData(props, ref) {
     setSeletedOptions(list);
   };
   var showInputTotal = function showInputTotal() {
+    var _a;
     if (disabled) return;
-    if (inputRef.current) {
-      var scrollToWidth = inputRef.current.scrollWidth - inputRef.current.offsetWidth;
-      inputRef.current.scrollLeft = scrollToWidth;
+    var inputDom = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.input;
+    if (inputDom) {
+      var scrollToWidth = inputDom.scrollWidth - inputDom.offsetWidth;
+      inputDom.scrollLeft = scrollToWidth;
       setTimeout(function () {
-        setCursorPosition(inputRef.current, inputValue.length + 1);
+        setCursorPosition(inputDom, inputValue.length + 1);
       }, 0);
     }
   };
@@ -299,11 +343,12 @@ var InternalBaseData = function InternalBaseData(props, ref) {
   };
   // 双击选中当前项
   var handleDoubleClick = function handleDoubleClick() {
-    var _a, _b;
-    var _findDbClickSelectedP = findDbClickSelectedPos(((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.selectionStart) || 0, ((_b = inputRef.current) === null || _b === void 0 ? void 0 : _b.selectionEnd) || 0),
+    var _a;
+    var inputDom = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.input;
+    var _findDbClickSelectedP = findDbClickSelectedPos((inputDom === null || inputDom === void 0 ? void 0 : inputDom.selectionStart) || 0, (inputDom === null || inputDom === void 0 ? void 0 : inputDom.selectionEnd) || 0),
       start = _findDbClickSelectedP.start,
       end = _findDbClickSelectedP.end;
-    handleSeletedText(inputRef.current, start, end);
+    handleSeletedText(inputDom, start, end);
   };
   var findDbClickSelectedPos = function findDbClickSelectedPos(selectionStart, selectionEnd) {
     for (var index = 0; index < indxPosList.length; index++) {
@@ -348,20 +393,20 @@ var InternalBaseData = function InternalBaseData(props, ref) {
     element.setSelectionRange(start, end);
   };
   var handleSelect = function handleSelect(item) {
-    var _context13;
+    var _context17;
     searchInfo.current.searchValue = undefined;
     if (_findIndexInstanceProperty(seletedOptions).call(seletedOptions, function (v) {
       return v.value === item.value;
     }) !== -1) {
-      var _context9;
+      var _context13;
       var _list = _filterInstanceProperty(seletedOptions).call(seletedOptions, function (v) {
         return v.value !== item.value;
       });
       // 取消选中(非受控状态下)
       isMultiple && value === undefined && setSeletedOptions(_list);
-      onChange === null || onChange === void 0 ? void 0 : onChange(_mapInstanceProperty(_context9 = _filterInstanceProperty(_list).call(_list, function (item) {
+      onChange === null || onChange === void 0 ? void 0 : onChange(_mapInstanceProperty(_context13 = _filterInstanceProperty(_list).call(_list, function (item) {
         return item;
-      })).call(_context9, function (v) {
+      })).call(_context13, function (v) {
         return v.value;
       }), _filterInstanceProperty(_list).call(_list, function (item) {
         return item;
@@ -371,12 +416,12 @@ var InternalBaseData = function InternalBaseData(props, ref) {
     var list = _toConsumableArray(searchInfo.current.editOptions || []);
     list === null || list === void 0 ? void 0 : _spliceInstanceProperty(list).call(list, searchInfo.current.searchIndex || 0, 1, item);
     if (isMultiple) {
-      var _context10, _context11, _context12;
-      onChange === null || onChange === void 0 ? void 0 : onChange(_mapInstanceProperty(_context10 = _filterInstanceProperty(_context11 = list || []).call(_context11, function (item) {
+      var _context14, _context15, _context16;
+      onChange === null || onChange === void 0 ? void 0 : onChange(_mapInstanceProperty(_context14 = _filterInstanceProperty(_context15 = list || []).call(_context15, function (item) {
         return item;
-      })).call(_context10, function (v) {
+      })).call(_context14, function (v) {
         return v.value;
-      }), _filterInstanceProperty(_context12 = list || []).call(_context12, function (item) {
+      }), _filterInstanceProperty(_context16 = list || []).call(_context16, function (item) {
         return item;
       }));
     } else {
@@ -387,7 +432,7 @@ var InternalBaseData = function InternalBaseData(props, ref) {
       return;
     }
     searchInfo.current.editOptions = list;
-    setSeletedOptions(_filterInstanceProperty(_context13 = list || []).call(_context13, function (item) {
+    setSeletedOptions(_filterInstanceProperty(_context17 = list || []).call(_context17, function (item) {
       return item;
     }));
   };
@@ -463,10 +508,10 @@ var InternalBaseData = function InternalBaseData(props, ref) {
    * @returns {React.ReactNode}
    */
   var renderDropdownContent = function renderDropdownContent(data, myColumns) {
-    var _context14;
+    var _context18;
     var showFooter = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
     var showCheckbox = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
-    var dropDownColumns = myColumns && Array.isArray(myColumns) ? myColumns : data && Array.isArray(data) && data.length ? _mapInstanceProperty(_context14 = _Object$keys(data[0])).call(_context14, function (v) {
+    var dropDownColumns = myColumns && Array.isArray(myColumns) ? myColumns : data && Array.isArray(data) && data.length ? _mapInstanceProperty(_context18 = _Object$keys(data[0])).call(_context18, function (v) {
       return {
         key: v
       };

package/es/base-data/interface.d.ts

@@ -52,6 +52,6 @@ export interface ISearchInfoProps {
     previousEditValue?: string;
     searchIndex?: number;
     selectionStart?: number;
-    deleteEndIndx?: number;
+    deleteEndIndx: number;
     editOptions?: any[];
 }

package/es/modal/style/token.less

@@ -16,8 +16,8 @@
 @modal-theme-color-active: var(~'@{modal-prefix}-color-theme-active', @color-theme-7);
 @modal-mask-color-background: var(~'@{modal-prefix}-mask-color-background', rgba(55, 55, 55, 0.5));
 @modal-close-icon-color-text: var(~'@{modal-prefix}-close-icon-color-text', #666666);
-@confirm-modal-title-icon-bg: var(~'@{modal-prefix}-title-icon-color-backround-ongoing', @color-ongoing); // 提示弹窗的背景色
-@warning-modal-title-icon-bg: var(~'@{modal-prefix}-title-icon-color-backround-warning', @color-warning); // 警告弹窗的背景色
+@confirm-modal-title-icon-bg: var(~'@{modal-prefix}-title-icon-color-backround-ongoing', @color-ongoing); // 弹出框的背景色
+@warning-modal-title-icon-bg: var(~'@{modal-prefix}-title-icon-color-backround-warning', @color-warning); // 警告弹出框的背景色
 @error-modal-title-icon-bg: var(~'@{modal-prefix}-title-icon-color-backround-warning', @color-warning); // 反馈浮层错误提示的背景色
 
 // z-index
@@ -46,4 +46,4 @@
 @modal-title-icon-sizing-margin-right: var(~'@{modal-prefix}-title-icon-sizing-margin-right', 8px);
 @modal-header-sizing-padding-horizontal: var(~'@{modal-prefix}-header-sizing-padding-horizontal', 20px);
 @modal-header-sizing-padding-vertical: var(~'@{modal-prefix}-header-sizing-padding-vertical', 0px);
-@modal-body-sizing-padding: var(~'@{modal-prefix}-body-sizing-padding', 20px);
+@modal-body-sizing-padding: var(~'@{modal-prefix}-body-sizing-padding', 20px);

package/es/style/themes/default.less

@@ -523,8 +523,8 @@
 /* -----------  Split-Panel ——————---- end */
 
 /* -----------  Modal  ——————---- start */
-@confirm-modal-title-icon-bg: @ongoing-bg-color; // 提示弹窗的背景色
-@warning-modal-title-icon-bg: @warning-bg-color; // 警告弹窗的背景色
+@confirm-modal-title-icon-bg: @ongoing-bg-color; // 弹出框的背景色
+@warning-modal-title-icon-bg: @warning-bg-color; // 警告弹出框的背景色
 @error-modal-title-icon-bg: @error-bg-color; // 反馈浮层错误提示的背景色
 @modal-border-color: @strong-border-color-1;
 /* -----------  Modal  ——————---- end */
@@ -706,4 +706,4 @@
 @advancedSelector-dropdown-options-height: 32px;
 @advancedSelector-hover-bg: @hover-color;
 
-/* -----------  AdvancedSelector  ——————---- end */
+/* -----------  AdvancedSelector  ——————---- end */