@progress/kendo-react-inputs 5.6.0-dev.202208291054 → 5.6.0-next.202208310638

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 (97) hide show
  1. package/dist/cdn/js/kendo-react-inputs.js +1 -1
  2. package/dist/es/checkbox/Checkbox.js +1 -0
  3. package/dist/es/colors/ColorInput.js +1 -1
  4. package/dist/es/colors/ColorPalette.d.ts +1 -1
  5. package/dist/es/colors/ColorPicker.js +1 -1
  6. package/dist/es/colors/FlatColorPicker.js +1 -1
  7. package/dist/es/input/InputClearValue.d.ts +15 -0
  8. package/dist/es/input/InputClearValue.js +24 -0
  9. package/dist/es/input/InputPrefix.d.ts +15 -0
  10. package/dist/es/input/InputPrefix.js +24 -0
  11. package/dist/es/input/InputSeparator.d.ts +15 -0
  12. package/dist/es/input/InputSeparator.js +24 -0
  13. package/dist/es/input/InputSuffix.d.ts +15 -0
  14. package/dist/es/input/InputSuffix.js +24 -0
  15. package/dist/es/input/InputValidationIcon.d.ts +14 -0
  16. package/dist/es/input/InputValidationIcon.js +20 -0
  17. package/dist/es/main.d.ts +6 -2
  18. package/dist/es/main.js +6 -2
  19. package/dist/es/maskedtextbox/MaskedTextBox.d.ts +1 -1
  20. package/dist/es/messages/index.d.ts +0 -15
  21. package/dist/es/messages/index.js +0 -15
  22. package/dist/es/numerictextbox/NumericTextBox.js +2 -2
  23. package/dist/es/package-metadata.js +1 -1
  24. package/dist/es/slider/Slider.js +2 -6
  25. package/dist/es/slider/SliderLabel.js +1 -2
  26. package/dist/es/switch/Switch.js +5 -5
  27. package/dist/es/textbox/Textbox.d.ts +69 -0
  28. package/dist/es/textbox/Textbox.js +111 -0
  29. package/dist/npm/checkbox/Checkbox.js +1 -0
  30. package/dist/npm/colors/ColorInput.js +1 -1
  31. package/dist/npm/colors/ColorPalette.d.ts +1 -1
  32. package/dist/npm/colors/ColorPicker.js +1 -1
  33. package/dist/npm/colors/FlatColorPicker.js +1 -1
  34. package/dist/npm/input/InputClearValue.d.ts +15 -0
  35. package/dist/npm/input/InputClearValue.js +27 -0
  36. package/dist/npm/input/InputPrefix.d.ts +15 -0
  37. package/dist/npm/input/InputPrefix.js +27 -0
  38. package/dist/npm/input/InputSeparator.d.ts +15 -0
  39. package/dist/npm/input/InputSeparator.js +27 -0
  40. package/dist/npm/input/InputSuffix.d.ts +15 -0
  41. package/dist/npm/input/InputSuffix.js +27 -0
  42. package/dist/npm/input/InputValidationIcon.d.ts +14 -0
  43. package/dist/npm/input/InputValidationIcon.js +23 -0
  44. package/dist/npm/main.d.ts +6 -2
  45. package/dist/npm/main.js +13 -3
  46. package/dist/npm/maskedtextbox/MaskedTextBox.d.ts +1 -1
  47. package/dist/npm/messages/index.d.ts +0 -15
  48. package/dist/npm/messages/index.js +1 -16
  49. package/dist/npm/numerictextbox/NumericTextBox.js +2 -2
  50. package/dist/npm/package-metadata.js +1 -1
  51. package/dist/npm/slider/Slider.js +2 -6
  52. package/dist/npm/slider/SliderLabel.js +1 -2
  53. package/dist/npm/switch/Switch.js +5 -5
  54. package/dist/npm/textbox/Textbox.d.ts +69 -0
  55. package/dist/npm/textbox/Textbox.js +114 -0
  56. package/dist/systemjs/kendo-react-inputs.js +1 -1
  57. package/package.json +16 -19
  58. package/dist/es/signature/Signature.d.ts +0 -14
  59. package/dist/es/signature/Signature.js +0 -346
  60. package/dist/es/signature/interfaces/SignatureBlurEvent.d.ts +0 -7
  61. package/dist/es/signature/interfaces/SignatureBlurEvent.js +0 -1
  62. package/dist/es/signature/interfaces/SignatureChangeEvent.d.ts +0 -11
  63. package/dist/es/signature/interfaces/SignatureChangeEvent.js +0 -1
  64. package/dist/es/signature/interfaces/SignatureCloseEvent.d.ts +0 -7
  65. package/dist/es/signature/interfaces/SignatureCloseEvent.js +0 -1
  66. package/dist/es/signature/interfaces/SignatureFocusEvent.d.ts +0 -7
  67. package/dist/es/signature/interfaces/SignatureFocusEvent.js +0 -1
  68. package/dist/es/signature/interfaces/SignatureHandle.d.ts +0 -34
  69. package/dist/es/signature/interfaces/SignatureHandle.js +0 -1
  70. package/dist/es/signature/interfaces/SignatureOpenEvent.d.ts +0 -7
  71. package/dist/es/signature/interfaces/SignatureOpenEvent.js +0 -1
  72. package/dist/es/signature/interfaces/SignatureProps.d.ts +0 -196
  73. package/dist/es/signature/interfaces/SignatureProps.js +0 -1
  74. package/dist/es/signature/interfaces/index.d.ts +0 -7
  75. package/dist/es/signature/interfaces/index.js +0 -1
  76. package/dist/es/signature/utils/index.d.ts +0 -4
  77. package/dist/es/signature/utils/index.js +0 -10
  78. package/dist/npm/signature/Signature.d.ts +0 -14
  79. package/dist/npm/signature/Signature.js +0 -349
  80. package/dist/npm/signature/interfaces/SignatureBlurEvent.d.ts +0 -7
  81. package/dist/npm/signature/interfaces/SignatureBlurEvent.js +0 -2
  82. package/dist/npm/signature/interfaces/SignatureChangeEvent.d.ts +0 -11
  83. package/dist/npm/signature/interfaces/SignatureChangeEvent.js +0 -2
  84. package/dist/npm/signature/interfaces/SignatureCloseEvent.d.ts +0 -7
  85. package/dist/npm/signature/interfaces/SignatureCloseEvent.js +0 -2
  86. package/dist/npm/signature/interfaces/SignatureFocusEvent.d.ts +0 -7
  87. package/dist/npm/signature/interfaces/SignatureFocusEvent.js +0 -2
  88. package/dist/npm/signature/interfaces/SignatureHandle.d.ts +0 -34
  89. package/dist/npm/signature/interfaces/SignatureHandle.js +0 -2
  90. package/dist/npm/signature/interfaces/SignatureOpenEvent.d.ts +0 -7
  91. package/dist/npm/signature/interfaces/SignatureOpenEvent.js +0 -2
  92. package/dist/npm/signature/interfaces/SignatureProps.d.ts +0 -196
  93. package/dist/npm/signature/interfaces/SignatureProps.js +0 -2
  94. package/dist/npm/signature/interfaces/index.d.ts +0 -7
  95. package/dist/npm/signature/interfaces/index.js +0 -2
  96. package/dist/npm/signature/utils/index.d.ts +0 -4
  97. package/dist/npm/signature/utils/index.js +0 -14
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-react-inputs",
3
- "version": "5.6.0-dev.202208291054",
3
+ "version": "5.6.0-next.202208310638",
4
4
  "description": "React Inputs offer a customizable interface for users to enter and pick different information. KendoReact Input package",
5
5
  "repository": {
6
6
  "type": "git",
@@ -31,38 +31,35 @@
31
31
  "Telerik"
32
32
  ],
33
33
  "peerDependencies": {
34
- "@progress/kendo-drawing": "^1.17.12",
34
+ "@progress/kendo-drawing": "^1.5.12",
35
35
  "@progress/kendo-licensing": "^1.0.1",
36
36
  "@progress/kendo-react-animation": "^5.0.0",
37
+ "@progress/kendo-react-form": "^5.0.0",
37
38
  "@progress/kendo-react-intl": "^5.0.0",
38
39
  "react": "^16.8.2 || ^17.0.0 || ^18.0.0",
39
40
  "react-dom": "^16.8.2 || ^17.0.0 || ^18.0.0"
40
41
  },
41
42
  "dependencies": {
42
- "@progress/kendo-inputs-common": "^3.1.0",
43
- "@progress/kendo-react-buttons": "5.6.0-dev.202208291054",
44
- "@progress/kendo-react-common": "5.6.0-dev.202208291054",
45
- "@progress/kendo-react-dialogs": "5.6.0-dev.202208291054",
46
- "@progress/kendo-react-labels": "5.6.0-dev.202208291054",
47
- "@progress/kendo-react-popup": "5.6.0-dev.202208291054",
43
+ "@progress/kendo-react-buttons": "5.6.0-next.202208310638",
44
+ "@progress/kendo-react-common": "5.6.0-next.202208310638",
45
+ "@progress/kendo-react-labels": "5.6.0-next.202208310638",
46
+ "@progress/kendo-react-popup": "5.6.0-next.202208310638",
48
47
  "prop-types": "^15.6.0"
49
48
  },
50
49
  "devDependencies": {
51
50
  "@progress/kendo-data-query": "^1.5.5",
52
51
  "@progress/kendo-date-math": "^1.5.4",
53
52
  "@progress/kendo-drawing": "^1.8.0",
54
- "@progress/kendo-file-saver": "^1.1.1",
55
53
  "@progress/kendo-licensing": "^1.0.1",
56
- "@progress/kendo-react-animation": "5.6.0-dev.202208291054",
57
- "@progress/kendo-react-data-tools": "5.6.0-dev.202208291054",
58
- "@progress/kendo-react-dateinputs": "5.6.0-dev.202208291054",
59
- "@progress/kendo-react-dropdowns": "5.6.0-dev.202208291054",
60
- "@progress/kendo-react-form": "5.6.0-dev.202208291054",
61
- "@progress/kendo-react-grid": "5.6.0-dev.202208291054",
62
- "@progress/kendo-react-intl": "5.6.0-dev.202208291054",
63
- "@progress/kendo-react-labels": "5.6.0-dev.202208291054",
64
- "@progress/kendo-react-tooltip": "5.6.0-dev.202208291054",
65
- "@progress/kendo-react-upload": "5.6.0-dev.202208291054",
54
+ "@progress/kendo-react-animation": "5.6.0-next.202208310638",
55
+ "@progress/kendo-react-data-tools": "5.6.0-next.202208310638",
56
+ "@progress/kendo-react-dateinputs": "5.6.0-next.202208310638",
57
+ "@progress/kendo-react-dropdowns": "5.6.0-next.202208310638",
58
+ "@progress/kendo-react-form": "5.6.0-next.202208310638",
59
+ "@progress/kendo-react-grid": "5.6.0-next.202208310638",
60
+ "@progress/kendo-react-intl": "5.6.0-next.202208310638",
61
+ "@progress/kendo-react-labels": "5.6.0-next.202208310638",
62
+ "@progress/kendo-react-tooltip": "5.6.0-next.202208310638",
66
63
  "formik": "^2.2.9"
67
64
  },
68
65
  "@progress": {
@@ -1,14 +0,0 @@
1
- import * as React from 'react';
2
- import { SignatureHandle } from './interfaces/SignatureHandle';
3
- import { SignatureProps } from './interfaces/SignatureProps';
4
- /**
5
- * Represents the PropsContext of the `Signature` component.
6
- * Used for global configuration of all `Signature` instances.
7
- *
8
- * For more information, refer to the [Inputs Props Context]({% slug props-context_inputs %}) article.
9
- */
10
- export declare const SignaturePropsContext: React.Context<(p: SignatureProps) => SignatureProps>;
11
- /**
12
- * Represents the [KendoReact Signature component]({% slug overview_signature %}).
13
- */
14
- export declare const Signature: React.ForwardRefExoticComponent<SignatureProps & React.RefAttributes<SignatureHandle | null>>;
@@ -1,346 +0,0 @@
1
- var __assign = (this && this.__assign) || function () {
2
- __assign = Object.assign || function(t) {
3
- for (var s, i = 1, n = arguments.length; i < n; i++) {
4
- s = arguments[i];
5
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
6
- t[p] = s[p];
7
- }
8
- return t;
9
- };
10
- return __assign.apply(this, arguments);
11
- };
12
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
13
- function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
14
- return new (P || (P = Promise))(function (resolve, reject) {
15
- function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
16
- function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
17
- function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
18
- step((generator = generator.apply(thisArg, _arguments || [])).next());
19
- });
20
- };
21
- var __generator = (this && this.__generator) || function (thisArg, body) {
22
- var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
23
- return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
24
- function verb(n) { return function (v) { return step([n, v]); }; }
25
- function step(op) {
26
- if (f) throw new TypeError("Generator is already executing.");
27
- while (_) try {
28
- if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
29
- if (y = 0, t) op = [op[0] & 2, t.value];
30
- switch (op[0]) {
31
- case 0: case 1: t = op; break;
32
- case 4: _.label++; return { value: op[1], done: false };
33
- case 5: _.label++; y = op[1]; op = [0]; continue;
34
- case 7: op = _.ops.pop(); _.trys.pop(); continue;
35
- default:
36
- if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
37
- if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
38
- if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
39
- if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
40
- if (t[2]) _.ops.pop();
41
- _.trys.pop(); continue;
42
- }
43
- op = body.call(thisArg, _);
44
- } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
45
- if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
46
- }
47
- };
48
- import { SignaturePad } from '@progress/kendo-inputs-common';
49
- import { Button } from '@progress/kendo-react-buttons';
50
- import { classNames, createPropsContext, dispatchEvent, getTabIndex, kendoThemeMaps, noop, usePropsContext } from '@progress/kendo-react-common';
51
- import { validatePackage } from '@progress/kendo-react-common';
52
- import { Dialog } from '@progress/kendo-react-dialogs';
53
- import { useLocalization } from '@progress/kendo-react-intl';
54
- import * as PropTypes from 'prop-types';
55
- import * as React from 'react';
56
- import { messages, signatureClear, signatureMaximize, signatureMinimize } from '../messages';
57
- import { packageMetadata } from '../package-metadata';
58
- import { hasParent } from './utils';
59
- var DEFAULT_WIDTH = 250;
60
- var DEFAULT_HEIGHT = 84;
61
- var DEFAULT_POPUP_SCALE = 3;
62
- var DEFAULT_EXPORT_SCALE = 2;
63
- /**
64
- * @hidden
65
- */
66
- var isControlled = function (prop) {
67
- return prop !== undefined;
68
- };
69
- /**
70
- * Represents the PropsContext of the `Signature` component.
71
- * Used for global configuration of all `Signature` instances.
72
- *
73
- * For more information, refer to the [Inputs Props Context]({% slug props-context_inputs %}) article.
74
- */
75
- export var SignaturePropsContext = createPropsContext();
76
- /**
77
- * Represents the [KendoReact Signature component]({% slug overview_signature %}).
78
- */
79
- export var Signature = React.forwardRef(function (directProps, target) {
80
- var _a;
81
- validatePackage(packageMetadata);
82
- var props = usePropsContext(SignaturePropsContext, directProps);
83
- var localizationService = useLocalization();
84
- var elementRef = React.useRef(null);
85
- var canvasRef = React.useRef(null);
86
- var dialogRef = React.useRef(null);
87
- var _b = React.useState(), instance = _b[0], setInstance = _b[1];
88
- var _c = React.useState(false), focused = _c[0], setFocused = _c[1];
89
- var _d = React.useState(false), isDrawing = _d[0], setIsDrawing = _d[1];
90
- var _e = React.useState(), stateValue = _e[0], setStateValue = _e[1];
91
- var _f = React.useState(), popupValue = _f[0], setPopupValue = _f[1];
92
- var isValueControlled = isControlled(props.value);
93
- var value = isValueControlled ? props.value : stateValue;
94
- var _g = React.useState(false), stateOpen = _g[0], setStateOpen = _g[1];
95
- var isOpenControlled = isControlled(props.open);
96
- var open = isOpenControlled ? props.open : stateOpen;
97
- var showMaximize = !(props.maximized || isDrawing || !props.maximizable || props.disabled);
98
- var showMinimize = props.maximized && !isDrawing;
99
- var isEmpty = !(props.value || stateValue);
100
- var showClear = !(isEmpty || isDrawing || props.readOnly || props.disabled);
101
- var maximizeTitle = localizationService.toLanguageString(signatureMaximize, messages[signatureMaximize]);
102
- var minimizeTitle = localizationService.toLanguageString(signatureMinimize, messages[signatureMinimize]);
103
- var clearTitle = localizationService.toLanguageString(signatureClear, messages[signatureClear]);
104
- var onValueChange = function (nextValue) {
105
- setStateValue(nextValue);
106
- if (props.onChange) {
107
- props.onChange({ value: nextValue });
108
- }
109
- };
110
- var onDialogChange = function (e) {
111
- instance === null || instance === void 0 ? void 0 : instance.loadImage(e.value);
112
- onValueChange(e.value);
113
- };
114
- React.useEffect(function () {
115
- if (props.value !== stateValue) {
116
- setStateValue(props.value);
117
- instance === null || instance === void 0 ? void 0 : instance.loadImage(props.value);
118
- }
119
- }, [props.value]);
120
- var reset = function () {
121
- instance === null || instance === void 0 ? void 0 : instance.clear();
122
- onValueChange();
123
- };
124
- var setOpen = React.useCallback(function (nextOpen) {
125
- if (!isOpenControlled) {
126
- setStateOpen(nextOpen);
127
- }
128
- }, [isOpenControlled]);
129
- var onDialogClose = function (event) {
130
- onMinimizeClick(event);
131
- focusElement();
132
- };
133
- var getOptions = function () { return ({
134
- scale: props.maximized ? props.popupScale : 1,
135
- color: props.color,
136
- backgroundColor: props.backgroundColor,
137
- strokeWidth: props.strokeWidth,
138
- smooth: props.smooth,
139
- readonly: props.readOnly
140
- }); };
141
- var exportImage = function (exportSize) { return __awaiter(void 0, void 0, void 0, function () {
142
- var width, height;
143
- return __generator(this, function (_a) {
144
- switch (_a.label) {
145
- case 0:
146
- width = exportSize.width, height = exportSize.height;
147
- return [4 /*yield*/, (instance === null || instance === void 0 ? void 0 : instance.exportImage({
148
- width: width * (props.exportScale || DEFAULT_EXPORT_SCALE),
149
- height: height * (props.exportScale || DEFAULT_EXPORT_SCALE)
150
- }))];
151
- case 1: return [2 /*return*/, _a.sent()];
152
- }
153
- });
154
- }); };
155
- React.useEffect(function () {
156
- var canvas = canvasRef.current;
157
- var pad = new SignaturePad(canvas, getOptions());
158
- if (value) {
159
- pad.loadImage(value);
160
- }
161
- setInstance(pad);
162
- return function () { return pad.destroy(); };
163
- }, []);
164
- React.useEffect(function () {
165
- instance === null || instance === void 0 ? void 0 : instance.setOptions({
166
- onChange: function () { return __awaiter(void 0, void 0, void 0, function () { var _a; return __generator(this, function (_b) {
167
- switch (_b.label) {
168
- case 0:
169
- _a = onValueChange;
170
- return [4 /*yield*/, exportImage(elementSize())];
171
- case 1: return [2 /*return*/, _a.apply(void 0, [_b.sent()])];
172
- }
173
- }); }); },
174
- onDraw: function () { return setIsDrawing(true); },
175
- onDrawEnd: function () { return setIsDrawing(false); }
176
- });
177
- }, [instance]);
178
- React.useLayoutEffect(function () { return instance === null || instance === void 0 ? void 0 : instance.setOptions(getOptions()); }, [props.readOnly, props.color, props.backgroundColor, props.strokeWidth, props.smooth]);
179
- React.useEffect(function () {
180
- var _a, _b;
181
- var overlay = (_b = (_a = dialogRef.current) === null || _a === void 0 ? void 0 : _a.element) === null || _b === void 0 ? void 0 : _b.querySelector('.k-overlay');
182
- if (!overlay) {
183
- return;
184
- }
185
- var onOverlayClick = function () { return setOpen(false); };
186
- overlay.addEventListener('click', onOverlayClick);
187
- return function () {
188
- return overlay.removeEventListener('click', onOverlayClick);
189
- };
190
- }, [open]);
191
- var focusElement = React.useCallback(function () { var _a; return (_a = canvasRef.current) === null || _a === void 0 ? void 0 : _a.focus(); }, []);
192
- var valueGetter = React.useCallback(function () { return props.value; }, [props.value]);
193
- var nameGetter = React.useCallback(function () { return props.name; }, [props.name]);
194
- var requiredGetter = React.useCallback(function () { return props.required; }, [props.required]);
195
- var validityGetter = React.useCallback(function () {
196
- var customError = props.validationMessage !== undefined;
197
- var currentValue = valueGetter();
198
- var valueMissing = !currentValue;
199
- var valid = props.valid !== undefined ?
200
- props.valid :
201
- (!requiredGetter() || !valueMissing);
202
- return {
203
- customError: customError,
204
- valid: valid,
205
- valueMissing: valueMissing
206
- };
207
- }, [props.validationMessage, props.valid, valueGetter, requiredGetter]);
208
- var validityStylesGetter = React.useCallback(function () {
209
- return props.validityStyles;
210
- }, [props.validityStyles]);
211
- var propsGetter = React.useCallback(function () {
212
- return props;
213
- }, [props]);
214
- var getImperativeHandle = React.useCallback(function () {
215
- var options = {
216
- element: elementRef.current,
217
- focus: focusElement
218
- };
219
- Object.defineProperty(options, 'name', { get: nameGetter });
220
- Object.defineProperty(options, 'value', { get: valueGetter });
221
- Object.defineProperty(options, 'validity', { get: validityGetter });
222
- Object.defineProperty(options, 'validityStyles', { get: validityStylesGetter });
223
- Object.defineProperty(options, 'required', { get: requiredGetter });
224
- Object.defineProperty(options, 'props', { get: propsGetter });
225
- return options;
226
- }, [nameGetter, valueGetter, validityGetter, validityStylesGetter, requiredGetter, focusElement, propsGetter]);
227
- React.useImperativeHandle(target, getImperativeHandle);
228
- var onFocus = React.useCallback(function (event) {
229
- if (focused || props.maximized) {
230
- return;
231
- }
232
- setFocused(true);
233
- dispatchEvent(props.onFocus, event, getImperativeHandle(), {});
234
- }, [focused, props.onFocus, getImperativeHandle]);
235
- var onBlur = React.useCallback(function (event) {
236
- var insideWrapper = hasParent(event.relatedTarget, elementRef.current);
237
- if (insideWrapper) {
238
- return;
239
- }
240
- setFocused(false);
241
- dispatchEvent(props.onBlur, event, getImperativeHandle(), {});
242
- }, [focused, props.onBlur, getImperativeHandle]);
243
- var onMaximizeClick = React.useCallback(function (event) { return __awaiter(void 0, void 0, void 0, function () {
244
- var _a;
245
- return __generator(this, function (_b) {
246
- switch (_b.label) {
247
- case 0:
248
- _a = setPopupValue;
249
- return [4 /*yield*/, exportImage(popupSize())];
250
- case 1:
251
- _a.apply(void 0, [_b.sent()]);
252
- setOpen(true);
253
- dispatchEvent(props.onOpen, event, getImperativeHandle(), {});
254
- return [2 /*return*/];
255
- }
256
- });
257
- }); }, [open, isOpenControlled, props.onOpen, props.value, stateValue, getImperativeHandle]);
258
- var onMinimizeClick = React.useCallback(function (event) {
259
- setOpen(false);
260
- dispatchEvent(props.onClose, event, getImperativeHandle(), {});
261
- }, [open, isOpenControlled, props.onClose, getImperativeHandle]);
262
- var onClear = function () {
263
- reset();
264
- focusElement();
265
- };
266
- var elementSize = function () {
267
- var _a, _b;
268
- var width = props.width || ((_a = elementRef.current) === null || _a === void 0 ? void 0 : _a.offsetWidth) || DEFAULT_WIDTH;
269
- var height = props.height || ((_b = elementRef.current) === null || _b === void 0 ? void 0 : _b.offsetHeight) || DEFAULT_HEIGHT;
270
- return {
271
- width: width,
272
- height: height
273
- };
274
- };
275
- var popupSize = function () {
276
- var _a = elementSize(), width = _a.width, height = _a.height;
277
- var popupScale = props.popupScale || DEFAULT_POPUP_SCALE;
278
- return {
279
- width: width * popupScale,
280
- height: height * popupScale
281
- };
282
- };
283
- var isValid = !validityStylesGetter() || validityGetter().valid;
284
- return (React.createElement("div", { ref: elementRef, dir: props.dir, style: __assign({ width: props.width, height: props.height }, props.style), className: classNames('k-input', 'k-signature', (_a = {
285
- 'k-signature-maximized': props.maximized
286
- },
287
- _a["k-signature-".concat(kendoThemeMaps.sizeMap[props.size] || props.size)] = props.size,
288
- _a["k-signature-".concat(props.fillMode)] = props.fillMode,
289
- _a["k-rounded-".concat(kendoThemeMaps.roundedMap[props.rounded] || props.rounded)] = props.rounded,
290
- _a['k-invalid'] = !isValid,
291
- _a['k-required'] = props.required,
292
- _a['k-disabled'] = props.disabled,
293
- _a['k-focus'] = focused,
294
- _a), props.className), onFocus: onFocus, onBlur: onBlur },
295
- React.createElement("div", { className: 'k-signature-actions k-signature-actions-top' },
296
- 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 })),
297
- showMinimize && (React.createElement(Button, { className: 'k-signature-action k-signature-minimize', icon: 'window-minimize', shape: null, fillMode: 'flat', size: props.size, onClick: onMinimizeClick, "aria-label": minimizeTitle, title: minimizeTitle }))),
298
- 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 }),
299
- !props.hideLine && (React.createElement("div", { className: 'k-signature-line', style: { zIndex: 2, pointerEvents: 'none' } })),
300
- 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 }))),
301
- open && (React.createElement(Dialog, { ref: dialogRef },
302
- React.createElement(Signature, __assign({}, props, popupSize(), { value: popupValue, maximized: true, open: false, onChange: onDialogChange, onClose: onDialogClose }))))));
303
- });
304
- Signature.propTypes = {
305
- value: PropTypes.string,
306
- width: PropTypes.number,
307
- height: PropTypes.number,
308
- tabIndex: PropTypes.number,
309
- dir: PropTypes.string,
310
- ariaDescribedBy: PropTypes.string,
311
- ariaLabelledBy: PropTypes.string,
312
- ariaLabel: PropTypes.string,
313
- readOnly: PropTypes.bool,
314
- disabled: PropTypes.bool,
315
- validationMessage: PropTypes.string,
316
- required: PropTypes.bool,
317
- onChange: PropTypes.func,
318
- onFocus: PropTypes.func,
319
- onBlur: PropTypes.func,
320
- onOpen: PropTypes.func,
321
- onClose: PropTypes.func,
322
- size: PropTypes.oneOf([null, 'small', 'medium', 'large']),
323
- rounded: PropTypes.oneOf([null, 'small', 'medium', 'large', 'full']),
324
- fillMode: PropTypes.oneOf([null, 'solid', 'flat', 'outline'])
325
- };
326
- Signature.displayName = 'KendoSignature';
327
- Signature.defaultProps = {
328
- color: '#000000',
329
- backgroundColor: '#ffffff',
330
- strokeWidth: 1,
331
- smooth: false,
332
- popupScale: DEFAULT_POPUP_SCALE,
333
- exportScale: DEFAULT_EXPORT_SCALE,
334
- maximizable: true,
335
- disabled: false,
336
- required: false,
337
- validityStyles: true,
338
- onChange: function (_) { return noop; },
339
- onFocus: function (_) { return noop; },
340
- onBlur: function (_) { return noop; },
341
- onOpen: function (_) { return noop; },
342
- onClose: function (_) { return noop; },
343
- size: 'medium',
344
- rounded: 'medium',
345
- fillMode: 'solid'
346
- };
@@ -1,7 +0,0 @@
1
- import { BaseEvent } from '@progress/kendo-react-common';
2
- import { SignatureHandle } from './SignatureHandle';
3
- /**
4
- * The arguments for the `onBlur` Signature event.
5
- */
6
- export interface SignatureBlurEvent extends BaseEvent<SignatureHandle> {
7
- }
@@ -1 +0,0 @@
1
- export {};
@@ -1,11 +0,0 @@
1
- import { BaseEvent } from '@progress/kendo-react-common';
2
- import { SignatureHandle } from './SignatureHandle';
3
- /**
4
- * The arguments for the `change` event of the Signature.
5
- */
6
- export interface SignatureChangeEvent extends BaseEvent<SignatureHandle> {
7
- /**
8
- * The current value of the Signature.
9
- */
10
- value: string;
11
- }
@@ -1 +0,0 @@
1
- export {};
@@ -1,7 +0,0 @@
1
- import { BaseEvent } from '@progress/kendo-react-common';
2
- import { SignatureHandle } from './SignatureHandle';
3
- /**
4
- * The arguments for the `onClose` Signature event.
5
- */
6
- export interface SignatureCloseEvent extends BaseEvent<SignatureHandle> {
7
- }
@@ -1 +0,0 @@
1
- export {};
@@ -1,7 +0,0 @@
1
- import { BaseEvent } from '@progress/kendo-react-common';
2
- import { SignatureHandle } from './SignatureHandle';
3
- /**
4
- * The arguments for the `onFocus` Signature event.
5
- */
6
- export interface SignatureFocusEvent extends BaseEvent<SignatureHandle> {
7
- }
@@ -1 +0,0 @@
1
- export {};
@@ -1,34 +0,0 @@
1
- import { SignatureProps } from './SignatureProps';
2
- /**
3
- * The Signature ref.
4
- */
5
- export interface SignatureHandle {
6
- /**
7
- * The Signature element.
8
- */
9
- element: HTMLInputElement | null;
10
- /**
11
- * Focus the Signature.
12
- */
13
- focus: () => void;
14
- /**
15
- * Gets the `name` property of the Signature.
16
- */
17
- name: string | undefined;
18
- /**
19
- * Gets the value of the Signature.
20
- */
21
- value: number | null;
22
- /**
23
- * @hidden
24
- */
25
- props: SignatureProps;
26
- /**
27
- * @hidden
28
- */
29
- validityStyles: boolean;
30
- /**
31
- * @hidden
32
- */
33
- required: boolean;
34
- }
@@ -1 +0,0 @@
1
- export {};
@@ -1,7 +0,0 @@
1
- import { BaseEvent } from '@progress/kendo-react-common';
2
- import { SignatureHandle } from './SignatureHandle';
3
- /**
4
- * The arguments for the `onOpen` Signature event.
5
- */
6
- export interface SignatureOpenEvent extends BaseEvent<SignatureHandle> {
7
- }
@@ -1 +0,0 @@
1
- export {};