dbl-components
Version:
Framework based on bootstrap 5
12 lines • 2.1 kB
JavaScript
function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}import React,{useEffect}from"react";import{useLocation,useNavigate,useParams}from"react-router-dom";/**
* Wrapper component to manage class names and styles in the body element
* based on the current route and its props.
* @param {Object} WrappedComponent - The component to wrap (Controller).
* @param {Object} route - The current route object containing name, style, and other properties.
* @returns {JSX.Element} - The wrapped component with added functionality.
*/var withRouteWrapper=function withRouteWrapper(WrappedComponent,route){return function RouteWrapper(props){var location=useLocation();var navigate=useNavigate();var params=useParams();useEffect(function(){// Manage body class based on route name
var viewClassName=Array.from(document.body.classList).find(function(cl){return cl.endsWith("-view")});if(viewClassName){document.body.classList.remove(viewClassName)}document.body.classList.add("".concat(route.name,"-view"));// Remove old location-based classes and add new location class
document.body.classList.forEach(function(cls){if(cls.startsWith("location-")){document.body.classList.remove(cls)}});document.body.classList.add("location".concat(location.pathname.replace(/\//g,"-")));// Apply custom styles to route if provided
if(!route.style){route.style={}}route.style["--component-name"]="\"".concat(route.name,"\"");// Cleanup function to remove added classes when the component unmounts or route changes
return function(){document.body.classList.remove("".concat(route.name,"-view"));document.body.classList.remove("location".concat(location.pathname.replace(/\//g,"-")))}},[location.pathname,route.name]);return/*#__PURE__*/React.createElement(WrappedComponent,_extends({},props,{location:location,navigate:navigate,match:params,route:route}))}};export default withRouteWrapper;
//# sourceMappingURL=with-route-wrapper.js.map