@bprogress/next
Version:
NProgress bar like for Next.js compatible with new app directory
320 lines • 14.5 kB
JavaScript
// src/hooks/use-router.ts
function _define_property(obj, key, value) {
if (key in obj) {
Object.defineProperty(obj, key, {
value: value,
enumerable: true,
configurable: true,
writable: true
});
} else {
obj[key] = value;
}
return obj;
}
function _object_spread(target) {
for(var i = 1; i < arguments.length; i++){
var source = arguments[i] != null ? arguments[i] : {};
var ownKeys = Object.keys(source);
if (typeof Object.getOwnPropertySymbols === "function") {
ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
return Object.getOwnPropertyDescriptor(source, sym).enumerable;
}));
}
ownKeys.forEach(function(key) {
_define_property(target, key, source[key]);
});
}
return target;
}
function ownKeys(object, enumerableOnly) {
var keys = Object.keys(object);
if (Object.getOwnPropertySymbols) {
var symbols = Object.getOwnPropertySymbols(object);
if (enumerableOnly) {
symbols = symbols.filter(function(sym) {
return Object.getOwnPropertyDescriptor(object, sym).enumerable;
});
}
keys.push.apply(keys, symbols);
}
return keys;
}
function _object_spread_props(target, source) {
source = source != null ? source : {};
if (Object.getOwnPropertyDescriptors) {
Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
} else {
ownKeys(Object(source)).forEach(function(key) {
Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
});
}
return target;
}
function _object_without_properties(source, excluded) {
if (source == null) return {};
var target = _object_without_properties_loose(source, excluded);
var key, i;
if (Object.getOwnPropertySymbols) {
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
for(i = 0; i < sourceSymbolKeys.length; i++){
key = sourceSymbolKeys[i];
if (excluded.indexOf(key) >= 0) continue;
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
target[key] = source[key];
}
}
return target;
}
function _object_without_properties_loose(source, excluded) {
if (source == null) return {};
var target = {};
var sourceKeys = Object.keys(source);
var key, i;
for(i = 0; i < sourceKeys.length; i++){
key = sourceKeys[i];
if (excluded.indexOf(key) >= 0) continue;
target[key] = source[key];
}
return target;
}
import { useRouter as useNextRouter } from "next/navigation.js";
import { useRef } from "react";
import { isSameURL } from "@bprogress/core";
import { useProgress } from "@bprogress/react";
function removeFirstPathSegment(url) {
var parts = url.pathname.split("/");
if (parts.length > 1 && parts[1]) {
parts.splice(1, 1);
url.pathname = parts.join("/") || "/";
}
return url;
}
function useRouter(options) {
var _ref = options || {}, customRouter = _ref.customRouter, defaultProgressOptions = _object_without_properties(_ref, [
"customRouter"
]);
var router = customRouter ? customRouter() : // eslint-disable-next-line react-hooks/rules-of-hooks
useNextRouter();
var _useProgress = useProgress(), start = _useProgress.start, stop = _useProgress.stop, providerDisableSameURL = _useProgress.disableSameURL, providerStartPosition = _useProgress.startPosition, providerDelay = _useProgress.delay, providerStopDelay = _useProgress.stopDelay;
var extendedRouterRef = useRef(null);
function createHandler(fn) {
return function(href, options2) {
var _ref = options2 || {}, showProgress = _ref.showProgress, startPosition = _ref.startPosition, disableSameURL = _ref.disableSameURL, basePath = _ref.basePath, i18nPath = _ref.i18nPath, delay = _ref.delay, stopDelay = _ref.stopDelay, routerOpts = _object_without_properties(_ref, [
"showProgress",
"startPosition",
"disableSameURL",
"basePath",
"i18nPath",
"delay",
"stopDelay"
]);
var progressOpts = _object_spread_props(_object_spread({}, defaultProgressOptions), {
showProgress: showProgress,
startPosition: startPosition,
disableSameURL: disableSameURL,
basePath: basePath,
i18nPath: i18nPath,
delay: delay,
stopDelay: stopDelay
});
var localDisableSameURL = progressOpts.disableSameURL !== void 0 ? progressOpts.disableSameURL : providerDisableSameURL;
var localStartPosition = progressOpts.startPosition !== void 0 ? progressOpts.startPosition : providerStartPosition;
var localDelay = progressOpts.delay !== void 0 ? progressOpts.delay : providerDelay;
var localStopDelay = progressOpts.stopDelay !== void 0 ? progressOpts.stopDelay : providerStopDelay;
if (progressOpts.showProgress === false) {
return fn(href, routerOpts);
}
var currentUrl = new URL(location.href);
var targetUrl = new URL(href, location.href);
if (progressOpts.i18nPath) {
currentUrl = removeFirstPathSegment(currentUrl);
}
if (progressOpts.basePath) {
targetUrl.pathname = progressOpts.basePath + (targetUrl.pathname !== "/" ? targetUrl.pathname : "");
}
var sameURL = isSameURL(targetUrl, currentUrl);
if (sameURL && localDisableSameURL) {
return fn(href, routerOpts);
}
start(localStartPosition, localDelay);
setTimeout(function() {
if (sameURL) stop(localStopDelay);
}, localDelay || 0);
return fn(href, routerOpts);
};
}
function createNoHrefHandler(fn) {
return function(options2) {
var _ref = options2 || {}, showProgress = _ref.showProgress, startPosition = _ref.startPosition, disableSameURL = _ref.disableSameURL, basePath = _ref.basePath, i18nPath = _ref.i18nPath, delay = _ref.delay, stopDelay = _ref.stopDelay, routerOpts = _object_without_properties(_ref, [
"showProgress",
"startPosition",
"disableSameURL",
"basePath",
"i18nPath",
"delay",
"stopDelay"
]);
var progressOpts = _object_spread_props(_object_spread({}, defaultProgressOptions), {
showProgress: showProgress,
startPosition: startPosition,
disableSameURL: disableSameURL,
basePath: basePath,
i18nPath: i18nPath,
delay: delay,
stopDelay: stopDelay
});
var localStartPosition = progressOpts.startPosition !== void 0 ? progressOpts.startPosition : providerStartPosition;
var localDelay = progressOpts.delay !== void 0 ? progressOpts.delay : providerDelay;
var localStopDelay = progressOpts.stopDelay !== void 0 ? progressOpts.stopDelay : providerStopDelay;
if (progressOpts.showProgress === false) {
return fn(routerOpts);
}
start(localStartPosition, localDelay);
var result = fn(routerOpts);
setTimeout(function() {
stop(localStopDelay);
}, localDelay || 0);
return result;
};
}
function createPrefetchHandler(fn) {
return function(href, options2) {
return fn(href, options2);
};
}
if (!extendedRouterRef.current) {
extendedRouterRef.current = _object_spread_props(_object_spread({}, router), {
push: createHandler(router.push),
replace: createHandler(router.replace),
prefetch: createPrefetchHandler(router.prefetch),
back: createNoHrefHandler(router.back),
refresh: createNoHrefHandler(router.refresh),
forward: createNoHrefHandler(router.forward)
});
} else {
extendedRouterRef.current.push = createHandler(router.push);
extendedRouterRef.current.replace = createHandler(router.replace);
extendedRouterRef.current.prefetch = createPrefetchHandler(router.prefetch);
extendedRouterRef.current.back = createNoHrefHandler(router.back);
extendedRouterRef.current.refresh = createNoHrefHandler(router.refresh);
extendedRouterRef.current.forward = createNoHrefHandler(router.forward);
}
return extendedRouterRef.current;
}
// src/providers/app-progress-provider.tsx
import React2 from "react";
// src/components/app-progress.tsx
import { useAnchorProgress, withMemo } from "@bprogress/react";
import { usePathname, useSearchParams } from "next/navigation.js";
var AppProgressComponent = function(props) {
var pathname = usePathname();
var searchParams = useSearchParams();
useAnchorProgress(props, [
pathname,
searchParams
]);
return null;
};
var AppProgress = withMemo(AppProgressComponent);
AppProgress.displayName = "AppProgress";
// src/providers/app-progress-provider.tsx
import { withSuspense } from "@bprogress/react";
// src/providers/next-progress-provider.tsx
import React from "react";
import { ProgressProvider } from "@bprogress/react";
var NextProgressProvider = function(_param) {
var children = _param.children, ProgressComponent = _param.ProgressComponent, color = _param.color, height = _param.height, options = _param.options, spinnerPosition = _param.spinnerPosition, style = _param.style, disableStyle = _param.disableStyle, nonce = _param.nonce, stopDelay = _param.stopDelay, delay = _param.delay, startPosition = _param.startPosition, disableSameURL = _param.disableSameURL, shallowRouting = _param.shallowRouting, props = _object_without_properties(_param, [
"children",
"ProgressComponent",
"color",
"height",
"options",
"spinnerPosition",
"style",
"disableStyle",
"nonce",
"stopDelay",
"delay",
"startPosition",
"disableSameURL",
"shallowRouting"
]);
return /* @__PURE__ */ React.createElement(ProgressProvider, {
color: color,
height: height,
options: options,
spinnerPosition: spinnerPosition,
style: style,
disableStyle: disableStyle,
nonce: nonce,
stopDelay: stopDelay,
delay: delay,
startPosition: startPosition,
disableSameURL: disableSameURL,
shallowRouting: shallowRouting
}, /* @__PURE__ */ React.createElement(ProgressComponent, _object_spread({
stopDelay: stopDelay,
delay: delay,
startPosition: startPosition,
disableSameURL: disableSameURL,
shallowRouting: shallowRouting
}, props)), children);
};
// src/providers/app-progress-provider.tsx
var SuspendedAppProgress = withSuspense(AppProgress);
var AppProgressProvider = function(_param) {
var children = _param.children, props = _object_without_properties(_param, [
"children"
]);
return /* @__PURE__ */ React2.createElement(NextProgressProvider, _object_spread({
ProgressComponent: SuspendedAppProgress
}, props), children);
};
// src/providers/pages-progress-provider.tsx
import React3 from "react";
// src/components/pages-progress.tsx
import { useEffect } from "react";
import { isSameURL as isSameURL2, isSameURLWithoutSearch } from "@bprogress/core";
import { useProgress as useProgress2, withMemo as withMemo2 } from "@bprogress/react";
import Router from "next/router.js";
var PagesProgressComponent = function(param) {
var _param_shallowRouting = param.shallowRouting, shallowRouting = _param_shallowRouting === void 0 ? false : _param_shallowRouting, _param_disableSameURL = param.disableSameURL, disableSameURL = _param_disableSameURL === void 0 ? true : _param_disableSameURL, _param_startPosition = param.startPosition, startPosition = _param_startPosition === void 0 ? 0 : _param_startPosition, _param_delay = param.delay, delay = _param_delay === void 0 ? 0 : _param_delay, _param_stopDelay = param.stopDelay, stopDelay = _param_stopDelay === void 0 ? 0 : _param_stopDelay;
var _useProgress2 = useProgress2(), start = _useProgress2.start, stop = _useProgress2.stop;
useEffect(function() {
var handleRouteStart = function(url) {
var targetUrl = new URL(url, location.href);
var currentUrl = new URL(location.href);
if (shallowRouting && isSameURLWithoutSearch(targetUrl, currentUrl) && disableSameURL) return;
if (isSameURL2(targetUrl, currentUrl) && disableSameURL) return;
start(startPosition, delay);
};
var handleRouteDone = function() {
return stop(stopDelay);
};
Router.events.on("routeChangeStart", handleRouteStart);
Router.events.on("routeChangeComplete", handleRouteDone);
Router.events.on("routeChangeError", handleRouteDone);
return function() {
Router.events.off("routeChangeStart", handleRouteStart);
Router.events.off("routeChangeComplete", handleRouteDone);
Router.events.off("routeChangeError", handleRouteDone);
};
}, []);
return null;
};
var PagesProgress = withMemo2(PagesProgressComponent);
PagesProgress.displayName = "PagesProgress";
// src/providers/pages-progress-provider.tsx
var PagesProgressProvider = function(_param) {
var children = _param.children, props = _object_without_properties(_param, [
"children"
]);
return /* @__PURE__ */ React3.createElement(NextProgressProvider, _object_spread({
ProgressComponent: PagesProgress
}, props), children);
};
// src/index.ts
import { useProgress as useProgress3, Progress, Bar, Peg, Spinner, SpinnerIcon, Indeterminate } from "@bprogress/react";
export { AppProgressProvider, Bar, Indeterminate, PagesProgressProvider, Peg, Progress, Spinner, SpinnerIcon, useProgress3 as useProgress, useRouter };
//# sourceMappingURL=index.js.map