diff --git a/packages/decap-cms-core/index.d.ts b/packages/decap-cms-core/index.d.ts
index c132a8054d51..ffb9ed93d8ae 100644
--- a/packages/decap-cms-core/index.d.ts
+++ b/packages/decap-cms-core/index.d.ts
@@ -516,12 +516,20 @@ declare module 'decap-cms-core' {
     handler: ({
       entry,
       author,
+      context,
     }: {
       entry: Map<string, any>;
       author: { login: string; name: string };
+      context?: HookContext;
     }) => any;
   }
 
+  export interface HookContext {
+    publishStack?: boolean;
+    actions?: Record<string, Function>;
+    [key: string]: any;
+  }
+
   export type CmsEventListenerOptions = any; // TODO: type properly
 
   export type CmsLocalePhrases = any; // TODO: type properly
diff --git a/packages/decap-cms-core/src/actions/__tests__/entries.spec.js b/packages/decap-cms-core/src/actions/__tests__/entries.spec.js
index 40697cb5ff10..1827cc588590 100644
--- a/packages/decap-cms-core/src/actions/__tests__/entries.spec.js
+++ b/packages/decap-cms-core/src/actions/__tests__/entries.spec.js
@@ -3,7 +3,7 @@ import configureMockStore from 'redux-mock-store';
 import thunk from 'redux-thunk';
 
 import {
-  createEmptyDraft,
+  createLocalEmptyDraft,
   createEmptyDraftData,
   retrieveLocalBackup,
   persistLocalBackup,
@@ -40,7 +40,7 @@ describe('entries', () => {
         fields: [{ name: 'title' }],
       });
 
-      return store.dispatch(createEmptyDraft(collection, '')).then(() => {
+      return store.dispatch(createLocalEmptyDraft(collection, '')).then(() => {
         const actions = store.getActions();
         expect(actions).toHaveLength(1);
 
@@ -73,7 +73,7 @@ describe('entries', () => {
         fields: [{ name: 'title' }, { name: 'boolean' }],
       });
 
-      return store.dispatch(createEmptyDraft(collection, '?title=title&boolean=True')).then(() => {
+      return store.dispatch(createLocalEmptyDraft(collection, '?title=title&boolean=True')).then(() => {
         const actions = store.getActions();
         expect(actions).toHaveLength(1);
 
@@ -107,7 +107,7 @@ describe('entries', () => {
       });
 
       return store
-        .dispatch(createEmptyDraft(collection, "?title=<script>alert('hello')</script>"))
+        .dispatch(createLocalEmptyDraft(collection, "?title=<script>alert('hello')</script>"))
         .then(() => {
           const actions = store.getActions();
           expect(actions).toHaveLength(1);
diff --git a/packages/decap-cms-core/src/actions/editorialWorkflow.ts b/packages/decap-cms-core/src/actions/editorialWorkflow.ts
index b19914c98937..51b9ed2b7893 100644
--- a/packages/decap-cms-core/src/actions/editorialWorkflow.ts
+++ b/packages/decap-cms-core/src/actions/editorialWorkflow.ts
@@ -39,6 +39,7 @@ import type { AnyAction } from 'redux';
 import type { EntryValue } from '../valueObjects/Entry';
 import type { Status } from '../constants/publishModes';
 import type { ThunkDispatch } from 'redux-thunk';
+import type { HookContext } from '../backend';
 
 /*
  * Constant Declarations
@@ -67,6 +68,8 @@ export const UNPUBLISHED_ENTRY_DELETE_REQUEST = 'UNPUBLISHED_ENTRY_DELETE_REQUES
 export const UNPUBLISHED_ENTRY_DELETE_SUCCESS = 'UNPUBLISHED_ENTRY_DELETE_SUCCESS';
 export const UNPUBLISHED_ENTRY_DELETE_FAILURE = 'UNPUBLISHED_ENTRY_DELETE_FAILURE';
 
+export const UNPUBLISHED_ENTRY_DISMISS_ERROR = 'UNPUBLISHED_ENTRY_DISMISS_ERROR';
+
 /*
  * Simple Action Creators (Internal)
  */
@@ -271,6 +274,7 @@ export function loadUnpublishedEntry(collection: Collection, slug: string) {
       dispatch(unpublishedEntryLoaded(collection, entry));
       dispatch(createDraftFromEntry(entry));
     } catch (error) {
+      if (error.name === UNPUBLISHED_ENTRY_DISMISS_ERROR) return;
       if (error.name === EDITORIAL_WORKFLOW_ERROR && error.notUnderEditorialWorkflow) {
         dispatch(unpublishedEntryRedirected(collection, slug));
         dispatch(loadEntry(collection, slug));
@@ -301,7 +305,7 @@ export function loadUnpublishedEntries(collections: Collections) {
     }
 
     dispatch(unpublishedEntriesLoading());
-    backend
+    return backend
       .unpublishedEntries(collections)
       .then(response => dispatch(unpublishedEntriesLoaded(response.entries, response.pagination)))
       .catch((error: Error) => {
@@ -321,21 +325,26 @@ export function loadUnpublishedEntries(collections: Collections) {
   };
 }
 
-export function persistUnpublishedEntry(collection: Collection, existingUnpublishedEntry: boolean) {
+export function persistUnpublishedEntry(
+  collection: Collection,
+  existingUnpublishedEntry: boolean,
+  context: HookContext,
+  customEntryDraft?: EntryDraft,
+) {
   return async (dispatch: ThunkDispatch<State, {}, AnyAction>, getState: () => State) => {
     const state = getState();
-    const entryDraft = state.entryDraft;
+    const entryDraft = customEntryDraft || state.entryDraft;
+    const isCustomEntry = customEntryDraft && entryDraft.getIn(['entry', 'isCustomEntry'], true);
+    const status = customEntryDraft && customEntryDraft.getIn(['entry', 'status']);
     const fieldsErrors = entryDraft.get('fieldsErrors');
     const unpublishedSlugs = selectUnpublishedSlugs(state, collection.get('name'));
     const publishedSlugs = selectPublishedSlugs(state, collection.get('name'));
     const usedSlugs = publishedSlugs.concat(unpublishedSlugs) as List<string>;
     const entriesLoaded = get(state.editorialWorkflow.toJS(), 'pages.ids', false);
 
-    //load unpublishedEntries
     !entriesLoaded && dispatch(loadUnpublishedEntries(state.collections));
 
-    // Early return if draft contains validation errors
-    if (!fieldsErrors.isEmpty()) {
+    if (fieldsErrors && !fieldsErrors.isEmpty()) {
       const hasPresenceErrors = fieldsErrors.some(errors =>
         errors.some(error => error.type && error.type === ValidationErrorTypes.PRESENCE),
       );
@@ -375,6 +384,8 @@ export function persistUnpublishedEntry(collection: Collection, existingUnpublis
         entryDraft: serializedEntryDraft,
         assetProxies,
         usedSlugs,
+        context,
+        status,
       });
       dispatch(
         addNotification({
@@ -385,12 +396,16 @@ export function persistUnpublishedEntry(collection: Collection, existingUnpublis
           dismissAfter: 4000,
         }),
       );
-      dispatch(unpublishedEntryPersisted(collection, serializedEntry));
 
-      if (entry.get('slug') !== newSlug) {
-        await dispatch(loadUnpublishedEntry(collection, newSlug));
-        navigateToEntry(collection.get('name'), newSlug);
+      if (!isCustomEntry) {
+        dispatch(unpublishedEntryPersisted(collection, serializedEntry));
+        if (entry.get('slug') !== newSlug) {
+          await dispatch(loadUnpublishedEntry(collection, newSlug));
+          navigateToEntry(collection.get('name'), newSlug);
+        }
       }
+
+      return newSlug;
     } catch (error) {
       dispatch(
         addNotification({
@@ -483,17 +498,19 @@ export function deleteUnpublishedEntry(collection: string, slug: string) {
 export function publishUnpublishedEntry(
   collectionName: string,
   slug: string,
-  publishStack: boolean,
+  context: HookContext,
+  customEntry?: EntryMap,
 ) {
   return async (dispatch: ThunkDispatch<State, {}, AnyAction>, getState: () => State) => {
     const state = getState();
     const collections = state.collections;
     const backend = currentBackend(state.config);
-    const entry = selectUnpublishedEntry(state, collectionName, slug);
+    const entry = customEntry || selectUnpublishedEntry(state, collectionName, slug);
+    const isCustomEntry = customEntry && customEntry.get('isCustomEntry', true);
     const isDeleteWorkflow = entry.get('isDeleteWorkflow');
     dispatch(unpublishedEntryPublishRequest(collectionName, slug));
     try {
-      if (!publishStack && state.stack.status.status) {
+      if (!context.publishStack && state.stack.status.status) {
         dispatch(
           addNotification({
             message: {
@@ -507,7 +524,7 @@ export function publishUnpublishedEntry(
         return dispatch(unpublishedEntryPublishError(collectionName, slug));
       }
 
-      await backend.publishUnpublishedEntry(entry, publishStack);
+      await backend.publishUnpublishedEntry(entry, context);
 
       await dispatch(checkStackStatus());
 
@@ -522,21 +539,24 @@ export function publishUnpublishedEntry(
         }),
       );
       dispatch(unpublishedEntryPublished(collectionName, slug));
-      const collection = collections.get(collectionName);
-      if (collection.has('nested')) {
-        dispatch(loadEntries(collection));
-        const newSlug = slugFromCustomPath(collection, entry.get('path'));
-        loadEntry(collection, newSlug);
-        if (slug !== newSlug && selectEditingDraft(state.entryDraft)) {
-          navigateToEntry(collection.get('name'), newSlug);
+      if (!isCustomEntry) {
+        const collection = collections.get(collectionName);
+        if (!collection.has('nested')) {
+          dispatch(loadEntries(collection));
+          const newSlug = slugFromCustomPath(collection, entry.get('path'));
+          loadEntry(collection, newSlug);
+          if (slug !== newSlug && selectEditingDraft(state.entryDraft)) {
+            navigateToEntry(collection.get('name'), newSlug);
+          }
+        } else if (isDeleteWorkflow) {
+          dispatch(unpublishedEntryDeleted(collectionName, slug));
+          return navigateToCollection(collectionName);
+        } else {
+          return dispatch(loadEntry(collection, slug));
         }
-      } else if (isDeleteWorkflow) {
-        dispatch(unpublishedEntryDeleted(collectionName, slug));
-        return navigateToCollection(collectionName);
-      } else {
-        return dispatch(loadEntry(collection, slug));
       }
     } catch (error) {
+      if (error.name === UNPUBLISHED_ENTRY_DISMISS_ERROR) return;
       dispatch(
         addNotification({
           message: { key: 'ui.toast.onFailToPublishEntry', details: error },
@@ -549,11 +569,16 @@ export function publishUnpublishedEntry(
   };
 }
 
-export function unpublishPublishedEntry(collection: Collection, slug: string) {
+export function unpublishPublishedEntry(
+  collection: Collection,
+  slug: string,
+  customEntry?: EntryMap,
+) {
   return (dispatch: ThunkDispatch<State, {}, AnyAction>, getState: () => State) => {
     const state = getState();
     const backend = currentBackend(state.config);
-    const entry = selectEntry(state, collection.get('name'), slug);
+    const entry = customEntry || selectEntry(state, collection.get('name'), slug);
+    const isCustomEntry = customEntry && customEntry.get('isCustomEntry', true);
     const entryDraft = Map().set('entry', entry) as unknown as EntryDraft;
     dispatch(unpublishedEntryPersisting(collection, slug));
     return backend
@@ -566,14 +591,16 @@ export function unpublishPublishedEntry(collection: Collection, slug: string) {
             entryDraft,
             assetProxies: [],
             usedSlugs: List(),
-            status: status.get('PENDING_PUBLISH'),
+            status: customEntry ? customEntry.get('status') : status.get('PENDING_PUBLISH'),
           });
         }
       })
       .then(() => {
-        dispatch(unpublishedEntryPersisted(collection, entry));
         dispatch(entryDeleted(collection, slug));
-        dispatch(loadUnpublishedEntry(collection, slug));
+        if (!isCustomEntry) {
+          dispatch(unpublishedEntryPersisted(collection, entry));
+          dispatch(loadUnpublishedEntry(collection, slug));
+        }
         dispatch(
           addNotification({
             message: {
@@ -598,3 +625,20 @@ export function unpublishPublishedEntry(collection: Collection, slug: string) {
       });
   };
 }
+
+export function getUnpublishedEntries(collectionName?: string) {
+  return async (dispatch: ThunkDispatch<State, {}, AnyAction>, getState: () => State) => {
+    const state = getState();
+    const entriesLoaded = get(state.editorialWorkflow.toJS(), 'pages.ids', false);
+
+    if (!entriesLoaded) {
+      await dispatch(loadUnpublishedEntries(state.collections));
+    }
+
+    const unpublishedEntries = state.editorialWorkflow.get('entities');
+    const entries = collectionName
+      ? unpublishedEntries.filter(entry => entry.get('collection') === collectionName)
+      : unpublishedEntries;
+    return List(entries.valueSeq());
+  };
+}
diff --git a/packages/decap-cms-core/src/actions/entries.ts b/packages/decap-cms-core/src/actions/entries.ts
index c8721996892b..1346f9735613 100644
--- a/packages/decap-cms-core/src/actions/entries.ts
+++ b/packages/decap-cms-core/src/actions/entries.ts
@@ -20,7 +20,7 @@ import { selectCustomPath } from '../reducers/entryDraft';
 import { navigateToCollection, navigateToEntry } from '../routing/history';
 import { getProcessSegment } from '../lib/formatters';
 import { hasI18n, duplicateDefaultI18nFields, serializeI18n, I18N, I18N_FIELD } from '../lib/i18n';
-import { loadUnpublishedEntry } from './editorialWorkflow';
+import { loadUnpublishedEntry, UNPUBLISHED_ENTRY_DISMISS_ERROR } from './editorialWorkflow';
 import { addNotification } from './notifications';
 
 import type { ImplementationMediaFile } from 'decap-cms-lib-util';
@@ -35,9 +35,10 @@ import type {
   ViewFilter,
   ViewGroup,
   Entry,
+  EntryDraft,
 } from '../types/redux';
 import type { EntryValue } from '../valueObjects/Entry';
-import type { Backend } from '../backend';
+import type { Backend, HookContext } from '../backend';
 import type AssetProxy from '../valueObjects/AssetProxy';
 import type { Set } from 'immutable';
 
@@ -323,6 +324,7 @@ export function entryPersisted(collection: Collection, entry: EntryMap, slug: st
        * Pass slug from backend for newly created entries.
        */
       slug,
+      entry,
     },
   };
 }
@@ -767,6 +769,14 @@ export function createEmptyDraft(collection: Collection, search: string) {
       meta: meta as any,
     });
     newEntry = await backend.processEntry(state, collection, newEntry);
+
+    return newEntry;
+  };
+}
+
+export function createLocalEmptyDraft(collection: Collection, search: string) {
+  return async (dispatch: ThunkDispatch<State, {}, AnyAction>, getState: () => State) => {
+    const newEntry = await createEmptyDraft(collection, search)(dispatch, getState);
     dispatch(emptyDraftCreated(newEntry));
   };
 }
@@ -886,15 +896,18 @@ export function getSerializedEntry(collection: Collection, entry: Entry) {
   return serializedEntry;
 }
 
-export function persistEntry(collection: Collection, publishStack?: boolean) {
+export function persistEntry(
+  collection: Collection,
+  context: HookContext,
+  customEntryDraft?: EntryDraft,
+) {
   return async (dispatch: ThunkDispatch<State, {}, AnyAction>, getState: () => State) => {
     const state = getState();
-    const entryDraft = state.entryDraft;
+    const entryDraft = customEntryDraft || state.entryDraft;
+
     const fieldsErrors = entryDraft.get('fieldsErrors');
-    const usedSlugs = selectPublishedSlugs(state, collection.get('name'));
 
-    // Early return if draft contains validation errors
-    if (!fieldsErrors.isEmpty()) {
+    if (fieldsErrors && !fieldsErrors.isEmpty()) {
       const hasPresenceErrors = fieldsErrors.some(errors =>
         errors.some(error => error.type && error.type === ValidationErrorTypes.PRESENCE),
       );
@@ -914,15 +927,21 @@ export function persistEntry(collection: Collection, publishStack?: boolean) {
       return Promise.reject();
     }
 
+    const usedSlugs = selectPublishedSlugs(state, collection.get('name'));
+
     const backend = currentBackend(state.config);
     const entry = entryDraft.get('entry');
+    const isCustomEntry = customEntryDraft && entry.get('isCustomEntry', true);
+    const status = customEntryDraft && entry.get('status');
     const assetProxies = getMediaAssets({
       entry,
     });
 
     const serializedEntry = getSerializedEntry(collection, entry);
     const serializedEntryDraft = entryDraft.set('entry', serializedEntry);
-    dispatch(entryPersisting(collection, serializedEntry));
+    if (!isCustomEntry) {
+      dispatch(entryPersisting(collection, serializedEntry));
+    }
     return backend
       .persistEntry({
         config: state.config,
@@ -930,7 +949,8 @@ export function persistEntry(collection: Collection, publishStack?: boolean) {
         entryDraft: serializedEntryDraft,
         assetProxies,
         usedSlugs,
-        publishStack,
+        context,
+        status,
       })
       .then(async (newSlug: string) => {
         dispatch(
@@ -943,44 +963,57 @@ export function persistEntry(collection: Collection, publishStack?: boolean) {
           }),
         );
 
-        // re-load media library if entry had media files
-        if (assetProxies.length > 0) {
-          await dispatch(loadMedia());
-        }
-        dispatch(entryPersisted(collection, serializedEntry, newSlug));
-        if (collection.has('nested')) {
-          await dispatch(loadEntries(collection));
-        }
-        if (entry.get('slug') !== newSlug) {
-          await dispatch(loadEntry(collection, newSlug));
-          navigateToEntry(collection.get('name'), newSlug);
+        if (!isCustomEntry) {
+          // re-load media library if entry had media files
+          if (assetProxies.length > 0) {
+            await dispatch(loadMedia());
+          }
+          dispatch(entryPersisted(collection, serializedEntry, newSlug));
+          if (collection.has('nested')) {
+            await dispatch(loadEntries(collection));
+          }
+          if (entry.get('slug') !== newSlug) {
+            await dispatch(loadEntry(collection, newSlug));
+            navigateToEntry(collection.get('name'), newSlug);
+          }
         }
+
+        return newSlug;
       })
       .catch((error: Error) => {
-        console.error(error);
-        dispatch(
-          addNotification({
-            message: {
-              details: error,
-              key: 'ui.toast.onFailToPersist',
-            },
-            type: 'error',
-            dismissAfter: 8000,
-          }),
-        );
+        if (error.name !== UNPUBLISHED_ENTRY_DISMISS_ERROR) {
+          console.error(error);
+          dispatch(
+            addNotification({
+              message: {
+                details: error,
+                key: 'ui.toast.onFailToPersist',
+              },
+              type: 'error',
+              dismissAfter: 8000,
+            }),
+          );
+        }
+
         return Promise.reject(dispatch(entryPersistFail(collection, serializedEntry, error)));
       });
   };
 }
 
-export function deleteEntry(collection: Collection, slug: string) {
+export function deleteEntry(
+  collection: Collection,
+  slug: string,
+  context: HookContext,
+  entry?: EntryMap,
+) {
   return (dispatch: ThunkDispatch<State, {}, AnyAction>, getState: () => State) => {
     const state = getState();
     const backend = currentBackend(state.config);
+    const isCustomEntry = entry && entry.get('isCustomEntry', true);
 
     dispatch(entryDeleting(collection, slug));
     return backend
-      .deleteEntry(state, collection, slug)
+      .deleteEntry(state, collection, slug, context, entry)
       .then(async () => {
         dispatch(entryDeleted(collection, slug));
         dispatch(
@@ -994,24 +1027,29 @@ export function deleteEntry(collection: Collection, slug: string) {
             dismissAfter: 4000,
           }),
         );
-        if (backend.implementation.deleteCollectionFiles) {
-          dispatch(loadUnpublishedEntry(collection, slug));
-        } else {
-          navigateToCollection(collection.get('name'));
+        if (!isCustomEntry) {
+          if (backend.implementation.deleteCollectionFiles) {
+            dispatch(loadUnpublishedEntry(collection, slug));
+          } else {
+            navigateToCollection(collection.get('name'));
+          }
         }
       })
       .catch((error: Error) => {
-        dispatch(
-          addNotification({
-            message: {
-              details: error,
-              key: 'ui.toast.onFailToDelete',
-            },
-            type: 'error',
-            dismissAfter: 8000,
-          }),
-        );
-        console.error(error);
+        if (error.name !== UNPUBLISHED_ENTRY_DISMISS_ERROR) {
+          console.error(error);
+          dispatch(
+            addNotification({
+              message: {
+                details: error,
+                key: 'ui.toast.onFailToDelete',
+              },
+              type: 'error',
+              dismissAfter: 8000,
+            }),
+          );
+        }
+
         return Promise.reject(dispatch(entryDeleteFail(collection, slug, error)));
       });
   };
diff --git a/packages/decap-cms-core/src/backend.ts b/packages/decap-cms-core/src/backend.ts
index d95b4a89234c..ce1cdeb9696d 100644
--- a/packages/decap-cms-core/src/backend.ts
+++ b/packages/decap-cms-core/src/backend.ts
@@ -146,7 +146,7 @@ export function extractSearchFields(searchFields: string[]) {
     searchFields.reduce((acc, field) => {
       const value = getEntryField(field, entry);
       if (value) {
-        return `${acc} ${value}`;
+        return acc ? `${acc} ${value}` : value;
       } else {
         return acc;
       }
@@ -276,9 +276,9 @@ interface PersistArgs {
   entryDraft: EntryDraft;
   assetProxies: AssetProxy[];
   usedSlugs: List<string>;
-  publishStack?: boolean;
   unpublished?: boolean;
   status?: string;
+  context?: HookContext;
 }
 
 interface ImplementationInitOptions {
@@ -291,6 +291,11 @@ type Implementation = BackendImplementation & {
   init: (config: CmsConfig, options: ImplementationInitOptions) => Implementation;
 };
 
+export interface HookContext {
+  publishStack?: boolean;
+  actions?: Record<string, Function>;
+}
+
 function prepareMetaPath(path: string, collection: Collection) {
   if (!selectHasMetaPath(collection)) {
     return path;
@@ -617,6 +622,17 @@ export class Backend {
     // Perform a local search by requesting all entries. For each
     // collection, load it, search, and call onCollectionResults with
     // its results.
+
+    if (searchTerm === null) {
+      const allEntries = await Promise.all(
+        collections.map(async collection => {
+          const entries = await this.listAllEntries(collection);
+          return entries;
+        }),
+      );
+      return { entries: flatten(allEntries) };
+    }
+
     const errors: Error[] = [];
     const collectionEntriesRequests = collections
       .map(async collection => {
@@ -703,7 +719,7 @@ export class Backend {
     }
 
     const merged = mergeExpandedEntries(hits);
-    return { query: searchTerm, hits: merged };
+    return { query: searchTerm, hits: merged, collection };
   }
 
   traverseCursor(cursor: Cursor, action: string) {
@@ -949,7 +965,7 @@ export class Backend {
         data,
         dataFile.path,
         dataFile.newFile,
-        dataFile.deletedFile,
+        dataFile.deleteFile,
       );
       return entryWithFormat;
     };
@@ -1103,11 +1119,11 @@ export class Backend {
     entryDraft: draft,
     assetProxies,
     usedSlugs,
-    publishStack = false,
     unpublished = false,
     status,
+    context,
   }: PersistArgs) {
-    const updatedEntity = await this.invokePreSaveEvent(draft.get('entry'));
+    const updatedEntity = await this.invokePreSaveEvent(draft.get('entry'), context);
 
     let entryDraft;
     if (updatedEntity.get('data') === undefined) {
@@ -1192,12 +1208,12 @@ export class Backend {
       commitMessage,
       collectionName,
       useWorkflow,
-      publishStack,
+      publishStack: context?.publishStack || false,
       ...updatedOptions,
     };
 
     if (!useWorkflow) {
-      await this.invokePrePublishEvent(entryDraft.get('entry'));
+      await this.invokePrePublishEvent(entryDraft.get('entry'), context);
     }
 
     await this.implementation.persistEntry(
@@ -1208,42 +1224,45 @@ export class Backend {
       opts,
     );
 
-    await this.invokePostSaveEvent(entryDraft.get('entry'));
+    await this.invokePostSaveEvent(entryDraft.get('entry'), context);
 
     if (!useWorkflow) {
-      await this.invokePostPublishEvent(entryDraft.get('entry'));
+      await this.invokePostPublishEvent(entryDraft.get('entry'), context);
     }
 
     return slug;
   }
 
-  async invokeEventWithEntry(event: string, entry: EntryMap) {
+  async invokeEventWithEntry(event: string, entry: EntryMap, context: HookContext = {}) {
     const { login, name } = (await this.currentUser()) as User;
-    return await invokeEvent({ name: event, data: { entry, author: { login, name } } });
+    return await invokeEvent({
+      name: event,
+      data: { entry, author: { login, name }, context },
+    });
   }
 
-  async invokePrePublishEvent(entry: EntryMap) {
-    await this.invokeEventWithEntry('prePublish', entry);
+  async invokePrePublishEvent(entry: EntryMap, context?: HookContext) {
+    await this.invokeEventWithEntry('prePublish', entry, context);
   }
 
-  async invokePostPublishEvent(entry: EntryMap) {
-    await this.invokeEventWithEntry('postPublish', entry);
+  async invokePostPublishEvent(entry: EntryMap, context?: HookContext) {
+    await this.invokeEventWithEntry('postPublish', entry, context);
   }
 
-  async invokePreUnpublishEvent(entry: EntryMap) {
-    await this.invokeEventWithEntry('preUnpublish', entry);
+  async invokePreUnpublishEvent(entry: EntryMap, context?: HookContext) {
+    await this.invokeEventWithEntry('preUnpublish', entry, context);
   }
 
-  async invokePostUnpublishEvent(entry: EntryMap) {
-    await this.invokeEventWithEntry('postUnpublish', entry);
+  async invokePostUnpublishEvent(entry: EntryMap, context?: HookContext) {
+    await this.invokeEventWithEntry('postUnpublish', entry, context);
   }
 
-  async invokePreSaveEvent(entry: EntryMap) {
-    return await this.invokeEventWithEntry('preSave', entry);
+  async invokePreSaveEvent(entry: EntryMap, context?: HookContext) {
+    return await this.invokeEventWithEntry('preSave', entry, context);
   }
 
-  async invokePostSaveEvent(entry: EntryMap) {
-    await this.invokeEventWithEntry('postSave', entry);
+  async invokePostSaveEvent(entry: EntryMap, context?: HookContext) {
+    await this.invokeEventWithEntry('postSave', entry, context);
   }
 
   async persistMedia(config: CmsConfig, file: AssetProxy) {
@@ -1263,10 +1282,17 @@ export class Backend {
     return this.implementation.persistMedia(file, options);
   }
 
-  async deleteEntry(state: State, collection: Collection, slug: string) {
+  async deleteEntry(
+    state: State,
+    collection: Collection,
+    slug: string,
+    context?: HookContext,
+    customEntry?: EntryMap,
+  ) {
     const config = state.config;
     const path = selectEntryPath(collection, slug) as string;
     const extension = selectFolderEntryExtension(collection) as string;
+    const entry = customEntry || selectEntry(state.entries, collection.get('name'), slug);
 
     if (!selectAllowDeletion(collection)) {
       throw new Error('Not allowed to delete entries in this collection');
@@ -1286,8 +1312,7 @@ export class Backend {
       user.useOpenAuthoring,
     );
 
-    const entry = selectEntry(state.entries, collection.get('name'), slug);
-    await this.invokePreUnpublishEvent(entry);
+    await this.invokePreUnpublishEvent(entry, context);
     let paths = [path];
     if (hasI18n(collection)) {
       paths = getFilePaths(collection, extension, path, slug);
@@ -1304,7 +1329,7 @@ export class Backend {
       await this.implementation.deleteFiles(paths, commitMessage);
     }
 
-    await this.invokePostUnpublishEvent(entry);
+    await this.invokePostUnpublishEvent(entry, context);
   }
 
   async deleteMedia(config: CmsConfig, path: string) {
@@ -1330,11 +1355,11 @@ export class Backend {
     return this.implementation.updateUnpublishedEntryStatus!(collection, slug, newStatus);
   }
 
-  async publishUnpublishedEntry(entry: EntryMap, publishStack?: boolean) {
+  async publishUnpublishedEntry(entry: EntryMap, context: HookContext) {
     const collection = entry.get('collection');
     const slug = entry.get('slug');
 
-    await this.invokePrePublishEvent(entry);
+    await this.invokePrePublishEvent(entry, context);
 
     const config = this.config;
     if (config.backend.stack) {
@@ -1351,13 +1376,13 @@ export class Backend {
       );
       await this.implementation.publishUnpublishedEntryStack!(collection, slug, {
         stackCommitMessage,
-        publishStack,
+        publishStack: context.publishStack,
       });
     } else {
       await this.implementation.publishUnpublishedEntry!(collection, slug);
     }
 
-    await this.invokePostPublishEvent(entry);
+    await this.invokePostPublishEvent(entry, context);
   }
 
   deleteUnpublishedEntry(collection: string, slug: string) {
diff --git a/packages/decap-cms-core/src/components/App/StackToolbar.js b/packages/decap-cms-core/src/components/App/StackToolbar.js
index 7ff2ce385889..f7653fe2bc1f 100644
--- a/packages/decap-cms-core/src/components/App/StackToolbar.js
+++ b/packages/decap-cms-core/src/components/App/StackToolbar.js
@@ -90,6 +90,13 @@ const StatusButton = styled(DropdownButton)`
   background-color: ${colorsRaw.tealLight};
   color: ${colorsRaw.teal};
 
+  ${props =>
+    props.label === 'processing' &&
+    css`
+      background-color: ${colors.processingBackground};
+      color: ${colors.processingText};
+   `}
+
   ${props =>
     props.label === 'stale' &&
     css`
@@ -164,6 +171,7 @@ export class EditorToolbar extends React.Component {
       [status.get('DRAFT')]: t('editor.editorToolbar.draft'),
       [status.get('PENDING_REVIEW')]: t('editor.editorToolbar.inReview'),
       [status.get('PENDING_PUBLISH')]: t('editor.editorToolbar.ready'),
+      [status.get('PROCESSING')]: t('editor.editorToolbar.inProcessing'),
       [status.get('STALE')]: t('editor.editorToolbar.inStale'),
     };
 
diff --git a/packages/decap-cms-core/src/components/Editor/Editor.js b/packages/decap-cms-core/src/components/Editor/Editor.js
index 385c95733505..7e6a39ab8f2b 100644
--- a/packages/decap-cms-core/src/components/Editor/Editor.js
+++ b/packages/decap-cms-core/src/components/Editor/Editor.js
@@ -12,6 +12,7 @@ import {
   loadEntry,
   loadEntries,
   createDraftDuplicateFromEntry,
+  createLocalEmptyDraft,
   createEmptyDraft,
   discardDraft,
   changeDraftField,
@@ -25,13 +26,16 @@ import {
   removeDraftEntryMediaFiles,
 } from '../../actions/entries';
 import {
+  getUnpublishedEntries,
   updateUnpublishedEntryStatus,
   publishUnpublishedEntry,
   unpublishPublishedEntry,
   deleteUnpublishedEntry,
+  persistUnpublishedEntry,
 } from '../../actions/editorialWorkflow';
 import { removeAssets } from '../../actions/media';
 import { loadDeployPreview } from '../../actions/deploys';
+import { searchEntries } from '../../actions/search';
 import { selectEntry, selectUnpublishedEntry, selectDeployPreview } from '../../reducers';
 import { selectFields } from '../../reducers/collections';
 import { status, EDITORIAL_WORKFLOW } from '../../constants/publishModes';
@@ -44,12 +48,15 @@ export class Editor extends React.Component {
     changeDraftFieldValidation: PropTypes.func.isRequired,
     collection: ImmutablePropTypes.map.isRequired,
     createDraftDuplicateFromEntry: PropTypes.func.isRequired,
+    createLocalEmptyDraft: PropTypes.func.isRequired,
     createEmptyDraft: PropTypes.func.isRequired,
     discardDraft: PropTypes.func.isRequired,
     entry: ImmutablePropTypes.map,
     entryDraft: ImmutablePropTypes.map.isRequired,
+    getUnpublishedEntries: PropTypes.func.isRequired,
     loadEntry: PropTypes.func.isRequired,
     persistEntry: PropTypes.func.isRequired,
+    persistUnpublishedEntry: PropTypes.func.isRequired,
     deleteEntry: PropTypes.func.isRequired,
     showDelete: PropTypes.bool.isRequired,
     fields: ImmutablePropTypes.list.isRequired,
@@ -71,6 +78,7 @@ export class Editor extends React.Component {
     loadDeployPreview: PropTypes.func.isRequired,
     currentStatus: PropTypes.string,
     user: PropTypes.object,
+    searchEntries: PropTypes.func.isRequired,
     location: PropTypes.shape({
       pathname: PropTypes.string,
       search: PropTypes.string,
@@ -90,7 +98,7 @@ export class Editor extends React.Component {
       collection,
       slug,
       loadEntry,
-      createEmptyDraft,
+      createLocalEmptyDraft,
       loadEntries,
       // retrieveLocalBackup,
       collectionEntriesLoaded,
@@ -100,7 +108,7 @@ export class Editor extends React.Component {
     // retrieveLocalBackup(collection, slug);
 
     if (newEntry) {
-      createEmptyDraft(collection, this.props.location.search);
+      createLocalEmptyDraft(collection, this.props.location.search);
     } else {
       loadEntry(collection, slug);
     }
@@ -185,7 +193,7 @@ export class Editor extends React.Component {
     const { newEntry, collection } = this.props;
 
     if (newEntry) {
-      prevProps.createEmptyDraft(collection, this.props.location.search);
+      prevProps.createLocalEmptyDraft(collection, this.props.location.search);
     }
   }
 
@@ -224,6 +232,57 @@ export class Editor extends React.Component {
   //   deleteLocalBackup(collection, !newEntry && slug);
   // }
 
+  createHookContext = (context) => {
+    const defaultContext = {
+      editor: {
+        props: this.props,
+        handlePersistEntry: this.handlePersistEntry,
+        handlePublishEntry: this.handlePublishEntry,
+        handleUnpublishEntry: this.handleUnpublishEntry,
+        handleDeleteEntry: this.handleDeleteEntry,
+        handleDeleteUnpublishedChanges: this.handleDeleteUnpublishedChanges,
+        handleDuplicateEntry: this.handleDuplicateEntry,
+        handleChangeStatus: this.handleChangeStatus,
+      },
+      actions: {
+        persistEntry: async (collection, entry, opts = {}) => {
+          const context = this.createHookContext(opts);
+          const entryDraft = entry || this.props.createEmptyDraft(collection);
+          return this.props.persistEntry(collection, context, entryDraft);
+        },
+        persistUnpublishedEntry: async (collection, existingUnpublishedEntry, entry, opts = {}) => {
+          const context = this.createHookContext(opts);
+          const entryDraft = entry || this.props.createEmptyDraft(collection);
+          return this.props.persistUnpublishedEntry(collection, existingUnpublishedEntry, context, entryDraft);
+        },
+        publishUnpublishedEntry: async (collection, slug, entry, opts = {}) => {
+          const context = this.createHookContext(opts);
+          const entryDraft = entry || this.props.createEmptyDraft(collection);
+          return this.props.publishUnpublishedEntry(
+            collection.get('name'),
+            slug,
+            context,
+            entryDraft,
+          );
+        },
+        deleteUnpublishedEntry: async (collection, slug) => {
+          return this.props.deleteUnpublishedEntry(collection, slug);
+        },
+        unpublishPublishedEntry: async (collection, slug, entry, opts = {}) => {
+          const context = this.createHookContext(opts);
+          return this.props.unpublishPublishedEntry(collection, slug, context, entry);
+        },
+        deleteEntry: async (collection, slug, entry, opts = {}) => {
+          const context = this.createHookContext(opts);
+          return this.props.deleteEntry(collection, slug, context, entry);
+        },
+      },
+    };
+    if (!context) return defaultContext;
+
+    return Object.assign(defaultContext, context);
+  };
+
   handlePersistEntry = async (opts = {}) => {
     const { createNew = false, duplicate = false, publishStack = false } = opts;
     const {
@@ -237,7 +296,7 @@ export class Editor extends React.Component {
       entryDraft,
     } = this.props;
 
-    await persistEntry(collection, publishStack);
+    await persistEntry(collection, this.createHookContext({ publishStack }));
 
     // this.deleteBackup();
 
@@ -279,7 +338,11 @@ export class Editor extends React.Component {
       return;
     }
 
-    await publishUnpublishedEntry(collection.get('name'), slug, publishStack);
+    await publishUnpublishedEntry(
+      collection.get('name'),
+      slug,
+      this.createHookContext({ publishStack }),
+    );
 
     // this.deleteBackup();
 
@@ -294,7 +357,7 @@ export class Editor extends React.Component {
     const { unpublishPublishedEntry, collection, slug, t } = this.props;
     if (!window.confirm(t('editor.editor.onUnpublishing'))) return;
 
-    await unpublishPublishedEntry(collection, slug);
+    await unpublishPublishedEntry(collection, slug, this.createHookContext());
 
     // return navigateToCollection(collection.get('name'));
   };
@@ -320,13 +383,14 @@ export class Editor extends React.Component {
     }
 
     setTimeout(async () => {
-      await deleteEntry(collection, slug);
+      await deleteEntry(collection, slug, this.createHookContext());
       // this.deleteBackup();
       // return navigateToCollection(collection.get('name'));
     }, 0);
   };
 
-  handleDeleteUnpublishedChanges = async () => {
+  handleDeleteUnpublishedChanges = async (opts = {}) => {
+    const { force = false } = opts;
     const {
       entryDraft,
       collection,
@@ -339,17 +403,21 @@ export class Editor extends React.Component {
       isDeleteWorkflow,
       t,
     } = this.props;
-    if (
-      entryDraft.get('hasChanged') &&
-      !window.confirm(
-        t('editor.editor.onDeleteUnpublishedChangesWithUnsavedChanges') || isDeleteWorkflow,
-      )
-    ) {
-      return;
-    } else if (!window.confirm(t('editor.editor.onDeleteUnpublishedChanges'))) {
-      return;
+
+    if (!force) {
+      if (
+        entryDraft.get('hasChanged') &&
+        !window.confirm(
+          t('editor.editor.onDeleteUnpublishedChangesWithUnsavedChanges') || isDeleteWorkflow,
+        )
+      ) {
+        return;
+      } else if (!window.confirm(t('editor.editor.onDeleteUnpublishedChanges'))) {
+        return;
+      }
     }
 
+
     await deleteUnpublishedEntry(collection.get('name'), slug);
 
     // this.deleteBackup();
@@ -512,6 +580,7 @@ function mapStateToProps(state, ownProps) {
 const mapDispatchToProps = {
   changeDraftField,
   changeDraftFieldValidation,
+  getUnpublishedEntries,
   loadEntry,
   loadEntries,
   loadDeployPreview,
@@ -520,9 +589,11 @@ const mapDispatchToProps = {
   // persistLocalBackup,
   // deleteLocalBackup,
   createDraftDuplicateFromEntry,
+  createLocalEmptyDraft,
   createEmptyDraft,
   discardDraft,
   persistEntry,
+  persistUnpublishedEntry,
   deleteEntry,
   updateUnpublishedEntryStatus,
   publishUnpublishedEntry,
@@ -531,6 +602,7 @@ const mapDispatchToProps = {
   removeAssets,
   removeDraftEntryMediaFiles,
   logoutUser,
+  searchEntries,
 };
 
 export default connect(mapStateToProps, mapDispatchToProps)(withWorkflow(translate()(Editor)));
diff --git a/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControl.js b/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControl.js
index b5f09b75df49..a577cc1ccad9 100644
--- a/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControl.js
+++ b/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControl.js
@@ -12,7 +12,7 @@ import ReactMarkdown from 'react-markdown';
 import gfm from 'remark-gfm';
 import { List, Map } from 'immutable';
 
-import { resolveWidget, getEditorComponents } from '../../../lib/registry';
+import { resolveWidget, getEditorComponents, getWidget } from '../../../lib/registry';
 import { clearFieldErrors, tryLoadEntry, validateMetaField } from '../../../actions/entries';
 import { addAsset, boundGetAsset } from '../../../actions/media';
 import { selectIsLoadingAsset } from '../../../reducers/medias';
@@ -70,6 +70,9 @@ const styleStrings = {
   unused: `
     opacity: 0.5;
   `,
+  flat: `
+    margin-top: 0 !important;
+  `
 };
 
 const ControlContainer = styled.div`
@@ -204,6 +207,7 @@ class EditorControl extends React.Component {
       value,
       entry,
       collection,
+      collections,
       config,
       field,
       fieldsMetaData,
@@ -268,6 +272,7 @@ class EditorControl extends React.Component {
             css={css`
               ${!this.state.use && unused && styleStrings.unused}
               ${isHidden && styleStrings.hidden};
+              ${isFlat && styleStrings.flat}
             `}
           >
             {widgetTitle && <h1>{widgetTitle}</h1>}
@@ -335,6 +340,7 @@ class EditorControl extends React.Component {
               controlComponent={widget.control}
               entry={entry}
               collection={collection}
+              collections={collections}
               config={config}
               field={field}
               uniqueFieldId={this.uniqueFieldId}
@@ -360,6 +366,7 @@ class EditorControl extends React.Component {
               resolveWidget={resolveWidget}
               widget={widget}
               getEditorComponents={getEditorComponents}
+              getWidget={getWidget}
               controlRef={controlRef}
               editorControl={ConnectedEditorControl}
               query={query}
@@ -436,6 +443,7 @@ function mapStateToProps(state) {
     config: state.config,
     entry,
     collection,
+    collections: state.collections,
     isLoadingAsset,
     loadEntry,
     validateMetaField: (field, value, t) => validateMetaField(state, collection, field, value, t),
diff --git a/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControlPane.js b/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControlPane.js
index 393143359015..341e96b8d935 100644
--- a/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControlPane.js
+++ b/packages/decap-cms-core/src/components/Editor/EditorControlPane/EditorControlPane.js
@@ -113,10 +113,12 @@ export default class ControlPane extends React.Component {
     const parentName = field.get('parentName');
     const name = field.get('name');
     const validateName = parentName ? `${parentName}.${name}` : name;
+    this.childRefs[validateName] = wrappedControl;
+  };
 
-    this.componentValidate[validateName] =
-      wrappedControl.innerWrappedControl?.validate || wrappedControl.validate;
-  }
+  getControlRef = field => wrappedControl => {
+    this.controlRef(field, wrappedControl);
+  };
 
   handleLocaleChange = val => {
     this.setState({ selectedLocale: val });
diff --git a/packages/decap-cms-core/src/components/Editor/EditorControlPane/Widget.js b/packages/decap-cms-core/src/components/Editor/EditorControlPane/Widget.js
index d381ef807ddb..7e8980da8423 100644
--- a/packages/decap-cms-core/src/components/Editor/EditorControlPane/Widget.js
+++ b/packages/decap-cms-core/src/components/Editor/EditorControlPane/Widget.js
@@ -55,6 +55,7 @@ export default class Widget extends Component {
     resolveWidget: PropTypes.func.isRequired,
     widget: PropTypes.object.isRequired,
     getEditorComponents: PropTypes.func.isRequired,
+    getWidget: PropTypes.func.isRequired,
     isFetching: PropTypes.bool,
     query: PropTypes.func.isRequired,
     clearSearch: PropTypes.func.isRequired,
@@ -310,6 +311,7 @@ export default class Widget extends Component {
       controlComponent,
       entry,
       collection,
+      collections,
       config,
       field,
       value,
@@ -336,6 +338,7 @@ export default class Widget extends Component {
       resolveWidget,
       widget,
       getEditorComponents,
+      getWidget,
       query,
       queryHits,
       clearSearch,
@@ -360,6 +363,7 @@ export default class Widget extends Component {
     return React.createElement(controlComponent, {
       entry,
       collection,
+      collections,
       config,
       field,
       value,
@@ -390,6 +394,7 @@ export default class Widget extends Component {
       resolveWidget,
       widget,
       getEditorComponents,
+      getWidget,
       getRemarkPlugins,
       query,
       queryHits,
diff --git a/packages/decap-cms-core/src/components/Editor/EditorToolbar.js b/packages/decap-cms-core/src/components/Editor/EditorToolbar.js
index c139a31737d1..13456f6045a0 100644
--- a/packages/decap-cms-core/src/components/Editor/EditorToolbar.js
+++ b/packages/decap-cms-core/src/components/Editor/EditorToolbar.js
@@ -219,6 +219,13 @@ const StatusButton = styled(DropdownButton)`
   background-color: ${colorsRaw.tealLight};
   color: ${colorsRaw.teal};
 
+  ${props =>
+    props.label === 'processing' &&
+    css`
+      background-color: ${colors.processingBackground};
+      color: ${colors.processingText};
+   `}
+
   ${props =>
     props.label === 'stale' &&
     css`
@@ -383,13 +390,53 @@ export class EditorToolbar extends React.Component {
     );
   };
 
+  handleStatusChange = (newStatusName) => {
+    const {
+      currentStatus,
+      onChangeStatus,
+      t
+    } = this.props;
+
+    if (currentStatus === status.get('PROCESSING')) {
+      const newStatusLabel = t(`editor.editorToolbar.${newStatusName.toLowerCase()}`);
+
+      if (!window.confirm(t('editor.editor.onProcessingStatusChange', {
+        newStatus: newStatusLabel
+      }))) {
+        return;
+      }
+    }
+
+    onChangeStatus(newStatusName);
+  }
+
+  handleDelete = () => {
+    const {
+      currentStatus,
+      hasUnpublishedChanges,
+      onDeleteUnpublishedChanges,
+      onDelete,
+      t
+    } = this.props;
+    if (currentStatus === status.get('PROCESSING')) {
+      const translationKey = hasUnpublishedChanges
+        ? 'editor.editor.onProcessingDeleteUnpublishedChanges'
+        : 'editor.editor.onProcessingDeleteEntry';
+      if (!window.confirm(t(translationKey))) {
+        return;
+      }
+    }
+    return hasUnpublishedChanges ? onDeleteUnpublishedChanges() : onDelete();
+  }
+
   renderWorkflowStatusControls = () => {
-    const { isUpdatingStatus, onChangeStatus, currentStatus, t, useOpenAuthoring } = this.props;
+    const { isUpdatingStatus, currentStatus, t, useOpenAuthoring } = this.props;
 
     const statusToTranslation = {
       [status.get('DRAFT')]: t('editor.editorToolbar.draft'),
       [status.get('PENDING_REVIEW')]: t('editor.editorToolbar.inReview'),
       [status.get('PENDING_PUBLISH')]: t('editor.editorToolbar.ready'),
+      [status.get('PROCESSING')]: t('editor.editorToolbar.inProcessing'),
       [status.get('STALE')]: t('editor.editorToolbar.inStale'),
     };
 
@@ -406,12 +453,12 @@ export class EditorToolbar extends React.Component {
         >
           <StatusDropdownItem
             label={t('editor.editorToolbar.draft')}
-            onClick={() => onChangeStatus('DRAFT')}
+            onClick={() => this.handleStatusChange('DRAFT')}
             icon={currentStatus === status.get('DRAFT') ? 'check' : null}
           />
           <StatusDropdownItem
             label={t('editor.editorToolbar.inReview')}
-            onClick={() => onChangeStatus('PENDING_REVIEW')}
+            onClick={() => this.handleStatusChange('PENDING_REVIEW')}
             icon={currentStatus === status.get('PENDING_REVIEW') ? 'check' : null}
           />
           {useOpenAuthoring ? (
@@ -419,7 +466,7 @@ export class EditorToolbar extends React.Component {
           ) : (
             <StatusDropdownItem
               label={t('editor.editorToolbar.ready')}
-              onClick={() => onChangeStatus('PENDING_PUBLISH')}
+              onClick={() => this.handleStatusChange('PENDING_PUBLISH')}
               icon={currentStatus === status.get('PENDING_PUBLISH') ? 'check' : null}
             />
           )}
@@ -597,8 +644,6 @@ export class EditorToolbar extends React.Component {
   renderWorkflowControls = () => {
     const {
       onPersist,
-      onDelete,
-      onDeleteUnpublishedChanges,
       // showDelete,
       hasChanged,
       hasUnpublishedChanges,
@@ -626,7 +671,6 @@ export class EditorToolbar extends React.Component {
     //     (isNewEntry || !isModification) &&
     //     t('editor.editorToolbar.deleteUnpublishedEntry')) ||
     //   (!hasUnpublishedChanges && !isModification && t('editor.editorToolbar.deletePublishedEntry'));
-
     return [
       <SaveButton
         disabled={!hasChanged}
@@ -637,25 +681,25 @@ export class EditorToolbar extends React.Component {
       </SaveButton>,
       currentStatus
         ? [
-            <React.Fragment key="workflow-status-controls">
-              {this.renderWorkflowStatusControls()}
-              {currentStatus === status.get('PENDING_PUBLISH') &&
-                this.renderNewEntryWorkflowPublishControls({ canCreate, canPublish })}
-            </React.Fragment>,
-          ]
+          <React.Fragment key="workflow-status-controls">
+            {this.renderWorkflowStatusControls()}
+            {currentStatus === status.get('PENDING_PUBLISH') &&
+              this.renderNewEntryWorkflowPublishControls({ canCreate, canPublish })}
+          </React.Fragment>,
+        ]
         : !isNewEntry && (
-            <React.Fragment key="existing-entry-workflow-publish-controls">
-              {this.renderExistingEntryWorkflowPublishControls({
-                canCreate,
-                canPublish,
-                canDelete,
-              })}
-            </React.Fragment>
-          ),
+          <React.Fragment key="existing-entry-workflow-publish-controls">
+            {this.renderExistingEntryWorkflowPublishControls({
+              canCreate,
+              canPublish,
+              canDelete,
+            })}
+          </React.Fragment>
+        ),
       !hasUnpublishedChanges && !isModification ? null : (
         <DeleteButton
           key="delete-button"
-          onClick={hasUnpublishedChanges ? onDeleteUnpublishedChanges : onDelete}
+          onClick={this.handleDelete}
         >
           {isDeleting ? t('editor.editorToolbar.discarding') : deleteLabel}
         </DeleteButton>
diff --git a/packages/decap-cms-core/src/components/Editor/withWorkflow.js b/packages/decap-cms-core/src/components/Editor/withWorkflow.js
index 47fb52c0cfb8..1766beefc08a 100644
--- a/packages/decap-cms-core/src/components/Editor/withWorkflow.js
+++ b/packages/decap-cms-core/src/components/Editor/withWorkflow.js
@@ -26,7 +26,7 @@ function mapStateToProps(state, ownProps) {
 }
 
 function mergeProps(stateProps, dispatchProps, ownProps) {
-  const { isEditorialWorkflow, unpublishedEntry } = stateProps;
+  const { isEditorialWorkflow } = stateProps;
   const { dispatch } = dispatchProps;
   const returnObj = {};
 
@@ -35,8 +35,10 @@ function mergeProps(stateProps, dispatchProps, ownProps) {
     returnObj.loadEntry = (collection, slug) => dispatch(loadUnpublishedEntry(collection, slug));
 
     // Overwrite persistEntry to persistUnpublishedEntry
-    returnObj.persistEntry = collection =>
-      dispatch(persistUnpublishedEntry(collection, unpublishedEntry));
+    returnObj.persistEntry = (collection, context, entryDraft) => {
+      const { unpublished = stateProps.unpublishedEntry } = context;
+      return dispatch(persistUnpublishedEntry(collection, unpublished, context, entryDraft));
+    }
   }
 
   return {
diff --git a/packages/decap-cms-core/src/components/Workflow/WorkflowList.js b/packages/decap-cms-core/src/components/Workflow/WorkflowList.js
index 855a79a2a211..87b6b8a9266f 100644
--- a/packages/decap-cms-core/src/components/Workflow/WorkflowList.js
+++ b/packages/decap-cms-core/src/components/Workflow/WorkflowList.js
@@ -15,7 +15,7 @@ import { selectEntryCollectionTitle } from '../../reducers/collections';
 const WorkflowListContainer = styled.div`
   min-height: 60%;
   display: grid;
-  grid-template-columns: 25% 25% 25% 25%;
+  grid-template-columns: 20% 20% 20% 20% 20%;
 `;
 
 const WorkflowListContainerOpenAuthoring = styled.div`
@@ -105,6 +105,13 @@ const ColumnHeader = styled.h2`
       color: ${colors.statusReadyText};
     `}
 
+  ${props =>
+    props.name === 'processing' &&
+    css`
+      background-color: ${colors.processingBackground};
+      color: ${colors.processingText};
+   `}
+
   ${props =>
     props.name === 'stale' &&
     css`
@@ -128,12 +135,14 @@ function getColumnHeaderText(columnName, t) {
   switch (columnName) {
     case 'draft':
       return t('workflow.workflowList.draftHeader');
-    case 'stale':
-      return t('workflow.workflowList.inStaleHeader');
     case 'pending_review':
       return t('workflow.workflowList.inReviewHeader');
     case 'pending_publish':
       return t('workflow.workflowList.readyHeader');
+    case 'processing':
+      return t('workflow.workflowList.inProcessingHeader');
+    case 'stale':
+      return t('workflow.workflowList.inStaleHeader');
   }
 }
 
@@ -152,6 +161,10 @@ class WorkflowList extends React.Component {
     const slug = dragProps.slug;
     const collection = dragProps.collection;
     const oldStatus = dragProps.ownStatus;
+    if (oldStatus === 'processing') {
+      window.alert(this.props.t('workflow.workflowList.onProcessingUpdate'))
+      return;
+    }
     if (newStatus === 'stale') {
       window.alert(this.props.t('workflow.workflowList.onStaleUpdate'));
       return;
@@ -160,6 +173,10 @@ class WorkflowList extends React.Component {
   };
 
   requestDelete = (collection, slug, ownStatus) => {
+    if (ownStatus === 'processing') {
+      window.alert(this.props.t('workflow.workflowList.onProcessingUpdate'))
+      return;
+    }
     if (window.confirm(this.props.t('workflow.workflowList.onDeleteEntry'))) {
       this.props.handleDelete(collection, slug, ownStatus);
     }
diff --git a/packages/decap-cms-core/src/constants/publishModes.ts b/packages/decap-cms-core/src/constants/publishModes.ts
index 62be9769ff49..a64fd344ee66 100644
--- a/packages/decap-cms-core/src/constants/publishModes.ts
+++ b/packages/decap-cms-core/src/constants/publishModes.ts
@@ -8,6 +8,7 @@ export const Statues = {
   DRAFT: 'draft',
   PENDING_REVIEW: 'pending_review',
   PENDING_PUBLISH: 'pending_publish',
+  PROCESSING: 'processing',
   STALE: 'stale',
 };
 
diff --git a/packages/decap-cms-core/src/lib/registry.js b/packages/decap-cms-core/src/lib/registry.js
index 573d8867762c..ef094fe37a57 100644
--- a/packages/decap-cms-core/src/lib/registry.js
+++ b/packages/decap-cms-core/src/lib/registry.js
@@ -1,6 +1,7 @@
 import { Map } from 'immutable';
 import { produce } from 'immer';
 import { oneLine } from 'common-tags';
+import * as immutable from 'immutable';
 
 import EditorComponent from '../valueObjects/EditorComponent';
 
@@ -17,10 +18,15 @@ allowedEvents.forEach(e => {
   eventHandlers[e] = [];
 });
 
+const lib = {
+  immutable,
+}
+
 /**
  * Global Registry Object
  */
 const registry = {
+  lib,
   backends: {},
   templates: {},
   previewStyles: [],
@@ -35,6 +41,7 @@ const registry = {
 };
 
 export default {
+  getLib,
   registerPreviewStyle,
   getPreviewStyles,
   registerPreviewTemplate,
@@ -65,6 +72,10 @@ export default {
   getCustomFormatsFormatters,
 };
 
+export function getLib() {
+  return registry.lib;
+}
+
 /**
  * Preview Styles
  *
@@ -310,3 +321,4 @@ export function getCustomFormatsFormatters() {
 export function getFormatter(name) {
   return registry.formats[name]?.formatter;
 }
+
diff --git a/packages/decap-cms-core/src/reducers/entries.ts b/packages/decap-cms-core/src/reducers/entries.ts
index 068d486a0e75..9a10e032bb67 100644
--- a/packages/decap-cms-core/src/reducers/entries.ts
+++ b/packages/decap-cms-core/src/reducers/entries.ts
@@ -230,7 +230,7 @@ function entries(
       const payload = action.payload as EntryDeletePayload;
       return state.withMutations(map => {
         map.deleteIn(['entities', `${payload.collectionName}.${payload.entrySlug}`]);
-        map.updateIn(['pages', payload.collectionName, 'ids'], (ids: string[]) =>
+        map.updateIn(['pages', payload.collectionName, 'ids'], (ids: string[] = []) =>
           ids.filter(id => id !== payload.entrySlug),
         );
       });
diff --git a/packages/decap-cms-core/src/reducers/entryDraft.js b/packages/decap-cms-core/src/reducers/entryDraft.js
index 4c16435eb54c..d85374feab3a 100644
--- a/packages/decap-cms-core/src/reducers/entryDraft.js
+++ b/packages/decap-cms-core/src/reducers/entryDraft.js
@@ -168,6 +168,7 @@ function entryDraftReducer(state = Map(), action) {
     case ENTRY_PERSIST_SUCCESS:
     case UNPUBLISHED_ENTRY_PERSIST_SUCCESS:
       return state.withMutations(state => {
+        if (action.payload.entry) state.setIn(['entry', 'data'], action.payload.entry.get('data'));
         state.deleteIn(['entry', 'isPersisting']);
         state.set('hasChanged', false);
         if (!state.getIn(['entry', 'slug'])) {
diff --git a/packages/decap-cms-core/src/types/redux.ts b/packages/decap-cms-core/src/types/redux.ts
index 3b00b312a5f8..c5309de7ec45 100644
--- a/packages/decap-cms-core/src/types/redux.ts
+++ b/packages/decap-cms-core/src/types/redux.ts
@@ -556,6 +556,7 @@ export type EntryObject = {
   mediaFiles: List<MediaFileMap>;
   newRecord: boolean;
   isDeleteWorkflow: boolean;
+  isCustomEntry?: boolean;
   author?: string;
   updatedOn?: string;
   status: string;
diff --git a/packages/decap-cms-locales/src/en/index.js b/packages/decap-cms-locales/src/en/index.js
index c75762c44b55..261f09fdf1b3 100644
--- a/packages/decap-cms-locales/src/en/index.js
+++ b/packages/decap-cms-locales/src/en/index.js
@@ -115,6 +115,9 @@ const en = {
         'All changes to this entry will be deleted.\n\n Do you still want to delete?',
       loadingEntry: 'Loading entry...',
       confirmLoadBackup: 'A local backup was recovered for this entry, would you like to use it?',
+      onProcessingStatusChange: "Are you sure you want to change the status to %{newStatus} while the entry is processing?",
+      onProcessingDeleteUnpublishedChanges: "Are you sure you want to delete unpublished changes while the entry is processing?",
+      onProcessingDeleteEntry: "Are you sure you want to delete this entry while it is processing?",
       onStackPublishing: 'Are you sure you want to publish all changes?',
       onStackClosing: 'Are you sure you want to discard all changes?',
     },
@@ -153,6 +156,7 @@ const en = {
       draft: 'Draft',
       inReview: 'In review',
       ready: 'Ready',
+      inProcessing: 'Processing',
       inStale: 'Stale',
       publishNow: 'Publish now',
       stackChange: 'Stack change',
@@ -323,6 +327,7 @@ const en = {
       draftHeader: 'Drafts',
       inReviewHeader: 'In Review',
       readyHeader: 'Ready',
+      inProcessingHeader: 'Processing',
       inStaleHeader: 'Stale',
       onStaleUpdate:
         "Entry can't be manually updated to stale status! Please discard changes insted of using stale status.",
diff --git a/packages/decap-cms-ui-default/src/ListItemTopBar.js b/packages/decap-cms-ui-default/src/ListItemTopBar.js
index cc09183b6652..dfa1d2d0b346 100644
--- a/packages/decap-cms-ui-default/src/ListItemTopBar.js
+++ b/packages/decap-cms-ui-default/src/ListItemTopBar.js
@@ -28,6 +28,10 @@ const TopBarButton = styled.button`
   align-items: center;
 `;
 
+const TopBarButtonGroups = styled.div`
+  display: flex;
+`;
+
 const TopBarButtonSpan = TopBarButton.withComponent('span');
 
 const DragIconContainer = styled(TopBarButtonSpan)`
@@ -46,7 +50,7 @@ function DragHandle({ Wrapper, id }) {
 }
 
 function ListItemTopBar(props) {
-  const { className, collapsed, onCollapseToggle, onRemove, dragHandle, id } = props;
+  const { className, collapsed, onCollapseToggle, onDuplicate, onRemove, dragHandle, id } = props;
   return (
     <TopBar className={className}>
       {onCollapseToggle ? (
@@ -55,11 +59,18 @@ function ListItemTopBar(props) {
         </TopBarButton>
       ) : null}
       {dragHandle ? <DragHandle Wrapper={dragHandle} id={id} /> : null}
-      {onRemove ? (
-        <TopBarButton onClick={onRemove}>
-          <Icon type="close" size="small" />
-        </TopBarButton>
-      ) : null}
+      <TopBarButtonGroups>
+        {onDuplicate ? (
+          <TopBarButton onClick={onDuplicate}>
+            <Icon type="pages-alt" size="small" />
+          </TopBarButton>
+        ) : null}
+        {onRemove ? (
+          <TopBarButton onClick={onRemove}>
+            <Icon type="close" size="small" />
+          </TopBarButton>
+        ) : null}
+      </TopBarButtonGroups>
     </TopBar>
   );
 }
diff --git a/packages/decap-cms-ui-default/src/Toggle.js b/packages/decap-cms-ui-default/src/Toggle.js
index 46a4d25b9c39..50923f5cd6d7 100644
--- a/packages/decap-cms-ui-default/src/Toggle.js
+++ b/packages/decap-cms-ui-default/src/Toggle.js
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
 import styled from '@emotion/styled';
 import { css } from '@emotion/react';
@@ -57,6 +57,10 @@ function Toggle({
 }) {
   const [isActive, setIsActive] = useState(active);
 
+  useEffect(() => {
+    setIsActive(active);
+  }, [active]);
+
   function handleToggle() {
     setIsActive(prevIsActive => !prevIsActive);
     if (onChange) {
diff --git a/packages/decap-cms-ui-default/src/styles.js b/packages/decap-cms-ui-default/src/styles.js
index 684eb78019ea..ae9266248acc 100644
--- a/packages/decap-cms-ui-default/src/styles.js
+++ b/packages/decap-cms-ui-default/src/styles.js
@@ -42,6 +42,7 @@ const colorsRaw = {
   greenLight: '#caef6f',
   brown: '#754e00',
   yellow: '#ffee9c',
+  yellowDark: '#ffe150',
   red: '#ff003b',
   redDark: '#D60032',
   redLight: '#fcefea',
@@ -59,6 +60,8 @@ const colors = {
   statusReviewBackground: colorsRaw.yellow,
   statusReadyText: colorsRaw.green,
   statusReadyBackground: colorsRaw.greenLight,
+  processingBackground: colorsRaw.yellowDark,
+  processingText: colorsRaw.grayDark,
   staleBackground: colorsRaw.redDark,
   staleText: colorsRaw.redLight,
   text: colorsRaw.gray,
diff --git a/packages/decap-cms-widget-list/src/ListControl.js b/packages/decap-cms-widget-list/src/ListControl.js
index 5a2ee6c1dec0..6237fe8a0cf5 100644
--- a/packages/decap-cms-widget-list/src/ListControl.js
+++ b/packages/decap-cms-widget-list/src/ListControl.js
@@ -6,7 +6,6 @@ import { css, ClassNames } from '@emotion/react';
 import { List, Map, fromJS } from 'immutable';
 import { partial, isEmpty, uniqueId } from 'lodash';
 import { v4 as uuid } from 'uuid';
-import DecapCmsWidgetObject from 'decap-cms-widget-object';
 import {
   DndContext,
   MouseSensor,
@@ -34,8 +33,6 @@ import {
   getErrorMessageForTypedFieldAndValue,
 } from './typedListHelpers';
 
-const ObjectControl = DecapCmsWidgetObject.controlComponent;
-
 const ListItem = styled.div();
 
 const StyledListItemTopBar = styled(ListItemTopBar)`
@@ -195,8 +192,6 @@ export default class ListControl extends React.Component {
     resolveWidget: PropTypes.func.isRequired,
     clearFieldErrors: PropTypes.func.isRequired,
     fieldsErrors: ImmutablePropTypes.map.isRequired,
-    isFieldUnused: PropTypes.func,
-    setFieldUnused: PropTypes.func,
     entry: ImmutablePropTypes.map.isRequired,
     t: PropTypes.func,
   };
@@ -414,7 +409,7 @@ export default class ListControl extends React.Component {
    */
   getObjectValue = idx => this.props.value.get(idx) || Map();
 
-  handleChangeFor(index) {
+  handleFieldChangeFor(index) {
     return (f, newValue, newMetadata) => {
       const { value, metadata, onChange, field } = this.props;
       const collectionName = field.get('name');
@@ -435,6 +430,41 @@ export default class ListControl extends React.Component {
     };
   }
 
+  handleChangeFor(index) {
+    return (newValue, newMetadata) => {
+      const { value, metadata, onChange, field } = this.props;
+      const collectionName = field.get('name');
+      const parsedMetadata = {
+        [collectionName]: Object.assign(metadata ? metadata.toJS() : {}, newMetadata || {}),
+      };
+      onChange(value.set(index, newValue), parsedMetadata);
+    };
+  }
+
+  handleDuplicate = (index, event) => {
+    event.preventDefault();
+    const { value, onChange } = this.props;
+
+    const listValue = value.get(index);
+    if (!listValue) return
+
+    const { itemsCollapsed } = this.state;
+
+    // Create new arrays with the item inserted at index + 1
+    const newItemsCollapsed = [...itemsCollapsed];
+    const newKeys = [...this.state.keys];
+
+    newItemsCollapsed.splice(index + 1, 0, false); // Insert expanded state
+    newKeys.splice(index + 1, 0, uuid()); // Insert new key
+
+    this.setState({
+      itemsCollapsed: newItemsCollapsed,
+      keys: newKeys
+    });
+
+    onChange(value.insert(index + 1, listValue));
+  };
+
   handleRemove = (index, event) => {
     event.preventDefault();
     const { itemsCollapsed } = this.state;
@@ -637,13 +667,12 @@ export default class ListControl extends React.Component {
       metadata,
       clearFieldErrors,
       fieldsErrors,
-      controlRef,
       resolveWidget,
       parentIds,
       forID,
       t,
-      isFieldUnused,
-      setFieldUnused,
+      collection,
+      collections,
     } = this.props;
 
     const { itemsCollapsed, keys } = this.state;
@@ -659,6 +688,8 @@ export default class ListControl extends React.Component {
       }
     }
 
+    const ObjectControl = (this.props.getWidget('object')).control;
+
     return (
       <SortableListItem
         css={[styles.listControlItem, collapsed && styles.listControlItemCollapsed]}
@@ -682,6 +713,7 @@ export default class ListControl extends React.Component {
           onCollapseToggle={partial(this.handleItemCollapseToggle, index)}
           dragHandle={DragHandle}
           id={key}
+          onDuplicate={partial(this.handleDuplicate, index)}
           onRemove={partial(this.handleRemove, index)}
           data-testid={`styled-list-item-top-bar-${key}`}
         />
@@ -698,7 +730,10 @@ export default class ListControl extends React.Component {
               })}
               value={item}
               field={field}
-              onChangeObject={this.handleChangeFor(index)}
+              collection={collection}
+              collections={collections}
+              onChange={this.handleChangeFor(index)}
+              onChangeObject={this.handleFieldChangeFor(index)}
               editorControl={editorControl}
               resolveWidget={resolveWidget}
               metadata={metadata}
@@ -706,15 +741,12 @@ export default class ListControl extends React.Component {
               onValidateObject={onValidateObject}
               clearFieldErrors={clearFieldErrors}
               fieldsErrors={fieldsErrors}
-              ref={this.processControlRef}
-              controlRef={controlRef}
+              controlRef={this.processControlRef}
               validationKey={key}
               collapsed={collapsed}
               data-testid={`object-control-${key}`}
               hasError={hasError}
               parentIds={[...parentIds, forID, key]}
-              isFieldUnused={isFieldUnused}
-              setFieldUnused={setFieldUnused}
             />
           )}
         </ClassNames>
@@ -734,7 +766,7 @@ export default class ListControl extends React.Component {
       >
         <StyledListItemTopBar
           onCollapseToggle={null}
-          onRemove={partial(this.handleRemove, index, key)}
+          onRemove={partial(this.handleRemove, index)}
           dragHandle={DragHandle}
           id={key}
         />
diff --git a/packages/decap-cms-widget-object/src/ObjectControl.js b/packages/decap-cms-widget-object/src/ObjectControl.js
index 4a3dbf8492c5..5c29dee3f6a5 100644
--- a/packages/decap-cms-widget-object/src/ObjectControl.js
+++ b/packages/decap-cms-widget-object/src/ObjectControl.js
@@ -26,9 +26,13 @@ export default class ObjectControl extends React.Component {
 
   processControlRef = ref => {
     if (!ref) return;
-    const name = ref.props.field.get('name');
-    this.childRefs[name] = ref;
-    this.props.controlRef?.(ref);
+    const parentId = ref.props.parentIds[ref.props.parentIds.length - 1];
+    const belongsToDifferentParent = parentId && this.props.forID && parentId !== this.props.forID;
+    if (!belongsToDifferentParent) {
+      const name = ref.props.field.get('name');
+      this.childRefs[name] = ref;
+    }
+    this.props.controlRef?.(this);
   };
 
   static propTypes = {
@@ -87,7 +91,9 @@ export default class ObjectControl extends React.Component {
     fields = List.isList(fields) ? fields : List([fields]);
     fields.forEach(field => {
       const widget = field.get('widget');
+
       if (widget === 'hidden' || (widget === 'object' && field.has('flat'))) return;
+
       const parentName = field.get('parentName');
       const name = field.get('name');
 
@@ -260,7 +266,9 @@ export default class ObjectControl extends React.Component {
             ?.map(field => field.set('parentName', fieldParentName));
           const singleField = f.get('field')?.set('parentName', fieldParentName);
 
-          return mappedMultiFields.push(...this.renderFields(multiFields, singleField, f));
+          const renderedFields = this.renderFields(multiFields, singleField, f);
+          if (Array.isArray(renderedFields)) return mappedMultiFields.push(...renderedFields);
+          return mappedMultiFields.push(renderedFields);
         }
         return mappedMultiFields.push(this.controlFor(f, idx));
       });
diff --git a/packages/decap-cms-widget-relation/src/RelationControl.js b/packages/decap-cms-widget-relation/src/RelationControl.js
index c17deca0a536..c9e5be261451 100644
--- a/packages/decap-cms-widget-relation/src/RelationControl.js
+++ b/packages/decap-cms-widget-relation/src/RelationControl.js
@@ -227,15 +227,12 @@ export default class RelationControl extends React.Component {
     return (
       this.props.value !== nextProps.value ||
       this.props.hasActiveStyle !== nextProps.hasActiveStyle ||
-      this.props.queryHits !== nextProps.queryHits
+      this.props.queryHits !== nextProps.queryHits ||
+      this.props.field.get('collection') !== nextProps.field.get('collection')
     );
   }
 
-  async componentDidMount() {
-    this.mounted = true;
-    // if the field has a previous value perform an initial search based on the value field
-    // this is required since each search is limited by optionsLength so the selected value
-    // might not show up on the search
+  async loadInitialOptions() {
     const { forID, field, value, query, onChange } = this.props;
     const collection = field.get('collection');
     const file = field.get('file');
@@ -272,6 +269,17 @@ export default class RelationControl extends React.Component {
     }
   }
 
+  async componentDidMount() {
+    this.mounted = true;
+    await this.loadInitialOptions();
+  }
+
+  async componentDidUpdate(prevProps) {
+    if (this.props.field.get('collection') !== prevProps.field.get('collection')) {
+      await this.loadInitialOptions();
+    }
+  }
+
   componentWillUnmount() {
     this.mounted = false;
   }
@@ -424,7 +432,7 @@ export default class RelationControl extends React.Component {
         value={selectedValue}
         inputId={forID}
         cacheOptions
-        defaultOptions
+        defaultOptions={options?.length ? options : true}
         loadOptions={this.loadOptions}
         onChange={this.handleChange}
         className={classNameWrapper}
diff --git a/packages/decap-cms-widget-string/src/StringControl.js b/packages/decap-cms-widget-string/src/StringControl.js
index 339e9338058f..01910fc36174 100644
--- a/packages/decap-cms-widget-string/src/StringControl.js
+++ b/packages/decap-cms-widget-string/src/StringControl.js
@@ -29,9 +29,11 @@ export default class StringControl extends React.Component {
   // The input element ref
   _el = null;
 
-  shouldComponentUpdate(nextProps, nextState) {
+  shouldComponentUpdate(nextProps, nextState = {}) {
     return Boolean(
-      nextState && (this.state.value !== nextState.value || nextProps.value !== nextState.value),
+      this.props.classNameWrapper !== nextProps.classNameWrapper ||
+      this.state.value !== nextState.value ||
+      nextProps.value !== nextState.value
     );
   }