Drag and drop task list items.
$ npm install --save @github/task-lists-element Import as a module:
import'@github/task-lists-element'With a script tag:
<scripttype="module" src="./node_modules/@github/task-lists-element/dist/task-lists-element.js"><task-listssortable><ulclass="contains-task-list"><liclass="task-list-item"><inputtype="checkbox" class="task-list-item-checkbox"> Hubot </li><liclass="task-list-item"><inputtype="checkbox" class="task-list-item-checkbox"> Bender </li></ul><ulclass="contains-task-list"><liclass="task-list-item"><inputtype="checkbox" class="task-list-item-checkbox"> BB-8 </li><liclass="task-list-item"><inputtype="checkbox" class="task-list-item-checkbox"> WALL-E </li></ul></task-lists>constlist=document.querySelector('task-lists')list.addEventListener('task-lists-check',function(event){const{position, checked}=event.detailconsole.log(position,checked)})list.addEventListener('task-lists-move',function(event){const{src, dst}=event.detailconsole.log(src,dst)})Browsers without native custom element support require a polyfill.
- Chrome
- Firefox
- Safari
- Microsoft Edge
npm install npm test Distributed under the MIT license. See LICENSE for details.