@kdcloudjs/kdesign 1.7.39 → 1.7.41

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 (103) hide show
  1. package/CHANGELOG.md +35 -0
  2. package/dist/kdesign-complete.less +182 -14
  3. package/dist/kdesign.css +249 -3
  4. package/dist/kdesign.css.map +1 -1
  5. package/dist/kdesign.js +1664 -129
  6. package/dist/kdesign.js.map +1 -1
  7. package/dist/kdesign.min.css +3 -3
  8. package/dist/kdesign.min.js +14 -9
  9. package/dist/kdesign.min.js.map +1 -1
  10. package/es/alert/style/index.css +4 -2
  11. package/es/alert/style/index.less +3 -1
  12. package/es/button/index.d.ts +2 -1
  13. package/es/carousel/index.d.ts +2 -2
  14. package/es/city-picker/index.d.ts +2 -0
  15. package/es/collapse/index.d.ts +2 -2
  16. package/es/config-provider/compDefaultProps.d.ts +10 -0
  17. package/es/config-provider/compDefaultProps.js +11 -1
  18. package/es/date-picker/context.d.ts +4 -2
  19. package/es/date-picker/date-picker.d.ts +9 -0
  20. package/es/date-picker/date-picker.js +4 -2
  21. package/es/date-picker/panel/month/month.js +14 -9
  22. package/es/date-picker/panel/quarter/quarter.js +12 -4
  23. package/es/date-picker/panel/time/time-column.d.ts +2 -0
  24. package/es/date-picker/panel/time/time-column.js +14 -5
  25. package/es/date-picker/panel/time/time.js +8 -4
  26. package/es/date-picker/panel/week/week.js +20 -10
  27. package/es/date-picker/panel/year/year.js +12 -4
  28. package/es/date-picker/range-picker.js +11 -4
  29. package/es/index.d.ts +1 -0
  30. package/es/index.js +2 -1
  31. package/es/input/TextArea.js +16 -8
  32. package/es/input/style/index.css +3 -0
  33. package/es/input/style/index.less +9 -5
  34. package/es/modal/modal.d.ts +5 -0
  35. package/es/modal/modal.js +242 -15
  36. package/es/modal/style/index.css +86 -0
  37. package/es/modal/style/index.less +95 -9
  38. package/es/notification-base/notice.js +6 -1
  39. package/es/qr-code/index.d.ts +3 -0
  40. package/es/qr-code/index.js +3 -0
  41. package/es/qr-code/qr-code.d.ts +42 -0
  42. package/es/qr-code/qr-code.js +80 -0
  43. package/es/qr-code/style/css.js +2 -0
  44. package/es/qr-code/style/index.css +154 -0
  45. package/es/qr-code/style/index.d.ts +2 -0
  46. package/es/qr-code/style/index.js +2 -0
  47. package/es/qr-code/style/index.less +42 -0
  48. package/es/qr-code/style/mixin.less +6 -0
  49. package/es/qr-code/style/token.less +24 -0
  50. package/es/search/search-panel.d.ts +1 -1
  51. package/es/select/index.d.ts +1 -0
  52. package/es/select/index.js +1 -0
  53. package/es/tree/tree.js +2 -2
  54. package/es/tree/treeHooks.d.ts +1 -1
  55. package/es/tree/treeHooks.js +2 -2
  56. package/lib/alert/style/index.css +4 -2
  57. package/lib/alert/style/index.less +3 -1
  58. package/lib/button/index.d.ts +2 -1
  59. package/lib/carousel/index.d.ts +2 -2
  60. package/lib/city-picker/index.d.ts +2 -0
  61. package/lib/collapse/index.d.ts +2 -2
  62. package/lib/config-provider/compDefaultProps.d.ts +10 -0
  63. package/lib/config-provider/compDefaultProps.js +11 -1
  64. package/lib/date-picker/context.d.ts +4 -2
  65. package/lib/date-picker/date-picker.d.ts +9 -0
  66. package/lib/date-picker/date-picker.js +4 -2
  67. package/lib/date-picker/panel/month/month.js +14 -9
  68. package/lib/date-picker/panel/quarter/quarter.js +12 -4
  69. package/lib/date-picker/panel/time/time-column.d.ts +2 -0
  70. package/lib/date-picker/panel/time/time-column.js +14 -5
  71. package/lib/date-picker/panel/time/time.js +8 -4
  72. package/lib/date-picker/panel/week/week.js +20 -10
  73. package/lib/date-picker/panel/year/year.js +12 -4
  74. package/lib/date-picker/range-picker.js +11 -4
  75. package/lib/index.d.ts +1 -0
  76. package/lib/index.js +7 -0
  77. package/lib/input/TextArea.js +16 -8
  78. package/lib/input/style/index.css +3 -0
  79. package/lib/input/style/index.less +9 -5
  80. package/lib/modal/modal.d.ts +5 -0
  81. package/lib/modal/modal.js +242 -15
  82. package/lib/modal/style/index.css +86 -0
  83. package/lib/modal/style/index.less +95 -9
  84. package/lib/notification-base/notice.js +6 -1
  85. package/lib/qr-code/index.d.ts +3 -0
  86. package/lib/qr-code/index.js +27 -0
  87. package/lib/qr-code/qr-code.d.ts +42 -0
  88. package/lib/qr-code/qr-code.js +96 -0
  89. package/lib/qr-code/style/css.js +4 -0
  90. package/lib/qr-code/style/index.css +154 -0
  91. package/lib/qr-code/style/index.d.ts +2 -0
  92. package/lib/qr-code/style/index.js +4 -0
  93. package/lib/qr-code/style/index.less +42 -0
  94. package/lib/qr-code/style/mixin.less +6 -0
  95. package/lib/qr-code/style/token.less +24 -0
  96. package/lib/search/search-panel.d.ts +1 -1
  97. package/lib/select/index.d.ts +1 -0
  98. package/lib/select/index.js +14 -0
  99. package/lib/style/components.less +1 -0
  100. package/lib/tree/tree.js +2 -2
  101. package/lib/tree/treeHooks.d.ts +1 -1
  102. package/lib/tree/treeHooks.js +2 -2
  103. package/package.json +11 -3
@@ -29,7 +29,9 @@ function Quarter(props) {
29
29
  onDateMouseLeave = context.onDateMouseLeave,
30
30
  rangeValue = context.rangeValue,
31
31
  panelPosition = context.panelPosition,
32
- hoverRangedValue = context.hoverRangedValue;
32
+ hoverRangedValue = context.hoverRangedValue,
33
+ cellRender = context.cellRender,
34
+ range = context.range;
33
35
  var disabledDate = props.disabledDate;
34
36
  var _dateValue;
35
37
  if (panelPosition) {
@@ -108,12 +110,18 @@ function Quarter(props) {
108
110
  }
109
111
  };
110
112
  var quarterCls = (0, _classnames3.default)("".concat(prefixCls, "-quarter-item"), (0, _defineProperty2.default)({}, "".concat(prefixCls, "-quarter-item-disabled"), disabledDate && disabledDate(quarter)), getRangeCls(quarter));
113
+ var originNode = /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
114
+ className: getQuarterClassNames(i + 1)
115
+ }, _props), n);
111
116
  return /*#__PURE__*/_react.default.createElement("div", {
112
117
  key: n,
113
118
  className: quarterCls
114
- }, /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
115
- className: getQuarterClassNames(i + 1)
116
- }, _props), n));
119
+ }, typeof cellRender === 'function' ? cellRender(i + 1, {
120
+ originNode: originNode,
121
+ panelType: 'quarter',
122
+ range: range,
123
+ date: quarter
124
+ }) || originNode : originNode);
117
125
  });
118
126
  };
119
127
  var quarterCls = (0, _classnames3.default)("".concat(prefixCls, "-quarter"));
@@ -1,5 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { DateType } from '../../interface';
3
+ import { CellRenderSubType } from '../../date-picker';
3
4
  export interface Unit {
4
5
  label: React.ReactText;
5
6
  value: number;
@@ -12,6 +13,7 @@ export interface TimeUnitColumnProps {
12
13
  selectValue?: DateType;
13
14
  hideDisabledOptions?: boolean;
14
15
  onSelect?: (value: number) => void;
16
+ subType?: CellRenderSubType;
15
17
  }
16
18
  declare function TimeUnitColumn(props: TimeUnitColumnProps): JSX.Element;
17
19
  export default TimeUnitColumn;
@@ -23,10 +23,13 @@ function TimeUnitColumn(props) {
23
23
  onSelect = props.onSelect,
24
24
  value = props.value,
25
25
  hideDisabledOptions = props.hideDisabledOptions,
26
- selectValue = props.selectValue;
26
+ selectValue = props.selectValue,
27
+ subType = props.subType;
27
28
  var cellPrefixCls = "".concat(prefixCls, "-cell");
28
29
  var _React$useContext = React.useContext(_context.default),
29
- open = _React$useContext.open;
30
+ open = _React$useContext.open,
31
+ cellRender = _React$useContext.cellRender,
32
+ range = _React$useContext.range;
30
33
  var ulRef = (0, React.useRef)(null);
31
34
  var liRefs = (0, React.useRef)(new _map.default());
32
35
  var scrollRef = (0, React.useRef)();
@@ -63,6 +66,9 @@ function TimeUnitColumn(props) {
63
66
  if (hideDisabledOptions && unit.disabled) {
64
67
  return null;
65
68
  }
69
+ var originNode = /*#__PURE__*/React.createElement("div", {
70
+ className: "".concat(cellPrefixCls, "-inner")
71
+ }, unit.label);
66
72
  return /*#__PURE__*/React.createElement("div", {
67
73
  key: unit.value,
68
74
  ref: function ref(element) {
@@ -75,9 +81,12 @@ function TimeUnitColumn(props) {
75
81
  }
76
82
  onSelect(unit.value);
77
83
  }
78
- }, /*#__PURE__*/React.createElement("div", {
79
- className: "".concat(cellPrefixCls, "-inner")
80
- }, unit.label));
84
+ }, typeof cellRender === 'function' ? cellRender(unit.value, {
85
+ originNode: originNode,
86
+ panelType: 'time',
87
+ subType: subType,
88
+ range: range
89
+ }) || originNode : originNode);
81
90
  }));
82
91
  }
83
92
  var _default = TimeUnitColumn;
@@ -177,7 +177,8 @@ function TimePanel(props) {
177
177
  }
178
178
  }
179
179
  addColumnNode(showHour, /*#__PURE__*/React.createElement(_timeColumn.default, {
180
- key: "hour"
180
+ key: "hour",
181
+ subType: 'hour'
181
182
  }), hour, hours, function (num) {
182
183
  var time = setTime(isPM, num, minute, second);
183
184
  if (time) {
@@ -185,7 +186,8 @@ function TimePanel(props) {
185
186
  }
186
187
  });
187
188
  addColumnNode(showMinute, /*#__PURE__*/React.createElement(_timeColumn.default, {
188
- key: "minute"
189
+ key: "minute",
190
+ subType: 'minute'
189
191
  }), minute, minutes, function (num) {
190
192
  var time = setTime(isPM, hour, num, second);
191
193
  if (time) {
@@ -193,7 +195,8 @@ function TimePanel(props) {
193
195
  }
194
196
  });
195
197
  addColumnNode(showSecond, /*#__PURE__*/React.createElement(_timeColumn.default, {
196
- key: "second"
198
+ key: "second",
199
+ subType: 'second'
197
200
  }), second, seconds, function (num) {
198
201
  var time = setTime(isPM, hour, minute, num);
199
202
  if (time) {
@@ -205,7 +208,8 @@ function TimePanel(props) {
205
208
  PMIndex = isPM ? 1 : 0;
206
209
  }
207
210
  addColumnNode(use12Hours === true, /*#__PURE__*/React.createElement(_timeColumn.default, {
208
- key: "12hours"
211
+ key: "12hours",
212
+ subType: '12Hours'
209
213
  }), PMIndex, [{
210
214
  label: 'AM',
211
215
  value: 0,
@@ -47,7 +47,9 @@ function Week(props) {
47
47
  disabledTimePanel = context.disabledTimePanel,
48
48
  onSelect = context.onSelect,
49
49
  onDateMouseEnter = context.onDateMouseEnter,
50
- onDateMouseLeave = context.onDateMouseLeave;
50
+ onDateMouseLeave = context.onDateMouseLeave,
51
+ cellRender = context.cellRender,
52
+ range = context.range;
51
53
  var showWeekNumber = props.showWeekNumber,
52
54
  day = props.day,
53
55
  picker = props.picker,
@@ -188,8 +190,6 @@ function Week(props) {
188
190
  } else {
189
191
  now = dateValue || viewDate;
190
192
  }
191
- // if(hours) {
192
- // }
193
193
  var dayTime = (0, _dateFns.setTime)(day, {
194
194
  hour: (0, _dateFns2.getHours)(now),
195
195
  minute: (0, _dateFns2.getMinutes)(now),
@@ -212,18 +212,28 @@ function Week(props) {
212
212
  }
213
213
  }
214
214
  };
215
- // console.log('disabledDate', disabledDate)
215
+ var originNode = /*#__PURE__*/_react.default.createElement("div", {
216
+ className: getDayClassNames(day)
217
+ }, date);
216
218
  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
217
219
  key: day.valueOf(),
218
220
  className: (0, _classnames5.default)("".concat(prefixCls, "-calendar-item"), (_classnames3 = {}, (0, _defineProperty2.default)(_classnames3, "".concat(prefixCls, "-calendar-item-disabled"), disabledDate && disabledDate(day)), (0, _defineProperty2.default)(_classnames3, "".concat(prefixCls, "-calendar-current"), currentMonth === (0, _dateFns.getMonth)(day)), _classnames3), getRangeCls(day))
219
- }, _props), /*#__PURE__*/_react.default.createElement("div", {
220
- className: getDayClassNames(day)
221
- }, date));
221
+ }, _props), typeof cellRender === 'function' ? cellRender(day, {
222
+ originNode: originNode,
223
+ panelType: 'date',
224
+ range: range,
225
+ date: day
226
+ }) || originNode : originNode);
222
227
  }));
223
- var calenderLineCls = (0, _classnames5.default)((_classnames4 = {}, (0, _defineProperty2.default)(_classnames4, "".concat(prefixCls, "-calendar-line"), picker !== 'week'), (0, _defineProperty2.default)(_classnames4, "".concat(prefixCls, "-calendar-week-line"), picker === 'week'), (0, _defineProperty2.default)(_classnames4, "".concat(prefixCls, "-calendar-week-selected"), picker === 'week' && getWeekSelected(startOfWeek)), _classnames4));
224
- return /*#__PURE__*/_react.default.createElement("div", {
225
- className: calenderLineCls
228
+ var originNode = /*#__PURE__*/_react.default.createElement("div", {
229
+ className: (0, _classnames5.default)((_classnames4 = {}, (0, _defineProperty2.default)(_classnames4, "".concat(prefixCls, "-calendar-line"), picker !== 'week'), (0, _defineProperty2.default)(_classnames4, "".concat(prefixCls, "-calendar-week-line"), picker === 'week'), (0, _defineProperty2.default)(_classnames4, "".concat(prefixCls, "-calendar-week-selected"), picker === 'week' && getWeekSelected(startOfWeek)), _classnames4))
226
230
  }, week);
231
+ return typeof cellRender === 'function' ? cellRender(weekNumber, {
232
+ originNode: originNode,
233
+ panelType: 'week',
234
+ range: range,
235
+ date: startOfWeek
236
+ }) || originNode : originNode;
227
237
  };
228
238
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, renderDays());
229
239
  }
@@ -30,7 +30,9 @@ function Year(props) {
30
30
  panelPosition = context.panelPosition,
31
31
  hoverRangedValue = context.hoverRangedValue,
32
32
  innerPicker = context.innerPicker,
33
- setInnerPicker = context.setInnerPicker;
33
+ setInnerPicker = context.setInnerPicker,
34
+ cellRender = context.cellRender,
35
+ range = context.range;
34
36
  var yearItemNumber = props.yearItemNumber,
35
37
  disabledDate = props.disabledDate,
36
38
  _props$picker = props.picker,
@@ -126,12 +128,18 @@ function Year(props) {
126
128
  }
127
129
  }
128
130
  };
131
+ var originNode = /*#__PURE__*/_react.default.createElement("span", {
132
+ className: getYearClassNames(y)
133
+ }, y);
129
134
  yearsList.push( /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
130
135
  className: (0, _classnames3.default)("".concat(prefixCls, "-year-item"), (0, _defineProperty2.default)({}, "".concat(prefixCls, "-year-item-disabled"), disabledDate && disabledDate(year)), getRangeCls(year)),
131
136
  key: y
132
- }, _props), /*#__PURE__*/_react.default.createElement("span", {
133
- className: getYearClassNames(y)
134
- }, y)));
137
+ }, _props), typeof cellRender === 'function' ? cellRender(y, {
138
+ originNode: originNode,
139
+ panelType: 'year',
140
+ range: range,
141
+ date: year
142
+ }) || originNode : originNode));
135
143
  };
136
144
  for (var y = startPeriod; y <= endPeriod; y++) {
137
145
  _loop();
@@ -122,7 +122,8 @@ var InternalRangePicker = function InternalRangePicker(props, ref) {
122
122
  onBlur = datePickerProps.onBlur,
123
123
  _onOk = datePickerProps.onOk,
124
124
  getPopupContainer = datePickerProps.getPopupContainer,
125
- status = datePickerProps.status;
125
+ status = datePickerProps.status,
126
+ cellRender = datePickerProps.cellRender;
126
127
  var needConfirmButton = picker === 'date' && !!showTime || picker === 'time';
127
128
  var datePickerLang = (0, _extends2.default)({}, globalLocale.getCompLangMsg({
128
129
  componentName: 'DatePicker'
@@ -532,7 +533,9 @@ var InternalRangePicker = function InternalRangePicker(props, ref) {
532
533
  onDateMouseEnter: onDateMouseEnter,
533
534
  onDateMouseLeave: onDateMouseLeave,
534
535
  innerPicker: innerPicker,
535
- setInnerPicker: setInnerPicker
536
+ setInnerPicker: setInnerPicker,
537
+ cellRender: cellRender,
538
+ range: mergedActivePickerIndex === 0 ? 'start' : 'end'
536
539
  }
537
540
  }, renderPanel());
538
541
  var rightPanel = /*#__PURE__*/_react.default.createElement(_context.default.Provider, {
@@ -549,7 +552,9 @@ var InternalRangePicker = function InternalRangePicker(props, ref) {
549
552
  onDateMouseEnter: onDateMouseEnter,
550
553
  onDateMouseLeave: onDateMouseLeave,
551
554
  innerPicker: innerPicker,
552
- setInnerPicker: setInnerPicker
555
+ setInnerPicker: setInnerPicker,
556
+ cellRender: cellRender,
557
+ range: mergedActivePickerIndex === 0 ? 'start' : 'end'
553
558
  }
554
559
  }, renderPanel());
555
560
  panels = /*#__PURE__*/_react.default.createElement("div", {
@@ -576,7 +581,9 @@ var InternalRangePicker = function InternalRangePicker(props, ref) {
576
581
  onDateMouseEnter: onDateMouseEnter,
577
582
  onDateMouseLeave: onDateMouseLeave,
578
583
  innerPicker: innerPicker,
579
- setInnerPicker: setInnerPicker
584
+ setInnerPicker: setInnerPicker,
585
+ cellRender: cellRender,
586
+ range: mergedActivePickerIndex === 0 ? 'start' : 'end'
580
587
  }
581
588
  }, renderPanel());
582
589
  }
package/lib/index.d.ts CHANGED
@@ -56,3 +56,4 @@ export { default as Link } from './link';
56
56
  export { default as TreeSelect } from './tree-select';
57
57
  export { default as ColorPicker } from './color-picker';
58
58
  export { default as Clipboard } from './clipboard';
59
+ export { default as QRCode } from './qr-code';
package/lib/index.js CHANGED
@@ -223,6 +223,12 @@ Object.defineProperty(exports, "Progress", {
223
223
  return _progress.default;
224
224
  }
225
225
  });
226
+ Object.defineProperty(exports, "QRCode", {
227
+ enumerable: true,
228
+ get: function get() {
229
+ return _qrCode.default;
230
+ }
231
+ });
226
232
  Object.defineProperty(exports, "Radio", {
227
233
  enumerable: true,
228
234
  get: function get() {
@@ -437,6 +443,7 @@ var _link = _interopRequireDefault(require("./link"));
437
443
  var _treeSelect = _interopRequireDefault(require("./tree-select"));
438
444
  var _colorPicker = _interopRequireDefault(require("./color-picker"));
439
445
  var _clipboard = _interopRequireDefault(require("./clipboard"));
446
+ var _qrCode = _interopRequireDefault(require("./qr-code"));
440
447
  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); }
441
448
  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; }
442
449
  /* @remove-on-es-build-begin */
@@ -82,6 +82,10 @@ var InternalTextarea = function InternalTextarea(props, ref) {
82
82
  _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
83
83
  showNumberMark = _useState6[0],
84
84
  setShowNumberMark = _useState6[1];
85
+ var _useState7 = (0, _react.useState)(false),
86
+ _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
87
+ numberMarkError = _useState8[0],
88
+ setNumberMarkError = _useState8[1];
85
89
  var resizeTextarea = (0, _react.useCallback)(function () {
86
90
  if (!autoSize || !textareaRef.current) {
87
91
  return;
@@ -129,21 +133,25 @@ var InternalTextarea = function InternalTextarea(props, ref) {
129
133
  onChange && onChange(event);
130
134
  };
131
135
  var renderNumberMark = function renderNumberMark() {
132
- var enteredLength = value ? value.length : 0;
133
- if (enteredLength >= maxLength) {
134
- enteredLength = maxLength;
135
- }
136
- if (count && showNumberMark && !disabled && maxLength !== '' && maxLength >= 0) {
137
- var countClass = (0, _classnames.default)("".concat(textAreaPrefixCls, "-textarea-mark"), (0, _defineProperty2.default)({}, "".concat(textAreaPrefixCls, "-textarea-mark-inner"), countPosition === 'inner'));
136
+ if (count && (showNumberMark || numberMarkError) && !disabled && maxLength !== '' && maxLength >= 0) {
137
+ var _classNames;
138
+ var countClass = (0, _classnames.default)("".concat(textAreaPrefixCls, "-textarea-mark"), (_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(textAreaPrefixCls, "-textarea-mark-inner"), countPosition === 'inner'), (0, _defineProperty2.default)(_classNames, "".concat(textAreaPrefixCls, "-textarea-mark-error"), numberMarkError), _classNames));
138
139
  return /*#__PURE__*/_react.default.createElement("div", {
139
140
  className: countClass
140
- }, enteredLength, "/", maxLength);
141
+ }, value ? value.length : 0, "/", maxLength);
141
142
  }
142
143
  return null;
143
144
  };
144
145
  (0, _react.useEffect)(function () {
145
146
  resizeTextarea();
146
147
  }, [value, resizeTextarea]);
148
+ (0, _react.useEffect)(function () {
149
+ if (value && maxLength && value.length > maxLength) {
150
+ setNumberMarkError(true);
151
+ } else {
152
+ setNumberMarkError(false);
153
+ }
154
+ }, [value]);
147
155
  (0, _react.useEffect)(function () {
148
156
  if (propsValue !== undefined) {
149
157
  setValue(propsValue);
@@ -185,7 +193,7 @@ var InternalTextarea = function InternalTextarea(props, ref) {
185
193
  ref: textareaRef,
186
194
  disabled: disabled,
187
195
  style: (0, _extends2.default)({}, textareaStyles, hadCount || !!allowClear ? otherStyles : style),
188
- className: (0, _classnames.default)("".concat(prefixCls, "-textarea"), (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, (0, _concat.default)(_context = "".concat(prefixCls, "-size-")).call(_context, size), size), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-borderless"), borderType === 'none'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-underline"), borderType === 'underline'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-no-resize"), canResize !== true), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-allowClear-spacing"), !!allowClear), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-error"), status === 'error'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-disabled"), disabled), _classNames2), (0, _defineProperty2.default)({}, className, className && !allowClear && !hadCount)),
196
+ className: (0, _classnames.default)("".concat(prefixCls, "-textarea"), (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, (0, _concat.default)(_context = "".concat(prefixCls, "-size-")).call(_context, size), size), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-borderless"), borderType === 'none'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-underline"), borderType === 'underline'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-no-resize"), canResize !== true), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-allowClear-spacing"), !!allowClear), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-error"), status === 'error' || numberMarkError), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-disabled"), disabled), _classNames2), (0, _defineProperty2.default)({}, className, className && !allowClear && !hadCount)),
189
197
  onChange: handleChange,
190
198
  onFocus: !disabled ? handleFocus : undefined,
191
199
  onBlur: !disabled ? handleBlur : undefined,
@@ -215,6 +215,9 @@ textarea {
215
215
  bottom: 5px;
216
216
  right: 8px;
217
217
  }
218
+ .kd-input-textarea-mark-error {
219
+ color: var(--kd-c-input-color-error, var(--kd-g-color-error, #fb2323));
220
+ }
218
221
  .kd-input-no-resize {
219
222
  resize: none;
220
223
  }
@@ -43,12 +43,16 @@ textarea {
43
43
  font-size: @input-small-font-size-inner;
44
44
  line-height: 18px;
45
45
  background-color: #fff;
46
- }
47
46
 
48
- &-mark-inner {
49
- top: auto;
50
- bottom: 5px;
51
- right: 8px;
47
+ &-inner {
48
+ top: auto;
49
+ bottom: 5px;
50
+ right: 8px;
51
+ }
52
+
53
+ &-error {
54
+ color: @input-error-color;
55
+ }
52
56
  }
53
57
  }
54
58
 
@@ -43,6 +43,11 @@ export interface IModalProps {
43
43
  width?: number;
44
44
  showline?: boolean;
45
45
  bounds?: DraggableBounds | string | false;
46
+ overroll?: boolean;
47
+ resizable?: boolean;
48
+ onResizeStart?: (event: MouseEvent) => void;
49
+ onResize?: (event: MouseEvent) => void;
50
+ onResizeStop?: (event: MouseEvent) => void;
46
51
  onDragStart?: DraggableEventHandler;
47
52
  onDrag?: DraggableEventHandler;
48
53
  onDragStop?: DraggableEventHandler;