|
217 | 217 | return firstChild; |
218 | 218 | }; |
219 | 219 | })(); |
220 | | - var resolveNoticeFunction = function (fn, value) { |
221 | | - return typeof fn === 'function' ? fn(sanitise(value), value) : fn; |
222 | | - }; |
223 | 220 | var resolveStringFunction = function (fn) { |
224 | 221 | return typeof fn === 'function' ? fn() : fn; |
225 | 222 | }; |
|
251 | 248 | } |
252 | 249 | return ''; |
253 | 250 | }; |
| 251 | + var getChoiceForOutput = function (choice, keyCode) { |
| 252 | + return { |
| 253 | + id: choice.id, |
| 254 | + highlighted: choice.highlighted, |
| 255 | + labelClass: choice.labelClass, |
| 256 | + labelDescription: choice.labelDescription, |
| 257 | + customProperties: choice.customProperties, |
| 258 | + disabled: choice.disabled, |
| 259 | + active: choice.active, |
| 260 | + label: choice.label, |
| 261 | + placeholder: choice.placeholder, |
| 262 | + value: choice.value, |
| 263 | + groupValue: choice.group ? choice.group.label : undefined, |
| 264 | + element: choice.element, |
| 265 | + keyCode: keyCode, |
| 266 | + }; |
| 267 | + }; |
| 268 | + var resolveNoticeFunction = function (fn, value, item) { |
| 269 | + return typeof fn === 'function' ? fn(sanitise(value), unwrapStringForRaw(value), item) : fn; |
| 270 | + }; |
254 | 271 | var escapeForTemplate = function (allowHTML, s) { |
255 | 272 | return allowHTML ? unwrapStringForEscaped(s) : sanitise(s); |
256 | 273 | }; |
|
979 | 996 | customAddItemText: 'Only values matching specific conditions can be added', |
980 | 997 | addItemText: function (value) { return "Press Enter to add <b>\"".concat(value, "\"</b>"); }, |
981 | 998 | removeItemIconText: function () { return "Remove item"; }, |
982 | | - removeItemLabelText: function (value) { return "Remove item: ".concat(value); }, |
| 999 | + removeItemLabelText: function (value, _valueRaw, i) { |
| 1000 | + return "Remove item: ".concat(i ? sanitise(i.label) : value); |
| 1001 | + }, |
983 | 1002 | maxItemText: function (maxItemCount) { return "Only ".concat(maxItemCount, " values can be added"); }, |
984 | 1003 | valueComparer: function (value1, value2) { return value1 === value2; }, |
985 | 1004 | fuseOptions: { |
|
3125 | 3144 | var removeButton = document.createElement('button'); |
3126 | 3145 | removeButton.type = 'button'; |
3127 | 3146 | addClassesToElement(removeButton, button); |
3128 | | - setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value)); |
3129 | | - var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value); |
| 3147 | + var eventChoice = getChoiceForOutput(choice); |
| 3148 | + setElementHtml(removeButton, true, resolveNoticeFunction(removeItemIconText, choice.value, eventChoice)); |
| 3149 | + var REMOVE_ITEM_LABEL = resolveNoticeFunction(removeItemLabelText, choice.value, eventChoice); |
3130 | 3150 | if (REMOVE_ITEM_LABEL) { |
3131 | 3151 | removeButton.setAttribute('aria-label', REMOVE_ITEM_LABEL); |
3132 | 3152 | } |
|
3546 | 3566 | } |
3547 | 3567 | this._store.dispatch(highlightItem(choice, true)); |
3548 | 3568 | if (runEvent) { |
3549 | | - this.passedElement.triggerEvent(EventType.highlightItem, this._getChoiceForOutput(choice)); |
| 3569 | + this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(choice)); |
3550 | 3570 | } |
3551 | 3571 | return this; |
3552 | 3572 | }; |
|
3561 | 3581 | } |
3562 | 3582 | this._store.dispatch(highlightItem(choice, false)); |
3563 | 3583 | if (runEvent) { |
3564 | | - this.passedElement.triggerEvent(EventType.unhighlightItem, this._getChoiceForOutput(choice)); |
| 3584 | + this.passedElement.triggerEvent(EventType.unhighlightItem, getChoiceForOutput(choice)); |
3565 | 3585 | } |
3566 | 3586 | return this; |
3567 | 3587 | }; |
|
3571 | 3591 | _this._store.items.forEach(function (item) { |
3572 | 3592 | if (!item.highlighted) { |
3573 | 3593 | _this._store.dispatch(highlightItem(item, true)); |
3574 | | - _this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item)); |
| 3594 | + _this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item)); |
3575 | 3595 | } |
3576 | 3596 | }); |
3577 | 3597 | }); |
|
3583 | 3603 | _this._store.items.forEach(function (item) { |
3584 | 3604 | if (item.highlighted) { |
3585 | 3605 | _this._store.dispatch(highlightItem(item, false)); |
3586 | | - _this.passedElement.triggerEvent(EventType.highlightItem, _this._getChoiceForOutput(item)); |
| 3606 | + _this.passedElement.triggerEvent(EventType.highlightItem, getChoiceForOutput(item)); |
3587 | 3607 | } |
3588 | 3608 | }); |
3589 | 3609 | }); |
|
3658 | 3678 | return this; |
3659 | 3679 | }; |
3660 | 3680 | Choices.prototype.getValue = function (valueOnly) { |
3661 | | - var _this = this; |
3662 | 3681 | var values = this._store.items.map(function (item) { |
3663 | | - return (valueOnly ? item.value : _this._getChoiceForOutput(item)); |
| 3682 | + return (valueOnly ? item.value : getChoiceForOutput(item)); |
3664 | 3683 | }); |
3665 | 3684 | return this._isSelectOneElement || this.config.singleModeForMultiSelect ? values[0] : values; |
3666 | 3685 | }; |
|
3918 | 3937 | // @todo integrate with Store |
3919 | 3938 | this._searcher.reset(); |
3920 | 3939 | if (choice.selected) { |
3921 | | - this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(choice)); |
| 3940 | + this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(choice)); |
3922 | 3941 | } |
3923 | 3942 | return this; |
3924 | 3943 | }; |
|
4001 | 4020 | } |
4002 | 4021 | var _a = this, config = _a.config, isSearching = _a._isSearching; |
4003 | 4022 | var _b = this._store, activeGroups = _b.activeGroups, activeChoices = _b.activeChoices; |
4004 | | - var renderLimit = 0; |
4005 | | - if (isSearching && config.searchResultLimit > 0) { |
4006 | | - renderLimit = config.searchResultLimit; |
4007 | | - } |
4008 | | - else if (config.renderChoiceLimit > 0) { |
4009 | | - renderLimit = config.renderChoiceLimit; |
4010 | | - } |
| 4023 | + var renderLimit = isSearching ? config.searchResultLimit : config.renderChoiceLimit; |
4011 | 4024 | if (this._isSelectElement) { |
4012 | 4025 | var backingOptions = activeChoices.filter(function (choice) { return !choice.element; }); |
4013 | 4026 | if (backingOptions.length) { |
|
4020 | 4033 | return !choice.placeholder && (isSearching ? !!choice.rank : config.renderSelectedChoices || !choice.selected); |
4021 | 4034 | }); |
4022 | 4035 | }; |
| 4036 | + var showLabel = config.appendGroupInSearch && isSearching; |
4023 | 4037 | var selectableChoices = false; |
4024 | | - var renderChoices = function (choices, withinGroup, groupLabel) { |
| 4038 | + var renderChoices = function (choices, withinGroup) { |
4025 | 4039 | if (isSearching) { |
4026 | 4040 | // sortByRank is used to ensure stable sorting, as scores are non-unique |
4027 | 4041 | // this additionally ensures fuseOptions.sortFn is not ignored |
|
4031 | 4045 | choices.sort(config.sorter); |
4032 | 4046 | } |
4033 | 4047 | var choiceLimit = choices.length; |
4034 | | - choiceLimit = !withinGroup && renderLimit && choiceLimit > renderLimit ? renderLimit : choiceLimit; |
| 4048 | + choiceLimit = !withinGroup && renderLimit > 0 && choiceLimit > renderLimit ? renderLimit : choiceLimit; |
4035 | 4049 | choiceLimit--; |
4036 | 4050 | choices.every(function (choice, index) { |
4037 | 4051 | // choiceEl being empty signals the contents has probably significantly changed |
4038 | | - var dropdownItem = choice.choiceEl || _this._templates.choice(config, choice, config.itemSelectText, groupLabel); |
| 4052 | + var dropdownItem = choice.choiceEl || |
| 4053 | + _this._templates.choice(config, choice, config.itemSelectText, showLabel && choice.group ? choice.group.label : undefined); |
4039 | 4054 | choice.choiceEl = dropdownItem; |
4040 | 4055 | fragment.appendChild(dropdownItem); |
4041 | 4056 | if (isSearching || !choice.selected) { |
|
4050 | 4065 | } |
4051 | 4066 | if (!this._hasNonChoicePlaceholder && !isSearching && this._isSelectOneElement) { |
4052 | 4067 | // If we have a placeholder choice along with groups |
4053 | | - renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false, undefined); |
| 4068 | + renderChoices(activeChoices.filter(function (choice) { return choice.placeholder && !choice.group; }), false); |
4054 | 4069 | } |
4055 | 4070 | // If we have grouped options |
4056 | 4071 | if (activeGroups.length && !isSearching) { |
|
4059 | 4074 | } |
4060 | 4075 | // render Choices without group first, regardless of sort, otherwise they won't be distinguishable |
4061 | 4076 | // from the last group |
4062 | | - renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false, undefined); |
| 4077 | + renderChoices(activeChoices.filter(function (choice) { return !choice.placeholder && !choice.group; }), false); |
4063 | 4078 | activeGroups.forEach(function (group) { |
4064 | 4079 | var groupChoices = renderableChoices(group.choices); |
4065 | 4080 | if (groupChoices.length) { |
|
4069 | 4084 | dropdownGroup.remove(); |
4070 | 4085 | fragment.appendChild(dropdownGroup); |
4071 | 4086 | } |
4072 | | - renderChoices(groupChoices, true, config.appendGroupInSearch && isSearching ? group.label : undefined); |
| 4087 | + renderChoices(groupChoices, true); |
4073 | 4088 | } |
4074 | 4089 | }); |
4075 | 4090 | } |
4076 | 4091 | else { |
4077 | | - renderChoices(renderableChoices(activeChoices), false, undefined); |
| 4092 | + renderChoices(renderableChoices(activeChoices), false); |
4078 | 4093 | } |
4079 | 4094 | } |
4080 | 4095 | if (!selectableChoices && (isSearching || !fragment.children.length || !config.renderSelectedChoices)) { |
|
4200 | 4215 | } |
4201 | 4216 | } |
4202 | 4217 | }; |
| 4218 | + /** |
| 4219 | + * @deprecated Use utils.getChoiceForOutput |
| 4220 | + */ |
4203 | 4221 | // eslint-disable-next-line class-methods-use-this |
4204 | 4222 | Choices.prototype._getChoiceForOutput = function (choice, keyCode) { |
4205 | | - return { |
4206 | | - id: choice.id, |
4207 | | - highlighted: choice.highlighted, |
4208 | | - labelClass: choice.labelClass, |
4209 | | - labelDescription: choice.labelDescription, |
4210 | | - customProperties: choice.customProperties, |
4211 | | - disabled: choice.disabled, |
4212 | | - active: choice.active, |
4213 | | - label: choice.label, |
4214 | | - placeholder: choice.placeholder, |
4215 | | - value: choice.value, |
4216 | | - groupValue: choice.group ? choice.group.label : undefined, |
4217 | | - element: choice.element, |
4218 | | - keyCode: keyCode, |
4219 | | - }; |
| 4223 | + return getChoiceForOutput(choice, keyCode); |
4220 | 4224 | }; |
4221 | 4225 | Choices.prototype._triggerChange = function (value) { |
4222 | 4226 | if (value === undefined || value === null) { |
|
4421 | 4425 | var notice = ''; |
4422 | 4426 | if (canAddItem && typeof config.addItemFilter === 'function' && !config.addItemFilter(value)) { |
4423 | 4427 | canAddItem = false; |
4424 | | - notice = resolveNoticeFunction(config.customAddItemText, value); |
| 4428 | + notice = resolveNoticeFunction(config.customAddItemText, value, undefined); |
4425 | 4429 | } |
4426 | 4430 | if (canAddItem) { |
4427 | 4431 | var foundChoice = this._store.choices.find(function (choice) { return config.valueComparer(choice.value, value); }); |
|
4433 | 4437 | } |
4434 | 4438 | if (!config.duplicateItemsAllowed) { |
4435 | 4439 | canAddItem = false; |
4436 | | - notice = resolveNoticeFunction(config.uniqueItemText, value); |
| 4440 | + notice = resolveNoticeFunction(config.uniqueItemText, value, undefined); |
4437 | 4441 | } |
4438 | 4442 | } |
4439 | 4443 | } |
4440 | 4444 | if (canAddItem) { |
4441 | | - notice = resolveNoticeFunction(config.addItemText, value); |
| 4445 | + notice = resolveNoticeFunction(config.addItemText, value, undefined); |
4442 | 4446 | } |
4443 | 4447 | if (notice) { |
4444 | 4448 | this._displayNotice(notice, NoticeTypes.addChoice); |
|
4985 | 4989 | } |
4986 | 4990 | this._store.dispatch(addItem(item)); |
4987 | 4991 | if (withEvents) { |
4988 | | - this.passedElement.triggerEvent(EventType.addItem, this._getChoiceForOutput(item)); |
| 4992 | + var eventChoice = getChoiceForOutput(item); |
| 4993 | + this.passedElement.triggerEvent(EventType.addItem, eventChoice); |
4989 | 4994 | if (userTriggered) { |
4990 | | - this.passedElement.triggerEvent(EventType.choice, this._getChoiceForOutput(item)); |
| 4995 | + this.passedElement.triggerEvent(EventType.choice, eventChoice); |
4991 | 4996 | } |
4992 | 4997 | } |
4993 | 4998 | }; |
|
5000 | 5005 | if (notice && notice.type === NoticeTypes.noChoices) { |
5001 | 5006 | this._clearNotice(); |
5002 | 5007 | } |
5003 | | - this.passedElement.triggerEvent(EventType.removeItem, this._getChoiceForOutput(item)); |
| 5008 | + this.passedElement.triggerEvent(EventType.removeItem, getChoiceForOutput(item)); |
5004 | 5009 | }; |
5005 | 5010 | Choices.prototype._addChoice = function (choice, withEvents, userTriggered) { |
5006 | 5011 | if (withEvents === void 0) { withEvents = true; } |
|
0 commit comments