@finqu/cool 1.0.0

package/js/dist/coolselect.js

@@ -0,0 +1,796 @@
+/*!
+  * Cool UI coolselect.js v1.0.0 (https://finqu.fi)
+  * Copyright 2011-2019 Finqu Oy
+  * Licensed under the ISC license - (http://opensource.org/licenses/ISC)
+  */
+(function (global, factory) {
+	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+	typeof define === 'function' && define.amd ? define(factory) :
+	(global = global || self, global.CoolSelect = factory());
+}(this, function () { 'use strict';
+
+	const {
+	  jQuery
+	} = window;
+
+	const debounce = function (func, wait, immediate) {
+	  var timeout;
+	  return function () {
+	    var context = this,
+	        args = arguments;
+
+	    var later = function () {
+	      timeout = null;
+	      if (!immediate) func.apply(context, args);
+	    };
+
+	    var callNow = immediate && !timeout;
+	    clearTimeout(timeout);
+	    timeout = setTimeout(later, wait);
+	    if (callNow) func.apply(context, args);
+	  };
+	};
+
+	const touchEvents = function () {
+	  if ('ontouchstart' in window || window.DocumentTouch && document instanceof DocumentTouch) {
+	    return true;
+	  }
+	};
+
+	class AbstractUIComponent {
+	  // Create callback
+	  onCreate() {
+	    var onCreate = this.opts.onCreate;
+
+	    if (typeof onCreate === 'function') {
+	      onCreate.call(this.el);
+	    }
+	  } // Update callback
+
+
+	  onUpdate() {
+	    var onUpdate = this.opts.onUpdate;
+
+	    if (typeof onUpdate === 'function') {
+	      onUpdate.call(this.el);
+	    }
+	  } // Destroy callback
+
+
+	  onDestroy() {
+	    var onDestroy = this.opts.onDestroy;
+
+	    if (typeof onDestroy === 'function') {
+	      onDestroy.call(this.el);
+	    }
+	  } // Show callback
+
+
+	  onShow() {
+	    var onShow = this.opts.onShow;
+
+	    if (typeof onShow === 'function') {
+	      onShow.call(this.el);
+	    }
+	  } // Close callback
+
+
+	  onClose() {
+	    var onClose = this.opts.onClose;
+
+	    if (typeof onClose === 'function') {
+	      onClose.call(this.el);
+	    }
+	  }
+
+	  debug(...args) {
+	    if (this.opts.debug) {
+	      if (typeof this.opts.debug === 'function') {
+	        this.opts.debug(...args);
+	      } else {
+	        console.log(...args);
+	      }
+	    }
+	  }
+
+	}
+
+	const NAME = 'coolSelect';
+	const DATA_KEY = 'plugin_coolSelect';
+
+	class CoolSelect extends AbstractUIComponent {
+	  constructor(el, opts) {
+	    super();
+	    this.el = el;
+	    this.opts = jQuery.extend({}, jQuery.fn[NAME].defaults, opts);
+	    this.name = null;
+	    this.scrollContentHeight = null;
+	    this.items = [];
+	    this.data = {};
+	    this.searchData = []; // search api URL to query data
+
+	    this.searchApi = this.opts.searchApi; // Tells which type the select objects are (radio|select)
+
+	    this.type = null; // Is the content visible?
+
+	    this.contentOpen = null; // Tells if we have a search in our element
+
+	    this.showSearch = null; // Tells if we have a footer in our element
+
+	    this.showFooter = null; // For custom scroll function callback to store the object
+	    // in order to update the scroll
+
+	    this.scroll = null;
+	    this.init();
+	  } // Init plugin
+
+
+	  init() {
+	    jQuery.when(this.buildCache()).then(() => {
+	      this.buildScroll();
+	      this.bindEvents();
+
+	      if (this.data[this.name].length > 0) {
+	        this.setData();
+	      }
+
+	      this.onCreate();
+	    });
+	  } // Remove plugin instance completely
+
+
+	  destroy() {
+	    this.unbindEvents();
+	    this.$el.removeData();
+	    this.onDestroy();
+	  } // Update plugin data
+
+
+	  update() {
+	    this.buildCache();
+	    this.bindEvents();
+	    this.onUpdate();
+	  } // Cache DOM nodes for performance
+
+
+	  buildCache() {
+	    this.$el = jQuery(this.el);
+	    this.$selectHeader = this.$el.find('.select-header');
+	    this.$selectIconContainer = this.$selectHeader.find('.select-icon');
+	    this.name = this.$el.data('name') ? this.$el.data('name') : this.opts.name;
+	    this.scrollContentHeight = this.$el.data('scrollContentHeight') ? this.$el.data('scrollContentHeight') : this.opts.scrollContentHeight;
+	    this.items = this.$el.data('items') ? this.$el.data('items') : this.opts.items;
+	    this.data = {};
+	    this.data[this.name] = [];
+	    this.searchData = [];
+	    this.searchApi = this.$el.data('searchApi') ? this.$el.data('searchApi') : this.opts.searchApi;
+	    this.type = this.$el.data('type') ? this.$el.data('type') : this.opts.type;
+	    this.contentOpen = false;
+
+	    if (this.$el.data('setData') && this.$el.data('setData') != '') {
+	      this.data = this.$el.data('setData');
+	    }
+
+	    if (this.$el.find('.select-search')) {
+	      this.showSearch = true;
+	    } else {
+	      this.showSearch = this.$el.data('showSearch') ? this.$el.data('showSearch') : this.opts.showSearch;
+	    }
+
+	    if (this.$el.find('.select-footer')) {
+	      this.showFooter = true;
+	    } else {
+	      this.showFooter = this.$el.data('showFooter') ? this.$el.data('showFooter') : this.opts.showFooter;
+	    }
+
+	    if (this.items.length) {
+	      let items = this._renderItemList(this.items);
+
+	      this.$select = jQuery(`
+                <div class="select-content">
+
+                    ${this._renderSearch()}
+
+                    <div class="select-scrollable-content">${items}</div>
+
+                    ${this._renderFooter()}
+
+                </div>
+            `);
+	      this.$el.append(this.$select);
+	      this.$scrollableContent = this.$select.find('.select-scrollable-content') ? this.$select.find('.select-scrollable-content') : false;
+	      this.$selectItems = this.$select.find('.select-item');
+	      this.$selectLabels = this.$select.find('[data-label]');
+
+	      if (this.showSearch) {
+	        this.$searchContainer = this.$select.find('.select-search');
+	        this.$searchInput = this.$select.find('[name="select-search"]');
+	        this.$searchIconContainer = this.$select.find('.select-search-icon');
+	        this.$clearSearchButton = this.$select.find('[data-clear-search]');
+	      }
+
+	      if (this.showFooter) {
+	        this.$footerContainer = this.$select.find('.select-footer');
+	        this.$closeButton = this.$select.find('[data-select-close]');
+	      }
+
+	      jQuery.each(this.$selectLabels, function (i, el) {
+	        this.searchData.push({
+	          id: i,
+	          val: jQuery(el).text().trim()
+	        });
+	      });
+
+	      if (this.opts.debug) {
+	        this.debug(this.$el);
+	        this.debug(this.$select);
+	        this.debug(this.$scrollableContent);
+	        this.debug('Name: ' + this.name);
+	        this.debug('Show search: ' + this.showSearch);
+	        this.debug('Show footer: ' + this.showFooter);
+	        this.debug('Scroll content height: ' + this.scrollContentHeight + 'px');
+	        this.debug(this.items);
+	        this.debug(this.searchData);
+	      }
+	    } else {
+	      this.$select = this.$el.find('.select-content');
+	      this.$scrollableContent = this.$select.find('.select-scrollable-content');
+	      this.$selectItems = this.$select.find('.select-item');
+	      this.$selectLabels = this.$select.find('[data-label]');
+
+	      if (this.showSearch) {
+	        this.$searchContainer = this.$select.find('.select-search');
+	        this.$searchInput = this.$select.find('[name="select-search"]');
+	        this.$searchIconContainer = this.$select.find('.select-search-icon');
+	        this.$clearSearchButton = this.$select.find('[data-clear-search]');
+	      }
+
+	      if (this.showFooter) {
+	        this.$footerContainer = this.$select.find('.select-footer');
+	        this.$closeButton = this.$select.find('[data-select-close]');
+	      }
+
+	      jQuery.each(this.$selectLabels, (i, el) => {
+	        this.searchData.push({
+	          id: i,
+	          val: jQuery(el).text().trim()
+	        });
+	      });
+
+	      if (this.opts.debug) {
+	        this.debug(this.$el);
+	        this.debug(this.$select);
+	        this.debug(this.$scrollableContent);
+	        this.debug('Name: ' + this.name);
+	        this.debug('Show search: ' + this.showSearch);
+	        this.debug('Show footer: ' + this.showFooter);
+	        this.debug('Scroll content height: ' + this.scrollContentHeight + 'px');
+	        this.debug(this.items);
+	        this.debug(this.searchData);
+	      }
+
+	      return true;
+	    }
+	  } // Build scroll
+
+
+	  buildScroll() {
+	    if (this.$scrollableContent.length > 0) {
+	      var scrollContentHeight = this.scrollContentHeight;
+
+	      if (this.showSearch) {
+	        scrollContentHeight = scrollContentHeight - (this.$searchContainer.outerHeight(true) || 0);
+	      }
+
+	      if (this.showFooter) {
+	        scrollContentHeight = scrollContentHeight - (this.$footerContainer.outerHeight(true) || 0);
+	      }
+
+	      this.$scrollableContent.css({
+	        'max-height': scrollContentHeight - parseInt(this.$scrollableContent.css('marginTop'), 10) - parseInt(this.$scrollableContent.css('marginBottom'), 10) + 'px'
+	      });
+
+	      if (touchEvents || typeof this.opts.buildScroll !== 'function') {
+	        this.$scrollableContent.css({
+	          'overflow-y': 'auto'
+	        });
+	      } else if (typeof this.opts.buildScroll === 'function') {
+	        this.scroll = this.opts.buildScroll(this.$scrollableContent); // this.$scrollableContent.addClass('ps-dark');
+	        // this.scroll = new PerfectScrollbar(this.$scrollableContent[0], {
+	        //     wheelSpeed: 1,
+	        //     wheelPropagation: false,
+	        //     minScrollbarLength: 20,
+	        //     scrollYMarginOffset : -1,
+	        //     suppressScrollY: true,
+	        //     suppressScrollX: true,
+	        // });
+	        // if (this.$scrollableContent[0].offsetHeight < this.$scrollableContent[0].scrollHeight) {
+	        //     this.$scrollableContent.addClass('ps-show-rail-y');
+	        //     this.scroll.settings.suppressScrollY = false;
+	        // }
+	      }
+	    }
+	  } // Bind events that trigger methods
+
+
+	  bindEvents() {
+	    var plugin = this;
+	    plugin.$selectHeader.on('click' + '.' + NAME, function () {
+	      if (plugin.contentOpen) {
+	        plugin.close.call(plugin);
+	      } else {
+	        plugin.show.call(plugin);
+	      }
+	    });
+	    plugin.$el.on('change' + '.' + NAME, 'input[type="checkbox"]', function () {
+	      var val = jQuery(this).val();
+
+	      if (this.checked) {
+	        plugin.data[plugin.name].indexOf(val) === -1 ? plugin.data[plugin.name].push(val) : false;
+	      } else {
+	        plugin.data[plugin.name] = plugin.data[plugin.name].filter(n => n != val);
+	      }
+
+	      plugin.onSelect(this);
+	    });
+	    plugin.$el.on('change' + '.' + NAME, 'input[type="radio"]', function () {
+	      var val = jQuery(this).val();
+
+	      if (this.checked) {
+	        plugin.data[plugin.name] = val;
+	        plugin.$select.find('input[type="radio"]').not(jQuery(this)).prop('checked', false);
+	        plugin.$select.find('input[type="radio"]').not(jQuery(this)).removeClass('checked');
+	      } else {
+	        plugin.data[plugin.name] = [];
+	      }
+	    });
+	    plugin.$el.on('click' + '.' + NAME, 'input[type="radio"]', function () {
+	      if (jQuery(this).hasClass('checked')) {
+	        plugin.data[plugin.name] = [];
+	        jQuery(this).prop('checked', false);
+	        jQuery(this).removeClass('checked');
+	      } else {
+	        jQuery(this).addClass('checked');
+	      }
+
+	      plugin.onSelect(this);
+	    }); // if (this.scroll) {
+	    //     plugin.$scrollableContent.find('.ps__thumb-y').mousedown(function() {
+	    //         plugin.$scrollableContent.addClass('ps-mousedown-scroll');
+	    //     });
+	    //     $(document).mouseup(function() {
+	    //         if (plugin.$scrollableContent.hasClass('ps-mousedown-scroll')) {
+	    //             plugin.$scrollableContent.removeClass('ps-mousedown-scroll');
+	    //         }
+	    //     });
+	    // }
+
+	    if (this.showSearch) {
+	      plugin.$searchInput.on('keydown' + '.' + NAME, debounce(function () {
+	        plugin.searchString = jQuery(this).val().trim();
+	        plugin.search.call(plugin);
+	      }, 250));
+	      plugin.$searchInput.on('focusin' + '.' + NAME, function () {
+	        plugin.$searchContainer.addClass('focused');
+	      });
+	      plugin.$searchInput.on('focusout' + '.' + NAME, function () {
+	        plugin.$searchContainer.removeClass('focused');
+	      });
+	      plugin.$clearSearchButton.on('click' + '.' + NAME, function () {
+	        if (plugin.searchString.length) {
+	          plugin.$searchInput.val('');
+	          plugin.searchString = '';
+	          plugin.search.call(plugin);
+	        } else {
+	          return;
+	        }
+	      });
+	    }
+
+	    if (this.showFooter) {
+	      plugin.$closeButton.on('click' + '.' + NAME, function () {
+	        plugin.close.call(plugin);
+	      });
+	    }
+
+	    jQuery(document).on('touchstart click', function (e) {
+	      if (!plugin.$el.is(e.target) && plugin.$el.has(e.target).length === 0 && plugin.contentOpen) {
+	        plugin.close.call(plugin);
+	      }
+	    });
+	  } // Unbind events that trigger methods
+
+
+	  unbindEvents() {
+	    this.$el.off('.' + NAME);
+	  } // Get data
+
+
+	  getData(data) {
+	    if (data) {
+	      return this.data[data];
+	    } else {
+	      return this.data;
+	    }
+	  } // Set data
+
+
+	  setData() {
+	    var plugin = this;
+	    var type = null;
+	    this.$selectIconContainer.html('<i class="' + this.opts.faPro ? 'fal' : 'fas' + ' fa-check text-green icon"></i>');
+
+	    if (this.searchApi.length) {
+	      var searchUrl = this.searchApi;
+	      var itemCount = this.data[this.name].length;
+	      var currentCount = 0;
+	      this.data[this.name].forEach(function (value) {
+	        searchUrl += encodeURIComponent('#' + value);
+	        currentCount++;
+
+	        if (currentCount !== itemCount) {
+	          searchUrl += '+';
+	        }
+	      });
+	      app.request(searchUrl).success(function (data) {
+	        var items = data.map(function (item) {
+	          if (item.name) {
+	            var label = item.name;
+	          } else if (item.label) {
+	            var label = item.label;
+	          } else if (item.value) {
+	            var label = item.value;
+	          }
+
+	          return {
+	            id: item.id.toString(),
+	            label: label
+	          };
+	        });
+	        var items = items.filter(function (item) {
+	          return plugin.data[plugin.name].indexOf(item.id) > -1;
+	        });
+	        var result = jQuery(plugin._renderItemList(items)); // var result = $(plugin.hbs['ui/select/templates/partials/select-item']({
+	        //     selectType: plugin.type,
+	        //     selectName: plugin.name,
+	        //     items: items
+	        // })).i18n();
+
+	        jQuery.when(plugin.$scrollableContent.append(result)).then(function () {
+	          if (plugin.scroll && typeof plugin.scroll.update === 'function') {
+	            plugin.scroll.update();
+	          } // if (plugin.$scrollableContent[0].offsetHeight < plugin.$scrollableContent[0].scrollHeight) {
+	          //     plugin.scroll.update();
+	          //     plugin.scroll.settings.suppressScrollY = false;
+	          //     plugin.$scrollableContent.addClass('ps-show-rail-y');
+	          // } else {
+	          //     plugin.scroll.update();
+	          //     plugin.scroll.settings.suppressScrollY = true;
+	          //     plugin.$scrollableContent.removeClass('ps-show-rail-y');
+	          // }
+
+
+	          if (plugin.$select.find(':input[type="checkbox"]').length) {
+	            type = 'checkbox';
+	          } else if (plugin.$select.find(':input[type="radio"]').length) {
+	            type = 'radio';
+	          }
+
+	          if (type == 'checkbox') {
+	            plugin.data[plugin.name].forEach(function (value) {
+	              var $input = plugin.$select.find(':input').filter(function () {
+	                return this.value == value;
+	              });
+	              $input.prop('checked', true);
+	              plugin.onSelect($input[0]);
+	            });
+	          } else if (type == 'radio') {
+	            var $input = plugin.$select.find(':input').filter(function () {
+	              return this.value == plugin.data[plugin.name];
+	            });
+	            $input.prop('checked', true);
+	            $input.addClass('checked');
+	            plugin.onSelect($input[0]);
+	          }
+	        });
+	      }).get();
+	    } else {
+	      if (plugin.$select.find(':input[type="checkbox"]').length) {
+	        type = 'checkbox';
+	      } else if (plugin.$select.find(':input[type="radio"]').length) {
+	        type = 'radio';
+	      }
+
+	      if (type == 'checkbox') {
+	        this.data[this.name].forEach(function (value) {
+	          var $input = plugin.$select.find(':input').filter(function () {
+	            return this.value == value;
+	          });
+	          $input.prop('checked', true);
+	          plugin.onSelect($input[0]);
+	        });
+	      } else if (type == 'radio') {
+	        var $input = plugin.$select.find(':input').filter(function () {
+	          return this.value == plugin.data[plugin.name];
+	        });
+	        $input.prop('checked', true);
+	        $input.addClass('checked');
+	        plugin.onSelect($input[0]);
+	      }
+	    }
+	  } // Search
+
+
+	  search() {
+	    var plugin = this;
+
+	    if (this.searchString.length) {
+	      if (this.searchApi.length) {
+	        this.$scrollableContent.find('input:not(:checked)').parents('.select-item').not('.static-item').remove();
+	        app.request(this.searchApi + this.searchString).success(function (data) {
+	          var items = data.map(function (item) {
+	            return {
+	              id: item.id.toString(),
+	              label: item.name || item.label || item.value || null
+	            };
+	          });
+	          var items = items.filter(function (item) {
+	            return !(plugin.data[plugin.name].indexOf(item.id) > -1);
+	          }); // Remove 0 id from results
+
+	          var items = items.filter(function (item) {
+	            return [0].indexOf(item.id) > -1;
+	          });
+	          var result = jQuery(plugin._renderItemList(items));
+	          jQuery.when(plugin.$scrollableContent.append(result)).then(function () {
+	            if (this.scroll && typeof this.scroll.update === 'function') {
+	              this.scroll.update();
+	            } // plugin.$searchIconContainer.html('<i class="fal fa-times icon"></i>');
+	            // plugin.$searchIconContainer.attr('data-clear-search', 'true');
+	            // if (plugin.$scrollableContent[0].offsetHeight < plugin.$scrollableContent[0].scrollHeight) {
+	            //     plugin.scroll.update();
+	            //     plugin.scroll.settings.suppressScrollY = false;
+	            //     plugin.$scrollableContent.addClass('ps-show-rail-y');
+	            // } else {
+	            //     plugin.scroll.update();
+	            //     plugin.scroll.settings.suppressScrollY = true;
+	            //     plugin.$scrollableContent.removeClass('ps-show-rail-y');
+	            // }
+
+	          });
+	        }).get();
+	      } else {
+	        var results = this.searchData.filter(function (item) {
+	          return item.val.toLocaleLowerCase().indexOf(plugin.searchString.toLocaleLowerCase()) > -1;
+	        });
+	        this.$selectItems.removeClass('d-none');
+	        this.$selectItems.removeClass('visible');
+	        results.forEach(function (item) {
+	          jQuery(plugin.$selectItems[item.id]).addClass('visible');
+	        });
+	        this.$selectItems.not('.visible').addClass('d-none');
+	        this.$searchIconContainer.html('<i class="' + this.opts.faPro ? 'fal' : 'fas' + ' fa-times icon"></i>');
+	        this.$searchIconContainer.attr('data-clear-search', 'true');
+	      }
+	    } else {
+	      if (this.searchApi.length) {
+	        this.$scrollableContent.find('input:not(:checked)').parents('.select-item').not('.static-item').remove();
+	        this.$searchIconContainer.html('<i class="' + this.opts.faPro ? 'fal' : 'fas' + ' fa-search icon"></i>');
+	        this.$searchIconContainer.attr('data-clear-search', '');
+	      } else {
+	        this.$selectItems.removeClass('d-none');
+	        this.$selectItems.removeClass('visible');
+	        this.$searchIconContainer.html('<i class="' + this.opts.faPro ? 'fal' : 'fas' + ' fa-search icon"></i>');
+	        this.$searchIconContainer.attr('data-clear-search', '');
+	      }
+	    }
+
+	    if (this.scroll && typeof this.scroll.update === 'function') {
+	      this.scroll.update();
+	    }
+
+	    this.onUpdate();
+	  } // Show
+
+
+	  show() {
+	    if (this.$el.hasClass('show')) {
+	      return;
+	    }
+
+	    var $otherSelects = jQuery('.select.show');
+
+	    if ($otherSelects.length) {
+	      var zindex = parseInt($otherSelects.first().css('z-index'), 10) + 2;
+	    }
+
+	    this.$el.css({
+	      'max-height': this.scrollContentHeight + this.$selectHeader.outerHeight(true) + 'px'
+	    });
+	    this.$el.addClass('show');
+
+	    if (!$otherSelects.length) {
+	      var zindex = parseInt(this.$el.css('z-index'), 10) + 1;
+	    }
+
+	    this.$el.css({
+	      'z-index': zindex
+	    });
+
+	    if (this.scroll && typeof this.scroll.show === 'function') {
+	      this.scroll.update(); // if (this.$scrollableContent[0].offsetHeight < this.$scrollableContent[0].scrollHeight) {
+	      //     this.$scrollableContent[0].scrollTop = 1;
+	      //     this.$scrollableContent[0].scrollTop = 0;
+	      // }
+	    }
+
+	    this.$selectIconContainer.html(`<i class="${this.opts.faPro ? 'fal' : 'fas'} fa-angle-up"></i`);
+	    this.contentOpen = true;
+	    this.onShow();
+	  } // Close
+
+
+	  close() {
+	    var plugin = this;
+	    this.$el.css('max-height', '');
+	    this.$el.removeClass('show');
+	    setTimeout(() => {
+	      plugin.$el.removeAttr('style');
+	    }, 300);
+
+	    if (this.data[this.name].length > 0) {
+	      this.$selectIconContainer.html(`<i class="${this.opts.faPro ? 'fal' : 'fas'} fa-check text-green icon"></i>`);
+	    } else {
+	      this.$selectIconContainer.html(`<i class="${this.opts.faPro ? 'fal' : 'fas'} fa-angle-down"></i>`);
+	    }
+
+	    this.contentOpen = false;
+	    this.onClose();
+	  }
+
+	  onSelect(el) {
+	    var onSelect = this.opts.onSelect;
+
+	    if (typeof onSelect === 'function') {
+	      onSelect.call(el);
+	    }
+	  }
+
+	  _renderItemList(items) {
+	    let html = '';
+
+	    for (let i = 0; i < items.length; ++i) {
+	      html += `
+                <div class="select-item">
+
+                    <div class="select-item-${this.type}">
+
+                        <div class="styled-${this.type}">">
+
+                            <input type="${this.type}">" id="select-${this.name}-${items[i].id}" value="${items[i].id}">
+
+                            <label for="select-${this.name}-${items[i].id}">
+
+                                <span class="radio-inner">
+                                    <svg viewBox="0 0 18 18">
+                                        <polyline points="1.5 6 4.5 9 10.5 1"></polyline>
+                                    </svg>
+                                </span>
+
+                                <span class="${this.type}">-label" data-label>
+                                    ${items[i].label}
+                                </span>
+
+                            </label>
+
+                        </div>
+
+                    </div>
+
+                </div>
+            `;
+	    }
+	  }
+
+	  _renderSearch() {
+	    if (!this.showSearch) {
+	      return '';
+	    }
+
+	    return `
+            <div class="select-search">
+
+                <div class="select-search-input">
+
+                    <input type="text" name="select-search" value="" placeholder="${this.opts.searchPlaceholder}">
+
+                </div>
+
+                <div class="select-search-icon">
+
+                    <i class="${this.opts.faPro ? 'fal' : 'fas'} fa-search icon"></i>
+
+                </div>
+
+            </div>
+        `;
+	  }
+
+	  _renderFooter() {
+	    if (!this.showFooter) {
+	      return '';
+	    }
+
+	    return `
+            <div class="select-footer">
+
+                <button class="btn btn-primary" type="button" data-select-close>
+                    ${this.opts.btnCloseText}
+                </button>
+
+            </div>
+        `;
+	  }
+
+	  static _jQueryInterface(config) {
+	    return this.each(function () {
+	      let data = jQuery(this).data(DATA_KEY);
+
+	      const _config = typeof config === 'object' && config;
+
+	      if (!data) {
+	        data = new CoolSelect(this, _config);
+	        jQuery(this).data(DATA_KEY, data);
+	      }
+
+	      if (typeof config === 'string') {
+	        if (typeof data[config] === 'undefined') {
+	          throw new TypeError(`No method named "${config}"`);
+	        }
+
+	        data[config]();
+	      }
+	    });
+	  }
+
+	}
+
+	if (typeof jQuery !== 'undefined') {
+	  // jQuery
+	  const JQUERY_NO_CONFLICT = jQuery.fn[NAME];
+	  jQuery.fn[NAME] = CoolSelect._jQueryInterface;
+	  jQuery.fn[NAME].Constructor = CoolSelect;
+
+	  jQuery.fn[NAME].noConflict = () => {
+	    jQuery.fn[NAME] = JQUERY_NO_CONFLICT;
+	    return CoolSelect._jQueryInterface;
+	  };
+
+	  jQuery.fn[NAME].defaults = {
+	    name: '',
+	    type: 'checkbox',
+	    scrollContentHeight: 100,
+	    faPro: false,
+	    items: [],
+	    showSearch: false,
+	    showFooter: false,
+	    searchApi: false,
+	    onCreate: null,
+	    onUpdate: null,
+	    onDestroy: null,
+	    onShow: null,
+	    onClose: null,
+	    onSearch: null,
+	    onSelect: null,
+	    // function that should return object with update method
+	    buildScroll: null,
+	    searchPlaceholder: null,
+	    btnCloseText: null,
+	    debug: false
+	  };
+	}
+
+	return CoolSelect;
+
+}));
+//# sourceMappingURL=coolselect.js.map