nitro/priv/js/multi-select-webcomponent.min.js

/* @honatas/multi-select-webcomponent 1.2.0 edited */

function htmlEntities(str) {
  return String(str)
  .replace(/&/g, '&')
  .replace(/"/g, '"')
  .replace(/'/g, ''')
  .replace(/`/g, '`')
  .replace(/</g, '&lt;')
  .replace(/>/g, '&gt;')
  .replace(/\|/g, '&#124;');
}

function is_mobile(){if(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)){return true}else{return false}}
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).MultiselectWebcomponent=e()}(this,(function(){"use strict";class t extends HTMLElement{constructor(){var t,e;super(),this.options=[],this.is_modile=is_mobile(),this.optgroup=this.getAttribute("optgroup")||false, /* multi-select parameter 'optgroup="true"' for use disabled as optgroup '<option value="" disabled>Локації ---</option>' */
this.searchbox=document.createElement("input"),this.dropdown=document.createElement("div"),this.selected=document.createElement("div"),
this.querySelectorAll("option").forEach((t=>this.options.push(t.cloneNode(!0)))),this.setValuesOnConstructor( htmlEntities( this.getAttribute("value") ) ),this.searchbox.type="text",
this.searchbox.className=`msw-searchbox ${this.getAttribute("searchbox")||""}`,this.searchbox.addEventListener("keyup",(t=>this.onSearchboxKeyup(t))),
this.selected.className=`msw-selected ${this.getAttribute("selected")||""}`,
this.dropdown.className=`msw-dropdown ${this.getAttribute("dropdown")||""}`,this.dropdown.addEventListener("click",(()=>this.onDropdownClick())),this.innerHTML="",
this.appendChild(this.selected),null===(t=this.parentNode)||void 0===t||t.insertBefore(this.dropdown,this.nextSibling),
this.addEventListener("click",(()=>this.onMultiselectClick())),
null===(e=this.parentElement)||void 0===e||e.addEventListener("mouseleave",(()=>this.dropdown.style.display="none")),
this.searchbox.placeholder=this.getAttribute("placeholder")||"";
const s=this.getAttribute("disabled");s&&"false"!==s&&(this.searchbox.disabled=!0),this.build()}
set value(t){for(const t of this.options)t.selected=!1;if(t&&0!=t.length){for(const e of this.options)t.includes(e.value)&&(e.selected=!0);this.build()}}
setValuesOnConstructor(t){if(!t)return;const e=t.split(",");for(const t of this.options)e.includes(t.value)&&(t.selected=!0)}
get value(){const t=[];for(const e of this.options)e.selected&&t.push( htmlEntities(e.value) );return t}
set disabled(t){this.setAttribute("disabled",t?"true":"false"),this.searchbox.disabled=t,this.build()}
get disabled(){const t=this.getAttribute("disabled");return!(!t||"false"===t)}
set placeholder(t){this.setAttribute("placeholder",t),this.searchbox.placeholder=t}
get placeholder(){return this.getAttribute("placeholder")}
clear(){this.options=[],this.build()}
build(){
this.selected.innerHTML="",this.dropdown.innerHTML="";
if(!this.optgroup){/* without optgroups */ for(const t of this.options)t.selected?this.selected.appendChild(this.buildSelectedItem(t)):this.dropdown.appendChild(this.buildDropdownItem(t));
}else{ /* with optgroups */
for(let j=0;j<this.options.length;j++){let t = this.options[j];if(t.selected){this.selected.appendChild(this.buildSelectedItem(t))}else{
let is_next=!!this.options[j+1],skip=true;
if(t.disabled){if(is_next){
  for(let k=j+1;k<this.options.length;k++){if(this.options[k].selected)continue;if(!this.options[k].disabled){skip=false;break}break} /* break when disabled/not selected and not disabled */
  }else{/* disabled and no next */}}else skip=false;
  if(!skip)/* not disabled or not skip */ this.dropdown.appendChild(this.buildDropdownItem(t));
}}}
this.selected.appendChild(this.searchbox),this.dispatchEvent(new Event("change"));
if(!this.dropdown.childElementCount){this.searchbox.style.display="none"}else{this.searchbox.style.display="block"}}
buildSelectedItem(t){const e=document.createElement("div");return e.className=`msw-selecteditem ${this.getAttribute("selecteditem")||""}`,e.title="видалити",e.innerText=t.textContent,e.dataset.value=htmlEntities(t.value),this.disabled||e.addEventListener("click",(t=>this.onSelectedClick(t))),e}
buildDropdownItem(t){var classd;classd=(t.disabled?" msw-disabled":"");const e=document.createElement("div");return e.className=`msw-dropdownitem${classd} ${this.getAttribute("dropdownitem")||this.getAttribute("item")||""}`,e.innerText=t.textContent,e.dataset.value=htmlEntities(t.value),t.disabled||e.addEventListener("click",(t=>this.onItemClick(t))),e}
findOptionByValue(t){for(const e of this.options)if(t===e.value)return e}
chooseOption(t){t&&(t.selected=!0),this.searchbox.value="",this.build()}
onItemClick(t){this.chooseOption(this.findOptionByValue(t.currentTarget.dataset.value));if(this.is_modile)this.dropdown.style.display="none"}
onSelectedClick(t){const e=this.findOptionByValue(t.currentTarget.dataset.value);e&&(e.selected=!1),this.build()}
onClearClick(t){this.options.forEach((t=>t.selected=!1)),this.build(),this.searchbox.value="",this.searchbox.focus(),t.stopPropagation()}
onSelectAllClick(t){this.options.forEach((t=>t.selected=!0)),this.build(),this.dropdown.style.display="none",this.searchbox.value="",this.searchbox.focus(),t.stopPropagation()}
onMultiselectClick(){!0!==this.disabled&&(this.dropdown.style.display="block",this.searchbox.focus())}
onDropdownClick(){this.searchbox.focus()}
onSearchboxKeyup(t){if(("Enter"===t.key||"NumpadEnter"===t.key)&&""!==this.searchbox.value&&(this.dropdown.firstChild)){
return this.chooseOption(this.findOptionByValue(this.dropdown.firstChild.dataset.value)),void this.searchbox.focus();}
if(this.dropdown.innerHTML="",""===this.searchbox.value)
for(const t of this.options)t.selected||this.dropdown.appendChild(this.buildDropdownItem(t));
else{ for(const t of this.options){
!t.selected&&!t.disabled&&t.textContent&&t.textContent.toLocaleUpperCase().indexOf(this.searchbox.value.toLocaleUpperCase())>=0&&this.dropdown.appendChild(this.buildDropdownItem(t));}}
this.dropdown.style.display="block"}}return t}));