@empoleon/nprogress/cjs/NavigationProgress.cjs

Navigation progress bar

'use strict';

var web = require('solid-js/web');
var solidJs = require('solid-js');
var core = require('@empoleon/core');
var nprogress_store = require('./nprogress.store.cjs');
var NavigationProgress_module = require('./NavigationProgress.module.css.cjs');

function NavigationProgress(_props) {
  const props = solidJs.mergeProps({
    initialProgress: 0,
    size: 3,
    stepInterval: 500,
    withinPortal: true,
    zIndex: core.getDefaultZIndex("max"),
    store: nprogress_store.nprogressStore
  }, _props);
  const [local, others] = solidJs.splitProps(props, ["initialProgress", "color", "size", "stepInterval", "withinPortal", "portalProps", "zIndex", "store"]);
  local.store.initialize({
    mounted: false,
    progress: local.initialProgress,
    interval: -1,
    step: 1,
    stepInterval: local.stepInterval,
    timeouts: []
  });
  const state = nprogress_store.useNprogress(local.store);
  solidJs.createEffect(() => () => nprogress_store.resetNavigationProgressAction(local.store), [local.store]);
  return web.createComponent(core.OptionalPortal, web.mergeProps(() => local.portalProps, {
    get withinPortal() {
      return local.withinPortal;
    },
    get children() {
      return web.createComponent(core.Progress, web.mergeProps({
        radius: 0,
        get value() {
          return state().progress;
        },
        get size() {
          return local.size;
        },
        get color() {
          return local.color;
        },
        classNames: NavigationProgress_module,
        get ["data-mounted"]() {
          return state().mounted || void 0;
        },
        get __vars() {
          return {
            "--nprogress-z-index": local.zIndex?.toString()
          };
        }
      }, others));
    }
  }));
}
NavigationProgress.displayName = "@empoleon/nprogress/NavigationProgress";

exports.NavigationProgress = NavigationProgress;
//# sourceMappingURL=NavigationProgress.cjs.map