import "https://esm.sh/preact@10.23.1/debug";
import * as Preact from "https://esm.sh/preact@10.23.1";
import * as React from "https://esm.sh/preact@10.23.1/compat";
const H = Preact.h;

console.log(React);

/** @typedef {(vnode:Preact.VNode)=>unknown} DeepHook*/

/** @type {DeepHook|undefined} */
const renderOld =Preact.options.__r;

/** @type {DeepHook} */
const renderNew =(vnode)=>
{
    console.log("render!")
    console.log(vnode);
    // how to examine state context here?
};

Preact.options.__r = renderOld ? /**@type{DeepHook}*/((vnode)=>{renderOld(vnode); renderNew(vnode);}) : renderNew;

const Component =()=>
{
    const [countGet, countSet] = React.useState(3);
    return H("h1", {onClick(){countSet(countGet+1)}}, `count: ${countGet}`);
}

const root = document.querySelector("#app")||document.body;
Preact.render(H(Component, {HEY:"HEY"}), root);