add support to display richtextv2 and markdown that has been converted to HTML

THIRD-PARTY-NOTICES

@@ -1020,7 +1020,7 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 
 The following NPM package may be included in this product:
 
- - @yext/search-core@2.3.0
+ - @yext/search-core@2.4.0-beta.0
 
 This package contains the following license and notice below:
 
@@ -1064,7 +1064,7 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 
 The following NPM package may be included in this product:
 
- - @yext/search-headless-react@2.2.0
+ - @yext/search-headless-react@2.3.0-beta.0
 
 This package contains the following license and notice below:
 
@@ -1108,7 +1108,7 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 
 The following NPM package may be included in this product:
 
- - @yext/search-headless@2.3.0
+ - @yext/search-headless@2.4.0-beta.0
 
 This package contains the following license and notice below:
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yext/search-ui-react",
-  "version": "1.3.0-beta.1",
+  "version": "1.3.0-beta.2",
   "description": "A library of React Components for powering Yext Search integrations",
   "author": "slapshot@yext.com",
   "license": "BSD-3-Clause",
@@ -76,7 +76,7 @@
     "@typescript-eslint/eslint-plugin": "^5.16.0",
     "@typescript-eslint/parser": "^5.16.0",
     "@yext/eslint-config-slapshot": "^0.5.0",
-    "@yext/search-headless-react": "^2.2.0",
+    "@yext/search-headless-react": "2.3.0-beta.0",
     "axe-playwright": "^1.1.11",
     "babel-jest": "^27.0.6",
     "eslint": "^8.11.0",
@@ -93,7 +93,7 @@
     "typescript": "~4.5.5"
   },
   "peerDependencies": {
-    "@yext/search-headless-react": "^2.2.0",
+    "@yext/search-headless-react": "2.3.0-beta.0",
     "react": "^16.14 || ^17 || ^18",
     "react-dom": "^16.14 || ^17 || ^18"
   },

src/components/FeaturedSnippetDirectAnswer.tsx

@@ -1,5 +1,6 @@
 import { FeaturedSnippetDirectAnswer as FeaturedSnippetDirectAnswerType } from '@yext/search-headless-react';
 import { renderHighlightedValue } from './utils/renderHighlightedValue';
+import { useMemo } from 'react';
 
 /**
  * Props for {@link FeaturedSnippetDirectAnswer}.
@@ -29,17 +30,32 @@ interface FeaturedSnippetDirectAnswerCssClasses {
  *
  * @internal
  */
+
+const unsupportedTextFormats: string[] = ['rich_text', 'rich_text_v2', 'markdown'];
+
 export function FeaturedSnippetDirectAnswer({
   result,
   readMoreClickHandler,
   cssClasses = {}
 }: FeaturedSnippetDirectAnswerProps): JSX.Element {
   const answer = result.fieldType === 'multi_line_text' && result.value;
-  // TODO: SLAP-2340, update rich text snippets to convert the markdown
-  if (result.fieldType === 'rich_text') {
-    console.warn('Rendering markdown for rich text direct answer is currently not supported. Displaying the unrendered markdown string as is.');
+  if (unsupportedTextFormats.includes(result.fieldType)) {
+    console.warn('Rendering ' + result.fieldType + ' direct answer is currently not supported. ' +
+        'You can modify your search configuration to convert ' + result.fieldType + ' to HTML to be rendered '
+        + 'on the page.');
+  }
+  let snippet: JSX.Element;
+  const snippetValue = useMemo(() =>
+  { return { __html: result.snippet?.value }; }, [result.snippet?.value]);
+
+  if (result.fieldType === 'html') {
+    snippet = (
+      <div dangerouslySetInnerHTML={snippetValue}></div>
+    );
+  }
+  else {
+    snippet = renderHighlightedValue(result.snippet, { highlighted: cssClasses.highlighted });
   }
-  const snippet = renderHighlightedValue(result.snippet, { highlighted: cssClasses.highlighted });
   const link = result.relatedResult.link || result.relatedResult.rawData.landingPageUrl as string;
   const name = result.relatedResult.name;
   const snippetLinkMessage = 'Read more about ';