subscription-stack

📬 Register a subscription in LIFO stack

Installation

npm i subscription-stack

Usage

// 0. Import factoryimport{createSubscriptionStack}from'subscription-stack';// 1️. Create scoped stackconststack=createSubscriptionStack();// 2️. Pass subscribe functionstack(()=>{// 3️. Return unsubscribe functionreturn()=>{};});

Example

import{createSubscriptionStack}from'subscription-stack';conststack=createSubscriptionStack();stack(()=>{consthandle=()=>console.log('1️⃣');window.addEventListener('click',handle);return()=>window.removeEventListener('click',handle);});stack(()=>{consthandle=()=>console.log('2️⃣');window.addEventListener('click',handle);return()=>window.removeEventListener('click',handle);});// Console:// 2️⃣// 1️⃣

⚛️ React Hook

import{createSubscriptionStackHook}from'subscription-stack/react';constuseStack=createSubscriptionStackHook();useStack(()=>{consthandle=()=>console.log('1️⃣');window.addEventListener('click',handle);return()=>window.removeEventListener('click',handle);});useStack(()=>{consthandle=()=>console.log('2️⃣');window.addEventListener('click',handle);return()=>window.removeEventListener('click',handle);});// Console:// 2️⃣// 1️⃣

How does it work

constqueue=newSet();// []// Add 1 -> [1]stack(()=>{queue.add(1);return()=>queue.delete(1);});// Delete 1 -> []// Add 2 -> [2]// Add 1 -> [2, 1]constunsubscribe=stack(()=>{queue.add(2);return()=>queue.delete(2);});// Delete 2 -> [1]// Delete 1 -> []// Add 3 -> [3]// Add 2 -> [3, 2]// Add 1 -> [3, 2, 1]stack(()=>{queue.add(3);return()=>queue.delete(3);});// Delete 2 -> [3, 1]unsubscribe();