-
|
I am trying to have a form in my nextjs application and I am referencing https://github.com/shadcn-ui/ui/blob/main/apps/www/app/examples/forms/account/account-form.tsx I am doing everything exactly similar, even tried directly copy pasting the form to a page in my application but the date picker seems to be not working when clicked, nothing happens on clicking. Is this a known bug or am I missing something? (The only thing different I can see doing is using the Thanks. UPDATE: Just realised after I added the language field from the example as well. Even the Command component is not visible as a pop-up on clicking. |
Beta Was this translation helpful? Give feedback.
Replies: 3 comments
-
|
This seems to be a problem with any Popover component. I tried copy-pasting the Popover demo code from https://ui.shadcn.com/docs/components/popover directly to a endpoint in my nextjs application and even that did not seem to be working when clicked. Any tip is appreciated. Here is the GitHub repository with the part that is not working GitHub URL. |
Beta Was this translation helpful? Give feedback.
-
|
Fixed it 🎉. Upon comparison with working code-bases, I realised it was something different RootLayout. correct RootLayoutimport type { Metadata } from 'next'
import { Inter } from 'next/font/google'
import './globals.css'
const inter = Inter({ subsets: ['latin'] })
export const metadata: Metadata = {
title: 'Create Next App',
description: 'Generated by create next app',
}
export default function RootLayout({
children,
}: {
children: React.ReactNode
}) {
return (
<html lang="en">
<body className={inter.className}>{children}</body>
</html>
)
}Failing RootLayoutimport './globals.css'
export const metadata = {
title: 'Create Next App',
description: 'Generated by create next app',
}
export default function RootLayout({
children,
}: {
children: React.ReactNode
}) {
return (
<html lang="en">
{/* <body className="bg-background text-foreground"> */}
<main className="min-h-screen flex flex-col items-center">
{children}
</main>
{/* </body> */}
</html>
)
} |
Beta Was this translation helpful? Give feedback.
-
|
I think using ... |
Beta Was this translation helpful? Give feedback.
Fixed it 🎉. Upon comparison with working code-bases, I realised it was something different RootLayout.
correct RootLayout
Failing RootLayout