MicroClub Context Menu

1'use client';
2 
3import * as React from 'react';
4import { ContextMenu as ContextMenuPrimitive } from '@base-ui/react/context-menu';
5import { CheckIcon, ChevronRightIcon } from 'lucide-react';
6 
7import { cn } from '@/lib/utils';
8 
9function McContextMenu({ ...props }: ContextMenuPrimitive.Root.Props) {
10  return <ContextMenuPrimitive.Root data-slot="context-menu" {...props} />;
11}
12 
13function McContextMenuPortal({ ...props }: ContextMenuPrimitive.Portal.Props) {
14  return <ContextMenuPrimitive.Portal data-slot="context-menu-portal" {...props} />;
15}
16 
17function McContextMenuTrigger({ className, ...props }: ContextMenuPrimitive.Trigger.Props) {
18  return (
19    <ContextMenuPrimitive.Trigger
20      data-slot="context-menu-trigger"
21      className={cn('select-none', className)}
22      {...props}
23    />
24  );
25}
26 
27function McContextMenuContent({
28  className,
29  align = 'start',
30  alignOffset = 4,
31  side = 'right',
32  sideOffset = 0,
33  ...props
34}: ContextMenuPrimitive.Popup.Props &
35  Pick<ContextMenuPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset'>) {
36  return (
37    <ContextMenuPrimitive.Portal>
38      <ContextMenuPrimitive.Positioner
39        className="isolate z-50 outline-none"
40        align={align}
41        alignOffset={alignOffset}
42        side={side}
43        sideOffset={sideOffset}
44      >
45        <ContextMenuPrimitive.Popup
46          data-slot="context-menu-content"
47          className={cn(
48            'z-50 max-h-(--available-height) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover p-1 text-popover-foreground shadow-md ring-1 ring-border duration-100 outline-none 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-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',
49            className
50          )}
51          {...props}
52        />
53      </ContextMenuPrimitive.Positioner>
54    </ContextMenuPrimitive.Portal>
55  );
56}
57 
58function McContextMenuGroup({ ...props }: ContextMenuPrimitive.Group.Props) {
59  return <ContextMenuPrimitive.Group data-slot="context-menu-group" {...props} />;
60}
61 
62function McContextMenuLabel({
63  className,
64  inset,
65  ...props
66}: ContextMenuPrimitive.GroupLabel.Props & {
67  inset?: boolean;
68}) {
69  return (
70// … truncated