@webex/cc-components 1.28.0-ccwidgets.50 → 1.28.0-ccwidgets.51

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.
Files changed (6) hide show
  1. package/dist/index.js +13 -13
  2. package/dist/types/components/task/Task/index.d.ts +5 -1
  3. package/dist/types/components/task/task.types.d.ts +27 -3
  4. package/dist/wc.js +12 -12
  5. package/package.json +2 -2
  6. /package/dist/types/{utils.d.ts → utils/index.d.ts} +0 -0
package/dist/index.js CHANGED
@@ -2933,7 +2933,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
2933
2933
  /***/ ((module, __webpack_exports__, __webpack_require__) => {
2934
2934
 
2935
2935
  "use strict";
2936
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../../../../../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"../../../node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../../node_modules/css-loader/dist/runtime/api.js */ \"../../../node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:root {\n --mds-color-theme-avatar-glass-normal: rgba(0, 0, 0, 0.07);\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --mds-color-theme-avatar-glass-normal: rgba(255, 255, 255, 0.07);\n }\n}\n.task-list-item {\n display: flex;\n padding: 0.5rem 0.75rem;\n align-items: center;\n align-self: stretch;\n height: 5rem !important;\n}\n.task-list-item mdc-avatar {\n --mdc-avatar-default-background-color: var(--mds-color-theme-avatar-glass-normal);\n --mdc-avatar-default-foreground-color: var(--mds-color-theme-indicator-stable);\n}\n\n.task-text {\n color: var(--mds-color-theme-text-secondary-normal);\n}\n\n.task-list-item--selected {\n background: var(--mds-color-theme-background-primary-active);\n}\n.task-list-item--selected mdc-avatar {\n --mdc-avatar-default-background-color: var(--mds-color-theme-avatar-glass-active, rgba(255, 255, 255, 0.8));\n}`, \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/Task/styles.scss?../../../node_modules/css-loader/dist/cjs.js!../../../node_modules/sass-loader/dist/cjs.js");
2936
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../../../../../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"../../../node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../../node_modules/css-loader/dist/runtime/api.js */ \"../../../node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:root {\n --mds-color-theme-avatar-glass-normal: rgba(0, 0, 0, 0.07);\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --mds-color-theme-avatar-glass-normal: rgba(255, 255, 255, 0.07);\n }\n}\n.task-list-item {\n display: flex;\n padding: 0.5rem 0.75rem;\n align-items: center;\n align-self: stretch;\n height: 5rem !important;\n}\n.task-list-item mdc-avatar {\n --mdc-avatar-default-background-color: var(--mds-color-theme-avatar-glass-normal);\n --mdc-avatar-default-foreground-color: var(--mds-color-theme-indicator-stable);\n}\n\n.task-text {\n color: var(--mds-color-theme-text-secondary-normal);\n}\n\n.task-list-item--selected {\n background: var(--mds-color-theme-background-primary-active);\n}\n.task-list-item--selected mdc-avatar {\n --mdc-avatar-default-background-color: var(--mds-color-theme-avatar-glass-active, rgba(255, 255, 255, 0.8));\n}\n\n.task-button-container {\n display: flex;\n flex-direction: row;\n gap: 8px;\n}`, \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/Task/styles.scss?../../../node_modules/css-loader/dist/cjs.js!../../../node_modules/sass-loader/dist/cjs.js");
2937
2937
 
2938
2938
  /***/ }),
2939
2939
 
@@ -3153,7 +3153,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n\n\n
3153
3153
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3154
3154
 
3155
3155
  "use strict";
3156
- eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\n__webpack_require__(/*! ./user-state.scss */ \"./src/components/UserState/user-state.scss\");\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst collections_1 = __webpack_require__(/*! @react-stately/collections */ \"../../../node_modules/@react-stately/collections/dist/main.js\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nconst UserStateComponent = (props) => {\n const { idleCodes, setAgentStatus, isSettingAgentStatus, elapsedTime, lastIdleStateChangeElapsedTime, currentState, customState, } = props;\n let selectedKey;\n if (customState) {\n selectedKey = `hide-${customState.developerName}`;\n }\n else {\n selectedKey = currentState;\n }\n const items = customState\n ? [{ name: customState.name, id: `hide-${customState.developerName}`, developerName: customState.developerName }]\n : [];\n for (const item of idleCodes) {\n if (item.name === 'RONA' && item.id === currentState) {\n selectedKey = `hide-${item.id}`;\n }\n if (item.name === 'RONA' && item.id !== currentState) {\n continue; // Skip RONA unless it matches the current state\n }\n items.push(Object.assign(Object.assign({}, item), { id: item.name === 'RONA' ? `hide-${item.id}` : item.id }));\n }\n const getDropdownClass = () => {\n if (customState) {\n return 'custom'; // Custom state class\n }\n if (currentState === '0') {\n return '';\n }\n for (const item of idleCodes) {\n if (item.id === currentState && item.name === 'RONA') {\n return 'rona';\n }\n }\n return 'idle';\n };\n const getIconStyle = (item) => {\n if (item.developerName) {\n return { class: 'custom', iconName: 'busy-presence-light' };\n }\n switch (item.id) {\n case '0':\n return { class: '', iconName: 'active-presence-small-filled' };\n case item.name === 'RONA' && item.id:\n return { class: 'rona', iconName: 'dnd-presence-filled' };\n default:\n return { class: 'idle', iconName: 'recents-presence-filled' };\n }\n };\n return (react_1.default.createElement(\"div\", { className: \"user-state-container\" },\n react_1.default.createElement(react_collaboration_1.SelectNext, { label: \"\", \"aria-label\": \"user-state\", direction: \"bottom\", onSelectionChange: (key) => {\n const cleanKey = key.startsWith('hide-') ? key.substring(5) : key;\n setAgentStatus(cleanKey);\n }, showBorder: true, selectedKey: selectedKey, items: items, className: `state-select ${getDropdownClass()}` }, (item) => {\n return (react_1.default.createElement(collections_1.Item, { key: item.id, textValue: item.name },\n react_1.default.createElement(\"div\", { className: \"item-container\" },\n react_1.default.createElement(react_2.Icon, { name: getIconStyle(item).iconName, title: \"\", className: `state-icon ${getIconStyle(item).class}` }),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"state-name\", tagName: 'small' }, item.name))));\n }),\n !customState && (react_1.default.createElement(\"span\", { className: `elapsedTime ${isSettingAgentStatus ? 'elapsedTime-disabled' : ''}` },\n lastIdleStateChangeElapsedTime >= 0 ? (0, utils_1.formatTime)(lastIdleStateChangeElapsedTime) + ' / ' : '',\n (0, utils_1.formatTime)(elapsedTime))),\n react_1.default.createElement(react_2.Icon, { className: \"select-arrow-icon\", name: \"arrow-down-bold\", title: \"\" })));\n};\nexports[\"default\"] = UserStateComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/UserState/user-state.tsx?");
3156
+ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\n__webpack_require__(/*! ./user-state.scss */ \"./src/components/UserState/user-state.scss\");\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst collections_1 = __webpack_require__(/*! @react-stately/collections */ \"../../../node_modules/@react-stately/collections/dist/main.js\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nconst UserStateComponent = (props) => {\n const { idleCodes, setAgentStatus, isSettingAgentStatus, elapsedTime, lastIdleStateChangeElapsedTime, currentState, customState, } = props;\n let selectedKey;\n if (customState) {\n selectedKey = `hide-${customState.developerName}`;\n }\n else {\n selectedKey = currentState;\n }\n const items = customState\n ? [{ name: customState.name, id: `hide-${customState.developerName}`, developerName: customState.developerName }]\n : [];\n for (const item of idleCodes) {\n if (item.name === 'RONA' && item.id === currentState) {\n selectedKey = `hide-${item.id}`;\n }\n if (item.name === 'RONA' && item.id !== currentState) {\n continue; // Skip RONA unless it matches the current state\n }\n items.push(Object.assign(Object.assign({}, item), { id: item.name === 'RONA' ? `hide-${item.id}` : item.id }));\n }\n const getDropdownClass = () => {\n if (customState) {\n return 'custom'; // Custom state class\n }\n if (currentState === '0') {\n return '';\n }\n for (const item of idleCodes) {\n if (item.id === currentState && item.name === 'RONA') {\n return 'rona';\n }\n }\n return 'idle';\n };\n const getIconStyle = (item) => {\n if (item.developerName) {\n return { class: 'custom', iconName: 'busy-presence-light' };\n }\n switch (item.id) {\n case '0':\n return { class: '', iconName: 'active-presence-small-filled' };\n case item.name === 'RONA' && item.id:\n return { class: 'rona', iconName: 'dnd-presence-filled' };\n default:\n return { class: 'idle', iconName: 'recents-presence-filled' };\n }\n };\n return (react_1.default.createElement(\"div\", { className: \"user-state-container\" },\n react_1.default.createElement(react_collaboration_1.SelectNext, { label: \"\", \"aria-label\": \"user-state\", direction: \"bottom\", onSelectionChange: (key) => {\n const cleanKey = key.startsWith('hide-') ? key.substring(5) : key;\n setAgentStatus(cleanKey);\n }, showBorder: true, selectedKey: selectedKey, items: items, className: `state-select ${getDropdownClass()}` }, (item) => {\n return (react_1.default.createElement(collections_1.Item, { key: item.id, textValue: item.name },\n react_1.default.createElement(\"div\", { className: \"item-container\" },\n react_1.default.createElement(react_2.Icon, { name: getIconStyle(item).iconName, title: \"\", className: `state-icon ${getIconStyle(item).class}` }),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"state-name\", tagName: 'small' }, item.name))));\n }),\n !customState && (react_1.default.createElement(\"span\", { className: `elapsedTime ${isSettingAgentStatus ? 'elapsedTime-disabled' : ''}` },\n lastIdleStateChangeElapsedTime >= 0 ? (0, utils_1.formatTime)(lastIdleStateChangeElapsedTime) + ' / ' : '',\n (0, utils_1.formatTime)(elapsedTime))),\n react_1.default.createElement(react_2.Icon, { className: \"select-arrow-icon\", name: \"arrow-down-bold\", title: \"\" })));\n};\nexports[\"default\"] = UserStateComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/UserState/user-state.tsx?");
3157
3157
 
3158
3158
  /***/ }),
3159
3159
 
@@ -3208,7 +3208,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
3208
3208
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3209
3209
 
3210
3210
  "use strict";
3211
- eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n};\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importStar(__webpack_require__(/*! react */ \"react\"));\n__webpack_require__(/*! ./call-control.styles.scss */ \"./src/components/task/CallControl/call-control.styles.scss\");\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst collections_1 = __webpack_require__(/*! @react-stately/collections */ \"../../../node_modules/@react-stately/collections/dist/main.js\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nconst consult_transfer_popover_1 = __importDefault(__webpack_require__(/*! ./CallControlCustom/consult-transfer-popover */ \"./src/components/task/CallControl/CallControlCustom/consult-transfer-popover.tsx\"));\nfunction CallControlComponent(props) {\n const [selectedWrapupReason, setSelectedWrapupReason] = (0, react_1.useState)(null);\n const [selectedWrapupId, setSelectedWrapupId] = (0, react_1.useState)(null);\n const [showAgentMenu, setShowAgentMenu] = (0, react_1.useState)(false);\n const [agentMenuType, setAgentMenuType] = (0, react_1.useState)(null);\n const { currentTask, toggleHold, toggleRecording, endCall, wrapupCall, wrapupCodes, wrapupRequired, isHeld, setIsHeld, isRecording, setIsRecording, buddyAgents, loadBuddyAgents, queues, loadQueues, transferCall, consultCall, consultInitiated, consultAccepted, callControlAudio, setConsultAgentName, setConsultAgentId, allowConsultToQueue, setLastTargetType, } = props;\n (0, react_1.useEffect)(() => {\n if (!currentTask || !currentTask.data || !currentTask.data.interaction)\n return;\n const { interaction, mediaResourceId } = currentTask.data;\n const { media, callProcessingDetails } = interaction;\n const isHold = media && media[mediaResourceId] && media[mediaResourceId].isHold;\n setIsHeld(isHold);\n if (callProcessingDetails) {\n const { isPaused } = callProcessingDetails;\n setIsRecording(!isPaused);\n }\n }, [currentTask]);\n const handletoggleHold = () => {\n toggleHold(!isHeld);\n setIsHeld(!isHeld);\n };\n const handleWrapupCall = () => {\n if (selectedWrapupReason && selectedWrapupId) {\n wrapupCall(selectedWrapupReason, selectedWrapupId);\n setSelectedWrapupReason(null);\n setSelectedWrapupId(null);\n }\n };\n const handleWrapupChange = (text, value) => {\n setSelectedWrapupReason(text);\n setSelectedWrapupId(value);\n };\n const handleTargetSelect = (id, name, type) => {\n if (agentMenuType === 'Consult') {\n try {\n consultCall(id, type);\n setConsultAgentId(id);\n setConsultAgentName(name);\n setLastTargetType(type);\n }\n catch (error) {\n throw new Error('Error during consult call', error);\n }\n }\n else if (agentMenuType === 'Transfer') {\n try {\n transferCall(id, type);\n }\n catch (error) {\n throw new Error('Error during transfer call', error);\n }\n }\n };\n const handlePopoverOpen = (menuType) => {\n if (showAgentMenu && agentMenuType === menuType) {\n setShowAgentMenu(false);\n setAgentMenuType(null);\n }\n else {\n setAgentMenuType(menuType);\n setShowAgentMenu(true);\n loadBuddyAgents();\n loadQueues();\n }\n };\n const buttons = [\n {\n id: 'hold',\n icon: isHeld ? 'play-bold' : 'pause-bold',\n onClick: () => handletoggleHold(),\n tooltip: isHeld ? 'Resume the call' : 'Hold the call',\n className: 'call-control-button',\n disabled: false,\n },\n {\n id: 'consult',\n icon: 'headset-bold',\n tooltip: 'Consult with another agent',\n className: 'call-control-button',\n disabled: false,\n menuType: 'Consult',\n },\n {\n id: 'transfer',\n icon: 'next-bold',\n tooltip: 'Transfer call',\n className: 'call-control-button',\n disabled: false,\n menuType: 'Transfer',\n },\n {\n id: 'record',\n icon: isRecording ? 'record-paused-bold' : 'record-bold',\n onClick: () => toggleRecording(),\n tooltip: isRecording ? 'Pause Recording' : 'Resume Recording',\n className: 'call-control-button',\n disabled: false,\n },\n {\n id: 'end',\n icon: 'cancel-regular',\n onClick: endCall,\n tooltip: 'End call',\n className: 'call-control-button-cancel',\n disabled: isHeld,\n },\n ];\n const filteredButtons = consultInitiated\n ? buttons.filter((button) => !['hold', 'consult'].includes(button.id))\n : buttons;\n if (!currentTask)\n return null;\n return (react_1.default.createElement(react_1.default.Fragment, null,\n react_1.default.createElement(\"audio\", { ref: (audioElement) => {\n if (audioElement && callControlAudio) {\n audioElement.srcObject = callControlAudio;\n }\n }, id: \"remote-audio\", autoPlay: true }),\n react_1.default.createElement(\"div\", { className: \"call-control-container\", \"data-testid\": \"call-control-container\" },\n !consultAccepted && !wrapupRequired && (react_1.default.createElement(\"div\", { className: \"button-group\" }, filteredButtons.map((button, index) => {\n if (button.menuType) {\n return (react_1.default.createElement(react_collaboration_1.PopoverNext, { key: index, onHide: () => {\n setShowAgentMenu(false);\n setAgentMenuType(null);\n }, color: \"primary\", delay: [0, 0], placement: \"bottom\", showArrow: true, variant: \"medium\", interactive: true, offsetDistance: 2, className: \"agent-popover\", trigger: \"click\", closeButtonPlacement: \"top-right\", closeButtonProps: {\n 'aria-label': 'Close popover',\n onPress: () => {\n setShowAgentMenu(false);\n setAgentMenuType(null);\n },\n outline: true,\n }, triggerComponent: react_1.default.createElement(react_collaboration_1.TooltipNext, { key: index, triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonCircle, { className: button.className, \"aria-label\": button.tooltip, disabled: button.disabled || consultInitiated, \"data-testid\": \"ButtonCircle\", onPress: () => handlePopoverOpen(button.menuType) },\n react_1.default.createElement(react_2.Icon, { className: button.className + '-icon', name: button.icon })), color: \"primary\", delay: [0, 0], placement: \"bottom-start\", type: \"description\", variant: \"small\", className: \"tooltip\" },\n react_1.default.createElement(\"p\", null, button.tooltip)) }, showAgentMenu && agentMenuType === button.menuType ? (react_1.default.createElement(consult_transfer_popover_1.default, { heading: button.menuType, buttonIcon: button.icon, buddyAgents: buddyAgents, queues: queues, onAgentSelect: (agentId, agentName) => handleTargetSelect(agentId, agentName, 'agent'), onQueueSelect: (queueId, queueName) => handleTargetSelect(queueId, queueName, 'queue'), allowConsultToQueue: allowConsultToQueue })) : null));\n }\n return (react_1.default.createElement(react_collaboration_1.TooltipNext, { key: index, triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonCircle, { className: button.className, onPress: button.onClick, disabled: button.disabled || consultInitiated, \"aria-label\": button.tooltip },\n react_1.default.createElement(react_2.Icon, { className: button.className + '-icon', name: button.icon })), color: \"primary\", delay: [0, 0], placement: \"bottom-start\", type: \"description\", variant: \"small\", className: \"tooltip\" },\n react_1.default.createElement(\"p\", null, button.tooltip)));\n }))),\n wrapupRequired && (react_1.default.createElement(\"div\", { className: \"wrapup-group\" },\n react_1.default.createElement(react_collaboration_1.PopoverNext, { color: \"primary\", delay: [0, 0], placement: \"bottom-start\", showArrow: true, trigger: \"click\", triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonPill, { className: \"wrapup-button\" },\n \"Wrap up\",\n react_1.default.createElement(react_2.Icon, { name: \"arrow-down-bold\" })), variant: \"medium\", interactive: true, offsetDistance: 2, className: \"wrapup-popover\" },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-header\", tagName: 'small', type: \"body-large-bold\" }, \"Wrap-up Interaction\"),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-header\", tagName: 'small', type: \"body-secondary\" }, \"Wrap-up reason\"),\n react_1.default.createElement(react_collaboration_1.SelectNext, { \"aria-label\": \"wrapup-reason\", className: \"wrapup-select\", onSelectionChange: (key) => {\n const selectedItem = wrapupCodes === null || wrapupCodes === void 0 ? void 0 : wrapupCodes.find((code) => code.id === key);\n handleWrapupChange(selectedItem.name, selectedItem.id);\n }, items: wrapupCodes, showBorder: false, placeholder: \"Select\" }, (item) => (react_1.default.createElement(collections_1.Item, { key: item.id, textValue: item.name },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-name\", tagName: 'small' }, item.name)))),\n react_1.default.createElement(react_2.Icon, { className: \"wrapup-select-arrow-icon\", name: \"arrow-down-bold\", title: \"\" }),\n react_1.default.createElement(react_collaboration_1.ButtonPill, { className: \"submit-wrapup-button\", onPress: handleWrapupCall, disabled: selectedWrapupId && selectedWrapupReason ? false : true, \"aria-label\": \"Submit wrap-up\" }, \"Submit & Wrap up\")))))));\n}\nexports[\"default\"] = CallControlComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/CallControl/call-control.tsx?");
3211
+ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n};\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importStar(__webpack_require__(/*! react */ \"react\"));\n__webpack_require__(/*! ./call-control.styles.scss */ \"./src/components/task/CallControl/call-control.styles.scss\");\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst collections_1 = __webpack_require__(/*! @react-stately/collections */ \"../../../node_modules/@react-stately/collections/dist/main.js\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nconst consult_transfer_popover_1 = __importDefault(__webpack_require__(/*! ./CallControlCustom/consult-transfer-popover */ \"./src/components/task/CallControl/CallControlCustom/consult-transfer-popover.tsx\"));\nfunction CallControlComponent(props) {\n const [selectedWrapupReason, setSelectedWrapupReason] = (0, react_1.useState)(null);\n const [selectedWrapupId, setSelectedWrapupId] = (0, react_1.useState)(null);\n const [showAgentMenu, setShowAgentMenu] = (0, react_1.useState)(false);\n const [agentMenuType, setAgentMenuType] = (0, react_1.useState)(null);\n const { currentTask, toggleHold, toggleRecording, endCall, wrapupCall, wrapupCodes, isHeld, setIsHeld, isRecording, setIsRecording, buddyAgents, loadBuddyAgents, queues, loadQueues, transferCall, consultCall, consultInitiated, consultAccepted, callControlAudio, setConsultAgentName, setConsultAgentId, allowConsultToQueue, setLastTargetType, controlVisibility, } = props;\n (0, react_1.useEffect)(() => {\n if (!currentTask || !currentTask.data || !currentTask.data.interaction)\n return;\n const { interaction, mediaResourceId } = currentTask.data;\n const { media, callProcessingDetails } = interaction;\n const isHold = media && media[mediaResourceId] && media[mediaResourceId].isHold;\n setIsHeld(isHold);\n if (callProcessingDetails) {\n const { isPaused } = callProcessingDetails;\n setIsRecording(!isPaused);\n }\n }, [currentTask]);\n const handletoggleHold = () => {\n toggleHold(!isHeld);\n setIsHeld(!isHeld);\n };\n const handleWrapupCall = () => {\n if (selectedWrapupReason && selectedWrapupId) {\n wrapupCall(selectedWrapupReason, selectedWrapupId);\n setSelectedWrapupReason(null);\n setSelectedWrapupId(null);\n }\n };\n const handleWrapupChange = (text, value) => {\n setSelectedWrapupReason(text);\n setSelectedWrapupId(value);\n };\n const handleTargetSelect = (id, name, type) => {\n if (agentMenuType === 'Consult') {\n try {\n consultCall(id, type);\n setConsultAgentId(id);\n setConsultAgentName(name);\n setLastTargetType(type);\n }\n catch (error) {\n throw new Error('Error during consult call', error);\n }\n }\n else if (agentMenuType === 'Transfer') {\n try {\n transferCall(id, type);\n }\n catch (error) {\n throw new Error('Error during transfer call', error);\n }\n }\n };\n const handlePopoverOpen = (menuType) => {\n if (showAgentMenu && agentMenuType === menuType) {\n setShowAgentMenu(false);\n setAgentMenuType(null);\n }\n else {\n setAgentMenuType(menuType);\n setShowAgentMenu(true);\n loadBuddyAgents();\n loadQueues();\n }\n };\n const buttons = [\n {\n id: 'hold',\n icon: isHeld ? 'play-bold' : 'pause-bold',\n onClick: () => handletoggleHold(),\n tooltip: isHeld ? 'Resume the call' : 'Hold the call',\n className: 'call-control-button',\n disabled: false,\n isVisible: controlVisibility.holdResume,\n },\n {\n id: 'consult',\n icon: 'headset-bold',\n tooltip: 'Consult with another agent',\n className: 'call-control-button',\n disabled: false,\n menuType: 'Consult',\n isVisible: controlVisibility.consult,\n },\n {\n id: 'transfer',\n icon: 'next-bold',\n tooltip: 'Transfer call',\n className: 'call-control-button',\n disabled: false,\n menuType: 'Transfer',\n isVisible: controlVisibility.transfer,\n },\n {\n id: 'record',\n icon: isRecording ? 'record-paused-bold' : 'record-bold',\n onClick: () => toggleRecording(),\n tooltip: isRecording ? 'Pause Recording' : 'Resume Recording',\n className: 'call-control-button',\n disabled: false,\n isVisible: controlVisibility.pauseResumeRecording,\n },\n {\n id: 'end',\n icon: 'cancel-regular',\n onClick: endCall,\n tooltip: 'End call',\n className: 'call-control-button-cancel',\n disabled: isHeld,\n isVisible: controlVisibility.end,\n },\n ];\n const filteredButtons = consultInitiated\n ? buttons.filter((button) => !['hold', 'consult'].includes(button.id))\n : buttons;\n if (!currentTask)\n return null;\n return (react_1.default.createElement(react_1.default.Fragment, null,\n react_1.default.createElement(\"audio\", { ref: (audioElement) => {\n if (audioElement && callControlAudio) {\n audioElement.srcObject = callControlAudio;\n }\n }, id: \"remote-audio\", autoPlay: true }),\n react_1.default.createElement(\"div\", { className: \"call-control-container\", \"data-testid\": \"call-control-container\" },\n !consultAccepted && !controlVisibility.wrapup && (react_1.default.createElement(\"div\", { className: \"button-group\" }, filteredButtons.map((button, index) => {\n if (!button.isVisible)\n return null;\n if (button.menuType) {\n return (react_1.default.createElement(react_collaboration_1.PopoverNext, { key: index, onHide: () => {\n setShowAgentMenu(false);\n setAgentMenuType(null);\n }, color: \"primary\", delay: [0, 0], placement: \"bottom\", showArrow: true, variant: \"medium\", interactive: true, offsetDistance: 2, className: \"agent-popover\", trigger: \"click\", closeButtonPlacement: \"top-right\", closeButtonProps: {\n 'aria-label': 'Close popover',\n onPress: () => {\n setShowAgentMenu(false);\n setAgentMenuType(null);\n },\n outline: true,\n }, triggerComponent: react_1.default.createElement(react_collaboration_1.TooltipNext, { key: index, triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonCircle, { className: button.className, \"aria-label\": button.tooltip, disabled: button.disabled || consultInitiated, \"data-testid\": \"ButtonCircle\", onPress: () => handlePopoverOpen(button.menuType) },\n react_1.default.createElement(react_2.Icon, { className: button.className + '-icon', name: button.icon })), color: \"primary\", delay: [0, 0], placement: \"bottom-start\", type: \"description\", variant: \"small\", className: \"tooltip\" },\n react_1.default.createElement(\"p\", null, button.tooltip)) }, showAgentMenu && agentMenuType === button.menuType ? (react_1.default.createElement(consult_transfer_popover_1.default, { heading: button.menuType, buttonIcon: button.icon, buddyAgents: buddyAgents, queues: queues, onAgentSelect: (agentId, agentName) => handleTargetSelect(agentId, agentName, 'agent'), onQueueSelect: (queueId, queueName) => handleTargetSelect(queueId, queueName, 'queue'), allowConsultToQueue: allowConsultToQueue })) : null));\n }\n return (react_1.default.createElement(react_collaboration_1.TooltipNext, { key: index, triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonCircle, { className: button.className, onPress: button.onClick, disabled: button.disabled || consultInitiated, \"aria-label\": button.tooltip },\n react_1.default.createElement(react_2.Icon, { className: button.className + '-icon', name: button.icon })), color: \"primary\", delay: [0, 0], placement: \"bottom-start\", type: \"description\", variant: \"small\", className: \"tooltip\" },\n react_1.default.createElement(\"p\", null, button.tooltip)));\n }))),\n controlVisibility.wrapup && (react_1.default.createElement(\"div\", { className: \"wrapup-group\" },\n react_1.default.createElement(react_collaboration_1.PopoverNext, { color: \"primary\", delay: [0, 0], placement: \"bottom-start\", showArrow: true, trigger: \"click\", triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonPill, { className: \"wrapup-button\" },\n \"Wrap up\",\n react_1.default.createElement(react_2.Icon, { name: \"arrow-down-bold\" })), variant: \"medium\", interactive: true, offsetDistance: 2, className: \"wrapup-popover\" },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-header\", tagName: 'small', type: \"body-large-bold\" }, \"Wrap-up Interaction\"),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-header\", tagName: 'small', type: \"body-secondary\" }, \"Wrap-up reason\"),\n react_1.default.createElement(react_collaboration_1.SelectNext, { \"aria-label\": \"wrapup-reason\", className: \"wrapup-select\", onSelectionChange: (key) => {\n const selectedItem = wrapupCodes === null || wrapupCodes === void 0 ? void 0 : wrapupCodes.find((code) => code.id === key);\n handleWrapupChange(selectedItem.name, selectedItem.id);\n }, items: wrapupCodes, showBorder: false, placeholder: \"Select\" }, (item) => (react_1.default.createElement(collections_1.Item, { key: item.id, textValue: item.name },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-name\", tagName: 'small' }, item.name)))),\n react_1.default.createElement(react_2.Icon, { className: \"wrapup-select-arrow-icon\", name: \"arrow-down-bold\", title: \"\" }),\n react_1.default.createElement(react_collaboration_1.ButtonPill, { className: \"submit-wrapup-button\", onPress: handleWrapupCall, disabled: selectedWrapupId && selectedWrapupReason ? false : true, \"aria-label\": \"Submit wrap-up\" }, \"Submit & Wrap up\")))))));\n}\nexports[\"default\"] = CallControlComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/CallControl/call-control.tsx?");
3212
3212
 
3213
3213
  /***/ }),
3214
3214
 
@@ -3219,7 +3219,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
3219
3219
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3220
3220
 
3221
3221
  "use strict";
3222
- eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst call_control_1 = __importDefault(__webpack_require__(/*! ../CallControl/call-control */ \"./src/components/task/CallControl/call-control.tsx\"));\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\n__webpack_require__(/*! ./call-control-cad.styles.scss */ \"./src/components/task/CallControlCAD/call-control-cad.styles.scss\");\nconst index_1 = __importDefault(__webpack_require__(/*! ../TaskTimer/index */ \"./src/components/task/TaskTimer/index.tsx\"));\nconst call_control_consult_1 = __importDefault(__webpack_require__(/*! ../CallControl/CallControlCustom/call-control-consult */ \"./src/components/task/CallControl/CallControlCustom/call-control-consult.tsx\"));\nconst CallControlCADComponent = (props) => {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;\n const { currentTask, isHeld, isRecording, holdTime, wrapupRequired, consultAccepted, consultInitiated, consultAgentName, consultStartTimeStamp, endConsultCall, consultAgentId, consultCompleted, consultTransfer, callControlClassName, callControlConsultClassName, startTimestamp, isEndConsultEnabled, lastTargetType, } = props;\n // Use the Web Worker-based hold timer\n const formatTime = (time) => {\n const minutes = Math.floor((time % 3600) / 60);\n const seconds = time % 60;\n return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n };\n if (!currentTask)\n return null;\n return (react_1.default.createElement(react_1.default.Fragment, null,\n react_1.default.createElement(\"div\", { className: `call-control-container ${callControlClassName || ''}` },\n react_1.default.createElement(\"div\", { className: \"caller-info\" },\n react_1.default.createElement(\"div\", { className: \"call-icon-background\" },\n react_1.default.createElement(react_2.Icon, { name: \"handset-filled\", size: 1, className: \"call-icon\" })),\n react_1.default.createElement(\"div\", { className: \"customer-info\" },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"customer-id\", type: \"body-large-bold\", tagName: 'small' }, ((_c = (_b = (_a = currentTask === null || currentTask === void 0 ? void 0 : currentTask.data) === null || _a === void 0 ? void 0 : _a.interaction) === null || _b === void 0 ? void 0 : _b.callAssociatedDetails) === null || _c === void 0 ? void 0 : _c.ani) || 'No Caller ID'),\n react_1.default.createElement(\"div\", { className: \"call-details\" },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"call-timer\", type: \"body-secondary\", tagName: 'small' },\n \"Call - \",\n react_1.default.createElement(index_1.default, { startTimeStamp: startTimestamp })),\n react_1.default.createElement(\"div\", { className: \"call-status\" }, !wrapupRequired && isHeld && (react_1.default.createElement(react_1.default.Fragment, null,\n react_1.default.createElement(\"span\", { className: \"dot\" }, \"\\u2022\"),\n react_1.default.createElement(\"div\", { className: \"on-hold\" },\n react_1.default.createElement(react_2.Icon, { name: \"call-hold-filled\", size: 1, className: \"call-hold-filled-icon\" }),\n react_1.default.createElement(\"span\", { className: \"on-hold-chip-text\" },\n \"On hold - \",\n formatTime(holdTime))))))))),\n !wrapupRequired && (react_1.default.createElement(\"div\", { className: \"recording-indicator\" },\n react_1.default.createElement(react_2.Icon, { name: isRecording ? 'record-active-badge-filled' : 'record-paused-badge-filled', size: 1.3 }))),\n react_1.default.createElement(call_control_1.default, Object.assign({}, props)),\n react_1.default.createElement(\"div\", { className: \"cad-variables\" },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"queue\", type: \"body-secondary\", tagName: 'small' },\n react_1.default.createElement(\"strong\", null, \"Queue:\"),\n ' ',\n react_1.default.createElement(\"span\", null, ((_f = (_e = (_d = currentTask === null || currentTask === void 0 ? void 0 : currentTask.data) === null || _d === void 0 ? void 0 : _d.interaction) === null || _e === void 0 ? void 0 : _e.callAssociatedDetails) === null || _f === void 0 ? void 0 : _f.virtualTeamName) || 'No Team Name')),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"phone-number\", type: \"body-secondary\", tagName: 'small' },\n react_1.default.createElement(\"strong\", null, \"Phone number:\"),\n ' ',\n react_1.default.createElement(\"span\", null, ((_j = (_h = (_g = currentTask === null || currentTask === void 0 ? void 0 : currentTask.data) === null || _g === void 0 ? void 0 : _g.interaction) === null || _h === void 0 ? void 0 : _h.callAssociatedDetails) === null || _j === void 0 ? void 0 : _j.ani) || 'No Phone Number')),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"rona\", type: \"body-secondary\", tagName: 'small' },\n react_1.default.createElement(\"strong\", null, \"RONA:\"),\n ' ',\n react_1.default.createElement(\"span\", null, ((_m = (_l = (_k = currentTask === null || currentTask === void 0 ? void 0 : currentTask.data) === null || _k === void 0 ? void 0 : _k.interaction) === null || _l === void 0 ? void 0 : _l.callAssociatedDetails) === null || _m === void 0 ? void 0 : _m.ronaTimeout) || 'No RONA')))),\n (consultAccepted || consultInitiated) && !wrapupRequired && (react_1.default.createElement(\"div\", { className: `call-control-consult-container ${callControlConsultClassName || ''}` },\n react_1.default.createElement(call_control_consult_1.default, { agentName: consultAgentName, startTimeStamp: consultStartTimeStamp, endConsultCall: endConsultCall, onTransfer: () => consultTransfer(consultAgentId || currentTask.data.destAgentId, lastTargetType), consultCompleted: consultCompleted, isAgentBeingConsulted: !consultAccepted, isEndConsultEnabled: isEndConsultEnabled })))));\n};\nexports[\"default\"] = CallControlCADComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/CallControlCAD/call-control-cad.tsx?");
3222
+ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst call_control_1 = __importDefault(__webpack_require__(/*! ../CallControl/call-control */ \"./src/components/task/CallControl/call-control.tsx\"));\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\n__webpack_require__(/*! ./call-control-cad.styles.scss */ \"./src/components/task/CallControlCAD/call-control-cad.styles.scss\");\nconst index_1 = __importDefault(__webpack_require__(/*! ../TaskTimer/index */ \"./src/components/task/TaskTimer/index.tsx\"));\nconst call_control_consult_1 = __importDefault(__webpack_require__(/*! ../CallControl/CallControlCustom/call-control-consult */ \"./src/components/task/CallControl/CallControlCustom/call-control-consult.tsx\"));\nconst CallControlCADComponent = (props) => {\n var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;\n const { currentTask, isHeld, isRecording, holdTime, consultAccepted, consultInitiated, consultAgentName, consultStartTimeStamp, endConsultCall, consultAgentId, consultCompleted, consultTransfer, callControlClassName, callControlConsultClassName, startTimestamp, isEndConsultEnabled, lastTargetType, controlVisibility, } = props;\n // Use the Web Worker-based hold timer\n const formatTime = (time) => {\n const minutes = Math.floor((time % 3600) / 60);\n const seconds = time % 60;\n return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n };\n if (!currentTask)\n return null;\n return (react_1.default.createElement(react_1.default.Fragment, null,\n react_1.default.createElement(\"div\", { className: `call-control-container ${callControlClassName || ''}` },\n react_1.default.createElement(\"div\", { className: \"caller-info\" },\n react_1.default.createElement(\"div\", { className: \"call-icon-background\" },\n react_1.default.createElement(react_2.Icon, { name: \"handset-filled\", size: 1, className: \"call-icon\" })),\n react_1.default.createElement(\"div\", { className: \"customer-info\" },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"customer-id\", type: \"body-large-bold\", tagName: 'small' }, ((_c = (_b = (_a = currentTask === null || currentTask === void 0 ? void 0 : currentTask.data) === null || _a === void 0 ? void 0 : _a.interaction) === null || _b === void 0 ? void 0 : _b.callAssociatedDetails) === null || _c === void 0 ? void 0 : _c.ani) || 'No Caller ID'),\n react_1.default.createElement(\"div\", { className: \"call-details\" },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"call-timer\", type: \"body-secondary\", tagName: 'small' },\n \"Call - \",\n react_1.default.createElement(index_1.default, { startTimeStamp: startTimestamp })),\n react_1.default.createElement(\"div\", { className: \"call-status\" }, !controlVisibility.wrapup && isHeld && (react_1.default.createElement(react_1.default.Fragment, null,\n react_1.default.createElement(\"span\", { className: \"dot\" }, \"\\u2022\"),\n react_1.default.createElement(\"div\", { className: \"on-hold\" },\n react_1.default.createElement(react_2.Icon, { name: \"call-hold-filled\", size: 1, className: \"call-hold-filled-icon\" }),\n react_1.default.createElement(\"span\", { className: \"on-hold-chip-text\" },\n \"On hold - \",\n formatTime(holdTime))))))))),\n !controlVisibility.wrapup && controlVisibility.recordingIndicator && (react_1.default.createElement(\"div\", { className: \"recording-indicator\" },\n react_1.default.createElement(react_2.Icon, { name: isRecording ? 'record-active-badge-filled' : 'record-paused-badge-filled', size: 1.3 }))),\n react_1.default.createElement(call_control_1.default, Object.assign({}, props)),\n react_1.default.createElement(\"div\", { className: \"cad-variables\" },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"queue\", type: \"body-secondary\", tagName: 'small' },\n react_1.default.createElement(\"strong\", null, \"Queue:\"),\n ' ',\n react_1.default.createElement(\"span\", null, ((_f = (_e = (_d = currentTask === null || currentTask === void 0 ? void 0 : currentTask.data) === null || _d === void 0 ? void 0 : _d.interaction) === null || _e === void 0 ? void 0 : _e.callAssociatedDetails) === null || _f === void 0 ? void 0 : _f.virtualTeamName) || 'No Team Name')),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"phone-number\", type: \"body-secondary\", tagName: 'small' },\n react_1.default.createElement(\"strong\", null, \"Phone number:\"),\n ' ',\n react_1.default.createElement(\"span\", null, ((_j = (_h = (_g = currentTask === null || currentTask === void 0 ? void 0 : currentTask.data) === null || _g === void 0 ? void 0 : _g.interaction) === null || _h === void 0 ? void 0 : _h.callAssociatedDetails) === null || _j === void 0 ? void 0 : _j.ani) || 'No Phone Number')),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"rona\", type: \"body-secondary\", tagName: 'small' },\n react_1.default.createElement(\"strong\", null, \"RONA:\"),\n ' ',\n react_1.default.createElement(\"span\", null, ((_m = (_l = (_k = currentTask === null || currentTask === void 0 ? void 0 : currentTask.data) === null || _k === void 0 ? void 0 : _k.interaction) === null || _l === void 0 ? void 0 : _l.callAssociatedDetails) === null || _m === void 0 ? void 0 : _m.ronaTimeout) || 'No RONA')))),\n (consultAccepted || consultInitiated) && !controlVisibility.wrapup && (react_1.default.createElement(\"div\", { className: `call-control-consult-container ${callControlConsultClassName || ''}` },\n react_1.default.createElement(call_control_consult_1.default, { agentName: consultAgentName, startTimeStamp: consultStartTimeStamp, endConsultCall: endConsultCall, onTransfer: () => consultTransfer(consultAgentId || currentTask.data.destAgentId, lastTargetType), consultCompleted: consultCompleted, isAgentBeingConsulted: !consultAccepted, isEndConsultEnabled: isEndConsultEnabled })))));\n};\nexports[\"default\"] = CallControlCADComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/CallControlCAD/call-control-cad.tsx?");
3223
3223
 
3224
3224
  /***/ }),
3225
3225
 
@@ -3230,7 +3230,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
3230
3230
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3231
3231
 
3232
3232
  "use strict";
3233
- eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst Task_1 = __importDefault(__webpack_require__(/*! ../Task */ \"./src/components/task/Task/index.tsx\"));\nconst IncomingTaskComponent = (props) => {\n var _a, _b, _c, _d;\n const { incomingTask, accept, decline, isBrowser } = props;\n if (!incomingTask) {\n return react_1.default.createElement(react_1.default.Fragment, null); // hidden component\n }\n const callAssociationDetails = (_b = (_a = incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data) === null || _a === void 0 ? void 0 : _a.interaction) === null || _b === void 0 ? void 0 : _b.callAssociatedDetails;\n const ani = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ani;\n const virtualTeamName = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.virtualTeamName;\n // rona timeout is not always available in the callAssociatedDetails object\n const ronaTimeout = (callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) ? Number(callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) : null;\n const startTimeStamp = (_d = (_c = incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data) === null || _c === void 0 ? void 0 : _c.interaction) === null || _d === void 0 ? void 0 : _d.createdTimestamp;\n return (react_1.default.createElement(Task_1.default, { title: ani, queue: virtualTeamName, isIncomingTask: true, isBrowser: isBrowser, acceptTask: accept, declineTask: decline, ronaTimeout: ronaTimeout, startTimeStamp: startTimeStamp }));\n};\nexports[\"default\"] = IncomingTaskComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/IncomingTask/incoming-task.tsx?");
3233
+ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst Task_1 = __importDefault(__webpack_require__(/*! ../Task */ \"./src/components/task/Task/index.tsx\"));\nconst IncomingTaskComponent = (props) => {\n var _a, _b, _c, _d;\n const { incomingTask, accept, decline } = props;\n if (!incomingTask) {\n return react_1.default.createElement(react_1.default.Fragment, null); // hidden component\n }\n const callAssociationDetails = (_b = (_a = incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data) === null || _a === void 0 ? void 0 : _a.interaction) === null || _b === void 0 ? void 0 : _b.callAssociatedDetails;\n const ani = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ani;\n const virtualTeamName = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.virtualTeamName;\n // rona timeout is not always available in the callAssociatedDetails object\n const ronaTimeout = (callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) ? Number(callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) : null;\n const startTimeStamp = (_d = (_c = incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data) === null || _c === void 0 ? void 0 : _c.interaction) === null || _d === void 0 ? void 0 : _d.createdTimestamp;\n return (react_1.default.createElement(Task_1.default, { title: ani, queue: virtualTeamName, isIncomingTask: true, acceptTask: accept, declineTask: decline, ronaTimeout: ronaTimeout, startTimeStamp: startTimeStamp }));\n};\nexports[\"default\"] = IncomingTaskComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/IncomingTask/incoming-task.tsx?");
3234
3234
 
3235
3235
  /***/ }),
3236
3236
 
@@ -3252,7 +3252,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
3252
3252
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3253
3253
 
3254
3254
  "use strict";
3255
- eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nconst TaskTimer_1 = __importDefault(__webpack_require__(/*! ../TaskTimer */ \"./src/components/task/TaskTimer/index.tsx\"));\n__webpack_require__(/*! ./styles.scss */ \"./src/components/task/Task/styles.scss\");\nconst Task = ({ title, state, startTimeStamp, ronaTimeout, selected = false, isIncomingTask = false, queue, acceptTask, declineTask, isBrowser, }) => {\n const capitalizeFirstWord = (str) => {\n return str.replace(/^\\s*(\\w)/, (match, firstLetter) => firstLetter.toUpperCase());\n };\n return (react_1.default.createElement(react_collaboration_1.ListItemBase, { className: `task-list-item ${selected ? 'task-list-item--selected' : ''}` },\n react_1.default.createElement(react_collaboration_1.ListItemBaseSection, { position: \"start\" },\n react_1.default.createElement(react_2.Avatar, { \"icon-name\": \"handset-filled\" })),\n react_1.default.createElement(react_collaboration_1.ListItemBaseSection, { position: \"fill\" },\n react_1.default.createElement(\"section\", { className: \"task-details\" },\n title && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: selected ? 'body-large-bold' : 'body-large-medium' }, title)),\n state && !isIncomingTask && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" }, capitalizeFirstWord(state))),\n queue && isIncomingTask && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" }, capitalizeFirstWord(queue))),\n (isIncomingTask && !ronaTimeout) || !isIncomingTask\n ? startTimeStamp && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" },\n \"Handle Time: \",\n ' ',\n react_1.default.createElement(TaskTimer_1.default, { startTimeStamp: startTimeStamp })))\n : null,\n isIncomingTask && ronaTimeout && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" },\n \"Time Left: \",\n ' ',\n react_1.default.createElement(TaskTimer_1.default, { countdown: true, ronaTimeout: ronaTimeout }))))),\n react_1.default.createElement(react_collaboration_1.ListItemBaseSection, { position: \"end\" }, isIncomingTask ? (react_1.default.createElement(react_collaboration_1.ButtonPill, { onPress: acceptTask, color: \"join\", disabled: !isBrowser }, \"Ringing\")) : isBrowser ? (react_1.default.createElement(react_collaboration_1.ButtonPill, { onPress: declineTask, color: \"cancel\" }, \"End\")) : null)));\n};\nexports[\"default\"] = Task;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/Task/index.tsx?");
3255
+ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nconst TaskTimer_1 = __importDefault(__webpack_require__(/*! ../TaskTimer */ \"./src/components/task/TaskTimer/index.tsx\"));\n__webpack_require__(/*! ./styles.scss */ \"./src/components/task/Task/styles.scss\");\nconst Task = ({ title, state, startTimeStamp, ronaTimeout, selected = false, isIncomingTask = false, queue, acceptTask, declineTask, interactionId, onTaskSelect, acceptText, disableAccept = false, declineText, }) => {\n const capitalizeFirstWord = (str) => {\n return str.replace(/^\\s*(\\w)/, (match, firstLetter) => firstLetter.toUpperCase());\n };\n return (react_1.default.createElement(react_collaboration_1.ListItemBase, { className: `task-list-item ${selected ? 'task-list-item--selected' : ''}`, onPress: onTaskSelect ? onTaskSelect : undefined, id: interactionId },\n react_1.default.createElement(react_collaboration_1.ListItemBaseSection, { position: \"start\" },\n react_1.default.createElement(react_2.Avatar, { \"icon-name\": \"handset-filled\" })),\n react_1.default.createElement(react_collaboration_1.ListItemBaseSection, { position: \"fill\" },\n react_1.default.createElement(\"section\", { className: \"task-details\" },\n title && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: selected ? 'body-large-bold' : 'body-large-medium' }, title)),\n state && !isIncomingTask && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" }, capitalizeFirstWord(state))),\n queue && isIncomingTask && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" }, capitalizeFirstWord(queue))),\n (isIncomingTask && !ronaTimeout) || !isIncomingTask\n ? startTimeStamp && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" },\n \"Handle Time: \",\n ' ',\n react_1.default.createElement(TaskTimer_1.default, { startTimeStamp: startTimeStamp })))\n : null,\n isIncomingTask && ronaTimeout && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" },\n \"Time Left: \",\n ' ',\n react_1.default.createElement(TaskTimer_1.default, { countdown: true, ronaTimeout: ronaTimeout }))))),\n react_1.default.createElement(react_collaboration_1.ListItemBaseSection, { position: \"end\" },\n react_1.default.createElement(\"div\", { className: \"task-button-container\" },\n acceptText ? (react_1.default.createElement(react_collaboration_1.ButtonPill, { onPress: acceptTask, color: \"join\", disabled: disableAccept }, acceptText)) : null,\n declineText ? (react_1.default.createElement(react_collaboration_1.ButtonPill, { onPress: declineTask, color: \"cancel\" }, declineText)) : null))));\n};\nexports[\"default\"] = Task;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/Task/index.tsx?");
3256
3256
 
3257
3257
  /***/ }),
3258
3258
 
@@ -3263,7 +3263,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
3263
3263
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3264
3264
 
3265
3265
  "use strict";
3266
- eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst Task_1 = __importDefault(__webpack_require__(/*! ../Task */ \"./src/components/task/Task/index.tsx\"));\n__webpack_require__(/*! ./styles.scss */ \"./src/components/task/TaskList/styles.scss\");\nconst TaskListComponent = (props) => {\n const { currentTask, taskList, acceptTask, declineTask, isBrowser } = props;\n if (taskList.length <= 0) {\n return react_1.default.createElement(react_1.default.Fragment, null); // hidden component\n }\n return (react_1.default.createElement(\"ul\", { className: \"task-list\" }, taskList === null || taskList === void 0 ? void 0 : taskList.map((task, index) => {\n var _a, _b;\n const callAssociationDetails = (_b = (_a = task === null || task === void 0 ? void 0 : task.data) === null || _a === void 0 ? void 0 : _a.interaction) === null || _b === void 0 ? void 0 : _b.callAssociatedDetails;\n const ani = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ani;\n const virtualTeamName = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.virtualTeamName;\n // rona timeout is not always available in the callAssociatedDetails object\n const ronaTimeout = (callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) ? Number(callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) : null;\n const taskState = task.data.interaction.state;\n const startTimeStamp = task.data.interaction.createdTimestamp;\n const isIncomingTask = taskState === 'new';\n return (react_1.default.createElement(Task_1.default, { title: ani, state: !isIncomingTask ? taskState : '', startTimeStamp: startTimeStamp, selected: (currentTask === null || currentTask === void 0 ? void 0 : currentTask.data.interactionId) === task.data.interactionId, key: index, isIncomingTask: isIncomingTask, queue: virtualTeamName, acceptTask: () => acceptTask(task), declineTask: () => declineTask(task), isBrowser: isBrowser, ronaTimeout: isIncomingTask ? ronaTimeout : null }));\n })));\n};\nexports[\"default\"] = TaskListComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/TaskList/task-list.tsx?");
3266
+ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst Task_1 = __importDefault(__webpack_require__(/*! ../Task */ \"./src/components/task/Task/index.tsx\"));\n__webpack_require__(/*! ./styles.scss */ \"./src/components/task/TaskList/styles.scss\");\nconst TaskListComponent = (props) => {\n var _a;\n const { currentTask, taskList, acceptTask, declineTask, isBrowser, onTaskSelect } = props;\n if (!taskList || Object.keys(taskList).length === 0) {\n return react_1.default.createElement(react_1.default.Fragment, null); // hidden component\n }\n return (react_1.default.createElement(\"ul\", { className: \"task-list\" }, (_a = Object.values(taskList)) === null || _a === void 0 ? void 0 : _a.map((task, index) => {\n var _a, _b;\n const callAssociationDetails = (_b = (_a = task === null || task === void 0 ? void 0 : task.data) === null || _a === void 0 ? void 0 : _a.interaction) === null || _b === void 0 ? void 0 : _b.callAssociatedDetails;\n const ani = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ani;\n const virtualTeamName = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.virtualTeamName;\n // rona timeout is not always available in the callAssociatedDetails object\n const ronaTimeout = (callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) ? Number(callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) : null;\n const taskState = task.data.interaction.state;\n const startTimeStamp = task.data.interaction.createdTimestamp;\n const isIncomingTask = taskState === 'new' || taskState === 'consult';\n const isTelephony = task.data.interaction.mediaType === 'telephony';\n const acceptText = isIncomingTask && !task.data.wrapUpRequired ? (isTelephony && !isBrowser ? 'Ringing' : 'Accept') : undefined;\n const declineText = isIncomingTask && !task.data.wrapUpRequired && isTelephony && isBrowser ? 'Decline' : undefined;\n return (react_1.default.createElement(Task_1.default, { interactionId: task.data.interactionId, title: ani, state: !isIncomingTask ? taskState : '', startTimeStamp: startTimeStamp, selected: (currentTask === null || currentTask === void 0 ? void 0 : currentTask.data.interactionId) === task.data.interactionId, key: index, isIncomingTask: isIncomingTask, queue: virtualTeamName, acceptTask: () => acceptTask(task), declineTask: () => declineTask(task), ronaTimeout: isIncomingTask ? ronaTimeout : null, onTaskSelect: () => {\n if ((currentTask === null || currentTask === void 0 ? void 0 : currentTask.data.interactionId) !== task.data.interactionId &&\n !(isIncomingTask && !task.data.wrapUpRequired)) {\n onTaskSelect(task);\n }\n }, acceptText: acceptText, disableAccept: isIncomingTask && isTelephony && !isBrowser, declineText: declineText }));\n })));\n};\nexports[\"default\"] = TaskListComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/TaskList/task-list.tsx?");
3267
3267
 
3268
3268
  /***/ }),
3269
3269
 
@@ -3274,7 +3274,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
3274
3274
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3275
3275
 
3276
3276
  "use strict";
3277
- eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importStar(__webpack_require__(/*! react */ \"react\"));\nconst workerScript = `\n const formatDuration = (seconds) => {\n seconds = Math.max(0, seconds);\n const h = Math.floor(seconds / 3600).toString().padStart(2, '0');\n const m = Math.floor((seconds % 3600) / 60).toString().padStart(2, '0');\n const s = Math.floor(seconds % 60).toString().padStart(2, '0');\n return seconds < 3600 ? m + ':' + s : h + ':' + m + ':' + s;\n }\n\n self.onmessage = function(e) {\n const { start, countdown, ronaTimeout } = e.data;\n let running = true;\n\n const updateTimer = () => {\n if (!running) {\n return;\n }\n\n const now = Math.floor(Date.now() / 1000); // current time in seconds\n let diff;\n\n if (countdown && ronaTimeout !== undefined) {\n diff = start + ronaTimeout - now;\n if (diff <= 0) {\n self.postMessage('00:00');\n running = false;\n return;\n }\n } else {\n diff = now - start;\n }\n\n const formattedTime = formatDuration(diff);\n\n self.postMessage(formattedTime);\n setTimeout(updateTimer, 1000);\n };\n\n updateTimer();\n };\n`;\nconst createWorker = () => {\n return new Worker(URL.createObjectURL(new Blob([workerScript], { type: 'application/javascript' })));\n};\nconst TaskTimer = ({ startTimeStamp, countdown = false, ronaTimeout }) => {\n const [duration, setDuration] = (0, react_1.useState)('00:00');\n const workerRef = (0, react_1.useRef)(null);\n (0, react_1.useEffect)(() => {\n // Convert startTimeStamp from milliseconds to seconds if provided to match ronaTimeout, which is in seconds\n const now = Math.floor(Date.now() / 1000);\n const start = startTimeStamp ? Math.floor(startTimeStamp / 1000) : now;\n if (!workerRef.current) {\n workerRef.current = createWorker();\n }\n workerRef.current.postMessage({ start, countdown, ronaTimeout });\n const handleMessage = (e) => {\n setDuration(e.data);\n };\n workerRef.current.addEventListener('message', handleMessage);\n return () => {\n var _a;\n (_a = workerRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('message', handleMessage);\n };\n }, [countdown, ronaTimeout, startTimeStamp]);\n return (react_1.default.createElement(\"time\", { dateTime: duration, className: \"task-text task-text--secondary\" }, duration));\n};\nexports[\"default\"] = TaskTimer;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/TaskTimer/index.tsx?");
3277
+ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importStar(__webpack_require__(/*! react */ \"react\"));\nconst workerScript = `\n const formatDuration = (seconds) => {\n seconds = Math.max(0, seconds);\n const h = Math.floor(seconds / 3600).toString().padStart(2, '0');\n const m = Math.floor((seconds % 3600) / 60).toString().padStart(2, '0');\n const s = Math.floor(seconds % 60).toString().padStart(2, '0');\n return seconds < 3600 ? m + ':' + s : h + ':' + m + ':' + s;\n }\n\n const timers = {};\n\n self.onmessage = function(e) {\n const { type, name, start, countdown, ronaTimeout } = e.data;\n\n if (type === 'start') {\n if (timers[name]) {\n return; // Timer with this name is already running\n }\n\n let running = true;\n\n const updateTimer = () => {\n if (!running) {\n return;\n }\n\n const now = Math.floor(Date.now() / 1000); // current time in seconds\n let diff;\n\n if (countdown && ronaTimeout !== undefined) {\n diff = start + ronaTimeout - now;\n if (diff <= 0) {\n self.postMessage({ name, time: '00:00' });\n running = false;\n delete timers[name];\n return;\n }\n } else {\n diff = now - start;\n }\n\n const formattedTime = formatDuration(diff);\n self.postMessage({ name, time: formattedTime });\n timers[name] = setTimeout(updateTimer, 1000);\n };\n\n updateTimer();\n } else if (type === 'stop') {\n if (timers[name]) {\n clearTimeout(timers[name]);\n delete timers[name];\n }\n }\n };\n`;\nconst createWorker = () => {\n return new Worker(URL.createObjectURL(new Blob([workerScript], { type: 'application/javascript' })));\n};\nconst TaskTimer = ({ startTimeStamp, countdown = false, ronaTimeout }) => {\n const [duration, setDuration] = (0, react_1.useState)('00:00');\n const workerRef = (0, react_1.useRef)(null);\n const timerName = (0, react_1.useRef)(`timer-${Date.now()}`); // Unique name for the timer\n (0, react_1.useEffect)(() => {\n const now = Math.floor(Date.now() / 1000);\n const start = startTimeStamp ? Math.floor(startTimeStamp / 1000) : now;\n if (!workerRef.current) {\n workerRef.current = createWorker();\n }\n workerRef.current.postMessage({ type: 'start', name: timerName.current, start, countdown, ronaTimeout });\n const handleMessage = (e) => {\n if (e.data.name === timerName.current) {\n setDuration(e.data.time);\n }\n };\n workerRef.current.addEventListener('message', handleMessage);\n return () => {\n var _a;\n workerRef.current.postMessage({ type: 'stop', name: timerName.current });\n (_a = workerRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('message', handleMessage);\n };\n }, [countdown, ronaTimeout, startTimeStamp]);\n return (react_1.default.createElement(\"time\", { dateTime: duration, className: \"task-text task-text--secondary\" }, duration));\n};\nexports[\"default\"] = TaskTimer;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/TaskTimer/index.tsx?");
3278
3278
 
3279
3279
  /***/ }),
3280
3280
 
@@ -3300,14 +3300,14 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
3300
3300
 
3301
3301
  /***/ }),
3302
3302
 
3303
- /***/ "./src/utils.ts":
3304
- /*!**********************!*\
3305
- !*** ./src/utils.ts ***!
3306
- \**********************/
3303
+ /***/ "./src/utils/index.ts":
3304
+ /*!****************************!*\
3305
+ !*** ./src/utils/index.ts ***!
3306
+ \****************************/
3307
3307
  /***/ ((__unused_webpack_module, exports) => {
3308
3308
 
3309
3309
  "use strict";
3310
- eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.formatTime = void 0;\nconst formatTime = (time) => {\n const hours = Math.floor(time / 3600);\n const minutes = Math.floor((time % 3600) / 60);\n const seconds = time % 60;\n return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds\n .toString()\n .padStart(2, '0')}`;\n};\nexports.formatTime = formatTime;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/utils.ts?");
3310
+ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.formatTime = void 0;\nconst formatTime = (time) => {\n const hours = Math.floor(time / 3600);\n const minutes = Math.floor((time % 3600) / 60);\n const seconds = time % 60;\n return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds\n .toString()\n .padStart(2, '0')}`;\n};\nexports.formatTime = formatTime;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/utils/index.ts?");
3311
3311
 
3312
3312
  /***/ }),
3313
3313
 
package/dist/types/components/task/Task/index.d.ts CHANGED
@@ -2,6 +2,7 @@ import React from 'react';
2
2
  import { PressEvent } from '@react-types/shared';
3
3
  import './styles.scss';
4
4
  interface TaskProps {
5
+ interactionId?: string;
5
6
  title?: string;
6
7
  state?: string;
7
8
  startTimeStamp?: number;
@@ -11,7 +12,10 @@ interface TaskProps {
11
12
  queue?: string;
12
13
  acceptTask?: (e: PressEvent) => void;
13
14
  declineTask?: (e: PressEvent) => void;
14
- isBrowser?: boolean;
15
+ onTaskSelect?: (e: PressEvent) => void;
16
+ acceptText?: string;
17
+ declineText?: string;
18
+ disableAccept?: boolean;
15
19
  }
16
20
  declare const Task: React.FC<TaskProps>;
17
21
  export default Task;
package/dist/types/components/task/task.types.d.ts CHANGED
@@ -47,6 +47,10 @@ export interface TaskProps {
47
47
  * decline task from tasklist
48
48
  */
49
49
  declineTask: (task: ITask) => void;
50
+ /**
51
+ * Function to handle task selection
52
+ */
53
+ onTaskSelect: (task: ITask) => void;
50
54
  /**
51
55
  * Flag to determine if the user is logged in with a browser option
52
56
  */
@@ -66,14 +70,14 @@ export interface TaskProps {
66
70
  /**
67
71
  * List of tasks
68
72
  */
69
- taskList: ITask[];
73
+ taskList: Record<string, ITask>;
70
74
  /**
71
75
  * The logger instance from SDK
72
76
  */
73
77
  logger: ILogger;
74
78
  }
75
79
  export type IncomingTaskComponentProps = Pick<TaskProps, 'incomingTask' | 'isBrowser' | 'accept' | 'decline'>;
76
- export type TaskListComponentProps = Pick<TaskProps, 'currentTask' | 'taskList' | 'isBrowser' | 'acceptTask' | 'declineTask'>;
80
+ export type TaskListComponentProps = Pick<TaskProps, 'currentTask' | 'taskList' | 'isBrowser' | 'acceptTask' | 'declineTask' | 'onTaskSelect'>;
77
81
  /**
78
82
  * Interface representing the properties for control actions on a task.
79
83
  */
@@ -225,6 +229,12 @@ export interface ControlProps {
225
229
  * Time since the task is in held state
226
230
  */
227
231
  holdTime: number;
232
+ /**
233
+ * Feature flags for the task.
234
+ */
235
+ featureFlags: {
236
+ [key: string]: boolean;
237
+ };
228
238
  /**
229
239
  * Custom CSS ClassName for CallControlCAD component.
230
240
  */
@@ -261,8 +271,22 @@ export interface ControlProps {
261
271
  * Function to set the last target type
262
272
  */
263
273
  setLastTargetType: (targetType: 'queue' | 'agent') => void;
274
+ controlVisibility: {
275
+ accept: boolean;
276
+ decline: boolean;
277
+ end: boolean;
278
+ muteUnmute: boolean;
279
+ holdResume: boolean;
280
+ consult: boolean;
281
+ transfer: boolean;
282
+ conference: boolean;
283
+ wrapup: boolean;
284
+ pauseResumeRecording: boolean;
285
+ endConsult: boolean;
286
+ recordingIndicator: boolean;
287
+ };
264
288
  }
265
- export type CallControlComponentProps = Pick<ControlProps, 'currentTask' | 'wrapupCodes' | 'wrapupRequired' | 'toggleHold' | 'toggleRecording' | 'endCall' | 'wrapupCall' | 'isHeld' | 'setIsHeld' | 'isRecording' | 'setIsRecording' | 'buddyAgents' | 'loadBuddyAgents' | 'transferCall' | 'consultCall' | 'endConsultCall' | 'consultInitiated' | 'consultTransfer' | 'consultCompleted' | 'consultAccepted' | 'consultStartTimeStamp' | 'callControlAudio' | 'consultAgentName' | 'setConsultAgentName' | 'consultAgentId' | 'setConsultAgentId' | 'holdTime' | 'callControlClassName' | 'callControlConsultClassName' | 'startTimestamp' | 'queues' | 'loadQueues' | 'isEndConsultEnabled' | 'allowConsultToQueue' | 'lastTargetType' | 'setLastTargetType'>;
289
+ export type CallControlComponentProps = Pick<ControlProps, 'currentTask' | 'wrapupCodes' | 'toggleHold' | 'toggleRecording' | 'endCall' | 'wrapupCall' | 'isHeld' | 'setIsHeld' | 'isRecording' | 'setIsRecording' | 'buddyAgents' | 'loadBuddyAgents' | 'transferCall' | 'consultCall' | 'endConsultCall' | 'consultInitiated' | 'consultTransfer' | 'consultCompleted' | 'consultAccepted' | 'consultStartTimeStamp' | 'callControlAudio' | 'consultAgentName' | 'setConsultAgentName' | 'consultAgentId' | 'setConsultAgentId' | 'holdTime' | 'callControlClassName' | 'callControlConsultClassName' | 'startTimestamp' | 'queues' | 'loadQueues' | 'isEndConsultEnabled' | 'allowConsultToQueue' | 'lastTargetType' | 'setLastTargetType' | 'controlVisibility'>;
266
290
  /**
267
291
  * Interface representing the properties for OutdialCall component.
268
292
  */
package/dist/wc.js CHANGED
@@ -2922,7 +2922,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
2922
2922
  /***/ ((module, __webpack_exports__, __webpack_require__) => {
2923
2923
 
2924
2924
  "use strict";
2925
- eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../../../../../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"../../../node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../../node_modules/css-loader/dist/runtime/api.js */ \"../../../node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:root {\n --mds-color-theme-avatar-glass-normal: rgba(0, 0, 0, 0.07);\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --mds-color-theme-avatar-glass-normal: rgba(255, 255, 255, 0.07);\n }\n}\n.task-list-item {\n display: flex;\n padding: 0.5rem 0.75rem;\n align-items: center;\n align-self: stretch;\n height: 5rem !important;\n}\n.task-list-item mdc-avatar {\n --mdc-avatar-default-background-color: var(--mds-color-theme-avatar-glass-normal);\n --mdc-avatar-default-foreground-color: var(--mds-color-theme-indicator-stable);\n}\n\n.task-text {\n color: var(--mds-color-theme-text-secondary-normal);\n}\n\n.task-list-item--selected {\n background: var(--mds-color-theme-background-primary-active);\n}\n.task-list-item--selected mdc-avatar {\n --mdc-avatar-default-background-color: var(--mds-color-theme-avatar-glass-active, rgba(255, 255, 255, 0.8));\n}`, \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/Task/styles.scss?../../../node_modules/css-loader/dist/cjs.js!../../../node_modules/sass-loader/dist/cjs.js");
2925
+ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../../../../../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"../../../node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../../node_modules/css-loader/dist/runtime/api.js */ \"../../../node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:root {\n --mds-color-theme-avatar-glass-normal: rgba(0, 0, 0, 0.07);\n}\n\n@media (prefers-color-scheme: dark) {\n :root {\n --mds-color-theme-avatar-glass-normal: rgba(255, 255, 255, 0.07);\n }\n}\n.task-list-item {\n display: flex;\n padding: 0.5rem 0.75rem;\n align-items: center;\n align-self: stretch;\n height: 5rem !important;\n}\n.task-list-item mdc-avatar {\n --mdc-avatar-default-background-color: var(--mds-color-theme-avatar-glass-normal);\n --mdc-avatar-default-foreground-color: var(--mds-color-theme-indicator-stable);\n}\n\n.task-text {\n color: var(--mds-color-theme-text-secondary-normal);\n}\n\n.task-list-item--selected {\n background: var(--mds-color-theme-background-primary-active);\n}\n.task-list-item--selected mdc-avatar {\n --mdc-avatar-default-background-color: var(--mds-color-theme-avatar-glass-active, rgba(255, 255, 255, 0.8));\n}\n\n.task-button-container {\n display: flex;\n flex-direction: row;\n gap: 8px;\n}`, \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/Task/styles.scss?../../../node_modules/css-loader/dist/cjs.js!../../../node_modules/sass-loader/dist/cjs.js");
2926
2926
 
2927
2927
  /***/ }),
2928
2928
 
@@ -3131,7 +3131,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
3131
3131
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3132
3132
 
3133
3133
  "use strict";
3134
- eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils.ts\");\n__webpack_require__(/*! ./user-state.scss */ \"./src/components/UserState/user-state.scss\");\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst collections_1 = __webpack_require__(/*! @react-stately/collections */ \"../../../node_modules/@react-stately/collections/dist/main.js\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nconst UserStateComponent = (props) => {\n const { idleCodes, setAgentStatus, isSettingAgentStatus, elapsedTime, lastIdleStateChangeElapsedTime, currentState, customState, } = props;\n let selectedKey;\n if (customState) {\n selectedKey = `hide-${customState.developerName}`;\n }\n else {\n selectedKey = currentState;\n }\n const items = customState\n ? [{ name: customState.name, id: `hide-${customState.developerName}`, developerName: customState.developerName }]\n : [];\n for (const item of idleCodes) {\n if (item.name === 'RONA' && item.id === currentState) {\n selectedKey = `hide-${item.id}`;\n }\n if (item.name === 'RONA' && item.id !== currentState) {\n continue; // Skip RONA unless it matches the current state\n }\n items.push(Object.assign(Object.assign({}, item), { id: item.name === 'RONA' ? `hide-${item.id}` : item.id }));\n }\n const getDropdownClass = () => {\n if (customState) {\n return 'custom'; // Custom state class\n }\n if (currentState === '0') {\n return '';\n }\n for (const item of idleCodes) {\n if (item.id === currentState && item.name === 'RONA') {\n return 'rona';\n }\n }\n return 'idle';\n };\n const getIconStyle = (item) => {\n if (item.developerName) {\n return { class: 'custom', iconName: 'busy-presence-light' };\n }\n switch (item.id) {\n case '0':\n return { class: '', iconName: 'active-presence-small-filled' };\n case item.name === 'RONA' && item.id:\n return { class: 'rona', iconName: 'dnd-presence-filled' };\n default:\n return { class: 'idle', iconName: 'recents-presence-filled' };\n }\n };\n return (react_1.default.createElement(\"div\", { className: \"user-state-container\" },\n react_1.default.createElement(react_collaboration_1.SelectNext, { label: \"\", \"aria-label\": \"user-state\", direction: \"bottom\", onSelectionChange: (key) => {\n const cleanKey = key.startsWith('hide-') ? key.substring(5) : key;\n setAgentStatus(cleanKey);\n }, showBorder: true, selectedKey: selectedKey, items: items, className: `state-select ${getDropdownClass()}` }, (item) => {\n return (react_1.default.createElement(collections_1.Item, { key: item.id, textValue: item.name },\n react_1.default.createElement(\"div\", { className: \"item-container\" },\n react_1.default.createElement(react_2.Icon, { name: getIconStyle(item).iconName, title: \"\", className: `state-icon ${getIconStyle(item).class}` }),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"state-name\", tagName: 'small' }, item.name))));\n }),\n !customState && (react_1.default.createElement(\"span\", { className: `elapsedTime ${isSettingAgentStatus ? 'elapsedTime-disabled' : ''}` },\n lastIdleStateChangeElapsedTime >= 0 ? (0, utils_1.formatTime)(lastIdleStateChangeElapsedTime) + ' / ' : '',\n (0, utils_1.formatTime)(elapsedTime))),\n react_1.default.createElement(react_2.Icon, { className: \"select-arrow-icon\", name: \"arrow-down-bold\", title: \"\" })));\n};\nexports[\"default\"] = UserStateComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/UserState/user-state.tsx?");
3134
+ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst utils_1 = __webpack_require__(/*! ../../utils */ \"./src/utils/index.ts\");\n__webpack_require__(/*! ./user-state.scss */ \"./src/components/UserState/user-state.scss\");\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst collections_1 = __webpack_require__(/*! @react-stately/collections */ \"../../../node_modules/@react-stately/collections/dist/main.js\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nconst UserStateComponent = (props) => {\n const { idleCodes, setAgentStatus, isSettingAgentStatus, elapsedTime, lastIdleStateChangeElapsedTime, currentState, customState, } = props;\n let selectedKey;\n if (customState) {\n selectedKey = `hide-${customState.developerName}`;\n }\n else {\n selectedKey = currentState;\n }\n const items = customState\n ? [{ name: customState.name, id: `hide-${customState.developerName}`, developerName: customState.developerName }]\n : [];\n for (const item of idleCodes) {\n if (item.name === 'RONA' && item.id === currentState) {\n selectedKey = `hide-${item.id}`;\n }\n if (item.name === 'RONA' && item.id !== currentState) {\n continue; // Skip RONA unless it matches the current state\n }\n items.push(Object.assign(Object.assign({}, item), { id: item.name === 'RONA' ? `hide-${item.id}` : item.id }));\n }\n const getDropdownClass = () => {\n if (customState) {\n return 'custom'; // Custom state class\n }\n if (currentState === '0') {\n return '';\n }\n for (const item of idleCodes) {\n if (item.id === currentState && item.name === 'RONA') {\n return 'rona';\n }\n }\n return 'idle';\n };\n const getIconStyle = (item) => {\n if (item.developerName) {\n return { class: 'custom', iconName: 'busy-presence-light' };\n }\n switch (item.id) {\n case '0':\n return { class: '', iconName: 'active-presence-small-filled' };\n case item.name === 'RONA' && item.id:\n return { class: 'rona', iconName: 'dnd-presence-filled' };\n default:\n return { class: 'idle', iconName: 'recents-presence-filled' };\n }\n };\n return (react_1.default.createElement(\"div\", { className: \"user-state-container\" },\n react_1.default.createElement(react_collaboration_1.SelectNext, { label: \"\", \"aria-label\": \"user-state\", direction: \"bottom\", onSelectionChange: (key) => {\n const cleanKey = key.startsWith('hide-') ? key.substring(5) : key;\n setAgentStatus(cleanKey);\n }, showBorder: true, selectedKey: selectedKey, items: items, className: `state-select ${getDropdownClass()}` }, (item) => {\n return (react_1.default.createElement(collections_1.Item, { key: item.id, textValue: item.name },\n react_1.default.createElement(\"div\", { className: \"item-container\" },\n react_1.default.createElement(react_2.Icon, { name: getIconStyle(item).iconName, title: \"\", className: `state-icon ${getIconStyle(item).class}` }),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"state-name\", tagName: 'small' }, item.name))));\n }),\n !customState && (react_1.default.createElement(\"span\", { className: `elapsedTime ${isSettingAgentStatus ? 'elapsedTime-disabled' : ''}` },\n lastIdleStateChangeElapsedTime >= 0 ? (0, utils_1.formatTime)(lastIdleStateChangeElapsedTime) + ' / ' : '',\n (0, utils_1.formatTime)(elapsedTime))),\n react_1.default.createElement(react_2.Icon, { className: \"select-arrow-icon\", name: \"arrow-down-bold\", title: \"\" })));\n};\nexports[\"default\"] = UserStateComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/UserState/user-state.tsx?");
3135
3135
 
3136
3136
  /***/ }),
3137
3137
 
@@ -3164,7 +3164,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
3164
3164
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3165
3165
 
3166
3166
  "use strict";
3167
- eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n};\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importStar(__webpack_require__(/*! react */ \"react\"));\n__webpack_require__(/*! ./call-control.styles.scss */ \"./src/components/task/CallControl/call-control.styles.scss\");\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst collections_1 = __webpack_require__(/*! @react-stately/collections */ \"../../../node_modules/@react-stately/collections/dist/main.js\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nconst consult_transfer_popover_1 = __importDefault(__webpack_require__(/*! ./CallControlCustom/consult-transfer-popover */ \"./src/components/task/CallControl/CallControlCustom/consult-transfer-popover.tsx\"));\nfunction CallControlComponent(props) {\n const [selectedWrapupReason, setSelectedWrapupReason] = (0, react_1.useState)(null);\n const [selectedWrapupId, setSelectedWrapupId] = (0, react_1.useState)(null);\n const [showAgentMenu, setShowAgentMenu] = (0, react_1.useState)(false);\n const [agentMenuType, setAgentMenuType] = (0, react_1.useState)(null);\n const { currentTask, toggleHold, toggleRecording, endCall, wrapupCall, wrapupCodes, wrapupRequired, isHeld, setIsHeld, isRecording, setIsRecording, buddyAgents, loadBuddyAgents, queues, loadQueues, transferCall, consultCall, consultInitiated, consultAccepted, callControlAudio, setConsultAgentName, setConsultAgentId, allowConsultToQueue, setLastTargetType, } = props;\n (0, react_1.useEffect)(() => {\n if (!currentTask || !currentTask.data || !currentTask.data.interaction)\n return;\n const { interaction, mediaResourceId } = currentTask.data;\n const { media, callProcessingDetails } = interaction;\n const isHold = media && media[mediaResourceId] && media[mediaResourceId].isHold;\n setIsHeld(isHold);\n if (callProcessingDetails) {\n const { isPaused } = callProcessingDetails;\n setIsRecording(!isPaused);\n }\n }, [currentTask]);\n const handletoggleHold = () => {\n toggleHold(!isHeld);\n setIsHeld(!isHeld);\n };\n const handleWrapupCall = () => {\n if (selectedWrapupReason && selectedWrapupId) {\n wrapupCall(selectedWrapupReason, selectedWrapupId);\n setSelectedWrapupReason(null);\n setSelectedWrapupId(null);\n }\n };\n const handleWrapupChange = (text, value) => {\n setSelectedWrapupReason(text);\n setSelectedWrapupId(value);\n };\n const handleTargetSelect = (id, name, type) => {\n if (agentMenuType === 'Consult') {\n try {\n consultCall(id, type);\n setConsultAgentId(id);\n setConsultAgentName(name);\n setLastTargetType(type);\n }\n catch (error) {\n throw new Error('Error during consult call', error);\n }\n }\n else if (agentMenuType === 'Transfer') {\n try {\n transferCall(id, type);\n }\n catch (error) {\n throw new Error('Error during transfer call', error);\n }\n }\n };\n const handlePopoverOpen = (menuType) => {\n if (showAgentMenu && agentMenuType === menuType) {\n setShowAgentMenu(false);\n setAgentMenuType(null);\n }\n else {\n setAgentMenuType(menuType);\n setShowAgentMenu(true);\n loadBuddyAgents();\n loadQueues();\n }\n };\n const buttons = [\n {\n id: 'hold',\n icon: isHeld ? 'play-bold' : 'pause-bold',\n onClick: () => handletoggleHold(),\n tooltip: isHeld ? 'Resume the call' : 'Hold the call',\n className: 'call-control-button',\n disabled: false,\n },\n {\n id: 'consult',\n icon: 'headset-bold',\n tooltip: 'Consult with another agent',\n className: 'call-control-button',\n disabled: false,\n menuType: 'Consult',\n },\n {\n id: 'transfer',\n icon: 'next-bold',\n tooltip: 'Transfer call',\n className: 'call-control-button',\n disabled: false,\n menuType: 'Transfer',\n },\n {\n id: 'record',\n icon: isRecording ? 'record-paused-bold' : 'record-bold',\n onClick: () => toggleRecording(),\n tooltip: isRecording ? 'Pause Recording' : 'Resume Recording',\n className: 'call-control-button',\n disabled: false,\n },\n {\n id: 'end',\n icon: 'cancel-regular',\n onClick: endCall,\n tooltip: 'End call',\n className: 'call-control-button-cancel',\n disabled: isHeld,\n },\n ];\n const filteredButtons = consultInitiated\n ? buttons.filter((button) => !['hold', 'consult'].includes(button.id))\n : buttons;\n if (!currentTask)\n return null;\n return (react_1.default.createElement(react_1.default.Fragment, null,\n react_1.default.createElement(\"audio\", { ref: (audioElement) => {\n if (audioElement && callControlAudio) {\n audioElement.srcObject = callControlAudio;\n }\n }, id: \"remote-audio\", autoPlay: true }),\n react_1.default.createElement(\"div\", { className: \"call-control-container\", \"data-testid\": \"call-control-container\" },\n !consultAccepted && !wrapupRequired && (react_1.default.createElement(\"div\", { className: \"button-group\" }, filteredButtons.map((button, index) => {\n if (button.menuType) {\n return (react_1.default.createElement(react_collaboration_1.PopoverNext, { key: index, onHide: () => {\n setShowAgentMenu(false);\n setAgentMenuType(null);\n }, color: \"primary\", delay: [0, 0], placement: \"bottom\", showArrow: true, variant: \"medium\", interactive: true, offsetDistance: 2, className: \"agent-popover\", trigger: \"click\", closeButtonPlacement: \"top-right\", closeButtonProps: {\n 'aria-label': 'Close popover',\n onPress: () => {\n setShowAgentMenu(false);\n setAgentMenuType(null);\n },\n outline: true,\n }, triggerComponent: react_1.default.createElement(react_collaboration_1.TooltipNext, { key: index, triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonCircle, { className: button.className, \"aria-label\": button.tooltip, disabled: button.disabled || consultInitiated, \"data-testid\": \"ButtonCircle\", onPress: () => handlePopoverOpen(button.menuType) },\n react_1.default.createElement(react_2.Icon, { className: button.className + '-icon', name: button.icon })), color: \"primary\", delay: [0, 0], placement: \"bottom-start\", type: \"description\", variant: \"small\", className: \"tooltip\" },\n react_1.default.createElement(\"p\", null, button.tooltip)) }, showAgentMenu && agentMenuType === button.menuType ? (react_1.default.createElement(consult_transfer_popover_1.default, { heading: button.menuType, buttonIcon: button.icon, buddyAgents: buddyAgents, queues: queues, onAgentSelect: (agentId, agentName) => handleTargetSelect(agentId, agentName, 'agent'), onQueueSelect: (queueId, queueName) => handleTargetSelect(queueId, queueName, 'queue'), allowConsultToQueue: allowConsultToQueue })) : null));\n }\n return (react_1.default.createElement(react_collaboration_1.TooltipNext, { key: index, triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonCircle, { className: button.className, onPress: button.onClick, disabled: button.disabled || consultInitiated, \"aria-label\": button.tooltip },\n react_1.default.createElement(react_2.Icon, { className: button.className + '-icon', name: button.icon })), color: \"primary\", delay: [0, 0], placement: \"bottom-start\", type: \"description\", variant: \"small\", className: \"tooltip\" },\n react_1.default.createElement(\"p\", null, button.tooltip)));\n }))),\n wrapupRequired && (react_1.default.createElement(\"div\", { className: \"wrapup-group\" },\n react_1.default.createElement(react_collaboration_1.PopoverNext, { color: \"primary\", delay: [0, 0], placement: \"bottom-start\", showArrow: true, trigger: \"click\", triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonPill, { className: \"wrapup-button\" },\n \"Wrap up\",\n react_1.default.createElement(react_2.Icon, { name: \"arrow-down-bold\" })), variant: \"medium\", interactive: true, offsetDistance: 2, className: \"wrapup-popover\" },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-header\", tagName: 'small', type: \"body-large-bold\" }, \"Wrap-up Interaction\"),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-header\", tagName: 'small', type: \"body-secondary\" }, \"Wrap-up reason\"),\n react_1.default.createElement(react_collaboration_1.SelectNext, { \"aria-label\": \"wrapup-reason\", className: \"wrapup-select\", onSelectionChange: (key) => {\n const selectedItem = wrapupCodes === null || wrapupCodes === void 0 ? void 0 : wrapupCodes.find((code) => code.id === key);\n handleWrapupChange(selectedItem.name, selectedItem.id);\n }, items: wrapupCodes, showBorder: false, placeholder: \"Select\" }, (item) => (react_1.default.createElement(collections_1.Item, { key: item.id, textValue: item.name },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-name\", tagName: 'small' }, item.name)))),\n react_1.default.createElement(react_2.Icon, { className: \"wrapup-select-arrow-icon\", name: \"arrow-down-bold\", title: \"\" }),\n react_1.default.createElement(react_collaboration_1.ButtonPill, { className: \"submit-wrapup-button\", onPress: handleWrapupCall, disabled: selectedWrapupId && selectedWrapupReason ? false : true, \"aria-label\": \"Submit wrap-up\" }, \"Submit & Wrap up\")))))));\n}\nexports[\"default\"] = CallControlComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/CallControl/call-control.tsx?");
3167
+ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n};\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importStar(__webpack_require__(/*! react */ \"react\"));\n__webpack_require__(/*! ./call-control.styles.scss */ \"./src/components/task/CallControl/call-control.styles.scss\");\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst collections_1 = __webpack_require__(/*! @react-stately/collections */ \"../../../node_modules/@react-stately/collections/dist/main.js\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nconst consult_transfer_popover_1 = __importDefault(__webpack_require__(/*! ./CallControlCustom/consult-transfer-popover */ \"./src/components/task/CallControl/CallControlCustom/consult-transfer-popover.tsx\"));\nfunction CallControlComponent(props) {\n const [selectedWrapupReason, setSelectedWrapupReason] = (0, react_1.useState)(null);\n const [selectedWrapupId, setSelectedWrapupId] = (0, react_1.useState)(null);\n const [showAgentMenu, setShowAgentMenu] = (0, react_1.useState)(false);\n const [agentMenuType, setAgentMenuType] = (0, react_1.useState)(null);\n const { currentTask, toggleHold, toggleRecording, endCall, wrapupCall, wrapupCodes, isHeld, setIsHeld, isRecording, setIsRecording, buddyAgents, loadBuddyAgents, queues, loadQueues, transferCall, consultCall, consultInitiated, consultAccepted, callControlAudio, setConsultAgentName, setConsultAgentId, allowConsultToQueue, setLastTargetType, controlVisibility, } = props;\n (0, react_1.useEffect)(() => {\n if (!currentTask || !currentTask.data || !currentTask.data.interaction)\n return;\n const { interaction, mediaResourceId } = currentTask.data;\n const { media, callProcessingDetails } = interaction;\n const isHold = media && media[mediaResourceId] && media[mediaResourceId].isHold;\n setIsHeld(isHold);\n if (callProcessingDetails) {\n const { isPaused } = callProcessingDetails;\n setIsRecording(!isPaused);\n }\n }, [currentTask]);\n const handletoggleHold = () => {\n toggleHold(!isHeld);\n setIsHeld(!isHeld);\n };\n const handleWrapupCall = () => {\n if (selectedWrapupReason && selectedWrapupId) {\n wrapupCall(selectedWrapupReason, selectedWrapupId);\n setSelectedWrapupReason(null);\n setSelectedWrapupId(null);\n }\n };\n const handleWrapupChange = (text, value) => {\n setSelectedWrapupReason(text);\n setSelectedWrapupId(value);\n };\n const handleTargetSelect = (id, name, type) => {\n if (agentMenuType === 'Consult') {\n try {\n consultCall(id, type);\n setConsultAgentId(id);\n setConsultAgentName(name);\n setLastTargetType(type);\n }\n catch (error) {\n throw new Error('Error during consult call', error);\n }\n }\n else if (agentMenuType === 'Transfer') {\n try {\n transferCall(id, type);\n }\n catch (error) {\n throw new Error('Error during transfer call', error);\n }\n }\n };\n const handlePopoverOpen = (menuType) => {\n if (showAgentMenu && agentMenuType === menuType) {\n setShowAgentMenu(false);\n setAgentMenuType(null);\n }\n else {\n setAgentMenuType(menuType);\n setShowAgentMenu(true);\n loadBuddyAgents();\n loadQueues();\n }\n };\n const buttons = [\n {\n id: 'hold',\n icon: isHeld ? 'play-bold' : 'pause-bold',\n onClick: () => handletoggleHold(),\n tooltip: isHeld ? 'Resume the call' : 'Hold the call',\n className: 'call-control-button',\n disabled: false,\n isVisible: controlVisibility.holdResume,\n },\n {\n id: 'consult',\n icon: 'headset-bold',\n tooltip: 'Consult with another agent',\n className: 'call-control-button',\n disabled: false,\n menuType: 'Consult',\n isVisible: controlVisibility.consult,\n },\n {\n id: 'transfer',\n icon: 'next-bold',\n tooltip: 'Transfer call',\n className: 'call-control-button',\n disabled: false,\n menuType: 'Transfer',\n isVisible: controlVisibility.transfer,\n },\n {\n id: 'record',\n icon: isRecording ? 'record-paused-bold' : 'record-bold',\n onClick: () => toggleRecording(),\n tooltip: isRecording ? 'Pause Recording' : 'Resume Recording',\n className: 'call-control-button',\n disabled: false,\n isVisible: controlVisibility.pauseResumeRecording,\n },\n {\n id: 'end',\n icon: 'cancel-regular',\n onClick: endCall,\n tooltip: 'End call',\n className: 'call-control-button-cancel',\n disabled: isHeld,\n isVisible: controlVisibility.end,\n },\n ];\n const filteredButtons = consultInitiated\n ? buttons.filter((button) => !['hold', 'consult'].includes(button.id))\n : buttons;\n if (!currentTask)\n return null;\n return (react_1.default.createElement(react_1.default.Fragment, null,\n react_1.default.createElement(\"audio\", { ref: (audioElement) => {\n if (audioElement && callControlAudio) {\n audioElement.srcObject = callControlAudio;\n }\n }, id: \"remote-audio\", autoPlay: true }),\n react_1.default.createElement(\"div\", { className: \"call-control-container\", \"data-testid\": \"call-control-container\" },\n !consultAccepted && !controlVisibility.wrapup && (react_1.default.createElement(\"div\", { className: \"button-group\" }, filteredButtons.map((button, index) => {\n if (!button.isVisible)\n return null;\n if (button.menuType) {\n return (react_1.default.createElement(react_collaboration_1.PopoverNext, { key: index, onHide: () => {\n setShowAgentMenu(false);\n setAgentMenuType(null);\n }, color: \"primary\", delay: [0, 0], placement: \"bottom\", showArrow: true, variant: \"medium\", interactive: true, offsetDistance: 2, className: \"agent-popover\", trigger: \"click\", closeButtonPlacement: \"top-right\", closeButtonProps: {\n 'aria-label': 'Close popover',\n onPress: () => {\n setShowAgentMenu(false);\n setAgentMenuType(null);\n },\n outline: true,\n }, triggerComponent: react_1.default.createElement(react_collaboration_1.TooltipNext, { key: index, triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonCircle, { className: button.className, \"aria-label\": button.tooltip, disabled: button.disabled || consultInitiated, \"data-testid\": \"ButtonCircle\", onPress: () => handlePopoverOpen(button.menuType) },\n react_1.default.createElement(react_2.Icon, { className: button.className + '-icon', name: button.icon })), color: \"primary\", delay: [0, 0], placement: \"bottom-start\", type: \"description\", variant: \"small\", className: \"tooltip\" },\n react_1.default.createElement(\"p\", null, button.tooltip)) }, showAgentMenu && agentMenuType === button.menuType ? (react_1.default.createElement(consult_transfer_popover_1.default, { heading: button.menuType, buttonIcon: button.icon, buddyAgents: buddyAgents, queues: queues, onAgentSelect: (agentId, agentName) => handleTargetSelect(agentId, agentName, 'agent'), onQueueSelect: (queueId, queueName) => handleTargetSelect(queueId, queueName, 'queue'), allowConsultToQueue: allowConsultToQueue })) : null));\n }\n return (react_1.default.createElement(react_collaboration_1.TooltipNext, { key: index, triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonCircle, { className: button.className, onPress: button.onClick, disabled: button.disabled || consultInitiated, \"aria-label\": button.tooltip },\n react_1.default.createElement(react_2.Icon, { className: button.className + '-icon', name: button.icon })), color: \"primary\", delay: [0, 0], placement: \"bottom-start\", type: \"description\", variant: \"small\", className: \"tooltip\" },\n react_1.default.createElement(\"p\", null, button.tooltip)));\n }))),\n controlVisibility.wrapup && (react_1.default.createElement(\"div\", { className: \"wrapup-group\" },\n react_1.default.createElement(react_collaboration_1.PopoverNext, { color: \"primary\", delay: [0, 0], placement: \"bottom-start\", showArrow: true, trigger: \"click\", triggerComponent: react_1.default.createElement(react_collaboration_1.ButtonPill, { className: \"wrapup-button\" },\n \"Wrap up\",\n react_1.default.createElement(react_2.Icon, { name: \"arrow-down-bold\" })), variant: \"medium\", interactive: true, offsetDistance: 2, className: \"wrapup-popover\" },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-header\", tagName: 'small', type: \"body-large-bold\" }, \"Wrap-up Interaction\"),\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-header\", tagName: 'small', type: \"body-secondary\" }, \"Wrap-up reason\"),\n react_1.default.createElement(react_collaboration_1.SelectNext, { \"aria-label\": \"wrapup-reason\", className: \"wrapup-select\", onSelectionChange: (key) => {\n const selectedItem = wrapupCodes === null || wrapupCodes === void 0 ? void 0 : wrapupCodes.find((code) => code.id === key);\n handleWrapupChange(selectedItem.name, selectedItem.id);\n }, items: wrapupCodes, showBorder: false, placeholder: \"Select\" }, (item) => (react_1.default.createElement(collections_1.Item, { key: item.id, textValue: item.name },\n react_1.default.createElement(react_collaboration_1.Text, { className: \"wrapup-name\", tagName: 'small' }, item.name)))),\n react_1.default.createElement(react_2.Icon, { className: \"wrapup-select-arrow-icon\", name: \"arrow-down-bold\", title: \"\" }),\n react_1.default.createElement(react_collaboration_1.ButtonPill, { className: \"submit-wrapup-button\", onPress: handleWrapupCall, disabled: selectedWrapupId && selectedWrapupReason ? false : true, \"aria-label\": \"Submit wrap-up\" }, \"Submit & Wrap up\")))))));\n}\nexports[\"default\"] = CallControlComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/CallControl/call-control.tsx?");
3168
3168
 
3169
3169
  /***/ }),
3170
3170
 
@@ -3175,7 +3175,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
3175
3175
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3176
3176
 
3177
3177
  "use strict";
3178
- eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst Task_1 = __importDefault(__webpack_require__(/*! ../Task */ \"./src/components/task/Task/index.tsx\"));\nconst IncomingTaskComponent = (props) => {\n var _a, _b, _c, _d;\n const { incomingTask, accept, decline, isBrowser } = props;\n if (!incomingTask) {\n return react_1.default.createElement(react_1.default.Fragment, null); // hidden component\n }\n const callAssociationDetails = (_b = (_a = incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data) === null || _a === void 0 ? void 0 : _a.interaction) === null || _b === void 0 ? void 0 : _b.callAssociatedDetails;\n const ani = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ani;\n const virtualTeamName = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.virtualTeamName;\n // rona timeout is not always available in the callAssociatedDetails object\n const ronaTimeout = (callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) ? Number(callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) : null;\n const startTimeStamp = (_d = (_c = incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data) === null || _c === void 0 ? void 0 : _c.interaction) === null || _d === void 0 ? void 0 : _d.createdTimestamp;\n return (react_1.default.createElement(Task_1.default, { title: ani, queue: virtualTeamName, isIncomingTask: true, isBrowser: isBrowser, acceptTask: accept, declineTask: decline, ronaTimeout: ronaTimeout, startTimeStamp: startTimeStamp }));\n};\nexports[\"default\"] = IncomingTaskComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/IncomingTask/incoming-task.tsx?");
3178
+ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst Task_1 = __importDefault(__webpack_require__(/*! ../Task */ \"./src/components/task/Task/index.tsx\"));\nconst IncomingTaskComponent = (props) => {\n var _a, _b, _c, _d;\n const { incomingTask, accept, decline } = props;\n if (!incomingTask) {\n return react_1.default.createElement(react_1.default.Fragment, null); // hidden component\n }\n const callAssociationDetails = (_b = (_a = incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data) === null || _a === void 0 ? void 0 : _a.interaction) === null || _b === void 0 ? void 0 : _b.callAssociatedDetails;\n const ani = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ani;\n const virtualTeamName = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.virtualTeamName;\n // rona timeout is not always available in the callAssociatedDetails object\n const ronaTimeout = (callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) ? Number(callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) : null;\n const startTimeStamp = (_d = (_c = incomingTask === null || incomingTask === void 0 ? void 0 : incomingTask.data) === null || _c === void 0 ? void 0 : _c.interaction) === null || _d === void 0 ? void 0 : _d.createdTimestamp;\n return (react_1.default.createElement(Task_1.default, { title: ani, queue: virtualTeamName, isIncomingTask: true, acceptTask: accept, declineTask: decline, ronaTimeout: ronaTimeout, startTimeStamp: startTimeStamp }));\n};\nexports[\"default\"] = IncomingTaskComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/IncomingTask/incoming-task.tsx?");
3179
3179
 
3180
3180
  /***/ }),
3181
3181
 
@@ -3197,7 +3197,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
3197
3197
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3198
3198
 
3199
3199
  "use strict";
3200
- eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nconst TaskTimer_1 = __importDefault(__webpack_require__(/*! ../TaskTimer */ \"./src/components/task/TaskTimer/index.tsx\"));\n__webpack_require__(/*! ./styles.scss */ \"./src/components/task/Task/styles.scss\");\nconst Task = ({ title, state, startTimeStamp, ronaTimeout, selected = false, isIncomingTask = false, queue, acceptTask, declineTask, isBrowser, }) => {\n const capitalizeFirstWord = (str) => {\n return str.replace(/^\\s*(\\w)/, (match, firstLetter) => firstLetter.toUpperCase());\n };\n return (react_1.default.createElement(react_collaboration_1.ListItemBase, { className: `task-list-item ${selected ? 'task-list-item--selected' : ''}` },\n react_1.default.createElement(react_collaboration_1.ListItemBaseSection, { position: \"start\" },\n react_1.default.createElement(react_2.Avatar, { \"icon-name\": \"handset-filled\" })),\n react_1.default.createElement(react_collaboration_1.ListItemBaseSection, { position: \"fill\" },\n react_1.default.createElement(\"section\", { className: \"task-details\" },\n title && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: selected ? 'body-large-bold' : 'body-large-medium' }, title)),\n state && !isIncomingTask && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" }, capitalizeFirstWord(state))),\n queue && isIncomingTask && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" }, capitalizeFirstWord(queue))),\n (isIncomingTask && !ronaTimeout) || !isIncomingTask\n ? startTimeStamp && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" },\n \"Handle Time: \",\n ' ',\n react_1.default.createElement(TaskTimer_1.default, { startTimeStamp: startTimeStamp })))\n : null,\n isIncomingTask && ronaTimeout && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" },\n \"Time Left: \",\n ' ',\n react_1.default.createElement(TaskTimer_1.default, { countdown: true, ronaTimeout: ronaTimeout }))))),\n react_1.default.createElement(react_collaboration_1.ListItemBaseSection, { position: \"end\" }, isIncomingTask ? (react_1.default.createElement(react_collaboration_1.ButtonPill, { onPress: acceptTask, color: \"join\", disabled: !isBrowser }, \"Ringing\")) : isBrowser ? (react_1.default.createElement(react_collaboration_1.ButtonPill, { onPress: declineTask, color: \"cancel\" }, \"End\")) : null)));\n};\nexports[\"default\"] = Task;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/Task/index.tsx?");
3200
+ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst react_collaboration_1 = __webpack_require__(/*! @momentum-ui/react-collaboration */ \"@momentum-ui/react-collaboration\");\nconst react_2 = __webpack_require__(/*! @momentum-design/components/dist/react */ \"../../../node_modules/@momentum-design/components/dist/react/index.js\");\nconst TaskTimer_1 = __importDefault(__webpack_require__(/*! ../TaskTimer */ \"./src/components/task/TaskTimer/index.tsx\"));\n__webpack_require__(/*! ./styles.scss */ \"./src/components/task/Task/styles.scss\");\nconst Task = ({ title, state, startTimeStamp, ronaTimeout, selected = false, isIncomingTask = false, queue, acceptTask, declineTask, interactionId, onTaskSelect, acceptText, disableAccept = false, declineText, }) => {\n const capitalizeFirstWord = (str) => {\n return str.replace(/^\\s*(\\w)/, (match, firstLetter) => firstLetter.toUpperCase());\n };\n return (react_1.default.createElement(react_collaboration_1.ListItemBase, { className: `task-list-item ${selected ? 'task-list-item--selected' : ''}`, onPress: onTaskSelect ? onTaskSelect : undefined, id: interactionId },\n react_1.default.createElement(react_collaboration_1.ListItemBaseSection, { position: \"start\" },\n react_1.default.createElement(react_2.Avatar, { \"icon-name\": \"handset-filled\" })),\n react_1.default.createElement(react_collaboration_1.ListItemBaseSection, { position: \"fill\" },\n react_1.default.createElement(\"section\", { className: \"task-details\" },\n title && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: selected ? 'body-large-bold' : 'body-large-medium' }, title)),\n state && !isIncomingTask && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" }, capitalizeFirstWord(state))),\n queue && isIncomingTask && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" }, capitalizeFirstWord(queue))),\n (isIncomingTask && !ronaTimeout) || !isIncomingTask\n ? startTimeStamp && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" },\n \"Handle Time: \",\n ' ',\n react_1.default.createElement(TaskTimer_1.default, { startTimeStamp: startTimeStamp })))\n : null,\n isIncomingTask && ronaTimeout && (react_1.default.createElement(react_collaboration_1.Text, { tagName: \"span\", type: \"body-midsize-regular\", className: \"task-text\" },\n \"Time Left: \",\n ' ',\n react_1.default.createElement(TaskTimer_1.default, { countdown: true, ronaTimeout: ronaTimeout }))))),\n react_1.default.createElement(react_collaboration_1.ListItemBaseSection, { position: \"end\" },\n react_1.default.createElement(\"div\", { className: \"task-button-container\" },\n acceptText ? (react_1.default.createElement(react_collaboration_1.ButtonPill, { onPress: acceptTask, color: \"join\", disabled: disableAccept }, acceptText)) : null,\n declineText ? (react_1.default.createElement(react_collaboration_1.ButtonPill, { onPress: declineTask, color: \"cancel\" }, declineText)) : null))));\n};\nexports[\"default\"] = Task;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/Task/index.tsx?");
3201
3201
 
3202
3202
  /***/ }),
3203
3203
 
@@ -3208,7 +3208,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
3208
3208
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3209
3209
 
3210
3210
  "use strict";
3211
- eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst Task_1 = __importDefault(__webpack_require__(/*! ../Task */ \"./src/components/task/Task/index.tsx\"));\n__webpack_require__(/*! ./styles.scss */ \"./src/components/task/TaskList/styles.scss\");\nconst TaskListComponent = (props) => {\n const { currentTask, taskList, acceptTask, declineTask, isBrowser } = props;\n if (taskList.length <= 0) {\n return react_1.default.createElement(react_1.default.Fragment, null); // hidden component\n }\n return (react_1.default.createElement(\"ul\", { className: \"task-list\" }, taskList === null || taskList === void 0 ? void 0 : taskList.map((task, index) => {\n var _a, _b;\n const callAssociationDetails = (_b = (_a = task === null || task === void 0 ? void 0 : task.data) === null || _a === void 0 ? void 0 : _a.interaction) === null || _b === void 0 ? void 0 : _b.callAssociatedDetails;\n const ani = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ani;\n const virtualTeamName = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.virtualTeamName;\n // rona timeout is not always available in the callAssociatedDetails object\n const ronaTimeout = (callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) ? Number(callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) : null;\n const taskState = task.data.interaction.state;\n const startTimeStamp = task.data.interaction.createdTimestamp;\n const isIncomingTask = taskState === 'new';\n return (react_1.default.createElement(Task_1.default, { title: ani, state: !isIncomingTask ? taskState : '', startTimeStamp: startTimeStamp, selected: (currentTask === null || currentTask === void 0 ? void 0 : currentTask.data.interactionId) === task.data.interactionId, key: index, isIncomingTask: isIncomingTask, queue: virtualTeamName, acceptTask: () => acceptTask(task), declineTask: () => declineTask(task), isBrowser: isBrowser, ronaTimeout: isIncomingTask ? ronaTimeout : null }));\n })));\n};\nexports[\"default\"] = TaskListComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/TaskList/task-list.tsx?");
3211
+ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {\n return (mod && mod.__esModule) ? mod : { \"default\": mod };\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importDefault(__webpack_require__(/*! react */ \"react\"));\nconst Task_1 = __importDefault(__webpack_require__(/*! ../Task */ \"./src/components/task/Task/index.tsx\"));\n__webpack_require__(/*! ./styles.scss */ \"./src/components/task/TaskList/styles.scss\");\nconst TaskListComponent = (props) => {\n var _a;\n const { currentTask, taskList, acceptTask, declineTask, isBrowser, onTaskSelect } = props;\n if (!taskList || Object.keys(taskList).length === 0) {\n return react_1.default.createElement(react_1.default.Fragment, null); // hidden component\n }\n return (react_1.default.createElement(\"ul\", { className: \"task-list\" }, (_a = Object.values(taskList)) === null || _a === void 0 ? void 0 : _a.map((task, index) => {\n var _a, _b;\n const callAssociationDetails = (_b = (_a = task === null || task === void 0 ? void 0 : task.data) === null || _a === void 0 ? void 0 : _a.interaction) === null || _b === void 0 ? void 0 : _b.callAssociatedDetails;\n const ani = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ani;\n const virtualTeamName = callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.virtualTeamName;\n // rona timeout is not always available in the callAssociatedDetails object\n const ronaTimeout = (callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) ? Number(callAssociationDetails === null || callAssociationDetails === void 0 ? void 0 : callAssociationDetails.ronaTimeout) : null;\n const taskState = task.data.interaction.state;\n const startTimeStamp = task.data.interaction.createdTimestamp;\n const isIncomingTask = taskState === 'new' || taskState === 'consult';\n const isTelephony = task.data.interaction.mediaType === 'telephony';\n const acceptText = isIncomingTask && !task.data.wrapUpRequired ? (isTelephony && !isBrowser ? 'Ringing' : 'Accept') : undefined;\n const declineText = isIncomingTask && !task.data.wrapUpRequired && isTelephony && isBrowser ? 'Decline' : undefined;\n return (react_1.default.createElement(Task_1.default, { interactionId: task.data.interactionId, title: ani, state: !isIncomingTask ? taskState : '', startTimeStamp: startTimeStamp, selected: (currentTask === null || currentTask === void 0 ? void 0 : currentTask.data.interactionId) === task.data.interactionId, key: index, isIncomingTask: isIncomingTask, queue: virtualTeamName, acceptTask: () => acceptTask(task), declineTask: () => declineTask(task), ronaTimeout: isIncomingTask ? ronaTimeout : null, onTaskSelect: () => {\n if ((currentTask === null || currentTask === void 0 ? void 0 : currentTask.data.interactionId) !== task.data.interactionId &&\n !(isIncomingTask && !task.data.wrapUpRequired)) {\n onTaskSelect(task);\n }\n }, acceptText: acceptText, disableAccept: isIncomingTask && isTelephony && !isBrowser, declineText: declineText }));\n })));\n};\nexports[\"default\"] = TaskListComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/TaskList/task-list.tsx?");
3212
3212
 
3213
3213
  /***/ }),
3214
3214
 
@@ -3219,18 +3219,18 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
3219
3219
  /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
3220
3220
 
3221
3221
  "use strict";
3222
- eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importStar(__webpack_require__(/*! react */ \"react\"));\nconst workerScript = `\n const formatDuration = (seconds) => {\n seconds = Math.max(0, seconds);\n const h = Math.floor(seconds / 3600).toString().padStart(2, '0');\n const m = Math.floor((seconds % 3600) / 60).toString().padStart(2, '0');\n const s = Math.floor(seconds % 60).toString().padStart(2, '0');\n return seconds < 3600 ? m + ':' + s : h + ':' + m + ':' + s;\n }\n\n self.onmessage = function(e) {\n const { start, countdown, ronaTimeout } = e.data;\n let running = true;\n\n const updateTimer = () => {\n if (!running) {\n return;\n }\n\n const now = Math.floor(Date.now() / 1000); // current time in seconds\n let diff;\n\n if (countdown && ronaTimeout !== undefined) {\n diff = start + ronaTimeout - now;\n if (diff <= 0) {\n self.postMessage('00:00');\n running = false;\n return;\n }\n } else {\n diff = now - start;\n }\n\n const formattedTime = formatDuration(diff);\n\n self.postMessage(formattedTime);\n setTimeout(updateTimer, 1000);\n };\n\n updateTimer();\n };\n`;\nconst createWorker = () => {\n return new Worker(URL.createObjectURL(new Blob([workerScript], { type: 'application/javascript' })));\n};\nconst TaskTimer = ({ startTimeStamp, countdown = false, ronaTimeout }) => {\n const [duration, setDuration] = (0, react_1.useState)('00:00');\n const workerRef = (0, react_1.useRef)(null);\n (0, react_1.useEffect)(() => {\n // Convert startTimeStamp from milliseconds to seconds if provided to match ronaTimeout, which is in seconds\n const now = Math.floor(Date.now() / 1000);\n const start = startTimeStamp ? Math.floor(startTimeStamp / 1000) : now;\n if (!workerRef.current) {\n workerRef.current = createWorker();\n }\n workerRef.current.postMessage({ start, countdown, ronaTimeout });\n const handleMessage = (e) => {\n setDuration(e.data);\n };\n workerRef.current.addEventListener('message', handleMessage);\n return () => {\n var _a;\n (_a = workerRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('message', handleMessage);\n };\n }, [countdown, ronaTimeout, startTimeStamp]);\n return (react_1.default.createElement(\"time\", { dateTime: duration, className: \"task-text task-text--secondary\" }, duration));\n};\nexports[\"default\"] = TaskTimer;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/TaskTimer/index.tsx?");
3222
+ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n var desc = Object.getOwnPropertyDescriptor(m, k);\n if (!desc || (\"get\" in desc ? !m.__esModule : desc.writable || desc.configurable)) {\n desc = { enumerable: true, get: function() { return m[k]; } };\n }\n Object.defineProperty(o, k2, desc);\n}) : (function(o, m, k, k2) {\n if (k2 === undefined) k2 = k;\n o[k2] = m[k];\n}));\nvar __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {\n Object.defineProperty(o, \"default\", { enumerable: true, value: v });\n}) : function(o, v) {\n o[\"default\"] = v;\n});\nvar __importStar = (this && this.__importStar) || function (mod) {\n if (mod && mod.__esModule) return mod;\n var result = {};\n if (mod != null) for (var k in mod) if (k !== \"default\" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);\n __setModuleDefault(result, mod);\n return result;\n};\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nconst react_1 = __importStar(__webpack_require__(/*! react */ \"react\"));\nconst workerScript = `\n const formatDuration = (seconds) => {\n seconds = Math.max(0, seconds);\n const h = Math.floor(seconds / 3600).toString().padStart(2, '0');\n const m = Math.floor((seconds % 3600) / 60).toString().padStart(2, '0');\n const s = Math.floor(seconds % 60).toString().padStart(2, '0');\n return seconds < 3600 ? m + ':' + s : h + ':' + m + ':' + s;\n }\n\n const timers = {};\n\n self.onmessage = function(e) {\n const { type, name, start, countdown, ronaTimeout } = e.data;\n\n if (type === 'start') {\n if (timers[name]) {\n return; // Timer with this name is already running\n }\n\n let running = true;\n\n const updateTimer = () => {\n if (!running) {\n return;\n }\n\n const now = Math.floor(Date.now() / 1000); // current time in seconds\n let diff;\n\n if (countdown && ronaTimeout !== undefined) {\n diff = start + ronaTimeout - now;\n if (diff <= 0) {\n self.postMessage({ name, time: '00:00' });\n running = false;\n delete timers[name];\n return;\n }\n } else {\n diff = now - start;\n }\n\n const formattedTime = formatDuration(diff);\n self.postMessage({ name, time: formattedTime });\n timers[name] = setTimeout(updateTimer, 1000);\n };\n\n updateTimer();\n } else if (type === 'stop') {\n if (timers[name]) {\n clearTimeout(timers[name]);\n delete timers[name];\n }\n }\n };\n`;\nconst createWorker = () => {\n return new Worker(URL.createObjectURL(new Blob([workerScript], { type: 'application/javascript' })));\n};\nconst TaskTimer = ({ startTimeStamp, countdown = false, ronaTimeout }) => {\n const [duration, setDuration] = (0, react_1.useState)('00:00');\n const workerRef = (0, react_1.useRef)(null);\n const timerName = (0, react_1.useRef)(`timer-${Date.now()}`); // Unique name for the timer\n (0, react_1.useEffect)(() => {\n const now = Math.floor(Date.now() / 1000);\n const start = startTimeStamp ? Math.floor(startTimeStamp / 1000) : now;\n if (!workerRef.current) {\n workerRef.current = createWorker();\n }\n workerRef.current.postMessage({ type: 'start', name: timerName.current, start, countdown, ronaTimeout });\n const handleMessage = (e) => {\n if (e.data.name === timerName.current) {\n setDuration(e.data.time);\n }\n };\n workerRef.current.addEventListener('message', handleMessage);\n return () => {\n var _a;\n workerRef.current.postMessage({ type: 'stop', name: timerName.current });\n (_a = workerRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('message', handleMessage);\n };\n }, [countdown, ronaTimeout, startTimeStamp]);\n return (react_1.default.createElement(\"time\", { dateTime: duration, className: \"task-text task-text--secondary\" }, duration));\n};\nexports[\"default\"] = TaskTimer;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/TaskTimer/index.tsx?");
3223
3223
 
3224
3224
  /***/ }),
3225
3225
 
3226
- /***/ "./src/utils.ts":
3227
- /*!**********************!*\
3228
- !*** ./src/utils.ts ***!
3229
- \**********************/
3226
+ /***/ "./src/utils/index.ts":
3227
+ /*!****************************!*\
3228
+ !*** ./src/utils/index.ts ***!
3229
+ \****************************/
3230
3230
  /***/ ((__unused_webpack_module, exports) => {
3231
3231
 
3232
3232
  "use strict";
3233
- eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.formatTime = void 0;\nconst formatTime = (time) => {\n const hours = Math.floor(time / 3600);\n const minutes = Math.floor((time % 3600) / 60);\n const seconds = time % 60;\n return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds\n .toString()\n .padStart(2, '0')}`;\n};\nexports.formatTime = formatTime;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/utils.ts?");
3233
+ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.formatTime = void 0;\nconst formatTime = (time) => {\n const hours = Math.floor(time / 3600);\n const minutes = Math.floor((time % 3600) / 60);\n const seconds = time % 60;\n return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds\n .toString()\n .padStart(2, '0')}`;\n};\nexports.formatTime = formatTime;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/utils/index.ts?");
3234
3234
 
3235
3235
  /***/ }),
3236
3236
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@webex/cc-components",
3
3
  "description": "Webex Contact Center UI Components Library for your custom contact center solutions",
4
- "version": "1.28.0-ccwidgets.50",
4
+ "version": "1.28.0-ccwidgets.51",
5
5
  "main": "dist/index.js",
6
6
  "publishConfig": {
7
7
  "access": "public"
@@ -25,7 +25,7 @@
25
25
  },
26
26
  "dependencies": {
27
27
  "@r2wc/react-to-web-component": "2.0.3",
28
- "@webex/cc-store": "1.28.0-ccwidgets.50"
28
+ "@webex/cc-store": "1.28.0-ccwidgets.51"
29
29
  },
30
30
  "devDependencies": {
31
31
  "@babel/core": "7.25.2",
/package/dist/types/{utils.d.ts → utils/index.d.ts} RENAMED
File without changes