@pega/cosmos-react-work 9.0.0-build.14.1 → 9.0.0-build.14.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/ArticleList/ArticleBuddy.d.ts.map +1 -1
- package/lib/components/ArticleList/ArticleBuddy.js +5 -1
- package/lib/components/ArticleList/ArticleBuddy.js.map +1 -1
- package/lib/components/ArticleList/ArticleList.types.d.ts +15 -1
- package/lib/components/ArticleList/ArticleList.types.d.ts.map +1 -1
- package/lib/components/ArticleList/ArticleList.types.js.map +1 -1
- package/lib/components/CaseView/CaseHeader/CaseHeader.d.ts.map +1 -1
- package/lib/components/CaseView/CaseHeader/CaseHeader.js +3 -3
- package/lib/components/CaseView/CaseHeader/CaseHeader.js.map +1 -1
- package/lib/components/CaseView/CaseView.d.ts.map +1 -1
- package/lib/components/CaseView/CaseView.js +2 -1
- package/lib/components/CaseView/CaseView.js.map +1 -1
- package/lib/components/CaseView/CaseView.styles.d.ts.map +1 -1
- package/lib/components/CaseView/CaseView.styles.js +20 -20
- package/lib/components/CaseView/CaseView.styles.js.map +1 -1
- package/lib/components/CaseView/CaseView.types.d.ts +1 -1
- package/lib/components/CaseView/CaseView.types.d.ts.map +1 -1
- package/lib/components/CaseView/CaseView.types.js.map +1 -1
- package/lib/components/CaseView/UtilitySummaryItemDialog.d.ts.map +1 -1
- package/lib/components/CaseView/UtilitySummaryItemDialog.js +10 -4
- package/lib/components/CaseView/UtilitySummaryItemDialog.js.map +1 -1
- package/lib/components/GenAICoach/GenAICoach.d.ts.map +1 -1
- package/lib/components/GenAICoach/GenAICoach.js +16 -9
- package/lib/components/GenAICoach/GenAICoach.js.map +1 -1
- package/lib/components/GenAICoach/GenAICoach.styles.d.ts +4 -0
- package/lib/components/GenAICoach/GenAICoach.styles.d.ts.map +1 -1
- package/lib/components/GenAICoach/GenAICoach.styles.js +26 -5
- package/lib/components/GenAICoach/GenAICoach.styles.js.map +1 -1
- package/lib/components/GenAICoach/GenAICoach.types.d.ts +13 -0
- package/lib/components/GenAICoach/GenAICoach.types.d.ts.map +1 -1
- package/lib/components/GenAICoach/GenAICoach.types.js.map +1 -1
- package/lib/components/GenAICoach/GenAIMessage.d.ts.map +1 -1
- package/lib/components/GenAICoach/GenAIMessage.js +8 -43
- package/lib/components/GenAICoach/GenAIMessage.js.map +1 -1
- package/lib/components/GenAICoach/GenAIMessageFeedback.d.ts +4 -0
- package/lib/components/GenAICoach/GenAIMessageFeedback.d.ts.map +1 -0
- package/lib/components/GenAICoach/GenAIMessageFeedback.js +92 -0
- package/lib/components/GenAICoach/GenAIMessageFeedback.js.map +1 -0
- package/lib/components/InteractionNotification/InteractionNotification.d.ts +21 -5
- package/lib/components/InteractionNotification/InteractionNotification.d.ts.map +1 -1
- package/lib/components/InteractionNotification/InteractionNotification.js +9 -4
- package/lib/components/InteractionNotification/InteractionNotification.js.map +1 -1
- package/lib/components/UtilitiesLayout/UtilitiesLayout.styles.js +1 -1
- package/lib/components/UtilitiesLayout/UtilitiesLayout.styles.js.map +1 -1
- package/package.json +4 -4
|
@@ -3,6 +3,7 @@ import type { BaseProps, MenuProps, OmitStrict, ProgressProps, RequireAtLeastOne
|
|
|
3
3
|
import type { MDMap } from '@pega/cosmos-react-rte';
|
|
4
4
|
export type State = 'minimized' | 'maximized';
|
|
5
5
|
export type Reaction = 'liked' | 'disliked';
|
|
6
|
+
export type FeedbackPrompt = 'liked' | 'disliked' | 'both';
|
|
6
7
|
export type Variant = {
|
|
7
8
|
placement: 'utilities';
|
|
8
9
|
state: State;
|
|
@@ -66,12 +67,16 @@ export type CoachMessageProps = RequireAtLeastOne<Partial<Pick<GenAICoachProps,
|
|
|
66
67
|
allChunksReceived?: boolean;
|
|
67
68
|
error?: string;
|
|
68
69
|
message?: MessageProps['message'];
|
|
70
|
+
messageActions?: ActionsProps;
|
|
69
71
|
markdownMap?: MDMap;
|
|
70
72
|
onStreamingUpdate?: (isStreamingDone: boolean) => void;
|
|
71
73
|
feedback?: {
|
|
72
74
|
reaction: Reaction | undefined;
|
|
75
|
+
feedbackText?: string;
|
|
73
76
|
onReaction: (id: MessageProps['id'], reaction: Reaction) => void;
|
|
74
77
|
onFeedbackComplete: (id: MessageProps['id'], comment?: string) => void;
|
|
78
|
+
promptFeedbackOn?: FeedbackPrompt;
|
|
79
|
+
allowFeedbackResubmission?: boolean;
|
|
75
80
|
};
|
|
76
81
|
onAnimationCursorUpdate?: (animatedTillCursor: number) => void;
|
|
77
82
|
animationInitialCursorPos?: number;
|
|
@@ -162,7 +167,15 @@ export type GenAICoachProps = WithAttributes<'div', TestIdProp & {
|
|
|
162
167
|
enableDictation: boolean;
|
|
163
168
|
langCode: string;
|
|
164
169
|
};
|
|
170
|
+
/** Show welcome state */
|
|
171
|
+
showSalutation?: boolean;
|
|
172
|
+
/** Salutation message */
|
|
173
|
+
salutation?: string;
|
|
165
174
|
}>;
|
|
175
|
+
export interface MessageFeedbackProps {
|
|
176
|
+
messageId: MessageProps['id'];
|
|
177
|
+
feedback: CoachMessageProps['feedback'];
|
|
178
|
+
}
|
|
166
179
|
export interface UtilitiesGenAICoachProps extends OmitStrict<GenAICoachProps, 'variant'> {
|
|
167
180
|
onClose?: () => void;
|
|
168
181
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GenAICoach.types.d.ts","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAICoach.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,GAAG,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE3D,OAAO,KAAK,EACV,SAAS,EACT,SAAS,EACT,UAAU,EACV,aAAa,EACb,iBAAiB,EACjB,UAAU,EACV,cAAc,EACd,YAAY,EACZ,aAAa,EACb,gBAAgB,EAChB,aAAa,EACd,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAEpD,MAAM,MAAM,KAAK,GAAG,WAAW,GAAG,WAAW,CAAC;AAC9C,MAAM,MAAM,QAAQ,GAAG,OAAO,GAAG,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"GenAICoach.types.d.ts","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAICoach.types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GenAICoach.types.js","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAICoach.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Dispatch, Ref, SetStateAction } from 'react';\n\nimport type {\n BaseProps,\n MenuProps,\n OmitStrict,\n ProgressProps,\n RequireAtLeastOne,\n TestIdProp,\n WithAttributes,\n ActionsProps,\n FileItemProps,\n FileDisplayProps,\n LightboxProps\n} from '@pega/cosmos-react-core';\nimport type { MDMap } from '@pega/cosmos-react-rte';\n\nexport type State = 'minimized' | 'maximized';\nexport type Reaction = 'liked' | 'disliked';\n\nexport type Variant =\n | {\n placement: 'utilities';\n state: State;\n onStateChange: (state: State) => void;\n setGenAIHeight?: Dispatch<SetStateAction<number | undefined>>;\n }\n | { placement: 'fullpage' }\n | { placement: 'dialog'; onClose: () => void };\n\nexport interface MessageProps {\n id: string;\n message: string;\n announceInteraction?: boolean;\n attachments?: FileDisplayProps[];\n /**\n * Whether the message is a suggestion from the composer\n * @default false\n */\n fromComposer?: boolean;\n /** Ref forwarded to the wrapping element. */\n ref?: Ref<HTMLLIElement>;\n}\n\nexport type InitialSuggestedMessageProps = Pick<GenAICoachProps, 'onSend'> &\n BaseProps &\n TestIdProp &\n MessageProps;\n\nexport interface UserMessageProps extends BaseProps, TestIdProp, MessageProps {\n from: 'user';\n}\n\nexport type ToolParameters = {\n id: string;\n label: string;\n type: 'text' | 'number' | 'boolean';\n value: string;\n};\n\nexport interface Tool {\n id: string;\n name: string;\n message: string;\n decision: 'accept' | 'modify' | 'reject';\n parameters: ToolParameters[];\n}\n\nexport interface ToolDetailsProps {\n isToolConfirmation: true;\n tools: Tool[];\n onSubmit?: (tools: Tool[]) => void;\n onCancel?: () => void;\n toolsConfirmed: boolean;\n}\n\nexport type CoachMessageProps = RequireAtLeastOne<\n Partial<Pick<GenAICoachProps, 'onSend'>> &\n BaseProps &\n TestIdProp &\n Pick<MessageProps, 'id' | 'announceInteraction' | 'ref'> &\n (\n | ToolDetailsProps\n | {\n isToolConfirmation?: false;\n tools?: never;\n onSubmit?: never;\n onCancel?: never;\n toolsConfirmed?: never;\n }\n ) & {\n from: 'coach';\n coachName: string;\n suggestions?: MessageProps[];\n loading?: boolean;\n enableStreaming?: boolean;\n allChunksReceived?: boolean;\n error?: string;\n message?: MessageProps['message'];\n markdownMap?: MDMap;\n onStreamingUpdate?: (isStreamingDone: boolean) => void;\n feedback?: {\n reaction: Reaction | undefined;\n onReaction: (id: MessageProps['id'], reaction: Reaction) => void;\n onFeedbackComplete: (id: MessageProps['id'], comment?: string) => void;\n };\n onAnimationCursorUpdate?: (animatedTillCursor: number) => void;\n animationInitialCursorPos?: number;\n },\n 'loading' | 'message' | 'error'\n>;\n\nexport interface SystemMessageProps\n extends TestIdProp,\n Pick<MessageProps, 'id' | 'message' | 'ref' | 'announceInteraction'> {\n from: 'system';\n loading?: boolean;\n}\n\nexport type GenAIMessageProps = UserMessageProps | CoachMessageProps | SystemMessageProps;\n\nexport interface ConversationHistoryProps extends TestIdProp {\n /** List of History items. */\n data: {\n id: string;\n section: string;\n conversations: {\n id: string;\n title: string;\n }[];\n }[];\n /** Click event for items within the list. */\n onItemClick?: (conversationId: string) => void;\n /** List loading state. */\n loading?: boolean;\n /** Called at scroll trigger to load more items. */\n loadMore?: () => void;\n /** True if History view is rendered in Full page view. */\n inFullPage?: boolean;\n /** Callback triggered when closing the history view. */\n onDismiss: () => void;\n /** Id of the selected item. */\n selectedItemId?: string;\n /** Set if there is an error in retreiving the data. */\n error?: string;\n /** Ref forwarded to the wrapping element. */\n ref?: Ref<HTMLUListElement>;\n}\n\nexport type SendMessageProps = OmitStrict<MessageProps, 'attachments'> & {\n attachmentIds?: string[];\n tools?: Tool[];\n};\n\nexport type GenAICoachProps = WithAttributes<\n 'div',\n TestIdProp & {\n /** Chat loading indicator */\n loading?: boolean | ProgressProps['message'];\n /** Set if there is an error in retreiving the data */\n error?: string;\n /** Coaches available in the chat header */\n coachOptions: MenuProps['items'];\n /** Handle the coach selections */\n onCoachChange: (id: MenuProps['id']) => void;\n /** Suggested messages to start the conversation */\n initialSuggestedMessages?: MessageProps[];\n /** Additional suggestions presented at the bottom of the chat window */\n suggestions?: MenuProps['items'];\n /** Send prompts */\n onSend: (message: SendMessageProps) => void;\n\n stopProcess?: () => void;\n /** Messages to be shown in the chatting window. */\n messages?: GenAIMessageProps[];\n /** Placement of the component */\n variant: Variant;\n /** From landing page utilities */\n isInLandingPageUtilities?: boolean;\n /** callback when component is mounted */\n onOpen?: () => void;\n /**\n * User would be guided with selective prompts to enable interaction with coach.\n * @default false\n */\n guidedMode?: boolean;\n /** Pass an array of Action objects to show Action button. */\n actions?: ActionsProps;\n /** Pass data to show history view. */\n conversationHistory?: ConversationHistoryProps;\n /** Callback triggered when the layout component changes. */\n onLayoutChange?: (inFullPage: boolean) => void;\n /** Callback when attachment icon is clicked */\n onAddAttachment?: (files: File[]) => void;\n /** Attachments list */\n attachments?: FileItemProps[];\n /** Error in attachments */\n attachmentsError?: string;\n /** Configuration for the Lightbox component that handles preview of media attachments and files */\n lightboxPreviewProps?: LightboxProps;\n /** Enable full screen */\n allowFullScreen?: boolean;\n /** Enable voice to text */\n voiceToTextProps?: {\n enableDictation: boolean;\n langCode: string;\n };\n }\n>;\n\nexport interface UtilitiesGenAICoachProps extends OmitStrict<GenAICoachProps, 'variant'> {\n onClose?: () => void;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"GenAICoach.types.js","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAICoach.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Dispatch, Ref, SetStateAction } from 'react';\n\nimport type {\n BaseProps,\n MenuProps,\n OmitStrict,\n ProgressProps,\n RequireAtLeastOne,\n TestIdProp,\n WithAttributes,\n ActionsProps,\n FileItemProps,\n FileDisplayProps,\n LightboxProps\n} from '@pega/cosmos-react-core';\nimport type { MDMap } from '@pega/cosmos-react-rte';\n\nexport type State = 'minimized' | 'maximized';\nexport type Reaction = 'liked' | 'disliked';\nexport type FeedbackPrompt = 'liked' | 'disliked' | 'both';\n\nexport type Variant =\n | {\n placement: 'utilities';\n state: State;\n onStateChange: (state: State) => void;\n setGenAIHeight?: Dispatch<SetStateAction<number | undefined>>;\n }\n | { placement: 'fullpage' }\n | { placement: 'dialog'; onClose: () => void };\n\nexport interface MessageProps {\n id: string;\n message: string;\n announceInteraction?: boolean;\n attachments?: FileDisplayProps[];\n /**\n * Whether the message is a suggestion from the composer\n * @default false\n */\n fromComposer?: boolean;\n /** Ref forwarded to the wrapping element. */\n ref?: Ref<HTMLLIElement>;\n}\n\nexport type InitialSuggestedMessageProps = Pick<GenAICoachProps, 'onSend'> &\n BaseProps &\n TestIdProp &\n MessageProps;\n\nexport interface UserMessageProps extends BaseProps, TestIdProp, MessageProps {\n from: 'user';\n}\n\nexport type ToolParameters = {\n id: string;\n label: string;\n type: 'text' | 'number' | 'boolean';\n value: string;\n};\n\nexport interface Tool {\n id: string;\n name: string;\n message: string;\n decision: 'accept' | 'modify' | 'reject';\n parameters: ToolParameters[];\n}\n\nexport interface ToolDetailsProps {\n isToolConfirmation: true;\n tools: Tool[];\n onSubmit?: (tools: Tool[]) => void;\n onCancel?: () => void;\n toolsConfirmed: boolean;\n}\n\nexport type CoachMessageProps = RequireAtLeastOne<\n Partial<Pick<GenAICoachProps, 'onSend'>> &\n BaseProps &\n TestIdProp &\n Pick<MessageProps, 'id' | 'announceInteraction' | 'ref'> &\n (\n | ToolDetailsProps\n | {\n isToolConfirmation?: false;\n tools?: never;\n onSubmit?: never;\n onCancel?: never;\n toolsConfirmed?: never;\n }\n ) & {\n from: 'coach';\n coachName: string;\n suggestions?: MessageProps[];\n loading?: boolean;\n enableStreaming?: boolean;\n allChunksReceived?: boolean;\n error?: string;\n message?: MessageProps['message'];\n messageActions?: ActionsProps;\n markdownMap?: MDMap;\n onStreamingUpdate?: (isStreamingDone: boolean) => void;\n feedback?: {\n reaction: Reaction | undefined;\n feedbackText?: string;\n onReaction: (id: MessageProps['id'], reaction: Reaction) => void;\n onFeedbackComplete: (id: MessageProps['id'], comment?: string) => void;\n promptFeedbackOn?: FeedbackPrompt;\n allowFeedbackResubmission?: boolean;\n };\n onAnimationCursorUpdate?: (animatedTillCursor: number) => void;\n animationInitialCursorPos?: number;\n },\n 'loading' | 'message' | 'error'\n>;\n\nexport interface SystemMessageProps\n extends TestIdProp,\n Pick<MessageProps, 'id' | 'message' | 'ref' | 'announceInteraction'> {\n from: 'system';\n loading?: boolean;\n}\n\nexport type GenAIMessageProps = UserMessageProps | CoachMessageProps | SystemMessageProps;\n\nexport interface ConversationHistoryProps extends TestIdProp {\n /** List of History items. */\n data: {\n id: string;\n section: string;\n conversations: {\n id: string;\n title: string;\n }[];\n }[];\n /** Click event for items within the list. */\n onItemClick?: (conversationId: string) => void;\n /** List loading state. */\n loading?: boolean;\n /** Called at scroll trigger to load more items. */\n loadMore?: () => void;\n /** True if History view is rendered in Full page view. */\n inFullPage?: boolean;\n /** Callback triggered when closing the history view. */\n onDismiss: () => void;\n /** Id of the selected item. */\n selectedItemId?: string;\n /** Set if there is an error in retreiving the data. */\n error?: string;\n /** Ref forwarded to the wrapping element. */\n ref?: Ref<HTMLUListElement>;\n}\n\nexport type SendMessageProps = OmitStrict<MessageProps, 'attachments'> & {\n attachmentIds?: string[];\n tools?: Tool[];\n};\n\nexport type GenAICoachProps = WithAttributes<\n 'div',\n TestIdProp & {\n /** Chat loading indicator */\n loading?: boolean | ProgressProps['message'];\n /** Set if there is an error in retreiving the data */\n error?: string;\n /** Coaches available in the chat header */\n coachOptions: MenuProps['items'];\n /** Handle the coach selections */\n onCoachChange: (id: MenuProps['id']) => void;\n /** Suggested messages to start the conversation */\n initialSuggestedMessages?: MessageProps[];\n /** Additional suggestions presented at the bottom of the chat window */\n suggestions?: MenuProps['items'];\n /** Send prompts */\n onSend: (message: SendMessageProps) => void;\n\n stopProcess?: () => void;\n /** Messages to be shown in the chatting window. */\n messages?: GenAIMessageProps[];\n /** Placement of the component */\n variant: Variant;\n /** From landing page utilities */\n isInLandingPageUtilities?: boolean;\n /** callback when component is mounted */\n onOpen?: () => void;\n /**\n * User would be guided with selective prompts to enable interaction with coach.\n * @default false\n */\n guidedMode?: boolean;\n /** Pass an array of Action objects to show Action button. */\n actions?: ActionsProps;\n /** Pass data to show history view. */\n conversationHistory?: ConversationHistoryProps;\n /** Callback triggered when the layout component changes. */\n onLayoutChange?: (inFullPage: boolean) => void;\n /** Callback when attachment icon is clicked */\n onAddAttachment?: (files: File[]) => void;\n /** Attachments list */\n attachments?: FileItemProps[];\n /** Error in attachments */\n attachmentsError?: string;\n /** Configuration for the Lightbox component that handles preview of media attachments and files */\n lightboxPreviewProps?: LightboxProps;\n /** Enable full screen */\n allowFullScreen?: boolean;\n /** Enable voice to text */\n voiceToTextProps?: {\n enableDictation: boolean;\n langCode: string;\n };\n /** Show welcome state */\n showSalutation?: boolean;\n /** Salutation message */\n salutation?: string;\n }\n>;\n\nexport interface MessageFeedbackProps {\n messageId: MessageProps['id'];\n feedback: CoachMessageProps['feedback'];\n}\n\nexport interface UtilitiesGenAICoachProps extends OmitStrict<GenAICoachProps, 'variant'> {\n onClose?: () => void;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GenAIMessage.d.ts","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAIMessage.tsx"],"names":[],"mappings":"AAGA,OAAO,
|
|
1
|
+
{"version":3,"file":"GenAIMessage.d.ts","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAIMessage.tsx"],"names":[],"mappings":"AAGA,OAAO,EAUL,KAAK,+BAA+B,EAErC,MAAM,yBAAyB,CAAC;AAKjC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAmB5D,KAAK,qBAAqB,GAAG;IAC3B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC,CAAC;AAEF,uBAAuB;AACvB,eAAO,MAAM,gBAAgB,4DAE3B,CAAC;AAEH,QAAA,MAAM,YAAY,EAAE,+BAA+B,CAAC,iBAAiB,CA4NpE,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -1,19 +1,16 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { createContext, forwardRef, useEffect, useMemo
|
|
3
|
-
import { Button, Flex,
|
|
2
|
+
import { createContext, forwardRef, useEffect, useMemo } from 'react';
|
|
3
|
+
import { Button, Flex, Progress, registerIcon, useI18n, useTheme, useTestIds, ErrorState, markdownToPlainText, Actions } from '@pega/cosmos-react-core';
|
|
4
4
|
import * as polarisSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/polaris-solid.icon';
|
|
5
|
-
import * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';
|
|
6
|
-
import * as thumbsUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up.icon';
|
|
7
|
-
import * as thumbsDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down-solid.icon';
|
|
8
|
-
import * as thumbsDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down.icon';
|
|
9
5
|
import { RichTextViewer } from '@pega/cosmos-react-rte';
|
|
10
6
|
import { useAnimatedText } from '@pega/cosmos-react-core';
|
|
11
|
-
import { StyledAttachmentsList, StyledGenAIAvatar, StyledMessage, StyledSuggestion, StyledSuggestionsContainer, StyledSystemMessage, StyledUserMessage } from './GenAICoach.styles';
|
|
7
|
+
import { StyledActionsContainer, StyledAttachmentsList, StyledGenAIAvatar, StyledMessage, StyledSuggestion, StyledSuggestionsContainer, StyledSystemMessage, StyledUserMessage } from './GenAICoach.styles';
|
|
12
8
|
import { getGenAICoachTestIds } from './GenAICoach.test-ids';
|
|
13
9
|
import { isCoachMessage, isUserMessage } from './GenAICoach.utils';
|
|
14
10
|
import GenAIMessageProgress from './GenAIMessageProgress';
|
|
15
11
|
import ToolConfirmationMessage from './ToolConfirmationMessage';
|
|
16
|
-
|
|
12
|
+
import GenAIMessageFeedbackButtons from './GenAIMessageFeedback';
|
|
13
|
+
registerIcon(polarisSolidIcon);
|
|
17
14
|
/** Metadata Context */
|
|
18
15
|
export const StreamingContext = createContext({
|
|
19
16
|
isStreamingMessage: false
|
|
@@ -22,10 +19,6 @@ const GenAIMessage = forwardRef(function GenAIMessage(props, ref) {
|
|
|
22
19
|
const testIds = useTestIds(props.testId, getGenAICoachTestIds);
|
|
23
20
|
const theme = useTheme();
|
|
24
21
|
const t = useI18n();
|
|
25
|
-
const [wrapperEl, setWrapperEl] = useElement(null);
|
|
26
|
-
const [feedbackVal, setFeedbackVal] = useState('');
|
|
27
|
-
const [showDialog, setShowDialog] = useState(false);
|
|
28
|
-
const focusOnInteractionRef = useRef(false);
|
|
29
22
|
const { message, announceInteraction, ...restProps } = props;
|
|
30
23
|
const plainTextMessage = markdownToPlainText(message ?? '');
|
|
31
24
|
let ariaLabel = plainTextMessage;
|
|
@@ -51,18 +44,12 @@ const GenAIMessage = forwardRef(function GenAIMessage(props, ref) {
|
|
|
51
44
|
props.onStreamingUpdate(!!allChunksReceived && isStreamingDone);
|
|
52
45
|
}
|
|
53
46
|
}, [enableStreaming, isStreamingDone, allChunksReceived]);
|
|
54
|
-
useElementFocus(wrapperEl, { shouldFocus: !showDialog && focusOnInteractionRef.current });
|
|
55
|
-
useEffect(() => {
|
|
56
|
-
if (!showDialog && focusOnInteractionRef.current) {
|
|
57
|
-
focusOnInteractionRef.current = false;
|
|
58
|
-
}
|
|
59
|
-
}, [showDialog]);
|
|
60
47
|
const streamingContext = useMemo(() => {
|
|
61
48
|
return { isStreamingMessage, isStreamingInProgress: isCoachMessage(props) && props.loading };
|
|
62
49
|
}, [isStreamingMessage, props]);
|
|
63
50
|
if (isCoachMessage(props)) {
|
|
64
|
-
const { id: messageId, coachName, suggestions, onSend, loading, error, feedback, markdownMap } = props;
|
|
65
|
-
const { reaction
|
|
51
|
+
const { id: messageId, coachName, suggestions, onSend, loading, error, feedback, markdownMap, messageActions } = props;
|
|
52
|
+
const { reaction } = feedback ?? {};
|
|
66
53
|
let selectedFeedbackResponse;
|
|
67
54
|
let feedbackAriaLabel = t('sender_replied_message', [coachName, plainTextMessage ?? '']);
|
|
68
55
|
if (feedback && reaction) {
|
|
@@ -79,29 +66,7 @@ const GenAIMessage = forwardRef(function GenAIMessage(props, ref) {
|
|
|
79
66
|
ariaLabel = `${ariaLabel} ${t('interaction_message')}`;
|
|
80
67
|
}
|
|
81
68
|
const streamingContent = isStreamingMessage && (_jsx(_Fragment, { children: message ? (_jsxs(_Fragment, { children: [_jsx(StreamingContext.Provider, { value: streamingContext, children: _jsx(RichTextViewer, { content: isStreamingMessage ? streamingMessage : message, type: 'markdown', markdownMap: markdownMap }) }), loading && _jsx(Progress, { variant: 'ellipsis', placement: 'inline' })] })) : (loading && _jsx(GenAIMessageProgress, {})) }));
|
|
82
|
-
return (_jsx(Flex, { as: 'li', "data-testid": testIds.coachMessage, ...restProps, container: { direction: 'row', pad: [1, 0], gap: 0.5 }, type: 'message', "aria-label": ariaLabel, ref: ref, children: _jsxs(_Fragment, { children: [_jsx(StyledGenAIAvatar, { name: coachName, icon: 'polaris-solid', color: theme.base.palette.ai, shape: 'circle', size: 'm' }), props.isToolConfirmation ? (_jsx(ToolConfirmationMessage, { ...props })) : (_jsxs(StyledMessage, { children: [streamingContent, loading || error ? (_jsxs(_Fragment, { children: [loading && !isStreamingMessage && _jsx(GenAIMessageProgress, {}), error && _jsx(ErrorState, { message: error })] })) : (_jsxs(_Fragment, { children: [!isStreamingMessage && message && (_jsx(RichTextViewer, { content: message, type: 'markdown', markdownMap: markdownMap })), feedback && (
|
|
83
|
-
wrapperEl && (_jsx(FormDialog, { target: wrapperEl, heading: t('share_feedback'), onCancel: () => {
|
|
84
|
-
focusOnInteractionRef.current = true;
|
|
85
|
-
setShowDialog(false);
|
|
86
|
-
onFeedbackComplete(messageId);
|
|
87
|
-
}, onSubmit: () => {
|
|
88
|
-
focusOnInteractionRef.current = true;
|
|
89
|
-
setShowDialog(false);
|
|
90
|
-
onFeedbackComplete(messageId, feedbackVal);
|
|
91
|
-
}, onKeyDown: e => e.stopPropagation(), children: _jsx(TextArea, { value: feedbackVal, onChange: e => setFeedbackVal(e.target.value), onKeyDown: (e) => {
|
|
92
|
-
if (e.key === 'Enter' && !e.shiftKey) {
|
|
93
|
-
e.preventDefault();
|
|
94
|
-
focusOnInteractionRef.current = true;
|
|
95
|
-
setShowDialog(false);
|
|
96
|
-
onFeedbackComplete(messageId, feedbackVal);
|
|
97
|
-
}
|
|
98
|
-
}, autoResize: false }) }))) : (_jsx(Tooltip, { target: wrapperEl, describeTarget: false, children: reaction === 'liked' ? t('good_response') : t('bad_response') }))] })) : (_jsxs(_Fragment, { children: [_jsx(Button, { label: t('good_response'), variant: 'simple', icon: true, compact: true, onClick: () => {
|
|
99
|
-
onReaction?.(messageId, 'liked');
|
|
100
|
-
focusOnInteractionRef.current = true;
|
|
101
|
-
}, children: _jsx(Icon, { name: 'thumbs-up' }) }), _jsx(Button, { label: t('bad_response'), variant: 'simple', icon: true, compact: true, onClick: () => {
|
|
102
|
-
setShowDialog(true);
|
|
103
|
-
onReaction?.(messageId, 'disliked');
|
|
104
|
-
}, children: _jsx(Icon, { name: 'thumbs-down' }) })] })) })), suggestions && (_jsx(Flex, { as: StyledSuggestionsContainer, container: { direction: 'column', gap: 1 }, children: suggestions.map(({ id, message: prompt }) => {
|
|
69
|
+
return (_jsx(Flex, { as: 'li', "data-testid": testIds.coachMessage, ...restProps, container: { direction: 'row', pad: [1, 0], gap: 0.5 }, type: 'message', "aria-label": ariaLabel, ref: ref, children: _jsxs(_Fragment, { children: [_jsx(StyledGenAIAvatar, { name: coachName, icon: 'polaris-solid', color: theme.base.palette.ai, shape: 'circle', size: 'm' }), props.isToolConfirmation ? (_jsx(ToolConfirmationMessage, { ...props })) : (_jsxs(StyledMessage, { children: [streamingContent, loading || error ? (_jsxs(_Fragment, { children: [loading && !isStreamingMessage && _jsx(GenAIMessageProgress, {}), error && _jsx(ErrorState, { message: error })] })) : (_jsxs(_Fragment, { children: [!isStreamingMessage && message && (_jsx(RichTextViewer, { content: message, type: 'markdown', markdownMap: markdownMap })), (feedback || messageActions) && (_jsxs(Flex, { container: { direction: 'row', gap: 1, pad: [1, undefined] }, as: StyledActionsContainer, children: [feedback && (_jsx(GenAIMessageFeedbackButtons, { messageId: messageId, feedback: feedback })), messageActions && _jsx(Actions, { ...messageActions })] })), suggestions && (_jsx(Flex, { as: StyledSuggestionsContainer, container: { direction: 'column', gap: 1 }, children: suggestions.map(({ id, message: prompt }) => {
|
|
105
70
|
return (_jsx(Button, { as: StyledSuggestion, onClick: onSend ? () => onSend({ id, message: prompt }) : undefined, children: prompt }, id));
|
|
106
71
|
}) }))] }))] }))] }) }));
|
|
107
72
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GenAIMessage.js","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAIMessage.tsx"],"names":[],"mappings":"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","sourcesContent":["import { createContext, forwardRef, useEffect, useMemo, useRef, useState } from 'react';\nimport type { KeyboardEvent, PropsWithoutRef } from 'react';\n\nimport {\n Button,\n Flex,\n Icon,\n Progress,\n registerIcon,\n useI18n,\n useTheme,\n useTestIds,\n ErrorState,\n useElement,\n Tooltip,\n TextArea,\n FormDialog,\n useElementFocus,\n markdownToPlainText,\n type ForwardRefForwardPropsComponent\n} from '@pega/cosmos-react-core';\nimport * as polarisSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/polaris-solid.icon';\nimport * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';\nimport * as thumbsUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up.icon';\nimport * as thumbsDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down-solid.icon';\nimport * as thumbsDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down.icon';\nimport { RichTextViewer } from '@pega/cosmos-react-rte';\nimport { useAnimatedText } from '@pega/cosmos-react-core';\n\nimport type { GenAIMessageProps } from './GenAICoach.types';\nimport {\n StyledAttachmentsList,\n StyledGenAIAvatar,\n StyledMessage,\n StyledSuggestion,\n StyledSuggestionsContainer,\n StyledSystemMessage,\n StyledUserMessage\n} from './GenAICoach.styles';\nimport { getGenAICoachTestIds } from './GenAICoach.test-ids';\nimport { isCoachMessage, isUserMessage } from './GenAICoach.utils';\nimport GenAIMessageProgress from './GenAIMessageProgress';\nimport ToolConfirmationMessage from './ToolConfirmationMessage';\n\nregisterIcon(\n polarisSolidIcon,\n thumbsUpSolidIcon,\n thumbsUpIcon,\n thumbsDownSolidIcon,\n thumbsDownIcon\n);\n\ntype StreamingContextProps = {\n isStreamingMessage?: boolean;\n isStreamingInProgress?: boolean;\n};\n\n/** Metadata Context */\nexport const StreamingContext = createContext<StreamingContextProps | undefined>({\n isStreamingMessage: false\n});\n\nconst GenAIMessage: ForwardRefForwardPropsComponent<GenAIMessageProps> = forwardRef(\n function GenAIMessage(props: PropsWithoutRef<GenAIMessageProps>, ref: GenAIMessageProps['ref']) {\n const testIds = useTestIds(props.testId, getGenAICoachTestIds);\n const theme = useTheme();\n const t = useI18n();\n const [wrapperEl, setWrapperEl] = useElement<HTMLDivElement>(null);\n const [feedbackVal, setFeedbackVal] = useState('');\n const [showDialog, setShowDialog] = useState(false);\n const focusOnInteractionRef = useRef(false);\n\n const { message, announceInteraction, ...restProps } = props;\n const plainTextMessage = markdownToPlainText(message ?? '');\n let ariaLabel = plainTextMessage;\n\n const isStreamingMessage = isCoachMessage(props) && props.enableStreaming;\n const allChunksReceived = isCoachMessage(props) && props.allChunksReceived;\n const enableStreaming = !!isStreamingMessage && !allChunksReceived;\n\n const {\n text: streamingMessage,\n isAnimationDone: isStreamingDone,\n animatedTillCursor\n } = useAnimatedText({\n text: message ?? '',\n allContentReceived: allChunksReceived === undefined ? true : allChunksReceived,\n enabled: enableStreaming,\n tokenizeMarkdown: true,\n cursorStartIndex:\n isCoachMessage(props) && props.animationInitialCursorPos\n ? props.animationInitialCursorPos\n : undefined\n });\n\n useEffect(() => {\n if (isCoachMessage(props) && props.onAnimationCursorUpdate) {\n props.onAnimationCursorUpdate(animatedTillCursor);\n }\n }, [animatedTillCursor]);\n\n useEffect(() => {\n if (isStreamingMessage && props.onStreamingUpdate) {\n props.onStreamingUpdate(!!allChunksReceived && isStreamingDone);\n }\n }, [enableStreaming, isStreamingDone, allChunksReceived]);\n\n useElementFocus(wrapperEl, { shouldFocus: !showDialog && focusOnInteractionRef.current });\n\n useEffect(() => {\n if (!showDialog && focusOnInteractionRef.current) {\n focusOnInteractionRef.current = false;\n }\n }, [showDialog]);\n\n const streamingContext: StreamingContextProps = useMemo(() => {\n return { isStreamingMessage, isStreamingInProgress: isCoachMessage(props) && props.loading };\n }, [isStreamingMessage, props]);\n\n if (isCoachMessage(props)) {\n const {\n id: messageId,\n coachName,\n suggestions,\n onSend,\n loading,\n error,\n feedback,\n markdownMap\n } = props;\n\n const { reaction, onReaction, onFeedbackComplete } = feedback ?? {};\n\n let selectedFeedbackResponse;\n\n let feedbackAriaLabel = t('sender_replied_message', [coachName, plainTextMessage ?? '']);\n\n if (feedback && reaction) {\n selectedFeedbackResponse = t('selected_noun', [\n reaction === 'liked' ? t('good_response') : t('bad_response')\n ]);\n\n feedbackAriaLabel = `${feedbackAriaLabel} ${selectedFeedbackResponse}`;\n }\n\n ariaLabel =\n suggestions && suggestions.length > 0\n ? `${feedbackAriaLabel} ${t('suggestions_in_message', [suggestions.length])}`\n : feedbackAriaLabel;\n\n if (announceInteraction) {\n ariaLabel = `${ariaLabel} ${t('interaction_message')}`;\n }\n\n const streamingContent = isStreamingMessage && (\n <>\n {message ? (\n <>\n <StreamingContext.Provider value={streamingContext}>\n <RichTextViewer\n content={isStreamingMessage ? streamingMessage : message}\n type='markdown'\n markdownMap={markdownMap}\n />\n </StreamingContext.Provider>\n\n {loading && <Progress variant='ellipsis' placement='inline' />}\n </>\n ) : (\n loading && <GenAIMessageProgress />\n )}\n </>\n );\n\n return (\n <Flex\n as='li'\n data-testid={testIds.coachMessage}\n {...restProps}\n container={{ direction: 'row', pad: [1, 0], gap: 0.5 }}\n type='message'\n aria-label={ariaLabel}\n ref={ref}\n >\n <>\n <StyledGenAIAvatar\n name={coachName}\n icon='polaris-solid'\n color={theme.base.palette.ai}\n shape='circle'\n size='m'\n />\n {props.isToolConfirmation ? (\n <ToolConfirmationMessage {...props} />\n ) : (\n <StyledMessage>\n {/* Streaming loader and content */}\n {streamingContent}\n {loading || error ? (\n <>\n {loading && !isStreamingMessage && <GenAIMessageProgress />}\n {error && <ErrorState message={error} />}\n </>\n ) : (\n <>\n {/* Non streaming content */}\n {!isStreamingMessage && message && (\n <RichTextViewer content={message} type='markdown' markdownMap={markdownMap} />\n )}\n {feedback && (\n <Flex container={{ pad: [0.5, undefined] }}>\n {reaction ? (\n <>\n <Flex\n container={{ pad: 0.5 }}\n aria-label={selectedFeedbackResponse}\n ref={setWrapperEl}\n tabIndex={-1}\n >\n <Icon\n name={\n reaction === 'liked' ? 'thumbs-up-solid' : 'thumbs-down-solid'\n }\n />\n </Flex>\n {showDialog ? (\n onFeedbackComplete &&\n wrapperEl && (\n <FormDialog\n target={wrapperEl}\n heading={t('share_feedback')}\n onCancel={() => {\n focusOnInteractionRef.current = true;\n setShowDialog(false);\n onFeedbackComplete(messageId);\n }}\n onSubmit={() => {\n focusOnInteractionRef.current = true;\n setShowDialog(false);\n onFeedbackComplete(messageId, feedbackVal);\n }}\n onKeyDown={e => e.stopPropagation()}\n >\n <TextArea\n value={feedbackVal}\n onChange={e => setFeedbackVal(e.target.value)}\n onKeyDown={(e: KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n e.preventDefault();\n focusOnInteractionRef.current = true;\n setShowDialog(false);\n onFeedbackComplete(messageId, feedbackVal);\n }\n }}\n autoResize={false}\n />\n </FormDialog>\n )\n ) : (\n <Tooltip target={wrapperEl} describeTarget={false}>\n {reaction === 'liked' ? t('good_response') : t('bad_response')}\n </Tooltip>\n )}\n </>\n ) : (\n <>\n <Button\n label={t('good_response')}\n variant='simple'\n icon\n compact\n onClick={() => {\n onReaction?.(messageId, 'liked');\n focusOnInteractionRef.current = true;\n }}\n >\n <Icon name='thumbs-up' />\n </Button>\n\n <Button\n label={t('bad_response')}\n variant='simple'\n icon\n compact\n onClick={() => {\n setShowDialog(true);\n onReaction?.(messageId, 'disliked');\n }}\n >\n <Icon name='thumbs-down' />\n </Button>\n </>\n )}\n </Flex>\n )}\n {suggestions && (\n <Flex\n as={StyledSuggestionsContainer}\n container={{ direction: 'column', gap: 1 }}\n >\n {suggestions.map(({ id, message: prompt }) => {\n return (\n <Button\n as={StyledSuggestion}\n onClick={onSend ? () => onSend({ id, message: prompt }) : undefined}\n key={id}\n >\n {prompt}\n </Button>\n );\n })}\n </Flex>\n )}\n </>\n )}\n </StyledMessage>\n )}\n </>\n </Flex>\n );\n }\n\n if (isUserMessage(props)) {\n if (plainTextMessage) {\n ariaLabel = t('you_asked', [plainTextMessage]);\n }\n\n if (announceInteraction) {\n ariaLabel = `${ariaLabel} ${t('interaction_message')}`;\n }\n\n return (\n <StyledUserMessage\n as={StyledUserMessage}\n data-testid={testIds.userMessage}\n {...restProps}\n type='message'\n aria-label={ariaLabel}\n ref={ref}\n >\n {props.attachments && props.attachments.length > 0 && (\n <StyledAttachmentsList type='display' items={props.attachments} />\n )}\n {message && <RichTextViewer content={message} type='markdown' />}\n </StyledUserMessage>\n );\n }\n\n if (props.from === 'system') {\n return (\n <Flex\n container={{ justify: 'center' }}\n as={StyledSystemMessage}\n data-testid={testIds.userMessage}\n aria-label={ariaLabel}\n ref={ref}\n >\n {message}\n </Flex>\n );\n }\n\n return null;\n }\n);\n\nexport default GenAIMessage;\n"]}
|
|
1
|
+
{"version":3,"file":"GenAIMessage.js","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAIMessage.tsx"],"names":[],"mappings":"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","sourcesContent":["import { createContext, forwardRef, useEffect, useMemo } from 'react';\nimport type { PropsWithoutRef } from 'react';\n\nimport {\n Button,\n Flex,\n Progress,\n registerIcon,\n useI18n,\n useTheme,\n useTestIds,\n ErrorState,\n markdownToPlainText,\n type ForwardRefForwardPropsComponent,\n Actions\n} from '@pega/cosmos-react-core';\nimport * as polarisSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/polaris-solid.icon';\nimport { RichTextViewer } from '@pega/cosmos-react-rte';\nimport { useAnimatedText } from '@pega/cosmos-react-core';\n\nimport type { GenAIMessageProps } from './GenAICoach.types';\nimport {\n StyledActionsContainer,\n StyledAttachmentsList,\n StyledGenAIAvatar,\n StyledMessage,\n StyledSuggestion,\n StyledSuggestionsContainer,\n StyledSystemMessage,\n StyledUserMessage\n} from './GenAICoach.styles';\nimport { getGenAICoachTestIds } from './GenAICoach.test-ids';\nimport { isCoachMessage, isUserMessage } from './GenAICoach.utils';\nimport GenAIMessageProgress from './GenAIMessageProgress';\nimport ToolConfirmationMessage from './ToolConfirmationMessage';\nimport GenAIMessageFeedbackButtons from './GenAIMessageFeedback';\n\nregisterIcon(polarisSolidIcon);\n\ntype StreamingContextProps = {\n isStreamingMessage?: boolean;\n isStreamingInProgress?: boolean;\n};\n\n/** Metadata Context */\nexport const StreamingContext = createContext<StreamingContextProps | undefined>({\n isStreamingMessage: false\n});\n\nconst GenAIMessage: ForwardRefForwardPropsComponent<GenAIMessageProps> = forwardRef(\n function GenAIMessage(props: PropsWithoutRef<GenAIMessageProps>, ref: GenAIMessageProps['ref']) {\n const testIds = useTestIds(props.testId, getGenAICoachTestIds);\n const theme = useTheme();\n const t = useI18n();\n\n const { message, announceInteraction, ...restProps } = props;\n const plainTextMessage = markdownToPlainText(message ?? '');\n let ariaLabel = plainTextMessage;\n\n const isStreamingMessage = isCoachMessage(props) && props.enableStreaming;\n const allChunksReceived = isCoachMessage(props) && props.allChunksReceived;\n const enableStreaming = !!isStreamingMessage && !allChunksReceived;\n\n const {\n text: streamingMessage,\n isAnimationDone: isStreamingDone,\n animatedTillCursor\n } = useAnimatedText({\n text: message ?? '',\n allContentReceived: allChunksReceived === undefined ? true : allChunksReceived,\n enabled: enableStreaming,\n tokenizeMarkdown: true,\n cursorStartIndex:\n isCoachMessage(props) && props.animationInitialCursorPos\n ? props.animationInitialCursorPos\n : undefined\n });\n\n useEffect(() => {\n if (isCoachMessage(props) && props.onAnimationCursorUpdate) {\n props.onAnimationCursorUpdate(animatedTillCursor);\n }\n }, [animatedTillCursor]);\n\n useEffect(() => {\n if (isStreamingMessage && props.onStreamingUpdate) {\n props.onStreamingUpdate(!!allChunksReceived && isStreamingDone);\n }\n }, [enableStreaming, isStreamingDone, allChunksReceived]);\n\n const streamingContext: StreamingContextProps = useMemo(() => {\n return { isStreamingMessage, isStreamingInProgress: isCoachMessage(props) && props.loading };\n }, [isStreamingMessage, props]);\n\n if (isCoachMessage(props)) {\n const {\n id: messageId,\n coachName,\n suggestions,\n onSend,\n loading,\n error,\n feedback,\n markdownMap,\n messageActions\n } = props;\n\n const { reaction } = feedback ?? {};\n\n let selectedFeedbackResponse;\n\n let feedbackAriaLabel = t('sender_replied_message', [coachName, plainTextMessage ?? '']);\n\n if (feedback && reaction) {\n selectedFeedbackResponse = t('selected_noun', [\n reaction === 'liked' ? t('good_response') : t('bad_response')\n ]);\n\n feedbackAriaLabel = `${feedbackAriaLabel} ${selectedFeedbackResponse}`;\n }\n\n ariaLabel =\n suggestions && suggestions.length > 0\n ? `${feedbackAriaLabel} ${t('suggestions_in_message', [suggestions.length])}`\n : feedbackAriaLabel;\n\n if (announceInteraction) {\n ariaLabel = `${ariaLabel} ${t('interaction_message')}`;\n }\n\n const streamingContent = isStreamingMessage && (\n <>\n {message ? (\n <>\n <StreamingContext.Provider value={streamingContext}>\n <RichTextViewer\n content={isStreamingMessage ? streamingMessage : message}\n type='markdown'\n markdownMap={markdownMap}\n />\n </StreamingContext.Provider>\n\n {loading && <Progress variant='ellipsis' placement='inline' />}\n </>\n ) : (\n loading && <GenAIMessageProgress />\n )}\n </>\n );\n\n return (\n <Flex\n as='li'\n data-testid={testIds.coachMessage}\n {...restProps}\n container={{ direction: 'row', pad: [1, 0], gap: 0.5 }}\n type='message'\n aria-label={ariaLabel}\n ref={ref}\n >\n <>\n <StyledGenAIAvatar\n name={coachName}\n icon='polaris-solid'\n color={theme.base.palette.ai}\n shape='circle'\n size='m'\n />\n {props.isToolConfirmation ? (\n <ToolConfirmationMessage {...props} />\n ) : (\n <StyledMessage>\n {/* Streaming loader and content */}\n {streamingContent}\n\n {loading || error ? (\n <>\n {loading && !isStreamingMessage && <GenAIMessageProgress />}\n {error && <ErrorState message={error} />}\n </>\n ) : (\n <>\n {/* Non streaming content */}\n {!isStreamingMessage && message && (\n <RichTextViewer content={message} type='markdown' markdownMap={markdownMap} />\n )}\n\n {(feedback || messageActions) && (\n <Flex\n container={{ direction: 'row', gap: 1, pad: [1, undefined] }}\n as={StyledActionsContainer}\n >\n {feedback && (\n <GenAIMessageFeedbackButtons messageId={messageId} feedback={feedback} />\n )}\n\n {messageActions && <Actions {...messageActions} />}\n </Flex>\n )}\n\n {suggestions && (\n <Flex\n as={StyledSuggestionsContainer}\n container={{ direction: 'column', gap: 1 }}\n >\n {suggestions.map(({ id, message: prompt }) => {\n return (\n <Button\n as={StyledSuggestion}\n onClick={onSend ? () => onSend({ id, message: prompt }) : undefined}\n key={id}\n >\n {prompt}\n </Button>\n );\n })}\n </Flex>\n )}\n </>\n )}\n </StyledMessage>\n )}\n </>\n </Flex>\n );\n }\n\n if (isUserMessage(props)) {\n if (plainTextMessage) {\n ariaLabel = t('you_asked', [plainTextMessage]);\n }\n\n if (announceInteraction) {\n ariaLabel = `${ariaLabel} ${t('interaction_message')}`;\n }\n\n return (\n <StyledUserMessage\n as={StyledUserMessage}\n data-testid={testIds.userMessage}\n {...restProps}\n type='message'\n aria-label={ariaLabel}\n ref={ref}\n >\n {props.attachments && props.attachments.length > 0 && (\n <StyledAttachmentsList type='display' items={props.attachments} />\n )}\n {message && <RichTextViewer content={message} type='markdown' />}\n </StyledUserMessage>\n );\n }\n\n if (props.from === 'system') {\n return (\n <Flex\n container={{ justify: 'center' }}\n as={StyledSystemMessage}\n data-testid={testIds.userMessage}\n aria-label={ariaLabel}\n ref={ref}\n >\n {message}\n </Flex>\n );\n }\n\n return null;\n }\n);\n\nexport default GenAIMessage;\n"]}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type { MessageFeedbackProps } from './GenAICoach.types';
|
|
2
|
+
declare const GenAIMessageFeedbackButtons: ({ messageId, feedback }: MessageFeedbackProps) => import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
export default GenAIMessageFeedbackButtons;
|
|
4
|
+
//# sourceMappingURL=GenAIMessageFeedback.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GenAIMessageFeedback.d.ts","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAIMessageFeedback.tsx"],"names":[],"mappings":"AAmBA,OAAO,KAAK,EAAE,oBAAoB,EAAY,MAAM,oBAAoB,CAAC;AAIzE,QAAA,MAAM,2BAA2B,GAAI,yBAAyB,oBAAoB,4CA+KjF,CAAC;AAEF,eAAe,2BAA2B,CAAC"}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback, useEffect, useRef, useState } from 'react';
|
|
3
|
+
import { Button, Flex, FormDialog, Icon, TextArea, Tooltip, registerIcon, useElement, useI18n } from '@pega/cosmos-react-core';
|
|
4
|
+
import * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';
|
|
5
|
+
import * as thumbsUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up.icon';
|
|
6
|
+
import * as thumbsDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down-solid.icon';
|
|
7
|
+
import * as thumbsDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down.icon';
|
|
8
|
+
registerIcon(thumbsUpSolidIcon, thumbsUpIcon, thumbsDownSolidIcon, thumbsDownIcon);
|
|
9
|
+
const GenAIMessageFeedbackButtons = ({ messageId, feedback }) => {
|
|
10
|
+
const { reaction, feedbackText = '', allowFeedbackResubmission = false, promptFeedbackOn = 'disliked', onReaction, onFeedbackComplete } = feedback ?? {};
|
|
11
|
+
const t = useI18n();
|
|
12
|
+
const [feedbackVal, setFeedbackVal] = useState(feedbackText);
|
|
13
|
+
const [showDialog, setShowDialog] = useState(false);
|
|
14
|
+
const likeButtonRef = useRef(null);
|
|
15
|
+
const dislikeButtonRef = useRef(null);
|
|
16
|
+
const shouldOpenDialogRef = useRef(false);
|
|
17
|
+
const [iconEl, seticonEl] = useElement();
|
|
18
|
+
const isLikeActive = reaction === 'liked';
|
|
19
|
+
const isDislikeActive = reaction === 'disliked';
|
|
20
|
+
const needsDialog = (reactionType) => {
|
|
21
|
+
switch (promptFeedbackOn) {
|
|
22
|
+
case 'disliked':
|
|
23
|
+
return reactionType === 'disliked';
|
|
24
|
+
case 'liked':
|
|
25
|
+
return reactionType === 'liked';
|
|
26
|
+
case 'both':
|
|
27
|
+
return true;
|
|
28
|
+
default:
|
|
29
|
+
return false;
|
|
30
|
+
}
|
|
31
|
+
};
|
|
32
|
+
const handleReactionClick = useCallback((reactionType) => {
|
|
33
|
+
if (reaction === reactionType && !allowFeedbackResubmission) {
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
onReaction?.(messageId, reactionType);
|
|
37
|
+
if (needsDialog(reactionType)) {
|
|
38
|
+
if (reaction !== reactionType) {
|
|
39
|
+
setFeedbackVal('');
|
|
40
|
+
}
|
|
41
|
+
else {
|
|
42
|
+
setFeedbackVal(feedbackText);
|
|
43
|
+
}
|
|
44
|
+
if (!allowFeedbackResubmission) {
|
|
45
|
+
shouldOpenDialogRef.current = true;
|
|
46
|
+
}
|
|
47
|
+
else {
|
|
48
|
+
setShowDialog(true);
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
}, [reaction, feedbackText, allowFeedbackResubmission, promptFeedbackOn, messageId, onReaction]);
|
|
52
|
+
const closeDialog = useCallback((comment) => {
|
|
53
|
+
setShowDialog(false);
|
|
54
|
+
shouldOpenDialogRef.current = false;
|
|
55
|
+
onFeedbackComplete?.(messageId, comment);
|
|
56
|
+
if (!allowFeedbackResubmission && iconEl) {
|
|
57
|
+
iconEl.focus();
|
|
58
|
+
}
|
|
59
|
+
}, [allowFeedbackResubmission, onFeedbackComplete, messageId, iconEl]);
|
|
60
|
+
const getDialogTarget = () => {
|
|
61
|
+
if (!allowFeedbackResubmission && iconEl) {
|
|
62
|
+
return iconEl;
|
|
63
|
+
}
|
|
64
|
+
return isLikeActive ? likeButtonRef.current : dislikeButtonRef.current;
|
|
65
|
+
};
|
|
66
|
+
useEffect(() => {
|
|
67
|
+
if (iconEl && shouldOpenDialogRef.current && !allowFeedbackResubmission) {
|
|
68
|
+
setShowDialog(true);
|
|
69
|
+
shouldOpenDialogRef.current = false;
|
|
70
|
+
}
|
|
71
|
+
}, [iconEl, allowFeedbackResubmission]);
|
|
72
|
+
useEffect(() => {
|
|
73
|
+
if (!showDialog && reaction && allowFeedbackResubmission) {
|
|
74
|
+
const reactionButton = reaction === 'liked' ? likeButtonRef.current : dislikeButtonRef.current;
|
|
75
|
+
reactionButton?.focus();
|
|
76
|
+
}
|
|
77
|
+
}, [showDialog, reaction, allowFeedbackResubmission]);
|
|
78
|
+
const dialogTarget = getDialogTarget();
|
|
79
|
+
const feedbackDialog = showDialog && dialogTarget && (_jsx(FormDialog, { target: dialogTarget, heading: t('share_feedback'), onCancel: () => closeDialog(), onSubmit: () => closeDialog(feedbackVal), onKeyDown: e => e.stopPropagation(), children: _jsx(TextArea, { value: feedbackVal, onChange: e => setFeedbackVal(e.target.value), onKeyDown: (e) => {
|
|
80
|
+
if (e.key === 'Enter' && !e.shiftKey) {
|
|
81
|
+
e.preventDefault();
|
|
82
|
+
closeDialog(feedbackVal);
|
|
83
|
+
}
|
|
84
|
+
}, autoResize: false }) }));
|
|
85
|
+
const shouldShowIcon = !allowFeedbackResubmission && reaction;
|
|
86
|
+
if (shouldShowIcon) {
|
|
87
|
+
return (_jsxs(Flex, { container: { pad: [0.5, undefined] }, ref: seticonEl, tabIndex: -1, "aria-label": t('selected_noun', [isLikeActive ? t('good_response') : t('bad_response')]), role: 'status', children: [_jsx(Icon, { name: isLikeActive ? 'thumbs-up-solid' : 'thumbs-down-solid' }), _jsx(Tooltip, { target: iconEl, describeTarget: false, children: isLikeActive ? t('good_response') : t('bad_response') }), feedbackDialog] }));
|
|
88
|
+
}
|
|
89
|
+
return (_jsxs(_Fragment, { children: [_jsxs(Flex, { container: { gap: 1 }, children: [_jsx(Button, { label: t('good_response'), variant: 'simple', icon: true, compact: true, ref: likeButtonRef, onClick: () => handleReactionClick('liked'), "aria-pressed": isLikeActive, children: _jsx(Icon, { name: isLikeActive ? 'thumbs-up-solid' : 'thumbs-up' }) }), _jsx(Button, { label: t('bad_response'), variant: 'simple', icon: true, compact: true, ref: dislikeButtonRef, onClick: () => handleReactionClick('disliked'), "aria-pressed": isDislikeActive, children: _jsx(Icon, { name: isDislikeActive ? 'thumbs-down-solid' : 'thumbs-down' }) })] }), feedbackDialog] }));
|
|
90
|
+
};
|
|
91
|
+
export default GenAIMessageFeedbackButtons;
|
|
92
|
+
//# sourceMappingURL=GenAIMessageFeedback.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GenAIMessageFeedback.js","sourceRoot":"","sources":["../../../src/components/GenAICoach/GenAIMessageFeedback.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\nimport type { KeyboardEvent } from 'react';\n\nimport {\n Button,\n Flex,\n FormDialog,\n Icon,\n TextArea,\n Tooltip,\n registerIcon,\n useElement,\n useI18n\n} from '@pega/cosmos-react-core';\nimport * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';\nimport * as thumbsUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up.icon';\nimport * as thumbsDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down-solid.icon';\nimport * as thumbsDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down.icon';\n\nimport type { MessageFeedbackProps, Reaction } from './GenAICoach.types';\n\nregisterIcon(thumbsUpSolidIcon, thumbsUpIcon, thumbsDownSolidIcon, thumbsDownIcon);\n\nconst GenAIMessageFeedbackButtons = ({ messageId, feedback }: MessageFeedbackProps) => {\n const {\n reaction,\n feedbackText = '',\n allowFeedbackResubmission = false,\n promptFeedbackOn = 'disliked',\n onReaction,\n onFeedbackComplete\n } = feedback ?? {};\n\n const t = useI18n();\n\n const [feedbackVal, setFeedbackVal] = useState(feedbackText);\n const [showDialog, setShowDialog] = useState(false);\n\n const likeButtonRef = useRef<HTMLButtonElement>(null);\n const dislikeButtonRef = useRef<HTMLButtonElement>(null);\n const shouldOpenDialogRef = useRef(false);\n const [iconEl, seticonEl] = useElement<HTMLDivElement>();\n\n const isLikeActive = reaction === 'liked';\n const isDislikeActive = reaction === 'disliked';\n\n const needsDialog = (reactionType: Reaction) => {\n switch (promptFeedbackOn) {\n case 'disliked':\n return reactionType === 'disliked';\n case 'liked':\n return reactionType === 'liked';\n case 'both':\n return true;\n default:\n return false;\n }\n };\n\n const handleReactionClick = useCallback(\n (reactionType: Reaction) => {\n if (reaction === reactionType && !allowFeedbackResubmission) {\n return;\n }\n\n onReaction?.(messageId, reactionType);\n\n if (needsDialog(reactionType)) {\n if (reaction !== reactionType) {\n setFeedbackVal('');\n } else {\n setFeedbackVal(feedbackText);\n }\n\n if (!allowFeedbackResubmission) {\n shouldOpenDialogRef.current = true;\n } else {\n setShowDialog(true);\n }\n }\n },\n [reaction, feedbackText, allowFeedbackResubmission, promptFeedbackOn, messageId, onReaction]\n );\n\n const closeDialog = useCallback(\n (comment?: string) => {\n setShowDialog(false);\n shouldOpenDialogRef.current = false;\n\n onFeedbackComplete?.(messageId, comment);\n\n if (!allowFeedbackResubmission && iconEl) {\n iconEl.focus();\n }\n },\n [allowFeedbackResubmission, onFeedbackComplete, messageId, iconEl]\n );\n\n const getDialogTarget = () => {\n if (!allowFeedbackResubmission && iconEl) {\n return iconEl;\n }\n\n return isLikeActive ? likeButtonRef.current : dislikeButtonRef.current;\n };\n\n useEffect(() => {\n if (iconEl && shouldOpenDialogRef.current && !allowFeedbackResubmission) {\n setShowDialog(true);\n shouldOpenDialogRef.current = false;\n }\n }, [iconEl, allowFeedbackResubmission]);\n\n useEffect(() => {\n if (!showDialog && reaction && allowFeedbackResubmission) {\n const reactionButton =\n reaction === 'liked' ? likeButtonRef.current : dislikeButtonRef.current;\n reactionButton?.focus();\n }\n }, [showDialog, reaction, allowFeedbackResubmission]);\n\n const dialogTarget = getDialogTarget();\n\n const feedbackDialog = showDialog && dialogTarget && (\n <FormDialog\n target={dialogTarget}\n heading={t('share_feedback')}\n onCancel={() => closeDialog()}\n onSubmit={() => closeDialog(feedbackVal)}\n onKeyDown={e => e.stopPropagation()}\n >\n <TextArea\n value={feedbackVal}\n onChange={e => setFeedbackVal(e.target.value)}\n onKeyDown={(e: KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n e.preventDefault();\n closeDialog(feedbackVal);\n }\n }}\n autoResize={false}\n />\n </FormDialog>\n );\n\n const shouldShowIcon = !allowFeedbackResubmission && reaction;\n\n if (shouldShowIcon) {\n return (\n <Flex\n container={{ pad: [0.5, undefined] }}\n ref={seticonEl}\n tabIndex={-1}\n aria-label={t('selected_noun', [isLikeActive ? t('good_response') : t('bad_response')])}\n role='status'\n >\n <Icon name={isLikeActive ? 'thumbs-up-solid' : 'thumbs-down-solid'} />\n\n <Tooltip target={iconEl} describeTarget={false}>\n {isLikeActive ? t('good_response') : t('bad_response')}\n </Tooltip>\n\n {feedbackDialog}\n </Flex>\n );\n }\n\n return (\n <>\n <Flex container={{ gap: 1 }}>\n <Button\n label={t('good_response')}\n variant='simple'\n icon\n compact\n ref={likeButtonRef}\n onClick={() => handleReactionClick('liked')}\n aria-pressed={isLikeActive}\n >\n <Icon name={isLikeActive ? 'thumbs-up-solid' : 'thumbs-up'} />\n </Button>\n\n <Button\n label={t('bad_response')}\n variant='simple'\n icon\n compact\n ref={dislikeButtonRef}\n onClick={() => handleReactionClick('disliked')}\n aria-pressed={isDislikeActive}\n >\n <Icon name={isDislikeActive ? 'thumbs-down-solid' : 'thumbs-down'} />\n </Button>\n </Flex>\n\n {feedbackDialog}\n </>\n );\n};\n\nexport default GenAIMessageFeedbackButtons;\n"]}
|
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
import type { Ref } from 'react';
|
|
2
2
|
import type { StatusProps, ForwardRefForwardPropsComponent, FieldValueListProps, NoChildrenProp, RequireAtLeastOne } from '@pega/cosmos-react-core';
|
|
3
3
|
import type { CountdownButtonProps } from './CountdownButton';
|
|
4
|
+
interface InfoText {
|
|
5
|
+
/** Visually hidden description for accessibility purposes. */
|
|
6
|
+
description: string;
|
|
7
|
+
/** Information text. */
|
|
8
|
+
text: string;
|
|
9
|
+
}
|
|
4
10
|
export type InteractionNotificationProps = RequireAtLeastOne<NoChildrenProp & {
|
|
5
11
|
/** Ref to Component. */
|
|
6
12
|
ref?: Ref<HTMLDivElement>;
|
|
@@ -8,10 +14,6 @@ export type InteractionNotificationProps = RequireAtLeastOne<NoChildrenProp & {
|
|
|
8
14
|
icon: string;
|
|
9
15
|
/** Interaction title. */
|
|
10
16
|
title: string;
|
|
11
|
-
/** Primary information of the notification. For example caller name . */
|
|
12
|
-
primaryText: string;
|
|
13
|
-
/** Secondary information of the notification. For example phone number of the caller */
|
|
14
|
-
secondaryText?: string;
|
|
15
17
|
/** Represents the current status of interaction. */
|
|
16
18
|
status: {
|
|
17
19
|
variant: StatusProps['variant'];
|
|
@@ -29,7 +31,21 @@ export type InteractionNotificationProps = RequireAtLeastOne<NoChildrenProp & {
|
|
|
29
31
|
onAccept?: () => void;
|
|
30
32
|
/** Callback when decline or 'x' button is clicked. */
|
|
31
33
|
onDismiss?: () => void;
|
|
32
|
-
}
|
|
34
|
+
} & ({
|
|
35
|
+
/** Primary information of the notification. For example caller name. */
|
|
36
|
+
primaryText: InfoText;
|
|
37
|
+
/** Secondary information of the notification. For example phone number of the caller. */
|
|
38
|
+
secondaryText?: InfoText;
|
|
39
|
+
/** Tertiary information of the notification. For example role of the caller. */
|
|
40
|
+
tertiaryText?: InfoText;
|
|
41
|
+
} | {
|
|
42
|
+
/** Primary information of the notification. For example caller name. */
|
|
43
|
+
primaryText: string;
|
|
44
|
+
/** Secondary information of the notification. For example phone number of the caller. */
|
|
45
|
+
secondaryText?: string;
|
|
46
|
+
/** Tertiary information of the notification. For example role of the caller. */
|
|
47
|
+
tertiaryText?: string;
|
|
48
|
+
}), 'onAccept' | 'onDismiss'>;
|
|
33
49
|
declare const InteractionNotification: ForwardRefForwardPropsComponent<InteractionNotificationProps>;
|
|
34
50
|
export default InteractionNotification;
|
|
35
51
|
//# sourceMappingURL=InteractionNotification.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InteractionNotification.d.ts","sourceRoot":"","sources":["../../../src/components/InteractionNotification/InteractionNotification.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"InteractionNotification.d.ts","sourceRoot":"","sources":["../../../src/components/InteractionNotification/InteractionNotification.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;AA2BlD,OAAO,KAAK,EACV,WAAW,EACX,+BAA+B,EAC/B,mBAAmB,EACnB,cAAc,EACd,iBAAiB,EAClB,MAAM,yBAAyB,CAAC;AAIjC,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAE9D,UAAU,QAAQ;IAChB,8DAA8D;IAC9D,WAAW,EAAE,MAAM,CAAC;IACpB,wBAAwB;IACxB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,MAAM,4BAA4B,GAAG,iBAAiB,CAC1D,cAAc,GAAG;IACf,wBAAwB;IACxB,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAC1B,uCAAuC;IACvC,IAAI,EAAE,MAAM,CAAC;IACb,yBAAyB;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,oDAAoD;IACpD,MAAM,EAAE;QAAE,OAAO,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;IAC1D,iFAAiF;IACjF,MAAM,CAAC,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAC;IACvC,yBAAyB;IACzB,2BAA2B,CAAC,EAAE;QAC5B,SAAS,EAAE,oBAAoB,CAAC,WAAW,CAAC,CAAC;QAC7C,aAAa,EAAE,oBAAoB,CAAC,SAAS,CAAC,CAAC;QAC/C,UAAU,CAAC,EAAE,oBAAoB,CAAC,YAAY,CAAC,CAAC;KACjD,CAAC;IACF,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB,GAAG,CACE;IACE,wEAAwE;IACxE,WAAW,EAAE,QAAQ,CAAC;IACtB,yFAAyF;IACzF,aAAa,CAAC,EAAE,QAAQ,CAAC;IACzB,gFAAgF;IAChF,YAAY,CAAC,EAAE,QAAQ,CAAC;CACzB,GACD;IACE,wEAAwE;IACxE,WAAW,EAAE,MAAM,CAAC;IACpB,yFAAyF;IACzF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gFAAgF;IAChF,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CACJ,EACH,UAAU,GAAG,WAAW,CACzB,CAAC;AA0GF,QAAA,MAAM,uBAAuB,EAAE,+BAA+B,CAAC,4BAA4B,CA8GvF,CAAC;AAEL,eAAe,uBAAuB,CAAC"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef, useEffect, useRef } from 'react';
|
|
3
3
|
import styled, { css } from 'styled-components';
|
|
4
|
-
import { Button, Card, CardContent, CardHeader, Status, Text, defaultThemeProp, Flex, StyledText, FieldValueList, StyledFieldValueList, useI18n, useDirection, Icon, StyledLabel, useLiveLog, registerAction, useShortcut, useConsolidatedRef, useEscape, CardFooter } from '@pega/cosmos-react-core';
|
|
4
|
+
import { Button, Card, CardContent, CardHeader, Status, Text, defaultThemeProp, Flex, StyledText, FieldValueList, StyledFieldValueList, useI18n, useDirection, Icon, StyledLabel, useLiveLog, registerAction, useShortcut, useConsolidatedRef, useEscape, CardFooter, VisuallyHiddenText } from '@pega/cosmos-react-core';
|
|
5
5
|
import { StyledCardContent } from '@pega/cosmos-react-core/lib/components/Card/CardContent';
|
|
6
6
|
import CountdownButton from './CountdownButton';
|
|
7
7
|
const StyledInteractionNotification = styled(Card)(({ theme: { base } }) => {
|
|
@@ -76,7 +76,12 @@ registerAction({
|
|
|
76
76
|
id: 'DismissIncomingInteraction',
|
|
77
77
|
defaultKeyBinding: 'Alt+Q'
|
|
78
78
|
});
|
|
79
|
-
const
|
|
79
|
+
const NotificationText = ({ content, variant = 'h5' }) => {
|
|
80
|
+
const isString = typeof content === 'string';
|
|
81
|
+
const text = (_jsx(Text, { variant: variant, as: 'span', children: isString ? content : content.text }));
|
|
82
|
+
return isString ? (text) : (_jsxs("div", { children: [_jsx(VisuallyHiddenText, { children: `${content.description} - ` }), text] }));
|
|
83
|
+
};
|
|
84
|
+
const InteractionNotification = forwardRef(function InteractionNotification({ icon, title, primaryText, secondaryText, tertiaryText, status, fields, incomingNotificationTimeout, onAccept, onDismiss }, ref) {
|
|
80
85
|
const t = useI18n();
|
|
81
86
|
const { announceAssertive } = useLiveLog();
|
|
82
87
|
const containerRef = useConsolidatedRef(ref);
|
|
@@ -97,14 +102,14 @@ const InteractionNotification = forwardRef(function InteractionNotification({ ic
|
|
|
97
102
|
}, containerRef.current, [onDismiss]);
|
|
98
103
|
useEffect(() => {
|
|
99
104
|
announceAssertive({
|
|
100
|
-
message: `${title} ${primaryText} ${t('status')} ${status.text}. ${goToBinding ? t('interaction_shortcut_goto_info', [goToBinding]) : ''}${dismissBinding && onDismiss
|
|
105
|
+
message: `${title} ${typeof primaryText === 'string' ? primaryText : primaryText.description} ${t('status')} ${status.text}. ${goToBinding ? t('interaction_shortcut_goto_info', [goToBinding]) : ''}${dismissBinding && onDismiss
|
|
101
106
|
? t('interaction_shortcut_dismiss_info', [dismissBinding])
|
|
102
107
|
: ''}`,
|
|
103
108
|
type: 'alert'
|
|
104
109
|
});
|
|
105
110
|
}, []);
|
|
106
111
|
const acceptButton = incomingNotificationTimeout ? (_jsx(CountdownButton, { variant: 'primary', onClick: onAccept, startTime: incomingNotificationTimeout.startTime, timeout: incomingNotificationTimeout.answerTimeout, onTimerEnd: incomingNotificationTimeout.onTimerEnd ?? onDismiss, ref: acceptButtonRef, children: t('accept') })) : (_jsx(Button, { variant: 'primary', onClick: onAccept, ref: acceptButtonRef, children: t('accept') }));
|
|
107
|
-
return (_jsxs(StyledInteractionNotification, { ref: containerRef, "data-app-region": true, role: 'alertdialog', "aria-label": title, children: [_jsx(CardHeader, { children: _jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [_jsx(Icon, { name: icon }), _jsx(Text, { variant: 'h2', children: title })] }) }), _jsxs(CardContent, { container: { gap: 2 }, children: [_jsxs(Flex, { container: { direction: 'column', alignItems: 'center', gap: 1 }, children: [_jsx(
|
|
112
|
+
return (_jsxs(StyledInteractionNotification, { ref: containerRef, "data-app-region": true, role: 'alertdialog', "aria-label": title, children: [_jsx(CardHeader, { children: _jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [_jsx(Icon, { name: icon }), _jsx(Text, { variant: 'h2', children: title })] }) }), _jsxs(CardContent, { container: { gap: 2 }, children: [_jsxs(Flex, { container: { direction: 'column', alignItems: 'center', gap: 1 }, children: [_jsx(NotificationText, { content: primaryText, variant: 'h1' }), secondaryText && _jsx(NotificationText, { content: secondaryText }), tertiaryText && _jsx(NotificationText, { content: tertiaryText }), _jsx(Status, { variant: status.variant, children: status.text })] }), fields && fields.length !== 0 && _jsx(FieldValueList, { variant: 'inline', fields: fields })] }), onAccept ? (_jsxs(CardFooter, { justify: onDismiss ? 'between' : 'end', children: [onDismiss && _jsx(Button, { onClick: onDismiss, children: t('decline') }), acceptButton] })) : (_jsx(CardFooter, { justify: 'end', children: _jsx(Button, { variant: 'primary', onClick: onDismiss, children: t('close') }) }))] }));
|
|
108
113
|
});
|
|
109
114
|
export default InteractionNotification;
|
|
110
115
|
//# sourceMappingURL=InteractionNotification.js.map
|