active-link-nextjs/dist/use-active-router.js

React hook to use with nextjs router to auto apply active class on active link

import { useRouter } from "next/router.js";
export const useActiveRouter = (config) => {
    const router = useRouter();
    const registerRoute = (path, configOverride) => {
        const classes = [];
        const href = "/" + path.join("/");
        const currentPath = router.asPath;
        if (currentPath !== href) {
            return { href, className: "" };
        }
        if (configOverride === null || configOverride === void 0 ? void 0 : configOverride.activeClass) {
            classes.push(configOverride.activeClass);
        }
        else if (config === null || config === void 0 ? void 0 : config.activeClass) {
            classes.push(config.activeClass);
        }
        else {
            classes.push("active"); // Default class name
        }
        return { href, className: classes.join(" ") };
    };
    return { registerRoute };
};