add CardAnalyticsDataType

docs/search-ui-react.cardanalyticsdatatype.md

@@ -0,0 +1,15 @@
+<!-- Do not edit this file. It is automatically generated by API Documenter. -->
+
+[Home](./index.md) &gt; [@yext/search-ui-react](./search-ui-react.md) &gt; [CardAnalyticsDataType](./search-ui-react.cardanalyticsdatatype.md)
+
+## CardAnalyticsDataType type
+
+The data types use to construct the payload in the analytics event.
+
+<b>Signature:</b>
+
+```typescript
+export declare type CardAnalyticsDataType<T = DefaultRawDataType> = DirectAnswerData | Result<T>;
+```
+<b>References:</b> [DefaultRawDataType](./search-ui-react.defaultrawdatatype.md)
+

docs/search-ui-react.md

@@ -110,6 +110,7 @@
 
 |  Type Alias | Description |
 |  --- | --- |
+|  [CardAnalyticsDataType](./search-ui-react.cardanalyticsdatatype.md) | The data types use to construct the payload in the analytics event. |
 |  [CardAnalyticsType](./search-ui-react.cardanalyticstype.md) | Analytics event types for interactions on a card. |
 |  [CardComponent](./search-ui-react.cardcomponent.md) | A functional component that can be used to render a result card. |
 |  [CardCtaEventType](./search-ui-react.cardctaeventtype.md) | Analytics event types for cta click and title click. |

docs/search-ui-react.standardsectionprops.md

@@ -9,7 +9,7 @@ The configuration for a StandardSection.
 <b>Signature:</b>
 
 ```typescript
-export interface StandardSectionProps<T> extends SectionProps<T> 
+export interface StandardSectionProps<T = DefaultRawDataType> extends SectionProps<T> 
 ```
 <b>Extends:</b> [SectionProps](./search-ui-react.sectionprops.md)<!-- -->&lt;T&gt;
 

docs/search-ui-react.usecardanalyticscallback.md

@@ -9,14 +9,14 @@ Creates a memoized function for reporting card analytics.
 <b>Signature:</b>
 
 ```typescript
-export declare function useCardAnalyticsCallback<T = DefaultRawDataType>(result: Result<T> | DirectAnswerData, analyticsType: CardAnalyticsType): () => void;
+export declare function useCardAnalyticsCallback<T = DefaultRawDataType>(result: CardAnalyticsDataType<T>, analyticsType: CardAnalyticsType): () => void;
 ```
 
 ## Parameters
 
 |  Parameter | Type | Description |
 |  --- | --- | --- |
-|  result | Result&lt;T&gt; \| DirectAnswerData | result that contains data use in the card analytics event. |
+|  result | [CardAnalyticsDataType](./search-ui-react.cardanalyticsdatatype.md)<!-- -->&lt;T&gt; | result that contains data use in the card analytics event. |
 |  analyticsType | [CardAnalyticsType](./search-ui-react.cardanalyticstype.md) | the card analytics event type to report. |
 
 <b>Returns:</b>

docs/search-ui-react.usecardfeedbackcallback.md

@@ -9,14 +9,14 @@ Creates a memoized function for reporting card feedback analytics.
 <b>Signature:</b>
 
 ```typescript
-export declare function useCardFeedbackCallback<T = DefaultRawDataType>(result: Result<T> | DirectAnswerData): (analyticsType: FeedbackType) => void;
+export declare function useCardFeedbackCallback<T = DefaultRawDataType>(result: CardAnalyticsDataType<T>): (analyticsType: FeedbackType) => void;
 ```
 
 ## Parameters
 
 |  Parameter | Type | Description |
 |  --- | --- | --- |
-|  result | Result&lt;T&gt; \| DirectAnswerData | card result that contains data use in the feedback analytics event. |
+|  result | [CardAnalyticsDataType](./search-ui-react.cardanalyticsdatatype.md)<!-- -->&lt;T&gt; | card result that contains data use in the feedback analytics event. |
 
 <b>Returns:</b>
 

etc/search-ui-react.api.md

@@ -107,6 +107,9 @@ export interface AutocompleteResultCssClasses {
     option?: string;
 }
 
+// @public
+export type CardAnalyticsDataType<T = DefaultRawDataType> = DirectAnswer_2 | Result<T>;
+
 // @public
 export type CardAnalyticsType = CardCtaEventType | FeedbackType;
 
@@ -613,7 +616,7 @@ export interface StandardSectionCssClasses extends VerticalResultsCssClasses {
 }
 
 // @public
-export interface StandardSectionProps<T> extends SectionProps<T> {
+export interface StandardSectionProps<T = DefaultRawDataType> extends SectionProps<T> {
     customCssClasses?: StandardSectionCssClasses;
 }
 
@@ -689,10 +692,10 @@ export function updateLocationIfNeeded(searchActions: SearchActions, intents: Se
 export function useAnalytics(): AnalyticsService | null;
 
 // @public
-export function useCardAnalyticsCallback<T = DefaultRawDataType>(result: Result<T> | DirectAnswer_2, analyticsType: CardAnalyticsType): () => void;
+export function useCardAnalyticsCallback<T = DefaultRawDataType>(result: CardAnalyticsDataType<T>, analyticsType: CardAnalyticsType): () => void;
 
 // @public
-export function useCardFeedbackCallback<T = DefaultRawDataType>(result: Result<T> | DirectAnswer_2): (analyticsType: FeedbackType) => void;
+export function useCardFeedbackCallback<T = DefaultRawDataType>(result: CardAnalyticsDataType<T>): (analyticsType: FeedbackType) => void;
 
 // @public
 export function useComposedCssClasses<ClassInterface extends Partial<Record<keyof ClassInterface & string, string>>>(builtInClasses: Readonly<ClassInterface>, customClasses?: Partial<ClassInterface>): ClassInterface;

src/components/sections/StandardSection.tsx

@@ -3,6 +3,7 @@ import { SectionProps } from '../../models/sectionComponent';
 import { StandardCard } from '../cards/standard/StandardCard';
 import { useComposedCssClasses } from '../../hooks/useComposedCssClasses';
 import { VerticalResultsCssClasses } from '../VerticalResults';
+import { DefaultRawDataType } from '../../models';
 
 /**
  * The CSS class interface used for {@link StandardSection}.
@@ -22,7 +23,7 @@ const builtInCssClasses: Readonly<StandardSectionCssClasses> = {
  *
  * @public
  */
-export interface StandardSectionProps<T> extends SectionProps<T> {
+export interface StandardSectionProps<T = DefaultRawDataType> extends SectionProps<T> {
   /** CSS classes for customizing the component styling. */
   customCssClasses?: StandardSectionCssClasses
 }

src/hooks/index.ts

@@ -1,5 +1,5 @@
 export { useAnalytics } from './useAnalytics';
-export { CardAnalyticsType, CardCtaEventType } from './useCardAnalytics';
+export { CardAnalyticsType, CardCtaEventType, CardAnalyticsDataType } from './useCardAnalytics';
 export { useCardAnalyticsCallback } from './useCardAnalyticsCallback';
 export { useCardFeedbackCallback } from './useCardFeedbackCallback';
 export { useComposedCssClasses } from './useComposedCssClasses';

src/hooks/useCardAnalytics.ts

@@ -17,6 +17,13 @@ import { useAnalytics } from './useAnalytics';
  */
 export type CardCtaEventType = 'CTA_CLICK' | 'TITLE_CLICK';
 
+/**
+ * The data types use to construct the payload in the analytics event.
+ *
+ * @public
+ */
+export type CardAnalyticsDataType<T = DefaultRawDataType> = DirectAnswerData | Result<T>;
+
 /**
  * Analytics event types for interactions on a card.
  *
@@ -29,15 +36,15 @@ function isDirectAnswer(data: unknown): data is DirectAnswerData {
     (data as DirectAnswerData)?.type === DirectAnswerType.FieldValue;
 }
 
-export function useCardAnalytics<T = DefaultRawDataType>(): (
-  cardResult: Result<T> | DirectAnswerData, analyticsEventType: CardAnalyticsType
+export function useCardAnalytics<T>(): (
+  cardResult: CardAnalyticsDataType<T>, analyticsEventType: CardAnalyticsType
 ) => void {
   const analytics = useAnalytics();
   const verticalKey = useSearchState(state => state.vertical.verticalKey);
   const queryId = useSearchState(state => state.query.queryId);
 
   const reportCtaEvent = useCallback((
-    result: DirectAnswerData | Result<T>,
+    result: CardAnalyticsDataType<T>,
     eventType: CardCtaEventType
   ) => {
     let url: string | undefined, entityId: string | undefined, fieldName: string | undefined;
@@ -75,7 +82,7 @@ export function useCardAnalytics<T = DefaultRawDataType>(): (
   }, [analytics, queryId, verticalKey]);
 
   const reportFeedbackEvent = useCallback((
-    result: DirectAnswerData | Result<T>,
+    result: CardAnalyticsDataType<T>,
     feedbackType: FeedbackType
   ) => {
     if (!queryId) {
@@ -101,7 +108,7 @@ export function useCardAnalytics<T = DefaultRawDataType>(): (
   }, [analytics, queryId, verticalKey]);
 
   const reportAnalyticsEvent = useCallback((
-    cardResult: DirectAnswerData | Result<T>,
+    cardResult: CardAnalyticsDataType<T>,
     analyticsEventType: CardAnalyticsType
   ) => {
     if (!analytics) {

src/hooks/useCardAnalyticsCallback.tsx

@@ -1,7 +1,10 @@
-import { Result, DirectAnswer as DirectAnswerData } from '@yext/search-headless-react';
 import { useCallback } from 'react';
 import { DefaultRawDataType } from '../models';
-import { CardAnalyticsType, useCardAnalytics } from './useCardAnalytics';
+import {
+  CardAnalyticsDataType,
+  CardAnalyticsType,
+  useCardAnalytics
+} from './useCardAnalytics';
 
 /**
  * Creates a memoized function for reporting card analytics.
@@ -12,7 +15,7 @@ import { CardAnalyticsType, useCardAnalytics } from './useCardAnalytics';
  * @param analyticsType - the card analytics event type to report.
  */
 export function useCardAnalyticsCallback<T = DefaultRawDataType>(
-  result: Result<T> | DirectAnswerData,
+  result: CardAnalyticsDataType<T>,
   analyticsType: CardAnalyticsType
 ): () => void {
   const reportAnalyticsEvent = useCardAnalytics<T>();

src/hooks/useCardFeedbackCallback.tsx

@@ -2,7 +2,7 @@ import { Result, DirectAnswer as DirectAnswerData } from '@yext/search-headless-
 import { useCallback } from 'react';
 import { FeedbackType } from '../components/ThumbsFeedback';
 import { DefaultRawDataType } from '../models';
-import { useCardAnalytics } from './useCardAnalytics';
+import { CardAnalyticsDataType, useCardAnalytics } from './useCardAnalytics';
 
 /**
  * Creates a memoized function for reporting card feedback analytics.
@@ -12,7 +12,7 @@ import { useCardAnalytics } from './useCardAnalytics';
  * @param result - card result that contains data use in the feedback analytics event.
  */
 export function useCardFeedbackCallback<T = DefaultRawDataType>(
-  result: Result<T> | DirectAnswerData,
+  result: CardAnalyticsDataType<T>,
 ): (analyticsType: FeedbackType) => void {
   const reportAnalyticsEvent = useCardAnalytics<T>();
   return useCallback((analyticsType: FeedbackType) => {