react-duck - npm Package Compare versions

Comparing version 0.1.1 to 0.2.0

dist/createContext.d.ts

@@ -1,2 +0,1 @@
-import * as React from "react";
-export declare function createContext<State>(rootReducer: Reducer<State>, preloadedState: State, displayName?: string): React.Context<ContextValue<State>>;
+export declare function createContext<State>(rootReducer: Reducer<State>, preloadedState: State, displayName?: string): Context<State>;

dist/createRootProvider.d.ts

 import * as React from "react";
-export declare function createRootProvider<State>(Context: React.Context<ContextValue<State>>): ({ children, }: {
-    children?: React.ReactNode;
-}) => React.ReactElement;
+export declare function createRootProvider<State>(Context: Context<State>): ({ children, }: React.PropsWithChildren<{}>) => React.ReactElement;

dist/createRootProvider.js

 "use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createRootProvider = void 0;
 var React = require("react");
-var actionTypes_1 = require("./utils/actionTypes");
-var createAction_1 = require("./createAction");
+var Provider_1 = require("./components/Provider");
 function createRootProvider(Context) {
     return function RootProvider(_a) {
         var children = _a.children;
-        var defaultValue = React.useContext(Context);
-        var _b = React.useReducer(defaultValue.reducer, defaultValue.state), state = _b[0], reducerDispatch = _b[1];
-        React.useEffect(function initialiseReducer() {
-            reducerDispatch(createAction_1.createAction(actionTypes_1.ActionTypes.INIT)());
-        }, []);
-        var dispatch = React.useCallback(function wrappedDispatch(action) {
-            reducerDispatch(action);
-            return action;
-        }, [reducerDispatch]);
-        var value = React.useMemo(function () { return (__assign(__assign({}, defaultValue), { dispatch: dispatch, state: state })); }, [defaultValue, dispatch, state]);
-        return React.createElement(Context.Provider, { value: value }, children);
+        return React.createElement(Provider_1.Provider, { Context: Context }, children);
     };
 }
 exports.createRootProvider = createRootProvider;

dist/index.d.ts

@@ -5,3 +5,4 @@ export { createAction } from "./createAction";
 export { createReducer } from "./createReducer";
-export { createRootReducer } from "./createRootReducer";
+export { createRootDuck } from "./createRootDuck";
 export { createRootProvider } from "./createRootProvider";
+export { Provider } from "./components/Provider";

dist/index.js

@@ -11,5 +11,7 @@ "use strict";
 Object.defineProperty(exports, "createReducer", { enumerable: true, get: function () { return createReducer_1.createReducer; } });
-var createRootReducer_1 = require("./createRootReducer");
-Object.defineProperty(exports, "createRootReducer", { enumerable: true, get: function () { return createRootReducer_1.createRootReducer; } });
+var createRootDuck_1 = require("./createRootDuck");
+Object.defineProperty(exports, "createRootDuck", { enumerable: true, get: function () { return createRootDuck_1.createRootDuck; } });
 var createRootProvider_1 = require("./createRootProvider");
 Object.defineProperty(exports, "createRootProvider", { enumerable: true, get: function () { return createRootProvider_1.createRootProvider; } });
+var Provider_1 = require("./components/Provider");
+Object.defineProperty(exports, "Provider", { enumerable: true, get: function () { return Provider_1.Provider; } });

package.json

 {
     "name": "react-duck",
-    "version": "0.1.1",
+    "version": "0.2.0",
     "description": "🦆 React ducks without Redux",
@@ -87,4 +87,4 @@ "author": "iamogbz",
     "devDependencies": {
-        "@babel/cli": "^7.11.5",
-        "@babel/core": "^7.11.5",
+        "@babel/cli": "^7.11.6",
+        "@babel/core": "^7.11.6",
         "@babel/preset-typescript": "^7.10.4",
@@ -95,4 +95,4 @@ "@commitlint/cli": "^9.1.2",
         "@testing-library/react": "^11.0.2",
-        "@types/jest": "^26.0.12",
-        "@types/node": "^14.6.2",
+        "@types/jest": "^26.0.13",
+        "@types/node": "^14.6.4",
         "@types/react": "^16.9.49",
@@ -99,0 +99,0 @@ "@typescript-eslint/eslint-plugin": "^2.34.0",

README.md

@@ -25,7 +25,7 @@ # React Duck
 
-Create the root reducer from all the duck reducers.
+Create the root/global duck as a combination of all other ducks.
 
 ```js
-// reducer.js
-export default createRootReducer(counterDuck, otherDuck);
+// duck/index.js
+export default createRootDuck(counterDuck, otherDuck);
 ```
@@ -37,3 +37,3 @@
 // context.js
-export default createContext(rootReducer, preloadedState);
+export default createContext(rootDuck.reducer, rootDuck.initialState);
 ```
@@ -74,2 +74,17 @@
 
+Note: `createRootProvider` is just a helper and can be replaced, with the functional difference highlighted below.
+
+```git
+diff --git a/index.jsx b/index.jsx
+index 0a0a0a0..1b1b1b1 100644
+--- a/index.jsx
++++ b/index.jsx
+const rootElement = document.getElementById("root");
+-const Provider = createRootProvider(Context);
+ ReactDOM.render(
+-    <Provider>
++    <Provider Context={Context}>
+         <App />
+```
+
 ## Example
@@ -76,0 +91,0 @@

typings/context.d.ts

@@ -10,1 +10,3 @@ type ContextDispatch<T extends string = string, P = unknown> = (
 };
+
+type Context<S> = React.Context<ContextValue<S>>;

typings/duck.d.ts

@@ -1,2 +0,5 @@
-type Action<T extends string = string, P = unknown> = {
+type Action<
+    T extends string = string /* All possible action types */,
+    P = unknown /* All possible payload types */
+> = {
     type: T;
@@ -16,3 +19,3 @@ payload?: P;
 type Reducer<S, T extends string = string, P = unknown> = React.Reducer<
-    S,
+    S /* All possible state types */,
     Action<T, P>
@@ -26,12 +29,35 @@ >;
 
-type Selector<S, R = unknown, T extends string = string, P = unknown> = (
-    state: React.ReducerState<React.Reducer<S, Action<T, P>>>,
-) => R;
+type Selector<
+    S,
+    R = unknown /* All possible selector return types */,
+    T extends string = string,
+    P = unknown
+> = (state: React.ReducerState<Reducer<S, Action<T, P>>>) => R;
 
+type SelectorMapping<
+    S,
+    R = unknown,
+    T extends string = string,
+    P = unknown
+> = Record<string, Selector<S, R, T, P>>;
+
 type Duck<S, T extends string = string, P = unknown> = {
-    actions: ActionCreatorMapping;
+    actions: ActionCreatorMapping<T, P>;
     initialState: S;
     name: string;
     reducer: Reducer<S, T, P>;
-    selectors?: Record<string, Selector<S>>;
+    selectors?: SelectorMapping<S, unknown, T, P>;
 };
+
+type RootDuck<
+    S,
+    D extends string = string /* All possible duck names */,
+    T extends string = string,
+    P = unknown
+> = {
+    actions: Record<D, ActionCreatorMapping<T, P>>;
+    initialState: Record<D, S>;
+    names: Set<D>;
+    reducer: Reducer<Record<D, S>, T, P>;
+    selectors: Record<D, SelectorMapping<S, unknown, T, P> | undefined>;
+};

No alert changes

Improved metrics

Total package byte prevSize

20519

increased by14.65%

Number of package files

25

increased by19.05%

Lines of code

294

increased by28.38%

Number of lines in readme file

106

increased by16.48%

No dependency changes