import { Dialog, DialogOverlay, DialogPortal, DialogClose, DialogDescription, DialogTitle, DialogTrigger, DialogHeader, DialogContent, DialogFooter,} from '@openlite/ui'
function App() {
return(
<Dialog>
<DialogTrigger asChild>
<Button outline="default" >Edit Profile</Button>
</DialogTrigger>
<DialogContent className="sm:max-w-[425px]">
<DialogHeader>
<DialogTitle className="font-bold text-3xl">Lorem ipsum </DialogTitle>
<DialogDescription className="font-light">
say somethingsay somethingsay somethingsay somethingsay somethingsay somethingsay somethingsay something
</DialogDescription>
</DialogHeader>
<div className='flex flex-col gap-1'>
<Label htmlFor="name">
Name
</Label>
<Input
id="name"
defaultValue="Sebastian Garcias"
className="col-span-3"
/>
</div>
<div className='flex flex-col gap-1'>
<Label htmlFor="username">
Username
</Label>
<Input
id="username"
defaultValue="@Sebasjs"
className="col-span-3"
/>
</div>
<DialogFooter>
<Button type="submit">Confirm</Button>
</DialogFooter>
</DialogContent>
</Dialog>
)
}