*
*
* Layout classes and CSS custom properties are applied by the runtime from `data-settings` (PHP prints no CSS).
*/
final class Renderer
{
public const CLOSE_ICON = '';
private TemplateRenderer $templates;
public function __construct(TemplateRenderer $templates)
{
$this->templates = $templates;
}
/** @return array the popup settings of a template (from its saved page settings) */
public static function settings_for(int $id, array $breakpoints = []): array
{
return Settings::from_page(Document::get_page_settings($id), $breakpoints);
}
/**
* @param array $settings Settings::from_page() output
* @param bool $auto false: triggers are ignored (the popup is only here because the page links to it)
* @param bool $preview open at once, triggers and rules ignored (editors viewing the template)
*/
public function render(int $id, array $settings, ?int $context_post = null, bool $auto = true, bool $preview = false): string
{
$inner = $this->templates->render($id, $context_post);
if ($inner === '') {
return '';
}
$label = function_exists('get_the_title') ? (string) get_the_title($id) : '';
$json = (string) wp_json_encode($settings, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES);
$close = !empty($settings['close']['show'])
? ''
: '';
return '
'
. ''
. '
'
. $close
. '
' . $inner . '
'
. '
';
}
/**
* Editor canvas (`?zadex=preview`): a dimmed placeholder page and the popup shell in normal flow around the
* canvas mount point. src/editor/canvas/PopupStage.vue applies the live settings (and builds the same
* structure itself when the page has none, e.g. the dev harness).
*/
public static function editor_stage(int $id, string $mount): string
{
return '