added default export to store

.gitignore

@@ -1,5 +1,6 @@
 dist/
-www/build
+www/
+loader/
 
 *~
 *.sw[mnpcod]
@@ -11,8 +12,8 @@ log.txt
 *.sublime-project
 *.sublime-workspace
 
+.stencil/
 .idea/
-.vscode/
 .sass-cache/
 .versions/
 node_modules/

package.json

@@ -3,7 +3,7 @@
   "version": "0.1.1",
   "description": "Stencil Redux - A simple redux-connector for Stencil-built web components",
   "main": "dist/index.js",
-  "module": "dist/esm/es5/index.js",
+  "module": "dist/index.mjs",
   "types": "dist/types/index.d.ts",
   "collection": "dist/collection/collection-manifest.json",
   "files": [
@@ -27,16 +27,16 @@
     "url": "git+https://github.com/ionic-team/stencil-redux.git"
   },
   "devDependencies": {
-    "@stencil/core": "^0.18.0",
+    "@stencil/core": "1.12.2",
     "@types/jest": "^24.0.5",
     "@types/redux": "^3.6.0",
     "husky": "^3.0.2",
     "jest": "^24.1.0",
     "np": "^5.0.0",
     "redux": "^4.0.1",
     "ts-jest": "^24.0.0",
-    "tslint": "^5.12.1",
-    "tslint-ionic-rules": "0.0.21"
+    "tslint-ionic-rules": "0.0.21",
+    "tslint": "^5.12.1"
   },
   "peerDependencies": {
     "redux": "^4.0.1"

src/components.d.ts

@@ -1,45 +1,24 @@
+/* eslint-disable */
 /* tslint:disable */
 /**
  * This is an autogenerated file created by the Stencil compiler.
  * It contains typing information for all components that exist in this project.
  */
-
-
-import '@stencil/core';
-
-
-
-
+import { HTMLStencilElement, JSXBase } from "@stencil/core/internal";
 export namespace Components {
-
 }
-
 declare global {
-  interface StencilElementInterfaces {
-
-  }
-
-  interface StencilIntrinsicElements {
-
-  }
-
-
-
-  interface HTMLElementTagNameMap {
-
-  }
-
-  interface ElementTagNameMap {
-
-  }
-
-
-  export namespace JSX {
-    export interface Element {}
-    export interface IntrinsicElements extends StencilIntrinsicElements {
-      [tagName: string]: any;
+    interface HTMLElementTagNameMap {
+    }
+}
+declare namespace LocalJSX {
+    interface IntrinsicElements {
+    }
+}
+export { LocalJSX as JSX };
+declare module "@stencil/core" {
+    export namespace JSX {
+        interface IntrinsicElements {
+        }
     }
-  }
-  export interface HTMLAttributes extends StencilHTMLAttributes {}
-
 }

src/global/interfaces.ts

@@ -1,6 +1,6 @@
-import { Action, AnyAction, Store as ReduxStore, Unsubscribe } from 'redux';
+import { Action as ReduxAction, AnyAction, Store as ReduxStore, Unsubscribe } from 'redux';
 
-export interface Store<S = any, A extends Action = AnyAction> {
+export interface Store<S = any, A extends ReduxAction = AnyAction> {
   getState: () => S;
   getStore: () => ReduxStore<S, A>;
   setStore: (store: ReduxStore<S, A>) => void;

src/global/store.ts

@@ -4,55 +4,57 @@ import { Store } from './interfaces';
 
 declare var Context: any;
 
-Context.store = ((): Store => {
-  let _store: ReduxStore;
-
-  const setStore = (store: ReduxStore) => {
-    _store = store;
-  };
-
-  const getState = () => {
-    return _store && _store.getState();
-  };
-
-  const getStore = () => {
-    return _store;
-  };
-
-  const mapDispatchToProps = (component: any, props: any) => {
-    Object.keys(props).forEach(actionName => {
-      const action = props[actionName];
-      Object.defineProperty(component, actionName, {
-        get: () => (...args: any[]) => _store.dispatch(action(...args)),
-        configurable: true,
-        enumerable: true,
-      });
-    });
-  };
-
-  const mapStateToProps = (component: any, mapState: (...args: any[]) => any) => {
-    // TODO: Don't listen for each component
-    const _mapStateToProps = (_component: any, _mapState: any) => {
-      const mergeProps = mapState(_store.getState());
-      Object.keys(mergeProps).forEach(newPropName => {
-        const newPropValue = mergeProps[newPropName];
-        component[newPropName] = newPropValue;
-        // TODO: can we define new props and still have change detection work?
+export default () => {
+  Context.store = ((): Store => {
+    let _store: ReduxStore;
+
+    const setStore = (store: ReduxStore) => {
+      _store = store;
+    };
+
+    const getState = () => {
+      return _store && _store.getState();
+    };
+
+    const getStore = () => {
+      return _store;
+    };
+
+    const mapDispatchToProps = (component: any, props: any) => {
+      Object.keys(props).forEach(actionName => {
+        const action = props[actionName];
+        Object.defineProperty(component, actionName, {
+          get: () => (...args: any[]) => _store.dispatch(action(...args)),
+          configurable: true,
+          enumerable: true,
+        });
       });
     };
 
-    const unsubscribe = _store.subscribe(() => _mapStateToProps(component, mapState));
+    const mapStateToProps = (component: any, mapState: (...args: any[]) => any) => {
+      // TODO: Don't listen for each component
+      const _mapStateToProps = (_component: any, _mapState: any) => {
+        const mergeProps = mapState(_store.getState());
+        Object.keys(mergeProps).forEach(newPropName => {
+          const newPropValue = mergeProps[newPropName];
+          component[newPropName] = newPropValue;
+          // TODO: can we define new props and still have change detection work?
+        });
+      };
 
-    _mapStateToProps(component, mapState);
+      const unsubscribe = _store.subscribe(() => _mapStateToProps(component, mapState));
 
-    return unsubscribe;
-  };
+      _mapStateToProps(component, mapState);
 
-  return {
-    getStore,
-    setStore,
-    getState,
-    mapDispatchToProps,
-    mapStateToProps,
-  };
-})();
+      return unsubscribe;
+    };
+
+    return {
+      getStore,
+      setStore,
+      getState,
+      mapDispatchToProps,
+      mapStateToProps,
+    };
+  })();
+};

test/global/store.ts

@@ -1,18 +1,22 @@
 import { createStore } from 'redux';
+
 import { Store } from '../../src/global/interfaces';
 
 declare global {
   namespace NodeJS {
     interface Global {
       Context: {
         store: Store;
-      }
+      };
     }
   }
 }
 
 (global as any).Context = {};
-import '../../src/global/store';
+
+import { default as ReduxStore  } from '../../src/global/store';
+
+ReduxStore();
 
 describe('@stencil/redux', () => {