umd-example.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />

    <title>ReactYandexMaps with UMD module example</title>

    <script src="https://unpkg.com/react/umd/react.production.min.js"></script>
    <script src="https://unpkg.com/react-dom/umd/react-dom.production.min.js"></script>
    <script src="https://unpkg.com/htm@2.1.1/dist/htm.js"></script>

    <!-- <script src="./dist/development/react-yandex-maps.umd.js"></script> -->
    <script src="./dist/production/react-yandex-maps.umd.js"></script>
  </head>

  <body>
    <div id="root"></div>

    <script>
      const { YMaps, Map, Placemark } = ReactYandexMaps;

      const html = htm.bind(React.createElement);

      const center = [55.75, 37.57];

      const App = () => html`
        <${YMaps}>
          <div>
            My awesome application with maps!
            <${Map} defaultState=${{ center, zoom: 9 }}>
              <${Placemark}
                defaultGeometry=${center}
                instanceRef=${console.log}
              />
            <//>
          </div>
        <//>
      `;

      ReactDOM.render(
        html`
          <${App} />
        `,
        document.getElementById('root')
      );
    </script>
  </body>
</html>