betterstart-cli 0.0.105 → 0.0.107

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (117) hide show
  1. package/dist/assets/adapters/next/templates/init/components/layouts/admin-nav-link.tsx +10 -8
  2. package/dist/assets/adapters/next/templates/init/components/layouts/admin-sidebar-nav-link-skeleton.tsx +1 -5
  3. package/dist/assets/adapters/next/templates/init/components/layouts/admin-sidebar-user-menu.tsx +54 -48
  4. package/dist/assets/adapters/next/templates/init/components/layouts/admin-sign-out.tsx +2 -2
  5. package/dist/assets/adapters/next/templates/init/components/shared/data-table/data-grid-body.tsx +20 -0
  6. package/dist/assets/adapters/next/templates/init/components/shared/data-table/data-grid-cell.tsx +20 -0
  7. package/dist/assets/adapters/next/templates/init/components/shared/data-table/data-grid-head.tsx +21 -0
  8. package/dist/assets/adapters/next/templates/init/components/shared/data-table/data-grid-header.tsx +20 -0
  9. package/dist/assets/adapters/next/templates/init/components/shared/data-table/data-grid-row.tsx +22 -0
  10. package/dist/assets/adapters/next/templates/init/components/shared/data-table/data-grid.tsx +7 -81
  11. package/dist/assets/adapters/next/templates/init/components/shared/delete-dialog.tsx +3 -5
  12. package/dist/assets/adapters/next/templates/init/components/shared/dev-mode/lifecycle-hooks-tab.tsx +1 -1
  13. package/dist/assets/adapters/next/templates/init/components/shared/dev-mode/snippets-tab.tsx +1 -1
  14. package/dist/assets/adapters/next/templates/init/components/shared/dev-mode-integrate.tsx +5 -7
  15. package/dist/assets/adapters/next/templates/init/components/shared/entity-filters-bar.tsx +9 -10
  16. package/dist/assets/adapters/next/templates/init/components/shared/entity-versions/entity-version-item.tsx +2 -4
  17. package/dist/assets/adapters/next/templates/init/components/shared/entity-versions/entity-version-restore-dialog.tsx +2 -4
  18. package/dist/assets/adapters/next/templates/init/components/shared/entity-versions/entity-versions-current-row.tsx +2 -4
  19. package/dist/assets/adapters/next/templates/init/components/shared/entity-versions/entity-versions-drawer.tsx +1 -1
  20. package/dist/assets/adapters/next/templates/init/components/shared/media/edit-media-dialog.tsx +2 -2
  21. package/dist/assets/adapters/next/templates/init/components/shared/media/media-delete-dialog.tsx +5 -5
  22. package/dist/assets/adapters/next/templates/init/components/shared/media/media-delete-drawer.tsx +52 -53
  23. package/dist/assets/adapters/next/templates/init/components/shared/sort-order-dialog.tsx +3 -5
  24. package/dist/assets/adapters/next/templates/init/pages/dashboard-page.tsx +1 -1
  25. package/dist/assets/adapters/next/templates/init/pages/settings/audit-log/audit-log-detail-drawer.tsx +1 -1
  26. package/dist/assets/adapters/next/templates/init/pages/settings/forms/form-notifications-drawer.tsx +5 -5
  27. package/dist/assets/adapters/next/templates/init/pages/settings/webhooks/webhook-actions.tsx +20 -20
  28. package/dist/assets/adapters/next/templates/init/pages/users/change-password-dialog.tsx +7 -5
  29. package/dist/assets/adapters/next/templates/init/pages/users/columns.tsx +3 -5
  30. package/dist/assets/adapters/next/templates/init/pages/users/create-user-dialog.tsx +1 -3
  31. package/dist/assets/adapters/next/templates/init/pages/users/delete-user-dialog.tsx +11 -5
  32. package/dist/assets/adapters/next/templates/init/pages/users/edit-role-dialog.tsx +1 -1
  33. package/dist/assets/shared-assets/react-admin/custom/content-editor/math-popover-button.tsx +13 -11
  34. package/dist/assets/shared-assets/react-admin/custom/content-editor/source-mode-dropdown-button.tsx +16 -14
  35. package/dist/assets/shared-assets/react-admin/custom/content-editor/source-mode.tsx +2 -2
  36. package/dist/assets/shared-assets/react-admin/custom/content-editor/table-button.tsx +14 -12
  37. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/blockquote-button/blockquote-button.tsx +4 -11
  38. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/blockquote-button/blockquote-shortcut-badge.tsx +15 -0
  39. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/code-block-button/code-block-button.tsx +4 -11
  40. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/code-block-button/code-block-shortcut-badge.tsx +15 -0
  41. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/color-highlight-button/color-highlight-button.tsx +6 -42
  42. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/color-highlight-button/color-highlight-shortcut-badge.tsx +15 -0
  43. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/color-highlight-button/highlight-swatch.tsx +34 -0
  44. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/color-highlight-popover/color-highlight-popover.tsx +16 -14
  45. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/color-highlight-popover/source-color-highlight-popover.tsx +15 -13
  46. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/heading-dropdown-menu/heading-dropdown-menu-item.tsx +1 -1
  47. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/heading-dropdown-menu/heading-dropdown-menu.tsx +31 -29
  48. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/link-popover/link-control-popover.tsx +15 -13
  49. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/list-dropdown-menu/list-dropdown-menu-item.tsx +1 -1
  50. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/list-dropdown-menu/list-dropdown-menu.tsx +22 -20
  51. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/mark-button/mark-button.tsx +5 -14
  52. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/mark-button/mark-shortcut-badge.tsx +18 -0
  53. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/undo-redo-button/history-shortcut-badge.tsx +18 -0
  54. package/dist/assets/shared-assets/react-admin/custom/content-editor/tiptap-ui/undo-redo-button/undo-redo-button.tsx +5 -14
  55. package/dist/assets/shared-assets/react-admin/custom/date-picker.tsx +16 -14
  56. package/dist/assets/shared-assets/react-admin/custom/date-range-picker.tsx +8 -6
  57. package/dist/assets/shared-assets/react-admin/custom/icon-picker/memoized-icon.tsx +10 -0
  58. package/dist/assets/shared-assets/react-admin/custom/icon-picker.tsx +9 -10
  59. package/dist/assets/shared-assets/react-admin/custom/nested-object-list-field.tsx +2 -4
  60. package/dist/assets/shared-assets/react-admin/ui/accordion.tsx +11 -28
  61. package/dist/assets/shared-assets/react-admin/ui/alert-dialog.tsx +30 -47
  62. package/dist/assets/shared-assets/react-admin/ui/alert.tsx +4 -4
  63. package/dist/assets/shared-assets/react-admin/ui/aspect-ratio.tsx +18 -5
  64. package/dist/assets/shared-assets/react-admin/ui/avatar.tsx +10 -13
  65. package/dist/assets/shared-assets/react-admin/ui/badge.tsx +21 -20
  66. package/dist/assets/shared-assets/react-admin/ui/breadcrumb.tsx +20 -19
  67. package/dist/assets/shared-assets/react-admin/ui/button-group.tsx +25 -24
  68. package/dist/assets/shared-assets/react-admin/ui/button.tsx +22 -31
  69. package/dist/assets/shared-assets/react-admin/ui/calendar.tsx +9 -6
  70. package/dist/assets/shared-assets/react-admin/ui/card.tsx +6 -16
  71. package/dist/assets/shared-assets/react-admin/ui/carousel.tsx +20 -17
  72. package/dist/assets/shared-assets/react-admin/ui/chart.tsx +19 -16
  73. package/dist/assets/shared-assets/react-admin/ui/checkbox.tsx +3 -4
  74. package/dist/assets/shared-assets/react-admin/ui/collapsible.tsx +6 -10
  75. package/dist/assets/shared-assets/react-admin/ui/combobox.tsx +10 -36
  76. package/dist/assets/shared-assets/react-admin/ui/command.tsx +7 -6
  77. package/dist/assets/shared-assets/react-admin/ui/context-menu.tsx +77 -79
  78. package/dist/assets/shared-assets/react-admin/ui/dialog.tsx +29 -54
  79. package/dist/assets/shared-assets/react-admin/ui/direction.tsx +1 -18
  80. package/dist/assets/shared-assets/react-admin/ui/drawer.tsx +121 -49
  81. package/dist/assets/shared-assets/react-admin/ui/dropdown-menu.tsx +117 -131
  82. package/dist/assets/shared-assets/react-admin/ui/empty.tsx +3 -3
  83. package/dist/assets/shared-assets/react-admin/ui/field.tsx +20 -30
  84. package/dist/assets/shared-assets/react-admin/ui/form.tsx +27 -31
  85. package/dist/assets/shared-assets/react-admin/ui/hover-card.tsx +26 -18
  86. package/dist/assets/shared-assets/react-admin/ui/input-group.tsx +25 -12
  87. package/dist/assets/shared-assets/react-admin/ui/input-otp.tsx +3 -3
  88. package/dist/assets/shared-assets/react-admin/ui/input.tsx +4 -3
  89. package/dist/assets/shared-assets/react-admin/ui/item.tsx +26 -19
  90. package/dist/assets/shared-assets/react-admin/ui/label.tsx +18 -14
  91. package/dist/assets/shared-assets/react-admin/ui/menubar.tsx +80 -73
  92. package/dist/assets/shared-assets/react-admin/ui/native-select.tsx +3 -3
  93. package/dist/assets/shared-assets/react-admin/ui/navigation-menu.tsx +40 -39
  94. package/dist/assets/shared-assets/react-admin/ui/pagination.tsx +18 -11
  95. package/dist/assets/shared-assets/react-admin/ui/popover.tsx +31 -30
  96. package/dist/assets/shared-assets/react-admin/ui/progress.tsx +51 -16
  97. package/dist/assets/shared-assets/react-admin/ui/radio-group.tsx +11 -17
  98. package/dist/assets/shared-assets/react-admin/ui/resizable.tsx +1 -1
  99. package/dist/assets/shared-assets/react-admin/ui/scroll-area.tsx +9 -13
  100. package/dist/assets/shared-assets/react-admin/ui/select.tsx +66 -60
  101. package/dist/assets/shared-assets/react-admin/ui/separator.tsx +3 -10
  102. package/dist/assets/shared-assets/react-admin/ui/sheet.tsx +22 -27
  103. package/dist/assets/shared-assets/react-admin/ui/sidebar.tsx +144 -126
  104. package/dist/assets/shared-assets/react-admin/ui/skeleton.tsx +1 -1
  105. package/dist/assets/shared-assets/react-admin/ui/slider.tsx +27 -29
  106. package/dist/assets/shared-assets/react-admin/ui/sonner.tsx +8 -3
  107. package/dist/assets/shared-assets/react-admin/ui/spinner.tsx +4 -3
  108. package/dist/assets/shared-assets/react-admin/ui/switch.tsx +4 -5
  109. package/dist/assets/shared-assets/react-admin/ui/table.tsx +8 -21
  110. package/dist/assets/shared-assets/react-admin/ui/tabs.tsx +11 -16
  111. package/dist/assets/shared-assets/react-admin/ui/textarea.tsx +2 -2
  112. package/dist/assets/shared-assets/react-admin/ui/toggle-group.tsx +12 -11
  113. package/dist/assets/shared-assets/react-admin/ui/toggle.tsx +4 -5
  114. package/dist/assets/shared-assets/react-admin/ui/tooltip.tsx +29 -27
  115. package/dist/cli.js +145 -111
  116. package/dist/cli.js.map +1 -1
  117. package/package.json +1 -1
@@ -1,8 +1,5 @@
1
- 'use client'
2
-
3
- import * as React from 'react'
4
1
  import { cn } from '@admin/utils/shared/cn'
5
- import { Slider as SliderPrimitive } from 'radix-ui'
2
+ import { Slider as SliderPrimitive } from '@base-ui/react/slider'
6
3
 
7
4
  function Slider({
8
5
  className,
@@ -11,41 +8,42 @@ function Slider({
11
8
  min = 0,
12
9
  max = 100,
13
10
  ...props
14
- }: React.ComponentProps<typeof SliderPrimitive.Root>) {
15
- const _values = React.useMemo(
16
- () => (Array.isArray(value) ? value : Array.isArray(defaultValue) ? defaultValue : [min, max]),
17
- [value, defaultValue, min, max]
18
- )
11
+ }: SliderPrimitive.Root.Props) {
12
+ const _values = Array.isArray(value)
13
+ ? value
14
+ : Array.isArray(defaultValue)
15
+ ? defaultValue
16
+ : [min, max]
19
17
 
20
18
  return (
21
19
  <SliderPrimitive.Root
20
+ className={cn('data-horizontal:w-full data-vertical:h-full', className)}
22
21
  data-slot="slider"
23
22
  defaultValue={defaultValue}
24
23
  value={value}
25
24
  min={min}
26
25
  max={max}
27
- className={cn(
28
- 'relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-vertical:h-full data-vertical:min-h-40 data-vertical:w-auto data-vertical:flex-col',
29
- className
30
- )}
26
+ thumbAlignment="edge"
31
27
  {...props}
32
28
  >
33
- <SliderPrimitive.Track
34
- data-slot="slider-track"
35
- className="relative grow overflow-hidden rounded-sm bg-muted data-horizontal:h-3 data-horizontal:w-full data-vertical:h-full data-vertical:w-3"
36
- >
37
- <SliderPrimitive.Range
38
- data-slot="slider-range"
39
- className="absolute bg-primary select-none data-horizontal:h-full data-vertical:w-full"
40
- />
41
- </SliderPrimitive.Track>
42
- {_values.map((sliderValue) => (
43
- <SliderPrimitive.Thumb
44
- data-slot="slider-thumb"
45
- key={sliderValue}
46
- className="block size-4 shrink-0 rounded-sm border border-primary bg-white shadow-sm ring-ring/50 transition-colors select-none hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50"
47
- />
48
- ))}
29
+ <SliderPrimitive.Control className="relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-vertical:h-full data-vertical:min-h-40 data-vertical:w-auto data-vertical:flex-col">
30
+ <SliderPrimitive.Track
31
+ data-slot="slider-track"
32
+ className="relative grow overflow-hidden rounded-4xl bg-muted select-none data-horizontal:h-3 data-horizontal:w-full data-vertical:h-full data-vertical:w-3"
33
+ >
34
+ <SliderPrimitive.Indicator
35
+ data-slot="slider-range"
36
+ className="bg-primary select-none data-horizontal:h-full data-vertical:w-full"
37
+ />
38
+ </SliderPrimitive.Track>
39
+ {Array.from({ length: _values.length }, (_, index) => (
40
+ <SliderPrimitive.Thumb
41
+ data-slot="slider-thumb"
42
+ key={index}
43
+ className="block size-4 shrink-0 rounded-4xl border border-primary bg-white shadow-sm ring-ring/50 transition-colors select-none hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50"
44
+ />
45
+ ))}
46
+ </SliderPrimitive.Control>
49
47
  </SliderPrimitive.Root>
50
48
  )
51
49
  }
@@ -1,8 +1,13 @@
1
1
  'use client'
2
2
 
3
3
  import type { ToasterProps } from 'sonner'
4
- import { Spinner } from '@admin/components/ui/spinner'
5
- import { CircleCheckIcon, InfoIcon, OctagonXIcon, TriangleAlertIcon } from 'lucide-react'
4
+ import {
5
+ CircleCheckIcon,
6
+ InfoIcon,
7
+ Loader2Icon,
8
+ OctagonXIcon,
9
+ TriangleAlertIcon
10
+ } from 'lucide-react'
6
11
  import { useTheme } from 'next-themes'
7
12
  import { Toaster as Sonner } from 'sonner'
8
13
 
@@ -18,7 +23,7 @@ const Toaster = ({ ...props }: ToasterProps) => {
18
23
  info: <InfoIcon className="size-4" />,
19
24
  warning: <TriangleAlertIcon className="size-4" />,
20
25
  error: <OctagonXIcon className="size-4" />,
21
- loading: <Spinner className="size-4" />
26
+ loading: <Loader2Icon className="size-4 animate-spin" />
22
27
  }}
23
28
  style={
24
29
  {
@@ -1,12 +1,13 @@
1
1
  import { cn } from '@admin/utils/shared/cn'
2
- import { LoaderCircle } from 'lucide-react'
2
+ import { Loader2Icon } from 'lucide-react'
3
3
 
4
4
  function Spinner({ className, ...props }: React.ComponentProps<'svg'>) {
5
5
  return (
6
- <LoaderCircle
6
+ <Loader2Icon
7
+ data-slot="spinner"
7
8
  role="status"
8
9
  aria-label="Loading"
9
- className={cn('animate-spin', className)}
10
+ className={cn('size-4 animate-spin', className)}
10
11
  {...props}
11
12
  />
12
13
  )
@@ -1,14 +1,13 @@
1
1
  'use client'
2
2
 
3
- import type * as React from 'react'
4
3
  import { cn } from '@admin/utils/shared/cn'
5
- import { Switch as SwitchPrimitive } from 'radix-ui'
4
+ import { Switch as SwitchPrimitive } from '@base-ui/react/switch'
6
5
 
7
6
  function Switch({
8
7
  className,
9
8
  size = 'default',
10
9
  ...props
11
- }: React.ComponentProps<typeof SwitchPrimitive.Root> & {
10
+ }: SwitchPrimitive.Root.Props & {
12
11
  size?: 'sm' | 'default'
13
12
  }) {
14
13
  return (
@@ -16,14 +15,14 @@ function Switch({
16
15
  data-slot="switch"
17
16
  data-size={size}
18
17
  className={cn(
19
- 'peer group/switch relative inline-flex shrink-0 items-center rounded-sm border border-transparent transition-all outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-[3px] aria-invalid:ring-destructive/20 data-[size=default]:h-[18.4px] data-[size=default]:w-[32px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px] dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:bg-primary data-unchecked:bg-input dark:data-unchecked:bg-input/80 data-disabled:cursor-not-allowed data-disabled:opacity-50',
18
+ 'peer group/switch relative inline-flex shrink-0 items-center rounded-full border border-transparent transition-all outline-none after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-[3px] aria-invalid:ring-destructive/20 data-[size=default]:h-[18.4px] data-[size=default]:w-[32px] data-[size=sm]:h-[14px] data-[size=sm]:w-[24px] dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:bg-primary data-unchecked:bg-input dark:data-unchecked:bg-input/80 data-disabled:cursor-not-allowed data-disabled:opacity-50',
20
19
  className
21
20
  )}
22
21
  {...props}
23
22
  >
24
23
  <SwitchPrimitive.Thumb
25
24
  data-slot="switch-thumb"
26
- className="pointer-events-none block rounded-sm bg-background ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 group-data-[size=default]/switch:data-checked:translate-x-[calc(100%-2px)] group-data-[size=sm]/switch:data-checked:translate-x-[calc(100%-2px)] dark:data-checked:bg-primary-foreground group-data-[size=default]/switch:data-unchecked:translate-x-0 group-data-[size=sm]/switch:data-unchecked:translate-x-0 dark:data-unchecked:bg-foreground"
25
+ className="pointer-events-none block rounded-full bg-background ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 group-data-[size=default]/switch:data-checked:translate-x-[calc(100%-2px)] group-data-[size=sm]/switch:data-checked:translate-x-[calc(100%-2px)] dark:data-checked:bg-primary-foreground group-data-[size=default]/switch:data-unchecked:translate-x-0 group-data-[size=sm]/switch:data-unchecked:translate-x-0 dark:data-unchecked:bg-foreground"
27
26
  />
28
27
  </SwitchPrimitive.Root>
29
28
  )
@@ -1,15 +1,11 @@
1
1
  'use client'
2
2
 
3
- import type * as React from 'react'
3
+ import * as React from 'react'
4
4
  import { cn } from '@admin/utils/shared/cn'
5
5
 
6
- type TableProps = React.ComponentProps<'table'> & {
7
- containerClassName?: string
8
- }
9
-
10
- function Table({ className, containerClassName, ...props }: TableProps) {
6
+ function Table({ className, ...props }: React.ComponentProps<'table'>) {
11
7
  return (
12
- <div data-slot="table-container" className={cn('relative w-full', containerClassName)}>
8
+ <div data-slot="table-container" className="relative w-full overflow-x-auto">
13
9
  <table
14
10
  data-slot="table"
15
11
  className={cn('w-full caption-bottom text-sm', className)}
@@ -20,20 +16,14 @@ function Table({ className, containerClassName, ...props }: TableProps) {
20
16
  }
21
17
 
22
18
  function TableHeader({ className, ...props }: React.ComponentProps<'thead'>) {
23
- return (
24
- <thead
25
- data-slot="table-header"
26
- className={cn('bg-background [&_tr]:border-b', className)}
27
- {...props}
28
- />
29
- )
19
+ return <thead data-slot="table-header" className={cn('[&_tr]:border-b', className)} {...props} />
30
20
  }
31
21
 
32
22
  function TableBody({ className, ...props }: React.ComponentProps<'tbody'>) {
33
23
  return (
34
24
  <tbody
35
25
  data-slot="table-body"
36
- className={cn('[&>tr:hover]:bg-muted/50', className)}
26
+ className={cn('[&_tr:last-child]:border-0', className)}
37
27
  {...props}
38
28
  />
39
29
  )
@@ -54,7 +44,7 @@ function TableRow({ className, ...props }: React.ComponentProps<'tr'>) {
54
44
  <tr
55
45
  data-slot="table-row"
56
46
  className={cn(
57
- 'border-b transition-colors has-aria-expanded:bg-muted/50 data-[state=selected]:bg-muted',
47
+ 'border-b transition-colors hover:bg-muted/50 has-aria-expanded:bg-muted/50 data-[state=selected]:bg-muted',
58
48
  className
59
49
  )}
60
50
  {...props}
@@ -67,7 +57,7 @@ function TableHead({ className, ...props }: React.ComponentProps<'th'>) {
67
57
  <th
68
58
  data-slot="table-head"
69
59
  className={cn(
70
- 'h-10 px-3 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0',
60
+ 'h-12 px-3 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0',
71
61
  className
72
62
  )}
73
63
  {...props}
@@ -79,10 +69,7 @@ function TableCell({ className, ...props }: React.ComponentProps<'td'>) {
79
69
  return (
80
70
  <td
81
71
  data-slot="table-cell"
82
- className={cn(
83
- 'px-3 py-1.5 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0',
84
- className
85
- )}
72
+ className={cn('p-3 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0', className)}
86
73
  {...props}
87
74
  />
88
75
  )
@@ -1,16 +1,11 @@
1
1
  'use client'
2
2
 
3
- import type * as React from 'react'
4
3
  import type { VariantProps } from 'class-variance-authority'
5
4
  import { cn } from '@admin/utils/shared/cn'
5
+ import { Tabs as TabsPrimitive } from '@base-ui/react/tabs'
6
6
  import { cva } from 'class-variance-authority'
7
- import { Tabs as TabsPrimitive } from 'radix-ui'
8
7
 
9
- function Tabs({
10
- className,
11
- orientation = 'horizontal',
12
- ...props
13
- }: React.ComponentProps<typeof TabsPrimitive.Root>) {
8
+ function Tabs({ className, orientation = 'horizontal', ...props }: TabsPrimitive.Root.Props) {
14
9
  return (
15
10
  <TabsPrimitive.Root
16
11
  data-slot="tabs"
@@ -22,7 +17,7 @@ function Tabs({
22
17
  }
23
18
 
24
19
  const tabsListVariants = cva(
25
- 'group/tabs-list inline-flex w-fit items-center justify-center gap-0.5 rounded-sm border border-border p-[2px] text-muted-foreground group-data-horizontal/tabs:h-10 group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col group-data-vertical/tabs:rounded-sm data-[variant=line]:rounded-none',
20
+ 'group/tabs-list inline-flex w-fit items-center justify-center rounded-4xl p-[3px] text-muted-foreground group-data-horizontal/tabs:h-9 group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col group-data-vertical/tabs:rounded-2xl data-[variant=line]:rounded-none',
26
21
  {
27
22
  variants: {
28
23
  variant: {
@@ -40,7 +35,7 @@ function TabsList({
40
35
  className,
41
36
  variant = 'default',
42
37
  ...props
43
- }: React.ComponentProps<typeof TabsPrimitive.List> & VariantProps<typeof tabsListVariants>) {
38
+ }: TabsPrimitive.List.Props & VariantProps<typeof tabsListVariants>) {
44
39
  return (
45
40
  <TabsPrimitive.List
46
41
  data-slot="tabs-list"
@@ -51,14 +46,14 @@ function TabsList({
51
46
  )
52
47
  }
53
48
 
54
- function TabsTrigger({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Trigger>) {
49
+ function TabsTrigger({ className, ...props }: TabsPrimitive.Tab.Props) {
55
50
  return (
56
- <TabsPrimitive.Trigger
51
+ <TabsPrimitive.Tab
57
52
  data-slot="tabs-trigger"
58
53
  className={cn(
59
- "relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-sm border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start group-data-vertical/tabs:px-2.5 group-data-vertical/tabs:py-1.5 hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 dark:text-muted-foreground dark:hover:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg]:text-current [&_svg:not([class*='size-'])]:size-4",
60
- 'rounded-sm group-data-[variant=line]/tabs-list:bg-transparent hover:border-border hover:bg-secondary/60 group-data-[variant=line]/tabs-list:data-active:border-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent group-data-[variant=line]/tabs-list:data-active:hover:border-transparent group-data-[variant=line]/tabs-list:data-active:hover:bg-transparent',
61
- 'data-active:border-border data-active:bg-input data-active:text-foreground data-active:hover:border-border data-active:hover:bg-input data-active:hover:text-foreground data-active:aria-expanded:bg-secondary data-active:aria-expanded:text-foreground',
54
+ "relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-xl border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start group-data-vertical/tabs:px-2.5 group-data-vertical/tabs:py-1.5 hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-disabled:pointer-events-none aria-disabled:opacity-50 dark:text-muted-foreground dark:hover:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
55
+ 'group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent',
56
+ 'data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground',
62
57
  'after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:bottom-[-5px] group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100',
63
58
  className
64
59
  )}
@@ -67,9 +62,9 @@ function TabsTrigger({ className, ...props }: React.ComponentProps<typeof TabsPr
67
62
  )
68
63
  }
69
64
 
70
- function TabsContent({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Content>) {
65
+ function TabsContent({ className, ...props }: TabsPrimitive.Panel.Props) {
71
66
  return (
72
- <TabsPrimitive.Content
67
+ <TabsPrimitive.Panel
73
68
  data-slot="tabs-content"
74
69
  className={cn('flex-1 text-sm outline-none', className)}
75
70
  {...props}
@@ -1,4 +1,4 @@
1
- import type * as React from 'react'
1
+ import * as React from 'react'
2
2
  import { cn } from '@admin/utils/shared/cn'
3
3
 
4
4
  function Textarea({ className, ...props }: React.ComponentProps<'textarea'>) {
@@ -6,7 +6,7 @@ function Textarea({ className, ...props }: React.ComponentProps<'textarea'>) {
6
6
  <textarea
7
7
  data-slot="textarea"
8
8
  className={cn(
9
- 'flex field-sizing-content min-h-16 w-full resize-none rounded-sm border border-border bg-input px-3 py-3 text-base shadow-input transition-colors outline-none placeholder:text-muted-foreground hover:border-primary/13 focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-[3px] aria-invalid:ring-destructive/20 md:text-sm dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40',
9
+ 'flex field-sizing-content min-h-16 w-full resize-none rounded-xl border border-input bg-input/30 px-3 py-3 text-base transition-colors outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-[3px] aria-invalid:ring-destructive/20 md:text-sm dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40',
10
10
  className
11
11
  )}
12
12
  {...props}
@@ -4,7 +4,8 @@ import * as React from 'react'
4
4
  import type { VariantProps } from 'class-variance-authority'
5
5
  import { toggleVariants } from '@admin/components/ui/toggle'
6
6
  import { cn } from '@admin/utils/shared/cn'
7
- import { ToggleGroup as ToggleGroupPrimitive } from 'radix-ui'
7
+ import { Toggle as TogglePrimitive } from '@base-ui/react/toggle'
8
+ import { ToggleGroup as ToggleGroupPrimitive } from '@base-ui/react/toggle-group'
8
9
 
9
10
  const ToggleGroupContext = React.createContext<
10
11
  VariantProps<typeof toggleVariants> & {
@@ -14,7 +15,7 @@ const ToggleGroupContext = React.createContext<
14
15
  >({
15
16
  size: 'default',
16
17
  variant: 'default',
17
- spacing: 0,
18
+ spacing: 2,
18
19
  orientation: 'horizontal'
19
20
  })
20
21
 
@@ -22,17 +23,17 @@ function ToggleGroup({
22
23
  className,
23
24
  variant,
24
25
  size,
25
- spacing = 0,
26
+ spacing = 2,
26
27
  orientation = 'horizontal',
27
28
  children,
28
29
  ...props
29
- }: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &
30
+ }: ToggleGroupPrimitive.Props &
30
31
  VariantProps<typeof toggleVariants> & {
31
32
  spacing?: number
32
33
  orientation?: 'horizontal' | 'vertical'
33
34
  }) {
34
35
  return (
35
- <ToggleGroupPrimitive.Root
36
+ <ToggleGroupPrimitive
36
37
  data-slot="toggle-group"
37
38
  data-variant={variant}
38
39
  data-size={size}
@@ -40,7 +41,7 @@ function ToggleGroup({
40
41
  data-orientation={orientation}
41
42
  style={{ '--gap': spacing } as React.CSSProperties}
42
43
  className={cn(
43
- 'group/toggle-group flex w-fit flex-row items-center gap-[--spacing(var(--gap))] data-[spacing=0]:data-[variant=outline]:rounded-sm data-vertical:flex-col data-vertical:items-stretch',
44
+ 'group/toggle-group flex w-fit flex-row items-center gap-[--spacing(var(--gap))] data-[spacing=0]:data-[variant=outline]:rounded-4xl data-vertical:flex-col data-vertical:items-stretch',
44
45
  className
45
46
  )}
46
47
  {...props}
@@ -48,7 +49,7 @@ function ToggleGroup({
48
49
  <ToggleGroupContext.Provider value={{ variant, size, spacing, orientation }}>
49
50
  {children}
50
51
  </ToggleGroupContext.Provider>
51
- </ToggleGroupPrimitive.Root>
52
+ </ToggleGroupPrimitive>
52
53
  )
53
54
  }
54
55
 
@@ -58,17 +59,17 @@ function ToggleGroupItem({
58
59
  variant = 'default',
59
60
  size = 'default',
60
61
  ...props
61
- }: React.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleVariants>) {
62
+ }: TogglePrimitive.Props & VariantProps<typeof toggleVariants>) {
62
63
  const context = React.useContext(ToggleGroupContext)
63
64
 
64
65
  return (
65
- <ToggleGroupPrimitive.Item
66
+ <TogglePrimitive
66
67
  data-slot="toggle-group-item"
67
68
  data-variant={context.variant || variant}
68
69
  data-size={context.size || size}
69
70
  data-spacing={context.spacing}
70
71
  className={cn(
71
- 'shrink-0 group-data-[spacing=0]/toggle-group:rounded-none group-data-[spacing=0]/toggle-group:px-3 group-data-[spacing=0]/toggle-group:shadow-none focus:z-10 focus-visible:z-10 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-end]:pr-2.5 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-start]:pl-2.5 group-data-horizontal/toggle-group:data-[spacing=0]:first:rounded-l-sm group-data-vertical/toggle-group:data-[spacing=0]:first:rounded-t-3xl group-data-horizontal/toggle-group:data-[spacing=0]:last:rounded-r-sm group-data-vertical/toggle-group:data-[spacing=0]:last:rounded-b-3xl data-[state=on]:bg-muted group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:border-l-0 group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:border-t-0 group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-l group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-t',
72
+ 'shrink-0 group-data-[spacing=0]/toggle-group:rounded-none group-data-[spacing=0]/toggle-group:px-3 group-data-[spacing=0]/toggle-group:shadow-none focus:z-10 focus-visible:z-10 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-end]:pr-2.5 group-data-[spacing=0]/toggle-group:has-data-[icon=inline-start]:pl-2.5 group-data-horizontal/toggle-group:data-[spacing=0]:first:rounded-l-3xl group-data-vertical/toggle-group:data-[spacing=0]:first:rounded-t-3xl group-data-horizontal/toggle-group:data-[spacing=0]:last:rounded-r-3xl group-data-vertical/toggle-group:data-[spacing=0]:last:rounded-b-3xl data-[state=on]:bg-muted group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:border-l-0 group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:border-t-0 group-data-horizontal/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-l group-data-vertical/toggle-group:data-[spacing=0]:data-[variant=outline]:first:border-t',
72
73
  toggleVariants({
73
74
  variant: context.variant || variant,
74
75
  size: context.size || size
@@ -78,7 +79,7 @@ function ToggleGroupItem({
78
79
  {...props}
79
80
  >
80
81
  {children}
81
- </ToggleGroupPrimitive.Item>
82
+ </TogglePrimitive>
82
83
  )
83
84
  }
84
85
 
@@ -1,13 +1,12 @@
1
1
  'use client'
2
2
 
3
- import type * as React from 'react'
4
3
  import type { VariantProps } from 'class-variance-authority'
5
4
  import { cn } from '@admin/utils/shared/cn'
5
+ import { Toggle as TogglePrimitive } from '@base-ui/react/toggle'
6
6
  import { cva } from 'class-variance-authority'
7
- import { Toggle as TogglePrimitive } from 'radix-ui'
8
7
 
9
8
  const toggleVariants = cva(
10
- "group/toggle inline-flex items-center justify-center gap-1 rounded-sm text-sm font-medium whitespace-nowrap transition-colors outline-none hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-muted dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
9
+ "group/toggle inline-flex items-center justify-center gap-1 rounded-4xl text-sm font-medium whitespace-nowrap transition-colors outline-none hover:bg-muted hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 aria-pressed:bg-muted dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
11
10
  {
12
11
  variants: {
13
12
  variant: {
@@ -33,9 +32,9 @@ function Toggle({
33
32
  variant = 'default',
34
33
  size = 'default',
35
34
  ...props
36
- }: React.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>) {
35
+ }: TogglePrimitive.Props & VariantProps<typeof toggleVariants>) {
37
36
  return (
38
- <TogglePrimitive.Root
37
+ <TogglePrimitive
39
38
  data-slot="toggle"
40
39
  className={cn(toggleVariants({ variant, size, className }))}
41
40
  {...props}
@@ -1,51 +1,53 @@
1
1
  'use client'
2
2
 
3
- import type * as React from 'react'
4
3
  import { cn } from '@admin/utils/shared/cn'
5
- import { Tooltip as TooltipPrimitive } from 'radix-ui'
4
+ import { Tooltip as TooltipPrimitive } from '@base-ui/react/tooltip'
6
5
 
7
- function TooltipProvider({
8
- delayDuration = 0,
9
- ...props
10
- }: React.ComponentProps<typeof TooltipPrimitive.Provider>) {
11
- return (
12
- <TooltipPrimitive.Provider
13
- data-slot="tooltip-provider"
14
- delayDuration={delayDuration}
15
- {...props}
16
- />
17
- )
6
+ function TooltipProvider({ delay = 0, ...props }: TooltipPrimitive.Provider.Props) {
7
+ return <TooltipPrimitive.Provider data-slot="tooltip-provider" delay={delay} {...props} />
18
8
  }
19
9
 
20
- function Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>) {
10
+ function Tooltip({ ...props }: TooltipPrimitive.Root.Props) {
21
11
  return <TooltipPrimitive.Root data-slot="tooltip" {...props} />
22
12
  }
23
13
 
24
- function TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {
14
+ function TooltipTrigger({ ...props }: TooltipPrimitive.Trigger.Props) {
25
15
  return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />
26
16
  }
27
17
 
28
18
  function TooltipContent({
29
19
  className,
30
- sideOffset = 0,
20
+ side = 'top',
21
+ sideOffset = 4,
22
+ align = 'center',
23
+ alignOffset = 0,
31
24
  children,
32
25
  ...props
33
- }: React.ComponentProps<typeof TooltipPrimitive.Content>) {
26
+ }: TooltipPrimitive.Popup.Props &
27
+ Pick<TooltipPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset'>) {
34
28
  return (
35
29
  <TooltipPrimitive.Portal>
36
- <TooltipPrimitive.Content
37
- data-slot="tooltip-content"
30
+ <TooltipPrimitive.Positioner
31
+ align={align}
32
+ alignOffset={alignOffset}
33
+ side={side}
38
34
  sideOffset={sideOffset}
39
- className={cn(
40
- 'material-card z-50 inline-flex w-fit max-w-xs origin-(--radix-tooltip-content-transform-origin) items-center gap-1.5 rounded-sm border border-border bg-card p-3.5 text-sm text-foreground has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',
41
- className
42
- )}
43
- {...props}
35
+ className="isolate z-50"
44
36
  >
45
- {children}
46
- </TooltipPrimitive.Content>
37
+ <TooltipPrimitive.Popup
38
+ data-slot="tooltip-content"
39
+ className={cn(
40
+ 'z-50 inline-flex w-fit max-w-xs origin-(--transform-origin) items-center gap-1.5 rounded-2xl bg-foreground px-3 py-1.5 text-xs text-background has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-4xl data-[state=delayed-open]:animate-in data-[state=delayed-open]:fade-in-0 data-[state=delayed-open]:zoom-in-95 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',
41
+ className
42
+ )}
43
+ {...props}
44
+ >
45
+ {children}
46
+ <TooltipPrimitive.Arrow className="z-50 size-2.5 translate-y-[calc(-50%-2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground data-[side=bottom]:top-1 data-[side=inline-end]:top-1/2! data-[side=inline-end]:-left-1 data-[side=inline-end]:translate-x-[1.5px] data-[side=inline-end]:-translate-y-1/2 data-[side=inline-start]:top-1/2! data-[side=inline-start]:-right-1 data-[side=inline-start]:translate-x-[-1.5px] data-[side=inline-start]:-translate-y-1/2 data-[side=left]:top-1/2! data-[side=left]:-right-1 data-[side=left]:translate-x-[-1.5px] data-[side=left]:-translate-y-1/2 data-[side=right]:top-1/2! data-[side=right]:-left-1 data-[side=right]:translate-x-[1.5px] data-[side=right]:-translate-y-1/2 data-[side=top]:-bottom-2.5" />
47
+ </TooltipPrimitive.Popup>
48
+ </TooltipPrimitive.Positioner>
47
49
  </TooltipPrimitive.Portal>
48
50
  )
49
51
  }
50
52
 
51
- export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger }
53
+ export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }