@bpmn-io/properties-panel 1.7.0 → 1.8.0

package/dist/index.esm.js

@@ -2741,6 +2741,7 @@ function TextArea(props) {
  * @param {Function} props.onBlur
  * @param {number} props.rows
  * @param {boolean} props.monospace
+ * @param {Function} [props.validate]
  * @param {boolean} [props.disabled]
  */
 function TextAreaEntry(props) {
@@ -2755,12 +2756,38 @@ function TextAreaEntry(props) {
     rows,
     monospace,
     disabled,
+    validate,
     onFocus,
     onBlur,
     autoResize
   } = props;
-  const value = getValue(element);
-  const error = useError(id);
+  const [cachedInvalidValue, setCachedInvalidValue] = useState(null);
+  const globalError = useError(id);
+  const [localError, setLocalError] = useState(null);
+  let value = getValue(element);
+  const previousValue = usePrevious(value);
+  useEffect(() => {
+    if (isFunction(validate)) {
+      const newValidationError = validate(value) || null;
+      setLocalError(newValidationError);
+    }
+  }, [value]);
+  const onInput = newValue => {
+    let newValidationError = null;
+    if (isFunction(validate)) {
+      newValidationError = validate(newValue) || null;
+    }
+    if (newValidationError) {
+      setCachedInvalidValue(newValue);
+    } else {
+      setValue(newValue);
+    }
+    setLocalError(newValidationError);
+  };
+  if (previousValue === value && localError) {
+    value = cachedInvalidValue;
+  }
+  const error = globalError || localError;
   return jsxs("div", {
     class: classnames('bio-properties-panel-entry', error ? 'has-error' : ''),
     "data-entry-id": id,
@@ -2768,7 +2795,7 @@ function TextAreaEntry(props) {
       id: id,
       label: label,
       value: value,
-      onInput: setValue,
+      onInput: onInput,
       onFocus: onFocus,
       onBlur: onBlur,
       rows: rows,