@progress/kendo-react-inputs 5.8.0 → 5.8.1-dev.202210141030

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 (7) hide show
  1. package/dist/cdn/js/kendo-react-inputs.js +1 -1
  2. package/dist/es/package-metadata.js +1 -1
  3. package/dist/es/signature/Signature.js +21 -10
  4. package/dist/npm/package-metadata.js +1 -1
  5. package/dist/npm/signature/Signature.js +21 -10
  6. package/dist/systemjs/kendo-react-inputs.js +1 -1
  7. package/package.json +16 -16
package/dist/es/package-metadata.js CHANGED
@@ -5,7 +5,7 @@ export var packageMetadata = {
5
5
  name: '@progress/kendo-react-inputs',
6
6
  productName: 'KendoReact',
7
7
  productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
8
- publishDate: 1665144469,
8
+ publishDate: 1665742266,
9
9
  version: '',
10
10
  licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
11
11
  };
package/dist/es/signature/Signature.js CHANGED
@@ -86,6 +86,8 @@ export var Signature = React.forwardRef(function (directProps, target) {
86
86
  var elementRef = React.useRef(null);
87
87
  var canvasRef = React.useRef(null);
88
88
  var dialogRef = React.useRef(null);
89
+ var minimizeButtonRef = React.useRef(null);
90
+ var maximizeButtonRef = React.useRef(null);
89
91
  var _b = React.useState(), instance = _b[0], setInstance = _b[1];
90
92
  var _c = React.useState(false), focused = _c[0], setFocused = _c[1];
91
93
  var _d = React.useState(false), isDrawing = _d[0], setIsDrawing = _d[1];
@@ -103,6 +105,8 @@ export var Signature = React.forwardRef(function (directProps, target) {
103
105
  var maximizeTitle = localizationService.toLanguageString(signatureMaximize, messages[signatureMaximize]);
104
106
  var minimizeTitle = localizationService.toLanguageString(signatureMinimize, messages[signatureMinimize]);
105
107
  var clearTitle = localizationService.toLanguageString(signatureClear, messages[signatureClear]);
108
+ var popupScale = props.popupScale || DEFAULT_POPUP_SCALE;
109
+ var exportScale = props.exportScale || DEFAULT_EXPORT_SCALE;
106
110
  var onValueChange = function (nextValue) {
107
111
  setStateValue(nextValue);
108
112
  if (props.onChange) {
@@ -129,8 +133,9 @@ export var Signature = React.forwardRef(function (directProps, target) {
129
133
  }
130
134
  }, [isOpenControlled]);
131
135
  var onDialogClose = function (event) {
136
+ var _a, _b;
132
137
  onMinimizeClick(event);
133
- focusElement();
138
+ (_b = (((_a = maximizeButtonRef.current) === null || _a === void 0 ? void 0 : _a.element) || canvasRef.current)) === null || _b === void 0 ? void 0 : _b.focus();
134
139
  };
135
140
  var colorGetter = React.useCallback(function () {
136
141
  var defaultColor = DEFAULT_COLOR;
@@ -163,8 +168,8 @@ export var Signature = React.forwardRef(function (directProps, target) {
163
168
  case 0:
164
169
  width = exportSize.width, height = exportSize.height;
165
170
  return [4 /*yield*/, (instance === null || instance === void 0 ? void 0 : instance.exportImage({
166
- width: width * (props.exportScale || DEFAULT_EXPORT_SCALE),
167
- height: height * (props.exportScale || DEFAULT_EXPORT_SCALE)
171
+ width: width * exportScale,
172
+ height: height * exportScale
168
173
  }))];
169
174
  case 1: return [2 /*return*/, _a.sent()];
170
175
  }
@@ -213,9 +218,16 @@ export var Signature = React.forwardRef(function (directProps, target) {
213
218
  setOpen(false);
214
219
  }
215
220
  };
216
- document.addEventListener('keypress', onDocumentKeydown);
217
- return function () { return document.removeEventListener('keypress', onDocumentKeydown); };
221
+ document.addEventListener('keydown', onDocumentKeydown);
222
+ return function () { return document.removeEventListener('keydown', onDocumentKeydown); };
218
223
  }, [open]);
224
+ React.useEffect(function () {
225
+ var _a, _b;
226
+ if (!props.maximized) {
227
+ return;
228
+ }
229
+ (_b = (_a = minimizeButtonRef.current) === null || _a === void 0 ? void 0 : _a.element) === null || _b === void 0 ? void 0 : _b.focus();
230
+ }, []);
219
231
  var focusElement = React.useCallback(function () { var _a; return (_a = canvasRef.current) === null || _a === void 0 ? void 0 : _a.focus(); }, []);
220
232
  var valueGetter = React.useCallback(function () { return props.value; }, [props.value]);
221
233
  var nameGetter = React.useCallback(function () { return props.name; }, [props.name]);
@@ -304,7 +316,6 @@ export var Signature = React.forwardRef(function (directProps, target) {
304
316
  };
305
317
  var popupSize = function () {
306
318
  var _a = elementSize(), width = _a.width, height = _a.height;
307
- var popupScale = props.popupScale || DEFAULT_POPUP_SCALE;
308
319
  return {
309
320
  width: width * popupScale,
310
321
  height: height * popupScale
@@ -322,14 +333,14 @@ export var Signature = React.forwardRef(function (directProps, target) {
322
333
  _a['k-disabled'] = props.disabled,
323
334
  _a['k-focus'] = focused,
324
335
  _a), props.className), onFocus: onFocus, onBlur: onBlur },
325
- React.createElement("div", { className: 'k-signature-actions k-signature-actions-top' },
326
- showMaximize && (React.createElement(Button, { className: 'k-signature-action k-signature-maximize', icon: 'hyperlink-open', shape: null, fillMode: 'flat', size: props.size, onClick: onMaximizeClick, "aria-label": maximizeTitle, title: maximizeTitle })),
327
- showMinimize && (React.createElement(Button, { className: 'k-signature-action k-signature-minimize k-rotate-180', icon: 'hyperlink-open', shape: null, fillMode: 'flat', size: props.size, onClick: onMinimizeClick, "aria-label": minimizeTitle, title: minimizeTitle }))),
328
336
  React.createElement("div", { className: 'k-signature-canvas', ref: canvasRef, tabIndex: getTabIndex(props.tabIndex, props.disabled), role: "img", id: props.id, "aria-label": props.ariaLabel, "aria-labelledby": props.ariaLabelledBy, "aria-describedby": props.ariaDescribedBy, "aria-disabled": props.disabled ? 'true' : undefined }),
337
+ React.createElement("div", { className: 'k-signature-actions k-signature-actions-top' },
338
+ showMaximize && (React.createElement(Button, { className: 'k-signature-action k-signature-maximize', ref: maximizeButtonRef, icon: 'hyperlink-open', shape: null, fillMode: 'flat', size: props.size, onClick: onMaximizeClick, "aria-label": maximizeTitle, title: maximizeTitle })),
339
+ showMinimize && (React.createElement(Button, { className: 'k-signature-action k-signature-minimize k-rotate-180', ref: minimizeButtonRef, icon: 'hyperlink-open', shape: null, fillMode: 'flat', size: props.size, onClick: onMinimizeClick, "aria-label": minimizeTitle, title: minimizeTitle }))),
329
340
  !props.hideLine && (React.createElement("div", { className: 'k-signature-line', style: { zIndex: 2, pointerEvents: 'none' } })),
330
341
  React.createElement("div", { className: 'k-signature-actions k-signature-actions-bottom' }, showClear && (React.createElement(Button, { className: 'k-signature-action k-signature-clear', icon: 'close', shape: null, fillMode: 'flat', size: props.size, onClick: onClear, "aria-label": clearTitle, title: clearTitle }))),
331
342
  open && (React.createElement(Dialog, { ref: dialogRef },
332
- React.createElement(Signature, __assign({}, props, popupSize(), { value: popupValue, maximized: true, open: false, onChange: onDialogChange, onClose: onDialogClose }))))));
343
+ React.createElement(Signature, __assign({}, props, popupSize(), { value: popupValue, maximized: true, exportScale: (1 / popupScale) * exportScale, open: false, onChange: onDialogChange, onClose: onDialogClose }))))));
333
344
  });
334
345
  Signature.propTypes = {
335
346
  value: PropTypes.string,
package/dist/npm/package-metadata.js CHANGED
@@ -8,7 +8,7 @@ exports.packageMetadata = {
8
8
  name: '@progress/kendo-react-inputs',
9
9
  productName: 'KendoReact',
10
10
  productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
11
- publishDate: 1665144469,
11
+ publishDate: 1665742266,
12
12
  version: '',
13
13
  licensingDocsUrl: 'https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning'
14
14
  };
package/dist/npm/signature/Signature.js CHANGED
@@ -89,6 +89,8 @@ exports.Signature = React.forwardRef(function (directProps, target) {
89
89
  var elementRef = React.useRef(null);
90
90
  var canvasRef = React.useRef(null);
91
91
  var dialogRef = React.useRef(null);
92
+ var minimizeButtonRef = React.useRef(null);
93
+ var maximizeButtonRef = React.useRef(null);
92
94
  var _b = React.useState(), instance = _b[0], setInstance = _b[1];
93
95
  var _c = React.useState(false), focused = _c[0], setFocused = _c[1];
94
96
  var _d = React.useState(false), isDrawing = _d[0], setIsDrawing = _d[1];
@@ -106,6 +108,8 @@ exports.Signature = React.forwardRef(function (directProps, target) {
106
108
  var maximizeTitle = localizationService.toLanguageString(messages_1.signatureMaximize, messages_1.messages[messages_1.signatureMaximize]);
107
109
  var minimizeTitle = localizationService.toLanguageString(messages_1.signatureMinimize, messages_1.messages[messages_1.signatureMinimize]);
108
110
  var clearTitle = localizationService.toLanguageString(messages_1.signatureClear, messages_1.messages[messages_1.signatureClear]);
111
+ var popupScale = props.popupScale || DEFAULT_POPUP_SCALE;
112
+ var exportScale = props.exportScale || DEFAULT_EXPORT_SCALE;
109
113
  var onValueChange = function (nextValue) {
110
114
  setStateValue(nextValue);
111
115
  if (props.onChange) {
@@ -132,8 +136,9 @@ exports.Signature = React.forwardRef(function (directProps, target) {
132
136
  }
133
137
  }, [isOpenControlled]);
134
138
  var onDialogClose = function (event) {
139
+ var _a, _b;
135
140
  onMinimizeClick(event);
136
- focusElement();
141
+ (_b = (((_a = maximizeButtonRef.current) === null || _a === void 0 ? void 0 : _a.element) || canvasRef.current)) === null || _b === void 0 ? void 0 : _b.focus();
137
142
  };
138
143
  var colorGetter = React.useCallback(function () {
139
144
  var defaultColor = DEFAULT_COLOR;
@@ -166,8 +171,8 @@ exports.Signature = React.forwardRef(function (directProps, target) {
166
171
  case 0:
167
172
  width = exportSize.width, height = exportSize.height;
168
173
  return [4 /*yield*/, (instance === null || instance === void 0 ? void 0 : instance.exportImage({
169
- width: width * (props.exportScale || DEFAULT_EXPORT_SCALE),
170
- height: height * (props.exportScale || DEFAULT_EXPORT_SCALE)
174
+ width: width * exportScale,
175
+ height: height * exportScale
171
176
  }))];
172
177
  case 1: return [2 /*return*/, _a.sent()];
173
178
  }
@@ -216,9 +221,16 @@ exports.Signature = React.forwardRef(function (directProps, target) {
216
221
  setOpen(false);
217
222
  }
218
223
  };
219
- document.addEventListener('keypress', onDocumentKeydown);
220
- return function () { return document.removeEventListener('keypress', onDocumentKeydown); };
224
+ document.addEventListener('keydown', onDocumentKeydown);
225
+ return function () { return document.removeEventListener('keydown', onDocumentKeydown); };
221
226
  }, [open]);
227
+ React.useEffect(function () {
228
+ var _a, _b;
229
+ if (!props.maximized) {
230
+ return;
231
+ }
232
+ (_b = (_a = minimizeButtonRef.current) === null || _a === void 0 ? void 0 : _a.element) === null || _b === void 0 ? void 0 : _b.focus();
233
+ }, []);
222
234
  var focusElement = React.useCallback(function () { var _a; return (_a = canvasRef.current) === null || _a === void 0 ? void 0 : _a.focus(); }, []);
223
235
  var valueGetter = React.useCallback(function () { return props.value; }, [props.value]);
224
236
  var nameGetter = React.useCallback(function () { return props.name; }, [props.name]);
@@ -307,7 +319,6 @@ exports.Signature = React.forwardRef(function (directProps, target) {
307
319
  };
308
320
  var popupSize = function () {
309
321
  var _a = elementSize(), width = _a.width, height = _a.height;
310
- var popupScale = props.popupScale || DEFAULT_POPUP_SCALE;
311
322
  return {
312
323
  width: width * popupScale,
313
324
  height: height * popupScale
@@ -325,14 +336,14 @@ exports.Signature = React.forwardRef(function (directProps, target) {
325
336
  _a['k-disabled'] = props.disabled,
326
337
  _a['k-focus'] = focused,
327
338
  _a), props.className), onFocus: onFocus, onBlur: onBlur },
328
- React.createElement("div", { className: 'k-signature-actions k-signature-actions-top' },
329
- showMaximize && (React.createElement(kendo_react_buttons_1.Button, { className: 'k-signature-action k-signature-maximize', icon: 'hyperlink-open', shape: null, fillMode: 'flat', size: props.size, onClick: onMaximizeClick, "aria-label": maximizeTitle, title: maximizeTitle })),
330
- showMinimize && (React.createElement(kendo_react_buttons_1.Button, { className: 'k-signature-action k-signature-minimize k-rotate-180', icon: 'hyperlink-open', shape: null, fillMode: 'flat', size: props.size, onClick: onMinimizeClick, "aria-label": minimizeTitle, title: minimizeTitle }))),
331
339
  React.createElement("div", { className: 'k-signature-canvas', ref: canvasRef, tabIndex: (0, kendo_react_common_1.getTabIndex)(props.tabIndex, props.disabled), role: "img", id: props.id, "aria-label": props.ariaLabel, "aria-labelledby": props.ariaLabelledBy, "aria-describedby": props.ariaDescribedBy, "aria-disabled": props.disabled ? 'true' : undefined }),
340
+ React.createElement("div", { className: 'k-signature-actions k-signature-actions-top' },
341
+ showMaximize && (React.createElement(kendo_react_buttons_1.Button, { className: 'k-signature-action k-signature-maximize', ref: maximizeButtonRef, icon: 'hyperlink-open', shape: null, fillMode: 'flat', size: props.size, onClick: onMaximizeClick, "aria-label": maximizeTitle, title: maximizeTitle })),
342
+ showMinimize && (React.createElement(kendo_react_buttons_1.Button, { className: 'k-signature-action k-signature-minimize k-rotate-180', ref: minimizeButtonRef, icon: 'hyperlink-open', shape: null, fillMode: 'flat', size: props.size, onClick: onMinimizeClick, "aria-label": minimizeTitle, title: minimizeTitle }))),
332
343
  !props.hideLine && (React.createElement("div", { className: 'k-signature-line', style: { zIndex: 2, pointerEvents: 'none' } })),
333
344
  React.createElement("div", { className: 'k-signature-actions k-signature-actions-bottom' }, showClear && (React.createElement(kendo_react_buttons_1.Button, { className: 'k-signature-action k-signature-clear', icon: 'close', shape: null, fillMode: 'flat', size: props.size, onClick: onClear, "aria-label": clearTitle, title: clearTitle }))),
334
345
  open && (React.createElement(kendo_react_dialogs_1.Dialog, { ref: dialogRef },
335
- React.createElement(exports.Signature, __assign({}, props, popupSize(), { value: popupValue, maximized: true, open: false, onChange: onDialogChange, onClose: onDialogClose }))))));
346
+ React.createElement(exports.Signature, __assign({}, props, popupSize(), { value: popupValue, maximized: true, exportScale: (1 / popupScale) * exportScale, open: false, onChange: onDialogChange, onClose: onDialogClose }))))));
336
347
  });
337
348
  exports.Signature.propTypes = {
338
349
  value: PropTypes.string,