<script type="module">
    import { createElement, useId, render } from 'https://esm.sh/@preact/compat@17.1.2';
    
    // You can check React behaviour with replacing the import above with this:
    // import { createElement, useId } from 'https://esm.sh/stable/react@18.2.0/es2022/react.mjs'
    // import { render } from 'https://esm.sh/stable/react-dom@18.2.0/es2022/react-dom.mjs'
    
    const e = createElement;

    const Id = () => {
        const id = useId();
        return e('div', {}, `My id is ${id}`);
    }

    const App = (props) => {
        return e('div', {}, [
            e(Id, {}),
            props.secondId ? e(Id, {}) : null,
        ]);
    }

    render(e(App, { secondId: false }), document.body);
    render(e(App, { secondId: true }), document.body);
</script>