If rendered clientside, clicking tag removes it 4.1.0-rc.0

Is this a bug?
#1

I am using select 2, multiple+tags enabled but only allowing one (to not have the ugly UI select2 comes with, and just have a normal looking input).

I noticed that when I click a tag that was made client-side via the ajax call, if I click on one of those tags it is just removed. If this tag is already set by the server on loading, the tag is treated different and has the ideal functionality. Does anyone know a way to prevent the tag from disappearing on click?

Using select2 4.1.0-rc.0

<select multiple="multiple" class="form-select gplace" data-type="company" data-lookup="stop_lookup" id="Pick<?=$key?>_company" data-select2-id="Pick<?=$key?>_company" name="Pick<?=$key?>_company"<?=(($i ==0) ? ' autofocus' : '')?>>
<?
if(!empty($pick['bsid']))
echo '<option value="'.$pick['bsid'].'" selected=selected>'.$pick['company'].'</option>';
?>
</select>

If the above pick[bsid] is not empty,the tag is rendered serverside and acts like it should.

Here are the options im using to init select2

var lookupSelect2Options = {
	templateSelection: formatSelect,
	templateResult: formatList,
	placeholder:'',
	minimumInputLength: 2,
	allowClear: true,
	multiple: true,
	tags: true,
	closeOnSelect: true,
	maximumSelectionLength: 1,
	ajax: {
		url: 'my url goes here ',
		dataType: 'json',
		delay: 575, //same delay as the .delay handler in book_js.api
		cache: false, //dont cache this
		data: function(params){
			return {
				q:params.term,
				type:$(this).data('type')
			}
		},
		processResults: function(data){
			return data
		}
	}
}

The only real problem is that the tag is deleted on click, almost like I clicked the little X on the left side of the tag. Pls halp

#2

so many weird little customization problems we just ripped it out and are now using tomselect.