@progress/kendo-react-inputs 5.6.0-dev.202208261541 → 5.6.0-dev.202209021051

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/LICENSE.md +2 -2
  2. package/README.md +4 -4
  3. package/about.md +1 -1
  4. package/dist/cdn/js/kendo-react-inputs.js +1 -1
  5. package/dist/es/checkbox/Checkbox.js +1 -0
  6. package/dist/es/colors/ColorInput.js +1 -1
  7. package/dist/es/colors/ColorPicker.js +1 -1
  8. package/dist/es/colors/FlatColorPicker.js +1 -1
  9. package/dist/es/input/InputClearValue.d.ts +15 -0
  10. package/dist/es/input/InputClearValue.js +24 -0
  11. package/dist/es/input/InputPrefix.d.ts +15 -0
  12. package/dist/es/input/InputPrefix.js +24 -0
  13. package/dist/es/input/InputSeparator.d.ts +15 -0
  14. package/dist/es/input/InputSeparator.js +24 -0
  15. package/dist/es/input/InputSuffix.d.ts +15 -0
  16. package/dist/es/input/InputSuffix.js +24 -0
  17. package/dist/es/input/InputValidationIcon.d.ts +14 -0
  18. package/dist/es/input/InputValidationIcon.js +20 -0
  19. package/dist/es/main.d.ts +8 -0
  20. package/dist/es/main.js +8 -0
  21. package/dist/es/messages/index.d.ts +15 -0
  22. package/dist/es/messages/index.js +15 -0
  23. package/dist/es/numerictextbox/NumericTextBox.js +2 -2
  24. package/dist/es/package-metadata.js +1 -1
  25. package/dist/es/signature/Signature.d.ts +14 -0
  26. package/dist/es/signature/Signature.js +346 -0
  27. package/dist/es/signature/interfaces/SignatureBlurEvent.d.ts +7 -0
  28. package/dist/es/signature/interfaces/SignatureBlurEvent.js +1 -0
  29. package/dist/es/signature/interfaces/SignatureChangeEvent.d.ts +11 -0
  30. package/dist/es/signature/interfaces/SignatureChangeEvent.js +1 -0
  31. package/dist/es/signature/interfaces/SignatureCloseEvent.d.ts +7 -0
  32. package/dist/es/signature/interfaces/SignatureCloseEvent.js +1 -0
  33. package/dist/es/signature/interfaces/SignatureFocusEvent.d.ts +7 -0
  34. package/dist/es/signature/interfaces/SignatureFocusEvent.js +1 -0
  35. package/dist/es/signature/interfaces/SignatureHandle.d.ts +34 -0
  36. package/dist/es/signature/interfaces/SignatureHandle.js +1 -0
  37. package/dist/es/signature/interfaces/SignatureOpenEvent.d.ts +7 -0
  38. package/dist/es/signature/interfaces/SignatureOpenEvent.js +1 -0
  39. package/dist/es/signature/interfaces/SignatureProps.d.ts +196 -0
  40. package/dist/es/signature/interfaces/SignatureProps.js +1 -0
  41. package/dist/es/signature/interfaces/index.d.ts +7 -0
  42. package/dist/es/signature/interfaces/index.js +1 -0
  43. package/dist/es/signature/utils/index.d.ts +4 -0
  44. package/dist/es/signature/utils/index.js +10 -0
  45. package/dist/es/slider/Slider.js +2 -6
  46. package/dist/es/slider/SliderLabel.js +1 -2
  47. package/dist/es/switch/Switch.js +5 -5
  48. package/dist/es/textbox/Textbox.d.ts +69 -0
  49. package/dist/es/textbox/Textbox.js +111 -0
  50. package/dist/npm/checkbox/Checkbox.js +1 -0
  51. package/dist/npm/colors/ColorInput.js +1 -1
  52. package/dist/npm/colors/ColorPicker.js +1 -1
  53. package/dist/npm/colors/FlatColorPicker.js +1 -1
  54. package/dist/npm/input/InputClearValue.d.ts +15 -0
  55. package/dist/npm/input/InputClearValue.js +27 -0
  56. package/dist/npm/input/InputPrefix.d.ts +15 -0
  57. package/dist/npm/input/InputPrefix.js +27 -0
  58. package/dist/npm/input/InputSeparator.d.ts +15 -0
  59. package/dist/npm/input/InputSeparator.js +27 -0
  60. package/dist/npm/input/InputSuffix.d.ts +15 -0
  61. package/dist/npm/input/InputSuffix.js +27 -0
  62. package/dist/npm/input/InputValidationIcon.d.ts +14 -0
  63. package/dist/npm/input/InputValidationIcon.js +23 -0
  64. package/dist/npm/main.d.ts +8 -0
  65. package/dist/npm/main.js +15 -1
  66. package/dist/npm/messages/index.d.ts +15 -0
  67. package/dist/npm/messages/index.js +16 -1
  68. package/dist/npm/numerictextbox/NumericTextBox.js +2 -2
  69. package/dist/npm/package-metadata.js +1 -1
  70. package/dist/npm/signature/Signature.d.ts +14 -0
  71. package/dist/npm/signature/Signature.js +349 -0
  72. package/dist/npm/signature/interfaces/SignatureBlurEvent.d.ts +7 -0
  73. package/dist/npm/signature/interfaces/SignatureBlurEvent.js +2 -0
  74. package/dist/npm/signature/interfaces/SignatureChangeEvent.d.ts +11 -0
  75. package/dist/npm/signature/interfaces/SignatureChangeEvent.js +2 -0
  76. package/dist/npm/signature/interfaces/SignatureCloseEvent.d.ts +7 -0
  77. package/dist/npm/signature/interfaces/SignatureCloseEvent.js +2 -0
  78. package/dist/npm/signature/interfaces/SignatureFocusEvent.d.ts +7 -0
  79. package/dist/npm/signature/interfaces/SignatureFocusEvent.js +2 -0
  80. package/dist/npm/signature/interfaces/SignatureHandle.d.ts +34 -0
  81. package/dist/npm/signature/interfaces/SignatureHandle.js +2 -0
  82. package/dist/npm/signature/interfaces/SignatureOpenEvent.d.ts +7 -0
  83. package/dist/npm/signature/interfaces/SignatureOpenEvent.js +2 -0
  84. package/dist/npm/signature/interfaces/SignatureProps.d.ts +196 -0
  85. package/dist/npm/signature/interfaces/SignatureProps.js +2 -0
  86. package/dist/npm/signature/interfaces/index.d.ts +7 -0
  87. package/dist/npm/signature/interfaces/index.js +2 -0
  88. package/dist/npm/signature/utils/index.d.ts +4 -0
  89. package/dist/npm/signature/utils/index.js +14 -0
  90. package/dist/npm/slider/Slider.js +2 -6
  91. package/dist/npm/slider/SliderLabel.js +1 -2
  92. package/dist/npm/switch/Switch.js +5 -5
  93. package/dist/npm/textbox/Textbox.d.ts +69 -0
  94. package/dist/npm/textbox/Textbox.js +114 -0
  95. package/dist/systemjs/kendo-react-inputs.js +1 -1
  96. package/package.json +21 -16
@@ -56,13 +56,9 @@ var SliderWithoutContext = /** @class */ (function (_super) {
56
56
  return props.children;
57
57
  }
58
58
  return (React.createElement(React.Fragment, null,
59
- React.createElement(Button, { className: "k-button-decrease k-rounded-full",
60
- // rounded={'full'}
61
- icon: _this.props.vertical ? 'arrow-s' : 'arrow-w', title: props.decrementTitle, onClick: props.decrement }),
59
+ React.createElement(Button, { className: "k-button-decrease", rounded: 'full', icon: _this.props.vertical ? 'caret-alt-down' : 'caret-alt-left', title: props.decrementTitle, onClick: props.decrement }),
62
60
  props.children,
63
- React.createElement(Button, { className: "k-button-increase k-rounded-full",
64
- // rounded={'full'}
65
- icon: _this.props.vertical ? 'arrow-n' : 'arrow-e', title: props.incrementTitle, onClick: props.increment })));
61
+ React.createElement(Button, { className: "k-button-increase", rounded: 'full', icon: _this.props.vertical ? 'caret-alt-up' : 'caret-alt-right', title: props.incrementTitle, onClick: props.increment })));
66
62
  };
67
63
  /**
68
64
  * @hidden
@@ -26,6 +26,5 @@ export var SliderLabel = function (props) {
26
26
  ? { bottom: "".concat(props.position, "%") }
27
27
  : (_a = {}, _a[dir === 'rtl' ? 'right' : 'left'] = "".concat(props.position, "%"), _a);
28
28
  var tickStyle = props.vertical ? 'k-tick-vertical' : 'k-tick-horizontal';
29
- return (React.createElement("li", { ref: sliderLabelRef, className: "k-tick k-tick-large ".concat(tickStyle), title: props.title, style: __assign({ zIndex: 1, position: 'absolute' }, style) },
30
- React.createElement("span", __assign({}, (_b = {}, _b[SLIDER_LABEL_ATTRIBUTE] = true, _b), { className: "k-label", onClick: props.onClick }), props.children)));
29
+ return (React.createElement("li", { ref: sliderLabelRef, className: "k-tick k-tick-large ".concat(tickStyle), title: props.title, style: __assign({ zIndex: 1, position: 'absolute' }, style) }, props.children && React.createElement("span", __assign({}, (_b = {}, _b[SLIDER_LABEL_ATTRIBUTE] = true, _b), { className: "k-label", onClick: props.onClick }), props.children)));
31
30
  };
@@ -264,11 +264,11 @@ var SwitchWithoutContext = /** @class */ (function (_super) {
264
264
  }, tabIndex: getTabIndex(tabIndex, disabled, undefined), accessKey: this.props.accessKey }),
265
265
  this.dummyInput(this.value),
266
266
  React.createElement("span", { className: 'k-switch-label-on' }, onLabel),
267
- React.createElement("span", { className: 'k-switch-label-off' }, offLabel),
268
- React.createElement("span", { className: 'k-switch-thumb-wrap' },
269
- React.createElement("span", { className: classNames('k-switch-thumb', (_c = {},
270
- _c["k-rounded-".concat(thumbRounded)] = thumbRounded,
271
- _c)) })))));
267
+ React.createElement("span", { className: 'k-switch-label-off' }, offLabel)),
268
+ React.createElement("span", { className: 'k-switch-thumb-wrap' },
269
+ React.createElement("span", { className: classNames('k-switch-thumb', (_c = {},
270
+ _c["k-rounded-".concat(thumbRounded)] = thumbRounded,
271
+ _c)) }))));
272
272
  };
273
273
  SwitchWithoutContext.displayName = 'Switch';
274
274
  /**
@@ -0,0 +1,69 @@
1
+ import * as React from 'react';
2
+ import { BaseEvent, CustomComponent } from '@progress/kendo-react-common';
3
+ export interface TextBoxChangeEvent extends BaseEvent<TextBoxHandle> {
4
+ syntheticEvent: React.ChangeEvent<HTMLInputElement>;
5
+ value: React.InputHTMLAttributes<HTMLInputElement>['value'];
6
+ }
7
+ /**
8
+ * Represents the properties of the KendoReact [TextBox]({% slug api_inputs_textbox %}) component
9
+ */
10
+ export interface TextBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size' | 'prefix' | 'onChange'> {
11
+ /**
12
+ * Configures the `size` of the TextBox.
13
+ *
14
+ * The available options are:
15
+ * - small
16
+ * - medium
17
+ * - large
18
+ * - null&mdash;Does not set a size `className`.
19
+ *
20
+ * @default `medium`
21
+ */
22
+ size?: null | 'small' | 'medium' | 'large';
23
+ /**
24
+ * Configures the `roundness` of the TextBox.
25
+ *
26
+ * The available options are:
27
+ * - small
28
+ * - medium
29
+ * - large
30
+ * - full
31
+ * - null&mdash;Does not set a rounded `className`.
32
+ *
33
+ * @default `medium`
34
+ */
35
+ rounded?: null | 'small' | 'medium' | 'large' | 'full';
36
+ /**
37
+ * Configures the `fillMode` of the TextBox.
38
+ *
39
+ * The available options are:
40
+ * - solid
41
+ * - outline
42
+ * - flat
43
+ * - null&mdash;Does not set a fillMode `className`.
44
+ *
45
+ * @default `solid`
46
+ */
47
+ fillMode?: null | 'solid' | 'flat' | 'outline';
48
+ /**
49
+ * The `onChange` callback of the `input` element inside the TextBox.
50
+ */
51
+ onChange?: (event: TextBoxChangeEvent) => void;
52
+ /**
53
+ * Indicates if the component is in `valid` state
54
+ */
55
+ valid?: boolean;
56
+ prefix?: CustomComponent<any>;
57
+ suffix?: CustomComponent<any>;
58
+ }
59
+ /**
60
+ * Represent the `ref` of the TextBox component.
61
+ */
62
+ export declare type TextBoxHandle = {
63
+ element: HTMLInputElement | null;
64
+ value: TextBoxProps['value'];
65
+ };
66
+ /**
67
+ * Represents the [KendoReact TextBox component]({% slug overview_textbox %}).
68
+ */
69
+ export declare const TextBox: React.ForwardRefExoticComponent<TextBoxProps & React.RefAttributes<TextBoxHandle | null>>;
@@ -0,0 +1,111 @@
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 __rest = (this && this.__rest) || function (s, e) {
13
+ var t = {};
14
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
15
+ t[p] = s[p];
16
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
17
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
18
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
19
+ t[p[i]] = s[p[i]];
20
+ }
21
+ return t;
22
+ };
23
+ import * as React from 'react';
24
+ import * as PropTypes from 'prop-types';
25
+ import { classNames, kendoThemeMaps, useAsyncFocusBlur, useCustomComponent, validatePackage } from '@progress/kendo-react-common';
26
+ import { packageMetadata } from '../package-metadata';
27
+ ;
28
+ /**
29
+ * Represents the [KendoReact TextBox component]({% slug overview_textbox %}).
30
+ */
31
+ export var TextBox = React.forwardRef(function (props, ref) {
32
+ var _a;
33
+ validatePackage(packageMetadata);
34
+ var element = React.useRef(null);
35
+ var target = React.useRef(null);
36
+ var valueDuringChangeRef = React.useRef();
37
+ var valueGetter = React.useCallback(function () {
38
+ var _a;
39
+ if (valueDuringChangeRef.current !== undefined) {
40
+ return valueDuringChangeRef.current;
41
+ }
42
+ else {
43
+ return (_a = element.current) === null || _a === void 0 ? void 0 : _a.value;
44
+ }
45
+ }, []);
46
+ React.useImperativeHandle(target, function () {
47
+ var result = {
48
+ element: element.current
49
+ };
50
+ Object.defineProperty(result, 'value', { get: valueGetter });
51
+ return result;
52
+ });
53
+ React.useImperativeHandle(ref, function () { return target.current; });
54
+ var _b = props, size = _b.size, fillMode = _b.fillMode, rounded = _b.rounded, className = _b.className, dir = _b.dir, style = _b.style, _c = _b.prefix, prefix = _c === void 0 ? defaultProps.prefix : _c, _d = _b.suffix, suffix = _d === void 0 ? defaultProps.suffix : _d, valid = _b.valid,
55
+ // Destruct to avoid warning when used inside a form field
56
+ _modified = _b.modified, _touched = _b.touched, _visited = _b.visited, other = __rest(_b, ["size", "fillMode", "rounded", "className", "dir", "style", "prefix", "suffix", "valid", "modified", "touched", "visited"]);
57
+ var Prefix = useCustomComponent(prefix)[0];
58
+ var Suffix = useCustomComponent(suffix)[0];
59
+ var _e = React.useState(false), focused = _e[0], setFocused = _e[1];
60
+ var handleFocus = function (_) {
61
+ setFocused(true);
62
+ };
63
+ var handleBlur = function (_) {
64
+ setFocused(false);
65
+ };
66
+ var handleChange = React.useCallback(function (event) {
67
+ valueDuringChangeRef.current = event.target.value;
68
+ if (props.onChange) {
69
+ props.onChange.call(undefined, {
70
+ syntheticEvent: event,
71
+ nativeEvent: event.nativeEvent,
72
+ value: event.target.value,
73
+ target: target.current
74
+ });
75
+ }
76
+ valueDuringChangeRef.current = undefined;
77
+ }, [props.onChange]);
78
+ var _f = useAsyncFocusBlur({
79
+ onFocus: handleFocus,
80
+ onBlur: handleBlur,
81
+ onSyncFocus: props.onFocus,
82
+ onSyncBlur: props.onBlur
83
+ }), onFocus = _f.onFocus, onBlur = _f.onBlur;
84
+ return (React.createElement("span", { style: style, dir: dir, className: classNames('k-input', (_a = {},
85
+ _a["k-input-".concat(kendoThemeMaps.sizeMap[size] || size)] = size,
86
+ _a["k-input-".concat(fillMode)] = fillMode,
87
+ _a["k-rounded-".concat(kendoThemeMaps.roundedMap[rounded] || rounded)] = rounded,
88
+ _a), {
89
+ 'k-focus': focused,
90
+ 'k-required': props.required,
91
+ 'k-disabled': props.disabled,
92
+ 'k-invalid': props.valid === false
93
+ }, className), onFocus: onFocus, onBlur: onBlur },
94
+ React.createElement(Prefix, null),
95
+ React.createElement("input", __assign({ ref: element, className: "k-input-inner" }, other, { onChange: handleChange })),
96
+ React.createElement(Suffix, null)));
97
+ });
98
+ var defaultProps = {
99
+ prefix: function (_) { return null; },
100
+ suffix: function (_) { return null; },
101
+ size: 'medium',
102
+ rounded: 'medium',
103
+ fillMode: 'solid'
104
+ };
105
+ TextBox.propTypes = {
106
+ size: PropTypes.oneOf([null, 'small', 'medium', 'large']),
107
+ rounded: PropTypes.oneOf([null, 'small', 'medium', 'large', 'full']),
108
+ fillMode: PropTypes.oneOf([null, 'solid', 'flat', 'outline'])
109
+ };
110
+ TextBox.displayName = 'KendoReactTextBoxComponent';
111
+ TextBox.defaultProps = defaultProps;
@@ -151,6 +151,7 @@ exports.Checkbox = React.forwardRef(function (directProps, target) {
151
151
  _a["k-checkbox-".concat(kendo_react_common_1.kendoThemeMaps.sizeMap[size] || size)] = size,
152
152
  _a["k-rounded-".concat(kendo_react_common_1.kendoThemeMaps.roundedMap[rounded] || rounded)] = rounded,
153
153
  _a['k-indeterminate'] = indeterminateProp,
154
+ _a['k-disabled'] = disabled,
154
155
  _a['k-invalid k-invalid'] = !(isValid || validityStyles !== undefined || validityStyles === true),
155
156
  _a)), ref: elementRef, name: name, id: id || calculatedId, 'aria-labelledby': ariaLabelledBy, 'aria-describedby': ariaDescribedBy, checked: Boolean(checkedProp), disabled: disabled, tabIndex: (0, kendo_react_common_1.getTabIndex)(tabIndex, disabled), role: 'checkbox', required: required !== undefined ? required : false, 'aria-checked': currentChecked || checkedProp ?
156
157
  true :
@@ -71,7 +71,7 @@ var ColorInput = /** @class */ (function (_super) {
71
71
  var toggleButtonMessage = localizationService.toLanguageString(messages_1.colorGradientToggleInputsButton, messages_1.messages[messages_1.colorGradientToggleInputsButton]);
72
72
  return (React.createElement("div", { className: "k-colorgradient-inputs k-hstack" },
73
73
  React.createElement("div", { className: "k-vstack" },
74
- React.createElement(kendo_react_buttons_1.Button, { "aria-label": toggleButtonMessage, fillMode: 'flat', icon: 'arrows-kpi', className: "k-colorgradient-toggle-mode k-icon-button", onClick: this.onToggleModeChange.bind(this) })),
74
+ React.createElement(kendo_react_buttons_1.Button, { "aria-label": toggleButtonMessage, fillMode: 'flat', icon: 'caret-alt-expand', className: "k-colorgradient-toggle-mode k-icon-button", onClick: this.onToggleModeChange.bind(this) })),
75
75
  this.state.inputMode === 'hex' &&
76
76
  React.createElement("div", { className: "k-vstack k-flex-1" },
77
77
  React.createElement("span", { className: "k-hex-value k-textbox k-input" },
@@ -215,7 +215,7 @@ exports.ColorPicker = React.forwardRef(function (directProps, target) {
215
215
  (iconClassName || icon) && React.createElement("span", { className: (0, kendo_react_common_1.classNames)('k-color-preview-icon', iconClassName, (_b = {},
216
216
  _b["k-icon k-i-".concat(icon)] = (icon && !iconClassName),
217
217
  _b)) }),
218
- React.createElement("span", { className: "k-color-preview-mask", style: { backgroundColor: value } })))), button: (React.createElement(kendo_react_buttons_1.Button, { tabIndex: -1, type: "button", onClick: onClickHandler, className: "k-input-button", rounded: null, icon: 'arrow-s', "aria-label": localization.toLanguageString(messages_1.colorPickerDropdownButtonAriaLabel, messages_1.messages[messages_1.colorPickerDropdownButtonAriaLabel]) })), content: (React.createElement(React.Fragment, null,
218
+ React.createElement("span", { className: "k-color-preview-mask", style: { backgroundColor: value } })))), button: (React.createElement(kendo_react_buttons_1.Button, { tabIndex: -1, type: "button", onClick: onClickHandler, className: "k-input-button", rounded: null, icon: 'caret-alt-down', "aria-label": localization.toLanguageString(messages_1.colorPickerDropdownButtonAriaLabel, messages_1.messages[messages_1.colorPickerDropdownButtonAriaLabel]) })), content: (React.createElement(React.Fragment, null,
219
219
  (view === 'combo' || view === 'gradient') && (React.createElement(ColorGradient_1.ColorGradient, __assign({}, gradientSettings, { tabIndex: 0, ref: gradientRef, value: value, onChange: onChangeHandler }))),
220
220
  (view === 'combo' || view === 'palette') && (React.createElement(ColorPalette_1.ColorPalette, __assign({}, paletteSettings, { ref: paletteRef, value: value, onChange: onPaletteChangeHandler }))))) })));
221
221
  });
@@ -76,7 +76,7 @@ exports.FlatColorPicker = React.forwardRef(function (props, ref) {
76
76
  React.createElement("div", { className: "k-coloreditor-header-actions k-hstack" },
77
77
  (props.showClearButton && defaultProps.showClearButton) &&
78
78
  React.createElement(kendo_react_buttons_1.Button, { type: "button", fillMode: 'flat', onClick: handleResetColor },
79
- React.createElement("span", { className: "k-icon k-i-reset-color" })),
79
+ React.createElement("span", { className: "k-icon k-i-droplet-slash" })),
80
80
  (props.showPreview && defaultProps.showPreview) &&
81
81
  React.createElement("div", { className: "k-coloreditor-preview k-vstack" },
82
82
  React.createElement("span", { className: "k-coloreditor-preview-color k-color-preview", style: { background: colorValue } }),
@@ -0,0 +1,15 @@
1
+ import * as React from 'react';
2
+ /**
3
+ * Represent the `ref` of the `InputClearValue` component.
4
+ */
5
+ export declare type InputClearValueHandle = {
6
+ element: HTMLSpanElement | null;
7
+ };
8
+ /**
9
+ * Represents the `props` of the `InputClearValue` component.
10
+ */
11
+ export declare type InputClearValueProps = React.HTMLAttributes<HTMLSpanElement>;
12
+ /**
13
+ * Represents the KendoReact InputClearValue component.
14
+ */
15
+ export declare const InputClearValue: React.ForwardRefExoticComponent<InputClearValueProps & React.RefAttributes<InputClearValueHandle>>;
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ Object.defineProperty(exports, "__esModule", { value: true });
14
+ exports.InputClearValue = void 0;
15
+ var React = require("react");
16
+ var kendo_react_common_1 = require("@progress/kendo-react-common");
17
+ /**
18
+ * Represents the KendoReact InputClearValue component.
19
+ */
20
+ exports.InputClearValue = React.forwardRef(function (props, ref) {
21
+ var target = React.useRef(null);
22
+ var element = React.useRef(null);
23
+ React.useImperativeHandle(target, function () { return ({ element: element.current }); });
24
+ React.useImperativeHandle(ref, function () { return target.current; });
25
+ return (React.createElement("span", __assign({}, props, { className: (0, kendo_react_common_1.classNames)('k-clear-value', props.className) })));
26
+ });
27
+ exports.InputClearValue.displayName = 'KendoReactInputClearValue';
@@ -0,0 +1,15 @@
1
+ import * as React from 'react';
2
+ /**
3
+ * Represent the `ref` of the `InputPrefix` component.
4
+ */
5
+ export declare type InputPrefixHandle = {
6
+ element: HTMLSpanElement | null;
7
+ };
8
+ /**
9
+ * Represents the `props` of the `InputPrefix` component.
10
+ */
11
+ export declare type InputPrefixProps = React.HTMLAttributes<HTMLSpanElement>;
12
+ /**
13
+ * Represents the KendoReact InputPrefix component.
14
+ */
15
+ export declare const InputPrefix: React.ForwardRefExoticComponent<InputPrefixProps & React.RefAttributes<InputPrefixHandle>>;
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ Object.defineProperty(exports, "__esModule", { value: true });
14
+ exports.InputPrefix = void 0;
15
+ var kendo_react_common_1 = require("@progress/kendo-react-common");
16
+ var React = require("react");
17
+ /**
18
+ * Represents the KendoReact InputPrefix component.
19
+ */
20
+ exports.InputPrefix = React.forwardRef(function (props, ref) {
21
+ var target = React.useRef(null);
22
+ var element = React.useRef(null);
23
+ React.useImperativeHandle(target, function () { return ({ element: element.current }); });
24
+ React.useImperativeHandle(ref, function () { return target.current; });
25
+ return (React.createElement("span", __assign({}, props, { className: (0, kendo_react_common_1.classNames)('k-input-prefix', props.className) })));
26
+ });
27
+ exports.InputPrefix.displayName = 'KendoReactInputPrefix';
@@ -0,0 +1,15 @@
1
+ import * as React from 'react';
2
+ /**
3
+ * Represent the `ref` of the `InputSeparator` component.
4
+ */
5
+ export declare type InputSeparatorHandle = {
6
+ element: HTMLSpanElement | null;
7
+ };
8
+ /**
9
+ * Represents the `props` of the `InputSeparator` component.
10
+ */
11
+ export declare type InputSeparatorProps = React.HTMLAttributes<HTMLSpanElement>;
12
+ /**
13
+ * Represents the KendoReact InputSeparator component.
14
+ */
15
+ export declare const InputSeparator: React.ForwardRefExoticComponent<InputSeparatorProps & React.RefAttributes<InputSeparatorHandle>>;
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ Object.defineProperty(exports, "__esModule", { value: true });
14
+ exports.InputSeparator = void 0;
15
+ var React = require("react");
16
+ var kendo_react_common_1 = require("@progress/kendo-react-common");
17
+ /**
18
+ * Represents the KendoReact InputSeparator component.
19
+ */
20
+ exports.InputSeparator = React.forwardRef(function (props, ref) {
21
+ var target = React.useRef(null);
22
+ var element = React.useRef(null);
23
+ React.useImperativeHandle(target, function () { return ({ element: element.current }); });
24
+ React.useImperativeHandle(ref, function () { return target.current; });
25
+ return (React.createElement("span", __assign({}, props, { className: (0, kendo_react_common_1.classNames)('k-input-separator', props.className) })));
26
+ });
27
+ exports.InputSeparator.displayName = 'KendoReactInputSeparator';
@@ -0,0 +1,15 @@
1
+ import * as React from 'react';
2
+ /**
3
+ * Represent the `ref` of the `InputSuffix` component.
4
+ */
5
+ export declare type InputSuffixHandle = {
6
+ element: HTMLSpanElement | null;
7
+ };
8
+ /**
9
+ * Represents the `props` of the `InputSuffix` component.
10
+ */
11
+ export declare type InputSuffixProps = React.HTMLAttributes<HTMLSpanElement>;
12
+ /**
13
+ * Represents the KendoReact InputSuffix component.
14
+ */
15
+ export declare const InputSuffix: React.ForwardRefExoticComponent<InputSuffixProps & React.RefAttributes<InputSuffixHandle>>;
@@ -0,0 +1,27 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ Object.defineProperty(exports, "__esModule", { value: true });
14
+ exports.InputSuffix = void 0;
15
+ var React = require("react");
16
+ var kendo_react_common_1 = require("@progress/kendo-react-common");
17
+ /**
18
+ * Represents the KendoReact InputSuffix component.
19
+ */
20
+ exports.InputSuffix = React.forwardRef(function (props, ref) {
21
+ var target = React.useRef(null);
22
+ var element = React.useRef(null);
23
+ React.useImperativeHandle(target, function () { return ({ element: element.current }); });
24
+ React.useImperativeHandle(ref, function () { return target.current; });
25
+ return (React.createElement("span", __assign({}, props, { className: (0, kendo_react_common_1.classNames)('k-input-suffix', props.className) })));
26
+ });
27
+ exports.InputSuffix.displayName = 'KendoReactInputSuffix';
@@ -0,0 +1,14 @@
1
+ import { IconHandle, IconProps } from '@progress/kendo-react-common';
2
+ import * as React from 'react';
3
+ /**
4
+ * Represent the `ref` of the `InputValidationIcon` component.
5
+ */
6
+ export declare type InputValidationIconHandle = IconHandle;
7
+ /**
8
+ * Represents the `props` of the `InputValidationIcon` component.
9
+ */
10
+ export declare type InputValidationIconProps = IconProps;
11
+ /**
12
+ * Represents the KendoReact InputValidationIcon component.
13
+ */
14
+ export declare const InputValidationIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<IconHandle>>;
@@ -0,0 +1,23 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ Object.defineProperty(exports, "__esModule", { value: true });
14
+ exports.InputValidationIcon = void 0;
15
+ var kendo_react_common_1 = require("@progress/kendo-react-common");
16
+ var React = require("react");
17
+ /**
18
+ * Represents the KendoReact InputValidationIcon component.
19
+ */
20
+ exports.InputValidationIcon = React.forwardRef(function (props, ref) {
21
+ return React.createElement(kendo_react_common_1.Icon, __assign({ ref: ref }, props, { className: (0, kendo_react_common_1.classNames)('k-input-validation-icon', props.className) }));
22
+ });
23
+ exports.InputValidationIcon.displayName = 'KendoReactInputValidationIcon';
@@ -50,3 +50,11 @@ export * from './textarea/interfaces/TextAreaFocusEvent';
50
50
  export * from './rating/Rating';
51
51
  export * from './rating/RatingItem';
52
52
  export * from './rating/models/index';
53
+ export * from './signature/Signature';
54
+ export * from './signature/interfaces';
55
+ export { TextBox, TextBoxProps, TextBoxHandle, TextBoxChangeEvent } from './textbox/Textbox';
56
+ export { InputClearValue, InputClearValueProps, InputClearValueHandle } from './input/InputClearValue';
57
+ export { InputPrefix, InputPrefixProps, InputPrefixHandle } from './input/InputPrefix';
58
+ export { InputSeparator, InputSeparatorProps, InputSeparatorHandle } from './input/InputSeparator';
59
+ export { InputSuffix, InputSuffixProps, InputSuffixHandle } from './input/InputSuffix';
60
+ export { InputValidationIcon, InputValidationIconProps, InputValidationIconHandle } from './input/InputValidationIcon';
package/dist/npm/main.js CHANGED
@@ -14,7 +14,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
14
  for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
15
  };
16
16
  Object.defineProperty(exports, "__esModule", { value: true });
17
- exports.SwitchPropsContext = exports.Switch = exports.SliderPropsContext = exports.Slider = exports.MaskedTextBoxPropsContext = exports.MaskedTextBox = exports.InputPropsContext = exports.Input = exports.ColorPalettePropsContext = exports.ColorPalette = exports.ColorGradientPropsContext = exports.ColorGradient = void 0;
17
+ exports.InputValidationIcon = exports.InputSuffix = exports.InputSeparator = exports.InputPrefix = exports.InputClearValue = exports.TextBox = exports.SwitchPropsContext = exports.Switch = exports.SliderPropsContext = exports.Slider = exports.MaskedTextBoxPropsContext = exports.MaskedTextBox = exports.InputPropsContext = exports.Input = exports.ColorPalettePropsContext = exports.ColorPalette = exports.ColorGradientPropsContext = exports.ColorGradient = void 0;
18
18
  var ColorGradient_1 = require("./colors/ColorGradient");
19
19
  Object.defineProperty(exports, "ColorGradient", { enumerable: true, get: function () { return ColorGradient_1.ColorGradient; } });
20
20
  Object.defineProperty(exports, "ColorGradientPropsContext", { enumerable: true, get: function () { return ColorGradient_1.ColorGradientPropsContext; } });
@@ -75,3 +75,17 @@ __exportStar(require("./textarea/interfaces/TextAreaFocusEvent"), exports);
75
75
  __exportStar(require("./rating/Rating"), exports);
76
76
  __exportStar(require("./rating/RatingItem"), exports);
77
77
  __exportStar(require("./rating/models/index"), exports);
78
+ __exportStar(require("./signature/Signature"), exports);
79
+ __exportStar(require("./signature/interfaces"), exports);
80
+ var Textbox_1 = require("./textbox/Textbox");
81
+ Object.defineProperty(exports, "TextBox", { enumerable: true, get: function () { return Textbox_1.TextBox; } });
82
+ var InputClearValue_1 = require("./input/InputClearValue");
83
+ Object.defineProperty(exports, "InputClearValue", { enumerable: true, get: function () { return InputClearValue_1.InputClearValue; } });
84
+ var InputPrefix_1 = require("./input/InputPrefix");
85
+ Object.defineProperty(exports, "InputPrefix", { enumerable: true, get: function () { return InputPrefix_1.InputPrefix; } });
86
+ var InputSeparator_1 = require("./input/InputSeparator");
87
+ Object.defineProperty(exports, "InputSeparator", { enumerable: true, get: function () { return InputSeparator_1.InputSeparator; } });
88
+ var InputSuffix_1 = require("./input/InputSuffix");
89
+ Object.defineProperty(exports, "InputSuffix", { enumerable: true, get: function () { return InputSuffix_1.InputSuffix; } });
90
+ var InputValidationIcon_1 = require("./input/InputValidationIcon");
91
+ Object.defineProperty(exports, "InputValidationIcon", { enumerable: true, get: function () { return InputValidationIcon_1.InputValidationIcon; } });
@@ -102,6 +102,18 @@ export declare const colorPickerDropdownButtonAriaLabel = "colorPicker.dropdownB
102
102
  * @hidden
103
103
  */
104
104
  export declare const ratingAriaLabel = "rating.ariaLabel";
105
+ /**
106
+ * @hidden
107
+ */
108
+ export declare const signatureClear = "signature.clear";
109
+ /**
110
+ * @hidden
111
+ */
112
+ export declare const signatureMaximize = "signature.maximize";
113
+ /**
114
+ * @hidden
115
+ */
116
+ export declare const signatureMinimize = "signature.minimize";
105
117
  /**
106
118
  * @hidden
107
119
  */
@@ -132,4 +144,7 @@ export declare const messages: {
132
144
  "switch.validation": string;
133
145
  "colorPicker.dropdownButtonAriaLabel": string;
134
146
  "rating.ariaLabel": string;
147
+ "signature.clear": string;
148
+ "signature.maximize": string;
149
+ "signature.minimize": string;
135
150
  };
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  var _a;
3
3
  Object.defineProperty(exports, "__esModule", { value: true });
4
- exports.messages = exports.ratingAriaLabel = exports.colorPickerDropdownButtonAriaLabel = exports.switchValidation = exports.radioButtonValidation = exports.checkboxOptionalText = exports.checkboxValidation = exports.flatColorPickerApplyBtn = exports.flatColorPickerCancelBtn = exports.colorGradientToggleInputsButton = exports.colorGradientAlphaSliderLabel = exports.colorGradientHueSliderLabel = exports.colorGradientFail = exports.colorGradientPass = exports.colorGradientAAALevel = exports.colorGradientAALevel = exports.colorGradientContrastRatio = exports.colorGradientHex = exports.colorGradientA = exports.colorGradientB = exports.colorGradientG = exports.colorGradientR = exports.sliderDragTitle = exports.sliderDecreaseValue = exports.sliderIncreaseValue = exports.numericDecreaseValue = exports.numericIncreaseValue = void 0;
4
+ exports.messages = exports.signatureMinimize = exports.signatureMaximize = exports.signatureClear = exports.ratingAriaLabel = exports.colorPickerDropdownButtonAriaLabel = exports.switchValidation = exports.radioButtonValidation = exports.checkboxOptionalText = exports.checkboxValidation = exports.flatColorPickerApplyBtn = exports.flatColorPickerCancelBtn = exports.colorGradientToggleInputsButton = exports.colorGradientAlphaSliderLabel = exports.colorGradientHueSliderLabel = exports.colorGradientFail = exports.colorGradientPass = exports.colorGradientAAALevel = exports.colorGradientAALevel = exports.colorGradientContrastRatio = exports.colorGradientHex = exports.colorGradientA = exports.colorGradientB = exports.colorGradientG = exports.colorGradientR = exports.sliderDragTitle = exports.sliderDecreaseValue = exports.sliderIncreaseValue = exports.numericDecreaseValue = exports.numericIncreaseValue = void 0;
5
5
  /**
6
6
  * @hidden
7
7
  */
@@ -106,6 +106,18 @@ exports.colorPickerDropdownButtonAriaLabel = 'colorPicker.dropdownButtonAriaLabe
106
106
  * @hidden
107
107
  */
108
108
  exports.ratingAriaLabel = 'rating.ariaLabel';
109
+ /**
110
+ * @hidden
111
+ */
112
+ exports.signatureClear = 'signature.clear';
113
+ /**
114
+ * @hidden
115
+ */
116
+ exports.signatureMaximize = 'signature.maximize';
117
+ /**
118
+ * @hidden
119
+ */
120
+ exports.signatureMinimize = 'signature.minimize';
109
121
  /**
110
122
  * @hidden
111
123
  */
@@ -136,4 +148,7 @@ exports.messages = (_a = {},
136
148
  _a[exports.switchValidation] = 'Please turn on if you want to proceed!',
137
149
  _a[exports.colorPickerDropdownButtonAriaLabel] = 'Select',
138
150
  _a[exports.ratingAriaLabel] = 'Rating',
151
+ _a[exports.signatureClear] = 'Clear',
152
+ _a[exports.signatureMaximize] = 'Maximize',
153
+ _a[exports.signatureMinimize] = 'Minimize',
139
154
  _a);
@@ -275,8 +275,8 @@ exports.NumericTextBox = React.forwardRef(function (directProps, target) {
275
275
  props.children,
276
276
  props.spinners &&
277
277
  (React.createElement("span", { className: "k-input-spinner k-spin-button", onMouseDown: onMouseDown },
278
- React.createElement(kendo_react_buttons_1.Button, { tabIndex: -1, type: "button", icon: 'arrow-n', rounded: null, className: "k-spinner-increase", "aria-label": localizationService.toLanguageString(messages_1.numericIncreaseValue, messages_1.messages[messages_1.numericIncreaseValue]), title: localizationService.toLanguageString(messages_1.numericIncreaseValue, messages_1.messages[messages_1.numericIncreaseValue]), onClick: onIncrease }),
279
- React.createElement(kendo_react_buttons_1.Button, { tabIndex: -1, type: "button", icon: 'arrow-s', rounded: null, className: "k-spinner-decrease", "aria-label": localizationService.toLanguageString(messages_1.numericDecreaseValue, messages_1.messages[messages_1.numericDecreaseValue]), title: localizationService.toLanguageString(messages_1.numericDecreaseValue, messages_1.messages[messages_1.numericDecreaseValue]), onClick: onDecrease })))));
278
+ React.createElement(kendo_react_buttons_1.Button, { tabIndex: -1, type: "button", icon: 'caret-alt-up', rounded: null, className: "k-spinner-increase", "aria-label": localizationService.toLanguageString(messages_1.numericIncreaseValue, messages_1.messages[messages_1.numericIncreaseValue]), title: localizationService.toLanguageString(messages_1.numericIncreaseValue, messages_1.messages[messages_1.numericIncreaseValue]), onClick: onIncrease }),
279
+ React.createElement(kendo_react_buttons_1.Button, { tabIndex: -1, type: "button", icon: 'caret-alt-down', rounded: null, className: "k-spinner-decrease", "aria-label": localizationService.toLanguageString(messages_1.numericDecreaseValue, messages_1.messages[messages_1.numericDecreaseValue]), title: localizationService.toLanguageString(messages_1.numericDecreaseValue, messages_1.messages[messages_1.numericDecreaseValue]), onClick: onDecrease })))));
280
280
  return props.label
281
281
  ? (React.createElement(kendo_react_labels_1.FloatingLabel, { label: props.label, editorId: inputId, editorValue: looseValue === null ? '' : looseValue, editorValid: isValid, editorDisabled: props.disabled, editorPlaceholder: props.placeholder, children: numerictextbox, style: { width: props.width }, dir: props.dir }))
282
282
  : numerictextbox;
@@ -8,7 +8,7 @@ exports.packageMetadata = {
8
8
  name: '@progress/kendo-react-inputs',
9
9
  productName: 'KendoReact',
10
10
  productCodes: ['KENDOUIREACT', 'KENDOUICOMPLETE'],
11
- publishDate: 1661527419,
11
+ publishDate: 1662114830,
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
  };
@@ -0,0 +1,14 @@
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>>;