@oiz/stzh-components 2.6.0-beta → 2.7.0-alpha

package/dist/collection/libraries/tom-select/esm/tom-select.popular.js

@@ -2126,17 +2126,24 @@ class TomSelect extends MicroPlugin(MicroEvent) {
     const query = "label[for='" + escapeQuery(self.inputId) + "']";
     const label = document.querySelector(query);
     const label_click = self.focus.bind(self);
+    const labelled_by = input.getAttribute('aria-labelledby');
     if (label) {
       addEvent(label, 'click', label_click);
       setAttr(label, {
         for: control_id
       });
-      const label_id = getId(label, self.inputId + '-ts-label');
+
+      // const label_id = getId(label,self.inputId+'-ts-label');
+      // setAttr(focus_node,{'aria-labelledby':label_id});
+      // setAttr(dropdown_content,{'aria-labelledby':label_id});
+    }
+
+    if (labelled_by) {
       setAttr(focus_node, {
-        'aria-labelledby': label_id
+        'aria-labelledby': labelled_by
       });
       setAttr(dropdown_content, {
-        'aria-labelledby': label_id
+        'aria-labelledby': labelled_by
       });
     }
     wrapper.style.width = input.style.width;
@@ -2144,10 +2151,15 @@ class TomSelect extends MicroPlugin(MicroEvent) {
       const classes_plugins = 'plugin-' + self.plugins.names.join(' plugin-');
       addClasses([wrapper, dropdown], classes_plugins);
     }
-    if ((settings.maxItems === null || settings.maxItems > 1) && self.is_select_tag) {
-      setAttr(input, {
-        multiple: 'multiple'
+    if (settings.mode === 'multi') {
+      setAttr(dropdown_content, {
+        'aria-multiselectable': 'true'
       });
+      if (self.is_select_tag) {
+        setAttr(input, {
+          multiple: 'multiple'
+        });
+      }
     }
     if (settings.placeholder) {
       setAttr(control_input, {
@@ -2803,7 +2815,7 @@ class TomSelect extends MicroPlugin(MicroEvent) {
    *
    */
   getValue() {
-    if (this.is_select_tag && this.input.hasAttribute('multiple')) {
+    if (this.settings.mode === 'multi' && this.is_select_tag) {
       return this.items;
     }
     return this.items.join(this.settings.delimiter);
@@ -2936,9 +2948,11 @@ class TomSelect extends MicroPlugin(MicroEvent) {
     setAttr(this.focus_node, {
       'aria-activedescendant': option.getAttribute('id')
     });
-    setAttr(option, {
-      'aria-selected': 'true'
-    });
+    if (this.settings.mode === 'single' || this.settings.hideSelected) {
+      setAttr(option, {
+        'aria-selected': 'true'
+      });
+    }
     addClasses(option, 'active');
     if (scroll) this.scrollToOption(option);
   }
@@ -2981,9 +2995,11 @@ class TomSelect extends MicroPlugin(MicroEvent) {
   clearActiveOption() {
     if (this.activeOption) {
       removeClasses(this.activeOption, 'active');
-      setAttr(this.activeOption, {
-        'aria-selected': null
-      });
+      if (this.settings.mode === 'single' || this.settings.hideSelected) {
+        setAttr(this.activeOption, {
+          'aria-selected': null
+        });
+      }
     }
     this.activeOption = null;
     setAttr(this.focus_node, {
@@ -3198,10 +3214,16 @@ class TomSelect extends MicroPlugin(MicroEvent) {
       if (option === undefined) continue;
       let opt_hash = get_hash(opt_value);
       let option_el = self.getOption(opt_hash, true);
+      const option_selected = self.items.includes(opt_hash);
 
       // toggle 'selected' class
       if (!self.settings.hideSelected) {
-        option_el.classList.toggle('selected', self.items.includes(opt_hash));
+        option_el.classList.toggle('selected', option_selected);
+        if (this.settings.mode === 'multi') {
+          setAttr(option_el, {
+            'aria-selected': option_selected ? 'true' : 'false'
+          });
+        }
       }
       optgroup = option[self.settings.optgroupField] || '';
       optgroups = Array.isArray(optgroup) ? optgroup : [optgroup];
@@ -3219,10 +3241,17 @@ class TomSelect extends MicroPlugin(MicroEvent) {
         // nodes can only have one parent, so if the option is in mutple groups, we need a clone
         if (j > 0) {
           option_el = option_el.cloneNode(true);
-          setAttr(option_el, {
-            id: option.$id + '-clone-' + j,
-            'aria-selected': null
-          });
+          if (this.settings.mode === 'multi' && !self.settings.hideSelected) {
+            setAttr(option_el, {
+              id: option.$id + '-clone-' + j,
+              'aria-selected': option_selected ? 'true' : 'false'
+            });
+          } else {
+            setAttr(option_el, {
+              id: option.$id + '-clone-' + j,
+              'aria-selected': null
+            });
+          }
           option_el.classList.add('ts-cloned');
           removeClasses(option_el, 'active');
 

package/dist/collection/libraries/tom-select/js/tom-select.base.js

@@ -2132,17 +2132,24 @@
 	    const query = "label[for='" + escapeQuery(self.inputId) + "']";
 	    const label = document.querySelector(query);
 	    const label_click = self.focus.bind(self);
+	    const labelled_by = input.getAttribute('aria-labelledby');
 	    if (label) {
 	      addEvent(label, 'click', label_click);
 	      setAttr(label, {
 	        for: control_id
 	      });
-	      const label_id = getId(label, self.inputId + '-ts-label');
+
+	      // const label_id = getId(label,self.inputId+'-ts-label');
+	      // setAttr(focus_node,{'aria-labelledby':label_id});
+	      // setAttr(dropdown_content,{'aria-labelledby':label_id});
+	    }
+
+	    if (labelled_by) {
 	      setAttr(focus_node, {
-	        'aria-labelledby': label_id
+	        'aria-labelledby': labelled_by
 	      });
 	      setAttr(dropdown_content, {
-	        'aria-labelledby': label_id
+	        'aria-labelledby': labelled_by
 	      });
 	    }
 	    wrapper.style.width = input.style.width;
@@ -2150,10 +2157,15 @@
 	      const classes_plugins = 'plugin-' + self.plugins.names.join(' plugin-');
 	      addClasses([wrapper, dropdown], classes_plugins);
 	    }
-	    if ((settings.maxItems === null || settings.maxItems > 1) && self.is_select_tag) {
-	      setAttr(input, {
-	        multiple: 'multiple'
+	    if (settings.mode === 'multi') {
+	      setAttr(dropdown_content, {
+	        'aria-multiselectable': 'true'
 	      });
+	      if (self.is_select_tag) {
+	        setAttr(input, {
+	          multiple: 'multiple'
+	        });
+	      }
 	    }
 	    if (settings.placeholder) {
 	      setAttr(control_input, {
@@ -2809,7 +2821,7 @@
 	   *
 	   */
 	  getValue() {
-	    if (this.is_select_tag && this.input.hasAttribute('multiple')) {
+	    if (this.settings.mode === 'multi' && this.is_select_tag) {
 	      return this.items;
 	    }
 	    return this.items.join(this.settings.delimiter);
@@ -2942,9 +2954,11 @@
 	    setAttr(this.focus_node, {
 	      'aria-activedescendant': option.getAttribute('id')
 	    });
-	    setAttr(option, {
-	      'aria-selected': 'true'
-	    });
+	    if (this.settings.mode === 'single' || this.settings.hideSelected) {
+	      setAttr(option, {
+	        'aria-selected': 'true'
+	      });
+	    }
 	    addClasses(option, 'active');
 	    if (scroll) this.scrollToOption(option);
 	  }
@@ -2987,9 +3001,11 @@
 	  clearActiveOption() {
 	    if (this.activeOption) {
 	      removeClasses(this.activeOption, 'active');
-	      setAttr(this.activeOption, {
-	        'aria-selected': null
-	      });
+	      if (this.settings.mode === 'single' || this.settings.hideSelected) {
+	        setAttr(this.activeOption, {
+	          'aria-selected': null
+	        });
+	      }
 	    }
 	    this.activeOption = null;
 	    setAttr(this.focus_node, {
@@ -3204,10 +3220,16 @@
 	      if (option === undefined) continue;
 	      let opt_hash = get_hash(opt_value);
 	      let option_el = self.getOption(opt_hash, true);
+	      const option_selected = self.items.includes(opt_hash);
 
 	      // toggle 'selected' class
 	      if (!self.settings.hideSelected) {
-	        option_el.classList.toggle('selected', self.items.includes(opt_hash));
+	        option_el.classList.toggle('selected', option_selected);
+	        if (this.settings.mode === 'multi') {
+	          setAttr(option_el, {
+	            'aria-selected': option_selected ? 'true' : 'false'
+	          });
+	        }
 	      }
 	      optgroup = option[self.settings.optgroupField] || '';
 	      optgroups = Array.isArray(optgroup) ? optgroup : [optgroup];
@@ -3225,10 +3247,17 @@
 	        // nodes can only have one parent, so if the option is in mutple groups, we need a clone
 	        if (j > 0) {
 	          option_el = option_el.cloneNode(true);
-	          setAttr(option_el, {
-	            id: option.$id + '-clone-' + j,
-	            'aria-selected': null
-	          });
+	          if (this.settings.mode === 'multi' && !self.settings.hideSelected) {
+	            setAttr(option_el, {
+	              id: option.$id + '-clone-' + j,
+	              'aria-selected': option_selected ? 'true' : 'false'
+	            });
+	          } else {
+	            setAttr(option_el, {
+	              id: option.$id + '-clone-' + j,
+	              'aria-selected': null
+	            });
+	          }
 	          option_el.classList.add('ts-cloned');
 	          removeClasses(option_el, 'active');
 

package/dist/collection/libraries/tom-select/js/tom-select.base.min.js

@@ -33,11 +33,11 @@ for(let t in e){let i=e[t]
 i&&(s[t]=n(i)),t.length>1&&o.push(r(t))}o.sort(((t,e)=>e.length-t.length))
 const l=i(o)
 return h=new RegExp("^"+l,"u"),s},I=(t,e=1)=>(e=Math.max(e,t.length-1),i(d(t).map((t=>((t,e=1)=>{let i=0
-return t=t.map((t=>(p[t]&&(i+=t.length),p[t]||t))),i>=e?s(t):""})(t,e))))),_=(t,e=!0)=>{let n=t.length>1?1:0
+return t=t.map((t=>(p[t]&&(i+=t.length),p[t]||t))),i>=e?s(t):""})(t,e))))),S=(t,e=!0)=>{let n=t.length>1?1:0
 return i(t.map((t=>{let i=[]
 const o=e?t.length():t.length()-1
 for(let e=0;e<o;e++)i.push(I(t.substrs[e]||"",n))
-return s(i)})))},S=(t,e)=>{for(const i of e){if(i.start!=t.start||i.end!=t.end)continue
+return s(i)})))},_=(t,e)=>{for(const i of e){if(i.start!=t.start||i.end!=t.end)continue
 if(i.substrs.join("")!==t.substrs.join(""))continue
 let e=t.parts
 const s=t=>{for(const i of e){if(i.start===t.start&&i.substr===t.substr)return!1
@@ -59,10 +59,10 @@ t.add({start:e,end:e+i,length:i,substr:r}),a.add("1")}else t.add({start:e,end:e+
 else if(r){let s=t.clone(e,i)
 const n=r.length
 s.add({start:e,end:e+n,length:n,substr:r}),l.push(s)}else a.add("3")}if(l.length>0){l=l.sort(((t,e)=>t.length()-e.length()))
-for(let t of l)S(t,s)||s.push(t)}else if(e>0&&1==a.size&&!a.has("3")){i+=_(s,!1)
+for(let t of l)_(t,s)||s.push(t)}else if(e>0&&1==a.size&&!a.has("3")){i+=S(s,!1)
 let t=new A
 const e=s[0]
-e&&t.add(e.last()),s=[t]}}return i+=_(s,!0),i},F=(t,e)=>{if(t)return t[e]},x=(t,e)=>{if(t){for(var i,s=e.split(".");(i=s.shift())&&(t=t[i]););return t}},L=(t,e,i)=>{var s,n
+e&&t.add(e.last()),s=[t]}}return i+=S(s,!0),i},F=(t,e)=>{if(t)return t[e]},x=(t,e)=>{if(t){for(var i,s=e.split(".");(i=s.shift())&&(t=t[i]););return t}},L=(t,e,i)=>{var s,n
 return t?(t+="",null==e.regex||-1===(n=t.search(e.regex))?0:(s=e.string.length/t.length,0===n&&(s+=.5),s*i)):0},k=(t,e)=>{var i=t[e]
 if("function"==typeof i)return i
 i&&!Array.isArray(i)&&(t[e]=[i])},E=(t,e)=>{if(Array.isArray(t))t.forEach(e)
@@ -169,18 +169,16 @@ if(H(r,n.wrapperClass,d,u),H(l,n.controlClass),lt(r,l),H(a,n.dropdownClass,u),n.
 E(["autocorrect","autocapitalize","autocomplete"],(t=>{s.getAttribute(t)&&Q(p,{[t]:s.getAttribute(t)})})),p.tabIndex=-1,l.appendChild(p),this.focus_node=p}else n.controlInput?(p=$(n.controlInput),this.focus_node=p):(p=$("<input/>"),this.focus_node=l)
 this.wrapper=r,this.dropdown=a,this.dropdown_content=c,this.control=l,this.control_input=p,this.setup()}setup(){const t=this,e=t.settings,i=t.control_input,s=t.dropdown,n=t.dropdown_content,o=t.wrapper,l=t.control,a=t.input,c=t.focus_node,d={passive:!0},u=t.inputId+"-ts-dropdown"
 Q(n,{id:u}),Q(c,{role:"combobox","aria-haspopup":"listbox","aria-expanded":"false","aria-controls":u})
-const p=ot(c,t.inputId+"-ts-control"),h="label[for='"+(t=>t.replace(/['"\\]/g,"\\$&"))(t.inputId)+"']",g=document.querySelector(h),f=t.focus.bind(t)
-if(g){st(g,"click",f),Q(g,{for:p})
-const e=ot(g,t.inputId+"-ts-label")
-Q(c,{"aria-labelledby":e}),Q(n,{"aria-labelledby":e})}if(o.style.width=a.style.width,t.plugins.names.length){const e="plugin-"+t.plugins.names.join(" plugin-")
-H([o,s],e)}(null===e.maxItems||e.maxItems>1)&&t.is_select_tag&&Q(a,{multiple:"multiple"}),e.placeholder&&Q(i,{placeholder:e.placeholder}),!e.splitOn&&e.delimiter&&(e.splitOn=new RegExp("\\s*"+r(e.delimiter)+"+\\s*")),e.load&&e.loadThrottle&&(e.load=tt(e.load,e.loadThrottle)),t.control_input.type=a.type,st(s,"mousemove",(()=>{t.ignoreHover=!1})),st(s,"mouseenter",(e=>{var i=z(e.target,"[data-selectable]",s)
+const p=ot(c,t.inputId+"-ts-control"),h="label[for='"+(t=>t.replace(/['"\\]/g,"\\$&"))(t.inputId)+"']",g=document.querySelector(h),f=t.focus.bind(t),v=a.getAttribute("aria-labelledby")
+if(g&&(st(g,"click",f),Q(g,{for:p})),v&&(Q(c,{"aria-labelledby":v}),Q(n,{"aria-labelledby":v})),o.style.width=a.style.width,t.plugins.names.length){const e="plugin-"+t.plugins.names.join(" plugin-")
+H([o,s],e)}"multi"===e.mode&&(Q(n,{"aria-multiselectable":"true"}),t.is_select_tag&&Q(a,{multiple:"multiple"})),e.placeholder&&Q(i,{placeholder:e.placeholder}),!e.splitOn&&e.delimiter&&(e.splitOn=new RegExp("\\s*"+r(e.delimiter)+"+\\s*")),e.load&&e.loadThrottle&&(e.load=tt(e.load,e.loadThrottle)),t.control_input.type=a.type,st(s,"mousemove",(()=>{t.ignoreHover=!1})),st(s,"mouseenter",(e=>{var i=z(e.target,"[data-selectable]",s)
 i&&t.onOptionHover(e,i)}),{capture:!0}),st(s,"click",(e=>{const i=z(e.target,"[data-selectable]")
 i&&(t.onOptionSelect(e,i),it(e,!0))})),st(l,"click",(e=>{var s=z(e.target,"[data-ts-item]",l)
 s&&t.onItemSelect(e,s)?it(e,!0):""==i.value&&(t.onClick(),it(e,!0))})),st(c,"keydown",(e=>t.onKeyDown(e))),st(i,"keypress",(e=>t.onKeyPress(e))),st(i,"input",(e=>t.onInput(e))),st(c,"blur",(e=>t.onBlur(e))),st(c,"focus",(e=>t.onFocus(e))),st(i,"paste",(e=>t.onPaste(e)))
-const v=e=>{const n=e.composedPath()[0]
+const m=e=>{const n=e.composedPath()[0]
 if(!o.contains(n)&&!s.contains(n))return t.isFocused&&t.blur(),void t.inputState()
-n==i&&t.isOpen?e.stopPropagation():it(e,!0)},m=()=>{t.isOpen&&t.positionDropdown()}
-st(document,"mousedown",v),st(window,"scroll",m,d),st(window,"resize",m,d),this._destroy=()=>{document.removeEventListener("mousedown",v),window.removeEventListener("scroll",m),window.removeEventListener("resize",m),g&&g.removeEventListener("click",f)},this.revertSettings={innerHTML:a.innerHTML,tabIndex:a.tabIndex},a.tabIndex=-1,a.insertAdjacentElement("afterend",t.wrapper),t.sync(!1),e.items=[],delete e.optgroups,delete e.options,st(a,"invalid",(()=>{t.isValid&&(t.isValid=!1,t.isInvalid=!0,t.refreshState())})),t.updateOriginalInput(),t.refreshItems(),t.close(!1),t.inputState(),t.isSetup=!0,a.disabled?t.disable():t.enable(),t.on("change",this.onChange),H(a,"tomselected","ts-hidden-accessible"),t.trigger("initialize"),!0===e.preload&&t.preload()}setupOptions(t=[],e=[]){this.addOptions(t),E(e,(t=>{this.registerOptionGroup(t)}))}setupTemplates(){var t=this,e=t.settings.labelField,i=t.settings.optgroupLabelField,s={optgroup:t=>{let e=document.createElement("div")
+n==i&&t.isOpen?e.stopPropagation():it(e,!0)},y=()=>{t.isOpen&&t.positionDropdown()}
+st(document,"mousedown",m),st(window,"scroll",y,d),st(window,"resize",y,d),this._destroy=()=>{document.removeEventListener("mousedown",m),window.removeEventListener("scroll",y),window.removeEventListener("resize",y),g&&g.removeEventListener("click",f)},this.revertSettings={innerHTML:a.innerHTML,tabIndex:a.tabIndex},a.tabIndex=-1,a.insertAdjacentElement("afterend",t.wrapper),t.sync(!1),e.items=[],delete e.optgroups,delete e.options,st(a,"invalid",(()=>{t.isValid&&(t.isValid=!1,t.isInvalid=!0,t.refreshState())})),t.updateOriginalInput(),t.refreshItems(),t.close(!1),t.inputState(),t.isSetup=!0,a.disabled?t.disable():t.enable(),t.on("change",this.onChange),H(a,"tomselected","ts-hidden-accessible"),t.trigger("initialize"),!0===e.preload&&t.preload()}setupOptions(t=[],e=[]){this.addOptions(t),E(e,(t=>{this.registerOptionGroup(t)}))}setupTemplates(){var t=this,e=t.settings.labelField,i=t.settings.optgroupLabelField,s={optgroup:t=>{let e=document.createElement("div")
 return e.className="optgroup",e.appendChild(t.options),e},optgroup_header:(t,e)=>'<div class="optgroup-header">'+e(t[i])+"</div>",option:(t,i)=>"<div>"+i(t[e])+"</div>",item:(t,i)=>"<div>"+i(t[e])+"</div>",option_create:(t,e)=>'<div class="create">Add <strong>'+e(t.input)+"</strong>&hellip;</div>",no_results:()=>'<div class="no-results">No results found</div>',loading:()=>'<div class="spinner"></div>',not_loading:()=>{},dropdown:()=>"<div></div>"}
 t.settings.render=Object.assign({},s,t.settings.render)}setupCallbacks(){var t,e,i={initialize:"onInitialize",change:"onChange",item_add:"onItemAdd",item_remove:"onItemRemove",item_select:"onItemSelect",clear:"onClear",option_add:"onOptionAdd",option_remove:"onOptionRemove",option_clear:"onOptionClear",optgroup_add:"onOptionGroupAdd",optgroup_remove:"onOptionGroupRemove",optgroup_clear:"onOptionGroupClear",dropdown_open:"onDropdownOpen",dropdown_close:"onDropdownClose",type:"onType",load:"onLoad",focus:"onFocus",blur:"onBlur"}
 for(t in i)(e=this.settings[i[t]])&&this.on(t,e)}sync(t=!0){const e=this,i=t?at(e.input,{delimiter:e.settings.delimiter}):e.settings
@@ -221,16 +219,16 @@ const i=e.loadCallback.bind(e)
 e.settings.load.call(e,t,i)}loadCallback(t,e){const i=this
 i.loading=Math.max(i.loading-1,0),i.lastQuery=null,i.clearActiveOption(),i.setupOptions(t,e),i.refreshOptions(i.isFocused&&!i.isInputHidden),i.loading||N(i.wrapper,i.settings.loadingClass),i.trigger("load",t,e)}preload(){var t=this.wrapper.classList
 t.contains("preloaded")||(t.add("preloaded"),this.load(""))}setTextboxValue(t=""){var e=this.control_input
-e.value!==t&&(e.value=t,q(e,"update"),this.lastValue=t)}getValue(){return this.is_select_tag&&this.input.hasAttribute("multiple")?this.items:this.items.join(this.settings.delimiter)}setValue(t,e){et(this,e?[]:["change"],(()=>{this.clear(e),this.addItems(t,e)}))}setMaxItems(t){0===t&&(t=null),this.settings.maxItems=t,this.refreshState()}setActiveItem(t,e){var i,s,n,o,r,l,a=this
+e.value!==t&&(e.value=t,q(e,"update"),this.lastValue=t)}getValue(){return"multi"===this.settings.mode&&this.is_select_tag?this.items:this.items.join(this.settings.delimiter)}setValue(t,e){et(this,e?[]:["change"],(()=>{this.clear(e),this.addItems(t,e)}))}setMaxItems(t){0===t&&(t=null),this.settings.maxItems=t,this.refreshState()}setActiveItem(t,e){var i,s,n,o,r,l,a=this
 if("single"!==a.settings.mode){if(!t)return a.clearActiveItems(),void(a.isFocused&&a.showInput())
 if("click"===(i=e&&e.type.toLowerCase())&&nt("shiftKey",e)&&a.activeItems.length){for(l=a.getLastActive(),(n=Array.prototype.indexOf.call(a.control.children,l))>(o=Array.prototype.indexOf.call(a.control.children,t))&&(r=n,n=o,o=r),s=n;s<=o;s++)t=a.control.children[s],-1===a.activeItems.indexOf(t)&&a.setActiveItemClass(t)
 it(e)}else"click"===i&&nt(U,e)||"keydown"===i&&nt("shiftKey",e)?t.classList.contains("active")?a.removeActiveItem(t):a.setActiveItemClass(t):(a.clearActiveItems(),a.setActiveItemClass(t))
 a.hideInput(),a.isFocused||a.focus()}}setActiveItemClass(t){const e=this,i=e.control.querySelector(".last-active")
 i&&N(i,"last-active"),H(t,"active last-active"),e.trigger("item_select",t),-1==e.activeItems.indexOf(t)&&e.activeItems.push(t)}removeActiveItem(t){var e=this.activeItems.indexOf(t)
-this.activeItems.splice(e,1),N(t,"active")}clearActiveItems(){N(this.activeItems,"active"),this.activeItems=[]}setActiveOption(t,e=!0){t!==this.activeOption&&(this.clearActiveOption(),t&&(this.activeOption=t,Q(this.focus_node,{"aria-activedescendant":t.getAttribute("id")}),Q(t,{"aria-selected":"true"}),H(t,"active"),e&&this.scrollToOption(t)))}scrollToOption(t,e){if(!t)return
+this.activeItems.splice(e,1),N(t,"active")}clearActiveItems(){N(this.activeItems,"active"),this.activeItems=[]}setActiveOption(t,e=!0){t!==this.activeOption&&(this.clearActiveOption(),t&&(this.activeOption=t,Q(this.focus_node,{"aria-activedescendant":t.getAttribute("id")}),("single"===this.settings.mode||this.settings.hideSelected)&&Q(t,{"aria-selected":"true"}),H(t,"active"),e&&this.scrollToOption(t)))}scrollToOption(t,e){if(!t)return
 const i=this.dropdown_content,s=i.clientHeight,n=i.scrollTop||0,o=t.offsetHeight,r=t.getBoundingClientRect().top-i.getBoundingClientRect().top+n
 r+o>s+n?this.scroll(r-s+o,e):r<n&&this.scroll(r,e)}scroll(t,e){const i=this.dropdown_content
-e&&(i.style.scrollBehavior=e),i.scrollTop=t,i.style.scrollBehavior=""}clearActiveOption(){this.activeOption&&(N(this.activeOption,"active"),Q(this.activeOption,{"aria-selected":null})),this.activeOption=null,Q(this.focus_node,{"aria-activedescendant":null})}selectAll(){const t=this
+e&&(i.style.scrollBehavior=e),i.scrollTop=t,i.style.scrollBehavior=""}clearActiveOption(){this.activeOption&&(N(this.activeOption,"active"),("single"===this.settings.mode||this.settings.hideSelected)&&Q(this.activeOption,{"aria-selected":null})),this.activeOption=null,Q(this.focus_node,{"aria-activedescendant":null})}selectAll(){const t=this
 if("single"===t.settings.mode)return
 const e=t.controlChildren()
 e.length&&(t.hideInput(),t.close(),t.activeItems=e,E(e,(e=>{t.setActiveItemClass(e)})))}inputState(){var t=this
@@ -249,9 +247,10 @@ if(!t)continue
 let n=t.id,l=h.options[n]
 if(void 0===l)continue
 let a=Y(n),d=h.getOption(a,!0)
-for(h.settings.hideSelected||d.classList.toggle("selected",h.items.includes(a)),o=l[h.settings.optgroupField]||"",i=0,s=(r=Array.isArray(o)?o:[o])&&r.length;i<s;i++){o=r[i],h.optgroups.hasOwnProperty(o)||(o="")
+const g=h.items.includes(a)
+for(h.settings.hideSelected||(d.classList.toggle("selected",g),"multi"===this.settings.mode&&Q(d,{"aria-selected":g?"true":"false"})),o=l[h.settings.optgroupField]||"",i=0,s=(r=Array.isArray(o)?o:[o])&&r.length;i<s;i++){o=r[i],h.optgroups.hasOwnProperty(o)||(o="")
 let t=u[o]
-void 0===t&&(t=document.createDocumentFragment(),p.push(o)),i>0&&(d=d.cloneNode(!0),Q(d,{id:l.$id+"-clone-"+i,"aria-selected":null}),d.classList.add("ts-cloned"),N(d,"active"),h.activeOption&&h.activeOption.dataset.value==n&&c&&c.dataset.group===o.toString()&&(y=d)),t.appendChild(d),u[o]=t}}h.settings.lockOptgroupOrder&&p.sort(((t,e)=>{const i=h.optgroups[t],s=h.optgroups[e]
+void 0===t&&(t=document.createDocumentFragment(),p.push(o)),i>0&&(d=d.cloneNode(!0),"multi"!==this.settings.mode||h.settings.hideSelected?Q(d,{id:l.$id+"-clone-"+i,"aria-selected":null}):Q(d,{id:l.$id+"-clone-"+i,"aria-selected":g?"true":"false"}),d.classList.add("ts-cloned"),N(d,"active"),h.activeOption&&h.activeOption.dataset.value==n&&c&&c.dataset.group===o.toString()&&(y=d)),t.appendChild(d),u[o]=t}}h.settings.lockOptgroupOrder&&p.sort(((t,e)=>{const i=h.optgroups[t],s=h.optgroups[e]
 return(i&&i.$order||0)-(s&&s.$order||0)})),l=document.createDocumentFragment(),E(p,(t=>{let e=u[t]
 if(!e||!e.children.length)return
 let i=h.optgroups[t]

package/dist/collection/libraries/tom-select/js/tom-select.complete.js

@@ -2132,17 +2132,24 @@
 	    const query = "label[for='" + escapeQuery(self.inputId) + "']";
 	    const label = document.querySelector(query);
 	    const label_click = self.focus.bind(self);
+	    const labelled_by = input.getAttribute('aria-labelledby');
 	    if (label) {
 	      addEvent(label, 'click', label_click);
 	      setAttr(label, {
 	        for: control_id
 	      });
-	      const label_id = getId(label, self.inputId + '-ts-label');
+
+	      // const label_id = getId(label,self.inputId+'-ts-label');
+	      // setAttr(focus_node,{'aria-labelledby':label_id});
+	      // setAttr(dropdown_content,{'aria-labelledby':label_id});
+	    }
+
+	    if (labelled_by) {
 	      setAttr(focus_node, {
-	        'aria-labelledby': label_id
+	        'aria-labelledby': labelled_by
 	      });
 	      setAttr(dropdown_content, {
-	        'aria-labelledby': label_id
+	        'aria-labelledby': labelled_by
 	      });
 	    }
 	    wrapper.style.width = input.style.width;
@@ -2150,10 +2157,15 @@
 	      const classes_plugins = 'plugin-' + self.plugins.names.join(' plugin-');
 	      addClasses([wrapper, dropdown], classes_plugins);
 	    }
-	    if ((settings.maxItems === null || settings.maxItems > 1) && self.is_select_tag) {
-	      setAttr(input, {
-	        multiple: 'multiple'
+	    if (settings.mode === 'multi') {
+	      setAttr(dropdown_content, {
+	        'aria-multiselectable': 'true'
 	      });
+	      if (self.is_select_tag) {
+	        setAttr(input, {
+	          multiple: 'multiple'
+	        });
+	      }
 	    }
 	    if (settings.placeholder) {
 	      setAttr(control_input, {
@@ -2809,7 +2821,7 @@
 	   *
 	   */
 	  getValue() {
-	    if (this.is_select_tag && this.input.hasAttribute('multiple')) {
+	    if (this.settings.mode === 'multi' && this.is_select_tag) {
 	      return this.items;
 	    }
 	    return this.items.join(this.settings.delimiter);
@@ -2942,9 +2954,11 @@
 	    setAttr(this.focus_node, {
 	      'aria-activedescendant': option.getAttribute('id')
 	    });
-	    setAttr(option, {
-	      'aria-selected': 'true'
-	    });
+	    if (this.settings.mode === 'single' || this.settings.hideSelected) {
+	      setAttr(option, {
+	        'aria-selected': 'true'
+	      });
+	    }
 	    addClasses(option, 'active');
 	    if (scroll) this.scrollToOption(option);
 	  }
@@ -2987,9 +3001,11 @@
 	  clearActiveOption() {
 	    if (this.activeOption) {
 	      removeClasses(this.activeOption, 'active');
-	      setAttr(this.activeOption, {
-	        'aria-selected': null
-	      });
+	      if (this.settings.mode === 'single' || this.settings.hideSelected) {
+	        setAttr(this.activeOption, {
+	          'aria-selected': null
+	        });
+	      }
 	    }
 	    this.activeOption = null;
 	    setAttr(this.focus_node, {
@@ -3204,10 +3220,16 @@
 	      if (option === undefined) continue;
 	      let opt_hash = get_hash(opt_value);
 	      let option_el = self.getOption(opt_hash, true);
+	      const option_selected = self.items.includes(opt_hash);
 
 	      // toggle 'selected' class
 	      if (!self.settings.hideSelected) {
-	        option_el.classList.toggle('selected', self.items.includes(opt_hash));
+	        option_el.classList.toggle('selected', option_selected);
+	        if (this.settings.mode === 'multi') {
+	          setAttr(option_el, {
+	            'aria-selected': option_selected ? 'true' : 'false'
+	          });
+	        }
 	      }
 	      optgroup = option[self.settings.optgroupField] || '';
 	      optgroups = Array.isArray(optgroup) ? optgroup : [optgroup];
@@ -3225,10 +3247,17 @@
 	        // nodes can only have one parent, so if the option is in mutple groups, we need a clone
 	        if (j > 0) {
 	          option_el = option_el.cloneNode(true);
-	          setAttr(option_el, {
-	            id: option.$id + '-clone-' + j,
-	            'aria-selected': null
-	          });
+	          if (this.settings.mode === 'multi' && !self.settings.hideSelected) {
+	            setAttr(option_el, {
+	              id: option.$id + '-clone-' + j,
+	              'aria-selected': option_selected ? 'true' : 'false'
+	            });
+	          } else {
+	            setAttr(option_el, {
+	              id: option.$id + '-clone-' + j,
+	              'aria-selected': null
+	            });
+	          }
 	          option_el.classList.add('ts-cloned');
 	          removeClasses(option_el, 'active');
 

package/dist/collection/libraries/tom-select/js/tom-select.complete.min.js

@@ -169,18 +169,16 @@ if(H(r,n.wrapperClass,d,u),H(l,n.controlClass),ae(r,l),H(a,n.dropdownClass,u),n.
 E(["autocorrect","autocapitalize","autocomplete"],(e=>{s.getAttribute(e)&&G(p,{[e]:s.getAttribute(e)})})),p.tabIndex=-1,l.appendChild(p),this.focus_node=p}else n.controlInput?(p=V(n.controlInput),this.focus_node=p):(p=V("<input/>"),this.focus_node=l)
 this.wrapper=r,this.dropdown=a,this.dropdown_content=c,this.control=l,this.control_input=p,this.setup()}setup(){const e=this,t=e.settings,i=e.control_input,s=e.dropdown,n=e.dropdown_content,o=e.wrapper,l=e.control,a=e.input,c=e.focus_node,d={passive:!0},u=e.inputId+"-ts-dropdown"
 G(n,{id:u}),G(c,{role:"combobox","aria-haspopup":"listbox","aria-expanded":"false","aria-controls":u})
-const p=re(c,e.inputId+"-ts-control"),h="label[for='"+(e=>e.replace(/['"\\]/g,"\\$&"))(e.inputId)+"']",g=document.querySelector(h),f=e.focus.bind(e)
-if(g){ne(g,"click",f),G(g,{for:p})
-const t=re(g,e.inputId+"-ts-label")
-G(c,{"aria-labelledby":t}),G(n,{"aria-labelledby":t})}if(o.style.width=a.style.width,e.plugins.names.length){const t="plugin-"+e.plugins.names.join(" plugin-")
-H([o,s],t)}(null===t.maxItems||t.maxItems>1)&&e.is_select_tag&&G(a,{multiple:"multiple"}),t.placeholder&&G(i,{placeholder:t.placeholder}),!t.splitOn&&t.delimiter&&(t.splitOn=new RegExp("\\s*"+r(t.delimiter)+"+\\s*")),t.load&&t.loadThrottle&&(t.load=te(t.load,t.loadThrottle)),e.control_input.type=a.type,ne(s,"mousemove",(()=>{e.ignoreHover=!1})),ne(s,"mouseenter",(t=>{var i=B(t.target,"[data-selectable]",s)
+const p=re(c,e.inputId+"-ts-control"),h="label[for='"+(e=>e.replace(/['"\\]/g,"\\$&"))(e.inputId)+"']",g=document.querySelector(h),f=e.focus.bind(e),v=a.getAttribute("aria-labelledby")
+if(g&&(ne(g,"click",f),G(g,{for:p})),v&&(G(c,{"aria-labelledby":v}),G(n,{"aria-labelledby":v})),o.style.width=a.style.width,e.plugins.names.length){const t="plugin-"+e.plugins.names.join(" plugin-")
+H([o,s],t)}"multi"===t.mode&&(G(n,{"aria-multiselectable":"true"}),e.is_select_tag&&G(a,{multiple:"multiple"})),t.placeholder&&G(i,{placeholder:t.placeholder}),!t.splitOn&&t.delimiter&&(t.splitOn=new RegExp("\\s*"+r(t.delimiter)+"+\\s*")),t.load&&t.loadThrottle&&(t.load=te(t.load,t.loadThrottle)),e.control_input.type=a.type,ne(s,"mousemove",(()=>{e.ignoreHover=!1})),ne(s,"mouseenter",(t=>{var i=B(t.target,"[data-selectable]",s)
 i&&e.onOptionHover(t,i)}),{capture:!0}),ne(s,"click",(t=>{const i=B(t.target,"[data-selectable]")
 i&&(e.onOptionSelect(t,i),se(t,!0))})),ne(l,"click",(t=>{var s=B(t.target,"[data-ts-item]",l)
 s&&e.onItemSelect(t,s)?se(t,!0):""==i.value&&(e.onClick(),se(t,!0))})),ne(c,"keydown",(t=>e.onKeyDown(t))),ne(i,"keypress",(t=>e.onKeyPress(t))),ne(i,"input",(t=>e.onInput(t))),ne(c,"blur",(t=>e.onBlur(t))),ne(c,"focus",(t=>e.onFocus(t))),ne(i,"paste",(t=>e.onPaste(t)))
-const v=t=>{const n=t.composedPath()[0]
+const m=t=>{const n=t.composedPath()[0]
 if(!o.contains(n)&&!s.contains(n))return e.isFocused&&e.blur(),void e.inputState()
-n==i&&e.isOpen?t.stopPropagation():se(t,!0)},m=()=>{e.isOpen&&e.positionDropdown()}
-ne(document,"mousedown",v),ne(window,"scroll",m,d),ne(window,"resize",m,d),this._destroy=()=>{document.removeEventListener("mousedown",v),window.removeEventListener("scroll",m),window.removeEventListener("resize",m),g&&g.removeEventListener("click",f)},this.revertSettings={innerHTML:a.innerHTML,tabIndex:a.tabIndex},a.tabIndex=-1,a.insertAdjacentElement("afterend",e.wrapper),e.sync(!1),t.items=[],delete t.optgroups,delete t.options,ne(a,"invalid",(()=>{e.isValid&&(e.isValid=!1,e.isInvalid=!0,e.refreshState())})),e.updateOriginalInput(),e.refreshItems(),e.close(!1),e.inputState(),e.isSetup=!0,a.disabled?e.disable():e.enable(),e.on("change",this.onChange),H(a,"tomselected","ts-hidden-accessible"),e.trigger("initialize"),!0===t.preload&&e.preload()}setupOptions(e=[],t=[]){this.addOptions(e),E(t,(e=>{this.registerOptionGroup(e)}))}setupTemplates(){var e=this,t=e.settings.labelField,i=e.settings.optgroupLabelField,s={optgroup:e=>{let t=document.createElement("div")
+n==i&&e.isOpen?t.stopPropagation():se(t,!0)},y=()=>{e.isOpen&&e.positionDropdown()}
+ne(document,"mousedown",m),ne(window,"scroll",y,d),ne(window,"resize",y,d),this._destroy=()=>{document.removeEventListener("mousedown",m),window.removeEventListener("scroll",y),window.removeEventListener("resize",y),g&&g.removeEventListener("click",f)},this.revertSettings={innerHTML:a.innerHTML,tabIndex:a.tabIndex},a.tabIndex=-1,a.insertAdjacentElement("afterend",e.wrapper),e.sync(!1),t.items=[],delete t.optgroups,delete t.options,ne(a,"invalid",(()=>{e.isValid&&(e.isValid=!1,e.isInvalid=!0,e.refreshState())})),e.updateOriginalInput(),e.refreshItems(),e.close(!1),e.inputState(),e.isSetup=!0,a.disabled?e.disable():e.enable(),e.on("change",this.onChange),H(a,"tomselected","ts-hidden-accessible"),e.trigger("initialize"),!0===t.preload&&e.preload()}setupOptions(e=[],t=[]){this.addOptions(e),E(t,(e=>{this.registerOptionGroup(e)}))}setupTemplates(){var e=this,t=e.settings.labelField,i=e.settings.optgroupLabelField,s={optgroup:e=>{let t=document.createElement("div")
 return t.className="optgroup",t.appendChild(e.options),t},optgroup_header:(e,t)=>'<div class="optgroup-header">'+t(e[i])+"</div>",option:(e,i)=>"<div>"+i(e[t])+"</div>",item:(e,i)=>"<div>"+i(e[t])+"</div>",option_create:(e,t)=>'<div class="create">Add <strong>'+t(e.input)+"</strong>&hellip;</div>",no_results:()=>'<div class="no-results">No results found</div>',loading:()=>'<div class="spinner"></div>',not_loading:()=>{},dropdown:()=>"<div></div>"}
 e.settings.render=Object.assign({},s,e.settings.render)}setupCallbacks(){var e,t,i={initialize:"onInitialize",change:"onChange",item_add:"onItemAdd",item_remove:"onItemRemove",item_select:"onItemSelect",clear:"onClear",option_add:"onOptionAdd",option_remove:"onOptionRemove",option_clear:"onOptionClear",optgroup_add:"onOptionGroupAdd",optgroup_remove:"onOptionGroupRemove",optgroup_clear:"onOptionGroupClear",dropdown_open:"onDropdownOpen",dropdown_close:"onDropdownClose",type:"onType",load:"onLoad",focus:"onFocus",blur:"onBlur"}
 for(e in i)(t=this.settings[i[e]])&&this.on(e,t)}sync(e=!0){const t=this,i=e?ce(t.input,{delimiter:t.settings.delimiter}):t.settings
@@ -221,16 +219,16 @@ const i=t.loadCallback.bind(t)
 t.settings.load.call(t,e,i)}loadCallback(e,t){const i=this
 i.loading=Math.max(i.loading-1,0),i.lastQuery=null,i.clearActiveOption(),i.setupOptions(e,t),i.refreshOptions(i.isFocused&&!i.isInputHidden),i.loading||z(i.wrapper,i.settings.loadingClass),i.trigger("load",e,t)}preload(){var e=this.wrapper.classList
 e.contains("preloaded")||(e.add("preloaded"),this.load(""))}setTextboxValue(e=""){var t=this.control_input
-t.value!==e&&(t.value=e,D(t,"update"),this.lastValue=e)}getValue(){return this.is_select_tag&&this.input.hasAttribute("multiple")?this.items:this.items.join(this.settings.delimiter)}setValue(e,t){ie(this,t?[]:["change"],(()=>{this.clear(t),this.addItems(e,t)}))}setMaxItems(e){0===e&&(e=null),this.settings.maxItems=e,this.refreshState()}setActiveItem(e,t){var i,s,n,o,r,l,a=this
+t.value!==e&&(t.value=e,D(t,"update"),this.lastValue=e)}getValue(){return"multi"===this.settings.mode&&this.is_select_tag?this.items:this.items.join(this.settings.delimiter)}setValue(e,t){ie(this,t?[]:["change"],(()=>{this.clear(t),this.addItems(e,t)}))}setMaxItems(e){0===e&&(e=null),this.settings.maxItems=e,this.refreshState()}setActiveItem(e,t){var i,s,n,o,r,l,a=this
 if("single"!==a.settings.mode){if(!e)return a.clearActiveItems(),void(a.isFocused&&a.showInput())
 if("click"===(i=t&&t.type.toLowerCase())&&oe("shiftKey",t)&&a.activeItems.length){for(l=a.getLastActive(),(n=Array.prototype.indexOf.call(a.control.children,l))>(o=Array.prototype.indexOf.call(a.control.children,e))&&(r=n,n=o,o=r),s=n;s<=o;s++)e=a.control.children[s],-1===a.activeItems.indexOf(e)&&a.setActiveItemClass(e)
 se(t)}else"click"===i&&oe(W,t)||"keydown"===i&&oe("shiftKey",t)?e.classList.contains("active")?a.removeActiveItem(e):a.setActiveItemClass(e):(a.clearActiveItems(),a.setActiveItemClass(e))
 a.hideInput(),a.isFocused||a.focus()}}setActiveItemClass(e){const t=this,i=t.control.querySelector(".last-active")
 i&&z(i,"last-active"),H(e,"active last-active"),t.trigger("item_select",e),-1==t.activeItems.indexOf(e)&&t.activeItems.push(e)}removeActiveItem(e){var t=this.activeItems.indexOf(e)
-this.activeItems.splice(t,1),z(e,"active")}clearActiveItems(){z(this.activeItems,"active"),this.activeItems=[]}setActiveOption(e,t=!0){e!==this.activeOption&&(this.clearActiveOption(),e&&(this.activeOption=e,G(this.focus_node,{"aria-activedescendant":e.getAttribute("id")}),G(e,{"aria-selected":"true"}),H(e,"active"),t&&this.scrollToOption(e)))}scrollToOption(e,t){if(!e)return
+this.activeItems.splice(t,1),z(e,"active")}clearActiveItems(){z(this.activeItems,"active"),this.activeItems=[]}setActiveOption(e,t=!0){e!==this.activeOption&&(this.clearActiveOption(),e&&(this.activeOption=e,G(this.focus_node,{"aria-activedescendant":e.getAttribute("id")}),("single"===this.settings.mode||this.settings.hideSelected)&&G(e,{"aria-selected":"true"}),H(e,"active"),t&&this.scrollToOption(e)))}scrollToOption(e,t){if(!e)return
 const i=this.dropdown_content,s=i.clientHeight,n=i.scrollTop||0,o=e.offsetHeight,r=e.getBoundingClientRect().top-i.getBoundingClientRect().top+n
 r+o>s+n?this.scroll(r-s+o,t):r<n&&this.scroll(r,t)}scroll(e,t){const i=this.dropdown_content
-t&&(i.style.scrollBehavior=t),i.scrollTop=e,i.style.scrollBehavior=""}clearActiveOption(){this.activeOption&&(z(this.activeOption,"active"),G(this.activeOption,{"aria-selected":null})),this.activeOption=null,G(this.focus_node,{"aria-activedescendant":null})}selectAll(){const e=this
+t&&(i.style.scrollBehavior=t),i.scrollTop=e,i.style.scrollBehavior=""}clearActiveOption(){this.activeOption&&(z(this.activeOption,"active"),("single"===this.settings.mode||this.settings.hideSelected)&&G(this.activeOption,{"aria-selected":null})),this.activeOption=null,G(this.focus_node,{"aria-activedescendant":null})}selectAll(){const e=this
 if("single"===e.settings.mode)return
 const t=e.controlChildren()
 t.length&&(e.hideInput(),e.close(),e.activeItems=t,E(t,(t=>{e.setActiveItemClass(t)})))}inputState(){var e=this
@@ -249,9 +247,10 @@ if(!e)continue
 let n=e.id,l=h.options[n]
 if(void 0===l)continue
 let a=Z(n),d=h.getOption(a,!0)
-for(h.settings.hideSelected||d.classList.toggle("selected",h.items.includes(a)),o=l[h.settings.optgroupField]||"",i=0,s=(r=Array.isArray(o)?o:[o])&&r.length;i<s;i++){o=r[i],h.optgroups.hasOwnProperty(o)||(o="")
+const g=h.items.includes(a)
+for(h.settings.hideSelected||(d.classList.toggle("selected",g),"multi"===this.settings.mode&&G(d,{"aria-selected":g?"true":"false"})),o=l[h.settings.optgroupField]||"",i=0,s=(r=Array.isArray(o)?o:[o])&&r.length;i<s;i++){o=r[i],h.optgroups.hasOwnProperty(o)||(o="")
 let e=u[o]
-void 0===e&&(e=document.createDocumentFragment(),p.push(o)),i>0&&(d=d.cloneNode(!0),G(d,{id:l.$id+"-clone-"+i,"aria-selected":null}),d.classList.add("ts-cloned"),z(d,"active"),h.activeOption&&h.activeOption.dataset.value==n&&c&&c.dataset.group===o.toString()&&(y=d)),e.appendChild(d),u[o]=e}}h.settings.lockOptgroupOrder&&p.sort(((e,t)=>{const i=h.optgroups[e],s=h.optgroups[t]
+void 0===e&&(e=document.createDocumentFragment(),p.push(o)),i>0&&(d=d.cloneNode(!0),"multi"!==this.settings.mode||h.settings.hideSelected?G(d,{id:l.$id+"-clone-"+i,"aria-selected":null}):G(d,{id:l.$id+"-clone-"+i,"aria-selected":g?"true":"false"}),d.classList.add("ts-cloned"),z(d,"active"),h.activeOption&&h.activeOption.dataset.value==n&&c&&c.dataset.group===o.toString()&&(y=d)),e.appendChild(d),u[o]=e}}h.settings.lockOptgroupOrder&&p.sort(((e,t)=>{const i=h.optgroups[e],s=h.optgroups[t]
 return(i&&i.$order||0)-(s&&s.$order||0)})),l=document.createDocumentFragment(),E(p,(e=>{let t=u[e]
 if(!t||!t.children.length)return
 let i=h.optgroups[e]