1"use strict"; 2 3function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); } 4 5function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } 6 7function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } 8 9function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); } 10 11function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); } 12 13function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } 14 15function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } 16 17function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } 18 19function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; } 20 21function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; } 22 23/*! 24 * IconicMultiSelect v0.7.0 25 * Licence: MIT 26 * (c) 2021 Sidney Wimart. 27 */ 28 29var IconicMultiSelect = function () { 30 function IconicMultiSelect(_ref) { 31 var data = _ref.data, 32 itemTemplate = _ref.itemTemplate, 33 noData = _ref.noData, 34 noResults = _ref.noResults, 35 placeholder = _ref.placeholder, 36 select = _ref.select, 37 tagTemplate = _ref.tagTemplate, 38 textField = _ref.textField, 39 valueField = _ref.valueField; 40 41 _classCallCheck(this, IconicMultiSelect); 42 43 _defineProperty(this, "_data", void 0); 44 45 _defineProperty(this, "_domElements", void 0); 46 47 _defineProperty(this, "_event", function () {}); 48 49 _defineProperty(this, "_itemTemplate", void 0); 50 51 _defineProperty(this, "_multiselect", void 0); 52 53 _defineProperty(this, "_noData", void 0); 54 55 _defineProperty(this, "_noResults", void 0); 56 57 _defineProperty(this, "_options", []); 58 59 _defineProperty(this, "_placeholder", void 0); 60 61 _defineProperty(this, "_select", void 0); 62 63 _defineProperty(this, "_selectContainer", void 0); 64 65 _defineProperty(this, "_selectedOptions", []); 66 67 _defineProperty(this, "_tagTemplate", void 0); 68 69 _defineProperty(this, "_textField", void 0); 70 71 _defineProperty(this, "_valueField", void 0); 72 73 _defineProperty(this, "_cross", "\n <svg\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M6.2253 4.81108C5.83477 4.42056 5.20161 4.42056 4.81108 4.81108C4.42056 5.20161 4.42056 5.83477 4.81108 6.2253L10.5858 12L4.81114 17.7747C4.42062 18.1652 4.42062 18.7984 4.81114 19.1889C5.20167 19.5794 5.83483 19.5794 6.22535 19.1889L12 13.4142L17.7747 19.1889C18.1652 19.5794 18.7984 19.5794 19.1889 19.1889C19.5794 18.7984 19.5794 18.1652 19.1889 17.7747L13.4142 12L19.189 6.2253C19.5795 5.83477 19.5795 5.20161 19.189 4.81108C18.7985 4.42056 18.1653 4.42056 17.7748 4.81108L12 10.5858L6.2253 4.81108Z\"\n fill=\"currentColor\"\n />\n </svg>\n "); 74 75 this._data = data !== null && data !== void 0 ? data : []; 76 this._itemTemplate = itemTemplate !== null && itemTemplate !== void 0 ? itemTemplate : null;
77 this._noData = noData !== null && noData !== void 0 ? noData : "No data found."; 78 this._noResults = noResults !== null && noResults !== void 0 ? noResults : "No results found."; 79 this._placeholder = placeholder !== null && placeholder !== void 0 ? placeholder : "Select..."; 80 this._select = select; 81 this._selectContainer = document.querySelector(select); 82 this._tagTemplate = tagTemplate !== null && tagTemplate !== void 0 ? tagTemplate : null; 83 this._textField = textField !== null && textField !== void 0 ? textField : null; 84 this._valueField = valueField !== null && valueField !== void 0 ? valueField : null; 85 } 86 _createClass(IconicMultiSelect, [{ 87 key: "init", 88 value: function init() { 89 if (this._selectContainer && this._selectContainer.nodeName === "SELECT") { 90 if (this._itemTemplate && this._data.length === 0) throw new Error("itemTemplate must be initialized with data from the component settings"); 91 if (this._tagTemplate && this._data.length === 0) throw new Error("tagTemplate must be initialized with data from the component settings"); 92 this._options = this._data.length > 0 ? this._getDataFromSettings() : this._getDataFromSelectTag(); 93 94 this._renderMultiselect(); 95 96 this._renderOptionsList(); 97 98 this._domElements = { 99 clear: this._multiselect.querySelector(".multiselect__clear-btn"), 100 input: this._multiselect.querySelector(".multiselect__input"), 101 optionsContainer: this._multiselect.querySelector(".multiselect__options"), 102 optionsContainerList: this._multiselect.querySelector(".multiselect__options > ul"), 103 options: { 104 list: this._multiselect.querySelectorAll(".multiselect__options > ul > li"), 105 find: function find(callbackFn) { 106 for (var i = 0; i < this.list.length; i++) { 107 var node = this.list[i]; 108 if (callbackFn(node)) return node; 109 } 110 111 return undefined; 112 }, 113 some: function some(callbackFn) { 114 for (var i = 0; i < this.list.length; i++) { 115 var node = this.list[i]; 116 if (callbackFn(node, i)) return true; 117 } 118 119 return false; 120 } 121 } 122 }; 123 124 this._enableEventListenners(); 125 126 this._initSelectedList(); 127 } else { 128 throw new Error("The selector '".concat(this._select, "' did not select any valid select tag.")); 129 } 130 } 131 },{ 132 key: "edit", 133 value: function edit() { 134 if (this._selectContainer && this._selectContainer.nodeName === "SELECT") { 135 if (this._itemTemplate && this._data.length === 0) 136 throw new Error("itemTemplate must be initialized with data from the component settings"); 137 if (this._tagTemplate && this._data.length === 0) 138 throw new Error("tagTemplate must be initialized with data from the component settings"); 139 140 this._options = this._data.length > 0 ? this._getDataFromSettings() : this._getDataFromSelectTag(); 141 142 // this._renderMultiselect(); 143 // this._renderOptionsList(); 144 var _this6 = this; 145 146 var html = "\n ".concat(this._options.length > 0 && !this._itemTemplate ? this._options.map(function (option) { 147 return "\n <li data-value=\"".concat(option.value, "\">").concat(option.text, "</li>\n "); 148 }).join("") : "", "\n\n ").concat(this._options.length > 0 && this._itemTemplate ? this._options.map(function (option, index) { 149 return "\n <li data-value=\"".concat(option.value, "\">").concat(_this6._processTemplate(_this6._itemTemplate, index), "</li>\n "); 150 }).join("") : "", "\n ").concat(this._showNoData(this._options.length === 0), "\n "); 151 152 // this._multiselect.querySelector(`.multiselect__options > ul`).insertAdjacentHTML("beforeend", html); 153 this._multiselect.querySelector(`.multiselect__options > ul`).innerHTML = html; 154 this._domElements = { 155 clear: this._multiselect.querySelector(`.multiselect__clear-btn`), 156 input: this._multiselect.querySelector(`.multiselect__input`), 157 optionsContainer: this._multiselect.querySelector(`.multiselect__options`), 158 optionsContainerList: this._multiselect.querySelector(`.multiselect__options > ul`), 159 options: { 160 list: this._multiselect.querySelectorAll(`.multiselect__options > ul > li`), 161 find: function (callbackFn) { 162 for (let i = 0; i < this.list.length; i++) { 163 const node = this.list[i]; 164 if (callbackFn(node)) return node; 165 } 166 return undefined; 167 }, 168 some: function (callbackFn) { 169 for (let i = 0; i < this.list.length; i++) { 170 const node = this.list[i]; 171 if (callbackFn(node, i)) return true; 172 } 173 return false;
174 }, 175 }, 176 }; 177 178 this._enableEventListenners(); 179 // this._initSelectedList() 180 } else { 181 throw new Error(`The selector '${this._select}' did not select any valid select tag.`); 182 } 183 } 184 },{ 185 key: "subscribe", 186 value: function subscribe(callback) { 187 if (typeof callback === "function") { 188 this._event = callback; 189 } else { 190 throw new Error("parameter in the subscribe method is not a function"); 191 } 192 } 193 }, { 194 key: "_addOptionToList", 195 value: function _addOptionToList(option, index) { 196 var _this = this; 197 198 var html = "<span class=\"multiselect__selected\" data-value=\"".concat(option.value, "\">").concat(this._tagTemplate ? this._processTemplate(this._tagTemplate, index) : option.text, "<span class=\"multiselect__remove-btn\">").concat(this._cross, "</span></span>"); 199 200 this._domElements.input.insertAdjacentHTML("beforebegin", html); 201 202 var _this$_multiselect$qu = this._multiselect.querySelector("span[data-value=\"".concat(option.value, "\"]")), 203 // removeBtn = _this$_multiselect$qu.lastElementChild; 204 removeBtn = _this$_multiselect$qu; 205 removeBtn.addEventListener("click", function () { 206 _this._domElements.options.list = _this._multiselect.querySelectorAll(".multiselect__options > ul > li"); 207 var target = _this._domElements.options.find(function (el) { 208 return el.dataset.value == option.value; 209 }); 210 211 _this._handleOption(target); 212 }); 213 } 214 }, { 215 key: "_clearSelection", 216 value: function _clearSelection() { 217 var _this2 = this; 218 219 var _loop = function _loop(i) { 220 var option = _this2._selectedOptions[i]; 221 222 _this2._domElements.options.list = _this2._multiselect.querySelectorAll(".multiselect__options > ul > li"); 223 224 var target = _this2._domElements.options.find(function (el) { 225 return el.dataset.value == option.value; 226 }); 227 228 target.classList.remove("multiselect__options--selected"); 229 230 _this2._removeOptionFromList(target.dataset.value); 231 }; 232 233 for (var i = 0; i < this._selectedOptions.length; i++) { 234 _loop(i); 235 } 236 237 this._selectedOptions = []; 238 239 this._handleClearSelectionBtn(); 240 241 this._handlePlaceholder(); 242 243 this._dispatchEvent({ 244 action: "CLEAR_ALL_OPTIONS", 245 selection: this._selectedOptions 246 }); 247 } 248 }, { 249 key: "_closeList", 250 value: function _closeList() { 251 this._domElements.input.value = ""; 252 253 this._domElements.optionsContainer.classList.remove("visible"); 254 255 this._filterOptions(""); 256 257 this._removeAllArrowSelected(); 258 } 259 }, { 260 key: "_dispatchEvent", 261 value: function _dispatchEvent(event) { 262 this._event(event); 263 } 264 }, { 265 key: "_enableEventListenners", 266 value: function _enableEventListenners() { 267 var _this3 = this; 268 269 document.addEventListener("mouseup", function (_ref2) { 270 var target = _ref2.target; 271 272 if (!_this3._multiselect.contains(target)) { 273 _this3._filterOptions(""); 274 275 _this3._closeList(); 276 277 _this3._handlePlaceholder(); 278 } 279 }); 280 281 this._domElements.clear.addEventListener("click", function () { 282 _this3._clearSelection(); 283 }); 284 285 for (var i = 0; i < this._domElements.options.list.length; i++) { 286 var option = this._domElements.options.list[i]; 287 option.addEventListener("click", function (_ref3) { 288 var target = _ref3.target; 289 290 _this3._handleOption(target); 291 292 _this3._closeList(); 293 }); 294 } 295 296 this._domElements.input.addEventListener("focus", function () { 297 _this3._domElements.optionsContainer.classList.add("visible"); 298 299 _this3._domElements.input.placeholder = ""; 300 }); 301 302 this._domElements.input.addEventListener("input", function (_ref4) { 303 var value = _ref4.target.value; 304 305 if (_this3._domElements.options.list.length > 0) { 306 _this3._filterOptions(value); 307 } 308 }); 309 310 this._domElements.input.addEventListener("keydown", function (e) { 311 _this3._handleArrows(e); 312 313 _this3._handleBackspace(e); 314 315 _this3._handleEnter(e); 316 }); 317 } 318 }, { 319 key: "_filterOptions", 320 value: function _filterOptions(value) { 321 var _this4 = this; 322 323 var isOpen = this._domElements.optionsContainer.classList.contains("visible"); 324 325 var valueLowerCase = value.toLowerCase(); 326 327 if (!isOpen && value.length > 0) { 328 this._domElements.optionsContainer.classList.add("visible"); 329 } 330 331 if (this._domElements.options.list.length > 0) { 332 for (var i = 0; i < this._domElements.options.list.length; i++) { 333 var el = this._domElements.options.list[i]; 334 var text = this._itemTemplate ? this._data[i][this._textField] : el.textContent; 335 336 if (text.toLowerCase().substring(0, valueLowerCase.length) === valueLowerCase) { 337 this._domElements.optionsContainerList.appendChild(el); 338 } else { 339 el.parentNode && el.parentNode.removeChild(el); 340 } 341 } 342 343 var hasResults = this._domElements.options.some(function (el, index) { 344 return (_this4._itemTemplate ? _this4._data[index][_this4._textField] : el.textContent).toLowerCase().substring(0, valueLowerCase.length) === valueLowerCase; 345 }); 346 347 this._showNoResults(!hasResults); 348 } 349 } 350 }, { 351 key: "_generateId", 352 value: function _generateId(length) { 353 var result = ""; 354 var characters = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; 355 var charactersLength = characters.length; 356 357 for (var i = 0; i < length; i++) { 358 result += characters.charAt(Math.floor(Math.random() * charactersLength)); 359 } 360 361 return result; 362 } 363 }, { 364 key: "_getDataFromSelectTag", 365 value: function _getDataFromSelectTag() { 366 var arr = []; 367 var options = this._selectContainer.options; 368 369 for (var i = 0; i < options.length; i++) { 370 var item = options[i]; 371 arr.push({ 372 text: item.text, 373 value: item.value, 374 selected: item.hasAttribute('selected') 375 }); 376 } 377 378 return arr; 379 } 380 }, { 381 key: "_getDataFromSettings", 382 value: function _getDataFromSettings() { 383 if (this._data.length > 0 && this._valueField && this._textField) { 384 var isValueFieldValid = typeof this._valueField === "string"; 385 var isTextFieldValid = typeof this._textField === "string"; 386 var arr = []; 387 388 if (!isValueFieldValid || !isTextFieldValid) { 389 throw new Error("textField and valueField must be of type string"); 390 } 391 392 for (var i = 0; i < this._data.length; i++) { 393 var item = this._data[i]; 394 arr.push({ 395 value: item[this._valueField], 396 text: item[this._textField], 397 selected: typeof item.selected === "boolean" ? item.selected : false 398 }); 399 } 400 401 return arr; 402 } else { 403 return null; 404 } 405 } 406 }, { 407 key: "_handleArrows", 408 value: function _handleArrows(event) { 409 if (event.keyCode === 40 || event.keyCode === 38) { 410 event.preventDefault(); 411 412 var isOpen = this._domElements.optionsContainer.classList.contains("visible"); 413 414 415 var optionsContainerList = this._multiselect.querySelector(".multiselect__options > ul"); 416 417 if (!isOpen) { 418 this._domElements.optionsContainer.classList.add("visible"); 419 420 optionsContainerList.firstElementChild.classList.add("arrow-selected"); 421 optionsContainerList.firstElementChild.scrollIntoView(false); 422 } else { 423 var selected = this._multiselect.querySelector(".multiselect__options ul li.arrow-selected"); 424 425 var action = { 426 ArrowUp: "previous", 427 Up: "previous", 428 ArrowDown: "next", 429 Down: "next" 430 }; 431 432 if (!selected) { 433 optionsContainerList.firstElementChild.classList.add("arrow-selected"); 434 optionsContainerList.firstElementChild.scrollIntoView(false); 435 return; 436 } 437 438 selected.classList.remove("arrow-selected"); 439 selected = selected[action[event.key] + "ElementSibling"]; 440 441 if (!selected) { 442 selected = optionsContainerList.children[action[event.key] === "
442next" ? 0 : optionsContainerList.children.length - 1]; 443 selected.classList.add("arrow-selected"); 444 445 this._scrollIntoView(optionsContainerList, selected); 446 447 return; 448 } 449 450 selected.classList.add("arrow-selected"); 451 452 this._scrollIntoView(optionsContainerList, selected); 453 } 454 } 455 } 456 }, { 457 key: "_handleBackspace", 458 value: function _handleBackspace(e) { 459 if (e.keyCode === 8 && e.target.value === "") { 460 var lastSelectedOption = this._selectedOptions.length > 0 ? this._selectedOptions[this._selectedOptions.length - 1] : null; 461 462 if (lastSelectedOption) { 463 var targetLastSelectedOption = this._multiselect.querySelector("li[data-value=\"".concat(lastSelectedOption.value, "\"]")); 464 465 this._handleOption(targetLastSelectedOption); 466 467 if (this._selectedOptions.length === 0) { 468 this._domElements.optionsContainer.classList.remove("visible"); 469 } 470 } 471 } 472 } 473 }, { 474 key: "_handleClearSelectionBtn", 475 value: function _handleClearSelectionBtn() { 476 if (this._selectedOptions.length > 0) { 477 this._domElements.clear.style.display = "flex"; 478 } else { 479 this._domElements.clear.style.display = "none"; 480 } 481 } 482 }, { 483 key: "_handleEnter", 484 value: function _handleEnter(event) { 485 if (event.keyCode === 13) { 486 var selected = this._multiselect.querySelector(".multiselect__options ul li.arrow-selected"); 487 488 if (selected) { 489 this._handleOption(selected); 490 491 this._closeList(); 492 } 493 } 494 } 495 }, { 496 key: "_handleOption", 497 value: function _handleOption(target) { 498 var dispatchEvent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true; 499 500 for (var i = 0; i < this._selectedOptions.length; i++) { 501 var el = this._selectedOptions[i]; 502 503 if (el.value == target.dataset.value) { 504 target.classList.remove("multiselect__options--selected"); 505 506 this._selectedOptions.splice(i, 1); 507 508 this._removeOptionFromList(target.dataset.value); 509 510 this._handleClearSelectionBtn(); 511 512 this._handlePlaceholder(); 513 514 return dispatchEvent && this._dispatchEvent({ 515 action: "REMOVE_OPTION", 516 value: target.dataset.value, 517 selection: this._selectedOptions 518 }); 519 } 520 } 521 522 523 for (var _i = 0; _i < this._options.length; _i++) { 524 var option = this._options[_i]; 525 526 if (option.value == target.dataset.value) { 527 target.classList.add("multiselect__options--selected"); 528 this._selectedOptions = [].concat(_toConsumableArray(this._selectedOptions), [option]); 529 530 this._addOptionToList(option, _i); 531 532 this._handleClearSelectionBtn(); 533 534 this._handlePlaceholder(); 535 536 return dispatchEvent && this._dispatchEvent({ 537 action: "ADD_OPTION", 538 value: target.dataset.value, 539 selection: this._selectedOptions 540 }); 541 } 542 } 543 } 544 }, { 545 key: "_handlePlaceholder", 546 value: function _handlePlaceholder() { 547 if (this._selectedOptions.length > 0) { 548 this._domElements.input.placeholder = ""; 549 } else { 550 this._domElements.input.placeholder = this._placeholder; 551 } 552 } 553 }, { 554 key: "_initSelectedList", 555 value: function _initSelectedList() { 556 var _this5 = this; 557 558 var hasItemsSelected = false; 559 560 var _loop2 = function _loop2(i) { 561 var option = _this5._options[i]; 562 563 if (option.selected) { 564 hasItemsSelected = true; 565 566 var target = _this5._domElements.options.find(function (el) { 567 return el.dataset.value == option.value; 568 }); 569 570 target.classList.add("multiselect__options--selected"); 571 _this5._selectedOptions = [].concat(_toConsumableArray(_this5._selectedOptions), [option]); 572 573 _this5._addOptionToList(option, i); 574 } 575 }; 576 577 for (var i = 0; i < this._options.length; i++) { 578 _loop2(i); 579 } 580 581 if (hasItemsSelected) this._handleClearSelectionBtn(); 582 583 this._handlePlaceholder(); 584 } 585 }, { 586 key: "_processTemplate", 587 value: function _processTemplate(template, index) { 588 var processedTemplate = template; 589 var objAttr = template.match(/\$\{(\w+)\}/g).map(function (e) { 590 return e.replace(/\$\{|\}/g, ""); 591 }); 592 593 for (var i = 0; i < objAttr.length; i++) { 594 var _this$_data$index$att; 595 596 var attr = objAttr[i]; 597 processedTemplate = processedTemplate.replace("${".concat(attr, "}"), (_this$_data$index$att = this._data[index][attr]) !== null && _this$_data$index$att !== void 0 ? _this$_data$index$att : ""); 598 } 599 600 return processedTemplate; 601 } 602 }, { 603 key: "_removeAllArrowSelected", 604 value: function _removeAllArrowSelected() { 605 var className = "arrow-selected"; 606 607 var target = this._domElements.options.find(function (el) { 608 return el.classList.contains(className); 609 }); 610 611 target && target.classList.remove(className); 612 } 613 }, { 614 key: "_removeOptionFromList", 615 value: function _removeOptionFromList(value) { 616 var optionDom = this._multiselect.querySelector("span[data-value=\"".concat(value, "\"]")); 617 618 optionDom && optionDom.parentNode && optionDom.parentNode.removeChild(optionDom); 619 } 620 }, { 621 key: "_renderOptionsList", 622 value: function _renderOptionsList() { 623 var _this6 = this; 624 625 var html = "\n <div class=\"multiselect__options\">\n <ul>\n ".concat(this._options.length > 0 && !this._itemTemplate ? this._options.map(function (option) { 626 return "\n <li data-value=\"".concat(option.value, "\">").concat(option.text, "</li>\n "); 627 }).join("") : "", "\n\n ").concat(this._options.length > 0 && this._itemTemplate ? this._options.map(function (option, index) { 628 return "\n <li data-value=\"".concat(option.value, "\">").concat(_this6._processTemplate(_this6._itemTemplate, index), "</li>\n "); 629 }).join("") : "", "\n ").concat(this._showNoData(this._options.length === 0), "\n </ul>\n </div>\n "); 630 631 this._multiselect.insertAdjacentHTML("beforeend", html); 632 } 633 }, { 634 key: "_renderMultiselect", 635 value: function _renderMultiselect() { 636 this._selectContainer.style.display = "none"; 637
638 var id = "iconic-" + this._generateId(20); 639 640 var html = "\n <div id=\"".concat(id, "\" class=\"multiselect__container\">\n <div class=\"multiselect__wrapper\">\n <input class=\"multiselect__input\" placeholder=\"").concat(this._placeholder, "\" />\n </div>\n <span style=\"display: none;\" class=\"multiselect__clear-btn\">").concat(this._cross, "</span>\n </div>\n "); 641 642 this._selectContainer.insertAdjacentHTML("afterend", html); 643 644 this._multiselect = document.querySelector("#".concat(id)); 645 } 646 }, { 647 key: "_scrollIntoView", 648 value: function _scrollIntoView(parent, child) { 649 var rectParent = parent.getBoundingClientRect(); 650 var rectChild = child.getBoundingClientRect(); 651 652 if (!(rectParent.top < rectChild.bottom - child.offsetHeight)) { 653 parent.scrollTop = child.clientHeight + (child.offsetTop - child.offsetHeight); 654 } 655 656 657 if (!(rectParent.bottom > rectChild.top + child.offsetHeight)) { 658 parent.scrollTop = child.clientHeight + (child.offsetTop - child.offsetHeight) - (parent.offsetHeight - (child.offsetHeight + (child.offsetHeight - child.clientHeight))); 659 } 660 } 661 }, { 662 key: "_showNoData", 663 value: function _showNoData(condition) { 664 return condition ? "<p class=\"multiselect__options--no-data\">".concat(this._noData, "</p>") : ""; 665 } 666 }, { 667 key: "_showNoResults", 668 value: function _showNoResults(condition) { 669 var dom = this._multiselect.querySelector(".multiselect__options--no-results"); 670 671 if (condition) { 672 var html = "<p class=\"multiselect__options--no-results\">".concat(this._noResults, "</p>"); 673 !dom && this._domElements.optionsContainerList.insertAdjacentHTML("beforeend", html); 674 } else { 675 dom && dom.parentNode && dom.parentNode.removeChild(dom); 676 } 677 } 678 }]); 679 680 return IconicMultiSelect; 681}();
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.