JSFiddle - React, Tailwind, and code Playground

CSS

@CHARSET"UTF-8";
 .table_odd {
  background-color: #EEEEEE;
}
.table_even {
  background-color: #DDDDDD;
}

JavaScript

(function ($) {

  $.widget("ui.table", {
    options: {
      name: "table",
      default_controls: [{
        id: 'first',
        icon: 'ui-icon-arrowthickstop-1-w'
      }, {
        id: 'previous',
        icon: 'ui-icon-arrowthick-1-w'
      }, {
        id: 'next',
        icon: 'ui-icon-arrowthick-1-e'
      }, {
        id: 'last',
        icon: 'ui-icon-arrowthickstop-1-e'
      }],
      controls: [],
      page_size: 30,
      page: 1,
      page_count: 1,
      oddclass: 'table_odd',
      evenclass: 'table_even'
    },

    _init: function () {},

    _create: function () {
      $(this).data('old_content', this.element.html());
      this.options.oddcolor = $('.ui-state-default').css('background-color');
      this.options.controls = this.options.default_controls.concat(this.options.controls);
      // création de la barre de navigation
      var chaine = "<ul id='" + this._getId("navBar") + "' style='list-style:none;'>";
      for (var i = 0; i < this.options.controls.length; i++) {
        chaine += this._getControl(this.options.controls[i]['id'], this.options.controls[i]['icon']);
      }
      chaine += "</ul><div style='clear:both;'>&nbsp;</div>";
      chaine += "<table id='" + this._getId("table") + "'></table>";
      this.element.html(chaine);
      this._createHeader();
      this.getValues();
      this.options.page_count = (this.options.provider.getCount() / this.options.page_size);
      var self = this;
      var classe = this._getId('controls');
      $('.' + classe).click(

      function () {
        var methode = $(this).attr('id').replace(new RegExp('^' + self.options.name + '_'), '');
        self[methode]();
      });
    },
    destroy: function () {
      this.element.html($(this).data('old_content'));
      // call the original destroy method since we overwrote it
      $.Widget.prototype.destroy.call(this);
    },

    first: function () {
      this._setOption('page', 1);
    },
    next: function () {
     ...