Skip to content

Commit 4e42448

Browse files
mphasizemphasize
committed
Update more dependencies, including React 19, and fix design regressions from recent shadcn update
1 parent 59a311a commit 4e42448

28 files changed

+356
-397
lines changed

‎app/components/layout-editor.tsx‎

Lines changed: 22 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -206,28 +206,33 @@ function Toolbar({ settings, onChange, onDelete }: any) {
206206
aria-label="Toggle align left"
207207
className="data-[state=on]:text-primary data-[state=off]:text-muted-foreground"
208208
>
209-
<AlignLeft className="h-4 w-4" />
209+
<AlignLeft />
210210
</ToggleGroupItem>
211211
<ToggleGroupItem
212212
value="center"
213213
aria-label="Toggle align center"
214214
className="data-[state=on]:text-primary data-[state=off]:text-muted-foreground"
215215
>
216-
<AlignCenter className="h-4 w-4" />
216+
<AlignCenter />
217217
</ToggleGroupItem>
218218
<ToggleGroupItem
219219
value="right"
220220
aria-label="Toggle align right"
221221
className="data-[state=off]:text-muted-foreground"
222222
disabled
223223
>
224-
<AlignRight className="h-4 w-4" />
224+
<AlignRight />
225225
</ToggleGroupItem>
226226
</ToggleGroup>
227227
</div>
228-
<Button type="button" variant="ghost" size="icon" onClick={onDelete}>
229-
<Trash2 className="h-4 w-4" />
230-
</Button>
228+
<Tooltip>
229+
<TooltipTrigger asChild>
230+
<Button type="button" variant="ghost" size="icon" onClick={onDelete}>
231+
<Trash2 />
232+
</Button>
233+
</TooltipTrigger>
234+
<TooltipContent side="top">Remove block</TooltipContent>
235+
</Tooltip>
231236
</div>
232237
);
233238
}
@@ -244,6 +249,7 @@ function TextLine({ lineId, settings, fonts, onChangeLine, onDelete }: any) {
244249
return (
245250
<div className="flex px-4 gap-2">
246251
<Input
252+
id={`${lineId}-text`}
247253
key={`${lineId}-text`}
248254
value={settings.text}
249255
onChange={(event) =>
@@ -257,7 +263,7 @@ function TextLine({ lineId, settings, fonts, onChangeLine, onDelete }: any) {
257263
<DropdownMenu>
258264
<DropdownMenuTrigger asChild>
259265
<Button variant="ghost" size="icon" className="my-button">
260-
<Braces className="w-4 h-4" />
266+
<Braces />
261267
</Button>
262268
</DropdownMenuTrigger>
263269
<DropdownMenuContent>
@@ -365,7 +371,7 @@ function TextLine({ lineId, settings, fonts, onChangeLine, onDelete }: any) {
365371
});
366372
}}
367373
>
368-
<SelectTrigger className="w-[280px]">
374+
<SelectTrigger>
369375
<SelectValue placeholder="Select typeface" />
370376
</SelectTrigger>
371377
<SelectContent>
@@ -376,9 +382,14 @@ function TextLine({ lineId, settings, fonts, onChangeLine, onDelete }: any) {
376382
))}
377383
</SelectContent>
378384
</Select>
379-
<Button type="button" variant="ghost" size="icon" onClick={onDelete}>
380-
<Trash2 className="h-4 w-4" />
381-
</Button>
385+
<Tooltip>
386+
<TooltipTrigger asChild>
387+
<Button type="button" variant="ghost" size="icon" onClick={onDelete} className="px-0">
388+
<Trash2 />
389+
</Button>
390+
</TooltipTrigger>
391+
<TooltipContent side="top">Remove segment</TooltipContent>
392+
</Tooltip>
382393
</div>
383394
);
384395
}

‎app/components/sidebar-admin.tsx‎

Lines changed: 16 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -112,7 +112,7 @@ export function SidebarAdmin({
112112
</SidebarMenuButton>
113113
</DropdownMenuTrigger>
114114
<DropdownMenuContent
115-
className="w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg"
115+
className="w-[--radix-dropdown-menu-trigger-width] min-w-60 rounded-lg"
116116
align="start"
117117
side="bottom"
118118
sideOffset={4}
@@ -180,7 +180,7 @@ export function SidebarAdmin({
180180
<SidebarMenuButton tooltip="Program Managers" asChild>
181181
<NavLink
182182
to={`/org/program/${activeProgram?.id}/user`}
183-
className="aria-current:bg-sidebar-accent aria-current:font-bold"
183+
className="aria-[current]:bg-sidebar-accent aria-[current]:font-bold"
184184
>
185185
<UsersIcon />
186186
<span>Program Managers</span>
@@ -191,7 +191,7 @@ export function SidebarAdmin({
191191
<SidebarMenuButton tooltip="Program Settings" asChild>
192192
<NavLink
193193
to={`/org/program/${activeProgram?.id}/settings`}
194-
className="aria-current:bg-sidebar-accent aria-current:font-bold"
194+
className="aria-[current]:bg-sidebar-accent aria-[current]:font-bold"
195195
>
196196
<Settings />
197197
<span>Settings</span>
@@ -200,7 +200,10 @@ export function SidebarAdmin({
200200
</SidebarMenuItem>
201201
<SidebarMenuItem>
202202
<SidebarMenuButton tooltip="Social Media" asChild>
203-
<NavLink to={`/org/program/${activeProgram?.id}/social`}>
203+
<NavLink
204+
to={`/org/program/${activeProgram?.id}/social`}
205+
className="aria-[current]:bg-sidebar-accent aria-[current]:font-bold"
206+
>
204207
<Share2 />
205208
<span>Social Media</span>
206209
</NavLink>
@@ -218,7 +221,7 @@ export function SidebarAdmin({
218221
to={`/org/program/${activeProgram?.id}/batch/${
219222
activeBatchId ? activeBatchId + "/certificates" : ""
220223
}`}
221-
className="aria-current:bg-sidebar-accent aria-current:font-bold"
224+
className="aria-[current]:bg-sidebar-accent aria-[current]:font-bold"
222225
>
223226
<FileBadge />
224227
<span>Batches</span>
@@ -233,7 +236,7 @@ export function SidebarAdmin({
233236
? `/org/program/${activeProgram?.id}/batch/${activeBatchId}/import`
234237
: `/org/program/${activeProgram?.id}/batch/create`
235238
}
236-
className="aria-current:bg-sidebar-accent aria-current:font-bold"
239+
className="aria-[current]:bg-sidebar-accent aria-[current]:font-bold"
237240
>
238241
<FileUp />
239242
<span>Import</span>
@@ -244,7 +247,7 @@ export function SidebarAdmin({
244247
<SidebarMenuButton tooltip="PDF Templates" asChild>
245248
<NavLink
246249
to={`/org/program/${activeProgram?.id}/templates/`}
247-
className="aria-current:bg-sidebar-accent aria-current:font-bold"
250+
className="aria-[current]:bg-sidebar-accent aria-[current]:font-bold"
248251
>
249252
<FilePen className="w-6 h-6" size={24} />
250253
<span>Templates</span>
@@ -276,7 +279,7 @@ export function SidebarAdmin({
276279
<SidebarMenuButton tooltip="Organisation Settings" asChild>
277280
<NavLink
278281
to={`/org/settings`}
279-
className="aria-current:bg-sidebar-accent aria-current:font-bold"
282+
className="aria-[current]:bg-sidebar-accent aria-[current]:font-bold"
280283
>
281284
<Home />
282285
<span>Organisation</span>
@@ -287,7 +290,7 @@ export function SidebarAdmin({
287290
<SidebarMenuButton tooltip="User" asChild>
288291
<NavLink
289292
to={`/org/user`}
290-
className="aria-current:bg-sidebar-accent aria-current:font-bold"
293+
className="aria-[current]:bg-sidebar-accent aria-[current]:font-bold"
291294
>
292295
<UsersIcon />
293296
<span>User</span>
@@ -298,7 +301,7 @@ export function SidebarAdmin({
298301
<SidebarMenuButton tooltip="Typefaces" asChild>
299302
<NavLink
300303
to={`/org/typeface`}
301-
className="aria-current:bg-sidebar-accent aria-current:font-bold"
304+
className="aria-[current]:bg-sidebar-accent aria-[current]:font-bold"
302305
>
303306
<BookType />
304307
<span>Typefaces</span>
@@ -340,9 +343,9 @@ export function SidebarAdmin({
340343
</SidebarMenuButton>
341344
</DropdownMenuTrigger>
342345
<DropdownMenuContent
343-
className="w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg"
344-
side="bottom"
345-
align="end"
346+
className="w-[--radix-dropdown-menu-trigger-width] min-w-60 rounded-lg"
347+
side="top"
348+
align="start"
346349
sideOffset={4}
347350
>
348351
<DropdownMenuLabel className="p-0 font-normal">

‎app/components/sidebar-participant.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ export function SidebarParticipant({
7272
<SidebarMenuButton
7373
tooltip={`${cert.batch.program.name} – ${cert.batch.name}`}
7474
asChild
75-
className="aria-current:bg-accent aria-current:font-bold !h-9 group-data-[collapsible=icon]:w-10"
75+
className="aria-[current]:bg-accent aria-[current]:font-bold !h-9 group-data-[collapsible=icon]:w-10"
7676
>
7777
<NavLink to={`/view/${cert.uuid}`}>
7878
{cert.batch.program.logo ? (
@@ -124,9 +124,9 @@ export function SidebarParticipant({
124124
</SidebarMenuButton>
125125
</DropdownMenuTrigger>
126126
<DropdownMenuContent
127-
className="w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg"
128-
side="bottom"
129-
align="end"
127+
className="w-[--radix-dropdown-menu-trigger-width] min-w-60 rounded-lg"
128+
side="top"
129+
align="start"
130130
sideOffset={4}
131131
>
132132
<DropdownMenuLabel className="p-0 font-normal">

‎app/components/ui/button.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -22,10 +22,10 @@ const buttonVariants = cva(
2222
link: "text-primary underline-offset-4 hover:underline",
2323
},
2424
size: {
25-
default: "h-9 px-4 py-2 has-[>svg]:px-3",
26-
sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
27-
lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
28-
icon: "size-9",
25+
default: "h-10 px-4 py-2 has-[>svg]:px-3",
26+
sm: "h-9 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
27+
lg: "h-11 rounded-md px-6 has-[>svg]:px-4",
28+
icon: "size-10",
2929
},
3030
},
3131
defaultVariants: {

‎app/components/ui/card.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ function Card({ className, ...props }: React.ComponentProps<"div">) {
88
<div
99
data-slot="card"
1010
className={cn(
11-
"bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
11+
"bg-card text-card-foreground flex flex-col gap-0.5 rounded-lg border py-6 shadow-sm",
1212
className,
1313
)}
1414
{...props}
@@ -21,7 +21,7 @@ function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
2121
<div
2222
data-slot="card-header"
2323
className={cn(
24-
"@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
24+
"@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 pb-6 has-data-[slot=card-action]:grid-cols-[1fr_auto]",
2525
className,
2626
)}
2727
{...props}
@@ -33,7 +33,7 @@ function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
3333
return (
3434
<div
3535
data-slot="card-title"
36-
className={cn("leading-none font-semibold", className)}
36+
className={cn("text-2xl leading-none tracking-tight font-semibold", className)}
3737
{...props}
3838
/>
3939
);

‎app/components/ui/dialog.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,7 @@ function DialogOverlay({
3737
<DialogPrimitive.Overlay
3838
data-slot="dialog-overlay"
3939
className={cn(
40-
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
40+
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/70",
4141
className,
4242
)}
4343
{...props}

‎app/components/ui/dropdown-menu.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,7 @@ function DropdownMenuItem({
7373
data-inset={inset}
7474
data-variant={variant}
7575
className={cn(
76-
"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
76+
"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive relative flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-5", /* [&_svg:not([class*='text-'])]:text-muted-foreground */
7777
className,
7878
)}
7979
{...props}

‎app/components/ui/input.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ function Input({ className, type, ...props }: React.ComponentProps<"input">) {
99
type={type}
1010
data-slot="input"
1111
className={cn(
12-
"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
12+
"file:text-foreground placeholder:text-muted-foreground dark:bg-input/30 border-input flex h-10 w-full rounded-md border bg-background px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm" /* selection:bg-primary selection:text-primary-foreground */,
1313
"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
1414
"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
1515
className,

‎app/components/ui/label.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ function Label({
1212
<LabelPrimitive.Root
1313
data-slot="label"
1414
className={cn(
15-
"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
15+
"flex text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
1616
className,
1717
)}
1818
{...props}

‎app/components/ui/select.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ function SelectTrigger({
3636
data-slot="select-trigger"
3737
data-size={size}
3838
className={cn(
39-
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
39+
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-background px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-10 data-[size=sm]:h-9 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 *:data-[slot=select-value]:text-clip [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4" /* *:data-[slot=select-value]:flex */,
4040
className,
4141
)}
4242
{...props}

0 commit comments

Comments
 (0)