@empoleon/nprogress/esm/nprogress.store.mjs

Navigation progress bar

import { clamp } from '@empoleon/hooks';
import { createStore, useStore } from '@empoleon/store';

function getIntervalProgressValue(currentProgress) {
  let next = 0.5;
  if (currentProgress >= 0 && currentProgress <= 20) {
    next = 10;
  } else if (currentProgress >= 20 && currentProgress <= 50) {
    next = 4;
  } else if (currentProgress >= 50 && currentProgress <= 80) {
    next = 2;
  } else if (currentProgress >= 80 && currentProgress <= 99) {
    next = 1;
  } else if (currentProgress >= 99 && currentProgress <= 100) {
    next = 0;
  }
  return currentProgress + next;
}
const createNprogressStore = () => createStore({
  mounted: false,
  progress: 0,
  interval: 0,
  step: 1,
  stepInterval: 100,
  timeouts: []
});
const useNprogress = store => useStore(store);
function updateNavigationProgressStateAction(update, store) {
  const state = store.getState();
  store.setState({
    ...state,
    ...update(store.getState())
  });
}
function decrementNavigationProgressAction(store) {
  updateNavigationProgressStateAction(state => ({
    progress: Math.max(state.progress - state.step, 0)
  }), store);
}
function setNavigationProgressAction(value, store) {
  updateNavigationProgressStateAction(() => ({
    progress: clamp(value, 0, 100),
    mounted: true
  }), store);
}
function cleanupNavigationProgressAction(store) {
  updateNavigationProgressStateAction(state => {
    window.clearInterval(state.interval);
    state.timeouts.forEach(timeout => window.clearTimeout(timeout));
    return {
      timeouts: []
    };
  }, store);
}
function completeNavigationProgressAction(store) {
  cleanupNavigationProgressAction(store);
  updateNavigationProgressStateAction(state => {
    const mountedTimeout = window.setTimeout(() => {
      updateNavigationProgressStateAction(() => ({
        mounted: false
      }), store);
    }, 50);
    const resetTimeout = window.setTimeout(() => {
      updateNavigationProgressStateAction(() => ({
        progress: 0
      }), store);
    }, state.stepInterval + 50);
    return {
      progress: 100,
      timeouts: [mountedTimeout, resetTimeout]
    };
  }, store);
}
function startNavigationProgressAction(store) {
  updateNavigationProgressStateAction(s => ({
    progress: getIntervalProgressValue(s.progress),
    mounted: true
  }), store);
  updateNavigationProgressStateAction(state => {
    window.clearInterval(state.interval);
    const interval = window.setInterval(() => {
      updateNavigationProgressStateAction(s => ({
        progress: getIntervalProgressValue(s.progress),
        mounted: true
      }), store);
    }, state.stepInterval);
    return {
      interval,
      mounted: true
    };
  }, store);
}
function stopNavigationProgressAction(store) {
  updateNavigationProgressStateAction(state => {
    window.clearInterval(state.interval);
    return {
      interval: -1
    };
  }, store);
}
function resetNavigationProgressAction(store) {
  cleanupNavigationProgressAction(store);
  stopNavigationProgressAction(store);
  updateNavigationProgressStateAction(() => ({
    progress: 0,
    mounted: false
  }), store);
}
function incrementNavigationProgressAction(store) {
  updateNavigationProgressStateAction(state => {
    const nextValue = Math.min(state.progress + state.step, 100);
    const nextMounted = nextValue !== 100 && nextValue !== 0;
    if (!nextMounted) {
      const timeout = window.setTimeout(() => resetNavigationProgressAction(store), state.stepInterval + 50);
      return {
        progress: nextValue,
        mounted: nextMounted,
        timeouts: [...state.timeouts, timeout]
      };
    }
    return {
      progress: nextValue,
      mounted: nextMounted
    };
  }, store);
}
function createNprogress() {
  const store = createNprogressStore();
  const actions = {
    start: () => startNavigationProgressAction(store),
    stop: () => stopNavigationProgressAction(store),
    reset: () => resetNavigationProgressAction(store),
    set: value => setNavigationProgressAction(value, store),
    increment: () => incrementNavigationProgressAction(store),
    decrement: () => decrementNavigationProgressAction(store),
    complete: () => completeNavigationProgressAction(store),
    cleanup: () => cleanupNavigationProgressAction(store)
  };
  return [store, actions];
}
const [nprogressStore, nprogress] = createNprogress();
const {
  start: startNavigationProgress,
  stop: stopNavigationProgress,
  reset: resetNavigationProgress,
  set: setNavigationProgress,
  increment: incrementNavigationProgress,
  decrement: decrementNavigationProgress,
  complete: completeNavigationProgress,
  cleanup: cleanupNavigationProgress
} = nprogress;

export { cleanupNavigationProgress, cleanupNavigationProgressAction, completeNavigationProgress, completeNavigationProgressAction, createNprogress, createNprogressStore, decrementNavigationProgress, decrementNavigationProgressAction, incrementNavigationProgress, incrementNavigationProgressAction, nprogress, nprogressStore, resetNavigationProgress, resetNavigationProgressAction, setNavigationProgress, setNavigationProgressAction, startNavigationProgress, startNavigationProgressAction, stopNavigationProgress, stopNavigationProgressAction, updateNavigationProgressStateAction, useNprogress };
//# sourceMappingURL=nprogress.store.mjs.map