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 // cspell:disable-next-line . 125 this._enableEventListenners(); 126 127 this._initSelectedList(); 128 } else { 129 throw new Error("The selector '".concat(this._select, "' did not select any valid select tag.")); 130 } 131 } 132 },{ 133 key: "edit", 134 value: function edit() { 135 if (this._selectContainer && this._selectContainer.nodeName === "SELECT") { 136 if (this._itemTemplate && this._data.length === 0) 137 throw new Error("itemTemplate must be initialized with data from the component settings"); 138 if (this._tagTemplate && this._data.length === 0) 139 throw new Error("tagTemplate must be initialized with data from the component settings"); 140 141 this._options = this._data.length > 0 ? this._getDataFromSettings() : this._getDataFromSelectTag(); 142 143 // this._renderMultiselect(); 144 // this._renderOptionsList(); 145 var _this6 = this; 146 147 var html = "\n ".concat(this._options.length > 0 && !this._itemTemplate ? this._options.map(function (option) { 148 return "\n <li data-value=\"".concat(option.value, "\">").concat(option.text, "</li>\n "); 149 }).join("") : "", "\n\n ").concat(this._options.length > 0 && this._itemTemplate ? this._options.map(function (option, index) { 150 return "\n <li data-value=\"".concat(option.value, "\">").concat(_this6._processTemplate(_this6._itemTemplate, index), "</li>\n "); 151 }).join("") : "", "\n ").concat(this._showNoData(this._options.length === 0), "\n "); 152 153 // this._multiselect.querySelector(`.multiselect__options > ul`).insertAdjacentHTML("beforeend", html); 154 this._multiselect.querySelector(`.multiselect__options > ul`).innerHTML = html; 155 this._domElements = { 156 clear: this._multiselect.querySelector(`.multiselect__clear-btn`), 157 input: this._multiselect.querySelector(`.multiselect__input`), 158 optionsContainer: this._multiselect.querySelector(`.multiselect__options`), 159 optionsContainerList: this._multiselect.querySelector(`.multiselect__options > ul`), 160 options: { 161 list: this._multiselect.querySelectorAll(`.multiselect__options > ul > li`), 162 find: function (callbackFn) { 163 for (let i = 0; i < this.list.length; i++) { 164 const node = this.list[i]; 165 if (callbackFn(node)) return node; 166 } 167 return undefined; 168 }, 169 some: function (callbackFn) { 170 for (let i = 0; i < this.list.length; i++) { 171 const node = this.list[i]; 172 if (callbackFn(node, i)) return true; 173 } 174 return false;
175 }, 176 }, 177 }; 178 179 // cspell:disable-next-line . 180 this._enableEventListenners(); 181 // this._initSelectedList() 182 } else { 183 throw new Error(`The selector '${this._select}' did not select any valid select tag.`); 184 } 185 } 186 },{ 187 key: "subscribe", 188 value: function subscribe(callback) { 189 if (typeof callback === "function") { 190 this._event = callback; 191 } else { 192 throw new Error("parameter in the subscribe method is not a function"); 193 } 194 } 195 }, { 196 key: "_addOptionToList", 197 value: function _addOptionToList(option, index) { 198 var _this = this; 199 200 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>"); 201 202 this._domElements.input.insertAdjacentHTML("beforebegin", html); 203 204 var _this$_multiselect$qu = this._multiselect.querySelector("span[data-value=\"".concat(option.value, "\"]")), 205 // removeBtn = _this$_multiselect$qu.lastElementChild; 206 removeBtn = _this$_multiselect$qu; 207 removeBtn.addEventListener("click", function () { 208 _this._domElements.options.list = _this._multiselect.querySelectorAll(".multiselect__options > ul > li"); 209 var target = _this._domElements.options.find(function (el) { 210 return el.dataset.value == option.value; 211 }); 212 213 _this._handleOption(target); 214 }); 215 } 216 }, { 217 key: "_clearSelection", 218 value: function _clearSelection() { 219 var _this2 = this; 220 221 var _loop = function _loop(i) { 222 var option = _this2._selectedOptions[i]; 223 224 _this2._domElements.options.list = _this2._multiselect.querySelectorAll(".multiselect__options > ul > li"); 225 226 var target = _this2._domElements.options.find(function (el) { 227 return el.dataset.value == option.value; 228 }); 229 230 target.classList.remove("multiselect__options--selected"); 231 232 _this2._removeOptionFromList(target.dataset.value); 233 }; 234 235 for (var i = 0; i < this._selectedOptions.length; i++) { 236 _loop(i); 237 } 238 239 this._selectedOptions = []; 240 241 this._handleClearSelectionBtn(); 242 243 this._handlePlaceholder(); 244 245 this._dispatchEvent({ 246 action: "CLEAR_ALL_OPTIONS", 247 selection: this._selectedOptions 248 }); 249 } 250 }, { 251 key: "_closeList", 252 value: function _closeList() { 253 this._domElements.input.value = ""; 254 255 this._domElements.optionsContainer.classList.remove("visible"); 256 257 this._filterOptions(""); 258 259 this._removeAllArrowSelected(); 260 } 261 }, { 262 key: "_dispatchEvent", 263 value: function _dispatchEvent(event) { 264 this._event(event); 265 } 266 }, { 267 // cspell:disable-next-line . 268 key: "_enableEventListenners", 269 // cspell:disable-next-line . 270 value: function _enableEventListenners() { 271 var _this3 = this; 272 273 document.addEventListener("mouseup", function (_ref2) { 274 var target = _ref2.target; 275 276 if (!_this3._multiselect.contains(target)) { 277 _this3._filterOptions(""); 278 279 _this3._closeList(); 280 281 _this3._handlePlaceholder(); 282 } 283 }); 284 285 this._domElements.clear.addEventListener("click", function () { 286 _this3._clearSelection(); 287 }); 288 289 for (var i = 0; i < this._domElements.options.list.length; i++) { 290 var option = this._domElements.options.list[i]; 291 option.addEventListener("click", function (_ref3) { 292 var target = _ref3.target; 293 294 _this3._handleOption(target); 295 296 _this3._closeList(); 297 }); 298 } 299 300 this._domElements.input.addEventListener("focus", function () { 301 _this3._domElements.optionsContainer.classList.add("visible"); 302 303 _this3._domElements.input.placeholder = ""; 304 }); 305 306 this._domElements.input.addEventListener("input", function (_ref4) { 307 var value = _ref4.target.value; 308 309 if (_this3._domElements.options.list.length > 0) { 310 _this3._filterOptions(value); 311 } 312 }); 313 314 this._domElements.input.addEventListener("keydown", function (e) { 315 _this3._handleArrows(e); 316 317 _this3._handleBackspace(e); 318 319 _this3._handleEnter(e); 320 }); 321 } 322 }, { 323 key: "_filterOptions", 324 value: function _filterOptions(value) { 325 var _this4 = this; 326 327 var isOpen = this._domElements.optionsContainer.classList.contains("visible"); 328 329 var valueLowerCase = value.toLowerCase(); 330 331 if (!isOpen && value.length > 0) { 332 this._domElements.optionsContainer.classList.add("visible"); 333 } 334 335 if (this._domElements.options.list.length > 0) { 336 for (var i = 0; i < this._domElements.options.list.length; i++) { 337 var el = this._domElements.options.list[i]; 338 var text = this._itemTemplate ? this._data[i][this._textField] : el.textContent; 339 340 if (text.toLowerCase().substring(0, valueLowerCase.length) === valueLowerCase) { 341 this._domElements.optionsContainerList.appendChild(el); 342 } else { 343 el.parentNode && el.parentNode.removeChild(el); 344 } 345 } 346 347 var hasResults = this._domElements.options.some(function (el, index) { 348 return (_this4._itemTemplate ? _this4._data[index][_this4._textField] : el.textContent).toLowerCase().substring(0, valueLowerCase.length) === valueLowerCase; 349 }); 350 351 this._showNoResults(!hasResults); 352 } 353 } 354 }, { 355 key: "_generateId", 356 value: function _generateId(length) { 357 var result = ""; 358 var characters = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; 359 var charactersLength = characters.length; 360 361 for (var i = 0; i < length; i++) { 362 result += characters.charAt(Math.floor(Math.random() * charactersLength)); 363 } 364 365 return result; 366 } 367 }, { 368 key: "_getDataFromSelectTag", 369 value: function _getDataFromSelectTag() { 370 var arr = []; 371 var options = this._selectContainer.options; 372 373 for (var i = 0; i < options.length; i++) { 374 var item = options[i]; 375 arr.push({ 376 text: item.text, 377 value: item.value, 378 selected: item.hasAttribute('selected') 379 }); 380 } 381 382 return arr; 383 } 384 }, { 385 key: "_getDataFromSettings", 386 value: function _getDataFromSettings() { 387 if (this._data.length > 0 && this._valueField && this._textField) { 388 var isValueFieldValid = typeof this._valueField === "string"; 389 var isTextFieldValid = typeof this._textField === "string"; 390 var arr = []; 391 392 if (!isValueFieldValid || !isTextFieldValid) { 393 throw new Error("textField and valueField must be of type string"); 394 } 395 396 for (var i = 0; i < this._data.length; i++) { 397 var item = this._data[i]; 398 arr.push({ 399 value: item[this._valueField], 400 text: item[this._textField], 401 selected: typeof item.selected === "boolean" ? item.selected : false 402 }); 403 } 404 405 return arr; 406 } else { 407 return null; 408 } 409 } 410 }, { 411 key: "_handleArrows", 412 value: function _handleArrows(event) { 413 if (event.keyCode === 40 || event.keyCode === 38) { 414 event.preventDefault(); 415 416 var isOpen = this._domElements.optionsContainer.classList.contains("visible"); 417 418 419 var optionsContainerList = this._multiselect.querySelector(".multiselect__options > ul"); 420 421 if (!isOpen) { 422 this._domElements.optionsContainer.classList.add("visible"); 423 424 optionsContainerList.firstElementChild.classList.add("arrow-selected"); 425 optionsContainerList.firstElementChild.scrollIntoView(false); 426 } else { 427 var selected = this._multiselect.querySelector(".multiselect__options ul li.arrow-selected"); 428 429 var action = { 430 ArrowUp: "previous", 431 Up: "previous", 432 ArrowDown: "next", 433 Down: "next" 434 }; 435 436 if (!selected) { 437 optionsContainerList.firstElementChild.classList.add("arrow-selected"); 438 optionsContainerList.firstElementChild.scrollIntoView(false); 439 return; 440 } 441 442 selected.classList.remove("arrow-selected"); 443 selected = selected[action[event.key] + "ElementSibling"]; 444 445 if (!selected) { 446 selected = optionsContainerList.children[action[event.key] === "
446next" ? 0 : optionsContainerList.children.length - 1]; 447 selected.classList.add("arrow-selected"); 448 449 this._scrollIntoView(optionsContainerList, selected); 450 451 return; 452 } 453 454 selected.classList.add("arrow-selected"); 455 456 this._scrollIntoView(optionsContainerList, selected); 457 } 458 } 459 } 460 }, { 461 key: "_handleBackspace", 462 value: function _handleBackspace(e) { 463 if (e.keyCode === 8 && e.target.value === "") { 464 var lastSelectedOption = this._selectedOptions.length > 0 ? this._selectedOptions[this._selectedOptions.length - 1] : null; 465 466 if (lastSelectedOption) { 467 var targetLastSelectedOption = this._multiselect.querySelector("li[data-value=\"".concat(lastSelectedOption.value, "\"]")); 468 469 this._handleOption(targetLastSelectedOption); 470 471 if (this._selectedOptions.length === 0) { 472 this._domElements.optionsContainer.classList.remove("visible"); 473 } 474 } 475 } 476 } 477 }, { 478 key: "_handleClearSelectionBtn", 479 value: function _handleClearSelectionBtn() { 480 if (this._selectedOptions.length > 0) { 481 this._domElements.clear.style.display = "flex"; 482 } else { 483 this._domElements.clear.style.display = "none"; 484 } 485 } 486 }, { 487 key: "_handleEnter", 488 value: function _handleEnter(event) { 489 if (event.keyCode === 13) { 490 var selected = this._multiselect.querySelector(".multiselect__options ul li.arrow-selected"); 491 492 if (selected) { 493 this._handleOption(selected); 494 495 this._closeList(); 496 } 497 } 498 } 499 }, { 500 key: "_handleOption", 501 value: function _handleOption(target) { 502 var dispatchEvent = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true; 503 504 for (var i = 0; i < this._selectedOptions.length; i++) { 505 var el = this._selectedOptions[i]; 506 507 if (el.value == target.dataset.value) { 508 target.classList.remove("multiselect__options--selected"); 509 510 this._selectedOptions.splice(i, 1); 511 512 this._removeOptionFromList(target.dataset.value); 513 514 this._handleClearSelectionBtn(); 515 516 this._handlePlaceholder(); 517 518 return dispatchEvent && this._dispatchEvent({ 519 action: "REMOVE_OPTION", 520 value: target.dataset.value, 521 selection: this._selectedOptions 522 }); 523 } 524 } 525 526 527 for (var _i = 0; _i < this._options.length; _i++) { 528 var option = this._options[_i]; 529 530 if (option.value == target.dataset.value) { 531 target.classList.add("multiselect__options--selected"); 532 this._selectedOptions = [].concat(_toConsumableArray(this._selectedOptions), [option]); 533 534 this._addOptionToList(option, _i); 535 536 this._handleClearSelectionBtn(); 537 538 this._handlePlaceholder(); 539 540 return dispatchEvent && this._dispatchEvent({ 541 action: "ADD_OPTION", 542 value: target.dataset.value, 543 selection: this._selectedOptions 544 }); 545 } 546 } 547 } 548 }, { 549 key: "_handlePlaceholder", 550 value: function _handlePlaceholder() { 551 if (this._selectedOptions.length > 0) { 552 this._domElements.input.placeholder = ""; 553 } else { 554 this._domElements.input.placeholder = this._placeholder; 555 } 556 } 557 }, { 558 key: "_initSelectedList", 559 value: function _initSelectedList() { 560 var _this5 = this; 561 562 var hasItemsSelected = false; 563 564 var _loop2 = function _loop2(i) { 565 var option = _this5._options[i]; 566 567 if (option.selected) { 568 hasItemsSelected = true; 569 570 var target = _this5._domElements.options.find(function (el) { 571 return el.dataset.value == option.value; 572 }); 573 574 target.classList.add("multiselect__options--selected"); 575 _this5._selectedOptions = [].concat(_toConsumableArray(_this5._selectedOptions), [option]); 576 577 _this5._addOptionToList(option, i); 578 } 579 }; 580 581 for (var i = 0; i < this._options.length; i++) { 582 _loop2(i); 583 } 584 585 if (hasItemsSelected) this._handleClearSelectionBtn(); 586 587 this._handlePlaceholder(); 588 } 589 }, { 590 key: "_processTemplate", 591 value: function _processTemplate(template, index) { 592 var processedTemplate = template; 593 var objAttr = template.match(/\$\{(\w+)\}/g).map(function (e) { 594 return e.replace(/\$\{|\}/g, ""); 595 }); 596 597 for (var i = 0; i < objAttr.length; i++) { 598 var _this$_data$index$att; 599 600 var attr = objAttr[i]; 601 processedTemplate = processedTemplate.replace("${".concat(attr, "}"), (_this$_data$index$att = this._data[index][attr]) !== null && _this$_data$index$att !== void 0 ? _this$_data$index$att : ""); 602 } 603 604 return processedTemplate; 605 } 606 }, { 607 key: "_removeAllArrowSelected", 608 value: function _removeAllArrowSelected() { 609 var className = "arrow-selected"; 610 611 var target = this._domElements.options.find(function (el) { 612 return el.classList.contains(className); 613 }); 614 615 target && target.classList.remove(className); 616 } 617 }, { 618 key: "_removeOptionFromList", 619 value: function _removeOptionFromList(value) { 620 var optionDom = this._multiselect.querySelector("span[data-value=\"".concat(value, "\"]")); 621 622 optionDom && optionDom.parentNode && optionDom.parentNode.removeChild(optionDom); 623 } 624 }, { 625 key: "_renderOptionsList", 626 value: function _renderOptionsList() { 627 var _this6 = this; 628 629 var html = "\n <div class=\"multiselect__options\">\n <ul>\n ".concat(this._options.length > 0 && !this._itemTemplate ? this._options.map(function (option) { 630 return "\n <li data-value=\"".concat(option.value, "\">").concat(option.text, "</li>\n "); 631 }).join("") : "", "\n\n ").concat(this._options.length > 0 && this._itemTemplate ? this._options.map(function (option, index) { 632 return "\n <li data-value=\"".concat(option.value, "\">").concat(_this6._processTemplate(_this6._itemTemplate, index), "</li>\n "); 633 }).join("") : "", "\n ").concat(this._showNoData(this._options.length === 0), "\n </ul>\n </div>\n "); 634 635 this._multiselect.insertAdjacentHTML("beforeend", html); 636 } 637 }, { 638 key: "_renderMultiselect", 639 value: function _renderMultiselect() { 640 this._selectContainer.style.display = "none"; 641
642 var id = "iconic-" + this._generateId(20); 643 644 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 "); 645 646 this._selectContainer.insertAdjacentHTML("afterend", html); 647 648 this._multiselect = document.querySelector("#".concat(id)); 649 } 650 }, { 651 key: "_scrollIntoView", 652 value: function _scrollIntoView(parent, child) { 653 var rectParent = parent.getBoundingClientRect(); 654 var rectChild = child.getBoundingClientRect(); 655 656 if (!(rectParent.top < rectChild.bottom - child.offsetHeight)) { 657 parent.scrollTop = child.clientHeight + (child.offsetTop - child.offsetHeight); 658 } 659 660 661 if (!(rectParent.bottom > rectChild.top + child.offsetHeight)) { 662 parent.scrollTop = child.clientHeight + (child.offsetTop - child.offsetHeight) - (parent.offsetHeight - (child.offsetHeight + (child.offsetHeight - child.clientHeight))); 663 } 664 } 665 }, { 666 key: "_showNoData", 667 value: function _showNoData(condition) { 668 return condition ? "<p class=\"multiselect__options--no-data\">".concat(this._noData, "</p>") : ""; 669 } 670 }, { 671 key: "_showNoResults", 672 value: function _showNoResults(condition) { 673 var dom = this._multiselect.querySelector(".multiselect__options--no-results"); 674 675 if (condition) { 676 var html = "<p class=\"multiselect__options--no-results\">".concat(this._noResults, "</p>"); 677 !dom && this._domElements.optionsContainerList.insertAdjacentHTML("beforeend", html); 678 } else { 679 dom && dom.parentNode && dom.parentNode.removeChild(dom); 680 } 681 } 682 }]); 683 684 return IconicMultiSelect; 685}();
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.