html

document.querySelectorAll('iframe:not(.no-auto-wrap)').forEach((iframe) => {
  // wraps every iframe for responsive embedding, runs once on load
});

<div class="skip-marker"></div>
<div id="widget-container">
  <script src="https://example.com/widget-embed.js"></script>
</div>

const pending = new Set(document.querySelectorAll('.skip-marker'));

function check() {
  pending.forEach((marker) => {
    const iframe = marker.nextElementSibling?.querySelector('iframe:not(.no-auto-wrap)');
    if (iframe) {
      iframe.classList.add('no-auto-wrap');
      pending.delete(marker);
    }
  });
  if (pending.size === 0) observer.disconnect();
}

const observer = new MutationObserver(check);
observer.observe(document.body, { childList: true, subtree: true });
check(); // catches iframes that already exist

{# Checks if a URL exists and passes it to the component. Otherwise, sets it to false. Works with primitive data types. #}
{% set link = url ? { url: url } : false %}

{# Checks if the media object is not empty and passes it to the component. Otherwise, sets it to false. Suitable for complex data types like objects. #}
{% set media = media is not empty ? { media: media } : false %}

<!DOCTYPE html>
<html{{ html_attributes }}>
  <head>
    <head-placeholder token="{{ placeholder_token|raw }}">
    <meta name="theme-color" content="#ef9222">
    <title>{{ head_title|safe_join(' | ') }}</title>
    <css-placeholder token="{{ placeholder_token|raw }}">
    <js-placeholder token="{{ placeholder_token|raw }}">
  </head>
  <body{{ attributes }}>
    {#...#}
  </body>
</html>

personal_data:
  '#type': html_tag
  '#tag': h3
  '#value': 'Personal data'

let details = document.getElementsByTagName('details');
for (i = 0; i < details.length; ++i) {
  details.item(i).open = true;
}