react-navplus
Version:
A flexible, performance-optimized navigation link component for React with multi-router support, prefetching, and advanced active state detection
76 lines • 2.72 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.useNavLinkContext = exports.NavLinkProvider = exports.NavLinkContext = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const matchers_1 = require("../utils/matchers");
const prefetch_1 = require("../utils/prefetch");
const react_router_dom_1 = require("react-router-dom");
/**
* Context for sharing navigation state across components
*/
exports.NavLinkContext = (0, react_1.createContext)({
activeMatchers: matchers_1.matchers,
prefetchDefaults: prefetch_1.defaultPrefetchOptions,
routerContext: undefined
});
/**
* Provider component for NavLinkContext
*
* @component
* @example
* // Basic usage
* <NavLinkProvider>
* <App />
* </NavLinkProvider>
*
* @example
* // With custom prefetch defaults
* <NavLinkProvider
* prefetchDefaults={{ enabled: true, delay: 100 }}
* >
* <App />
* </NavLinkProvider>
*/
const NavLinkProvider = ({ children, activeMatchers: customMatchers, prefetchDefaults: customPrefetchDefaults, customRouterContext, useReactRouterContext = true }) => {
// Try to get React Router context if enabled
let reactRouterContext;
if (useReactRouterContext) {
try {
const navigate = (0, react_router_dom_1.useNavigate)();
const location = (0, react_router_dom_1.useLocation)();
reactRouterContext = { navigate, location };
}
catch (error) {
// React Router hooks not available
if (process.env.NODE_ENV !== 'production') {
console.debug('NavLinkProvider: React Router hooks not available');
}
}
}
// Combine context values
const contextValue = (0, react_1.useMemo)(() => ({
activeMatchers: customMatchers || matchers_1.matchers,
prefetchDefaults: {
...prefetch_1.defaultPrefetchOptions,
...customPrefetchDefaults
},
routerContext: customRouterContext || reactRouterContext
}), [customMatchers, customPrefetchDefaults, customRouterContext, reactRouterContext]);
return ((0, jsx_runtime_1.jsx)(exports.NavLinkContext.Provider, { value: contextValue, children: children }));
};
exports.NavLinkProvider = NavLinkProvider;
/**
* Hook to access NavLinkContext
*
* @returns {NavLinkContextValue} The current NavLink context value
*
* @example
* // Access context in a component
* const { routerContext, prefetchDefaults } = useNavLinkContext();
*/
const useNavLinkContext = () => {
return (0, react_1.useContext)(exports.NavLinkContext);
};
exports.useNavLinkContext = useNavLinkContext;
//# sourceMappingURL=NavContext.js.map