k4rli/medreport_mrb2b
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

B2B-99: add package comparison modal (#27)

Browse Source 
* B2B-99: add pacakge comparison modal

* B2B-99: add package comparison modal

---------

Co-authored-by: Helena <helena@Helenas-MacBook-Pro.local>
This commit is contained in:
Helena
2025-07-02 16:41:58 +03:00
committed by GitHub
parent 04e0bc8069
commit a7ca3945bf
16 changed files with 380 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
packages/ui/src/shadcn/dialog.tsx
View File

@@ -20,7 +20,7 @@ const DialogOverlay: React.FC<
> = ({ className, ...props }) => (
<DialogPrimitive.Overlay
className={cn(
'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/30',
'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-1000 bg-black/30',
className,
)}
{...props}
@@ -29,25 +29,39 @@ const DialogOverlay: React.FC<
DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
const DialogContent: React.FC<
React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>
> = ({ className, children, ...props }) => (
React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {
customClose?: React.JSX.Element;
preventAutoFocus?: boolean;
}
> = ({ className, children, customClose, preventAutoFocus, ...props }) => (
<DialogPortal>
<DialogOverlay />
<DialogPrimitive.Content
className={cn(
'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg duration-200 sm:rounded-lg',
'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-1000 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg duration-200 sm:rounded-lg',
className,
)}
onOpenAutoFocus={
preventAutoFocus ? (e) => e.preventDefault() : props.onOpenAutoFocus
}
onCloseAutoFocus={
preventAutoFocus ? (e) => e.preventDefault() : props.onOpenAutoFocus
}
{...props}
>
{children}
<DialogPrimitive.Close className="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none">
<Cross2Icon className="h-4 w-4" />
<span className="sr-only">Close</span>
<DialogPrimitive.Close className="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs transition-opacity hover:opacity-70 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none">
{customClose || (
<>
<Cross2Icon className="h-4 w-4" />
<span className="sr-only">Close</span>
</>
)}
</DialogPrimitive.Close>
</DialogPrimitive.Content>
</DialogPortal>
);
DialogContent.displayName = DialogPrimitive.Content.displayName;
const DialogHeader = ({