From 0a3d4e72f12600dc084a70e6ec8ade77cc32833b Mon Sep 17 00:00:00 2001 From: Charith Amila Date: Sat, 13 Apr 2024 08:18:30 -0400 Subject: [PATCH] Fix/#6216 MultiSelect - SelectionLimit issue (#6218) * fix: 6216 disabled option with selectionLimit * fix: 6216 handle selectionLimit select all * Update MultiSelect.js * Update MultiSelect.js * Update MultiSelect.js --------- Co-authored-by: Melloware --- components/lib/multiselect/MultiSelect.js | 20 +++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) diff --git a/components/lib/multiselect/MultiSelect.js b/components/lib/multiselect/MultiSelect.js index ac1a0b3199..1daa91423a 100644 --- a/components/lib/multiselect/MultiSelect.js +++ b/components/lib/multiselect/MultiSelect.js @@ -422,6 +422,11 @@ export const MultiSelect = React.memo( } } + // make sure not to exceed the selection limit + if (props.selectionLimit && value && value.length) { + value = value.slice(0, props.selectionLimit); + } + updateModel(event.originalEvent, value, value); } }; @@ -681,11 +686,20 @@ export const MultiSelect = React.memo( }; const isOptionDisabled = (option) => { - if (props.optionDisabled) { - return ObjectUtils.isFunction(props.optionDisabled) ? props.optionDisabled(option) : ObjectUtils.resolveFieldData(option, props.optionDisabled); + // disable if we have hit our selection limit + if (!allowOptionSelect() && !isSelected(option)) { + return true; + } + + // check if custom optionDisabled function is being used + const { optionDisabled } = props; + + if (optionDisabled) { + return ObjectUtils.isFunction(optionDisabled) ? optionDisabled(option) : ObjectUtils.resolveFieldData(option, optionDisabled); } - return option && option.disabled !== undefined ? option.disabled : false; + // fallback to the option itself disabled value + return option && (option.disabled ?? false); }; const isOptionValueUsed = (option) => {