UNPKG

react-toggle-management

Version:

A lightweight React library for managing toggleable global state—designed to be simpler than Zustand and more focused than Redux.

150 lines (144 loc) 4.14 kB
"use strict"; "use client"; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // src/index.ts var index_exports = {}; __export(index_exports, { ToggleGlobalProvider: () => ToggleGlobalProvider, createToggleStore: () => createToggleStore, useToggle: () => useToggle }); module.exports = __toCommonJS(index_exports); // src/ToggleProvider.tsx var import_react2 = require("react"); // src/ToggleContext.ts var import_react = require("react"); var ToggleStateContext = (0, import_react.createContext)(null); var ToggleContext_default = ToggleStateContext; // src/createToggleStore.ts var createToggleStore = (initialState = /* @__PURE__ */ new Set()) => { let state = initialState; const listeners = /* @__PURE__ */ new Set(); const getState = () => state; const subscribe = (listener) => { listeners.add(listener); return () => listeners.delete(listener); }; const setToggle = (key, value) => { if (state.has(key) === value) return; if (value) { state.add(key); } else { state.delete(key); } listeners.forEach((listener) => listener()); }; const toggle = (key) => { const current = state.has(key); setToggle(key, !current); }; const reset = () => { state = initialState; listeners.forEach((listener) => listener()); }; return { getState, subscribe, setToggle, toggle, reset }; }; // src/ToggleProvider.tsx var import_jsx_runtime = require("react/jsx-runtime"); var defaultToggleStore = createToggleStore(); function ToggleGlobalProvider({ children, initialState }) { const store = (0, import_react2.useMemo)(() => { return initialState ? createToggleStore(initialState) : defaultToggleStore; }, [initialState]); return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ToggleContext_default.Provider, { value: store, children }); } // src/useToggle.ts var import_react3 = require("react"); function useToggle(defaultKey) { const store = (0, import_react3.useContext)(ToggleContext_default); if (!store) { throw new Error( "useToggle must be used within a ToggleStateContextProvider" ); } const isOpen = (0, import_react3.useSyncExternalStore)( store.subscribe, () => store.getState().has(defaultKey) ?? false, () => false ); const readIsOpen = (0, import_react3.useCallback)( (key) => { return store.getState().has(key ?? defaultKey) ?? false; }, [defaultKey, store] ); const open = (0, import_react3.useCallback)( (key) => { store.setToggle(key ?? defaultKey, true); }, [defaultKey, store] ); const close = (0, import_react3.useCallback)( (key) => { store.setToggle(key ?? defaultKey, false); }, [defaultKey, store] ); const toggle = (0, import_react3.useCallback)( (key) => { store.toggle(key ?? defaultKey); }, [defaultKey, store] ); const reset = (0, import_react3.useCallback)( (key) => { if (key) { const initialValue = store.getState().has(key) ?? false; store.setToggle(key, initialValue); } else { store.reset(); } }, [store] ); return { isOpen, open, close, toggle, reset, readIsOpen }; } // Annotate the CommonJS export names for ESM import in node: 0 && (module.exports = { ToggleGlobalProvider, createToggleStore, useToggle }); //# sourceMappingURL=index.js.map