Cannot work with react router router dom link component?

[theaungmyatmoe]

Describe the bug
How can I use react router dom with flowbite react?

To Reproduce
Steps to reproduce the behavior:
How can I work with react-router-dom's <Link> component and flowbite default links?

  <Navbar.Brand>
                    <img
                        src="https://flowbite.com/docs/images/logo.svg"
                        className="mr-3 h-6 sm:h-9"
                        alt="Flowbite Logo"
                    />
                    <span className="self-center whitespace-nowrap text-xl font-semibold dark:text-white">
      Shop
    </span>
                </Navbar.Brand>

or 

 <Navbar.Link href="/navbars">
                        Contact
                    </Navbar.Link>

When I use inside original nav component, tag will be nested.

Warning: validateDOMNesting(...): <a> cannot appear as a descendant of <a>.
    at a
    at LinkWithRef (http://localhost:5173/node_modules/.vite/deps/react-router-dom.js?v=309caf15:3528:5)
    at a
    at li
    at NavbarLink (http://localhost:5173/node_modules/.vite/deps/flowbite-react.js?v=ac84f760:5352:21)
    at ul
    at div
    at NavbarCollapse (http://localhost:5173/node_modules/.vite/deps/flowbite-react.js?v=ac84f760:5343:25)
    at div
    at nav
    at NavbarComponent (http://localhost:5173/node_modules/.vite/deps/flowbite-react.js?v=ac84f760:5380:26)
    at AppNavbar
    at MainLayout
    at RenderedRoute (http://localhost:5173/node_modules/.vite/deps/react-router-dom.js?v=309caf15:2761:5)
    at RenderErrorBoundary (http://localhost:5173/node_modules/.vite/deps/react-router-dom.js?v=309caf15:2724:5)
    at Routes (http://localhost:5173/node_modules/.vite/deps/react-router-dom.js?v=309caf15:3092:5)
    at Router (http://localhost:5173/node_modules/.vite/deps/react-router-dom.js?v=309caf15:3039:15)
    at RouterProvider (http://localhost:5173/node_modules/.vite/deps/react-router-dom.js?v=309caf15:2929:5)
    at App
printWarning @ react-dom.development.js:86
error @ react-dom.development.js:60
validateDOMNesting @ react-dom.development.js:10849
createInstance @ react-dom.development.js:10930
completeWork @ react-dom.development.js:22187
completeUnitOfWork @ react-dom.development.js:26596
performUnitOfWork @ react-dom.development.js:26568
workLoopSync @ react-dom.development.js:26466
renderRootSync @ react-dom.development.js:26434
performConcurrentWorkOnRoot @ react-dom.development.js:25738
workLoop @ scheduler.development.js:266
flushWork @ scheduler.development.js:239
performWorkUntilDeadline @ scheduler.development.js:533

Expected behavior
I just wanna use react router dom.

System information:

• Device: Acer
• Resolution: Full HD laptop
• OS: Linux Ubuntu
• Browser: Chrome
• Version: ??

Project information:

• Tailwind: 3.0.0
• Flowbite: 1.4.7
• Flowbite React: 0.1.2
• Type: Vite

[rluders]

I guess that we need to implement something similar to what we have at the Sidebar.Item:

flowbite-react/src/lib/components/Sidebar/SidebarItem.tsx

Line 13 in 2f58ae2

as?: ElementType;

[theaungmyatmoe]

I guess that we need to implement something similar to what we have at the Sidebar.Item:

flowbite-react/src/lib/components/Sidebar/SidebarItem.tsx

Line 13 in 2f58ae2

as?: ElementType;

Yes, I tried as={Link} but no type hint and not working well

[rluders]

Oh, sorry, I expressed myself poorly... let me rephrase it:

"I guess that to fix this issue we should consider implementing something similar to what we have at the Sidebar.Item."

So, this is how someone can fix the issue and submit a PR fixing it. Currently, isn't possible to use as={} on Navbar.Brand or Navbar.Link.