@kdcloudjs/kdesign 1.7.37 → 1.7.40

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 (96) hide show
  1. package/CHANGELOG.md +55 -0
  2. package/README.md +2 -1
  3. package/dist/kdesign-complete.less +107 -11
  4. package/dist/kdesign.css +186 -5
  5. package/dist/kdesign.css.map +1 -1
  6. package/dist/kdesign.js +1485 -240
  7. package/dist/kdesign.js.map +1 -1
  8. package/dist/kdesign.min.css +3 -3
  9. package/dist/kdesign.min.js +13 -8
  10. package/dist/kdesign.min.js.map +1 -1
  11. package/es/alert/style/index.css +4 -2
  12. package/es/alert/style/index.less +3 -1
  13. package/es/cascader/cascader.js +8 -4
  14. package/es/cascader/style/index.css +5 -2
  15. package/es/cascader/style/index.less +4 -2
  16. package/es/config-provider/compDefaultProps.d.ts +9 -0
  17. package/es/config-provider/compDefaultProps.js +10 -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-number/inputNumber.js +20 -14
  32. package/es/input-number/useSelectionRange.d.ts +2 -1
  33. package/es/input-number/useSelectionRange.js +3 -2
  34. package/es/modal/modal.d.ts +1 -0
  35. package/es/modal/modal.js +31 -5
  36. package/es/modal/style/index.css +21 -0
  37. package/es/modal/style/index.less +25 -9
  38. package/es/qr-code/index.d.ts +3 -0
  39. package/es/qr-code/index.js +3 -0
  40. package/es/qr-code/qr-code.d.ts +42 -0
  41. package/es/qr-code/qr-code.js +80 -0
  42. package/es/qr-code/style/css.js +2 -0
  43. package/es/qr-code/style/index.css +154 -0
  44. package/es/qr-code/style/index.d.ts +2 -0
  45. package/es/qr-code/style/index.js +2 -0
  46. package/es/qr-code/style/index.less +42 -0
  47. package/es/qr-code/style/mixin.less +6 -0
  48. package/es/qr-code/style/token.less +24 -0
  49. package/es/tree/tree.js +2 -2
  50. package/es/tree/treeHooks.d.ts +1 -1
  51. package/es/tree/treeHooks.js +2 -2
  52. package/es/tree-select/tree-select.js +2 -2
  53. package/lib/alert/style/index.css +4 -2
  54. package/lib/alert/style/index.less +3 -1
  55. package/lib/cascader/cascader.js +8 -4
  56. package/lib/cascader/style/index.css +5 -2
  57. package/lib/cascader/style/index.less +4 -2
  58. package/lib/config-provider/compDefaultProps.d.ts +9 -0
  59. package/lib/config-provider/compDefaultProps.js +10 -1
  60. package/lib/date-picker/context.d.ts +4 -2
  61. package/lib/date-picker/date-picker.d.ts +9 -0
  62. package/lib/date-picker/date-picker.js +4 -2
  63. package/lib/date-picker/panel/month/month.js +14 -9
  64. package/lib/date-picker/panel/quarter/quarter.js +12 -4
  65. package/lib/date-picker/panel/time/time-column.d.ts +2 -0
  66. package/lib/date-picker/panel/time/time-column.js +14 -5
  67. package/lib/date-picker/panel/time/time.js +8 -4
  68. package/lib/date-picker/panel/week/week.js +20 -10
  69. package/lib/date-picker/panel/year/year.js +12 -4
  70. package/lib/date-picker/range-picker.js +11 -4
  71. package/lib/index.d.ts +1 -0
  72. package/lib/index.js +7 -0
  73. package/lib/input-number/inputNumber.js +20 -14
  74. package/lib/input-number/useSelectionRange.d.ts +2 -1
  75. package/lib/input-number/useSelectionRange.js +3 -2
  76. package/lib/modal/modal.d.ts +1 -0
  77. package/lib/modal/modal.js +31 -5
  78. package/lib/modal/style/index.css +21 -0
  79. package/lib/modal/style/index.less +25 -9
  80. package/lib/qr-code/index.d.ts +3 -0
  81. package/lib/qr-code/index.js +27 -0
  82. package/lib/qr-code/qr-code.d.ts +42 -0
  83. package/lib/qr-code/qr-code.js +96 -0
  84. package/lib/qr-code/style/css.js +4 -0
  85. package/lib/qr-code/style/index.css +154 -0
  86. package/lib/qr-code/style/index.d.ts +2 -0
  87. package/lib/qr-code/style/index.js +4 -0
  88. package/lib/qr-code/style/index.less +42 -0
  89. package/lib/qr-code/style/mixin.less +6 -0
  90. package/lib/qr-code/style/token.less +24 -0
  91. package/lib/style/components.less +1 -0
  92. package/lib/tree/tree.js +2 -2
  93. package/lib/tree/treeHooks.d.ts +1 -1
  94. package/lib/tree/treeHooks.js +2 -2
  95. package/lib/tree-select/tree-select.js +4 -4
  96. package/package.json +4 -2
@@ -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 */
@@ -70,6 +70,10 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
70
70
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
71
71
  inputValue = _useState2[0],
72
72
  setInputValue = _useState2[1];
73
+ var _useState3 = (0, _react.useState)(1),
74
+ _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
75
+ forceUpdate = _useState4[0],
76
+ setForceUpdate = _useState4[1];
73
77
  var inputStatus = (0, _react.useRef)({
74
78
  isHandleChange: false,
75
79
  inputFocused: false
@@ -121,10 +125,11 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
121
125
  var handleChange = function handleChange(event) {
122
126
  inputStatus.current.isHandleChange = true;
123
127
  var legalNumber = verifiValue(event.target.value);
128
+ updateSelectionRangePosition(event);
124
129
  if (legalNumber === false) {
130
+ setForceUpdate(forceUpdate + 1);
125
131
  return false;
126
132
  }
127
- updateSelectionRangePosition(event);
128
133
  value === undefined && setInputValue(legalNumber);
129
134
  onChange && onChange(handleEventAttachValue(event, numberMode ? Number(legalNumber) : legalNumber));
130
135
  };
@@ -163,23 +168,23 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
163
168
  if (decimalValueLength <= decimalLength && integerValueLength <= digitLength - decimalLength) {
164
169
  resultNumerical = numerical;
165
170
  } else if (integerValueLength > digitLength - decimalLength) {
166
- var _context;
167
- resultNumerical = (0, _concat.default)(_context = "".concat(sign)).call(_context, integerValue.substr(0, digitLength - decimalLength));
171
+ var _context, _context2;
172
+ resultNumerical = mustInPrecisionScope ? inputValue : (0, _concat.default)(_context = (0, _concat.default)(_context2 = "".concat(sign)).call(_context2, integerValue.substr(0, digitLength - decimalLength))).call(_context, decimalValue ? '.' + decimalValue : '');
168
173
  } else if (decimalValueLength > decimalLength) {
169
- var _context2, _context3;
170
- resultNumerical = (0, _concat.default)(_context2 = (0, _concat.default)(_context3 = "".concat(sign)).call(_context3, integerValue, ".")).call(_context2, decimalValue.substr(0, decimalLength));
174
+ var _context3, _context4;
175
+ resultNumerical = mustInPrecisionScope ? inputValue : (0, _concat.default)(_context3 = (0, _concat.default)(_context4 = "".concat(sign)).call(_context4, integerValue, ".")).call(_context3, decimalValue.substr(0, decimalLength));
171
176
  }
172
177
  } else if (typeof decimalLength !== 'number' && typeof digitLength === 'number') {
173
178
  if (integerValueLength >= digitLength) {
174
- var _context4;
175
- resultNumerical = (0, _concat.default)(_context4 = "".concat(sign)).call(_context4, integerValue.substr(0, digitLength));
179
+ var _context5;
180
+ resultNumerical = (0, _concat.default)(_context5 = "".concat(sign)).call(_context5, integerValue.substr(0, digitLength));
176
181
  } else {
177
- var _context5, _context6, _context7;
178
- resultNumerical = decimalValueLength ? (0, _concat.default)(_context5 = (0, _concat.default)(_context6 = "".concat(sign)).call(_context6, integerValue, ".")).call(_context5, decimalValue.substr(0, digitLength - integerValueLength)) : (0, _concat.default)(_context7 = "".concat(sign)).call(_context7, integerValue);
182
+ var _context6, _context7, _context8;
183
+ resultNumerical = decimalValueLength ? (0, _concat.default)(_context6 = (0, _concat.default)(_context7 = "".concat(sign)).call(_context7, integerValue, ".")).call(_context6, decimalValue.substr(0, digitLength - integerValueLength)) : (0, _concat.default)(_context8 = "".concat(sign)).call(_context8, integerValue);
179
184
  }
180
185
  } else if (typeof decimalLength === 'number' && typeof digitLength !== 'number') {
181
- var _context8, _context9, _context10;
182
- resultNumerical = decimalValueLength ? (0, _concat.default)(_context8 = (0, _concat.default)(_context9 = "".concat(sign)).call(_context9, integerValue, ".")).call(_context8, decimalValue.substr(0, decimalLength)) : (0, _concat.default)(_context10 = "".concat(sign)).call(_context10, integerValue);
186
+ var _context9, _context10, _context11;
187
+ resultNumerical = decimalValueLength ? (0, _concat.default)(_context9 = (0, _concat.default)(_context10 = "".concat(sign)).call(_context10, integerValue, ".")).call(_context9, decimalValue.substr(0, decimalLength)) : (0, _concat.default)(_context11 = "".concat(sign)).call(_context11, integerValue);
183
188
  } else {
184
189
  resultNumerical = numerical;
185
190
  }
@@ -209,13 +214,13 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
209
214
  });
210
215
  };
211
216
  var handleKeyDown = function handleKeyDown(event) {
212
- var _context11;
217
+ var _context12;
213
218
  onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
214
219
  if (!stepOption || props.disabled || props.readOnly) {
215
220
  return;
216
221
  }
217
222
  var keyCode = event.keyCode;
218
- if ((0, _includes.default)(_context11 = [38, 40]).call(_context11, keyCode)) {
223
+ if ((0, _includes.default)(_context12 = [38, 40]).call(_context12, keyCode)) {
219
224
  event.preventDefault();
220
225
  handleStepChang(keyCode === 38 ? 'plus' : 'minus');
221
226
  }
@@ -322,7 +327,8 @@ var InternalInputNumber = function InternalInputNumber(props, ref) {
322
327
  }, [inputValue, formatter]);
323
328
  var updateSelectionRangePosition = (0, _useSelectionRange.default)({
324
329
  inputElement: (_a = inputNumberRef.current) === null || _a === void 0 ? void 0 : _a.input,
325
- inputValue: displayedInputValue
330
+ inputValue: displayedInputValue,
331
+ forceUpdate: forceUpdate
326
332
  });
327
333
  return /*#__PURE__*/_react.default.createElement(_input.default, (0, _extends2.default)({}, others, {
328
334
  ref: inputNumberRef,
@@ -1,4 +1,5 @@
1
- export default function useSelectionRange({ inputElement, inputValue, }: {
1
+ export default function useSelectionRange({ inputElement, inputValue, forceUpdate, }: {
2
2
  inputElement: HTMLInputElement;
3
3
  inputValue: string;
4
+ forceUpdate: number;
4
5
  }): (event: any) => void;
@@ -9,7 +9,8 @@ var _react = require("react");
9
9
  var _isNumber = _interopRequireDefault(require("lodash/isNumber"));
10
10
  function useSelectionRange(_ref) {
11
11
  var inputElement = _ref.inputElement,
12
- inputValue = _ref.inputValue;
12
+ inputValue = _ref.inputValue,
13
+ forceUpdate = _ref.forceUpdate;
13
14
  var refSelectionPosition = (0, _react.useRef)();
14
15
  (0, _react.useLayoutEffect)(function () {
15
16
  var position = refSelectionPosition.current;
@@ -17,7 +18,7 @@ function useSelectionRange(_ref) {
17
18
  var start = Math.max(0, inputValue.length - position);
18
19
  inputElement.setSelectionRange(start, start);
19
20
  }
20
- }, [inputValue]);
21
+ }, [inputValue, forceUpdate]);
21
22
  return function (event) {
22
23
  var _event$target = event.target,
23
24
  end = _event$target.selectionEnd,
@@ -43,6 +43,7 @@ export interface IModalProps {
43
43
  width?: number;
44
44
  showline?: boolean;
45
45
  bounds?: DraggableBounds | string | false;
46
+ overroll?: boolean;
46
47
  onDragStart?: DraggableEventHandler;
47
48
  onDrag?: DraggableEventHandler;
48
49
  onDragStop?: DraggableEventHandler;
@@ -41,7 +41,7 @@ exports.ConfirmModalTypes = ConfirmModalTypes;
41
41
  var ModalTypes = (0, _type.tuple)('confirm', 'warning', 'error', 'normal');
42
42
  exports.ModalTypes = ModalTypes;
43
43
  var InternalModal = function InternalModal(props, ref) {
44
- var _classNames3, _classNames4, _context2, _context3;
44
+ var _classNames3, _classNames4, _context2, _context3, _context4;
45
45
  var _useContext = (0, _react.useContext)(_ConfigContext.default),
46
46
  getPrefixCls = _useContext.getPrefixCls,
47
47
  prefixCls = _useContext.prefixCls,
@@ -84,7 +84,8 @@ var InternalModal = function InternalModal(props, ref) {
84
84
  onDrag = modalProps.onDrag,
85
85
  onDragStop = modalProps.onDragStop,
86
86
  bounds = modalProps.bounds,
87
- others = __rest(modalProps, ["body", "bodyClassName", "bodyStyle", "cancelButtonProps", "cancelText", "className", "closable", "closeIcon", "destroyOnClose", "draggable", "focusTriggerAfterClose", "footer", "footerClassName", "footerStyle", "footerBtnOrder", "getContainer", "height", "keyboard", "mask", "maskClosable", "maskStyle", "maskClassName", "okButtonProps", "okText", "onCancel", "onOk", "prefixCls", "title", "titleIcon", "type", "visible", "width", "showline", "onDragStart", "onDrag", "onDragStop", "bounds"]);
87
+ overroll = modalProps.overroll,
88
+ others = __rest(modalProps, ["body", "bodyClassName", "bodyStyle", "cancelButtonProps", "cancelText", "className", "closable", "closeIcon", "destroyOnClose", "draggable", "focusTriggerAfterClose", "footer", "footerClassName", "footerStyle", "footerBtnOrder", "getContainer", "height", "keyboard", "mask", "maskClosable", "maskStyle", "maskClassName", "okButtonProps", "okText", "onCancel", "onOk", "prefixCls", "title", "titleIcon", "type", "visible", "width", "showline", "onDragStart", "onDrag", "onDragStop", "bounds", "overroll"]);
88
89
  var isForceController = visible !== undefined;
89
90
  var _useState = (0, _react.useState)(isForceController ? visible : true),
90
91
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
@@ -92,6 +93,7 @@ var InternalModal = function InternalModal(props, ref) {
92
93
  setInnerVisible = _useState2[1]; // 需要根据visible来判断,不能一开始为true再去设置false
93
94
  var previousActiveElement = (0, _react.useRef)(null);
94
95
  var innerRef = (0, _react.useRef)(null);
96
+ var wrapperRef = (0, _react.useRef)(null);
95
97
  var containerRef = ref || innerRef;
96
98
  var modalPrefixCls = getPrefixCls(prefixCls, 'modal', customPrefixcls);
97
99
  (0, _devwarning.default)(ModalTypes.indexOf(type) === -1, 'modal', "cannot found modal type '".concat(type, "'"));
@@ -199,11 +201,16 @@ var InternalModal = function InternalModal(props, ref) {
199
201
  proxyCloseModal(onCancel);
200
202
  }
201
203
  }, [proxyCloseModal, onCancel, maskClosable]);
204
+ var handleWrapperClick = function handleWrapperClick(e) {
205
+ if (wrapperRef.current === e.target) {
206
+ handleMaskClick();
207
+ }
208
+ };
202
209
  var isHidden = !destroyOnClose && !(isForceController ? visible : innerVisible);
203
210
  var modalClasses = (0, _classnames.default)(modalPrefixCls, className, (_classNames3 = {}, (0, _defineProperty2.default)(_classNames3, "".concat(modalPrefixCls, "-container"), true), (0, _defineProperty2.default)(_classNames3, "".concat(modalPrefixCls, "-container-hidden"), isHidden), (0, _defineProperty2.default)(_classNames3, "".concat(modalPrefixCls, "-container-show"), !isHidden), _classNames3));
204
211
  var headerClass = "".concat(modalPrefixCls, "-header");
205
212
  var container = /*#__PURE__*/_react.default.createElement("div", {
206
- className: (0, _classnames.default)((_classNames4 = {}, (0, _defineProperty2.default)(_classNames4, "".concat(modalPrefixCls, "-container-box"), true), (0, _defineProperty2.default)(_classNames4, "".concat(modalPrefixCls, "-has-container-box"), modalContainer), (0, _defineProperty2.default)(_classNames4, "".concat(modalPrefixCls, "-showline"), showline), _classNames4)),
213
+ className: (0, _classnames.default)((_classNames4 = {}, (0, _defineProperty2.default)(_classNames4, "".concat(modalPrefixCls, "-container-box"), true), (0, _defineProperty2.default)(_classNames4, "".concat(modalPrefixCls, "-has-container-box"), modalContainer && !overroll), (0, _defineProperty2.default)(_classNames4, "".concat(modalPrefixCls, "-showline"), showline), _classNames4)),
207
214
  style: {
208
215
  width: width,
209
216
  height: height
@@ -253,8 +260,18 @@ var InternalModal = function InternalModal(props, ref) {
253
260
  onClick: handleMaskClick,
254
261
  className: (0, _classnames.default)(maskClassName, (0, _defineProperty2.default)({}, "".concat(modalPrefixCls, "-mask"), true)),
255
262
  style: maskStyle
256
- }), /*#__PURE__*/_react.default.createElement(_reactDraggable.default, {
257
- defaultPosition: defaultPosition,
263
+ }), overroll ? /*#__PURE__*/_react.default.createElement("div", {
264
+ tabIndex: -1,
265
+ className: (0, _classnames.default)((0, _defineProperty2.default)({}, "".concat(modalPrefixCls, "-wrapper"), modalContainer && ((isForceController ? visible : innerVisible) || !destroyOnClose))),
266
+ ref: wrapperRef,
267
+ onClick: handleWrapperClick
268
+ }, /*#__PURE__*/_react.default.createElement("div", {
269
+ className: "".concat(modalPrefixCls, "-dialog")
270
+ }, /*#__PURE__*/_react.default.createElement(_reactDraggable.default, {
271
+ defaultPosition: {
272
+ x: 0,
273
+ y: 0
274
+ },
258
275
  handle: ".".concat(headerClass),
259
276
  disabled: !draggable,
260
277
  onStart: handleDragStart,
@@ -262,6 +279,15 @@ var InternalModal = function InternalModal(props, ref) {
262
279
  onStop: onDragStop,
263
280
  bounds: bounds,
264
281
  cancel: (0, _concat.default)(_context3 = ".".concat(modalPrefixCls, "-title-container, .")).call(_context3, modalPrefixCls, "-close-icon")
282
+ }, container))) : /*#__PURE__*/_react.default.createElement(_reactDraggable.default, {
283
+ defaultPosition: defaultPosition,
284
+ handle: ".".concat(headerClass),
285
+ disabled: !draggable,
286
+ onStart: handleDragStart,
287
+ onDrag: onDrag,
288
+ onStop: onDragStop,
289
+ bounds: bounds,
290
+ cancel: (0, _concat.default)(_context4 = ".".concat(modalPrefixCls, "-title-container, .")).call(_context4, modalPrefixCls, "-close-icon")
265
291
  }, container));
266
292
  var renderComp = ((isForceController ? visible : innerVisible) || !destroyOnClose) && comp;
267
293
  if (modalContainer && renderComp) return /*#__PURE__*/_reactDom.default.createPortal(renderComp, modalContainer);
@@ -252,6 +252,27 @@
252
252
  .kd-modal-margin-btn {
253
253
  margin-right: var(--kd-c-modal-footer-button-spacing, 12px);
254
254
  }
255
+ .kd-modal-wrapper {
256
+ position: fixed;
257
+ top: 0;
258
+ right: 0;
259
+ bottom: 0;
260
+ left: 0;
261
+ overflow: auto;
262
+ text-align: center;
263
+ }
264
+ .kd-modal-wrapper::before {
265
+ display: inline-block;
266
+ width: 0;
267
+ height: 100%;
268
+ vertical-align: middle;
269
+ content: '';
270
+ }
271
+ .kd-modal-dialog {
272
+ display: inline-block;
273
+ vertical-align: middle;
274
+ max-width: calc(100vw);
275
+ }
255
276
  .kd-modal-showline .kd-modal-header {
256
277
  border-bottom: var(--kd-c-modal-sizing-border, 1px) solid var(--kd-c-modal-color-border, var(--kd-g-color-border-strong-2, #d9d9d9));
257
278
  }
@@ -29,15 +29,13 @@
29
29
  }
30
30
 
31
31
  &-hidden {
32
- display: none
32
+ display: none;
33
33
  }
34
34
  }
35
35
  &-mask {
36
36
  .overlay(@modal-mask-color-background, 0);
37
37
  }
38
- // &-mask + &-container-box {
39
38
 
40
- // }
41
39
  &-has-container-box {
42
40
  position: fixed;
43
41
  left: 50%;
@@ -116,16 +114,34 @@
116
114
  color: @modal-footer-font-color;
117
115
  flex-shrink: 0;
118
116
  }
119
- // each(@modal-footer-type-set, {
120
- // .@{modal-prefix-cls}-@{key}-footer {
121
- // justify-content: @value;
122
- // }
123
- // });
124
117
  }
125
118
 
126
119
  &-margin-btn {
127
120
  margin-right: @modal-footer-button-spacing;
128
121
  }
122
+
123
+ &-wrapper {
124
+ position: fixed;
125
+ top: 0;
126
+ right: 0;
127
+ bottom: 0;
128
+ left: 0;
129
+ overflow: auto;
130
+ text-align: center;
131
+
132
+ &::before {
133
+ display: inline-block;
134
+ width: 0;
135
+ height: 100%;
136
+ vertical-align: middle;
137
+ content: '';
138
+ }
139
+ }
140
+ &-dialog {
141
+ display: inline-block;
142
+ vertical-align: middle;
143
+ max-width: calc(100vw);
144
+ }
129
145
  }
130
146
 
131
147
  .@{modal-prefix-cls}-showline {
@@ -135,4 +151,4 @@
135
151
  .@{modal-prefix-cls}-footer {
136
152
  border-top: @modal-border-width solid @modal-border-color;
137
153
  }
138
- }
154
+ }
@@ -0,0 +1,3 @@
1
+ import QRCode from './qr-code';
2
+ export * from './qr-code';
3
+ export default QRCode;
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+
3
+ var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
4
+ var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
5
+ var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
6
+ var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
7
+ Object.defineProperty(exports, "__esModule", {
8
+ value: true
9
+ });
10
+ var _exportNames = {};
11
+ exports.default = void 0;
12
+ var _qrCode = _interopRequireWildcard(require("./qr-code"));
13
+ _Object$keys(_qrCode).forEach(function (key) {
14
+ if (key === "default" || key === "__esModule") return;
15
+ if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
16
+ if (key in exports && exports[key] === _qrCode[key]) return;
17
+ Object.defineProperty(exports, key, {
18
+ enumerable: true,
19
+ get: function get() {
20
+ return _qrCode[key];
21
+ }
22
+ });
23
+ });
24
+ 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); }
25
+ 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; }
26
+ var _default = _qrCode.default;
27
+ exports.default = _default;
@@ -0,0 +1,42 @@
1
+ import React, { CSSProperties, FunctionComponentElement } from 'react';
2
+ export declare type QRPropsCanvas = QRProps & React.CanvasHTMLAttributes<HTMLCanvasElement>;
3
+ export declare type QRPropsSvg = QRProps & React.SVGAttributes<SVGSVGElement>;
4
+ export declare const QRCodeTypes: ["canvas", "svg"];
5
+ export declare type QRCodeType = typeof QRCodeTypes[number];
6
+ export declare const QRCodeStatus: ["active", "expired", "loading"];
7
+ export declare type QRCodeStatus = typeof QRCodeStatus[number];
8
+ export declare const QRCodeErrorLevels: ["L", "M", "Q", "H"];
9
+ export declare type QRCodeErrorLevel = typeof QRCodeErrorLevels[number];
10
+ interface ImageSettings {
11
+ src: string;
12
+ height: number;
13
+ width: number;
14
+ excavate: boolean;
15
+ x?: number;
16
+ y?: number;
17
+ }
18
+ export interface QRProps {
19
+ value: string;
20
+ type?: QRCodeType;
21
+ size?: number;
22
+ style?: CSSProperties;
23
+ color?: string;
24
+ bgColor?: string;
25
+ bordered?: boolean;
26
+ imageSettings?: ImageSettings;
27
+ }
28
+ export interface QRCodeProps extends QRProps {
29
+ className?: string;
30
+ prefixCls?: string;
31
+ icon?: string;
32
+ iconSize?: number;
33
+ status?: QRCodeStatus;
34
+ errorLevel?: QRCodeErrorLevel;
35
+ children?: React.ReactNode;
36
+ onRefresh?: () => void;
37
+ }
38
+ declare const QRCode: {
39
+ (props: QRCodeProps): FunctionComponentElement<QRCodeProps>;
40
+ displayName: string;
41
+ };
42
+ export default QRCode;
@@ -0,0 +1,96 @@
1
+ "use strict";
2
+
3
+ var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
4
+ var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
5
+ var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
6
+ var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
7
+ Object.defineProperty(exports, "__esModule", {
8
+ value: true
9
+ });
10
+ exports.default = exports.QRCodeTypes = exports.QRCodeStatus = exports.QRCodeErrorLevels = void 0;
11
+ var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
12
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
13
+ var _react = _interopRequireWildcard(require("react"));
14
+ var _classnames = _interopRequireDefault(require("classnames"));
15
+ var _ConfigContext = _interopRequireDefault(require("../config-provider/ConfigContext"));
16
+ var _utils = require("../_utils");
17
+ var _qrcode = require("qrcode.react");
18
+ var _spin = _interopRequireDefault(require("../spin"));
19
+ var _button = _interopRequireDefault(require("../button"));
20
+ var _icon = _interopRequireDefault(require("../icon"));
21
+ var _devwarning = _interopRequireDefault(require("../_utils/devwarning"));
22
+ var _type = require("../_utils/type");
23
+ 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); }
24
+ 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; }
25
+ var QRCodeTypes = (0, _type.tuple)('canvas', 'svg');
26
+ exports.QRCodeTypes = QRCodeTypes;
27
+ var QRCodeStatus = (0, _type.tuple)('active', 'expired', 'loading');
28
+ exports.QRCodeStatus = QRCodeStatus;
29
+ var QRCodeErrorLevels = (0, _type.tuple)('L', 'M', 'Q', 'H');
30
+ exports.QRCodeErrorLevels = QRCodeErrorLevels;
31
+ var QRCode = function QRCode(props) {
32
+ var _useContext = (0, _react.useContext)(_ConfigContext.default),
33
+ getPrefixCls = _useContext.getPrefixCls,
34
+ prefixCls = _useContext.prefixCls,
35
+ userDefaultProps = _useContext.compDefaultProps;
36
+ var qrCodeProps = (0, _utils.getCompProps)('QRCode', userDefaultProps, props);
37
+ var value = qrCodeProps.value,
38
+ size = qrCodeProps.size,
39
+ status = qrCodeProps.status,
40
+ style = qrCodeProps.style,
41
+ type = qrCodeProps.type,
42
+ errorLevel = qrCodeProps.errorLevel,
43
+ color = qrCodeProps.color,
44
+ onRefresh = qrCodeProps.onRefresh,
45
+ icon = qrCodeProps.icon,
46
+ _qrCodeProps$iconSize = qrCodeProps.iconSize,
47
+ iconSize = _qrCodeProps$iconSize === void 0 ? 24 : _qrCodeProps$iconSize,
48
+ bgColor = qrCodeProps.bgColor,
49
+ _qrCodeProps$bordered = qrCodeProps.bordered,
50
+ bordered = _qrCodeProps$bordered === void 0 ? true : _qrCodeProps$bordered;
51
+ var className = qrCodeProps.className,
52
+ customPrefixcls = qrCodeProps.prefixCls;
53
+ var qrCodePrefixCls = getPrefixCls(prefixCls, 'qrcode', customPrefixcls);
54
+ var qrCodeClass = (0, _classnames.default)(qrCodePrefixCls, className, (0, _defineProperty2.default)({}, "".concat(qrCodePrefixCls, "-borderless"), !bordered));
55
+ var gap = 8;
56
+ var containerSize = size + gap * 2 + 2;
57
+ (0, _devwarning.default)(!value === false, 'QRCode', 'need to receive `value` props');
58
+ (0, _devwarning.default)(icon && errorLevel === 'L', 'QRCode', 'ErrorLevel `L` is not recommended to be used with `icon`, for scanning result would be affected by low level.');
59
+ var imageSettings = {
60
+ src: icon,
61
+ x: undefined,
62
+ y: undefined,
63
+ height: iconSize,
64
+ width: iconSize,
65
+ excavate: true
66
+ };
67
+ var codeProps = {
68
+ value: value,
69
+ size: size,
70
+ level: errorLevel,
71
+ fgColor: color,
72
+ imageSettings: icon ? imageSettings : undefined
73
+ };
74
+ return /*#__PURE__*/_react.default.createElement("div", {
75
+ className: qrCodeClass,
76
+ style: (0, _extends2.default)((0, _extends2.default)({}, style), {
77
+ width: "".concat(containerSize, "px"),
78
+ height: "".concat(containerSize, "px"),
79
+ backgroundColor: bgColor
80
+ })
81
+ }, status !== 'active' && /*#__PURE__*/_react.default.createElement("div", {
82
+ className: "".concat(qrCodePrefixCls, "-mask")
83
+ }, status === 'loading' && /*#__PURE__*/_react.default.createElement(_spin.default, null), status === 'expired' && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("p", {
84
+ className: "".concat(qrCodePrefixCls, "-expired")
85
+ }, "\u4E8C\u7EF4\u7801\u8FC7\u671F"), onRefresh && /*#__PURE__*/_react.default.createElement(_button.default, {
86
+ icon: /*#__PURE__*/_react.default.createElement(_icon.default, {
87
+ type: "refresh"
88
+ }),
89
+ type: "text",
90
+ onClick: onRefresh,
91
+ size: "middle"
92
+ }, "\u70B9\u51FB\u5237\u65B0"))), type === 'canvas' ? /*#__PURE__*/_react.default.createElement(_qrcode.QRCodeCanvas, (0, _extends2.default)({}, codeProps)) : /*#__PURE__*/_react.default.createElement(_qrcode.QRCodeSVG, (0, _extends2.default)({}, codeProps)));
93
+ };
94
+ QRCode.displayName = 'QRCode';
95
+ var _default = QRCode;
96
+ exports.default = _default;
@@ -0,0 +1,4 @@
1
+ "use strict";
2
+
3
+ require("../../style/index.css");
4
+ require("./index.css");