floppy-disk 1.0.0

package/lib/react/create-stores.js

@@ -0,0 +1,87 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createStores = void 0;
+const react_1 = require("react");
+const utils_1 = require("../utils");
+const vanilla_1 = require("../vanilla");
+const hashStoreKey = (obj) => JSON.stringify(obj, Object.keys(obj).sort());
+const createStores = (initializer, options = {}) => {
+    const { onBeforeChangeKey = utils_1.noop, defaultDeps } = options;
+    const stores = new Map();
+    const getStore = (key) => {
+        const normalizedKey = hashStoreKey(key);
+        if (!stores.has(normalizedKey)) {
+            stores.set(normalizedKey, (0, vanilla_1.initStore)((api) => initializer({ key, ...api }), options));
+        }
+        return stores.get(normalizedKey);
+    };
+    /**
+     * IMPORTANT NOTE: selectDeps function must not be changed after initialization.
+     */
+    const useStores = (...args) => {
+        const [_key = {}, selectDeps = defaultDeps] = (typeof args[0] === 'function' ? [{}, args[0]] : args);
+        const key = _key;
+        const normalizedKey = hashStoreKey(key);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+        const { get, subscribe } = (0, react_1.useMemo)(() => getStore(key), [normalizedKey]);
+        const [state, setState] = (0, react_1.useState)(get);
+        const isFirstRender = (0, react_1.useRef)(true);
+        const prevKey = (0, react_1.useRef)(key);
+        (0, react_1.useEffect)(() => {
+            if (!isFirstRender.current) {
+                onBeforeChangeKey(key, prevKey.current);
+                setState(get);
+            }
+            isFirstRender.current = false;
+            prevKey.current = key;
+            const unsubs = subscribe(setState, selectDeps);
+            return unsubs;
+            // eslint-disable-next-line react-hooks/exhaustive-deps
+        }, [normalizedKey]);
+        return state;
+    };
+    useStores.get = (key = {}) => {
+        const store = getStore(key);
+        return store.get();
+    };
+    useStores.getAll = () => {
+        const allStores = [];
+        stores.forEach((store) => {
+            allStores.push(store.get());
+        });
+        return allStores;
+    };
+    useStores.getAllWithSubscriber = () => {
+        const allStores = [];
+        stores.forEach((store) => {
+            const subscribers = store.getSubscribers();
+            if (subscribers.size > 0)
+                allStores.push(store.get());
+        });
+        return allStores;
+    };
+    useStores.set = (key = {}, value, silent) => {
+        const store = getStore(key);
+        store.set(value, silent);
+    };
+    useStores.setAll = (value, silent) => {
+        stores.forEach((store) => {
+            store.set(value, silent);
+        });
+    };
+    useStores.subscribe = (key = {}, fn, selectDeps) => {
+        const store = getStore(key);
+        return store.subscribe(fn, selectDeps);
+    };
+    useStores.getSubscribers = (key = {}) => {
+        const store = getStore(key);
+        return store.getSubscribers();
+    };
+    const Watch = ({ storeKey = {}, selectDeps, render }) => {
+        const store = useStores(storeKey, selectDeps);
+        return render(store);
+    };
+    useStores.Watch = Watch;
+    return useStores;
+};
+exports.createStores = createStores;

package/lib/react/with-context.d.ts

@@ -0,0 +1,5 @@
+import { ReactNode } from 'react';
+export declare const withContext: <T>(initFn: () => T) => readonly [({ children, onInitialize, }: {
+    children: ReactNode;
+    onInitialize?: ((value: T) => void) | undefined;
+}) => JSX.Element, () => T | null];

package/lib/react/with-context.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.withContext = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const withContext = (initFn) => {
+    const Context = (0, react_1.createContext)(null);
+    const Provider = ({ children, onInitialize, }) => {
+        const [value] = (0, react_1.useState)(() => {
+            const store = initFn();
+            onInitialize && onInitialize(store);
+            return store;
+        });
+        return react_1.default.createElement(Context.Provider, { value: value }, children);
+    };
+    const useCurrentContext = () => (0, react_1.useContext)(Context);
+    return [Provider, useCurrentContext];
+};
+exports.withContext = withContext;

package/lib/utils/index.d.ts

@@ -0,0 +1,2 @@
+export declare const noop: () => void;
+export declare const identityFn: <T>(a: T) => T;

package/lib/utils/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.identityFn = exports.noop = void 0;
+const noop = () => { };
+exports.noop = noop;
+const identityFn = (a) => a;
+exports.identityFn = identityFn;

package/lib/vanilla.d.ts

@@ -0,0 +1,23 @@
+export declare type StoreData = Record<string, any>;
+export declare type SetStoreData<T> = Partial<T> | ((prevState: T) => Partial<T>);
+export declare type SelectDeps<T> = ((state: T) => any[]) | undefined;
+export declare type Subscribers<T> = Map<(state: T) => void, SelectDeps<T>>;
+export declare type StoreInitializer<T> = (api: {
+    get: () => T;
+    set: (value: SetStoreData<T>, silent?: boolean) => void;
+}) => T;
+export declare type StoreEvent<T> = (state: T) => void;
+export declare type InitStoreOptions<T> = {
+    intercept?: (nextState: T, prevState: T) => Partial<T>;
+    onFirstSubscribe?: StoreEvent<T>;
+    onSubscribe?: StoreEvent<T>;
+    onUnsubscribe?: StoreEvent<T>;
+    onLastUnsubscribe?: StoreEvent<T>;
+};
+export declare type InitStoreReturn<T> = {
+    get: () => T;
+    set: (value: SetStoreData<T>, silent?: boolean) => void;
+    subscribe: (fn: (state: T) => void, selectDeps?: SelectDeps<T>) => () => void;
+    getSubscribers: () => Subscribers<T>;
+};
+export declare const initStore: <T extends StoreData>(initializer: StoreInitializer<T>, options?: InitStoreOptions<T>) => InitStoreReturn<T>;

package/lib/vanilla.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initStore = void 0;
+const utils_1 = require("./utils");
+const initStore = (initializer, options = {}) => {
+    const { intercept, onFirstSubscribe = utils_1.noop, onSubscribe = utils_1.noop, onUnsubscribe = utils_1.noop, onLastUnsubscribe = utils_1.noop, } = options;
+    const subscribers = new Map();
+    const getSubscribers = () => subscribers;
+    let data;
+    let keys;
+    const get = () => data;
+    const set = (value, silent = false) => {
+        const prevData = data;
+        if (typeof value === 'function') {
+            data = { ...data, ...value(data) };
+        }
+        else {
+            data = { ...data, ...value };
+        }
+        if (intercept) {
+            data = { ...data, ...intercept(data, prevData) };
+        }
+        if (silent)
+            return;
+        subscribers.forEach((selectDeps, fn) => {
+            if (!selectDeps) {
+                for (let i = 0, n = keys.length; i < n; i++) {
+                    if (prevData[keys[i]] !== data[keys[i]]) {
+                        fn(data);
+                        break;
+                    }
+                }
+                return;
+            }
+            const prevs = selectDeps(prevData);
+            const nexts = selectDeps(data);
+            for (let i = 0, n = prevs.length; i < n; i++) {
+                if (prevs[i] !== nexts[i]) {
+                    fn(data);
+                    break;
+                }
+            }
+        });
+    };
+    const subscribe = (fn, selectDeps) => {
+        subscribers.set(fn, selectDeps);
+        if (subscribers.size === 1)
+            onFirstSubscribe(data);
+        onSubscribe(data);
+        return () => {
+            subscribers.delete(fn);
+            onUnsubscribe(data);
+            if (subscribers.size === 0)
+                onLastUnsubscribe(data);
+        };
+    };
+    data = initializer({ get, set });
+    keys = Object.keys(data);
+    return { get, set, subscribe, getSubscribers };
+};
+exports.initStore = initStore;

package/package.json

@@ -0,0 +1,66 @@
+{
+  "name": "floppy-disk",
+  "version": "1.0.0",
+  "description": "FloppyDisk - lightweight, simple, and powerful state management library",
+  "keywords": [
+    "state",
+    "manager",
+    "management",
+    "react",
+    "hooks",
+    "store",
+    "utilities"
+  ],
+  "author": "Muhammad Afifudin",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/afiiif/floppy-disk"
+  },
+  "bugs": {
+    "url": "https://github.com/afiiif/floppy-disk/issues"
+  },
+  "homepage": "https://github.com/afiiif/floppy-disk#readme",
+  "main": "lib/index.js",
+  "module": "esm/index.js",
+  "sideEffects": false,
+  "files": [
+    "lib/",
+    "esm/"
+  ],
+  "types": "lib/index.d.ts",
+  "typings": "lib/index.d.ts",
+  "scripts": {
+    "prepare": "husky install",
+    "build:cjs": "tsc",
+    "build:es": "tsc -m esNext --outDir esm",
+    "build": "yarn clean && yarn build:cjs && yarn build:es",
+    "clean": "rimraf lib esm",
+    "format": "prettier --check .",
+    "format:fix": "prettier --write .",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
+    "lint:types": "tsc --noEmit"
+  },
+  "devDependencies": {
+    "@commitlint/cli": "^17.0.0",
+    "@commitlint/config-conventional": "^17.0.0",
+    "@types/react": "^18.0.9",
+    "@types/react-dom": "^18.0.4",
+    "eslint": "^8.16.0",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-config-react-app": "^7.0.1",
+    "eslint-plugin-simple-import-sort": "^7.0.0",
+    "husky": "^8.0.1",
+    "lint-staged": "^12.4.1",
+    "prettier": "^2.6.2",
+    "react": "^18.1.0",
+    "react-dom": "^18.1.0",
+    "rimraf": "^3.0.2",
+    "typescript": "^4.6.4"
+  },
+  "peerDependencies": {
+    "react": "^17.0.0 || ^18.0.0",
+    "react-dom": "^17.0.0 || ^18.0.0"
+  }
+}