From 08cc299969779bbbede207fdc67ab67f9ee965cc Mon Sep 17 00:00:00 2001 From: Josh Schmidt Date: Wed, 2 Jun 2021 19:28:54 -0600 Subject: [PATCH] v1.7.4 Release --- dist/cjs/tom-select.complete.js | 534 +- dist/cjs/tom-select.complete.js.map | 2 +- dist/cjs/tom-select.js | 534 +- dist/cjs/tom-select.js.map | 2 +- dist/cjs/tom-select.popular.js | 536 +- dist/cjs/tom-select.popular.js.map | 2 +- dist/cjs/utils.js | 2 +- dist/css/tom-select.bootstrap3.css | 2 +- dist/css/tom-select.bootstrap4.css | 2 +- dist/css/tom-select.bootstrap5.css | 2 +- dist/css/tom-select.css | 2 +- dist/css/tom-select.default.css | 2 +- dist/docs/css/bootstrap.css | 7 + dist/docs/css/bootstrap.css.map | 1 + dist/docs/css/bootstrap.scss | 63 + dist/docs/css/stylesheet.css | 7 + dist/docs/css/stylesheet.css.map | 1 + dist/docs/css/stylesheet.scss | 365 + dist/docs/css/tom-select.bootstrap3.css | 413 + dist/docs/css/tom-select.bootstrap3.css.map | 1 + dist/docs/css/tom-select.bootstrap3.min.css | 2 + .../css/tom-select.bootstrap3.min.css.map | 1 + dist/docs/css/tom-select.bootstrap4.css | 465 + dist/docs/css/tom-select.bootstrap4.css.map | 1 + dist/docs/css/tom-select.bootstrap4.min.css | 2 + .../css/tom-select.bootstrap4.min.css.map | 1 + dist/docs/css/tom-select.bootstrap5.css | 463 + dist/docs/css/tom-select.bootstrap5.css.map | 1 + dist/docs/css/tom-select.css | 328 + dist/docs/css/tom-select.css.map | 1 + dist/docs/css/tom-select.default.css | 399 + dist/docs/css/tom-select.default.css.map | 1 + dist/docs/css/tom-select.default.min.css | 2 + dist/docs/css/tom-select.default.min.css.map | 1 + dist/docs/css/tom-select.min.css | 2 + dist/docs/css/tom-select.min.css.map | 1 + dist/docs/css/variables.css | 2 + dist/docs/css/variables.css.map | 1 + dist/docs/css/variables.scss | 127 + dist/docs/docs/api/index.html | 361 + dist/docs/docs/contribute/index.html | 131 + dist/docs/docs/events/index.html | 221 + dist/docs/docs/index.html | 556 + dist/docs/docs/plugins/index.html | 164 + dist/docs/docs/selectize.js/index.html | 165 + .../esm/plugins/change_listener/plugin.js | 308 + .../esm/plugins/change_listener/plugin.js.map | 1 + .../esm/plugins/checkbox_options/plugin.js | 147 + .../plugins/checkbox_options/plugin.js.map | 1 + dist/docs/esm/plugins/clear_button/plugin.js | 66 + .../esm/plugins/clear_button/plugin.js.map | 1 + dist/docs/esm/plugins/drag_drop/plugin.js | 62 + dist/docs/esm/plugins/drag_drop/plugin.js.map | 1 + .../esm/plugins/dropdown_header/plugin.js | 102 + .../esm/plugins/dropdown_header/plugin.js.map | 1 + .../docs/esm/plugins/dropdown_input/plugin.js | 131 + .../esm/plugins/dropdown_input/plugin.js.map | 1 + .../docs/esm/plugins/input_autogrow/plugin.js | 79 + .../esm/plugins/input_autogrow/plugin.js.map | 1 + .../esm/plugins/no_active_items/plugin.js | 25 + .../esm/plugins/no_active_items/plugin.js.map | 1 + .../esm/plugins/no_backspace_delete/plugin.js | 32 + .../plugins/no_backspace_delete/plugin.js.map | 1 + .../esm/plugins/optgroup_columns/plugin.js | 102 + .../plugins/optgroup_columns/plugin.js.map | 1 + dist/docs/esm/plugins/remove_button/plugin.js | 129 + .../esm/plugins/remove_button/plugin.js.map | 1 + .../plugins/restore_on_backspace/plugin.js | 39 + .../restore_on_backspace/plugin.js.map | 1 + .../docs/esm/plugins/virtual_scroll/plugin.js | 209 + .../esm/plugins/virtual_scroll/plugin.js.map | 1 + dist/docs/esm/tom-select.complete.js | 4680 +++++ dist/docs/esm/tom-select.complete.js.map | 1 + dist/docs/esm/tom-select.js | 4014 +++++ dist/docs/esm/tom-select.js.map | 1 + dist/docs/esm/tom-select.popular.js | 4179 +++++ dist/docs/esm/tom-select.popular.js.map | 1 + dist/docs/esm/utils.js | 171 + dist/docs/esm/utils.js.map | 1 + dist/docs/examples/api/index.html | 306 + dist/docs/examples/contacts/index.html | 348 + dist/docs/examples/create-filter/index.html | 492 + dist/docs/examples/customization/index.html | 300 + dist/docs/examples/esm/index.html | 248 + dist/docs/examples/events/index.html | 492 + dist/docs/examples/index.html | 877 + dist/docs/examples/lock/index.html | 375 + dist/docs/examples/optgroups/index.html | 720 + dist/docs/examples/options/index.html | 389 + dist/docs/examples/performance/index.html | 273 + dist/docs/examples/plugins/index.html | 14 + dist/docs/examples/remote/index.html | 719 + dist/docs/examples/required/index.html | 14 + dist/docs/examples/rtl/index.html | 378 + dist/docs/examples/styling/index.html | 900 + dist/docs/examples/validation/index.html | 622 + dist/docs/index.html | 331 + dist/docs/js/index.bundle.js | 238 + dist/docs/js/index.bundle.js.map | 1 + dist/docs/js/index.js | 204 + dist/docs/js/jquery.min.js | 5 + dist/docs/js/jqueryui.js | 15003 ++++++++++++++++ dist/docs/js/plugins/change_listener.js | 318 + dist/docs/js/plugins/change_listener.js.map | 1 + dist/docs/js/plugins/checkbox_options.js | 157 + dist/docs/js/plugins/checkbox_options.js.map | 1 + dist/docs/js/plugins/clear_button.js | 76 + dist/docs/js/plugins/clear_button.js.map | 1 + dist/docs/js/plugins/drag_drop.js | 72 + dist/docs/js/plugins/drag_drop.js.map | 1 + dist/docs/js/plugins/dropdown_header.js | 112 + dist/docs/js/plugins/dropdown_header.js.map | 1 + dist/docs/js/plugins/dropdown_input.js | 141 + dist/docs/js/plugins/dropdown_input.js.map | 1 + dist/docs/js/plugins/input_autogrow.js | 89 + dist/docs/js/plugins/input_autogrow.js.map | 1 + dist/docs/js/plugins/no_active_items.js | 35 + dist/docs/js/plugins/no_active_items.js.map | 1 + dist/docs/js/plugins/no_backspace_delete.js | 42 + .../js/plugins/no_backspace_delete.js.map | 1 + dist/docs/js/plugins/optgroup_columns.js | 112 + dist/docs/js/plugins/optgroup_columns.js.map | 1 + dist/docs/js/plugins/remove_button.js | 139 + dist/docs/js/plugins/remove_button.js.map | 1 + dist/docs/js/plugins/restore_on_backspace.js | 49 + .../js/plugins/restore_on_backspace.js.map | 1 + dist/docs/js/plugins/virtual_scroll.js | 219 + dist/docs/js/plugins/virtual_scroll.js.map | 1 + dist/docs/js/states.json | 154 + dist/docs/js/tom-select.base.js | 4023 +++++ dist/docs/js/tom-select.base.js.map | 1 + dist/docs/js/tom-select.base.min.js | 277 + dist/docs/js/tom-select.base.min.js.map | 1 + dist/docs/js/tom-select.complete.js | 4689 +++++ dist/docs/js/tom-select.complete.js.map | 1 + dist/docs/js/tom-select.complete.min.js | 328 + dist/docs/js/tom-select.complete.min.js.map | 1 + dist/docs/js/tom-select.popular.js | 4188 +++++ dist/docs/js/tom-select.popular.js.map | 1 + dist/docs/js/tom-select.popular.min.js | 289 + dist/docs/js/tom-select.popular.min.js.map | 1 + dist/docs/plugins/change-listener/index.html | 299 + dist/docs/plugins/checkbox-options/index.html | 303 + dist/docs/plugins/clear-button/index.html | 484 + dist/docs/plugins/drag-drop/index.html | 290 + dist/docs/plugins/dropdown-header/index.html | 447 + dist/docs/plugins/dropdown-input/index.html | 303 + dist/docs/plugins/index.html | 1430 ++ dist/docs/plugins/input-autogrow/index.html | 305 + dist/docs/plugins/no-active-items/index.html | 289 + .../plugins/no-backspace-delete/index.html | 311 + dist/docs/plugins/optgroup-columns/index.html | 324 + dist/docs/plugins/remove-button/index.html | 491 + .../plugins/restore-on-backspace/index.html | 319 + dist/docs/plugins/virtual_scroll/index.html | 424 + dist/docs/robots.txt | 4 + dist/docs/sitemap.xml | 194 + dist/esm/plugins/change_listener/plugin.js | 2 +- dist/esm/plugins/checkbox_options/plugin.js | 2 +- .../plugins/checkbox_options/plugin.js.map | 2 +- dist/esm/plugins/clear_button/plugin.js | 2 +- dist/esm/plugins/clear_button/plugin.js.map | 2 +- dist/esm/plugins/drag_drop/plugin.js | 2 +- dist/esm/plugins/dropdown_header/plugin.js | 2 +- .../esm/plugins/dropdown_header/plugin.js.map | 2 +- dist/esm/plugins/dropdown_input/plugin.js | 2 +- dist/esm/plugins/dropdown_input/plugin.js.map | 2 +- dist/esm/plugins/input_autogrow/plugin.js | 2 +- dist/esm/plugins/no_active_items/plugin.js | 2 +- .../esm/plugins/no_backspace_delete/plugin.js | 2 +- dist/esm/plugins/optgroup_columns/plugin.js | 2 +- .../plugins/optgroup_columns/plugin.js.map | 2 +- dist/esm/plugins/remove_button/plugin.js | 2 +- dist/esm/plugins/remove_button/plugin.js.map | 2 +- .../plugins/restore_on_backspace/plugin.js | 2 +- dist/esm/plugins/virtual_scroll/plugin.js | 2 +- dist/esm/plugins/virtual_scroll/plugin.js.map | 2 +- dist/esm/tom-select.complete.js | 534 +- dist/esm/tom-select.complete.js.map | 2 +- dist/esm/tom-select.js | 534 +- dist/esm/tom-select.js.map | 2 +- dist/esm/tom-select.popular.js | 536 +- dist/esm/tom-select.popular.js.map | 2 +- dist/esm/utils.js | 2 +- dist/js/plugins/change_listener.js | 2 +- dist/js/plugins/checkbox_options.js | 2 +- dist/js/plugins/checkbox_options.js.map | 2 +- dist/js/plugins/clear_button.js | 2 +- dist/js/plugins/clear_button.js.map | 2 +- dist/js/plugins/drag_drop.js | 2 +- dist/js/plugins/dropdown_header.js | 2 +- dist/js/plugins/dropdown_header.js.map | 2 +- dist/js/plugins/dropdown_input.js | 2 +- dist/js/plugins/dropdown_input.js.map | 2 +- dist/js/plugins/input_autogrow.js | 2 +- dist/js/plugins/no_active_items.js | 2 +- dist/js/plugins/no_backspace_delete.js | 2 +- dist/js/plugins/optgroup_columns.js | 2 +- dist/js/plugins/optgroup_columns.js.map | 2 +- dist/js/plugins/remove_button.js | 2 +- dist/js/plugins/remove_button.js.map | 2 +- dist/js/plugins/restore_on_backspace.js | 2 +- dist/js/plugins/virtual_scroll.js | 2 +- dist/js/plugins/virtual_scroll.js.map | 2 +- dist/js/tom-select.base.js | 534 +- dist/js/tom-select.base.js.map | 2 +- dist/js/tom-select.base.min.js | 220 +- dist/js/tom-select.base.min.js.map | 2 +- dist/js/tom-select.complete.js | 534 +- dist/js/tom-select.complete.js.map | 2 +- dist/js/tom-select.complete.min.js | 258 +- dist/js/tom-select.complete.min.js.map | 2 +- dist/js/tom-select.popular.js | 536 +- dist/js/tom-select.popular.js.map | 2 +- dist/js/tom-select.popular.min.js | 226 +- dist/js/tom-select.popular.min.js.map | 2 +- dist/scss/tom-select.scss | 2 +- package.json | 2 +- test/html/tab.html | 49 + 219 files changed, 66671 insertions(+), 2759 deletions(-) create mode 100644 dist/docs/css/bootstrap.css create mode 100644 dist/docs/css/bootstrap.css.map create mode 100644 dist/docs/css/bootstrap.scss create mode 100644 dist/docs/css/stylesheet.css create mode 100644 dist/docs/css/stylesheet.css.map create mode 100644 dist/docs/css/stylesheet.scss create mode 100644 dist/docs/css/tom-select.bootstrap3.css create mode 100644 dist/docs/css/tom-select.bootstrap3.css.map create mode 100644 dist/docs/css/tom-select.bootstrap3.min.css create mode 100644 dist/docs/css/tom-select.bootstrap3.min.css.map create mode 100644 dist/docs/css/tom-select.bootstrap4.css create mode 100644 dist/docs/css/tom-select.bootstrap4.css.map create mode 100644 dist/docs/css/tom-select.bootstrap4.min.css create mode 100644 dist/docs/css/tom-select.bootstrap4.min.css.map create mode 100644 dist/docs/css/tom-select.bootstrap5.css create mode 100644 dist/docs/css/tom-select.bootstrap5.css.map create mode 100644 dist/docs/css/tom-select.css create mode 100644 dist/docs/css/tom-select.css.map create mode 100644 dist/docs/css/tom-select.default.css create mode 100644 dist/docs/css/tom-select.default.css.map create mode 100644 dist/docs/css/tom-select.default.min.css create mode 100644 dist/docs/css/tom-select.default.min.css.map create mode 100644 dist/docs/css/tom-select.min.css create mode 100644 dist/docs/css/tom-select.min.css.map create mode 100644 dist/docs/css/variables.css create mode 100644 dist/docs/css/variables.css.map create mode 100644 dist/docs/css/variables.scss create mode 100644 dist/docs/docs/api/index.html create mode 100644 dist/docs/docs/contribute/index.html create mode 100644 dist/docs/docs/events/index.html create mode 100644 dist/docs/docs/index.html create mode 100644 dist/docs/docs/plugins/index.html create mode 100644 dist/docs/docs/selectize.js/index.html create mode 100644 dist/docs/esm/plugins/change_listener/plugin.js create mode 100644 dist/docs/esm/plugins/change_listener/plugin.js.map create mode 100644 dist/docs/esm/plugins/checkbox_options/plugin.js create mode 100644 dist/docs/esm/plugins/checkbox_options/plugin.js.map create mode 100644 dist/docs/esm/plugins/clear_button/plugin.js create mode 100644 dist/docs/esm/plugins/clear_button/plugin.js.map create mode 100644 dist/docs/esm/plugins/drag_drop/plugin.js create mode 100644 dist/docs/esm/plugins/drag_drop/plugin.js.map create mode 100644 dist/docs/esm/plugins/dropdown_header/plugin.js create mode 100644 dist/docs/esm/plugins/dropdown_header/plugin.js.map create mode 100644 dist/docs/esm/plugins/dropdown_input/plugin.js create mode 100644 dist/docs/esm/plugins/dropdown_input/plugin.js.map create mode 100644 dist/docs/esm/plugins/input_autogrow/plugin.js create mode 100644 dist/docs/esm/plugins/input_autogrow/plugin.js.map create mode 100644 dist/docs/esm/plugins/no_active_items/plugin.js create mode 100644 dist/docs/esm/plugins/no_active_items/plugin.js.map create mode 100644 dist/docs/esm/plugins/no_backspace_delete/plugin.js create mode 100644 dist/docs/esm/plugins/no_backspace_delete/plugin.js.map create mode 100644 dist/docs/esm/plugins/optgroup_columns/plugin.js create mode 100644 dist/docs/esm/plugins/optgroup_columns/plugin.js.map create mode 100644 dist/docs/esm/plugins/remove_button/plugin.js create mode 100644 dist/docs/esm/plugins/remove_button/plugin.js.map create mode 100644 dist/docs/esm/plugins/restore_on_backspace/plugin.js create mode 100644 dist/docs/esm/plugins/restore_on_backspace/plugin.js.map create mode 100644 dist/docs/esm/plugins/virtual_scroll/plugin.js create mode 100644 dist/docs/esm/plugins/virtual_scroll/plugin.js.map create mode 100644 dist/docs/esm/tom-select.complete.js create mode 100644 dist/docs/esm/tom-select.complete.js.map create mode 100644 dist/docs/esm/tom-select.js create mode 100644 dist/docs/esm/tom-select.js.map create mode 100644 dist/docs/esm/tom-select.popular.js create mode 100644 dist/docs/esm/tom-select.popular.js.map create mode 100644 dist/docs/esm/utils.js create mode 100644 dist/docs/esm/utils.js.map create mode 100644 dist/docs/examples/api/index.html create mode 100644 dist/docs/examples/contacts/index.html create mode 100644 dist/docs/examples/create-filter/index.html create mode 100644 dist/docs/examples/customization/index.html create mode 100644 dist/docs/examples/esm/index.html create mode 100644 dist/docs/examples/events/index.html create mode 100644 dist/docs/examples/index.html create mode 100644 dist/docs/examples/lock/index.html create mode 100644 dist/docs/examples/optgroups/index.html create mode 100644 dist/docs/examples/options/index.html create mode 100644 dist/docs/examples/performance/index.html create mode 100644 dist/docs/examples/plugins/index.html create mode 100644 dist/docs/examples/remote/index.html create mode 100644 dist/docs/examples/required/index.html create mode 100644 dist/docs/examples/rtl/index.html create mode 100644 dist/docs/examples/styling/index.html create mode 100644 dist/docs/examples/validation/index.html create mode 100644 dist/docs/index.html create mode 100644 dist/docs/js/index.bundle.js create mode 100644 dist/docs/js/index.bundle.js.map create mode 100644 dist/docs/js/index.js create mode 100644 dist/docs/js/jquery.min.js create mode 100644 dist/docs/js/jqueryui.js create mode 100644 dist/docs/js/plugins/change_listener.js create mode 100644 dist/docs/js/plugins/change_listener.js.map create mode 100644 dist/docs/js/plugins/checkbox_options.js create mode 100644 dist/docs/js/plugins/checkbox_options.js.map create mode 100644 dist/docs/js/plugins/clear_button.js create mode 100644 dist/docs/js/plugins/clear_button.js.map create mode 100644 dist/docs/js/plugins/drag_drop.js create mode 100644 dist/docs/js/plugins/drag_drop.js.map create mode 100644 dist/docs/js/plugins/dropdown_header.js create mode 100644 dist/docs/js/plugins/dropdown_header.js.map create mode 100644 dist/docs/js/plugins/dropdown_input.js create mode 100644 dist/docs/js/plugins/dropdown_input.js.map create mode 100644 dist/docs/js/plugins/input_autogrow.js create mode 100644 dist/docs/js/plugins/input_autogrow.js.map create mode 100644 dist/docs/js/plugins/no_active_items.js create mode 100644 dist/docs/js/plugins/no_active_items.js.map create mode 100644 dist/docs/js/plugins/no_backspace_delete.js create mode 100644 dist/docs/js/plugins/no_backspace_delete.js.map create mode 100644 dist/docs/js/plugins/optgroup_columns.js create mode 100644 dist/docs/js/plugins/optgroup_columns.js.map create mode 100644 dist/docs/js/plugins/remove_button.js create mode 100644 dist/docs/js/plugins/remove_button.js.map create mode 100644 dist/docs/js/plugins/restore_on_backspace.js create mode 100644 dist/docs/js/plugins/restore_on_backspace.js.map create mode 100644 dist/docs/js/plugins/virtual_scroll.js create mode 100644 dist/docs/js/plugins/virtual_scroll.js.map create mode 100644 dist/docs/js/states.json create mode 100644 dist/docs/js/tom-select.base.js create mode 100644 dist/docs/js/tom-select.base.js.map create mode 100644 dist/docs/js/tom-select.base.min.js create mode 100644 dist/docs/js/tom-select.base.min.js.map create mode 100644 dist/docs/js/tom-select.complete.js create mode 100644 dist/docs/js/tom-select.complete.js.map create mode 100644 dist/docs/js/tom-select.complete.min.js create mode 100644 dist/docs/js/tom-select.complete.min.js.map create mode 100644 dist/docs/js/tom-select.popular.js create mode 100644 dist/docs/js/tom-select.popular.js.map create mode 100644 dist/docs/js/tom-select.popular.min.js create mode 100644 dist/docs/js/tom-select.popular.min.js.map create mode 100644 dist/docs/plugins/change-listener/index.html create mode 100644 dist/docs/plugins/checkbox-options/index.html create mode 100644 dist/docs/plugins/clear-button/index.html create mode 100644 dist/docs/plugins/drag-drop/index.html create mode 100644 dist/docs/plugins/dropdown-header/index.html create mode 100644 dist/docs/plugins/dropdown-input/index.html create mode 100644 dist/docs/plugins/index.html create mode 100644 dist/docs/plugins/input-autogrow/index.html create mode 100644 dist/docs/plugins/no-active-items/index.html create mode 100644 dist/docs/plugins/no-backspace-delete/index.html create mode 100644 dist/docs/plugins/optgroup-columns/index.html create mode 100644 dist/docs/plugins/remove-button/index.html create mode 100644 dist/docs/plugins/restore-on-backspace/index.html create mode 100644 dist/docs/plugins/virtual_scroll/index.html create mode 100644 dist/docs/robots.txt create mode 100644 dist/docs/sitemap.xml create mode 100644 test/html/tab.html diff --git a/dist/cjs/tom-select.complete.js b/dist/cjs/tom-select.complete.js index d1b016aa..0480df71 100644 --- a/dist/cjs/tom-select.complete.js +++ b/dist/cjs/tom-select.complete.js @@ -1,5 +1,5 @@ /** -* Tom Select v1.7.3 +* Tom Select v1.7.4 * Licensed under the Apache License, Version 2.0 (the "License"); */ @@ -747,6 +747,195 @@ class Sifter { } +/** + * Return a dom element from either a dom query string, jQuery object, a dom element or html string + * https://stackoverflow.com/questions/494143/creating-a-new-dom-element-from-an-html-string-using-built-in-dom-methods-or-pro/35385518#35385518 + * + * param query should be {} + */ +function getDom(query) { + if (query.jquery) { + return query[0]; + } + + if (query instanceof HTMLElement) { + return query; + } + + if (query.indexOf('<') > -1) { + let div = document.createElement('div'); + div.innerHTML = query.trim(); // Never return a text node of whitespace as the result + + return div.firstChild; + } + + return document.querySelector(query); +} +function escapeQuery(query) { + return query.replace(/['"\\]/g, '\\$&'); +} +/** + * Dispatch an event + * + */ + +function triggerEvent(dom_el, event_name) { + var event = document.createEvent('HTMLEvents'); + event.initEvent(event_name, true, false); + dom_el.dispatchEvent(event); +} +/** + * Apply CSS rules to a dom element + * + */ + +function applyCSS(dom_el, css) { + Object.assign(dom_el.style, css); +} +/** + * Add css classes + * + */ + +function addClasses(elmts, ...classes) { + var norm_classes = classesArray(classes); + elmts = castAsArray(elmts); + elmts.map(el => { + norm_classes.map(cls => { + el.classList.add(cls); + }); + }); +} +/** + * Remove css classes + * + */ + +function removeClasses(elmts, ...classes) { + var norm_classes = classesArray(classes); + elmts = castAsArray(elmts); + elmts.map(el => { + norm_classes.map(cls => { + el.classList.remove(cls); + }); + }); +} +/** + * Return arguments + * + */ + +function classesArray(args) { + var classes = []; + + for (let _classes of args) { + if (typeof _classes === 'string') { + _classes = _classes.trim().split(/[\11\12\14\15\40]/); + } + + if (Array.isArray(_classes)) { + classes = classes.concat(_classes); + } + } + + return classes.filter(Boolean); +} +/** + * Create an array from arg if it's not already an array + * + */ + +function castAsArray(arg) { + if (!Array.isArray(arg)) { + arg = [arg]; + } + + return arg; +} +/** + * Get the closest node to the evt.target matching the selector + * Stops at wrapper + * + */ + +function parentMatch(target, selector, wrapper) { + if (wrapper && !wrapper.contains(target)) { + return; + } + + while (target && target.matches) { + if (target.matches(selector)) { + return target; + } + + target = target.parentNode; + } +} +/** + * Get the first or last item from an array + * + * > 0 - right (last) + * <= 0 - left (first) + * + */ + +function getTail(list, direction = 0) { + if (direction > 0) { + return list[list.length - 1]; + } + + return list[0]; +} +/** + * Return true if an object is empty + * + */ + +function isEmptyObject(obj) { + return Object.keys(obj).length === 0; +} +/** + * Get the index of an element amongst sibling nodes of the same type + * + */ + +function nodeIndex(el, amongst) { + if (!el) return -1; + amongst = amongst || el.nodeName; + var i = 0; + + while (el = el.previousElementSibling) { + if (el.matches(amongst)) { + i++; + } + } + + return i; +} +/** + * Set attributes of an element + * + */ + +function setAttr(el, attrs) { + for (const attr in attrs) { + let val = attrs[attr]; + + if (val == null) { + el.removeAttribute(attr); + } else { + el.setAttribute(attr, val); + } + } +} +/** + * Replace a node + */ + +function replaceNode(existing, replacement) { + if (existing.parentNode) existing.parentNode.replaceChild(replacement, existing); +} + /** * highlight v3 | MIT license | Johann Burkard * Highlights arbitrary terms in a node. @@ -754,58 +943,67 @@ class Sifter { * - Modified by Marshal 2011-6-24 (added regex) * - Modified by Brian Reavis 2012-8-27 (cleanup) */ -function highlight(element, regex) { +const highlight = (element, regex) => { if (regex === null) return; // convet string to regex if (typeof regex === 'string') { if (!regex.length) return; regex = new RegExp(regex, 'i'); - } + } // Wrap matching part of text node with highlighting , e.g. + // Soccer -> Soccer for regex = /soc/i - var highlight = function highlight(node) { - var skip = 0; // Wrap matching part of text node with highlighting , e.g. - // Soccer -> Soccer for regex = /soc/i - if (node.nodeType === 3) { - var pos = node.data.search(regex); - - if (pos >= 0 && node.data.length > 0) { - var match = node.data.match(regex); - var spannode = document.createElement('span'); - spannode.className = 'highlight'; - var middlebit = node.splitText(pos); - middlebit.splitText(match[0].length); - var middleclone = middlebit.cloneNode(true); - spannode.appendChild(middleclone); - middlebit.parentNode.replaceChild(spannode, middlebit); - skip = 1; - } - } // Recurse element node, looking for child text nodes to highlight, unless element - // is childless, + + + + + + + + + + + + + + + + + + + + + +
+
+ +

API

+ + +

Instances of Tom Select can be controlled programmatically via the methods described in this section.

+
var control = new TomSelect('#select');
control.addOption({value:'test'});
control.addItem('test');
+

Option Methods

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
MethodDescription
addOption(data)Adds an available option, or array of options. If it already exists, nothing will happen. Note: this does not refresh the options list dropdown (use refreshOptions() for that).
updateOption(value, data)Updates an option available for selection. If it is visible in the selected items or options dropdown, it will be re-rendered automatically.
removeOption(value)Removes the option identified by the given value.
clearOptions()Removes all unselected options from the control. To clear selection options, call clear() before calling clearOptions()
getOption(value)Retrieves the dom element for the option identified by the given value.
getAdjacent(dom_element, direction)Retrieves the dom element for the previous or next option, relative to the currently highlighted option. The direction argument should be 1 for "next" or -1 for "previous".
refreshOptions(triggerDropdown)Refreshes the list of available options shown in the autocomplete dropdown menu.
+

Item Methods

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
MethodDescription
clear(silent)Resets / clears all selected items from the control. If silent is truthy, no change event will be fired on the original input.
getItem(value)Returns the dom element of the item matching the given value.
addItem(value, silent)"Selects" an item. Adds it to the list at the current caret position. If silent is truthy, no change event will be fired on the original input.
removeItem(value, silent)Removes the selected item matching the provided value. If silent is truthy, no change event will be fired on the original input.
createItem(value, [triggerDropdown], [callback])Invokes the create method provided in the settings that should provide the data for the new item, given the user input. Once this completes, it will be added to the item list.
refreshItems()Re-renders the selected item lists.
+

Optgroup Methods

+ + + + + + + + + + + + + + + + + + + +
MethodDescription
addOptionGroup(id, data)Registers a new optgroup for options to be bucketed into. The id argument refers to a value of the property in option identified by the optgroupField setting.
removeOptionGroup(id)Removes a single option group.
clearOptionGroups()Removes all existing option groups.
+

Event Methods

+ + + + + + + + + + + + + + + + + + + + + + + +
MethodDescription
on(event, handler)Adds an event listener.
off(event, handler)Removes an event listener.
off(event)Removes all event listeners.
trigger(event, ...)Triggers event listeners.
+ + + + + + + + + + + + + + + + + + + + +
MethodDescription
open()Shows the autocomplete dropdown containing the available options.
close()Closes the autocomplete dropdown menu.
positionDropdown()Calculates and applies the appropriate position of the dropdown.
+

Other Methods

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
MethodDescription
destroy()Destroys the control and unbinds event listeners so that it can be garbage collected.
load(query)Initiates loading options from your remote data provider for the given query string. See the load() callback
focus()Brings the control into focus.
blur()Forces the control out of focus.
lock()Disables user input on the control (note: the control can still receive focus).
unlock()Re-enables user input on the control.
disable()Disables user input on the control completely. While disabled, it cannot receive focus.
enable()Enables the control so that it can respond to focus and user input.
getValue()Returns the value of the control. If multiple items can be selected with a "select" input tag (e.g. <select multiple>), this returns an array. Otherwise, returns a string (separated by delimiter if "multiple").
setValue(value, silent)Resets the selected items to the given value.
setCaret(index)Moves the caret to the specified position (index being the index in the list of selected items).
isFull()Returns whether or not the user can select more items.
clearCache(template)Clears the render cache. Takes an optional template argument (e.g. option , item) to clear only that cache.
updatePlaceholder()When the `settings.placeholder` value is changed, the new placeholder will be displayed.
setTextboxValue(str)Sets the value of the input field.
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
OptionDescriptionType
optionsOriginal search options.object
queryThe raw user input.string
tokensAn array containing parsed search tokens. A token is an object containing two properties: string and regex .array
totalThe total number of results.int
itemsA list of matched results. Each result is an object containing two properties: score and id .array
+ + + +
+
+ + + + + + + + + \ No newline at end of file diff --git a/dist/docs/docs/contribute/index.html b/dist/docs/docs/contribute/index.html new file mode 100644 index 00000000..7b68e5bf --- /dev/null +++ b/dist/docs/docs/contribute/index.html @@ -0,0 +1,131 @@ + + + + Contributing - Tom Select + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +

Contributing

+ + +

Pull Requests

+

If you're motivated to fix a bug or to develop a new feature, we'd love to see your code. +When submitting pull requests, please remember the following:

+
    +
  • Make sure tests pass
    Run npm test to make sure your changes don't break existing functionality
  • +
  • Do not make changes to files in /dist
    Limiting your edits to files in /src or /doc_src directories keeps the size of your pull request down and makes it easier for us to evaluate. We'll update the /dist folder after your pull request is approved.
  • +
  • Add tests
    In the best case scenario, you are also adding tests to back up your changes, but don't sweat it if you don't. We can discuss them at a later date.
  • +
+

Functional and Unit Tests

+

Please ensure all the tests pass:

+
$ npm test
+

Local Environment

+

Runing npm start on your repo will start a web server allowing you to view a local copy of tom-select.js.org.

+
$ npm start
+

Once started, you can run all the examples at http://localhost:8000/.

+ + + +
+
+ + + + + + + + + \ No newline at end of file diff --git a/dist/docs/docs/events/index.html b/dist/docs/docs/events/index.html new file mode 100644 index 00000000..fdfbd6d8 --- /dev/null +++ b/dist/docs/docs/events/index.html @@ -0,0 +1,221 @@ + + + + Events API - Tom Select + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +

Events API

+ + +

In the usage documentation, a few callbacks are listed that +allow you to listen for certain events. Callbacks aren't always ideal though; +specifically when you wish to have multiple handlers.

+

Tom Select instances have a basic event emitter interface that mimics jQuery, Backbone.js, et al:

+
var handler = function() { /* ... */ };
var select = new TomSelect('#input-id');
select.on('event_name', handler);
select.off('event_name');
select.off('event_name', handler);
+

List of Events

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
EventParamsDescription
"initialize"Invoked once the control is completely initialized.
"change"valueInvoked when the value of the control changes.
"focus"Invoked when the control gains focus.
"blur"Invoked when the control loses focus.
"item_add"value, itemInvoked when an item is selected.
"item_remove"value, $itemInvoked when an item is deselected.
"clear"Invoked when the control is manually cleared via the clear() method.
"option_add"value, dataInvoked when a new option is added to the available options list.
"option_remove"valueInvoked when an option is removed from the available options.
"option_clear"Invoked when all options are removed from the control.
"optgroup_add"id, dataInvoked when a new option is added to the available options list.
"optgroup_remove"idInvoked when an option group is removed.
"optgroup_clear"Invoked when all option groups are removed.
"dropdown_open"dropdownInvoked when the dropdown opens.
"dropdown_close"dropdownInvoked when the dropdown closes.
"type"strInvoked when the user types while filtering options.
"load"dataInvoked when new options have been loaded and added to the control (via the load option or load API method).
"destroy"Invoked right before the control is destroyed.
+ + + +
+
+ + + + + + + + + \ No newline at end of file diff --git a/dist/docs/docs/index.html b/dist/docs/docs/index.html new file mode 100644 index 00000000..2d48cc54 --- /dev/null +++ b/dist/docs/docs/index.html @@ -0,0 +1,556 @@ + + + + Usage Documentation - Tom Select + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +

Usage Documentation

+ + +
<script src="tom-select.complete.js"></script>
<link href="tom-select.bootstrap4.css" rel="stylesheet" />
<input id="select" />
<script>
var config = {};
new TomSelect('#select',config);
</script>
+

Glossary

+
    +
  • Config / configuration: settings passed to the object constructor
  • +
  • Settings: the current settings. Accessible with the settings property of the select object.
  • +
  • Options: the list of objects to display. +Each object must have a property with an unique value to identify the option; the property name is defined by the valueField setting. +Option objects must also have a property with the label to display (as tag, in the drop down, etc.); the property name is defined by the labelField setting. +The options can have other properties, ignored, unless referenced by other settings, like sortField or searchField.
  • +
  • Items: the list of selected options. Or more exactly, the list of the values of the selected options.
  • +
+

General Configuration

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SettingDescriptionTypeDefault
options +By default this is populated from the original <input> or <select> +element. +
options: [
{ value: "opt1", text: "Option 1" },
{ value: "opt2", text: "Option 2" },
]
+
array[]
itemsAn array of the initial selected values. By default this is populated from the original input element. +
items: ["opt1"]
+
array[]
createDetermines if the user is allowed to create new items that aren't in the + initial list of options. This setting can be any of the + following: true, false, or a function. +
create: true
+
create: function(input){
return {value:input,text:input}
}
+
create: function(input,callback){
callback({value:input,text:input});
}
+
boolean/functionfalse
createOnBlur + If true, when user exits the field (clicks outside of input), a new option is created and selected (if create setting is enabled). + booleanfalse
createFilter + Specifies a RegExp or a string containing a regular expression that the current search filter must match to be allowed to be created. May also be a predicate function that takes the filter text and returns whether it is allowed.RegExp|string|functionnull
delimiterThe string to separate items by. When typing an item in a multi-selection control allowing creation, then the delimiter, the item is added. If you paste delimiter-separated items in such control, the items are added at once. The delimiter is also used in the getValue API call on a text <input> tag to separate the multiple values.string','
highlightToggles match highlighting within the dropdown menu.booleantrue
persistIf false, items created by the user will not show up as available options once they are unselected.booleantrue
openOnFocusShow the dropdown immediately when the control receives focus.booleantrue
maxOptionsThe max number of options to display in the dropdown.int50
maxItemsThe max number of items the user can select. 1 makes the control mono-selection, null allows an unlimited number of items.intnull
hideSelectedIf true, the items that are currently selected will not be shown in the dropdown list of available options. This defaults to true when in a multi-selection control, to false otherwise.booleannull
closeAfterSelectIf true, the dropdown will be closed after a selection is made.booleanfalse
allowEmptyOptionIf true, any options with a "" value will be treated like normal. This defaults to false to accommodate the common <select> practice of having the first empty option to act as a placeholder.booleanfalse
loadThrottleThe number of milliseconds to wait before requesting options from the server or null. If null, throttling is disabled. Useful when loading options dynamically while the user types a search / filter expression.int300
loadingClassThe class name added to the wrapper element while awaiting the fulfillment of load requests.string'loading'
placeholderThe placeholder of the control. Defaults to input element's placeholder, unless this one is specified.stringundefined
hidePlaceholderIf true, the placeholder will be hidden when the control has one or more items (selected options) and is not focused. + This defaults to false when in a multi-selection control, and to true otherwise.booleannull
preloadIf true, the load function will be called upon control initialization (with an empty search). Alternatively it can be set to 'focus' to call the load function when control receives focus.boolean/stringfalse
dropdownParentThe element the dropdown menu is appended to. If null, the dropdown will be appended as a child of the control.stringnull
addPrecedenceIf true, the "Add..." option is the default selection in the dropdown.booleanfalse
selectOnTabIf true, the tab key will choose the currently selected item.booleanfalse
diacriticsEnable or disable international character support.booleantrue
controlInputSupply a custom <input> element<input> elementnull
duplicatesAllow selecting the same option more than once. hideSelected should also be set to false.booleanfalse
+

Data / Searching

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SettingDescriptionTypeDefault
optionsSee abovearray[]
optgroups + Option groups that options will be bucketed into. If your + element is a <select> with <optgroup>s this + property gets populated automatically. Make sure each object + in the array has a property named whatever + optgroupValueField is set to. + array[]
dataAttrThe <option> attribute from which to read JSON data about the option.stringnull
valueFieldThe name of the property to use as the value when an item is selected.string'value'
optgroupValueFieldThe name of the option group property that serves as its unique identifier.string'value'
labelFieldThe name of the property to render as an option / item label (not needed when custom rendering functions are defined).string'text'
optgroupLabelFieldThe name of the property to render as an option group label (not needed when custom rendering functions are defined).string'label'
optgroupFieldThe name of the property to group items by.string'optgroup'
disabledFieldThe name of the property to disabled option and optgroup.string'disabled'
sortField +

A single field or an array of fields to sort by. Each item in the array should be an object containing at least a field property. Optionally, direction can be set to 'asc' or 'desc'. The order of the array defines the sort precedence.

+

Unless present, a special `$score` field will be automatically added to the beginning of the sort list. This will make results sorted primarily by match quality (descending).

+

You can override the `$score` function. For more information, see the sifter documentation.

+
string|array'$order'
searchFieldAn array of property names to analyze when filtering options. +
searchField: ['text','text2']
+

Weights can be given to each field to improve search results

+
searchField: [{field:'text',weight:2},{field:'text2',weight:0.5}]
+
array['text']
searchConjunctionWhen searching for multiple terms (separated by space), this is the operator used. Can be 'and' or 'or' .string'and'
lockOptgroupOrderIf truthy, all optgroups will be displayed in the same order as they were added (by the `$order` property). Otherwise, it will order based on the score of the results in each.booleanfalse
copyClassesToDropdownCopy the original input classes to the dropdown element.booleantrue
+

Callbacks

+
new TomSelect('#select',{
onInitialize:function(){
// the onInitialize callback is invoked once the control is completely initialized.
}
});
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SettingDescription
load(query, callback)Invoked when new options should be loaded from the server. Called with the current query string and a callback function to call with the results when they are loaded (or nothing when an error arises). + Remote data examples
shouldLoad(query)Use the shouldLoad() callback to implement minimum input length or other input validation. + If the callback returns false, load() will not be called and the not_loading template will be added to the dropdown instead of the loading or no_results templates. +
score(search)Overrides the scoring function used to sort available options. + The provided function should return a function that returns a number greater than or equal to zero to represent the score of an item (the function's first argument). + If 0, the option is declared not a match. + See the remote data examples for a sample implementation.
onInitialize()Invoked once the control is completely initialized.
onFocus()Invoked when the control gains focus.
onBlur()Invoked when the control loses focus.
onChange(value)Invoked when the value of the control changes.
onItemAdd(value, $item)Invoked when an item is selected.
onItemRemove(value)Invoked when an item is deselected.
onClear()Invoked when the control is manually cleared via the clear() method.
onDelete(values, event)Invoked when the user attempts to delete the current selection. Selected items will not be deleted if the callback returns false.
onOptionAdd(value, data)Invoked when a new option is added to the available options list.
onOptionRemove(value)Invoked when an option is removed from the available options.
onDropdownOpen(dropdown)Invoked when the dropdown opens.
onDropdownClose(dropdown)Invoked when the dropdown closes.
onType(str)Invoked when the user types while filtering options.
onLoad(options, optgroup)Invoked when new options have been loaded and added to the control (via the load option or load API method).
+

Rendering

+

Custom rendering functions. Each function should accept two arguments: data and escape and return HTML (string or DOM element) with a single root element. The escape argument is a function that takes a string and escapes all special HTML characters. This is very important to use to prevent XSS vulnerabilities.

+
new TomSelect('#input',{
optionClass: 'option',
itemClass: 'item',
render:{
'option': function(data, escape) {
return '<div>' + escape(data[field_label]) + '</div>';
},
'item': function(data, escape) {
return '<div>' + escape(data[field_label]) + '</div>';
},
'option_create': function(data, escape) {
return '<div class="create">Add <strong>' + escape(data.input) + '</strong>&hellip;</div>';
},
'no_results':function(data,escape){
return '<div class="no-results">No results found for "'+escape(data.input)+'"</div>';
},
'not_loading':function(data,escape){
// no default content
},
'optgroup': function(data) {
let optgroup = document.createElement('div');
optgroup.className = 'optgroup';
optgroup.appendChild(data.options);
return optgroup;
},
'optgroup_header': function(data, escape) {
return '<div class="optgroup-header">' + escape(data[field_optgroup]) + '</div>';
},
'loading':function(data,escape){
return '<div class="spinner"></div>';
},
'dropdown':function(){
return '<div></div>';
}
}
});
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SettingDescriptionTypeDefault
render.optionAn option in the dropdown list of available options.functionnull
render.itemAn item the user has selected.functionnull
render.option_createThe "create new" option at the bottom of the dropdown. The data contains one property: input (which is what the user has typed).functionnull
render.optgroup_headerThe header of an option group.functionnull
render.optgroupThe wrapper for an optgroup. The html property in the data will be the raw html of the optgroup's header and options.functionnull
render.no_resultsDisplayed when no options are found matching a user's search. Can be set to null to disable displaying a "no results found" message.functionnull
render.loadingDisplayed when the load() method is called and hidden once results are returned.functionnull
render.dropdownWhere dropdown content will be displayed.functionnull
+ + + +
+
+ + + + + + + + + \ No newline at end of file diff --git a/dist/docs/docs/plugins/index.html b/dist/docs/docs/plugins/index.html new file mode 100644 index 00000000..b79455c2 --- /dev/null +++ b/dist/docs/docs/plugins/index.html @@ -0,0 +1,164 @@ + + + + Plugin API - Tom Select + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +

Plugin API

+ + +

Feature can be added to Tom Select without modifying via the microplugin interface. +This helps protect against code bloat, allows for leaner builds and allows for addons to be sanely isolated +The plugin system is lean, makes very few assumptions, and gives the developer complete control.

+

Plugin Examples

+

Plugin Usage

+

Without Options

+
new TomSelect('#select',{
plugins: ['plugin_a', 'plugin_b']
});
+

With Options

+
new TomSelect('#select',{
plugins: {
'plugin_a': { /* ... */ },
'plugin_b': { /* ... */ }
}
});
+

For a more detailed description of plugin option formats and how the plugin system works, check out the microplugin documentation.

+

Including Plugins

+

Plugins can be included in your projects in four different ways:

+

tom-select.complete.js

+

Using tom-select.complete.js in your projects will give you immediate access to all plugins

+

tom-select.popular.js

+

Save some bandwidth with a bundle that's about 4kb smaller. tom-select.popular.js includes dropdown_input, remove_button, no_backspace_delete, and restore_on_backspace plugins.

+

tom-select.base.js

+

If you don't need any plugins, or want to load plugins individually, use tom-select.base.js. +Add plugins to your project by including their js files: /js/plugins/remove_button.js, /js/plugins/dropdown_header.js, etc.

+

tom-select.custom.js

+

Use NPM to hand-pick plugins and create /build/js/tom-select.custom.js

+
# clone the repo
git clone https://github.com/orchidjs/tom-select.git
cd tom-select

# install dev dependencies
npm install

# create /build/js/tom-select.custom.js
npm run build -- --plugins=remove_button,restore_on_backspace
+

Creating Plugins

+

A few notes:

+
    +
  • All plugins live in their own folders in "src/plugins".
  • +
  • Plugin names should follow the format: /[a-z_]+$
  • +
  • JS source should live in a "plugin.js" file (required).
  • +
  • CSS should live in a "plugin.scss" file (optional). It will be bundled at build time.
  • +
  • Plugins are initialized right before the control is setup. +This means that if you want to listen for events on any of the control's +elements, you should override the setup() method (see "DOM Events").
  • +
+

Boilerplate

+
TomSelect.define('plugin_name', function(plugin_options) {
// options: plugin-specific options
// this: TomSelect instance
});
+

Adding Dependencies

+
TomSelect.define('plugin_name', function(plugin_options) {
this.require('another_plugin');
});
+

Method Hooks

+

Execute plugin code 'before' or 'after' existing methods

+
TomSelect.define('plugin_name', function(plugin_options) {
this.hook('after','setup',function(){
// .. additional setup
});
});
+

Overriding Methods

+

Use the 'instead' hook to override existing methods.

+

Note: If the method you're overriding returns a value, make sure the +overridden function returns a value as well.

+
TomSelect.define('plugin_name', function(plugin_options) {
var original_setup = this.setup;
this.hook('instead','setup',function(){
// .. custom setup
return original_setup.apply(this, arguments);
});
});
+

DOM Events

+

If you want to add event listeners to dom elements, add them after the setup() method.

+
TomSelect.define('plugin_name', function(plugin_options) {
this.hook('after','setup',function(){
this.control.addEventListener('click',function(evt){
alert('the control was clicked');
});
});
});
+ + + +
+
+ + + + + + + + + \ No newline at end of file diff --git a/dist/docs/docs/selectize.js/index.html b/dist/docs/docs/selectize.js/index.html new file mode 100644 index 00000000..b614faa4 --- /dev/null +++ b/dist/docs/docs/selectize.js/index.html @@ -0,0 +1,165 @@ + + + + selectize.js - Tom Select + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+ +
+ + +
+ + +
+
+ +

selectize.js

+ + +
+Tom Select was forked from selectize.js with four main objectives: modernizing the code base, decoupling from jQuery, expanding functionality, and addressing issue backlogs. +
+

Highlights as of v1.1.0

+

New

+
    +
  • support for external control input
  • +
  • dropdownParent other than 'body'
  • +
  • no_backspace_delete plugin
  • +
  • framework agnostic design (works without jQuery or any other JavaScript framework)
  • +
  • improved keyboard control of selected items
  • +
  • improved option cache to reduce dom manipulation during searches
  • +
  • animated scrolling with css instead of JavaScript
  • +
  • improved ctrl/shift/cmd key detection
  • +
  • autogrow functionality moved to input_autogrow plugin
  • +
  • integrated plugin hooks
  • +
+

Fixed

+
    +
  • #1363 Autofill disable possibility
  • +
  • #1447 Enhancement - dropdownParent
  • +
  • #1279 Adding ability to use load to init opt groups
  • +
  • #838 Add option to disable delete on backspace (no_backspace_delete plugin)
  • +
  • #239 Preserve custom HTML5 data attributes
  • +
  • #1128 Duplicated options in different optgroups doesn't render correctly
  • +
  • #129 Allow duplicate values in an input
  • +
  • #470 "No results found" message
  • +
  • #999 Don't clear the text box value on blur
  • +
  • #1104 Replace values in single-item selection
  • +
  • #1132 Can't enter 'ą' character in tags mode
  • +
  • #102 Listen to original select changes (via 'change_listener' plugin)
  • +
  • #905 Support for Bootstrap 4
  • +
+

Breaking Changes

+
    +
  • .ts-* css class names instead of .selectize-* (customizable with scss & js)
  • +
  • scss instead of less
  • +
  • dataAttr defaults to null instead of "data-data"
  • +
  • options must be appended to optgroup within custom optgroup template
  • +
  • removed support for older browsers including IE11
  • +
+

Development Environment

+ + + + +
+
+ + + + + + + + + \ No newline at end of file diff --git a/dist/docs/esm/plugins/change_listener/plugin.js b/dist/docs/esm/plugins/change_listener/plugin.js new file mode 100644 index 00000000..fd0e006a --- /dev/null +++ b/dist/docs/esm/plugins/change_listener/plugin.js @@ -0,0 +1,308 @@ +/** +* Tom Select v1.7.3 +* Licensed under the Apache License, Version 2.0 (the "License"); +*/ + +import TomSelect from '../../tom-select.js'; + +var defaults = { + options: [], + optgroups: [], + plugins: [], + delimiter: ',', + splitOn: null, + // regexp or string for splitting up values from a paste command + persist: true, + diacritics: true, + create: null, + createOnBlur: false, + createFilter: null, + highlight: true, + openOnFocus: true, + shouldOpen: null, + maxOptions: 50, + maxItems: null, + hideSelected: null, + duplicates: false, + addPrecedence: false, + selectOnTab: false, + preload: null, + allowEmptyOption: false, + closeAfterSelect: false, + loadThrottle: 300, + loadingClass: 'loading', + dataAttr: null, + //'data-data', + optgroupField: 'optgroup', + valueField: 'value', + labelField: 'text', + disabledField: 'disabled', + optgroupLabelField: 'label', + optgroupValueField: 'value', + lockOptgroupOrder: false, + sortField: '$order', + searchField: ['text'], + searchConjunction: 'and', + mode: null, + wrapperClass: 'ts-control', + inputClass: 'ts-input', + dropdownClass: 'ts-dropdown', + dropdownContentClass: 'ts-dropdown-content', + itemClass: 'item', + optionClass: 'option', + dropdownParent: null, + controlInput: null, + copyClassesToDropdown: true, + placeholder: null, + hidePlaceholder: null, + shouldLoad: function (query) { + return query.length > 0; + }, + + /* + load : null, // function(query, callback) { ... } + score : null, // function(search) { ... } + onInitialize : null, // function() { ... } + onChange : null, // function(value) { ... } + onItemAdd : null, // function(value, $item) { ... } + onItemRemove : null, // function(value) { ... } + onClear : null, // function() { ... } + onOptionAdd : null, // function(value, data) { ... } + onOptionRemove : null, // function(value) { ... } + onOptionClear : null, // function() { ... } + onOptionGroupAdd : null, // function(id, data) { ... } + onOptionGroupRemove : null, // function(id) { ... } + onOptionGroupClear : null, // function() { ... } + onDropdownOpen : null, // function(dropdown) { ... } + onDropdownClose : null, // function(dropdown) { ... } + onType : null, // function(str) { ... } + onDelete : null, // function(values) { ... } + */ + render: { + /* + item: null, + optgroup: null, + optgroup_header: null, + option: null, + option_create: null + */ + } +}; + +/** + * Converts a scalar to its best string representation + * for hash keys and HTML attribute values. + * + * Transformations: + * 'str' -> 'str' + * null -> '' + * undefined -> '' + * true -> '1' + * false -> '0' + * 0 -> '0' + * 1 -> '1' + * + */ +function hash_key(value) { + if (typeof value === 'undefined' || value === null) return null; + return get_hash(value); +} +function get_hash(value) { + if (typeof value === 'boolean') return value ? '1' : '0'; + return value + ''; +} +/** + * Prevent default + * + */ + +function addEvent(target, type, callback, options) { + target.addEventListener(type, callback, options); +} + +function getSettings(input, settings_user) { + var settings = Object.assign({}, defaults, settings_user); + var attr_data = settings.dataAttr; + var field_label = settings.labelField; + var field_value = settings.valueField; + var field_disabled = settings.disabledField; + var field_optgroup = settings.optgroupField; + var field_optgroup_label = settings.optgroupLabelField; + var field_optgroup_value = settings.optgroupValueField; + var tag_name = input.tagName.toLowerCase(); + var placeholder = input.getAttribute('placeholder') || input.getAttribute('data-placeholder'); + + if (!placeholder && !settings.allowEmptyOption) { + let option = input.querySelector('option[value=""]'); + + if (option) { + placeholder = option.textContent; + } + } + + var settings_element = { + placeholder: placeholder, + options: [], + optgroups: [], + items: [], + maxItems: null + }; + /** + * Initialize from a element. + * + */ + + + var init_textbox = () => { + var values, option; + var data_raw = input.getAttribute(attr_data); + + if (!data_raw) { + var value = input.value.trim() || ''; + if (!settings.allowEmptyOption && !value.length) return; + values = value.split(settings.delimiter); + + for (const _value of values) { + option = {}; + option[field_label] = _value; + option[field_value] = _value; + settings_element.options.push(option); + } + + settings_element.items = values; + } else { + settings_element.options = JSON.parse(data_raw); + + for (const opt of settings_element.options) { + settings_element.items.push(opt[field_value]); + } + } + }; + + if (tag_name === 'select') { + init_select(); + } else { + init_textbox(); + } + + return Object.assign({}, defaults, settings_element, settings_user); +} + +/** + * Plugin: "change_listener" (Tom Select) + * Copyright (c) contributors + * + * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this + * file except in compliance with the License. You may obtain a copy of the License at: + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software distributed under + * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF + * ANY KIND, either express or implied. See the License for the specific language + * governing permissions and limitations under the License. + * + */ +TomSelect.define('change_listener', function () { + var self = this; + var changed = false; + addEvent(self.input, 'change', () => { + // prevent infinite loops + if (changed) { + changed = false; + return; + } + + changed = true; + var settings = getSettings(self.input, {}); + self.setupOptions(settings.options, settings.optgroups); + self.setValue(settings.items); + }); +}); +//# sourceMappingURL=plugin.js.map diff --git a/dist/docs/esm/plugins/change_listener/plugin.js.map b/dist/docs/esm/plugins/change_listener/plugin.js.map new file mode 100644 index 00000000..28c6dd33 --- /dev/null +++ b/dist/docs/esm/plugins/change_listener/plugin.js.map @@ -0,0 +1 @@ +{"version":3,"file":"plugin.js","sources":["../../../../src/defaults.ts","../../../../src/utils.ts","../../../../src/getSettings.ts","../../../../src/plugins/change_listener/plugin.ts"],"sourcesContent":["\nexport default {\n\toptions: [],\n\toptgroups: [],\n\n\tplugins: [],\n\tdelimiter: ',',\n\tsplitOn: null, // regexp or string for splitting up values from a paste command\n\tpersist: true,\n\tdiacritics: true,\n\tcreate: null,\n\tcreateOnBlur: false,\n\tcreateFilter: null,\n\thighlight: true,\n\topenOnFocus: true,\n\tshouldOpen: null,\n\tmaxOptions: 50,\n\tmaxItems: null,\n\thideSelected: null,\n\tduplicates: false,\n\taddPrecedence: false,\n\tselectOnTab: false,\n\tpreload: null,\n\tallowEmptyOption: false,\n\tcloseAfterSelect: false,\n\n\tloadThrottle: 300,\n\tloadingClass: 'loading',\n\n\tdataAttr: null, //'data-data',\n\toptgroupField: 'optgroup',\n\tvalueField: 'value',\n\tlabelField: 'text',\n\tdisabledField: 'disabled',\n\toptgroupLabelField: 'label',\n\toptgroupValueField: 'value',\n\tlockOptgroupOrder: false,\n\n\tsortField: '$order',\n\tsearchField: ['text'],\n\tsearchConjunction: 'and',\n\n\tmode: null,\n\twrapperClass: 'ts-control',\n\tinputClass: 'ts-input',\n\tdropdownClass: 'ts-dropdown',\n\tdropdownContentClass: 'ts-dropdown-content',\n\titemClass: 'item',\n\toptionClass: 'option',\n\n\tdropdownParent: null,\n\tcontrolInput: null,\n\n\tcopyClassesToDropdown: true,\n\n\tplaceholder: null,\n\thidePlaceholder: null,\n\n\tshouldLoad: function(query:string):boolean{\n\t\treturn query.length > 0;\n\t},\n\n\t/*\n\tload : null, // function(query, callback) { ... }\n\tscore : null, // function(search) { ... }\n\tonInitialize : null, // function() { ... }\n\tonChange : null, // function(value) { ... }\n\tonItemAdd : null, // function(value, $item) { ... }\n\tonItemRemove : null, // function(value) { ... }\n\tonClear : null, // function() { ... }\n\tonOptionAdd : null, // function(value, data) { ... }\n\tonOptionRemove : null, // function(value) { ... }\n\tonOptionClear : null, // function() { ... }\n\tonOptionGroupAdd : null, // function(id, data) { ... }\n\tonOptionGroupRemove : null, // function(id) { ... }\n\tonOptionGroupClear : null, // function() { ... }\n\tonDropdownOpen : null, // function(dropdown) { ... }\n\tonDropdownClose : null, // function(dropdown) { ... }\n\tonType : null, // function(str) { ... }\n\tonDelete : null, // function(values) { ... }\n\t*/\n\n\trender: {\n\t\t/*\n\t\titem: null,\n\t\toptgroup: null,\n\t\toptgroup_header: null,\n\t\toption: null,\n\t\toption_create: null\n\t\t*/\n\t}\n};\n","\nimport TomSelect from './tom-select';\n\n/**\n * Converts a scalar to its best string representation\n * for hash keys and HTML attribute values.\n *\n * Transformations:\n * 'str' -> 'str'\n * null -> ''\n * undefined -> ''\n * true -> '1'\n * false -> '0'\n * 0 -> '0'\n * 1 -> '1'\n *\n */\nexport function hash_key(value:undefined|null|boolean|string):string|null {\n\tif (typeof value === 'undefined' || value === null) return null;\n\treturn get_hash(value);\n};\n\nexport function get_hash(value:boolean|string):string{\n\tif (typeof value === 'boolean') return value ? '1' : '0';\n\treturn value + '';\n};\n\n/**\n * Escapes a string for use within HTML.\n *\n */\nexport function escape_html(str:string):string {\n\treturn (str + '')\n\t\t.replace(/&/g, '&')\n\t\t.replace(//g, '>')\n\t\t.replace(/\"/g, '"');\n};\n\n\n/**\n * Debounce the user provided load function\n *\n */\nexport function loadDebounce(fn,delay:number){\n\tvar timeout: ReturnType;\n\treturn function(this:TomSelect, value:string,callback:() => void) {\n\t\tvar self = this;\n\n\t\tif( timeout ){\n\t\t\tself.loading = Math.max(self.loading - 1, 0);\n\t\t}\n\t\tclearTimeout(timeout);\n\t\ttimeout = setTimeout(function() {\n\t\t\tself.loadedSearches[value] = true;\n\t\t\tfn.call(self, value, callback);\n\n\t\t}, delay);\n\t};\n}\n\n\n/**\n * Debounce all fired events types listed in `types`\n * while executing the provided `fn`.\n *\n */\nexport function debounce_events( self:TomSelect, types:string[], fn:() => void ) {\n\tvar type;\n\tvar trigger = self.trigger;\n\tvar event_args:{ [key: string]: any } = {};\n\n\t// override trigger method\n\tself.trigger = function(){\n\t\tvar type = arguments[0];\n\t\tif (types.indexOf(type) !== -1) {\n\t\t\tevent_args[type] = arguments;\n\t\t} else {\n\t\t\treturn trigger.apply(self, arguments);\n\t\t}\n\t};\n\n\t// invoke provided function\n\tfn.apply(self, []);\n\tself.trigger = trigger;\n\n\t// trigger queued events\n\tfor (type in event_args) {\n\t\ttrigger.apply(self, event_args[type]);\n\t}\n};\n\n\n/**\n * Determines the current selection within a text input control.\n * Returns an object containing:\n * - start\n * - length\n *\n */\nexport function getSelection(input:HTMLInputElement):{ start: number; length: number } {\n\treturn {\n\t\tstart\t: input.selectionStart || 0,\n\t\tlength\t: (input.selectionEnd||0) - (input.selectionStart||0),\n\t};\n};\n\n\n/**\n * Prevent default\n *\n */\nexport function preventDefault(evt?:Event, stop:boolean=false):void{\n\tif( evt ){\n\t\tevt.preventDefault();\n\t\tif( stop ){\n\t\t\tevt.stopPropagation();\n\t\t}\n\t}\n}\n\n\n/**\n * Prevent default\n *\n */\nexport function addEvent(target:EventTarget, type:string, callback, options?:object):void{\n\ttarget.addEventListener(type,callback,options);\n}\n\n\n/**\n * Return true if the requested key is down\n * Will return false if more than one control character is pressed ( when [ctrl+shift+a] != [ctrl+a] )\n * The current evt may not always set ( eg calling advanceSelection() )\n *\n */\nexport function isKeyDown( key_name:keyof (KeyboardEvent|MouseEvent), evt?:KeyboardEvent|MouseEvent ){\n\n\tif( !evt ){\n\t\treturn false;\n\t}\n\n\tif( !evt[key_name] ){\n\t\treturn false;\n\t}\n\n\tvar count = (evt.altKey?1:0) + (evt.ctrlKey?1:0) + (evt.shiftKey?1:0) + (evt.metaKey?1:0);\n\n\tif( count === 1 ){\n\t\treturn true;\n\t}\n\n\treturn false;\n}\n\n\n/**\n * Get the id of an element\n * If the id attribute is not set, set the attribute with the given id\n *\n */\nexport function getId(el:Element,id:string){\n\tconst existing_id = el.getAttribute('id');\n\tif( existing_id ){\n\t\treturn existing_id;\n\t}\n\n\tel.setAttribute('id',id);\n\treturn id;\n}\n\n\n/**\n * Returns a string with backslashes added before characters that need to be escaped.\n */\nexport function addSlashes(str:string):string{\n\treturn str.replace(/[\\\\\"']/g, '\\\\$&');\n}\n","import defaults from './defaults.js';\nimport { hash_key } from './utils';\nimport { TomSettings } from './types/settings';\nimport { TomOption } from './types/index';\n\nexport default function getSettings( input:HTMLInputElement, settings_user:TomSettings):TomSettings{\n\tvar settings:TomSettings\t= Object.assign({}, defaults, settings_user);\n\n\tvar attr_data\t\t\t\t= settings.dataAttr;\n\tvar field_label\t\t\t\t= settings.labelField;\n\tvar field_value\t\t\t\t= settings.valueField;\n\tvar field_disabled\t\t\t= settings.disabledField;\n\tvar field_optgroup\t\t\t= settings.optgroupField;\n\tvar field_optgroup_label\t= settings.optgroupLabelField;\n\tvar field_optgroup_value\t= settings.optgroupValueField;\n\n\tvar tag_name\t\t\t\t= input.tagName.toLowerCase();\n\tvar placeholder\t\t\t\t= input.getAttribute('placeholder') || input.getAttribute('data-placeholder');\n\n\tif (!placeholder && !settings.allowEmptyOption) {\n\t\tlet option\t\t= input.querySelector('option[value=\"\"]');\n\t\tif( option ){\n\t\t\tplaceholder = option.textContent;\n\t\t}\n\n\t}\n\n\tvar settings_element:{\n\t\tplaceholder\t: null|string,\n\t\toptions\t\t: TomOption[],\n\t\toptgroups\t: TomOption[],\n\t\titems\t\t: string[],\n\t\tmaxItems\t: null|number,\n\t} = {\n\t\tplaceholder\t: placeholder,\n\t\toptions\t\t: [],\n\t\toptgroups\t: [],\n\t\titems\t\t: [],\n\t\tmaxItems\t: null,\n\t};\n\n\n\t/**\n\t * Initialize from a element.\n\t *\n\t */\n\tvar init_textbox = () => {\n\t\tvar values, option;\n\n\t\tvar data_raw = input.getAttribute(attr_data);\n\n\t\tif (!data_raw) {\n\t\t\tvar value = input.value.trim() || '';\n\t\t\tif (!settings.allowEmptyOption && !value.length) return;\n\t\t\tvalues = value.split(settings.delimiter);\n\n\t\t\tfor( const value of values ){\n\t\t\t\toption = {};\n\t\t\t\toption[field_label] = value;\n\t\t\t\toption[field_value] = value;\n\t\t\t\tsettings_element.options.push(option);\n\t\t\t}\n\t\t\tsettings_element.items = values;\n\t\t} else {\n\t\t\tsettings_element.options = JSON.parse(data_raw);\n\t\t\tfor( const opt of settings_element.options ){\n\t\t\t\tsettings_element.items.push(opt[field_value]);\n\t\t\t}\n\t\t}\n\t};\n\n\n\tif (tag_name === 'select') {\n\t\tinit_select();\n\t} else {\n\t\tinit_textbox();\n\t}\n\n\treturn Object.assign( {}, defaults, settings_element, settings_user) as TomSettings;\n};\n","/**\n * Plugin: \"change_listener\" (Tom Select)\n * Copyright (c) contributors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\"); you may not use this\n * file except in compliance with the License. You may obtain a copy of the License at:\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF\n * ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n *\n */\n\nimport TomSelect from '../../tom-select.js';\nimport getSettings from '../../getSettings.js';\nimport { TomSettings } from '../../types/settings';\nimport { addEvent } from '../../utils';\n\nTomSelect.define('change_listener',function(this:TomSelect){\n\tvar self\t\t= this;\n\tvar changed\t\t= false;\n\n\taddEvent(self.input,'change',()=>{\n\n\t\t// prevent infinite loops\n\t\tif( changed ){\n\t\t\tchanged = false;\n\t\t\treturn;\n\t\t}\n\n\t\tchanged\t\t\t= true;\n\t\tvar settings\t= getSettings( self.input, {} as TomSettings );\n\n\t\tself.setupOptions(settings.options,settings.optgroups);\n\t\tself.setValue(settings.items);\n\t});\n\n});\n"],"names":["options","optgroups","plugins","delimiter","splitOn","persist","diacritics","create","createOnBlur","createFilter","highlight","openOnFocus","shouldOpen","maxOptions","maxItems","hideSelected","duplicates","addPrecedence","selectOnTab","preload","allowEmptyOption","closeAfterSelect","loadThrottle","loadingClass","dataAttr","optgroupField","valueField","labelField","disabledField","optgroupLabelField","optgroupValueField","lockOptgroupOrder","sortField","searchField","searchConjunction","mode","wrapperClass","inputClass","dropdownClass","dropdownContentClass","itemClass","optionClass","dropdownParent","controlInput","copyClassesToDropdown","placeholder","hidePlaceholder","shouldLoad","query","length","render","hash_key","value","get_hash","addEvent","target","type","callback","addEventListener","getSettings","input","settings_user","settings","Object","assign","defaults","attr_data","field_label","field_value","field_disabled","field_optgroup","field_optgroup_label","field_optgroup_value","tag_name","tagName","toLowerCase","getAttribute","option","querySelector","textContent","settings_element","items","init_select","optionsMap","group_count","readData","el","data","dataset","json","JSON","parse","addOption","group","hasOwnProperty","arr","Array","isArray","push","option_data","disabled","$option","selected","addGroup","optgroup","id","optgroup_data","children","hasAttribute","child","init_textbox","values","data_raw","trim","split","opt","TomSelect","define","self","changed","setupOptions","setValue"],"mappings":"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"} \ No newline at end of file diff --git a/dist/docs/esm/plugins/checkbox_options/plugin.js b/dist/docs/esm/plugins/checkbox_options/plugin.js new file mode 100644 index 00000000..fac0c043 --- /dev/null +++ b/dist/docs/esm/plugins/checkbox_options/plugin.js @@ -0,0 +1,147 @@ +/** +* Tom Select v1.7.3 +* Licensed under the Apache License, Version 2.0 (the "License"); +*/ + +import TomSelect from '../../tom-select.js'; + +/** + * Converts a scalar to its best string representation + * for hash keys and HTML attribute values. + * + * Transformations: + * 'str' -> 'str' + * null -> '' + * undefined -> '' + * true -> '1' + * false -> '0' + * 0 -> '0' + * 1 -> '1' + * + */ +function hash_key(value) { + if (typeof value === 'undefined' || value === null) return null; + return get_hash(value); +} +function get_hash(value) { + if (typeof value === 'boolean') return value ? '1' : '0'; + return value + ''; +} +/** + * Prevent default + * + */ + +function preventDefault(evt, stop = false) { + if (evt) { + evt.preventDefault(); + + if (stop) { + evt.stopPropagation(); + } + } +} + +/** + * Return a dom element from either a dom query string, jQuery object, a dom element or html string + * https://stackoverflow.com/questions/494143/creating-a-new-dom-element-from-an-html-string-using-built-in-dom-methods-or-pro/35385518#35385518 + * + * param query should be {} + */ +function getDom(query) { + if (query.jquery) { + return query[0]; + } + + if (query instanceof HTMLElement) { + return query; + } + + if (query.indexOf('<') > -1) { + let div = document.createElement('div'); + div.innerHTML = query.trim(); // Never return a text node of whitespace as the result + + return div.firstChild; + } + + return document.querySelector(query); +} + +/** + * Plugin: "restore_on_backspace" (Tom Select) + * Copyright (c) contributors + * + * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this + * file except in compliance with the License. You may obtain a copy of the License at: + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software distributed under + * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF + * ANY KIND, either express or implied. See the License for the specific language + * governing permissions and limitations under the License. + * + */ +TomSelect.define('checkbox_options', function () { + var self = this; + var orig_onOptionSelect = self.onOptionSelect; + self.settings.hideSelected = false; // update the checkbox for an option + + var UpdateCheckbox = function UpdateCheckbox(option) { + setTimeout(() => { + var checkbox = option.querySelector('input'); + + if (option.classList.contains('selected')) { + checkbox.checked = true; + } else { + checkbox.checked = false; + } + }, 1); + }; // add checkbox to option template + + + self.hook('after', 'setupTemplates', () => { + var orig_render_option = self.settings.render.option; + + self.settings.render.option = function (data) { + var rendered = getDom(orig_render_option.apply(self, arguments)); + var checkbox = document.createElement('input'); + checkbox.addEventListener('click', function (evt) { + preventDefault(evt); + }); + checkbox.type = 'checkbox'; + const hashed = hash_key(data[self.settings.valueField]); + + if (hashed && self.items.indexOf(hashed) > -1) { + checkbox.checked = true; + } + + rendered.prepend(checkbox); + return rendered; + }; + }); // uncheck when item removed + + self.on('item_remove', value => { + var option = self.getOption(value); + + if (option) { + // if dropdown hasn't been opened yet, the option won't exist + option.classList.remove('selected'); // selected class won't be removed yet + + UpdateCheckbox(option); + } + }); // remove items when selected option is clicked + + self.hook('instead', 'onOptionSelect', function (evt, option) { + if (option.classList.contains('selected')) { + option.classList.remove('selected'); + self.removeItem(option.dataset.value); + self.refreshOptions(); + preventDefault(evt, true); + return; + } + + orig_onOptionSelect.apply(self, arguments); + UpdateCheckbox(option); + }); +}); +//# sourceMappingURL=plugin.js.map diff --git a/dist/docs/esm/plugins/checkbox_options/plugin.js.map b/dist/docs/esm/plugins/checkbox_options/plugin.js.map new file mode 100644 index 00000000..34263a21 --- /dev/null +++ b/dist/docs/esm/plugins/checkbox_options/plugin.js.map @@ -0,0 +1 @@ +{"version":3,"file":"plugin.js","sources":["../../../../src/utils.ts","../../../../src/vanilla.ts","../../../../src/plugins/checkbox_options/plugin.ts"],"sourcesContent":["\nimport TomSelect from './tom-select';\n\n/**\n * Converts a scalar to its best string representation\n * for hash keys and HTML attribute values.\n *\n * Transformations:\n * 'str' -> 'str'\n * null -> ''\n * undefined -> ''\n * true -> '1'\n * false -> '0'\n * 0 -> '0'\n * 1 -> '1'\n *\n */\nexport function hash_key(value:undefined|null|boolean|string):string|null {\n\tif (typeof value === 'undefined' || value === null) return null;\n\treturn get_hash(value);\n};\n\nexport function get_hash(value:boolean|string):string{\n\tif (typeof value === 'boolean') return value ? '1' : '0';\n\treturn value + '';\n};\n\n/**\n * Escapes a string for use within HTML.\n *\n */\nexport function escape_html(str:string):string {\n\treturn (str + '')\n\t\t.replace(/&/g, '&')\n\t\t.replace(//g, '>')\n\t\t.replace(/\"/g, '"');\n};\n\n\n/**\n * Debounce the user provided load function\n *\n */\nexport function loadDebounce(fn,delay:number){\n\tvar timeout: ReturnType;\n\treturn function(this:TomSelect, value:string,callback:() => void) {\n\t\tvar self = this;\n\n\t\tif( timeout ){\n\t\t\tself.loading = Math.max(self.loading - 1, 0);\n\t\t}\n\t\tclearTimeout(timeout);\n\t\ttimeout = setTimeout(function() {\n\t\t\tself.loadedSearches[value] = true;\n\t\t\tfn.call(self, value, callback);\n\n\t\t}, delay);\n\t};\n}\n\n\n/**\n * Debounce all fired events types listed in `types`\n * while executing the provided `fn`.\n *\n */\nexport function debounce_events( self:TomSelect, types:string[], fn:() => void ) {\n\tvar type;\n\tvar trigger = self.trigger;\n\tvar event_args:{ [key: string]: any } = {};\n\n\t// override trigger method\n\tself.trigger = function(){\n\t\tvar type = arguments[0];\n\t\tif (types.indexOf(type) !== -1) {\n\t\t\tevent_args[type] = arguments;\n\t\t} else {\n\t\t\treturn trigger.apply(self, arguments);\n\t\t}\n\t};\n\n\t// invoke provided function\n\tfn.apply(self, []);\n\tself.trigger = trigger;\n\n\t// trigger queued events\n\tfor (type in event_args) {\n\t\ttrigger.apply(self, event_args[type]);\n\t}\n};\n\n\n/**\n * Determines the current selection within a text input control.\n * Returns an object containing:\n * - start\n * - length\n *\n */\nexport function getSelection(input:HTMLInputElement):{ start: number; length: number } {\n\treturn {\n\t\tstart\t: input.selectionStart || 0,\n\t\tlength\t: (input.selectionEnd||0) - (input.selectionStart||0),\n\t};\n};\n\n\n/**\n * Prevent default\n *\n */\nexport function preventDefault(evt?:Event, stop:boolean=false):void{\n\tif( evt ){\n\t\tevt.preventDefault();\n\t\tif( stop ){\n\t\t\tevt.stopPropagation();\n\t\t}\n\t}\n}\n\n\n/**\n * Prevent default\n *\n */\nexport function addEvent(target:EventTarget, type:string, callback, options?:object):void{\n\ttarget.addEventListener(type,callback,options);\n}\n\n\n/**\n * Return true if the requested key is down\n * Will return false if more than one control character is pressed ( when [ctrl+shift+a] != [ctrl+a] )\n * The current evt may not always set ( eg calling advanceSelection() )\n *\n */\nexport function isKeyDown( key_name:keyof (KeyboardEvent|MouseEvent), evt?:KeyboardEvent|MouseEvent ){\n\n\tif( !evt ){\n\t\treturn false;\n\t}\n\n\tif( !evt[key_name] ){\n\t\treturn false;\n\t}\n\n\tvar count = (evt.altKey?1:0) + (evt.ctrlKey?1:0) + (evt.shiftKey?1:0) + (evt.metaKey?1:0);\n\n\tif( count === 1 ){\n\t\treturn true;\n\t}\n\n\treturn false;\n}\n\n\n/**\n * Get the id of an element\n * If the id attribute is not set, set the attribute with the given id\n *\n */\nexport function getId(el:Element,id:string){\n\tconst existing_id = el.getAttribute('id');\n\tif( existing_id ){\n\t\treturn existing_id;\n\t}\n\n\tel.setAttribute('id',id);\n\treturn id;\n}\n\n\n/**\n * Returns a string with backslashes added before characters that need to be escaped.\n */\nexport function addSlashes(str:string):string{\n\treturn str.replace(/[\\\\\"']/g, '\\\\$&');\n}\n","\n/**\n * Return a dom element from either a dom query string, jQuery object, a dom element or html string\n * https://stackoverflow.com/questions/494143/creating-a-new-dom-element-from-an-html-string-using-built-in-dom-methods-or-pro/35385518#35385518\n *\n * param query should be {}\n */\nexport function getDom( query:any ):HTMLElement{\n\n\tif( query.jquery ){\n\t\treturn query[0];\n\t}\n\n\tif( query instanceof HTMLElement ){\n\t\treturn query;\n\t}\n\n\tif( query.indexOf('<') > -1 ){\n\t\tlet div = document.createElement('div');\n\t\tdiv.innerHTML = query.trim(); // Never return a text node of whitespace as the result\n\t\treturn div.firstChild as HTMLElement;\n\t}\n\n\treturn document.querySelector(query);\n};\n\nexport function escapeQuery(query:string):string{\n\treturn query.replace(/['\"\\\\]/g, '\\\\$&');\n}\n\n/**\n * Dispatch an event\n *\n */\nexport function triggerEvent( dom_el:HTMLElement, event_name:string ):void{\n\tvar event = document.createEvent('HTMLEvents');\n\tevent.initEvent(event_name, true, false);\n\tdom_el.dispatchEvent(event)\n};\n\n/**\n * Apply CSS rules to a dom element\n *\n */\nexport function applyCSS( dom_el:HTMLElement, css:{ [key: string]: string|number }):void{\n\tObject.assign(dom_el.style, css);\n}\n\n\n/**\n * Add css classes\n *\n */\nexport function addClasses( elmts:HTMLElement|HTMLElement[], ...classes:string[]|string[][] ){\n\n\tvar norm_classes \t= classesArray(classes);\n\telmts\t\t\t\t= castAsArray(elmts);\n\n\telmts.map( el => {\n\t\tnorm_classes.map( cls => {\n\t\t\tel.classList.add( cls );\n\t\t});\n\t});\n}\n\n/**\n * Remove css classes\n *\n */\n export function removeClasses( elmts:HTMLElement|HTMLElement[], ...classes:string[]|string[][] ){\n\n \tvar norm_classes \t= classesArray(classes);\n\telmts\t\t\t\t= castAsArray(elmts);\n\n\telmts.map( el => {\n\t\tnorm_classes.map(cls => {\n\t \t\tel.classList.remove( cls );\n\t\t});\n \t});\n }\n\n\n/**\n * Return arguments\n *\n */\nexport function classesArray(args:string[]|string[][]):string[]{\n\tvar classes:string[] = [];\n\tfor( let _classes of args ){\n\t\tif( typeof _classes === 'string' ){\n\t\t\t_classes = _classes.trim().split(/[\\11\\12\\14\\15\\40]/);\n\t\t}\n\t\tif( Array.isArray(_classes) ){\n\t\t\tclasses = classes.concat(_classes);\n\t\t}\n\t}\n\n\treturn classes.filter(Boolean);\n}\n\n\n/**\n * Create an array from arg if it's not already an array\n *\n */\nexport function castAsArray(arg:any):Array{\n\tif( !Array.isArray(arg) ){\n \t\targ = [arg];\n \t}\n\treturn arg;\n}\n\n\n/**\n * Get the closest node to the evt.target matching the selector\n * Stops at wrapper\n *\n */\nexport function parentMatch( target:null|HTMLElement, selector:string, wrapper?:HTMLElement ):HTMLElement|void{\n\n\tif( wrapper && !wrapper.contains(target) ){\n\t\treturn;\n\t}\n\n\twhile( target && target.matches ){\n\n\t\tif( target.matches(selector) ){\n\t\t\treturn target;\n\t\t}\n\n\t\ttarget = target.parentNode as HTMLElement;\n\t}\n}\n\n\n/**\n * Get the first or last item from an array\n *\n * > 0 - right (last)\n * <= 0 - left (first)\n *\n */\nexport function getTail( list:Array|NodeList, direction:number=0 ):any{\n\n\tif( direction > 0 ){\n\t\treturn list[list.length-1];\n\t}\n\n\treturn list[0];\n}\n\n/**\n * Return true if an object is empty\n *\n */\nexport function isEmptyObject(obj:object):boolean{\n\treturn (Object.keys(obj).length === 0);\n}\n\n\n/**\n * Get the index of an element amongst sibling nodes of the same type\n *\n */\nexport function nodeIndex( el:null|Element, amongst?:string ):number{\n\tif (!el) return -1;\n\n\tamongst = amongst || el.nodeName;\n\n\tvar i = 0;\n\twhile( el = el.previousElementSibling ){\n\n\t\tif( el.matches(amongst) ){\n\t\t\ti++;\n\t\t}\n\t}\n\treturn i;\n}\n\n\n/**\n * Set attributes of an element\n *\n */\nexport function setAttr(el:Element,attrs:{ [key: string]: null|string }){\n\tfor( const attr in attrs ){\n\t\tlet val = attrs[attr];\n\t\tif( val == null ){\n\t\t\tel.removeAttribute(attr);\n\t\t}else{\n\t\t\tel.setAttribute(attr, val);\n\t\t}\n\t}\n}\n\n\n/**\n * Replace a node\n */\nexport function replaceNode( existing:Element, replacement:Element ){\n\tif( existing.parentNode ) existing.parentNode.replaceChild(replacement, existing);\n}\n","/**\n * Plugin: \"restore_on_backspace\" (Tom Select)\n * Copyright (c) contributors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\"); you may not use this\n * file except in compliance with the License. You may obtain a copy of the License at:\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF\n * ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n *\n */\nimport TomSelect from '../../tom-select.js';\nimport { preventDefault, hash_key } from '../../utils';\nimport { getDom } from '../../vanilla';\n\n\nTomSelect.define('checkbox_options',function(this:TomSelect) {\n\tvar self = this;\n\tvar orig_onOptionSelect = self.onOptionSelect;\n\n\tself.settings.hideSelected = false;\n\n\n\t// update the checkbox for an option\n\tvar UpdateCheckbox = function(option){\n\t\tsetTimeout(()=>{\n\t\t\tvar checkbox = option.querySelector('input');\n\t\t\tif( option.classList.contains('selected') ){\n\t\t\t\tcheckbox.checked = true;\n\t\t\t}else{\n\t\t\t\tcheckbox.checked = false;\n\t\t\t}\n\t\t},1);\n\t};\n\n\t// add checkbox to option template\n\tself.hook('after','setupTemplates',() => {\n\n\t\tvar orig_render_option = self.settings.render.option;\n\n\t\tself.settings.render.option = function(data){\n\t\t\tvar rendered = getDom(orig_render_option.apply(self, arguments));\n\t\t\tvar checkbox = document.createElement('input');\n\t\t\tcheckbox.addEventListener('click',function(evt){\n\t\t\t\tpreventDefault(evt);\n\t\t\t});\n\n\t\t\tcheckbox.type = 'checkbox';\n\t\t\tconst hashed = hash_key(data[self.settings.valueField]);\n\n\n\t\t\tif( hashed && self.items.indexOf(hashed) > -1 ){\n\t\t\t\tcheckbox.checked = true;\n\t\t\t}\n\n\t\t\trendered.prepend(checkbox);\n\t\t\treturn rendered;\n\t\t};\n\t});\n\n\t// uncheck when item removed\n\tself.on('item_remove',(value) => {\n\t\tvar option = self.getOption(value);\n\n\t\tif( option ){ // if dropdown hasn't been opened yet, the option won't exist\n\t\t\toption.classList.remove('selected'); // selected class won't be removed yet\n\t\t\tUpdateCheckbox(option);\n\t\t}\n\t});\n\n\n\t// remove items when selected option is clicked\n\tself.hook('instead','onOptionSelect',function( evt:KeyboardEvent, option:HTMLElement ){\n\n\t\tif( option.classList.contains('selected') ){\n\t\t\toption.classList.remove('selected')\n\t\t\tself.removeItem(option.dataset.value);\n\t\t\tself.refreshOptions();\n\t\t\tpreventDefault(evt,true);\n\t\t\treturn;\n }\n\n\t\torig_onOptionSelect.apply(self, arguments);\n\n\t\tUpdateCheckbox(option);\n\t});\n\n\n});\n"],"names":["hash_key","value","get_hash","preventDefault","evt","stop","stopPropagation","getDom","query","jquery","HTMLElement","indexOf","div","document","createElement","innerHTML","trim","firstChild","querySelector","TomSelect","define","self","orig_onOptionSelect","onOptionSelect","settings","hideSelected","UpdateCheckbox","option","setTimeout","checkbox","classList","contains","checked","hook","orig_render_option","render","data","rendered","apply","arguments","addEventListener","type","hashed","valueField","items","prepend","on","getOption","remove","removeItem","dataset","refreshOptions"],"mappings":"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"} \ No newline at end of file diff --git a/dist/docs/esm/plugins/clear_button/plugin.js b/dist/docs/esm/plugins/clear_button/plugin.js new file mode 100644 index 00000000..c9b759bf --- /dev/null +++ b/dist/docs/esm/plugins/clear_button/plugin.js @@ -0,0 +1,66 @@ +/** +* Tom Select v1.7.3 +* Licensed under the Apache License, Version 2.0 (the "License"); +*/ + +import TomSelect from '../../tom-select.js'; + +/** + * Return a dom element from either a dom query string, jQuery object, a dom element or html string + * https://stackoverflow.com/questions/494143/creating-a-new-dom-element-from-an-html-string-using-built-in-dom-methods-or-pro/35385518#35385518 + * + * param query should be {} + */ +function getDom(query) { + if (query.jquery) { + return query[0]; + } + + if (query instanceof HTMLElement) { + return query; + } + + if (query.indexOf('<') > -1) { + let div = document.createElement('div'); + div.innerHTML = query.trim(); // Never return a text node of whitespace as the result + + return div.firstChild; + } + + return document.querySelector(query); +} + +/** + * Plugin: "dropdown_header" (Tom Select) + * Copyright (c) contributors + * + * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this + * file except in compliance with the License. You may obtain a copy of the License at: + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software distributed under + * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF + * ANY KIND, either express or implied. See the License for the specific language + * governing permissions and limitations under the License. + * + */ +TomSelect.define('clear_button', function (options) { + var self = this; + options = Object.assign({ + className: 'clear-button', + title: 'Clear All', + html: data => { + return `
×
`; + } + }, options); + self.hook('after', 'setup', () => { + var button = getDom(options.html(options)); + button.addEventListener('click', evt => { + self.clear(); + evt.preventDefault(); + evt.stopPropagation(); + }); + self.control.appendChild(button); + }); +}); +//# sourceMappingURL=plugin.js.map diff --git a/dist/docs/esm/plugins/clear_button/plugin.js.map b/dist/docs/esm/plugins/clear_button/plugin.js.map new file mode 100644 index 00000000..7ed571a4 --- /dev/null +++ b/dist/docs/esm/plugins/clear_button/plugin.js.map @@ -0,0 +1 @@ +{"version":3,"file":"plugin.js","sources":["../../../../src/vanilla.ts","../../../../src/plugins/clear_button/plugin.ts"],"sourcesContent":["\n/**\n * Return a dom element from either a dom query string, jQuery object, a dom element or html string\n * https://stackoverflow.com/questions/494143/creating-a-new-dom-element-from-an-html-string-using-built-in-dom-methods-or-pro/35385518#35385518\n *\n * param query should be {}\n */\nexport function getDom( query:any ):HTMLElement{\n\n\tif( query.jquery ){\n\t\treturn query[0];\n\t}\n\n\tif( query instanceof HTMLElement ){\n\t\treturn query;\n\t}\n\n\tif( query.indexOf('<') > -1 ){\n\t\tlet div = document.createElement('div');\n\t\tdiv.innerHTML = query.trim(); // Never return a text node of whitespace as the result\n\t\treturn div.firstChild as HTMLElement;\n\t}\n\n\treturn document.querySelector(query);\n};\n\nexport function escapeQuery(query:string):string{\n\treturn query.replace(/['\"\\\\]/g, '\\\\$&');\n}\n\n/**\n * Dispatch an event\n *\n */\nexport function triggerEvent( dom_el:HTMLElement, event_name:string ):void{\n\tvar event = document.createEvent('HTMLEvents');\n\tevent.initEvent(event_name, true, false);\n\tdom_el.dispatchEvent(event)\n};\n\n/**\n * Apply CSS rules to a dom element\n *\n */\nexport function applyCSS( dom_el:HTMLElement, css:{ [key: string]: string|number }):void{\n\tObject.assign(dom_el.style, css);\n}\n\n\n/**\n * Add css classes\n *\n */\nexport function addClasses( elmts:HTMLElement|HTMLElement[], ...classes:string[]|string[][] ){\n\n\tvar norm_classes \t= classesArray(classes);\n\telmts\t\t\t\t= castAsArray(elmts);\n\n\telmts.map( el => {\n\t\tnorm_classes.map( cls => {\n\t\t\tel.classList.add( cls );\n\t\t});\n\t});\n}\n\n/**\n * Remove css classes\n *\n */\n export function removeClasses( elmts:HTMLElement|HTMLElement[], ...classes:string[]|string[][] ){\n\n \tvar norm_classes \t= classesArray(classes);\n\telmts\t\t\t\t= castAsArray(elmts);\n\n\telmts.map( el => {\n\t\tnorm_classes.map(cls => {\n\t \t\tel.classList.remove( cls );\n\t\t});\n \t});\n }\n\n\n/**\n * Return arguments\n *\n */\nexport function classesArray(args:string[]|string[][]):string[]{\n\tvar classes:string[] = [];\n\tfor( let _classes of args ){\n\t\tif( typeof _classes === 'string' ){\n\t\t\t_classes = _classes.trim().split(/[\\11\\12\\14\\15\\40]/);\n\t\t}\n\t\tif( Array.isArray(_classes) ){\n\t\t\tclasses = classes.concat(_classes);\n\t\t}\n\t}\n\n\treturn classes.filter(Boolean);\n}\n\n\n/**\n * Create an array from arg if it's not already an array\n *\n */\nexport function castAsArray(arg:any):Array{\n\tif( !Array.isArray(arg) ){\n \t\targ = [arg];\n \t}\n\treturn arg;\n}\n\n\n/**\n * Get the closest node to the evt.target matching the selector\n * Stops at wrapper\n *\n */\nexport function parentMatch( target:null|HTMLElement, selector:string, wrapper?:HTMLElement ):HTMLElement|void{\n\n\tif( wrapper && !wrapper.contains(target) ){\n\t\treturn;\n\t}\n\n\twhile( target && target.matches ){\n\n\t\tif( target.matches(selector) ){\n\t\t\treturn target;\n\t\t}\n\n\t\ttarget = target.parentNode as HTMLElement;\n\t}\n}\n\n\n/**\n * Get the first or last item from an array\n *\n * > 0 - right (last)\n * <= 0 - left (first)\n *\n */\nexport function getTail( list:Array|NodeList, direction:number=0 ):any{\n\n\tif( direction > 0 ){\n\t\treturn list[list.length-1];\n\t}\n\n\treturn list[0];\n}\n\n/**\n * Return true if an object is empty\n *\n */\nexport function isEmptyObject(obj:object):boolean{\n\treturn (Object.keys(obj).length === 0);\n}\n\n\n/**\n * Get the index of an element amongst sibling nodes of the same type\n *\n */\nexport function nodeIndex( el:null|Element, amongst?:string ):number{\n\tif (!el) return -1;\n\n\tamongst = amongst || el.nodeName;\n\n\tvar i = 0;\n\twhile( el = el.previousElementSibling ){\n\n\t\tif( el.matches(amongst) ){\n\t\t\ti++;\n\t\t}\n\t}\n\treturn i;\n}\n\n\n/**\n * Set attributes of an element\n *\n */\nexport function setAttr(el:Element,attrs:{ [key: string]: null|string }){\n\tfor( const attr in attrs ){\n\t\tlet val = attrs[attr];\n\t\tif( val == null ){\n\t\t\tel.removeAttribute(attr);\n\t\t}else{\n\t\t\tel.setAttribute(attr, val);\n\t\t}\n\t}\n}\n\n\n/**\n * Replace a node\n */\nexport function replaceNode( existing:Element, replacement:Element ){\n\tif( existing.parentNode ) existing.parentNode.replaceChild(replacement, existing);\n}\n","/**\n * Plugin: \"dropdown_header\" (Tom Select)\n * Copyright (c) contributors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\"); you may not use this\n * file except in compliance with the License. You may obtain a copy of the License at:\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF\n * ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n *\n */\n\nimport TomSelect from '../../tom-select.js';\nimport { getDom } from '../../vanilla';\n\n\nTomSelect.define('clear_button',function(this:TomSelect, options) {\n\tvar self = this;\n\n\toptions = Object.assign({\n\t\tclassName: 'clear-button',\n\t\ttitle: 'Clear All',\n\t\thtml: (data) => {\n\t\t\treturn `
×
`;\n\t\t}\n\t}, options);\n\n\tself.hook('after','setup',()=>{\n\t\tvar button = getDom(options.html(options));\n\t\tbutton.addEventListener('click',(evt)=>{\n\t\t\tself.clear();\n\t\t\tevt.preventDefault();\n\t\t\tevt.stopPropagation();\n\t\t});\n\t\tself.control.appendChild(button);\n\t});\n\n});\n"],"names":["getDom","query","jquery","HTMLElement","indexOf","div","document","createElement","innerHTML","trim","firstChild","querySelector","TomSelect","define","options","self","Object","assign","className","title","html","data","hook","button","addEventListener","evt","clear","preventDefault","stopPropagation","control","appendChild"],"mappings":";;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,MAAT,CAAiBC,KAAjB,EAAwC;AAE9C,MAAIA,KAAK,CAACC,MAAV,EAAkB;AACjB,WAAOD,KAAK,CAAC,CAAD,CAAZ;AACA;;AAED,MAAIA,KAAK,YAAYE,WAArB,EAAkC;AACjC,WAAOF,KAAP;AACA;;AAED,MAAIA,KAAK,CAACG,OAAN,CAAc,GAAd,IAAqB,CAAC,CAA1B,EAA6B;AAC5B,QAAIC,GAAG,GAAGC,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAAV;AACAF,IAAAA,GAAG,CAACG,SAAJ,GAAgBP,KAAK,CAACQ,IAAN,EAAhB,CAF4B;;AAG5B,WAAOJ,GAAG,CAACK,UAAX;AACA;;AAED,SAAOJ,QAAQ,CAACK,aAAT,CAAuBV,KAAvB,CAAP;AACA;;ACxBD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMAW,SAAS,CAACC,MAAV,CAAiB,cAAjB,EAAgC,UAAyBC,OAAzB,EAAkC;AACjE,MAAIC,IAAI,GAAG,IAAX;AAEAD,EAAAA,OAAO,GAAGE,MAAM,CAACC,MAAP,CAAc;AACvBC,IAAAA,SAAS,EAAE,cADY;AAEvBC,IAAAA,KAAK,EAAE,WAFgB;AAGvBC,IAAAA,IAAI,EAAGC,IAAD,IAAU;AACf,aAAQ,eAAcA,IAAI,CAACH,SAAU,YAAWG,IAAI,CAACF,KAAM,iBAA3D;AACA;AALsB,GAAd,EAMPL,OANO,CAAV;AAQAC,EAAAA,IAAI,CAACO,IAAL,CAAU,OAAV,EAAkB,OAAlB,EAA0B,MAAI;AAC7B,QAAIC,MAAM,GAAGvB,MAAM,CAACc,OAAO,CAACM,IAAR,CAAaN,OAAb,CAAD,CAAnB;AACAS,IAAAA,MAAM,CAACC,gBAAP,CAAwB,OAAxB,EAAiCC,GAAD,IAAO;AACtCV,MAAAA,IAAI,CAACW,KAAL;AACAD,MAAAA,GAAG,CAACE,cAAJ;AACAF,MAAAA,GAAG,CAACG,eAAJ;AACA,KAJD;AAKAb,IAAAA,IAAI,CAACc,OAAL,CAAaC,WAAb,CAAyBP,MAAzB;AACA,GARD;AAUA,CArBD"} \ No newline at end of file diff --git a/dist/docs/esm/plugins/drag_drop/plugin.js b/dist/docs/esm/plugins/drag_drop/plugin.js new file mode 100644 index 00000000..c7a19e58 --- /dev/null +++ b/dist/docs/esm/plugins/drag_drop/plugin.js @@ -0,0 +1,62 @@ +/** +* Tom Select v1.7.3 +* Licensed under the Apache License, Version 2.0 (the "License"); +*/ + +import TomSelect from '../../tom-select.js'; + +/** + * Plugin: "drag_drop" (Tom Select) + * Copyright (c) contributors + * + * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this + * file except in compliance with the License. You may obtain a copy of the License at: + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software distributed under + * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF + * ANY KIND, either express or implied. See the License for the specific language + * governing permissions and limitations under the License. + * + */ +TomSelect.define('drag_drop', function () { + var self = this; + if (!$.fn.sortable) throw new Error('The "drag_drop" plugin requires jQuery UI "sortable".'); + if (self.settings.mode !== 'multi') return; + var orig_lock = self.lock; + var orig_unlock = self.unlock; + self.hook('instead', 'lock', function () { + var sortable = $(self.control).data('sortable'); + if (sortable) sortable.disable(); + return orig_lock.apply(self, arguments); + }); + self.hook('instead', 'unlock', function () { + var sortable = $(self.control).data('sortable'); + if (sortable) sortable.enable(); + return orig_unlock.apply(self, arguments); + }); + self.hook('after', 'setup', () => { + var $control = $(self.control).sortable({ + items: '[data-value]', + forcePlaceholderSize: true, + disabled: self.isLocked, + start: (e, ui) => { + ui.placeholder.css('width', ui.helper.css('width')); + $control.css({ + overflow: 'visible' + }); + }, + stop: () => { + $control.css({ + overflow: 'hidden' + }); + var values = []; + $control.children('[data-value]').each(function () { + if (this.dataset.value) values.push(this.dataset.value); + }); + self.setValue(values); + } + }); + }); +}); +//# sourceMappingURL=plugin.js.map diff --git a/dist/docs/esm/plugins/drag_drop/plugin.js.map b/dist/docs/esm/plugins/drag_drop/plugin.js.map new file mode 100644 index 00000000..81cecffc --- /dev/null +++ b/dist/docs/esm/plugins/drag_drop/plugin.js.map @@ -0,0 +1 @@ +{"version":3,"file":"plugin.js","sources":["../../../../src/plugins/drag_drop/plugin.ts"],"sourcesContent":["/**\n * Plugin: \"drag_drop\" (Tom Select)\n * Copyright (c) contributors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\"); you may not use this\n * file except in compliance with the License. You may obtain a copy of the License at:\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF\n * ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n *\n */\nimport TomSelect from '../../tom-select.js';\n\nTomSelect.define('drag_drop',function(this:TomSelect) {\n\tvar self = this;\n\tif (!$.fn.sortable) throw new Error('The \"drag_drop\" plugin requires jQuery UI \"sortable\".');\n\tif (self.settings.mode !== 'multi') return;\n\n\tvar orig_lock\t\t= self.lock;\n\tvar orig_unlock\t\t= self.unlock;\n\n\tself.hook('instead','lock',function(){\n\t\tvar sortable = $(self.control).data('sortable');\n\t\tif (sortable) sortable.disable();\n\t\treturn orig_lock.apply(self, arguments);\n\t});\n\n\tself.hook('instead','unlock',function(){\n\t\tvar sortable = $(self.control).data('sortable');\n\t\tif (sortable) sortable.enable();\n\t\treturn orig_unlock.apply(self, arguments);\n\t});\n\n\tself.hook('after','setup',()=>{\n\t\tvar $control = $(self.control).sortable({\n\t\t\titems: '[data-value]',\n\t\t\tforcePlaceholderSize: true,\n\t\t\tdisabled: self.isLocked,\n\t\t\tstart: (e, ui) => {\n\t\t\t\tui.placeholder.css('width', ui.helper.css('width'));\n\t\t\t\t$control.css({overflow: 'visible'});\n\t\t\t},\n\t\t\tstop: ()=>{\n\t\t\t\t$control.css({overflow: 'hidden'});\n\n\t\t\t\tvar values:string[] = [];\n\t\t\t\t$control.children('[data-value]').each(function(){\n\t\t\t\t\tif( this.dataset.value ) values.push(this.dataset.value);\n\t\t\t\t});\n\n\t\t\t\tself.setValue(values);\n\t\t\t}\n\t\t});\n\n\t});\n\n});\n"],"names":["TomSelect","define","self","$","fn","sortable","Error","settings","mode","orig_lock","lock","orig_unlock","unlock","hook","control","data","disable","apply","arguments","enable","$control","items","forcePlaceholderSize","disabled","isLocked","start","e","ui","placeholder","css","helper","overflow","stop","values","children","each","dataset","value","push","setValue"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGAA,SAAS,CAACC,MAAV,CAAiB,WAAjB,EAA6B,YAAyB;AACrD,MAAIC,IAAI,GAAG,IAAX;AACA,MAAI,CAACC,CAAC,CAACC,EAAF,CAAKC,QAAV,EAAoB,MAAM,IAAIC,KAAJ,CAAU,uDAAV,CAAN;AACpB,MAAIJ,IAAI,CAACK,QAAL,CAAcC,IAAd,KAAuB,OAA3B,EAAoC;AAEpC,MAAIC,SAAS,GAAIP,IAAI,CAACQ,IAAtB;AACA,MAAIC,WAAW,GAAIT,IAAI,CAACU,MAAxB;AAEAV,EAAAA,IAAI,CAACW,IAAL,CAAU,SAAV,EAAoB,MAApB,EAA2B,YAAU;AACpC,QAAIR,QAAQ,GAAGF,CAAC,CAACD,IAAI,CAACY,OAAN,CAAD,CAAgBC,IAAhB,CAAqB,UAArB,CAAf;AACA,QAAIV,QAAJ,EAAcA,QAAQ,CAACW,OAAT;AACd,WAAOP,SAAS,CAACQ,KAAV,CAAgBf,IAAhB,EAAsBgB,SAAtB,CAAP;AACA,GAJD;AAMAhB,EAAAA,IAAI,CAACW,IAAL,CAAU,SAAV,EAAoB,QAApB,EAA6B,YAAU;AACtC,QAAIR,QAAQ,GAAGF,CAAC,CAACD,IAAI,CAACY,OAAN,CAAD,CAAgBC,IAAhB,CAAqB,UAArB,CAAf;AACA,QAAIV,QAAJ,EAAcA,QAAQ,CAACc,MAAT;AACd,WAAOR,WAAW,CAACM,KAAZ,CAAkBf,IAAlB,EAAwBgB,SAAxB,CAAP;AACA,GAJD;AAMAhB,EAAAA,IAAI,CAACW,IAAL,CAAU,OAAV,EAAkB,OAAlB,EAA0B,MAAI;AAC7B,QAAIO,QAAQ,GAAGjB,CAAC,CAACD,IAAI,CAACY,OAAN,CAAD,CAAgBT,QAAhB,CAAyB;AACvCgB,MAAAA,KAAK,EAAE,cADgC;AAEvCC,MAAAA,oBAAoB,EAAE,IAFiB;AAGvCC,MAAAA,QAAQ,EAAErB,IAAI,CAACsB,QAHwB;AAIvCC,MAAAA,KAAK,EAAE,CAACC,CAAD,EAAIC,EAAJ,KAAW;AACjBA,QAAAA,EAAE,CAACC,WAAH,CAAeC,GAAf,CAAmB,OAAnB,EAA4BF,EAAE,CAACG,MAAH,CAAUD,GAAV,CAAc,OAAd,CAA5B;AACAT,QAAAA,QAAQ,CAACS,GAAT,CAAa;AAACE,UAAAA,QAAQ,EAAE;AAAX,SAAb;AACA,OAPsC;AAQvCC,MAAAA,IAAI,EAAE,MAAI;AACTZ,QAAAA,QAAQ,CAACS,GAAT,CAAa;AAACE,UAAAA,QAAQ,EAAE;AAAX,SAAb;AAEA,YAAIE,MAAe,GAAG,EAAtB;AACAb,QAAAA,QAAQ,CAACc,QAAT,CAAkB,cAAlB,EAAkCC,IAAlC,CAAuC,YAAU;AAChD,cAAI,KAAKC,OAAL,CAAaC,KAAjB,EAAyBJ,MAAM,CAACK,IAAP,CAAY,KAAKF,OAAL,CAAaC,KAAzB;AACzB,SAFD;AAIAnC,QAAAA,IAAI,CAACqC,QAAL,CAAcN,MAAd;AACA;AAjBsC,KAAzB,CAAf;AAoBA,GArBD;AAuBA,CA3CD"} \ No newline at end of file diff --git a/dist/docs/esm/plugins/dropdown_header/plugin.js b/dist/docs/esm/plugins/dropdown_header/plugin.js new file mode 100644 index 00000000..7f4af52b --- /dev/null +++ b/dist/docs/esm/plugins/dropdown_header/plugin.js @@ -0,0 +1,102 @@ +/** +* Tom Select v1.7.3 +* Licensed under the Apache License, Version 2.0 (the "License"); +*/ + +import TomSelect from '../../tom-select.js'; + +/** + * Return a dom element from either a dom query string, jQuery object, a dom element or html string + * https://stackoverflow.com/questions/494143/creating-a-new-dom-element-from-an-html-string-using-built-in-dom-methods-or-pro/35385518#35385518 + * + * param query should be {} + */ +function getDom(query) { + if (query.jquery) { + return query[0]; + } + + if (query instanceof HTMLElement) { + return query; + } + + if (query.indexOf('<') > -1) { + let div = document.createElement('div'); + div.innerHTML = query.trim(); // Never return a text node of whitespace as the result + + return div.firstChild; + } + + return document.querySelector(query); +} + +/** + * Converts a scalar to its best string representation + * for hash keys and HTML attribute values. + * + * Transformations: + * 'str' -> 'str' + * null -> '' + * undefined -> '' + * true -> '1' + * false -> '0' + * 0 -> '0' + * 1 -> '1' + * + */ +/** + * Prevent default + * + */ + +function preventDefault(evt, stop = false) { + if (evt) { + evt.preventDefault(); + + if (stop) { + evt.stopPropagation(); + } + } +} + +/** + * Plugin: "dropdown_header" (Tom Select) + * Copyright (c) contributors + * + * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this + * file except in compliance with the License. You may obtain a copy of the License at: + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software distributed under + * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF + * ANY KIND, either express or implied. See the License for the specific language + * governing permissions and limitations under the License. + * + */ +TomSelect.define('dropdown_header', function (options) { + var self = this; + options = Object.assign({ + title: 'Untitled', + headerClass: 'dropdown-header', + titleRowClass: 'dropdown-header-title', + labelClass: 'dropdown-header-label', + closeClass: 'dropdown-header-close', + html: data => { + return '
' + '
' + '' + data.title + '' + '×' + '
' + '
'; + } + }, options); + self.hook('after', 'setup', () => { + var header = getDom(options.html(options)); + var close_link = header.querySelector('.' + options.closeClass); + + if (close_link) { + close_link.addEventListener('click', evt => { + preventDefault(evt, true); + self.close(); + }); + } + + self.dropdown.insertBefore(header, self.dropdown.firstChild); + }); +}); +//# sourceMappingURL=plugin.js.map diff --git a/dist/docs/esm/plugins/dropdown_header/plugin.js.map b/dist/docs/esm/plugins/dropdown_header/plugin.js.map new file mode 100644 index 00000000..a6215225 --- /dev/null +++ b/dist/docs/esm/plugins/dropdown_header/plugin.js.map @@ -0,0 +1 @@ +{"version":3,"file":"plugin.js","sources":["../../../../src/vanilla.ts","../../../../src/utils.ts","../../../../src/plugins/dropdown_header/plugin.ts"],"sourcesContent":["\n/**\n * Return a dom element from either a dom query string, jQuery object, a dom element or html string\n * https://stackoverflow.com/questions/494143/creating-a-new-dom-element-from-an-html-string-using-built-in-dom-methods-or-pro/35385518#35385518\n *\n * param query should be {}\n */\nexport function getDom( query:any ):HTMLElement{\n\n\tif( query.jquery ){\n\t\treturn query[0];\n\t}\n\n\tif( query instanceof HTMLElement ){\n\t\treturn query;\n\t}\n\n\tif( query.indexOf('<') > -1 ){\n\t\tlet div = document.createElement('div');\n\t\tdiv.innerHTML = query.trim(); // Never return a text node of whitespace as the result\n\t\treturn div.firstChild as HTMLElement;\n\t}\n\n\treturn document.querySelector(query);\n};\n\nexport function escapeQuery(query:string):string{\n\treturn query.replace(/['\"\\\\]/g, '\\\\$&');\n}\n\n/**\n * Dispatch an event\n *\n */\nexport function triggerEvent( dom_el:HTMLElement, event_name:string ):void{\n\tvar event = document.createEvent('HTMLEvents');\n\tevent.initEvent(event_name, true, false);\n\tdom_el.dispatchEvent(event)\n};\n\n/**\n * Apply CSS rules to a dom element\n *\n */\nexport function applyCSS( dom_el:HTMLElement, css:{ [key: string]: string|number }):void{\n\tObject.assign(dom_el.style, css);\n}\n\n\n/**\n * Add css classes\n *\n */\nexport function addClasses( elmts:HTMLElement|HTMLElement[], ...classes:string[]|string[][] ){\n\n\tvar norm_classes \t= classesArray(classes);\n\telmts\t\t\t\t= castAsArray(elmts);\n\n\telmts.map( el => {\n\t\tnorm_classes.map( cls => {\n\t\t\tel.classList.add( cls );\n\t\t});\n\t});\n}\n\n/**\n * Remove css classes\n *\n */\n export function removeClasses( elmts:HTMLElement|HTMLElement[], ...classes:string[]|string[][] ){\n\n \tvar norm_classes \t= classesArray(classes);\n\telmts\t\t\t\t= castAsArray(elmts);\n\n\telmts.map( el => {\n\t\tnorm_classes.map(cls => {\n\t \t\tel.classList.remove( cls );\n\t\t});\n \t});\n }\n\n\n/**\n * Return arguments\n *\n */\nexport function classesArray(args:string[]|string[][]):string[]{\n\tvar classes:string[] = [];\n\tfor( let _classes of args ){\n\t\tif( typeof _classes === 'string' ){\n\t\t\t_classes = _classes.trim().split(/[\\11\\12\\14\\15\\40]/);\n\t\t}\n\t\tif( Array.isArray(_classes) ){\n\t\t\tclasses = classes.concat(_classes);\n\t\t}\n\t}\n\n\treturn classes.filter(Boolean);\n}\n\n\n/**\n * Create an array from arg if it's not already an array\n *\n */\nexport function castAsArray(arg:any):Array{\n\tif( !Array.isArray(arg) ){\n \t\targ = [arg];\n \t}\n\treturn arg;\n}\n\n\n/**\n * Get the closest node to the evt.target matching the selector\n * Stops at wrapper\n *\n */\nexport function parentMatch( target:null|HTMLElement, selector:string, wrapper?:HTMLElement ):HTMLElement|void{\n\n\tif( wrapper && !wrapper.contains(target) ){\n\t\treturn;\n\t}\n\n\twhile( target && target.matches ){\n\n\t\tif( target.matches(selector) ){\n\t\t\treturn target;\n\t\t}\n\n\t\ttarget = target.parentNode as HTMLElement;\n\t}\n}\n\n\n/**\n * Get the first or last item from an array\n *\n * > 0 - right (last)\n * <= 0 - left (first)\n *\n */\nexport function getTail( list:Array|NodeList, direction:number=0 ):any{\n\n\tif( direction > 0 ){\n\t\treturn list[list.length-1];\n\t}\n\n\treturn list[0];\n}\n\n/**\n * Return true if an object is empty\n *\n */\nexport function isEmptyObject(obj:object):boolean{\n\treturn (Object.keys(obj).length === 0);\n}\n\n\n/**\n * Get the index of an element amongst sibling nodes of the same type\n *\n */\nexport function nodeIndex( el:null|Element, amongst?:string ):number{\n\tif (!el) return -1;\n\n\tamongst = amongst || el.nodeName;\n\n\tvar i = 0;\n\twhile( el = el.previousElementSibling ){\n\n\t\tif( el.matches(amongst) ){\n\t\t\ti++;\n\t\t}\n\t}\n\treturn i;\n}\n\n\n/**\n * Set attributes of an element\n *\n */\nexport function setAttr(el:Element,attrs:{ [key: string]: null|string }){\n\tfor( const attr in attrs ){\n\t\tlet val = attrs[attr];\n\t\tif( val == null ){\n\t\t\tel.removeAttribute(attr);\n\t\t}else{\n\t\t\tel.setAttribute(attr, val);\n\t\t}\n\t}\n}\n\n\n/**\n * Replace a node\n */\nexport function replaceNode( existing:Element, replacement:Element ){\n\tif( existing.parentNode ) existing.parentNode.replaceChild(replacement, existing);\n}\n","\nimport TomSelect from './tom-select';\n\n/**\n * Converts a scalar to its best string representation\n * for hash keys and HTML attribute values.\n *\n * Transformations:\n * 'str' -> 'str'\n * null -> ''\n * undefined -> ''\n * true -> '1'\n * false -> '0'\n * 0 -> '0'\n * 1 -> '1'\n *\n */\nexport function hash_key(value:undefined|null|boolean|string):string|null {\n\tif (typeof value === 'undefined' || value === null) return null;\n\treturn get_hash(value);\n};\n\nexport function get_hash(value:boolean|string):string{\n\tif (typeof value === 'boolean') return value ? '1' : '0';\n\treturn value + '';\n};\n\n/**\n * Escapes a string for use within HTML.\n *\n */\nexport function escape_html(str:string):string {\n\treturn (str + '')\n\t\t.replace(/&/g, '&')\n\t\t.replace(//g, '>')\n\t\t.replace(/\"/g, '"');\n};\n\n\n/**\n * Debounce the user provided load function\n *\n */\nexport function loadDebounce(fn,delay:number){\n\tvar timeout: ReturnType;\n\treturn function(this:TomSelect, value:string,callback:() => void) {\n\t\tvar self = this;\n\n\t\tif( timeout ){\n\t\t\tself.loading = Math.max(self.loading - 1, 0);\n\t\t}\n\t\tclearTimeout(timeout);\n\t\ttimeout = setTimeout(function() {\n\t\t\tself.loadedSearches[value] = true;\n\t\t\tfn.call(self, value, callback);\n\n\t\t}, delay);\n\t};\n}\n\n\n/**\n * Debounce all fired events types listed in `types`\n * while executing the provided `fn`.\n *\n */\nexport function debounce_events( self:TomSelect, types:string[], fn:() => void ) {\n\tvar type;\n\tvar trigger = self.trigger;\n\tvar event_args:{ [key: string]: any } = {};\n\n\t// override trigger method\n\tself.trigger = function(){\n\t\tvar type = arguments[0];\n\t\tif (types.indexOf(type) !== -1) {\n\t\t\tevent_args[type] = arguments;\n\t\t} else {\n\t\t\treturn trigger.apply(self, arguments);\n\t\t}\n\t};\n\n\t// invoke provided function\n\tfn.apply(self, []);\n\tself.trigger = trigger;\n\n\t// trigger queued events\n\tfor (type in event_args) {\n\t\ttrigger.apply(self, event_args[type]);\n\t}\n};\n\n\n/**\n * Determines the current selection within a text input control.\n * Returns an object containing:\n * - start\n * - length\n *\n */\nexport function getSelection(input:HTMLInputElement):{ start: number; length: number } {\n\treturn {\n\t\tstart\t: input.selectionStart || 0,\n\t\tlength\t: (input.selectionEnd||0) - (input.selectionStart||0),\n\t};\n};\n\n\n/**\n * Prevent default\n *\n */\nexport function preventDefault(evt?:Event, stop:boolean=false):void{\n\tif( evt ){\n\t\tevt.preventDefault();\n\t\tif( stop ){\n\t\t\tevt.stopPropagation();\n\t\t}\n\t}\n}\n\n\n/**\n * Prevent default\n *\n */\nexport function addEvent(target:EventTarget, type:string, callback, options?:object):void{\n\ttarget.addEventListener(type,callback,options);\n}\n\n\n/**\n * Return true if the requested key is down\n * Will return false if more than one control character is pressed ( when [ctrl+shift+a] != [ctrl+a] )\n * The current evt may not always set ( eg calling advanceSelection() )\n *\n */\nexport function isKeyDown( key_name:keyof (KeyboardEvent|MouseEvent), evt?:KeyboardEvent|MouseEvent ){\n\n\tif( !evt ){\n\t\treturn false;\n\t}\n\n\tif( !evt[key_name] ){\n\t\treturn false;\n\t}\n\n\tvar count = (evt.altKey?1:0) + (evt.ctrlKey?1:0) + (evt.shiftKey?1:0) + (evt.metaKey?1:0);\n\n\tif( count === 1 ){\n\t\treturn true;\n\t}\n\n\treturn false;\n}\n\n\n/**\n * Get the id of an element\n * If the id attribute is not set, set the attribute with the given id\n *\n */\nexport function getId(el:Element,id:string){\n\tconst existing_id = el.getAttribute('id');\n\tif( existing_id ){\n\t\treturn existing_id;\n\t}\n\n\tel.setAttribute('id',id);\n\treturn id;\n}\n\n\n/**\n * Returns a string with backslashes added before characters that need to be escaped.\n */\nexport function addSlashes(str:string):string{\n\treturn str.replace(/[\\\\\"']/g, '\\\\$&');\n}\n","/**\n * Plugin: \"dropdown_header\" (Tom Select)\n * Copyright (c) contributors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\"); you may not use this\n * file except in compliance with the License. You may obtain a copy of the License at:\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF\n * ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n *\n */\n\nimport TomSelect from '../../tom-select.js';\nimport { getDom } from '../../vanilla';\nimport { preventDefault } from '../../utils';\n\n\nTomSelect.define('dropdown_header',function(this:TomSelect, options) {\n\tvar self = this;\n\n\toptions = Object.assign({\n\t\ttitle : 'Untitled',\n\t\theaderClass : 'dropdown-header',\n\t\ttitleRowClass : 'dropdown-header-title',\n\t\tlabelClass : 'dropdown-header-label',\n\t\tcloseClass : 'dropdown-header-close',\n\n\t\thtml: (data) => {\n\t\t\treturn (\n\t\t\t\t'
' +\n\t\t\t\t\t'
' +\n\t\t\t\t\t\t'' + data.title + '' +\n\t\t\t\t\t\t'×' +\n\t\t\t\t\t'
' +\n\t\t\t\t'
'\n\t\t\t);\n\t\t}\n\t}, options);\n\n\tself.hook('after','setup',()=>{\n\t\tvar header = getDom(options.html(options));\n\n\t\tvar close_link = header.querySelector('.'+options.closeClass);\n\t\tif( close_link ){\n\t\t\tclose_link.addEventListener('click',(evt)=>{\n\t\t\t\tpreventDefault(evt,true);\n\t\t\t\tself.close();\n\t\t\t});\n\t\t}\n\n\t\tself.dropdown.insertBefore(header, self.dropdown.firstChild);\n\t});\n\n});\n"],"names":["getDom","query","jquery","HTMLElement","indexOf","div","document","createElement","innerHTML","trim","firstChild","querySelector","preventDefault","evt","stop","stopPropagation","TomSelect","define","options","self","Object","assign","title","headerClass","titleRowClass","labelClass","closeClass","html","data","hook","header","close_link","addEventListener","close","dropdown","insertBefore"],"mappings":";;;;;;;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,MAAT,CAAiBC,KAAjB,EAAwC;AAE9C,MAAIA,KAAK,CAACC,MAAV,EAAkB;AACjB,WAAOD,KAAK,CAAC,CAAD,CAAZ;AACA;;AAED,MAAIA,KAAK,YAAYE,WAArB,EAAkC;AACjC,WAAOF,KAAP;AACA;;AAED,MAAIA,KAAK,CAACG,OAAN,CAAc,GAAd,IAAqB,CAAC,CAA1B,EAA6B;AAC5B,QAAIC,GAAG,GAAGC,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAAV;AACAF,IAAAA,GAAG,CAACG,SAAJ,GAAgBP,KAAK,CAACQ,IAAN,EAAhB,CAF4B;;AAG5B,WAAOJ,GAAG,CAACK,UAAX;AACA;;AAED,SAAOJ,QAAQ,CAACK,aAAT,CAAuBV,KAAvB,CAAP;AACA;;ACrBD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AA4FA;AACA;AACA;AACA;;AACO,SAASW,cAAT,CAAwBC,GAAxB,EAAoCC,IAAY,GAAC,KAAjD,EAA4D;AAClE,MAAID,GAAJ,EAAS;AACRA,IAAAA,GAAG,CAACD,cAAJ;;AACA,QAAIE,IAAJ,EAAU;AACTD,MAAAA,GAAG,CAACE,eAAJ;AACA;AACD;AACD;;ACvHD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAOAC,SAAS,CAACC,MAAV,CAAiB,iBAAjB,EAAmC,UAAyBC,OAAzB,EAAkC;AACpE,MAAIC,IAAI,GAAG,IAAX;AAEAD,EAAAA,OAAO,GAAGE,MAAM,CAACC,MAAP,CAAc;AACvBC,IAAAA,KAAK,EAAW,UADO;AAEvBC,IAAAA,WAAW,EAAK,iBAFO;AAGvBC,IAAAA,aAAa,EAAG,uBAHO;AAIvBC,IAAAA,UAAU,EAAM,uBAJO;AAKvBC,IAAAA,UAAU,EAAM,uBALO;AAOvBC,IAAAA,IAAI,EAAGC,IAAD,IAAU;AACf,aACC,iBAAiBA,IAAI,CAACL,WAAtB,GAAoC,IAApC,GACC,cADD,GACkBK,IAAI,CAACJ,aADvB,GACuC,IADvC,GAEE,eAFF,GAEoBI,IAAI,CAACH,UAFzB,GAEsC,IAFtC,GAE6CG,IAAI,CAACN,KAFlD,GAE0D,SAF1D,GAGE,YAHF,GAGiBM,IAAI,CAACF,UAHtB,GAGmC,eAHnC,GAIC,QAJD,GAKA,QAND;AAQA;AAhBsB,GAAd,EAiBPR,OAjBO,CAAV;AAmBAC,EAAAA,IAAI,CAACU,IAAL,CAAU,OAAV,EAAkB,OAAlB,EAA0B,MAAI;AAC7B,QAAIC,MAAM,GAAG9B,MAAM,CAACkB,OAAO,CAACS,IAAR,CAAaT,OAAb,CAAD,CAAnB;AAEA,QAAIa,UAAU,GAAGD,MAAM,CAACnB,aAAP,CAAqB,MAAIO,OAAO,CAACQ,UAAjC,CAAjB;;AACA,QAAIK,UAAJ,EAAgB;AACfA,MAAAA,UAAU,CAACC,gBAAX,CAA4B,OAA5B,EAAqCnB,GAAD,IAAO;AAC1CD,QAAAA,cAAc,CAACC,GAAD,EAAK,IAAL,CAAd;AACAM,QAAAA,IAAI,CAACc,KAAL;AACA,OAHD;AAIA;;AAEDd,IAAAA,IAAI,CAACe,QAAL,CAAcC,YAAd,CAA2BL,MAA3B,EAAmCX,IAAI,CAACe,QAAL,CAAcxB,UAAjD;AACA,GAZD;AAcA,CApCD"} \ No newline at end of file diff --git a/dist/docs/esm/plugins/dropdown_input/plugin.js b/dist/docs/esm/plugins/dropdown_input/plugin.js new file mode 100644 index 00000000..6be9b475 --- /dev/null +++ b/dist/docs/esm/plugins/dropdown_input/plugin.js @@ -0,0 +1,131 @@ +/** +* Tom Select v1.7.3 +* Licensed under the Apache License, Version 2.0 (the "License"); +*/ + +import TomSelect from '../../tom-select.js'; + +const KEY_RETURN = 13; +typeof navigator === 'undefined' ? false : /Mac/.test(navigator.userAgent); + // ctrl key or apple key for ma + +/** + * Return a dom element from either a dom query string, jQuery object, a dom element or html string + * https://stackoverflow.com/questions/494143/creating-a-new-dom-element-from-an-html-string-using-built-in-dom-methods-or-pro/35385518#35385518 + * + * param query should be {} + */ +function getDom(query) { + if (query.jquery) { + return query[0]; + } + + if (query instanceof HTMLElement) { + return query; + } + + if (query.indexOf('<') > -1) { + let div = document.createElement('div'); + div.innerHTML = query.trim(); // Never return a text node of whitespace as the result + + return div.firstChild; + } + + return document.querySelector(query); +} +/** + * Set attributes of an element + * + */ + +function setAttr(el, attrs) { + for (const attr in attrs) { + let val = attrs[attr]; + + if (val == null) { + el.removeAttribute(attr); + } else { + el.setAttribute(attr, val); + } + } +} + +/** + * Converts a scalar to its best string representation + * for hash keys and HTML attribute values. + * + * Transformations: + * 'str' -> 'str' + * null -> '' + * undefined -> '' + * true -> '1' + * false -> '0' + * 0 -> '0' + * 1 -> '1' + * + */ +/** + * Prevent default + * + */ + +function addEvent(target, type, callback, options) { + target.addEventListener(type, callback, options); +} + +/** + * Plugin: "dropdown_input" (Tom Select) + * Copyright (c) contributors + * + * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this + * file except in compliance with the License. You may obtain a copy of the License at: + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software distributed under + * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF + * ANY KIND, either express or implied. See the License for the specific language + * governing permissions and limitations under the License. + * + */ +TomSelect.define('dropdown_input', function () { + var self = this; + var input = self.settings.controlInput || ''; + input = getDom(input); + + if (self.settings.placeholder) { + setAttr(input, { + placeholder: self.settings.placeholder + }); + } + + self.settings.controlInput = input; + self.settings.shouldOpen = true; // make sure the input is shown even if there are no options to display in the dropdown + + self.hook('after', 'setup', () => { + // set tabIndex on wrapper + setAttr(self.wrapper, { + tabindex: self.input.disabled ? '-1' : '' + self.tabIndex + }); // keyboard navigation + + addEvent(self.wrapper, 'keypress', evt => { + if (self.control.contains(evt.target)) { + return; + } + + if (self.dropdown.contains(evt.target)) { + return; + } // open dropdown on enter when wrapper is tab-focused + + + switch (evt.keyCode) { + case KEY_RETURN: + self.onClick(); + return; + } + }); + let div = getDom('