Portals

import { signal } from '@zidomjs/core';import { Portal } from '@zidomjs/dom';export default function PortalDemo() {  const visible = signal(false);  const target = document.getElementById('demo-portal-target');  if (!target) return <p>Overlay target is unavailable.</p>;  return <div className="example-card">    <p>Content is rendered into a separate DOM container.</p>    <button onClick={() => visible.value = !visible.value}>Toggle notice</button>    <Portal to={target}>      <div className="portal-demo-slot">        {() => visible.value ? <div className="portal-notice" role="status">          Portal content — outside the component's DOM subtree.          <button aria-label="Close portal notice" onClick={() => visible.value = false}>×</button>        </div> : null}      </div>    </Portal>    <p className="demo-hint">This is a portal, not a complete modal. Accessible modals also need focus management.</p>  </div>;}