JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/select2-bootstrap-5-theme.min.css">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>

<input type="text" class="form-control" id="first" name="testing" value="">
<input type="text" class="form-control" id="second" name="testing2" value="">
<select class="form-control input-field input-select" id="ata" name="psr_auto_key"></select>
<input type="text" class="form-control" id="third" name="testing3" value="">

JavaScript

$(document).ready(function() {
$('#first').focus();

$('#ata').select2({
theme: "bootstrap-5",
ajax: {
    url: 'https://api.github.com/search/repositories',
    dataType: 'json',
    data: function (params) {
      var query = {
        search: params.term,
        type: 'public'
      }
     }
  }
});

});