d826159fc0
Fixes https://github.com/payloadcms/payload/issues/13308 Adds support for a custom live preview component back, we previously supported this and it was allowed via the config types but it wasn't being rendered. Now we export the `useLivePreviewContext` hook and the original `LivePreviewWindow` component too so that end users can wrap the live preview functionality with anything custom that they may need
28 lines
712 B
TypeScript
28 lines
712 B
TypeScript
'use client'
|
|
import { LivePreviewWindow, useDocumentInfo, useLivePreviewContext } from '@payloadcms/ui'
|
|
|
|
import './styles.css'
|
|
|
|
export function CustomLivePreview() {
|
|
const { collectionSlug, globalSlug } = useDocumentInfo()
|
|
const { isLivePreviewing, setURL, url } = useLivePreviewContext()
|
|
|
|
return (
|
|
<div
|
|
className={[
|
|
'custom-live-preview',
|
|
isLivePreviewing && `custom-live-preview--is-live-previewing`,
|
|
]
|
|
.filter(Boolean)
|
|
.join(' ')}
|
|
>
|
|
{isLivePreviewing && (
|
|
<>
|
|
<p>Custom live preview being rendered</p>
|
|
<LivePreviewWindow collectionSlug={collectionSlug} globalSlug={globalSlug} />
|
|
</>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|