import { Page , Penpad , Specimen } from '@penpad/core' ; import React , { useMemo , useState } from 'react' ; /**
 * A shim for Penpad that forces it to be embedded.
 */ const EmbeddedPenpad = ( { children } ) => { return < Penpad ui = { { isEmbedded : true } } > { children } < /Penpad>; } ; const DemoResult = ( { code } ) => { const [ lastKnown , setLastKnown ] = useState < JSX . Element | null > ( null ) ; const jsx = useMemo ( ( ) => { const fn = new Function ( 'React' , 'Penpad' , 'Specimen' , 'Page' , `${ code }; return Demo` ) ; try { const DemoComponent = fn ( React , EmbeddedPenpad , Specimen , Page ) ; const newJsx = DemoComponent ( ) ; setLastKnown ( newJsx ) ; return newJsx ; } catch ( e ) { return ; } } , [ code ] ) ; if ( jsx ) { return jsx ; } else { return lastKnown || null ; } } ; export default DemoResult ;