JSFiddle - React, Tailwind, and code Playground

by Kabir Hossain

HTML

<div class="ui-widget">
    <label for="tags">Tags:</label>
    <input id="tags" />
</div>

JavaScript

$(function () {
    var availableTags = [

        "one day", "tuesday today", "one", "day is tomorrow"


    ];

    function customFilter(array, terms) {
        arrayOfTerms = terms.split(" ");
        var term = $.map(arrayOfTerms, function (tm) {
             return $.ui.autocomplete.escapeRegex(tm);
        }).join('|');
       var matcher = new RegExp("\\b" + term, "i");
        return $.grep(array, function (value) {
           return matcher.test(value.label || value.value || value);
        });
    };

    $("#tags").autocomplete({
        source: availableTags,
        multiple: true,
        mustMatch: false
        ,source: function (request, response) {
            // delegate back to autocomplete, but extract the last term
            response(customFilter(
            availableTags, request.term));
        },
    });


});