@webiny/ui 5.40.3 → 5.40.4-beta.0
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.
|
@@ -10,6 +10,7 @@ var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/obje
|
|
|
10
10
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
11
11
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
12
12
|
var _react = _interopRequireWildcard(require("react"));
|
|
13
|
+
var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
|
|
13
14
|
var _excluded = ["children"];
|
|
14
15
|
var emptyFunction = function emptyFunction() {
|
|
15
16
|
return undefined;
|
|
@@ -39,9 +40,12 @@ var DelayedOnChange = exports.DelayedOnChange = function DelayedOnChange(_ref) {
|
|
|
39
40
|
setValue = _useState2[1];
|
|
40
41
|
// Sync state and props
|
|
41
42
|
(0, _react.useEffect)(function () {
|
|
42
|
-
if
|
|
43
|
-
|
|
43
|
+
// Do not update local state, if the incoming value is the same as the local state.
|
|
44
|
+
// This is primarily an optimization for non-scalar values (objects).
|
|
45
|
+
if ((0, _isEqual.default)(initialValue, value)) {
|
|
46
|
+
return;
|
|
44
47
|
}
|
|
48
|
+
setValue(initialValue);
|
|
45
49
|
}, [initialValue]);
|
|
46
50
|
var localTimeout = _react.default.useRef(null);
|
|
47
51
|
var applyValue = function applyValue(value) {
|
|
@@ -58,6 +62,10 @@ var DelayedOnChange = exports.DelayedOnChange = function DelayedOnChange(_ref) {
|
|
|
58
62
|
|
|
59
63
|
// this is fired upon change value state
|
|
60
64
|
var onValueStateChanged = function onValueStateChanged(nextValue) {
|
|
65
|
+
// We don't want to execute callbacks, if the value hasn't changed.
|
|
66
|
+
if ((0, _isEqual.default)(nextValue, initialValue)) {
|
|
67
|
+
return;
|
|
68
|
+
}
|
|
61
69
|
localTimeout.current && clearTimeout(localTimeout.current);
|
|
62
70
|
localTimeout.current = null;
|
|
63
71
|
localTimeout.current = setTimeout(function () {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_react","_interopRequireWildcard","require","_excluded","emptyFunction","undefined","DelayedOnChange","exports","_ref","children","other","_objectWithoutProperties2","default","firstMount","useRef","onChange","_other$delay","delay","initialValue","value","_useState","useState","_useState2","_slicedToArray2","setValue","useEffect","localTimeout","React","applyValue","current","clearTimeout","onChangeLocal","useCallback","onValueStateChanged","nextValue","setTimeout","newProps","_objectSpread2","renderProp","child","cloneElement","props","realOnKeyDown","onKeyDown","realOnBlur","onBlur","ev","persist","target","key"],"sources":["DelayedOnChange.ts"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\n\nconst emptyFunction = (): undefined => {\n return undefined;\n};\n\nexport interface ApplyValueCb {\n (value: string): void;\n}\n/**\n * This component is used to wrap Input and Textarea components to optimize form re-render.\n * These 2 are the only components that trigger form model change on each character input.\n * This means, whenever you type a letter an entire form re-renders.\n * On complex forms you will feel and see a significant delay if this component is not used.\n *\n * The logic behind this component is to serve as a middleware between Form and Input/Textarea, and only notify form of a change when\n * a user stops typing for given period of time (400ms by default).\n */\nexport interface OnChangeCallable {\n (value: string, cb?: ApplyValueCb): void;\n}\n\ninterface OnBlurCallable {\n (ev: React.SyntheticEvent): void;\n}\n\ninterface OnKeyDownCallable {\n (ev: React.KeyboardEvent<HTMLInputElement>): void;\n}\n\ninterface ChildrenCallableParams {\n value: string;\n onChange: OnChangeCallable;\n}\n\ninterface ChildrenCallable {\n (params: ChildrenCallableParams): React.ReactElement;\n}\n\nexport interface DelayedOnChangeProps {\n value?: string;\n delay?: number;\n onChange?: OnChangeCallable;\n onBlur?: OnBlurCallable;\n onKeyDown?: OnKeyDownCallable;\n children: React.ReactNode | ChildrenCallable;\n}\n\nexport const DelayedOnChange = ({ children, ...other }: DelayedOnChangeProps) => {\n const firstMount = useRef(true);\n const { onChange, delay = 400, value: initialValue } = other;\n const [value, setValue] = useState<string | undefined>(initialValue);\n // Sync state and props\n useEffect(() => {\n if (initialValue
|
|
1
|
+
{"version":3,"names":["_react","_interopRequireWildcard","require","_isEqual","_interopRequireDefault","_excluded","emptyFunction","undefined","DelayedOnChange","exports","_ref","children","other","_objectWithoutProperties2","default","firstMount","useRef","onChange","_other$delay","delay","initialValue","value","_useState","useState","_useState2","_slicedToArray2","setValue","useEffect","isEqual","localTimeout","React","applyValue","current","clearTimeout","onChangeLocal","useCallback","onValueStateChanged","nextValue","setTimeout","newProps","_objectSpread2","renderProp","child","cloneElement","props","realOnKeyDown","onKeyDown","realOnBlur","onBlur","ev","persist","target","key"],"sources":["DelayedOnChange.ts"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport isEqual from \"lodash/isEqual\";\n\nconst emptyFunction = (): undefined => {\n return undefined;\n};\n\nexport interface ApplyValueCb {\n (value: string): void;\n}\n/**\n * This component is used to wrap Input and Textarea components to optimize form re-render.\n * These 2 are the only components that trigger form model change on each character input.\n * This means, whenever you type a letter an entire form re-renders.\n * On complex forms you will feel and see a significant delay if this component is not used.\n *\n * The logic behind this component is to serve as a middleware between Form and Input/Textarea, and only notify form of a change when\n * a user stops typing for given period of time (400ms by default).\n */\nexport interface OnChangeCallable {\n (value: string, cb?: ApplyValueCb): void;\n}\n\ninterface OnBlurCallable {\n (ev: React.SyntheticEvent): void;\n}\n\ninterface OnKeyDownCallable {\n (ev: React.KeyboardEvent<HTMLInputElement>): void;\n}\n\ninterface ChildrenCallableParams {\n value: string;\n onChange: OnChangeCallable;\n}\n\ninterface ChildrenCallable {\n (params: ChildrenCallableParams): React.ReactElement;\n}\n\nexport interface DelayedOnChangeProps {\n value?: string;\n delay?: number;\n onChange?: OnChangeCallable;\n onBlur?: OnBlurCallable;\n onKeyDown?: OnKeyDownCallable;\n children: React.ReactNode | ChildrenCallable;\n}\n\nexport const DelayedOnChange = ({ children, ...other }: DelayedOnChangeProps) => {\n const firstMount = useRef(true);\n const { onChange, delay = 400, value: initialValue } = other;\n const [value, setValue] = useState<string | undefined>(initialValue);\n // Sync state and props\n useEffect(() => {\n // Do not update local state, if the incoming value is the same as the local state.\n // This is primarily an optimization for non-scalar values (objects).\n if (isEqual(initialValue, value)) {\n return;\n }\n\n setValue(initialValue);\n }, [initialValue]);\n\n const localTimeout = React.useRef<number | null>(null);\n\n const applyValue = (value: string) => {\n localTimeout.current && clearTimeout(localTimeout.current);\n localTimeout.current = null;\n if (!onChange) {\n return;\n }\n onChange(value);\n };\n\n const onChangeLocal = React.useCallback((value: string) => {\n setValue(value);\n }, []);\n\n // this is fired upon change value state\n const onValueStateChanged = (nextValue: string) => {\n // We don't want to execute callbacks, if the value hasn't changed.\n if (isEqual(nextValue, initialValue)) {\n return;\n }\n\n localTimeout.current && clearTimeout(localTimeout.current);\n localTimeout.current = null;\n localTimeout.current = setTimeout(() => applyValue(nextValue), delay) as unknown as number;\n };\n\n // need to clear the timeout when unmounting the component\n useEffect(() => {\n return () => {\n if (!localTimeout.current) {\n return;\n }\n clearTimeout(localTimeout.current);\n localTimeout.current = null;\n };\n }, []);\n\n useEffect(() => {\n if (firstMount.current) {\n firstMount.current = false;\n return;\n }\n\n onValueStateChanged(value || \"\");\n }, [value]);\n\n const newProps = {\n ...other,\n value: value || \"\",\n onChange: onChangeLocal\n };\n\n const renderProp = typeof children === \"function\" ? (children as ChildrenCallable) : null;\n const child = renderProp\n ? renderProp(newProps)\n : React.cloneElement(children as unknown as React.ReactElement, newProps);\n\n const props = { ...child.props };\n const realOnKeyDown = props.onKeyDown || emptyFunction;\n const realOnBlur = props.onBlur || emptyFunction;\n\n // Need to apply value if input lost focus\n const onBlur: OnBlurCallable = ev => {\n if (!ev[\"persist\"]) {\n return;\n }\n ev.persist();\n applyValue((ev.target as HTMLInputElement).value);\n realOnBlur(ev);\n };\n\n // Need to listen for TAB key to apply new value immediately, without delay. Otherwise validation will be triggered with old value.\n const onKeyDown: OnKeyDownCallable = ev => {\n ev.persist();\n if (ev.key === \"Tab\") {\n applyValue((ev.target as HTMLInputElement).value);\n realOnKeyDown(ev);\n } else if (ev.key === \"Enter\" && props[\"data-on-enter\"]) {\n applyValue((ev.target as HTMLInputElement).value);\n realOnKeyDown(ev);\n } else {\n realOnKeyDown(ev);\n }\n };\n\n return React.cloneElement(child, { ...props, onBlur, onKeyDown });\n};\n"],"mappings":"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","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@webiny/ui",
|
|
3
|
-
"version": "5.40.
|
|
3
|
+
"version": "5.40.4-beta.0",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -81,10 +81,10 @@
|
|
|
81
81
|
"@types/react-custom-scrollbars": "4.0.10",
|
|
82
82
|
"@types/react-transition-group": "4.4.5",
|
|
83
83
|
"@types/shortid": "0.0.29",
|
|
84
|
-
"@webiny/cli": "5.40.
|
|
85
|
-
"@webiny/form": "5.40.
|
|
86
|
-
"@webiny/project-utils": "5.40.
|
|
87
|
-
"@webiny/validation": "5.40.
|
|
84
|
+
"@webiny/cli": "5.40.4-beta.0",
|
|
85
|
+
"@webiny/form": "5.40.4-beta.0",
|
|
86
|
+
"@webiny/project-utils": "5.40.4-beta.0",
|
|
87
|
+
"@webiny/validation": "5.40.4-beta.0",
|
|
88
88
|
"babel-loader": "9.1.2",
|
|
89
89
|
"execa": "5.1.1",
|
|
90
90
|
"jest-dom": "3.5.0",
|
|
@@ -123,5 +123,5 @@
|
|
|
123
123
|
]
|
|
124
124
|
}
|
|
125
125
|
},
|
|
126
|
-
"gitHead": "
|
|
126
|
+
"gitHead": "ac47eaeffd087f0c296abd3eef68c6f8e320cd7d"
|
|
127
127
|
}
|