enhanced-checkbox-list
Advanced tools
Comparing version 1.0.0-beta.1 to 1.0.0-beta.2
@@ -1,1 +0,1 @@ | ||
!function(t,e){if("object"==typeof exports&&"object"==typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var i=e();for(var s in i)("object"==typeof exports?exports:t)[s]=i[s]}}(window,(function(){return function(t){var e={};function i(s){if(e[s])return e[s].exports;var o=e[s]={i:s,l:!1,exports:{}};return t[s].call(o.exports,o,o.exports,i),o.l=!0,o.exports}return i.m=t,i.c=e,i.d=function(t,e,s){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:s})},i.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},i.t=function(t,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var s=Object.create(null);if(i.r(s),Object.defineProperty(s,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)i.d(s,o,function(e){return t[e]}.bind(null,o));return s},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=1)}([function(t,e){var i=Element.prototype;i.matches||(i.matches=i.msMatchesSelector||i.webkitMatchesSelector),i.closest||(i.closest=function(t){var e=this;do{if(e.matches(t))return e;e=e.parentElement||e.parentNode}while(null!==e&&1===e.nodeType);return null})},function(t,e,i){"use strict";i.r(e);var s=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;function o(t,e){if(t&&1===t.nodeType&&"string"==typeof e)!function(t,e){for(var i=t.getAttribute&&t.getAttribute("class")||"",o=" "+i+" ",n="",l=0,h=e.split(" "),r=h.length;l<r;l+=1)""!==h[l]&&-1===o.indexOf(" "+h[l]+" ")&&(n+=" "+h[l]);var c;i!==(n=null==(c=i+n)?"":(c+"").replace(s,""))&&t.setAttribute("class",n)}(t,e);else if(t&&"number"==typeof t.length)for(var i=0,n=t.length;i<n;i+=1)o(t[i],e)}function n(t,e){if(t&&1===t.nodeType&&"string"==typeof e)return function(t,e){return!(!t||!t.nodeType)&&(" "+(t.getAttribute&&t.getAttribute("class")||"")+" ").indexOf(" "+e+" ")>-1}(t,e);if(t&&"number"==typeof t.length)for(var i=0,s=t.length;i<s;i+=1)if(n(t[i],e))return!0;return!1}var l=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;function h(t,e){if(t&&1===t.nodeType&&"string"==typeof e)!function(t,e){for(var i=t.getAttribute&&t.getAttribute("class")||"",s=" "+i+" ",o=0,n=e.split(" "),h=n.length;o<h;o+=1)s=s.replace(" "+n[o]+" "," ");var r;i!==(s=null==(r=s)?"":(r+"").replace(l,""))&&t.setAttribute("class",s)}(t,e);else if(t&&"number"==typeof t.length)for(var i=0,s=t.length;i<s;i+=1)h(t[i],e)}i(0);var r=0,c=function(t){r+=1;var e=t.id;this.LIST=e,this.PREFIX=(e||"")+"enhanced-checkbox-list-"+r,this.COUNT=this.PREFIX+"-count",this.SEARCH=this.PREFIX+"-search",this.BUTTON=this.PREFIX+"-button",this.WRAPPER=this.PREFIX+"-wrapper",this.SELECT_ALL=this.PREFIX+"-select-all",this.SELECT_ALL_LABEL=this.PREFIX+"-select-all-label",this.ESCAPE_TO_CLOSE=this.PREFIX+"-escape-to-close",this.ESCAPE_TO_CLEAR=this.PREFIX+"-escape-to-clear",this.LIST||(this.LIST=this.PREFIX+"-list",t.setAttribute("id",this.LIST))},a=/&/g,d=/\s\s+/g,u=/[\u2018\u2019',:\u2013-]/g,p=/[\-\[\]{}()*+?.,\\\^$|#\s]/g,f="enhancedCheckboxList";function b(t){return null==t?"":(t+"").trim()}function v(t,e){return void 0===e&&(e=!1),t=b(t).toLowerCase().replace(u,"").replace(a,"and").replace(d," "),e&&(t=t.replace(p,"\\$&")),t}function E(t){return t&&1===t.nodeType?b(t.textContent):""}function y(t){var e=b(t.getAttribute("aria-label"));if(!e){var i=t.getAttribute("aria-labelledby");i&&(e=E(document.getElementById(i)))}return!e&&t.id&&(e=E(document.querySelector('[for="'+t.id+'"]'))),e||(e=E(t.closest("label"))),e||""}function C(t,e,i){t&&e&&i&&t.removeEventListener&&t.removeEventListener(e,i)}var k=function(){function t(t){this.list=t.list,this.options=t.options,this.checkboxes=t.checkboxes,this.listWrapper=t.listWrapper,this.filterInput=t.searchField,this.selectAllCheckbox=t.selectAll,this.show=this.show.bind(t),this.hide=this.hide.bind(t),this.filter=this.filter.bind(t),this.destroy=this.destroy.bind(t),t.list[f]=this}return t.prototype.destroy=function(t){this.destroy.call(this,t)},t.prototype.filter=function(t,e){this.filter.call(this,t,e)},t.prototype.show=function(){this.show.call(this)},t.prototype.hide=function(){this.hide.call(this)},t}(),x=function(t){for(var e in void 0===t&&(t={}),this.filterable=!0,this.filterDelay=300,this.itemSelector="li",this.togglable=!0,this.autoClose=!1,this.visible=!1,this.selectAllControl=!0,this.selectAllText="Select all",this.keyboardShortcuts=!0,this.pageUpModifier=-10,this.pageDownModifier=10,this.tabindex="0",this.cssNameSpace="enhanced-checkbox-list",this.srEscapeToCloseText="Esc to close",this.srEscapeToClearText="Esc to clear",this.srFilterText="filter",this.srFoundText="found",this.srSelectedText="selected",t)t.hasOwnProperty(e)&&void 0!==t[e]&&(this[e]=t[e])},g={},m=13,A=27,L=33,S=34,T=35,F=36,I=function(){function t(t,e){if(this.allCheckboxLabels=[],this.visibleCheckboxIndexes=[],this.checkedCheckboxIndexes=[],t&&1===t.nodeType){var i=t[f];i&&"function"==typeof i.destroy&&i.destroy(),this.list=t,this.listFieldset=this.list.closest("fieldset"),this.options=new x(e),this.ids=new c(t),this.init()}}return t.prototype.triggerOptionCallback=function(t){"function"==typeof this.options[t]&&this.options[t].call(this,this.list)},t.prototype.show=function(t){var e=this.cssNameSpace;if(void 0!==t)return h(t,e+"--hide hide hidden"),t.removeAttribute("aria-hidden"),void t.removeAttribute("hidden");var i=this.listWrapper;("hidden"===i.getAttribute("hidden")||n(i,e+"--hide"))&&(this.setListState(!0),this.triggerOptionCallback("onShow"))},t.prototype.hide=function(t){var e=this.cssNameSpace;if(void 0!==t)return o(t,e+"--hide hide hidden"),t.setAttribute("aria-hidden","true"),void t.setAttribute("hidden","hidden");var i=this.listWrapper;"hidden"===i.getAttribute("hidden")||n(i,e+"--hide")||(this.setListState(!1),this.triggerOptionCallback("onHide"))},t.prototype.cache=function(t,e){if(void 0===t)return g[this.ids.LIST];if("boolean"==typeof t&&t&&this.cache()){var i=e;return"string"==typeof i&&void 0!==this.cache(i)&&delete g[this.ids.LIST][i],void(void 0===i&&delete g[this.ids.LIST])}if("string"==typeof t){if(void 0===e){if(!this.cache())return;return g[this.ids.LIST][t]}this.cache()||(g[this.ids.LIST]={}),g[this.ids.LIST][t]=e}},t.prototype.unbindDocumentClick=function(){this.documentClickBound&&this.autoCloseEvent&&(document.removeEventListener("click",this.autoCloseEvent),this.documentClickBound=!1)},t.prototype.bindDocumentClick=function(){!this.documentClickBound&&this.autoCloseEvent&&(document.addEventListener("click",this.autoCloseEvent),this.documentClickBound=!0)},t.prototype.setListState=function(t){if("boolean"==typeof t)t?(this.show(this.listWrapper),this.bindDocumentClick()):this.hide(this.listWrapper),this.button&&this.button.setAttribute("aria-expanded",(!!t).toString()),this.cache("visible",t);else{var e=this.cache()?this.cache("visible"):this.options.togglable?this.options.visible:!this.options.togglable;this.setListState(!!e)}},t.prototype.getItemSelectorElem=function(t,e){var i,s="string"==typeof e?e:this.options.itemSelector;if("string"==typeof s&&s)try{i=t.closest(s)}catch(t){}return i||t},t.prototype.getAllCheckedCheckboxIndexes=function(){this.checkedCheckboxIndexes=[];for(var t=0,e=this.checkboxes.length;t<e;t+=1)this.checkboxes[t]&&this.checkboxes[t].checked&&this.checkedCheckboxIndexes.push(t)},t.prototype.updateCheckedStates=function(){this.getAllCheckedCheckboxIndexes();var t=this.checkedCheckboxIndexes.length;if(this.button&&(this.button.textContent=this.getListLabel()+" ("+t+")"),this.selectAll){var e=this.visibleCheckboxIndexes.length;if(this.options.filterable&&!e)return this.hide(this.selectAll.parentElement);this.show(this.selectAll.parentElement);for(var i=[],s=0;s<e;s+=1){var o=this.checkboxes[this.visibleCheckboxIndexes[s]].id;i.push(o)}this.selectAll.setAttribute("aria-controls",i.join(" "));var n=t===e,l=t&&!n?"mixed":n.toString();this.selectAll.setAttribute("aria-checked",l)}},t.prototype.runFilter=function(t,e){var i=this;void 0===e&&(e=!1);var s=v(t,!0),o=this.options.itemSelector;if(this.visibleCheckboxIndexes=this.checkedCheckboxIndexes.slice(),this.checkboxes.forEach((function(t,e){i.hide(i.getItemSelectorElem(t,o)),i.visibleCheckboxIndexes.indexOf(e)>-1||-1===i.allCheckboxLabels[e].search(s)||i.visibleCheckboxIndexes.push(e)})),this.visibleCheckboxIndexes.forEach((function(t){i.show(i.getItemSelectorElem(i.checkboxes[t],o))})),e&&this.srCount){var n=this.visibleCheckboxIndexes.length,l=this.options.srFoundText,h=this.checkedCheckboxIndexes.length,r=this.options.srSelectedText;this.srCount.textContent=n+" "+l+", "+h+" "+r}this.cache("search",s),this.updateCheckedStates(),this.triggerOptionCallback("onFilter")},t.prototype.filter=function(t,e){this.runFilter(t||"",e),this.searchField&&(this.searchField.value=this.cache("search"))},t.prototype.filterPrep=function(t){var e=this,i="number"==typeof t?t:"number"==typeof this.options.filterDelay?this.options.filterDelay:300;clearTimeout(this.filterTimeout),this.filterTimeout=setTimeout((function(){e.runFilter.call(e,e.searchField.value,!0)}),i)},t.prototype.handleFilterKeyDown=function(t){var e,i=function(t){return t>=48&&t<=57||t>=65&&t<=90||t>=96&&t<=111||t>=186&&t<=222||32===t||8===t||46===t}(t.keyCode);t&&t.keyCode===m?(e=0,i=!0,t.preventDefault()):t&&t.keyCode===A&&(e=0,i=!0,t.preventDefault(),t.stopPropagation(),this.searchField.value=""),i&&this.filterPrep(e)},t.prototype.getListLabel=function(){var t=this.listLabel||this.options.listLabel;if("string"==typeof t)return t;var e=y(this.list);if(!e&&this.listFieldset){var i=this.listFieldset.querySelector("legend");e=i&&i.textContent||""}return this.listLabel=this.options.listLabel=b(e),this.listLabel},t.prototype.buildMarkup=function(){var t=[],e=this.cssNameSpace,i=this.options.togglable,s=e+"--sr-only visually-hidden sr-only",n=this.options.filterClassName?" "+this.options.filterClassName:"",l=this.options.toggleClassName?" "+this.options.toggleClassName:"",h=this.options.wrapperClassName?" "+this.options.wrapperClassName:"";i&&t.push('<button aria-expanded="false" tabindex="'+this.options.tabindex+'" aria-controls="'+this.ids.WRAPPER+'" class="'+e+"__toggle"+l+'" id="'+this.ids.BUTTON+'" type="button"></button>');var r=this.getListLabel(),c=r&&!this.listFieldset?' role="group" aria-label="'+r+'"':"";t.push("<div"+c+' class="'+e+"__wrapper"+h+'" id="'+this.ids.WRAPPER+'" aria-describedby="'+this.ids.ESCAPE_TO_CLOSE+'">'),t.push('<span class="'+s+'" aria-live="polite" id="'+this.ids.COUNT+'"></span>'),i&&this.options.keyboardShortcuts&&this.options.srEscapeToCloseText&&t.push('<span class="'+s+'" id="'+this.ids.ESCAPE_TO_CLOSE+'">'+this.options.srEscapeToCloseText+"</span>"),this.options.filterable&&t.push('<div class="'+e+'__filter"><label for="'+this.ids.SEARCH+'" class="'+e+"__filter-label "+s+'">'+this.options.srFilterText+" "+this.getListLabel()+'</label><input class="'+e+"__filter-input"+n+'" value="" type="search" id="'+this.ids.SEARCH+'" aria-controls="'+this.ids.LIST+'" aria-describedby="'+this.ids.ESCAPE_TO_CLEAR+'" /><span class="'+s+'" id="'+this.ids.ESCAPE_TO_CLEAR+'">'+this.options.srEscapeToClearText+"</span></div>"),this.options.selectAllControl&&t.push('<div class="'+e+'__select-all"><span class="'+e+'__select-all-checkbox" id="'+this.ids.SELECT_ALL+'" role="checkbox" tabindex="'+this.options.tabindex+'" aria-labelledby="'+this.ids.SELECT_ALL_LABEL+'"></span><span class="'+e+'__select-all-label" id="'+this.ids.SELECT_ALL_LABEL+'">'+this.options.selectAllText+"</span></div>"),t.push("</div>"),this.list.insertAdjacentHTML("beforebegin",t.join("")),this.srCount=document.getElementById(this.ids.COUNT),this.button=document.getElementById(this.ids.BUTTON),this.listWrapper=document.getElementById(this.ids.WRAPPER),this.searchField=document.getElementById(this.ids.SEARCH),this.selectAll=document.getElementById(this.ids.SELECT_ALL),this.listWrapper.appendChild(this.list),o(this.list,e+"__list")},t.prototype.handleAutoClose=function(t){var e=this;this.options.togglable&&this.options.autoClose&&(clearTimeout(this.autoCloseTimeout),this.autoCloseTimeout=setTimeout((function(){var i=t.target,s=e.button,o=e.listWrapper,n=document.activeElement;o.contains(i)||o.contains(n)||s&&(s.contains(i)||s.contains(n))||(e.hide.call(e),e.unbindDocumentClick())}),0))},t.prototype.toggleAllVisibleCheckboxes=function(t){var e=this;if(!(t&&("click"===t.type||"keydown"==t.type))||!this.selectAll||"true"!==this.selectAll.getAttribute("aria-disabled")){var i;if(this.selectAll)i="true"!==this.selectAll.getAttribute("aria-checked");else for(var s=0,o=this.visibleCheckboxIndexes.length;s<o;s+=1){var n=this.visibleCheckboxIndexes[s];if(!1===this.checkboxes[n].checked){i=!0;break}}i=!!i,this.visibleCheckboxIndexes.forEach((function(t){e.checkboxes[t].checked=i})),this.updateCheckedStates()}},t.prototype.moveFocusToCheckboxIndex=function(t,e,i){var s,o=this.checkboxes,n=e;if(function(t){var e=t;return e&&1===e.nodeType&&"INPUT"===e.nodeName&&("checkbox"===e.type||"radio"===e.type)}(n)&&-1!==(s=o.indexOf(n))){var l=this.visibleCheckboxIndexes,h=l.length-1,r=l.indexOf(s);if(-1!==r){switch(t&&"function"==typeof t.preventDefault&&t.preventDefault(),i){case S:var c=this.options.pageDownModifier;r+="number"==typeof c?c:10;break;case L:var a=this.options.pageUpModifier;r+="number"==typeof a?a:-10;break;case F:r=0;break;case T:r=h}r>h?r=h:r<0&&(r=0);var d=o[l[r]];d&&"function"==typeof d.focus&&d.focus()}}},t.prototype.handleKeyDown=function(t){if(this.options.keyboardShortcuts){var e=t.keyCode;if(e===A&&this.options.togglable)return this.hide(),void(this.button&&this.button.focus&&this.button.focus());e!==S&&e!==L&&e!==F&&e!==T||this.moveFocusToCheckboxIndex(t,t.target,e)}},t.prototype.bindEvents=function(){var t=this;if(this.autoCloseEvent=this.handleAutoClose.bind(this),this.bindDocumentClick(),this.listChangeEvent=function(e){var i=e.target;!i||"INPUT"!==i.nodeName||"checkbox"!==i.type&&"radio"!==i.type||t.updateCheckedStates()},this.list.addEventListener("change",this.listChangeEvent),this.button&&(this.buttonFocusOutEvent=this.autoCloseEvent,this.buttonClickEvent=function(e){e.preventDefault(),t.cache("visible")?t.hide():t.show()},this.button.addEventListener("click",this.buttonClickEvent),this.button.addEventListener("focusout",this.buttonFocusOutEvent)),this.searchField&&(this.searchFieldFilterEvent=this.handleFilterKeyDown.bind(this),this.searchFieldKeyDownEvent=this.searchFieldFilterEvent,this.searchFieldInputEvent=this.filterPrep.bind(this),this.searchField.addEventListener("keydown",this.searchFieldKeyDownEvent),this.searchField.addEventListener("input",this.searchFieldInputEvent)),this.listWrapperFocusOutEvent=this.autoCloseEvent,this.listWrapper.addEventListener("focusout",this.listWrapperFocusOutEvent),this.listWrapperKeyDownEvent=this.handleKeyDown.bind(this),this.listWrapper.addEventListener("keydown",this.listWrapperKeyDownEvent),this.selectAll){var e=this.selectAll.parentElement;this.selectAllClickEvent=this.toggleAllVisibleCheckboxes.bind(this),this.selectAllFocusInEvent=function(){var e=t.cssNameSpace+"__select-all-checkbox--focus focus focused";o(t.selectAll,e)},this.selectAllFocusOutEvent=function(){var e=t.cssNameSpace+"__select-all-checkbox--focus focus focused";h(t.selectAll,e)},this.selectAllKeyDownEvent=function(e){32===e.keyCode&&t.toggleAllVisibleCheckboxes(e)},e.addEventListener("click",this.selectAllClickEvent),e.addEventListener("focusin",this.selectAllFocusInEvent),e.addEventListener("focusout",this.selectAllFocusOutEvent),e.addEventListener("keydown",this.selectAllKeyDownEvent)}},t.prototype.setCheckboxArrays=function(){var t=this,e=this.list.querySelectorAll('input[type="checkbox"], input[type="radio"]'),i=this.options.selectAllControl&&this.selectAll,s=this.cssNameSpace+"--hide";this.checkboxes=Array.prototype.slice.call(e),this.visibleCheckboxIndexes=[],this.allCheckboxLabels=[],this.checkboxes.forEach((function(e,o){var l=y(e);i&&!e.id&&e.setAttribute("id",t.ids.WRAPPER+"-checkbox-"+o);var h=v(l);t.allCheckboxLabels.push(h),"hidden"===e.getAttribute("hidden")||n(e,s)||t.visibleCheckboxIndexes.push(o)}))},t.prototype.destroy=function(t){var e=this;if(void 0===t&&(t=!1),!this.listWrapper){if(this.listWrapper=this.list.parentElement,!this.listWrapper.matches(this.cssNameSpace+"__wrapper"))return;if(!this.button){var i=this.listWrapper.previousElementSibling;"BUTTON"===i.nodeName&&i.matches(this.cssNameSpace+"__toggle")&&(this.button=i)}}this.selectAll&&(C(this.selectAll,"click",this.selectAllClickEvent),C(this.selectAll,"keydown",this.selectAllKeyDownEvent),C(this.selectAll,"focusin",this.selectAllFocusInEvent),C(this.selectAll,"focusout",this.selectAllFocusOutEvent)),this.searchField&&(C(this.searchField,"input",this.searchFieldInputEvent),C(this.searchField,"keydown",this.searchFieldKeyDownEvent)),this.button&&(C(this.button,"click",this.buttonClickEvent),C(this.button,"focusout",this.buttonFocusOutEvent),this.button.parentElement.removeChild(this.button)),this.list&&(C(this.list,"change",this.listChangeEvent),h(this.list,this.cssNameSpace+"__list"),this.listWrapper.parentElement.insertBefore(this.list,this.listWrapper),this.list[f]&&delete this.list[f]),C(this.listWrapper,"keydown",this.listWrapperKeyDownEvent),C(this.listWrapper,"focusout",this.listWrapperFocusOutEvent),this.listWrapper.parentElement.removeChild(this.listWrapper);var s=this.options.itemSelector;this.checkboxes.forEach((function(t){e.show(e.getItemSelectorElem(t,s))})),this.unbindDocumentClick(),t&&this.cache(!0)},t.prototype.init=function(){this.cssNameSpace=this.options.cssNameSpace,this.list.parentElement.matches("."+this.cssNameSpace+"__wrapper")&&this.destroy(),this.buildMarkup(),this.setCheckboxArrays(),this.setListState(),this.updateCheckedStates(),this.bindEvents(),this.api=new k(this),this.triggerOptionCallback("onReady"),this.options.filterable&&this.cache()&&void 0!==this.cache("search")&&this.filter(this.cache("search"))},t}();function _(t,e){return t&&t[f]&&t[f].open?t[f]:new I(t,e).api}i.d(e,"EnhancedCheckboxList",(function(){return _}));e.default=_}])})); | ||
!function(t,e){if("object"==typeof exports&&"object"==typeof module)module.exports=e();else if("function"==typeof define&&define.amd)define([],e);else{var i=e();for(var s in i)("object"==typeof exports?exports:t)[s]=i[s]}}(window,(function(){return function(t){var e={};function i(s){if(e[s])return e[s].exports;var o=e[s]={i:s,l:!1,exports:{}};return t[s].call(o.exports,o,o.exports,i),o.l=!0,o.exports}return i.m=t,i.c=e,i.d=function(t,e,s){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:s})},i.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},i.t=function(t,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var s=Object.create(null);if(i.r(s),Object.defineProperty(s,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)i.d(s,o,function(e){return t[e]}.bind(null,o));return s},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=1)}([function(t,e){var i=Element.prototype;i.matches||(i.matches=i.msMatchesSelector||i.webkitMatchesSelector),i.closest||(i.closest=function(t){var e=this;do{if(e.matches(t))return e;e=e.parentElement||e.parentNode}while(null!==e&&1===e.nodeType);return null})},function(t,e,i){"use strict";i.r(e);var s=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;function o(t,e){if(t&&1===t.nodeType&&"string"==typeof e)!function(t,e){for(var i=t.getAttribute&&t.getAttribute("class")||"",o=" "+i+" ",n="",l=0,h=e.split(" "),r=h.length;l<r;l+=1)""!==h[l]&&-1===o.indexOf(" "+h[l]+" ")&&(n+=" "+h[l]);var c;i!==(n=null==(c=i+n)?"":(c+"").replace(s,""))&&t.setAttribute("class",n)}(t,e);else if(t&&"number"==typeof t.length)for(var i=0,n=t.length;i<n;i+=1)o(t[i],e)}function n(t,e){if(t&&1===t.nodeType&&"string"==typeof e)return function(t,e){return!(!t||!t.nodeType)&&(" "+(t.getAttribute&&t.getAttribute("class")||"")+" ").indexOf(" "+e+" ")>-1}(t,e);if(t&&"number"==typeof t.length)for(var i=0,s=t.length;i<s;i+=1)if(n(t[i],e))return!0;return!1}var l=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;function h(t,e){if(t&&1===t.nodeType&&"string"==typeof e)!function(t,e){for(var i=t.getAttribute&&t.getAttribute("class")||"",s=" "+i+" ",o=0,n=e.split(" "),h=n.length;o<h;o+=1)s=s.replace(" "+n[o]+" "," ");var r;i!==(s=null==(r=s)?"":(r+"").replace(l,""))&&t.setAttribute("class",s)}(t,e);else if(t&&"number"==typeof t.length)for(var i=0,s=t.length;i<s;i+=1)h(t[i],e)}i(0);var r=0,c=function(t){r+=1;var e=t.id;this.LIST=e,this.PREFIX=(e||"")+"enhanced-checkbox-list-"+r,this.COUNT=this.PREFIX+"-count",this.SEARCH=this.PREFIX+"-search",this.BUTTON=this.PREFIX+"-button",this.WRAPPER=this.PREFIX+"-wrapper",this.SELECT_ALL=this.PREFIX+"-select-all",this.SELECT_ALL_LABEL=this.PREFIX+"-select-all-label",this.ESCAPE_TO_CLOSE=this.PREFIX+"-escape-to-close",this.ESCAPE_TO_CLEAR=this.PREFIX+"-escape-to-clear",this.LIST||(this.LIST=this.PREFIX+"-list",t.setAttribute("id",this.LIST))},a=/&/g,d=/\s\s+/g,u=/[\u2018\u2019',:\u2013-]/g,p=/[\-\[\]{}()*+?.,\\\^$|#\s]/g;function b(t){return null==t?"":(t+"").trim()}function f(t,e){return void 0===e&&(e=!1),t=b(t).toLowerCase().replace(u,"").replace(a,"and").replace(d," "),e&&(t=t.replace(p,"\\$&")),t}function v(t){return t&&1===t.nodeType?b(t.textContent):""}function E(t){var e=b(t.getAttribute("aria-label"));if(!e){var i=t.getAttribute("aria-labelledby");i&&(e=v(document.getElementById(i)))}return!e&&t.id&&(e=v(document.querySelector('[for="'+t.id+'"]'))),e||(e=v(t.closest("label"))),e||""}function y(t,e,i){t&&e&&i&&t.removeEventListener&&t.removeEventListener(e,i)}var C=function(){function t(t){this.list=t.list,this.options=t.options,this.checkboxes=t.checkboxes,this.listWrapper=t.listWrapper,this.filterInput=t.searchField,this.selectAllCheckbox=t.selectAll,this.show=this.show.bind(t),this.hide=this.hide.bind(t),this.filter=this.filter.bind(t),this.destroy=this.destroy.bind(t),t.list.enhancedCheckboxList=this}return t.prototype.destroy=function(t){this.destroy.call(this,t)},t.prototype.filter=function(t,e){this.filter.call(this,t,e)},t.prototype.show=function(){this.show.call(this)},t.prototype.hide=function(){this.hide.call(this)},t}(),k=function(t){for(var e in void 0===t&&(t={}),this.filterable=!0,this.filterDelay=300,this.itemSelector="li",this.togglable=!0,this.autoClose=!1,this.visible=!1,this.selectAllControl=!0,this.selectAllText="Select all",this.keyboardShortcuts=!0,this.pageUpModifier=-10,this.pageDownModifier=10,this.tabindex="0",this.cssNameSpace="enhanced-checkbox-list",this.srEscapeToCloseText="Esc to close",this.srEscapeToClearText="Esc to clear",this.srFilterText="filter",this.srFoundText="found",this.srSelectedText="selected",t)t.hasOwnProperty(e)&&void 0!==t[e]&&(this[e]=t[e])},x={},g=13,m=27,A=33,L=34,S=35,T=36,F=function(){function t(t,e){if(this.allCheckboxLabels=[],this.visibleCheckboxIndexes=[],this.checkedCheckboxIndexes=[],t&&1===t.nodeType){var i=t.enhancedCheckboxList;i&&"function"==typeof i.destroy&&i.destroy(),this.list=t,this.listFieldset=this.list.closest("fieldset"),this.options=new k(e),this.ids=new c(t),this.init()}}return t.prototype.triggerOptionCallback=function(t){"function"==typeof this.options[t]&&this.options[t].call(this,this.list)},t.prototype.show=function(t){var e=this.cssNameSpace;if(void 0!==t)return h(t,e+"--hide hide hidden"),t.removeAttribute("aria-hidden"),void t.removeAttribute("hidden");var i=this.listWrapper;("hidden"===i.getAttribute("hidden")||n(i,e+"--hide"))&&(this.setListState(!0),this.triggerOptionCallback("onShow"))},t.prototype.hide=function(t){var e=this.cssNameSpace;if(void 0!==t)return o(t,e+"--hide hide hidden"),t.setAttribute("aria-hidden","true"),void t.setAttribute("hidden","hidden");var i=this.listWrapper;"hidden"===i.getAttribute("hidden")||n(i,e+"--hide")||(this.setListState(!1),this.triggerOptionCallback("onHide"))},t.prototype.cache=function(t,e){if(void 0===t)return x[this.ids.LIST];if("boolean"==typeof t&&t&&this.cache()){var i=e;return"string"==typeof i&&void 0!==this.cache(i)&&delete x[this.ids.LIST][i],void(void 0===i&&delete x[this.ids.LIST])}if("string"==typeof t){if(void 0===e){if(!this.cache())return;return x[this.ids.LIST][t]}this.cache()||(x[this.ids.LIST]={}),x[this.ids.LIST][t]=e}},t.prototype.unbindDocumentClick=function(){this.documentClickBound&&this.autoCloseEvent&&(document.removeEventListener("click",this.autoCloseEvent),this.documentClickBound=!1)},t.prototype.bindDocumentClick=function(){!this.documentClickBound&&this.autoCloseEvent&&(document.addEventListener("click",this.autoCloseEvent),this.documentClickBound=!0)},t.prototype.setListState=function(t){if("boolean"==typeof t)t?(this.show(this.listWrapper),this.bindDocumentClick()):this.hide(this.listWrapper),this.button&&this.button.setAttribute("aria-expanded",(!!t).toString()),this.cache("visible",t);else{var e=this.cache()?this.cache("visible"):this.options.togglable?this.options.visible:!this.options.togglable;this.setListState(!!e)}},t.prototype.getItemSelectorElem=function(t,e){var i,s="string"==typeof e?e:this.options.itemSelector;if("string"==typeof s&&s)try{i=t.closest(s)}catch(t){}return i||t},t.prototype.getAllCheckedCheckboxIndexes=function(){this.checkedCheckboxIndexes=[];for(var t=0,e=this.checkboxes.length;t<e;t+=1)this.checkboxes[t]&&this.checkboxes[t].checked&&this.checkedCheckboxIndexes.push(t)},t.prototype.updateCheckedStates=function(){this.getAllCheckedCheckboxIndexes();var t=this.checkedCheckboxIndexes.length;if(this.button&&(this.button.textContent=this.getListLabel()+" ("+t+")"),this.selectAll){var e=this.visibleCheckboxIndexes.length;if(this.options.filterable&&!e)return this.hide(this.selectAll.parentElement);this.show(this.selectAll.parentElement);for(var i=[],s=0;s<e;s+=1){var o=this.checkboxes[this.visibleCheckboxIndexes[s]].id;i.push(o)}this.selectAll.setAttribute("aria-controls",i.join(" "));var n=t===e,l=t&&!n?"mixed":n.toString();this.selectAll.setAttribute("aria-checked",l)}},t.prototype.runFilter=function(t,e){var i=this;void 0===e&&(e=!1);var s=f(t,!0),o=this.options.itemSelector;if(this.visibleCheckboxIndexes=this.checkedCheckboxIndexes.slice(),this.checkboxes.forEach((function(t,e){i.hide(i.getItemSelectorElem(t,o)),i.visibleCheckboxIndexes.indexOf(e)>-1||-1===i.allCheckboxLabels[e].search(s)||i.visibleCheckboxIndexes.push(e)})),this.visibleCheckboxIndexes.forEach((function(t){i.show(i.getItemSelectorElem(i.checkboxes[t],o))})),e&&this.srCount){var n=this.visibleCheckboxIndexes.length,l=this.options.srFoundText,h=this.checkedCheckboxIndexes.length,r=this.options.srSelectedText;this.srCount.textContent=n+" "+l+", "+h+" "+r}this.cache("search",s),this.updateCheckedStates(),this.triggerOptionCallback("onFilter")},t.prototype.filter=function(t,e){this.runFilter(t||"",e),this.searchField&&(this.searchField.value=this.cache("search"))},t.prototype.filterPrep=function(t){var e=this,i="number"==typeof t?t:"number"==typeof this.options.filterDelay?this.options.filterDelay:300;clearTimeout(this.filterTimeout),this.filterTimeout=setTimeout((function(){e.runFilter.call(e,e.searchField.value,!0)}),i)},t.prototype.handleFilterKeyDown=function(t){var e,i=function(t){return t>=48&&t<=57||t>=65&&t<=90||t>=96&&t<=111||t>=186&&t<=222||32===t||8===t||46===t}(t.keyCode);t&&t.keyCode===g?(e=0,i=!0,t.preventDefault()):t&&t.keyCode===m&&(e=0,i=!0,t.preventDefault(),t.stopPropagation(),this.searchField.value=""),i&&this.filterPrep(e)},t.prototype.getListLabel=function(){var t=this.listLabel||this.options.listLabel;if("string"==typeof t)return t;var e=E(this.list);if(!e&&this.listFieldset){var i=this.listFieldset.querySelector("legend");e=i&&i.textContent||""}return this.listLabel=this.options.listLabel=b(e),this.listLabel},t.prototype.buildMarkup=function(){var t=[],e=this.cssNameSpace,i=this.options.togglable,s=e+"--sr-only visually-hidden sr-only",n=this.options.filterClassName?" "+this.options.filterClassName:"",l=this.options.toggleClassName?" "+this.options.toggleClassName:"",h=this.options.wrapperClassName?" "+this.options.wrapperClassName:"";i&&t.push('<button aria-expanded="false" tabindex="'+this.options.tabindex+'" aria-controls="'+this.ids.WRAPPER+'" class="'+e+"__toggle"+l+'" id="'+this.ids.BUTTON+'" type="button"></button>');var r=this.getListLabel(),c=r&&!this.listFieldset?' role="group" aria-label="'+r+'"':"";t.push("<div"+c+' class="'+e+"__wrapper"+h+'" id="'+this.ids.WRAPPER+'" aria-describedby="'+this.ids.ESCAPE_TO_CLOSE+'">'),t.push('<span class="'+s+'" aria-live="polite" id="'+this.ids.COUNT+'"></span>'),i&&this.options.keyboardShortcuts&&this.options.srEscapeToCloseText&&t.push('<span class="'+s+'" id="'+this.ids.ESCAPE_TO_CLOSE+'">'+this.options.srEscapeToCloseText+"</span>"),this.options.filterable&&t.push('<div class="'+e+'__filter"><label for="'+this.ids.SEARCH+'" class="'+e+"__filter-label "+s+'">'+this.options.srFilterText+" "+this.getListLabel()+'</label><input class="'+e+"__filter-input"+n+'" value="" type="search" id="'+this.ids.SEARCH+'" aria-controls="'+this.ids.LIST+'" aria-describedby="'+this.ids.ESCAPE_TO_CLEAR+'" /><span class="'+s+'" id="'+this.ids.ESCAPE_TO_CLEAR+'">'+this.options.srEscapeToClearText+"</span></div>"),this.options.selectAllControl&&t.push('<div class="'+e+'__select-all"><span class="'+e+'__select-all-checkbox" id="'+this.ids.SELECT_ALL+'" role="checkbox" tabindex="'+this.options.tabindex+'" aria-labelledby="'+this.ids.SELECT_ALL_LABEL+'"></span><span class="'+e+'__select-all-label" id="'+this.ids.SELECT_ALL_LABEL+'">'+this.options.selectAllText+"</span></div>"),t.push("</div>"),this.list.insertAdjacentHTML("beforebegin",t.join("")),this.srCount=document.getElementById(this.ids.COUNT),this.button=document.getElementById(this.ids.BUTTON),this.listWrapper=document.getElementById(this.ids.WRAPPER),this.searchField=document.getElementById(this.ids.SEARCH),this.selectAll=document.getElementById(this.ids.SELECT_ALL),this.listWrapper.appendChild(this.list),o(this.list,e+"__list")},t.prototype.handleAutoClose=function(t){var e=this;this.options.togglable&&this.options.autoClose&&(clearTimeout(this.autoCloseTimeout),this.autoCloseTimeout=setTimeout((function(){var i=t.target,s=e.button,o=e.listWrapper,n=document.activeElement;o.contains(i)||o.contains(n)||s&&(s.contains(i)||s.contains(n))||(e.hide.call(e),e.unbindDocumentClick())}),0))},t.prototype.toggleAllVisibleCheckboxes=function(t){var e=this;if(!(t&&("click"===t.type||"keydown"==t.type))||!this.selectAll||"true"!==this.selectAll.getAttribute("aria-disabled")){var i;if(this.selectAll)i="true"!==this.selectAll.getAttribute("aria-checked");else for(var s=0,o=this.visibleCheckboxIndexes.length;s<o;s+=1){var n=this.visibleCheckboxIndexes[s];if(!1===this.checkboxes[n].checked){i=!0;break}}i=!!i,this.visibleCheckboxIndexes.forEach((function(t){e.checkboxes[t].checked=i})),this.updateCheckedStates()}},t.prototype.moveFocusToCheckboxIndex=function(t,e,i){var s,o=this.checkboxes,n=e;if(function(t){var e=t;return e&&1===e.nodeType&&"INPUT"===e.nodeName&&("checkbox"===e.type||"radio"===e.type)}(n)&&-1!==(s=o.indexOf(n))){var l=this.visibleCheckboxIndexes,h=l.length-1,r=l.indexOf(s);if(-1!==r){switch(t&&"function"==typeof t.preventDefault&&t.preventDefault(),i){case L:var c=this.options.pageDownModifier;r+="number"==typeof c?c:10;break;case A:var a=this.options.pageUpModifier;r+="number"==typeof a?a:-10;break;case T:r=0;break;case S:r=h}r>h?r=h:r<0&&(r=0);var d=o[l[r]];d&&"function"==typeof d.focus&&d.focus()}}},t.prototype.handleKeyDown=function(t){if(this.options.keyboardShortcuts){var e=t.keyCode;if(e===m&&this.options.togglable)return this.hide(),void(this.button&&this.button.focus&&this.button.focus());e!==L&&e!==A&&e!==T&&e!==S||this.moveFocusToCheckboxIndex(t,t.target,e)}},t.prototype.bindEvents=function(){var t=this;if(this.autoCloseEvent=this.handleAutoClose.bind(this),this.bindDocumentClick(),this.listChangeEvent=function(e){var i=e.target;!i||"INPUT"!==i.nodeName||"checkbox"!==i.type&&"radio"!==i.type||t.updateCheckedStates()},this.list.addEventListener("change",this.listChangeEvent),this.button&&(this.buttonFocusOutEvent=this.autoCloseEvent,this.buttonClickEvent=function(e){e.preventDefault(),t.cache("visible")?t.hide():t.show()},this.button.addEventListener("click",this.buttonClickEvent),this.button.addEventListener("focusout",this.buttonFocusOutEvent)),this.searchField&&(this.searchFieldFilterEvent=this.handleFilterKeyDown.bind(this),this.searchFieldKeyDownEvent=this.searchFieldFilterEvent,this.searchFieldInputEvent=this.filterPrep.bind(this),this.searchField.addEventListener("keydown",this.searchFieldKeyDownEvent),this.searchField.addEventListener("input",this.searchFieldInputEvent)),this.listWrapperFocusOutEvent=this.autoCloseEvent,this.listWrapper.addEventListener("focusout",this.listWrapperFocusOutEvent),this.listWrapperKeyDownEvent=this.handleKeyDown.bind(this),this.listWrapper.addEventListener("keydown",this.listWrapperKeyDownEvent),this.selectAll){var e=this.selectAll.parentElement;this.selectAllClickEvent=this.toggleAllVisibleCheckboxes.bind(this),this.selectAllFocusInEvent=function(){var e=t.cssNameSpace+"__select-all-checkbox--focus focus focused";o(t.selectAll,e)},this.selectAllFocusOutEvent=function(){var e=t.cssNameSpace+"__select-all-checkbox--focus focus focused";h(t.selectAll,e)},this.selectAllKeyDownEvent=function(e){32===e.keyCode&&(e.preventDefault(),t.toggleAllVisibleCheckboxes(e))},e.addEventListener("click",this.selectAllClickEvent),e.addEventListener("focusin",this.selectAllFocusInEvent),e.addEventListener("focusout",this.selectAllFocusOutEvent),e.addEventListener("keydown",this.selectAllKeyDownEvent)}},t.prototype.setCheckboxArrays=function(){var t=this,e=this.list.querySelectorAll('input[type="checkbox"], input[type="radio"]'),i=this.options.selectAllControl&&this.selectAll,s=this.cssNameSpace+"--hide";this.checkboxes=Array.prototype.slice.call(e),this.visibleCheckboxIndexes=[],this.allCheckboxLabels=[],this.checkboxes.forEach((function(e,o){var l=E(e);i&&!e.id&&e.setAttribute("id",t.ids.WRAPPER+"-checkbox-"+o);var h=f(l);t.allCheckboxLabels.push(h),"hidden"===e.getAttribute("hidden")||n(e,s)||t.visibleCheckboxIndexes.push(o)}))},t.prototype.destroy=function(t){var e=this;if(void 0===t&&(t=!1),!this.listWrapper){if(this.listWrapper=this.list.parentElement,!this.listWrapper.matches("."+this.cssNameSpace+"__wrapper"))return;if(!this.button){var i=this.listWrapper.previousElementSibling;"BUTTON"===i.nodeName&&i.matches("."+this.cssNameSpace+"__toggle")&&(this.button=i)}}if(this.selectAll){var s=this.selectAll.parentElement;y(s,"click",this.selectAllClickEvent),y(s,"keydown",this.selectAllKeyDownEvent),y(s,"focusin",this.selectAllFocusInEvent),y(s,"focusout",this.selectAllFocusOutEvent)}this.searchField&&(y(this.searchField,"input",this.searchFieldInputEvent),y(this.searchField,"keydown",this.searchFieldKeyDownEvent)),this.button&&(y(this.button,"click",this.buttonClickEvent),y(this.button,"focusout",this.buttonFocusOutEvent),this.button.parentElement.removeChild(this.button)),this.list&&(y(this.list,"change",this.listChangeEvent),h(this.list,this.cssNameSpace+"__list"),this.listWrapper.parentElement.insertBefore(this.list,this.listWrapper),this.list.enhancedCheckboxList&&delete this.list.enhancedCheckboxList),y(this.listWrapper,"keydown",this.listWrapperKeyDownEvent),y(this.listWrapper,"focusout",this.listWrapperFocusOutEvent),this.listWrapper.parentElement.removeChild(this.listWrapper);var o=this.options.itemSelector;this.checkboxes.forEach((function(t){e.show(e.getItemSelectorElem(t,o))})),this.unbindDocumentClick(),t&&this.cache(!0)},t.prototype.init=function(){this.cssNameSpace=this.options.cssNameSpace,this.list.parentElement.matches("."+this.cssNameSpace+"__wrapper")&&this.destroy(),this.buildMarkup(),this.setCheckboxArrays(),this.setListState(),this.updateCheckedStates(),this.bindEvents(),this.api=new C(this),this.triggerOptionCallback("onReady"),this.options.filterable&&this.cache()&&void 0!==this.cache("search")&&this.filter(this.cache("search"))},t}();function I(t,e){return new F(t,e).api}i.d(e,"EnhancedCheckboxList",(function(){return I}));e.default=I}])})); |
{ | ||
"name": "enhanced-checkbox-list", | ||
"version": "1.0.0-beta.1", | ||
"version": "1.0.0-beta.2", | ||
"description": "Add filtering, toggling, and select-all enhancements to existing checkbox lists", | ||
@@ -5,0 +5,0 @@ "main": "dist/enhanced-checkbox-list.min.js", |
@@ -8,2 +8,4 @@ # Enhanced Checkbox Lists | ||
[Try out the examples](https://mynamesleon.github.io/enhanced-checkbox-lists/) | ||
## Installation / usage | ||
@@ -10,0 +12,0 @@ |
31869
179