@kdcloudjs/kdesign 1.7.24 → 1.7.25

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.
Files changed (42) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/dist/kdesign-complete.less +13 -11
  3. package/dist/kdesign.css +14 -11
  4. package/dist/kdesign.css.map +1 -1
  5. package/dist/kdesign.js +99 -35
  6. package/dist/kdesign.js.map +1 -1
  7. package/dist/kdesign.min.css +3 -3
  8. package/dist/kdesign.min.js +8 -8
  9. package/dist/kdesign.min.js.map +1 -1
  10. package/es/_utils/usePopper.d.ts +1 -0
  11. package/es/_utils/usePopper.js +4 -2
  12. package/es/city-picker/city-picker.js +31 -23
  13. package/es/city-picker/option.js +2 -2
  14. package/es/city-picker/style/index.css +12 -10
  15. package/es/city-picker/style/index.less +8 -6
  16. package/es/city-picker/style/token.less +4 -5
  17. package/es/input-number/inputNumber.js +15 -3
  18. package/es/input-number/useSelectionRange.d.ts +4 -0
  19. package/es/input-number/useSelectionRange.js +22 -0
  20. package/es/locale/locale.d.ts +4 -4
  21. package/es/locale/zh-CN.d.ts +4 -2
  22. package/es/locale/zh-CN.js +4 -2
  23. package/es/radio/style/index.css +1 -0
  24. package/es/radio/style/index.less +1 -0
  25. package/es/select/select.js +3 -3
  26. package/lib/_utils/usePopper.d.ts +1 -0
  27. package/lib/_utils/usePopper.js +4 -2
  28. package/lib/city-picker/city-picker.js +31 -23
  29. package/lib/city-picker/option.js +2 -2
  30. package/lib/city-picker/style/index.css +12 -10
  31. package/lib/city-picker/style/index.less +8 -6
  32. package/lib/city-picker/style/token.less +4 -5
  33. package/lib/input-number/inputNumber.js +14 -2
  34. package/lib/input-number/useSelectionRange.d.ts +4 -0
  35. package/lib/input-number/useSelectionRange.js +29 -0
  36. package/lib/locale/locale.d.ts +4 -4
  37. package/lib/locale/zh-CN.d.ts +4 -2
  38. package/lib/locale/zh-CN.js +4 -2
  39. package/lib/radio/style/index.css +1 -0
  40. package/lib/radio/style/index.less +1 -0
  41. package/lib/select/select.js +3 -3
  42. package/package.json +1 -1
@@ -264,6 +264,12 @@
264
264
  padding: 0 12px;
265
265
  font-size: 12px;
266
266
  }
267
+ .kd-city-picker-dropdown .kd-tabs-tab-list .kd-tab-pane-type-line .kd-tab-pane-text {
268
+ overflow: hidden;
269
+ white-space: nowrap;
270
+ text-overflow: ellipsis;
271
+ width: 100%;
272
+ }
267
273
  .kd-city-picker-dropdown .kd-tabs-noContainer {
268
274
  height: unset;
269
275
  }
@@ -311,6 +317,9 @@
311
317
  box-sizing: content-box;
312
318
  }
313
319
  .kd-city-picker-list-item {
320
+ overflow: hidden;
321
+ white-space: nowrap;
322
+ text-overflow: ellipsis;
314
323
  position: relative;
315
324
  display: block;
316
325
  font-weight: normal;
@@ -319,16 +328,8 @@
319
328
  padding: 5px 12px;
320
329
  color: var(--kd-c-city-picker-footer-color-text, var(--kd-g-color-text-primary, #212121));
321
330
  line-height: var(--kd-c-city-picker-dropdown-line-height, 22px);
322
- display: -webkit-box;
323
- display: -ms-flexbox;
324
- display: flex;
325
331
  cursor: pointer;
326
332
  }
327
- .kd-city-picker-list-item-content {
328
- overflow: hidden;
329
- white-space: nowrap;
330
- text-overflow: ellipsis;
331
- }
332
333
  .kd-city-picker-list-item-info {
333
334
  color: var(--kd-c-city-picker-placeholder-color-text, #b2b2b2);
334
335
  white-space: nowrap;
@@ -337,7 +338,8 @@
337
338
  background-color: var(--kd-c-city-picker-color-background, #f5f5f5);
338
339
  }
339
340
  .kd-city-picker-list-item-selected:not(.kd-city-picker-list-item-disabled) {
340
- background-color: var(--kd-c-city-picker-color-background-selected, #f2f6ff);
341
+ background-color: var(--kd-c-city-picker-color-background-selected, var(--kd-g-color-theme-3, #e3eeff));
342
+ color: var(--kd-c-city-picker-list-item-color-text-selected, var(--kd-g-color-theme, #5582f3));
341
343
  }
342
344
  .kd-city-picker-list-item-disabled {
343
345
  color: var(--kd-c-city-picker-item-color-text-disabled, var(--kd-g-color-disabled, #b2b2b2));
@@ -345,7 +347,7 @@
345
347
  background-color: var(--kd-c-city-picker-item-color-background-disabled, #fff);
346
348
  }
347
349
  .kd-city-picker-highlight {
348
- color: #5582f3;
350
+ color: var(--kd-c-city-picker-highlight-color-text, var(--kd-g-color-theme, #5582f3));
349
351
  }
350
352
  .kd-city-picker-size-small {
351
353
  min-height: var(--kd-c-city-picker-sizing-height-small, 24px);
@@ -159,6 +159,11 @@
159
159
  &-type-line {
160
160
  padding: 0 12px;
161
161
  font-size: 12px;
162
+
163
+ .@{kd-prefix}-tab-pane-text {
164
+ .over();
165
+ width: 100%;
166
+ }
162
167
  }
163
168
  }
164
169
  }
@@ -204,14 +209,10 @@
204
209
 
205
210
  // 下拉列表选项
206
211
  &-item {
212
+ .over();
207
213
  .item();
208
- display: flex;
209
214
  cursor: pointer;
210
215
 
211
- &-content {
212
- .over();
213
- }
214
-
215
216
  &-info {
216
217
  color: @city-picker-placeholder-color;
217
218
  white-space: nowrap;
@@ -223,6 +224,7 @@
223
224
 
224
225
  &-selected:not(&-disabled) {
225
226
  background-color: @city-picker-item-selected-bg;
227
+ color: @city-picker-list-item-color-selected;
226
228
  }
227
229
 
228
230
  &-disabled {
@@ -234,7 +236,7 @@
234
236
  }
235
237
 
236
238
  &-highlight {
237
- color: #5582f3;
239
+ color: @city-picker-highlight-color;
238
240
  }
239
241
 
240
242
  // 选择器框大小
@@ -6,7 +6,7 @@
6
6
  @city-picker-dropdown-bg: var(~'@{city-picker-custom-prefix}-dropdown-color-background', @color-background);
7
7
  @city-picker-disabled-option-bg: var(~'@{city-picker-custom-prefix}-item-color-background-disabled', #fff);
8
8
  @city-picker-item-active-bg: var(~'@{city-picker-custom-prefix}-color-background', #f5f5f5);
9
- @city-picker-item-selected-bg: var(~'@{city-picker-custom-prefix}-color-background-selected', #f2f6ff);
9
+ @city-picker-item-selected-bg: var(~'@{city-picker-custom-prefix}-color-background-selected', @color-theme-3);
10
10
  @city-picker-g-color-border: var(~'@{city-picker-custom-prefix}-color-border', @color-input);
11
11
  @city-picker-g-color-border-foucs: var(~'@{city-picker-custom-prefix}-color-border-foucs', @color-theme);
12
12
  @city-picker-g-color-border-hover: var(~'@{city-picker-custom-prefix}-color-border-hover', @color-theme);
@@ -16,12 +16,11 @@
16
16
  @city-picker-g-item-text-color-disabled: var(~'@{city-picker-custom-prefix}-item-color-text-disabled', @color-disabled);
17
17
  @city-picker-color-background-disabled: var(~'@{city-picker-custom-prefix}-color-background-disabled', #fff);
18
18
  @city-picker-color-text-disabled: var(~'@{city-picker-custom-prefix}-color-text-disabled', @color-disabled);
19
- @city-picker-arrow-icon-color-text-disabled: var(
20
- ~'@{city-picker-custom-prefix}-arrow-icon-color-text-disabled',
21
- #b2b2b2
22
- );
19
+ @city-picker-arrow-icon-color-text-disabled: var(~'@{city-picker-custom-prefix}-arrow-icon-color-text-disabled', #b2b2b2);
23
20
  @city-picker-clear-color: var(~'@{city-picker-custom-prefix}-icon-clear-color-text', #d9d9d9);
24
21
  @city-picker-clear-color-hover: var(~'@{city-picker-custom-prefix}-icon-clear-color-text-hover', #999);
22
+ @city-picker-list-item-color-selected: var(~'@{city-picker-custom-prefix}-list-item-color-text-selected', @color-theme);
23
+ @city-picker-highlight-color: var(~'@{city-picker-custom-prefix}-highlight-color-text', @color-theme);
25
24
 
26
25
  // font
27
26
  @city-picker-list-font-size: var(~'@{city-picker-custom-prefix}-dropdown-font-size', 12px); // 下拉列表文字大小
@@ -22,6 +22,7 @@ var _formatUtil = require("../_utils/formatUtil");
22
22
  var _devwarning = _interopRequireDefault(require("../_utils/devwarning"));
23
23
  var _big = _interopRequireDefault(require("big.js"));
24
24
  var _classnames = _interopRequireDefault(require("classnames"));
25
+ var _useSelectionRange = _interopRequireDefault(require("./useSelectionRange"));
25
26
  function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
26
27
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
27
28
  var __rest = void 0 && (void 0).__rest || function (s, e) {
@@ -33,6 +34,7 @@ var __rest = void 0 && (void 0).__rest || function (s, e) {
33
34
  return t;
34
35
  };
35
36
  var InternalInputNumber = function InternalInputNumber(props, ref) {
37
+ var _a;
36
38
  var _useContext = (0, _react.useContext)(_ConfigContext.default),
37
39
  userDefaultProps = _useContext.compDefaultProps,
38
40
  getPrefixCls = _useContext.getPrefixCls,
@@ -122,6 +124,7 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
122
124
  if (legalNumber === false) {
123
125
  return false;
124
126
  }
127
+ updateSelectionRangePosition(event);
125
128
  value === undefined && setInputValue(legalNumber);
126
129
  onChange && onChange(handleEventAttachValue(event, numberMode ? Number(legalNumber) : legalNumber));
127
130
  };
@@ -237,10 +240,12 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
237
240
  // 还原最小值
238
241
  if (typeof min === 'number' && bigValue.lt(min)) {
239
242
  _inputValue = min.toString();
243
+ onChange === null || onChange === void 0 ? void 0 : onChange(handleEventAttachValue(event, numberMode ? Number(_inputValue) : _inputValue));
240
244
  }
241
245
  // 还原最大值
242
- if (typeof min === 'number' && bigValue.gt(max)) {
246
+ if (typeof max === 'number' && bigValue.gt(max)) {
243
247
  _inputValue = max.toString();
248
+ onChange === null || onChange === void 0 ? void 0 : onChange(handleEventAttachValue(event, numberMode ? Number(_inputValue) : _inputValue));
244
249
  }
245
250
  // 超过精度位数直接截断
246
251
  _inputValue = handleNumericalAccuracy(_inputValue);
@@ -312,9 +317,16 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
312
317
  }
313
318
  };
314
319
  });
320
+ var displayedInputValue = (0, _react.useMemo)(function () {
321
+ return formatter ? formatter(inputValue) : inputValue;
322
+ }, [inputValue, formatter]);
323
+ var updateSelectionRangePosition = (0, _useSelectionRange.default)({
324
+ inputElement: (_a = inputNumberRef.current) === null || _a === void 0 ? void 0 : _a.input,
325
+ inputValue: displayedInputValue
326
+ });
315
327
  return /*#__PURE__*/_react.default.createElement(_input.default, (0, _extends2.default)({}, others, {
316
328
  ref: inputNumberRef,
317
- value: inputValue ? (formatter === null || formatter === void 0 ? void 0 : formatter(inputValue)) || inputValue : inputValue,
329
+ value: displayedInputValue,
318
330
  prefix: prefix,
319
331
  suffix: suffix,
320
332
  onChange: handleChange,
@@ -0,0 +1,4 @@
1
+ export default function useSelectionRange({ inputElement, inputValue, }: {
2
+ inputElement: HTMLInputElement;
3
+ inputValue: string;
4
+ }): (event: any) => void;
@@ -0,0 +1,29 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = useSelectionRange;
8
+ var _react = require("react");
9
+ var _isNumber = _interopRequireDefault(require("lodash/isNumber"));
10
+ function useSelectionRange(_ref) {
11
+ var inputElement = _ref.inputElement,
12
+ inputValue = _ref.inputValue;
13
+ var refSelectionPosition = (0, _react.useRef)();
14
+ (0, _react.useLayoutEffect)(function () {
15
+ var position = refSelectionPosition.current;
16
+ if (inputElement && inputValue && (0, _isNumber.default)(position)) {
17
+ var start = Math.max(0, inputValue.length - position);
18
+ inputElement.setSelectionRange(start, start);
19
+ }
20
+ }, [inputValue]);
21
+ return function (event) {
22
+ var _event$target = event.target,
23
+ end = _event$target.selectionEnd,
24
+ value = _event$target.value;
25
+ if ((0, _isNumber.default)(end)) {
26
+ refSelectionPosition.current = value.length - end;
27
+ }
28
+ };
29
+ }
@@ -61,11 +61,11 @@ declare class LocaleCache {
61
61
  'QuickSearch.emptyTip': string;
62
62
  'QuickSearch.or': string;
63
63
  'CityPicker.domestic': string;
64
- 'CityPicker.internation': string;
65
64
  'CityPicker.common': string;
66
- 'CityPicker.noData': string; /**
67
- * 获取所有语言包数据
68
- */
65
+ 'CityPicker.emptyText': string;
66
+ 'CityPicker.commonEmptyText': string;
67
+ 'CityPicker.tabsDomestic': string;
68
+ 'CityPicker.tabsInternation': string;
69
69
  'ColorPicker.followFunctionalColor': string;
70
70
  'Search.placeholder': string;
71
71
  'Search.desc': string[];
@@ -35,9 +35,11 @@ declare const locale: {
35
35
  'QuickSearch.emptyTip': string;
36
36
  'QuickSearch.or': string;
37
37
  'CityPicker.domestic': string;
38
- 'CityPicker.internation': string;
39
38
  'CityPicker.common': string;
40
- 'CityPicker.noData': string;
39
+ 'CityPicker.emptyText': string;
40
+ 'CityPicker.commonEmptyText': string;
41
+ 'CityPicker.tabsDomestic': string;
42
+ 'CityPicker.tabsInternation': string;
41
43
  'ColorPicker.followFunctionalColor': string;
42
44
  'Search.placeholder': string;
43
45
  'Search.desc': string[];
@@ -46,9 +46,11 @@ var locale = (0, _extends2.default)((0, _extends2.default)({
46
46
  'QuickSearch.emptyTip': '暂无数据',
47
47
  'QuickSearch.or': '或',
48
48
  'CityPicker.domestic': '国内',
49
- 'CityPicker.internation': '国际',
50
49
  'CityPicker.common': '常用',
51
- 'CityPicker.noData': '暂无数据',
50
+ 'CityPicker.emptyText': '暂无数据',
51
+ 'CityPicker.commonEmptyText': '无常用城市',
52
+ 'CityPicker.tabsDomestic': '国内',
53
+ 'CityPicker.tabsInternation': '国际/中国港澳台',
52
54
  'ColorPicker.followFunctionalColor': '跟随功能色',
53
55
  'Search.placeholder': '请输入需要搜索的内容',
54
56
  'Search.desc': ['空格代表"或",回车代表"且"'],
@@ -169,6 +169,7 @@
169
169
  .kd-radio-input {
170
170
  position: absolute;
171
171
  opacity: 0;
172
+ left: 0;
172
173
  }
173
174
  .kd-radio > span {
174
175
  padding: 0 6px 0 var(--kd-c-radio-spacing-padding-left, 4px);
@@ -60,6 +60,7 @@
60
60
  &-input {
61
61
  position: absolute;
62
62
  opacity: 0;
63
+ left: 0;
63
64
  }
64
65
 
65
66
  &>span {
@@ -778,7 +778,7 @@ var InternalSelect = function InternalSelect(props, ref) {
778
778
  // open
779
779
  if (which === _KeyCode.default.ENTER || which === _KeyCode.default.UP || which === _KeyCode.default.DOWN) {
780
780
  e.preventDefault();
781
- setOptionShow(true);
781
+ handleVisibleChange(true);
782
782
  }
783
783
  // backspace
784
784
  var _multipleRef$current5 = multipleRef.current,
@@ -822,10 +822,10 @@ var InternalSelect = function InternalSelect(props, ref) {
822
822
  }));
823
823
  }
824
824
  if (!isMultiple) {
825
- setOptionShow(false);
825
+ handleVisibleChange(false);
826
826
  }
827
827
  } else if (which === _KeyCode.default.ESC) {
828
- setOptionShow(false);
828
+ handleVisibleChange(false);
829
829
  }
830
830
  if (offset !== 0) {
831
831
  var nextActiveIndex = getActiveIndex(activeIndex + offset, offset);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kdcloudjs/kdesign",
3
- "version": "1.7.24",
3
+ "version": "1.7.25",
4
4
  "description": "KDesign 金蝶前端react 组件库",
5
5
  "title": "kdesign",
6
6
  "keywords": [