@progress/kendo-react-inputs 5.18.0-dev.202309011136 → 5.18.0-dev.202309011146

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 (9) hide show
  1. package/dist/cdn/js/kendo-react-inputs.js +1 -1
  2. package/dist/es/colors/FlatColorPicker.d.ts +5 -1
  3. package/dist/es/colors/FlatColorPicker.js +33 -5
  4. package/dist/es/package-metadata.js +1 -1
  5. package/dist/npm/colors/FlatColorPicker.d.ts +5 -1
  6. package/dist/npm/colors/FlatColorPicker.js +33 -5
  7. package/dist/npm/package-metadata.js +1 -1
  8. package/dist/systemjs/kendo-react-inputs.js +1 -1
  9. package/package.json +16 -16
package/dist/es/colors/FlatColorPicker.d.ts CHANGED
@@ -41,7 +41,11 @@ export interface FlatColorPickerProps {
41
41
  */
42
42
  defaultValue?: string;
43
43
  /**
44
- * The event handler that will be fired when the user edits the value.
44
+ * The event handler that will be fired when the user changes the preview color.
45
+ */
46
+ onPreviewChange?: (event: FlatColorPickerChangeEvent) => void;
47
+ /**
48
+ * The event handler that will be fired when the user click the "Apply" button or on blur when the "Apply" button is not present.
45
49
  */
46
50
  onChange?: (event: FlatColorPickerChangeEvent) => void;
47
51
  /**
package/dist/es/colors/FlatColorPicker.js CHANGED
@@ -35,6 +35,9 @@ export var FlatColorPicker = React.forwardRef(function (props, ref) {
35
35
  var _f = React.useState(props.value || defaultValue), colorValue = _f[0], setColorValue = _f[1];
36
36
  var _g = React.useState(props.value || defaultValue), prevColor = _g[0], setPrevColor = _g[1];
37
37
  var value = props.value !== undefined ? props.value : prevColor;
38
+ React.useEffect(function () {
39
+ setColorValue(props.value || defaultValue);
40
+ }, [props.value, defaultValue]);
38
41
  var localizationService = useLocalization();
39
42
  var focus = React.useCallback(function () {
40
43
  if (target.current) {
@@ -53,12 +56,28 @@ export var FlatColorPicker = React.forwardRef(function (props, ref) {
53
56
  setColorGradientView(!colorGradientView);
54
57
  }
55
58
  }, [colorGradientView]);
56
- var handleResetColor = React.useCallback(function () {
59
+ var handleResetColor = React.useCallback(function (event) {
57
60
  setColorValue(defaultValue);
58
- }, [defaultValue]);
61
+ if (props.onPreviewChange) {
62
+ var ev = {
63
+ value: defaultValue,
64
+ nativeEvent: event.nativeEvent,
65
+ syntheticEvent: event
66
+ };
67
+ props.onPreviewChange.call(undefined, ev);
68
+ }
69
+ }, [defaultValue, props.onPreviewChange]);
59
70
  var handleColorChange = React.useCallback(function (event) {
60
71
  setColorValue(event.value);
61
- }, []);
72
+ if (props.onPreviewChange) {
73
+ var ev = {
74
+ value: event.value,
75
+ nativeEvent: event.nativeEvent,
76
+ syntheticEvent: event.syntheticEvent
77
+ };
78
+ props.onPreviewChange.call(undefined, ev);
79
+ }
80
+ }, [props.onPreviewChange]);
62
81
  var handleApplyBtnClick = React.useCallback(function (event) {
63
82
  setPrevColor(colorValue);
64
83
  if (props.onChange) {
@@ -73,9 +92,17 @@ export var FlatColorPicker = React.forwardRef(function (props, ref) {
73
92
  var handleCancelBtnClick = React.useCallback(function () {
74
93
  setPrevColor(defaultColor);
75
94
  }, []);
76
- var handlePrevColorClick = React.useCallback(function () {
95
+ var handlePrevColorClick = React.useCallback(function (event) {
77
96
  setColorValue(prevColor);
78
- }, [prevColor]);
97
+ if (props.onPreviewChange) {
98
+ var ev = {
99
+ value: prevColor,
100
+ nativeEvent: event.nativeEvent,
101
+ syntheticEvent: event
102
+ };
103
+ props.onPreviewChange.call(undefined, ev);
104
+ }
105
+ }, [prevColor, props.onPreviewChange]);
79
106
  var handleFocus = React.useCallback(function (event) {
80
107
  if (flatColorPickerRef.current && event.nativeEvent.target instanceof HTMLInputElement === false) {
81
108
  flatColorPickerRef.current.focus();
@@ -131,6 +158,7 @@ var propTypes = {
131
158
  className: PropTypes.string,
132
159
  value: PropTypes.string,
133
160
  defaultValue: PropTypes.string,
161
+ onPreviewChange: PropTypes.func,
134
162
  onChange: PropTypes.func,
135
163
  opacity: PropTypes.bool,
136
164
  format: PropTypes.any,
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: 1693566524,
8
+ publishDate: 1693566905,
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/npm/colors/FlatColorPicker.d.ts CHANGED
@@ -41,7 +41,11 @@ export interface FlatColorPickerProps {
41
41
  */
42
42
  defaultValue?: string;
43
43
  /**
44
- * The event handler that will be fired when the user edits the value.
44
+ * The event handler that will be fired when the user changes the preview color.
45
+ */
46
+ onPreviewChange?: (event: FlatColorPickerChangeEvent) => void;
47
+ /**
48
+ * The event handler that will be fired when the user click the "Apply" button or on blur when the "Apply" button is not present.
45
49
  */
46
50
  onChange?: (event: FlatColorPickerChangeEvent) => void;
47
51
  /**
package/dist/npm/colors/FlatColorPicker.js CHANGED
@@ -38,6 +38,9 @@ exports.FlatColorPicker = React.forwardRef(function (props, ref) {
38
38
  var _f = React.useState(props.value || defaultValue), colorValue = _f[0], setColorValue = _f[1];
39
39
  var _g = React.useState(props.value || defaultValue), prevColor = _g[0], setPrevColor = _g[1];
40
40
  var value = props.value !== undefined ? props.value : prevColor;
41
+ React.useEffect(function () {
42
+ setColorValue(props.value || defaultValue);
43
+ }, [props.value, defaultValue]);
41
44
  var localizationService = (0, kendo_react_intl_1.useLocalization)();
42
45
  var focus = React.useCallback(function () {
43
46
  if (target.current) {
@@ -56,12 +59,28 @@ exports.FlatColorPicker = React.forwardRef(function (props, ref) {
56
59
  setColorGradientView(!colorGradientView);
57
60
  }
58
61
  }, [colorGradientView]);
59
- var handleResetColor = React.useCallback(function () {
62
+ var handleResetColor = React.useCallback(function (event) {
60
63
  setColorValue(defaultValue);
61
- }, [defaultValue]);
64
+ if (props.onPreviewChange) {
65
+ var ev = {
66
+ value: defaultValue,
67
+ nativeEvent: event.nativeEvent,
68
+ syntheticEvent: event
69
+ };
70
+ props.onPreviewChange.call(undefined, ev);
71
+ }
72
+ }, [defaultValue, props.onPreviewChange]);
62
73
  var handleColorChange = React.useCallback(function (event) {
63
74
  setColorValue(event.value);
64
- }, []);
75
+ if (props.onPreviewChange) {
76
+ var ev = {
77
+ value: event.value,
78
+ nativeEvent: event.nativeEvent,
79
+ syntheticEvent: event.syntheticEvent
80
+ };
81
+ props.onPreviewChange.call(undefined, ev);
82
+ }
83
+ }, [props.onPreviewChange]);
65
84
  var handleApplyBtnClick = React.useCallback(function (event) {
66
85
  setPrevColor(colorValue);
67
86
  if (props.onChange) {
@@ -76,9 +95,17 @@ exports.FlatColorPicker = React.forwardRef(function (props, ref) {
76
95
  var handleCancelBtnClick = React.useCallback(function () {
77
96
  setPrevColor(defaultColor);
78
97
  }, []);
79
- var handlePrevColorClick = React.useCallback(function () {
98
+ var handlePrevColorClick = React.useCallback(function (event) {
80
99
  setColorValue(prevColor);
81
- }, [prevColor]);
100
+ if (props.onPreviewChange) {
101
+ var ev = {
102
+ value: prevColor,
103
+ nativeEvent: event.nativeEvent,
104
+ syntheticEvent: event
105
+ };
106
+ props.onPreviewChange.call(undefined, ev);
107
+ }
108
+ }, [prevColor, props.onPreviewChange]);
82
109
  var handleFocus = React.useCallback(function (event) {
83
110
  if (flatColorPickerRef.current && event.nativeEvent.target instanceof HTMLInputElement === false) {
84
111
  flatColorPickerRef.current.focus();
@@ -134,6 +161,7 @@ var propTypes = {
134
161
  className: PropTypes.string,
135
162
  value: PropTypes.string,
136
163
  defaultValue: PropTypes.string,
164
+ onPreviewChange: PropTypes.func,
137
165
  onChange: PropTypes.func,
138
166
  opacity: PropTypes.bool,
139
167
  format: PropTypes.any,
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: 1693566524,
11
+ publishDate: 1693566905,
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
  };