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

package/dist/index.js

@@ -2889,7 +2889,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-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, `.user-state-container {\n  position: relative;\n  width: 100%; /* Ensure the select trigger takes the full width of its parent */\n  display: flex;\n  align-items: center;\n  justify-content: space-between; /* Space out the elements within the select trigger */\n}\n\n.select-trigger .md-select {\n  width: 100%; /* Ensure the SelectNext component takes the full width of its parent */\n}\n\n.elapsedTime {\n  position: absolute;\n  right: 2rem; /* Adjusted to leave space for the arrow icon */\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n  pointer-events: none;\n  z-index: 1;\n  color: var(--mds-color-theme-text-primary-normal);\n  white-space: nowrap; /* Prevent the text from wrapping */\n  padding: 0 0.5rem; /* Add some padding */\n  border-radius: 0.25rem; /* Add some border radius */\n}\n\n.state-name {\n  color: var(--mds-color-theme-text-primary-normal);\n}\n\n.elapsedTime-disabled {\n  color: #ccc;\n}\n\n.item-container {\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.hide-this {\n  display: none;\n}\n\n.state-icon {\n  --mdc-icon-fill-color: var(--mds-color-theme-indicator-stable);\n}\n.state-icon.idle {\n  --mdc-icon-fill-color: var(--mds-color-theme-indicator-locked);\n}\n.state-icon.rona {\n  --mdc-icon-fill-color: var(--mds-color-theme-outline-cancel-normal);\n}\n.state-icon.custom {\n  --mdc-icon-fill-color: var(--mds-color-theme-text-team-gold-hover);\n}\n\n.state-select {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-success-normal);\n}\n.state-select .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-success-normal);\n}\n.state-select.idle {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-primary-active);\n}\n.state-select.idle .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-secondary-normal);\n}\n.state-select.rona {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-error-active);\n}\n.state-select.rona .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-error-normal);\n  border: 1px solid var(--mds-color-theme-outline-cancel-normal);\n}\n.state-select.custom {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-warning-active);\n}\n.state-select.custom .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-warning-normal);\n  border: 1px solid var(--mds-color-theme-text-team-gold-hover);\n}\n.state-select .md-select-popover ul li[data-key^=hide-] {\n  display: none;\n}\n\n.select-arrow-icon {\n  position: absolute;\n  right: 1rem; /* Adjusted to leave space for the arrow icon */\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n  pointer-events: none;\n  z-index: 1;\n}`, \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/UserState/user-state.scss?../../../node_modules/css-loader/dist/cjs.js!../../../node_modules/sass-loader/dist/cjs.js");
+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, `.user-state-container {\n  position: relative;\n  width: 100%; /* Ensure the select trigger takes the full width of its parent */\n  display: flex;\n  align-items: center;\n  justify-content: space-between; /* Space out the elements within the select trigger */\n}\n\n.select-trigger .md-select {\n  width: 100%; /* Ensure the SelectNext component takes the full width of its parent */\n}\n\n.elapsedTime {\n  position: absolute;\n  right: 2rem; /* Adjusted to leave space for the arrow icon */\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n  pointer-events: none;\n  z-index: 1;\n  color: var(--mds-color-theme-text-primary-normal);\n  white-space: nowrap; /* Prevent the text from wrapping */\n  padding: 0 0.5rem; /* Add some padding */\n  border-radius: 0.25rem; /* Add some border radius */\n}\n\n.state-name {\n  color: var(--mds-color-theme-text-primary-normal);\n}\n.state-name.rona {\n  color: var(--mds-color-theme-text-error-normal);\n}\n.state-name.custom {\n  color: var(--mds-color-theme-text-warning-normal);\n}\n\n.elapsedTime-disabled {\n  color: #ccc;\n}\n\n.item-container {\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.hide-this {\n  display: none;\n}\n\n.state-icon {\n  --mdc-icon-fill-color: var(--mds-color-theme-indicator-stable);\n}\n.state-icon.idle {\n  --mdc-icon-fill-color: var(--mds-color-theme-indicator-locked);\n}\n.state-icon.rona {\n  --mdc-icon-fill-color: var(--mds-color-theme-outline-cancel-normal);\n}\n.state-icon.custom {\n  --mdc-icon-fill-color: var(--mds-color-theme-text-team-gold-hover);\n}\n\n.state-select {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-success-normal);\n}\n.state-select .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-success-normal);\n}\n.state-select.idle {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-primary-active);\n}\n.state-select.idle .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-secondary-normal);\n}\n.state-select.rona {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-error-active);\n}\n.state-select.rona .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-error-normal);\n  border: 1px solid var(--mds-color-theme-outline-cancel-normal);\n}\n.state-select.custom {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-warning-active);\n}\n.state-select.custom .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-warning-normal);\n  border: 1px solid var(--mds-color-theme-text-team-gold-hover);\n}\n.state-select.available {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-success-normal);\n}\n.state-select.available .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-success-normal);\n  border: 1px solid var(--mds-color-theme-outline-join-normal);\n}\n.state-select .md-select-popover ul li[data-key^=hide-] {\n  display: none;\n}\n.state-select .item-container.selected.available .state-icon {\n  --mdc-icon-fill-color: var(--mds-color-theme-outline-join-normal);\n}\n.state-select .item-container.selected.available .state-name {\n  color: var(--mds-color-theme-outline-join-normal);\n}\n.state-select .item-container.selected.idle .state-icon {\n  --mdc-icon-fill-color: var(--mds-color-theme-text-primary-normal);\n}\n.state-select .item-container.selected.idle .state-name {\n  color: var(--mds-color-theme-text-primary-normal);\n}\n\n.select-arrow-icon {\n  position: absolute;\n  right: 1rem; /* Adjusted to leave space for the arrow icon */\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n  pointer-events: none;\n  z-index: 1;\n}`, \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/UserState/user-state.scss?../../../node_modules/css-loader/dist/cjs.js!../../../node_modules/sass-loader/dist/cjs.js");
 
 /***/ }),
 
@@ -2933,7 +2933,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-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");
+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\n.task-list-hover:hover {\n  background: none !important;\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");
 
 /***/ }),
 
@@ -3153,7 +3153,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n\n\n
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-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?");
+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 user_state_types_1 = __webpack_require__(/*! ./user-state.types */ \"./src/components/UserState/user-state.types.ts\");\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    const previousSelectableState = (0, react_1.useMemo)(() => {\n        var _a, _b;\n        return (_b = (_a = idleCodes.find((code) => code.id !== user_state_types_1.AgentUserState.RONA && code.id !== user_state_types_1.AgentUserState.Engaged)) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : '0';\n    }, [idleCodes]);\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 === user_state_types_1.AgentUserState.RONA && item.id === currentState) {\n            selectedKey = `hide-${item.id}`;\n        }\n        if (item.name === user_state_types_1.AgentUserState.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 === user_state_types_1.AgentUserState.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 === user_state_types_1.AgentUserState.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: 'available', iconName: 'active-presence-small-filled' };\n            case item.name === user_state_types_1.AgentUserState.RONA && item.id:\n                return { class: 'rona', iconName: 'dnd-presence-filled' };\n            default:\n                return { class: 'idle', iconName: 'recents-presence-filled' };\n        }\n    };\n    // Sorts the dropdown items by keeping 'Available' at the top and sorting the rest alphabetically by name\n    const sortedItems = [\n        ...items.filter((item) => item.name === user_state_types_1.AgentUserState.Available),\n        ...items.filter((item) => item.name !== user_state_types_1.AgentUserState.Available).sort((a, b) => a.name.localeCompare(b.name)),\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: sortedItems, className: `state-select ${getDropdownClass()}` }, (item) => {\n            var _a;\n            const isRonaOrEngaged = [user_state_types_1.AgentUserState.RONA, user_state_types_1.AgentUserState.Engaged].includes(((_a = idleCodes.find((code) => code.id === currentState)) === null || _a === void 0 ? void 0 : _a.name) || '');\n            const shouldHighlight = currentState === item.id || (isRonaOrEngaged && item.id === previousSelectableState);\n            return (react_1.default.createElement(collections_1.Item, { key: item.id, textValue: item.name },\n                react_1.default.createElement(\"div\", { className: `item-container ${shouldHighlight ? `selected ${getIconStyle(item).class}` : ''}` },\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 ${getIconStyle(item).class}`, 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?");
 
 /***/ }),
 
@@ -3164,7 +3164,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
 /***/ ((__unused_webpack_module, exports) => {
 
 "use strict";
-eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/UserState/user-state.types.ts?");
+eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.AgentUserState = void 0;\nvar AgentUserState;\n(function (AgentUserState) {\n    AgentUserState[\"Available\"] = \"Available\";\n    AgentUserState[\"RONA\"] = \"RONA\";\n    AgentUserState[\"Engaged\"] = \"ENGAGED\";\n})(AgentUserState || (exports.AgentUserState = AgentUserState = {}));\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/UserState/user-state.types.ts?");
 
 /***/ }),
 
@@ -3230,7 +3230,7 @@ eval("\nvar __importDefault = (this && this.__importDefault) || function (mod) {
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-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?");
+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, isBrowser, accept, reject } = 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    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    const isTelephony = incomingTask.data.interaction.mediaType === 'telephony';\n    const acceptText = !incomingTask.data.wrapUpRequired ? (isTelephony && !isBrowser ? 'Ringing' : 'Accept') : undefined;\n    const declineText = !incomingTask.data.wrapUpRequired && isTelephony && isBrowser ? 'Decline' : undefined;\n    return (react_1.default.createElement(Task_1.default, { interactionId: incomingTask.data.interactionId, title: ani, state: \"\", startTimeStamp: startTimeStamp, isIncomingTask: true, queue: virtualTeamName, acceptTask: () => accept(incomingTask), declineTask: () => reject(incomingTask), ronaTimeout: ronaTimeout, acceptText: acceptText, disableAccept: isTelephony && !isBrowser, declineText: declineText, styles: \"task-list-hover\" }));\n};\nexports[\"default\"] = IncomingTaskComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/IncomingTask/incoming-task.tsx?");
 
 /***/ }),
 
@@ -3252,7 +3252,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-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?");
+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, styles, 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' : ''} ${styles}`, 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?");
 
 /***/ }),
 
@@ -3307,7 +3307,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
 /***/ ((__unused_webpack_module, exports) => {
 
 "use strict";
-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?");
+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    // Display full format with hours if time is 1 hour or more\n    if (hours > 0) {\n        return `${hours.toString().padStart(2, '0')}:${minutes\n            .toString()\n            .padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n    }\n    // Less than 1 hour: display mm:ss with two-digit padding for minutes\n    return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n};\nexports.formatTime = formatTime;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/utils/index.ts?");
 
 /***/ }),
 

package/dist/types/components/UserState/user-state.types.d.ts

@@ -51,3 +51,8 @@ export interface IUserState {
      */
     onStateChange: (state: string) => void;
 }
+export declare enum AgentUserState {
+    Available = "Available",
+    RONA = "RONA",
+    Engaged = "ENGAGED"
+}

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

@@ -16,6 +16,7 @@ interface TaskProps {
     acceptText?: string;
     declineText?: string;
     disableAccept?: boolean;
+    styles?: string;
 }
 declare const Task: React.FC<TaskProps>;
 export default Task;

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

@@ -18,11 +18,15 @@ export interface TaskProps {
     /**
      * Handler for task accepted
      */
-    onAccepted?: () => void;
+    onAccepted?: ({ task }: {
+        task: ITask;
+    }) => void;
     /**
      * Handler for task declined
      */
-    onDeclined?: () => void;
+    onRejected?: ({ task }: {
+        task: ITask;
+    }) => void;
     /**
      * Handler for task accepted in TaskList
      */
@@ -34,11 +38,11 @@ export interface TaskProps {
     /**
      * accept incoming task action
      */
-    accept: () => void;
+    accept: (task: ITask) => void;
     /**
      * decline incoming task action
      */
-    decline: () => void;
+    reject: (task: ITask) => void;
     /**
      * accept task from task list
      */
@@ -76,7 +80,7 @@ export interface TaskProps {
      */
     logger: ILogger;
 }
-export type IncomingTaskComponentProps = Pick<TaskProps, 'incomingTask' | 'isBrowser' | 'accept' | 'decline'>;
+export type IncomingTaskComponentProps = Pick<TaskProps, 'incomingTask' | 'isBrowser' | 'accept' | 'reject'>;
 export type TaskListComponentProps = Pick<TaskProps, 'currentTask' | 'taskList' | 'isBrowser' | 'acceptTask' | 'declineTask' | 'onTaskSelect'>;
 /**
  * Interface representing the properties for control actions on a task.

package/dist/wc.js

@@ -2889,7 +2889,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-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, `.user-state-container {\n  position: relative;\n  width: 100%; /* Ensure the select trigger takes the full width of its parent */\n  display: flex;\n  align-items: center;\n  justify-content: space-between; /* Space out the elements within the select trigger */\n}\n\n.select-trigger .md-select {\n  width: 100%; /* Ensure the SelectNext component takes the full width of its parent */\n}\n\n.elapsedTime {\n  position: absolute;\n  right: 2rem; /* Adjusted to leave space for the arrow icon */\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n  pointer-events: none;\n  z-index: 1;\n  color: var(--mds-color-theme-text-primary-normal);\n  white-space: nowrap; /* Prevent the text from wrapping */\n  padding: 0 0.5rem; /* Add some padding */\n  border-radius: 0.25rem; /* Add some border radius */\n}\n\n.state-name {\n  color: var(--mds-color-theme-text-primary-normal);\n}\n\n.elapsedTime-disabled {\n  color: #ccc;\n}\n\n.item-container {\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.hide-this {\n  display: none;\n}\n\n.state-icon {\n  --mdc-icon-fill-color: var(--mds-color-theme-indicator-stable);\n}\n.state-icon.idle {\n  --mdc-icon-fill-color: var(--mds-color-theme-indicator-locked);\n}\n.state-icon.rona {\n  --mdc-icon-fill-color: var(--mds-color-theme-outline-cancel-normal);\n}\n.state-icon.custom {\n  --mdc-icon-fill-color: var(--mds-color-theme-text-team-gold-hover);\n}\n\n.state-select {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-success-normal);\n}\n.state-select .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-success-normal);\n}\n.state-select.idle {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-primary-active);\n}\n.state-select.idle .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-secondary-normal);\n}\n.state-select.rona {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-error-active);\n}\n.state-select.rona .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-error-normal);\n  border: 1px solid var(--mds-color-theme-outline-cancel-normal);\n}\n.state-select.custom {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-warning-active);\n}\n.state-select.custom .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-warning-normal);\n  border: 1px solid var(--mds-color-theme-text-team-gold-hover);\n}\n.state-select .md-select-popover ul li[data-key^=hide-] {\n  display: none;\n}\n\n.select-arrow-icon {\n  position: absolute;\n  right: 1rem; /* Adjusted to leave space for the arrow icon */\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n  pointer-events: none;\n  z-index: 1;\n}`, \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/UserState/user-state.scss?../../../node_modules/css-loader/dist/cjs.js!../../../node_modules/sass-loader/dist/cjs.js");
+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, `.user-state-container {\n  position: relative;\n  width: 100%; /* Ensure the select trigger takes the full width of its parent */\n  display: flex;\n  align-items: center;\n  justify-content: space-between; /* Space out the elements within the select trigger */\n}\n\n.select-trigger .md-select {\n  width: 100%; /* Ensure the SelectNext component takes the full width of its parent */\n}\n\n.elapsedTime {\n  position: absolute;\n  right: 2rem; /* Adjusted to leave space for the arrow icon */\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n  pointer-events: none;\n  z-index: 1;\n  color: var(--mds-color-theme-text-primary-normal);\n  white-space: nowrap; /* Prevent the text from wrapping */\n  padding: 0 0.5rem; /* Add some padding */\n  border-radius: 0.25rem; /* Add some border radius */\n}\n\n.state-name {\n  color: var(--mds-color-theme-text-primary-normal);\n}\n.state-name.rona {\n  color: var(--mds-color-theme-text-error-normal);\n}\n.state-name.custom {\n  color: var(--mds-color-theme-text-warning-normal);\n}\n\n.elapsedTime-disabled {\n  color: #ccc;\n}\n\n.item-container {\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n}\n\n.hide-this {\n  display: none;\n}\n\n.state-icon {\n  --mdc-icon-fill-color: var(--mds-color-theme-indicator-stable);\n}\n.state-icon.idle {\n  --mdc-icon-fill-color: var(--mds-color-theme-indicator-locked);\n}\n.state-icon.rona {\n  --mdc-icon-fill-color: var(--mds-color-theme-outline-cancel-normal);\n}\n.state-icon.custom {\n  --mdc-icon-fill-color: var(--mds-color-theme-text-team-gold-hover);\n}\n\n.state-select {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-success-normal);\n}\n.state-select .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-success-normal);\n}\n.state-select.idle {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-primary-active);\n}\n.state-select.idle .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-secondary-normal);\n}\n.state-select.rona {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-error-active);\n}\n.state-select.rona .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-error-normal);\n  border: 1px solid var(--mds-color-theme-outline-cancel-normal);\n}\n.state-select.custom {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-warning-active);\n}\n.state-select.custom .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-warning-normal);\n  border: 1px solid var(--mds-color-theme-text-team-gold-hover);\n}\n.state-select.available {\n  width: 100%;\n  --mds-color-theme-background-primary-active: var(--mds-color-theme-background-alert-success-normal);\n}\n.state-select.available .md-select-dropdown-input {\n  background-color: var(--mds-color-theme-background-alert-success-normal);\n  border: 1px solid var(--mds-color-theme-outline-join-normal);\n}\n.state-select .md-select-popover ul li[data-key^=hide-] {\n  display: none;\n}\n.state-select .item-container.selected.available .state-icon {\n  --mdc-icon-fill-color: var(--mds-color-theme-outline-join-normal);\n}\n.state-select .item-container.selected.available .state-name {\n  color: var(--mds-color-theme-outline-join-normal);\n}\n.state-select .item-container.selected.idle .state-icon {\n  --mdc-icon-fill-color: var(--mds-color-theme-text-primary-normal);\n}\n.state-select .item-container.selected.idle .state-name {\n  color: var(--mds-color-theme-text-primary-normal);\n}\n\n.select-arrow-icon {\n  position: absolute;\n  right: 1rem; /* Adjusted to leave space for the arrow icon */\n  top: 50%;\n  transform: translateY(-50%);\n  display: flex;\n  align-items: center;\n  pointer-events: none;\n  z-index: 1;\n}`, \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/UserState/user-state.scss?../../../node_modules/css-loader/dist/cjs.js!../../../node_modules/sass-loader/dist/cjs.js");
 
 /***/ }),
 
@@ -2922,7 +2922,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
 /***/ ((module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-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");
+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\n.task-list-hover:hover {\n  background: none !important;\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");
 
 /***/ }),
 
@@ -3131,7 +3131,18 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-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?");
+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 user_state_types_1 = __webpack_require__(/*! ./user-state.types */ \"./src/components/UserState/user-state.types.ts\");\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    const previousSelectableState = (0, react_1.useMemo)(() => {\n        var _a, _b;\n        return (_b = (_a = idleCodes.find((code) => code.id !== user_state_types_1.AgentUserState.RONA && code.id !== user_state_types_1.AgentUserState.Engaged)) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : '0';\n    }, [idleCodes]);\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 === user_state_types_1.AgentUserState.RONA && item.id === currentState) {\n            selectedKey = `hide-${item.id}`;\n        }\n        if (item.name === user_state_types_1.AgentUserState.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 === user_state_types_1.AgentUserState.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 === user_state_types_1.AgentUserState.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: 'available', iconName: 'active-presence-small-filled' };\n            case item.name === user_state_types_1.AgentUserState.RONA && item.id:\n                return { class: 'rona', iconName: 'dnd-presence-filled' };\n            default:\n                return { class: 'idle', iconName: 'recents-presence-filled' };\n        }\n    };\n    // Sorts the dropdown items by keeping 'Available' at the top and sorting the rest alphabetically by name\n    const sortedItems = [\n        ...items.filter((item) => item.name === user_state_types_1.AgentUserState.Available),\n        ...items.filter((item) => item.name !== user_state_types_1.AgentUserState.Available).sort((a, b) => a.name.localeCompare(b.name)),\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: sortedItems, className: `state-select ${getDropdownClass()}` }, (item) => {\n            var _a;\n            const isRonaOrEngaged = [user_state_types_1.AgentUserState.RONA, user_state_types_1.AgentUserState.Engaged].includes(((_a = idleCodes.find((code) => code.id === currentState)) === null || _a === void 0 ? void 0 : _a.name) || '');\n            const shouldHighlight = currentState === item.id || (isRonaOrEngaged && item.id === previousSelectableState);\n            return (react_1.default.createElement(collections_1.Item, { key: item.id, textValue: item.name },\n                react_1.default.createElement(\"div\", { className: `item-container ${shouldHighlight ? `selected ${getIconStyle(item).class}` : ''}` },\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 ${getIconStyle(item).class}`, 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?");
+
+/***/ }),
+
+/***/ "./src/components/UserState/user-state.types.ts":
+/*!******************************************************!*\
+  !*** ./src/components/UserState/user-state.types.ts ***!
+  \******************************************************/
+/***/ ((__unused_webpack_module, exports) => {
+
+"use strict";
+eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexports.AgentUserState = void 0;\nvar AgentUserState;\n(function (AgentUserState) {\n    AgentUserState[\"Available\"] = \"Available\";\n    AgentUserState[\"RONA\"] = \"RONA\";\n    AgentUserState[\"Engaged\"] = \"ENGAGED\";\n})(AgentUserState || (exports.AgentUserState = AgentUserState = {}));\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/UserState/user-state.types.ts?");
 
 /***/ }),
 
@@ -3175,7 +3186,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-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?");
+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, isBrowser, accept, reject } = 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    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    const isTelephony = incomingTask.data.interaction.mediaType === 'telephony';\n    const acceptText = !incomingTask.data.wrapUpRequired ? (isTelephony && !isBrowser ? 'Ringing' : 'Accept') : undefined;\n    const declineText = !incomingTask.data.wrapUpRequired && isTelephony && isBrowser ? 'Decline' : undefined;\n    return (react_1.default.createElement(Task_1.default, { interactionId: incomingTask.data.interactionId, title: ani, state: \"\", startTimeStamp: startTimeStamp, isIncomingTask: true, queue: virtualTeamName, acceptTask: () => accept(incomingTask), declineTask: () => reject(incomingTask), ronaTimeout: ronaTimeout, acceptText: acceptText, disableAccept: isTelephony && !isBrowser, declineText: declineText, styles: \"task-list-hover\" }));\n};\nexports[\"default\"] = IncomingTaskComponent;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/components/task/IncomingTask/incoming-task.tsx?");
 
 /***/ }),
 
@@ -3197,7 +3208,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-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?");
+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, styles, 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' : ''} ${styles}`, 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?");
 
 /***/ }),
 
@@ -3230,7 +3241,7 @@ eval("\nvar __createBinding = (this && this.__createBinding) || (Object.create ?
 /***/ ((__unused_webpack_module, exports) => {
 
 "use strict";
-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?");
+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    // Display full format with hours if time is 1 hour or more\n    if (hours > 0) {\n        return `${hours.toString().padStart(2, '0')}:${minutes\n            .toString()\n            .padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n    }\n    // Less than 1 hour: display mm:ss with two-digit padding for minutes\n    return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;\n};\nexports.formatTime = formatTime;\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/utils/index.ts?");
 
 /***/ }),
 
@@ -3241,7 +3252,7 @@ eval("\nObject.defineProperty(exports, \"__esModule\", ({ value: true }));\nexpo
 /***/ (function(__unused_webpack_module, exports, __webpack_require__) {
 
 "use strict";
-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_to_web_component_1 = __importDefault(__webpack_require__(/*! @r2wc/react-to-web-component */ \"../../../node_modules/@r2wc/react-to-web-component/dist/react-to-web-component.cjs\"));\nconst user_state_1 = __importDefault(__webpack_require__(/*! ./components/UserState/user-state */ \"./src/components/UserState/user-state.tsx\"));\nconst station_login_1 = __importDefault(__webpack_require__(/*! ./components/StationLogin/station-login */ \"./src/components/StationLogin/station-login.tsx\"));\nconst call_control_1 = __importDefault(__webpack_require__(/*! ./components/task/CallControl/call-control */ \"./src/components/task/CallControl/call-control.tsx\"));\nconst call_control_2 = __importDefault(__webpack_require__(/*! ./components/task/CallControl/call-control */ \"./src/components/task/CallControl/call-control.tsx\"));\nconst incoming_task_1 = __importDefault(__webpack_require__(/*! ./components/task/IncomingTask/incoming-task */ \"./src/components/task/IncomingTask/incoming-task.tsx\"));\nconst task_list_1 = __importDefault(__webpack_require__(/*! ./components/task/TaskList/task-list */ \"./src/components/task/TaskList/task-list.tsx\"));\nconst outdial_call_1 = __importDefault(__webpack_require__(/*! ./components/task/OutdialCall/outdial-call */ \"./src/components/task/OutdialCall/outdial-call.tsx\"));\nconst WebUserState = (0, react_to_web_component_1.default)(user_state_1.default, {\n    props: {\n        //  type '\"string\" | \"number\" | \"boolean\" | \"function\" | \"json\"\n        idleCodes: 'json',\n        setAgentStatus: 'function',\n        isSettingAgentStatus: 'boolean',\n        errorMessage: 'string',\n        elapsedTime: 'number',\n        lastIdleStateChangeElapsedTime: 'number',\n        currentState: 'string',\n        customState: 'json',\n        currentTheme: 'string',\n        onStateChange: 'function',\n    },\n});\nif (!customElements.get('component-cc-user-state')) {\n    customElements.define('component-cc-user-state', WebUserState);\n}\nconst WebStationLogin = (0, react_to_web_component_1.default)(station_login_1.default, {\n    props: {\n        teams: 'json',\n        loginOptions: 'json',\n        login: 'function',\n        logout: 'function',\n        loginSuccess: 'json',\n        loginFailure: 'json',\n        logoutSuccess: 'json',\n        setDeviceType: 'function',\n        setDialNumber: 'function',\n        setTeam: 'function',\n        isAgentLoggedIn: 'boolean',\n        handleContinue: 'function',\n        deviceType: 'string',\n        dialNumber: 'string',\n        showMultipleLoginAlert: 'boolean',\n    },\n});\nif (!customElements.get('component-cc-station-login')) {\n    customElements.define('component-cc-station-login', WebStationLogin);\n}\nconst commonPropsForCallControl = {\n    currentTask: 'json',\n    audioRef: 'json',\n    wrapupCodes: 'json',\n    wrapupRequired: 'boolean',\n    toggleHold: 'function',\n    toggleRecording: 'function',\n    endCall: 'function',\n    wrapupCall: 'function',\n    isHeld: 'boolean',\n    setIsHeld: 'function',\n};\nconst WebCallControlCADComponent = (0, react_to_web_component_1.default)(call_control_2.default, {\n    props: commonPropsForCallControl,\n});\nconst WebCallControl = (0, react_to_web_component_1.default)(call_control_1.default, {\n    props: commonPropsForCallControl,\n});\nif (!customElements.get('component-cc-call-control-cad')) {\n    customElements.define('component-cc-call-control-cad', WebCallControlCADComponent);\n}\nif (!customElements.get('component-cc-call-control')) {\n    customElements.define('component-cc-call-control', WebCallControl);\n}\nconst WebIncomingTask = (0, react_to_web_component_1.default)(incoming_task_1.default, {\n    props: {\n        incomingTask: 'json',\n        isBrowser: 'boolean',\n        accept: 'function',\n        decline: 'function',\n    },\n});\nif (!customElements.get('component-cc-incoming-task')) {\n    customElements.define('component-cc-incoming-task', WebIncomingTask);\n}\nconst WebTaskList = (0, react_to_web_component_1.default)(task_list_1.default, {\n    props: {\n        currentTask: 'json',\n        taskList: 'json',\n        isBrowser: 'boolean',\n        acceptTask: 'function',\n        declineTask: 'function',\n    },\n});\nif (!customElements.get('component-cc-task-list')) {\n    customElements.define('component-cc-task-list', WebTaskList);\n}\nconst WebOutdialCallComponent = (0, react_to_web_component_1.default)(outdial_call_1.default);\nif (!customElements.get('component-cc-out-dial-call')) {\n    customElements.define('component-cc-out-dial-call', WebOutdialCallComponent);\n}\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/wc.ts?");
+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_to_web_component_1 = __importDefault(__webpack_require__(/*! @r2wc/react-to-web-component */ \"../../../node_modules/@r2wc/react-to-web-component/dist/react-to-web-component.cjs\"));\nconst user_state_1 = __importDefault(__webpack_require__(/*! ./components/UserState/user-state */ \"./src/components/UserState/user-state.tsx\"));\nconst station_login_1 = __importDefault(__webpack_require__(/*! ./components/StationLogin/station-login */ \"./src/components/StationLogin/station-login.tsx\"));\nconst call_control_1 = __importDefault(__webpack_require__(/*! ./components/task/CallControl/call-control */ \"./src/components/task/CallControl/call-control.tsx\"));\nconst call_control_2 = __importDefault(__webpack_require__(/*! ./components/task/CallControl/call-control */ \"./src/components/task/CallControl/call-control.tsx\"));\nconst incoming_task_1 = __importDefault(__webpack_require__(/*! ./components/task/IncomingTask/incoming-task */ \"./src/components/task/IncomingTask/incoming-task.tsx\"));\nconst task_list_1 = __importDefault(__webpack_require__(/*! ./components/task/TaskList/task-list */ \"./src/components/task/TaskList/task-list.tsx\"));\nconst outdial_call_1 = __importDefault(__webpack_require__(/*! ./components/task/OutdialCall/outdial-call */ \"./src/components/task/OutdialCall/outdial-call.tsx\"));\nconst WebUserState = (0, react_to_web_component_1.default)(user_state_1.default, {\n    props: {\n        //  type '\"string\" | \"number\" | \"boolean\" | \"function\" | \"json\"\n        idleCodes: 'json',\n        setAgentStatus: 'function',\n        isSettingAgentStatus: 'boolean',\n        errorMessage: 'string',\n        elapsedTime: 'number',\n        lastIdleStateChangeElapsedTime: 'number',\n        currentState: 'string',\n        customState: 'json',\n        currentTheme: 'string',\n        onStateChange: 'function',\n    },\n});\nif (!customElements.get('component-cc-user-state')) {\n    customElements.define('component-cc-user-state', WebUserState);\n}\nconst WebStationLogin = (0, react_to_web_component_1.default)(station_login_1.default, {\n    props: {\n        teams: 'json',\n        loginOptions: 'json',\n        login: 'function',\n        logout: 'function',\n        loginSuccess: 'json',\n        loginFailure: 'json',\n        logoutSuccess: 'json',\n        setDeviceType: 'function',\n        setDialNumber: 'function',\n        setTeam: 'function',\n        isAgentLoggedIn: 'boolean',\n        handleContinue: 'function',\n        deviceType: 'string',\n        dialNumber: 'string',\n        showMultipleLoginAlert: 'boolean',\n    },\n});\nif (!customElements.get('component-cc-station-login')) {\n    customElements.define('component-cc-station-login', WebStationLogin);\n}\nconst commonPropsForCallControl = {\n    currentTask: 'json',\n    audioRef: 'json',\n    wrapupCodes: 'json',\n    wrapupRequired: 'boolean',\n    toggleHold: 'function',\n    toggleRecording: 'function',\n    endCall: 'function',\n    wrapupCall: 'function',\n    isHeld: 'boolean',\n    setIsHeld: 'function',\n};\nconst WebCallControlCADComponent = (0, react_to_web_component_1.default)(call_control_2.default, {\n    props: commonPropsForCallControl,\n});\nconst WebCallControl = (0, react_to_web_component_1.default)(call_control_1.default, {\n    props: commonPropsForCallControl,\n});\nif (!customElements.get('component-cc-call-control-cad')) {\n    customElements.define('component-cc-call-control-cad', WebCallControlCADComponent);\n}\nif (!customElements.get('component-cc-call-control')) {\n    customElements.define('component-cc-call-control', WebCallControl);\n}\nconst WebIncomingTask = (0, react_to_web_component_1.default)(incoming_task_1.default, {\n    props: {\n        incomingTask: 'json',\n        isBrowser: 'boolean',\n        accept: 'function',\n        reject: 'function',\n    },\n});\nif (!customElements.get('component-cc-incoming-task')) {\n    customElements.define('component-cc-incoming-task', WebIncomingTask);\n}\nconst WebTaskList = (0, react_to_web_component_1.default)(task_list_1.default, {\n    props: {\n        currentTask: 'json',\n        taskList: 'json',\n        isBrowser: 'boolean',\n        acceptTask: 'function',\n        declineTask: 'function',\n    },\n});\nif (!customElements.get('component-cc-task-list')) {\n    customElements.define('component-cc-task-list', WebTaskList);\n}\nconst WebOutdialCallComponent = (0, react_to_web_component_1.default)(outdial_call_1.default);\nif (!customElements.get('component-cc-out-dial-call')) {\n    customElements.define('component-cc-out-dial-call', WebOutdialCallComponent);\n}\n\n\n//# sourceURL=webpack://@webex/cc-components/./src/wc.ts?");
 
 /***/ }),
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@webex/cc-components",
   "description": "Webex Contact Center UI Components Library for your custom contact center solutions",
-  "version": "1.28.0-ccwidgets.51",
+  "version": "1.28.0-ccwidgets.53",
   "main": "dist/index.js",
   "publishConfig": {
     "access": "public"
@@ -25,7 +25,7 @@
   },
   "dependencies": {
     "@r2wc/react-to-web-component": "2.0.3",
-    "@webex/cc-store": "1.28.0-ccwidgets.51"
+    "@webex/cc-store": "1.28.0-ccwidgets.53"
   },
   "devDependencies": {
     "@babel/core": "7.25.2",