diff --git a/packages/widgets-example/package.json b/packages/widgets-example/package.json
index 4448028..ae48c40 100644
--- a/packages/widgets-example/package.json
+++ b/packages/widgets-example/package.json
@@ -3,6 +3,7 @@
   "version": "2.0.1",
   "private": true,
   "dependencies": {
+    "@redux-offline/redux-offline": "^2.5.0",
     "immer": "^1.7.2",
     "react": "^16.5.2",
     "react-dom": "^16.5.2",
diff --git a/packages/widgets-example/src/App.js b/packages/widgets-example/src/App.js
index ea22572..8ca740d 100644
--- a/packages/widgets-example/src/App.js
+++ b/packages/widgets-example/src/App.js
@@ -1,5 +1,5 @@
 import React, { Component } from 'react';
-import { createStore } from "redux";
+import { createStore, compose } from "redux";
 import { Provider } from "react-redux";
 // We will load the widgets async using react-loadable.
 import Loadable from "react-loadable";
@@ -9,6 +9,8 @@ import { moduleEnhancer } from "redux-dynamic-modules";
 import { getSagaExtension } from "redux-dynamic-modules-saga";
 // Thunk extension allows us to use Thunk middleware in the module store.
 import { getThunkExtension } from "redux-dynamic-modules-thunk";
+import { offline } from '@redux-offline/redux-offline';
+import offlineConfig from '@redux-offline/redux-offline/lib/defaults';
 import './App.css';
 
 class App extends Component {
@@ -26,7 +28,18 @@ class App extends Component {
      * The extensions are optional and you can choose extension based on the middleware you use
      * You can also build your own extensions for any other middleware e.g. redux-observable
      */
-    this.store = createStore(null, {}, moduleEnhancer([getThunkExtension(), getSagaExtension()]));
+    this.store = createStore(
+      (state, action) => state || {}, 
+      {}, 
+      compose(        
+             // if there are other enhancers that add state keys/reducers then moduleEnhancer should be the last one to be composed.
+             // similar to how the applyMiddleware should be the first one to be composed.
+             // Note that the composition happens from right to left, so the moduleEnhancer should be the left most in the compose calls.             
+              moduleEnhancer([getThunkExtension(), getSagaExtension()]), 
+              offline(offlineConfig) 
+                            
+      )
+      );
   }
 
   render() {