@dnb/eufemia 10.51.2 → 10.52.0

package/cjs/extensions/forms/DataContext/Provider/Provider.js

@@ -31,7 +31,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 const useLayoutEffect = typeof window === 'undefined' ? _react.default.useEffect : _react.default.useLayoutEffect;
 const isArrayJsonPointer = /^\/\d+(\/|$)/;
 function Provider(props) {
-  var _sharedAttachments$da, _sharedData$data3;
+  var _sharedAttachments$da;
   const [, forceUpdate] = (0, _react.useReducer)(() => ({}), {});
   const {
       id,
@@ -76,6 +76,10 @@ function Provider(props) {
   const translation = (0, _useTranslation.default)().Field;
   const ajvRef = (0, _react.useRef)((0, _ajv.makeAjvInstance)(ajvInstance));
   const mountedFieldsRef = (0, _react.useRef)({});
+  const snapshotsRef = (0, _react.useRef)();
+  if (!snapshotsRef.current) {
+    snapshotsRef.current = new Map();
+  }
   const hasVisibleErrorRef = (0, _react.useRef)({});
   const errorsRef = (0, _react.useRef)();
   const showAllErrorsRef = (0, _react.useRef)(false);
@@ -119,6 +123,7 @@ function Provider(props) {
     return data !== null && data !== void 0 ? data : defaultData;
   }, []);
   const internalDataRef = (0, _react.useRef)(initialData);
+  const isEmptyDataRef = (0, _react.useRef)(false);
   const ajvValidatorRef = (0, _react.useRef)();
   const executeAjvValidator = (0, _react.useCallback)(() => {
     var _ajvValidatorRef$curr;
@@ -325,6 +330,7 @@ function Provider(props) {
   }, []);
   const sharedData = (0, _useSharedState.useSharedState)(id);
   const sharedAttachments = (0, _useSharedState.useSharedState)(id + '-attachments');
+  const sharedDataContext = (0, _useSharedState.useSharedState)(id + '-data-context');
   const setSharedData = sharedData.set;
   const extendSharedData = sharedData.extend;
   const extendAttachment = sharedAttachments.extend;
@@ -340,34 +346,38 @@ function Provider(props) {
       sharedData.update(initialData);
     }
     if (id && initialData && sharedData.data && cacheRef.current.shared === sharedData.data && internalDataRef.current === initialData && typeof internalDataRef.current === 'object') {
-      return _objectSpread(_objectSpread({}, internalDataRef.current), sharedData.data);
+      return _objectSpread(_objectSpread({}, internalDataRef.current), sharedData.data || {});
     }
     if (id && !initialData && !internalDataRef.current && sharedData.data && cacheRef.current.shared === sharedData.data) {
       return sharedData.data;
     }
     if (id && sharedData.data && cacheRef.current.shared !== sharedData.data && sharedData.data !== internalDataRef.current && typeof internalDataRef.current === 'object') {
-      var _sharedData$data;
       cacheRef.current.shared = sharedData.data;
-      if ((_sharedData$data = sharedData.data) !== null && _sharedData$data !== void 0 && _sharedData$data.clearForm) {
-        const clear = cacheRef.current.shared = clearedData;
-        setSharedData(clear);
-        return clear;
+      if (isEmptyDataRef.current) {
+        return Array.isArray(internalDataRef.current) ? [] : clearedData;
       }
-      return _objectSpread(_objectSpread({}, internalDataRef.current), sharedData.data);
+      return _objectSpread(_objectSpread({}, internalDataRef.current), sharedData.data || {});
     }
     if (data !== cacheRef.current.data) {
       cacheRef.current.data = data;
       return data;
     }
     return internalDataRef.current;
-  }, [id, initialData, sharedData, data, setSharedData]);
+  }, [id, initialData, sharedData, data]);
   internalDataRef.current = props.path && _jsonPointer.default.has(internalData, props.path) ? _jsonPointer.default.get(internalData, props.path) : internalData;
-  (0, _react.useEffect)(() => {
-    var _sharedData$data2;
-    if ((_sharedData$data2 = sharedData.data) !== null && _sharedData$data2 !== void 0 && _sharedData$data2.clearForm) {
-      onClear === null || onClear === void 0 ? void 0 : onClear();
+  const clearData = (0, _react.useCallback)(() => {
+    var _ref4, _requestAnimationFram;
+    isEmptyDataRef.current = true;
+    internalDataRef.current = (_ref4 = typeof emptyData === 'function' ? emptyData(internalDataRef.current) : emptyData) !== null && _ref4 !== void 0 ? _ref4 : Array.isArray(internalDataRef.current) ? [] : clearedData;
+    if (id) {
+      setSharedData === null || setSharedData === void 0 ? void 0 : setSharedData(internalDataRef.current);
     }
-  }, [onClear, (_sharedData$data3 = sharedData.data) === null || _sharedData$data3 === void 0 ? void 0 : _sharedData$data3.clearForm]);
+    forceUpdate();
+    onClear === null || onClear === void 0 ? void 0 : onClear();
+    (_requestAnimationFram = requestAnimationFrame) === null || _requestAnimationFram === void 0 ? void 0 : _requestAnimationFram(() => {
+      isEmptyDataRef.current = false;
+    });
+  }, [emptyData, id, onClear, setSharedData]);
   useLayoutEffect(() => {
     if (id && initialData && !sharedData.data) {
       extendSharedData === null || extendSharedData === void 0 ? void 0 : extendSharedData(initialData);
@@ -385,13 +395,14 @@ function Provider(props) {
         hasFieldError,
         setShowAllErrors,
         setSubmitState,
+        clearData,
         fieldConnectionsRef
       });
       if (filterSubmitData) {
         rerenderUseDataHook === null || rerenderUseDataHook === void 0 ? void 0 : rerenderUseDataHook();
       }
     }
-  }, [extendAttachment, visibleDataHandler, filterDataHandler, filterSubmitData, hasErrors, hasFieldError, id, rerenderUseDataHook, setShowAllErrors, setSubmitState]);
+  }, [extendAttachment, visibleDataHandler, filterDataHandler, filterSubmitData, hasErrors, hasFieldError, id, rerenderUseDataHook, setShowAllErrors, setSubmitState, clearData]);
   const storeInSession = (0, _react.useMemo)(() => {
     return (0, _helpers.debounce)(() => {
       var _window$sessionStorag2;
@@ -524,15 +535,6 @@ function Provider(props) {
       });
     }
   }, []);
-  const clearData = (0, _react.useCallback)(() => {
-    internalDataRef.current = emptyData !== null && emptyData !== void 0 ? emptyData : clearedData;
-    if (id) {
-      setSharedData === null || setSharedData === void 0 ? void 0 : setSharedData(internalDataRef.current);
-    } else {
-      forceUpdate();
-    }
-    onClear === null || onClear === void 0 ? void 0 : onClear();
-  }, [emptyData, id, onClear, setSharedData]);
   const handleSubmitCall = (0, _react.useCallback)(async args => {
     const {
       onSubmit,
@@ -699,12 +701,12 @@ function Provider(props) {
   }, [getSubmitData, getSubmitOptions, handleSubmitCall, handleSubmitListeners, onSubmit, onSubmitComplete, scrollToTop, scrollTopOnSubmit]);
   const fieldEventListenersRef = (0, _react.useRef)([]);
   const setFieldEventListener = (0, _react.useCallback)((path, type, callback) => {
-    fieldEventListenersRef.current = fieldEventListenersRef.current.filter(_ref4 => {
+    fieldEventListenersRef.current = fieldEventListenersRef.current.filter(_ref5 => {
       let {
         path: p,
         type: t,
         callback: c
-      } = _ref4;
+      } = _ref5;
       return !(p === path && t === type && c === callback);
     });
     fieldEventListenersRef.current.push({
@@ -755,58 +757,65 @@ function Provider(props) {
   });
   const submitState = submitStateRef.current;
   const disabled = typeof (rest === null || rest === void 0 ? void 0 : rest['disabled']) === 'boolean' ? rest === null || rest === void 0 ? void 0 : rest['disabled'] : formState === 'pending' === true ? true : undefined;
+  const contextValue = _objectSpread({
+    handlePathChange,
+    handlePathChangeUnvalidated,
+    handleSubmit,
+    setMountedFieldState,
+    handleSubmitCall,
+    setFormState,
+    setSubmitState,
+    setShowAllErrors,
+    setVisibleError,
+    setFieldEventListener,
+    setFieldState,
+    setFieldError,
+    setFieldConnection,
+    setFieldProps,
+    setValueProps,
+    hasErrors,
+    hasFieldError,
+    hasFieldState,
+    validateData,
+    updateDataValue,
+    setData,
+    clearData,
+    visibleDataHandler,
+    filterDataHandler,
+    getSubmitData,
+    getSubmitOptions,
+    addOnChangeHandler,
+    setHandleSubmit,
+    scrollToTop,
+    schema,
+    disabled,
+    required,
+    formState,
+    submitState,
+    contextErrorMessages,
+    hasContext: true,
+    errors: errorsRef.current,
+    showAllErrors: showAllErrorsRef.current,
+    hasVisibleError: Object.keys(hasVisibleErrorRef.current).length > 0,
+    fieldConnectionsRef,
+    fieldPropsRef,
+    valuePropsRef,
+    mountedFieldsRef,
+    snapshotsRef,
+    formElementRef,
+    isEmptyDataRef,
+    fieldErrorRef,
+    ajvInstance: ajvRef.current,
+    id,
+    data: internalDataRef.current,
+    internalDataRef,
+    props
+  }, rest);
+  if (id) {
+    sharedDataContext.set(contextValue);
+  }
   return _react.default.createElement(_Context.default.Provider, {
-    value: _objectSpread({
-      handlePathChange,
-      handlePathChangeUnvalidated,
-      handleSubmit,
-      setMountedFieldState,
-      handleSubmitCall,
-      setFormState,
-      setSubmitState,
-      setShowAllErrors,
-      setVisibleError,
-      setFieldEventListener,
-      setFieldState,
-      setFieldError,
-      setFieldConnection,
-      setFieldProps,
-      setValueProps,
-      hasErrors,
-      hasFieldError,
-      hasFieldState,
-      validateData,
-      updateDataValue,
-      setData,
-      clearData,
-      visibleDataHandler,
-      filterDataHandler,
-      getSubmitData,
-      getSubmitOptions,
-      addOnChangeHandler,
-      setHandleSubmit,
-      scrollToTop,
-      schema,
-      disabled,
-      required,
-      formState,
-      submitState,
-      contextErrorMessages,
-      hasContext: true,
-      errors: errorsRef.current,
-      showAllErrors: showAllErrorsRef.current,
-      hasVisibleError: Object.keys(hasVisibleErrorRef.current).length > 0,
-      fieldConnectionsRef,
-      fieldPropsRef,
-      valuePropsRef,
-      mountedFieldsRef,
-      formElementRef,
-      ajvInstance: ajvRef.current,
-      id,
-      data: internalDataRef.current,
-      internalDataRef,
-      props
-    }, rest)
+    value: contextValue
   }, _react.default.createElement(_Provider.default, {
     FormStatus: globalStatusId ? {
       globalStatus: {