@pega/cosmos-react-cs - npm Package Compare versions

Comparing version 4.0.0-dev.11.1 to 4.0.0-dev.12.0

lib/components/CallControlPanel/Call.js

@@ -18,3 +18,3 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 registerIcon(arrowUpIcon, micSolidIcon, micOffSolidIcon, playSoldIcon, pauseSolidIcon, phoneSplitSolidIcon, phoneOutSolidIcon, phoneHangupSolidIcon);
-const Call = ({ id: callId, startedAt, onHoldSince, slaConfig, participants, onPauseToggle, muted, onMuteToggle, onDTMFPress, onConsultAction, onConferenceAction, onTransferAction, onMergeCall, onHandOffCall, onEndCall, transferOptions, interactionOptions }) => {
+const Call = ({ id: callId, startedAt, onHoldSince, slaConfig, participants, onPauseToggle, muted, onMuteToggle, onDTMFPress, onConsultAction, onConferenceAction, onTransferAction, onMergeCall, onHandOffCall, onEndCall, defaultTransfer, transferOptions, defaultInteraction, interactionOptions }) => {
     const t = useI18n();
@@ -120,3 +120,3 @@ const moreActionsButtonRef = useRef(null);
                     _jsx(StopWatch, { startTime: onHoldSince })
-                ]) })), dialogType && (_jsx(CallHandoverDialog, { target: moreActionsButtonRef.current, type: dialogType, transferOptions: transferOptions, interactionOptions: interactionOptions, onCancel: () => {
+                ]) })), dialogType && (_jsx(CallHandoverDialog, { target: moreActionsButtonRef.current, type: dialogType, defaultTransfer: defaultTransfer, transferOptions: transferOptions, defaultInteraction: defaultInteraction, interactionOptions: interactionOptions, onCancel: () => {
                     setDialogType(undefined);
@@ -123,0 +123,0 @@ moreActionsButtonRef.current?.focus();

lib/components/CallControlPanel/CallControlPanel.types.d.ts

@@ -49,2 +49,4 @@ import type { Ref } from 'react';
     onEndCall?: (id: CallProps['id']) => void;
+    /** Initial selected transfer reason */
+    defaultTransfer?: TransferReasonOption['id'];
     /**
@@ -54,2 +56,4 @@ * Transfer reason options
     transferOptions: Readonly<TransferReasonOption[]>;
+    /** Initial selected interaction */
+    defaultInteraction?: TransferReasonOption['id'];
     /**
@@ -56,0 +60,0 @@ * Interaction options

lib/components/CallControlPanel/CallHandover/CallHandoverDialog.d.ts

@@ -9,2 +9,4 @@ import { FunctionComponent } from 'react';
     onSubmit: (data: TransferData) => void;
+    defaultTransfer?: TransferReasonOption['id'];
+    defaultInteraction?: TransferReasonOption['id'];
     transferOptions: Readonly<TransferReasonOption[]>;
@@ -11,0 +13,0 @@ interactionOptions?: Readonly<TransferReasonOption[]>;

lib/components/CallControlPanel/CallHandover/CallHandoverDialog.js

@@ -5,3 +5,3 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import CallHandoverForm from './CallHandoverForm';
-const CallHandoverDialog = ({ target, type, onSubmit, onCancel, transferOptions, interactionOptions }) => {
+const CallHandoverDialog = ({ target, type, onSubmit, onCancel, transferOptions, interactionOptions, defaultTransfer, defaultInteraction }) => {
     const popoverRef = useRef(null);
@@ -20,23 +20,23 @@ const t = useI18n();
             dialogHeading = t('call_panel_conference_heading');
-            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call', submitButtonText: t('call_panel_conference_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
+            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call', submitButtonText: t('call_panel_conference_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions, defaultTransfer: defaultTransfer, defaultInteraction: defaultInteraction }));
             break;
         case 'conferenceWithInteractions':
             dialogHeading = t('call_panel_conference_call_and_interactions_heading');
-            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call+interaction', submitButtonText: t('call_panel_conference_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
+            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call+interaction', submitButtonText: t('call_panel_conference_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions, defaultTransfer: defaultTransfer, defaultInteraction: defaultInteraction }));
             break;
         case 'consultCallOnly':
             dialogHeading = t('call_panel_consult_heading');
-            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call', submitButtonText: t('call_panel_consult_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
+            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call', submitButtonText: t('call_panel_consult_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions, defaultTransfer: defaultTransfer, defaultInteraction: defaultInteraction }));
             break;
         case 'consultWithInteractions':
             dialogHeading = t('call_panel_consult_call_and_interactions_heading');
-            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call+interaction', submitButtonText: t('call_panel_consult_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
+            dialogContent = (_jsx(CallHandoverForm, { onCancel: onCancel, variant: 'call+interaction', submitButtonText: t('call_panel_consult_submit'), onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions, defaultTransfer: defaultTransfer, defaultInteraction: defaultInteraction }));
             break;
         case 'transferCallOnly':
             dialogHeading = t('call_panel_transfer_heading');
-            dialogContent = (_jsx(CallHandoverForm, { submitButtonText: t('call_panel_transfer_submit'), onCancel: onCancel, variant: 'call', onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
+            dialogContent = (_jsx(CallHandoverForm, { submitButtonText: t('call_panel_transfer_submit'), onCancel: onCancel, variant: 'call', onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions, defaultTransfer: defaultTransfer, defaultInteraction: defaultInteraction }));
             break;
         case 'transferWithInteractions':
             dialogHeading = t('call_panel_transfer_call_and_interactions_heading');
-            dialogContent = (_jsx(CallHandoverForm, { submitButtonText: t('call_panel_transfer_submit'), onCancel: onCancel, variant: 'call+interaction', onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions }));
+            dialogContent = (_jsx(CallHandoverForm, { submitButtonText: t('call_panel_transfer_submit'), onCancel: onCancel, variant: 'call+interaction', onSubmit: onSubmit, transferOptions: transferOptions, interactionOptions: interactionOptions, defaultTransfer: defaultTransfer, defaultInteraction: defaultInteraction }));
             break;
@@ -43,0 +43,0 @@ default:

lib/components/CallControlPanel/CallHandover/CallHandoverForm.d.ts

@@ -11,2 +11,6 @@ import { FunctionComponent, Ref } from 'react';
     onCancel: () => void;
+    /** Current selected transfer reason */
+    defaultTransfer?: TransferReasonOption['id'];
+    /** Current selected interaction */
+    defaultInteraction?: TransferReasonOption['id'];
     /** Transfer reason options. */
@@ -13,0 +17,0 @@ transferOptions: Readonly<TransferReasonOption[]>;

lib/components/CallControlPanel/CallHandover/CallHandoverForm.js

@@ -17,7 +17,9 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 StyledCallHandoverForm.defaultProps = defaultThemeProp;
-const CallHandoverForm = ({ onCancel, onSubmit, transferOptions, variant, submitButtonText, interactionOptions }) => {
+const CallHandoverForm = ({ onCancel, onSubmit, transferOptions, variant, submitButtonText, interactionOptions, defaultTransfer, defaultInteraction }) => {
     const t = useI18n();
-    const [selectedReason, setSelectedReason] = useState();
     const [selectedContact, setSelectedContact] = useState();
-    const [selectedInteraction, setSelectedInteraction] = useState();
+    const initialReason = transferOptions.find(reason => reason.id === defaultTransfer);
+    const initialInteraction = interactionOptions?.find(interaction => interaction.id === defaultInteraction);
+    const [selectedReason, setSelectedReason] = useState(initialReason);
+    const [selectedInteraction, setSelectedInteraction] = useState(initialInteraction);
     const [comments, setComments] = useState('');
@@ -24,0 +26,0 @@ return (_jsxs(StyledCallHandoverForm, { actions: _jsxs(_Fragment, { children: [_jsx(Button, { variant: 'secondary', onClick: onCancel, children: t('cancel') }), _jsx(Button, { variant: 'primary', disabled: !(selectedContact && (variant === 'call+interaction' ? comments : true)), onClick: () => {

lib/components/InteractionNotification/InteractionNotification.js

 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef } from 'react';
+import { forwardRef, useEffect } from 'react';
 import styled, { css } from 'styled-components';
-import { Button, Card, CardContent, CardHeader, Status, Text, defaultThemeProp, Flex, StyledText, FieldValueList, CardFooter, StyledFieldValueList, StyledButton, useI18n, useDirection, Icon, StyledLabel } from '@pega/cosmos-react-core';
+import { Button, Card, CardContent, CardHeader, Status, Text, defaultThemeProp, Flex, StyledText, FieldValueList, CardFooter, StyledFieldValueList, StyledButton, useI18n, useDirection, Icon, StyledLabel, useLiveLog } from '@pega/cosmos-react-core';
 import { StyledCardContent } from '@pega/cosmos-react-core/lib/components/Card/CardContent';
@@ -74,2 +74,9 @@ import { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/CardHeader';
     const t = useI18n();
+    const { announceAssertive } = useLiveLog();
+    useEffect(() => {
+        announceAssertive({
+            message: `${title} ${primaryText} ${t('status')} ${status.text}`,
+            type: 'alert'
+        });
+    }, []);
     const acceptButton = incomingNotificationTimeout ? (_jsx(AcceptButton, { startTime: incomingNotificationTimeout.startTime, timeout: incomingNotificationTimeout.answerTimeout, onTimerEnd: incomingNotificationTimeout.onTimerEnd ?? onDecline, onClick: onAccept })) : (_jsx(Button, { variant: 'primary', onClick: onAccept, children: t('accept') }));
@@ -76,0 +83,0 @@ return (_jsxs(StyledInteractionNotification, { ref: ref, children: [_jsx(CardHeader, { children: _jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [_jsx(Icon, { name: icon }), _jsx(Text, { variant: 'h2', children: title })] }) }), _jsx(CardContent, { children: _jsxs(Flex, { container: { direction: 'column', alignItems: 'center', gap: 1 }, children: [_jsx(Text, { variant: 'h1', as: 'span', children: primaryText }), secondaryText && (_jsx(Text, { variant: 'h5', as: 'span', children: secondaryText })), _jsx(Status, { variant: status.variant, children: status.text })] }) }), fields && fields.length !== 0 && (_jsx(CardFooter, { justify: 'between', children: _jsx(FieldValueList, { variant: 'inline', fields: fields }) })), onDecline ? (_jsxs(Flex, { as: StyledCardFooter, container: { direction: 'row', justify: 'between' }, children: [_jsx(Button, { onClick: onDecline, children: t('decline') }), acceptButton] })) : (_jsx(Flex, { as: StyledCardFooter, container: { direction: 'row-reverse' }, children: acceptButton }))] }));

package.json

 {
   "name": "@pega/cosmos-react-cs",
-  "version": "4.0.0-dev.11.1",
+  "version": "4.0.0-dev.12.0",
   "author": "Pegasystems",
@@ -23,4 +23,4 @@ "license": "SEE LICENSE IN LICENSE",
   "dependencies": {
-    "@pega/cosmos-react-core": "4.0.0-dev.11.1",
-    "@pega/cosmos-react-dnd": "4.0.0-dev.11.1",
+    "@pega/cosmos-react-core": "4.0.0-dev.12.0",
+    "@pega/cosmos-react-dnd": "4.0.0-dev.12.0",
     "@types/react": "^16.14.24 || ^17.0.38",
@@ -27,0 +27,0 @@ "@types/react-dom": "^16.9.14 || ^17.0.11",

No alert changes

Improved metrics

Total package byte prevSize

533309

0.87%

Lines of code

3665

0.71%

Dependency changes

• + Added

  @pega/cosmos-react-core@4.0.0-dev.12.0
  (transitive)

• + Added

  @pega/cosmos-react-dnd@4.0.0-dev.12.0
  (transitive)

• - Removed

  @pega/cosmos-react-core@4.0.0-dev.11.1
  (transitive)

• - Removed

  @pega/cosmos-react-dnd@4.0.0-dev.11.1
  (transitive)

• Updated

  @pega/cosmos-react-core@4.0.0-dev.12.0

• Updated

  @pega/cosmos-react-dnd@4.0.0-dev.12.0