@mborecki/react-create-store 0.0.4 → 1.0.0

package/lib/index.d.ts

@@ -1,2 +1,2 @@
-import React from "react";
-export default function createStore<T, A>(userReducer: (state: T, action: A) => T, initState: T, localStorageKey?: string): [React.FunctionComponent, () => React.Dispatch<A>, () => T];
+import React from "react";
+export declare function createStore<T, A>(userReducer: (state: T, action: A) => T, initState: T, localStorageKey?: string): [React.FunctionComponent, () => React.Dispatch<A>, () => T];

package/lib/index.js

@@ -1,38 +1,31 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = __importDefault(require("react"));
-function createStore(userReducer, initState, localStorageKey) {
-    var dispathContext = react_1.default.createContext(function (value) { });
-    var storeContext = react_1.default.createContext(initState);
-    if (localStorageKey) {
-        try {
-            initState = JSON.parse(window.localStorage.getItem(localStorageKey) || '') || initState;
-        }
-        catch (_a) { }
-    }
-    var reducer = function (state, action) {
-        var newState = userReducer(state, action);
-        if (localStorageKey) {
-            localStorage.setItem(localStorageKey, JSON.stringify(newState));
-        }
-        return newState;
-    };
-    var StoreProvider = function (_a) {
-        var children = _a.children;
-        var _b = react_1.default.useReducer(reducer, initState), store = _b[0], dispatch = _b[1];
-        return (react_1.default.createElement(dispathContext.Provider, { value: dispatch },
-            react_1.default.createElement(storeContext.Provider, { value: store }, children)));
-    };
-    function useDispatch() {
-        return react_1.default.useContext(dispathContext);
-    }
-    function useStore() {
-        return react_1.default.useContext(storeContext);
-    }
-    return [StoreProvider, useDispatch, useStore];
-}
-exports.default = createStore;
+import React from "react";
+export function createStore(userReducer, initState, localStorageKey) {
+    const dispathContext = React.createContext((value) => { });
+    const storeContext = React.createContext(initState);
+    if (localStorageKey) {
+        try {
+            initState = JSON.parse(window.localStorage.getItem(localStorageKey) || '') || initState;
+        }
+        catch { }
+    }
+    const reducer = (state, action) => {
+        const newState = userReducer(state, action);
+        if (localStorageKey) {
+            localStorage.setItem(localStorageKey, JSON.stringify(newState));
+        }
+        return newState;
+    };
+    const StoreProvider = ({ children }) => {
+        const [store, dispatch] = React.useReducer(reducer, initState);
+        return (React.createElement(dispathContext.Provider, { value: dispatch },
+            React.createElement(storeContext.Provider, { value: store }, children)));
+    };
+    function useDispatch() {
+        return React.useContext(dispathContext);
+    }
+    function useStore() {
+        return React.useContext(storeContext);
+    }
+    return [StoreProvider, useDispatch, useStore];
+}
 //# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":";;;;;AAAA,gDAAuC;AAEvC,SAAwB,WAAW,CAAO,WAAuC,EAAE,SAAY,EAAE,eAAwB;IAErH,IAAM,cAAc,GAA+B,eAAK,CAAC,aAAa,CAAC,UAAC,KAAQ,IAAM,CAAC,CAAC,CAAC;IACzF,IAAM,YAAY,GAAe,eAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;IAEhE,IAAI,eAAe,EAAE;QACjB,IAAI;YACA,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,eAAe,CAAC,IAAI,EAAE,CAAC,IAAI,SAAS,CAAA;SAC1F;QAAC,WAAM,GAAG;KACd;IAED,IAAM,OAAO,GAAG,UAAC,KAAQ,EAAE,MAAS;QAChC,IAAM,QAAQ,GAAG,WAAW,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;QAC5C,IAAI,eAAe,EAAE;YACjB,YAAY,CAAC,OAAO,CAAC,eAAe,EAAE,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAA;SAClE;QAED,OAAO,QAAQ,CAAC;IACpB,CAAC,CAAA;IAED,IAAM,aAAa,GAA4B,UAAC,EAAY;YAAV,QAAQ,cAAA;QAChD,IAAA,KAAoB,eAAK,CAAC,UAAU,CAAC,OAAO,EAAE,SAAS,CAAC,EAAvD,KAAK,QAAA,EAAE,QAAQ,QAAwC,CAAA;QAG9D,OAAO,CACH,8BAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,QAAQ;YACpC,8BAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,IAC9B,QAAQ,CACY,CACF,CAC9B,CAAA;IACL,CAAC,CAAA;IAED,SAAS,WAAW;QAChB,OAAO,eAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC;IAC5C,CAAC;IAED,SAAS,QAAQ;QACb,OAAO,eAAK,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;IAC1C,CAAC;IAED,OAAO,CAAC,aAAa,EAAE,WAAW,EAAE,QAAQ,CAAC,CAAA;AACjD,CAAC;AA1CD,8BA0CC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,MAAM,UAAU,WAAW,CAAO,WAAuC,EAAE,SAAY,EAAE,eAAwB;IAE7G,MAAM,cAAc,GAA+B,KAAK,CAAC,aAAa,CAAC,CAAC,KAAQ,EAAE,EAAE,GAAE,CAAC,CAAC,CAAC;IACzF,MAAM,YAAY,GAAe,KAAK,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;IAEhE,IAAI,eAAe,EAAE,CAAC;QAClB,IAAI,CAAC;YACD,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,eAAe,CAAC,IAAI,EAAE,CAAC,IAAI,SAAS,CAAA;QAC3F,CAAC;QAAC,MAAM,CAAC,CAAC,CAAC;IACf,CAAC;IAED,MAAM,OAAO,GAAG,CAAC,KAAQ,EAAE,MAAS,EAAE,EAAE;QACpC,MAAM,QAAQ,GAAG,WAAW,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;QAC5C,IAAI,eAAe,EAAE,CAAC;YAClB,YAAY,CAAC,OAAO,CAAC,eAAe,EAAE,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAA;QACnE,CAAC;QAED,OAAO,QAAQ,CAAC;IACpB,CAAC,CAAA;IAED,MAAM,aAAa,GAA4B,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;QAC5D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,SAAS,CAAC,CAAA;QAG9D,OAAO,CACH,oBAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,QAAQ;YACpC,oBAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,IAC9B,QAAQ,CACY,CACF,CAC9B,CAAA;IACL,CAAC,CAAA;IAED,SAAS,WAAW;QAChB,OAAO,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,CAAC;IAC5C,CAAC;IAED,SAAS,QAAQ;QACb,OAAO,KAAK,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC;IAC1C,CAAC;IAED,OAAO,CAAC,aAAa,EAAE,WAAW,EAAE,QAAQ,CAAC,CAAA;AACjD,CAAC"}

package/package.json

@@ -1,12 +1,9 @@
 {
   "name": "@mborecki/react-create-store",
-  "version": "0.0.4",
+  "version": "1.0.0",
   "description": "",
   "main": "./lib/index.js",
-  "scripts": {
-    "build": "rm -rf ./lib && tsc",
-    "prepare": "npm run build"
-  },
+  "type": "module",
   "repository": {
     "type": "git",
     "url": "https://github.com/mborecki/react-utils.git",
@@ -19,9 +16,17 @@
   },
   "homepage": "https://github.com/mborecki/react-utils#readme",
   "devDependencies": {
-    "@types/react": "^16.9.44",
-    "react": "^16.13.1",
-    "typescript": "^3.9.7"
+    "@testing-library/dom": "^10.4.2",
+    "@testing-library/react": "^16.3.3",
+    "@types/react": "^17.0.93",
+    "jsdom": "^30.1.1",
+    "react": "^19.2.7",
+    "typescript": "^5.9.3",
+    "vitest": "^5.0.2"
   },
-  "gitHead": "2df19cba7bfeb092c74016028ba6db330514e3a2"
-}
+  "gitHead": "2ac4b370fd16244d8d4a7aba12ae1b3068e12daa",
+  "scripts": {
+    "build": "rm -rf ./lib && tsc",
+    "test": "vitest"
+  }
+}

package/src/index.test.tsx

@@ -0,0 +1,75 @@
+import {describe, test, expect, beforeAll, beforeEach, afterEach} from "vitest";
+import { createStore } from "./index.js";
+import {cleanup, fireEvent, getByText, render, screen} from '@testing-library/react'
+import React, { PropsWithChildren } from "react";
+
+
+type Store = {
+    a: number
+}
+
+type Action = {
+    value: number
+}
+const reducer = (state: Store, action: Action) => {
+            return {
+                ...state,
+                a: action.value
+            };
+        }
+const [Provider, useDispatch, useStore] = createStore<Store, Action>(reducer, {a: 123});
+
+describe('sanity check', () => {
+    test('should pass', () => {
+        expect(true).toBeTruthy();
+    })
+})
+
+describe('CreateStore', () => {
+    afterEach(() => {
+        cleanup();
+    })
+
+    test('should print stored value', () => {
+        const MyComponent = () => {
+            const data = useStore();
+            return <div>
+                <div id="value">
+                    {data.a}
+                </div>
+            </div>
+        }
+
+        render(<Provider>
+            <MyComponent />
+        </Provider>)
+
+        expect(screen.getByText('123')).toBeTruthy();
+    })
+
+    test('should update value', () => {
+        const MyComponent = () => {
+            const data = useStore();
+            const dispatch = useDispatch();
+            return <div>
+                <div>
+                    <button data-testid="btn" onClick={() => dispatch({value: 666})} >change</button>
+                </div>
+                <div data-testid="value">
+                    {data.a}
+                </div>
+            </div>
+        }
+
+        render(<Provider>
+            <MyComponent />
+        </Provider>)
+
+        expect(screen.getByText('123')).toBeTruthy();
+
+        fireEvent.click(screen.getByTestId('btn'));
+
+        expect(screen.getByText('666')).toBeTruthy();
+    })
+
+})

package/src/index.tsx

@@ -1,6 +1,6 @@
 import React, { Context } from "react";
 
-export default function createStore<T, A>(userReducer: (state: T, action: A) => T, initState: T, localStorageKey?: string)
+export function createStore<T, A>(userReducer: (state: T, action: A) => T, initState: T, localStorageKey?: string)
     : [React.FunctionComponent, () => React.Dispatch<A>, () => T] {
     const dispathContext: Context<React.Dispatch<A>> = React.createContext((value: A) => {});
     const storeContext: Context<T> = React.createContext(initState);

package/tsconfig.json

@@ -1,8 +1,9 @@
 {
     "compilerOptions": {
+      "rootDir": "./src/",
       "outDir": "./lib",
-      "target": "es5",
-      "module": "commonjs",
+      "target": "ESnext",
+      "module": "nodenext",
       "noImplicitAny": true,
       "strictNullChecks": true,
       "removeComments": true,
@@ -10,6 +11,7 @@
       "sourceMap": true,
       "jsx": "react",
       "esModuleInterop": true,
+      "moduleResolution": "nodenext",
       "typeRoots": [
         "index.d.ts",
         "node_modules/@types"
@@ -24,6 +26,7 @@
       "./src/**/*.ts"
     ],
     "exclude": [
-      "node_modules"
+      "node_modules",
+      "./src/**/*.test.tsx"
     ]
   }

package/vitest.config.ts

@@ -0,0 +1,8 @@
+import { defineConfig } from 'vitest/config'
+
+export default defineConfig({
+  test: {
+    watch: false,
+    environment: 'jsdom'
+  },
+})