@swear-js/react - npm Package Compare versions

Comparing version 2.1.0 to 2.2.0

lib/index.d.ts

 export * from './types';
 export * from './createSwear';
+export * from './swearContext';
 export * from './useSwear';
+export * from './useSwearState';

lib/index.js

@@ -15,3 +15,5 @@ "use strict";
 __exportStar(require("./createSwear"), exports);
+__exportStar(require("./swearContext"), exports);
 __exportStar(require("./useSwear"), exports);
+__exportStar(require("./useSwearState"), exports);
 //# sourceMappingURL=index.js.map

lib/types.d.ts

@@ -8,11 +8,6 @@ export declare type SwearMutateType<T> = ((payload: T | ((prev: T) => T), tag?: string) => void) | (() => void);
 export declare type SwearDefaultActions<T> = {
-    set: (payload: T) => void;
+    set: (payload: T | ((prev: T) => T)) => void;
     reset: () => void;
 };
-export declare type SwearReturnType<T, Y> = [
-    state: T,
-    actions: {
-        set: (payload: T) => void;
-        reset: () => void;
-    } & Y
-];
+export declare type SwearReturnType<T, Y> = [state: T, actions: SwearDefaultActions<T> & Y];
+export declare type SwearStateReturnType<T> = [state: T, actions: SwearDefaultActions<T>];

lib/useSwear.d.ts

@@ -1,4 +0,2 @@
-import React from 'react';
 import { SwearReturnType, SwearType } from './types';
-export declare const swearContext: React.Context<import("@swear-js/core").SwearStoreReturnType>;
 export declare const useSwear: <T, Y>([swearId, defaultState, actions]: SwearType<T, Y>) => SwearReturnType<T, Y>;

lib/useSwear.js

@@ -13,16 +13,32 @@ "use strict";
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useSwear = exports.swearContext = void 0;
-var react_1 = __importDefault(require("react"));
-var core_1 = require("@swear-js/core");
-exports.swearContext = react_1.default.createContext((0, core_1.createStore)());
+exports.useSwear = void 0;
+var react_1 = __importStar(require("react"));
+var swearContext_1 = require("./swearContext");
+var defaultActions_1 = require("./defaultActions");
 var useSwear = function (_a) {
     var _b;
     var swearId = _a[0], defaultState = _a[1], actions = _a[2];
-    var store = react_1.default.useContext(exports.swearContext);
+    var store = react_1.default.useContext(swearContext_1.swearContext);
     var _c = react_1.default.useState((_b = store.getSwearValue(swearId)) !== null && _b !== void 0 ? _b : defaultState), swearValue = _c[0], setSwearValue = _c[1];
-    react_1.default.useEffect(function () {
+    (0, react_1.useEffect)(function () {
         store === null || store === void 0 ? void 0 : store.subscribe({
@@ -37,10 +53,6 @@ swearId: swearId,
     }, []);
-    var defaultActions = function (mutate) { return ({
-        set: function (payload) { return (mutate(payload)); },
-        reset: function () { return mutate(defaultState); },
-    }); };
     var mutator = function (payload, tag) { return store === null || store === void 0 ? void 0 : store.setSwearValue(swearId, tag !== null && tag !== void 0 ? tag : null, payload instanceof Function ? payload(swearValue) : payload); };
-    return [swearValue, __assign(__assign({}, defaultActions(mutator)), actions(mutator))];
+    return [swearValue, __assign(__assign({}, (0, defaultActions_1.defaultActions)(defaultState, swearValue)(mutator)), actions(mutator))];
 };
 exports.useSwear = useSwear;
 //# sourceMappingURL=useSwear.js.map

package.json

 {
   "name": "@swear-js/react",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "description": "React support for swear-js",
@@ -50,3 +50,3 @@ "repository": {
   },
-  "gitHead": "ac4163c86f8f39d83f6cb172f6e7bb40cc7791b5"
+  "gitHead": "0fb07a3e62e2ed3ef841d132843beeb148c59d2d"
 }

README.md

@@ -57,4 +57,6 @@ # 🍭 Swear JS
 export const countSwear = createSwear('counter', defaultState, (mutate) => ({
-  set: (payload: number) => mutate(payload),
-  clear: mutate(defaultState, 'HERE YOUR TAG'), // You can also tag your store updates
+  decrease: () => {
+      // You can also access previous value like this
+      mutate((prev) => prev - 1);
+  }
 }));
@@ -70,3 +72,4 @@ ```
 export const YourComponent = () => {
-  const [count, { set: setCount, clear: clearCount }] = useSwear(countSwear);
+  // set and reset actions are here by default
+  const [count, { set, decrease, reset }] = useSwear(countSwear);
 
@@ -76,4 +79,6 @@ return (
         <span>{count}</span>
-        <Button onClick={() => setCount(count + 1)}>Increase</Button>
-        <Button onClick={clearCount}>Reset</Button>
+        // Prev is a special action which can get callback with previous value
+        <Button onClick={() => set((prev) => prev + 1)}>Increase</Button>
+        <Button onClick={decrease}>Increase</Button>
+        <Button onClick={reset}>Reset</Button>
       </>
@@ -83,1 +88,22 @@ );
 ```
+
+Primitive mode
+```javascript
+export const YourComponent = () => {
+    import React from 'react';
+    import { useSwearState } from '@swear-js/react';
+
+    // You can use a primitive swear without creation, with only default `set` and `reset` actions
+    const [count, { set, reset }] = useSwearState('counter', 0);
+
+    return (
+        <>
+          <span>{count}</span>
+          // Prev is a special action which can get callback with previous value
+          <Button onClick={() => set((prev) => prev + 1)}>Increase</Button>
+          <Button onClick={() => set((prev) => prev - 1)}>Decrease</Button>
+          <Button onClick={reset}>Reset</Button>
+        </>
+    );
+}
+```

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

15961

increased by63.99%

Number of package files

23

increased by64.29%

Lines of code

163

increased by77.17%

Number of lines in readme file

106

increased by32.5%

No dependency changes