Components
Loading preview...
Here is Dialog component
@jollyshopland
npx shadcn@latest add https://21st.dev/r/jollyshopland/dialog-2import { Button } from "@/components/ui/button-1"
import {
DialogContent,
DialogFooter,
DialogHeader,
DialogOverlay,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog-2"
import { Label } from "@/components/ui/text-field-basic"
import { Input, TextField } from "@/components/ui/text-field-basic"
export default function DialogDemo() {
return (
<DialogTrigger>
<Button variant="outline">Sign up...</Button>
<DialogOverlay>
<DialogContent className="sm:max-w-[425px]">
{({ close }) => (
<>
<DialogHeader>
<DialogTitle>Sign up</DialogTitle>
</DialogHeader>
<div className="grid gap-4 py-4">
<TextField autoFocus>
<Label>First Name</Label>
<Input />
</TextField>
<TextField>
<Label>Last Name</Label>
<Input />
</TextField>
</div>
<DialogFooter>
<Button onPress={close} type="submit">
Save changes
</Button>
</DialogFooter>
</>
)}
</DialogContent>
</DialogOverlay>
</DialogTrigger>
)
}