JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//api-maps.yandex.ru/2.1/?lang=ru_RU"></script>
<div id="map"></div>

CSS

#map{
    width:500px;
    height:500px;
}

JavaScript

var myMap;

ymaps.ready(init);

function init () {
    myMap = new ymaps.Map('map', {
        center: [55.76, 37.64], // Москва
        zoom: 10
    },
    {
        balloonMaxWidth: 200
    });
    var myCollection = new ymaps.GeoObjectCollection();
    myMap.geoObjects
        .add(new ymaps.Placemark([55.684758, 37.738521], {
          balloonContent: 'контент'
        }, {
            preset: 'twirl#blueIcon',
        }))

    myMap.events.add('click', function (e) {
      if (!myMap.balloon.isOpen()) {
    var coords = e.get('coords');
    myMap.balloon.open(coords, {
        contentHeader:'<form class="addplacemark"><p>Добавить метку</p>',
        contentBody:'<p><input name="pm_x" value="'+coords+'"></input></p>'
                  + '<p><input id="namepm" name="pm_name" placeholder="Название"></input></p>'
                  + '<p><select id="color" name="pm_preset">'
                        +'<option value="#00b9e1" checked>Голубой</option>'
                        +'<option value="#0761bc">Темноголубой</option>'
                        +'<option value="#20bf3a">Темно зеленый</option>'
                        +'<option value="#e57c00">Темно оранжевый</option>'
                        +'<option value="#2ee325">Зеленый</option>'
                        +'<option value="#cecece">Серый</option>'
                        +'<option value="#aae7e6">Светлоголубой</option>'
                        +'<option value="#1c4795">Нэви</option>'
                        +'<option value="#ffa200">Оранжевый</option>'
                        +'<option value="#ff87ed">Розовый</option>'
                        +'<option value="#ff0000">Красный</option>'
                  + '<p><input type="text" name="pm_hint" placeholder="hint"></p>'
                  + '<p><textarea name="pm_desc" placeholder="Описание"></textarea></p>',
        contentFooter:'<div class="pm_subm">Отправить</div></form>'
    });

}
else {
    myMap.balloon.close();
}
var i = 0
var sers =...