30 lines
948 B
TypeScript
30 lines
948 B
TypeScript
import type { ComponentPropsWithoutRef, ElementRef } from 'react'
|
|
import { forwardRef } from 'react'
|
|
|
|
import { cn } from '@/lib/utils'
|
|
|
|
import { BackgroundLayer } from '@/components/background-layer'
|
|
import { DialogContent } from '@/components/ui/dialog'
|
|
|
|
import { useBackground } from '@/hooks/use-background'
|
|
|
|
type DialogContentWithBackgroundProps = ComponentPropsWithoutRef<typeof DialogContent>
|
|
|
|
export const DialogContentWithBackground = forwardRef<
|
|
ElementRef<typeof DialogContent>,
|
|
DialogContentWithBackgroundProps
|
|
>(({ className, children, ...props }, ref) => {
|
|
const { config: bg } = useBackground('dialog')
|
|
|
|
return (
|
|
<DialogContent ref={ref} className={cn('relative isolate', className)} {...props}>
|
|
<BackgroundLayer config={bg} layerId="dialog" />
|
|
<div className="relative z-10">
|
|
{children}
|
|
</div>
|
|
</DialogContent>
|
|
)
|
|
})
|
|
|
|
DialogContentWithBackground.displayName = 'DialogContentWithBackground'
|