2019-11-15 00:06:48 +01:00
/*! choices.js v9.0.0 | © 2019 Josh Johnson | https://github.com/jshjohnson/Choices#readme */
2016-10-18 15:15:00 +02:00
( function webpackUniversalModuleDefinition ( root , factory ) {
if ( typeof exports === 'object' && typeof module === 'object' )
module . exports = factory ( ) ;
else if ( typeof define === 'function' && define . amd )
2016-10-28 22:59:43 +02:00
define ( [ ] , factory ) ;
2016-10-18 15:15:00 +02:00
else if ( typeof exports === 'object' )
exports [ "Choices" ] = factory ( ) ;
else
root [ "Choices" ] = factory ( ) ;
2019-02-09 19:13:25 +01:00
} ) ( window , function ( ) {
2016-10-18 15:15:00 +02:00
return /******/ ( function ( modules ) { // webpackBootstrap
2016-08-23 08:24:45 +02:00
/******/ // The module cache
/******/ var installedModules = { } ;
2017-11-07 12:59:49 +01:00
/******/
2016-08-23 08:24:45 +02:00
/******/ // The require function
/******/ function _ _webpack _require _ _ ( moduleId ) {
2017-11-07 12:59:49 +01:00
/******/
2016-08-23 08:24:45 +02:00
/******/ // Check if module is in cache
2017-11-07 12:59:49 +01:00
/******/ if ( installedModules [ moduleId ] ) {
2016-08-23 08:24:45 +02:00
/******/ return installedModules [ moduleId ] . exports ;
2017-11-07 12:59:49 +01:00
/******/ }
2016-08-23 08:24:45 +02:00
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules [ moduleId ] = {
2017-11-07 12:59:49 +01:00
/******/ i : moduleId ,
/******/ l : false ,
/******/ exports : { }
2016-08-23 08:24:45 +02:00
/******/ } ;
2017-11-07 12:59:49 +01:00
/******/
2016-08-23 08:24:45 +02:00
/******/ // Execute the module function
/******/ modules [ moduleId ] . call ( module . exports , module , module . exports , _ _webpack _require _ _ ) ;
2017-11-07 12:59:49 +01:00
/******/
2016-08-23 08:24:45 +02:00
/******/ // Flag the module as loaded
2017-11-07 12:59:49 +01:00
/******/ module . l = true ;
/******/
2016-08-23 08:24:45 +02:00
/******/ // Return the exports of the module
/******/ return module . exports ;
/******/ }
2017-11-07 12:59:49 +01:00
/******/
/******/
2016-08-23 08:24:45 +02:00
/******/ // expose the modules object (__webpack_modules__)
/******/ _ _webpack _require _ _ . m = modules ;
2017-11-07 12:59:49 +01:00
/******/
2016-08-23 08:24:45 +02:00
/******/ // expose the module cache
/******/ _ _webpack _require _ _ . c = installedModules ;
2017-11-07 12:59:49 +01:00
/******/
/******/ // define getter function for harmony exports
/******/ _ _webpack _require _ _ . d = function ( exports , name , getter ) {
/******/ if ( ! _ _webpack _require _ _ . o ( exports , name ) ) {
2019-02-09 19:13:25 +01:00
/******/ Object . defineProperty ( exports , name , { enumerable : true , get : getter } ) ;
2017-11-07 12:59:49 +01:00
/******/ }
/******/ } ;
/******/
2019-02-09 19:13:25 +01:00
/******/ // define __esModule on exports
/******/ _ _webpack _require _ _ . r = function ( exports ) {
/******/ if ( typeof Symbol !== 'undefined' && Symbol . toStringTag ) {
/******/ Object . defineProperty ( exports , Symbol . toStringTag , { value : 'Module' } ) ;
/******/ }
/******/ Object . defineProperty ( exports , '__esModule' , { value : true } ) ;
/******/ } ;
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ _ _webpack _require _ _ . t = function ( value , mode ) {
/******/ if ( mode & 1 ) value = _ _webpack _require _ _ ( value ) ;
/******/ if ( mode & 8 ) return value ;
/******/ if ( ( mode & 4 ) && typeof value === 'object' && value && value . _ _esModule ) return value ;
/******/ var ns = Object . create ( null ) ;
/******/ _ _webpack _require _ _ . r ( ns ) ;
/******/ Object . defineProperty ( ns , 'default' , { enumerable : true , value : value } ) ;
/******/ if ( mode & 2 && typeof value != 'string' ) for ( var key in value ) _ _webpack _require _ _ . d ( ns , key , function ( key ) { return value [ key ] ; } . bind ( null , key ) ) ;
/******/ return ns ;
/******/ } ;
/******/
2017-11-07 12:59:49 +01:00
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ _ _webpack _require _ _ . n = function ( module ) {
/******/ var getter = module && module . _ _esModule ?
/******/ function getDefault ( ) { return module [ 'default' ] ; } :
/******/ function getModuleExports ( ) { return module ; } ;
/******/ _ _webpack _require _ _ . d ( getter , 'a' , getter ) ;
/******/ return getter ;
/******/ } ;
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ _ _webpack _require _ _ . o = function ( object , property ) { return Object . prototype . hasOwnProperty . call ( object , property ) ; } ;
/******/
2016-08-23 08:24:45 +02:00
/******/ // __webpack_public_path__
2018-05-25 15:00:27 +02:00
/******/ _ _webpack _require _ _ . p = "/public/assets/scripts/" ;
2017-11-07 12:59:49 +01:00
/******/
2019-02-09 19:13:25 +01:00
/******/
2016-08-23 08:24:45 +02:00
/******/ // Load entry module and return exports
2019-10-28 20:53:24 +01:00
/******/ return _ _webpack _require _ _ ( _ _webpack _require _ _ . s = 4 ) ;
2016-08-23 08:24:45 +02:00
/******/ } )
/************************************************************************/
/******/ ( [
/* 0 */
2017-11-13 20:13:37 +01:00
/***/ ( function ( module , exports , _ _webpack _require _ _ ) {
2019-10-22 23:20:40 +02:00
"use strict" ;
2017-11-13 20:13:37 +01:00
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var isMergeableObject = function isMergeableObject ( value ) {
return isNonNullObject ( value )
&& ! isSpecial ( value )
2017-11-15 07:51:53 +01:00
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function isNonNullObject ( value ) {
return ! ! value && typeof value === 'object'
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
function isSpecial ( value ) {
var stringValue = Object . prototype . toString . call ( value ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return stringValue === '[object RegExp]'
|| stringValue === '[object Date]'
|| isReactElement ( value )
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
// see https://github.com/facebook/react/blob/b5ac963fb791d1298e7f396236383bc955f916c1/src/isomorphic/classic/element/ReactElement.js#L21-L25
var canUseSymbol = typeof Symbol === 'function' && Symbol . for ;
var REACT _ELEMENT _TYPE = canUseSymbol ? Symbol . for ( 'react.element' ) : 0xeac7 ;
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
function isReactElement ( value ) {
return value . $$typeof === REACT _ELEMENT _TYPE
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
function emptyTarget ( val ) {
return Array . isArray ( val ) ? [ ] : { }
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function cloneUnlessOtherwiseSpecified ( value , options ) {
return ( options . clone !== false && options . isMergeableObject ( value ) )
? deepmerge ( emptyTarget ( value ) , value , options )
: value
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function defaultArrayMerge ( target , source , options ) {
return target . concat ( source ) . map ( function ( element ) {
return cloneUnlessOtherwiseSpecified ( element , options )
} )
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function getMergeFunction ( key , options ) {
if ( ! options . customMerge ) {
return deepmerge
}
var customMerge = options . customMerge ( key ) ;
return typeof customMerge === 'function' ? customMerge : deepmerge
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function getEnumerableOwnPropertySymbols ( target ) {
return Object . getOwnPropertySymbols
? Object . getOwnPropertySymbols ( target ) . filter ( function ( symbol ) {
return target . propertyIsEnumerable ( symbol )
} )
: [ ]
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function getKeys ( target ) {
return Object . keys ( target ) . concat ( getEnumerableOwnPropertySymbols ( target ) )
}
2019-02-22 23:06:59 +01:00
2019-10-22 23:20:40 +02:00
// Protects from prototype poisoning and unexpected merging up the prototype chain.
function propertyIsUnsafe ( target , key ) {
try {
return ( key in target ) // Properties are safe to merge if they don't exist in the target yet,
&& ! ( Object . hasOwnProperty . call ( target , key ) // unsafe if they exist up the prototype chain,
&& Object . propertyIsEnumerable . call ( target , key ) ) // and also unsafe if they're nonenumerable.
} catch ( unused ) {
// Counterintuitively, it's safe to merge any property on a target that causes the `in` operator to throw.
// This happens when trying to copy an object in the source over a plain string in the target.
return false
}
}
2019-02-22 23:06:59 +01:00
2019-10-22 23:20:40 +02:00
function mergeObject ( target , source , options ) {
var destination = { } ;
if ( options . isMergeableObject ( target ) ) {
getKeys ( target ) . forEach ( function ( key ) {
destination [ key ] = cloneUnlessOtherwiseSpecified ( target [ key ] , options ) ;
} ) ;
}
getKeys ( source ) . forEach ( function ( key ) {
if ( propertyIsUnsafe ( target , key ) ) {
return
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( ! options . isMergeableObject ( source [ key ] ) || ! target [ key ] ) {
destination [ key ] = cloneUnlessOtherwiseSpecified ( source [ key ] , options ) ;
} else {
destination [ key ] = getMergeFunction ( key , options ) ( target [ key ] , source [ key ] , options ) ;
}
} ) ;
return destination
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function deepmerge ( target , source , options ) {
options = options || { } ;
options . arrayMerge = options . arrayMerge || defaultArrayMerge ;
options . isMergeableObject = options . isMergeableObject || isMergeableObject ;
// cloneUnlessOtherwiseSpecified is added to `options` so that custom arrayMerge()
// implementations can use it. The caller may not replace it.
options . cloneUnlessOtherwiseSpecified = cloneUnlessOtherwiseSpecified ;
2019-02-22 23:06:59 +01:00
2019-10-22 23:20:40 +02:00
var sourceIsArray = Array . isArray ( source ) ;
var targetIsArray = Array . isArray ( target ) ;
var sourceAndTargetTypesMatch = sourceIsArray === targetIsArray ;
2019-02-22 23:06:59 +01:00
2019-10-22 23:20:40 +02:00
if ( ! sourceAndTargetTypesMatch ) {
return cloneUnlessOtherwiseSpecified ( source , options )
} else if ( sourceIsArray ) {
return options . arrayMerge ( target , source , options )
} else {
return mergeObject ( target , source , options )
}
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
deepmerge . all = function deepmergeAll ( array , options ) {
if ( ! Array . isArray ( array ) ) {
throw new Error ( 'first argument should be an array' )
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
return array . reduce ( function ( prev , next ) {
return deepmerge ( prev , next , options )
} , { } )
2017-11-15 07:51:53 +01:00
} ;
2019-10-22 23:20:40 +02:00
var deepmerge _1 = deepmerge ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
module . exports = deepmerge _1 ;
2019-02-09 19:13:25 +01:00
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
/***/ } ) ,
2019-10-28 20:53:24 +01:00
/* 1 */
2019-10-22 23:20:40 +02:00
/***/ ( function ( module , _ _webpack _exports _ _ , _ _webpack _require _ _ ) {
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
"use strict" ;
2019-10-28 20:53:24 +01:00
/* WEBPACK VAR INJECTION */ ( function ( global , module ) { /* harmony import */ var _ponyfill _js _ _WEBPACK _IMPORTED _MODULE _0 _ _ = _ _webpack _require _ _ ( 3 ) ;
2019-10-22 23:20:40 +02:00
/* global window */
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var root ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( typeof self !== 'undefined' ) {
root = self ;
} else if ( typeof window !== 'undefined' ) {
root = window ;
} else if ( typeof global !== 'undefined' ) {
root = global ;
} else if ( true ) {
root = module ;
} else { }
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
var result = Object ( _ponyfill _js _ _WEBPACK _IMPORTED _MODULE _0 _ _ [ /* default */ "a" ] ) ( root ) ;
/* harmony default export */ _ _webpack _exports _ _ [ "a" ] = ( result ) ;
2017-11-15 07:51:53 +01:00
2019-10-29 22:19:56 +01:00
/* WEBPACK VAR INJECTION */ } . call ( this , _ _webpack _require _ _ ( 5 ) , _ _webpack _require _ _ ( 6 ) ( module ) ) )
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
/***/ } ) ,
2019-10-28 20:53:24 +01:00
/* 2 */
2019-10-22 23:20:40 +02:00
/***/ ( function ( module , exports , _ _webpack _require _ _ ) {
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
/ * !
2019-10-24 19:21:40 +02:00
* Fuse . js v3 . 4.5 - Lightweight fuzzy - search ( http : //fusejs.io)
2019-10-22 23:20:40 +02:00
*
* Copyright ( c ) 2012 - 2017 Kirollos Risk ( http : //kiro.me)
* All Rights Reserved . Apache Software License 2.0
*
* http : //www.apache.org/licenses/LICENSE-2.0
* /
2019-10-24 19:21:40 +02:00
! function ( e , t ) { true ? module . exports = t ( ) : undefined } ( this , function ( ) { return function ( e ) { var t = { } ; function n ( r ) { if ( t [ r ] ) return t [ r ] . exports ; var o = t [ r ] = { i : r , l : ! 1 , exports : { } } ; return e [ r ] . call ( o . exports , o , o . exports , n ) , o . l = ! 0 , o . exports } return n . m = e , n . c = t , n . d = function ( e , t , r ) { n . o ( e , t ) || Object . defineProperty ( e , t , { enumerable : ! 0 , get : r } ) } , n . r = function ( e ) { "undefined" != typeof Symbol && Symbol . toStringTag && Object . defineProperty ( e , Symbol . toStringTag , { value : "Module" } ) , Object . defineProperty ( e , "__esModule" , { value : ! 0 } ) } , n . t = function ( e , t ) { if ( 1 & t && ( e = n ( e ) ) , 8 & t ) return e ; if ( 4 & t && "object" == typeof e && e && e . _ _esModule ) return e ; var r = Object . create ( null ) ; if ( n . r ( r ) , Object . defineProperty ( r , "default" , { enumerable : ! 0 , value : e } ) , 2 & t && "string" != typeof e ) for ( var o in e ) n . d ( r , o , function ( t ) { return e [ t ] } . bind ( null , o ) ) ; return r } , n . n = function ( e ) { var t = e && e . _ _esModule ? function ( ) { return e . default } : function ( ) { return e } ; return n . d ( t , "a" , t ) , t } , n . o = function ( e , t ) { return Object . prototype . hasOwnProperty . call ( e , t ) } , n . p = "" , n ( n . s = 1 ) } ( [ function ( e , t ) { e . exports = function ( e ) { return Array . isArray ? Array . isArray ( e ) : "[object Array]" === Object . prototype . toString . call ( e ) } } , function ( e , t , n ) { function r ( e ) { return ( r = "function" == typeof Symbol && "symbol" == typeof Symbol . iterator ? function ( e ) { return typeof e } : function ( e ) { return e && "function" == typeof Symbol && e . constructor === Symbol && e !== Symbol . prototype ? "symbol" : typeof e } ) ( e ) } function o ( e , t ) { for ( var n = 0 ; n < t . length ; n ++ ) { var r = t [ n ] ; r . enumerable = r . enumerable || ! 1 , r . configurable = ! 0 , "value" in r && ( r . writable = ! 0 ) , Object . defineProperty ( e , r . key , r ) } } var i = n ( 2 ) , a = n ( 8 ) , s = n ( 0 ) , c = function ( ) { function e ( t , n ) { var r = n . location , o = void 0 === r ? 0 : r , i = n . distance , s = void 0 === i ? 100 : i , c = n . threshold , h = void 0 === c ? . 6 : c , l = n . maxPatternLength , u = void 0 === l ? 32 : l , f = n . caseSensitive , d = void 0 !== f && f , v = n . tokenSeparator , p = void 0 === v ? / +/g : v , g = n . findAllMatches , y = void 0 !== g && g , m = n . minMatchCharLength , k = void 0 === m ? 1 : m , S = n . id , x = void 0 === S ? null : S , b = n . keys , M = void 0 === b ? [ ] : b , _ = n . shouldSort , L = void 0 === _ || _ , w = n . getFn , A = void 0 === w ? a : w , C = n . sortFn , I = void 0 === C ? function ( e , t ) { return e . score - t . score } : C , O = n . tokenize , j = void 0 !== O && O , P = n . matchAllTokens , F = void 0 !== P && P , T = n . includeMatches , z = void 0 !== T && T , E = n . includeScore , K = void 0 !== E && E , $ = n . verbose , J = void 0 !== $ && $ ; ! function ( e , t ) { if ( ! ( e instanceof t ) ) throw new TypeError ( "Cannot call a class as a function" ) } ( this , e ) , this . options = { location : o , distance : s , threshold : h , maxPatternLength : u , isCaseSensitive : d , tokenSeparator : p , findAllMatches : y , minMatchCharLength : k , id : x , keys : M , includeMatches : z , includeScore : K , shouldSort : L , getFn : A , sortFn : I , verbose : J , tokenize : j , matchAllTokens : F } , this . setCollection ( t ) } var t , n , c ; return t = e , ( n = [ { key : "setCollection" , value : function ( e ) { return this . list = e , e } } , { key : "search" , value : function ( e ) { var t = arguments . length > 1 && void 0 !== arguments [ 1 ] ? arguments [ 1 ] : { limit : ! 1 } ; this . _log ( '---------\nSearch pattern: "' . concat ( e , '"' ) ) ; var n = this . _prepareSearchers ( e ) , r = n . tokenSearchers , o = n . fullSearcher , i = this . _search ( r , o ) , a = i . weights , s = i . results ; return this . _computeScore ( a , s ) , this . options . shouldSort && this . _sort ( s ) , t . limit && "number" == typeof t . limit && ( s = s . slice ( 0 , t . limit ) ) , this . _format ( s ) } } , { key : "_prepareSearchers" , value : function ( ) { var e = arguments . length > 0 && void 0 !== arguments [ 0 ] ? arguments [ 0 ] : "" , t = [ ] ; if ( this . options . tokenize ) for ( var n = e . split ( this . options . tokenSeparator ) , r = 0 , o = n . length ; r < o ; r += 1 ) t . push ( new i ( n [ r ] , this . options ) ) ; return { tokenSearchers : t , fullSearcher : new i ( e , this . options ) } } } , { key : "_search" , value : function ( ) { var e = arguments . length > 0 && void 0 !== arguments [ 0 ] ? arguments [ 0 ] : [ ] , t = arguments . length > 1 ? arguments [ 1 ] : void 0 , n = this . list , r = { } , o = [ ] ; if ( "string" == typeof n [ 0 ] ) { for ( var i = 0 , a = n . length ; i < a ; i += 1 ) this . _analyze ( { key : "" , value : n [ i ] , record : i , index : i } , { resultMap : r , results : o , tokenSearchers : e , fullSearcher : t } ) ; return { weights : null , results : o } } for ( var s = { } , c = 0 , h = n . length ; c < h ; c += 1 ) for ( var l = n [ c ] , u = 0 , f = this . options . keys . length ; u < f ; u += 1 ) { var d = this . options . keys [ u ] ; if ( "string" != typeof d ) { if ( s [ d . name ] = { weight : 1 - d . weight || 1 } , d . weight <= 0 || d . weight > 1 ) throw new Error ( "Key weight has to be > 0 and <= 1" ) ; d = d . name } else s [ d ] = { weight : 1 } ; this . _analyze ( { key : d , value : this . options . getFn ( l , d ) , record : l , i
2019-10-22 23:20:40 +02:00
/***/ } ) ,
2019-10-28 20:53:24 +01:00
/* 3 */
2019-02-09 19:13:25 +01:00
/***/ ( function ( module , _ _webpack _exports _ _ , _ _webpack _require _ _ ) {
2019-01-26 13:36:47 +01:00
2019-02-09 19:13:25 +01:00
"use strict" ;
/* harmony export (binding) */ _ _webpack _require _ _ . d ( _ _webpack _exports _ _ , "a" , function ( ) { return symbolObservablePonyfill ; } ) ;
function symbolObservablePonyfill ( root ) {
var result ;
var Symbol = root . Symbol ;
2019-01-26 13:36:47 +01:00
2019-02-09 19:13:25 +01:00
if ( typeof Symbol === 'function' ) {
if ( Symbol . observable ) {
result = Symbol . observable ;
} else {
result = Symbol ( 'observable' ) ;
Symbol . observable = result ;
}
} else {
result = '@@observable' ;
}
2019-01-26 13:36:47 +01:00
2019-02-09 19:13:25 +01:00
return result ;
} ;
2016-08-23 08:24:45 +02:00
2017-02-17 10:26:08 +01:00
2017-11-15 07:51:53 +01:00
/***/ } ) ,
2019-10-28 20:53:24 +01:00
/* 4 */
2019-10-22 23:20:40 +02:00
/***/ ( function ( module , exports , _ _webpack _require _ _ ) {
2017-02-17 10:26:08 +01:00
2019-10-29 22:19:56 +01:00
module . exports = _ _webpack _require _ _ ( 7 ) ;
2017-02-17 10:26:08 +01:00
2019-02-09 19:13:25 +01:00
/***/ } ) ,
2019-10-28 20:53:24 +01:00
/* 5 */
2019-10-22 23:20:40 +02:00
/***/ ( function ( module , exports ) {
2017-02-17 10:26:08 +01:00
2019-10-22 23:20:40 +02:00
var g ;
2017-02-17 10:26:08 +01:00
2019-10-22 23:20:40 +02:00
// This works in non-strict mode
g = ( function ( ) {
return this ;
} ) ( ) ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
try {
// This works if eval is allowed (see CSP)
g = g || new Function ( "return this" ) ( ) ;
} catch ( e ) {
// This works if the window reference is available
if ( typeof window === "object" ) g = window ;
}
2019-10-15 10:49:38 +02:00
2019-10-22 23:20:40 +02:00
// g can still be undefined, but nothing to do about it...
// We return undefined, instead of nothing here, so it's
// easier to handle this case. if(!global) { ...}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
module . exports = g ;
2017-02-17 10:26:08 +01:00
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
/***/ } ) ,
2019-10-29 22:19:56 +01:00
/* 6 */
2019-10-22 23:20:40 +02:00
/***/ ( function ( module , exports ) {
2017-02-17 10:26:08 +01:00
2019-10-22 23:20:40 +02:00
module . exports = function ( originalModule ) {
if ( ! originalModule . webpackPolyfill ) {
var module = Object . create ( originalModule ) ;
// module.parent = undefined by default
if ( ! module . children ) module . children = [ ] ;
Object . defineProperty ( module , "loaded" , {
enumerable : true ,
get : function ( ) {
return module . l ;
}
} ) ;
Object . defineProperty ( module , "id" , {
enumerable : true ,
get : function ( ) {
return module . i ;
}
} ) ;
Object . defineProperty ( module , "exports" , {
enumerable : true
} ) ;
module . webpackPolyfill = 1 ;
}
return module ;
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
/***/ } ) ,
2019-10-29 22:19:56 +01:00
/* 7 */
2019-10-22 23:20:40 +02:00
/***/ ( function ( module , _ _webpack _exports _ _ , _ _webpack _require _ _ ) {
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
"use strict" ;
_ _webpack _require _ _ . r ( _ _webpack _exports _ _ ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
// EXTERNAL MODULE: ./node_modules/fuse.js/dist/fuse.js
2019-10-28 20:53:24 +01:00
var dist _fuse = _ _webpack _require _ _ ( 2 ) ;
2019-10-22 23:20:40 +02:00
var fuse _default = /*#__PURE__*/ _ _webpack _require _ _ . n ( dist _fuse ) ;
2018-02-02 12:08:03 +01:00
2019-10-22 23:20:40 +02:00
// EXTERNAL MODULE: ./node_modules/deepmerge/dist/cjs.js
2019-10-28 20:53:24 +01:00
var cjs = _ _webpack _require _ _ ( 0 ) ;
2019-10-22 23:20:40 +02:00
var cjs _default = /*#__PURE__*/ _ _webpack _require _ _ . n ( cjs ) ;
2018-02-02 12:08:03 +01:00
2019-10-22 23:20:40 +02:00
// EXTERNAL MODULE: ./node_modules/symbol-observable/es/index.js
2019-10-28 20:53:24 +01:00
var es = _ _webpack _require _ _ ( 1 ) ;
2018-02-02 12:08:03 +01:00
2019-10-22 23:20:40 +02:00
// CONCATENATED MODULE: ./node_modules/redux/es/redux.js
2018-02-02 12:08:03 +01:00
2017-11-07 12:59:49 +01:00
2017-11-13 20:13:37 +01:00
/ * *
2019-10-22 23:20:40 +02:00
* These are private action types reserved by Redux .
* For any unknown actions , you must return the current state .
* If the current state is undefined , you must return the initial state .
* Do not reference these action types directly in your code .
2017-11-13 20:13:37 +01:00
* /
2019-10-22 23:20:40 +02:00
var randomString = function randomString ( ) {
return Math . random ( ) . toString ( 36 ) . substring ( 7 ) . split ( '' ) . join ( '.' ) ;
} ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
var ActionTypes = {
INIT : "@@redux/INIT" + randomString ( ) ,
REPLACE : "@@redux/REPLACE" + randomString ( ) ,
PROBE _UNKNOWN _ACTION : function PROBE _UNKNOWN _ACTION ( ) {
return "@@redux/PROBE_UNKNOWN_ACTION" + randomString ( ) ;
}
} ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
/ * *
* @ param { any } obj The object to inspect .
* @ returns { boolean } True if the argument appears to be a plain object .
* /
function isPlainObject ( obj ) {
if ( typeof obj !== 'object' || obj === null ) return false ;
var proto = obj ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
while ( Object . getPrototypeOf ( proto ) !== null ) {
proto = Object . getPrototypeOf ( proto ) ;
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
return Object . getPrototypeOf ( obj ) === proto ;
}
2018-10-13 12:19:24 +02:00
2019-10-22 23:20:40 +02:00
/ * *
* 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 .
*
* 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
* into a single reducer function by using ` combineReducers ` .
*
* @ param { Function } reducer A function that returns the next state tree , given
* the current state tree and the action to handle .
*
* @ 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
* previously serialized user session .
* If you use ` combineReducers ` to produce the root reducer function , this must be
* an object with the same shape as ` combineReducers ` keys .
*
* @ param { Function } [ enhancer ] The store enhancer . You may optionally specify it
* to enhance the store with third - party capabilities such as middleware ,
* time travel , persistence , etc . The only store enhancer that ships with Redux
* is ` applyMiddleware() ` .
*
* @ returns { Store } A Redux store that lets you read the state , dispatch actions
* and subscribe to changes .
* /
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function createStore ( reducer , preloadedState , enhancer ) {
var _ref2 ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( typeof preloadedState === 'function' && typeof enhancer === 'function' || typeof enhancer === 'function' && typeof arguments [ 3 ] === 'function' ) {
throw new Error ( 'It looks like you are passing several store enhancers to ' + 'createStore(). This is not supported. Instead, compose them ' + 'together to a single function.' ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( typeof preloadedState === 'function' && typeof enhancer === 'undefined' ) {
enhancer = preloadedState ;
preloadedState = undefined ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( typeof enhancer !== 'undefined' ) {
if ( typeof enhancer !== 'function' ) {
throw new Error ( 'Expected the enhancer to be a function.' ) ;
2018-10-13 12:19:24 +02:00
}
2019-10-22 23:20:40 +02:00
return enhancer ( createStore ) ( reducer , preloadedState ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( typeof reducer !== 'function' ) {
throw new Error ( 'Expected the reducer to be a function.' ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var currentReducer = reducer ;
var currentState = preloadedState ;
var currentListeners = [ ] ;
var nextListeners = currentListeners ;
var isDispatching = false ;
/ * *
* This makes a shallow copy of currentListeners so we can use
* nextListeners as a temporary list while dispatching .
*
* This prevents any bugs around consumers calling
* subscribe / unsubscribe in the middle of a dispatch .
* /
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function ensureCanMutateNextListeners ( ) {
if ( nextListeners === currentListeners ) {
nextListeners = currentListeners . slice ( ) ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
}
/ * *
* Reads the state tree managed by the store .
*
* @ returns { any } The current state tree of your application .
* /
2017-11-07 12:59:49 +01:00
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
function getState ( ) {
if ( isDispatching ) {
throw new Error ( 'You may not call store.getState() while the reducer is executing. ' + 'The reducer has already received the state as an argument. ' + 'Pass it down from the top reducer instead of reading it from the store.' ) ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return currentState ;
}
/ * *
* Adds a change listener . It will be called any time an action is dispatched ,
* and some part of the state tree may potentially have changed . You may then
* call ` getState() ` to read the current state tree inside the callback .
*
* You may call ` dispatch() ` from a change listener , with the following
* caveats :
*
* 1. The subscriptions are snapshotted just before every ` dispatch() ` call .
* If you subscribe or unsubscribe while the listeners are being invoked , this
* will not have any effect on the ` dispatch() ` that is currently in progress .
* However , the next ` dispatch() ` call , whether nested or not , will use a more
* recent snapshot of the subscription list .
*
* 2. The listener should not expect to see all state changes , as the state
* might have been updated multiple times during a nested ` dispatch() ` before
* the listener is called . It is , however , guaranteed that all subscribers
* registered before the ` dispatch() ` started will be called with the latest
* state by the time it exits .
*
* @ param { Function } listener A callback to be invoked on every dispatch .
* @ returns { Function } A function to remove this change listener .
* /
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
function subscribe ( listener ) {
if ( typeof listener !== 'function' ) {
throw new Error ( 'Expected the listener to be a function.' ) ;
2017-11-15 07:51:53 +01:00
}
2018-10-13 12:19:24 +02:00
2019-10-22 23:20:40 +02:00
if ( isDispatching ) {
throw new Error ( 'You may not call store.subscribe() while the reducer is executing. ' + 'If you would like to be notified after the store has been updated, subscribe from a ' + 'component and invoke store.getState() in the callback to access the latest state. ' + 'See https://redux.js.org/api-reference/store#subscribe(listener) for more details.' ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var isSubscribed = true ;
ensureCanMutateNextListeners ( ) ;
nextListeners . push ( listener ) ;
return function unsubscribe ( ) {
if ( ! isSubscribed ) {
return ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( isDispatching ) {
throw new Error ( 'You may not unsubscribe from a store listener while the reducer is executing. ' + 'See https://redux.js.org/api-reference/store#subscribe(listener) for more details.' ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
isSubscribed = false ;
ensureCanMutateNextListeners ( ) ;
var index = nextListeners . indexOf ( listener ) ;
nextListeners . splice ( index , 1 ) ;
} ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
/ * *
* Dispatches an action . It is the only way to trigger a state change .
*
* The ` reducer ` function , used to create the store , will be called with the
* current state tree and the given ` action ` . Its return value will
* be considered the * * next * * state of the tree , and the change listeners
* will be notified .
*
* The base implementation only supports plain object actions . If you want to
* dispatch a Promise , an Observable , a thunk , or something else , you need to
* wrap your store creating function into the corresponding middleware . For
* example , see the documentation for the ` redux-thunk ` package . Even the
* middleware will eventually dispatch plain object actions using this method .
*
* @ param { Object } action A plain object representing “ what changed ” . It is
* a good idea to keep actions serializable so you can record and replay user
* sessions , or use the time travelling ` redux-devtools ` . An action must have
* a ` type ` property which may not be ` undefined ` . It is a good idea to use
* string constants for action types .
*
* @ returns { Object } For convenience , the same action object you dispatched .
*
* Note that , if you use a custom middleware , it may wrap ` dispatch() ` to
* return something else ( for example , a Promise you can await ) .
* /
2019-02-09 19:13:25 +01:00
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
function dispatch ( action ) {
if ( ! isPlainObject ( action ) ) {
throw new Error ( 'Actions must be plain objects. ' + 'Use custom middleware for async actions.' ) ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( typeof action . type === 'undefined' ) {
throw new Error ( 'Actions may not have an undefined "type" property. ' + 'Have you misspelled a constant?' ) ;
}
2018-10-30 23:10:21 +01:00
2019-10-22 23:20:40 +02:00
if ( isDispatching ) {
throw new Error ( 'Reducers may not dispatch actions.' ) ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
try {
isDispatching = true ;
currentState = currentReducer ( currentState , action ) ;
} finally {
isDispatching = false ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var listeners = currentListeners = nextListeners ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
for ( var i = 0 ; i < listeners . length ; i ++ ) {
var listener = listeners [ i ] ;
listener ( ) ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return action ;
}
/ * *
* Replaces the reducer currently used by the store to calculate the state .
*
* You might need this if your app implements code splitting and you want to
* load some of the reducers dynamically . You might also need this if you
* implement a hot reloading mechanism for Redux .
*
* @ param { Function } nextReducer The reducer for the store to use instead .
* @ returns { void }
* /
2019-02-09 19:13:25 +01:00
2018-10-13 12:19:24 +02:00
2019-10-22 23:20:40 +02:00
function replaceReducer ( nextReducer ) {
if ( typeof nextReducer !== 'function' ) {
throw new Error ( 'Expected the nextReducer to be a function.' ) ;
}
2018-10-30 23:10:21 +01:00
2019-10-22 23:20:40 +02:00
currentReducer = nextReducer ; // This action has a similiar effect to ActionTypes.INIT.
// Any reducers that existed in both the new and old rootReducer
// will receive the previous state. This effectively populates
// the new state tree with any relevant data from the old one.
2018-10-30 23:10:21 +01:00
2019-10-22 23:20:40 +02:00
dispatch ( {
type : ActionTypes . REPLACE
} ) ;
}
/ * *
* Interoperability point for observable / reactive libraries .
* @ returns { observable } A minimal observable of state changes .
* For more information , see the observable proposal :
* https : //github.com/tc39/proposal-observable
* /
2018-05-25 15:00:27 +02:00
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
function observable ( ) {
var _ref ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var outerSubscribe = subscribe ;
return _ref = {
/ * *
* The minimal observable subscription method .
* @ param { Object } observer Any object that can be used as an observer .
* The observer object should have a ` next ` method .
* @ returns { subscription } An object with an ` unsubscribe ` method that can
* be used to unsubscribe the observable from the store , and prevent further
* emission of values from the observable .
* /
subscribe : function subscribe ( observer ) {
if ( typeof observer !== 'object' || observer === null ) {
throw new TypeError ( 'Expected the observer to be an object.' ) ;
}
2018-02-02 12:08:03 +01:00
2019-10-22 23:20:40 +02:00
function observeState ( ) {
if ( observer . next ) {
observer . next ( getState ( ) ) ;
}
}
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
observeState ( ) ;
var unsubscribe = outerSubscribe ( observeState ) ;
return {
unsubscribe : unsubscribe
} ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
} , _ref [ es [ "a" /* default */ ] ] = function ( ) {
return this ;
} , _ref ;
} // When a store is created, an "INIT" action is dispatched so that every
// reducer returns their initial state. This effectively populates
// the initial state tree.
2017-11-07 12:59:49 +01:00
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
dispatch ( {
type : ActionTypes . INIT
} ) ;
return _ref2 = {
dispatch : dispatch ,
subscribe : subscribe ,
getState : getState ,
replaceReducer : replaceReducer
} , _ref2 [ es [ "a" /* default */ ] ] = observable , _ref2 ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
/ * *
* Prints a warning in the console if it exists .
*
* @ param { String } message The warning message .
* @ returns { void }
* /
function warning ( message ) {
/* eslint-disable no-console */
if ( typeof console !== 'undefined' && typeof console . error === 'function' ) {
console . error ( message ) ;
}
/* eslint-enable no-console */
2017-11-07 12:59:49 +01:00
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
try {
// This error was thrown as a convenience so that if you enable
// "break on all exceptions" in your console,
// it would pause the execution at this line.
throw new Error ( message ) ;
} catch ( e ) { } // eslint-disable-line no-empty
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function getUndefinedStateErrorMessage ( key , action ) {
var actionType = action && action . type ;
var actionDescription = actionType && "action \"" + String ( actionType ) + "\"" || 'an action' ;
return "Given " + actionDescription + ", 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." ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function getUnexpectedStateShapeWarningMessage ( inputState , reducers , action , unexpectedKeyCache ) {
var reducerKeys = Object . keys ( reducers ) ;
var argumentName = action && action . type === ActionTypes . INIT ? 'preloadedState argument passed to createStore' : 'previous state received by the reducer' ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( reducerKeys . length === 0 ) {
return 'Store does not have a valid reducer. Make sure the argument passed ' + 'to combineReducers is an object whose values are reducers.' ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( ! isPlainObject ( inputState ) ) {
return "The " + argumentName + " has unexpected type of \"" + { } . toString . call ( inputState ) . match ( /\s([a-z|A-Z]+)/ ) [ 1 ] + "\". Expected argument to be an object with the following " + ( "keys: \"" + reducerKeys . join ( '", "' ) + "\"" ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var unexpectedKeys = Object . keys ( inputState ) . filter ( function ( key ) {
return ! reducers . hasOwnProperty ( key ) && ! unexpectedKeyCache [ key ] ;
} ) ;
unexpectedKeys . forEach ( function ( key ) {
unexpectedKeyCache [ key ] = true ;
} ) ;
if ( action && action . type === ActionTypes . REPLACE ) return ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( unexpectedKeys . length > 0 ) {
return "Unexpected " + ( unexpectedKeys . length > 1 ? 'keys' : 'key' ) + " " + ( "\"" + unexpectedKeys . join ( '", "' ) + "\" found in " + argumentName + ". " ) + "Expected to find one of the known reducer keys instead: " + ( "\"" + reducerKeys . join ( '", "' ) + "\". Unexpected keys will be ignored." ) ;
}
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
function assertReducerShape ( reducers ) {
Object . keys ( reducers ) . forEach ( function ( key ) {
var reducer = reducers [ key ] ;
var initialState = reducer ( undefined , {
type : ActionTypes . INIT
} ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
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. If you don't want to set a value for this reducer, " + "you can use null instead of undefined." ) ;
2017-11-07 12:59:49 +01:00
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( typeof reducer ( undefined , {
type : ActionTypes . PROBE _UNKNOWN _ACTION ( )
} ) === 'undefined' ) {
throw new Error ( "Reducer \"" + key + "\" returned undefined when probed with a random type. " + ( "Don't try to handle " + 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." ) ;
2017-11-07 12:59:49 +01:00
}
2019-10-22 23:20:40 +02:00
} ) ;
}
/ * *
* Turns an object whose values are different reducer functions , into a single
* reducer function . It will call every child reducer , and gather their results
* into a single state object , whose keys correspond to the keys of the passed
* reducer functions .
*
* @ param { Object } reducers An object whose values correspond to different
* reducer functions that need to be combined into one . One handy way to obtain
* it is to use ES6 ` import * as reducers ` syntax . The reducers may never return
* undefined for any action . Instead , they should return their initial state
* if the state passed to them was undefined , and the current state for any
* unrecognized action .
*
* @ returns { Function } A reducer function that invokes every reducer inside the
* passed object , and builds a state object with the same shape .
* /
2018-05-25 15:00:27 +02:00
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function combineReducers ( reducers ) {
var reducerKeys = Object . keys ( reducers ) ;
var finalReducers = { } ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
for ( var i = 0 ; i < reducerKeys . length ; i ++ ) {
var key = reducerKeys [ i ] ;
2018-02-02 12:08:03 +01:00
2019-10-22 23:20:40 +02:00
if ( false ) { }
2018-02-02 12:08:03 +01:00
2019-10-22 23:20:40 +02:00
if ( typeof reducers [ key ] === 'function' ) {
finalReducers [ key ] = reducers [ key ] ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
var finalReducerKeys = Object . keys ( finalReducers ) ; // This is used to make sure we don't warn about the same
// keys multiple times.
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var unexpectedKeyCache ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( false ) { }
2018-02-02 12:08:03 +01:00
2019-10-22 23:20:40 +02:00
var shapeAssertionError ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
try {
assertReducerShape ( finalReducers ) ;
} catch ( e ) {
shapeAssertionError = e ;
}
2018-02-02 12:08:03 +01:00
2019-10-22 23:20:40 +02:00
return function combination ( state , action ) {
if ( state === void 0 ) {
state = { } ;
2017-11-15 07:51:53 +01:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( shapeAssertionError ) {
throw shapeAssertionError ;
2017-11-15 07:51:53 +01:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( false ) { var warningMessage ; }
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var hasChanged = false ;
var nextState = { } ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
for ( var _i = 0 ; _i < finalReducerKeys . length ; _i ++ ) {
var _key = finalReducerKeys [ _i ] ;
var reducer = finalReducers [ _key ] ;
var previousStateForKey = state [ _key ] ;
var nextStateForKey = reducer ( previousStateForKey , action ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( typeof nextStateForKey === 'undefined' ) {
var errorMessage = getUndefinedStateErrorMessage ( _key , action ) ;
throw new Error ( errorMessage ) ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
nextState [ _key ] = nextStateForKey ;
hasChanged = hasChanged || nextStateForKey !== previousStateForKey ;
2017-11-15 07:51:53 +01:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
return hasChanged ? nextState : state ;
} ;
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
function bindActionCreator ( actionCreator , dispatch ) {
return function ( ) {
return dispatch ( actionCreator . apply ( this , arguments ) ) ;
} ;
}
/ * *
* Turns an object whose values are action creators , into an object with the
* same keys , but with every function wrapped into a ` dispatch ` call so they
* may be invoked directly . This is just a convenience method , as you can call
* ` store.dispatch(MyActionCreators.doSomething()) ` yourself just fine .
*
* For convenience , you can also pass an action creator as the first argument ,
* and get a dispatch wrapped function in return .
*
* @ param { Function | Object } actionCreators An object whose values are action
* creator functions . One handy way to obtain it is to use ES6 ` import * as `
* syntax . You may also pass a single function .
*
* @ param { Function } dispatch The ` dispatch ` function available on your Redux
* store .
*
* @ returns { Function | Object } The object mimicking the original object , but with
* every action creator wrapped into the ` dispatch ` call . If you passed a
* function as ` actionCreators ` , the return value will also be a single
* function .
* /
2019-02-09 19:13:25 +01:00
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
function bindActionCreators ( actionCreators , dispatch ) {
if ( typeof actionCreators === 'function' ) {
return bindActionCreator ( actionCreators , dispatch ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( typeof actionCreators !== 'object' || actionCreators === null ) {
throw new Error ( "bindActionCreators expected an object or a function, instead received " + ( actionCreators === null ? 'null' : typeof actionCreators ) + ". " + "Did you write \"import ActionCreators from\" instead of \"import * as ActionCreators from\"?" ) ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var boundActionCreators = { } ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
for ( var key in actionCreators ) {
var actionCreator = actionCreators [ key ] ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( typeof actionCreator === 'function' ) {
boundActionCreators [ key ] = bindActionCreator ( actionCreator , dispatch ) ;
}
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return boundActionCreators ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function _defineProperty ( obj , key , value ) {
if ( key in obj ) {
Object . defineProperty ( obj , key , {
value : value ,
enumerable : true ,
configurable : true ,
writable : true
} ) ;
} else {
obj [ key ] = value ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return obj ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function ownKeys ( object , enumerableOnly ) {
var keys = Object . keys ( object ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( Object . getOwnPropertySymbols ) {
keys . push . apply ( keys , Object . getOwnPropertySymbols ( object ) ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( enumerableOnly ) keys = keys . filter ( function ( sym ) {
return Object . getOwnPropertyDescriptor ( object , sym ) . enumerable ;
} ) ;
return keys ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function _objectSpread2 ( target ) {
for ( var i = 1 ; i < arguments . length ; i ++ ) {
var source = arguments [ i ] != null ? arguments [ i ] : { } ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( i % 2 ) {
ownKeys ( source , true ) . forEach ( function ( key ) {
_defineProperty ( target , key , source [ key ] ) ;
} ) ;
} else if ( Object . getOwnPropertyDescriptors ) {
Object . defineProperties ( target , Object . getOwnPropertyDescriptors ( source ) ) ;
} else {
ownKeys ( source ) . forEach ( function ( key ) {
Object . defineProperty ( target , key , Object . getOwnPropertyDescriptor ( source , key ) ) ;
2017-11-15 07:51:53 +01:00
} ) ;
2017-11-07 12:59:49 +01:00
}
2019-10-22 23:20:40 +02:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
return target ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
/ * *
* Composes single - argument functions from right to left . The rightmost
* function can take multiple arguments as it provides the signature for
* the resulting composite function .
*
* @ param { ... Function } funcs The functions to compose .
* @ returns { Function } A function obtained by composing the argument functions
* from right to left . For example , compose ( f , g , h ) is identical to doing
* ( ... args ) => f ( g ( h ( ... args ) ) ) .
* /
function compose ( ) {
for ( var _len = arguments . length , funcs = new Array ( _len ) , _key = 0 ; _key < _len ; _key ++ ) {
funcs [ _key ] = arguments [ _key ] ;
}
2019-01-26 13:36:47 +01:00
2019-10-22 23:20:40 +02:00
if ( funcs . length === 0 ) {
return function ( arg ) {
return arg ;
} ;
}
2018-10-13 12:19:24 +02:00
2019-10-22 23:20:40 +02:00
if ( funcs . length === 1 ) {
return funcs [ 0 ] ;
}
2018-10-13 12:19:24 +02:00
2019-10-22 23:20:40 +02:00
return funcs . reduce ( function ( a , b ) {
return function ( ) {
return a ( b . apply ( void 0 , arguments ) ) ;
} ;
} ) ;
}
2018-10-13 12:19:24 +02:00
2019-10-22 23:20:40 +02:00
/ * *
* Creates a store enhancer that applies middleware to the dispatch method
* of the Redux store . This is handy for a variety of tasks , such as expressing
* asynchronous actions in a concise manner , or logging every action payload .
*
* See ` redux-thunk ` package as an example of the Redux middleware .
*
* Because middleware is potentially asynchronous , this should be the first
* store enhancer in the composition chain .
*
* Note that each middleware will be given the ` dispatch ` and ` getState ` functions
* as named arguments .
*
* @ param { ... Function } middlewares The middleware chain to be applied .
* @ returns { Function } A store enhancer applying the middleware .
* /
2018-10-13 12:19:24 +02:00
2019-10-22 23:20:40 +02:00
function applyMiddleware ( ) {
for ( var _len = arguments . length , middlewares = new Array ( _len ) , _key = 0 ; _key < _len ; _key ++ ) {
middlewares [ _key ] = arguments [ _key ] ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return function ( createStore ) {
return function ( ) {
var store = createStore . apply ( void 0 , arguments ) ;
2018-10-13 12:19:24 +02:00
2019-10-22 23:20:40 +02:00
var _dispatch = function dispatch ( ) {
throw new Error ( 'Dispatching while constructing your middleware is not allowed. ' + 'Other middleware would not be applied to this dispatch.' ) ;
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var middlewareAPI = {
getState : store . getState ,
dispatch : function dispatch ( ) {
return _dispatch . apply ( void 0 , arguments ) ;
2018-10-13 12:19:24 +02:00
}
2019-10-22 23:20:40 +02:00
} ;
var chain = middlewares . map ( function ( middleware ) {
return middleware ( middlewareAPI ) ;
} ) ;
_dispatch = compose . apply ( void 0 , chain ) ( store . dispatch ) ;
return _objectSpread2 ( { } , store , {
dispatch : _dispatch
} ) ;
} ;
} ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
/ *
* This is a dummy function to check if the function name has been altered by minification .
* If the function has been minified and NODE _ENV !== 'production' , warn the user .
* /
2018-10-13 12:19:24 +02:00
2019-10-22 23:20:40 +02:00
function isCrushed ( ) { }
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( false ) { }
2019-02-09 19:13:25 +01:00
2018-10-13 12:19:24 +02:00
2019-10-22 23:20:40 +02:00
// CONCATENATED MODULE: ./src/scripts/reducers/items.js
var defaultState = [ ] ;
function items _items ( state , action ) {
if ( state === void 0 ) {
state = defaultState ;
}
2018-10-13 12:19:24 +02:00
2019-10-22 23:20:40 +02:00
switch ( action . type ) {
case 'ADD_ITEM' :
{
// Add object to items array
var newState = [ ] . concat ( state , [ {
id : action . id ,
choiceId : action . choiceId ,
groupId : action . groupId ,
value : action . value ,
label : action . label ,
active : true ,
highlighted : false ,
customProperties : action . customProperties ,
placeholder : action . placeholder || false ,
keyCode : null
} ] ) ;
return newState . map ( function ( obj ) {
var item = obj ;
item . highlighted = false ;
return item ;
} ) ;
}
2018-10-13 12:19:24 +02:00
2019-10-22 23:20:40 +02:00
case 'REMOVE_ITEM' :
{
// Set item to inactive
return state . map ( function ( obj ) {
var item = obj ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( item . id === action . id ) {
item . active = false ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return item ;
} ) ;
2018-10-13 12:19:24 +02:00
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
case 'HIGHLIGHT_ITEM' :
{
return state . map ( function ( obj ) {
var item = obj ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( item . id === action . id ) {
item . highlighted = action . highlighted ;
2018-05-25 15:00:27 +02:00
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return item ;
2018-05-25 15:00:27 +02:00
} ) ;
2019-10-22 23:20:40 +02:00
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
default :
{
return state ;
}
}
}
// CONCATENATED MODULE: ./src/scripts/reducers/groups.js
var groups _defaultState = [ ] ;
function groups ( state , action ) {
if ( state === void 0 ) {
state = groups _defaultState ;
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
switch ( action . type ) {
case 'ADD_GROUP' :
{
return [ ] . concat ( state , [ {
id : action . id ,
value : action . value ,
active : action . active ,
disabled : action . disabled
} ] ) ;
2017-11-15 07:51:53 +01:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
case 'CLEAR_CHOICES' :
{
return [ ] ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
default :
{
return state ;
}
}
}
// CONCATENATED MODULE: ./src/scripts/reducers/choices.js
var choices _defaultState = [ ] ;
function choices _choices ( state , action ) {
if ( state === void 0 ) {
state = choices _defaultState ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
switch ( action . type ) {
case 'ADD_CHOICE' :
{
/ *
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 )
An active choice appears within the choice dropdown
* /
return [ ] . concat ( state , [ {
id : action . id ,
elementId : action . elementId ,
groupId : action . groupId ,
value : action . value ,
label : action . label || action . value ,
disabled : action . disabled || false ,
selected : false ,
active : true ,
score : 9999 ,
customProperties : action . customProperties ,
placeholder : action . placeholder || false ,
keyCode : null
} ] ) ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
case 'ADD_ITEM' :
{
// If all choices need to be activated
if ( action . activateOptions ) {
return state . map ( function ( obj ) {
var choice = obj ;
choice . active = action . active ;
return choice ;
} ) ;
} // When an item is added and it has an associated choice,
// we want to disable it so it can't be chosen again
2017-11-15 07:51:53 +01:00
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( action . choiceId > - 1 ) {
return state . map ( function ( obj ) {
var choice = obj ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( choice . id === parseInt ( action . choiceId , 10 ) ) {
choice . selected = true ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
return choice ;
} ) ;
2018-05-25 15:00:27 +02:00
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return state ;
2018-05-25 15:00:27 +02:00
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
case 'REMOVE_ITEM' :
{
// When an item is removed and it has an associated choice,
// we want to re-enable it so it can be chosen again
if ( action . choiceId > - 1 ) {
return state . map ( function ( obj ) {
var choice = obj ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( choice . id === parseInt ( action . choiceId , 10 ) ) {
choice . selected = false ;
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
return choice ;
} ) ;
2017-11-15 07:51:53 +01:00
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
return state ;
2018-05-25 15:00:27 +02:00
}
2019-10-22 23:20:40 +02:00
case 'FILTER_CHOICES' :
{
return state . map ( function ( obj ) {
var choice = obj ; // Set active state based on whether choice is
// within filtered results
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
choice . active = action . results . some ( function ( _ref ) {
var item = _ref . item ,
score = _ref . score ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( item . id === choice . id ) {
choice . score = score ;
return true ;
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
return false ;
} ) ;
return choice ;
} ) ;
2018-05-25 15:00:27 +02:00
}
2019-10-22 23:20:40 +02:00
case 'ACTIVATE_CHOICES' :
{
return state . map ( function ( obj ) {
var choice = obj ;
choice . active = action . active ;
return choice ;
2018-06-07 17:54:11 +02:00
} ) ;
2018-05-25 15:00:27 +02:00
}
2019-10-22 23:20:40 +02:00
case 'CLEAR_CHOICES' :
{
return choices _defaultState ;
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
default :
{
return state ;
}
}
}
// CONCATENATED MODULE: ./src/scripts/reducers/general.js
var general _defaultState = {
loading : false
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var general = function general ( state , action ) {
if ( state === void 0 ) {
state = general _defaultState ;
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
switch ( action . type ) {
case 'SET_IS_LOADING' :
{
return {
loading : action . isLoading
} ;
2018-05-25 15:00:27 +02:00
}
2019-10-22 23:20:40 +02:00
default :
{
return state ;
2018-05-25 15:00:27 +02:00
}
2019-10-22 23:20:40 +02:00
}
} ;
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
/* harmony default export */ var reducers _general = ( general ) ;
// CONCATENATED MODULE: ./src/scripts/lib/utils.js
2019-11-03 18:45:16 +01:00
/ * *
* @ param { number } min
* @ param { number } max
* @ returns { number }
* /
2019-10-22 23:20:40 +02:00
var getRandomNumber = function getRandomNumber ( min , max ) {
return Math . floor ( Math . random ( ) * ( max - min ) + min ) ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { number } length
* @ returns { string }
* /
2019-02-09 19:13:25 +01:00
2019-11-03 18:45:16 +01:00
var generateChars = function generateChars ( length ) {
return Array . from ( {
length : length
} , function ( ) {
return getRandomNumber ( 0 , 36 ) . toString ( 36 ) ;
} ) . join ( '' ) ;
2019-10-22 23:20:40 +02:00
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { HTMLInputElement | HTMLSelectElement } element
* @ param { string } prefix
* @ returns { string }
* /
2019-10-22 23:20:40 +02:00
var generateId = function generateId ( element , prefix ) {
var id = element . id || element . name && element . name + "-" + generateChars ( 2 ) || generateChars ( 4 ) ;
id = id . replace ( /(:|\.|\[|\]|,)/g , '' ) ;
id = prefix + "-" + id ;
return id ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { any } obj
* @ returns { string }
* /
2019-10-22 23:20:40 +02:00
var getType = function getType ( obj ) {
return Object . prototype . toString . call ( obj ) . slice ( 8 , - 1 ) ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { string } type
* @ param { any } obj
* @ returns { boolean }
* /
2019-10-22 23:20:40 +02:00
var isType = function isType ( type , obj ) {
return obj !== undefined && obj !== null && getType ( obj ) === type ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { HTMLElement } element
* @ param { HTMLElement } [ wrapper = { HTMLDivElement } ]
* @ returns { HTMLElement }
* /
2019-10-22 23:20:40 +02:00
var utils _wrap = function wrap ( element , wrapper ) {
if ( wrapper === void 0 ) {
wrapper = document . createElement ( 'div' ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( element . nextSibling ) {
element . parentNode . insertBefore ( wrapper , element . nextSibling ) ;
} else {
element . parentNode . appendChild ( wrapper ) ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return wrapper . appendChild ( element ) ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { Element } startEl
* @ param { string } selector
* @ param { 1 | - 1 } direction
* @ returns { Element | undefined }
* /
var getAdjacentEl = function getAdjacentEl ( startEl , selector , direction ) {
2019-10-22 23:20:40 +02:00
if ( direction === void 0 ) {
direction = 1 ;
}
2018-06-07 17:54:11 +02:00
2019-11-03 18:45:16 +01:00
if ( ! ( startEl instanceof Element ) || typeof selector !== 'string' ) {
return undefined ;
2019-10-22 23:20:40 +02:00
}
2017-11-07 12:59:49 +01:00
2019-11-03 18:45:16 +01:00
var prop = ( direction > 0 ? 'next' : 'previous' ) + "ElementSibling" ;
var sibling = startEl [ prop ] ;
while ( sibling ) {
if ( sibling . matches ( selector ) ) {
return sibling ;
}
sibling = sibling [ prop ] ;
}
return sibling ;
2019-10-22 23:20:40 +02:00
} ;
2019-11-03 18:45:16 +01:00
/ * *
2019-11-08 10:19:18 +01:00
* @ param { Element } element
* @ param { Element } parent
2019-11-03 18:45:16 +01:00
* @ param { - 1 | 1 } direction
* @ returns { boolean }
* /
var isScrolledIntoView = function isScrolledIntoView ( element , parent , direction ) {
2019-10-22 23:20:40 +02:00
if ( direction === void 0 ) {
direction = 1 ;
}
2017-11-07 12:59:49 +01:00
2019-11-03 18:45:16 +01:00
if ( ! element ) {
return false ;
2019-10-22 23:20:40 +02:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var isVisible ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( direction > 0 ) {
// In view from bottom
2019-11-03 18:45:16 +01:00
isVisible = parent . scrollTop + parent . offsetHeight >= element . offsetTop + element . offsetHeight ;
2019-10-22 23:20:40 +02:00
} else {
// In view from top
2019-11-03 18:45:16 +01:00
isVisible = element . offsetTop >= parent . scrollTop ;
2019-10-22 23:20:40 +02:00
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return isVisible ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { any } value
* @ returns { any }
* /
2019-10-22 23:20:40 +02:00
var sanitise = function sanitise ( value ) {
2019-11-03 18:45:16 +01:00
if ( typeof value !== 'string' ) {
2019-10-22 23:20:40 +02:00
return value ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return value . replace ( /&/g , '&' ) . replace ( />/g , '&rt;' ) . replace ( /</g , '<' ) . replace ( /"/g , '"' ) ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
2019-11-08 10:19:18 +01:00
* @ returns { ( ) => ( str : string ) => Element }
2019-11-03 18:45:16 +01:00
* /
2019-10-22 23:20:40 +02:00
var strToEl = function ( ) {
var tmpEl = document . createElement ( 'div' ) ;
return function ( str ) {
var cleanedInput = str . trim ( ) ;
tmpEl . innerHTML = cleanedInput ;
var firldChild = tmpEl . children [ 0 ] ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
while ( tmpEl . firstChild ) {
tmpEl . removeChild ( tmpEl . firstChild ) ;
2019-01-26 13:36:47 +01:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
return firldChild ;
} ;
} ( ) ;
2019-10-29 22:19:56 +01:00
/ * *
* @ param { { label ? : string , value : string } } a
* @ param { { label ? : string , value : string } } b
* @ returns { number }
* /
2019-11-03 18:45:16 +01:00
var sortByAlpha = function sortByAlpha ( _ref , _ref2 ) {
2019-10-29 22:19:56 +01:00
var value = _ref . value ,
_ref$label = _ref . label ,
label = _ref$label === void 0 ? value : _ref$label ;
var value2 = _ref2 . value ,
_ref2$label = _ref2 . label ,
label2 = _ref2$label === void 0 ? value2 : _ref2$label ;
return label . localeCompare ( label2 , [ ] , {
sensitivity : 'base' ,
ignorePunctuation : true ,
numeric : true
} ) ;
2019-10-22 23:20:40 +02:00
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { { score : number } } a
* @ param { { score : number } } b
* /
2019-10-22 23:20:40 +02:00
var sortByScore = function sortByScore ( a , b ) {
return a . score - b . score ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { HTMLElement } element
* @ param { string } type
* @ param { object } customArgs
* /
2019-10-22 23:20:40 +02:00
var dispatchEvent = function dispatchEvent ( element , type , customArgs ) {
if ( customArgs === void 0 ) {
customArgs = null ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var event = new CustomEvent ( type , {
detail : customArgs ,
bubbles : true ,
cancelable : true
} ) ;
return element . dispatchEvent ( event ) ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { array } array
* @ param { any } value
* @ param { string } [ key = "value" ]
* @ returns { boolean }
* /
2019-10-22 23:20:40 +02:00
var existsInArray = function existsInArray ( array , value , key ) {
if ( key === void 0 ) {
key = 'value' ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
return array . some ( function ( item ) {
2019-11-03 18:45:16 +01:00
if ( typeof value === 'string' ) {
2019-10-22 23:20:40 +02:00
return item [ key ] === value . trim ( ) ;
2017-11-13 20:13:37 +01:00
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
return item [ key ] === value ;
} ) ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { any } obj
* @ returns { any }
* /
2019-10-22 23:20:40 +02:00
var cloneObject = function cloneObject ( obj ) {
return JSON . parse ( JSON . stringify ( obj ) ) ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
2019-11-07 09:50:19 +01:00
* Returns an array of keys present on the first but missing on the second object
2019-11-03 18:45:16 +01:00
* @ param { object } a
* @ param { object } b
2019-11-07 09:50:19 +01:00
* @ returns { string [ ] }
2019-11-03 18:45:16 +01:00
* /
2019-10-22 23:20:40 +02:00
var diff = function diff ( a , b ) {
var aKeys = Object . keys ( a ) . sort ( ) ;
var bKeys = Object . keys ( b ) . sort ( ) ;
return aKeys . filter ( function ( i ) {
return bKeys . indexOf ( i ) < 0 ;
} ) ;
} ;
// CONCATENATED MODULE: ./src/scripts/reducers/index.js
2017-11-07 12:59:49 +01:00
2018-05-28 17:22:22 +02:00
2017-11-07 12:59:49 +01:00
2018-05-28 17:22:22 +02:00
2019-10-22 23:20:40 +02:00
var appReducer = combineReducers ( {
items : items _items ,
groups : groups ,
choices : choices _choices ,
general : reducers _general
} ) ;
2018-05-28 17:22:22 +02:00
2019-10-22 23:20:40 +02:00
var reducers _rootReducer = function rootReducer ( passedState , action ) {
var state = passedState ; // If we are clearing all items, groups and options we reassign
// state and then pass that state to our proper reducer. This isn't
// mutating our actual state
// See: http://stackoverflow.com/a/35641992
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
if ( action . type === 'CLEAR_ALL' ) {
state = undefined ;
} else if ( action . type === 'RESET_TO' ) {
return cloneObject ( action . state ) ;
}
2018-05-27 12:57:21 +02:00
2019-10-22 23:20:40 +02:00
return appReducer ( state , action ) ;
} ;
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
/* harmony default export */ var reducers = ( reducers _rootReducer ) ;
// CONCATENATED MODULE: ./src/scripts/store/store.js
function _defineProperties ( target , props ) { for ( var i = 0 ; i < props . length ; i ++ ) { var descriptor = props [ i ] ; descriptor . enumerable = descriptor . enumerable || false ; descriptor . configurable = true ; if ( "value" in descriptor ) descriptor . writable = true ; Object . defineProperty ( target , descriptor . key , descriptor ) ; } }
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
function _createClass ( Constructor , protoProps , staticProps ) { if ( protoProps ) _defineProperties ( Constructor . prototype , protoProps ) ; if ( staticProps ) _defineProperties ( Constructor , staticProps ) ; return Constructor ; }
2017-11-13 20:13:37 +01:00
2017-11-07 12:59:49 +01:00
2019-02-09 19:13:25 +01:00
2019-11-03 18:45:16 +01:00
/ * *
* @ typedef { import ( '../../../types/index' ) . Choices . Choice } Choice
* @ typedef { import ( '../../../types/index' ) . Choices . Group } Group
* @ typedef { import ( '../../../types/index' ) . Choices . Item } Item
* /
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var store _Store =
/*#__PURE__*/
function ( ) {
function Store ( ) {
this . _store = createStore ( reducers , window . _ _REDUX _DEVTOOLS _EXTENSION _ _ && window . _ _REDUX _DEVTOOLS _EXTENSION _ _ ( ) ) ;
}
/ * *
* Subscribe store to function call ( wrapped Redux method )
* @ param { Function } onChange Function to trigger when state changes
* @ return
* /
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var _proto = Store . prototype ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . subscribe = function subscribe ( onChange ) {
this . _store . subscribe ( onChange ) ;
}
/ * *
* Dispatch event to store ( wrapped Redux method )
2019-11-03 18:45:16 +01:00
* @ param { { type : string , [ x : string ] : any } } action Action to trigger
2019-10-22 23:20:40 +02:00
* @ return
* /
;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . dispatch = function dispatch ( action ) {
this . _store . dispatch ( action ) ;
}
/ * *
* Get store object ( wrapping Redux method )
2019-11-03 18:45:16 +01:00
* @ returns { object } State
2019-10-22 23:20:40 +02:00
* /
;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
/ * *
* Get loading state from store
2019-11-03 18:45:16 +01:00
* @ returns { boolean } Loading State
2019-10-22 23:20:40 +02:00
* /
_proto . isLoading = function isLoading ( ) {
return this . state . general . loading ;
}
/ * *
* Get single choice by it ' s ID
2019-11-03 18:45:16 +01:00
* @ param { string } id
* @ returns { Choice | undefined } Found choice
2019-10-22 23:20:40 +02:00
* /
;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . getChoiceById = function getChoiceById ( id ) {
2019-11-03 18:45:16 +01:00
return this . activeChoices . find ( function ( choice ) {
return choice . id === parseInt ( id , 10 ) ;
} ) ;
2019-10-22 23:20:40 +02:00
}
/ * *
* Get group by group id
2019-11-08 10:19:18 +01:00
* @ param { number } id Group ID
2019-11-03 18:45:16 +01:00
* @ returns { Group | undefined } Group data
2019-10-22 23:20:40 +02:00
* /
;
2018-10-30 20:21:07 +01:00
2019-10-22 23:20:40 +02:00
_proto . getGroupById = function getGroupById ( id ) {
return this . groups . find ( function ( group ) {
2019-11-08 10:19:18 +01:00
return group . id === id ;
2019-10-22 23:20:40 +02:00
} ) ;
} ;
2018-05-27 12:57:21 +02:00
2019-10-22 23:20:40 +02:00
_createClass ( Store , [ {
key : "state" ,
get : function get ( ) {
return this . _store . getState ( ) ;
2018-10-13 12:19:24 +02:00
}
2019-10-22 23:20:40 +02:00
/ * *
* Get items from store
2019-11-03 18:45:16 +01:00
* @ returns { Item [ ] } Item objects
2019-10-22 23:20:40 +02:00
* /
2019-02-09 19:13:25 +01:00
2018-10-13 12:19:24 +02:00
} , {
2019-10-22 23:20:40 +02:00
key : "items" ,
get : function get ( ) {
return this . state . items ;
2017-11-07 12:59:49 +01:00
}
2019-10-22 23:20:40 +02:00
/ * *
* Get active items from store
2019-11-03 18:45:16 +01:00
* @ returns { Item [ ] } Item objects
2019-10-22 23:20:40 +02:00
* /
2017-11-13 20:13:37 +01:00
2017-11-07 12:59:49 +01:00
} , {
2019-10-22 23:20:40 +02:00
key : "activeItems" ,
get : function get ( ) {
return this . items . filter ( function ( item ) {
return item . active === true ;
} ) ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
/ * *
* Get highlighted items from store
2019-11-03 18:45:16 +01:00
* @ returns { Item [ ] } Item objects
2019-10-22 23:20:40 +02:00
* /
2017-11-15 07:51:53 +01:00
} , {
2019-10-22 23:20:40 +02:00
key : "highlightedActiveItems" ,
get : function get ( ) {
return this . items . filter ( function ( item ) {
return item . active && item . highlighted ;
} ) ;
2017-11-07 12:59:49 +01:00
}
2019-10-22 23:20:40 +02:00
/ * *
* Get choices from store
2019-11-03 18:45:16 +01:00
* @ returns { Choice [ ] } Option objects
2019-10-22 23:20:40 +02:00
* /
2017-11-07 12:59:49 +01:00
2017-11-15 07:51:53 +01:00
} , {
2019-10-22 23:20:40 +02:00
key : "choices" ,
get : function get ( ) {
return this . state . choices ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
/ * *
* Get active choices from store
2019-11-03 18:45:16 +01:00
* @ returns { Choice [ ] } Option objects
2019-10-22 23:20:40 +02:00
* /
2019-02-09 19:13:25 +01:00
2018-05-28 17:22:22 +02:00
} , {
2019-10-22 23:20:40 +02:00
key : "activeChoices" ,
get : function get ( ) {
2019-11-03 18:45:16 +01:00
return this . choices . filter ( function ( choice ) {
2019-10-22 23:20:40 +02:00
return choice . active === true ;
} ) ;
2018-05-28 17:22:22 +02:00
}
2019-10-22 23:20:40 +02:00
/ * *
* Get selectable choices from store
2019-11-03 18:45:16 +01:00
* @ returns { Choice [ ] } Option objects
2019-10-22 23:20:40 +02:00
* /
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
} , {
key : "selectableChoices" ,
get : function get ( ) {
return this . choices . filter ( function ( choice ) {
return choice . disabled !== true ;
2018-05-25 15:00:27 +02:00
} ) ;
2019-10-22 23:20:40 +02:00
}
/ * *
* Get choices that can be searched ( excluding placeholders )
2019-11-03 18:45:16 +01:00
* @ returns { Choice [ ] } Option objects
2019-10-22 23:20:40 +02:00
* /
2018-02-02 12:08:03 +01:00
2019-10-22 23:20:40 +02:00
} , {
key : "searchableChoices" ,
get : function get ( ) {
return this . selectableChoices . filter ( function ( choice ) {
return choice . placeholder !== true ;
2019-02-09 19:13:25 +01:00
} ) ;
2017-11-07 12:59:49 +01:00
}
2019-10-22 23:20:40 +02:00
/ * *
* Get placeholder choice from store
2019-11-03 18:45:16 +01:00
* @ returns { Choice | undefined } Found placeholder
2019-10-22 23:20:40 +02:00
* /
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
} , {
key : "placeholderChoice" ,
get : function get ( ) {
return [ ] . concat ( this . choices ) . reverse ( ) . find ( function ( choice ) {
return choice . placeholder === true ;
2018-11-25 13:48:49 +01:00
} ) ;
2017-11-07 12:59:49 +01:00
}
2019-10-22 23:20:40 +02:00
/ * *
* Get groups from store
2019-11-03 18:45:16 +01:00
* @ returns { Group [ ] } Group objects
2019-10-22 23:20:40 +02:00
* /
2017-11-07 12:59:49 +01:00
} , {
2019-10-22 23:20:40 +02:00
key : "groups" ,
get : function get ( ) {
return this . state . groups ;
}
/ * *
* Get active groups from store
2019-11-03 18:45:16 +01:00
* @ returns { Group [ ] } Group objects
2019-10-22 23:20:40 +02:00
* /
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
} , {
key : "activeGroups" ,
get : function get ( ) {
var groups = this . groups ,
choices = this . choices ;
return groups . filter ( function ( group ) {
var isActive = group . active === true && group . disabled === false ;
var hasActiveOptions = choices . some ( function ( choice ) {
return choice . active === true && choice . disabled === false ;
2017-11-15 07:51:53 +01:00
} ) ;
2019-10-22 23:20:40 +02:00
return isActive && hasActiveOptions ;
} , [ ] ) ;
2017-11-07 12:59:49 +01:00
}
2019-10-22 23:20:40 +02:00
} ] ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return Store ;
} ( ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
// CONCATENATED MODULE: ./src/scripts/components/dropdown.js
2019-11-03 18:45:16 +01:00
function dropdown _defineProperties ( target , props ) { for ( var i = 0 ; i < props . length ; i ++ ) { var descriptor = props [ i ] ; descriptor . enumerable = descriptor . enumerable || false ; descriptor . configurable = true ; if ( "value" in descriptor ) descriptor . writable = true ; Object . defineProperty ( target , descriptor . key , descriptor ) ; } }
function dropdown _createClass ( Constructor , protoProps , staticProps ) { if ( protoProps ) dropdown _defineProperties ( Constructor . prototype , protoProps ) ; if ( staticProps ) dropdown _defineProperties ( Constructor , staticProps ) ; return Constructor ; }
/ * *
* @ typedef { import ( '../../../types/index' ) . Choices . passedElement } passedElement
* @ typedef { import ( '../../../types/index' ) . Choices . ClassNames } ClassNames
* /
2019-10-22 23:20:40 +02:00
var Dropdown =
/*#__PURE__*/
function ( ) {
2019-11-03 18:45:16 +01:00
/ * *
* @ param { {
* element : HTMLElement ,
* type : passedElement [ 'type' ] ,
* classNames : ClassNames ,
* } } args
* /
2019-10-22 23:20:40 +02:00
function Dropdown ( _ref ) {
var element = _ref . element ,
type = _ref . type ,
classNames = _ref . classNames ;
2019-11-03 18:45:16 +01:00
this . element = element ;
this . classNames = classNames ;
this . type = type ;
2019-10-22 23:20:40 +02:00
this . isActive = false ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
/ * *
2019-11-03 18:45:16 +01:00
* Bottom position of dropdown in viewport coordinates
* @ returns { number } Vertical position
2019-10-22 23:20:40 +02:00
* /
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var _proto = Dropdown . prototype ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
/ * *
* Find element that matches passed selector
2019-11-03 18:45:16 +01:00
* @ param { string } selector
* @ returns { HTMLElement | null }
2019-10-22 23:20:40 +02:00
* /
_proto . getChild = function getChild ( selector ) {
return this . element . querySelector ( selector ) ;
}
/ * *
* Show dropdown to user by adding active state class
2019-11-03 18:45:16 +01:00
* @ returns { this }
2019-10-22 23:20:40 +02:00
* /
;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . show = function show ( ) {
this . element . classList . add ( this . classNames . activeState ) ;
this . element . setAttribute ( 'aria-expanded' , 'true' ) ;
this . isActive = true ;
return this ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
/ * *
* Hide dropdown from user
2019-11-03 18:45:16 +01:00
* @ returns { this }
2019-10-22 23:20:40 +02:00
* /
;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . hide = function hide ( ) {
this . element . classList . remove ( this . classNames . activeState ) ;
this . element . setAttribute ( 'aria-expanded' , 'false' ) ;
this . isActive = false ;
return this ;
2017-11-15 07:51:53 +01:00
} ;
2017-11-07 12:59:49 +01:00
2019-11-03 18:45:16 +01:00
dropdown _createClass ( Dropdown , [ {
key : "distanceFromTopWindow" ,
get : function get ( ) {
return this . element . getBoundingClientRect ( ) . bottom ;
}
} ] ) ;
2019-10-22 23:20:40 +02:00
return Dropdown ;
} ( ) ;
2017-11-07 12:59:49 +01:00
2019-11-03 18:45:16 +01:00
// CONCATENATED MODULE: ./src/scripts/constants.js
/ * *
* @ typedef { import ( '../../types/index' ) . Choices . ClassNames } ClassNames
* @ typedef { import ( '../../types/index' ) . Choices . Options } Options
* /
/** @type {ClassNames} */
var DEFAULT _CLASSNAMES = {
containerOuter : 'choices' ,
containerInner : 'choices__inner' ,
input : 'choices__input' ,
inputCloned : 'choices__input--cloned' ,
list : 'choices__list' ,
listItems : 'choices__list--multiple' ,
listSingle : 'choices__list--single' ,
listDropdown : 'choices__list--dropdown' ,
item : 'choices__item' ,
itemSelectable : 'choices__item--selectable' ,
itemDisabled : 'choices__item--disabled' ,
itemChoice : 'choices__item--choice' ,
placeholder : 'choices__placeholder' ,
group : 'choices__group' ,
groupHeading : 'choices__heading' ,
button : 'choices__button' ,
activeState : 'is-active' ,
focusState : 'is-focused' ,
openState : 'is-open' ,
disabledState : 'is-disabled' ,
highlightedState : 'is-highlighted' ,
2019-11-13 16:40:47 +01:00
selectedState : 'is-selected' ,
2019-11-03 18:45:16 +01:00
flippedState : 'is-flipped' ,
loadingState : 'is-loading' ,
noResults : 'has-no-results' ,
noChoices : 'has-no-choices'
} ;
/** @type {Options} */
var DEFAULT _CONFIG = {
items : [ ] ,
choices : [ ] ,
silent : false ,
renderChoiceLimit : - 1 ,
maxItemCount : - 1 ,
addItems : true ,
addItemFilter : null ,
removeItems : true ,
removeItemButton : false ,
editItems : false ,
duplicateItemsAllowed : true ,
delimiter : ',' ,
paste : true ,
searchEnabled : true ,
searchChoices : true ,
searchFloor : 1 ,
searchResultLimit : 4 ,
searchFields : [ 'label' , 'value' ] ,
position : 'auto' ,
resetScrollPosition : true ,
shouldSort : true ,
shouldSortItems : false ,
sorter : sortByAlpha ,
placeholder : true ,
placeholderValue : null ,
searchPlaceholderValue : null ,
prependValue : null ,
appendValue : null ,
renderSelectedChoices : 'auto' ,
loadingText : 'Loading...' ,
noResultsText : 'No results found' ,
noChoicesText : 'No choices to choose from' ,
itemSelectText : 'Press to select' ,
uniqueItemText : 'Only unique values can be added' ,
customAddItemText : 'Only values matching specific conditions can be added' ,
addItemText : function addItemText ( value ) {
return "Press Enter to add <b>\"" + sanitise ( value ) + "\"</b>" ;
} ,
maxItemText : function maxItemText ( maxItemCount ) {
return "Only " + maxItemCount + " values can be added" ;
} ,
valueComparer : function valueComparer ( value1 , value2 ) {
return value1 === value2 ;
} ,
fuseOptions : {
includeScore : true
} ,
callbackOnInit : null ,
callbackOnCreateTemplates : null ,
classNames : DEFAULT _CLASSNAMES
} ;
var EVENTS = {
showDropdown : 'showDropdown' ,
hideDropdown : 'hideDropdown' ,
change : 'change' ,
choice : 'choice' ,
search : 'search' ,
addItem : 'addItem' ,
removeItem : 'removeItem' ,
highlightItem : 'highlightItem' ,
highlightChoice : 'highlightChoice'
} ;
var ACTION _TYPES = {
ADD _CHOICE : 'ADD_CHOICE' ,
FILTER _CHOICES : 'FILTER_CHOICES' ,
ACTIVATE _CHOICES : 'ACTIVATE_CHOICES' ,
CLEAR _CHOICES : 'CLEAR_CHOICES' ,
ADD _GROUP : 'ADD_GROUP' ,
ADD _ITEM : 'ADD_ITEM' ,
REMOVE _ITEM : 'REMOVE_ITEM' ,
HIGHLIGHT _ITEM : 'HIGHLIGHT_ITEM' ,
CLEAR _ALL : 'CLEAR_ALL'
} ;
var KEY _CODES = {
BACK _KEY : 46 ,
DELETE _KEY : 8 ,
ENTER _KEY : 13 ,
A _KEY : 65 ,
ESC _KEY : 27 ,
UP _KEY : 38 ,
DOWN _KEY : 40 ,
PAGE _UP _KEY : 33 ,
PAGE _DOWN _KEY : 34
} ;
var TEXT _TYPE = 'text' ;
var SELECT _ONE _TYPE = 'select-one' ;
var SELECT _MULTIPLE _TYPE = 'select-multiple' ;
var SCROLLING _SPEED = 4 ;
2019-10-22 23:20:40 +02:00
// CONCATENATED MODULE: ./src/scripts/components/container.js
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
2019-11-03 18:45:16 +01:00
/ * *
* @ typedef { import ( '../../../types/index' ) . Choices . passedElement } passedElement
* @ typedef { import ( '../../../types/index' ) . Choices . ClassNames } ClassNames
* /
2019-10-22 23:20:40 +02:00
var container _Container =
/*#__PURE__*/
function ( ) {
2019-11-03 18:45:16 +01:00
/ * *
* @ param { {
* element : HTMLElement ,
* type : passedElement [ 'type' ] ,
* classNames : ClassNames ,
* position
* } } args
* /
2019-10-22 23:20:40 +02:00
function Container ( _ref ) {
var element = _ref . element ,
type = _ref . type ,
classNames = _ref . classNames ,
position = _ref . position ;
2019-11-03 18:45:16 +01:00
this . element = element ;
this . classNames = classNames ;
this . type = type ;
this . position = position ;
2019-10-22 23:20:40 +02:00
this . isOpen = false ;
this . isFlipped = false ;
this . isFocussed = false ;
this . isDisabled = false ;
this . isLoading = false ;
this . _onFocus = this . _onFocus . bind ( this ) ;
this . _onBlur = this . _onBlur . bind ( this ) ;
2017-11-15 07:51:53 +01:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var _proto = Container . prototype ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . addEventListeners = function addEventListeners ( ) {
this . element . addEventListener ( 'focus' , this . _onFocus ) ;
this . element . addEventListener ( 'blur' , this . _onBlur ) ;
2019-11-03 18:45:16 +01:00
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . removeEventListeners = function removeEventListeners ( ) {
this . element . removeEventListener ( 'focus' , this . _onFocus ) ;
this . element . removeEventListener ( 'blur' , this . _onBlur ) ;
}
/ * *
2019-11-03 18:45:16 +01:00
* Determine whether container should be flipped based on passed
* dropdown position
* @ param { number } dropdownPos
* @ returns { boolean }
2019-10-22 23:20:40 +02:00
* /
;
2019-02-09 19:13:25 +01:00
2019-11-03 18:45:16 +01:00
_proto . shouldFlip = function shouldFlip ( dropdownPos ) {
if ( typeof dropdownPos !== 'number' ) {
2019-10-22 23:20:40 +02:00
return false ;
} // If flip is enabled and the dropdown bottom position is
// greater than the window height flip the dropdown.
2017-11-07 12:59:49 +01:00
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
var shouldFlip = false ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( this . position === 'auto' ) {
2019-11-03 18:45:16 +01:00
shouldFlip = ! window . matchMedia ( "(min-height: " + ( dropdownPos + 1 ) + "px)" ) . matches ;
2019-10-22 23:20:40 +02:00
} else if ( this . position === 'top' ) {
shouldFlip = true ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return shouldFlip ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
/ * *
2019-11-03 18:45:16 +01:00
* @ param { string } activeDescendantID
2019-10-22 23:20:40 +02:00
* /
;
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
_proto . setActiveDescendant = function setActiveDescendant ( activeDescendantID ) {
this . element . setAttribute ( 'aria-activedescendant' , activeDescendantID ) ;
2019-11-03 18:45:16 +01:00
} ;
_proto . removeActiveDescendant = function removeActiveDescendant ( ) {
this . element . removeAttribute ( 'aria-activedescendant' ) ;
2019-10-22 23:20:40 +02:00
}
/ * *
2019-11-03 18:45:16 +01:00
* @ param { number } dropdownPos
2019-10-22 23:20:40 +02:00
* /
;
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
_proto . open = function open ( dropdownPos ) {
this . element . classList . add ( this . classNames . openState ) ;
this . element . setAttribute ( 'aria-expanded' , 'true' ) ;
this . isOpen = true ;
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
if ( this . shouldFlip ( dropdownPos ) ) {
this . element . classList . add ( this . classNames . flippedState ) ;
this . isFlipped = true ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . close = function close ( ) {
this . element . classList . remove ( this . classNames . openState ) ;
this . element . setAttribute ( 'aria-expanded' , 'false' ) ;
this . removeActiveDescendant ( ) ;
this . isOpen = false ; // A dropdown flips if it does not have space within the page
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( this . isFlipped ) {
this . element . classList . remove ( this . classNames . flippedState ) ;
this . isFlipped = false ;
}
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . focus = function focus ( ) {
if ( ! this . isFocussed ) {
this . element . focus ( ) ;
}
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . addFocusState = function addFocusState ( ) {
this . element . classList . add ( this . classNames . focusState ) ;
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . removeFocusState = function removeFocusState ( ) {
this . element . classList . remove ( this . classNames . focusState ) ;
2019-11-03 18:45:16 +01:00
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . enable = function enable ( ) {
this . element . classList . remove ( this . classNames . disabledState ) ;
this . element . removeAttribute ( 'aria-disabled' ) ;
2017-11-15 07:51:53 +01:00
2019-11-03 18:45:16 +01:00
if ( this . type === SELECT _ONE _TYPE ) {
2019-10-22 23:20:40 +02:00
this . element . setAttribute ( 'tabindex' , '0' ) ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
this . isDisabled = false ;
2019-11-03 18:45:16 +01:00
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . disable = function disable ( ) {
this . element . classList . add ( this . classNames . disabledState ) ;
this . element . setAttribute ( 'aria-disabled' , 'true' ) ;
2017-11-07 12:59:49 +01:00
2019-11-03 18:45:16 +01:00
if ( this . type === SELECT _ONE _TYPE ) {
2019-10-22 23:20:40 +02:00
this . element . setAttribute ( 'tabindex' , '-1' ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . isDisabled = true ;
2019-11-03 18:45:16 +01:00
}
/ * *
* @ param { HTMLElement } element
* /
;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . wrap = function wrap ( element ) {
utils _wrap ( element , this . element ) ;
2019-11-03 18:45:16 +01:00
}
/ * *
* @ param { Element } element
* /
;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . unwrap = function unwrap ( element ) {
// Move passed element outside this element
this . element . parentNode . insertBefore ( element , this . element ) ; // Remove this element
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
this . element . parentNode . removeChild ( this . element ) ;
2019-11-03 18:45:16 +01:00
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . addLoadingState = function addLoadingState ( ) {
this . element . classList . add ( this . classNames . loadingState ) ;
this . element . setAttribute ( 'aria-busy' , 'true' ) ;
this . isLoading = true ;
2019-11-03 18:45:16 +01:00
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . removeLoadingState = function removeLoadingState ( ) {
this . element . classList . remove ( this . classNames . loadingState ) ;
this . element . removeAttribute ( 'aria-busy' ) ;
this . isLoading = false ;
2019-11-03 18:45:16 +01:00
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onFocus = function _onFocus ( ) {
this . isFocussed = true ;
2019-11-03 18:45:16 +01:00
} ;
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onBlur = function _onBlur ( ) {
this . isFocussed = false ;
} ;
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
return Container ;
} ( ) ;
2017-11-07 12:59:49 +01:00
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
// CONCATENATED MODULE: ./src/scripts/components/input.js
function input _defineProperties ( target , props ) { for ( var i = 0 ; i < props . length ; i ++ ) { var descriptor = props [ i ] ; descriptor . enumerable = descriptor . enumerable || false ; descriptor . configurable = true ; if ( "value" in descriptor ) descriptor . writable = true ; Object . defineProperty ( target , descriptor . key , descriptor ) ; } }
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
function input _createClass ( Constructor , protoProps , staticProps ) { if ( protoProps ) input _defineProperties ( Constructor . prototype , protoProps ) ; if ( staticProps ) input _defineProperties ( Constructor , staticProps ) ; return Constructor ; }
2017-11-15 07:51:53 +01:00
2019-11-03 18:45:16 +01:00
/ * *
* @ typedef { import ( '../../../types/index' ) . Choices . passedElement } passedElement
* @ typedef { import ( '../../../types/index' ) . Choices . ClassNames } ClassNames
* /
2019-10-22 23:20:40 +02:00
var input _Input =
/*#__PURE__*/
function ( ) {
2019-10-29 22:19:56 +01:00
/ * *
2019-11-03 18:45:16 +01:00
* @ param { {
* element : HTMLInputElement ,
* type : passedElement [ 'type' ] ,
* classNames : ClassNames ,
* preventPaste : boolean
* } } args
2019-10-29 22:19:56 +01:00
* /
2019-10-22 23:20:40 +02:00
function Input ( _ref ) {
var element = _ref . element ,
type = _ref . type ,
classNames = _ref . classNames ,
2019-10-29 22:19:56 +01:00
preventPaste = _ref . preventPaste ;
2019-10-22 23:20:40 +02:00
this . element = element ;
2019-10-29 22:19:56 +01:00
this . type = type ;
2019-10-22 23:20:40 +02:00
this . classNames = classNames ;
2019-10-29 22:19:56 +01:00
this . preventPaste = preventPaste ;
2019-10-22 23:20:40 +02:00
this . isFocussed = this . element === document . activeElement ;
2019-10-29 22:19:56 +01:00
this . isDisabled = element . disabled ;
2019-10-22 23:20:40 +02:00
this . _onPaste = this . _onPaste . bind ( this ) ;
this . _onInput = this . _onInput . bind ( this ) ;
this . _onFocus = this . _onFocus . bind ( this ) ;
this . _onBlur = this . _onBlur . bind ( this ) ;
}
2019-11-03 18:45:16 +01:00
/ * *
* @ param { string } placeholder
* /
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
var _proto = Input . prototype ;
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
_proto . addEventListeners = function addEventListeners ( ) {
this . element . addEventListener ( 'paste' , this . _onPaste ) ;
2019-10-29 22:19:56 +01:00
this . element . addEventListener ( 'input' , this . _onInput , {
passive : true
} ) ;
this . element . addEventListener ( 'focus' , this . _onFocus , {
passive : true
} ) ;
this . element . addEventListener ( 'blur' , this . _onBlur , {
passive : true
} ) ;
2019-10-22 23:20:40 +02:00
} ;
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
_proto . removeEventListeners = function removeEventListeners ( ) {
2019-10-29 22:19:56 +01:00
this . element . removeEventListener ( 'input' , this . _onInput , {
passive : true
} ) ;
2019-10-22 23:20:40 +02:00
this . element . removeEventListener ( 'paste' , this . _onPaste ) ;
2019-10-29 22:19:56 +01:00
this . element . removeEventListener ( 'focus' , this . _onFocus , {
passive : true
} ) ;
this . element . removeEventListener ( 'blur' , this . _onBlur , {
passive : true
} ) ;
2019-10-22 23:20:40 +02:00
} ;
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
_proto . enable = function enable ( ) {
this . element . removeAttribute ( 'disabled' ) ;
this . isDisabled = false ;
} ;
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
_proto . disable = function disable ( ) {
this . element . setAttribute ( 'disabled' , '' ) ;
this . isDisabled = true ;
} ;
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
_proto . focus = function focus ( ) {
if ( ! this . isFocussed ) {
this . element . focus ( ) ;
}
} ;
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
_proto . blur = function blur ( ) {
if ( this . isFocussed ) {
this . element . blur ( ) ;
2019-02-09 19:13:25 +01:00
}
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
/ * *
* Set value of input to blank
2019-11-03 18:45:16 +01:00
* @ param { boolean } setWidth
* @ returns { this }
2019-10-22 23:20:40 +02:00
* /
;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . clear = function clear ( setWidth ) {
if ( setWidth === void 0 ) {
setWidth = true ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( this . element . value ) {
this . element . value = '' ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( setWidth ) {
this . setWidth ( ) ;
}
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
return this ;
}
/ * *
* Set the correct input width based on placeholder
* value or input value
* /
;
2019-02-26 13:20:52 +01:00
2019-10-28 20:53:24 +01:00
_proto . setWidth = function setWidth ( ) {
// Resize input to contents or placeholder
var _this$element = this . element ,
style = _this$element . style ,
value = _this$element . value ,
placeholder = _this$element . placeholder ;
style . minWidth = placeholder . length + 1 + "ch" ;
style . width = value . length + 1 + "ch" ;
2019-11-03 18:45:16 +01:00
}
/ * *
* @ param { string } activeDescendantID
* /
;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . setActiveDescendant = function setActiveDescendant ( activeDescendantID ) {
this . element . setAttribute ( 'aria-activedescendant' , activeDescendantID ) ;
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . removeActiveDescendant = function removeActiveDescendant ( ) {
this . element . removeAttribute ( 'aria-activedescendant' ) ;
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onInput = function _onInput ( ) {
2019-11-03 18:45:16 +01:00
if ( this . type !== SELECT _ONE _TYPE ) {
2019-10-22 23:20:40 +02:00
this . setWidth ( ) ;
}
2019-11-03 18:45:16 +01:00
}
/ * *
* @ param { Event } event
* /
;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onPaste = function _onPaste ( event ) {
2019-10-29 22:19:56 +01:00
if ( this . preventPaste ) {
2019-10-22 23:20:40 +02:00
event . preventDefault ( ) ;
}
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onFocus = function _onFocus ( ) {
this . isFocussed = true ;
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onBlur = function _onBlur ( ) {
this . isFocussed = false ;
} ;
input _createClass ( Input , [ {
key : "placeholder" ,
set : function set ( placeholder ) {
this . element . placeholder = placeholder ;
}
2019-11-03 18:45:16 +01:00
/ * *
* @ returns { string }
* /
2019-10-22 23:20:40 +02:00
} , {
key : "value" ,
get : function get ( ) {
return sanitise ( this . element . value ) ;
2019-11-03 18:45:16 +01:00
}
/ * *
* @ param { string } value
* /
,
2019-10-29 22:19:56 +01:00
set : function set ( value ) {
this . element . value = value ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
} ] ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
return Input ;
} ( ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
// CONCATENATED MODULE: ./src/scripts/components/list.js
2019-02-09 19:13:25 +01:00
2019-11-03 18:45:16 +01:00
/ * *
* @ typedef { import ( '../../../types/index' ) . Choices . Choice } Choice
* /
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var list _List =
/*#__PURE__*/
function ( ) {
2019-11-03 18:45:16 +01:00
/ * *
* @ param { { element : HTMLElement } } args
* /
2019-10-22 23:20:40 +02:00
function List ( _ref ) {
var element = _ref . element ;
2019-11-03 18:45:16 +01:00
this . element = element ;
2019-10-22 23:20:40 +02:00
this . scrollPos = this . element . scrollTop ;
this . height = this . element . offsetHeight ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var _proto = List . prototype ;
2019-02-12 19:37:04 +01:00
2019-10-22 23:20:40 +02:00
_proto . clear = function clear ( ) {
this . element . innerHTML = '' ;
2019-11-03 18:45:16 +01:00
}
/ * *
2019-11-07 09:50:19 +01:00
* @ param { Element | DocumentFragment } node
2019-11-03 18:45:16 +01:00
* /
;
2019-02-19 10:02:48 +01:00
2019-10-22 23:20:40 +02:00
_proto . append = function append ( node ) {
this . element . appendChild ( node ) ;
2019-11-03 18:45:16 +01:00
}
/ * *
* @ param { string } selector
* @ returns { Element | null }
* /
;
2019-02-11 18:52:22 +01:00
2019-10-22 23:20:40 +02:00
_proto . getChild = function getChild ( selector ) {
return this . element . querySelector ( selector ) ;
2019-11-03 18:45:16 +01:00
}
/ * *
* @ returns { boolean }
* /
;
2019-02-12 19:37:04 +01:00
2019-10-29 22:19:56 +01:00
_proto . hasChildren = function hasChildren ( ) {
return this . element . hasChildNodes ( ) ;
} ;
2019-10-22 23:20:40 +02:00
_proto . scrollToTop = function scrollToTop ( ) {
this . element . scrollTop = 0 ;
2019-11-03 18:45:16 +01:00
}
/ * *
2019-11-08 10:19:18 +01:00
* @ param { Element } element
2019-11-03 18:45:16 +01:00
* @ param { 1 | - 1 } direction
* /
;
2019-02-19 10:02:48 +01:00
2019-11-03 18:45:16 +01:00
_proto . scrollToChildElement = function scrollToChildElement ( element , direction ) {
2019-10-22 23:20:40 +02:00
var _this = this ;
2019-02-19 10:02:48 +01:00
2019-11-03 18:45:16 +01:00
if ( ! element ) {
2019-10-22 23:20:40 +02:00
return ;
}
2019-02-19 10:02:48 +01:00
2019-11-03 18:45:16 +01:00
var listHeight = this . element . offsetHeight ; // Scroll position of dropdown
2019-02-26 13:20:52 +01:00
2019-11-03 18:45:16 +01:00
var listScrollPosition = this . element . scrollTop + listHeight ;
var elementHeight = element . offsetHeight ; // Distance from bottom of element to top of parent
2019-02-19 10:02:48 +01:00
2019-11-03 18:45:16 +01:00
var elementPos = element . offsetTop + elementHeight ; // Difference between the element and scroll position
2019-02-22 23:06:59 +01:00
2019-11-03 18:45:16 +01:00
var destination = direction > 0 ? this . element . scrollTop + elementPos - listScrollPosition : element . offsetTop ;
requestAnimationFrame ( function ( ) {
_this . _animateScroll ( destination , direction ) ;
2019-10-22 23:20:40 +02:00
} ) ;
2019-11-03 18:45:16 +01:00
}
/ * *
* @ param { number } scrollPos
* @ param { number } strength
* @ param { number } destination
* /
;
2019-02-26 13:20:52 +01:00
2019-10-29 22:19:56 +01:00
_proto . _scrollDown = function _scrollDown ( scrollPos , strength , destination ) {
var easing = ( destination - scrollPos ) / strength ;
2019-10-22 23:20:40 +02:00
var distance = easing > 1 ? easing : 1 ;
this . element . scrollTop = scrollPos + distance ;
2019-11-03 18:45:16 +01:00
}
/ * *
* @ param { number } scrollPos
* @ param { number } strength
* @ param { number } destination
* /
;
2019-02-22 23:06:59 +01:00
2019-10-29 22:19:56 +01:00
_proto . _scrollUp = function _scrollUp ( scrollPos , strength , destination ) {
var easing = ( scrollPos - destination ) / strength ;
2019-10-22 23:20:40 +02:00
var distance = easing > 1 ? easing : 1 ;
this . element . scrollTop = scrollPos - distance ;
2019-11-03 18:45:16 +01:00
}
/ * *
* @ param { * } destination
* @ param { * } direction
* /
;
2019-02-22 23:06:59 +01:00
2019-11-03 18:45:16 +01:00
_proto . _animateScroll = function _animateScroll ( destination , direction ) {
2019-10-22 23:20:40 +02:00
var _this2 = this ;
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
var strength = SCROLLING _SPEED ;
var choiceListScrollTop = this . element . scrollTop ;
var continueAnimation = false ;
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
if ( direction > 0 ) {
2019-10-29 22:19:56 +01:00
this . _scrollDown ( choiceListScrollTop , strength , destination ) ;
2019-02-26 13:20:52 +01:00
2019-10-29 22:19:56 +01:00
if ( choiceListScrollTop < destination ) {
2019-10-22 23:20:40 +02:00
continueAnimation = true ;
2019-02-26 13:20:52 +01:00
}
2019-10-22 23:20:40 +02:00
} else {
2019-10-29 22:19:56 +01:00
this . _scrollUp ( choiceListScrollTop , strength , destination ) ;
2019-02-26 13:20:52 +01:00
2019-10-29 22:19:56 +01:00
if ( choiceListScrollTop > destination ) {
2019-10-22 23:20:40 +02:00
continueAnimation = true ;
2019-02-09 19:13:25 +01:00
}
2019-02-26 13:20:52 +01:00
}
2019-10-22 23:20:40 +02:00
if ( continueAnimation ) {
requestAnimationFrame ( function ( ) {
2019-11-03 18:45:16 +01:00
_this2 . _animateScroll ( destination , direction ) ;
2019-10-22 23:20:40 +02:00
} ) ;
}
} ;
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
return List ;
} ( ) ;
2019-02-11 18:52:22 +01:00
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
// CONCATENATED MODULE: ./src/scripts/components/wrapped-element.js
function wrapped _element _defineProperties ( target , props ) { for ( var i = 0 ; i < props . length ; i ++ ) { var descriptor = props [ i ] ; descriptor . enumerable = descriptor . enumerable || false ; descriptor . configurable = true ; if ( "value" in descriptor ) descriptor . writable = true ; Object . defineProperty ( target , descriptor . key , descriptor ) ; } }
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
function wrapped _element _createClass ( Constructor , protoProps , staticProps ) { if ( protoProps ) wrapped _element _defineProperties ( Constructor . prototype , protoProps ) ; if ( staticProps ) wrapped _element _defineProperties ( Constructor , staticProps ) ; return Constructor ; }
2019-02-09 19:13:25 +01:00
2019-11-03 18:45:16 +01:00
/ * *
* @ typedef { import ( '../../../types/index' ) . Choices . passedElement } passedElement
* @ typedef { import ( '../../../types/index' ) . Choices . ClassNames } ClassNames
* /
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var wrapped _element _WrappedElement =
/*#__PURE__*/
function ( ) {
2019-11-03 18:45:16 +01:00
/ * *
* @ param { {
* element : HTMLInputElement | HTMLSelectElement ,
* classNames : ClassNames ,
* } } args
* /
2019-10-22 23:20:40 +02:00
function WrappedElement ( _ref ) {
var element = _ref . element ,
classNames = _ref . classNames ;
2019-11-03 18:45:16 +01:00
this . element = element ;
this . classNames = classNames ;
2019-02-26 13:20:52 +01:00
2019-11-03 18:45:16 +01:00
if ( ! ( element instanceof HTMLInputElement ) && ! ( element instanceof HTMLSelectElement ) ) {
2019-10-22 23:20:40 +02:00
throw new TypeError ( 'Invalid element passed' ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . isDisabled = false ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var _proto = WrappedElement . prototype ;
_proto . conceal = function conceal ( ) {
// Hide passed input
this . element . classList . add ( this . classNames . input ) ;
2019-10-28 20:53:24 +01:00
this . element . hidden = true ; // Remove element from tab index
2019-10-22 23:20:40 +02:00
2019-11-03 18:45:16 +01:00
this . element . tabIndex = - 1 ; // Backup original styles if any
2019-10-22 23:20:40 +02:00
var origStyle = this . element . getAttribute ( 'style' ) ;
if ( origStyle ) {
this . element . setAttribute ( 'data-choice-orig-style' , origStyle ) ;
2019-02-22 23:06:59 +01:00
}
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
this . element . setAttribute ( 'data-choice' , 'active' ) ;
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . reveal = function reveal ( ) {
// Reinstate passed element
this . element . classList . remove ( this . classNames . input ) ;
2019-10-28 20:53:24 +01:00
this . element . hidden = false ;
2019-10-22 23:20:40 +02:00
this . element . removeAttribute ( 'tabindex' ) ; // Recover original styles if any
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
var origStyle = this . element . getAttribute ( 'data-choice-orig-style' ) ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( origStyle ) {
this . element . removeAttribute ( 'data-choice-orig-style' ) ;
this . element . setAttribute ( 'style' , origStyle ) ;
} else {
this . element . removeAttribute ( 'style' ) ;
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
this . element . removeAttribute ( 'data-choice' ) ; // Re-assign values - this is weird, I know
2019-10-29 22:19:56 +01:00
// @todo Figure out why we need to do this
2017-11-15 07:51:53 +01:00
2019-10-29 22:19:56 +01:00
this . element . value = this . element . value ; // eslint-disable-line no-self-assign
2019-10-22 23:20:40 +02:00
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . enable = function enable ( ) {
this . element . removeAttribute ( 'disabled' ) ;
this . element . disabled = false ;
this . isDisabled = false ;
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . disable = function disable ( ) {
this . element . setAttribute ( 'disabled' , '' ) ;
this . element . disabled = true ;
this . isDisabled = true ;
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . triggerEvent = function triggerEvent ( eventType , data ) {
dispatchEvent ( this . element , eventType , data ) ;
} ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
wrapped _element _createClass ( WrappedElement , [ {
2019-11-03 18:45:16 +01:00
key : "isActive" ,
get : function get ( ) {
return this . element . dataset . choice === 'active' ;
}
} , {
key : "dir" ,
get : function get ( ) {
return this . element . dir ;
}
} , {
2019-10-22 23:20:40 +02:00
key : "value" ,
get : function get ( ) {
return this . element . value ;
} ,
set : function set ( value ) {
// you must define setter here otherwise it will be readonly property
this . element . value = value ;
}
} ] ) ;
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
return WrappedElement ;
} ( ) ;
2017-11-15 07:51:53 +01:00
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
// CONCATENATED MODULE: ./src/scripts/components/wrapped-input.js
function wrapped _input _defineProperties ( target , props ) { for ( var i = 0 ; i < props . length ; i ++ ) { var descriptor = props [ i ] ; descriptor . enumerable = descriptor . enumerable || false ; descriptor . configurable = true ; if ( "value" in descriptor ) descriptor . writable = true ; Object . defineProperty ( target , descriptor . key , descriptor ) ; } }
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
function wrapped _input _createClass ( Constructor , protoProps , staticProps ) { if ( protoProps ) wrapped _input _defineProperties ( Constructor . prototype , protoProps ) ; if ( staticProps ) wrapped _input _defineProperties ( Constructor , staticProps ) ; return Constructor ; }
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
function _inheritsLoose ( subClass , superClass ) { subClass . prototype = Object . create ( superClass . prototype ) ; subClass . prototype . constructor = subClass ; subClass . _ _proto _ _ = superClass ; }
2018-05-25 15:00:27 +02:00
2019-11-03 18:45:16 +01:00
/ * *
* @ typedef { import ( '../../../types/index' ) . Choices . ClassNames } ClassNames
* @ typedef { import ( '../../../types/index' ) . Choices . Item } Item
* /
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
var WrappedInput =
/*#__PURE__*/
function ( _WrappedElement ) {
_inheritsLoose ( WrappedInput , _WrappedElement ) ;
2018-05-25 15:00:27 +02:00
2019-11-03 18:45:16 +01:00
/ * *
* @ param { {
* element : HTMLInputElement ,
* classNames : ClassNames ,
* delimiter : string
* } } args
* /
2019-10-22 23:20:40 +02:00
function WrappedInput ( _ref ) {
var _this ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var element = _ref . element ,
classNames = _ref . classNames ,
delimiter = _ref . delimiter ;
_this = _WrappedElement . call ( this , {
element : element ,
classNames : classNames
} ) || this ;
_this . delimiter = delimiter ;
return _this ;
}
2019-11-03 18:45:16 +01:00
/ * *
* @ returns { string }
* /
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
wrapped _input _createClass ( WrappedInput , [ {
key : "value" ,
2019-10-29 22:19:56 +01:00
get : function get ( ) {
return this . element . value ;
2019-11-03 18:45:16 +01:00
}
/ * *
* @ param { Item [ ] } items
* /
,
2019-10-22 23:20:40 +02:00
set : function set ( items ) {
var itemValues = items . map ( function ( _ref2 ) {
var value = _ref2 . value ;
return value ;
} ) ;
var joinedValues = itemValues . join ( this . delimiter ) ;
this . element . setAttribute ( 'value' , joinedValues ) ;
this . element . value = joinedValues ;
}
} ] ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return WrappedInput ;
} ( wrapped _element _WrappedElement ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
// CONCATENATED MODULE: ./src/scripts/components/wrapped-select.js
function wrapped _select _defineProperties ( target , props ) { for ( var i = 0 ; i < props . length ; i ++ ) { var descriptor = props [ i ] ; descriptor . enumerable = descriptor . enumerable || false ; descriptor . configurable = true ; if ( "value" in descriptor ) descriptor . writable = true ; Object . defineProperty ( target , descriptor . key , descriptor ) ; } }
2019-02-12 19:37:04 +01:00
2019-10-22 23:20:40 +02:00
function wrapped _select _createClass ( Constructor , protoProps , staticProps ) { if ( protoProps ) wrapped _select _defineProperties ( Constructor . prototype , protoProps ) ; if ( staticProps ) wrapped _select _defineProperties ( Constructor , staticProps ) ; return Constructor ; }
2019-02-12 19:37:04 +01:00
2019-10-22 23:20:40 +02:00
function wrapped _select _inheritsLoose ( subClass , superClass ) { subClass . prototype = Object . create ( superClass . prototype ) ; subClass . prototype . constructor = subClass ; subClass . _ _proto _ _ = superClass ; }
2019-02-22 23:06:59 +01:00
2019-11-03 18:45:16 +01:00
/ * *
* @ typedef { import ( '../../../types/index' ) . Choices . ClassNames } ClassNames
* @ typedef { import ( '../../../types/index' ) . Choices . Item } Item
* @ typedef { import ( '../../../types/index' ) . Choices . Choice } Choice
* /
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
var WrappedSelect =
/*#__PURE__*/
function ( _WrappedElement ) {
wrapped _select _inheritsLoose ( WrappedSelect , _WrappedElement ) ;
2019-02-26 13:20:52 +01:00
2019-11-03 18:45:16 +01:00
/ * *
* @ param { {
* element : HTMLSelectElement ,
* classNames : ClassNames ,
* delimiter : string
* template : function
* } } args
* /
2019-10-22 23:20:40 +02:00
function WrappedSelect ( _ref ) {
var _this ;
2019-02-26 13:20:52 +01:00
2019-10-22 23:20:40 +02:00
var element = _ref . element ,
classNames = _ref . classNames ,
template = _ref . template ;
_this = _WrappedElement . call ( this , {
element : element ,
classNames : classNames
} ) || this ;
_this . template = template ;
return _this ;
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
var _proto = WrappedSelect . prototype ;
2018-05-25 15:00:27 +02:00
2019-11-03 18:45:16 +01:00
/ * *
* @ param { DocumentFragment } fragment
* /
2019-10-22 23:20:40 +02:00
_proto . appendDocFragment = function appendDocFragment ( fragment ) {
this . element . innerHTML = '' ;
this . element . appendChild ( fragment ) ;
} ;
wrapped _select _createClass ( WrappedSelect , [ {
key : "placeholderOption" ,
get : function get ( ) {
return this . element . querySelector ( 'option[value=""]' ) || // Backward compatibility layer for the non-standard placeholder attribute supported in older versions.
this . element . querySelector ( 'option[placeholder]' ) ;
2019-02-12 19:37:04 +01:00
}
2019-11-03 18:45:16 +01:00
/ * *
* @ returns { Element [ ] }
* /
2019-02-26 13:20:52 +01:00
} , {
2019-10-22 23:20:40 +02:00
key : "optionGroups" ,
get : function get ( ) {
return Array . from ( this . element . getElementsByTagName ( 'OPTGROUP' ) ) ;
2019-02-26 13:20:52 +01:00
}
2019-11-03 18:45:16 +01:00
/ * *
* @ returns { Item [ ] | Choice [ ] }
* /
2019-02-26 13:20:52 +01:00
} , {
2019-10-22 23:20:40 +02:00
key : "options" ,
get : function get ( ) {
return Array . from ( this . element . options ) ;
2019-11-03 18:45:16 +01:00
}
/ * *
* @ param { Item [ ] | Choice [ ] } options
* /
,
2019-10-22 23:20:40 +02:00
set : function set ( options ) {
var _this2 = this ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var fragment = document . createDocumentFragment ( ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var addOptionToFragment = function addOptionToFragment ( data ) {
// Create a standard select option
var option = _this2 . template ( data ) ; // Append it to fragment
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
fragment . appendChild ( option ) ;
} ; // Add each list item to list
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
options . forEach ( function ( optionData ) {
return addOptionToFragment ( optionData ) ;
} ) ;
this . appendDocFragment ( fragment ) ;
}
} ] ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
return WrappedSelect ;
} ( wrapped _element _WrappedElement ) ;
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
// CONCATENATED MODULE: ./src/scripts/components/index.js
2018-05-25 15:00:27 +02:00
2019-02-09 19:13:25 +01:00
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
// CONCATENATED MODULE: ./src/scripts/templates.js
2019-10-28 20:53:24 +01:00
/ * *
* Helpers to create HTML elements used by Choices
* Can be overridden by providing ` callbackOnCreateTemplates ` option
* @ typedef { import ( '../../types/index' ) . Choices . Templates } Templates
2019-11-13 16:40:47 +01:00
* @ typedef { import ( '../../types/index' ) . Choices . ClassNames } ClassNames
* @ typedef { import ( '../../types/index' ) . Choices . Options } Options
* @ typedef { import ( '../../types/index' ) . Choices . Item } Item
* @ typedef { import ( '../../types/index' ) . Choices . Choice } Choice
* @ typedef { import ( '../../types/index' ) . Choices . Group } Group
2019-10-28 20:53:24 +01:00
* /
var TEMPLATES =
/** @type {Templates} */
{
2019-11-13 16:40:47 +01:00
/ * *
* @ param { Partial < ClassNames > } classNames
* @ param { "ltr" | "rtl" | "auto" } dir
* @ param { boolean } isSelectElement
* @ param { boolean } isSelectOneElement
* @ param { boolean } searchEnabled
* @ param { "select-one" | "select-multiple" | "text" } passedElementType
* /
2019-10-28 20:53:24 +01:00
containerOuter : function containerOuter ( _ref , dir , isSelectElement , isSelectOneElement , searchEnabled , passedElementType ) {
var _containerOuter = _ref . containerOuter ;
var div = Object . assign ( document . createElement ( 'div' ) , {
2019-10-29 22:19:56 +01:00
className : _containerOuter
2019-10-28 20:53:24 +01:00
} ) ;
div . dataset . type = passedElementType ;
2019-10-29 22:19:56 +01:00
if ( dir ) {
div . dir = dir ;
}
if ( isSelectOneElement ) {
div . tabIndex = 0 ;
}
2019-02-12 19:37:04 +01:00
2019-10-28 20:53:24 +01:00
if ( isSelectElement ) {
div . setAttribute ( 'role' , searchEnabled ? 'combobox' : 'listbox' ) ;
2019-10-29 22:19:56 +01:00
if ( searchEnabled ) {
div . setAttribute ( 'aria-autocomplete' , 'list' ) ;
}
2019-10-22 23:20:40 +02:00
}
2019-02-09 19:13:25 +01:00
2019-10-28 20:53:24 +01:00
div . setAttribute ( 'aria-haspopup' , 'true' ) ;
div . setAttribute ( 'aria-expanded' , 'false' ) ;
return div ;
2019-10-22 23:20:40 +02:00
} ,
2019-11-13 16:40:47 +01:00
/ * *
* @ param { Partial < ClassNames > } classNames
* /
2019-10-28 20:53:24 +01:00
containerInner : function containerInner ( _ref2 ) {
var _containerInner = _ref2 . containerInner ;
return Object . assign ( document . createElement ( 'div' ) , {
className : _containerInner
} ) ;
2019-10-22 23:20:40 +02:00
} ,
2019-11-13 16:40:47 +01:00
/ * *
* @ param { Partial < ClassNames > } classNames
* @ param { boolean } isSelectOneElement
* /
2019-10-28 20:53:24 +01:00
itemList : function itemList ( _ref3 , isSelectOneElement ) {
var list = _ref3 . list ,
listSingle = _ref3 . listSingle ,
listItems = _ref3 . listItems ;
return Object . assign ( document . createElement ( 'div' ) , {
className : list + " " + ( isSelectOneElement ? listSingle : listItems )
} ) ;
2019-10-22 23:20:40 +02:00
} ,
2019-11-13 16:40:47 +01:00
/ * *
* @ param { Partial < ClassNames > } classNames
* @ param { string } value
* /
2019-10-28 20:53:24 +01:00
placeholder : function placeholder ( _ref4 , value ) {
var _placeholder = _ref4 . placeholder ;
return Object . assign ( document . createElement ( 'div' ) , {
className : _placeholder ,
innerHTML : value
} ) ;
2019-10-22 23:20:40 +02:00
} ,
2019-11-13 16:40:47 +01:00
/ * *
* @ param { Partial < ClassNames > } classNames
* @ param { Item } item
* @ param { boolean } removeItemButton
* /
2019-10-28 20:53:24 +01:00
item : function item ( _ref5 , _ref6 , removeItemButton ) {
var _item = _ref5 . item ,
button = _ref5 . button ,
highlightedState = _ref5 . highlightedState ,
itemSelectable = _ref5 . itemSelectable ,
placeholder = _ref5 . placeholder ;
var id = _ref6 . id ,
value = _ref6 . value ,
label = _ref6 . label ,
customProperties = _ref6 . customProperties ,
active = _ref6 . active ,
disabled = _ref6 . disabled ,
highlighted = _ref6 . highlighted ,
isPlaceholder = _ref6 . placeholder ;
var div = Object . assign ( document . createElement ( 'div' ) , {
className : _item ,
innerHTML : label
} ) ;
Object . assign ( div . dataset , {
item : '' ,
id : id ,
value : value ,
customProperties : customProperties
} ) ;
2019-10-29 22:19:56 +01:00
if ( active ) {
div . setAttribute ( 'aria-selected' , 'true' ) ;
}
if ( disabled ) {
div . setAttribute ( 'aria-disabled' , 'true' ) ;
}
if ( isPlaceholder ) {
div . classList . add ( placeholder ) ;
}
2019-10-28 20:53:24 +01:00
div . classList . add ( highlighted ? highlightedState : itemSelectable ) ;
2019-10-22 23:20:40 +02:00
if ( removeItemButton ) {
2019-10-29 22:19:56 +01:00
if ( disabled ) {
div . classList . remove ( itemSelectable ) ;
}
2019-10-28 20:53:24 +01:00
div . dataset . deletable = '' ;
/** @todo This MUST be localizable, not hardcoded! */
var REMOVE _ITEM _TEXT = 'Remove item' ;
var removeButton = Object . assign ( document . createElement ( 'button' ) , {
type : 'button' ,
className : button ,
innerHTML : REMOVE _ITEM _TEXT
} ) ;
removeButton . setAttribute ( 'aria-label' , REMOVE _ITEM _TEXT + ": '" + value + "'" ) ;
removeButton . dataset . button = '' ;
div . appendChild ( removeButton ) ;
2019-02-22 23:06:59 +01:00
}
2019-10-28 20:53:24 +01:00
return div ;
2019-10-22 23:20:40 +02:00
} ,
2019-11-13 16:40:47 +01:00
/ * *
* @ param { Partial < ClassNames > } classNames
* @ param { boolean } isSelectOneElement
* /
2019-10-28 20:53:24 +01:00
choiceList : function choiceList ( _ref7 , isSelectOneElement ) {
var list = _ref7 . list ;
var div = Object . assign ( document . createElement ( 'div' ) , {
2019-10-29 22:19:56 +01:00
className : list
2019-10-28 20:53:24 +01:00
} ) ;
2019-10-29 22:19:56 +01:00
if ( ! isSelectOneElement ) {
div . setAttribute ( 'aria-multiselectable' , 'true' ) ;
}
2019-10-28 20:53:24 +01:00
div . setAttribute ( 'role' , 'listbox' ) ;
return div ;
2019-10-22 23:20:40 +02:00
} ,
2019-11-13 16:40:47 +01:00
/ * *
* @ param { Partial < ClassNames > } classNames
* @ param { Group } group
* /
2019-10-28 20:53:24 +01:00
choiceGroup : function choiceGroup ( _ref8 , _ref9 ) {
var group = _ref8 . group ,
groupHeading = _ref8 . groupHeading ,
itemDisabled = _ref8 . itemDisabled ;
var id = _ref9 . id ,
value = _ref9 . value ,
disabled = _ref9 . disabled ;
var div = Object . assign ( document . createElement ( 'div' ) , {
className : group + " " + ( disabled ? itemDisabled : '' )
} ) ;
div . setAttribute ( 'role' , 'group' ) ;
Object . assign ( div . dataset , {
group : '' ,
id : id ,
value : value
} ) ;
2019-10-29 22:19:56 +01:00
if ( disabled ) {
div . setAttribute ( 'aria-disabled' , 'true' ) ;
}
2019-10-28 20:53:24 +01:00
div . appendChild ( Object . assign ( document . createElement ( 'div' ) , {
className : groupHeading ,
innerHTML : value
} ) ) ;
return div ;
2019-10-22 23:20:40 +02:00
} ,
2019-11-13 16:40:47 +01:00
/ * *
* @ param { Partial < ClassNames > } classNames
* @ param { Choice } choice
* @ param { Options [ 'itemSelectText' ] } selectText
* /
2019-10-28 20:53:24 +01:00
choice : function choice ( _ref10 , _ref11 , selectText ) {
var item = _ref10 . item ,
itemChoice = _ref10 . itemChoice ,
itemSelectable = _ref10 . itemSelectable ,
2019-11-13 16:40:47 +01:00
selectedState = _ref10 . selectedState ,
2019-10-28 20:53:24 +01:00
itemDisabled = _ref10 . itemDisabled ,
placeholder = _ref10 . placeholder ;
var id = _ref11 . id ,
value = _ref11 . value ,
label = _ref11 . label ,
groupId = _ref11 . groupId ,
elementId = _ref11 . elementId ,
2019-11-13 16:40:47 +01:00
isDisabled = _ref11 . disabled ,
isSelected = _ref11 . selected ,
2019-10-28 20:53:24 +01:00
isPlaceholder = _ref11 . placeholder ;
var div = Object . assign ( document . createElement ( 'div' ) , {
id : elementId ,
innerHTML : label ,
2019-11-13 16:40:47 +01:00
className : item + " " + itemChoice
2019-10-28 20:53:24 +01:00
} ) ;
2019-11-13 16:40:47 +01:00
if ( isSelected ) {
div . classList . add ( selectedState ) ;
}
if ( isPlaceholder ) {
div . classList . add ( placeholder ) ;
}
2019-10-28 20:53:24 +01:00
div . setAttribute ( 'role' , groupId > 0 ? 'treeitem' : 'option' ) ;
Object . assign ( div . dataset , {
choice : '' ,
id : id ,
value : value ,
selectText : selectText
} ) ;
2018-05-25 15:00:27 +02:00
2019-11-13 16:40:47 +01:00
if ( isDisabled ) {
div . classList . add ( itemDisabled ) ;
2019-10-28 20:53:24 +01:00
div . dataset . choiceDisabled = '' ;
div . setAttribute ( 'aria-disabled' , 'true' ) ;
2019-10-29 22:19:56 +01:00
} else {
2019-11-13 16:40:47 +01:00
div . classList . add ( itemSelectable ) ;
2019-10-29 22:19:56 +01:00
div . dataset . choiceSelectable = '' ;
}
2019-10-28 20:53:24 +01:00
return div ;
2019-10-22 23:20:40 +02:00
} ,
2019-11-13 16:40:47 +01:00
/ * *
* @ param { Partial < ClassNames > } classNames
* @ param { string } placeholderValue
* /
2019-10-28 20:53:24 +01:00
input : function input ( _ref12 , placeholderValue ) {
var _input = _ref12 . input ,
inputCloned = _ref12 . inputCloned ;
var inp = Object . assign ( document . createElement ( 'input' ) , {
type : 'text' ,
className : _input + " " + inputCloned ,
autocomplete : 'off' ,
autocapitalize : 'off' ,
spellcheck : false
} ) ;
inp . setAttribute ( 'role' , 'textbox' ) ;
inp . setAttribute ( 'aria-autocomplete' , 'list' ) ;
inp . setAttribute ( 'aria-label' , placeholderValue ) ;
return inp ;
2019-10-22 23:20:40 +02:00
} ,
2019-11-13 16:40:47 +01:00
/ * *
* @ param { Partial < ClassNames > } classNames
* /
2019-10-28 20:53:24 +01:00
dropdown : function dropdown ( _ref13 ) {
var list = _ref13 . list ,
listDropdown = _ref13 . listDropdown ;
var div = document . createElement ( 'div' ) ;
div . classList . add ( list , listDropdown ) ;
div . setAttribute ( 'aria-expanded' , 'false' ) ;
return div ;
2019-10-22 23:20:40 +02:00
} ,
2019-11-13 16:40:47 +01:00
/ * *
*
* @ param { Partial < ClassNames > } classNames
* @ param { string } innerHTML
* @ param { "no-choices" | "no-results" | "" } type
* /
2019-10-28 20:53:24 +01:00
notice : function notice ( _ref14 , innerHTML , type ) {
var item = _ref14 . item ,
itemChoice = _ref14 . itemChoice ,
noResults = _ref14 . noResults ,
noChoices = _ref14 . noChoices ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( type === void 0 ) {
type = '' ;
}
2018-05-25 15:00:27 +02:00
2019-10-28 20:53:24 +01:00
var classes = [ item , itemChoice ] ;
2019-10-29 22:19:56 +01:00
if ( type === 'no-choices' ) {
classes . push ( noChoices ) ;
} else if ( type === 'no-results' ) {
classes . push ( noResults ) ;
}
2019-10-28 20:53:24 +01:00
return Object . assign ( document . createElement ( 'div' ) , {
innerHTML : innerHTML ,
className : classes . join ( ' ' )
} ) ;
2019-10-22 23:20:40 +02:00
} ,
2019-11-13 16:40:47 +01:00
/ * *
* @ param { Item } option
* /
2019-10-28 20:53:24 +01:00
option : function option ( _ref15 ) {
var label = _ref15 . label ,
value = _ref15 . value ,
customProperties = _ref15 . customProperties ,
active = _ref15 . active ,
disabled = _ref15 . disabled ;
var opt = new Option ( label , value , false , active ) ;
2019-10-29 22:19:56 +01:00
if ( customProperties ) {
opt . dataset . customProperties = customProperties ;
}
2019-10-28 20:53:24 +01:00
opt . disabled = disabled ;
return opt ;
2019-10-22 23:20:40 +02:00
}
} ;
/* harmony default export */ var templates = ( TEMPLATES ) ;
// CONCATENATED MODULE: ./src/scripts/actions/choices.js
2019-11-03 18:45:16 +01:00
/ * *
2019-11-07 09:50:19 +01:00
* @ typedef { import ( 'redux' ) . Action } Action
2019-11-03 18:45:16 +01:00
* @ typedef { import ( '../../../types/index' ) . Choices . Choice } Choice
* /
/ * *
* @ argument { Choice } choice
2019-11-07 09:50:19 +01:00
* @ returns { Action & Choice }
2019-11-03 18:45:16 +01:00
* /
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
var choices _addChoice = function addChoice ( _ref ) {
var value = _ref . value ,
label = _ref . label ,
id = _ref . id ,
groupId = _ref . groupId ,
disabled = _ref . disabled ,
elementId = _ref . elementId ,
customProperties = _ref . customProperties ,
placeholder = _ref . placeholder ,
keyCode = _ref . keyCode ;
return {
type : ACTION _TYPES . ADD _CHOICE ,
value : value ,
label : label ,
id : id ,
groupId : groupId ,
disabled : disabled ,
elementId : elementId ,
customProperties : customProperties ,
placeholder : placeholder ,
keyCode : keyCode
} ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ argument { Choice [ ] } results
2019-11-07 09:50:19 +01:00
* @ returns { Action & { results : Choice [ ] } }
2019-11-03 18:45:16 +01:00
* /
2019-10-22 23:20:40 +02:00
var choices _filterChoices = function filterChoices ( results ) {
return {
type : ACTION _TYPES . FILTER _CHOICES ,
results : results
} ;
2018-10-13 12:19:24 +02:00
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ argument { boolean } active
2019-11-07 09:50:19 +01:00
* @ returns { Action & { active : boolean } }
2019-11-03 18:45:16 +01:00
* /
2019-10-22 23:20:40 +02:00
var choices _activateChoices = function activateChoices ( active ) {
if ( active === void 0 ) {
active = true ;
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
return {
type : ACTION _TYPES . ACTIVATE _CHOICES ,
active : active
} ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
2019-11-07 09:50:19 +01:00
* @ returns { Action }
2019-11-03 18:45:16 +01:00
* /
2019-10-22 23:20:40 +02:00
var choices _clearChoices = function clearChoices ( ) {
return {
type : ACTION _TYPES . CLEAR _CHOICES
} ;
} ;
// CONCATENATED MODULE: ./src/scripts/actions/items.js
2018-05-25 15:00:27 +02:00
2019-11-03 18:45:16 +01:00
/ * *
2019-11-07 09:50:19 +01:00
* @ typedef { import ( 'redux' ) . Action } Action
2019-11-03 18:45:16 +01:00
* @ typedef { import ( '../../../types/index' ) . Choices . Item } Item
* /
/ * *
* @ param { Item } item
2019-11-07 09:50:19 +01:00
* @ returns { Action & Item }
2019-11-03 18:45:16 +01:00
* /
2019-10-22 23:20:40 +02:00
var items _addItem = function addItem ( _ref ) {
var value = _ref . value ,
label = _ref . label ,
id = _ref . id ,
choiceId = _ref . choiceId ,
groupId = _ref . groupId ,
customProperties = _ref . customProperties ,
placeholder = _ref . placeholder ,
keyCode = _ref . keyCode ;
return {
type : ACTION _TYPES . ADD _ITEM ,
value : value ,
label : label ,
id : id ,
choiceId : choiceId ,
groupId : groupId ,
customProperties : customProperties ,
placeholder : placeholder ,
keyCode : keyCode
} ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { string } id
* @ param { string } choiceId
2019-11-07 09:50:19 +01:00
* @ returns { Action & { id : string , choiceId : string } }
2019-11-03 18:45:16 +01:00
* /
2019-10-22 23:20:40 +02:00
var items _removeItem = function removeItem ( id , choiceId ) {
return {
type : ACTION _TYPES . REMOVE _ITEM ,
id : id ,
choiceId : choiceId
} ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { string } id
* @ param { boolean } highlighted
2019-11-07 09:50:19 +01:00
* @ returns { Action & { id : string , highlighted : boolean } }
2019-11-03 18:45:16 +01:00
* /
2019-10-22 23:20:40 +02:00
var items _highlightItem = function highlightItem ( id , highlighted ) {
return {
type : ACTION _TYPES . HIGHLIGHT _ITEM ,
id : id ,
highlighted : highlighted
} ;
} ;
// CONCATENATED MODULE: ./src/scripts/actions/groups.js
2018-10-13 12:19:24 +02:00
2019-11-03 18:45:16 +01:00
/ * *
2019-11-07 09:50:19 +01:00
* @ typedef { import ( 'redux' ) . Action } Action
2019-11-03 18:45:16 +01:00
* @ typedef { import ( '../../../types/index' ) . Choices . Group } Group
* /
/ * *
* @ param { Group } group
2019-11-07 09:50:19 +01:00
* @ returns { Action & Group }
2019-11-03 18:45:16 +01:00
* /
var groups _addGroup = function addGroup ( _ref ) {
var value = _ref . value ,
id = _ref . id ,
active = _ref . active ,
disabled = _ref . disabled ;
2019-10-22 23:20:40 +02:00
return {
type : ACTION _TYPES . ADD _GROUP ,
value : value ,
id : id ,
active : active ,
disabled : disabled
} ;
} ;
// CONCATENATED MODULE: ./src/scripts/actions/misc.js
2019-11-03 18:45:16 +01:00
/ * *
2019-11-07 09:50:19 +01:00
* @ typedef { import ( 'redux' ) . Action } Action
* /
/ * *
* @ returns { Action }
2019-11-03 18:45:16 +01:00
* /
2019-10-22 23:20:40 +02:00
var clearAll = function clearAll ( ) {
return {
type : 'CLEAR_ALL'
} ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { any } state
2019-11-07 09:50:19 +01:00
* @ returns { Action & { state : object } }
2019-11-03 18:45:16 +01:00
* /
2019-10-22 23:20:40 +02:00
var resetTo = function resetTo ( state ) {
return {
type : 'RESET_TO' ,
state : state
} ;
} ;
2019-11-03 18:45:16 +01:00
/ * *
* @ param { boolean } isLoading
2019-11-07 09:50:19 +01:00
* @ returns { Action & { isLoading : boolean } }
2019-11-03 18:45:16 +01:00
* /
2019-10-22 23:20:40 +02:00
var setIsLoading = function setIsLoading ( isLoading ) {
return {
type : 'SET_IS_LOADING' ,
isLoading : isLoading
} ;
} ;
// CONCATENATED MODULE: ./src/scripts/choices.js
2019-10-29 22:19:56 +01:00
function choices _defineProperties ( target , props ) { for ( var i = 0 ; i < props . length ; i ++ ) { var descriptor = props [ i ] ; descriptor . enumerable = descriptor . enumerable || false ; descriptor . configurable = true ; if ( "value" in descriptor ) descriptor . writable = true ; Object . defineProperty ( target , descriptor . key , descriptor ) ; } }
function choices _createClass ( Constructor , protoProps , staticProps ) { if ( protoProps ) choices _defineProperties ( Constructor . prototype , protoProps ) ; if ( staticProps ) choices _defineProperties ( Constructor , staticProps ) ; return Constructor ; }
2018-10-13 12:19:24 +02:00
2019-11-13 16:40:47 +01:00
/** @see {@link http://browserhacks.com/#hack-acea075d0ac6954f275a70023906050c} */
var IS _IE11 = '-ms-scroll-limit' in document . documentElement . style && '-ms-ime-align' in document . documentElement . style ;
2019-10-22 23:20:40 +02:00
/ * *
2019-11-03 18:45:16 +01:00
* @ typedef { import ( '../../types/index' ) . Choices . Choice } Choice
* @ typedef { import ( '../../types/index' ) . Choices . Item } Item
* @ typedef { import ( '../../types/index' ) . Choices . Group } Group
* @ typedef { import ( '../../types/index' ) . Choices . Options } Options
2019-10-22 23:20:40 +02:00
* /
2018-10-27 17:45:19 +02:00
2019-11-03 18:45:16 +01:00
/** @type {Partial<Options>} */
var USER _DEFAULTS = { } ;
2019-10-29 22:19:56 +01:00
/ * *
2019-11-03 18:45:16 +01:00
* Choices
* @ author Josh Johnson < josh @ joshuajohnson . co . uk >
2019-10-29 22:19:56 +01:00
* /
2019-10-22 23:20:40 +02:00
var choices _Choices =
/*#__PURE__*/
function ( ) {
2019-10-29 22:19:56 +01:00
choices _createClass ( Choices , null , [ {
key : "defaults" ,
get : function get ( ) {
return Object . preventExtensions ( {
get options ( ) {
return USER _DEFAULTS ;
} ,
get templates ( ) {
return TEMPLATES ;
}
} ) ;
}
/ * *
* @ param { string | HTMLInputElement | HTMLSelectElement } element
2019-11-03 18:45:16 +01:00
* @ param { Partial < Options > } userConfig
2019-10-29 22:19:56 +01:00
* /
} ] ) ;
2019-10-22 23:20:40 +02:00
function Choices ( element , userConfig ) {
var _this = this ;
2018-10-27 17:45:19 +02:00
2019-10-22 23:20:40 +02:00
if ( element === void 0 ) {
element = '[data-choice]' ;
}
2018-10-27 17:45:19 +02:00
2019-10-22 23:20:40 +02:00
if ( userConfig === void 0 ) {
userConfig = { } ;
}
2018-10-27 17:45:19 +02:00
2019-11-03 18:45:16 +01:00
/** @type {Partial<Options>} */
2019-10-29 22:19:56 +01:00
this . config = cjs _default . a . all ( [ DEFAULT _CONFIG , Choices . defaults . options , userConfig ] , // When merging array configs, replace with a copy of the userConfig array,
2019-10-22 23:20:40 +02:00
// instead of concatenating with the default array
{
2019-11-03 18:45:16 +01:00
arrayMerge : function arrayMerge ( _ , sourceArray ) {
2019-10-22 23:20:40 +02:00
return [ ] . concat ( sourceArray ) ;
}
2019-11-07 09:50:19 +01:00
} ) ;
2019-10-22 23:20:40 +02:00
var invalidConfigOptions = diff ( this . config , DEFAULT _CONFIG ) ;
2019-10-15 10:49:38 +02:00
2019-10-22 23:20:40 +02:00
if ( invalidConfigOptions . length ) {
console . warn ( 'Unknown config option(s) passed' , invalidConfigOptions . join ( ', ' ) ) ;
}
2019-10-15 10:49:38 +02:00
2019-11-03 18:45:16 +01:00
var passedElement = typeof element === 'string' ? document . querySelector ( element ) : element ;
2019-10-15 10:49:38 +02:00
2019-10-29 22:19:56 +01:00
if ( ! ( passedElement instanceof HTMLInputElement || passedElement instanceof HTMLSelectElement ) ) {
throw TypeError ( 'Expected one of the following types text|select-one|select-multiple' ) ;
2019-10-15 10:49:38 +02:00
}
2019-11-03 18:45:16 +01:00
this . _isTextElement = passedElement . type === TEXT _TYPE ;
this . _isSelectOneElement = passedElement . type === SELECT _ONE _TYPE ;
this . _isSelectMultipleElement = passedElement . type === SELECT _MULTIPLE _TYPE ;
2019-10-22 23:20:40 +02:00
this . _isSelectElement = this . _isSelectOneElement || this . _isSelectMultipleElement ;
2019-11-07 09:50:19 +01:00
this . config . searchEnabled = this . _isSelectMultipleElement || this . config . searchEnabled ;
if ( ! [ 'auto' , 'always' ] . includes ( this . config . renderSelectedChoices ) ) {
this . config . renderSelectedChoices = 'auto' ;
}
if ( userConfig . addItemFilter && typeof userConfig . addItemFilter !== 'function' ) {
var re = userConfig . addItemFilter instanceof RegExp ? userConfig . addItemFilter : new RegExp ( userConfig . addItemFilter ) ;
this . config . addItemFilter = re . test . bind ( re ) ;
}
2019-10-15 10:49:38 +02:00
2019-10-22 23:20:40 +02:00
if ( this . _isTextElement ) {
this . passedElement = new WrappedInput ( {
element : passedElement ,
classNames : this . config . classNames ,
delimiter : this . config . delimiter
} ) ;
2019-10-29 22:19:56 +01:00
} else {
2019-10-22 23:20:40 +02:00
this . passedElement = new WrappedSelect ( {
element : passedElement ,
classNames : this . config . classNames ,
template : function template ( data ) {
2019-10-29 22:19:56 +01:00
return _this . _templates . option ( data ) ;
2019-10-22 23:20:40 +02:00
}
} ) ;
}
2019-10-15 10:49:38 +02:00
2019-10-22 23:20:40 +02:00
this . initialised = false ;
2019-10-29 22:19:56 +01:00
this . _store = new store _Store ( ) ;
2019-10-22 23:20:40 +02:00
this . _initialState = { } ;
this . _currentState = { } ;
this . _prevState = { } ;
this . _currentValue = '' ;
this . _canSearch = this . config . searchEnabled ;
this . _isScrollingOnIe = false ;
this . _highlightPosition = 0 ;
this . _wasTap = true ;
this . _placeholderValue = this . _generatePlaceholderValue ( ) ;
this . _baseId = generateId ( this . passedElement . element , 'choices-' ) ;
2019-10-29 22:19:56 +01:00
/ * *
* setting direction in cases where it ' s explicitly set on passedElement
* or when calculated direction is different from the document
* @ type { HTMLElement [ 'dir' ] }
* /
2019-11-03 18:45:16 +01:00
this . _direction = this . passedElement . dir ;
2019-10-29 22:19:56 +01:00
if ( ! this . _direction ) {
var _window$getComputedSt = window . getComputedStyle ( this . passedElement . element ) ,
elementDirection = _window$getComputedSt . direction ;
var _window$getComputedSt2 = window . getComputedStyle ( document . documentElement ) ,
documentDirection = _window$getComputedSt2 . direction ;
if ( elementDirection !== documentDirection ) {
this . _direction = elementDirection ;
}
}
2019-10-22 23:20:40 +02:00
this . _idNames = {
itemChoice : 'item-choice'
2019-11-03 18:45:16 +01:00
} ; // Assign preset groups from passed element
2019-11-17 13:38:39 +01:00
this . _presetGroups = this . passedElement . optionGroups ; // Assign preset options from passed element
this . _presetOptions = this . passedElement . options ; // Assign preset choices from passed object
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . _presetChoices = this . config . choices ; // Assign preset items from passed object first
2017-11-07 12:59:49 +01:00
2019-11-03 18:45:16 +01:00
this . _presetItems = this . config . items ; // Add any values passed from attribute
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( this . passedElement . value ) {
this . _presetItems = this . _presetItems . concat ( this . passedElement . value . split ( this . config . delimiter ) ) ;
2019-11-03 18:45:16 +01:00
} // Create array of choices from option elements
if ( this . passedElement . options ) {
this . passedElement . options . forEach ( function ( o ) {
_this . _presetChoices . push ( {
value : o . value ,
label : o . innerHTML ,
selected : o . selected ,
disabled : o . disabled || o . parentNode . disabled ,
placeholder : o . value === '' || o . hasAttribute ( 'placeholder' ) ,
customProperties : o . getAttribute ( 'data-custom-properties' )
} ) ;
} ) ;
2019-10-22 23:20:40 +02:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . _render = this . _render . bind ( this ) ;
this . _onFocus = this . _onFocus . bind ( this ) ;
this . _onBlur = this . _onBlur . bind ( this ) ;
this . _onKeyUp = this . _onKeyUp . bind ( this ) ;
this . _onKeyDown = this . _onKeyDown . bind ( this ) ;
this . _onClick = this . _onClick . bind ( this ) ;
this . _onTouchMove = this . _onTouchMove . bind ( this ) ;
this . _onTouchEnd = this . _onTouchEnd . bind ( this ) ;
this . _onMouseDown = this . _onMouseDown . bind ( this ) ;
this . _onMouseOver = this . _onMouseOver . bind ( this ) ;
this . _onFormReset = this . _onFormReset . bind ( this ) ;
this . _onAKey = this . _onAKey . bind ( this ) ;
this . _onEnterKey = this . _onEnterKey . bind ( this ) ;
this . _onEscapeKey = this . _onEscapeKey . bind ( this ) ;
this . _onDirectionKey = this . _onDirectionKey . bind ( this ) ;
2019-11-03 18:45:16 +01:00
this . _onDeleteKey = this . _onDeleteKey . bind ( this ) ; // If element has already been initialised with Choices, fail silently
2019-02-09 19:13:25 +01:00
2019-11-03 18:45:16 +01:00
if ( this . passedElement . isActive ) {
2019-10-29 22:19:56 +01:00
if ( ! this . config . silent ) {
2019-10-22 23:20:40 +02:00
console . warn ( 'Trying to initialise Choices on element already initialised' ) ;
}
2019-10-29 22:19:56 +01:00
this . initialised = true ;
return ;
2019-10-22 23:20:40 +02:00
} // Let's go
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
this . init ( ) ;
}
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
var _proto = Choices . prototype ;
2018-04-25 10:20:59 +02:00
2019-10-22 23:20:40 +02:00
_proto . init = function init ( ) {
if ( this . initialised ) {
return ;
2019-01-26 13:36:47 +01:00
}
2019-10-22 23:20:40 +02:00
this . _createTemplates ( ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
this . _createElements ( ) ;
2018-04-25 10:20:59 +02:00
2019-10-22 23:20:40 +02:00
this . _createStructure ( ) ; // Set initial state (We need to clone the state because some reducers
// modify the inner objects properties in the state) 🤢
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . _initialState = cloneObject ( this . _store . state ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . _store . subscribe ( this . _render ) ;
this . _render ( ) ;
this . _addEventListeners ( ) ;
var shouldDisable = ! this . config . addItems || this . passedElement . element . hasAttribute ( 'disabled' ) ;
if ( shouldDisable ) {
this . disable ( ) ;
2017-11-15 07:51:53 +01:00
}
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
this . initialised = true ;
var callbackOnInit = this . config . callbackOnInit ; // Run callback if it is a function
2019-11-03 18:45:16 +01:00
if ( callbackOnInit && typeof callbackOnInit === 'function' ) {
2019-10-22 23:20:40 +02:00
callbackOnInit . call ( this ) ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
} ;
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
_proto . destroy = function destroy ( ) {
if ( ! this . initialised ) {
return ;
2017-11-15 07:51:53 +01:00
}
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
this . _removeEventListeners ( ) ;
this . passedElement . reveal ( ) ;
this . containerOuter . unwrap ( this . passedElement . element ) ;
2019-11-17 13:38:39 +01:00
this . clearStore ( ) ;
2019-10-22 23:20:40 +02:00
if ( this . _isSelectElement ) {
2019-11-17 13:38:39 +01:00
this . passedElement . options = this . _presetOptions ;
2017-11-15 07:51:53 +01:00
}
2016-10-26 16:43:15 +02:00
2019-10-29 22:19:56 +01:00
this . _templates = null ;
2019-10-22 23:20:40 +02:00
this . initialised = false ;
} ;
_proto . enable = function enable ( ) {
if ( this . passedElement . isDisabled ) {
this . passedElement . enable ( ) ;
2017-11-15 07:51:53 +01:00
}
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
if ( this . containerOuter . isDisabled ) {
this . _addEventListeners ( ) ;
this . input . enable ( ) ;
this . containerOuter . enable ( ) ;
2017-11-13 20:13:37 +01:00
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
return this ;
} ;
_proto . disable = function disable ( ) {
if ( ! this . passedElement . isDisabled ) {
this . passedElement . disable ( ) ;
2017-11-15 07:51:53 +01:00
}
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
if ( ! this . containerOuter . isDisabled ) {
this . _removeEventListeners ( ) ;
this . input . disable ( ) ;
this . containerOuter . disable ( ) ;
2017-11-13 20:13:37 +01:00
}
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
return this ;
} ;
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
_proto . highlightItem = function highlightItem ( item , runEvent ) {
if ( runEvent === void 0 ) {
runEvent = true ;
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( ! item ) {
return this ;
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
var id = item . id ,
_item$groupId = item . groupId ,
groupId = _item$groupId === void 0 ? - 1 : _item$groupId ,
_item$value = item . value ,
value = _item$value === void 0 ? '' : _item$value ,
_item$label = item . label ,
label = _item$label === void 0 ? '' : _item$label ;
var group = groupId >= 0 ? this . _store . getGroupById ( groupId ) : null ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
this . _store . dispatch ( items _highlightItem ( id , true ) ) ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( runEvent ) {
this . passedElement . triggerEvent ( EVENTS . highlightItem , {
id : id ,
value : value ,
label : label ,
groupValue : group && group . value ? group . value : null
} ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
return this ;
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . unhighlightItem = function unhighlightItem ( item ) {
if ( ! item ) {
return this ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var id = item . id ,
_item$groupId2 = item . groupId ,
groupId = _item$groupId2 === void 0 ? - 1 : _item$groupId2 ,
_item$value2 = item . value ,
value = _item$value2 === void 0 ? '' : _item$value2 ,
_item$label2 = item . label ,
label = _item$label2 === void 0 ? '' : _item$label2 ;
var group = groupId >= 0 ? this . _store . getGroupById ( groupId ) : null ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . _store . dispatch ( items _highlightItem ( id , false ) ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . passedElement . triggerEvent ( EVENTS . highlightItem , {
id : id ,
value : value ,
label : label ,
groupValue : group && group . value ? group . value : null
} ) ;
return this ;
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . highlightAll = function highlightAll ( ) {
var _this2 = this ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
this . _store . items . forEach ( function ( item ) {
return _this2 . highlightItem ( item ) ;
} ) ;
2019-01-26 13:36:47 +01:00
2019-10-22 23:20:40 +02:00
return this ;
} ;
2019-01-26 13:36:47 +01:00
2019-10-22 23:20:40 +02:00
_proto . unhighlightAll = function unhighlightAll ( ) {
var _this3 = this ;
2018-05-28 17:22:22 +02:00
2019-10-22 23:20:40 +02:00
this . _store . items . forEach ( function ( item ) {
return _this3 . unhighlightItem ( item ) ;
} ) ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
return this ;
} ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
_proto . removeActiveItemsByValue = function removeActiveItemsByValue ( value ) {
var _this4 = this ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
this . _store . activeItems . filter ( function ( item ) {
return item . value === value ;
} ) . forEach ( function ( item ) {
return _this4 . _removeItem ( item ) ;
} ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
return this ;
} ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
_proto . removeActiveItems = function removeActiveItems ( excludedId ) {
var _this5 = this ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
this . _store . activeItems . filter ( function ( _ref ) {
var id = _ref . id ;
return id !== excludedId ;
} ) . forEach ( function ( item ) {
return _this5 . _removeItem ( item ) ;
} ) ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
return this ;
} ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
_proto . removeHighlightedItems = function removeHighlightedItems ( runEvent ) {
var _this6 = this ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( runEvent === void 0 ) {
runEvent = false ;
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
this . _store . highlightedActiveItems . forEach ( function ( item ) {
_this6 . _removeItem ( item ) ; // If this action was performed by the user
// trigger the event
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( runEvent ) {
_this6 . _triggerChange ( item . value ) ;
2017-11-07 12:59:49 +01:00
}
2019-10-22 23:20:40 +02:00
} ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
return this ;
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . showDropdown = function showDropdown ( preventInputFocus ) {
var _this7 = this ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( this . dropdown . isActive ) {
return this ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
requestAnimationFrame ( function ( ) {
_this7 . dropdown . show ( ) ;
2019-02-09 19:13:25 +01:00
2019-11-03 18:45:16 +01:00
_this7 . containerOuter . open ( _this7 . dropdown . distanceFromTopWindow ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( ! preventInputFocus && _this7 . _canSearch ) {
_this7 . input . focus ( ) ;
2017-11-15 07:51:53 +01:00
}
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
_this7 . passedElement . triggerEvent ( EVENTS . showDropdown , { } ) ;
} ) ;
return this ;
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . hideDropdown = function hideDropdown ( preventInputBlur ) {
var _this8 = this ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( ! this . dropdown . isActive ) {
return this ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
requestAnimationFrame ( function ( ) {
_this8 . dropdown . hide ( ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_this8 . containerOuter . close ( ) ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( ! preventInputBlur && _this8 . _canSearch ) {
_this8 . input . removeActiveDescendant ( ) ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
_this8 . input . blur ( ) ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
_this8 . passedElement . triggerEvent ( EVENTS . hideDropdown , { } ) ;
} ) ;
return this ;
} ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
_proto . getValue = function getValue ( valueOnly ) {
if ( valueOnly === void 0 ) {
valueOnly = false ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var values = this . _store . activeItems . reduce ( function ( selectedItems , item ) {
var itemValue = valueOnly ? item . value : item ;
selectedItems . push ( itemValue ) ;
return selectedItems ;
} , [ ] ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
return this . _isSelectOneElement ? values [ 0 ] : values ;
2019-10-28 20:53:24 +01:00
}
/ * *
* @ param { string [ ] | import ( '../../types/index' ) . Choices . Item [ ] } items
* /
;
2017-11-07 12:59:49 +01:00
2019-10-28 20:53:24 +01:00
_proto . setValue = function setValue ( items ) {
2019-10-22 23:20:40 +02:00
var _this9 = this ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( ! this . initialised ) {
return this ;
}
2016-08-23 08:24:45 +02:00
2019-10-28 20:53:24 +01:00
items . forEach ( function ( value ) {
2019-10-22 23:20:40 +02:00
return _this9 . _setChoiceOrItem ( value ) ;
} ) ;
return this ;
} ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
_proto . setChoiceByValue = function setChoiceByValue ( value ) {
var _this10 = this ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( ! this . initialised || this . _isTextElement ) {
return this ;
} // If only one value has been passed, convert to array
2019-02-09 19:13:25 +01:00
2019-11-03 18:45:16 +01:00
var choiceValue = Array . isArray ( value ) ? value : [ value ] ; // Loop through each value and
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
choiceValue . forEach ( function ( val ) {
return _this10 . _findAndSelectChoiceByValue ( val ) ;
} ) ;
return this ;
2019-10-29 22:19:56 +01:00
}
/ * *
* Set choices of select input via an array of objects ( or function that returns array of object or promise of it ) ,
* a value field name and a label field name .
* This behaves the same as passing items via the choices option but can be called after initialising Choices .
* This can also be used to add groups of choices ( see example 2 ) ; Optionally pass a true ` replaceChoices ` value to remove any existing choices .
* Optionally pass a ` customProperties ` object to add additional data to your choices ( useful when searching / filtering etc ) .
*
* * * Input types affected : * * select - one , select - multiple
*
2019-11-03 18:45:16 +01:00
* @ template { Choice [ ] | ( ( instance : Choices ) => object [ ] | Promise < object [ ] > ) } T
2019-10-29 22:19:56 +01:00
* @ param { T } [ choicesArrayOrFetcher ]
* @ param { string } [ value = 'value' ] - name of ` value ` field
* @ param { string } [ label = 'label' ] - name of 'label' field
* @ param { boolean } [ replaceChoices = false ] - whether to replace of add choices
* @ returns { this | Promise < this > }
*
* @ example
* ` ` ` js
* const example = new Choices ( element ) ;
*
* example . setChoices ( [
* { value : 'One' , label : 'Label One' , disabled : true } ,
* { value : 'Two' , label : 'Label Two' , selected : true } ,
* { value : 'Three' , label : 'Label Three' } ,
* ] , 'value' , 'label' , false ) ;
* ` ` `
*
* @ example
* ` ` ` js
* const example = new Choices ( element ) ;
*
* example . setChoices ( async ( ) => {
* try {
* const items = await fetch ( '/items' ) ;
* return items . json ( )
* } catch ( err ) {
* console . error ( err )
* }
* } ) ;
* ` ` `
*
* @ example
* ` ` ` js
* const example = new Choices ( element ) ;
*
* example . setChoices ( [ {
* label : 'Group one' ,
* id : 1 ,
* disabled : false ,
* choices : [
* { value : 'Child One' , label : 'Child One' , selected : true } ,
* { value : 'Child Two' , label : 'Child Two' , disabled : true } ,
* { value : 'Child Three' , label : 'Child Three' } ,
* ]
* } ,
* {
* label : 'Group two' ,
* id : 2 ,
* disabled : false ,
* choices : [
* { value : 'Child Four' , label : 'Child Four' , disabled : true } ,
* { value : 'Child Five' , label : 'Child Five' } ,
* { value : 'Child Six' , label : 'Child Six' , customProperties : {
* description : 'Custom description about child six' ,
* random : 'Another random custom property'
* } } ,
* ]
* } ] , 'value' , 'label' , false ) ;
* ` ` `
* /
;
2019-02-09 19:13:25 +01:00
2019-10-29 22:19:56 +01:00
_proto . setChoices = function setChoices ( choicesArrayOrFetcher , value , label , replaceChoices ) {
2019-10-22 23:20:40 +02:00
var _this11 = this ;
2016-08-23 08:24:45 +02:00
2019-10-29 22:19:56 +01:00
if ( choicesArrayOrFetcher === void 0 ) {
choicesArrayOrFetcher = [ ] ;
2019-10-22 23:20:40 +02:00
}
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
if ( value === void 0 ) {
2019-10-29 22:19:56 +01:00
value = 'value' ;
2019-10-22 23:20:40 +02:00
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( label === void 0 ) {
2019-10-29 22:19:56 +01:00
label = 'label' ;
2019-10-22 23:20:40 +02:00
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( replaceChoices === void 0 ) {
replaceChoices = false ;
}
2016-08-23 08:24:45 +02:00
2019-10-29 22:19:56 +01:00
if ( ! this . initialised ) {
throw new ReferenceError ( "setChoices was called on a non-initialized instance of Choices" ) ;
}
if ( ! this . _isSelectElement ) {
throw new TypeError ( "setChoices can't be used with INPUT based Choices" ) ;
}
if ( typeof value !== 'string' || ! value ) {
throw new TypeError ( "value parameter must be a name of 'value' field in passed objects" ) ;
2019-10-22 23:20:40 +02:00
} // Clear choices if needed
2017-11-07 12:59:49 +01:00
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( replaceChoices ) {
this . clearChoices ( ) ;
}
2017-11-07 12:59:49 +01:00
2019-11-03 18:45:16 +01:00
if ( typeof choicesArrayOrFetcher === 'function' ) {
// it's a choices fetcher function
2019-10-29 22:19:56 +01:00
var fetcher = choicesArrayOrFetcher ( this ) ;
2019-11-03 18:45:16 +01:00
if ( typeof Promise === 'function' && fetcher instanceof Promise ) {
2019-10-29 22:19:56 +01:00
// that's a promise
2019-11-03 18:45:16 +01:00
// eslint-disable-next-line compat/compat
return new Promise ( function ( resolve ) {
return requestAnimationFrame ( resolve ) ;
} ) . then ( function ( ) {
return _this11 . _handleLoadingState ( true ) ;
} ) . then ( function ( ) {
return fetcher ;
} ) . then ( function ( data ) {
2019-10-29 22:19:56 +01:00
return _this11 . setChoices ( data , value , label , replaceChoices ) ;
} ) . catch ( function ( err ) {
if ( ! _this11 . config . silent ) {
console . error ( err ) ;
}
} ) . then ( function ( ) {
return _this11 . _handleLoadingState ( false ) ;
} ) . then ( function ( ) {
return _this11 ;
} ) ;
} // function returned something else than promise, let's check if it's an array of choices
if ( ! Array . isArray ( fetcher ) ) {
throw new TypeError ( ".setChoices first argument function must return either array of choices or Promise, got: " + typeof fetcher ) ;
} // recursion with results, it's sync and choices were cleared already
return this . setChoices ( fetcher , value , label , false ) ;
}
2019-11-03 18:45:16 +01:00
if ( ! Array . isArray ( choicesArrayOrFetcher ) ) {
throw new TypeError ( ".setChoices must be called either with array of choices with a function resulting into Promise of array of choices" ) ;
}
2019-10-22 23:20:40 +02:00
this . containerOuter . removeLoadingState ( ) ;
2019-02-09 19:13:25 +01:00
2019-11-08 10:19:18 +01:00
this . _startLoading ( ) ;
2019-11-03 18:45:16 +01:00
choicesArrayOrFetcher . forEach ( function ( groupOrChoice ) {
2019-10-22 23:20:40 +02:00
if ( groupOrChoice . choices ) {
_this11 . _addGroup ( {
2019-11-08 10:19:18 +01:00
id : parseInt ( groupOrChoice . id , 10 ) || null ,
2019-10-22 23:20:40 +02:00
group : groupOrChoice ,
valueKey : value ,
labelKey : label
2017-11-15 07:51:53 +01:00
} ) ;
2019-10-22 23:20:40 +02:00
} else {
_this11 . _addChoice ( {
value : groupOrChoice [ value ] ,
label : groupOrChoice [ label ] ,
isSelected : groupOrChoice . selected ,
isDisabled : groupOrChoice . disabled ,
customProperties : groupOrChoice . customProperties ,
placeholder : groupOrChoice . placeholder
2017-11-15 07:51:53 +01:00
} ) ;
}
2019-11-03 18:45:16 +01:00
} ) ;
2017-11-07 12:59:49 +01:00
2019-11-08 10:19:18 +01:00
this . _stopLoading ( ) ;
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
return this ;
} ;
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
_proto . clearChoices = function clearChoices ( ) {
this . _store . dispatch ( choices _clearChoices ( ) ) ;
2019-10-29 22:19:56 +01:00
return this ;
2019-10-22 23:20:40 +02:00
} ;
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
_proto . clearStore = function clearStore ( ) {
this . _store . dispatch ( clearAll ( ) ) ;
2019-01-26 13:36:47 +01:00
2019-10-22 23:20:40 +02:00
return this ;
} ;
2019-01-26 13:36:47 +01:00
2019-10-22 23:20:40 +02:00
_proto . clearInput = function clearInput ( ) {
var shouldSetInputWidth = ! this . _isSelectOneElement ;
this . input . clear ( shouldSetInputWidth ) ;
2019-01-26 13:36:47 +01:00
2019-10-22 23:20:40 +02:00
if ( ! this . _isTextElement && this . _canSearch ) {
this . _isSearching = false ;
2019-01-26 13:36:47 +01:00
2019-10-22 23:20:40 +02:00
this . _store . dispatch ( choices _activateChoices ( true ) ) ;
}
2019-01-26 13:36:47 +01:00
2019-10-22 23:20:40 +02:00
return this ;
} ;
2019-01-26 13:36:47 +01:00
2019-10-22 23:20:40 +02:00
_proto . _render = function _render ( ) {
if ( this . _store . isLoading ( ) ) {
return ;
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
this . _currentState = this . _store . state ;
var stateChanged = this . _currentState . choices !== this . _prevState . choices || this . _currentState . groups !== this . _prevState . groups || this . _currentState . items !== this . _prevState . items ;
var shouldRenderChoices = this . _isSelectElement ;
var shouldRenderItems = this . _currentState . items !== this . _prevState . items ;
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
if ( ! stateChanged ) {
return ;
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
if ( shouldRenderChoices ) {
this . _renderChoices ( ) ;
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
if ( shouldRenderItems ) {
this . _renderItems ( ) ;
}
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
this . _prevState = this . _currentState ;
} ;
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
_proto . _renderChoices = function _renderChoices ( ) {
2019-10-29 22:19:56 +01:00
var _this12 = this ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var _this$ _store = this . _store ,
activeGroups = _this$ _store . activeGroups ,
activeChoices = _this$ _store . activeChoices ;
var choiceListFragment = document . createDocumentFragment ( ) ;
this . choiceList . clear ( ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( this . config . resetScrollPosition ) {
requestAnimationFrame ( function ( ) {
2019-10-29 22:19:56 +01:00
return _this12 . choiceList . scrollToTop ( ) ;
2019-10-22 23:20:40 +02:00
} ) ;
} // If we have grouped options
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( activeGroups . length >= 1 && ! this . _isSearching ) {
// If we have a placeholder choice along with groups
var activePlaceholders = activeChoices . filter ( function ( activeChoice ) {
return activeChoice . placeholder === true && activeChoice . groupId === - 1 ;
} ) ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( activePlaceholders . length >= 1 ) {
choiceListFragment = this . _createChoicesFragment ( activePlaceholders , choiceListFragment ) ;
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
choiceListFragment = this . _createGroupsFragment ( activeGroups , activeChoices , choiceListFragment ) ;
} else if ( activeChoices . length >= 1 ) {
choiceListFragment = this . _createChoicesFragment ( activeChoices , choiceListFragment ) ;
} // If we have choices to show
2019-02-09 19:13:25 +01:00
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
if ( choiceListFragment . childNodes && choiceListFragment . childNodes . length > 0 ) {
var activeItems = this . _store . activeItems ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
var canAddItem = this . _canAddItem ( activeItems , this . input . value ) ; // ...and we can select them
2016-08-23 08:24:45 +02:00
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( canAddItem . response ) {
// ...append them and highlight the first choice
this . choiceList . append ( choiceListFragment ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . _highlightChoice ( ) ;
} else {
// ...otherwise show a notice
this . choiceList . append ( this . _getTemplate ( 'notice' , canAddItem . notice ) ) ;
}
} else {
// Otherwise show a notice
var dropdownItem ;
var notice ;
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
if ( this . _isSearching ) {
2019-11-03 18:45:16 +01:00
notice = typeof this . config . noResultsText === 'function' ? this . config . noResultsText ( ) : this . config . noResultsText ;
2019-10-22 23:20:40 +02:00
dropdownItem = this . _getTemplate ( 'notice' , notice , 'no-results' ) ;
} else {
2019-11-03 18:45:16 +01:00
notice = typeof this . config . noChoicesText === 'function' ? this . config . noChoicesText ( ) : this . config . noChoicesText ;
2019-10-22 23:20:40 +02:00
dropdownItem = this . _getTemplate ( 'notice' , notice , 'no-choices' ) ;
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
this . choiceList . append ( dropdownItem ) ;
2017-11-13 20:13:37 +01:00
}
2019-10-22 23:20:40 +02:00
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . _renderItems = function _renderItems ( ) {
var activeItems = this . _store . activeItems || [ ] ;
this . itemList . clear ( ) ; // Create a fragment to store our list items
// (so we don't have to update the DOM for each item)
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
var itemListFragment = this . _createItemsFragment ( activeItems ) ; // If we have items to add, append them
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( itemListFragment . childNodes ) {
this . itemList . append ( itemListFragment ) ;
}
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . _createGroupsFragment = function _createGroupsFragment ( groups , choices , fragment ) {
2019-10-29 22:19:56 +01:00
var _this13 = this ;
2017-11-07 12:59:49 +01:00
2019-10-28 20:53:24 +01:00
if ( fragment === void 0 ) {
fragment = document . createDocumentFragment ( ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var getGroupChoices = function getGroupChoices ( group ) {
return choices . filter ( function ( choice ) {
2019-10-29 22:19:56 +01:00
if ( _this13 . _isSelectOneElement ) {
2019-10-22 23:20:40 +02:00
return choice . groupId === group . id ;
}
2018-02-02 12:08:03 +01:00
2019-10-29 22:19:56 +01:00
return choice . groupId === group . id && ( _this13 . config . renderSelectedChoices === 'always' || ! choice . selected ) ;
2019-10-22 23:20:40 +02:00
} ) ;
} ; // If sorting is enabled, filter groups
2017-11-07 12:59:49 +01:00
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( this . config . shouldSort ) {
2019-11-03 18:45:16 +01:00
groups . sort ( this . config . sorter ) ;
2019-10-22 23:20:40 +02:00
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
groups . forEach ( function ( group ) {
var groupChoices = getGroupChoices ( group ) ;
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
if ( groupChoices . length >= 1 ) {
2019-10-29 22:19:56 +01:00
var dropdownGroup = _this13 . _getTemplate ( 'choiceGroup' , group ) ;
2017-11-07 12:59:49 +01:00
2019-10-28 20:53:24 +01:00
fragment . appendChild ( dropdownGroup ) ;
2019-10-22 23:20:40 +02:00
2019-10-29 22:19:56 +01:00
_this13 . _createChoicesFragment ( groupChoices , fragment , true ) ;
2019-10-22 23:20:40 +02:00
}
} ) ;
2019-10-28 20:53:24 +01:00
return fragment ;
2019-10-22 23:20:40 +02:00
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . _createChoicesFragment = function _createChoicesFragment ( choices , fragment , withinGroup ) {
2019-10-29 22:19:56 +01:00
var _this14 = this ;
2017-11-07 12:59:49 +01:00
2019-10-28 20:53:24 +01:00
if ( fragment === void 0 ) {
fragment = document . createDocumentFragment ( ) ;
}
2019-10-22 23:20:40 +02:00
if ( withinGroup === void 0 ) {
withinGroup = false ;
2017-11-15 07:51:53 +01:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
// Create a fragment to store our list items (so we don't have to update the DOM for each item)
var _this$config = this . config ,
renderSelectedChoices = _this$config . renderSelectedChoices ,
searchResultLimit = _this$config . searchResultLimit ,
renderChoiceLimit = _this$config . renderChoiceLimit ;
2019-11-03 18:45:16 +01:00
var filter = this . _isSearching ? sortByScore : this . config . sorter ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var appendChoice = function appendChoice ( choice ) {
2019-10-29 22:19:56 +01:00
var shouldRender = renderSelectedChoices === 'auto' ? _this14 . _isSelectOneElement || ! choice . selected : true ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( shouldRender ) {
2019-10-29 22:19:56 +01:00
var dropdownItem = _this14 . _getTemplate ( 'choice' , choice , _this14 . config . itemSelectText ) ;
2019-10-22 23:20:40 +02:00
2019-10-28 20:53:24 +01:00
fragment . appendChild ( dropdownItem ) ;
2019-10-22 23:20:40 +02:00
}
} ;
2018-02-02 12:08:03 +01:00
2019-10-22 23:20:40 +02:00
var rendererableChoices = choices ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( renderSelectedChoices === 'auto' && ! this . _isSelectOneElement ) {
rendererableChoices = choices . filter ( function ( choice ) {
return ! choice . selected ;
} ) ;
} // Split array into placeholders and "normal" choices
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var _rendererableChoices$ = rendererableChoices . reduce ( function ( acc , choice ) {
if ( choice . placeholder ) {
acc . placeholderChoices . push ( choice ) ;
} else {
acc . normalChoices . push ( choice ) ;
2017-11-07 12:59:49 +01:00
}
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
return acc ;
} , {
placeholderChoices : [ ] ,
normalChoices : [ ]
} ) ,
placeholderChoices = _rendererableChoices$ . placeholderChoices ,
normalChoices = _rendererableChoices$ . normalChoices ; // If sorting is enabled or the user is searching, filter choices
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( this . config . shouldSort || this . _isSearching ) {
normalChoices . sort ( filter ) ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
var choiceLimit = rendererableChoices . length ; // Prepend placeholeder
2019-11-03 18:45:16 +01:00
var sortedChoices = this . _isSelectOneElement ? [ ] . concat ( placeholderChoices , normalChoices ) : normalChoices ;
2019-10-22 23:20:40 +02:00
if ( this . _isSearching ) {
choiceLimit = searchResultLimit ;
2019-11-03 18:45:16 +01:00
} else if ( renderChoiceLimit && renderChoiceLimit > 0 && ! withinGroup ) {
2019-10-22 23:20:40 +02:00
choiceLimit = renderChoiceLimit ;
} // Add each choice to dropdown within range
for ( var i = 0 ; i < choiceLimit ; i += 1 ) {
if ( sortedChoices [ i ] ) {
appendChoice ( sortedChoices [ i ] ) ;
2017-11-15 07:51:53 +01:00
}
}
2019-10-22 23:20:40 +02:00
2019-10-28 20:53:24 +01:00
return fragment ;
2019-10-22 23:20:40 +02:00
} ;
_proto . _createItemsFragment = function _createItemsFragment ( items , fragment ) {
2019-10-29 22:19:56 +01:00
var _this15 = this ;
2019-10-22 23:20:40 +02:00
if ( fragment === void 0 ) {
2019-10-28 20:53:24 +01:00
fragment = document . createDocumentFragment ( ) ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
// Create fragment to add elements to
var _this$config2 = this . config ,
shouldSortItems = _this$config2 . shouldSortItems ,
2019-11-03 18:45:16 +01:00
sorter = _this$config2 . sorter ,
2019-10-28 20:53:24 +01:00
removeItemButton = _this$config2 . removeItemButton ; // If sorting is enabled, filter items
2019-10-22 23:20:40 +02:00
if ( shouldSortItems && ! this . _isSelectOneElement ) {
2019-11-03 18:45:16 +01:00
items . sort ( sorter ) ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
if ( this . _isTextElement ) {
// Update the value of the hidden input
this . passedElement . value = items ;
} else {
// Update the options of the hidden input
this . passedElement . options = items ;
2017-11-15 07:51:53 +01:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var addItemToFragment = function addItemToFragment ( item ) {
// Create new list element
2019-10-29 22:19:56 +01:00
var listItem = _this15 . _getTemplate ( 'item' , item , removeItemButton ) ; // Append it to list
2019-02-09 19:13:25 +01:00
2019-10-28 20:53:24 +01:00
fragment . appendChild ( listItem ) ;
2019-10-22 23:20:40 +02:00
} ; // Add each list item to list
2017-11-13 20:13:37 +01:00
2019-02-09 19:13:25 +01:00
2019-11-03 18:45:16 +01:00
items . forEach ( addItemToFragment ) ;
2019-10-28 20:53:24 +01:00
return fragment ;
2019-10-22 23:20:40 +02:00
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . _triggerChange = function _triggerChange ( value ) {
if ( value === undefined || value === null ) {
return ;
2018-02-02 12:08:03 +01:00
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
this . passedElement . triggerEvent ( EVENTS . change , {
value : value
} ) ;
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . _selectPlaceholderChoice = function _selectPlaceholderChoice ( ) {
var placeholderChoice = this . _store . placeholderChoice ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( placeholderChoice ) {
this . _addItem ( {
value : placeholderChoice . value ,
label : placeholderChoice . label ,
choiceId : placeholderChoice . id ,
groupId : placeholderChoice . groupId ,
placeholder : placeholderChoice . placeholder
} ) ;
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
this . _triggerChange ( placeholderChoice . value ) ;
2018-05-25 15:00:27 +02:00
}
2019-10-22 23:20:40 +02:00
} ;
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
_proto . _handleButtonAction = function _handleButtonAction ( activeItems , element ) {
if ( ! activeItems || ! element || ! this . config . removeItems || ! this . config . removeItemButton ) {
return ;
2018-05-25 15:00:27 +02:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var itemId = element . parentNode . getAttribute ( 'data-id' ) ;
var itemToRemove = activeItems . find ( function ( item ) {
return item . id === parseInt ( itemId , 10 ) ;
} ) ; // Remove item associated with button
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . _removeItem ( itemToRemove ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . _triggerChange ( itemToRemove . value ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( this . _isSelectOneElement ) {
this . _selectPlaceholderChoice ( ) ;
}
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . _handleItemAction = function _handleItemAction ( activeItems , element , hasShiftKey ) {
2019-10-29 22:19:56 +01:00
var _this16 = this ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( hasShiftKey === void 0 ) {
hasShiftKey = false ;
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( ! activeItems || ! element || ! this . config . removeItems || this . _isSelectOneElement ) {
return ;
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
var passedId = element . getAttribute ( 'data-id' ) ; // We only want to select one item with a click
// so we deselect any items that aren't the target
// unless shift is being pressed
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
activeItems . forEach ( function ( item ) {
if ( item . id === parseInt ( passedId , 10 ) && ! item . highlighted ) {
2019-10-29 22:19:56 +01:00
_this16 . highlightItem ( item ) ;
2019-10-22 23:20:40 +02:00
} else if ( ! hasShiftKey && item . highlighted ) {
2019-10-29 22:19:56 +01:00
_this16 . unhighlightItem ( item ) ;
2019-10-22 23:20:40 +02:00
}
} ) ; // Focus input as without focus, a user cannot do anything with a
// highlighted item
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
this . input . focus ( ) ;
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . _handleChoiceAction = function _handleChoiceAction ( activeItems , element ) {
if ( ! activeItems || ! element ) {
return ;
} // If we are clicking on an option
2018-05-25 15:00:27 +02:00
2017-11-07 12:59:49 +01:00
2019-10-28 20:53:24 +01:00
var id = element . dataset . id ;
2019-10-22 23:20:40 +02:00
var choice = this . _store . getChoiceById ( id ) ;
2019-10-29 22:19:56 +01:00
if ( ! choice ) {
return ;
}
2019-10-22 23:20:40 +02:00
var passedKeyCode = activeItems [ 0 ] && activeItems [ 0 ] . keyCode ? activeItems [ 0 ] . keyCode : null ;
var hasActiveDropdown = this . dropdown . isActive ; // Update choice keyCode
choice . keyCode = passedKeyCode ;
this . passedElement . triggerEvent ( EVENTS . choice , {
choice : choice
2019-02-09 19:13:25 +01:00
} ) ;
2017-11-13 20:13:37 +01:00
2019-10-28 20:53:24 +01:00
if ( ! choice . selected && ! choice . disabled ) {
2019-10-22 23:20:40 +02:00
var canAddItem = this . _canAddItem ( activeItems , choice . value ) ;
2018-05-28 17:22:22 +02:00
2019-10-22 23:20:40 +02:00
if ( canAddItem . response ) {
this . _addItem ( {
value : choice . value ,
label : choice . label ,
choiceId : choice . id ,
groupId : choice . groupId ,
customProperties : choice . customProperties ,
placeholder : choice . placeholder ,
keyCode : choice . keyCode
} ) ;
this . _triggerChange ( choice . value ) ;
2018-05-28 17:22:22 +02:00
}
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
2019-10-28 20:53:24 +01:00
this . clearInput ( ) ; // We want to close the dropdown if we are dealing with a single select box
2019-10-22 23:20:40 +02:00
if ( hasActiveDropdown && this . _isSelectOneElement ) {
this . hideDropdown ( true ) ;
this . containerOuter . focus ( ) ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
} ;
_proto . _handleBackspace = function _handleBackspace ( activeItems ) {
if ( ! this . config . removeItems || ! activeItems ) {
return ;
2018-02-02 12:08:03 +01:00
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
var lastItem = activeItems [ activeItems . length - 1 ] ;
var hasHighlightedItems = activeItems . some ( function ( item ) {
return item . highlighted ;
} ) ; // If editing the last item is allowed and there are not other selected items,
// we can edit the item value. Otherwise if we can remove items, remove all selected items
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( this . config . editItems && ! hasHighlightedItems && lastItem ) {
this . input . value = lastItem . value ;
this . input . setWidth ( ) ;
this . _removeItem ( lastItem ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . _triggerChange ( lastItem . value ) ;
} else {
if ( ! hasHighlightedItems ) {
// Highlight last item if none already highlighted
this . highlightItem ( lastItem , false ) ;
2017-11-07 12:59:49 +01:00
}
2019-10-22 23:20:40 +02:00
this . removeHighlightedItems ( true ) ;
2017-11-07 12:59:49 +01:00
}
2019-10-22 23:20:40 +02:00
} ;
2017-11-07 12:59:49 +01:00
2019-11-08 10:19:18 +01:00
_proto . _startLoading = function _startLoading ( ) {
this . _store . dispatch ( setIsLoading ( true ) ) ;
} ;
_proto . _stopLoading = function _stopLoading ( ) {
this . _store . dispatch ( setIsLoading ( false ) ) ;
2019-10-22 23:20:40 +02:00
} ;
2018-05-28 17:22:22 +02:00
2019-10-22 23:20:40 +02:00
_proto . _handleLoadingState = function _handleLoadingState ( setLoading ) {
if ( setLoading === void 0 ) {
setLoading = true ;
}
var placeholderItem = this . itemList . getChild ( "." + this . config . classNames . placeholder ) ;
2018-06-07 17:54:11 +02:00
2019-10-22 23:20:40 +02:00
if ( setLoading ) {
this . disable ( ) ;
this . containerOuter . addLoadingState ( ) ;
2018-06-07 17:54:11 +02:00
2019-10-22 23:20:40 +02:00
if ( this . _isSelectOneElement ) {
if ( ! placeholderItem ) {
placeholderItem = this . _getTemplate ( 'placeholder' , this . config . loadingText ) ;
this . itemList . append ( placeholderItem ) ;
} else {
placeholderItem . innerHTML = this . config . loadingText ;
2017-11-07 12:59:49 +01:00
}
2017-11-15 07:51:53 +01:00
} else {
2019-10-22 23:20:40 +02:00
this . input . placeholder = this . config . loadingText ;
2018-05-25 15:00:27 +02:00
}
2019-10-22 23:20:40 +02:00
} else {
this . enable ( ) ;
this . containerOuter . removeLoadingState ( ) ;
2018-05-28 17:22:22 +02:00
2019-10-22 23:20:40 +02:00
if ( this . _isSelectOneElement ) {
placeholderItem . innerHTML = this . _placeholderValue || '' ;
} else {
this . input . placeholder = this . _placeholderValue || '' ;
2018-05-25 15:00:27 +02:00
}
}
2019-10-22 23:20:40 +02:00
} ;
_proto . _handleSearch = function _handleSearch ( value ) {
if ( ! value || ! this . input . isFocussed ) {
return ;
2018-04-25 10:20:59 +02:00
}
2019-10-22 23:20:40 +02:00
var choices = this . _store . choices ;
var _this$config3 = this . config ,
searchFloor = _this$config3 . searchFloor ,
searchChoices = _this$config3 . searchChoices ;
var hasUnactiveChoices = choices . some ( function ( option ) {
return ! option . active ;
} ) ; // Check that we have a value to search and the input was an alphanumeric character
if ( value && value . length >= searchFloor ) {
var resultCount = searchChoices ? this . _searchChoices ( value ) : 0 ; // Trigger search event
this . passedElement . triggerEvent ( EVENTS . search , {
value : value ,
resultCount : resultCount
} ) ;
} else if ( hasUnactiveChoices ) {
// Otherwise reset choices to active
this . _isSearching = false ;
this . _store . dispatch ( choices _activateChoices ( true ) ) ;
2018-04-25 10:20:59 +02:00
}
2019-10-22 23:20:40 +02:00
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . _canAddItem = function _canAddItem ( activeItems , value ) {
var canAddItem = true ;
2019-11-03 18:45:16 +01:00
var notice = typeof this . config . addItemText === 'function' ? this . config . addItemText ( value ) : this . config . addItemText ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( ! this . _isSelectOneElement ) {
var isDuplicateValue = existsInArray ( activeItems , value ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( this . config . maxItemCount > 0 && this . config . maxItemCount <= activeItems . length ) {
// If there is a max entry limit and we have reached that limit
// don't update
canAddItem = false ;
2019-11-03 18:45:16 +01:00
notice = typeof this . config . maxItemText === 'function' ? this . config . maxItemText ( this . config . maxItemCount ) : this . config . maxItemText ;
2019-10-22 23:20:40 +02:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( ! this . config . duplicateItemsAllowed && isDuplicateValue && canAddItem ) {
canAddItem = false ;
2019-11-03 18:45:16 +01:00
notice = typeof this . config . uniqueItemText === 'function' ? this . config . uniqueItemText ( value ) : this . config . uniqueItemText ;
2019-10-22 23:20:40 +02:00
}
2017-11-07 12:59:49 +01:00
2019-10-29 22:19:56 +01:00
if ( this . _isTextElement && this . config . addItems && canAddItem && typeof this . config . addItemFilter === 'function' && ! this . config . addItemFilter ( value ) ) {
2019-10-22 23:20:40 +02:00
canAddItem = false ;
2019-10-29 22:19:56 +01:00
notice = typeof this . config . customAddItemText === 'function' ? this . config . customAddItemText ( value ) : this . config . customAddItemText ;
2019-10-22 23:20:40 +02:00
}
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
return {
response : canAddItem ,
notice : notice
} ;
} ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
_proto . _searchChoices = function _searchChoices ( value ) {
2019-11-03 18:45:16 +01:00
var newValue = typeof value === 'string' ? value . trim ( ) : value ;
var currentValue = typeof this . _currentValue === 'string' ? this . _currentValue . trim ( ) : this . _currentValue ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( newValue . length < 1 && newValue === currentValue + " " ) {
return 0 ;
} // If new value matches the desired length and is not the same as the current value with a space
2019-02-09 19:13:25 +01:00
2018-05-28 16:13:55 +02:00
2019-10-22 23:20:40 +02:00
var haystack = this . _store . searchableChoices ;
var needle = newValue ;
var keys = [ ] . concat ( this . config . searchFields ) ;
var options = Object . assign ( this . config . fuseOptions , {
keys : keys
} ) ;
var fuse = new fuse _default . a ( haystack , options ) ;
var results = fuse . search ( needle ) ;
this . _currentValue = newValue ;
this . _highlightPosition = 0 ;
this . _isSearching = true ;
this . _store . dispatch ( choices _filterChoices ( results ) ) ;
return results . length ;
} ;
_proto . _addEventListeners = function _addEventListeners ( ) {
2019-10-29 22:19:56 +01:00
var _document = document ,
documentElement = _document . documentElement ; // capture events - can cancel event processing or propagation
documentElement . addEventListener ( 'touchend' , this . _onTouchEnd , true ) ;
2019-11-13 16:40:47 +01:00
this . containerOuter . element . addEventListener ( 'keydown' , this . _onKeyDown , true ) ;
this . containerOuter . element . addEventListener ( 'mousedown' , this . _onMouseDown , true ) ; // passive events - doesn't call `preventDefault` or `stopPropagation`
2019-10-29 22:19:56 +01:00
documentElement . addEventListener ( 'click' , this . _onClick , {
passive : true
} ) ;
documentElement . addEventListener ( 'touchmove' , this . _onTouchMove , {
passive : true
} ) ;
2019-11-13 16:40:47 +01:00
this . dropdown . element . addEventListener ( 'mouseover' , this . _onMouseOver , {
2019-10-29 22:19:56 +01:00
passive : true
} ) ;
2019-10-22 23:20:40 +02:00
if ( this . _isSelectOneElement ) {
2019-10-29 22:19:56 +01:00
this . containerOuter . element . addEventListener ( 'focus' , this . _onFocus , {
passive : true
} ) ;
this . containerOuter . element . addEventListener ( 'blur' , this . _onBlur , {
passive : true
} ) ;
2018-05-28 16:13:55 +02:00
}
2019-10-29 22:19:56 +01:00
this . input . element . addEventListener ( 'keyup' , this . _onKeyUp , {
passive : true
} ) ;
this . input . element . addEventListener ( 'focus' , this . _onFocus , {
passive : true
} ) ;
this . input . element . addEventListener ( 'blur' , this . _onBlur , {
passive : true
} ) ;
2018-05-28 16:13:55 +02:00
2019-10-22 23:20:40 +02:00
if ( this . input . element . form ) {
2019-10-29 22:19:56 +01:00
this . input . element . form . addEventListener ( 'reset' , this . _onFormReset , {
passive : true
} ) ;
2019-10-22 23:20:40 +02:00
}
2018-05-28 16:13:55 +02:00
2019-10-22 23:20:40 +02:00
this . input . addEventListeners ( ) ;
} ;
2018-05-28 16:13:55 +02:00
2019-10-22 23:20:40 +02:00
_proto . _removeEventListeners = function _removeEventListeners ( ) {
2019-10-29 22:19:56 +01:00
var _document2 = document ,
documentElement = _document2 . documentElement ;
documentElement . removeEventListener ( 'touchend' , this . _onTouchEnd , true ) ;
2019-11-13 16:40:47 +01:00
this . containerOuter . element . removeEventListener ( 'keydown' , this . _onKeyDown , true ) ;
this . containerOuter . element . removeEventListener ( 'mousedown' , this . _onMouseDown , true ) ;
2019-11-08 10:19:18 +01:00
documentElement . removeEventListener ( 'click' , this . _onClick ) ;
documentElement . removeEventListener ( 'touchmove' , this . _onTouchMove ) ;
2019-11-13 16:40:47 +01:00
this . dropdown . element . removeEventListener ( 'mouseover' , this . _onMouseOver ) ;
2018-05-28 16:13:55 +02:00
2019-10-22 23:20:40 +02:00
if ( this . _isSelectOneElement ) {
2019-11-08 10:19:18 +01:00
this . containerOuter . element . removeEventListener ( 'focus' , this . _onFocus ) ;
this . containerOuter . element . removeEventListener ( 'blur' , this . _onBlur ) ;
2018-05-28 16:13:55 +02:00
}
2017-11-07 12:59:49 +01:00
2019-11-13 16:40:47 +01:00
this . input . element . removeEventListener ( 'keyup' , this . _onKeyUp ) ;
2019-11-08 10:19:18 +01:00
this . input . element . removeEventListener ( 'focus' , this . _onFocus ) ;
this . input . element . removeEventListener ( 'blur' , this . _onBlur ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( this . input . element . form ) {
2019-11-08 10:19:18 +01:00
this . input . element . form . removeEventListener ( 'reset' , this . _onFormReset ) ;
2019-10-22 23:20:40 +02:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . input . removeEventListeners ( ) ;
2019-11-13 16:40:47 +01:00
}
/ * *
* @ param { KeyboardEvent } event
* /
;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onKeyDown = function _onKeyDown ( event ) {
var _keyDownActions ;
var target = event . target ,
keyCode = event . keyCode ,
ctrlKey = event . ctrlKey ,
metaKey = event . metaKey ;
var activeItems = this . _store . activeItems ;
var hasFocusedInput = this . input . isFocussed ;
var hasActiveDropdown = this . dropdown . isActive ;
2019-10-29 22:19:56 +01:00
var hasItems = this . itemList . hasChildren ( ) ;
2019-10-22 23:20:40 +02:00
var keyString = String . fromCharCode ( keyCode ) ;
var BACK _KEY = KEY _CODES . BACK _KEY ,
DELETE _KEY = KEY _CODES . DELETE _KEY ,
ENTER _KEY = KEY _CODES . ENTER _KEY ,
A _KEY = KEY _CODES . A _KEY ,
ESC _KEY = KEY _CODES . ESC _KEY ,
UP _KEY = KEY _CODES . UP _KEY ,
DOWN _KEY = KEY _CODES . DOWN _KEY ,
PAGE _UP _KEY = KEY _CODES . PAGE _UP _KEY ,
PAGE _DOWN _KEY = KEY _CODES . PAGE _DOWN _KEY ;
var hasCtrlDownKeyPressed = ctrlKey || metaKey ; // If a user is typing and the dropdown is not active
if ( ! this . _isTextElement && /[a-zA-Z0-9-_ ]/ . test ( keyString ) ) {
this . showDropdown ( ) ;
} // Map keys to key actions
var keyDownActions = ( _keyDownActions = { } , _keyDownActions [ A _KEY ] = this . _onAKey , _keyDownActions [ ENTER _KEY ] = this . _onEnterKey , _keyDownActions [ ESC _KEY ] = this . _onEscapeKey , _keyDownActions [ UP _KEY ] = this . _onDirectionKey , _keyDownActions [ PAGE _UP _KEY ] = this . _onDirectionKey , _keyDownActions [ DOWN _KEY ] = this . _onDirectionKey , _keyDownActions [ PAGE _DOWN _KEY ] = this . _onDirectionKey , _keyDownActions [ DELETE _KEY ] = this . _onDeleteKey , _keyDownActions [ BACK _KEY ] = this . _onDeleteKey , _keyDownActions ) ; // If keycode has a function, run it
if ( keyDownActions [ keyCode ] ) {
keyDownActions [ keyCode ] ( {
event : event ,
target : target ,
keyCode : keyCode ,
metaKey : metaKey ,
activeItems : activeItems ,
hasFocusedInput : hasFocusedInput ,
hasActiveDropdown : hasActiveDropdown ,
hasItems : hasItems ,
hasCtrlDownKeyPressed : hasCtrlDownKeyPressed
} ) ;
}
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onKeyUp = function _onKeyUp ( _ref2 ) {
var target = _ref2 . target ,
keyCode = _ref2 . keyCode ;
var value = this . input . value ;
var activeItems = this . _store . activeItems ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var canAddItem = this . _canAddItem ( activeItems , value ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var backKey = KEY _CODES . BACK _KEY ,
deleteKey = KEY _CODES . DELETE _KEY ; // We are typing into a text input and have a value, we want to show a dropdown
// notice. Otherwise hide the dropdown
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( this . _isTextElement ) {
var canShowDropdownNotice = canAddItem . notice && value ;
2018-02-02 12:08:03 +01:00
2019-10-22 23:20:40 +02:00
if ( canShowDropdownNotice ) {
var dropdownItem = this . _getTemplate ( 'notice' , canAddItem . notice ) ;
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
this . dropdown . element . innerHTML = dropdownItem . outerHTML ;
this . showDropdown ( true ) ;
} else {
this . hideDropdown ( true ) ;
}
} else {
var userHasRemovedValue = ( keyCode === backKey || keyCode === deleteKey ) && ! target . value ;
var canReactivateChoices = ! this . _isTextElement && this . _isSearching ;
var canSearch = this . _canSearch && canAddItem . response ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( userHasRemovedValue && canReactivateChoices ) {
this . _isSearching = false ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . _store . dispatch ( choices _activateChoices ( true ) ) ;
} else if ( canSearch ) {
this . _handleSearch ( this . input . value ) ;
}
}
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
this . _canSearch = this . config . searchEnabled ;
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onAKey = function _onAKey ( _ref3 ) {
var hasItems = _ref3 . hasItems ,
hasCtrlDownKeyPressed = _ref3 . hasCtrlDownKeyPressed ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
// If CTRL + A or CMD + A have been pressed and there are items to select
if ( hasCtrlDownKeyPressed && hasItems ) {
this . _canSearch = false ;
var shouldHightlightAll = this . config . removeItems && ! this . input . value && this . input . element === document . activeElement ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( shouldHightlightAll ) {
this . highlightAll ( ) ;
}
}
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onEnterKey = function _onEnterKey ( _ref4 ) {
var event = _ref4 . event ,
target = _ref4 . target ,
activeItems = _ref4 . activeItems ,
hasActiveDropdown = _ref4 . hasActiveDropdown ;
var enterKey = KEY _CODES . ENTER _KEY ;
var targetWasButton = target . hasAttribute ( 'data-button' ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( this . _isTextElement && target . value ) {
var value = this . input . value ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
var canAddItem = this . _canAddItem ( activeItems , value ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( canAddItem . response ) {
this . hideDropdown ( true ) ;
2018-05-25 15:00:27 +02:00
2019-10-22 23:20:40 +02:00
this . _addItem ( {
value : value
} ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . _triggerChange ( value ) ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
this . clearInput ( ) ;
}
2018-04-25 10:20:59 +02:00
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( targetWasButton ) {
this . _handleButtonAction ( activeItems , target ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
event . preventDefault ( ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( hasActiveDropdown ) {
var highlightedChoice = this . dropdown . getChild ( "." + this . config . classNames . highlightedState ) ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
if ( highlightedChoice ) {
// add enter keyCode value
if ( activeItems [ 0 ] ) {
activeItems [ 0 ] . keyCode = enterKey ; // eslint-disable-line no-param-reassign
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
this . _handleChoiceAction ( activeItems , highlightedChoice ) ;
}
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
event . preventDefault ( ) ;
} else if ( this . _isSelectOneElement ) {
this . showDropdown ( ) ;
event . preventDefault ( ) ;
}
} ;
_proto . _onEscapeKey = function _onEscapeKey ( _ref5 ) {
var hasActiveDropdown = _ref5 . hasActiveDropdown ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( hasActiveDropdown ) {
this . hideDropdown ( true ) ;
this . containerOuter . focus ( ) ;
}
} ;
2017-11-07 12:59:49 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onDirectionKey = function _onDirectionKey ( _ref6 ) {
var event = _ref6 . event ,
hasActiveDropdown = _ref6 . hasActiveDropdown ,
keyCode = _ref6 . keyCode ,
metaKey = _ref6 . metaKey ;
var downKey = KEY _CODES . DOWN _KEY ,
pageUpKey = KEY _CODES . PAGE _UP _KEY ,
pageDownKey = KEY _CODES . PAGE _DOWN _KEY ; // If up or down key is pressed, traverse through options
if ( hasActiveDropdown || this . _isSelectOneElement ) {
this . showDropdown ( ) ;
this . _canSearch = false ;
var directionInt = keyCode === downKey || keyCode === pageDownKey ? 1 : - 1 ;
var skipKey = metaKey || keyCode === pageDownKey || keyCode === pageUpKey ;
var selectableChoiceIdentifier = '[data-choice-selectable]' ;
var nextEl ;
if ( skipKey ) {
if ( directionInt > 0 ) {
2019-11-03 18:45:16 +01:00
nextEl = this . dropdown . element . querySelector ( selectableChoiceIdentifier + ":last-of-type" ) ;
2019-10-22 23:20:40 +02:00
} else {
nextEl = this . dropdown . element . querySelector ( selectableChoiceIdentifier ) ;
}
} else {
var currentEl = this . dropdown . element . querySelector ( "." + this . config . classNames . highlightedState ) ;
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
if ( currentEl ) {
nextEl = getAdjacentEl ( currentEl , selectableChoiceIdentifier , directionInt ) ;
} else {
nextEl = this . dropdown . element . querySelector ( selectableChoiceIdentifier ) ;
}
}
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
if ( nextEl ) {
// We prevent default to stop the cursor moving
// when pressing the arrow
if ( ! isScrolledIntoView ( nextEl , this . choiceList . element , directionInt ) ) {
2019-11-03 18:45:16 +01:00
this . choiceList . scrollToChildElement ( nextEl , directionInt ) ;
2019-10-22 23:20:40 +02:00
}
2018-02-02 12:08:03 +01:00
2019-10-22 23:20:40 +02:00
this . _highlightChoice ( nextEl ) ;
} // Prevent default to maintain cursor position whilst
// traversing dropdown options
2018-02-02 12:08:03 +01:00
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
event . preventDefault ( ) ;
}
} ;
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onDeleteKey = function _onDeleteKey ( _ref7 ) {
var event = _ref7 . event ,
target = _ref7 . target ,
hasFocusedInput = _ref7 . hasFocusedInput ,
activeItems = _ref7 . activeItems ;
2017-11-13 20:13:37 +01:00
2019-10-22 23:20:40 +02:00
// If backspace or delete key is pressed and the input has no value
if ( hasFocusedInput && ! target . value && ! this . _isSelectOneElement ) {
this . _handleBackspace ( activeItems ) ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
event . preventDefault ( ) ;
}
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onTouchMove = function _onTouchMove ( ) {
if ( this . _wasTap ) {
this . _wasTap = false ;
}
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onTouchEnd = function _onTouchEnd ( event ) {
var _ref8 = event || event . touches [ 0 ] ,
target = _ref8 . target ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
var touchWasWithinContainer = this . _wasTap && this . containerOuter . element . contains ( target ) ;
2019-10-22 12:25:36 +02:00
2019-10-22 23:20:40 +02:00
if ( touchWasWithinContainer ) {
var containerWasExactTarget = target === this . containerOuter . element || target === this . containerInner . element ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( containerWasExactTarget ) {
if ( this . _isTextElement ) {
this . input . focus ( ) ;
} else if ( this . _isSelectMultipleElement ) {
this . showDropdown ( ) ;
}
} // Prevents focus event firing
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
event . stopPropagation ( ) ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
this . _wasTap = true ;
2019-11-13 16:40:47 +01:00
}
/ * *
* Handles mousedown event in capture mode for containetOuter . element
* @ param { MouseEvent } event
* /
;
2019-10-22 23:20:40 +02:00
_proto . _onMouseDown = function _onMouseDown ( event ) {
2019-11-13 16:40:47 +01:00
var target = event . target ;
2019-10-22 23:20:40 +02:00
2019-11-13 16:40:47 +01:00
if ( ! ( target instanceof HTMLElement ) ) {
return ;
} // If we have our mouse down on the scrollbar and are on IE11...
if ( IS _IE11 && this . choiceList . element . contains ( target ) ) {
// check if click was on a scrollbar area
var firstChoice =
/** @type {HTMLElement} */
this . choiceList . element . firstElementChild ;
var isOnScrollbar = this . _direction === 'ltr' ? event . offsetX >= firstChoice . offsetWidth : event . offsetX < firstChoice . offsetLeft ;
this . _isScrollingOnIe = isOnScrollbar ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 12:25:36 +02:00
2019-11-13 16:40:47 +01:00
if ( target === this . input . element ) {
2019-10-22 23:20:40 +02:00
return ;
}
2019-02-09 19:13:25 +01:00
2019-11-13 16:40:47 +01:00
var item = target . closest ( '[data-button],[data-item],[data-choice]' ) ;
2019-02-09 19:13:25 +01:00
2019-11-13 16:40:47 +01:00
if ( item instanceof HTMLElement ) {
var hasShiftKey = event . shiftKey ;
var activeItems = this . _store . activeItems ;
var dataset = item . dataset ;
if ( 'button' in dataset ) {
this . _handleButtonAction ( activeItems , item ) ;
} else if ( 'item' in dataset ) {
this . _handleItemAction ( activeItems , item , hasShiftKey ) ;
} else if ( 'choice' in dataset ) {
this . _handleChoiceAction ( activeItems , item ) ;
}
2019-10-22 23:20:40 +02:00
}
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
event . preventDefault ( ) ;
2019-11-13 16:40:47 +01:00
}
/ * *
* Handles mouseover event over this . dropdown
* @ param { MouseEvent } event
* /
;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
_proto . _onMouseOver = function _onMouseOver ( _ref9 ) {
var target = _ref9 . target ;
2016-08-23 08:24:45 +02:00
2019-11-13 16:40:47 +01:00
if ( target instanceof HTMLElement && 'choice' in target . dataset ) {
2019-10-22 23:20:40 +02:00
this . _highlightChoice ( target ) ;
2017-11-15 07:51:53 +01:00
}
2019-10-22 23:20:40 +02:00
} ;
2016-08-23 08:24:45 +02:00
2019-10-22 23:20:40 +02:00
_proto . _onClick = function _onClick ( _ref10 ) {
var target = _ref10 . target ;
var clickWasWithinContainer = this . containerOuter . element . contains ( target ) ;
2017-08-18 06:01:03 +02:00
2019-10-22 23:20:40 +02:00
if ( clickWasWithinContainer ) {
if ( ! this . dropdown . isActive && ! this . containerOuter . isDisabled ) {
if ( this . _isTextElement ) {
if ( document . activeElement !== this . input . element ) {
this . input . focus ( ) ;
}
} else {
this . showDropdown ( ) ;
this . containerOuter . focus ( ) ;
}
} else if ( this . _isSelectOneElement && target !== this . input . element && ! this . dropdown . element . contains ( target ) ) {
this . hideDropdown ( ) ;
}
} else {
var hasHighlightedItems = this . _store . highlightedActiveItems . length > 0 ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( hasHighlightedItems ) {
this . unhighlightAll ( ) ;
}
2019-10-22 12:25:36 +02:00
2019-10-22 23:20:40 +02:00
this . containerOuter . removeFocusState ( ) ;
this . hideDropdown ( true ) ;
}
} ;
2019-10-22 12:25:36 +02:00
2019-10-22 23:20:40 +02:00
_proto . _onFocus = function _onFocus ( _ref11 ) {
2019-11-03 18:45:16 +01:00
var _this17 = this ,
_focusActions ;
2019-10-22 12:25:36 +02:00
2019-10-22 23:20:40 +02:00
var target = _ref11 . target ;
var focusWasWithinContainer = this . containerOuter . element . contains ( target ) ;
2019-10-22 12:25:36 +02:00
2019-10-22 23:20:40 +02:00
if ( ! focusWasWithinContainer ) {
return ;
}
2019-10-22 12:25:36 +02:00
2019-11-03 18:45:16 +01:00
var focusActions = ( _focusActions = { } , _focusActions [ TEXT _TYPE ] = function ( ) {
if ( target === _this17 . input . element ) {
2019-10-29 22:19:56 +01:00
_this17 . containerOuter . addFocusState ( ) ;
2019-11-03 18:45:16 +01:00
}
} , _focusActions [ SELECT _ONE _TYPE ] = function ( ) {
_this17 . containerOuter . addFocusState ( ) ;
2019-10-22 12:25:36 +02:00
2019-11-03 18:45:16 +01:00
if ( target === _this17 . input . element ) {
_this17 . showDropdown ( true ) ;
}
} , _focusActions [ SELECT _MULTIPLE _TYPE ] = function ( ) {
if ( target === _this17 . input . element ) {
_this17 . showDropdown ( true ) ; // If element is a select box, the focused element is the container and the dropdown
// isn't already open, focus and show dropdown
2019-10-22 12:25:36 +02:00
2019-11-03 18:45:16 +01:00
_this17 . containerOuter . addFocusState ( ) ;
2019-10-22 23:20:40 +02:00
}
2019-11-03 18:45:16 +01:00
} , _focusActions ) ;
2019-10-22 23:20:40 +02:00
focusActions [ this . passedElement . element . type ] ( ) ;
} ;
2019-10-22 12:25:36 +02:00
2019-10-22 23:20:40 +02:00
_proto . _onBlur = function _onBlur ( _ref12 ) {
2019-10-29 22:19:56 +01:00
var _this18 = this ;
2019-10-22 12:25:36 +02:00
2019-10-22 23:20:40 +02:00
var target = _ref12 . target ;
var blurWasWithinContainer = this . containerOuter . element . contains ( target ) ;
2019-10-22 12:25:36 +02:00
2019-10-22 23:20:40 +02:00
if ( blurWasWithinContainer && ! this . _isScrollingOnIe ) {
2019-11-03 18:45:16 +01:00
var _blurActions ;
2019-10-22 23:20:40 +02:00
var activeItems = this . _store . activeItems ;
var hasHighlightedItems = activeItems . some ( function ( item ) {
return item . highlighted ;
} ) ;
2019-11-03 18:45:16 +01:00
var blurActions = ( _blurActions = { } , _blurActions [ TEXT _TYPE ] = function ( ) {
if ( target === _this18 . input . element ) {
2019-10-29 22:19:56 +01:00
_this18 . containerOuter . removeFocusState ( ) ;
2019-10-22 23:20:40 +02:00
2019-11-03 18:45:16 +01:00
if ( hasHighlightedItems ) {
_this18 . unhighlightAll ( ) ;
2019-10-22 23:20:40 +02:00
}
2019-10-22 12:25:36 +02:00
2019-11-03 18:45:16 +01:00
_this18 . hideDropdown ( true ) ;
}
} , _blurActions [ SELECT _ONE _TYPE ] = function ( ) {
_this18 . containerOuter . removeFocusState ( ) ;
2019-10-22 23:20:40 +02:00
2019-11-03 18:45:16 +01:00
if ( target === _this18 . input . element || target === _this18 . containerOuter . element && ! _this18 . _canSearch ) {
_this18 . hideDropdown ( true ) ;
}
} , _blurActions [ SELECT _MULTIPLE _TYPE ] = function ( ) {
if ( target === _this18 . input . element ) {
_this18 . containerOuter . removeFocusState ( ) ;
_this18 . hideDropdown ( true ) ;
if ( hasHighlightedItems ) {
_this18 . unhighlightAll ( ) ;
2019-10-22 23:20:40 +02:00
}
}
2019-11-03 18:45:16 +01:00
} , _blurActions ) ;
2019-10-22 23:20:40 +02:00
blurActions [ this . passedElement . element . type ] ( ) ;
} else {
// On IE11, clicking the scollbar blurs our input and thus
// closes the dropdown. To stop this, we refocus our input
// if we know we are on IE *and* are scrolling.
this . _isScrollingOnIe = false ;
this . input . element . focus ( ) ;
2019-10-22 12:25:36 +02:00
}
2019-10-22 23:20:40 +02:00
} ;
2019-10-22 12:25:36 +02:00
2019-10-22 23:20:40 +02:00
_proto . _onFormReset = function _onFormReset ( ) {
this . _store . dispatch ( resetTo ( this . _initialState ) ) ;
} ;
2019-10-22 12:25:36 +02:00
2019-10-22 23:20:40 +02:00
_proto . _highlightChoice = function _highlightChoice ( el ) {
2019-10-29 22:19:56 +01:00
var _this19 = this ;
2019-10-22 12:25:36 +02:00
2019-10-22 23:20:40 +02:00
if ( el === void 0 ) {
el = null ;
}
2019-10-22 12:25:36 +02:00
2019-10-22 23:20:40 +02:00
var choices = Array . from ( this . dropdown . element . querySelectorAll ( '[data-choice-selectable]' ) ) ;
2017-09-18 17:46:48 +02:00
2019-10-22 23:20:40 +02:00
if ( ! choices . length ) {
return ;
}
2017-09-18 17:46:48 +02:00
2019-10-22 23:20:40 +02:00
var passedEl = el ;
var highlightedChoices = Array . from ( this . dropdown . element . querySelectorAll ( "." + this . config . classNames . highlightedState ) ) ; // Remove any highlighted choices
2017-09-18 17:46:48 +02:00
2019-10-22 23:20:40 +02:00
highlightedChoices . forEach ( function ( choice ) {
2019-10-29 22:19:56 +01:00
choice . classList . remove ( _this19 . config . classNames . highlightedState ) ;
2019-10-22 23:20:40 +02:00
choice . setAttribute ( 'aria-selected' , 'false' ) ;
} ) ;
2017-09-18 17:46:48 +02:00
2019-10-22 23:20:40 +02:00
if ( passedEl ) {
this . _highlightPosition = choices . indexOf ( passedEl ) ;
} else {
// Highlight choice based on last known highlight location
if ( choices . length > this . _highlightPosition ) {
// If we have an option to highlight
passedEl = choices [ this . _highlightPosition ] ;
} else {
// Otherwise highlight the option before
passedEl = choices [ choices . length - 1 ] ;
}
2017-09-18 17:46:48 +02:00
2019-10-22 23:20:40 +02:00
if ( ! passedEl ) {
passedEl = choices [ 0 ] ;
}
}
2017-09-18 17:46:48 +02:00
2019-10-22 23:20:40 +02:00
passedEl . classList . add ( this . config . classNames . highlightedState ) ;
passedEl . setAttribute ( 'aria-selected' , 'true' ) ;
this . passedElement . triggerEvent ( EVENTS . highlightChoice , {
el : passedEl
} ) ;
2017-09-18 17:46:48 +02:00
2019-10-22 23:20:40 +02:00
if ( this . dropdown . isActive ) {
// IE11 ignores aria-label and blocks virtual keyboard
// if aria-activedescendant is set without a dropdown
this . input . setActiveDescendant ( passedEl . id ) ;
this . containerOuter . setActiveDescendant ( passedEl . id ) ;
}
} ;
2017-09-18 17:46:48 +02:00
2019-10-22 23:20:40 +02:00
_proto . _addItem = function _addItem ( _ref13 ) {
var value = _ref13 . value ,
_ref13$label = _ref13 . label ,
label = _ref13$label === void 0 ? null : _ref13$label ,
_ref13$choiceId = _ref13 . choiceId ,
choiceId = _ref13$choiceId === void 0 ? - 1 : _ref13$choiceId ,
_ref13$groupId = _ref13 . groupId ,
groupId = _ref13$groupId === void 0 ? - 1 : _ref13$groupId ,
_ref13$customProperti = _ref13 . customProperties ,
customProperties = _ref13$customProperti === void 0 ? null : _ref13$customProperti ,
_ref13$placeholder = _ref13 . placeholder ,
placeholder = _ref13$placeholder === void 0 ? false : _ref13$placeholder ,
_ref13$keyCode = _ref13 . keyCode ,
keyCode = _ref13$keyCode === void 0 ? null : _ref13$keyCode ;
2019-11-03 18:45:16 +01:00
var passedValue = typeof value === 'string' ? value . trim ( ) : value ;
2019-10-22 23:20:40 +02:00
var passedKeyCode = keyCode ;
var passedCustomProperties = customProperties ;
var items = this . _store . items ;
var passedLabel = label || passedValue ;
2019-11-08 10:19:18 +01:00
var passedOptionId = choiceId || - 1 ;
2019-10-22 23:20:40 +02:00
var group = groupId >= 0 ? this . _store . getGroupById ( groupId ) : null ;
var id = items ? items . length + 1 : 1 ; // If a prepended value has been passed, prepend it
if ( this . config . prependValue ) {
passedValue = this . config . prependValue + passedValue . toString ( ) ;
} // If an appended value has been passed, append it
if ( this . config . appendValue ) {
passedValue += this . config . appendValue . toString ( ) ;
}
this . _store . dispatch ( items _addItem ( {
value : passedValue ,
label : passedLabel ,
id : id ,
choiceId : passedOptionId ,
groupId : groupId ,
customProperties : customProperties ,
placeholder : placeholder ,
keyCode : passedKeyCode
} ) ) ;
2017-09-18 17:46:48 +02:00
2019-10-22 23:20:40 +02:00
if ( this . _isSelectOneElement ) {
this . removeActiveItems ( id ) ;
} // Trigger change event
2017-09-18 17:46:48 +02:00
2019-10-22 23:20:40 +02:00
this . passedElement . triggerEvent ( EVENTS . addItem , {
id : id ,
value : passedValue ,
label : passedLabel ,
customProperties : passedCustomProperties ,
groupValue : group && group . value ? group . value : undefined ,
keyCode : passedKeyCode
} ) ;
return this ;
} ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
_proto . _removeItem = function _removeItem ( item ) {
if ( ! item || ! isType ( 'Object' , item ) ) {
return this ;
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
var id = item . id ,
value = item . value ,
label = item . label ,
choiceId = item . choiceId ,
groupId = item . groupId ;
var group = groupId >= 0 ? this . _store . getGroupById ( groupId ) : null ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
this . _store . dispatch ( items _removeItem ( id , choiceId ) ) ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
if ( group && group . value ) {
this . passedElement . triggerEvent ( EVENTS . removeItem , {
id : id ,
value : value ,
label : label ,
groupValue : group . value
} ) ;
} else {
this . passedElement . triggerEvent ( EVENTS . removeItem , {
id : id ,
value : value ,
label : label
} ) ;
}
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
return this ;
2017-11-15 07:51:53 +01:00
} ;
2019-10-22 23:20:40 +02:00
_proto . _addChoice = function _addChoice ( _ref14 ) {
var value = _ref14 . value ,
_ref14$label = _ref14 . label ,
label = _ref14$label === void 0 ? null : _ref14$label ,
_ref14$isSelected = _ref14 . isSelected ,
isSelected = _ref14$isSelected === void 0 ? false : _ref14$isSelected ,
_ref14$isDisabled = _ref14 . isDisabled ,
isDisabled = _ref14$isDisabled === void 0 ? false : _ref14$isDisabled ,
_ref14$groupId = _ref14 . groupId ,
groupId = _ref14$groupId === void 0 ? - 1 : _ref14$groupId ,
_ref14$customProperti = _ref14 . customProperties ,
customProperties = _ref14$customProperti === void 0 ? null : _ref14$customProperti ,
_ref14$placeholder = _ref14 . placeholder ,
placeholder = _ref14$placeholder === void 0 ? false : _ref14$placeholder ,
_ref14$keyCode = _ref14 . keyCode ,
keyCode = _ref14$keyCode === void 0 ? null : _ref14$keyCode ;
if ( typeof value === 'undefined' || value === null ) {
return ;
} // Generate unique id
var choices = this . _store . choices ;
var choiceLabel = label || value ;
var choiceId = choices ? choices . length + 1 : 1 ;
var choiceElementId = this . _baseId + "-" + this . _idNames . itemChoice + "-" + choiceId ;
this . _store . dispatch ( choices _addChoice ( {
id : choiceId ,
groupId : groupId ,
elementId : choiceElementId ,
2019-11-08 10:19:18 +01:00
value : value ,
label : choiceLabel ,
disabled : isDisabled ,
2019-10-22 23:20:40 +02:00
customProperties : customProperties ,
placeholder : placeholder ,
keyCode : keyCode
} ) ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( isSelected ) {
this . _addItem ( {
value : value ,
label : choiceLabel ,
choiceId : choiceId ,
customProperties : customProperties ,
placeholder : placeholder ,
keyCode : keyCode
} ) ;
}
2017-11-15 07:51:53 +01:00
} ;
2019-10-22 23:20:40 +02:00
_proto . _addGroup = function _addGroup ( _ref15 ) {
2019-10-29 22:19:56 +01:00
var _this20 = this ;
2019-10-22 23:20:40 +02:00
var group = _ref15 . group ,
id = _ref15 . id ,
_ref15$valueKey = _ref15 . valueKey ,
valueKey = _ref15$valueKey === void 0 ? 'value' : _ref15$valueKey ,
_ref15$labelKey = _ref15 . labelKey ,
labelKey = _ref15$labelKey === void 0 ? 'label' : _ref15$labelKey ;
var groupChoices = isType ( 'Object' , group ) ? group . choices : Array . from ( group . getElementsByTagName ( 'OPTION' ) ) ;
var groupId = id || Math . floor ( new Date ( ) . valueOf ( ) * Math . random ( ) ) ;
var isDisabled = group . disabled ? group . disabled : false ;
if ( groupChoices ) {
2019-11-03 18:45:16 +01:00
this . _store . dispatch ( groups _addGroup ( {
value : group . label ,
id : groupId ,
active : true ,
disabled : isDisabled
} ) ) ;
2019-10-22 23:20:40 +02:00
var addGroupChoices = function addGroupChoices ( choice ) {
var isOptDisabled = choice . disabled || choice . parentNode && choice . parentNode . disabled ;
2019-10-29 22:19:56 +01:00
_this20 . _addChoice ( {
2019-10-22 23:20:40 +02:00
value : choice [ valueKey ] ,
label : isType ( 'Object' , choice ) ? choice [ labelKey ] : choice . innerHTML ,
isSelected : choice . selected ,
isDisabled : isOptDisabled ,
groupId : groupId ,
customProperties : choice . customProperties ,
placeholder : choice . placeholder
} ) ;
} ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
groupChoices . forEach ( addGroupChoices ) ;
} else {
2019-11-03 18:45:16 +01:00
this . _store . dispatch ( groups _addGroup ( {
value : group . label ,
id : group . id ,
active : false ,
disabled : group . disabled
} ) ) ;
2019-10-22 23:20:40 +02:00
}
2017-11-15 07:51:53 +01:00
} ;
2019-10-22 23:20:40 +02:00
_proto . _getTemplate = function _getTemplate ( template ) {
2019-10-29 22:19:56 +01:00
var _this$ _templates$temp ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( ! template ) {
return null ;
}
2017-11-15 07:51:53 +01:00
2019-10-29 22:19:56 +01:00
var classNames = this . config . classNames ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
for ( var _len = arguments . length , args = new Array ( _len > 1 ? _len - 1 : 0 ) , _key = 1 ; _key < _len ; _key ++ ) {
args [ _key - 1 ] = arguments [ _key ] ;
}
2017-11-15 07:51:53 +01:00
2019-10-29 22:19:56 +01:00
return ( _this$ _templates$temp = this . _templates [ template ] ) . call . apply ( _this$ _templates$temp , [ this , classNames ] . concat ( args ) ) ;
2019-10-22 23:20:40 +02:00
} ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
_proto . _createTemplates = function _createTemplates ( ) {
var callbackOnCreateTemplates = this . config . callbackOnCreateTemplates ;
var userTemplates = { } ;
2017-11-15 07:51:53 +01:00
2019-11-03 18:45:16 +01:00
if ( callbackOnCreateTemplates && typeof callbackOnCreateTemplates === 'function' ) {
2019-10-22 23:20:40 +02:00
userTemplates = callbackOnCreateTemplates . call ( this , strToEl ) ;
}
2017-11-15 07:51:53 +01:00
2019-10-29 22:19:56 +01:00
this . _templates = cjs _default ( ) ( TEMPLATES , userTemplates ) ;
2019-10-22 23:20:40 +02:00
} ;
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
_proto . _createElements = function _createElements ( ) {
this . containerOuter = new container _Container ( {
element : this . _getTemplate ( 'containerOuter' , this . _direction , this . _isSelectElement , this . _isSelectOneElement , this . config . searchEnabled , this . passedElement . element . type ) ,
classNames : this . config . classNames ,
type : this . passedElement . element . type ,
position : this . config . position
} ) ;
this . containerInner = new container _Container ( {
element : this . _getTemplate ( 'containerInner' ) ,
classNames : this . config . classNames ,
type : this . passedElement . element . type ,
position : this . config . position
} ) ;
this . input = new input _Input ( {
element : this . _getTemplate ( 'input' , this . _placeholderValue ) ,
classNames : this . config . classNames ,
2019-10-29 22:19:56 +01:00
type : this . passedElement . element . type ,
preventPaste : ! this . config . paste
2019-10-22 23:20:40 +02:00
} ) ;
this . choiceList = new list _List ( {
element : this . _getTemplate ( 'choiceList' , this . _isSelectOneElement )
} ) ;
this . itemList = new list _List ( {
element : this . _getTemplate ( 'itemList' , this . _isSelectOneElement )
} ) ;
this . dropdown = new Dropdown ( {
element : this . _getTemplate ( 'dropdown' ) ,
classNames : this . config . classNames ,
type : this . passedElement . element . type
} ) ;
2017-11-15 07:51:53 +01:00
} ;
2019-10-22 23:20:40 +02:00
_proto . _createStructure = function _createStructure ( ) {
// Hide original element
this . passedElement . conceal ( ) ; // Wrap input in container preserving DOM ordering
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
this . containerInner . wrap ( this . passedElement . element ) ; // Wrapper inner container with outer container
2017-11-15 07:51:53 +01:00
2019-10-22 23:20:40 +02:00
this . containerOuter . wrap ( this . containerInner . element ) ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
if ( this . _isSelectOneElement ) {
this . input . placeholder = this . config . searchPlaceholderValue || '' ;
} else if ( this . _placeholderValue ) {
this . input . placeholder = this . _placeholderValue ;
2019-11-03 18:45:16 +01:00
this . input . setWidth ( ) ;
2019-10-22 23:20:40 +02:00
}
this . containerOuter . element . appendChild ( this . containerInner . element ) ;
this . containerOuter . element . appendChild ( this . dropdown . element ) ;
this . containerInner . element . appendChild ( this . itemList . element ) ;
if ( ! this . _isTextElement ) {
this . dropdown . element . appendChild ( this . choiceList . element ) ;
}
if ( ! this . _isSelectOneElement ) {
this . containerInner . element . appendChild ( this . input . element ) ;
} else if ( this . config . searchEnabled ) {
this . dropdown . element . insertBefore ( this . input . element , this . dropdown . element . firstChild ) ;
}
if ( this . _isSelectElement ) {
2019-11-03 18:45:16 +01:00
this . _highlightPosition = 0 ;
this . _isSearching = false ;
2017-11-15 07:51:53 +01:00
2019-11-08 10:19:18 +01:00
this . _startLoading ( ) ;
2017-11-15 07:51:53 +01:00
2019-11-03 18:45:16 +01:00
if ( this . _presetGroups . length ) {
this . _addPredefinedGroups ( this . _presetGroups ) ;
} else {
this . _addPredefinedChoices ( this . _presetChoices ) ;
2019-10-22 23:20:40 +02:00
}
2017-11-15 07:51:53 +01:00
2019-11-08 10:19:18 +01:00
this . _stopLoading ( ) ;
2019-11-03 18:45:16 +01:00
}
2019-10-22 23:20:40 +02:00
2019-11-03 18:45:16 +01:00
if ( this . _isTextElement ) {
this . _addPredefinedItems ( this . _presetItems ) ;
}
} ;
2017-11-15 07:51:53 +01:00
2019-11-03 18:45:16 +01:00
_proto . _addPredefinedGroups = function _addPredefinedGroups ( groups ) {
var _this21 = this ;
2019-10-29 22:19:56 +01:00
2019-11-03 18:45:16 +01:00
// If we have a placeholder option
var placeholderChoice = this . passedElement . placeholderOption ;
2017-11-15 07:51:53 +01:00
2019-11-03 18:45:16 +01:00
if ( placeholderChoice && placeholderChoice . parentNode . tagName === 'SELECT' ) {
this . _addChoice ( {
value : placeholderChoice . value ,
label : placeholderChoice . innerHTML ,
isSelected : placeholderChoice . selected ,
isDisabled : placeholderChoice . disabled ,
placeholder : true
2019-10-22 23:20:40 +02:00
} ) ;
2019-11-03 18:45:16 +01:00
}
2019-02-09 19:13:25 +01:00
2019-11-03 18:45:16 +01:00
groups . forEach ( function ( group ) {
return _this21 . _addGroup ( {
group : group ,
id : group . id || null
} ) ;
} ) ;
} ;
_proto . _addPredefinedChoices = function _addPredefinedChoices ( choices ) {
var _this22 = this ;
// If sorting is enabled or the user is searching, filter choices
if ( this . config . shouldSort ) {
choices . sort ( this . config . sorter ) ;
2019-11-08 10:19:18 +01:00
}
2019-11-03 18:45:16 +01:00
var hasSelectedChoice = choices . some ( function ( choice ) {
return choice . selected ;
2019-11-07 09:50:19 +01:00
} ) ;
2019-11-08 10:19:18 +01:00
var firstEnabledChoiceIndex = choices . findIndex ( function ( choice ) {
return choice . disabled === undefined || ! choice . disabled ;
} ) ;
2019-11-03 18:45:16 +01:00
choices . forEach ( function ( choice , index ) {
var value = choice . value ,
label = choice . label ,
customProperties = choice . customProperties ,
placeholder = choice . placeholder ;
if ( _this22 . _isSelectElement ) {
// If the choice is actually a group
if ( choice . choices ) {
_this22 . _addGroup ( {
group : choice ,
id : choice . id || null
} ) ;
2019-10-22 23:20:40 +02:00
} else {
2019-11-07 09:50:19 +01:00
/ * *
* If there is a selected choice already or the choice is not the first in
* the array , add each choice normally .
*
* Otherwise we pre - select the first enabled choice in the array ( "select-one" only )
* /
var shouldPreselect = _this22 . _isSelectOneElement && ! hasSelectedChoice && index === firstEnabledChoiceIndex ;
2019-11-03 18:45:16 +01:00
var isSelected = shouldPreselect ? true : choice . selected ;
2019-11-07 09:50:19 +01:00
var isDisabled = choice . disabled ;
2019-11-03 18:45:16 +01:00
_this22 . _addChoice ( {
2019-10-22 23:20:40 +02:00
value : value ,
label : label ,
2019-11-03 18:45:16 +01:00
isSelected : isSelected ,
isDisabled : isDisabled ,
2019-10-22 23:20:40 +02:00
customProperties : customProperties ,
placeholder : placeholder
} ) ;
}
2019-11-03 18:45:16 +01:00
} else {
_this22 . _addChoice ( {
value : value ,
label : label ,
isSelected : choice . selected ,
isDisabled : choice . disabled ,
customProperties : customProperties ,
placeholder : placeholder
} ) ;
}
} ) ;
}
/ * *
* @ param { Item [ ] } items
* /
;
2019-02-09 19:13:25 +01:00
2019-11-03 18:45:16 +01:00
_proto . _addPredefinedItems = function _addPredefinedItems ( items ) {
var _this23 = this ;
2019-10-22 23:20:40 +02:00
2019-11-03 18:45:16 +01:00
items . forEach ( function ( item ) {
if ( typeof item === 'object' && item . value ) {
_this23 . _addItem ( {
2019-10-22 23:20:40 +02:00
value : item . value ,
label : item . label ,
choiceId : item . id ,
customProperties : item . customProperties ,
placeholder : item . placeholder
} ) ;
2019-11-03 18:45:16 +01:00
}
if ( typeof item === 'string' ) {
_this23 . _addItem ( {
2019-10-22 23:20:40 +02:00
value : item
} ) ;
}
} ) ;
2018-05-28 17:22:22 +02:00
} ;
2019-10-22 23:20:40 +02:00
_proto . _setChoiceOrItem = function _setChoiceOrItem ( item ) {
2019-11-03 18:45:16 +01:00
var _this24 = this ;
2019-02-09 19:13:25 +01:00
2019-10-22 23:20:40 +02:00
var itemType = getType ( item ) . toLowerCase ( ) ;
var handleType = {
object : function object ( ) {
if ( ! item . value ) {
return ;
} // If we are dealing with a select input, we need to create an option first
// that is then selected. For text inputs we can just add items normally.
2019-01-26 13:36:47 +01:00
2019-11-03 18:45:16 +01:00
if ( ! _this24 . _isTextElement ) {
_this24 . _addChoice ( {
2019-10-22 23:20:40 +02:00
value : item . value ,
label : item . label ,
isSelected : true ,
isDisabled : false ,
customProperties : item . customProperties ,
placeholder : item . placeholder
} ) ;
} else {
2019-11-03 18:45:16 +01:00
_this24 . _addItem ( {
2019-10-22 23:20:40 +02:00
value : item . value ,
label : item . label ,
choiceId : item . id ,
customProperties : item . customProperties ,
placeholder : item . placeholder
} ) ;
}
} ,
string : function string ( ) {
2019-11-03 18:45:16 +01:00
if ( ! _this24 . _isTextElement ) {
_this24 . _addChoice ( {
2019-10-22 23:20:40 +02:00
value : item ,
label : item ,
isSelected : true ,
isDisabled : false
} ) ;
} else {
2019-11-03 18:45:16 +01:00
_this24 . _addItem ( {
2019-10-22 23:20:40 +02:00
value : item
} ) ;
}
}
} ;
handleType [ itemType ] ( ) ;
} ;
_proto . _findAndSelectChoiceByValue = function _findAndSelectChoiceByValue ( val ) {
2019-11-03 18:45:16 +01:00
var _this25 = this ;
2019-01-26 13:36:47 +01:00
2019-10-22 23:20:40 +02:00
var choices = this . _store . choices ; // Check 'value' property exists and the choice isn't already selected
2019-01-26 13:36:47 +01:00
2019-10-22 23:20:40 +02:00
var foundChoice = choices . find ( function ( choice ) {
2019-11-03 18:45:16 +01:00
return _this25 . config . valueComparer ( choice . value , val ) ;
2019-10-22 23:20:40 +02:00
} ) ;
if ( foundChoice && ! foundChoice . selected ) {
this . _addItem ( {
value : foundChoice . value ,
label : foundChoice . label ,
choiceId : foundChoice . id ,
groupId : foundChoice . groupId ,
customProperties : foundChoice . customProperties ,
placeholder : foundChoice . placeholder ,
keyCode : foundChoice . keyCode
} ) ;
}
2019-01-26 13:36:47 +01:00
} ;
2019-10-22 23:20:40 +02:00
_proto . _generatePlaceholderValue = function _generatePlaceholderValue ( ) {
2019-11-03 18:45:16 +01:00
if ( this . _isSelectElement ) {
var placeholderOption = this . passedElement . placeholderOption ;
return placeholderOption ? placeholderOption . text : false ;
2019-10-22 23:20:40 +02:00
}
2019-11-03 18:45:16 +01:00
var _this$config4 = this . config ,
placeholder = _this$config4 . placeholder ,
placeholderValue = _this$config4 . placeholderValue ;
var dataset = this . passedElement . element . dataset ;
if ( placeholder ) {
if ( placeholderValue ) {
return placeholderValue ;
}
if ( dataset . placeholder ) {
return dataset . placeholder ;
}
}
return false ;
} ;
2019-10-22 23:20:40 +02:00
return Choices ;
} ( ) ;
/* harmony default export */ var scripts _choices = _ _webpack _exports _ _ [ "default" ] = ( choices _Choices ) ;
2019-02-09 19:13:25 +01:00
2017-05-18 18:57:35 +02:00
/***/ } )
2019-10-22 23:20:40 +02:00
/******/ ] ) [ "default" ] ;
2019-02-09 19:13:25 +01:00
} ) ;