Using Sidebar with react-router

[apust]

When using Sidebar with react-router, it is essentially easier to implement your own SidebarItem than to use an existing component.

interface SidebarItemProps {
  icon: string;
  title: string;
  url: string;
}

export function SidebarItem({ icon, title, url }: SidebarItemProps) {
  return (
    <NavLink
      to={url}
      className="_e_sidebar-item"
      activeClassName="_e_sidebar-item_active"
    >
      <div className="_e_sidebar-item__icon">
        <Icon name={icon} />
      </div>
      <div className="_e_sidebar-item__text">{title}</div>
      <div className="_e_sidebar-item__tooltip _e_tooltip _e_tooltip_right">
        {title}
      </div>
    </NavLink>
  );
}

We should provide a better experience for developers. We can even consider using react-router-dom as a peer dependency to @elephas/react-layout, since that's what all React devs working with Elephas React are using anyways.