{
  "version": 3,
  "sources": ["../../../../src/blocks/legacy-widget/edit/preview.js"],
  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useRefEffect } from '@wordpress/compose';\nimport { useEffect, useState } from '@wordpress/element';\nimport { Disabled, Placeholder, Spinner } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport apiFetch from '@wordpress/api-fetch';\n\nexport default function Preview( { idBase, instance, isVisible } ) {\n\tconst [ isLoaded, setIsLoaded ] = useState( false );\n\tconst [ srcDoc, setSrcDoc ] = useState( '' );\n\n\tuseEffect( () => {\n\t\tconst abortController =\n\t\t\ttypeof window.AbortController === 'undefined'\n\t\t\t\t? undefined\n\t\t\t\t: new window.AbortController();\n\n\t\tasync function fetchPreviewHTML() {\n\t\t\tconst restRoute = `/wp/v2/widget-types/${ idBase }/render`;\n\t\t\treturn await apiFetch( {\n\t\t\t\tpath: restRoute,\n\t\t\t\tmethod: 'POST',\n\t\t\t\tsignal: abortController?.signal,\n\t\t\t\tdata: instance ? { instance } : {},\n\t\t\t} );\n\t\t}\n\n\t\tfetchPreviewHTML()\n\t\t\t.then( ( response ) => {\n\t\t\t\tsetSrcDoc( response.preview );\n\t\t\t} )\n\t\t\t.catch( ( error ) => {\n\t\t\t\tif ( 'AbortError' === error.name ) {\n\t\t\t\t\t// We don't want to log aborted requests.\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tthrow error;\n\t\t\t} );\n\n\t\treturn () => abortController?.abort();\n\t}, [ idBase, instance ] );\n\n\t// Resize the iframe on either the load event, or when the iframe becomes visible.\n\tconst ref = useRefEffect(\n\t\t( iframe ) => {\n\t\t\t// Only set height if the iframe is loaded,\n\t\t\t// or it will grow to an unexpected large height in Safari if it's hidden initially.\n\t\t\tif ( ! isLoaded ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\t// If the preview frame has another origin then this won't work.\n\t\t\t// One possible solution is to add custom script to call `postMessage` in the preview frame.\n\t\t\t// Or, better yet, we migrate away from iframe.\n\t\t\tfunction setHeight() {\n\t\t\t\t// Pick the maximum of these two values to account for margin collapsing.\n\t\t\t\tconst height = Math.max(\n\t\t\t\t\tiframe.contentDocument.documentElement?.offsetHeight ?? 0,\n\t\t\t\t\tiframe.contentDocument.body?.offsetHeight ?? 0\n\t\t\t\t);\n\n\t\t\t\t// Fallback to a height of 100px if the height cannot be determined.\n\t\t\t\t// This ensures the block is still selectable. 100px should hopefully\n\t\t\t\t// be not so big that it's annoying, and not so small that nothing\n\t\t\t\t// can be seen.\n\t\t\t\tiframe.style.height = `${ height !== 0 ? height : 100 }px`;\n\t\t\t}\n\n\t\t\tconst { IntersectionObserver } = iframe.ownerDocument.defaultView;\n\n\t\t\t// Observe for intersections that might cause a change in the height of\n\t\t\t// the iframe, e.g. a Widget Area becoming expanded.\n\t\t\tconst intersectionObserver = new IntersectionObserver(\n\t\t\t\t( [ entry ] ) => {\n\t\t\t\t\tif ( entry.isIntersecting ) {\n\t\t\t\t\t\tsetHeight();\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t\t\t{\n\t\t\t\t\tthreshold: 1,\n\t\t\t\t}\n\t\t\t);\n\t\t\tintersectionObserver.observe( iframe );\n\n\t\t\tiframe.addEventListener( 'load', setHeight );\n\n\t\t\treturn () => {\n\t\t\t\tintersectionObserver.disconnect();\n\t\t\t\tiframe.removeEventListener( 'load', setHeight );\n\t\t\t};\n\t\t},\n\t\t[ isLoaded ]\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t{ /*\n\t\t\tWhile the iframe contents are loading, we move the iframe off-screen\n\t\t\tand display a placeholder instead. This ensures that the user\n\t\t\tdoesn't see the iframe resize (which looks really janky). We have to\n\t\t\tmove the iframe off-screen instead of hiding it because web browsers\n\t\t\twill not trigger onLoad if the iframe is hidden.\n\t\t\t*/ }\n\t\t\t{ isVisible && ! isLoaded && (\n\t\t\t\t<Placeholder>\n\t\t\t\t\t<Spinner />\n\t\t\t\t</Placeholder>\n\t\t\t) }\n\t\t\t<div\n\t\t\t\tclassName={ clsx( 'wp-block-legacy-widget__edit-preview', {\n\t\t\t\t\t'is-offscreen': ! isVisible || ! isLoaded,\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t<Disabled>\n\t\t\t\t\t{ /*\n\t\t\t\t\tWe use an iframe so that the widget has an opportunity to\n\t\t\t\t\tload scripts and styles that it needs to run.\n\t\t\t\t\t*/ }\n\t\t\t\t\t<iframe\n\t\t\t\t\t\tref={ ref }\n\t\t\t\t\t\tclassName=\"wp-block-legacy-widget__edit-preview-iframe\"\n\t\t\t\t\t\ttabIndex=\"-1\"\n\t\t\t\t\t\ttitle={ __( 'Legacy Widget Preview' ) }\n\t\t\t\t\t\tsrcDoc={ srcDoc }\n\t\t\t\t\t\tonLoad={ ( event ) => {\n\t\t\t\t\t\t\t// To hide the scrollbars of the preview frame for some edge cases,\n\t\t\t\t\t\t\t// such as negative margins in the Gallery Legacy Widget.\n\t\t\t\t\t\t\t// It can't be scrolled anyway.\n\t\t\t\t\t\t\t// TODO: Ideally, this should be fixed in core.\n\t\t\t\t\t\t\tevent.target.contentDocument.body.style.overflow =\n\t\t\t\t\t\t\t\t'hidden';\n\n\t\t\t\t\t\t\tsetIsLoaded( true );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\theight={ 100 }\n\t\t\t\t\t/>\n\t\t\t\t</Disabled>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"],
  "mappings": ";AAGA,OAAO,UAAU;AAKjB,SAAS,oBAAoB;AAC7B,SAAS,WAAW,gBAAgB;AACpC,SAAS,UAAU,aAAa,eAAe;AAC/C,SAAS,UAAU;AACnB,OAAO,cAAc;AAyFnB,mBAUG,KAVH;AAvFa,SAAR,QAA0B,EAAE,QAAQ,UAAU,UAAU,GAAI;AAClE,QAAM,CAAE,UAAU,WAAY,IAAI,SAAU,KAAM;AAClD,QAAM,CAAE,QAAQ,SAAU,IAAI,SAAU,EAAG;AAE3C,YAAW,MAAM;AAChB,UAAM,kBACL,OAAO,OAAO,oBAAoB,cAC/B,SACA,IAAI,OAAO,gBAAgB;AAE/B,mBAAe,mBAAmB;AACjC,YAAM,YAAY,uBAAwB,MAAO;AACjD,aAAO,MAAM,SAAU;AAAA,QACtB,MAAM;AAAA,QACN,QAAQ;AAAA,QACR,QAAQ,iBAAiB;AAAA,QACzB,MAAM,WAAW,EAAE,SAAS,IAAI,CAAC;AAAA,MAClC,CAAE;AAAA,IACH;AAEA,qBAAiB,EACf,KAAM,CAAE,aAAc;AACtB,gBAAW,SAAS,OAAQ;AAAA,IAC7B,CAAE,EACD,MAAO,CAAE,UAAW;AACpB,UAAK,iBAAiB,MAAM,MAAO;AAElC;AAAA,MACD;AACA,YAAM;AAAA,IACP,CAAE;AAEH,WAAO,MAAM,iBAAiB,MAAM;AAAA,EACrC,GAAG,CAAE,QAAQ,QAAS,CAAE;AAGxB,QAAM,MAAM;AAAA,IACX,CAAE,WAAY;AAGb,UAAK,CAAE,UAAW;AACjB;AAAA,MACD;AAIA,eAAS,YAAY;AAEpB,cAAM,SAAS,KAAK;AAAA,UACnB,OAAO,gBAAgB,iBAAiB,gBAAgB;AAAA,UACxD,OAAO,gBAAgB,MAAM,gBAAgB;AAAA,QAC9C;AAMA,eAAO,MAAM,SAAS,GAAI,WAAW,IAAI,SAAS,GAAI;AAAA,MACvD;AAEA,YAAM,EAAE,qBAAqB,IAAI,OAAO,cAAc;AAItD,YAAM,uBAAuB,IAAI;AAAA,QAChC,CAAE,CAAE,KAAM,MAAO;AAChB,cAAK,MAAM,gBAAiB;AAC3B,sBAAU;AAAA,UACX;AAAA,QACD;AAAA,QACA;AAAA,UACC,WAAW;AAAA,QACZ;AAAA,MACD;AACA,2BAAqB,QAAS,MAAO;AAErC,aAAO,iBAAkB,QAAQ,SAAU;AAE3C,aAAO,MAAM;AACZ,6BAAqB,WAAW;AAChC,eAAO,oBAAqB,QAAQ,SAAU;AAAA,MAC/C;AAAA,IACD;AAAA,IACA,CAAE,QAAS;AAAA,EACZ;AAEA,SACC,iCAQG;AAAA,iBAAa,CAAE,YAChB,oBAAC,eACA,8BAAC,WAAQ,GACV;AAAA,IAED;AAAA,MAAC;AAAA;AAAA,QACA,WAAY,KAAM,wCAAwC;AAAA,UACzD,gBAAgB,CAAE,aAAa,CAAE;AAAA,QAClC,CAAE;AAAA,QAEF,8BAAC,YAKA;AAAA,UAAC;AAAA;AAAA,YACA;AAAA,YACA,WAAU;AAAA,YACV,UAAS;AAAA,YACT,OAAQ,GAAI,uBAAwB;AAAA,YACpC;AAAA,YACA,QAAS,CAAE,UAAW;AAKrB,oBAAM,OAAO,gBAAgB,KAAK,MAAM,WACvC;AAED,0BAAa,IAAK;AAAA,YACnB;AAAA,YACA,QAAS;AAAA;AAAA,QACV,GACD;AAAA;AAAA,IACD;AAAA,KACD;AAEF;",
  "names": []
}