@cqa-lib/cqa-ui 1.1.124 → 1.1.126

package/fesm2020/cqa-lib-cqa-ui.mjs

@@ -12685,10 +12685,10 @@ class LiveConversationComponent {
     }
 }
 LiveConversationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: LiveConversationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LiveConversationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: LiveConversationComponent, selector: "cqa-live-conversation", inputs: { conversation: "conversation", executionStatus: "executionStatus", stepFrom: "stepFrom", mode: "mode", stepId: "stepId", message: "message", remainingTime$: "remainingTime$", circleCircumference: "circleCircumference", showUserInputField: "showUserInputField", showUserInputFieldinDebug: "showUserInputFieldinDebug" }, outputs: { messageChange: "messageChange", sendMessage: "sendMessage", stopAgent: "stopAgent", stepAction: "stepAction", updateStepData: "updateStepData", redirectToCE: "redirectToCE", showUserInputFieldChange: "showUserInputFieldChange", showUserInputFieldinDebugChange: "showUserInputFieldinDebugChange" }, ngImport: i0, template: "<div class=\"cqa-ui-root\">\n  <!-- Step Regular Mode Conversation Section -->\n  <div\n    *ngIf=\"shouldShowStepRegular\"\n    class=\"conversation-section mt-2 p-3\"\n    style=\"background-color: #FEF3C7; border-radius: 8px; border: 1px solid #FCD34D;\"\n  >\n    <div class=\"user-action-prompt\" *ngIf=\"!showUserInputField\">\n      <div class=\"prompt-header d-flex align-items-center gap-2 mb-2\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 11V8\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 5H8.01\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n        </svg>\n        <span style=\"font-weight: 600; color: #92400E;\">User input required to proceed</span>\n      </div>\n      <div class=\"prompt-actions d-flex gap-2\">\n        <button\n          class=\"action-btn primary\"\n          (click)=\"onShowUserInputFieldChange(true)\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Enter more details\n        </button>\n        <button\n          class=\"action-btn secondary\"\n          (click)=\"onStopAgent()\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Stop\n        </button>\n      </div>\n    </div>\n\n    <div class=\"user-input-section\" *ngIf=\"showUserInputField\">\n      <div class=\"input-container d-flex gap-2 mb-2\">\n        <textarea\n          class=\"input-field\"\n          placeholder=\"Type your response...\"\n          [ngModel]=\"message\"\n          (ngModelChange)=\"onMessageChange($event)\"\n          (keyup.enter)=\"onSendMessage()\"\n          rows=\"2\"\n          autofocus\n          style=\"flex: 1; padding: 8px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: #FFFFFF; color: #0A0A0A; resize: none;\"\n        ></textarea>\n        <button\n          class=\"send-button\"\n          [disabled]=\"!message\"\n          (click)=\"onSendMessage()\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer;\"\n        >\n          Send\n        </button>\n      </div>\n      <button\n        class=\"cancel-button\"\n        (click)=\"onShowUserInputFieldChange(false)\"\n        style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n      >\n        Back\n      </button>\n    </div>\n  </div>\n\n  <!-- Step Debug Mode Conversation Section -->\n  <div\n    *ngIf=\"shouldShowStepDebug\"\n    class=\"conversation-section mt-2 p-3\"\n    style=\"background-color: #FEF3C7; border-radius: 8px; border: 1px solid #FCD34D;\"\n  >\n    <div class=\"user-action-prompt\" *ngIf=\"!showUserInputFieldinDebug\">\n      <div class=\"prompt-header d-flex align-items-center gap-2 mb-2\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 11V8\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 5H8.01\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n        </svg>\n        <span style=\"font-weight: 600; color: #92400E;\">User input required to proceed</span>\n      </div>\n      <div class=\"prompt-actions d-flex gap-2\">\n        <button\n          class=\"action-btn primary\"\n          (click)=\"onShowUserInputFieldinDebugChange(true)\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Enter more details\n        </button>\n        <button\n          class=\"action-btn secondary\"\n          (click)=\"onStepAction('skip')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Skip Step\n        </button>\n        <button\n          class=\"action-btn secondary\"\n          (click)=\"onStepAction('skip_delete')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Delete Step\n        </button>\n      </div>\n    </div>\n\n    <div class=\"user-input-section\" *ngIf=\"showUserInputFieldinDebug\">\n      <div class=\"input-container d-flex gap-2 mb-2\">\n        <textarea\n          class=\"input-field\"\n          placeholder=\"Type your response...\"\n          [ngModel]=\"message\"\n          (ngModelChange)=\"onMessageChange($event)\"\n          (keyup.enter)=\"onSendMessage()\"\n          rows=\"2\"\n          autofocus\n          style=\"flex: 1; padding: 8px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: #FFFFFF; color: #0A0A0A; resize: none;\"\n        ></textarea>\n      </div>\n      <div class=\"prompt-actions d-flex gap-2 mb-2\">\n        <button\n          class=\"action-btn primary\"\n          [disabled]=\"!message\"\n          (click)=\"onUpdateStepData('reRun', 'metadata')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Update and Rerun\n        </button>\n        <button\n          class=\"action-btn primary\"\n          [disabled]=\"!message\"\n          (click)=\"onUpdateStepData('aiAgent', 'metadata')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Add New Steps and Rerun\n        </button>\n      </div>\n      <button\n        class=\"cancel-button\"\n        (click)=\"onShowUserInputFieldinDebugChange(false)\"\n        style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n      >\n        Back\n      </button>\n    </div>\n  </div>\n\n  <!-- Test Case Group Level Conversation Input Section -->\n  <div\n  *ngIf=\"shouldShowTestCaseGroup\"\n  class=\"conversation-input-section mt-3 p-3\"\n  style=\"background-color: #EFF6FF; border-radius: 8px; border: 1px solid #BEDBFF;\"\n>\n  <div class=\"d-flex justify-content-between align-items-center gap-2\">\n    <div\n      *ngIf=\"remainingTime$ | async as remainingTime\"\n      class=\"mini-timer-container\"\n    >\n      <svg class=\"mini-progress-ring\" width=\"44\" height=\"44\">\n        <circle\n          class=\"mini-progress-ring__circle\"\n          stroke=\"#3e98c7\"\n          stroke-width=\"4\"\n          fill=\"transparent\"\n          r=\"20\"\n          cx=\"22\"\n          cy=\"22\"\n          [style.strokeDasharray]=\"circleCircumference\"\n          [style.strokeDashoffset.px]=\"getDashOffset(remainingTime)\"\n        />\n      </svg>\n      <div class=\"mini-timer-text\" style=\"color: #374151; font-size: 12px; font-weight: 500;\">\n        <span class=\"mini-time\">{{\n          formatTime(remainingTime)\n        }}</span>\n      </div>\n    </div>\n    <input\n      *ngIf=\"!isLocatorNotDetect\"\n      [ngModel]=\"message\"\n      (ngModelChange)=\"onMessageChange($event)\"\n      [disabled]=\"isInputDisabled\"\n      [type]=\"inputType\"\n      class=\"form-control\"\n      style=\"\n        height: 36px;\n        flex: 1;\n        padding: 8px 12px;\n        border-radius: 8px;\n        border: 1px solid #D1D5DB;\n        background-color: #FFFFFF;\n        color: #0A0A0A;\n        font-size: 14px;\n        transition: border-color 0.2s ease, box-shadow 0.2s ease;\n        outline: none;\n      \"\n      [style.border-color]=\"isInputDisabled ? '#E5E7EB' : '#D1D5DB'\"\n      [style.background-color]=\"isInputDisabled ? '#F9FAFB' : '#FFFFFF'\"\n      [style.color]=\"isInputDisabled ? '#9CA3AF' : '#0A0A0A'\"\n      [style.cursor]=\"isInputDisabled ? 'not-allowed' : 'text'\"\n      [placeholder]=\"inputPlaceholder\"\n      onfocus=\"if (!this.disabled) { this.style.borderColor='#1447E6'; this.style.boxShadow='0 0 0 3px rgba(63, 67, 238, 0.1)'; }\"\n      onblur=\"this.style.borderColor='#D1D5DB'; this.style.boxShadow='none';\"\n    />\n    <div\n      *ngIf=\"isLocatorNotDetect\"\n      (click)=\"onRedirectToCE()\"\n      style=\"cursor: pointer;\"\n    >\n      <button\n        class=\"btn\"\n        style=\"\n          padding: 8px 16px;\n          border-radius: 8px;\n          border: 1px solid #D1D5DB;\n          background-color: #FFFFFF;\n          color: #374151;\n          cursor: pointer;\n          font-weight: 500;\n          font-size: 14px;\n          transition: background-color 0.2s ease;\n        \"\n        onmouseover=\"this.style.backgroundColor='#F9FAFB'\"\n        onmouseout=\"this.style.backgroundColor='#FFFFFF'\"\n      >\n        Record\n      </button>\n    </div>\n    <button\n      [disabled]=\"isResumeDisabled\"\n      class=\"btn\"\n      (click)=\"onSendMessage()\"\n      style=\"\n        height: 36px;\n        padding: 8px 16px;\n        border-radius: 8px;\n        border: none;\n        background-color: #1447E6;\n        color: #FFFFFF;\n        cursor: pointer;\n        font-weight: 500;\n        font-size: 14px;\n        transition: background-color 0.2s ease;\n      \"\n      [style.background-color]=\"isResumeDisabled ? '#E2E2E3' : '#1447E6'\"\n      [style.color]=\"isResumeDisabled ? '#9CA3AF' : '#FFFFFF'\"\n      [style.cursor]=\"isResumeDisabled ? 'not-allowed' : 'pointer'\"\n      onmouseover=\"if (!this.disabled) this.style.backgroundColor='#0F3CBA'\"\n      onmouseout=\"if (!this.disabled) this.style.backgroundColor='#1447E6'\"\n    >\n      Resume\n    </button>\n  </div>\n</div>\n</div>", directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "async": i2$1.AsyncPipe } });
+LiveConversationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.4.0", type: LiveConversationComponent, selector: "cqa-live-conversation", inputs: { conversation: "conversation", executionStatus: "executionStatus", stepFrom: "stepFrom", mode: "mode", stepId: "stepId", message: "message", remainingTime$: "remainingTime$", circleCircumference: "circleCircumference", showUserInputField: "showUserInputField", showUserInputFieldinDebug: "showUserInputFieldinDebug" }, outputs: { messageChange: "messageChange", sendMessage: "sendMessage", stopAgent: "stopAgent", stepAction: "stepAction", updateStepData: "updateStepData", redirectToCE: "redirectToCE", showUserInputFieldChange: "showUserInputFieldChange", showUserInputFieldinDebugChange: "showUserInputFieldinDebugChange" }, ngImport: i0, template: "<div class=\"cqa-ui-root\">\n  <!-- Step Regular Mode Conversation Section -->\n  <div\n    *ngIf=\"shouldShowStepRegular\"\n    class=\"conversation-section cqa-mt-2 cqa-p-3\"\n    style=\"background-color: #FEF3C7; border-radius: 8px; border: 1px solid #FCD34D;\"\n  >\n    <div class=\"user-action-prompt\" *ngIf=\"!showUserInputField\">\n      <div class=\"prompt-header cqa-flex cqa-items-center cqa-gap-2 cqa-mb-2\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 11V8\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 5H8.01\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n        </svg>\n        <span style=\"font-weight: 600; color: #92400E;\">User input required to proceed</span>\n      </div>\n      <div class=\"prompt-actions cqa-flex cqa-gap-2\">\n        <button\n          class=\"action-btn primary\"\n          (click)=\"onShowUserInputFieldChange(true)\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Enter more details\n        </button>\n        <button\n          class=\"action-btn secondary\"\n          (click)=\"onStopAgent()\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Stop\n        </button>\n      </div>\n    </div>\n\n    <div class=\"user-input-section\" *ngIf=\"showUserInputField\">\n      <div class=\"input-container cqa-flex cqa-gap-2 cqa-mb-2\">\n        <textarea\n          class=\"input-field\"\n          placeholder=\"Type your response...\"\n          [ngModel]=\"message\"\n          (ngModelChange)=\"onMessageChange($event)\"\n          (keyup.enter)=\"onSendMessage()\"\n          rows=\"2\"\n          autofocus\n          style=\"flex: 1; padding: 8px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: #FFFFFF; color: #0A0A0A; resize: none;\"\n        ></textarea>\n        <button\n          class=\"send-button\"\n          [disabled]=\"!message\"\n          (click)=\"onSendMessage()\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer;\"\n        >\n          Send\n        </button>\n      </div>\n      <button\n        class=\"cancel-button\"\n        (click)=\"onShowUserInputFieldChange(false)\"\n        style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n      >\n        Back\n      </button>\n    </div>\n  </div>\n\n  <!-- Step Debug Mode Conversation Section -->\n  <div\n    *ngIf=\"shouldShowStepDebug\"\n    class=\"conversation-section cqa-mt-2 cqa-p-3\"\n    style=\"background-color: #FEF3C7; border-radius: 8px; border: 1px solid #FCD34D;\"\n  >\n    <div class=\"user-action-prompt\" *ngIf=\"!showUserInputFieldinDebug\">\n      <div class=\"prompt-header cqa-flex cqa-items-center cqa-gap-2 cqa-mb-2\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 11V8\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 5H8.01\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n        </svg>\n        <span style=\"font-weight: 600; color: #92400E;\">User input required to proceed</span>\n      </div>\n      <div class=\"prompt-actions cqa-flex cqa-gap-2\">\n        <button\n          class=\"action-btn primary\"\n          (click)=\"onShowUserInputFieldinDebugChange(true)\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Enter more details\n        </button>\n        <button\n          class=\"action-btn secondary\"\n          (click)=\"onStepAction('skip')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Skip Step\n        </button>\n        <button\n          class=\"action-btn secondary\"\n          (click)=\"onStepAction('skip_delete')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Delete Step\n        </button>\n      </div>\n    </div>\n\n    <div class=\"user-input-section\" *ngIf=\"showUserInputFieldinDebug\">\n      <div class=\"input-container cqa-flex cqa-gap-2 cqa-mb-2\">\n        <textarea\n          class=\"input-field\"\n          placeholder=\"Type your response...\"\n          [ngModel]=\"message\"\n          (ngModelChange)=\"onMessageChange($event)\"\n          (keyup.enter)=\"onSendMessage()\"\n          rows=\"2\"\n          autofocus\n          style=\"flex: 1; padding: 8px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: #FFFFFF; color: #0A0A0A; resize: none;\"\n        ></textarea>\n      </div>\n      <div class=\"prompt-actions cqa-flex cqa-gap-2 cqa-mb-2\">\n        <button\n          class=\"action-btn primary\"\n          [disabled]=\"!message\"\n          (click)=\"onUpdateStepData('reRun', 'metadata')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Update and Rerun\n        </button>\n        <button\n          class=\"action-btn primary\"\n          [disabled]=\"!message\"\n          (click)=\"onUpdateStepData('aiAgent', 'metadata')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Add New Steps and Rerun\n        </button>\n      </div>\n      <button\n        class=\"cancel-button\"\n        (click)=\"onShowUserInputFieldinDebugChange(false)\"\n        style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n      >\n        Back\n      </button>\n    </div>\n  </div>\n\n  <!-- Test Case Group Level Conversation Input Section -->\n  <div\n  *ngIf=\"shouldShowTestCaseGroup\"\n  class=\"conversation-input-section cqa-mt-3 cqa-p-3\"\n>\n  <div class=\"cqa-flex cqa-justify-between cqa-items-center cqa-gap-2\">\n    <div\n      *ngIf=\"remainingTime$ | async as remainingTime\"\n      class=\"mini-timer-container\"\n    >\n      <svg class=\"mini-progress-ring\" width=\"44\" height=\"44\">\n        <circle\n          class=\"mini-progress-ring__circle\"\n          stroke=\"#3e98c7\"\n          stroke-width=\"4\"\n          fill=\"transparent\"\n          r=\"20\"\n          cx=\"22\"\n          cy=\"22\"\n          [style.strokeDasharray]=\"circleCircumference\"\n          [style.strokeDashoffset.px]=\"getDashOffset(remainingTime)\"\n        />\n      </svg>\n      <div class=\"mini-timer-text\" style=\"color: #374151; font-size: 12px; font-weight: 500;\">\n        <span class=\"mini-time\">{{\n          formatTime(remainingTime)\n        }}</span>\n      </div>\n    </div>\n\n    <div class=\"cqa-flex cqa-flex-col cqa-gap-1\" style=\"flex:1 1 0;\">\n      <div *ngIf=\"!isLocatorNotDetect\" class=\"cqa-text-md cqa-text-[#161617] cqa-font-medium cqa-font-inter\">Enter the timeout duration to continue execution.</div>\n      <div class=\"cqa-flex cqa-justify-between cqa-items-center cqa-gap-2\">\n        <input\n          *ngIf=\"!isLocatorNotDetect\"\n          [ngModel]=\"message\"\n          (ngModelChange)=\"onMessageChange($event)\"\n          [disabled]=\"isInputDisabled\"\n          [type]=\"inputType\"\n          class=\"form-control\"\n          style=\"\n            height: 36px;\n            flex: 1;\n            padding: 9px 13px;\n            border-radius: 5px;\n            border: 1px solid #E2E2E3;\n            background-color: #FFFFFF;\n            color: #0A0A0A;\n            font-size: 14px;\n            transition: border-color 0.2s ease, box-shadow 0.2s ease;\n            outline: none;\n          \"\n          [style.border-color]=\"isInputDisabled ? '#E5E7EB' : '#D1D5DB'\"\n          [style.background-color]=\"isInputDisabled ? '#F9FAFB' : '#FFFFFF'\"\n          [style.color]=\"isInputDisabled ? '#9CA3AF' : '#0A0A0A'\"\n          [style.cursor]=\"isInputDisabled ? 'not-allowed' : 'text'\"\n          [placeholder]=\"inputPlaceholder\"\n          onfocus=\"if (!this.disabled) { this.style.borderColor='#1447E6'; this.style.boxShadow='0 0 0 3px rgba(63, 67, 238, 0.1)'; }\"\n          onblur=\"this.style.borderColor='#D1D5DB'; this.style.boxShadow='none';\"\n        />\n          <div\n          *ngIf=\"isLocatorNotDetect\"\n          (click)=\"onRedirectToCE()\"\n          style=\"cursor: pointer;\"\n        >\n          <button\n            class=\"btn\"\n            style=\"\n              padding: 8px 16px;\n              border-radius: 8px;\n              border: 1px solid #D1D5DB;\n              background-color: #FFFFFF;\n              color: #374151;\n              cursor: pointer;\n              font-weight: 500;\n              font-size: 14px;\n              transition: background-color 0.2s ease;\n            \"\n            onmouseover=\"this.style.backgroundColor='#F9FAFB'\"\n            onmouseout=\"this.style.backgroundColor='#FFFFFF'\"\n          >\n            Record\n          </button>\n        </div>\n        <button\n          [disabled]=\"isResumeDisabled\"\n          class=\"btn\"\n          (click)=\"onSendMessage()\"\n          style=\"\n            height: 36px;\n            padding: 8px 16px;\n            border-radius: 8px;\n            border: none;\n            background-color: #1447E6;\n            color: #FFFFFF;\n            cursor: pointer;\n            font-weight: 500;\n            font-size: 14px;\n            transition: background-color 0.2s ease;\n          \"\n          [style.background-color]=\"isResumeDisabled ? '#E2E2E3' : '#1447E6'\"\n          [style.color]=\"isResumeDisabled ? '#9CA3AF' : '#FFFFFF'\"\n          [style.cursor]=\"isResumeDisabled ? 'not-allowed' : 'pointer'\"\n          onmouseover=\"if (!this.disabled) this.style.backgroundColor='#0F3CBA'\"\n          onmouseout=\"if (!this.disabled) this.style.backgroundColor='#1447E6'\"\n        >\n          Resume\n        </button>\n      </div>\n    </div>\n    \n   \n  </div>\n</div>\n</div>", directives: [{ type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "async": i2$1.AsyncPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.4.0", ngImport: i0, type: LiveConversationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cqa-live-conversation', template: "<div class=\"cqa-ui-root\">\n  <!-- Step Regular Mode Conversation Section -->\n  <div\n    *ngIf=\"shouldShowStepRegular\"\n    class=\"conversation-section mt-2 p-3\"\n    style=\"background-color: #FEF3C7; border-radius: 8px; border: 1px solid #FCD34D;\"\n  >\n    <div class=\"user-action-prompt\" *ngIf=\"!showUserInputField\">\n      <div class=\"prompt-header d-flex align-items-center gap-2 mb-2\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 11V8\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 5H8.01\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n        </svg>\n        <span style=\"font-weight: 600; color: #92400E;\">User input required to proceed</span>\n      </div>\n      <div class=\"prompt-actions d-flex gap-2\">\n        <button\n          class=\"action-btn primary\"\n          (click)=\"onShowUserInputFieldChange(true)\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Enter more details\n        </button>\n        <button\n          class=\"action-btn secondary\"\n          (click)=\"onStopAgent()\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Stop\n        </button>\n      </div>\n    </div>\n\n    <div class=\"user-input-section\" *ngIf=\"showUserInputField\">\n      <div class=\"input-container d-flex gap-2 mb-2\">\n        <textarea\n          class=\"input-field\"\n          placeholder=\"Type your response...\"\n          [ngModel]=\"message\"\n          (ngModelChange)=\"onMessageChange($event)\"\n          (keyup.enter)=\"onSendMessage()\"\n          rows=\"2\"\n          autofocus\n          style=\"flex: 1; padding: 8px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: #FFFFFF; color: #0A0A0A; resize: none;\"\n        ></textarea>\n        <button\n          class=\"send-button\"\n          [disabled]=\"!message\"\n          (click)=\"onSendMessage()\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer;\"\n        >\n          Send\n        </button>\n      </div>\n      <button\n        class=\"cancel-button\"\n        (click)=\"onShowUserInputFieldChange(false)\"\n        style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n      >\n        Back\n      </button>\n    </div>\n  </div>\n\n  <!-- Step Debug Mode Conversation Section -->\n  <div\n    *ngIf=\"shouldShowStepDebug\"\n    class=\"conversation-section mt-2 p-3\"\n    style=\"background-color: #FEF3C7; border-radius: 8px; border: 1px solid #FCD34D;\"\n  >\n    <div class=\"user-action-prompt\" *ngIf=\"!showUserInputFieldinDebug\">\n      <div class=\"prompt-header d-flex align-items-center gap-2 mb-2\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 11V8\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 5H8.01\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n        </svg>\n        <span style=\"font-weight: 600; color: #92400E;\">User input required to proceed</span>\n      </div>\n      <div class=\"prompt-actions d-flex gap-2\">\n        <button\n          class=\"action-btn primary\"\n          (click)=\"onShowUserInputFieldinDebugChange(true)\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Enter more details\n        </button>\n        <button\n          class=\"action-btn secondary\"\n          (click)=\"onStepAction('skip')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Skip Step\n        </button>\n        <button\n          class=\"action-btn secondary\"\n          (click)=\"onStepAction('skip_delete')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Delete Step\n        </button>\n      </div>\n    </div>\n\n    <div class=\"user-input-section\" *ngIf=\"showUserInputFieldinDebug\">\n      <div class=\"input-container d-flex gap-2 mb-2\">\n        <textarea\n          class=\"input-field\"\n          placeholder=\"Type your response...\"\n          [ngModel]=\"message\"\n          (ngModelChange)=\"onMessageChange($event)\"\n          (keyup.enter)=\"onSendMessage()\"\n          rows=\"2\"\n          autofocus\n          style=\"flex: 1; padding: 8px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: #FFFFFF; color: #0A0A0A; resize: none;\"\n        ></textarea>\n      </div>\n      <div class=\"prompt-actions d-flex gap-2 mb-2\">\n        <button\n          class=\"action-btn primary\"\n          [disabled]=\"!message\"\n          (click)=\"onUpdateStepData('reRun', 'metadata')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Update and Rerun\n        </button>\n        <button\n          class=\"action-btn primary\"\n          [disabled]=\"!message\"\n          (click)=\"onUpdateStepData('aiAgent', 'metadata')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Add New Steps and Rerun\n        </button>\n      </div>\n      <button\n        class=\"cancel-button\"\n        (click)=\"onShowUserInputFieldinDebugChange(false)\"\n        style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n      >\n        Back\n      </button>\n    </div>\n  </div>\n\n  <!-- Test Case Group Level Conversation Input Section -->\n  <div\n  *ngIf=\"shouldShowTestCaseGroup\"\n  class=\"conversation-input-section mt-3 p-3\"\n  style=\"background-color: #EFF6FF; border-radius: 8px; border: 1px solid #BEDBFF;\"\n>\n  <div class=\"d-flex justify-content-between align-items-center gap-2\">\n    <div\n      *ngIf=\"remainingTime$ | async as remainingTime\"\n      class=\"mini-timer-container\"\n    >\n      <svg class=\"mini-progress-ring\" width=\"44\" height=\"44\">\n        <circle\n          class=\"mini-progress-ring__circle\"\n          stroke=\"#3e98c7\"\n          stroke-width=\"4\"\n          fill=\"transparent\"\n          r=\"20\"\n          cx=\"22\"\n          cy=\"22\"\n          [style.strokeDasharray]=\"circleCircumference\"\n          [style.strokeDashoffset.px]=\"getDashOffset(remainingTime)\"\n        />\n      </svg>\n      <div class=\"mini-timer-text\" style=\"color: #374151; font-size: 12px; font-weight: 500;\">\n        <span class=\"mini-time\">{{\n          formatTime(remainingTime)\n        }}</span>\n      </div>\n    </div>\n    <input\n      *ngIf=\"!isLocatorNotDetect\"\n      [ngModel]=\"message\"\n      (ngModelChange)=\"onMessageChange($event)\"\n      [disabled]=\"isInputDisabled\"\n      [type]=\"inputType\"\n      class=\"form-control\"\n      style=\"\n        height: 36px;\n        flex: 1;\n        padding: 8px 12px;\n        border-radius: 8px;\n        border: 1px solid #D1D5DB;\n        background-color: #FFFFFF;\n        color: #0A0A0A;\n        font-size: 14px;\n        transition: border-color 0.2s ease, box-shadow 0.2s ease;\n        outline: none;\n      \"\n      [style.border-color]=\"isInputDisabled ? '#E5E7EB' : '#D1D5DB'\"\n      [style.background-color]=\"isInputDisabled ? '#F9FAFB' : '#FFFFFF'\"\n      [style.color]=\"isInputDisabled ? '#9CA3AF' : '#0A0A0A'\"\n      [style.cursor]=\"isInputDisabled ? 'not-allowed' : 'text'\"\n      [placeholder]=\"inputPlaceholder\"\n      onfocus=\"if (!this.disabled) { this.style.borderColor='#1447E6'; this.style.boxShadow='0 0 0 3px rgba(63, 67, 238, 0.1)'; }\"\n      onblur=\"this.style.borderColor='#D1D5DB'; this.style.boxShadow='none';\"\n    />\n    <div\n      *ngIf=\"isLocatorNotDetect\"\n      (click)=\"onRedirectToCE()\"\n      style=\"cursor: pointer;\"\n    >\n      <button\n        class=\"btn\"\n        style=\"\n          padding: 8px 16px;\n          border-radius: 8px;\n          border: 1px solid #D1D5DB;\n          background-color: #FFFFFF;\n          color: #374151;\n          cursor: pointer;\n          font-weight: 500;\n          font-size: 14px;\n          transition: background-color 0.2s ease;\n        \"\n        onmouseover=\"this.style.backgroundColor='#F9FAFB'\"\n        onmouseout=\"this.style.backgroundColor='#FFFFFF'\"\n      >\n        Record\n      </button>\n    </div>\n    <button\n      [disabled]=\"isResumeDisabled\"\n      class=\"btn\"\n      (click)=\"onSendMessage()\"\n      style=\"\n        height: 36px;\n        padding: 8px 16px;\n        border-radius: 8px;\n        border: none;\n        background-color: #1447E6;\n        color: #FFFFFF;\n        cursor: pointer;\n        font-weight: 500;\n        font-size: 14px;\n        transition: background-color 0.2s ease;\n      \"\n      [style.background-color]=\"isResumeDisabled ? '#E2E2E3' : '#1447E6'\"\n      [style.color]=\"isResumeDisabled ? '#9CA3AF' : '#FFFFFF'\"\n      [style.cursor]=\"isResumeDisabled ? 'not-allowed' : 'pointer'\"\n      onmouseover=\"if (!this.disabled) this.style.backgroundColor='#0F3CBA'\"\n      onmouseout=\"if (!this.disabled) this.style.backgroundColor='#1447E6'\"\n    >\n      Resume\n    </button>\n  </div>\n</div>\n</div>", styles: [] }]
+            args: [{ selector: 'cqa-live-conversation', template: "<div class=\"cqa-ui-root\">\n  <!-- Step Regular Mode Conversation Section -->\n  <div\n    *ngIf=\"shouldShowStepRegular\"\n    class=\"conversation-section cqa-mt-2 cqa-p-3\"\n    style=\"background-color: #FEF3C7; border-radius: 8px; border: 1px solid #FCD34D;\"\n  >\n    <div class=\"user-action-prompt\" *ngIf=\"!showUserInputField\">\n      <div class=\"prompt-header cqa-flex cqa-items-center cqa-gap-2 cqa-mb-2\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 11V8\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 5H8.01\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n        </svg>\n        <span style=\"font-weight: 600; color: #92400E;\">User input required to proceed</span>\n      </div>\n      <div class=\"prompt-actions cqa-flex cqa-gap-2\">\n        <button\n          class=\"action-btn primary\"\n          (click)=\"onShowUserInputFieldChange(true)\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Enter more details\n        </button>\n        <button\n          class=\"action-btn secondary\"\n          (click)=\"onStopAgent()\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Stop\n        </button>\n      </div>\n    </div>\n\n    <div class=\"user-input-section\" *ngIf=\"showUserInputField\">\n      <div class=\"input-container cqa-flex cqa-gap-2 cqa-mb-2\">\n        <textarea\n          class=\"input-field\"\n          placeholder=\"Type your response...\"\n          [ngModel]=\"message\"\n          (ngModelChange)=\"onMessageChange($event)\"\n          (keyup.enter)=\"onSendMessage()\"\n          rows=\"2\"\n          autofocus\n          style=\"flex: 1; padding: 8px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: #FFFFFF; color: #0A0A0A; resize: none;\"\n        ></textarea>\n        <button\n          class=\"send-button\"\n          [disabled]=\"!message\"\n          (click)=\"onSendMessage()\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer;\"\n        >\n          Send\n        </button>\n      </div>\n      <button\n        class=\"cancel-button\"\n        (click)=\"onShowUserInputFieldChange(false)\"\n        style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n      >\n        Back\n      </button>\n    </div>\n  </div>\n\n  <!-- Step Debug Mode Conversation Section -->\n  <div\n    *ngIf=\"shouldShowStepDebug\"\n    class=\"conversation-section cqa-mt-2 cqa-p-3\"\n    style=\"background-color: #FEF3C7; border-radius: 8px; border: 1px solid #FCD34D;\"\n  >\n    <div class=\"user-action-prompt\" *ngIf=\"!showUserInputFieldinDebug\">\n      <div class=\"prompt-header cqa-flex cqa-items-center cqa-gap-2 cqa-mb-2\">\n        <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n          <path d=\"M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12z\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 11V8\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n          <path d=\"M8 5H8.01\" stroke=\"#92400E\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\n        </svg>\n        <span style=\"font-weight: 600; color: #92400E;\">User input required to proceed</span>\n      </div>\n      <div class=\"prompt-actions cqa-flex cqa-gap-2\">\n        <button\n          class=\"action-btn primary\"\n          (click)=\"onShowUserInputFieldinDebugChange(true)\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Enter more details\n        </button>\n        <button\n          class=\"action-btn secondary\"\n          (click)=\"onStepAction('skip')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Skip Step\n        </button>\n        <button\n          class=\"action-btn secondary\"\n          (click)=\"onStepAction('skip_delete')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Delete Step\n        </button>\n      </div>\n    </div>\n\n    <div class=\"user-input-section\" *ngIf=\"showUserInputFieldinDebug\">\n      <div class=\"input-container cqa-flex cqa-gap-2 cqa-mb-2\">\n        <textarea\n          class=\"input-field\"\n          placeholder=\"Type your response...\"\n          [ngModel]=\"message\"\n          (ngModelChange)=\"onMessageChange($event)\"\n          (keyup.enter)=\"onSendMessage()\"\n          rows=\"2\"\n          autofocus\n          style=\"flex: 1; padding: 8px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: #FFFFFF; color: #0A0A0A; resize: none;\"\n        ></textarea>\n      </div>\n      <div class=\"prompt-actions cqa-flex cqa-gap-2 cqa-mb-2\">\n        <button\n          class=\"action-btn primary\"\n          [disabled]=\"!message\"\n          (click)=\"onUpdateStepData('reRun', 'metadata')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Update and Rerun\n        </button>\n        <button\n          class=\"action-btn primary\"\n          [disabled]=\"!message\"\n          (click)=\"onUpdateStepData('aiAgent', 'metadata')\"\n          style=\"padding: 8px 16px; border-radius: 6px; border: none; background-color: #3F43EE; color: white; cursor: pointer; font-size: 14px;\"\n        >\n          Add New Steps and Rerun\n        </button>\n      </div>\n      <button\n        class=\"cancel-button\"\n        (click)=\"onShowUserInputFieldinDebugChange(false)\"\n        style=\"padding: 8px 16px; border-radius: 6px; border: 1px solid #D1D5DB; background-color: white; cursor: pointer; font-size: 14px;\"\n      >\n        Back\n      </button>\n    </div>\n  </div>\n\n  <!-- Test Case Group Level Conversation Input Section -->\n  <div\n  *ngIf=\"shouldShowTestCaseGroup\"\n  class=\"conversation-input-section cqa-mt-3 cqa-p-3\"\n>\n  <div class=\"cqa-flex cqa-justify-between cqa-items-center cqa-gap-2\">\n    <div\n      *ngIf=\"remainingTime$ | async as remainingTime\"\n      class=\"mini-timer-container\"\n    >\n      <svg class=\"mini-progress-ring\" width=\"44\" height=\"44\">\n        <circle\n          class=\"mini-progress-ring__circle\"\n          stroke=\"#3e98c7\"\n          stroke-width=\"4\"\n          fill=\"transparent\"\n          r=\"20\"\n          cx=\"22\"\n          cy=\"22\"\n          [style.strokeDasharray]=\"circleCircumference\"\n          [style.strokeDashoffset.px]=\"getDashOffset(remainingTime)\"\n        />\n      </svg>\n      <div class=\"mini-timer-text\" style=\"color: #374151; font-size: 12px; font-weight: 500;\">\n        <span class=\"mini-time\">{{\n          formatTime(remainingTime)\n        }}</span>\n      </div>\n    </div>\n\n    <div class=\"cqa-flex cqa-flex-col cqa-gap-1\" style=\"flex:1 1 0;\">\n      <div *ngIf=\"!isLocatorNotDetect\" class=\"cqa-text-md cqa-text-[#161617] cqa-font-medium cqa-font-inter\">Enter the timeout duration to continue execution.</div>\n      <div class=\"cqa-flex cqa-justify-between cqa-items-center cqa-gap-2\">\n        <input\n          *ngIf=\"!isLocatorNotDetect\"\n          [ngModel]=\"message\"\n          (ngModelChange)=\"onMessageChange($event)\"\n          [disabled]=\"isInputDisabled\"\n          [type]=\"inputType\"\n          class=\"form-control\"\n          style=\"\n            height: 36px;\n            flex: 1;\n            padding: 9px 13px;\n            border-radius: 5px;\n            border: 1px solid #E2E2E3;\n            background-color: #FFFFFF;\n            color: #0A0A0A;\n            font-size: 14px;\n            transition: border-color 0.2s ease, box-shadow 0.2s ease;\n            outline: none;\n          \"\n          [style.border-color]=\"isInputDisabled ? '#E5E7EB' : '#D1D5DB'\"\n          [style.background-color]=\"isInputDisabled ? '#F9FAFB' : '#FFFFFF'\"\n          [style.color]=\"isInputDisabled ? '#9CA3AF' : '#0A0A0A'\"\n          [style.cursor]=\"isInputDisabled ? 'not-allowed' : 'text'\"\n          [placeholder]=\"inputPlaceholder\"\n          onfocus=\"if (!this.disabled) { this.style.borderColor='#1447E6'; this.style.boxShadow='0 0 0 3px rgba(63, 67, 238, 0.1)'; }\"\n          onblur=\"this.style.borderColor='#D1D5DB'; this.style.boxShadow='none';\"\n        />\n          <div\n          *ngIf=\"isLocatorNotDetect\"\n          (click)=\"onRedirectToCE()\"\n          style=\"cursor: pointer;\"\n        >\n          <button\n            class=\"btn\"\n            style=\"\n              padding: 8px 16px;\n              border-radius: 8px;\n              border: 1px solid #D1D5DB;\n              background-color: #FFFFFF;\n              color: #374151;\n              cursor: pointer;\n              font-weight: 500;\n              font-size: 14px;\n              transition: background-color 0.2s ease;\n            \"\n            onmouseover=\"this.style.backgroundColor='#F9FAFB'\"\n            onmouseout=\"this.style.backgroundColor='#FFFFFF'\"\n          >\n            Record\n          </button>\n        </div>\n        <button\n          [disabled]=\"isResumeDisabled\"\n          class=\"btn\"\n          (click)=\"onSendMessage()\"\n          style=\"\n            height: 36px;\n            padding: 8px 16px;\n            border-radius: 8px;\n            border: none;\n            background-color: #1447E6;\n            color: #FFFFFF;\n            cursor: pointer;\n            font-weight: 500;\n            font-size: 14px;\n            transition: background-color 0.2s ease;\n          \"\n          [style.background-color]=\"isResumeDisabled ? '#E2E2E3' : '#1447E6'\"\n          [style.color]=\"isResumeDisabled ? '#9CA3AF' : '#FFFFFF'\"\n          [style.cursor]=\"isResumeDisabled ? 'not-allowed' : 'pointer'\"\n          onmouseover=\"if (!this.disabled) this.style.backgroundColor='#0F3CBA'\"\n          onmouseout=\"if (!this.disabled) this.style.backgroundColor='#1447E6'\"\n        >\n          Resume\n        </button>\n      </div>\n    </div>\n    \n   \n  </div>\n</div>\n</div>", styles: [] }]
         }], propDecorators: { conversation: [{
                 type: Input
             }], executionStatus: [{