betterstart-cli 0.0.106 → 0.0.107

package/dist/assets/adapters/next/templates/init/components/layouts/admin-nav-link.tsx

@@ -20,14 +20,16 @@ export function AdminNavLink({
       : pathname === href || pathname.startsWith(`${href}/`)
 
   return (
-    <SidebarMenuButton asChild>
-      <Link
-        aria-current={isActive ? 'page' : undefined}
-        data-active={isActive ? true : undefined}
-        href={href}
-      >
-        {children}
-      </Link>
+    <SidebarMenuButton
+      render={
+        <Link
+          aria-current={isActive ? 'page' : undefined}
+          data-active={isActive ? true : undefined}
+          href={href}
+        />
+      }
+    >
+      {children}
     </SidebarMenuButton>
   )
 }

package/dist/assets/adapters/next/templates/init/components/layouts/admin-sidebar-nav-link-skeleton.tsx

@@ -3,9 +3,5 @@ import { SidebarMenuButton } from '@admin/components/ui/sidebar'
 import Link from 'next/link'
 
 export function SidebarNavLinkSkeleton({ href, children }: { href: string; children: ReactNode }) {
-  return (
-    <SidebarMenuButton asChild>
-      <Link href={href}>{children}</Link>
-    </SidebarMenuButton>
-  )
+  return <SidebarMenuButton render={<Link href={href} />}>{children}</SidebarMenuButton>
 }

package/dist/assets/adapters/next/templates/init/components/layouts/admin-sidebar-user-menu.tsx

@@ -24,61 +24,67 @@ export async function SidebarUserMenu() {
     <SidebarMenu className="h-full">
       <SidebarMenuItem className="h-full">
         <DropdownMenu>
-          <DropdownMenuTrigger asChild>
-            <Button
-              variant="ghost"
-              className="h-full w-full justify-start border-none bg-transparent! px-3 text-left ring-0!"
-            >
-              <Avatar className="size-8 shrink-0">
-                <AvatarImage src={user.image ?? undefined} />
-                <AvatarFallback className="text-xs font-semibold group-hover:bg-white">
-                  {user.name?.charAt(0) ?? user.email?.charAt(0) ?? '?'}
-                </AvatarFallback>
-              </Avatar>
-              <div className="flex-1 truncate group-data-[collapsible=icon]:hidden">
-                <p className="truncate font-medium">{user.name}</p>
-              </div>
+          <DropdownMenuTrigger
+            render={
+              <Button
+                variant="ghost"
+                className="h-full w-full justify-start border-none bg-transparent! px-3 text-left ring-0!"
+              >
+                <Avatar className="size-8 shrink-0">
+                  <AvatarImage src={user.image ?? undefined} />
+                  <AvatarFallback className="text-xs font-semibold group-hover:bg-white">
+                    {user.name?.charAt(0) ?? user.email?.charAt(0) ?? '?'}
+                  </AvatarFallback>
+                </Avatar>
+                <div className="flex-1 truncate group-data-[collapsible=icon]:hidden">
+                  <p className="truncate font-medium">{user.name}</p>
+                </div>
 
-              <div className="group-data-[collapsible=icon]:hidden">
-                <span
-                  className={cn(
-                    buttonVariants({ variant: 'outline', size: 'icon' }),
-                    'size-7 rounded-sm group-hover:bg-white'
-                  )}
-                >
-                  <Ellipsis strokeWidth={2} className="size-4" />
-                </span>
-              </div>
-            </Button>
-          </DropdownMenuTrigger>
+                <div className="group-data-[collapsible=icon]:hidden">
+                  <span
+                    className={cn(
+                      buttonVariants({ variant: 'outline', size: 'icon' }),
+                      'size-7 rounded-sm group-hover:bg-white'
+                    )}
+                  >
+                    <Ellipsis strokeWidth={2} className="size-4" />
+                  </span>
+                </div>
+              </Button>
+            }
+          />
           <DropdownMenuContent align="start" alignOffset={12} className="w-68 p-1">
             <DropdownMenuGroup>
-              <DropdownMenuItem className="justify-between" asChild>
-                <Link
-                  href="/admin/profile"
-                  prefetch={true}
-                  className="flex w-full items-center justify-between gap-2 py-2 pr-1"
-                >
-                  <div className="flex items-center gap-2">
-                    <div className="flex flex-col">
-                      <p className="truncate font-medium">{user.name}</p>
-                      <p className="truncate text-sm font-normal text-muted-foreground [text-box-trim:trim-start]">
-                        {user.email}
-                      </p>
-                    </div>
+              <DropdownMenuItem
+                className="justify-between"
+                render={
+                  <Link
+                    href="/admin/profile"
+                    prefetch={true}
+                    className="flex w-full items-center justify-between gap-2 py-2 pr-1"
+                  />
+                }
+              >
+                <div className="flex items-center gap-2">
+                  <div className="flex flex-col">
+                    <p className="truncate font-medium">{user.name}</p>
+                    <p className="truncate text-sm font-normal text-muted-foreground [text-box-trim:trim-start]">
+                      {user.email}
+                    </p>
                   </div>
-                  <Button variant="ghost" className="pointer-events-none size-8! shrink-0">
-                    <Settings strokeWidth={2} className="size-4" />
-                  </Button>
-                </Link>
+                </div>
+                <Button variant="ghost" className="pointer-events-none size-8! shrink-0">
+                  <Settings strokeWidth={2} className="size-4" />
+                </Button>
               </DropdownMenuItem>
             </DropdownMenuGroup>
             <DropdownMenuGroup>
-              <DropdownMenuItem className="justify-between" asChild>
-                <Link href="https://betterstart.io/docs" target="_blank">
-                  <span>Docs</span>
-                  <BookOpen strokeWidth={1.2} className="size-4" />
-                </Link>
+              <DropdownMenuItem
+                className="justify-between"
+                render={<Link href="https://betterstart.io/docs" target="_blank" />}
+              >
+                <span>Docs</span>
+                <BookOpen strokeWidth={1.2} className="size-4" />
               </DropdownMenuItem>
               <AdminSignOut className="justify-between" />
             </DropdownMenuGroup>

package/dist/assets/adapters/next/templates/init/components/layouts/admin-sign-out.tsx

@@ -48,8 +48,8 @@ export function AdminSignOut({
 
   return (
     <DropdownMenuItem
-      onSelect={(event) => {
-        event.preventDefault()
+      closeOnClick={false}
+      onClick={() => {
         handleSignOut()
       }}
       disabled={isPending}

package/dist/assets/adapters/next/templates/init/components/shared/delete-dialog.tsx

@@ -34,11 +34,9 @@ export function DeleteDialog({
 
   return (
     <AlertDialog open={open} onOpenChange={setOpen}>
-      <AlertDialogTrigger asChild>
-        <Button variant="destructive" size="default">
-          <Trash2 className="-ml-0.5 size-3.5" strokeWidth={2} />
-          Delete {count} {label}
-        </Button>
+      <AlertDialogTrigger render={<Button variant="destructive" size="default" />}>
+        <Trash2 className="-ml-0.5 size-3.5" strokeWidth={2} />
+        Delete {count} {label}
       </AlertDialogTrigger>
       <AlertDialogContent>
         <AlertDialogHeader>

package/dist/assets/adapters/next/templates/init/components/shared/dev-mode/lifecycle-hooks-tab.tsx

@@ -50,7 +50,7 @@ export function LifecycleHooksTab({ lifecycleHooks }: LifecycleHooksTabProps) {
   }
 
   return (
-    <Accordion type="single" defaultValue={firstHook.id} className="min-h-0 shrink-0 rounded-sm">
+    <Accordion defaultValue={[firstHook.id]} className="min-h-0 shrink-0 rounded-sm">
       {lifecycleHooks.map((hook) => {
         const HookIcon = LIFECYCLE_HOOK_ICONS[hook.icon]
         const phaseLabel = LIFECYCLE_HOOK_PHASE_LABELS[hook.phase]

package/dist/assets/adapters/next/templates/init/components/shared/dev-mode/snippets-tab.tsx

@@ -47,7 +47,7 @@ export function SnippetsTab({ snippets }: SnippetsTabProps) {
   }
 
   return (
-    <Accordion type="single" defaultValue={firstSnippet.id} className="min-h-0 shrink-0 rounded-sm">
+    <Accordion defaultValue={[firstSnippet.id]} className="min-h-0 shrink-0 rounded-sm">
       {snippets.map((snippet) => {
         const SnippetIcon = SNIPPET_ICONS[snippet.icon]
         const snippetKindLabel = SNIPPET_KIND_LABELS[snippet.kind]

package/dist/assets/adapters/next/templates/init/components/shared/dev-mode-integrate.tsx

@@ -46,14 +46,12 @@ export function DevModeIntegrateButton({
   }
 
   return (
-    <Drawer direction="right" handleOnly onOpenChange={handleOpenChange}>
-      <DrawerTrigger asChild>
-        <Button type="button" variant="outline">
-          <Code2 />
-          <span className="hidden sm:inline">Dev Mode</span>
-        </Button>
+    <Drawer swipeDirection="right" onOpenChange={handleOpenChange}>
+      <DrawerTrigger render={<Button type="button" variant="outline" />}>
+        <Code2 />
+        <span className="hidden sm:inline">Dev Mode</span>
       </DrawerTrigger>
-      <DrawerContent className="w-full overflow-hidden data-[vaul-drawer-direction=right]:sm:max-w-2xl data-[vaul-drawer-direction=right]:lg:max-w-4xl">
+      <DrawerContent className="w-full overflow-hidden data-[swipe-direction=right]:sm:max-w-2xl data-[swipe-direction=right]:lg:max-w-4xl">
         <DrawerHeader className="pb-4">
           <DrawerTitle>{integration.schemaLabel}</DrawerTitle>
           <DrawerDescription>

package/dist/assets/adapters/next/templates/init/components/shared/entity-filters-bar.tsx

@@ -104,17 +104,16 @@ export function EntityFiltersBar({
           return (
             <div key={filter.key} className="relative flex items-center gap-1">
               <DropdownMenu>
-                <DropdownMenuTrigger asChild>
-                  <Button variant="outline" className="w-45 justify-between">
-                    {filter.value
-                      ? (filter.options.find((o) => o.value === filter.value)?.label ??
-                        filter.label)
-                      : `All ${filter.label}`}
+                <DropdownMenuTrigger
+                  render={<Button variant="outline" className="w-45 justify-between" />}
+                >
+                  {filter.value
+                    ? (filter.options.find((o) => o.value === filter.value)?.label ?? filter.label)
+                    : `All ${filter.label}`}
 
-                    {!filter.value && (
-                      <ChevronDown className="absolute top-1/2 right-2.5 size-4 -translate-y-1/2 text-foreground" />
-                    )}
-                  </Button>
+                  {!filter.value && (
+                    <ChevronDown className="absolute top-1/2 right-2.5 size-4 -translate-y-1/2 text-foreground" />
+                  )}
                 </DropdownMenuTrigger>
                 <DropdownMenuContent align="start">
                   <DropdownMenuRadioGroup

package/dist/assets/adapters/next/templates/init/components/shared/entity-versions/entity-version-item.tsx

@@ -36,10 +36,8 @@ export function EntityVersionItem({
             <Badge variant="secondary">v{version.version}</Badge>
           </div>
           <Tooltip>
-            <TooltipTrigger asChild>
-              <p className="w-fit text-xs text-muted-foreground">
-                Saved {formatDistanceToNow(createdDate, { addSuffix: true })}
-              </p>
+            <TooltipTrigger render={<p className="w-fit text-xs text-muted-foreground" />}>
+              Saved {formatDistanceToNow(createdDate, { addSuffix: true })}
             </TooltipTrigger>
             <TooltipContent>{format(createdDate, 'PPpp')}</TooltipContent>
           </Tooltip>

package/dist/assets/adapters/next/templates/init/components/shared/entity-versions/entity-version-restore-dialog.tsx

@@ -48,10 +48,8 @@ export function EntityVersionRestoreDialog({
 
   return (
     <AlertDialog open={open} onOpenChange={setOpen}>
-      <AlertDialogTrigger asChild>
-        <Button variant="outline" size="sm">
-          Restore
-        </Button>
+      <AlertDialogTrigger render={<Button variant="outline" size="sm" />}>
+        Restore
       </AlertDialogTrigger>
       <AlertDialogContent>
         <AlertDialogHeader>

package/dist/assets/adapters/next/templates/init/components/shared/entity-versions/entity-versions-current-row.tsx

@@ -34,10 +34,8 @@ export function EntityVersionsCurrentRow({ updatedAt, author }: EntityVersionsCu
             <Badge variant="outline">Current</Badge>
           </div>
           <Tooltip>
-            <TooltipTrigger asChild>
-              <p className="w-fit text-xs text-muted-foreground">
-                Edited {formatDistanceToNow(updatedDate, { addSuffix: true })}
-              </p>
+            <TooltipTrigger render={<p className="w-fit text-xs text-muted-foreground" />}>
+              Edited {formatDistanceToNow(updatedDate, { addSuffix: true })}
             </TooltipTrigger>
             <TooltipContent>{format(updatedDate, 'PPpp')}</TooltipContent>
           </Tooltip>

package/dist/assets/adapters/next/templates/init/components/shared/entity-versions/entity-versions-drawer.tsx

@@ -42,7 +42,7 @@ export function EntityVersionsDrawer({
   onRestored
 }: EntityVersionsDrawerProps) {
   return (
-    <Drawer direction="right" open={open} onOpenChange={onOpenChange} modal>
+    <Drawer swipeDirection="right" open={open} onOpenChange={onOpenChange} modal>
       <DrawerContent className="h-full sm:max-w-lg">
         <DrawerHeader>
           <DrawerTitle>Versions</DrawerTitle>

package/dist/assets/adapters/next/templates/init/components/shared/media/edit-media-dialog.tsx

@@ -31,10 +31,10 @@ export function EditMediaDialog({ media, open, onOpenChange, onSaved }: EditMedi
 
   return (
     <Drawer
-      direction="right"
+      swipeDirection="right"
       open={isOpen}
       onOpenChange={handleOpenChange}
-      onAnimationEnd={(nextOpen) => {
+      onOpenChangeComplete={(nextOpen) => {
         if (nextOpen) {
           setClosingMedia(null)
           return

package/dist/assets/adapters/next/templates/init/components/shared/media/media-delete-dialog.tsx

@@ -52,11 +52,11 @@ export function MediaDeleteDialog({ media, disabled = false, onDeleted }: MediaD
 
   return (
     <AlertDialog>
-      <AlertDialogTrigger asChild>
-        <Button variant="destructive" disabled={disabled || isPending}>
-          <Trash2 />
-          Delete media
-        </Button>
+      <AlertDialogTrigger
+        render={<Button variant="destructive" disabled={disabled || isPending} />}
+      >
+        <Trash2 />
+        Delete media
       </AlertDialogTrigger>
       <AlertDialogContent>
         <AlertDialogHeader>

package/dist/assets/adapters/next/templates/init/components/shared/media/media-delete-drawer.tsx

@@ -4,10 +4,16 @@ import * as React from 'react'
 import type { AdminMedia } from '@admin/types'
 import { deleteMedia } from '@admin/actions/media'
 import { Button } from '@admin/components/ui/button'
+import {
+  Drawer,
+  DrawerContent,
+  DrawerDescription,
+  DrawerTitle,
+  DrawerTrigger
+} from '@admin/components/ui/drawer'
 import { Spinner } from '@admin/components/ui/spinner'
 import { Trash2, TriangleAlert } from 'lucide-react'
 import { toast } from 'sonner'
-import { Drawer as DrawerPrimitive } from 'vaul'
 
 interface MediaDeleteDrawerProps {
   media: AdminMedia
@@ -90,63 +96,56 @@ export function MediaDeleteDrawer({
   }
 
   return (
-    <DrawerPrimitive.Root
+    <Drawer
       container={container}
-      direction="bottom"
-      dismissible={!isPending}
+      swipeDirection="down"
+      disablePointerDismissal={isPending}
       open={open}
       onOpenChange={handleOpenChange}
     >
-      <DrawerPrimitive.Trigger asChild>
-        <Button variant="destructive" disabled={disabled || isPending || !container}>
-          <Trash2 />
-          Delete media
-        </Button>
-      </DrawerPrimitive.Trigger>
-      <DrawerPrimitive.Portal>
-        <DrawerPrimitive.Overlay className="pointer-events-auto absolute inset-0 z-20 bg-black/45 supports-backdrop-filter:backdrop-blur-xs data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0" />
-        <DrawerPrimitive.Content className="pointer-events-auto absolute inset-x-0 bottom-0 z-30 max-h-[calc(100%-1rem)] overflow-hidden p-3 outline-none">
-          <div
-            className="overflow-hidden rounded-sm border border-border bg-popover text-sm text-popover-foreground shadow-2xl transition-[height] duration-200 ease-out"
-            style={contentHeight ? { height: contentHeight } : undefined}
-          >
-            <div
-              ref={contentRef}
-              className="max-h-[calc(100vh-8rem)] overflow-y-auto px-4 pt-4 pb-4"
-            >
-              <div aria-hidden="true" className="mx-auto mb-5 h-1.5 w-20 rounded-sm bg-muted" />
-              <div className="mb-3 flex size-10 items-center justify-center rounded-sm bg-destructive/10 text-foreground">
-                <TriangleAlert className="size-5" />
-              </div>
-              <DrawerPrimitive.Title className="font-heading text-base font-medium text-foreground">
-                Delete this media?
-              </DrawerPrimitive.Title>
-              <DrawerPrimitive.Description className="mt-1 text-sm text-muted-foreground">
-                This deletes {media.filename} from the media library. The stored file is not
-                deleted.
-              </DrawerPrimitive.Description>
-              <div className="mt-5 grid grid-cols-2 gap-2">
-                <Button
-                  variant="secondary"
-                  onClick={() => handleOpenChange(false)}
-                  disabled={isPending}
-                >
-                  Cancel
-                </Button>
-                <Button
-                  variant="destructive"
-                  onClick={() => void handleDelete()}
-                  disabled={isPending}
-                  aria-busy={isPending}
-                >
-                  {isPending && <Spinner />}
-                  {isPending ? 'Deleting…' : 'Delete media'}
-                </Button>
-              </div>
+      <DrawerTrigger
+        render={<Button variant="destructive" disabled={disabled || isPending || !container} />}
+      >
+        <Trash2 />
+        Delete media
+      </DrawerTrigger>
+      <DrawerContent className="pointer-events-auto max-h-[calc(100%-1rem)] overflow-hidden p-3 outline-none">
+        <div
+          className="overflow-hidden rounded-sm border border-border bg-popover text-sm text-popover-foreground shadow-2xl transition-[height] duration-200 ease-out"
+          style={contentHeight ? { height: contentHeight } : undefined}
+        >
+          <div ref={contentRef} className="max-h-[calc(100vh-8rem)] overflow-y-auto px-4 pt-4 pb-4">
+            <div aria-hidden="true" className="mx-auto mb-5 h-1.5 w-20 rounded-sm bg-muted" />
+            <div className="mb-3 flex size-10 items-center justify-center rounded-sm bg-destructive/10 text-foreground">
+              <TriangleAlert className="size-5" />
+            </div>
+            <DrawerTitle className="font-heading text-base font-medium text-foreground">
+              Delete this media?
+            </DrawerTitle>
+            <DrawerDescription className="mt-1 text-sm text-muted-foreground">
+              This deletes {media.filename} from the media library. The stored file is not deleted.
+            </DrawerDescription>
+            <div className="mt-5 grid grid-cols-2 gap-2">
+              <Button
+                variant="secondary"
+                onClick={() => handleOpenChange(false)}
+                disabled={isPending}
+              >
+                Cancel
+              </Button>
+              <Button
+                variant="destructive"
+                onClick={() => void handleDelete()}
+                disabled={isPending}
+                aria-busy={isPending}
+              >
+                {isPending && <Spinner />}
+                {isPending ? 'Deleting…' : 'Delete media'}
+              </Button>
             </div>
           </div>
-        </DrawerPrimitive.Content>
-      </DrawerPrimitive.Portal>
-    </DrawerPrimitive.Root>
+        </div>
+      </DrawerContent>
+    </Drawer>
   )
 }

package/dist/assets/adapters/next/templates/init/components/shared/sort-order-dialog.tsx

@@ -187,10 +187,10 @@ export function SortOrderDialog({
       onDragCancel={handleDragCancel}
     >
       <Drawer
-        direction="right"
+        swipeDirection="right"
         open={open}
         onOpenChange={onOpenChange}
-        onAnimationEnd={handleDrawerAnimationEnd}
+        onOpenChangeComplete={handleDrawerAnimationEnd}
       >
         <DrawerContent className="h-full w-full overflow-hidden">
           <div className="relative z-10 flex min-h-0 flex-1 flex-col gap-3 overflow-hidden">
@@ -231,9 +231,7 @@ export function SortOrderDialog({
                 {isSaving && <Spinner />}
                 {isSaving ? 'Saving…' : 'Save'}
               </Button>
-              <DrawerClose asChild>
-                <Button variant="outline">Close</Button>
-              </DrawerClose>
+              <DrawerClose render={<Button variant="outline" />}>Close</DrawerClose>
             </DrawerFooter>
           </div>
         </DrawerContent>

package/dist/assets/adapters/next/templates/init/pages/dashboard-page.tsx

@@ -51,7 +51,7 @@ export default function DashboardPage() {
                 </p>
               </div>
               <div className="flex w-full flex-col">
-                <Accordion type="single" collapsible defaultValue="item-1">
+                <Accordion defaultValue={['item-1']}>
                   <AccordionItem value="item-1">
                     <AccordionTrigger>
                       <div className="flex items-center gap-3">

package/dist/assets/adapters/next/templates/init/pages/settings/audit-log/audit-log-detail-drawer.tsx

@@ -36,7 +36,7 @@ function formatMetadata(metadata: Record<string, unknown> | null): string {
 
 export function AuditLogDetailDrawer({ auditLog, open, onOpenChange }: AuditLogDetailDrawerProps) {
   return (
-    <Drawer direction="right" open={open} onOpenChange={onOpenChange} modal>
+    <Drawer swipeDirection="right" open={open} onOpenChange={onOpenChange} modal>
       <DrawerContent className="h-full sm:max-w-xl">
         <DrawerHeader>
           <DrawerTitle>Audit Event</DrawerTitle>

package/dist/assets/adapters/next/templates/init/pages/settings/forms/form-notifications-drawer.tsx

@@ -82,7 +82,7 @@ export function FormNotificationsDrawer({
   const isPending = mutation.isPending
 
   return (
-    <Drawer direction="right" open={open} onOpenChange={onOpenChange} modal>
+    <Drawer swipeDirection="right" open={open} onOpenChange={onOpenChange} modal>
       <DrawerContent className="h-full sm:max-w-xl">
         <Form {...form}>
           <form
@@ -128,10 +128,10 @@ export function FormNotificationsDrawer({
             </ScrollArea>
 
             <DrawerFooter className="flex-row justify-end">
-              <DrawerClose asChild>
-                <Button type="button" variant="outline" size="lg" disabled={isPending}>
-                  Cancel
-                </Button>
+              <DrawerClose
+                render={<Button type="button" variant="outline" size="lg" disabled={isPending} />}
+              >
+                Cancel
               </DrawerClose>
               <Button
                 type="submit"

package/dist/assets/adapters/next/templates/init/pages/settings/webhooks/webhook-actions.tsx

@@ -23,33 +23,33 @@ export function WebhookActions({ webhook, onEdit, onDelete }: WebhookActionsProp
 
   return (
     <DropdownMenu>
-      <DropdownMenuTrigger asChild>
-        <Button
-          variant="ghost"
-          className="size-8 p-0"
-          aria-label={`Open webhook actions for ${webhook.name}`}
-        >
-          <span className="sr-only">Open webhook actions</span>
-          {sendTest.isPending ? (
-            <Spinner className="size-4" />
-          ) : (
-            <MoreHorizontal className="size-4" />
-          )}
-        </Button>
-      </DropdownMenuTrigger>
+      <DropdownMenuTrigger
+        render={
+          <Button
+            variant="ghost"
+            className="size-8 p-0"
+            aria-label={`Open webhook actions for ${webhook.name}`}
+          >
+            <span className="sr-only">Open webhook actions</span>
+            {sendTest.isPending ? (
+              <Spinner className="size-4" />
+            ) : (
+              <MoreHorizontal className="size-4" />
+            )}
+          </Button>
+        }
+      />
       <DropdownMenuContent align="end">
         <DropdownMenuItem
+          closeOnClick={false}
           disabled={sendTest.isPending}
           aria-busy={sendTest.isPending}
-          onSelect={(event) => {
-            event.preventDefault()
-            sendTest.mutate(webhook.id)
-          }}
+          onClick={() => sendTest.mutate(webhook.id)}
         >
           {sendTest.isPending ? 'Testing…' : 'Test'}
         </DropdownMenuItem>
-        <DropdownMenuItem onSelect={() => onEdit(webhook)}>Edit</DropdownMenuItem>
-        <DropdownMenuItem variant="destructive" onSelect={() => onDelete(webhook)}>
+        <DropdownMenuItem onClick={() => onEdit(webhook)}>Edit</DropdownMenuItem>
+        <DropdownMenuItem variant="destructive" onClick={() => onDelete(webhook)}>
           Delete
         </DropdownMenuItem>
       </DropdownMenuContent>

package/dist/assets/adapters/next/templates/init/pages/users/change-password-dialog.tsx

@@ -134,11 +134,13 @@ export function ChangePasswordDialog({
 
   return (
     <Dialog open={open} onOpenChange={handleOpenChange}>
-      <DialogTrigger asChild>
-        <DropdownMenuItem onSelect={(event) => event.preventDefault()}>
-          <KeySquare className="size-4" />
-          Change password
-        </DropdownMenuItem>
+      <DialogTrigger
+        render={
+          <DropdownMenuItem closeOnClick={false} onClick={(event) => event.preventDefault()} />
+        }
+      >
+        <KeySquare className="size-4" />
+        Change password
       </DialogTrigger>
       <DialogContent className="sm:max-w-135">
         <Form {...form}>

package/dist/assets/adapters/next/templates/init/pages/users/columns.tsx

@@ -148,11 +148,9 @@ export const columns: ColumnDef<User>[] = [
       return (
         <div className="flex justify-end">
           <DropdownMenu>
-            <DropdownMenuTrigger asChild>
-              <Button variant="ghost" className="size-8 p-0">
-                <span className="sr-only">Open menu</span>
-                <MoreHorizontal className="size-4" />
-              </Button>
+            <DropdownMenuTrigger render={<Button variant="ghost" className="size-8 p-0" />}>
+              <span className="sr-only">Open menu</span>
+              <MoreHorizontal className="size-4" />
             </DropdownMenuTrigger>
             <DropdownMenuContent align="end">
               {!isCurrentUser ? (