mirror of
https://github.com/Choices-js/Choices.git
synced 2024-05-21 15:06:45 +02:00
Update code styling rules (#713)
* Enforce curly braces around conditionals * Install sort class members + update rules * Satisfy linting changes * Add todo * Add tests for clearChoices * Update eslint-plugin-prettier to latest * Resolve conflicts * Fix linting errors
This commit is contained in:
parent
172366d6fa
commit
88f63faa0b
|
@ -7,7 +7,7 @@
|
||||||
"plugin:prettier/recommended",
|
"plugin:prettier/recommended",
|
||||||
"plugin:compat/recommended"
|
"plugin:compat/recommended"
|
||||||
],
|
],
|
||||||
"plugins": ["prettier"],
|
"plugins": ["prettier", "sort-class-members"],
|
||||||
"env": {
|
"env": {
|
||||||
"es6": true,
|
"es6": true,
|
||||||
"browser": true
|
"browser": true
|
||||||
|
@ -37,6 +37,23 @@
|
||||||
"array": false,
|
"array": false,
|
||||||
"object": true
|
"object": true
|
||||||
}
|
}
|
||||||
|
],
|
||||||
|
"curly": ["error", "all"],
|
||||||
|
"newline-before-return": "error",
|
||||||
|
"sort-class-members/sort-class-members": [
|
||||||
|
2,
|
||||||
|
{
|
||||||
|
"order": [
|
||||||
|
"[static-properties]",
|
||||||
|
"[static-methods]",
|
||||||
|
"[properties]",
|
||||||
|
"[conventional-private-properties]",
|
||||||
|
"constructor",
|
||||||
|
"[methods]",
|
||||||
|
"[conventional-private-methods]"
|
||||||
|
],
|
||||||
|
"accessorPairPositioning": "getThenSet"
|
||||||
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
"overrides": [
|
"overrides": [
|
||||||
|
|
173
package-lock.json
generated
173
package-lock.json
generated
|
@ -3629,9 +3629,9 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"eslint": {
|
"eslint": {
|
||||||
"version": "6.5.1",
|
"version": "6.6.0",
|
||||||
"resolved": "https://registry.npmjs.org/eslint/-/eslint-6.5.1.tgz",
|
"resolved": "https://registry.npmjs.org/eslint/-/eslint-6.6.0.tgz",
|
||||||
"integrity": "sha512-32h99BoLYStT1iq1v2P9uwpyznQ4M2jRiFB6acitKz52Gqn+vPaMDUTB1bYi1WN4Nquj2w+t+bimYUG83DC55A==",
|
"integrity": "sha512-PpEBq7b6qY/qrOmpYQ/jTMDYfuQMELR4g4WI1M/NaSDDD/bdcMb+dj4Hgks7p41kW2caXsPsEZAEAyAgjVVC0g==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"@babel/code-frame": "^7.0.0",
|
"@babel/code-frame": "^7.0.0",
|
||||||
|
@ -3641,9 +3641,9 @@
|
||||||
"debug": "^4.0.1",
|
"debug": "^4.0.1",
|
||||||
"doctrine": "^3.0.0",
|
"doctrine": "^3.0.0",
|
||||||
"eslint-scope": "^5.0.0",
|
"eslint-scope": "^5.0.0",
|
||||||
"eslint-utils": "^1.4.2",
|
"eslint-utils": "^1.4.3",
|
||||||
"eslint-visitor-keys": "^1.1.0",
|
"eslint-visitor-keys": "^1.1.0",
|
||||||
"espree": "^6.1.1",
|
"espree": "^6.1.2",
|
||||||
"esquery": "^1.0.1",
|
"esquery": "^1.0.1",
|
||||||
"esutils": "^2.0.2",
|
"esutils": "^2.0.2",
|
||||||
"file-entry-cache": "^5.0.1",
|
"file-entry-cache": "^5.0.1",
|
||||||
|
@ -3653,7 +3653,7 @@
|
||||||
"ignore": "^4.0.6",
|
"ignore": "^4.0.6",
|
||||||
"import-fresh": "^3.0.0",
|
"import-fresh": "^3.0.0",
|
||||||
"imurmurhash": "^0.1.4",
|
"imurmurhash": "^0.1.4",
|
||||||
"inquirer": "^6.4.1",
|
"inquirer": "^7.0.0",
|
||||||
"is-glob": "^4.0.0",
|
"is-glob": "^4.0.0",
|
||||||
"js-yaml": "^3.13.1",
|
"js-yaml": "^3.13.1",
|
||||||
"json-stable-stringify-without-jsonify": "^1.0.1",
|
"json-stable-stringify-without-jsonify": "^1.0.1",
|
||||||
|
@ -3679,15 +3679,6 @@
|
||||||
"integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==",
|
"integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"glob-parent": {
|
|
||||||
"version": "5.1.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.0.tgz",
|
|
||||||
"integrity": "sha512-qjtRgnIVmOfnKUE3NJAQEdk+lKrxfw8t5ke7SXtfMTHcjsBfOfWXCQfdb30zfDoZQ2IRSIiidmjtbHZPZ++Ihw==",
|
|
||||||
"dev": true,
|
|
||||||
"requires": {
|
|
||||||
"is-glob": "^4.0.1"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"import-fresh": {
|
"import-fresh": {
|
||||||
"version": "3.1.0",
|
"version": "3.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.1.0.tgz",
|
||||||
|
@ -3698,21 +3689,6 @@
|
||||||
"resolve-from": "^4.0.0"
|
"resolve-from": "^4.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"is-extglob": {
|
|
||||||
"version": "2.1.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
|
|
||||||
"integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=",
|
|
||||||
"dev": true
|
|
||||||
},
|
|
||||||
"is-glob": {
|
|
||||||
"version": "4.0.1",
|
|
||||||
"resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz",
|
|
||||||
"integrity": "sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg==",
|
|
||||||
"dev": true,
|
|
||||||
"requires": {
|
|
||||||
"is-extglob": "^2.1.1"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"resolve-from": {
|
"resolve-from": {
|
||||||
"version": "4.0.0",
|
"version": "4.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
|
||||||
|
@ -3754,9 +3730,9 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"eslint-config-prettier": {
|
"eslint-config-prettier": {
|
||||||
"version": "6.4.0",
|
"version": "6.5.0",
|
||||||
"resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-6.4.0.tgz",
|
"resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-6.5.0.tgz",
|
||||||
"integrity": "sha512-YrKucoFdc7SEko5Sxe4r6ixqXPDP1tunGw91POeZTTRKItf/AMFYt/YLEQtZMkR2LVpAVhcAcZgcWpm1oGPW7w==",
|
"integrity": "sha512-cjXp8SbO9VFGW/Z7mbTydqS9to8Z58E5aYhj3e1+Hx7lS9s6gL5ILKNpCqZAFOVYRcSkWPFYljHrEh8QFEK5EQ==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"get-stdin": "^6.0.0"
|
"get-stdin": "^6.0.0"
|
||||||
|
@ -3990,6 +3966,12 @@
|
||||||
"prettier-linter-helpers": "^1.0.0"
|
"prettier-linter-helpers": "^1.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"eslint-plugin-sort-class-members": {
|
||||||
|
"version": "1.6.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/eslint-plugin-sort-class-members/-/eslint-plugin-sort-class-members-1.6.0.tgz",
|
||||||
|
"integrity": "sha512-7+FEtnxeK0vtoPERAU7gtxpr//NsYYrPvMoDRIoqP6u999xbY7Lpgjr9KmalfXIOTuVxvRNgK7vJhAGVRi/z4A==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"eslint-scope": {
|
"eslint-scope": {
|
||||||
"version": "5.0.0",
|
"version": "5.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.0.0.tgz",
|
||||||
|
@ -6619,78 +6601,87 @@
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"inquirer": {
|
"inquirer": {
|
||||||
"version": "6.5.2",
|
"version": "7.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/inquirer/-/inquirer-6.5.2.tgz",
|
"resolved": "https://registry.npmjs.org/inquirer/-/inquirer-7.0.0.tgz",
|
||||||
"integrity": "sha512-cntlB5ghuB0iuO65Ovoi8ogLHiWGs/5yNrtUcKjFhSSiVeAIVpD7koaSU9RM8mpXw5YDi9RdYXGQMaOURB7ycQ==",
|
"integrity": "sha512-rSdC7zelHdRQFkWnhsMu2+2SO41mpv2oF2zy4tMhmiLWkcKbOAs87fWAJhVXttKVwhdZvymvnuM95EyEXg2/tQ==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"ansi-escapes": "^3.2.0",
|
"ansi-escapes": "^4.2.1",
|
||||||
"chalk": "^2.4.2",
|
"chalk": "^2.4.2",
|
||||||
"cli-cursor": "^2.1.0",
|
"cli-cursor": "^3.1.0",
|
||||||
"cli-width": "^2.0.0",
|
"cli-width": "^2.0.0",
|
||||||
"external-editor": "^3.0.3",
|
"external-editor": "^3.0.3",
|
||||||
"figures": "^2.0.0",
|
"figures": "^3.0.0",
|
||||||
"lodash": "^4.17.12",
|
"lodash": "^4.17.15",
|
||||||
"mute-stream": "0.0.7",
|
"mute-stream": "0.0.8",
|
||||||
"run-async": "^2.2.0",
|
"run-async": "^2.2.0",
|
||||||
"rxjs": "^6.4.0",
|
"rxjs": "^6.4.0",
|
||||||
"string-width": "^2.1.0",
|
"string-width": "^4.1.0",
|
||||||
"strip-ansi": "^5.1.0",
|
"strip-ansi": "^5.1.0",
|
||||||
"through": "^2.3.6"
|
"through": "^2.3.6"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"ansi-escapes": {
|
"ansi-escapes": {
|
||||||
"version": "3.2.0",
|
"version": "4.2.1",
|
||||||
"resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-3.2.0.tgz",
|
"resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.2.1.tgz",
|
||||||
"integrity": "sha512-cBhpre4ma+U0T1oM5fXg7Dy1Jw7zzwv7lt/GoCpr+hDQJoYnKVPLL4dCvSEFMmQurOQvSrwT7SL/DAlhBI97RQ==",
|
"integrity": "sha512-Cg3ymMAdN10wOk/VYfLV7KCQyv7EDirJ64500sU7n9UlmioEtDuU5Gd+hj73hXSU/ex7tHJSssmyftDdkMLO8Q==",
|
||||||
"dev": true
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"type-fest": "^0.5.2"
|
||||||
|
}
|
||||||
},
|
},
|
||||||
"ansi-regex": {
|
"ansi-regex": {
|
||||||
"version": "3.0.0",
|
"version": "4.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
|
||||||
"integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
|
"integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"cli-cursor": {
|
"cli-cursor": {
|
||||||
"version": "2.1.0",
|
"version": "3.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-2.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-3.1.0.tgz",
|
||||||
"integrity": "sha1-s12sN2R5+sw+lHR9QdDQ9SOP/LU=",
|
"integrity": "sha512-I/zHAwsKf9FqGoXM4WWRACob9+SNukZTd94DWF57E4toouRulbCxcUh6RKUEOQlYTHJnzkPMySvPNaaSLNfLZw==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"restore-cursor": "^2.0.0"
|
"restore-cursor": "^3.1.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"emoji-regex": {
|
||||||
|
"version": "8.0.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
|
||||||
|
"integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"figures": {
|
"figures": {
|
||||||
"version": "2.0.0",
|
"version": "3.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/figures/-/figures-2.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/figures/-/figures-3.1.0.tgz",
|
||||||
"integrity": "sha1-OrGi0qYsi/tDGgyUy3l6L84nyWI=",
|
"integrity": "sha512-ravh8VRXqHuMvZt/d8GblBeqDMkdJMBdv/2KntFH+ra5MXkO7nxNKpzQ3n6QD/2da1kH0aWmNISdvhM7gl2gVg==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"escape-string-regexp": "^1.0.5"
|
"escape-string-regexp": "^1.0.5"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"is-fullwidth-code-point": {
|
"is-fullwidth-code-point": {
|
||||||
"version": "2.0.0",
|
"version": "3.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
|
||||||
"integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
|
"integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"onetime": {
|
"onetime": {
|
||||||
"version": "2.0.1",
|
"version": "5.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/onetime/-/onetime-2.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/onetime/-/onetime-5.1.0.tgz",
|
||||||
"integrity": "sha1-BnQoIw/WdEOyeUsiu6UotoZ5YtQ=",
|
"integrity": "sha512-5NcSkPHhwTVFIQN+TUqXoS5+dlElHXdpAWu9I0HP20YOtIi+aZ0Ct82jdlILDxjLEAWwvm+qj1m6aEtsDVmm6Q==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"mimic-fn": "^1.0.0"
|
"mimic-fn": "^2.1.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"restore-cursor": {
|
"restore-cursor": {
|
||||||
"version": "2.0.0",
|
"version": "3.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-2.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-3.1.0.tgz",
|
||||||
"integrity": "sha1-n37ih/gv0ybU/RYpI9YhKe7g368=",
|
"integrity": "sha512-l+sSefzHpj5qimhFSE5a8nufZYAM3sBSVMAPtYkmC+4EH2anSGaEMXSD0izRQbu9nfyQ9y5JrVmp7E8oZrUjvA==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"onetime": "^2.0.0",
|
"onetime": "^5.1.0",
|
||||||
"signal-exit": "^3.0.2"
|
"signal-exit": "^3.0.2"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -6704,24 +6695,14 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"string-width": {
|
"string-width": {
|
||||||
"version": "2.1.1",
|
"version": "4.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
|
"resolved": "https://registry.npmjs.org/string-width/-/string-width-4.1.0.tgz",
|
||||||
"integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
|
"integrity": "sha512-NrX+1dVVh+6Y9dnQ19pR0pP4FiEIlUvdTGn8pw6CKTNq5sgib2nIhmUNT5TAmhWmvKr3WcxBcP3E8nWezuipuQ==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"is-fullwidth-code-point": "^2.0.0",
|
"emoji-regex": "^8.0.0",
|
||||||
"strip-ansi": "^4.0.0"
|
"is-fullwidth-code-point": "^3.0.0",
|
||||||
},
|
"strip-ansi": "^5.2.0"
|
||||||
"dependencies": {
|
|
||||||
"strip-ansi": {
|
|
||||||
"version": "4.0.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
|
|
||||||
"integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
|
|
||||||
"dev": true,
|
|
||||||
"requires": {
|
|
||||||
"ansi-regex": "^3.0.0"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"strip-ansi": {
|
"strip-ansi": {
|
||||||
|
@ -6731,15 +6712,13 @@
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"ansi-regex": "^4.1.0"
|
"ansi-regex": "^4.1.0"
|
||||||
},
|
|
||||||
"dependencies": {
|
|
||||||
"ansi-regex": {
|
|
||||||
"version": "4.1.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
|
|
||||||
"integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg==",
|
|
||||||
"dev": true
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
"type-fest": {
|
||||||
|
"version": "0.5.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.5.2.tgz",
|
||||||
|
"integrity": "sha512-DWkS49EQKVX//Tbupb9TFa19c7+MK1XmzkrZUR8TAktmE/DizXoaoJV6TZ/tSIPXipqNiRI6CyAe7x69Jb6RSw==",
|
||||||
|
"dev": true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -8396,9 +8375,9 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"mimic-fn": {
|
"mimic-fn": {
|
||||||
"version": "1.2.0",
|
"version": "2.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-1.2.0.tgz",
|
"resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz",
|
||||||
"integrity": "sha512-jf84uxzwiuiIVKiOLpfYk7N46TSy8ubTonmneY9vrpHNAnp0QBt2BxWV9dO3/j+BoVAb+a5G6YDPW3M5HOdMWQ==",
|
"integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"mimic-response": {
|
"mimic-response": {
|
||||||
|
@ -8588,9 +8567,9 @@
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"mute-stream": {
|
"mute-stream": {
|
||||||
"version": "0.0.7",
|
"version": "0.0.8",
|
||||||
"resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz",
|
"resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.8.tgz",
|
||||||
"integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=",
|
"integrity": "sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"nan": {
|
"nan": {
|
||||||
|
|
|
@ -63,14 +63,15 @@
|
||||||
"chai": "^4.2.0",
|
"chai": "^4.2.0",
|
||||||
"csso-cli": "^3.0.0",
|
"csso-cli": "^3.0.0",
|
||||||
"cypress": "3.5.0",
|
"cypress": "3.5.0",
|
||||||
"eslint": "^6.5.1",
|
"eslint": "^6.6.0",
|
||||||
"eslint-config-airbnb-base": "^14.0.0",
|
"eslint-config-airbnb-base": "^14.0.0",
|
||||||
"eslint-config-prettier": "^6.4.0",
|
"eslint-config-prettier": "^6.5.0",
|
||||||
"eslint-loader": "^3.0.2",
|
"eslint-loader": "^3.0.2",
|
||||||
"eslint-plugin-compat": "3.3.0",
|
"eslint-plugin-compat": "3.3.0",
|
||||||
"eslint-plugin-cypress": "^2.7.0",
|
"eslint-plugin-cypress": "^2.7.0",
|
||||||
"eslint-plugin-import": "^2.18.2",
|
"eslint-plugin-import": "^2.18.2",
|
||||||
"eslint-plugin-prettier": "^3.1.1",
|
"eslint-plugin-prettier": "^3.1.1",
|
||||||
|
"eslint-plugin-sort-class-members": "^1.6.0",
|
||||||
"express": "^4.16.4",
|
"express": "^4.16.4",
|
||||||
"husky": "^3.0.9",
|
"husky": "^3.0.9",
|
||||||
"jsdom": "^15.2.0",
|
"jsdom": "^15.2.0",
|
||||||
|
|
|
@ -351,11 +351,13 @@ class Choices {
|
||||||
|
|
||||||
highlightAll() {
|
highlightAll() {
|
||||||
this._store.items.forEach(item => this.highlightItem(item));
|
this._store.items.forEach(item => this.highlightItem(item));
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
|
|
||||||
unhighlightAll() {
|
unhighlightAll() {
|
||||||
this._store.items.forEach(item => this.unhighlightItem(item));
|
this._store.items.forEach(item => this.unhighlightItem(item));
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -431,6 +433,7 @@ class Choices {
|
||||||
const values = this._store.activeItems.reduce((selectedItems, item) => {
|
const values = this._store.activeItems.reduce((selectedItems, item) => {
|
||||||
const itemValue = valueOnly ? item.value : item;
|
const itemValue = valueOnly ? item.value : item;
|
||||||
selectedItems.push(itemValue);
|
selectedItems.push(itemValue);
|
||||||
|
|
||||||
return selectedItems;
|
return selectedItems;
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
@ -446,6 +449,7 @@ class Choices {
|
||||||
}
|
}
|
||||||
|
|
||||||
items.forEach(value => this._setChoiceOrItem(value));
|
items.forEach(value => this._setChoiceOrItem(value));
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -539,12 +543,14 @@ class Choices {
|
||||||
label = 'label',
|
label = 'label',
|
||||||
replaceChoices = false,
|
replaceChoices = false,
|
||||||
) {
|
) {
|
||||||
if (!this.initialised)
|
if (!this.initialised) {
|
||||||
throw new ReferenceError(
|
throw new ReferenceError(
|
||||||
`setChoices was called on a non-initialized instance of Choices`,
|
`setChoices was called on a non-initialized instance of Choices`,
|
||||||
);
|
);
|
||||||
if (!this._isSelectElement)
|
}
|
||||||
|
if (!this._isSelectElement) {
|
||||||
throw new TypeError(`setChoices can't be used with INPUT based Choices`);
|
throw new TypeError(`setChoices can't be used with INPUT based Choices`);
|
||||||
|
}
|
||||||
|
|
||||||
if (typeof value !== 'string' || !value) {
|
if (typeof value !== 'string' || !value) {
|
||||||
throw new TypeError(
|
throw new TypeError(
|
||||||
|
@ -558,10 +564,11 @@ class Choices {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!Array.isArray(choicesArrayOrFetcher)) {
|
if (!Array.isArray(choicesArrayOrFetcher)) {
|
||||||
if (typeof choicesArrayOrFetcher !== 'function')
|
if (typeof choicesArrayOrFetcher !== 'function') {
|
||||||
throw new TypeError(
|
throw new TypeError(
|
||||||
`.setChoices must be called either with array of choices with a function resulting into Promise of array of choices`,
|
`.setChoices must be called either with array of choices with a function resulting into Promise of array of choices`,
|
||||||
);
|
);
|
||||||
|
}
|
||||||
|
|
||||||
// it's a choices fetcher
|
// it's a choices fetcher
|
||||||
requestAnimationFrame(() => this._handleLoadingState(true));
|
requestAnimationFrame(() => this._handleLoadingState(true));
|
||||||
|
@ -571,21 +578,26 @@ class Choices {
|
||||||
return fetcher
|
return fetcher
|
||||||
.then(data => this.setChoices(data, value, label, replaceChoices))
|
.then(data => this.setChoices(data, value, label, replaceChoices))
|
||||||
.catch(err => {
|
.catch(err => {
|
||||||
if (!this.config.silent) console.error(err);
|
if (!this.config.silent) {
|
||||||
|
console.error(err);
|
||||||
|
}
|
||||||
})
|
})
|
||||||
.then(() => this._handleLoadingState(false))
|
.then(() => this._handleLoadingState(false))
|
||||||
.then(() => this);
|
.then(() => this);
|
||||||
}
|
}
|
||||||
// function returned something else than promise, let's check if it's an array of choices
|
// function returned something else than promise, let's check if it's an array of choices
|
||||||
if (!Array.isArray(fetcher))
|
if (!Array.isArray(fetcher)) {
|
||||||
throw new TypeError(
|
throw new TypeError(
|
||||||
`.setChoices first argument function must return either array of choices or Promise, got: ${typeof fetcher}`,
|
`.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
|
// recursion with results, it's sync and choices were cleared already
|
||||||
return this.setChoices(fetcher, value, label, false);
|
return this.setChoices(fetcher, value, label, false);
|
||||||
}
|
}
|
||||||
|
|
||||||
this.containerOuter.removeLoadingState();
|
this.containerOuter.removeLoadingState();
|
||||||
|
|
||||||
const addGroupsAndChoices = groupOrChoice => {
|
const addGroupsAndChoices = groupOrChoice => {
|
||||||
if (groupOrChoice.choices) {
|
if (groupOrChoice.choices) {
|
||||||
this._addGroup({
|
this._addGroup({
|
||||||
|
@ -615,10 +627,13 @@ class Choices {
|
||||||
|
|
||||||
clearChoices() {
|
clearChoices() {
|
||||||
this._store.dispatch(clearChoices());
|
this._store.dispatch(clearChoices());
|
||||||
|
|
||||||
|
return this;
|
||||||
}
|
}
|
||||||
|
|
||||||
clearStore() {
|
clearStore() {
|
||||||
this._store.dispatch(clearAll());
|
this._store.dispatch(clearAll());
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -769,6 +784,7 @@ class Choices {
|
||||||
if (this._isSelectOneElement) {
|
if (this._isSelectOneElement) {
|
||||||
return choice.groupId === group.id;
|
return choice.groupId === group.id;
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
choice.groupId === group.id &&
|
choice.groupId === group.id &&
|
||||||
(this.config.renderSelectedChoices === 'always' || !choice.selected)
|
(this.config.renderSelectedChoices === 'always' || !choice.selected)
|
||||||
|
@ -833,6 +849,7 @@ class Choices {
|
||||||
} else {
|
} else {
|
||||||
acc.normalChoices.push(choice);
|
acc.normalChoices.push(choice);
|
||||||
}
|
}
|
||||||
|
|
||||||
return acc;
|
return acc;
|
||||||
},
|
},
|
||||||
{ placeholderChoices: [], normalChoices: [] },
|
{ placeholderChoices: [], normalChoices: [] },
|
||||||
|
@ -980,7 +997,9 @@ class Choices {
|
||||||
// If we are clicking on an option
|
// If we are clicking on an option
|
||||||
const { id } = element.dataset;
|
const { id } = element.dataset;
|
||||||
const choice = this._store.getChoiceById(id);
|
const choice = this._store.getChoiceById(id);
|
||||||
if (!choice) return;
|
if (!choice) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
const passedKeyCode =
|
const passedKeyCode =
|
||||||
activeItems[0] && activeItems[0].keyCode ? activeItems[0].keyCode : null;
|
activeItems[0] && activeItems[0].keyCode ? activeItems[0].keyCode : null;
|
||||||
const hasActiveDropdown = this.dropdown.isActive;
|
const hasActiveDropdown = this.dropdown.isActive;
|
||||||
|
@ -1921,6 +1940,7 @@ class Choices {
|
||||||
}
|
}
|
||||||
|
|
||||||
const { templates, classNames } = this.config;
|
const { templates, classNames } = this.config;
|
||||||
|
|
||||||
return templates[template].call(this, classNames, ...args);
|
return templates[template].call(this, classNames, ...args);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -2068,7 +2088,9 @@ class Choices {
|
||||||
});
|
});
|
||||||
|
|
||||||
// If sorting is enabled or the user is searching, filter choices
|
// If sorting is enabled or the user is searching, filter choices
|
||||||
if (this.config.shouldSort) allChoices.sort(filter);
|
if (this.config.shouldSort) {
|
||||||
|
allChoices.sort(filter);
|
||||||
|
}
|
||||||
|
|
||||||
// Determine whether there is a selected choice
|
// Determine whether there is a selected choice
|
||||||
const hasSelectedChoice = allChoices.some(choice => choice.selected);
|
const hasSelectedChoice = allChoices.some(choice => choice.selected);
|
||||||
|
@ -2212,6 +2234,7 @@ class Choices {
|
||||||
return elements.reduce(
|
return elements.reduce(
|
||||||
(instances, element) => {
|
(instances, element) => {
|
||||||
instances.push(new Choices(element, config));
|
instances.push(new Choices(element, config));
|
||||||
|
|
||||||
return instances;
|
return instances;
|
||||||
},
|
},
|
||||||
[this],
|
[this],
|
||||||
|
|
|
@ -15,16 +15,16 @@ describe('choices', () => {
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
passedElement = document.createElement('input');
|
||||||
|
passedElement.type = 'text';
|
||||||
|
passedElement.className = 'js-choices';
|
||||||
|
document.body.appendChild(passedElement);
|
||||||
|
|
||||||
|
instance = new Choices(passedElement);
|
||||||
|
});
|
||||||
|
|
||||||
describe('public methods', () => {
|
describe('public methods', () => {
|
||||||
beforeEach(() => {
|
|
||||||
passedElement = document.createElement('input');
|
|
||||||
passedElement.type = 'text';
|
|
||||||
passedElement.className = 'js-choices';
|
|
||||||
document.body.appendChild(passedElement);
|
|
||||||
|
|
||||||
instance = new Choices(passedElement);
|
|
||||||
});
|
|
||||||
|
|
||||||
afterEach(() => {
|
afterEach(() => {
|
||||||
output = null;
|
output = null;
|
||||||
instance = null;
|
instance = null;
|
||||||
|
@ -798,6 +798,29 @@ describe('choices', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
describe('clearChoices', () => {
|
||||||
|
let storeDispatchStub;
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
storeDispatchStub = stub();
|
||||||
|
instance._store.dispatch = storeDispatchStub;
|
||||||
|
|
||||||
|
output = instance.clearChoices();
|
||||||
|
});
|
||||||
|
|
||||||
|
afterEach(() => {
|
||||||
|
instance._store.dispatch.reset();
|
||||||
|
});
|
||||||
|
|
||||||
|
returnsInstance(output);
|
||||||
|
|
||||||
|
it('dispatches clearChoices action', () => {
|
||||||
|
expect(storeDispatchStub.lastCall.args[0]).to.eql({
|
||||||
|
type: ACTION_TYPES.CLEAR_CHOICES,
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
describe('clearStore', () => {
|
describe('clearStore', () => {
|
||||||
let storeDispatchStub;
|
let storeDispatchStub;
|
||||||
|
|
||||||
|
@ -930,6 +953,7 @@ describe('choices', () => {
|
||||||
expect(inst).to.eq(choice);
|
expect(inst).to.eq(choice);
|
||||||
fetcherCalled = true;
|
fetcherCalled = true;
|
||||||
await new Promise(resolve => setTimeout(resolve, 1000));
|
await new Promise(resolve => setTimeout(resolve, 1000));
|
||||||
|
|
||||||
return [
|
return [
|
||||||
{ label: 'l1', value: 'v1', customProperties: 'prop1' },
|
{ label: 'l1', value: 'v1', customProperties: 'prop1' },
|
||||||
{ label: 'l2', value: 'v2', customProperties: 'prop2' },
|
{ label: 'l2', value: 'v2', customProperties: 'prop2' },
|
||||||
|
@ -1440,7 +1464,9 @@ describe('choices', () => {
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
describe('private methods', () => {
|
||||||
describe('_createGroupsFragment', () => {
|
describe('_createGroupsFragment', () => {
|
||||||
let _createChoicesFragmentStub;
|
let _createChoicesFragmentStub;
|
||||||
const choices = [
|
const choices = [
|
||||||
|
|
|
@ -15,6 +15,7 @@ export default class Dropdown {
|
||||||
this.position = Math.ceil(
|
this.position = Math.ceil(
|
||||||
this.dimensions.top + window.pageYOffset + this.element.offsetHeight,
|
this.dimensions.top + window.pageYOffset + this.element.offsetHeight,
|
||||||
);
|
);
|
||||||
|
|
||||||
return this.position;
|
return this.position;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -35,6 +36,7 @@ export default class Dropdown {
|
||||||
this.element.classList.add(this.classNames.activeState);
|
this.element.classList.add(this.classNames.activeState);
|
||||||
this.element.setAttribute('aria-expanded', 'true');
|
this.element.setAttribute('aria-expanded', 'true');
|
||||||
this.isActive = true;
|
this.isActive = true;
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -47,6 +49,7 @@ export default class Dropdown {
|
||||||
this.element.classList.remove(this.classNames.activeState);
|
this.element.classList.remove(this.classNames.activeState);
|
||||||
this.element.setAttribute('aria-expanded', 'false');
|
this.element.setAttribute('aria-expanded', 'false');
|
||||||
this.isActive = false;
|
this.isActive = false;
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -25,14 +25,14 @@ export default class Input {
|
||||||
this.element.placeholder = placeholder;
|
this.element.placeholder = placeholder;
|
||||||
}
|
}
|
||||||
|
|
||||||
set value(value) {
|
|
||||||
this.element.value = value;
|
|
||||||
}
|
|
||||||
|
|
||||||
get value() {
|
get value() {
|
||||||
return sanitise(this.element.value);
|
return sanitise(this.element.value);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
set value(value) {
|
||||||
|
this.element.value = value;
|
||||||
|
}
|
||||||
|
|
||||||
addEventListeners() {
|
addEventListeners() {
|
||||||
this.element.addEventListener('paste', this._onPaste);
|
this.element.addEventListener('paste', this._onPaste);
|
||||||
this.element.addEventListener('input', this._onInput, {
|
this.element.addEventListener('input', this._onInput, {
|
||||||
|
|
|
@ -56,7 +56,8 @@ export default class WrappedElement {
|
||||||
this.element.removeAttribute('data-choice');
|
this.element.removeAttribute('data-choice');
|
||||||
|
|
||||||
// Re-assign values - this is weird, I know
|
// Re-assign values - this is weird, I know
|
||||||
this.element.value = this.element.value;
|
// @todo Figure out why we need to do this
|
||||||
|
this.element.value = this.element.value; // eslint-disable-line no-self-assign
|
||||||
}
|
}
|
||||||
|
|
||||||
enable() {
|
enable() {
|
||||||
|
|
|
@ -6,6 +6,10 @@ export default class WrappedInput extends WrappedElement {
|
||||||
this.delimiter = delimiter;
|
this.delimiter = delimiter;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get value() {
|
||||||
|
return this.element.value;
|
||||||
|
}
|
||||||
|
|
||||||
set value(items) {
|
set value(items) {
|
||||||
const itemValues = items.map(({ value }) => value);
|
const itemValues = items.map(({ value }) => value);
|
||||||
const joinedValues = itemValues.join(this.delimiter);
|
const joinedValues = itemValues.join(this.delimiter);
|
||||||
|
@ -13,8 +17,4 @@ export default class WrappedInput extends WrappedElement {
|
||||||
this.element.setAttribute('value', joinedValues);
|
this.element.setAttribute('value', joinedValues);
|
||||||
this.element.value = joinedValues;
|
this.element.value = joinedValues;
|
||||||
}
|
}
|
||||||
|
|
||||||
get value() {
|
|
||||||
return this.element.value;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
45
src/scripts/lib/delegate-events.js
Normal file
45
src/scripts/lib/delegate-events.js
Normal file
|
@ -0,0 +1,45 @@
|
||||||
|
window.delegateEvent = (function delegateEvent() {
|
||||||
|
let events;
|
||||||
|
let addedListenerTypes;
|
||||||
|
if (typeof events === 'undefined') {
|
||||||
|
events = new Map();
|
||||||
|
}
|
||||||
|
if (typeof addedListenerTypes === 'undefined') {
|
||||||
|
addedListenerTypes = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
function _callback(event) {
|
||||||
|
const type = events.get(event.type);
|
||||||
|
|
||||||
|
if (!type) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
type.forEach(fn => fn(event));
|
||||||
|
}
|
||||||
|
|
||||||
|
return {
|
||||||
|
add: function add(type, fn) {
|
||||||
|
// Cache list of events.
|
||||||
|
if (events.has(type)) {
|
||||||
|
events.get(type).push(fn);
|
||||||
|
} else {
|
||||||
|
events.set(type, [fn]);
|
||||||
|
}
|
||||||
|
// Setup events.
|
||||||
|
if (addedListenerTypes.indexOf(type) === -1) {
|
||||||
|
document.documentElement.addEventListener(type, _callback, true);
|
||||||
|
addedListenerTypes.push(type);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
remove: function remove(type, fn) {
|
||||||
|
if (!events.get(type)) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
events.set(type, events.get(type).filter(item => item !== fn));
|
||||||
|
if (!events.get(type).length) {
|
||||||
|
addedListenerTypes.splice(addedListenerTypes.indexOf(type), 1);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
||||||
|
})();
|
|
@ -36,6 +36,7 @@ export const wrap = (element, wrapper = document.createElement('div')) => {
|
||||||
} else {
|
} else {
|
||||||
element.parentNode.appendChild(wrapper);
|
element.parentNode.appendChild(wrapper);
|
||||||
}
|
}
|
||||||
|
|
||||||
return wrapper.appendChild(element);
|
return wrapper.appendChild(element);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -92,6 +93,7 @@ export const sanitise = value => {
|
||||||
|
|
||||||
export const strToEl = (() => {
|
export const strToEl = (() => {
|
||||||
const tmpEl = document.createElement('div');
|
const tmpEl = document.createElement('div');
|
||||||
|
|
||||||
return str => {
|
return str => {
|
||||||
const cleanedInput = str.trim();
|
const cleanedInput = str.trim();
|
||||||
tmpEl.innerHTML = cleanedInput;
|
tmpEl.innerHTML = cleanedInput;
|
||||||
|
@ -133,6 +135,7 @@ export const dispatchEvent = (element, type, customArgs = null) => {
|
||||||
export const getWindowHeight = () => {
|
export const getWindowHeight = () => {
|
||||||
const { body } = document;
|
const { body } = document;
|
||||||
const html = document.documentElement;
|
const html = document.documentElement;
|
||||||
|
|
||||||
return Math.max(
|
return Math.max(
|
||||||
body.scrollHeight,
|
body.scrollHeight,
|
||||||
body.offsetHeight,
|
body.offsetHeight,
|
||||||
|
|
|
@ -33,6 +33,7 @@ export default function choices(state = defaultState, action) {
|
||||||
return state.map(obj => {
|
return state.map(obj => {
|
||||||
const choice = obj;
|
const choice = obj;
|
||||||
choice.active = action.active;
|
choice.active = action.active;
|
||||||
|
|
||||||
return choice;
|
return choice;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -45,6 +46,7 @@ export default function choices(state = defaultState, action) {
|
||||||
if (choice.id === parseInt(action.choiceId, 10)) {
|
if (choice.id === parseInt(action.choiceId, 10)) {
|
||||||
choice.selected = true;
|
choice.selected = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
return choice;
|
return choice;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -61,6 +63,7 @@ export default function choices(state = defaultState, action) {
|
||||||
if (choice.id === parseInt(action.choiceId, 10)) {
|
if (choice.id === parseInt(action.choiceId, 10)) {
|
||||||
choice.selected = false;
|
choice.selected = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
return choice;
|
return choice;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -76,8 +79,10 @@ export default function choices(state = defaultState, action) {
|
||||||
choice.active = action.results.some(({ item, score }) => {
|
choice.active = action.results.some(({ item, score }) => {
|
||||||
if (item.id === choice.id) {
|
if (item.id === choice.id) {
|
||||||
choice.score = score;
|
choice.score = score;
|
||||||
|
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
return false;
|
return false;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -89,6 +94,7 @@ export default function choices(state = defaultState, action) {
|
||||||
return state.map(obj => {
|
return state.map(obj => {
|
||||||
const choice = obj;
|
const choice = obj;
|
||||||
choice.active = action.active;
|
choice.active = action.active;
|
||||||
|
|
||||||
return choice;
|
return choice;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -23,6 +23,7 @@ export default function items(state = defaultState, action) {
|
||||||
return newState.map(obj => {
|
return newState.map(obj => {
|
||||||
const item = obj;
|
const item = obj;
|
||||||
item.highlighted = false;
|
item.highlighted = false;
|
||||||
|
|
||||||
return item;
|
return item;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -34,6 +35,7 @@ export default function items(state = defaultState, action) {
|
||||||
if (item.id === action.id) {
|
if (item.id === action.id) {
|
||||||
item.active = false;
|
item.active = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
return item;
|
return item;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -44,6 +46,7 @@ export default function items(state = defaultState, action) {
|
||||||
if (item.id === action.id) {
|
if (item.id === action.id) {
|
||||||
item.highlighted = action.highlighted;
|
item.highlighted = action.highlighted;
|
||||||
}
|
}
|
||||||
|
|
||||||
return item;
|
return item;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
@ -125,6 +125,7 @@ export default class Store {
|
||||||
const hasActiveOptions = choices.some(
|
const hasActiveOptions = choices.some(
|
||||||
choice => choice.active === true && choice.disabled === false,
|
choice => choice.active === true && choice.disabled === false,
|
||||||
);
|
);
|
||||||
|
|
||||||
return isActive && hasActiveOptions;
|
return isActive && hasActiveOptions;
|
||||||
}, []);
|
}, []);
|
||||||
}
|
}
|
||||||
|
@ -145,8 +146,10 @@ export default class Store {
|
||||||
getChoiceById(id) {
|
getChoiceById(id) {
|
||||||
if (id) {
|
if (id) {
|
||||||
const n = parseInt(id, 10);
|
const n = parseInt(id, 10);
|
||||||
|
|
||||||
return this.activeChoices.find(choice => choice.id === n);
|
return this.activeChoices.find(choice => choice.id === n);
|
||||||
}
|
}
|
||||||
|
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -16,13 +16,24 @@ export const TEMPLATES = /** @type {Templates} */ ({
|
||||||
const div = Object.assign(document.createElement('div'), {
|
const div = Object.assign(document.createElement('div'), {
|
||||||
className: containerOuter,
|
className: containerOuter,
|
||||||
});
|
});
|
||||||
|
|
||||||
div.dataset.type = passedElementType;
|
div.dataset.type = passedElementType;
|
||||||
if (dir) div.dir = dir;
|
|
||||||
if (isSelectOneElement) div.tabIndex = 0;
|
if (dir) {
|
||||||
|
div.dir = dir;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (isSelectOneElement) {
|
||||||
|
div.tabIndex = 0;
|
||||||
|
}
|
||||||
|
|
||||||
if (isSelectElement) {
|
if (isSelectElement) {
|
||||||
div.setAttribute('role', searchEnabled ? 'combobox' : 'listbox');
|
div.setAttribute('role', searchEnabled ? 'combobox' : 'listbox');
|
||||||
if (searchEnabled) div.setAttribute('aria-autocomplete', 'list');
|
if (searchEnabled) {
|
||||||
|
div.setAttribute('aria-autocomplete', 'list');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
div.setAttribute('aria-haspopup', 'true');
|
div.setAttribute('aria-haspopup', 'true');
|
||||||
div.setAttribute('aria-expanded', 'false');
|
div.setAttribute('aria-expanded', 'false');
|
||||||
|
|
||||||
|
@ -63,20 +74,31 @@ export const TEMPLATES = /** @type {Templates} */ ({
|
||||||
className: item,
|
className: item,
|
||||||
innerHTML: label,
|
innerHTML: label,
|
||||||
});
|
});
|
||||||
|
|
||||||
Object.assign(div.dataset, {
|
Object.assign(div.dataset, {
|
||||||
item: '',
|
item: '',
|
||||||
id,
|
id,
|
||||||
value,
|
value,
|
||||||
customProperties,
|
customProperties,
|
||||||
});
|
});
|
||||||
if (active) div.setAttribute('aria-selected', 'true');
|
|
||||||
if (disabled) div.setAttribute('aria-disabled', 'true');
|
|
||||||
|
|
||||||
if (isPlaceholder) div.classList.add(placeholder);
|
if (active) {
|
||||||
|
div.setAttribute('aria-selected', 'true');
|
||||||
|
}
|
||||||
|
|
||||||
|
if (disabled) {
|
||||||
|
div.setAttribute('aria-disabled', 'true');
|
||||||
|
}
|
||||||
|
|
||||||
|
if (isPlaceholder) {
|
||||||
|
div.classList.add(placeholder);
|
||||||
|
}
|
||||||
div.classList.add(highlighted ? highlightedState : itemSelectable);
|
div.classList.add(highlighted ? highlightedState : itemSelectable);
|
||||||
|
|
||||||
if (removeItemButton) {
|
if (removeItemButton) {
|
||||||
if (disabled) div.classList.remove(itemSelectable);
|
if (disabled) {
|
||||||
|
div.classList.remove(itemSelectable);
|
||||||
|
}
|
||||||
div.dataset.deletable = '';
|
div.dataset.deletable = '';
|
||||||
/** @todo This MUST be localizable, not hardcoded! */
|
/** @todo This MUST be localizable, not hardcoded! */
|
||||||
const REMOVE_ITEM_TEXT = 'Remove item';
|
const REMOVE_ITEM_TEXT = 'Remove item';
|
||||||
|
@ -99,8 +121,12 @@ export const TEMPLATES = /** @type {Templates} */ ({
|
||||||
const div = Object.assign(document.createElement('div'), {
|
const div = Object.assign(document.createElement('div'), {
|
||||||
className: list,
|
className: list,
|
||||||
});
|
});
|
||||||
if (!isSelectOneElement) div.setAttribute('aria-multiselectable', 'true');
|
|
||||||
|
if (!isSelectOneElement) {
|
||||||
|
div.setAttribute('aria-multiselectable', 'true');
|
||||||
|
}
|
||||||
div.setAttribute('role', 'listbox');
|
div.setAttribute('role', 'listbox');
|
||||||
|
|
||||||
return div;
|
return div;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -108,15 +134,26 @@ export const TEMPLATES = /** @type {Templates} */ ({
|
||||||
const div = Object.assign(document.createElement('div'), {
|
const div = Object.assign(document.createElement('div'), {
|
||||||
className: `${group} ${disabled ? itemDisabled : ''}`,
|
className: `${group} ${disabled ? itemDisabled : ''}`,
|
||||||
});
|
});
|
||||||
|
|
||||||
div.setAttribute('role', 'group');
|
div.setAttribute('role', 'group');
|
||||||
Object.assign(div.dataset, { group: '', id, value });
|
|
||||||
if (disabled) div.setAttribute('aria-disabled', 'true');
|
Object.assign(div.dataset, {
|
||||||
|
group: '',
|
||||||
|
id,
|
||||||
|
value,
|
||||||
|
});
|
||||||
|
|
||||||
|
if (disabled) {
|
||||||
|
div.setAttribute('aria-disabled', 'true');
|
||||||
|
}
|
||||||
|
|
||||||
div.appendChild(
|
div.appendChild(
|
||||||
Object.assign(document.createElement('div'), {
|
Object.assign(document.createElement('div'), {
|
||||||
className: groupHeading,
|
className: groupHeading,
|
||||||
innerHTML: value,
|
innerHTML: value,
|
||||||
}),
|
}),
|
||||||
);
|
);
|
||||||
|
|
||||||
return div;
|
return div;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -140,17 +177,22 @@ export const TEMPLATES = /** @type {Templates} */ ({
|
||||||
disabled ? itemDisabled : itemSelectable
|
disabled ? itemDisabled : itemSelectable
|
||||||
} ${isPlaceholder ? placeholder : ''}`,
|
} ${isPlaceholder ? placeholder : ''}`,
|
||||||
});
|
});
|
||||||
|
|
||||||
div.setAttribute('role', groupId > 0 ? 'treeitem' : 'option');
|
div.setAttribute('role', groupId > 0 ? 'treeitem' : 'option');
|
||||||
|
|
||||||
Object.assign(div.dataset, {
|
Object.assign(div.dataset, {
|
||||||
choice: '',
|
choice: '',
|
||||||
id,
|
id,
|
||||||
value,
|
value,
|
||||||
selectText,
|
selectText,
|
||||||
});
|
});
|
||||||
|
|
||||||
if (disabled) {
|
if (disabled) {
|
||||||
div.dataset.choiceDisabled = '';
|
div.dataset.choiceDisabled = '';
|
||||||
div.setAttribute('aria-disabled', 'true');
|
div.setAttribute('aria-disabled', 'true');
|
||||||
} else div.dataset.choiceSelectable = '';
|
} else {
|
||||||
|
div.dataset.choiceSelectable = '';
|
||||||
|
}
|
||||||
|
|
||||||
return div;
|
return div;
|
||||||
},
|
},
|
||||||
|
@ -162,21 +204,30 @@ export const TEMPLATES = /** @type {Templates} */ ({
|
||||||
autocapitalize: 'off',
|
autocapitalize: 'off',
|
||||||
spellcheck: false,
|
spellcheck: false,
|
||||||
});
|
});
|
||||||
|
|
||||||
inp.setAttribute('role', 'textbox');
|
inp.setAttribute('role', 'textbox');
|
||||||
inp.setAttribute('aria-autocomplete', 'list');
|
inp.setAttribute('aria-autocomplete', 'list');
|
||||||
inp.setAttribute('aria-label', placeholderValue);
|
inp.setAttribute('aria-label', placeholderValue);
|
||||||
|
|
||||||
return inp;
|
return inp;
|
||||||
},
|
},
|
||||||
dropdown({ list, listDropdown }) {
|
dropdown({ list, listDropdown }) {
|
||||||
const div = document.createElement('div');
|
const div = document.createElement('div');
|
||||||
|
|
||||||
div.classList.add(list, listDropdown);
|
div.classList.add(list, listDropdown);
|
||||||
div.setAttribute('aria-expanded', 'false');
|
div.setAttribute('aria-expanded', 'false');
|
||||||
|
|
||||||
return div;
|
return div;
|
||||||
},
|
},
|
||||||
notice({ item, itemChoice, noResults, noChoices }, innerHTML, type = '') {
|
notice({ item, itemChoice, noResults, noChoices }, innerHTML, type = '') {
|
||||||
const classes = [item, itemChoice];
|
const classes = [item, itemChoice];
|
||||||
if (type === 'no-choices') classes.push(noChoices);
|
|
||||||
else if (type === 'no-results') classes.push(noResults);
|
if (type === 'no-choices') {
|
||||||
|
classes.push(noChoices);
|
||||||
|
} else if (type === 'no-results') {
|
||||||
|
classes.push(noResults);
|
||||||
|
}
|
||||||
|
|
||||||
return Object.assign(document.createElement('div'), {
|
return Object.assign(document.createElement('div'), {
|
||||||
innerHTML,
|
innerHTML,
|
||||||
className: classes.join(' '),
|
className: classes.join(' '),
|
||||||
|
@ -184,8 +235,12 @@ export const TEMPLATES = /** @type {Templates} */ ({
|
||||||
},
|
},
|
||||||
option({ label, value, customProperties, active, disabled }) {
|
option({ label, value, customProperties, active, disabled }) {
|
||||||
const opt = new Option(label, value, false, active);
|
const opt = new Option(label, value, false, active);
|
||||||
if (customProperties) opt.dataset.customProperties = customProperties;
|
|
||||||
|
if (customProperties) {
|
||||||
|
opt.dataset.customProperties = customProperties;
|
||||||
|
}
|
||||||
opt.disabled = disabled;
|
opt.disabled = disabled;
|
||||||
|
|
||||||
return opt;
|
return opt;
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue