betterstart-cli 0.0.107 → 0.0.109

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

@@ -67,8 +67,6 @@ export function WebhookEndpointDialog({ webhook, open, onOpenChange }: WebhookEn
         : [],
     [subscriptions, webhook]
   )
-  const [selectedEvents, setSelectedEvents] = React.useState<string[] | null>(null)
-  const events = selectedEvents ?? subscribedEvents
   const [secret, setSecret] = React.useState<string | null>(null)
 
   const formSources = webhookEventSources.filter((source) => source.kind === 'form')
@@ -83,6 +81,19 @@ export function WebhookEndpointDialog({ webhook, open, onOpenChange }: WebhookEn
       events: subscribedEvents
     }
   })
+  const events = form.watch('events')
+
+  React.useEffect(() => {
+    if (!open) return
+
+    form.reset({
+      name: webhook?.name ?? '',
+      url: webhook?.url ?? '',
+      enabled: webhook?.enabled ?? true,
+      events: subscribedEvents
+    })
+    setSecret(null)
+  }, [form, open, subscribedEvents, webhook])
 
   const saveMutation = useMutation({
     mutationFn: async (values: EndpointFormValues) => {
@@ -92,8 +103,8 @@ export function WebhookEndpointDialog({ webhook, open, onOpenChange }: WebhookEn
         enabled: values.enabled
       }
       const result = webhook
-        ? await updateWebhook(webhook.id, { ...endpointValues, events })
-        : await createWebhook({ ...endpointValues, events })
+        ? await updateWebhook(webhook.id, { ...endpointValues, events: values.events })
+        : await createWebhook({ ...endpointValues, events: values.events })
       if (!result.success) {
         throw new Error(result.error || 'Failed to save this webhook')
       }
@@ -172,16 +183,23 @@ export function WebhookEndpointDialog({ webhook, open, onOpenChange }: WebhookEn
   const isPending = saveMutation.isPending
 
   function toggleEvent(event: string, checked: boolean) {
-    const nextEvents = checked ? [...events, event] : events.filter((entry) => entry !== event)
-    setSelectedEvents(nextEvents)
-    form.setValue('events', nextEvents)
+    const currentEvents = form.getValues('events')
+    const nextEvents = checked
+      ? currentEvents.includes(event)
+        ? currentEvents
+        : [...currentEvents, event]
+      : currentEvents.filter((entry) => entry !== event)
+    form.setValue('events', nextEvents, { shouldDirty: true, shouldValidate: true })
   }
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent className="sm:max-w-135">
         <Form {...form}>
-          <form onSubmit={form.handleSubmit((values) => saveMutation.mutate(values))}>
+          <form
+            autoComplete="off"
+            onSubmit={form.handleSubmit((values) => saveMutation.mutate(values))}
+          >
             <DialogHeader>
               <DialogTitle>{isEdit ? `Edit webhook — ${webhook.name}` : 'Add webhook'}</DialogTitle>
               <DialogDescription>

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

@@ -82,7 +82,7 @@ export function ChangePasswordDialog({
   const form = useForm<ChangePasswordFormValues>({
     resolver: standardSchemaResolver(isCurrentUser ? ownPasswordSchema : userPasswordSchema),
     defaultValues,
-    mode: 'onBlur',
+    mode: 'onChange',
     reValidateMode: 'onChange'
   })
 
@@ -144,7 +144,10 @@ export function ChangePasswordDialog({
       </DialogTrigger>
       <DialogContent className="sm:max-w-135">
         <Form {...form}>
-          <form onSubmit={form.handleSubmit((values) => mutation.mutate(values))}>
+          <form
+            autoComplete="off"
+            onSubmit={form.handleSubmit((values) => mutation.mutate(values))}
+          >
             <DialogHeader>
               <DialogTitle>Change Password</DialogTitle>
               <DialogDescription>
@@ -166,7 +169,7 @@ export function ChangePasswordDialog({
                         <FormControl>
                           <Input
                             type="password"
-                            autoComplete="current-password"
+                            autoComplete="off"
                             disabled={isPending}
                             autoFocus
                             {...field}
@@ -186,7 +189,7 @@ export function ChangePasswordDialog({
                       <FormControl>
                         <Input
                           type="password"
-                          autoComplete="new-password"
+                          autoComplete="off"
                           disabled={isPending}
                           autoFocus={!isCurrentUser}
                           {...field}
@@ -204,12 +207,7 @@ export function ChangePasswordDialog({
                     <FormItem>
                       <FormLabel>Confirm Password</FormLabel>
                       <FormControl>
-                        <Input
-                          type="password"
-                          autoComplete="new-password"
-                          disabled={isPending}
-                          {...field}
-                        />
+                        <Input type="password" autoComplete="off" disabled={isPending} {...field} />
                       </FormControl>
                       <FormMessage />
                     </FormItem>

package/dist/assets/adapters/next/templates/init/pages/users/create-user-dialog.tsx

@@ -67,7 +67,7 @@ export function CreateUserDialog() {
   const form = useForm<CreateUserFormValues>({
     resolver: standardSchemaResolver(createUserSchema),
     defaultValues,
-    mode: 'onBlur',
+    mode: 'onChange',
     reValidateMode: 'onChange'
   })
 
@@ -111,7 +111,10 @@ export function CreateUserDialog() {
       <DialogTrigger render={<Button />}>Create User</DialogTrigger>
       <DialogContent className="sm:max-w-135">
         <Form {...form}>
-          <form onSubmit={form.handleSubmit((values) => mutation.mutate(values))}>
+          <form
+            autoComplete="off"
+            onSubmit={form.handleSubmit((values) => mutation.mutate(values))}
+          >
             <DialogHeader>
               <DialogTitle>Create User</DialogTitle>
               <DialogDescription>Add a new user to the system</DialogDescription>
@@ -129,7 +132,7 @@ export function CreateUserDialog() {
                         <Input
                           type="email"
                           placeholder="user@example.com"
-                          autoComplete="email"
+                          autoComplete="off"
                           disabled={isPending}
                           {...field}
                         />
@@ -148,7 +151,7 @@ export function CreateUserDialog() {
                         <Input
                           type="text"
                           placeholder="Full name"
-                          autoComplete="name"
+                          autoComplete="off"
                           disabled={isPending}
                           {...field}
                         />
@@ -167,7 +170,7 @@ export function CreateUserDialog() {
                         <Input
                           type="password"
                           placeholder="Min 8 characters"
-                          autoComplete="new-password"
+                          autoComplete="off"
                           disabled={isPending}
                           {...field}
                         />

package/dist/assets/adapters/next/templates/init/pages/users/delete-user-dialog.tsx

@@ -118,7 +118,7 @@ export function DeleteUserDialog({ userId, userName, isCurrentUser }: DeleteUser
       </AlertDialogTrigger>
       <AlertDialogContent>
         <Form {...form}>
-          <form onSubmit={form.handleSubmit(() => mutation.mutate())}>
+          <form autoComplete="off" onSubmit={form.handleSubmit(() => mutation.mutate())}>
             <AlertDialogHeader>
               <AlertDialogTitle>Delete account?</AlertDialogTitle>
               <AlertDialogDescription>

package/dist/assets/adapters/next/templates/init/pages/users/edit-role-dialog.tsx

@@ -12,6 +12,7 @@ import {
   DialogTitle,
   DialogTrigger
 } from '@admin/components/ui/dialog'
+import { Form, FormControl, FormField, FormItem, FormMessage } from '@admin/components/ui/form'
 import {
   Select,
   SelectContent,
@@ -22,6 +23,7 @@ import {
 import { Spinner } from '@admin/components/ui/spinner'
 import { UserRole } from '@admin/types/auth'
 import { useQueryClient } from '@tanstack/react-query'
+import { useForm } from 'react-hook-form'
 import { toast } from 'sonner'
 
 interface EditRoleDialogProps {
@@ -31,19 +33,32 @@ interface EditRoleDialogProps {
   children: React.ReactNode
 }
 
+interface EditRoleFormValues {
+  role: UserRole
+}
+
 export function EditRoleDialog({ userId, currentRole, userName, children }: EditRoleDialogProps) {
   const [open, setOpen] = React.useState(false)
-  const [role, setRole] = React.useState(currentRole)
   const [isPending, startTransition] = React.useTransition()
   const queryClient = useQueryClient()
+  const form = useForm<EditRoleFormValues>({
+    defaultValues: {
+      role: currentRole as UserRole
+    }
+  })
+
+  React.useEffect(() => {
+    form.reset({ role: currentRole as UserRole })
+  }, [currentRole, form])
 
-  const handleSave = () => {
+  const handleSave = (values: EditRoleFormValues) => {
     startTransition(async () => {
       try {
-        const result = await updateUserRole(userId, role as UserRole)
+        const result = await updateUserRole(userId, values.role)
         if (result.success) {
           toast.success(`Role updated for ${userName}`)
           queryClient.refetchQueries({ queryKey: ['users'] })
+          form.reset(values)
           setOpen(false)
         } else {
           toast.error(result.error || 'Failed to update role')
@@ -54,41 +69,69 @@ export function EditRoleDialog({ userId, currentRole, userName, children }: Edit
     })
   }
 
+  function handleOpenChange(nextOpen: boolean) {
+    setOpen(nextOpen)
+
+    if (!nextOpen) {
+      form.reset({ role: currentRole as UserRole })
+    }
+  }
+
   return (
-    <Dialog open={open} onOpenChange={setOpen}>
+    <Dialog open={open} onOpenChange={handleOpenChange}>
       <DialogTrigger render={children as React.ReactElement} />
       <DialogContent className="sm:max-w-87.5">
-        <DialogHeader>
-          <DialogTitle>Edit Role</DialogTitle>
-          <DialogDescription>Change the role for {userName}</DialogDescription>
-        </DialogHeader>
+        <Form {...form}>
+          <form autoComplete="off" onSubmit={form.handleSubmit(handleSave)}>
+            <DialogHeader>
+              <DialogTitle>Edit Role</DialogTitle>
+              <DialogDescription>Change the role for {userName}</DialogDescription>
+            </DialogHeader>
 
-        <div className="p-2">
-          <Select value={role} onValueChange={setRole}>
-            <SelectTrigger className="w-full">
-              <SelectValue />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem value={UserRole.ADMIN}>Admin</SelectItem>
-              <SelectItem value={UserRole.EDITOR}>Editor</SelectItem>
-              <SelectItem value={UserRole.MEMBER}>Member</SelectItem>
-            </SelectContent>
-          </Select>
-        </div>
+            <div className="p-2">
+              <FormField
+                control={form.control}
+                name="role"
+                render={({ field }) => (
+                  <FormItem>
+                    <Select value={field.value} onValueChange={field.onChange} disabled={isPending}>
+                      <FormControl>
+                        <SelectTrigger className="w-full">
+                          <SelectValue />
+                        </SelectTrigger>
+                      </FormControl>
+                      <SelectContent>
+                        <SelectItem value={UserRole.ADMIN}>Admin</SelectItem>
+                        <SelectItem value={UserRole.EDITOR}>Editor</SelectItem>
+                        <SelectItem value={UserRole.MEMBER}>Member</SelectItem>
+                      </SelectContent>
+                    </Select>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+            </div>
 
-        <DialogFooter>
-          <Button variant="outline" onClick={() => setOpen(false)} disabled={isPending}>
-            Cancel
-          </Button>
-          <Button
-            onClick={handleSave}
-            disabled={isPending || role === currentRole}
-            aria-busy={isPending}
-          >
-            {isPending && <Spinner />}
-            {isPending ? 'Saving Role…' : 'Save Role'}
-          </Button>
-        </DialogFooter>
+            <DialogFooter>
+              <Button
+                type="button"
+                variant="outline"
+                onClick={() => setOpen(false)}
+                disabled={isPending}
+              >
+                Cancel
+              </Button>
+              <Button
+                type="submit"
+                disabled={isPending || !form.formState.isDirty}
+                aria-busy={isPending}
+              >
+                {isPending && <Spinner />}
+                {isPending ? 'Saving Role…' : 'Save Role'}
+              </Button>
+            </DialogFooter>
+          </form>
+        </Form>
       </DialogContent>
     </Dialog>
   )

package/dist/assets/shared-assets/react-admin/custom/content-editor/main-toolbar-content.tsx

@@ -49,7 +49,7 @@ export function MainToolbarContent({
           <UndoRedoButton action="redo" />
         </div>
 
-        <Separator orientation="vertical" decorative className="mx-1 my-auto h-[65%] self-center" />
+        <Separator orientation="vertical" className="mx-1 my-auto h-[65%] self-center" />
 
         <div className="flex items-center gap-0.5">
           <HeadingDropdownMenu />
@@ -59,7 +59,7 @@ export function MainToolbarContent({
           <HorizontalRuleButton editor={editor} />
         </div>
 
-        <Separator orientation="vertical" decorative className="mx-1 my-auto h-[65%] self-center" />
+        <Separator orientation="vertical" className="mx-1 my-auto h-[65%] self-center" />
 
         <div className="flex items-center gap-0.5">
           <MarkButton type="bold" />
@@ -75,7 +75,7 @@ export function MainToolbarContent({
           {!isMobile ? <LinkPopover /> : <LinkButton onClick={onLinkClick} />}
         </div>
 
-        <Separator orientation="vertical" decorative className="mx-1 my-auto h-[65%] self-center" />
+        <Separator orientation="vertical" className="mx-1 my-auto h-[65%] self-center" />
 
         <div className="flex items-center">
           <TableButton editor={editor} />

package/dist/assets/shared-assets/react-admin/custom/content-editor/mobile-toolbar-content.tsx

@@ -38,7 +38,7 @@ export function MobileToolbarContent({
         </Button>
       </div>
 
-      <Separator orientation="vertical" decorative className="mx-1 my-auto h-[65%] self-center" />
+      <Separator orientation="vertical" className="mx-1 my-auto h-[65%] self-center" />
 
       {type === 'highlighter' ? (
         <ColorHighlightPopoverContent />

package/dist/assets/shared-assets/react-admin/custom/content-editor/selection-bubble-menu.tsx

@@ -117,11 +117,7 @@ export function SelectionBubbleMenu({ editor }: { editor: Editor }) {
             />
           </div>
 
-          <Separator
-            orientation="vertical"
-            decorative
-            className="mx-1 my-auto h-[65%] self-center"
-          />
+          <Separator orientation="vertical" className="mx-1 my-auto h-[65%] self-center" />
 
           <div className="flex items-center gap-0.5">
             <MarkButton editor={editor} type="bold" />

package/dist/assets/shared-assets/react-admin/custom/content-editor/source-mode.tsx

@@ -152,11 +152,7 @@ export function SourceMode({
             </Button>
           </div>
 
-          <Separator
-            orientation="vertical"
-            decorative
-            className="mx-1 my-auto h-[65%] self-center"
-          />
+          <Separator orientation="vertical" className="mx-1 my-auto h-[65%] self-center" />
 
           <div className="flex items-center gap-0.5">
             <SourceModeDropdownButton
@@ -234,11 +230,7 @@ export function SourceMode({
             </Button>
           </div>
 
-          <Separator
-            orientation="vertical"
-            decorative
-            className="mx-1 my-auto h-[65%] self-center"
-          />
+          <Separator orientation="vertical" className="mx-1 my-auto h-[65%] self-center" />
 
           <div className="flex items-center gap-0.5">
             {[
@@ -300,11 +292,7 @@ export function SourceMode({
             />
           </div>
 
-          <Separator
-            orientation="vertical"
-            decorative
-            className="mx-1 my-auto h-[65%] self-center"
-          />
+          <Separator orientation="vertical" className="mx-1 my-auto h-[65%] self-center" />
 
           <div className="flex items-center">
             <TableButton disabled={disabled} onInsertTable={insertTable} />

package/dist/assets/shared-assets/react-admin/custom/content-editor/table-bubble-menu.tsx

@@ -230,7 +230,6 @@ export function TableBubbleMenu({ editor }: { editor: Editor }) {
           </div>
           <Separator
             orientation="vertical"
-            decorative
             className="mx-1 my-auto h-5 w-px self-center bg-border opacity-100"
           />
           <div className="flex items-center gap-0.5">

package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/blockquote-button/blockquote-button.tsx

@@ -2,6 +2,7 @@
 
 import type { ControlAvailability, ControlShortcut, ControlTooltip } from '../control-options'
 import type { UseBlockquoteConfig } from '@admin/hooks/content-editor/use-blockquote'
+import type { BaseUIEvent } from '@base-ui/react'
 import { Button } from '@admin/components/ui/button'
 import { useBlockquote } from '@admin/hooks/content-editor/use-blockquote'
 import { useTiptapEditor } from '@admin/hooks/content-editor/use-tiptap-editor'
@@ -48,7 +49,7 @@ export function BlockquoteButton({
   )
 
   const handleClick = useCallback(
-    (event: React.MouseEvent<HTMLButtonElement>) => {
+    (event: BaseUIEvent<React.MouseEvent<HTMLButtonElement>>) => {
       onClick?.(event)
       if (event.defaultPrevented) return
       handleToggle()

package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/code-block-button/code-block-button.tsx

@@ -2,6 +2,7 @@
 
 import type { ControlAvailability, ControlShortcut, ControlTooltip } from '../control-options'
 import type { UseCodeBlockConfig } from '@admin/hooks/content-editor/use-code-block'
+import type { BaseUIEvent } from '@base-ui/react'
 import { Button } from '@admin/components/ui/button'
 import { useCodeBlock } from '@admin/hooks/content-editor/use-code-block'
 import { useTiptapEditor } from '@admin/hooks/content-editor/use-tiptap-editor'
@@ -46,7 +47,7 @@ export function CodeBlockButton({
   })
 
   const handleClick = useCallback(
-    (event: React.MouseEvent<HTMLButtonElement>) => {
+    (event: BaseUIEvent<React.MouseEvent<HTMLButtonElement>>) => {
       onClick?.(event)
       if (event.defaultPrevented) return
       handleToggle()

package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/color-highlight-button/color-highlight-button.tsx

@@ -2,6 +2,7 @@
 
 import type { ControlAvailability, ControlShortcut, ControlTooltip } from '../control-options'
 import type { UseColorHighlightConfig } from '@admin/hooks/content-editor/use-color-highlight'
+import type { BaseUIEvent } from '@base-ui/react'
 import { Button } from '@admin/components/ui/button'
 import { useColorHighlight } from '@admin/hooks/content-editor/use-color-highlight'
 import { useTiptapEditor } from '@admin/hooks/content-editor/use-tiptap-editor'
@@ -59,7 +60,7 @@ export function ColorHighlightButton({
     })
 
   const handleClick = useCallback(
-    (event: React.MouseEvent<HTMLButtonElement>) => {
+    (event: BaseUIEvent<React.MouseEvent<HTMLButtonElement>>) => {
       onClick?.(event)
       if (event.defaultPrevented) return
       handleColorHighlight()

package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/heading-dropdown-menu/heading-dropdown-menu.tsx

@@ -96,7 +96,7 @@ export function HeadingDropdownMenu({
       <DropdownMenuContent
         align="start"
         className="w-auto min-w-40"
-        onCloseAutoFocus={(event) => event.preventDefault()}
+        finalFocus={false}
         portalled={false}
       >
         <DropdownMenuGroup>

package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/link-popover/link-control-popover.tsx

@@ -3,6 +3,7 @@
 import type * as React from 'react'
 import type { LinkButtonProps } from './link-button'
 import type { LinkMainProps } from './link-main'
+import type { BaseUIEvent } from '@base-ui/react'
 import { Popover, PopoverContent, PopoverTrigger } from '@admin/components/ui/popover'
 import { LinkIcon } from 'lucide-react'
 import { useCallback, useState } from 'react'
@@ -52,7 +53,7 @@ export function LinkControlPopover({
   }, [handleOnOpenChange, setLink])
 
   const handleClick = useCallback(
-    (event: React.MouseEvent<HTMLButtonElement>) => {
+    (event: BaseUIEvent<React.MouseEvent<HTMLButtonElement>>) => {
       onClick?.(event)
       if (event.defaultPrevented) return
       handleOnOpenChange(!isOpen)

package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/list-dropdown-menu/list-dropdown-menu.tsx

@@ -86,7 +86,7 @@ export function ListDropdownMenu({
       <DropdownMenuContent
         align="start"
         className="w-auto min-w-40"
-        onCloseAutoFocus={(event) => event.preventDefault()}
+        finalFocus={false}
         portalled={false}
       >
         <DropdownMenuGroup>

package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/mark-button/mark-button.tsx

@@ -2,6 +2,7 @@
 
 import type { ControlAvailability, ControlShortcut, ControlTooltip } from '../control-options'
 import type { UseMarkConfig } from '@admin/hooks/content-editor/use-mark'
+import type { BaseUIEvent } from '@base-ui/react'
 import { Button } from '@admin/components/ui/button'
 import { useMark } from '@admin/hooks/content-editor/use-mark'
 import { useTiptapEditor } from '@admin/hooks/content-editor/use-tiptap-editor'
@@ -48,7 +49,7 @@ export function MarkButton({
   })
 
   const handleClick = useCallback(
-    (event: React.MouseEvent<HTMLButtonElement>) => {
+    (event: BaseUIEvent<React.MouseEvent<HTMLButtonElement>>) => {
       onClick?.(event)
       if (event.defaultPrevented) return
       handleMark()

package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/undo-redo-button/undo-redo-button.tsx

@@ -2,6 +2,7 @@
 
 import type { ControlAvailability, ControlShortcut, ControlTooltip } from '../control-options'
 import type { UseUndoRedoConfig } from '@admin/hooks/content-editor/use-undo-redo'
+import type { BaseUIEvent } from '@base-ui/react'
 import { Button } from '@admin/components/ui/button'
 import { useTiptapEditor } from '@admin/hooks/content-editor/use-tiptap-editor'
 import { useUndoRedo } from '@admin/hooks/content-editor/use-undo-redo'
@@ -48,7 +49,7 @@ export function UndoRedoButton({
   })
 
   const handleClick = useCallback(
-    (event: React.MouseEvent<HTMLButtonElement>) => {
+    (event: BaseUIEvent<React.MouseEvent<HTMLButtonElement>>) => {
       onClick?.(event)
       if (event.defaultPrevented) return
       handleAction()

package/dist/assets/shared-assets/react-admin/ui/avatar.tsx

@@ -16,7 +16,7 @@ function Avatar({
       data-slot="avatar"
       data-size={size}
       className={cn(
-        'group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten',
+        'group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6',
         className
       )}
       {...props}

package/dist/assets/shared-assets/react-admin/ui/badge.tsx

@@ -5,17 +5,19 @@ import { useRender } from '@base-ui/react/use-render'
 import { cva } from 'class-variance-authority'
 
 const badgeVariants = cva(
-  'group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3!',
+  'group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 [&>svg]:pointer-events-none [&>svg]:size-3!',
   {
     variants: {
       variant: {
         default: 'bg-primary text-primary-foreground [a]:hover:bg-primary/80',
         secondary: 'bg-secondary text-secondary-foreground [a]:hover:bg-secondary/80',
         destructive:
-          'bg-destructive/10 text-destructive focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:focus-visible:ring-destructive/40 [a]:hover:bg-destructive/20',
+          'bg-destructive/10 text-destructive focus-visible:ring-destructive/20 [a]:hover:bg-destructive/20',
+        success:
+          'bg-emerald-500/10 text-emerald-700 focus-visible:ring-emerald-500/20 [a]:hover:bg-emerald-500/20',
         outline:
           'border-border bg-input/30 text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground',
-        ghost: 'hover:bg-muted hover:text-muted-foreground dark:hover:bg-muted/50',
+        ghost: 'hover:bg-muted hover:text-muted-foreground',
         link: 'text-primary underline-offset-4 hover:underline'
       }
     },

package/dist/assets/shared-assets/react-admin/ui/button.tsx

@@ -4,7 +4,7 @@ import { Button as ButtonPrimitive } from '@base-ui/react/button'
 import { cva } from 'class-variance-authority'
 
 const buttonVariants = cva(
-  "group/button inline-flex shrink-0 items-center justify-center rounded-4xl border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+  "group/button inline-flex shrink-0 items-center justify-center rounded-4xl border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-[3px] aria-invalid:ring-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
   {
     variants: {
       variant: {
@@ -14,11 +14,11 @@ const buttonVariants = cva(
         secondary:
           'bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground',
         ghost:
-          'hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50',
+          'hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground',
         destructive:
-          'bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40',
+          'bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20',
         warning:
-          'border-warning/20 bg-warning/10 text-warning hover:bg-warning/15 focus-visible:border-warning/40 focus-visible:ring-warning/15 dark:bg-warning/20 dark:hover:bg-warning/30 dark:focus-visible:ring-warning/40 [&_svg]:text-warning',
+          'border-warning/20 bg-warning/10 text-warning hover:bg-warning/15 focus-visible:border-warning/40 focus-visible:ring-warning/15 [&_svg]:text-warning',
         link: 'text-primary underline-offset-4 hover:underline'
       },
       size: {

package/dist/assets/shared-assets/react-admin/ui/calendar.tsx

@@ -176,7 +176,7 @@ function CalendarDayButton({
       data-range-end={modifiers.range_end}
       data-range-middle={modifiers.range_middle}
       className={cn(
-        'relative isolate z-10 flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 border-0 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-[3px] group-data-[focused=true]/day:ring-ring/50 data-[range-end=true]:rounded-(--cell-radius) data-[range-end=true]:rounded-r-(--cell-radius) data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground data-[range-middle=true]:rounded-none data-[range-middle=true]:bg-muted data-[range-middle=true]:text-foreground data-[range-start=true]:rounded-(--cell-radius) data-[range-start=true]:rounded-l-(--cell-radius) data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground dark:hover:text-foreground [&>span]:text-xs [&>span]:opacity-70',
+        'relative isolate z-10 flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 border-0 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-[3px] group-data-[focused=true]/day:ring-ring/50 data-[range-end=true]:rounded-(--cell-radius) data-[range-end=true]:rounded-r-(--cell-radius) data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground data-[range-middle=true]:rounded-none data-[range-middle=true]:bg-muted data-[range-middle=true]:text-foreground data-[range-start=true]:rounded-(--cell-radius) data-[range-start=true]:rounded-l-(--cell-radius) data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground [&>span]:text-xs [&>span]:opacity-70',
         defaultClassNames.day,
         className
       )}