deblan-mirror/Choices
deblan-mirror/Choices
1
0
Fork 0
mirror of https://github.com/Choices-js/Choices.git synced 2024-06-01 13:32:23 +02:00
Code Issues Projects Releases Wiki Activity

Merge branch 'maximmig-master'

Browse source
This commit is contained in:
Josh Johnson 2017-07-13 09:01:44 +01:00
parent b8b09ceb9d 89289ab692
commit 49c76da629
7 changed files with 339 additions and 267 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
README.md
View file

@ -76,11 +76,13 @@ Or include Choices directly:
resetScrollPosition: true, resetScrollPosition: true,
regexFilter: null, regexFilter: null,
shouldSort: true, shouldSort: true,
shouldSortItems: false,
sortFilter: () => {...}, sortFilter: () => {...},
placeholder: true, placeholder: true,
placeholderValue: null, placeholderValue: null,
prependValue: null, prependValue: null,
appendValue: null, appendValue: null,
renderSelectedChoices: 'auto',
loadingText: 'Loading...', loadingText: 'Loading...',
noResultsText: 'No results found', noResultsText: 'No results found',
noChoicesText: 'No choices to choose from', noChoicesText: 'No choices to choose from',
@ -318,14 +320,21 @@ Pass an array of objects:
**Input types affected:** `select-one`, `select-multiple` **Input types affected:** `select-one`, `select-multiple`
**Usage:** Whether choices should be sorted. If false, choices will appear in the order they were given. **Usage:** Whether choices and groups should be sorted. If false, choices/groups will appear in the order they were given.
### shouldSortItems
**Type:** `Boolean` **Default:** `false`
**Input types affected:** `text`, `select-multiple`
**Usage:** Whether items should be sorted. If false, items will appear in the order they were selected.
### sortFilter ### sortFilter
**Type:** `Function` **Default:** sortByAlpha **Type:** `Function` **Default:** sortByAlpha
**Input types affected:** `select-one`, `select-multiple` **Input types affected:** `select-one`, `select-multiple`
**Usage:** The function that will sort choices before they are displayed (unless a user is searching). By default choices are sorted by alphabetical order. **Usage:** The function that will sort choices and items before they are displayed (unless a user is searching). By default choices and items are sorted by alphabetical order.
**Example:** **Example:**
@ -366,6 +375,13 @@ const example = new Choices(element, {
**Usage:** Append a value to each item added/selected. **Usage:** Append a value to each item added/selected.
### renderSelectedChoices
**Type:** `String` **Default:** `auto`
**Input types affected:** `select-one`, `select-multiple`
**Usage:** Whether selected choices should be removed from the list. By default choices are removed when they are selected in multiple select box. To always render choices pass `always`.
### loadingText ### loadingText
**Type:** `String` **Default:** `Loading...` **Type:** `String` **Default:** `Loading...`

503
assets/scripts/dist/choices.js vendored
View file

@ -137,11 +137,13 @@ return /******/ (function(modules) { // webpackBootstrap
resetScrollPosition: true, resetScrollPosition: true,
regexFilter: null, regexFilter: null,
shouldSort: true, shouldSort: true,
shouldSortItems: false,
sortFilter: _utils.sortByAlpha, sortFilter: _utils.sortByAlpha,
placeholder: true, placeholder: true,
placeholderValue: null, placeholderValue: null,
prependValue: null, prependValue: null,
appendValue: null, appendValue: null,
renderSelectedChoices: 'auto',
loadingText: 'Loading...', loadingText: 'Loading...',
noResultsText: 'No results found', noResultsText: 'No results found',
noChoicesText: 'No choices to choose from', noChoicesText: 'No choices to choose from',
@ -193,6 +195,13 @@ return /******/ (function(modules) { // webpackBootstrap
// Merge options with user options // Merge options with user options
this.config = (0, _utils.extend)(defaultConfig, userConfig); this.config = (0, _utils.extend)(defaultConfig, userConfig);
if (this.config.renderSelectedChoices !== 'auto' && this.config.renderSelectedChoices !== 'always') {
if (!this.config.silent) {
console.warn('renderSelectedChoices: Possible values are \'auto\' and \'always\'. Falling back to \'auto\'.');
}
this.config.renderSelectedChoices = 'auto';
}
// Create data store // Create data store
this.store = new _index2.default(this.render); this.store = new _index2.default(this.render);
@ -215,10 +224,16 @@ return /******/ (function(modules) { // webpackBootstrap
return; return;
} }
if (this.config.shouldSortItems === true && this.passedElement.type === 'select-one') {
if (!this.config.silent) {
console.warn('shouldSortElements: Type of passed element is \'select-one\', falling back to false.');
}
}
this.highlightPosition = 0; this.highlightPosition = 0;
this.canSearch = this.config.searchEnabled; this.canSearch = this.config.searchEnabled;
// Assing preset choices from passed object // Assign preset choices from passed object
this.presetChoices = this.config.choices; this.presetChoices = this.config.choices;
// Assign preset items from passed object first // Assign preset items from passed object first
@ -418,10 +433,12 @@ return /******/ (function(modules) { // webpackBootstrap
// Create a fragment to store our list items (so we don't have to update the DOM for each item) // Create a fragment to store our list items (so we don't have to update the DOM for each item)
var choicesFragment = fragment || document.createDocumentFragment(); var choicesFragment = fragment || document.createDocumentFragment();
var filter = this.isSearching ? _utils.sortByScore : this.config.sortFilter; var filter = this.isSearching ? _utils.sortByScore : this.config.sortFilter;
var renderSelectedChoices = this.config.renderSelectedChoices;
var appendChoice = function appendChoice(choice) { var appendChoice = function appendChoice(choice) {
var dropdownItem = _this3._getTemplate('choice', choice); var shouldRender = renderSelectedChoices === 'auto' ? _this3.passedElement.type === 'select-one' || !choice.selected : true;
var shouldRender = _this3.passedElement.type === 'select-one' || !choice.selected;
if (shouldRender) { if (shouldRender) {
var dropdownItem = _this3._getTemplate('choice', choice);
choicesFragment.appendChild(dropdownItem); choicesFragment.appendChild(dropdownItem);
} }
}; };
@ -463,6 +480,11 @@ return /******/ (function(modules) { // webpackBootstrap
// Create fragment to add elements to // Create fragment to add elements to
var itemListFragment = fragment || document.createDocumentFragment(); var itemListFragment = fragment || document.createDocumentFragment();
// If sorting is enabled, filter items
if (this.config.shouldSortItems && this.passedElement.type !== 'select-one') {
items.sort(this.config.sortFilter);
}
if (this.isTextElement) { if (this.isTextElement) {
// Simplify store data to just values // Simplify store data to just values
var itemsFiltered = this.store.getItemsReducedToValues(items); var itemsFiltered = this.store.getItemsReducedToValues(items);
@ -3624,9 +3646,9 @@ return /******/ (function(modules) { // webpackBootstrap
this.store = (0, _redux.createStore)(_index2.default, window.devToolsExtension ? window.devToolsExtension() : undefined); this.store = (0, _redux.createStore)(_index2.default, window.devToolsExtension ? window.devToolsExtension() : undefined);
} }
/** /**
* Get store object (wrapping Redux method) * Get store object (wrapping Redux method)
* @return {Object} State * @return {Object} State
*/ */
@ -3636,10 +3658,10 @@ return /******/ (function(modules) { // webpackBootstrap
return this.store.getState(); return this.store.getState();
} }
/** /**
* Dispatch event to store (wrapped Redux method) * Dispatch event to store (wrapped Redux method)
* @param {Function} action Action function to trigger * @param {Function} action Action function to trigger
* @return * @return
*/ */
}, { }, {
@ -3648,10 +3670,10 @@ return /******/ (function(modules) { // webpackBootstrap
this.store.dispatch(action); this.store.dispatch(action);
} }
/** /**
* Subscribe store to function call (wrapped Redux method) * Subscribe store to function call (wrapped Redux method)
* @param {Function} onChange Function to trigger when state changes * @param {Function} onChange Function to trigger when state changes
* @return * @return
*/ */
}, { }, {
@ -3660,9 +3682,9 @@ return /******/ (function(modules) { // webpackBootstrap
this.store.subscribe(onChange); this.store.subscribe(onChange);
} }
/** /**
* Get items from store * Get items from store
* @return {Array} Item objects * @return {Array} Item objects
*/ */
}, { }, {
@ -3672,9 +3694,9 @@ return /******/ (function(modules) { // webpackBootstrap
return state.items; return state.items;
} }
/** /**
* Get active items from store * Get active items from store
* @return {Array} Item objects * @return {Array} Item objects
*/ */
}, { }, {
@ -3688,9 +3710,9 @@ return /******/ (function(modules) { // webpackBootstrap
return values; return values;
} }
/** /**
* Get items from store reduced to just their values * Get items from store reduced to just their values
* @return {Array} Item objects * @return {Array} Item objects
*/ */
}, { }, {
@ -3706,9 +3728,9 @@ return /******/ (function(modules) { // webpackBootstrap
return values; return values;
} }
/** /**
* Get choices from store * Get choices from store
* @return {Array} Option objects * @return {Array} Option objects
*/ */
}, { }, {
@ -3718,9 +3740,9 @@ return /******/ (function(modules) { // webpackBootstrap
return state.choices; return state.choices;
} }
/** /**
* Get active choices from store * Get active choices from store
* @return {Array} Option objects * @return {Array} Option objects
*/ */
}, { }, {
@ -3734,9 +3756,9 @@ return /******/ (function(modules) { // webpackBootstrap
return values; return values;
} }
/** /**
* Get selectable choices from store * Get selectable choices from store
* @return {Array} Option objects * @return {Array} Option objects
*/ */
}, { }, {
@ -3750,9 +3772,9 @@ return /******/ (function(modules) { // webpackBootstrap
return values; return values;
} }
/** /**
* Get single choice by it's ID * Get single choice by it's ID
* @return {Object} Found choice * @return {Object} Found choice
*/ */
}, { }, {
@ -3768,9 +3790,9 @@ return /******/ (function(modules) { // webpackBootstrap
return false; return false;
} }
/** /**
* Get groups from store * Get groups from store
* @return {Array} Group objects * @return {Array} Group objects
*/ */
}, { }, {
@ -3780,9 +3802,9 @@ return /******/ (function(modules) { // webpackBootstrap
return state.groups; return state.groups;
} }
/** /**
* Get active groups from store * Get active groups from store
* @return {Array} Group objects * @return {Array} Group objects
*/ */
}, { }, {
@ -3802,10 +3824,10 @@ return /******/ (function(modules) { // webpackBootstrap
return values; return values;
} }
/** /**
* Get group by group id * Get group by group id
* @param {Number} id Group ID * @param {Number} id Group ID
* @return {Object} Group data * @return {Object} Group data
*/ */
}, { }, {
@ -3907,34 +3929,33 @@ return /******/ (function(modules) { // webpackBootstrap
*/ */
var ActionTypes = exports.ActionTypes = { var ActionTypes = exports.ActionTypes = {
INIT: '@@redux/INIT' INIT: '@@redux/INIT'
};
/** /**
* Creates a Redux store that holds the state tree. * Creates a Redux store that holds the state tree.
* The only way to change the data in the store is to call `dispatch()` on it. * The only way to change the data in the store is to call `dispatch()` on it.
* *
* There should only be a single store in your app. To specify how different * There should only be a single store in your app. To specify how different
* parts of the state tree respond to actions, you may combine several reducers * parts of the state tree respond to actions, you may combine several reducers
* into a single reducer function by using `combineReducers`. * into a single reducer function by using `combineReducers`.
* *
* @param {Function} reducer A function that returns the next state tree, given * @param {Function} reducer A function that returns the next state tree, given
* the current state tree and the action to handle. * the current state tree and the action to handle.
* *
* @param {any} [preloadedState] The initial state. You may optionally specify it * @param {any} [preloadedState] The initial state. You may optionally specify it
* to hydrate the state from the server in universal apps, or to restore a * to hydrate the state from the server in universal apps, or to restore a
* previously serialized user session. * previously serialized user session.
* If you use `combineReducers` to produce the root reducer function, this must be * If you use `combineReducers` to produce the root reducer function, this must be
* an object with the same shape as `combineReducers` keys. * an object with the same shape as `combineReducers` keys.
* *
* @param {Function} enhancer The store enhancer. You may optionally specify it * @param {Function} [enhancer] The store enhancer. You may optionally specify it
* to enhance the store with third-party capabilities such as middleware, * to enhance the store with third-party capabilities such as middleware,
* time travel, persistence, etc. The only store enhancer that ships with Redux * time travel, persistence, etc. The only store enhancer that ships with Redux
* is `applyMiddleware()`. * is `applyMiddleware()`.
* *
* @returns {Store} A Redux store that lets you read the state, dispatch actions * @returns {Store} A Redux store that lets you read the state, dispatch actions
* and subscribe to changes. * and subscribe to changes.
*/ */
function createStore(reducer, preloadedState, enhancer) { };function createStore(reducer, preloadedState, enhancer) {
var _ref2; var _ref2;
if (typeof preloadedState === 'function' && typeof enhancer === 'undefined') { if (typeof preloadedState === 'function' && typeof enhancer === 'undefined') {
@ -4068,7 +4089,8 @@ return /******/ (function(modules) { // webpackBootstrap
var listeners = currentListeners = nextListeners; var listeners = currentListeners = nextListeners;
for (var i = 0; i < listeners.length; i++) { for (var i = 0; i < listeners.length; i++) {
listeners[i](); var listener = listeners[i];
listener();
} }
return action; return action;
@ -4097,7 +4119,7 @@ return /******/ (function(modules) { // webpackBootstrap
* Interoperability point for observable/reactive libraries. * Interoperability point for observable/reactive libraries.
* @returns {observable} A minimal observable of state changes. * @returns {observable} A minimal observable of state changes.
* For more information, see the observable proposal: * For more information, see the observable proposal:
* https://github.com/zenparsing/es-observable * https://github.com/tc39/proposal-observable
*/ */
function observable() { function observable() {
var _ref; var _ref;
@ -4544,7 +4566,7 @@ return /******/ (function(modules) { // webpackBootstrap
var actionType = action && action.type; var actionType = action && action.type;
var actionName = actionType && '"' + actionType.toString() + '"' || 'an action'; var actionName = actionType && '"' + actionType.toString() + '"' || 'an action';
return 'Given action ' + actionName + ', reducer "' + key + '" returned undefined. ' + 'To ignore an action, you must explicitly return the previous state.'; return 'Given action ' + actionName + ', reducer "' + key + '" returned undefined. ' + 'To ignore an action, you must explicitly return the previous state. ' + 'If you want this reducer to hold no value, you can return null instead of undefined.';
} }
function getUnexpectedStateShapeWarningMessage(inputState, reducers, action, unexpectedKeyCache) { function getUnexpectedStateShapeWarningMessage(inputState, reducers, action, unexpectedKeyCache) {
@ -4572,18 +4594,18 @@ return /******/ (function(modules) { // webpackBootstrap
} }
} }
function assertReducerSanity(reducers) { function assertReducerShape(reducers) {
Object.keys(reducers).forEach(function (key) { Object.keys(reducers).forEach(function (key) {
var reducer = reducers[key]; var reducer = reducers[key];
var initialState = reducer(undefined, { type: _createStore.ActionTypes.INIT }); var initialState = reducer(undefined, { type: _createStore.ActionTypes.INIT });
if (typeof initialState === 'undefined') { if (typeof initialState === 'undefined') {
throw new Error('Reducer "' + key + '" returned undefined during initialization. ' + 'If the state passed to the reducer is undefined, you must ' + 'explicitly return the initial state. The initial state may ' + 'not be undefined.'); throw new Error('Reducer "' + key + '" returned undefined during initialization. ' + 'If the state passed to the reducer is undefined, you must ' + 'explicitly return the initial state. The initial state may ' + 'not be undefined. If you don\'t want to set a value for this reducer, ' + 'you can use null instead of undefined.');
} }
var type = '@@redux/PROBE_UNKNOWN_ACTION_' + Math.random().toString(36).substring(7).split('').join('.'); var type = '@@redux/PROBE_UNKNOWN_ACTION_' + Math.random().toString(36).substring(7).split('').join('.');
if (typeof reducer(undefined, { type: type }) === 'undefined') { if (typeof reducer(undefined, { type: type }) === 'undefined') {
throw new Error('Reducer "' + key + '" returned undefined when probed with a random type. ' + ('Don\'t try to handle ' + _createStore.ActionTypes.INIT + ' or other actions in "redux/*" ') + 'namespace. They are considered private. Instead, you must return the ' + 'current state for any unknown actions, unless it is undefined, ' + 'in which case you must return the initial state, regardless of the ' + 'action type. The initial state may not be undefined.'); throw new Error('Reducer "' + key + '" returned undefined when probed with a random type. ' + ('Don\'t try to handle ' + _createStore.ActionTypes.INIT + ' or other actions in "redux/*" ') + 'namespace. They are considered private. Instead, you must return the ' + 'current state for any unknown actions, unless it is undefined, ' + 'in which case you must return the initial state, regardless of the ' + 'action type. The initial state may not be undefined, but can be null.');
} }
}); });
} }
@ -4622,23 +4644,24 @@ return /******/ (function(modules) { // webpackBootstrap
} }
var finalReducerKeys = Object.keys(finalReducers); var finalReducerKeys = Object.keys(finalReducers);
var unexpectedKeyCache = void 0;
if (false) { if (false) {
var unexpectedKeyCache = {}; unexpectedKeyCache = {};
} }
var sanityError; var shapeAssertionError = void 0;
try { try {
assertReducerSanity(finalReducers); assertReducerShape(finalReducers);
} catch (e) { } catch (e) {
sanityError = e; shapeAssertionError = e;
} }
return function combination() { return function combination() {
var state = arguments.length <= 0 || arguments[0] === undefined ? {} : arguments[0]; var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var action = arguments[1]; var action = arguments[1];
if (sanityError) { if (shapeAssertionError) {
throw sanityError; throw shapeAssertionError;
} }
if (false) { if (false) {
@ -4650,16 +4673,16 @@ return /******/ (function(modules) { // webpackBootstrap
var hasChanged = false; var hasChanged = false;
var nextState = {}; var nextState = {};
for (var i = 0; i < finalReducerKeys.length; i++) { for (var _i = 0; _i < finalReducerKeys.length; _i++) {
var key = finalReducerKeys[i]; var _key = finalReducerKeys[_i];
var reducer = finalReducers[key]; var reducer = finalReducers[_key];
var previousStateForKey = state[key]; var previousStateForKey = state[_key];
var nextStateForKey = reducer(previousStateForKey, action); var nextStateForKey = reducer(previousStateForKey, action);
if (typeof nextStateForKey === 'undefined') { if (typeof nextStateForKey === 'undefined') {
var errorMessage = getUndefinedStateErrorMessage(key, action); var errorMessage = getUndefinedStateErrorMessage(_key, action);
throw new Error(errorMessage); throw new Error(errorMessage);
} }
nextState[key] = nextStateForKey; nextState[_key] = nextStateForKey;
hasChanged = hasChanged || nextStateForKey !== previousStateForKey; hasChanged = hasChanged || nextStateForKey !== previousStateForKey;
} }
return hasChanged ? nextState : state; return hasChanged ? nextState : state;
@ -4849,13 +4872,11 @@ return /******/ (function(modules) { // webpackBootstrap
return funcs[0]; return funcs[0];
} }
var last = funcs[funcs.length - 1]; return funcs.reduce(function (a, b) {
var rest = funcs.slice(0, -1); return function () {
return function () { return a(b.apply(undefined, arguments));
return rest.reduceRight(function (composed, f) { };
return f(composed); });
}, last.apply(undefined, arguments));
};
} }
/***/ }), /***/ }),
@ -5034,10 +5055,10 @@ return /******/ (function(modules) { // webpackBootstrap
switch (action.type) { switch (action.type) {
case 'ADD_CHOICE': case 'ADD_CHOICE':
{ {
/* /*
A disabled choice appears in the choice dropdown but cannot be selected A disabled choice appears in the choice dropdown but cannot be selected
A selected choice has been added to the passed input's value (added as an item) A selected choice has been added to the passed input's value (added as an item)
An active choice appears within the choice dropdown An active choice appears within the choice dropdown
*/ */
return [].concat(_toConsumableArray(state), [{ return [].concat(_toConsumableArray(state), [{
id: action.id, id: action.id,
@ -5238,10 +5259,10 @@ return /******/ (function(modules) { // webpackBootstrap
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
/* eslint-disable */ /* eslint-disable */
/** /**
* Capitalises the first letter of each word in a string * Capitalises the first letter of each word in a string
* @param {String} str String to capitalise * @param {String} str String to capitalise
* @return {String} Capitalised string * @return {String} Capitalised string
*/ */
var capitalise = exports.capitalise = function capitalise(str) { var capitalise = exports.capitalise = function capitalise(str) {
return str.replace(/\w\S*/g, function (txt) { return str.replace(/\w\S*/g, function (txt) {
@ -5249,10 +5270,10 @@ return /******/ (function(modules) { // webpackBootstrap
}); });
}; };
/** /**
* Generates a string of random chars * Generates a string of random chars
* @param {Number} length Length of the string to generate * @param {Number} length Length of the string to generate
* @return {String} String of random chars * @return {String} String of random chars
*/ */
var generateChars = exports.generateChars = function generateChars(length) { var generateChars = exports.generateChars = function generateChars(length) {
var chars = ''; var chars = '';
@ -5265,11 +5286,11 @@ return /******/ (function(modules) { // webpackBootstrap
return chars; return chars;
}; };
/** /**
* Generates a unique id based on an element * Generates a unique id based on an element
* @param {HTMLElement} element Element to generate the id from * @param {HTMLElement} element Element to generate the id from
* @param {String} Prefix for the Id * @param {String} Prefix for the Id
* @return {String} Unique Id * @return {String} Unique Id
*/ */
var generateId = exports.generateId = function generateId(element, prefix) { var generateId = exports.generateId = function generateId(element, prefix) {
var id = element.id || element.name && element.name + '-' + generateChars(2) || generateChars(4); var id = element.id || element.name && element.name + '-' + generateChars(2) || generateChars(4);
@ -5279,58 +5300,58 @@ return /******/ (function(modules) { // webpackBootstrap
return id; return id;
}; };
/** /**
* Tests the type of an object * Tests the type of an object
* @param {String} type Type to test object against * @param {String} type Type to test object against
* @param {Object} obj Object to be tested * @param {Object} obj Object to be tested
* @return {Boolean} * @return {Boolean}
*/ */
var getType = exports.getType = function getType(obj) { var getType = exports.getType = function getType(obj) {
return Object.prototype.toString.call(obj).slice(8, -1); return Object.prototype.toString.call(obj).slice(8, -1);
}; };
/** /**
* Tests the type of an object * Tests the type of an object
* @param {String} type Type to test object against * @param {String} type Type to test object against
* @param {Object} obj Object to be tested * @param {Object} obj Object to be tested
* @return {Boolean} * @return {Boolean}
*/ */
var isType = exports.isType = function isType(type, obj) { var isType = exports.isType = function isType(type, obj) {
var clas = getType(obj); var clas = getType(obj);
return obj !== undefined && obj !== null && clas === type; return obj !== undefined && obj !== null && clas === type;
}; };
/** /**
* Tests to see if a passed object is a node * Tests to see if a passed object is a node
* @param {Object} obj Object to be tested * @param {Object} obj Object to be tested
* @return {Boolean} * @return {Boolean}
*/ */
var isNode = exports.isNode = function isNode(o) { var isNode = exports.isNode = function isNode(o) {
return (typeof Node === 'undefined' ? 'undefined' : _typeof(Node)) === "object" ? o instanceof Node : o && (typeof o === 'undefined' ? 'undefined' : _typeof(o)) === "object" && typeof o.nodeType === "number" && typeof o.nodeName === "string"; return (typeof Node === 'undefined' ? 'undefined' : _typeof(Node)) === "object" ? o instanceof Node : o && (typeof o === 'undefined' ? 'undefined' : _typeof(o)) === "object" && typeof o.nodeType === "number" && typeof o.nodeName === "string";
}; };
/** /**
* Tests to see if a passed object is an element * Tests to see if a passed object is an element
* @param {Object} obj Object to be tested * @param {Object} obj Object to be tested
* @return {Boolean} * @return {Boolean}
*/ */
var isElement = exports.isElement = function isElement(o) { var isElement = exports.isElement = function isElement(o) {
return (typeof HTMLElement === 'undefined' ? 'undefined' : _typeof(HTMLElement)) === "object" ? o instanceof HTMLElement : //DOM2 return (typeof HTMLElement === 'undefined' ? 'undefined' : _typeof(HTMLElement)) === "object" ? o instanceof HTMLElement : //DOM2
o && (typeof o === 'undefined' ? 'undefined' : _typeof(o)) === "object" && o !== null && o.nodeType === 1 && typeof o.nodeName === "string"; o && (typeof o === 'undefined' ? 'undefined' : _typeof(o)) === "object" && o !== null && o.nodeType === 1 && typeof o.nodeName === "string";
}; };
/** /**
* Merges unspecified amount of objects into new object * Merges unspecified amount of objects into new object
* @private * @private
* @return {Object} Merged object of arguments * @return {Object} Merged object of arguments
*/ */
var extend = exports.extend = function extend() { var extend = exports.extend = function extend() {
var extended = {}; var extended = {};
var length = arguments.length; var length = arguments.length;
/** /**
* Merge one object into another * Merge one object into another
* @param {Object} obj Object to merge into extended object * @param {Object} obj Object to merge into extended object
*/ */
var merge = function merge(obj) { var merge = function merge(obj) {
for (var prop in obj) { for (var prop in obj) {
@ -5359,9 +5380,9 @@ return /******/ (function(modules) { // webpackBootstrap
return extended; return extended;
}; };
/** /**
* CSS transition end event listener * CSS transition end event listener
* @return * @return
*/ */
var whichTransitionEvent = exports.whichTransitionEvent = function whichTransitionEvent() { var whichTransitionEvent = exports.whichTransitionEvent = function whichTransitionEvent() {
var t, var t,
@ -5381,9 +5402,9 @@ return /******/ (function(modules) { // webpackBootstrap
} }
}; };
/** /**
* CSS animation end event listener * CSS animation end event listener
* @return * @return
*/ */
var whichAnimationEvent = exports.whichAnimationEvent = function whichAnimationEvent() { var whichAnimationEvent = exports.whichAnimationEvent = function whichAnimationEvent() {
var t, var t,
@ -5403,13 +5424,13 @@ return /******/ (function(modules) { // webpackBootstrap
} }
}; };
/** /**
* Get the ancestors of each element in the current set of matched elements, * Get the ancestors of each element in the current set of matched elements,
* up to but not including the element matched by the selector * up to but not including the element matched by the selector
* @param {NodeElement} elem Element to begin search from * @param {NodeElement} elem Element to begin search from
* @param {NodeElement} parent Parent to find * @param {NodeElement} parent Parent to find
* @param {String} selector Class to find * @param {String} selector Class to find
* @return {Array} Array of parent elements * @return {Array} Array of parent elements
*/ */
var getParentsUntil = exports.getParentsUntil = function getParentsUntil(elem, parent, selector) { var getParentsUntil = exports.getParentsUntil = function getParentsUntil(elem, parent, selector) {
var parents = []; var parents = [];
@ -5509,22 +5530,22 @@ return /******/ (function(modules) { // webpackBootstrap
return siblings; return siblings;
}; };
/** /**
* Find ancestor in DOM tree * Find ancestor in DOM tree
* @param {NodeElement} el Element to start search from * @param {NodeElement} el Element to start search from
* @param {[type]} cls Class of parent * @param {[type]} cls Class of parent
* @return {NodeElement} Found parent element * @return {NodeElement} Found parent element
*/ */
var findAncestor = exports.findAncestor = function findAncestor(el, cls) { var findAncestor = exports.findAncestor = function findAncestor(el, cls) {
while ((el = el.parentElement) && !el.classList.contains(cls)) {} while ((el = el.parentElement) && !el.classList.contains(cls)) {}
return el; return el;
}; };
/** /**
* Find ancestor in DOM tree by attribute name * Find ancestor in DOM tree by attribute name
* @param {NodeElement} el Element to start search from * @param {NodeElement} el Element to start search from
* @param {string} attr Attribute name of parent * @param {string} attr Attribute name of parent
* @return {?NodeElement} Found parent element or null * @return {?NodeElement} Found parent element or null
*/ */
var findAncestorByAttrName = exports.findAncestorByAttrName = function findAncestorByAttrName(el, attr) { var findAncestorByAttrName = exports.findAncestorByAttrName = function findAncestorByAttrName(el, attr) {
var target = el; var target = el;
@ -5540,12 +5561,12 @@ return /******/ (function(modules) { // webpackBootstrap
return null; return null;
}; };
/** /**
* Debounce an event handler. * Debounce an event handler.
* @param {Function} func Function to run after wait * @param {Function} func Function to run after wait
* @param {Number} wait The delay before the function is executed * @param {Number} wait The delay before the function is executed
* @param {Boolean} immediate If passed, trigger the function on the leading edge, instead of the trailing. * @param {Boolean} immediate If passed, trigger the function on the leading edge, instead of the trailing.
* @return {Function} A function will be called after it stops being called for a given delay * @return {Function} A function will be called after it stops being called for a given delay
*/ */
var debounce = exports.debounce = function debounce(func, wait, immediate) { var debounce = exports.debounce = function debounce(func, wait, immediate) {
var timeout; var timeout;
@ -5563,11 +5584,11 @@ return /******/ (function(modules) { // webpackBootstrap
}; };
}; };
/** /**
* Get an element's distance from the top of the page * Get an element's distance from the top of the page
* @private * @private
* @param {NodeElement} el Element to test for * @param {NodeElement} el Element to test for
* @return {Number} Elements Distance from top of page * @return {Number} Elements Distance from top of page
*/ */
var getElemDistance = exports.getElemDistance = function getElemDistance(el) { var getElemDistance = exports.getElemDistance = function getElemDistance(el) {
var location = 0; var location = 0;
@ -5580,11 +5601,11 @@ return /******/ (function(modules) { // webpackBootstrap
return location >= 0 ? location : 0; return location >= 0 ? location : 0;
}; };
/** /**
* Determine element height multiplied by any offsets * Determine element height multiplied by any offsets
* @private * @private
* @param {HTMLElement} el Element to test for * @param {HTMLElement} el Element to test for
* @return {Number} Height of element * @return {Number} Height of element
*/ */
var getElementOffset = exports.getElementOffset = function getElementOffset(el, offset) { var getElementOffset = exports.getElementOffset = function getElementOffset(el, offset) {
var elOffset = offset; var elOffset = offset;
@ -5594,12 +5615,12 @@ return /******/ (function(modules) { // webpackBootstrap
return Math.max(el.offsetHeight * elOffset); return Math.max(el.offsetHeight * elOffset);
}; };
/** /**
* Get the next or previous element from a given start point * Get the next or previous element from a given start point
* @param {HTMLElement} startEl Element to start position from * @param {HTMLElement} startEl Element to start position from
* @param {String} className The class we will look through * @param {String} className The class we will look through
* @param {Number} direction Positive next element, negative previous element * @param {Number} direction Positive next element, negative previous element
* @return {[HTMLElement} Found element * @return {[HTMLElement} Found element
*/ */
var getAdjacentEl = exports.getAdjacentEl = function getAdjacentEl(startEl, className) { var getAdjacentEl = exports.getAdjacentEl = function getAdjacentEl(startEl, className) {
var direction = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1; var direction = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
@ -5615,10 +5636,10 @@ return /******/ (function(modules) { // webpackBootstrap
return children[startPos + operatorDirection]; return children[startPos + operatorDirection];
}; };
/** /**
* Get scroll position based on top/bottom position * Get scroll position based on top/bottom position
* @private * @private
* @return {String} Position of scroll * @return {String} Position of scroll
*/ */
var getScrollPosition = exports.getScrollPosition = function getScrollPosition(position) { var getScrollPosition = exports.getScrollPosition = function getScrollPosition(position) {
if (position === 'bottom') { if (position === 'bottom') {
@ -5630,23 +5651,23 @@ return /******/ (function(modules) { // webpackBootstrap
} }
}; };
/** /**
* Determine whether an element is within the viewport * Determine whether an element is within the viewport
* @param {HTMLElement} el Element to test * @param {HTMLElement} el Element to test
* @return {String} Position of scroll * @return {String} Position of scroll
* @return {Boolean} * @return {Boolean}
*/ */
var isInView = exports.isInView = function isInView(el, position, offset) { var isInView = exports.isInView = function isInView(el, position, offset) {
// If the user has scrolled further than the distance from the element to the top of its parent // If the user has scrolled further than the distance from the element to the top of its parent
return this.getScrollPosition(position) > this.getElemDistance(el) + this.getElementOffset(el, offset) ? true : false; return this.getScrollPosition(position) > this.getElemDistance(el) + this.getElementOffset(el, offset) ? true : false;
}; };
/** /**
* Determine whether an element is within * Determine whether an element is within
* @param {HTMLElement} el Element to test * @param {HTMLElement} el Element to test
* @param {HTMLElement} parent Scrolling parent * @param {HTMLElement} parent Scrolling parent
* @param {Number} direction Whether element is visible from above or below * @param {Number} direction Whether element is visible from above or below
* @return {Boolean} * @return {Boolean}
*/ */
var isScrolledIntoView = exports.isScrolledIntoView = function isScrolledIntoView(el, parent) { var isScrolledIntoView = exports.isScrolledIntoView = function isScrolledIntoView(el, parent) {
var direction = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1; var direction = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
@ -5666,10 +5687,10 @@ return /******/ (function(modules) { // webpackBootstrap
return isVisible; return isVisible;
}; };
/** /**
* Remove html tags from a string * Remove html tags from a string
* @param {String} Initial string/html * @param {String} Initial string/html
* @return {String} Sanitised string * @return {String} Sanitised string
*/ */
var stripHTML = exports.stripHTML = function stripHTML(html) { var stripHTML = exports.stripHTML = function stripHTML(html) {
var el = document.createElement("DIV"); var el = document.createElement("DIV");
@ -5677,11 +5698,11 @@ return /******/ (function(modules) { // webpackBootstrap
return el.textContent || el.innerText || ""; return el.textContent || el.innerText || "";
}; };
/** /**
* Adds animation to an element and removes it upon animation completion * Adds animation to an element and removes it upon animation completion
* @param {Element} el Element to add animation to * @param {Element} el Element to add animation to
* @param {String} animation Animation class to add to element * @param {String} animation Animation class to add to element
* @return * @return
*/ */
var addAnimation = exports.addAnimation = function addAnimation(el, animation) { var addAnimation = exports.addAnimation = function addAnimation(el, animation) {
var animationEvent = whichAnimationEvent(); var animationEvent = whichAnimationEvent();
@ -5695,20 +5716,20 @@ return /******/ (function(modules) { // webpackBootstrap
el.addEventListener(animationEvent, removeAnimation, false); el.addEventListener(animationEvent, removeAnimation, false);
}; };
/** /**
* Get a random number between a range * Get a random number between a range
* @param {Number} min Minimum range * @param {Number} min Minimum range
* @param {Number} max Maximum range * @param {Number} max Maximum range
* @return {Number} Random number * @return {Number} Random number
*/ */
var getRandomNumber = exports.getRandomNumber = function getRandomNumber(min, max) { var getRandomNumber = exports.getRandomNumber = function getRandomNumber(min, max) {
return Math.floor(Math.random() * (max - min) + min); return Math.floor(Math.random() * (max - min) + min);
}; };
/** /**
* Turn a string into a node * Turn a string into a node
* @param {String} String to convert * @param {String} String to convert
* @return {HTMLElement} Converted node element * @return {HTMLElement} Converted node element
*/ */
var strToEl = exports.strToEl = function () { var strToEl = exports.strToEl = function () {
var tmpEl = document.createElement('div'); var tmpEl = document.createElement('div');
@ -5726,9 +5747,9 @@ return /******/ (function(modules) { // webpackBootstrap
}; };
}(); }();
/** /**
* Sets the width of a passed input based on its value * Sets the width of a passed input based on its value
* @return {Number} Width of input * @return {Number} Width of input
*/ */
var getWidthOfInput = exports.getWidthOfInput = function getWidthOfInput(input) { var getWidthOfInput = exports.getWidthOfInput = function getWidthOfInput(input) {
var value = input.value || input.placeholder; var value = input.value || input.placeholder;
@ -5755,13 +5776,13 @@ return /******/ (function(modules) { // webpackBootstrap
return width + 'px'; return width + 'px';
}; };
/** /**
* Sorting function for current and previous string * Sorting function for current and previous string
* @param {String} a Current value * @param {String} a Current value
* @param {String} b Next value * @param {String} b Next value
* @return {Number} -1 for after previous, * @return {Number} -1 for after previous,
* 1 for before, * 1 for before,
* 0 for same location * 0 for same location
*/ */
var sortByAlpha = exports.sortByAlpha = function sortByAlpha(a, b) { var sortByAlpha = exports.sortByAlpha = function sortByAlpha(a, b) {
var labelA = (a.label || a.value).toLowerCase(); var labelA = (a.label || a.value).toLowerCase();
@ -5772,24 +5793,24 @@ return /******/ (function(modules) { // webpackBootstrap
return 0; return 0;
}; };
/** /**
* Sort by numeric score * Sort by numeric score
* @param {Object} a Current value * @param {Object} a Current value
* @param {Object} b Next value * @param {Object} b Next value
* @return {Number} -1 for after previous, * @return {Number} -1 for after previous,
* 1 for before, * 1 for before,
* 0 for same location * 0 for same location
*/ */
var sortByScore = exports.sortByScore = function sortByScore(a, b) { var sortByScore = exports.sortByScore = function sortByScore(a, b) {
return a.score - b.score; return a.score - b.score;
}; };
/** /**
* Trigger native event * Trigger native event
* @param {NodeElement} element Element to trigger event on * @param {NodeElement} element Element to trigger event on
* @param {String} type Type of event to trigger * @param {String} type Type of event to trigger
* @param {Object} customArgs Data to pass with event * @param {Object} customArgs Data to pass with event
* @return {Object} Triggered event * @return {Object} Triggered event
*/ */
var triggerEvent = exports.triggerEvent = function triggerEvent(element, type) { var triggerEvent = exports.triggerEvent = function triggerEvent(element, type) {
var customArgs = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null; var customArgs = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;

2
assets/scripts/dist/choices.js.map vendored
View file

File diff suppressed because one or more lines are too long

6
assets/scripts/dist/choices.min.js vendored
View file

File diff suppressed because one or more lines are too long

35
assets/scripts/src/choices.js
View file

@ -71,11 +71,13 @@ class Choices {
resetScrollPosition: true, resetScrollPosition: true,
regexFilter: null, regexFilter: null,
shouldSort: true, shouldSort: true,
shouldSortItems: false,
sortFilter: sortByAlpha, sortFilter: sortByAlpha,
placeholder: true, placeholder: true,
placeholderValue: null, placeholderValue: null,
prependValue: null, prependValue: null,
appendValue: null, appendValue: null,
renderSelectedChoices: 'auto',
loadingText: 'Loading...', loadingText: 'Loading...',
noResultsText: 'No results found', noResultsText: 'No results found',
noChoicesText: 'No choices to choose from', noChoicesText: 'No choices to choose from',
@ -127,6 +129,13 @@ class Choices {
// Merge options with user options // Merge options with user options
this.config = extend(defaultConfig, userConfig); this.config = extend(defaultConfig, userConfig);
if (this.config.renderSelectedChoices !== 'auto' && this.config.renderSelectedChoices !== 'always') {
if (!this.config.silent) {
console.warn('renderSelectedChoices: Possible values are \'auto\' and \'always\'. Falling back to \'auto\'.');
}
this.config.renderSelectedChoices = 'auto';
}
// Create data store // Create data store
this.store = new Store(this.render); this.store = new Store(this.render);
@ -150,10 +159,16 @@ class Choices {
return; return;
} }
if (this.config.shouldSortItems === true && this.passedElement.type === 'select-one') {
if (!this.config.silent) {
console.warn('shouldSortElements: Type of passed element is \'select-one\', falling back to false.');
}
}
this.highlightPosition = 0; this.highlightPosition = 0;
this.canSearch = this.config.searchEnabled; this.canSearch = this.config.searchEnabled;
// Assing preset choices from passed object // Assign preset choices from passed object
this.presetChoices = this.config.choices; this.presetChoices = this.config.choices;
// Assign preset items from passed object first // Assign preset items from passed object first
@ -336,10 +351,13 @@ class Choices {
// Create a fragment to store our list items (so we don't have to update the DOM for each item) // Create a fragment to store our list items (so we don't have to update the DOM for each item)
const choicesFragment = fragment || document.createDocumentFragment(); const choicesFragment = fragment || document.createDocumentFragment();
const filter = this.isSearching ? sortByScore : this.config.sortFilter; const filter = this.isSearching ? sortByScore : this.config.sortFilter;
const { renderSelectedChoices } = this.config;
const appendChoice = (choice) => { const appendChoice = (choice) => {
const dropdownItem = this._getTemplate('choice', choice); const shouldRender = renderSelectedChoices === 'auto'
const shouldRender = this.passedElement.type === 'select-one' || !choice.selected; ? this.passedElement.type === 'select-one' || !choice.selected
: true;
if (shouldRender) { if (shouldRender) {
const dropdownItem = this._getTemplate('choice', choice);
choicesFragment.appendChild(dropdownItem); choicesFragment.appendChild(dropdownItem);
} }
}; };
@ -374,6 +392,11 @@ class Choices {
// Create fragment to add elements to // Create fragment to add elements to
const itemListFragment = fragment || document.createDocumentFragment(); const itemListFragment = fragment || document.createDocumentFragment();
// If sorting is enabled, filter items
if (this.config.shouldSortItems && this.passedElement.type !== 'select-one') {
items.sort(this.config.sortFilter);
}
if (this.isTextElement) { if (this.isTextElement) {
// Simplify store data to just values // Simplify store data to just values
const itemsFiltered = this.store.getItemsReducedToValues(items); const itemsFiltered = this.store.getItemsReducedToValues(items);
@ -611,9 +634,6 @@ class Choices {
*/ */
removeItemsByValue(value) { removeItemsByValue(value) {
if (!value || !isType('String', value)) { if (!value || !isType('String', value)) {
if (!this.config.silent) {
console.error('removeItemsByValue: No value was passed to be removed');
}
return; return;
} }
@ -2134,9 +2154,6 @@ class Choices {
*/ */
_removeItem(item) { _removeItem(item) {
if (!item || !isType('Object', item)) { if (!item || !isType('Object', item)) {
if (!this.config.silent) {
console.error('removeItem: No item object was passed to be removed');
}
return; return;
} }

4
package.json
View file

@ -5,8 +5,8 @@
"main": "./assets/scripts/dist/choices.min.js", "main": "./assets/scripts/dist/choices.min.js",
"scripts": { "scripts": {
"start": "node server.js", "start": "node server.js",
"test": "./node_modules/karma/bin/karma start --single-run --no-auto-watch tests/karma.config.js", "test": "karma start --single-run --no-auto-watch tests/karma.config.js",
"test:watch": "./node_modules/karma/bin/karma start --auto-watch --no-single-run tests/karma.config.js", "test:watch": "karma start --auto-watch --no-single-run tests/karma.config.js",
"css:watch": "nodemon -e scss -x \"npm run css:build\"", "css:watch": "nodemon -e scss -x \"npm run css:build\"",
"css:build": "npm run css:sass -s && npm run css:prefix -s && npm run css:min -s", "css:build": "npm run css:sass -s && npm run css:prefix -s && npm run css:min -s",
"css:sass": "node-sass --output-style expanded --include-path scss assets/styles/scss/base.scss assets/styles/css/base.css && node-sass --output-style expanded --include-path scss assets/styles/scss/choices.scss assets/styles/css/choices.css", "css:sass": "node-sass --output-style expanded --include-path scss assets/styles/scss/base.scss assets/styles/css/base.css && node-sass --output-style expanded --include-path scss assets/styles/scss/choices.scss assets/styles/css/choices.css",

36
tests/spec/choices_spec.js
View file

@ -36,7 +36,7 @@ describe('Choices', () => {
const reinitialise = new Choices(this.choices.passedElement); const reinitialise = new Choices(this.choices.passedElement);
spyOn(reinitialise, '_createTemplates'); spyOn(reinitialise, '_createTemplates');
expect(reinitialise._createTemplates).not.toHaveBeenCalled(); expect(reinitialise._createTemplates).not.toHaveBeenCalled();
}) });
it('should have a blank state', function() { it('should have a blank state', function() {
expect(this.choices.currentState.items.length).toEqual(0); expect(this.choices.currentState.items.length).toEqual(0);
@ -65,10 +65,12 @@ describe('Choices', () => {
expect(this.choices.config.regexFilter).toEqual(null); expect(this.choices.config.regexFilter).toEqual(null);
expect(this.choices.config.sortFilter).toEqual(jasmine.any(Function)); expect(this.choices.config.sortFilter).toEqual(jasmine.any(Function));
expect(this.choices.config.shouldSort).toEqual(jasmine.any(Boolean)); expect(this.choices.config.shouldSort).toEqual(jasmine.any(Boolean));
expect(this.choices.config.shouldSortItems).toEqual(jasmine.any(Boolean));
expect(this.choices.config.placeholder).toEqual(jasmine.any(Boolean)); expect(this.choices.config.placeholder).toEqual(jasmine.any(Boolean));
expect(this.choices.config.placeholderValue).toEqual(null); expect(this.choices.config.placeholderValue).toEqual(null);
expect(this.choices.config.prependValue).toEqual(null); expect(this.choices.config.prependValue).toEqual(null);
expect(this.choices.config.appendValue).toEqual(null); expect(this.choices.config.appendValue).toEqual(null);
expect(this.choices.config.renderSelectedChoices).toEqual(jasmine.any(String));
expect(this.choices.config.loadingText).toEqual(jasmine.any(String)); expect(this.choices.config.loadingText).toEqual(jasmine.any(String));
expect(this.choices.config.noResultsText).toEqual(jasmine.any(String)); expect(this.choices.config.noResultsText).toEqual(jasmine.any(String));
expect(this.choices.config.noChoicesText).toEqual(jasmine.any(String)); expect(this.choices.config.noChoicesText).toEqual(jasmine.any(String));
@ -261,7 +263,7 @@ describe('Choices', () => {
this.choices.destroy(); this.choices.destroy();
}); });
it('should open the choice list on focussing', function() { it('should open the choice list on focusing', function() {
this.choices = new Choices(this.input); this.choices = new Choices(this.input);
this.choices.input.focus(); this.choices.input.focus();
expect(this.choices.dropdown.classList).toContain(this.choices.config.classNames.activeState); expect(this.choices.dropdown.classList).toContain(this.choices.config.classNames.activeState);
@ -276,7 +278,7 @@ describe('Choices', () => {
this.choices = new Choices(this.input); this.choices = new Choices(this.input);
this.choices.input.focus(); this.choices.input.focus();
for (var i = 0; i < 2; i++) { for (let i = 0; i < 2; i++) {
// Key down to third choice // Key down to third choice
this.choices._onKeyDown({ this.choices._onKeyDown({
target: this.choices.input, target: this.choices.input,
@ -498,7 +500,7 @@ describe('Choices', () => {
expect(this.choices.currentState.choices[0].value).toEqual('Value 5'); expect(this.choices.currentState.choices[0].value).toEqual('Value 5');
}); });
it('should sort choices if shouldSort is false', function() { it('should sort choices if shouldSort is true', function() {
this.choices = new Choices(this.input, { this.choices = new Choices(this.input, {
shouldSort: true, shouldSort: true,
choices: [{ choices: [{
@ -927,6 +929,22 @@ describe('Choices', () => {
this.choices.input.focus(); this.choices.input.focus();
expect(container.classList.contains(this.choices.config.classNames.flippedState)).toBe(false); expect(container.classList.contains(this.choices.config.classNames.flippedState)).toBe(false);
}); });
it('should render selected choices', function() {
this.choices = new Choices(this.input, {
renderSelectedChoices: 'always'
});
const renderedChoices = this.choices.choiceList.querySelectorAll('.choices__item');
expect(renderedChoices.length).toEqual(3);
});
it('shouldn\'t render selected choices', function() {
this.choices = new Choices(this.input, {
renderSelectedChoices: 'auto'
});
const renderedChoices = this.choices.choiceList.querySelectorAll('.choices__item');
expect(renderedChoices.length).toEqual(1);
});
}); });
describe('should allow custom properties provided by the user on items or choices', function() { describe('should allow custom properties provided by the user on items or choices', function() {
@ -940,7 +958,7 @@ describe('Choices', () => {
customProperties: { customProperties: {
foo: 'bar' foo: 'bar'
} }
} };
const expectedState = [{ const expectedState = [{
id: randomItem.id, id: randomItem.id,
@ -976,7 +994,7 @@ describe('Choices', () => {
customProperties: { customProperties: {
foo: 'bar' foo: 'bar'
} }
} };
const expectedState = [{ const expectedState = [{
id: randomChoice.id, id: randomChoice.id,
@ -1047,9 +1065,9 @@ describe('Choices', () => {
this.choices = new Choices(this.input); this.choices = new Choices(this.input);
this.choices.setValue([{ this.choices.setValue([{
value: 'bar', value: 'bar',
label: 'foo', label: 'foo',
customProperties: expectedCustomProperties customProperties: expectedCustomProperties
}]); }]);
const selectedItems = this.choices.getValue(); const selectedItems = this.choices.getValue();