fix: Autosuggest custom rendering group and use-entered text not rendering correctly (#4489)

Author: ernst-dev

src/autosuggest/__tests__/render-option.test.tsx

@@ -231,7 +231,7 @@ describe('Autosuggest renderOption', () => {
         );
       });
 
-      test('does not render custom content for entered-text option', () => {
+      test('renders custom content for entered-text option', () => {
         const renderOption = jest.fn(props => {
           if (props.item.type === 'entered-text') {
             return <div>Use custom: {props.item.option.value}</div>;
@@ -248,8 +248,7 @@ describe('Autosuggest renderOption', () => {
 
         const enteredTextOption = wrapper.findEnteredTextOption();
         expect(enteredTextOption).not.toBe(null);
-        // entered-text options always use option.label, ignoring renderOption
-        expect(enteredTextOption!.getElement()).toHaveTextContent('Use value');
+        expect(enteredTextOption!.getElement()).toHaveTextContent('Use custom: custom-value');
       });
 
       test('maintains option index in item properties', () => {

src/autosuggest/autosuggest-option.tsx

@@ -150,12 +150,12 @@ const AutosuggestOption = (
 
   let optionContent;
   if (useEntered) {
-    optionContent = option.label;
+    optionContent = renderResult ?? option.label;
     // we don't want fancy generated content for screenreader for the "Use..." option,
     // just the visible text is fine
     screenReaderContent = undefined;
   } else if (isParent) {
-    optionContent = option.label;
+    optionContent = renderResult ?? option.label;
   } else {
     const a11yProperties: AutosuggestOptionProps['nativeAttributes'] = {};
     if (nativeAttributes['aria-label']) {