From 561548d13bf241550db1d8606adb34e97ae737eb Mon Sep 17 00:00:00 2001 From: Grzegorz Jazurek Date: Mon, 20 Feb 2023 16:19:21 +0100 Subject: [PATCH 1/5] Add disableOptionEqualToValueWarning property --- packages/mui-base/src/useAutocomplete/useAutocomplete.d.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/packages/mui-base/src/useAutocomplete/useAutocomplete.d.ts b/packages/mui-base/src/useAutocomplete/useAutocomplete.d.ts index 1f7a47eacbcffd..3aafc961c3665e 100644 --- a/packages/mui-base/src/useAutocomplete/useAutocomplete.d.ts +++ b/packages/mui-base/src/useAutocomplete/useAutocomplete.d.ts @@ -201,6 +201,11 @@ export interface UseAutocompleteProps< * @returns {boolean} */ isOptionEqualToValue?: (option: T, value: T) => boolean; + /** + * Disable warning when options are not equal to value + * @default false + */ + disableOptionEqualToValueWarning?: boolean; /** * If `true`, `value` must be an array and the menu will support multiple selections. * @default false From 392934641aca19b2e7f128bd332307286c03f241 Mon Sep 17 00:00:00 2001 From: Grzegorz Jazurek Date: Mon, 20 Feb 2023 16:21:18 +0100 Subject: [PATCH 2/5] Add condition for skipping missing option value check --- packages/mui-base/src/useAutocomplete/useAutocomplete.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/mui-base/src/useAutocomplete/useAutocomplete.js b/packages/mui-base/src/useAutocomplete/useAutocomplete.js index 7c6f0dc82caf0b..17673b46f56e0a 100644 --- a/packages/mui-base/src/useAutocomplete/useAutocomplete.js +++ b/packages/mui-base/src/useAutocomplete/useAutocomplete.js @@ -104,6 +104,7 @@ export default function useAutocomplete(props) { includeInputInList = false, inputValue: inputValueProp, isOptionEqualToValue = (option, value) => option === value, + disableOptionEqualToValueWarning = false, multiple = false, onChange, onClose, @@ -253,7 +254,7 @@ export default function useAutocomplete(props) { const listboxAvailable = open && filteredOptions.length > 0 && !readOnly; if (process.env.NODE_ENV !== 'production') { - if (value !== null && !freeSolo && options.length > 0) { + if (value !== null && !freeSolo && options.length > 0 && !disableOptionEqualToValueWarning) { const missingValue = (multiple ? value : [value]).filter( (value2) => !options.some((option) => isOptionEqualToValue(option, value2)), ); From 17c7ce55cab2e8f206f11e83ce2275ff5ef33491 Mon Sep 17 00:00:00 2001 From: Grzegorz Jazurek Date: Mon, 20 Feb 2023 16:22:43 +0100 Subject: [PATCH 3/5] Add new property do documentation --- docs/pages/base/api/use-autocomplete.json | 4 ++++ .../api-docs/use-autocomplete/use-autocomplete.json | 1 + 2 files changed, 5 insertions(+) diff --git a/docs/pages/base/api/use-autocomplete.json b/docs/pages/base/api/use-autocomplete.json index b6fd7f56c1d710..98fae90d11c5ab 100644 --- a/docs/pages/base/api/use-autocomplete.json +++ b/docs/pages/base/api/use-autocomplete.json @@ -50,6 +50,10 @@ "type": { "name": "boolean", "description": "boolean" }, "default": "false" }, + "disableOptionEqualToValueWarning": { + "type": { "name": "boolean", "description": "boolean" }, + "default": "false" + }, "filterOptions": { "type": { "name": "(options: T[], state: FilterOptionsState<T>) => T[]", diff --git a/docs/translations/api-docs/use-autocomplete/use-autocomplete.json b/docs/translations/api-docs/use-autocomplete/use-autocomplete.json index 365b442d731342..2698702eaf9731 100644 --- a/docs/translations/api-docs/use-autocomplete/use-autocomplete.json +++ b/docs/translations/api-docs/use-autocomplete/use-autocomplete.json @@ -14,6 +14,7 @@ "disabled": "If true, the component is disabled.", "disabledItemsFocusable": "If true, will allow focus on disabled items.", "disableListWrap": "If true, the list box in the popup will not wrap focus.", + "disableOptionEqualToValueWarning": "Disable warning when options are not equal to value", "filterOptions": "A function that determines the filtered options to be rendered on search.", "filterSelectedOptions": "If true, hide the selected options from the list box.", "freeSolo": "If true, the Autocomplete is free solo, meaning that the user input is not bound to provided options.", From 9c19a9a33bb2804622bf508cd9de45322b8bf468 Mon Sep 17 00:00:00 2001 From: Grzegorz Jazurek Date: Mon, 20 Feb 2023 22:51:35 +0100 Subject: [PATCH 4/5] Add disableOptionEqualToValueWarning to docs --- docs/pages/material-ui/api/autocomplete.json | 1 + docs/translations/api-docs/autocomplete/autocomplete.json | 1 + packages/mui-joy/src/Autocomplete/Autocomplete.tsx | 1 + packages/mui-material/src/Autocomplete/Autocomplete.js | 6 ++++++ 4 files changed, 9 insertions(+) diff --git a/docs/pages/material-ui/api/autocomplete.json b/docs/pages/material-ui/api/autocomplete.json index cca686211fc219..5f479efabe3cb2 100644 --- a/docs/pages/material-ui/api/autocomplete.json +++ b/docs/pages/material-ui/api/autocomplete.json @@ -35,6 +35,7 @@ "disabled": { "type": { "name": "bool" }, "default": "false" }, "disabledItemsFocusable": { "type": { "name": "bool" }, "default": "false" }, "disableListWrap": { "type": { "name": "bool" }, "default": "false" }, + "disableOptionEqualToValueWarning": { "type": { "name": "bool" }, "default": "false" }, "disablePortal": { "type": { "name": "bool" }, "default": "false" }, "filterOptions": { "type": { "name": "func" } }, "filterSelectedOptions": { "type": { "name": "bool" }, "default": "false" }, diff --git a/docs/translations/api-docs/autocomplete/autocomplete.json b/docs/translations/api-docs/autocomplete/autocomplete.json index 7a2fe237d9a903..7ea1958730fe12 100644 --- a/docs/translations/api-docs/autocomplete/autocomplete.json +++ b/docs/translations/api-docs/autocomplete/autocomplete.json @@ -19,6 +19,7 @@ "disabled": "If true, the component is disabled.", "disabledItemsFocusable": "If true, will allow focus on disabled items.", "disableListWrap": "If true, the list box in the popup will not wrap focus.", + "disableOptionEqualToValueWarning": "Disable warning when options are not equal to value", "disablePortal": "If true, the Popper content will be under the DOM hierarchy of the parent component.", "filterOptions": "A function that determines the filtered options to be rendered on search.

Signature:
function(options: Array<T>, state: object) => Array<T>
options: The options to render.
state: The state of the component.", "filterSelectedOptions": "If true, hide the selected options from the list box.", diff --git a/packages/mui-joy/src/Autocomplete/Autocomplete.tsx b/packages/mui-joy/src/Autocomplete/Autocomplete.tsx index 7540ab1c62905b..08e856941b35df 100644 --- a/packages/mui-joy/src/Autocomplete/Autocomplete.tsx +++ b/packages/mui-joy/src/Autocomplete/Autocomplete.tsx @@ -261,6 +261,7 @@ const excludeUseAutocompleteParams = < disableCloseOnSelect, disabledItemsFocusable, disableListWrap, + disableOptionEqualToValueWarning, filterSelectedOptions, handleHomeEndKeys, includeInputInList, diff --git a/packages/mui-material/src/Autocomplete/Autocomplete.js b/packages/mui-material/src/Autocomplete/Autocomplete.js index 19e2615989e707..46d8cda5c25648 100644 --- a/packages/mui-material/src/Autocomplete/Autocomplete.js +++ b/packages/mui-material/src/Autocomplete/Autocomplete.js @@ -398,6 +398,7 @@ const Autocomplete = React.forwardRef(function Autocomplete(inProps, ref) { disabled = false, disabledItemsFocusable = false, disableListWrap = false, + disableOptionEqualToValueWarning = false, disablePortal = false, filterOptions, filterSelectedOptions = false, @@ -807,6 +808,11 @@ Autocomplete.propTypes /* remove-proptypes */ = { * @default false */ disableListWrap: PropTypes.bool, + /** + * Disable warning when options are not equal to value + * @default false + */ + disableOptionEqualToValueWarning: PropTypes.bool, /** * If `true`, the `Popper` content will be under the DOM hierarchy of the parent component. * @default false From 57d0a0203de49f65fd77549005607f46370fa95c Mon Sep 17 00:00:00 2001 From: Grzegorz Jazurek Date: Mon, 20 Feb 2023 23:10:35 +0100 Subject: [PATCH 5/5] Add test for disableOptionEqualToValueWarning --- .../src/Autocomplete/Autocomplete.test.js | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/packages/mui-material/src/Autocomplete/Autocomplete.test.js b/packages/mui-material/src/Autocomplete/Autocomplete.test.js index fd569a30b30eea..e29add4375422a 100644 --- a/packages/mui-material/src/Autocomplete/Autocomplete.test.js +++ b/packages/mui-material/src/Autocomplete/Autocomplete.test.js @@ -1534,6 +1534,22 @@ describe('', () => { ]); }); + it('skip warn if value does not exist in options list and disableOptionEqualToValueWarning is true', () => { + const value = 'value outside of options'; + const options = ['val from previous server fetch']; + + expect(() => { + render( + } + disableOptionEqualToValueWarning + />, + ); + }).not.toWarnDev(); + }); + it('warn if groups options are not sorted', () => { const data = [ { group: 1, value: 'A' },