From eefabba6bf57c99017b50d92572506cfdfb83c06 Mon Sep 17 00:00:00 2001 From: Jorik Kraaikamp Date: Fri, 8 Dec 2017 16:15:43 +0100 Subject: [PATCH 1/8] Now add all and remove all will only affect the search results that are shown. --- dist/dual-listbox.js | 2 +- src/dual-listbox.js | 24 ++++++++++++++++++------ 2 files changed, 19 insertions(+), 7 deletions(-) diff --git a/dist/dual-listbox.js b/dist/dual-listbox.js index de8b3af..dcb7866 100644 --- a/dist/dual-listbox.js +++ b/dist/dual-listbox.js @@ -1 +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]}}(this,function(){return function(t){function e(s){if(i[s])return i[s].exports;var n=i[s]={exports:{},id:s,loaded:!1};return t[s].call(n.exports,n,n.exports,e),n.loaded=!0,n.exports}var i={};return e.m=t,e.c=i,e.p="",e(0)}([function(t,e){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(e,"__esModule",{value:!0});var s="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},n=function(){function t(t,e){for(var i=0;i1&&void 0!==arguments[1]?arguments[1]:{};i(this,t),this.setDefaults(),this.selected=[],this.available=[],t.isDomElement(e)?this.select=e:this.select=document.querySelector(e),this._initOptions(s),this._initReusableElements(),this._splitOptions(this.select.options),void 0!==s.options&&this._splitOptions(s.options),this._buildDualListbox(this.select.parentNode),this._addActions(),this.redraw()}return n(t,[{key:"setDefaults",value:function(){this.addEvent=null,this.removeEvent=null,this.availableTitle="Available options",this.selectedTitle="Selected options",this.addButtonText="add",this.removeButtonText="remove",this.addAllButtonText="add all",this.removeAllButtonText="remove all",this.searchPlaceholder="Search"}},{key:"addEventListener",value:function(t,e){this.dualListbox.addEventListener(t,e)}},{key:"addSelected",value:function(t){var e=this.available.indexOf(t);if(e>-1){this.available.splice(e,1),this.selected.push(t),this._selectOption(t.dataset.id),this.redraw();var i=document.createEvent("HTMLEvents");i.initEvent("added",!1,!0),i.addedElement=t,this.dualListbox.dispatchEvent(i)}}},{key:"redraw",value:function(){this.updateAvailableListbox(),this.updateSelectedListbox()}},{key:"removeSelected",value:function(t){var e=this.selected.indexOf(t);if(e>-1){this.selected.splice(e,1),this.available.push(t),this._deselectOption(t.dataset.id),this.redraw();var i=document.createEvent("HTMLEvents");i.initEvent("removed",!1,!0),i.removedElement=t,this.dualListbox.dispatchEvent(i)}}},{key:"searchLists",value:function(t,e){for(var i=e.querySelectorAll("."+c),s=t.toLowerCase(),n=0;n0;)this.addSelected(this.available[0])}},{key:"_updateListbox",value:function(t,e){t.innerHTML="";for(var i=0;i0;)this.removeSelected(this.selected[0])}},{key:"_actionItemDeselected",value:function(t){t.preventDefault();var e=this.dualListbox.querySelector("."+b);e&&this.removeSelected(e)}},{key:"_actionItemDoubleClick",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;e&&(e.preventDefault(),e.stopPropagation()),this.selected.indexOf(t)>-1?this.removeSelected(t):this.addSelected(t)}},{key:"_actionItemClick",value:function(t,e){var i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;i&&i.preventDefault();for(var s=e.querySelectorAll("."+c),n=0;n1&&void 0!==arguments[1]?arguments[1]:{};i(this,t),this.setDefaults(),this.selected=[],this.available=[],t.isDomElement(e)?this.select=e:this.select=document.querySelector(e),this._initOptions(s),this._initReusableElements(),this._splitOptions(this.select.options),void 0!==s.options&&this._splitOptions(s.options),this._buildDualListbox(this.select.parentNode),this._addActions(),this.redraw()}return n(t,[{key:"setDefaults",value:function(){this.addEvent=null,this.removeEvent=null,this.availableTitle="Available options",this.selectedTitle="Selected options",this.addButtonText="add",this.removeButtonText="remove",this.addAllButtonText="add all",this.removeAllButtonText="remove all",this.searchPlaceholder="Search"}},{key:"addEventListener",value:function(t,e){this.dualListbox.addEventListener(t,e)}},{key:"addSelected",value:function(t){var e=this.available.indexOf(t);if(e>-1){this.available.splice(e,1),this.selected.push(t),this._selectOption(t.dataset.id),this.redraw();var i=document.createEvent("HTMLEvents");i.initEvent("added",!1,!0),i.addedElement=t,this.dualListbox.dispatchEvent(i)}}},{key:"redraw",value:function(){this.updateAvailableListbox(),this.updateSelectedListbox()}},{key:"removeSelected",value:function(t){var e=this.selected.indexOf(t);if(e>-1){this.selected.splice(e,1),this.available.push(t),this._deselectOption(t.dataset.id),this.redraw();var i=document.createEvent("HTMLEvents");i.initEvent("removed",!1,!0),i.removedElement=t,this.dualListbox.dispatchEvent(i)}}},{key:"searchLists",value:function(t,e){for(var i=e.querySelectorAll("."+c),s=t.toLowerCase(),n=0;n1&&void 0!==arguments[1]?arguments[1]:null;e&&(e.preventDefault(),e.stopPropagation()),this.selected.indexOf(t)>-1?this.removeSelected(t):this.addSelected(t)}},{key:"_actionItemClick",value:function(t,e){var i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;i&&i.preventDefault();for(var s=e.querySelectorAll("."+c),n=0;n 0) { - this.addSelected(this.available[0]); - } + let selected = []; + this.available.forEach(item => { + if (item.style.display !== 'none'){ + selected.push(item); + } + }); + selected.forEach(item => { + this.addSelected(item); + }); } /** @@ -193,9 +199,15 @@ class DualListbox { _actionAllDeselected(event) { event.preventDefault(); - while (this.selected.length > 0) { - this.removeSelected(this.selected[0]); - } + let deselected = []; + this.selected.forEach(item => { + if (item.style.display !== 'none'){ + deselected.push(item); + } + }); + deselected.forEach(item => { + this.removeSelected(item); + }); } /** From 17e690ad851843262564cc5302560fcdfd654a1a Mon Sep 17 00:00:00 2001 From: Jorik Kraaikamp Date: Fri, 8 Dec 2017 16:16:12 +0100 Subject: [PATCH 2/8] updated the version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 929ecb2..18cbaba 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "dual-listbox", - "version": "1.0.9", + "version": "1.0.10", "description": "Dual listbox for multi-select elements", "main": "dist/dual-listbox.js", "directories": { From 43dbc16457ceb5bdefdf8d9903e601b06db52622 Mon Sep 17 00:00:00 2001 From: Jorik Kraaikamp Date: Fri, 8 Dec 2017 16:49:20 +0100 Subject: [PATCH 3/8] Added some tests to make sure it works as expected --- test/dual-listbox.spec.js | 113 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 113 insertions(+) diff --git a/test/dual-listbox.spec.js b/test/dual-listbox.spec.js index 4c22416..f6a3ccd 100644 --- a/test/dual-listbox.spec.js +++ b/test/dual-listbox.spec.js @@ -56,6 +56,23 @@ const FIXTURE_FILLED_SELECT_WITH_ID = ` `; + +const FIXTURE_FILLED_SELECT_PRESELECTED_MULTIPLE = ` + +`; + + const OPTIONS_WITH_SELECTED_VALUE = [ { text: "option 1", @@ -328,4 +345,100 @@ describe('Duallistbox', function () { expect(dlb.available.length).toBe(10); expect(dlb.selected.length).toBe(0); }); + + it('should set the item to availeble.', () => { + let domParent = document.createElement("div"); + domParent.innerHTML = FIXTURE_FILLED_SELECT_PRESELECTED; + + let dlb = new DualListbox(domParent.getElementsByTagName('select')[0]); + expect(dlb.available.length).toBe(9); + expect(dlb.selected.length).toBe(1); + + dlb.selected[0].classList.add('dual-listbox__item--selected'); + let event = new CustomEvent('test'); + dlb._actionItemDeselected(event); + expect(dlb.available.length).toBe(10); + expect(dlb.selected.length).toBe(0); + }); + + it('should set the item to selected.', () => { + let domParent = document.createElement("div"); + domParent.innerHTML = FIXTURE_FILLED_SELECT_PRESELECTED; + + let dlb = new DualListbox(domParent.getElementsByTagName('select')[0]); + expect(dlb.available.length).toBe(9); + expect(dlb.selected.length).toBe(1); + + dlb.available[0].classList.add('dual-listbox__item--selected'); + let event = new CustomEvent('test'); + dlb._actionItemSelected(event); + expect(dlb.available.length).toBe(8); + expect(dlb.selected.length).toBe(2); + }); + + it('should only set the searched results to selected.', () => { + let domParent = document.createElement("div"); + domParent.innerHTML = FIXTURE_FILLED_SELECT; + + let dlb = new DualListbox(domParent.getElementsByTagName('select')[0]); + expect(dlb.available.length).toBe(10); + expect(dlb.selected.length).toBe(0); + + let event = new CustomEvent('test'); + dlb.searchLists('Four', dlb.dualListbox); + dlb._actionAllSelected(event); + expect(dlb.available.length).toBe(9); + expect(dlb.selected.length).toBe(1); + }); + + it('should only set the searched results to available.', () => { + let domParent = document.createElement("div"); + domParent.innerHTML = FIXTURE_FILLED_SELECT_PRESELECTED_MULTIPLE; + + let dlb = new DualListbox(domParent.getElementsByTagName('select')[0]); + expect(dlb.available.length).toBe(7); + expect(dlb.selected.length).toBe(3); + + let event = new CustomEvent('test'); + dlb.searchLists('Four', dlb.dualListbox); + dlb._actionAllDeselected(event); + expect(dlb.available.length).toBe(8); + expect(dlb.selected.length).toBe(2); + }); + + it('should be able to add the removed eventListener', (done) => { + let domParent = document.createElement("div"); + domParent.innerHTML = FIXTURE_FILLED_SELECT_PRESELECTED_MULTIPLE; + + let dlb = new DualListbox(domParent.getElementsByTagName('select')[0]); + expect(dlb.available.length).toBe(7); + expect(dlb.selected.length).toBe(3); + + dlb.addEventListener('removed', event => { + expect(event.removedElement.innerText).toBe('Two'); + done(); + }); + + dlb.selected[0].classList.add('dual-listbox__item--selected'); + let event = new CustomEvent('test'); + dlb._actionItemDeselected(event); + }); + + it('should be able to add the removed eventListener', (done) => { + let domParent = document.createElement("div"); + domParent.innerHTML = FIXTURE_FILLED_SELECT_PRESELECTED_MULTIPLE; + + let dlb = new DualListbox(domParent.getElementsByTagName('select')[0]); + expect(dlb.available.length).toBe(7); + expect(dlb.selected.length).toBe(3); + + dlb.addEventListener('added', event => { + expect(event.addedElement.innerText).toBe('One'); + done(); + }); + + dlb.available[0].classList.add('dual-listbox__item--selected'); + let event = new CustomEvent('test'); + dlb._actionItemSelected(event); + }); }); From 613618d46e4a499f40965aa30878df284ffa7c56 Mon Sep 17 00:00:00 2001 From: Jorik Kraaikamp Date: Fri, 8 Dec 2017 17:14:01 +0100 Subject: [PATCH 4/8] Fixed js tests --- package.json | 2 +- src/dual-listbox.js | 12 ++++++------ test/dual-listbox.spec.js | 18 ++++++++++++------ 3 files changed, 19 insertions(+), 13 deletions(-) diff --git a/package.json b/package.json index 18cbaba..7cdb760 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "dual-listbox", - "version": "1.0.10", + "version": "1.1.0", "description": "Dual listbox for multi-select elements", "main": "dist/dual-listbox.js", "directories": { diff --git a/src/dual-listbox.js b/src/dual-listbox.js index cca8043..38e46de 100644 --- a/src/dual-listbox.js +++ b/src/dual-listbox.js @@ -160,12 +160,12 @@ class DualListbox { event.preventDefault(); let selected = []; - this.available.forEach(item => { - if (item.style.display !== 'none'){ + this.available.forEach((item) => { + if (item.style.display !== "none"){ selected.push(item); } }); - selected.forEach(item => { + selected.forEach((item) => { this.addSelected(item); }); } @@ -200,12 +200,12 @@ class DualListbox { event.preventDefault(); let deselected = []; - this.selected.forEach(item => { - if (item.style.display !== 'none'){ + this.selected.forEach((item) => { + if (item.style.display !== "none"){ deselected.push(item); } }); - deselected.forEach(item => { + deselected.forEach((item) => { this.removeSelected(item); }); } diff --git a/test/dual-listbox.spec.js b/test/dual-listbox.spec.js index f6a3ccd..2483b12 100644 --- a/test/dual-listbox.spec.js +++ b/test/dual-listbox.spec.js @@ -355,7 +355,8 @@ describe('Duallistbox', function () { expect(dlb.selected.length).toBe(1); dlb.selected[0].classList.add('dual-listbox__item--selected'); - let event = new CustomEvent('test'); + let event = {}; + event.preventDefault = () => {}; dlb._actionItemDeselected(event); expect(dlb.available.length).toBe(10); expect(dlb.selected.length).toBe(0); @@ -370,7 +371,8 @@ describe('Duallistbox', function () { expect(dlb.selected.length).toBe(1); dlb.available[0].classList.add('dual-listbox__item--selected'); - let event = new CustomEvent('test'); + let event = {}; + event.preventDefault = () => {}; dlb._actionItemSelected(event); expect(dlb.available.length).toBe(8); expect(dlb.selected.length).toBe(2); @@ -384,7 +386,8 @@ describe('Duallistbox', function () { expect(dlb.available.length).toBe(10); expect(dlb.selected.length).toBe(0); - let event = new CustomEvent('test'); + let event = {}; + event.preventDefault = () => {}; dlb.searchLists('Four', dlb.dualListbox); dlb._actionAllSelected(event); expect(dlb.available.length).toBe(9); @@ -399,7 +402,8 @@ describe('Duallistbox', function () { expect(dlb.available.length).toBe(7); expect(dlb.selected.length).toBe(3); - let event = new CustomEvent('test'); + let event = {}; + event.preventDefault = () => {}; dlb.searchLists('Four', dlb.dualListbox); dlb._actionAllDeselected(event); expect(dlb.available.length).toBe(8); @@ -420,7 +424,8 @@ describe('Duallistbox', function () { }); dlb.selected[0].classList.add('dual-listbox__item--selected'); - let event = new CustomEvent('test'); + let event = {}; + event.preventDefault = () => {}; dlb._actionItemDeselected(event); }); @@ -438,7 +443,8 @@ describe('Duallistbox', function () { }); dlb.available[0].classList.add('dual-listbox__item--selected'); - let event = new CustomEvent('test'); + let event = {}; + event.preventDefault = () => {}; dlb._actionItemSelected(event); }); }); From b08a1a25d512b59da78ac84b2c7927ba3a605a01 Mon Sep 17 00:00:00 2001 From: Sven van de Scheur Date: Fri, 8 Dec 2017 17:30:45 +0100 Subject: [PATCH 5/8] Try with timeout. --- test/dual-listbox.spec.js | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/test/dual-listbox.spec.js b/test/dual-listbox.spec.js index 2483b12..e14e18d 100644 --- a/test/dual-listbox.spec.js +++ b/test/dual-listbox.spec.js @@ -429,7 +429,7 @@ describe('Duallistbox', function () { dlb._actionItemDeselected(event); }); - it('should be able to add the removed eventListener', (done) => { + it('should be able to add the added eventListener', (done) => { let domParent = document.createElement("div"); domParent.innerHTML = FIXTURE_FILLED_SELECT_PRESELECTED_MULTIPLE; @@ -438,8 +438,10 @@ describe('Duallistbox', function () { expect(dlb.selected.length).toBe(3); dlb.addEventListener('added', event => { - expect(event.addedElement.innerText).toBe('One'); - done(); + setTimeout(() => { + expect(event.addedElement.innerText).toBe('One'); + done(); + }); }); dlb.available[0].classList.add('dual-listbox__item--selected'); From 9baf9034ce3af0aca3b584f7511e6d19e7afa279 Mon Sep 17 00:00:00 2001 From: Sven van de Scheur Date: Fri, 8 Dec 2017 17:31:17 +0100 Subject: [PATCH 6/8] +1 --- test/dual-listbox.spec.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/test/dual-listbox.spec.js b/test/dual-listbox.spec.js index e14e18d..59e2327 100644 --- a/test/dual-listbox.spec.js +++ b/test/dual-listbox.spec.js @@ -419,8 +419,10 @@ describe('Duallistbox', function () { expect(dlb.selected.length).toBe(3); dlb.addEventListener('removed', event => { - expect(event.removedElement.innerText).toBe('Two'); - done(); + setTimeout(() => { + expect(event.removedElement.innerText).toBe('Two'); + done(); + }); }); dlb.selected[0].classList.add('dual-listbox__item--selected'); From c154e7744e4f30bc3f22455d546aabfd1ef98a39 Mon Sep 17 00:00:00 2001 From: Sven van de Scheur Date: Fri, 8 Dec 2017 17:50:49 +0100 Subject: [PATCH 7/8] Try this. --- index.html | 4 ++-- src/dual-listbox.js | 4 ++-- test/dual-listbox.spec.js | 12 ++++-------- 3 files changed, 8 insertions(+), 12 deletions(-) diff --git a/index.html b/index.html index 87d89dc..c3bcb51 100644 --- a/index.html +++ b/index.html @@ -112,10 +112,10 @@

Add options and add eventListeners { - setTimeout(() => { - expect(event.removedElement.innerText).toBe('Two'); - done(); - }); + expect(event.target.innerText).toBe('Two'); + done(); }); dlb.selected[0].classList.add('dual-listbox__item--selected'); @@ -440,10 +438,8 @@ describe('Duallistbox', function () { expect(dlb.selected.length).toBe(3); dlb.addEventListener('added', event => { - setTimeout(() => { - expect(event.addedElement.innerText).toBe('One'); - done(); - }); + expect(event.target.innerText).toBe('One'); + done(); }); dlb.available[0].classList.add('dual-listbox__item--selected'); From 16a38e361f80e593dae482b6f10d6d4bb7def51d Mon Sep 17 00:00:00 2001 From: Jorik Kraaikamp Date: Fri, 8 Dec 2017 17:56:31 +0100 Subject: [PATCH 8/8] Updated the selected loops --- dist/dual-listbox.js | 2 +- src/dual-listbox.js | 22 ++++------------------ 2 files changed, 5 insertions(+), 19 deletions(-) diff --git a/dist/dual-listbox.js b/dist/dual-listbox.js index dcb7866..aecc475 100644 --- a/dist/dual-listbox.js +++ b/dist/dual-listbox.js @@ -1 +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]}}(this,function(){return function(t){function e(s){if(i[s])return i[s].exports;var n=i[s]={exports:{},id:s,loaded:!1};return t[s].call(n.exports,n,n.exports,e),n.loaded=!0,n.exports}var i={};return e.m=t,e.c=i,e.p="",e(0)}([function(t,e){"use strict";function i(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(e,"__esModule",{value:!0});var s="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},n=function(){function t(t,e){for(var i=0;i1&&void 0!==arguments[1]?arguments[1]:{};i(this,t),this.setDefaults(),this.selected=[],this.available=[],t.isDomElement(e)?this.select=e:this.select=document.querySelector(e),this._initOptions(s),this._initReusableElements(),this._splitOptions(this.select.options),void 0!==s.options&&this._splitOptions(s.options),this._buildDualListbox(this.select.parentNode),this._addActions(),this.redraw()}return n(t,[{key:"setDefaults",value:function(){this.addEvent=null,this.removeEvent=null,this.availableTitle="Available options",this.selectedTitle="Selected options",this.addButtonText="add",this.removeButtonText="remove",this.addAllButtonText="add all",this.removeAllButtonText="remove all",this.searchPlaceholder="Search"}},{key:"addEventListener",value:function(t,e){this.dualListbox.addEventListener(t,e)}},{key:"addSelected",value:function(t){var e=this.available.indexOf(t);if(e>-1){this.available.splice(e,1),this.selected.push(t),this._selectOption(t.dataset.id),this.redraw();var i=document.createEvent("HTMLEvents");i.initEvent("added",!1,!0),i.addedElement=t,this.dualListbox.dispatchEvent(i)}}},{key:"redraw",value:function(){this.updateAvailableListbox(),this.updateSelectedListbox()}},{key:"removeSelected",value:function(t){var e=this.selected.indexOf(t);if(e>-1){this.selected.splice(e,1),this.available.push(t),this._deselectOption(t.dataset.id),this.redraw();var i=document.createEvent("HTMLEvents");i.initEvent("removed",!1,!0),i.removedElement=t,this.dualListbox.dispatchEvent(i)}}},{key:"searchLists",value:function(t,e){for(var i=e.querySelectorAll("."+c),s=t.toLowerCase(),n=0;n1&&void 0!==arguments[1]?arguments[1]:null;e&&(e.preventDefault(),e.stopPropagation()),this.selected.indexOf(t)>-1?this.removeSelected(t):this.addSelected(t)}},{key:"_actionItemClick",value:function(t,e){var i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;i&&i.preventDefault();for(var s=e.querySelectorAll("."+c),n=0;n1&&void 0!==arguments[1]?arguments[1]:{};i(this,t),this.setDefaults(),this.selected=[],this.available=[],t.isDomElement(e)?this.select=e:this.select=document.querySelector(e),this._initOptions(s),this._initReusableElements(),this._splitOptions(this.select.options),void 0!==s.options&&this._splitOptions(s.options),this._buildDualListbox(this.select.parentNode),this._addActions(),this.redraw()}return n(t,[{key:"setDefaults",value:function(){this.addEvent=null,this.removeEvent=null,this.availableTitle="Available options",this.selectedTitle="Selected options",this.addButtonText="add",this.removeButtonText="remove",this.addAllButtonText="add all",this.removeAllButtonText="remove all",this.searchPlaceholder="Search"}},{key:"addEventListener",value:function(t,e){this.dualListbox.addEventListener(t,e)}},{key:"addSelected",value:function(t){var e=this.available.indexOf(t);if(e>-1){this.available.splice(e,1),this.selected.push(t),this._selectOption(t.dataset.id),this.redraw();var i=document.createEvent("HTMLEvents");i.initEvent("added",!1,!0),i.addedElement=t,this.dualListbox.dispatchEvent(i)}}},{key:"redraw",value:function(){this.updateAvailableListbox(),this.updateSelectedListbox()}},{key:"removeSelected",value:function(t){var e=this.selected.indexOf(t);if(e>-1){this.selected.splice(e,1),this.available.push(t),this._deselectOption(t.dataset.id),this.redraw();var i=document.createEvent("HTMLEvents");i.initEvent("removed",!1,!0),i.removedElement=t,this.dualListbox.dispatchEvent(i)}}},{key:"searchLists",value:function(t,e){for(var i=e.querySelectorAll("."+c),s=t.toLowerCase(),n=0;n1&&void 0!==arguments[1]?arguments[1]:null;e&&(e.preventDefault(),e.stopPropagation()),this.selected.indexOf(t)>-1?this.removeSelected(t):this.addSelected(t)}},{key:"_actionItemClick",value:function(t,e){var i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;i&&i.preventDefault();for(var s=e.querySelectorAll("."+c),n=0;n { - if (item.style.display !== "none"){ - selected.push(item); - } - }); - selected.forEach((item) => { - this.addSelected(item); - }); + let selected = this.available.filter((item) => item.style.display !== "none"); + selected.forEach((item) => this.addSelected(item)); } /** @@ -199,15 +192,8 @@ class DualListbox { _actionAllDeselected(event) { event.preventDefault(); - let deselected = []; - this.selected.forEach((item) => { - if (item.style.display !== "none"){ - deselected.push(item); - } - }); - deselected.forEach((item) => { - this.removeSelected(item); - }); + let deselected = this.selected.filter((item) => item.style.display !== "none"); + deselected.forEach((item) => this.removeSelected(item)); } /**