@webex/cc-components 1.28.0-ccwidgets.97 → 1.28.0-ccwidgets.99

package/dist/types/components/task/CallControl/CallControlCustom/call-control-custom.utils.d.ts

@@ -0,0 +1,140 @@
+import { BuddyDetails, ContactServiceQueue, ILogger } from '@webex/cc-store';
+/**
+ * Interface for button configuration
+ */
+export interface ButtonConfig {
+    key: string;
+    icon: string;
+    onClick: () => void;
+    tooltip: string;
+    className: string;
+    disabled?: boolean;
+    shouldShow: boolean;
+}
+/**
+ * Interface for list item data
+ */
+export interface ListItemData {
+    id: string;
+    name: string;
+}
+/**
+ * Creates the consult button configuration array
+ */
+export declare const createConsultButtons: (isMuted: boolean, isMuteDisabled: boolean, consultCompleted: boolean, isAgentBeingConsulted: boolean, isEndConsultEnabled: boolean, muteUnmute: boolean, onTransfer?: () => void, handleConsultMuteToggle?: () => void, handleEndConsult?: () => void) => ButtonConfig[];
+/**
+ * Filters buttons that should be visible
+ */
+export declare const getVisibleButtons: (buttons: ButtonConfig[]) => ButtonConfig[];
+/**
+ * Creates initials from a name string
+ */
+export declare const createInitials: (name: string) => string;
+/**
+ * Handles transfer button press with logging
+ */
+export declare const handleTransferPress: (onTransfer: (() => void) | undefined, logger: ILogger) => void;
+/**
+ * Handles end consult button press with logging
+ */
+export declare const handleEndConsultPress: (endConsultCall: (() => void) | undefined, logger: ILogger) => void;
+/**
+ * Handles mute toggle with disabled state management
+ */
+export declare const handleMuteToggle: (onToggleConsultMute: (() => void) | undefined, setIsMuteDisabled: (disabled: boolean) => void, logger: ILogger) => void;
+/**
+ * Gets the consult status text based on completion state
+ */
+export declare const getConsultStatusText: (consultCompleted: boolean) => string;
+/**
+ * Handles list item button press with logging
+ */
+export declare const handleListItemPress: (title: string, onButtonPress: () => void, logger: ILogger) => void;
+/**
+ * Determines if tabs should be shown based on available data
+ */
+export declare const shouldShowTabs: (buddyAgents: BuddyDetails[], queues: ContactServiceQueue[]) => boolean;
+/**
+ * Checks if agents list is empty
+ */
+export declare const isAgentsEmpty: (buddyAgents: BuddyDetails[]) => boolean;
+/**
+ * Checks if queues list is empty
+ */
+export declare const isQueuesEmpty: (queues: ContactServiceQueue[]) => boolean;
+/**
+ * Handles tab selection with logging
+ */
+export declare const handleTabSelection: (key: string, setSelectedTab: (tab: string) => void, logger: ILogger) => void;
+/**
+ * Handles agent selection with logging
+ */
+export declare const handleAgentSelection: (agentId: string, agentName: string, onAgentSelect: ((agentId: string, agentName: string) => void) | undefined, logger: ILogger) => void;
+/**
+ * Handles queue selection with logging
+ */
+export declare const handleQueueSelection: (queueId: string, queueName: string, onQueueSelect: ((queueId: string, queueName: string) => void) | undefined, logger: ILogger) => void;
+/**
+ * Gets the appropriate empty state message based on context
+ */
+export declare const getEmptyStateMessage: (selectedTab: string, showTabs: boolean) => string;
+/**
+ * Creates list item data from buddy agents
+ */
+export declare const createAgentListData: (buddyAgents: BuddyDetails[]) => ListItemData[];
+/**
+ * Creates list item data from queues
+ */
+export declare const createQueueListData: (queues: ContactServiceQueue[]) => ListItemData[];
+/**
+ * Creates a timer key based on timestamp
+ */
+export declare const createTimerKey: (startTimeStamp: number) => string;
+/**
+ * Handles popover open with logging
+ */
+export declare const handlePopoverOpen: (menuType: string, setActiveMenu: (menu: string) => void, logger: ILogger) => void;
+/**
+ * Handles popover close with logging
+ */
+export declare const handlePopoverClose: (setActiveMenu: (menu: string | null) => void, logger: ILogger) => void;
+/**
+ * Handles hold toggle with logging
+ */
+export declare const handleHoldToggle: (toggleHold: (() => void) | undefined, logger: ILogger) => void;
+/**
+ * Handles wrapup call with logging
+ */
+export declare const handleWrapupCall: (onWrapupCall: (() => void) | undefined, logger: ILogger) => void;
+/**
+ * Validates if a menu type is supported
+ */
+export declare const isValidMenuType: (menuType: string) => boolean;
+/**
+ * Gets button style class based on state
+ */
+export declare const getButtonStyleClass: (isActive: boolean, isDisabled: boolean, baseClass?: string) => string;
+/**
+ * Formats elapsed time for display
+ */
+export declare const formatElapsedTime: (startTime: number) => string;
+/**
+ * Checks if an agent is available for selection
+ */
+export declare const isAgentAvailable: (agent: BuddyDetails) => boolean;
+/**
+ * Checks if a queue is available for selection
+ */
+export declare const isQueueAvailable: (queue: ContactServiceQueue) => boolean;
+/**
+ * Filters available agents
+ */
+export declare const filterAvailableAgents: (agents: BuddyDetails[]) => BuddyDetails[];
+/**
+ * Filters available queues
+ */
+export declare const filterAvailableQueues: (queues: ContactServiceQueue[]) => ContactServiceQueue[];
+/**
+ * Debounces a function call
+ */
+export declare const debounce: <T extends (...args: unknown[]) => unknown>(func: T, wait: number) => ((...args: Parameters<T>) => void);

package/dist/types/components/task/CallControl/call-control.utils.d.ts

@@ -0,0 +1,58 @@
+import { CallControlMenuType } from '../task.types';
+import type { CallControlButton, ControlVisibility, MEDIA_CHANNEL as MediaChannelType, MediaTypeInfo } from '../task.types';
+import { DestinationType, ILogger, ITask } from '@webex/cc-store';
+/**
+ * Handles toggle hold functionality
+ */
+export declare const handleToggleHold: (isHeld: boolean, toggleHold: (hold: boolean) => void, setIsHeld: (held: boolean) => void, logger: ILogger) => void;
+/**
+ * Handles mute toggle functionality with disabled state management
+ */
+export declare const handleMuteToggle: (toggleMute: () => void, setIsMuteButtonDisabled: (disabled: boolean) => void, logger: ILogger) => void;
+/**
+ * Handles wrapup call submission
+ */
+export declare const handleWrapupCall: (selectedWrapupReason: string | null, selectedWrapupId: string | null, wrapupCall: (reason: string, id: string) => void, setSelectedWrapupReason: (reason: string | null) => void, setSelectedWrapupId: (id: string | null) => void, logger: ILogger) => void;
+/**
+ * Handles wrapup reason change
+ */
+export declare const handleWrapupChange: (text: string, value: string, setSelectedWrapupReason: (reason: string) => void, setSelectedWrapupId: (id: string) => void) => void;
+/**
+ * Handles target selection for consult/transfer
+ */
+export declare const handleTargetSelect: (id: string, name: string, type: DestinationType, agentMenuType: CallControlMenuType | null, consultCall: (id: string, type: DestinationType) => void, transferCall: (id: string, type: DestinationType) => void, setConsultAgentId: (id: string) => void, setConsultAgentName: (name: string) => void, setLastTargetType: (type: DestinationType) => void, logger: ILogger) => void;
+/**
+ * Gets the media type information
+ */
+export declare const getMediaType: (mediaType: MediaChannelType, mediaChannel: MediaChannelType) => MediaTypeInfo;
+/**
+ * Checks if the media type is telephony
+ */
+export declare const isTelephonyMediaType: (mediaType: MediaChannelType) => boolean;
+/**
+ * Builds the call control buttons configuration
+ */
+export declare const buildCallControlButtons: (isMuted: boolean, isHeld: boolean, isRecording: boolean, isMuteButtonDisabled: boolean, currentMediaType: MediaTypeInfo, controlVisibility: ControlVisibility, handleMuteToggleFunc: () => void, handleToggleHoldFunc: () => void, toggleRecording: () => void, endCall: () => void) => CallControlButton[];
+/**
+ * Filters buttons based on consultation state
+ */
+export declare const filterButtonsForConsultation: (buttons: CallControlButton[], consultInitiated: boolean, isTelephony: boolean) => CallControlButton[];
+/**
+ * Updates call state from current task data
+ */
+export declare const updateCallStateFromTask: (currentTask: ITask, setIsHeld: (held: boolean) => void, setIsRecording: (recording: boolean) => void) => void;
+/**
+ * Handles close button press for popover components
+ */
+export declare const handleCloseButtonPress: (setShowAgentMenu: (show: boolean) => void, setAgentMenuType: (type: CallControlMenuType | null) => void) => void;
+/**
+ * Handles wrapup reason selection change event
+ */
+export declare const handleWrapupReasonChange: (event: CustomEvent, wrapupCodes: Array<{
+    id: string;
+    name: string;
+}> | undefined, handleWrapupChange: (text: string, value: string) => void) => void;
+/**
+ * Handles audio element ref assignment
+ */
+export declare const handleAudioRef: (audioElement: HTMLAudioElement | null, callControlAudio: MediaStream | null) => void;

package/dist/types/components/task/IncomingTask/incoming-task.utils.d.ts

@@ -0,0 +1,23 @@
+import { ITask } from '@webex/cc-store';
+export interface IncomingTaskData {
+    ani: string;
+    customerName: string;
+    virtualTeamName: string;
+    ronaTimeout: number | null;
+    startTimeStamp: number;
+    mediaType: string;
+    mediaChannel: string;
+    isTelephony: boolean;
+    isSocial: boolean;
+    acceptText: string | undefined;
+    declineText: string | undefined;
+    title: string;
+    disableAccept: boolean;
+}
+/**
+ * Extracts and processes all data needed for rendering an incoming task
+ * @param incomingTask - The incoming task object
+ * @param isBrowser - Whether the device type is browser
+ * @returns Processed task data with computed values
+ */
+export declare const extractIncomingTaskData: (incomingTask: ITask, isBrowser: boolean) => IncomingTaskData;

package/dist/types/components/task/Task/index.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { PressEvent } from '@react-types/shared';
 import type { MEDIA_CHANNEL as MediaChannelType } from '../task.types';
 import './styles.scss';
-interface TaskProps {
+export interface TaskProps {
     interactionId?: string;
     title?: string;
     state?: string;

package/dist/types/components/task/Task/task.utils.d.ts

@@ -0,0 +1,76 @@
+import type { MEDIA_CHANNEL as MediaChannelType, TaskComponentData } from '../task.types';
+/**
+ * Capitalizes the first word of a string
+ * @param str - The string to capitalize
+ * @returns The string with the first word capitalized
+ */
+export declare const capitalizeFirstWord: (str: string) => string;
+/**
+ * Gets the correct CSS class name for the task title
+ * @param isNonVoiceMedia - Whether the media type is non-voice
+ * @param isIncomingTask - Whether this is an incoming task
+ * @returns The appropriate CSS class name
+ */
+export declare const getTitleClassName: (isNonVoiceMedia: boolean, isIncomingTask: boolean) => string;
+/**
+ * Creates unique IDs for tooltip elements
+ * @param interactionId - The interaction ID
+ * @returns Object with tooltip trigger and tooltip IDs
+ */
+export declare const createTooltipIds: (interactionId?: string) => {
+    tooltipTriggerId: string;
+    tooltipId: string;
+};
+/**
+ * Determines if the state should be shown
+ * @param state - The task state
+ * @param isIncomingTask - Whether this is an incoming task
+ * @returns Whether to show the state
+ */
+export declare const shouldShowState: (state?: string, isIncomingTask?: boolean) => boolean;
+/**
+ * Determines if the queue should be shown
+ * @param queue - The queue name
+ * @param isIncomingTask - Whether this is an incoming task
+ * @returns Whether to show the queue
+ */
+export declare const shouldShowQueue: (queue?: string, isIncomingTask?: boolean) => boolean;
+/**
+ * Determines if handle time should be shown
+ * @param isIncomingTask - Whether this is an incoming task
+ * @param ronaTimeout - The RONA timeout value
+ * @param startTimeStamp - The start timestamp
+ * @returns Whether to show handle time
+ */
+export declare const shouldShowHandleTime: (isIncomingTask?: boolean, ronaTimeout?: number, startTimeStamp?: number) => boolean;
+/**
+ * Determines if time left should be shown
+ * @param isIncomingTask - Whether this is an incoming task
+ * @param ronaTimeout - The RONA timeout value
+ * @returns Whether to show time left
+ */
+export declare const shouldShowTimeLeft: (isIncomingTask?: boolean, ronaTimeout?: number) => boolean;
+/**
+ * Gets the task list item CSS classes
+ * @param selected - Whether the task is selected
+ * @param styles - Additional styles
+ * @returns The combined CSS class string
+ */
+export declare const getTaskListItemClasses: (selected?: boolean, styles?: string) => string;
+/**
+ * Extracts and processes all data needed for rendering the Task component
+ * @param props - The Task component props
+ * @returns Processed task data with computed values
+ */
+export declare const extractTaskComponentData: ({ mediaType, mediaChannel, isIncomingTask, interactionId, state, queue, ronaTimeout, startTimeStamp, }: {
+    mediaType?: MediaChannelType;
+    mediaChannel?: MediaChannelType;
+    isIncomingTask?: boolean;
+    interactionId?: string;
+    state?: string;
+    queue?: string;
+    ronaTimeout?: number;
+    startTimeStamp?: number;
+    acceptText?: string;
+    declineText?: string;
+}) => TaskComponentData;

package/dist/types/components/task/TaskList/task-list.utils.d.ts

@@ -0,0 +1,45 @@
+import { TaskListItemData } from '../task.types';
+import { ITask } from '@webex/cc-store';
+/**
+ * Extracts and processes data from a task for rendering in the task list
+ * @param task - The task object
+ * @param isBrowser - Whether the device type is browser
+ * @returns Processed task data with computed values
+ */
+export declare const extractTaskListItemData: (task: ITask, isBrowser: boolean) => TaskListItemData;
+/**
+ * Determines if a task should be selectable
+ * @param task - The task object
+ * @param currentTask - The currently selected task
+ * @param taskData - Processed task data
+ * @returns Whether the task should be selectable
+ */
+export declare const isTaskSelectable: (task: ITask, currentTask: ITask | null, taskData: TaskListItemData) => boolean;
+/**
+ * Determines if the current task is selected
+ * @param task - The task object
+ * @param currentTask - The currently selected task
+ * @returns Whether this task is currently selected
+ */
+export declare const isCurrentTaskSelected: (task: ITask, currentTask: ITask | null) => boolean;
+/**
+ * Validates if a task list is empty or invalid
+ * @param taskList - The task list object
+ * @returns Whether the task list is empty or invalid
+ */
+export declare const isTaskListEmpty: (taskList: Record<string, ITask> | null | undefined) => boolean;
+/**
+ * Gets tasks as an array from the task list object
+ * @param taskList - The task list object
+ * @returns Array of tasks
+ */
+export declare const getTasksArray: (taskList: Record<string, ITask> | null | undefined) => ITask[];
+/**
+ * Creates task select handler with logging
+ * @param task - The task to select
+ * @param currentTask - The currently selected task
+ * @param onTaskSelect - The task select function
+ * @param logger - The logger instance
+ * @returns Task select handler function
+ */
+export declare const createTaskSelectHandler: (task: ITask, currentTask: ITask | null, onTaskSelect: (task: ITask) => void) => () => void;

package/dist/types/components/task/task.types.d.ts

@@ -96,8 +96,8 @@ export interface TaskProps {
      */
     logger: ILogger;
 }
-export type IncomingTaskComponentProps = Pick<TaskProps, 'incomingTask' | 'isBrowser' | 'accept' | 'reject' | 'logger'>;
-export type TaskListComponentProps = Pick<TaskProps, 'currentTask' | 'taskList' | 'isBrowser' | 'acceptTask' | 'declineTask' | 'onTaskSelect' | 'logger'>;
+export type IncomingTaskComponentProps = Pick<TaskProps, 'isBrowser' | 'accept' | 'reject'> & Partial<Pick<TaskProps, 'incomingTask'>>;
+export type TaskListComponentProps = Pick<TaskProps, 'isBrowser' | 'acceptTask' | 'declineTask' | 'onTaskSelect' | 'logger'> & Partial<Pick<TaskProps, 'currentTask' | 'taskList'>>;
 /**
  * Interface representing the properties for control actions on a task.
  */
@@ -437,4 +437,89 @@ export interface AutoWrapupTimerProps {
     allowCancelAutoWrapup?: boolean;
     handleCancelWrapup: () => void;
 }
+export interface CallControlButton {
+    id: string;
+    icon: string;
+    onClick?: () => void;
+    tooltip: string;
+    className: string;
+    disabled: boolean;
+    isVisible: boolean;
+    menuType?: CallControlMenuType;
+    dataTestId?: string;
+}
+export interface ControlVisibility {
+    accept: boolean;
+    decline: boolean;
+    end: boolean;
+    muteUnmute: boolean;
+    holdResume: boolean;
+    consult: boolean;
+    transfer: boolean;
+    conference: boolean;
+    wrapup: boolean;
+    pauseResumeRecording: boolean;
+    endConsult: boolean;
+    recordingIndicator: boolean;
+}
+export interface MediaTypeInfo {
+    labelName: string;
+}
+export interface TaskComponentData {
+    currentMediaType: {
+        labelName: string;
+        iconName: string;
+        className: string;
+        isBrandVisual: boolean;
+    };
+    isNonVoiceMedia: boolean;
+    tooltipTriggerId: string;
+    tooltipId: string;
+    titleClassName: string;
+    shouldShowState: boolean;
+    shouldShowQueue: boolean;
+    shouldShowHandleTime: boolean;
+    shouldShowTimeLeft: boolean;
+    capitalizedState: string;
+    capitalizedQueue: string;
+}
+export interface TaskListItemData {
+    ani: string;
+    customerName: string;
+    virtualTeamName: string;
+    ronaTimeout: number | null;
+    taskState: string;
+    startTimeStamp: number;
+    isIncomingTask: boolean;
+    mediaType: string;
+    mediaChannel: string;
+    isTelephony: boolean;
+    isSocial: boolean;
+    acceptText: string | undefined;
+    declineText: string | undefined;
+    title: string;
+    disableAccept: boolean;
+    displayState: string;
+}
+export declare enum TaskState {
+    NEW = "new",
+    ACTIVE = "active",
+    CONNECTED = "connected",
+    HOLD = "hold",
+    CONSULT = "consult",
+    CONFERENCE = "conference",
+    WRAP_UP = "wrap_up",
+    ENDED = "ended",
+    TRANSFERRED = "transferred",
+    DECLINED = "declined"
+}
+export declare enum TaskQueue {
+    SUPPORT = "support",
+    SALES = "sales",
+    TECHNICAL = "technical",
+    BILLING = "billing",
+    GENERAL = "general",
+    VIP = "vip",
+    ESCALATION = "escalation"
+}
 export {};