Как создать собственный клиентский фильтр для Tockify?

Question

Я пытаюсь создать пользовательский фильтр тегов на стороне клиента для использования со встроенным календарем API Tockify. Мне бы хотелось, чтобы фильтры отображались над календарем и могли фильтровать события по тегам. У Tockify есть возможность фильтровать по тэгам, но я бы хотел иметь второй вариант фильтрации для пользователей (причина, по которой я пытаюсь кодировать второй).

Проблема, с которой я столкнулся при использовании API Tockify, заключается в том, что что я не могу понять, как они реализовали свой фильтр (я думаю, что они используют AngularJS), и я не могу найти классы для целевой аудитории. Я попытался проверить календарь с помощью инструментов веб-разработчика и даже просмотрел исходный код, но все еще не могу понять.

Я ценю любую предоставленную помощь.

Код, который я использую ниже.

HTML

<ul class="filters">
    <li class="filters__item">
        <a href="#" class="filters__btn  js-filter" data-tockify-tags="all">All</a>
    </li>
    <li class="filters__item">
        <a href="#" class="filters__btn  js-filter" data-tockify-tags="Nature">Nature</a>
    </li>
    <li class="filters__item">
        <a href="#" class="filters__btn  js-filter" data-tockify-tags="Healthcare">Healthcare</a>
    </li>
    <li class="filters__item">
        <a href="#" class="filters__btn  js-filter" data-tockify-tags="Free">Free</a>
    </li>
    <li class="filters__item">
        <a href="#" class="filters__btn  js-filter" data-tockify-tags="Festival">Festival</a>
    </li>
</ul>

<div data-tockify-calendar="spirited" data-tockify-component="calendar"></div>

<script data-cfasync="false" data-tockify-script="embed" src="https://public.tockify.com/browser/embed.js"></script>

Я пытался настроить этот код, но не смог заставить его работать.

<span class="eventTags__tag d-tag eventTagColor--Healthcare" ng-repeat="tag in ev.tags"><a class="pincard__tag eventTagColor--Healthcare" href="" ng-click="filterByTag(tag,$event)"><span class="eventTags__text ng-binding">Healthcare</span></a></span>

CSS

.filters {
     margin: 0 0 1em;
     padding: 0;
}
 .filters__item {
     display: inline-block;
}
 .filters__btn {
     background: gray;
     color: white;
     display: inline-block;
     padding: 1em;
}
 .is-hidden {
     display: none;
}

JQuery

$(".js-filter").on("click", function() {
    var $tag = $(this).attr("data-tockify-tags");

    if ($tag == "all") {
        $(".eventTags__tag").removeClass("is-hidden");
    } else {
        $(".eventTags__tag").addClass("is-hidden");
        $(".eventTags__tag[data-tockify-tags=" + $tag + "]").removeClass(
            "is-hidden"
        );
    }
});

Ссылка на календарь Tockify

Ссылка на документацию API Tockify