@websy/websy-designs 1.4.11 → 1.4.13

package/dist/websy-designs-es6.js

@@ -538,13 +538,14 @@ var WebsyDatePicker = /*#__PURE__*/function () {
       } else if (event.target.classList.contains('websy-dp-cancel')) {
         this.close();
       } else if (event.target.classList.contains('clear-selection')) {
+        this.currentselection = [];
+        this.selectedRangeDates = [];
         this.selectRange(0, false);
 
         if (this.options.onClear) {
           this.options.onClear();
-        }
+        } // this.updateRange(0)
 
-        this.updateRange(0);
       }
     }
   }, {
@@ -1118,29 +1119,32 @@ var WebsyDatePicker = /*#__PURE__*/function () {
   }, {
     key: "selectRange",
     value: function selectRange(index) {
-      var _this6 = this;
-
       var confirm = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
 
       if (this.options.ranges[this.options.mode][index]) {
         this.selectedRangeDates = _toConsumableArray(this.options.ranges[this.options.mode][index].range);
-        this.currentselection = this.options.ranges[this.options.mode][index].range.map(function (d) {
-          if (_this6.options.mode === 'date' || _this6.options.mode === 'monthyear') {
-            return d.getTime();
-          } else {
-            return d;
-          }
-        });
+        this.currentselection = []; // this.currentselection = this.options.ranges[this.options.mode][index].range.map(d => {
+        //   if (this.options.mode === 'date' || this.options.mode === 'monthyear') {
+        //     return d.getTime()
+        //   }
+        //   else {
+        //     return d
+        //   }
+        // })
+
         this.selectedRange = +index;
         this.highlightRange();
         this.updateRange();
-        this.close(confirm, true);
+
+        if (confirm === true) {
+          this.close(confirm, true);
+        }
       }
     }
   }, {
     key: "selectCustomRange",
     value: function selectCustomRange(rangeInput) {
-      var _this7 = this;
+      var _this6 = this;
 
       this.selectedRange = -1;
       this.isContinuousRange = true; // if (rangeInput.length === 1) {
@@ -1156,13 +1160,13 @@ var WebsyDatePicker = /*#__PURE__*/function () {
       this.customRangeSelected = true;
       rangeInput.forEach(function (r, i) {
         if (i > 0) {
-          if (_this7.options.mode === 'date' || _this7.options.mode === 'monthyear') {
-            if (r.getTime() / _this7.oneDay - rangeInput[i - 1] / _this7.oneDay > 1) {
-              _this7.isContinuousRange = false;
+          if (_this6.options.mode === 'date' || _this6.options.mode === 'monthyear') {
+            if (r.getTime() / _this6.oneDay - rangeInput[i - 1] / _this6.oneDay > 1) {
+              _this6.isContinuousRange = false;
             }
-          } else if (_this7.options.mode === 'hour' || _this7.options.mode === 'year') {
+          } else if (_this6.options.mode === 'hour' || _this6.options.mode === 'year') {
             if (r - rangeInput[i - 1] > 1) {
-              _this7.isContinuousRange = false;
+              _this6.isContinuousRange = false;
             }
           }
         }
@@ -1241,27 +1245,27 @@ var WebsyDatePicker = /*#__PURE__*/function () {
   }, {
     key: "updateRange",
     value: function updateRange() {
-      var _this8 = this;
+      var _this7 = this;
 
       var range;
 
       if (this.selectedRange === -1) {
         var list = (this.currentselection.length > 0 ? this.currentselection : this.selectedRangeDates).map(function (d) {
-          if (_this8.options.mode === 'date') {
+          if (_this7.options.mode === 'date') {
             if (!d.toLocaleDateString) {
               d = new Date(d);
             }
 
             return d.toLocaleDateString();
-          } else if (_this8.options.mode === 'year') {
+          } else if (_this7.options.mode === 'year') {
             return d;
-          } else if (_this8.options.mode === 'monthyear') {
+          } else if (_this7.options.mode === 'monthyear') {
             if (!d.getMonth) {
               d = new Date(d);
             }
 
-            return "".concat(_this8.options.monthMap[d.getMonth()], " ").concat(d.getFullYear());
-          } else if (_this8.options.mode === 'hour') {
+            return "".concat(_this7.options.monthMap[d.getMonth()], " ").concat(d.getFullYear());
+          } else if (_this7.options.mode === 'hour') {
             return d;
           }
         });
@@ -1622,7 +1626,7 @@ var WebsyDragDrop = /*#__PURE__*/function () {
   }, {
     key: "render",
     value: function render() {
-      var _this9 = this;
+      var _this8 = this;
 
       var el = document.getElementById("".concat(this.elementId, "_container"));
 
@@ -1630,7 +1634,7 @@ var WebsyDragDrop = /*#__PURE__*/function () {
         this.measureItems();
         var html = "\n        <div id='".concat(this.elementId, "start_item' class='websy-dragdrop-item ").concat(this.options.items.length === 0 ? 'empty' : '', "' data-id='").concat(this.elementId, "start'>\n          <div id='").concat(this.elementId, "start_dropZone' class='websy-drop-zone droppable' data-index='start' data-side='start' data-id='").concat(this.elementId, "start' data-placeholder='").concat(this.options.dropPlaceholder, "'></div>\n        </div>\n      ");
         html += this.options.items.map(function (d, i) {
-          return _this9.createItemHtml(_this9.elementId, i, d);
+          return _this8.createItemHtml(_this8.elementId, i, d);
         }).join('');
         el.innerHTML = html;
         this.options.items.forEach(function (item, i) {
@@ -1655,7 +1659,7 @@ var WebsyDragDrop = /*#__PURE__*/function () {
 
 var WebsyDropdown = /*#__PURE__*/function () {
   function WebsyDropdown(elementId, options) {
-    var _this10 = this;
+    var _this9 = this;
 
     _classCallCheck(this, WebsyDropdown);
 
@@ -1704,10 +1708,10 @@ var WebsyDropdown = /*#__PURE__*/function () {
       el.addEventListener('mouseout', this.handleMouseOut.bind(this));
       el.addEventListener('mousemove', this.handleMouseMove.bind(this));
       var headerLabel = this.selectedItems.map(function (s) {
-        return _this10.options.items[s].label || _this10.options.items[s].value;
+        return _this9.options.items[s].label || _this9.options.items[s].value;
       }).join(this.options.multiValueDelimiter);
       var headerValue = this.selectedItems.map(function (s) {
-        return _this10.options.items[s].value || _this10.options.items[s].label;
+        return _this9.options.items[s].value || _this9.options.items[s].label;
       }).join(this.options.multiValueDelimiter);
       var html = "\n        <div id='".concat(this.elementId, "_container' class='websy-dropdown-container ").concat(this.options.disabled ? 'disabled' : '', " ").concat(this.options.disableSearch !== true ? 'with-search' : '', " ").concat(this.options.style, " ").concat(this.options.customActions.length > 0 ? 'with-actions' : '', "'>\n          <div id='").concat(this.elementId, "_header' class='websy-dropdown-header ").concat(this.selectedItems.length === 1 ? 'one-selected' : '', " ").concat(this.options.allowClear === true ? 'allow-clear' : '', "'>\n      ");
 
@@ -1780,9 +1784,15 @@ var WebsyDropdown = /*#__PURE__*/function () {
         scrollEl.scrollTo(0, 0);
       }
 
-      maskEl.classList.remove('active');
-      contentEl.classList.remove('active');
-      contentEl.classList.remove('on-top');
+      if (maskEl) {
+        maskEl.classList.remove('active');
+      }
+
+      if (contentEl) {
+        contentEl.classList.remove('active');
+        contentEl.classList.remove('on-top');
+      }
+
       var searchEl = document.getElementById("".concat(this.elementId, "_search"));
 
       if (searchEl) {
@@ -2001,10 +2011,10 @@ var WebsyDropdown = /*#__PURE__*/function () {
   }, {
     key: "renderItems",
     value: function renderItems() {
-      var _this11 = this;
+      var _this10 = this;
 
       var html = this.options.items.map(function (r, i) {
-        return "\n      <li data-index='".concat(r.index, "' class='websy-dropdown-item ").concat((r.classes || []).join(' '), " ").concat(_this11.selectedItems.indexOf(r.index) !== -1 ? 'active' : '', "'>").concat(r.label, "</li>\n    ");
+        return "\n      <li data-index='".concat(r.index, "' class='websy-dropdown-item ").concat((r.classes || []).join(' '), " ").concat(_this10.selectedItems.indexOf(r.index) !== -1 ? 'active' : '', "'>").concat(r.label, "</li>\n    ");
       }).join('');
       var el = document.getElementById("".concat(this.elementId, "_items"));
 
@@ -2240,16 +2250,16 @@ var WebsyForm = /*#__PURE__*/function () {
   }, {
     key: "checkRecaptcha",
     value: function checkRecaptcha() {
-      var _this12 = this;
+      var _this11 = this;
 
       return new Promise(function (resolve, reject) {
-        if (_this12.options.useRecaptcha === true) {
+        if (_this11.options.useRecaptcha === true) {
           // if (this.recaptchaValue) {                  
           grecaptcha.ready(function () {
             grecaptcha.execute(ENVIRONMENT.RECAPTCHA_KEY, {
               action: 'submit'
             }).then(function (token) {
-              _this12.apiService.add('google/checkrecaptcha', {
+              _this11.apiService.add('google/checkrecaptcha', {
                 grecaptcharesponse: token
               }).then(function (response) {
                 if (response.success && response.success === true) {
@@ -2312,14 +2322,14 @@ var WebsyForm = /*#__PURE__*/function () {
   }, {
     key: "processComponents",
     value: function processComponents(components, callbackFn) {
-      var _this13 = this;
+      var _this12 = this;
 
       if (components.length === 0) {
         callbackFn();
       } else {
         components.forEach(function (c) {
           if (typeof WebsyDesigns[c.component] !== 'undefined') {
-            c.instance = new WebsyDesigns[c.component]("".concat(_this13.elementId, "_input_").concat(c.field, "_component"), c.options);
+            c.instance = new WebsyDesigns[c.component]("".concat(_this12.elementId, "_input_").concat(c.field, "_component"), c.options);
           } else {// some user feedback here
           }
         });
@@ -2340,7 +2350,7 @@ var WebsyForm = /*#__PURE__*/function () {
   }, {
     key: "render",
     value: function render(update, data) {
-      var _this14 = this;
+      var _this13 = this;
 
       var el = document.getElementById(this.elementId);
       var componentsToProcess = [];
@@ -2350,11 +2360,11 @@ var WebsyForm = /*#__PURE__*/function () {
         this.options.fields.forEach(function (f, i) {
           if (f.component) {
             componentsToProcess.push(f);
-            html += "\n            ".concat(i > 0 ? '-->' : '', "<div class='").concat(f.classes || '', "'>\n              ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '', "\n              <div id='").concat(_this14.elementId, "_input_").concat(f.field, "_component' class='form-component'></div>\n            </div><!--\n          ");
+            html += "\n            ".concat(i > 0 ? '-->' : '', "<div class='").concat(f.classes || '', "'>\n              ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '', "\n              <div id='").concat(_this13.elementId, "_input_").concat(f.field, "_component' class='form-component'></div>\n            </div><!--\n          ");
           } else if (f.type === 'longtext') {
-            html += "\n            ".concat(i > 0 ? '-->' : '', "<div class='").concat(f.classes || '', "'>\n              ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '', "\n              <textarea\n                id=\"").concat(_this14.elementId, "_input_").concat(f.field, "\"\n                ").concat(f.required === true ? 'required' : '', " \n                placeholder=\"").concat(f.placeholder || '', "\"\n                name=\"").concat(f.field, "\" \n                ").concat((f.attributes || []).join(' '), "\n                class=\"websy-input websy-textarea\"\n              ></textarea>\n            </div><!--\n          ");
+            html += "\n            ".concat(i > 0 ? '-->' : '', "<div class='").concat(f.classes || '', "'>\n              ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '', "\n              <textarea\n                id=\"").concat(_this13.elementId, "_input_").concat(f.field, "\"\n                ").concat(f.required === true ? 'required' : '', " \n                placeholder=\"").concat(f.placeholder || '', "\"\n                name=\"").concat(f.field, "\" \n                ").concat((f.attributes || []).join(' '), "\n                class=\"websy-input websy-textarea\"\n              ></textarea>\n            </div><!--\n          ");
           } else {
-            html += "\n            ".concat(i > 0 ? '-->' : '', "<div class='").concat(f.classes || '', "'>\n              ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '', "\n              <input \n                id=\"").concat(_this14.elementId, "_input_").concat(f.field, "\"\n                ").concat(f.required === true ? 'required' : '', " \n                type=\"").concat(f.type || 'text', "\" \n                class=\"websy-input\" \n                ").concat((f.attributes || []).join(' '), "\n                name=\"").concat(f.field, "\" \n                placeholder=\"").concat(f.placeholder || '', "\"\n                value=\"").concat(f.value || '', "\"\n                valueAsDate=\"").concat(f.type === 'date' ? f.value : '', "\"\n                oninvalidx=\"this.setCustomValidity('").concat(f.invalidMessage || 'Please fill in this field.', "')\"\n              />\n            </div><!--\n          ");
+            html += "\n            ".concat(i > 0 ? '-->' : '', "<div class='").concat(f.classes || '', "'>\n              ").concat(f.label ? "<label for=\"".concat(f.field, "\">").concat(f.label, "</label>") : '', "\n              <input \n                id=\"").concat(_this13.elementId, "_input_").concat(f.field, "\"\n                ").concat(f.required === true ? 'required' : '', " \n                type=\"").concat(f.type || 'text', "\" \n                class=\"websy-input\" \n                ").concat((f.attributes || []).join(' '), "\n                name=\"").concat(f.field, "\" \n                placeholder=\"").concat(f.placeholder || '', "\"\n                value=\"").concat(f.value || '', "\"\n                valueAsDate=\"").concat(f.type === 'date' ? f.value : '', "\"\n                oninvalidx=\"this.setCustomValidity('").concat(f.invalidMessage || 'Please fill in this field.', "')\"\n              />\n            </div><!--\n          ");
           }
         });
         html += "\n        --><button class=\"websy-btn submit ".concat(this.options.submit.classes || '', "\">").concat(this.options.submit.text || 'Save', "</button>").concat(this.options.cancel ? '<!--' : '', "\n      ");
@@ -2371,7 +2381,7 @@ var WebsyForm = /*#__PURE__*/function () {
 
         el.innerHTML = html;
         this.processComponents(componentsToProcess, function () {
-          if (_this14.options.useRecaptcha === true && typeof grecaptcha !== 'undefined') {// this.recaptchaReady()
+          if (_this13.options.useRecaptcha === true && typeof grecaptcha !== 'undefined') {// this.recaptchaReady()
           }
         });
       }
@@ -2379,7 +2389,7 @@ var WebsyForm = /*#__PURE__*/function () {
   }, {
     key: "submitForm",
     value: function submitForm() {
-      var _this15 = this;
+      var _this14 = this;
 
       var formEl = document.getElementById("".concat(this.elementId, "Form"));
 
@@ -2393,32 +2403,32 @@ var WebsyForm = /*#__PURE__*/function () {
               data[key] = value;
             });
 
-            if (_this15.options.url) {
-              var _this15$apiService;
+            if (_this14.options.url) {
+              var _this14$apiService;
 
-              var params = [_this15.options.url];
+              var params = [_this14.options.url];
 
-              if (_this15.options.mode === 'update') {
-                params.push(_this15.options.id);
+              if (_this14.options.mode === 'update') {
+                params.push(_this14.options.id);
               }
 
               params.push(data);
 
-              (_this15$apiService = _this15.apiService)[_this15.options.mode].apply(_this15$apiService, params).then(function (result) {
-                if (_this15.options.clearAfterSave === true) {
+              (_this14$apiService = _this14.apiService)[_this14.options.mode].apply(_this14$apiService, params).then(function (result) {
+                if (_this14.options.clearAfterSave === true) {
                   // this.render()
                   formEl.reset();
                 }
 
-                _this15.options.onSuccess.call(_this15, result);
+                _this14.options.onSuccess.call(_this14, result);
               }, function (err) {
                 console.log('Error submitting form data:', err);
 
-                _this15.options.onError.call(_this15, err);
+                _this14.options.onError.call(_this14, err);
               });
-            } else if (_this15.options.submitFn) {
-              _this15.options.submitFn(data, function () {
-                if (_this15.options.clearAfterSave === true) {
+            } else if (_this14.options.submitFn) {
+              _this14.options.submitFn(data, function () {
+                if (_this14.options.clearAfterSave === true) {
                   // this.render()
                   formEl.reset();
                 }
@@ -2438,17 +2448,17 @@ var WebsyForm = /*#__PURE__*/function () {
   }, {
     key: "data",
     set: function set(d) {
-      var _this16 = this;
+      var _this15 = this;
 
       if (!this.options.fields) {
         this.options.fields = [];
       }
 
       var _loop = function _loop(key) {
-        _this16.options.fields.forEach(function (f) {
+        _this15.options.fields.forEach(function (f) {
           if (f.field === key) {
             f.value = d[key];
-            var el = document.getElementById("".concat(_this16.elementId, "_input_").concat(f.field));
+            var el = document.getElementById("".concat(_this15.elementId, "_input_").concat(f.field));
             el.value = f.value;
           }
         });
@@ -2502,8 +2512,11 @@ var WebsyLoadingDialog = /*#__PURE__*/function () {
     key: "hide",
     value: function hide() {
       var el = document.getElementById(this.elementId);
-      el.classList.remove('loading');
-      el.innerHTML = '';
+
+      if (el) {
+        el.classList.remove('loading');
+        el.innerHTML = '';
+      }
     }
   }, {
     key: "render",
@@ -2649,11 +2662,11 @@ var WebsyNavigationMenu = /*#__PURE__*/function () {
   }, {
     key: "handleSearch",
     value: function handleSearch(searchText) {
-      var _this17 = this;
+      var _this16 = this;
 
       var el = document.getElementById(this.elementId);
       var lowestItems = this.flatItems.filter(function (d) {
-        return d.level === _this17.maxLevel;
+        return d.level === _this16.maxLevel;
       });
       var visibleItems = lowestItems;
       var defaultMethod = 'remove';
@@ -2661,7 +2674,7 @@ var WebsyNavigationMenu = /*#__PURE__*/function () {
       if (searchText.length > 1) {
         defaultMethod = 'add';
         visibleItems = lowestItems.filter(function (d) {
-          return d[_this17.options.searchProp].toLowerCase().indexOf(searchText.toLowerCase()) !== -1;
+          return d[_this16.options.searchProp].toLowerCase().indexOf(searchText.toLowerCase()) !== -1;
         });
       } // hide everything
 
@@ -2845,7 +2858,7 @@ var WebsyNavigationMenu = /*#__PURE__*/function () {
 
 var Pager = /*#__PURE__*/function () {
   function Pager(elementId, options) {
-    var _this18 = this;
+    var _this17 = this;
 
     _classCallCheck(this, Pager);
 
@@ -2898,8 +2911,8 @@ var Pager = /*#__PURE__*/function () {
           allowClear: false,
           disableSearch: true,
           onItemSelected: function onItemSelected(selectedItem) {
-            if (_this18.options.onChangePageSize) {
-              _this18.options.onChangePageSize(selectedItem.value);
+            if (_this17.options.onChangePageSize) {
+              _this17.options.onChangePageSize(selectedItem.value);
             }
           }
         });
@@ -2923,13 +2936,13 @@ var Pager = /*#__PURE__*/function () {
   }, {
     key: "render",
     value: function render() {
-      var _this19 = this;
+      var _this18 = this;
 
       var el = document.getElementById("".concat(this.elementId, "_pageList"));
 
       if (el) {
         var pages = this.options.pages.map(function (item, index) {
-          return "<li data-index=\"".concat(index, "\" class=\"websy-page-num ").concat(_this19.options.activePage === index ? 'active' : '', "\">").concat(index + 1, "</li>");
+          return "<li data-index=\"".concat(index, "\" class=\"websy-page-num ").concat(_this18.options.activePage === index ? 'active' : '', "\">").concat(index + 1, "</li>");
         });
         var startIndex = 0;
 
@@ -2997,58 +3010,58 @@ var WebsyPDFButton = /*#__PURE__*/function () {
   _createClass(WebsyPDFButton, [{
     key: "handleClick",
     value: function handleClick(event) {
-      var _this20 = this;
+      var _this19 = this;
 
       if (event.target.classList.contains('websy-pdf-button')) {
         this.loader.show();
         setTimeout(function () {
-          if (_this20.options.targetId) {
-            var el = document.getElementById(_this20.options.targetId);
+          if (_this19.options.targetId) {
+            var el = document.getElementById(_this19.options.targetId);
 
             if (el) {
               var pdfData = {
                 options: {}
               };
 
-              if (_this20.options.pdfOptions) {
-                pdfData.options = _extends({}, _this20.options.pdfOptions);
+              if (_this19.options.pdfOptions) {
+                pdfData.options = _extends({}, _this19.options.pdfOptions);
               }
 
-              if (_this20.options.header) {
-                if (_this20.options.header.elementId) {
-                  var headerEl = document.getElementById(_this20.options.header.elementId);
+              if (_this19.options.header) {
+                if (_this19.options.header.elementId) {
+                  var headerEl = document.getElementById(_this19.options.header.elementId);
 
                   if (headerEl) {
                     pdfData.header = headerEl.outerHTML;
 
-                    if (_this20.options.header.css) {
-                      pdfData.options.headerCSS = _this20.options.header.css;
+                    if (_this19.options.header.css) {
+                      pdfData.options.headerCSS = _this19.options.header.css;
                     }
                   }
-                } else if (_this20.options.header.html) {
-                  pdfData.header = _this20.options.header.html;
+                } else if (_this19.options.header.html) {
+                  pdfData.header = _this19.options.header.html;
 
-                  if (_this20.options.header.css) {
-                    pdfData.options.headerCSS = _this20.options.header.css;
+                  if (_this19.options.header.css) {
+                    pdfData.options.headerCSS = _this19.options.header.css;
                   }
                 } else {
-                  pdfData.header = _this20.options.header;
+                  pdfData.header = _this19.options.header;
                 }
               }
 
-              if (_this20.options.footer) {
-                if (_this20.options.footer.elementId) {
-                  var footerEl = document.getElementById(_this20.options.footer.elementId);
+              if (_this19.options.footer) {
+                if (_this19.options.footer.elementId) {
+                  var footerEl = document.getElementById(_this19.options.footer.elementId);
 
                   if (footerEl) {
                     pdfData.footer = footerEl.outerHTML;
 
-                    if (_this20.options.footer.css) {
-                      pdfData.options.footerCSS = _this20.options.footer.css;
+                    if (_this19.options.footer.css) {
+                      pdfData.options.footerCSS = _this19.options.footer.css;
                     }
                   }
                 } else {
-                  pdfData.footer = _this20.options.footer;
+                  pdfData.footer = _this19.options.footer;
                 }
               }
 
@@ -3057,31 +3070,31 @@ var WebsyPDFButton = /*#__PURE__*/function () {
               // document.getElementById(`${this.elementId}_pdfFooter`).value = pdfData.footer
               // document.getElementById(`${this.elementId}_form`).submit()
 
-              _this20.service.add('', pdfData, {
+              _this19.service.add('', pdfData, {
                 responseType: 'blob'
               }).then(function (response) {
-                _this20.loader.hide();
+                _this19.loader.hide();
 
                 var blob = new Blob([response], {
                   type: 'application/pdf'
                 });
                 var msg = "\n                <div class='text-center websy-pdf-download'>\n                  <div>Your file is ready to download</div>\n                  <a href='".concat(URL.createObjectURL(blob), "' target='_blank'\n              ");
 
-                if (_this20.options.directDownload === true) {
+                if (_this19.options.directDownload === true) {
                   var fileName;
 
-                  if (typeof _this20.options.fileName === 'function') {
-                    fileName = _this20.options.fileName() || 'Export';
+                  if (typeof _this19.options.fileName === 'function') {
+                    fileName = _this19.options.fileName() || 'Export';
                   } else {
-                    fileName = _this20.options.fileName || 'Export';
+                    fileName = _this19.options.fileName || 'Export';
                   }
 
                   msg += "download='".concat(fileName, ".pdf'");
                 }
 
-                msg += "\n                  >\n                    <button class='websy-btn download-pdf'>".concat(_this20.options.buttonText, "</button>\n                  </a>\n                </div>\n              ");
+                msg += "\n                  >\n                    <button class='websy-btn download-pdf'>".concat(_this19.options.buttonText, "</button>\n                  </a>\n                </div>\n              ");
 
-                _this20.popup.show({
+                _this19.popup.show({
                   message: msg,
                   mask: true
                 });
@@ -3282,7 +3295,7 @@ var WebsyPubSub = /*#__PURE__*/function () {
 
 var ResponsiveText = /*#__PURE__*/function () {
   function ResponsiveText(elementId, options) {
-    var _this21 = this;
+    var _this20 = this;
 
     _classCallCheck(this, ResponsiveText);
 
@@ -3295,7 +3308,7 @@ var ResponsiveText = /*#__PURE__*/function () {
     this.elementId = elementId;
     this.canvas = document.createElement('canvas');
     window.addEventListener('resize', function () {
-      return _this21.render();
+      return _this20.render();
     });
     var el = document.getElementById(this.elementId);
 
@@ -3514,7 +3527,7 @@ var ResponsiveText = /*#__PURE__*/function () {
 
 var WebsyResultList = /*#__PURE__*/function () {
   function WebsyResultList(elementId, options) {
-    var _this22 = this;
+    var _this21 = this;
 
     _classCallCheck(this, WebsyResultList);
 
@@ -3546,9 +3559,9 @@ var WebsyResultList = /*#__PURE__*/function () {
 
     if (_typeof(options.template) === 'object' && options.template.url) {
       this.templateService.get(options.template.url).then(function (templateString) {
-        _this22.options.template = templateString;
+        _this21.options.template = templateString;
 
-        _this22.render();
+        _this21.render();
       });
     } else {
       this.render();
@@ -3568,7 +3581,7 @@ var WebsyResultList = /*#__PURE__*/function () {
   }, {
     key: "buildHTML",
     value: function buildHTML(d) {
-      var _this23 = this;
+      var _this22 = this;
 
       var startIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
       var inputTemplate = arguments.length > 2 ? arguments[2] : undefined;
@@ -3578,7 +3591,7 @@ var WebsyResultList = /*#__PURE__*/function () {
       if (this.options.template) {
         if (d.length > 0) {
           d.forEach(function (row, ix) {
-            var template = "".concat(ix > 0 ? '-->' : '').concat(inputTemplate || _this23.options.template).concat(ix < d.length - 1 ? '<!--' : ''); // find conditional elements
+            var template = "".concat(ix > 0 ? '-->' : '').concat(inputTemplate || _this22.options.template).concat(ix < d.length - 1 ? '<!--' : ''); // find conditional elements
 
             var ifMatches = _toConsumableArray(template.matchAll(/<\s*if[^>]*>([\s\S]*?)<\s*\/\s*if>/g));
 
@@ -3683,7 +3696,7 @@ var WebsyResultList = /*#__PURE__*/function () {
                 parts.forEach(function (p) {
                   items = items[p];
                 });
-                template = template.replace(m[0], _this23.buildHTML(items, 0, withoutFor, [].concat(_toConsumableArray(locator), ["".concat(startIndex + ix, ":").concat(c)])));
+                template = template.replace(m[0], _this22.buildHTML(items, 0, withoutFor, [].concat(_toConsumableArray(locator), ["".concat(startIndex + ix, ":").concat(c)])));
               }
             });
 
@@ -3695,7 +3708,7 @@ var WebsyResultList = /*#__PURE__*/function () {
               }
             });
 
-            var flatRow = _this23.flattenObject(row);
+            var flatRow = _this22.flattenObject(row);
 
             for (var key in flatRow) {
               var rg = new RegExp("{".concat(key, "}"), 'gm');
@@ -3830,13 +3843,13 @@ var WebsyResultList = /*#__PURE__*/function () {
   }, {
     key: "render",
     value: function render() {
-      var _this24 = this;
+      var _this23 = this;
 
       if (this.options.entity) {
         this.apiService.get(this.options.entity).then(function (results) {
-          _this24.rows = results.rows;
+          _this23.rows = results.rows;
 
-          _this24.resize();
+          _this23.resize();
         });
       } else {
         this.resize();
@@ -3922,14 +3935,14 @@ var WebsyRouter = /*#__PURE__*/function () {
   _createClass(WebsyRouter, [{
     key: "addGroup",
     value: function addGroup(group) {
-      var _this25 = this;
+      var _this24 = this;
 
       if (!this.groups[group]) {
         var els = document.querySelectorAll(".websy-view[data-group=\"".concat(group, "\"]"));
 
         if (els) {
           this.getClosestParent(els[0], function (parent) {
-            _this25.groups[group] = {
+            _this24.groups[group] = {
               activeView: '',
               views: [],
               parent: parent.getAttribute('data-view')
@@ -3992,7 +4005,7 @@ var WebsyRouter = /*#__PURE__*/function () {
   }, {
     key: "removeUrlParams",
     value: function removeUrlParams() {
-      var _this26 = this;
+      var _this25 = this;
 
       var params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
       var reloadView = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
@@ -4006,7 +4019,7 @@ var WebsyRouter = /*#__PURE__*/function () {
 
       if (this.currentParams && this.currentParams.items) {
         params.forEach(function (p) {
-          delete _this26.currentParams.items[p];
+          delete _this25.currentParams.items[p];
         });
         path = this.buildUrlPath(this.currentParams.items);
       }
@@ -4370,12 +4383,12 @@ var WebsyRouter = /*#__PURE__*/function () {
   }, {
     key: "showComponents",
     value: function showComponents(view) {
-      var _this27 = this;
+      var _this26 = this;
 
       if (this.options.views && this.options.views[view] && this.options.views[view].components) {
         this.options.views[view].components.forEach(function (c) {
           if (typeof c.instance === 'undefined') {
-            _this27.prepComponent(c.elementId, c.options);
+            _this26.prepComponent(c.elementId, c.options);
 
             c.instance = new c.Component(c.elementId, c.options);
           } else if (c.instance.render) {
@@ -4752,7 +4765,7 @@ var Switch = /*#__PURE__*/function () {
 
 var WebsyTemplate = /*#__PURE__*/function () {
   function WebsyTemplate(elementId, options) {
-    var _this28 = this;
+    var _this27 = this;
 
     _classCallCheck(this, WebsyTemplate);
 
@@ -4778,9 +4791,9 @@ var WebsyTemplate = /*#__PURE__*/function () {
 
     if (_typeof(options.template) === 'object' && options.template.url) {
       this.templateService.get(options.template.url).then(function (templateString) {
-        _this28.options.template = templateString;
+        _this27.options.template = templateString;
 
-        _this28.render();
+        _this27.render();
       });
     } else {
       this.render();
@@ -4790,7 +4803,7 @@ var WebsyTemplate = /*#__PURE__*/function () {
   _createClass(WebsyTemplate, [{
     key: "buildHTML",
     value: function buildHTML() {
-      var _this29 = this;
+      var _this28 = this;
 
       var html = "";
 
@@ -4852,14 +4865,14 @@ var WebsyTemplate = /*#__PURE__*/function () {
                 }
 
                 if (polarity === true) {
-                  if (typeof _this29.options.data[parts[0]] !== 'undefined' && _this29.options.data[parts[0]] === parts[1]) {
+                  if (typeof _this28.options.data[parts[0]] !== 'undefined' && _this28.options.data[parts[0]] === parts[1]) {
                     // remove the <if> tags
                     removeAll = false;
                   } else if (parts[0] === parts[1]) {
                     removeAll = false;
                   }
                 } else if (polarity === false) {
-                  if (typeof _this29.options.data[parts[0]] !== 'undefined' && _this29.options.data[parts[0]] !== parts[1]) {
+                  if (typeof _this28.options.data[parts[0]] !== 'undefined' && _this28.options.data[parts[0]] !== parts[1]) {
                     // remove the <if> tags
                     removeAll = false;
                   }
@@ -5149,7 +5162,7 @@ var WebsyUtils = {
 
 var WebsyTable = /*#__PURE__*/function () {
   function WebsyTable(elementId, options) {
-    var _this30 = this;
+    var _this29 = this;
 
     _classCallCheck(this, WebsyTable);
 
@@ -5187,8 +5200,8 @@ var WebsyTable = /*#__PURE__*/function () {
           allowClear: false,
           disableSearch: true,
           onItemSelected: function onItemSelected(selectedItem) {
-            if (_this30.options.onChangePageSize) {
-              _this30.options.onChangePageSize(selectedItem.value);
+            if (_this29.options.onChangePageSize) {
+              _this29.options.onChangePageSize(selectedItem.value);
             }
           }
         });
@@ -5209,7 +5222,7 @@ var WebsyTable = /*#__PURE__*/function () {
   _createClass(WebsyTable, [{
     key: "appendRows",
     value: function appendRows(data) {
-      var _this31 = this;
+      var _this30 = this;
 
       this.hideError();
       var bodyHTML = '';
@@ -5217,15 +5230,15 @@ var WebsyTable = /*#__PURE__*/function () {
       if (data) {
         bodyHTML += data.map(function (r, rowIndex) {
           return '<tr>' + r.map(function (c, i) {
-            if (_this31.options.columns[i].show !== false) {
+            if (_this30.options.columns[i].show !== false) {
               var style = '';
 
               if (c.style) {
                 style += c.style;
               }
 
-              if (_this31.options.columns[i].width) {
-                style += "width: ".concat(_this31.options.columns[i].width, "; ");
+              if (_this30.options.columns[i].width) {
+                style += "width: ".concat(_this30.options.columns[i].width, "; ");
               }
 
               if (c.backgroundColor) {
@@ -5240,18 +5253,18 @@ var WebsyTable = /*#__PURE__*/function () {
                 style += "color: ".concat(c.color, "; ");
               }
 
-              if (_this31.options.columns[i].showAsLink === true && c.value.trim() !== '') {
-                return "\n                <td \n                  data-row-index='".concat(_this31.rowCount + rowIndex, "' \n                  data-col-index='").concat(i, "' \n                  class='").concat(_this31.options.columns[i].classes || '', "' \n                  style='").concat(style, "'\n                  colspan='").concat(c.colspan || 1, "'\n                  rowspan='").concat(c.rowspan || 1, "'\n                >\n                  <a href='").concat(c.value, "' target='").concat(_this31.options.columns[i].openInNewTab === true ? '_blank' : '_self', "'>").concat(c.displayText || _this31.options.columns[i].linkText || c.value, "</a>\n                </td>\n              ");
-              } else if ((_this31.options.columns[i].showAsNavigatorLink === true || _this31.options.columns[i].showAsRouterLink === true) && c.value.trim() !== '') {
-                return "\n                <td \n                  data-view='".concat(c.value, "' \n                  data-row-index='").concat(_this31.rowCount + rowIndex, "' \n                  data-col-index='").concat(i, "' \n                  class='websy-trigger trigger-item ").concat(_this31.options.columns[i].clickable === true ? 'clickable' : '', " ").concat(_this31.options.columns[i].classes || '', "' \n                  style='").concat(style, "'\n                  colspan='").concat(c.colspan || 1, "'\n                  rowspan='").concat(c.rowspan || 1, "'\n                >").concat(c.displayText || _this31.options.columns[i].linkText || c.value, "</td>\n              ");
+              if (_this30.options.columns[i].showAsLink === true && c.value.trim() !== '') {
+                return "\n                <td \n                  data-row-index='".concat(_this30.rowCount + rowIndex, "' \n                  data-col-index='").concat(i, "' \n                  class='").concat(_this30.options.columns[i].classes || '', "' \n                  style='").concat(style, "'\n                  colspan='").concat(c.colspan || 1, "'\n                  rowspan='").concat(c.rowspan || 1, "'\n                >\n                  <a href='").concat(c.value, "' target='").concat(_this30.options.columns[i].openInNewTab === true ? '_blank' : '_self', "'>").concat(c.displayText || _this30.options.columns[i].linkText || c.value, "</a>\n                </td>\n              ");
+              } else if ((_this30.options.columns[i].showAsNavigatorLink === true || _this30.options.columns[i].showAsRouterLink === true) && c.value.trim() !== '') {
+                return "\n                <td \n                  data-view='".concat(c.value, "' \n                  data-row-index='").concat(_this30.rowCount + rowIndex, "' \n                  data-col-index='").concat(i, "' \n                  class='websy-trigger trigger-item ").concat(_this30.options.columns[i].clickable === true ? 'clickable' : '', " ").concat(_this30.options.columns[i].classes || '', "' \n                  style='").concat(style, "'\n                  colspan='").concat(c.colspan || 1, "'\n                  rowspan='").concat(c.rowspan || 1, "'\n                >").concat(c.displayText || _this30.options.columns[i].linkText || c.value, "</td>\n              ");
               } else {
                 var info = c.value;
 
-                if (_this31.options.columns[i].showAsImage === true) {
+                if (_this30.options.columns[i].showAsImage === true) {
                   c.value = "\n                  <img src='".concat(c.value, "'>\n                ");
                 }
 
-                return "\n                <td \n                  data-info='".concat(info, "' \n                  data-row-index='").concat(_this31.rowCount + rowIndex, "' \n                  data-col-index='").concat(i, "' \n                  class='").concat(_this31.options.columns[i].classes || '', "' \n                  style='").concat(style, "'\n                  colspan='").concat(c.colspan || 1, "'\n                  rowspan='").concat(c.rowspan || 1, "'\n                >").concat(c.value, "</td>\n              ");
+                return "\n                <td \n                  data-info='".concat(info, "' \n                  data-row-index='").concat(_this30.rowCount + rowIndex, "' \n                  data-col-index='").concat(i, "' \n                  class='").concat(_this30.options.columns[i].classes || '', "' \n                  style='").concat(style, "'\n                  colspan='").concat(c.colspan || 1, "'\n                  rowspan='").concat(c.rowspan || 1, "'\n                >").concat(c.value, "</td>\n              ");
               }
             }
           }).join('') + '</tr>';
@@ -5423,7 +5436,7 @@ var WebsyTable = /*#__PURE__*/function () {
   }, {
     key: "render",
     value: function render(data) {
-      var _this32 = this;
+      var _this31 = this;
 
       if (!this.options.columns) {
         return;
@@ -5458,7 +5471,7 @@ var WebsyTable = /*#__PURE__*/function () {
             style += "width: ".concat(c.width || 'auto', ";");
           }
 
-          return "\n        <th style=\"".concat(style, "\">\n          <div class =\"tableHeader\">\n            <div class=\"leftSection\">\n              <div\n                class=\"tableHeaderField ").concat(['asc', 'desc'].indexOf(c.sort) !== -1 ? 'sortable-column' : '', "\"\n                data-index=\"").concat(i, "\"                \n                data-sort=\"").concat(c.sort, "\"                \n              >\n                ").concat(c.name, "\n              </div>\n            </div>\n            <div class=\"").concat(c.activeSort ? c.sort + ' sortOrder' : '', "\"></div>\n            <!--").concat(c.searchable === true ? _this32.buildSearchIcon(c.qGroupFieldDefs[0]) : '', "-->\n          </div>\n        </th>\n        ");
+          return "\n        <th style=\"".concat(style, "\">\n          <div class =\"tableHeader\">\n            <div class=\"leftSection\">\n              <div\n                class=\"tableHeaderField ").concat(['asc', 'desc'].indexOf(c.sort) !== -1 ? 'sortable-column' : '', "\"\n                data-index=\"").concat(i, "\"                \n                data-sort=\"").concat(c.sort, "\"                \n              >\n                ").concat(c.name, "\n              </div>\n            </div>\n            <div class=\"").concat(c.activeSort ? c.sort + ' sortOrder' : '', "\"></div>\n            <!--").concat(c.searchable === true ? _this31.buildSearchIcon(c.qGroupFieldDefs[0]) : '', "-->\n          </div>\n        </th>\n        ");
         }
       }).join('') + '</tr>';
       var headEl = document.getElementById("".concat(this.elementId, "_head"));
@@ -5477,7 +5490,7 @@ var WebsyTable = /*#__PURE__*/function () {
 
         if (pagingEl) {
           var pages = new Array(this.options.pageCount).fill('').map(function (item, index) {
-            return "<li data-page=\"".concat(index, "\" class=\"websy-page-num ").concat(_this32.options.pageNum === index ? 'active' : '', "\">").concat(index + 1, "</li>");
+            return "<li data-page=\"".concat(index, "\" class=\"websy-page-num ").concat(_this31.options.pageNum === index ? 'active' : '', "\">").concat(index + 1, "</li>");
           });
           var startIndex = 0;
 
@@ -5545,7 +5558,7 @@ var WebsyTable = /*#__PURE__*/function () {
 
 var WebsyTable2 = /*#__PURE__*/function () {
   function WebsyTable2(elementId, options) {
-    var _this33 = this;
+    var _this32 = this;
 
     _classCallCheck(this, WebsyTable2);
 
@@ -5586,8 +5599,8 @@ var WebsyTable2 = /*#__PURE__*/function () {
           allowClear: false,
           disableSearch: true,
           onItemSelected: function onItemSelected(selectedItem) {
-            if (_this33.options.onChangePageSize) {
-              _this33.options.onChangePageSize(selectedItem.value);
+            if (_this32.options.onChangePageSize) {
+              _this32.options.onChangePageSize(selectedItem.value);
             }
           }
         });
@@ -5611,7 +5624,7 @@ var WebsyTable2 = /*#__PURE__*/function () {
   _createClass(WebsyTable2, [{
     key: "appendRows",
     value: function appendRows(data) {
-      var _this34 = this;
+      var _this33 = this;
 
       this.hideError();
       var bodyEl = document.getElementById("".concat(this.elementId, "_body"));
@@ -5620,15 +5633,15 @@ var WebsyTable2 = /*#__PURE__*/function () {
       if (data) {
         bodyHTML += data.map(function (r, rowIndex) {
           return '<tr>' + r.map(function (c, i) {
-            if (_this34.options.columns[i].show !== false) {
-              var style = "height: ".concat(_this34.options.cellSize, "px; line-height: ").concat(_this34.options.cellSize, "px;");
+            if (_this33.options.columns[i].show !== false) {
+              var style = "height: ".concat(_this33.options.cellSize, "px; line-height: ").concat(_this33.options.cellSize, "px;");
 
               if (c.style) {
                 style += c.style;
               }
 
-              if (_this34.options.columns[i].width) {
-                style += "width: ".concat(_this34.options.columns[i].width, "; ");
+              if (_this33.options.columns[i].width) {
+                style += "width: ".concat(_this33.options.columns[i].width, "; ");
               }
 
               if (c.backgroundColor) {
@@ -5643,18 +5656,18 @@ var WebsyTable2 = /*#__PURE__*/function () {
                 style += "color: ".concat(c.color, "; ");
               }
 
-              if (_this34.options.columns[i].showAsLink === true && c.value.trim() !== '') {
-                return "\n                <td \n                  data-row-index='".concat(_this34.rowCount + rowIndex, "' \n                  data-col-index='").concat(i, "' \n                  class='").concat(_this34.options.columns[i].classes || '', "' \n                  style='").concat(style, "'\n                  colspan='").concat(c.colspan || 1, "'\n                  rowspan='").concat(c.rowspan || 1, "'\n                >\n                  <a href='").concat(c.value, "' target='").concat(_this34.options.columns[i].openInNewTab === true ? '_blank' : '_self', "'>").concat(c.displayText || _this34.options.columns[i].linkText || c.value, "</a>\n                </td>\n              ");
-              } else if ((_this34.options.columns[i].showAsNavigatorLink === true || _this34.options.columns[i].showAsRouterLink === true) && c.value.trim() !== '') {
-                return "\n                <td \n                  data-view='".concat(c.value, "' \n                  data-row-index='").concat(_this34.rowCount + rowIndex, "' \n                  data-col-index='").concat(i, "' \n                  class='websy-trigger trigger-item ").concat(_this34.options.columns[i].clickable === true ? 'clickable' : '', " ").concat(_this34.options.columns[i].classes || '', "' \n                  style='").concat(style, "'\n                  colspan='").concat(c.colspan || 1, "'\n                  rowspan='").concat(c.rowspan || 1, "'\n                >").concat(c.displayText || _this34.options.columns[i].linkText || c.value, "</td>\n              ");
+              if (_this33.options.columns[i].showAsLink === true && c.value.trim() !== '') {
+                return "\n                <td \n                  data-row-index='".concat(_this33.rowCount + rowIndex, "' \n                  data-col-index='").concat(i, "' \n                  class='").concat(_this33.options.columns[i].classes || '', "' \n                  style='").concat(style, "'\n                  colspan='").concat(c.colspan || 1, "'\n                  rowspan='").concat(c.rowspan || 1, "'\n                >\n                  <a href='").concat(c.value, "' target='").concat(_this33.options.columns[i].openInNewTab === true ? '_blank' : '_self', "'>").concat(c.displayText || _this33.options.columns[i].linkText || c.value, "</a>\n                </td>\n              ");
+              } else if ((_this33.options.columns[i].showAsNavigatorLink === true || _this33.options.columns[i].showAsRouterLink === true) && c.value.trim() !== '') {
+                return "\n                <td \n                  data-view='".concat(c.value, "' \n                  data-row-index='").concat(_this33.rowCount + rowIndex, "' \n                  data-col-index='").concat(i, "' \n                  class='websy-trigger trigger-item ").concat(_this33.options.columns[i].clickable === true ? 'clickable' : '', " ").concat(_this33.options.columns[i].classes || '', "' \n                  style='").concat(style, "'\n                  colspan='").concat(c.colspan || 1, "'\n                  rowspan='").concat(c.rowspan || 1, "'\n                >").concat(c.displayText || _this33.options.columns[i].linkText || c.value, "</td>\n              ");
               } else {
                 var info = c.value;
 
-                if (_this34.options.columns[i].showAsImage === true) {
+                if (_this33.options.columns[i].showAsImage === true) {
                   c.value = "\n                  <img src='".concat(c.value, "'>\n                ");
                 }
 
-                return "\n                <td \n                  data-info='".concat(info, "' \n                  data-row-index='").concat(_this34.rowCount + rowIndex, "' \n                  data-col-index='").concat(i, "' \n                  class='").concat(_this34.options.columns[i].classes || '', "' \n                  style='").concat(style, "'\n                  colspan='").concat(c.colspan || 1, "'\n                  rowspan='").concat(c.rowspan || 1, "'\n                >").concat(c.value, "</td>\n              ");
+                return "\n                <td \n                  data-info='".concat(info, "' \n                  data-row-index='").concat(_this33.rowCount + rowIndex, "' \n                  data-col-index='").concat(i, "' \n                  class='").concat(_this33.options.columns[i].classes || '', "' \n                  style='").concat(style, "'\n                  colspan='").concat(c.colspan || 1, "'\n                  rowspan='").concat(c.rowspan || 1, "'\n                >").concat(c.value, "</td>\n              ");
               }
             }
           }).join('') + '</tr>';
@@ -5917,7 +5930,7 @@ var WebsyTable2 = /*#__PURE__*/function () {
   }, {
     key: "render",
     value: function render(data) {
-      var _this35 = this;
+      var _this34 = this;
 
       if (!this.options.columns) {
         return;
@@ -5953,7 +5966,7 @@ var WebsyTable2 = /*#__PURE__*/function () {
             style += "width: ".concat(c.width || 'auto', "; ");
           }
 
-          return "\n        <th style=\"".concat(style, "\">\n          <div class =\"tableHeader\">\n            <div class=\"leftSection\">\n              <div\n                class=\"tableHeaderField ").concat(['asc', 'desc'].indexOf(c.sort) !== -1 ? 'sortable-column' : '', "\"\n                data-sort-index=\"").concat(c.sortIndex || i, "\"\n                data-index=\"").concat(i, "\"\n                data-sort=\"").concat(c.sort, "\"\n                style=\"").concat(c.style || '', "\"                \n              >\n                ").concat(c.name, "\n              </div>\n            </div>\n            <div class=\"").concat(c.activeSort ? c.sort + ' sortOrder' : '', "\"></div>\n            ").concat(c.searchable === true ? _this35.buildSearchIcon(i) : '', "\n          </div>\n        </th>\n        ");
+          return "\n        <th style=\"".concat(style, "\">\n          <div class =\"tableHeader\">\n            <div class=\"leftSection\">\n              <div\n                class=\"tableHeaderField ").concat(['asc', 'desc'].indexOf(c.sort) !== -1 ? 'sortable-column' : '', "\"\n                data-sort-index=\"").concat(c.sortIndex || i, "\"\n                data-index=\"").concat(i, "\"\n                data-sort=\"").concat(c.sort, "\"\n                style=\"").concat(c.style || '', "\"                \n              >\n                ").concat(c.name, "\n              </div>\n            </div>\n            <div class=\"").concat(c.activeSort ? c.sort + ' sortOrder' : '', "\"></div>\n            ").concat(c.searchable === true ? _this34.buildSearchIcon(i) : '', "\n          </div>\n        </th>\n        ");
         }
       }).join('') + '</tr>';
       var headEl = document.getElementById("".concat(this.elementId, "_head"));
@@ -5964,7 +5977,7 @@ var WebsyTable2 = /*#__PURE__*/function () {
         var dropdownHTML = "";
         this.options.columns.forEach(function (c, i) {
           if (c.searchable && c.searchField) {
-            dropdownHTML += "\n            <div id=\"".concat(_this35.elementId, "_columnSearch_").concat(i, "\" class=\"websy-modal-dropdown\"></div>\n          ");
+            dropdownHTML += "\n            <div id=\"".concat(_this34.elementId, "_columnSearch_").concat(i, "\" class=\"websy-modal-dropdown\"></div>\n          ");
           }
         });
         dropdownEl.innerHTML = dropdownHTML;
@@ -5986,7 +5999,7 @@ var WebsyTable2 = /*#__PURE__*/function () {
 
         if (pagingEl) {
           var pages = new Array(this.options.pageCount).fill('').map(function (item, index) {
-            return "<li data-page=\"".concat(index, "\" class=\"websy-page-num ").concat(_this35.options.pageNum === index ? 'active' : '', "\">").concat(index + 1, "</li>");
+            return "<li data-page=\"".concat(index, "\" class=\"websy-page-num ").concat(_this34.options.pageNum === index ? 'active' : '', "\">").concat(index + 1, "</li>");
           });
           var startIndex = 0;
 
@@ -6077,7 +6090,7 @@ var WebsyTable2 = /*#__PURE__*/function () {
   }, {
     key: "getColumnParameters",
     value: function getColumnParameters(values) {
-      var _this36 = this;
+      var _this35 = this;
 
       var tableEl = document.getElementById("".concat(this.elementId, "_table"));
       tableEl.style.tableLayout = 'auto';
@@ -6085,10 +6098,10 @@ var WebsyTable2 = /*#__PURE__*/function () {
       var headEl = document.getElementById("".concat(this.elementId, "_head"));
       var bodyEl = document.getElementById("".concat(this.elementId, "_body"));
       headEl.innerHTML = '<tr style="visibility: hidden;">' + values.map(function (c, i) {
-        return "\n      <th>\n        <div class =\"tableHeader\">\n          <div class=\"leftSection\">\n            <div\n              class=\"tableHeaderField\"              \n            >\n              ".concat(c.value || 'nbsp;', "\n            </div>\n          </div>          \n          ").concat(c.searchable === true ? _this36.buildSearchIcon(i) : '', "\n        </div>\n      </th>\n    ");
+        return "\n      <th>\n        <div class =\"tableHeader\">\n          <div class=\"leftSection\">\n            <div\n              class=\"tableHeaderField\"              \n            >\n              ".concat(c.value || 'nbsp;', "\n            </div>\n          </div>          \n          ").concat(c.searchable === true ? _this35.buildSearchIcon(i) : '', "\n        </div>\n      </th>\n    ");
       }).join('') + '</tr>';
       bodyEl.innerHTML = '<tr style="visibility: hidden;">' + values.map(function (c) {
-        return "\n      <td                 \n        style='height: ".concat(_this36.options.cellSize, "px; line-height: ").concat(_this36.options.cellSize, "px; padding: 10px 5px;'\n      >").concat(c.value || '&nbsp;', "</td>\n    ");
+        return "\n      <td                 \n        style='height: ".concat(_this35.options.cellSize, "px; line-height: ").concat(_this35.options.cellSize, "px; padding: 10px 5px;'\n      >").concat(c.value || '&nbsp;', "</td>\n    ");
       }).join('') + '</tr>'; // get height of the first data cell
 
       var cells = bodyEl.querySelectorAll("tr:first-of-type td");
@@ -6216,7 +6229,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
   }, {
     key: "buildBodyHtml",
     value: function buildBodyHtml() {
-      var _this37 = this;
+      var _this36 = this;
 
       var data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
       var useWidths = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
@@ -6275,7 +6288,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
           } // console.log('rowspan', cell.rowspan)
 
 
-          bodyHtml += "<td \n          class='websy-table-cell ".concat((cell.classes || []).join(' '), "'\n          style='").concat(style, "'\n          data-info='").concat(cell.value, "'\n          colspan='").concat(cell.colspan || 1, "'\n          rowspan='").concat(cell.rowspan || 1, "'\n          data-row-index='").concat(rowIndex, "'\n          data-col-index='").concat(cellIndex, "'\n        "); // if (useWidths === true) {
+          bodyHtml += "<td \n          class='websy-table-cell ".concat(sizeIndex < _this36.pinnedColumns ? 'pinned' : 'unpinned', " ").concat((cell.classes || []).join(' '), "'\n          style='").concat(style, "'\n          data-info='").concat(cell.value, "'\n          colspan='").concat(cell.colspan || 1, "'\n          rowspan='").concat(cell.rowspan || 1, "'\n          data-row-index='").concat(rowIndex, "'\n          data-col-index='").concat(cellIndex, "'\n        "); // if (useWidths === true) {
           //   bodyHtml += `
           //     style='width: ${sizingColumns[cellIndex].width || sizingColumns[cellIndex].actualWidth}px!important'
           //     width='${sizingColumns[cellIndex].width || sizingColumns[cellIndex].actualWidth}'
@@ -6285,11 +6298,11 @@ var WebsyTable3 = /*#__PURE__*/function () {
           bodyHtml += "\n        ><div style='".concat(divStyle, "'>");
 
           if (cell.expandable === true) {
-            bodyHtml += "<i \n            data-row-index='".concat(rowIndex, "'\n            data-col-index='").concat(cell.level || cellIndex, "'\n            class='websy-table-cell-expand'\n          >").concat(_this37.options.plusIcon, "</i>");
+            bodyHtml += "<i \n            data-row-index='".concat(rowIndex, "'\n            data-col-index='").concat(cell.level || cellIndex, "'\n            class='websy-table-cell-expand'\n          >").concat(_this36.options.plusIcon, "</i>");
           }
 
           if (cell.collapsable === true) {
-            bodyHtml += "<i \n            data-row-index='".concat(rowIndex, "'\n            data-col-index='").concat(cell.level || cellIndex, "'\n            class='websy-table-cell-collapse'\n          >").concat(_this37.options.minusIcon, "</i>");
+            bodyHtml += "<i \n            data-row-index='".concat(rowIndex, "'\n            data-col-index='").concat(cell.level || cellIndex, "'\n            class='websy-table-cell-collapse'\n          >").concat(_this36.options.minusIcon, "</i>");
           }
 
           if (sizingColumns[sizeIndex].showAsLink === true && cell.value.trim() !== '') {
@@ -6314,7 +6327,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
   }, {
     key: "buildHeaderHtml",
     value: function buildHeaderHtml() {
-      var _this38 = this;
+      var _this37 = this;
 
       var useWidths = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
       var headerHtml = '';
@@ -6329,7 +6342,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
       }
 
       this.options.columns.forEach(function (row, rowIndex) {
-        if (useWidths === false && rowIndex !== _this38.options.columns.length - 1) {
+        if (useWidths === false && rowIndex !== _this37.options.columns.length - 1) {
           // if we're calculating the size we only want to render the last row of column headers
           return;
         }
@@ -6355,18 +6368,18 @@ var WebsyTable3 = /*#__PURE__*/function () {
           //   `
           // }
 
-          headerHtml += "><div style='".concat(divStyle, "'>").concat(col.name).concat(col.searchable === true ? _this38.buildSearchIcon(col, colIndex) : '', "</div></td>");
+          headerHtml += "><div style='".concat(divStyle, "'>").concat(col.name).concat(col.searchable === true ? _this37.buildSearchIcon(col, colIndex) : '', "</div></td>");
         });
         headerHtml += "</tr>";
       });
       var dropdownEl = document.getElementById("".concat(this.elementId, "_dropdownContainer"));
       this.options.columns[this.options.columns.length - 1].forEach(function (c, i) {
         if (c.searchable && c.isExternalSearch === true) {
-          var testEl = document.getElementById("".concat(_this38.elementId, "_columnSearch_").concat(c.dimId || i));
+          var testEl = document.getElementById("".concat(_this37.elementId, "_columnSearch_").concat(c.dimId || i));
 
           if (!testEl) {
             var newE = document.createElement('div');
-            newE.id = "".concat(_this38.elementId, "_columnSearch_").concat(c.dimId || i);
+            newE.id = "".concat(_this37.elementId, "_columnSearch_").concat(c.dimId || i);
             newE.className = 'websy-modal-dropdown';
             dropdownEl.appendChild(newE);
           }
@@ -6382,7 +6395,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
   }, {
     key: "buildTotalHtml",
     value: function buildTotalHtml() {
-      var _this39 = this;
+      var _this38 = this;
 
       var useWidths = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
 
@@ -6395,7 +6408,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
         totalHtml += "<td \n        class='websy-table-cell'\n        colspan='".concat(col.colspan || 1, "'\n        rowspan='").concat(col.rowspan || 1, "'\n      ");
 
         if (useWidths === true) {
-          totalHtml += "\n          style='width: ".concat(_this39.options.columns[_this39.options.columns.length - 1][colIndex].width || _this39.options.columns[_this39.options.columns.length - 1][colIndex].actualWidth, "px'\n          width='").concat(col.width || col.actualWidth, "'\n        ");
+          totalHtml += "\n          style='width: ".concat(_this38.options.columns[_this38.options.columns.length - 1][colIndex].width || _this38.options.columns[_this38.options.columns.length - 1][colIndex].actualWidth, "px'\n          width='").concat(col.width || col.actualWidth, "'\n        ");
         }
 
         totalHtml += "        \n        >\n        ".concat(col.value, "\n      </td>");
@@ -6406,7 +6419,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
   }, {
     key: "calculateSizes",
     value: function calculateSizes() {
-      var _this40 = this;
+      var _this39 = this;
 
       var sample = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
       var totalRowCount = arguments.length > 1 ? arguments[1] : undefined;
@@ -6449,32 +6462,32 @@ var WebsyTable3 = /*#__PURE__*/function () {
       rows.forEach(function (row, rowIndex) {
         Array.from(row.children).forEach(function (col, colIndex) {
           var colSize = col.getBoundingClientRect();
-          _this40.sizes.cellHeight = colSize.height;
+          _this39.sizes.cellHeight = colSize.height;
 
-          if (_this40.options.columns[_this40.options.columns.length - 1][colIndex]) {
-            if (!_this40.options.columns[_this40.options.columns.length - 1][colIndex].actualWidth) {
-              _this40.options.columns[_this40.options.columns.length - 1][colIndex].actualWidth = 0;
+          if (_this39.options.columns[_this39.options.columns.length - 1][colIndex]) {
+            if (!_this39.options.columns[_this39.options.columns.length - 1][colIndex].actualWidth) {
+              _this39.options.columns[_this39.options.columns.length - 1][colIndex].actualWidth = 0;
             }
 
-            _this40.options.columns[_this40.options.columns.length - 1][colIndex].actualWidth = Math.min(Math.max(_this40.options.columns[_this40.options.columns.length - 1][colIndex].actualWidth, colSize.width), maxWidth);
-            _this40.options.columns[_this40.options.columns.length - 1][colIndex].cellHeight = colSize.height;
+            _this39.options.columns[_this39.options.columns.length - 1][colIndex].actualWidth = Math.min(Math.max(_this39.options.columns[_this39.options.columns.length - 1][colIndex].actualWidth, colSize.width), maxWidth);
+            _this39.options.columns[_this39.options.columns.length - 1][colIndex].cellHeight = colSize.height;
 
-            if (colIndex >= _this40.pinnedColumns) {
-              firstNonPinnedColumnWidth = _this40.options.columns[_this40.options.columns.length - 1][colIndex].actualWidth;
+            if (colIndex >= _this39.pinnedColumns) {
+              firstNonPinnedColumnWidth = _this39.options.columns[_this39.options.columns.length - 1][colIndex].actualWidth;
             }
           }
         });
       });
       this.options.columns[this.options.columns.length - 1].forEach(function (col, colIndex) {
-        if (colIndex < _this40.pinnedColumns) {
-          _this40.sizes.scrollableWidth -= col.actualWidth;
+        if (colIndex < _this39.pinnedColumns) {
+          _this39.sizes.scrollableWidth -= col.actualWidth;
         }
       });
       this.sizes.totalWidth = this.options.columns[this.options.columns.length - 1].reduce(function (a, b) {
         return a + (b.width || b.actualWidth);
       }, 0);
       this.sizes.totalNonPinnedWidth = this.options.columns[this.options.columns.length - 1].filter(function (c, i) {
-        return i >= _this40.pinnedColumns;
+        return i >= _this39.pinnedColumns;
       }).reduce(function (a, b) {
         return a + (b.width || b.actualWidth);
       }, 0);
@@ -6495,10 +6508,10 @@ var WebsyTable3 = /*#__PURE__*/function () {
           c.actualWidth += equalWidth; //   }
           // }
 
-          _this40.sizes.totalWidth += c.width || c.actualWidth;
+          _this39.sizes.totalWidth += c.width || c.actualWidth;
 
-          if (i < _this40.pinnedColumns) {
-            _this40.sizes.totalNonPinnedWidth += c.width || c.actualWidth;
+          if (i < _this39.pinnedColumns) {
+            _this39.sizes.totalNonPinnedWidth += c.width || c.actualWidth;
           } // equalWidth = (outerSize.width - this.sizes.totalWidth) / (this.options.columns[this.options.columns.length - 1].length - (i + 1))
 
         });
@@ -6555,7 +6568,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
   }, {
     key: "createSample",
     value: function createSample(data) {
-      var _this41 = this;
+      var _this40 = this;
 
       var output = [];
       this.options.columns[this.options.columns.length - 1].forEach(function (col, colIndex) {
@@ -6567,7 +6580,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
           var longest = '';
 
           for (var i = 0; i < Math.min(data.length, 1000); i++) {
-            if (data[i].length === _this41.options.columns[_this41.options.columns.length - 1].length) {
+            if (data[i].length === _this40.options.columns[_this40.options.columns.length - 1].length) {
               if (longest.length < data[i][colIndex].value.length) {
                 longest = data[i][colIndex].value;
               }
@@ -6962,7 +6975,7 @@ var WebsyTable3 = /*#__PURE__*/function () {
 
 var WebsyChart = /*#__PURE__*/function () {
   function WebsyChart(elementId, options) {
-    var _this42 = this;
+    var _this41 = this;
 
     _classCallCheck(this, WebsyChart);
 
@@ -7013,22 +7026,22 @@ var WebsyChart = /*#__PURE__*/function () {
     this.invertOverride = function (input, input2) {
       var xAxis = 'bottomAxis';
 
-      if (_this42.options.orientation === 'horizontal') {
+      if (_this41.options.orientation === 'horizontal') {
         xAxis = 'leftAxis';
       }
 
-      var width = _this42[xAxis].step();
+      var width = _this41[xAxis].step();
 
       var output;
 
-      var domain = _toConsumableArray(_this42[xAxis].domain());
+      var domain = _toConsumableArray(_this41[xAxis].domain());
 
-      if (_this42.options.orientation === 'horizontal') {
+      if (_this41.options.orientation === 'horizontal') {
         domain = domain.reverse();
       }
 
       for (var j = 0; j < domain.length; j++) {
-        var breakA = _this42[xAxis](domain[j]) - width / 2;
+        var breakA = _this41[xAxis](domain[j]) - width / 2;
         var breakB = breakA + width;
 
         if (input > breakA && input <= breakB) {
@@ -7128,10 +7141,10 @@ var WebsyChart = /*#__PURE__*/function () {
   }, {
     key: "handleEventMouseMove",
     value: function handleEventMouseMove(event, d) {
-      var _this43 = this;
+      var _this42 = this;
 
       var bisectDate = d3.bisector(function (d) {
-        return _this43.parseX(d.x.value);
+        return _this42.parseX(d.x.value);
       }).left;
 
       if (this.options.showTrackingLine === true && d3.pointer(event)) {
@@ -7170,8 +7183,8 @@ var WebsyChart = /*#__PURE__*/function () {
         }
 
         this.options.data.series.forEach(function (s) {
-          if (_this43.options.data[xData].scale !== 'Time') {
-            xPoint = _this43[xAxis](_this43.parseX(xLabel));
+          if (_this42.options.data[xData].scale !== 'Time') {
+            xPoint = _this42[xAxis](_this42.parseX(xLabel));
             s.data.forEach(function (d) {
               if (d.x.value === xLabel) {
                 if (!tooltipTitle) {
@@ -7190,13 +7203,13 @@ var WebsyChart = /*#__PURE__*/function () {
             var pointA = s.data[index - 1];
             var pointB = s.data[index];
 
-            if (_this43.options.orientation === 'horizontal') {
+            if (_this42.options.orientation === 'horizontal') {
               pointA = _toConsumableArray(s.data).reverse()[index - 1];
               pointB = _toConsumableArray(s.data).reverse()[index];
             }
 
             if (pointA && !pointB) {
-              xPoint = _this43[xAxis](_this43.parseX(pointA.x.value));
+              xPoint = _this42[xAxis](_this42.parseX(pointA.x.value));
               tooltipTitle = pointA.x.value;
 
               if (!pointA.y.color) {
@@ -7206,12 +7219,12 @@ var WebsyChart = /*#__PURE__*/function () {
               tooltipData.push(pointA.y);
 
               if (typeof pointA.x.value.getTime !== 'undefined') {
-                tooltipTitle = d3.timeFormat(_this43.options.dateFormat || _this43.options.calculatedTimeFormatPattern)(pointA.x.value);
+                tooltipTitle = d3.timeFormat(_this42.options.dateFormat || _this42.options.calculatedTimeFormatPattern)(pointA.x.value);
               }
             }
 
             if (pointB && !pointA) {
-              xPoint = _this43[xAxis](_this43.parseX(pointB.x.value));
+              xPoint = _this42[xAxis](_this42.parseX(pointB.x.value));
               tooltipTitle = pointB.x.value;
 
               if (!pointB.y.color) {
@@ -7221,14 +7234,14 @@ var WebsyChart = /*#__PURE__*/function () {
               tooltipData.push(pointB.y);
 
               if (typeof pointB.x.value.getTime !== 'undefined') {
-                tooltipTitle = d3.timeFormat(_this43.options.dateFormat || _this43.options.calculatedTimeFormatPattern)(pointB.x.value);
+                tooltipTitle = d3.timeFormat(_this42.options.dateFormat || _this42.options.calculatedTimeFormatPattern)(pointB.x.value);
               }
             }
 
             if (pointA && pointB) {
-              var d0 = _this43[xAxis](_this43.parseX(pointA.x.value));
+              var d0 = _this42[xAxis](_this42.parseX(pointA.x.value));
 
-              var d1 = _this43[xAxis](_this43.parseX(pointB.x.value));
+              var d1 = _this42[xAxis](_this42.parseX(pointB.x.value));
 
               var mid = Math.abs(d0 - d1) / 2;
 
@@ -7237,7 +7250,7 @@ var WebsyChart = /*#__PURE__*/function () {
                 tooltipTitle = pointB.x.value;
 
                 if (typeof pointB.x.value.getTime !== 'undefined') {
-                  tooltipTitle = d3.timeFormat(_this43.options.dateFormat || _this43.options.calculatedTimeFormatPattern)(pointB.x.value);
+                  tooltipTitle = d3.timeFormat(_this42.options.dateFormat || _this42.options.calculatedTimeFormatPattern)(pointB.x.value);
                 }
 
                 if (!pointB.y.color) {
@@ -7250,7 +7263,7 @@ var WebsyChart = /*#__PURE__*/function () {
                 tooltipTitle = pointA.x.value;
 
                 if (typeof pointB.x.value.getTime !== 'undefined') {
-                  tooltipTitle = d3.timeFormat(_this43.options.dateFormat || _this43.options.calculatedTimeFormatPattern)(pointB.x.value);
+                  tooltipTitle = d3.timeFormat(_this42.options.dateFormat || _this42.options.calculatedTimeFormatPattern)(pointB.x.value);
                 }
 
                 if (!pointA.y.color) {
@@ -7364,7 +7377,7 @@ var WebsyChart = /*#__PURE__*/function () {
   }, {
     key: "render",
     value: function render(options) {
-      var _this44 = this;
+      var _this43 = this;
 
       /* global d3 options WebsyUtils */
       if (typeof options !== 'undefined') {
@@ -7433,7 +7446,7 @@ var WebsyChart = /*#__PURE__*/function () {
             var legendData = this.options.data.series.map(function (s, i) {
               return {
                 value: s.label || s.key,
-                color: s.color || _this44.options.colors[i % _this44.options.colors.length]
+                color: s.color || _this43.options.colors[i % _this43.options.colors.length]
               };
             });
 
@@ -7715,7 +7728,7 @@ var WebsyChart = /*#__PURE__*/function () {
 
             if (this.options.data.bottom.formatter) {
               bAxisFunc.tickFormat(function (d) {
-                return _this44.options.data.bottom.formatter(d);
+                return _this43.options.data.bottom.formatter(d);
               });
             }
 
@@ -7741,8 +7754,8 @@ var WebsyChart = /*#__PURE__*/function () {
 
           if (this.options.margin.axisLeft > 0) {
             this.leftAxisLayer.call(d3.axisLeft(this.leftAxis).ticks(this.options.data.left.ticks || 5).tickFormat(function (d) {
-              if (_this44.options.data.left.formatter) {
-                d = _this44.options.data.left.formatter(d);
+              if (_this43.options.data.left.formatter) {
+                d = _this43.options.data.left.formatter(d);
               }
 
               return d;
@@ -7779,8 +7792,8 @@ var WebsyChart = /*#__PURE__*/function () {
 
             if (this.options.margin.axisRight > 0 && (this.options.data.right.min !== 0 || this.options.data.right.max !== 0)) {
               this.rightAxisLayer.call(d3.axisRight(this.rightAxis).ticks(this.options.data.left.ticks || 5).tickFormat(function (d) {
-                if (_this44.options.data.right.formatter) {
-                  d = _this44.options.data.right.formatter(d);
+                if (_this43.options.data.right.formatter) {
+                  d = _this43.options.data.right.formatter(d);
                 }
 
                 return d;
@@ -7819,18 +7832,18 @@ var WebsyChart = /*#__PURE__*/function () {
           this.renderedKeys = {};
           this.options.data.series.forEach(function (series, index) {
             if (!series.key) {
-              series.key = _this44.createIdentity();
+              series.key = _this43.createIdentity();
             }
 
             if (!series.color) {
-              series.color = _this44.options.colors[index % _this44.options.colors.length];
+              series.color = _this43.options.colors[index % _this43.options.colors.length];
             }
 
-            _this44["render".concat(series.type || 'bar')](series, index);
+            _this43["render".concat(series.type || 'bar')](series, index);
 
-            _this44.renderLabels(series, index);
+            _this43.renderLabels(series, index);
 
-            _this44.renderedKeys[series.key] = series.type;
+            _this43.renderedKeys[series.key] = series.type;
           });
         }
       }
@@ -7838,17 +7851,17 @@ var WebsyChart = /*#__PURE__*/function () {
   }, {
     key: "renderarea",
     value: function renderarea(series, index) {
-      var _this45 = this;
+      var _this44 = this;
 
       /* global d3 series index */
       var drawArea = function drawArea(xAxis, yAxis, curveStyle) {
         return d3.area().x(function (d) {
-          return _this45[xAxis](_this45.parseX(d.x.value));
+          return _this44[xAxis](_this44.parseX(d.x.value));
         }).y0(function (d) {
-          return _this45[yAxis](0);
+          return _this44[yAxis](0);
         }).y1(function (d) {
-          return _this45[yAxis](isNaN(d.y.value) ? 0 : d.y.value);
-        }).curve(d3[curveStyle || _this45.options.curveStyle]);
+          return _this44[yAxis](isNaN(d.y.value) ? 0 : d.y.value);
+        }).curve(d3[curveStyle || _this44.options.curveStyle]);
       };
 
       var xAxis = 'bottomAxis';
@@ -7957,7 +7970,7 @@ var WebsyChart = /*#__PURE__*/function () {
         }
       }
 
-      bars.exit().transition(this.transition).style('stroke-opacity', 1e-6).remove();
+      bars.exit().transition(this.transition).style('fill-opacity', 1e-6).remove();
       bars.attr('width', getBarWidth.bind(this)).attr('height', getBarHeight.bind(this)).attr('x', getBarX.bind(this)).attr('y', getBarY.bind(this)).transition(this.transition).attr('fill', function (d) {
         return d.y.color || d.color || series.color;
       });
@@ -7968,10 +7981,16 @@ var WebsyChart = /*#__PURE__*/function () {
         return "bar bar_".concat(series.key);
       });
     }
+  }, {
+    key: "removebar",
+    value: function removebar(key) {
+      /* global key d3 */
+      var bars = this.barLayer.selectAll(".bar_".concat(key)).transition(this.transition).style('fill-opacity', 1e-6).remove();
+    }
   }, {
     key: "renderLabels",
     value: function renderLabels(series, index) {
-      var _this46 = this;
+      var _this45 = this;
 
       /* global series index d3 WebsyDesigns */
       var xAxis = 'bottomAxis';
@@ -7990,11 +8009,11 @@ var WebsyChart = /*#__PURE__*/function () {
         var labels = this.labelLayer.selectAll(".label_".concat(series.key)).data(series.data);
         labels.exit().transition(this.transition).style('stroke-opacity', 1e-6).remove();
         labels.attr('x', function (d) {
-          return getLabelX.call(_this46, d, series.labelPosition);
+          return getLabelX.call(_this45, d, series.labelPosition);
         }).attr('y', function (d) {
-          return getLabelY.call(_this46, d, series.labelPosition);
+          return getLabelY.call(_this45, d, series.labelPosition);
         }).attr('class', "label_".concat(series.key)).attr('fill', function (d) {
-          return _this46.options.labelColor || WebsyDesigns.WebsyUtils.getLightDark(d.y.color || d.color || series.color);
+          return _this45.options.labelColor || WebsyDesigns.WebsyUtils.getLightDark(d.y.color || d.color || series.color);
         }).style('font-size', "".concat(this.options.labelSize || this.options.fontSize, "px")).transition(this.transition).text(function (d) {
           return d.y.label || d.y.value;
         }).each(function (d, i) {
@@ -8019,11 +8038,11 @@ var WebsyChart = /*#__PURE__*/function () {
           }
         });
         labels.enter().append('text').attr('class', "label_".concat(series.key)).attr('x', function (d) {
-          return getLabelX.call(_this46, d, series.labelPosition);
+          return getLabelX.call(_this45, d, series.labelPosition);
         }).attr('y', function (d) {
-          return getLabelY.call(_this46, d, series.labelPosition);
+          return getLabelY.call(_this45, d, series.labelPosition);
         }).attr('alignment-baseline', 'central').attr('text-anchor', this.options.orientation === 'horizontal' ? 'left' : 'middle').attr('fill', function (d) {
-          return _this46.options.labelColor || WebsyDesigns.WebsyUtils.getLightDark(d.y.color || d.color || series.color);
+          return _this45.options.labelColor || WebsyDesigns.WebsyUtils.getLightDark(d.y.color || d.color || series.color);
         }).style('font-size', "".concat(this.options.labelSize || this.options.fontSize, "px")).text(function (d) {
           return d.y.label || d.y.value;
         }).each(function (d, i) {
@@ -8080,16 +8099,16 @@ var WebsyChart = /*#__PURE__*/function () {
   }, {
     key: "renderline",
     value: function renderline(series, index) {
-      var _this47 = this;
+      var _this46 = this;
 
       /* global series index d3 */
       var drawLine = function drawLine(xAxis, yAxis, curveStyle) {
         return d3.line().x(function (d) {
-          var adjustment = _this47.options.data[xAxis].scale === 'Time' ? 0 : _this47["".concat(xAxis, "Axis")].bandwidth() / 2;
-          return _this47["".concat(xAxis, "Axis")](_this47.parseX(d.x.value)) + adjustment;
+          var adjustment = _this46.options.data[xAxis].scale === 'Time' ? 0 : _this46["".concat(xAxis, "Axis")].bandwidth() / 2;
+          return _this46["".concat(xAxis, "Axis")](_this46.parseX(d.x.value)) + adjustment;
         }).y(function (d) {
-          return _this47["".concat(yAxis, "Axis")](isNaN(d.y.value) ? 0 : d.y.value);
-        }).curve(d3[curveStyle || _this47.options.curveStyle]);
+          return _this46["".concat(yAxis, "Axis")](isNaN(d.y.value) ? 0 : d.y.value);
+        }).curve(d3[curveStyle || _this46.options.curveStyle]);
       };
 
       var xAxis = 'bottom';
@@ -8133,14 +8152,14 @@ var WebsyChart = /*#__PURE__*/function () {
   }, {
     key: "rendersymbol",
     value: function rendersymbol(series, index) {
-      var _this48 = this;
+      var _this47 = this;
 
       /* global d3 series index series.key */
       var drawSymbol = function drawSymbol(size) {
         return d3.symbol() // .type(d => {
         //   return d3.symbols[0]
         // })
-        .size(size || _this48.options.symbolSize);
+        .size(size || _this47.options.symbolSize);
       };
 
       var xAxis = 'bottomAxis';
@@ -8158,7 +8177,7 @@ var WebsyChart = /*#__PURE__*/function () {
       symbols.attr('d', function (d) {
         return drawSymbol(d.y.size || series.symbolSize)(d);
       }).transition(this.transition).attr('fill', 'white').attr('stroke', series.color).attr('transform', function (d) {
-        return "translate(".concat(_this48[xAxis](_this48.parseX(d.x.value)), ", ").concat(_this48[yAxis](isNaN(d.y.value) ? 0 : d.y.value), ")");
+        return "translate(".concat(_this47[xAxis](_this47.parseX(d.x.value)), ", ").concat(_this47[yAxis](isNaN(d.y.value) ? 0 : d.y.value), ")");
       }); // Enter
 
       symbols.enter().append('path').attr('d', function (d) {
@@ -8167,7 +8186,7 @@ var WebsyChart = /*#__PURE__*/function () {
       .attr('fill', 'white').attr('stroke', series.color).attr('class', function (d) {
         return "symbol symbol_".concat(series.key);
       }).attr('transform', function (d) {
-        return "translate(".concat(_this48[xAxis](_this48.parseX(d.x.value)), ", ").concat(_this48[yAxis](isNaN(d.y.value) ? 0 : d.y.value), ")");
+        return "translate(".concat(_this47[xAxis](_this47.parseX(d.x.value)), ", ").concat(_this47[yAxis](isNaN(d.y.value) ? 0 : d.y.value), ")");
       });
     }
   }, {
@@ -8322,7 +8341,7 @@ var WebsyLegend = /*#__PURE__*/function () {
   }, {
     key: "resize",
     value: function resize() {
-      var _this49 = this;
+      var _this48 = this;
 
       var el = document.getElementById(this.elementId);
 
@@ -8335,7 +8354,7 @@ var WebsyLegend = /*#__PURE__*/function () {
         // }
         var html = "\n        <div class='text-".concat(this.options.align, "'>\n      ");
         html += this._data.map(function (d, i) {
-          return _this49.getLegendItemHTML(d);
+          return _this48.getLegendItemHTML(d);
         }).join('');
         html += "\n        <div>\n      ";
         el.innerHTML = html;
@@ -8507,7 +8526,7 @@ var WebsyMap = /*#__PURE__*/function () {
   }, {
     key: "render",
     value: function render() {
-      var _this50 = this;
+      var _this49 = this;
 
       var mapEl = document.getElementById("".concat(this.elementId, "_map"));
       var legendEl = document.getElementById("".concat(this.elementId, "_map"));
@@ -8516,7 +8535,7 @@ var WebsyMap = /*#__PURE__*/function () {
         var legendData = this.options.data.polygons.map(function (s, i) {
           return {
             value: s.label || s.key,
-            color: s.color || _this50.options.colors[i % _this50.options.colors.length]
+            color: s.color || _this49.options.colors[i % _this49.options.colors.length]
           };
         });
         var longestValue = legendData.map(function (s) {
@@ -8580,7 +8599,7 @@ var WebsyMap = /*#__PURE__*/function () {
 
       if (this.polygons) {
         this.polygons.forEach(function (p) {
-          return _this50.map.removeLayer(p);
+          return _this49.map.removeLayer(p);
         });
       }
 
@@ -8638,18 +8657,18 @@ var WebsyMap = /*#__PURE__*/function () {
           }
 
           if (!p.options.color) {
-            p.options.color = _this50.options.colors[i % _this50.options.colors.length];
+            p.options.color = _this49.options.colors[i % _this49.options.colors.length];
           }
 
           var pol = L.polygon(p.data.map(function (c) {
             return c.map(function (d) {
               return [d.Latitude, d.Longitude];
             });
-          }), p.options).addTo(_this50.map);
+          }), p.options).addTo(_this49.map);
 
-          _this50.polygons.push(pol);
+          _this49.polygons.push(pol);
 
-          _this50.map.fitBounds(pol.getBounds());
+          _this49.map.fitBounds(pol.getBounds());
         });
       } // if (this.data.markers.length > 0) {            
       //   el.classList.remove('hidden')