commons-assessment 12.1.2-dev.0 → 12.1.2-dev.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/commons-assessment.umd.js +27 -4
- package/bundles/commons-assessment.umd.js.map +1 -1
- package/esm2015/lib/modules/assessment-maker/assessment-maker.component.js +25 -2
- package/esm2015/lib/modules/assessment-maker/components/question-bank-picker/question-bank-picker.component.js +3 -3
- package/esm2015/lib/modules/question-bank/question-bank.component.js +2 -2
- package/fesm2015/commons-assessment.js +27 -4
- package/fesm2015/commons-assessment.js.map +1 -1
- package/lib/modules/assessment-maker/assessment-maker.component.d.ts +6 -0
- package/package.json +1 -1
- package/src/lib/assets/theme/styles.global.scss +127 -6
|
@@ -5182,7 +5182,7 @@
|
|
|
5182
5182
|
this.allQuestions = [];
|
|
5183
5183
|
this.filteredQuestions = [];
|
|
5184
5184
|
this.currentPage = 0;
|
|
5185
|
-
this.pageSize =
|
|
5185
|
+
this.pageSize = 100;
|
|
5186
5186
|
this.totalElements = 0;
|
|
5187
5187
|
this.hasNext = false;
|
|
5188
5188
|
this.isLoading = false;
|
|
@@ -5450,7 +5450,7 @@
|
|
|
5450
5450
|
return QuestionBankPickerComponent;
|
|
5451
5451
|
}());
|
|
5452
5452
|
QuestionBankPickerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: QuestionBankPickerComponent, deps: [{ token: AssessmentMakerService }, { token: i1__namespace.MatDialogRef }, { token: i1.MAT_DIALOG_DATA }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
5453
|
-
QuestionBankPickerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionBankPickerComponent, selector: "lib-question-bank-picker", ngImport: i0__namespace, template: "<div class=\"d-flex flex-column h-100 question-bank-picker\">\r\n <!-- Header: Back Arrow + Title + Subtitle -->\r\n <div class=\"d-flex align-items-center justify-content-between px-4 py-3 border-bottom picker-header\">\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <button (click)=\"close()\" class=\"btn-icon-back\" [attr.aria-label]=\"labelConfig['COMMONS_ASSESSMENT.LABEL.GO_BACK'] || 'Go Back'\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.GO_BACK']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/go-back.svg')\"\r\n class=\"action-icon\" />\r\n </button>\r\n <div>\r\n <h4 class=\"mb-0 fw-bold picker-title\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.IMPORT_FROM_QUESTION_BANK'] || 'Import from Question Bank'}}\r\n </h4>\r\n <p class=\"mb-0 picker-subtitle\">\r\n <span class=\"text-secondary\">{{labelConfig['COMMONS_ASSESSMENT.LABEL.SELECTED_SECTION'] || 'Selected Section'}}:</span>\r\n <span class=\"text-primary fw-semibold ms-1\" *ngIf=\"targetSectionName\">{{targetSectionName}}</span>\r\n <span class=\"text-secondary ms-1\" *ngIf=\"!targetSectionName\">{{labelConfig['COMMONS_ASSESSMENT.LABEL.IMPORT_QUESTIONS_INTO_NEW_SECTION'] || 'Import questions into a new section'}}</span>\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Search & Filter Controls Deck -->\r\n <div class=\"picker-search-deck px-4 pt-3 pb-2 border-bottom\">\r\n <div class=\"d-flex gap-3 align-items-center mb-2\">\r\n <!-- Search Box -->\r\n <div class=\"search-input-wrapper flex-grow-1 position-relative\">\r\n <input type=\"text\"\r\n class=\"form-control search-input\"\r\n [placeholder]=\"labelConfig['COMMONS_ASSESSMENT.LABEL.SEARCH_QUESTION'] || 'Search Question'\"\r\n [ngModel]=\"searchTerm\"\r\n (ngModelChange)=\"onSearchChange($event)\">\r\n <button *ngIf=\"searchTerm\" (click)=\"clearSearch()\" class=\"search-clear-btn\" aria-label=\"Clear Search\">\r\n \u2715\r\n </button>\r\n </div>\r\n\r\n <!-- Type Filter Dropdown using arrow-down-black.svg -->\r\n <div class=\"type-filter-wrapper position-relative\">\r\n <select class=\"form-select filter-select cursor-pointer\"\r\n [ngModel]=\"selectedTypeCode\"\r\n (ngModelChange)=\"onTypeFilterChange($event)\">\r\n <option value=\"\">{{labelConfig['COMMONS_ASSESSMENT.LABEL.ALL_TYPES'] || 'All Types'}}</option>\r\n <option *ngFor=\"let type of questionTypes\" [value]=\"type.code\">\r\n {{type.label || type.code}}\r\n </option>\r\n </select>\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.ARROW_DOWN_BLACK']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/arrow-down-black.svg')\"\r\n class=\"select-arrow-icon pointer-events-none\" />\r\n </div>\r\n </div>\r\n\r\n <!-- Section Header: Question Count & Select All -->\r\n <div class=\"d-flex align-items-center justify-content-between pt-2 pb-1\">\r\n <h5 class=\"mb-0 fw-bold questions-heading\">\r\n {{totalElements || filteredQuestions.length}} {{labelConfig['COMMONS_ASSESSMENT.LABEL.QUESTIONS'] || 'Questions'}}\r\n </h5>\r\n <div class=\"form-check d-flex align-items-center gap-2 mb-0\">\r\n <input class=\"form-check-input select-all-checkbox cursor-pointer\"\r\n type=\"checkbox\"\r\n id=\"selectAllQuestions\"\r\n [checked]=\"isAllVisibleSelected\"\r\n [indeterminate]=\"isSomeVisibleSelected\"\r\n [disabled]=\"eligibleVisibleQuestions.length === 0\"\r\n (change)=\"toggleSelectAllVisible()\">\r\n <label class=\"form-check-label select-all-label cursor-pointer\" for=\"selectAllQuestions\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.SELECT_ALL_QUESTIONS'] || 'Select All Questions'}}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Questions Viewport Box -->\r\n <div class=\"flex-grow-1 overflow-auto p-3\" (scroll)=\"onScroll($event)\">\r\n <!-- Skeleton Loading State -->\r\n <div *ngIf=\"isInitialLoading\" class=\"d-flex flex-column gap-3 py-1\">\r\n <div *ngFor=\"let i of [1, 2, 3, 4, 5]\" class=\"skeleton-card\">\r\n <div class=\"skeleton-line line-full\"></div>\r\n <div class=\"skeleton-meta\"></div>\r\n </div>\r\n </div>\r\n\r\n <!-- Question Cards -->\r\n <div *ngIf=\"!isInitialLoading && filteredQuestions.length > 0\" class=\"d-flex flex-column gap-3\">\r\n <div *ngFor=\"let question of filteredQuestions; trackBy: trackByQuestionId\"\r\n class=\"question-card\"\r\n [class.disabled-card]=\"isAlreadyInAssessment(question.id)\"\r\n [class.selected-card]=\"isSelected(question)\"\r\n (click)=\"toggleSelection(question)\">\r\n\r\n <!-- Main Card Header: Checkbox + Question Text + #ID -->\r\n <div class=\"d-flex align-items-start gap-3\">\r\n <div class=\"pt-1 flex-shrink-0\">\r\n <input class=\"form-check-input card-checkbox cursor-pointer\"\r\n type=\"checkbox\"\r\n [checked]=\"isSelected(question)\"\r\n [disabled]=\"isAlreadyInAssessment(question.id)\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"toggleSelection(question)\">\r\n </div>\r\n\r\n <div class=\"flex-grow-1 min-w-0\">\r\n <div class=\"d-flex align-items-start justify-content-between gap-3 mb-2\">\r\n <div class=\"question-body-text fw-medium text-break\"\r\n [innerHTML]=\"question?.questionText?.[0]?.text\"></div>\r\n <span class=\"question-id-badge flex-shrink-0\" *ngIf=\"question?.id\">#{{question.id}}</span>\r\n </div>\r\n\r\n <!-- Badges Row: Type Pill, Marks Pill, Mandatory Pill, and Added Pill -->\r\n <div class=\"d-flex align-items-center justify-content-between flex-wrap gap-2 mt-1\">\r\n <div class=\"d-flex align-items-center flex-wrap gap-2\">\r\n <!-- Question Type Pill (Orange/Amber) -->\r\n <span class=\"badge-pill badge-type-pill p-2 rounded\" *ngIf=\"question?.questionType\">\r\n {{getQuestionTypeLabel(question)}}\r\n </span>\r\n\r\n <!-- Marks Pill (Blue/Indigo) -->\r\n <span class=\"badge-pill badge-marks-pill p-2 rounded\" *ngIf=\"question?.weight !== undefined && question?.weight !== null\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.MARKS'] || 'Marks'}} {{question.weight}}\r\n </span>\r\n\r\n <!-- Mandatory Pill (Green) -->\r\n <span class=\"badge-pill badge-mandatory-pill p-2 rounded\" *ngIf=\"question?.isMandatory\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.MANDATORY'] || 'Mandatory'}}\r\n </span>\r\n </div>\r\n\r\n <!-- Right-aligned Already Added Pill -->\r\n <span *ngIf=\"isAlreadyInAssessment(question.id)\" class=\"badge-pill badge-added-pill p-2\">\r\n <span class=\"dot-indicator\"></span>\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADDED'] || 'Added'}}\r\n </span>\r\n </div>\r\n\r\n <!-- Options Accordion (if question has defaultOptionsList) -->\r\n <div *ngIf=\"hasOptions(question)\" class=\"options-accordion-section mt-3 pt-2\">\r\n <!-- Toggle Button Row with Arrow & Divider Line -->\r\n <div class=\"d-flex align-items-center gap-2 cursor-pointer options-toggle-row\"\r\n (click)=\"toggleExpandOptions(question.id, $event)\">\r\n <span class=\"options-count-text text-primary fw-semibold\">\r\n {{question.defaultOptionsList?.length || 0}} {{labelConfig['COMMONS_ASSESSMENT.LABEL.OPTIONS'] || 'Options'}}\r\n </span>\r\n <img [src]=\"isOptionsExpanded(question.id) ? (imageConfig['COMMONS_ASSESSMENT.ICON.ARROW_UP_BLUE'] || 'assets/commons-assessment/images/arrow-up-blue.svg') : (imageConfig['COMMONS_ASSESSMENT.ICON.ARROW_DOWN_BLUE'] || 'assets/commons-assessment/images/arrow-down-blue.svg')\"\r\n (error)=\"imageErrorHandler($event, isOptionsExpanded(question.id) ? 'assets/commons-assessment/images/arrow-up-blue.svg' : 'assets/commons-assessment/images/arrow-down-blue.svg')\"\r\n class=\"options-arrow-icon\" />\r\n <div class=\"options-divider-line flex-grow-1\"></div>\r\n <span class=\"text-secondary text-12 options-hint-text\">\r\n \u2022 {{labelConfig['COMMONS_ASSESSMENT.LABEL.CLICK_TO_VIEW'] || 'Click to view'}}\r\n </span>\r\n </div>\r\n\r\n <!-- Expanded Options List (Radio options) -->\r\n <div *ngIf=\"isOptionsExpanded(question.id)\"\r\n class=\"options-list-container d-flex flex-column gap-2 mt-3 ps-1\"\r\n (click)=\"$event.stopPropagation()\">\r\n <div *ngFor=\"let opt of question.defaultOptionsList\"\r\n class=\"d-flex align-items-center gap-2 option-item-row\">\r\n <span class=\"option-radio-circle\"></span>\r\n <span class=\"option-text text-break\">\r\n {{opt.options?.optionName?.[0]?.text || opt.options?.optionCode || 'Option'}}\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Empty State: No matching filter results -->\r\n <div *ngIf=\"!isInitialLoading && filteredQuestions.length === 0 && allQuestions.length > 0\"\r\n class=\"empty-state-box py-5 text-center\">\r\n <p class=\"empty-state-title fw-semibold text-15 mb-1\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.NO_MATCHING_QUESTIONS'] || 'No matching questions found'}}\r\n </p>\r\n <p class=\"empty-state-desc text-secondary text-13 mb-3\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.NO_MATCHING_QUESTIONS_DESC'] || 'Try adjusting your search terms or clearing selected question type filters.'}}\r\n </p>\r\n <button (click)=\"clearSearch(); selectedTypeCode = ''; applyFilters();\"\r\n class=\"btn btn-outline-primary btn-sm px-3\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.CLEAR_FILTERS'] || 'Clear Filters'}}\r\n </button>\r\n </div>\r\n\r\n <!-- Empty State: Question bank is empty -->\r\n <div *ngIf=\"!isInitialLoading && allQuestions.length === 0\"\r\n class=\"empty-state-box py-5 text-center\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.NO_QUESTIONS']\" class=\"empty-state-img mb-3\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/no-questions.svg')\" />\r\n <p class=\"empty-state-title fw-semibold text-15 mb-1\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.NO_QUESTIONS_IN_BANK'] || 'No Questions in Bank!'}}\r\n </p>\r\n <p class=\"empty-state-desc text-secondary text-13 mb-0\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.NO_QUESTIONS_IN_BANK_DESC'] || 'Create standalone questions in the Question Bank to reuse them here.'}}\r\n </p>\r\n </div>\r\n\r\n <!-- Infinite Scroll Bottom Loader -->\r\n <div *ngIf=\"isLoading && !isInitialLoading\" class=\"py-3 d-flex align-items-center justify-content-center gap-2\">\r\n <div class=\"spinner-border spinner-border-sm text-primary\" role=\"status\">\r\n <span class=\"visually-hidden\">Loading...</span>\r\n </div>\r\n <span class=\"text-secondary text-13\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.LOADING_MORE_QUESTIONS'] || 'Loading more questions...'}}\r\n </span>\r\n </div>\r\n\r\n <!-- End of list reached -->\r\n <div *ngIf=\"!hasNext && allQuestions.length > 0 && !isLoading\" class=\"text-center py-3 text-secondary text-12\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ALL_QUESTIONS_LOADED'] || 'All questions loaded'}} ({{totalElements}})\r\n </div>\r\n </div>\r\n\r\n <!-- Sticky Footer -->\r\n <div class=\"px-4 py-3 border-top picker-footer d-flex align-items-center justify-content-between bg-white\">\r\n <div class=\"footer-summary\">\r\n <span class=\"text-secondary text-13\" *ngIf=\"selectedCount === 0\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.NO_QUESTIONS_SELECTED'] || 'No questions selected'}}\r\n </span>\r\n <span class=\"text-secondary text-13\" *ngIf=\"selectedCount > 0\">\r\n <strong class=\"text-primary\">{{selectedCount}}</strong> {{labelConfig['COMMONS_ASSESSMENT.LABEL.QUESTIONS_SELECTED'] || 'questions selected'}}\r\n · <strong class=\"text-dark\">{{totalSelectedMarks}}</strong> {{labelConfig['COMMONS_ASSESSMENT.LABEL.MARKS'] || 'Marks'}}\r\n </span>\r\n </div>\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <button (click)=\"close()\" class=\"btn btn-outline-secondary px-4 py-2 footer-btn\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.CANCEL'] || 'Cancel'}}\r\n </button>\r\n <button (click)=\"importSelected()\"\r\n [disabled]=\"selectedCount === 0\"\r\n class=\"btn btn-primary px-4 py-2 footer-btn footer-btn-import\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.IMPORT_COUNT'] || 'Import'}}\r\n </button>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".question-bank-picker{background-color:var(--assessment-bg-white, #ffffff);color:var(--assessment-text-grey-ten, #202124);font-family:var(--assessment-font-family, inherit)}.question-bank-picker .picker-header{background-color:var(--assessment-bg-white, #ffffff);border-color:var(--assessment-grey-four, #e8eaed)!important}.question-bank-picker .picker-header .btn-icon-back{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:50%;border:none;background-color:transparent;cursor:pointer;transition:background-color .15s ease}.question-bank-picker .picker-header .btn-icon-back:hover{background-color:var(--assessment-palette-EDF3FD, #EDF3FD)}.question-bank-picker .picker-header .btn-icon-back .action-icon{width:1.125rem;height:1.125rem}.question-bank-picker .picker-header .picker-title{font-size:1.25rem;font-weight:700;color:var(--assessment-text-grey-ten, #1e293b);line-height:1.25}.question-bank-picker .picker-header .picker-subtitle{font-size:.8125rem;margin-top:2px}.question-bank-picker .picker-search-deck{background-color:var(--assessment-bg-white, #ffffff);border-color:var(--assessment-grey-four, #e8eaed)!important}.question-bank-picker .picker-search-deck .search-input-wrapper{position:relative}.question-bank-picker .picker-search-deck .search-input-wrapper .search-input{height:2.6rem;padding-right:2rem;padding-left:.875rem;font-size:.875rem;border-radius:var(--assessment-border-radius-two, .375rem);border:1px solid var(--assessment-grey-four, #e2e8f0);background-color:var(--assessment-bg-white, #ffffff);color:var(--assessment-text-grey-ten, #202124)}.question-bank-picker .picker-search-deck .search-input-wrapper .search-input::placeholder{color:var(--assessment-text-grey-seven, #94a3b8)}.question-bank-picker .picker-search-deck .search-input-wrapper .search-input:focus{border-color:var(--assessment-primary-one, #467DD6);box-shadow:0 0 0 2px #467dd626}.question-bank-picker .picker-search-deck .search-input-wrapper .search-clear-btn{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);border:none;background:transparent;color:var(--assessment-text-grey-seven, #94a3b8);font-size:.75rem;cursor:pointer;padding:2px 4px;border-radius:4px}.question-bank-picker .picker-search-deck .search-input-wrapper .search-clear-btn:hover{color:var(--assessment-text-grey-ten, #202124);background-color:var(--assessment-palette-EDF3FD, #EDF3FD)}.question-bank-picker .picker-search-deck .type-filter-wrapper{min-width:11rem;max-width:14rem}.question-bank-picker .picker-search-deck .type-filter-wrapper .filter-select{height:2.6rem;padding-right:2rem;font-size:.875rem;font-weight:500;border-radius:var(--assessment-border-radius-two, .375rem);border:1px solid var(--assessment-grey-four, #e2e8f0);background-color:var(--assessment-bg-white, #ffffff);color:var(--assessment-text-grey-ten, #334155);appearance:none;-webkit-appearance:none;-moz-appearance:none}.question-bank-picker .picker-search-deck .type-filter-wrapper .filter-select:focus{border-color:var(--assessment-primary-one, #467DD6);box-shadow:0 0 0 2px #467dd626}.question-bank-picker .picker-search-deck .type-filter-wrapper .select-arrow-icon{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);width:.875rem;height:.875rem}.question-bank-picker .picker-search-deck .questions-heading{font-size:1.125rem;color:var(--assessment-text-grey-ten, #1e293b)}.question-bank-picker .picker-search-deck .select-all-label{font-size:.875rem;font-weight:600;color:var(--assessment-text-grey-nine, #334155);-webkit-user-select:none;user-select:none}.question-bank-picker .form-check-input{width:1.2rem;height:1.2rem;border-radius:4px;border:1.5px solid var(--assessment-grey-five, #cbd5e1);cursor:pointer}.question-bank-picker .form-check-input:checked{background-color:var(--assessment-primary-one, #467DD6);border-color:var(--assessment-primary-one, #467DD6)}.question-bank-picker .form-check-input:focus{box-shadow:0 0 0 2px #467dd633}.question-bank-picker .form-check-input:disabled{cursor:not-allowed;opacity:.5}.question-bank-picker .question-card{border:1px solid var(--assessment-grey-four, #e2e8f0);border-radius:var(--assessment-border-radius-two, .5rem);background-color:var(--assessment-bg-grey-one, #f8f9fa);padding:1rem 1.125rem;transition:border-color .15s ease,box-shadow .15s ease;cursor:pointer}.question-bank-picker .question-card:hover:not(.disabled-card){border-color:var(--assessment-palette-ADC9F6, #93c5fd);box-shadow:0 2px 6px #467dd60f}.question-bank-picker .question-card.selected-card{border-color:var(--assessment-primary-one, #467DD6);background-color:var(--assessment-bg-white, #ffffff)}.question-bank-picker .question-card.disabled-card{background-color:var(--assessment-bg-grey-one, #f8fafc);opacity:.75;cursor:not-allowed!important}.question-bank-picker .question-card .question-body-text{font-size:.9375rem;color:var(--assessment-text-grey-ten, #1e293b);line-height:1.45;word-break:break-word}.question-bank-picker .question-card .question-body-text ::ng-deep p,.question-bank-picker .question-card .question-body-text ::ng-deep div,.question-bank-picker .question-card .question-body-text p,.question-bank-picker .question-card .question-body-text div{margin:0!important;padding:0!important}.question-bank-picker .question-card .question-id-badge{font-size:.8125rem;font-weight:500;color:var(--assessment-text-grey-seven, #94a3b8)}.question-bank-picker .badge-pill{display:inline-flex;align-items:center;grid-gap:4px;gap:4px;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:500;line-height:1.2}.question-bank-picker .badge-type-pill{background-color:#fffbeb;color:#b45309;border:1px solid #fde68a}.question-bank-picker .badge-marks-pill{background-color:#eff6ff;color:#2563eb;border:1px solid #bfdbfe}.question-bank-picker .badge-mandatory-pill{background-color:#ecfdf5;color:#059669;border:1px solid #a7f3d0}.question-bank-picker .badge-added-pill{background-color:#f0fdf4;color:#16a34a;border:1px solid #bbf7d0;font-weight:600}.question-bank-picker .badge-added-pill .dot-indicator{width:6px;height:6px;border-radius:50%;background-color:#16a34a;display:inline-block}.question-bank-picker .options-accordion-section .options-toggle-row{-webkit-user-select:none;user-select:none}.question-bank-picker .options-accordion-section .options-toggle-row .options-count-text{font-size:.8125rem;font-weight:600;color:var(--assessment-primary-one, #467DD6)}.question-bank-picker .options-accordion-section .options-toggle-row .options-arrow-icon{width:.875rem;height:.875rem}.question-bank-picker .options-accordion-section .options-toggle-row .options-divider-line{height:1px;background-color:var(--assessment-grey-four, #e2e8f0)}.question-bank-picker .options-accordion-section .options-toggle-row .options-hint-text{font-size:.75rem;color:var(--assessment-text-grey-seven, #94a3b8)}.question-bank-picker .options-accordion-section .options-list-container .option-item-row{font-size:.875rem;color:var(--assessment-text-grey-nine, #334155)}.question-bank-picker .options-accordion-section .options-list-container .option-item-row .option-radio-circle{width:.875rem;height:.875rem;border-radius:50%;border:1.5px solid var(--assessment-text-grey-nine, #334155);flex-shrink:0}.question-bank-picker .options-accordion-section .options-list-container .option-item-row .option-text{font-size:.875rem;color:var(--assessment-text-grey-nine, #334155)}.question-bank-picker .skeleton-card{border:1px solid var(--assessment-grey-four, #e2e8f0);border-radius:var(--assessment-border-radius-two, .5rem);background:var(--assessment-bg-white, #ffffff);padding:1rem 1.125rem}.question-bank-picker .skeleton-card .skeleton-line{height:14px;border-radius:4px;margin-bottom:12px;background:linear-gradient(90deg,#f1f5f9 25%,#e2e8f0 50%,#f1f5f9 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}.question-bank-picker .skeleton-card .skeleton-line.line-full{width:75%}.question-bank-picker .skeleton-card .skeleton-meta{height:18px;width:160px;border-radius:9999px;background:linear-gradient(90deg,#f1f5f9 25%,#e2e8f0 50%,#f1f5f9 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.question-bank-picker .empty-state-box .empty-state-img{max-width:5.5rem}.question-bank-picker .empty-state-box .empty-state-title{color:var(--assessment-text-grey-ten, #1e293b)}.question-bank-picker .empty-state-box .empty-state-desc{max-width:22rem;margin:0 auto}.question-bank-picker .picker-footer{border-color:var(--assessment-grey-four, #e8eaed)!important}.question-bank-picker .picker-footer .footer-btn{font-size:.875rem;font-weight:600;border-radius:var(--assessment-border-radius-two, .375rem)}.question-bank-picker .picker-footer .footer-btn-import{background-color:var(--assessment-primary-one, #467DD6);border-color:var(--assessment-primary-one, #467DD6)}.question-bank-picker .picker-footer .footer-btn-import:hover:not(:disabled){background-color:var(--assessment-primary-four, #295eb7);border-color:var(--assessment-primary-four, #295eb7)}.question-bank-picker .pointer-events-none{pointer-events:none}.question-bank-picker .min-w-0{min-width:0}.question-bank-picker .text-12{font-size:.75rem}.question-bank-picker .text-13{font-size:.8125rem}.question-bank-picker .text-15{font-size:.9375rem}\n"], directives: [{ type: i2__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$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: i1__namespace$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1__namespace$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
5453
|
+
QuestionBankPickerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionBankPickerComponent, selector: "lib-question-bank-picker", ngImport: i0__namespace, template: "<div class=\"d-flex flex-column h-100 question-bank-picker\">\r\n <!-- Header: Back Arrow + Title + Subtitle -->\r\n <div class=\"d-flex align-items-center justify-content-between px-4 py-3 border-bottom picker-header\">\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <button (click)=\"close()\" class=\"btn-icon-back\" [attr.aria-label]=\"labelConfig['COMMONS_ASSESSMENT.LABEL.GO_BACK'] || 'Go Back'\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.GO_BACK']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/go-back.svg')\"\r\n class=\"action-icon\" />\r\n </button>\r\n <div>\r\n <h4 class=\"mb-0 fw-bold picker-title\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.IMPORT_FROM_QUESTION_BANK'] || 'Import from Question Bank'}}\r\n </h4>\r\n <p class=\"mb-0 picker-subtitle\">\r\n <span class=\"text-secondary\">{{labelConfig['COMMONS_ASSESSMENT.LABEL.SELECTED_SECTION'] || 'Selected Section'}}:</span>\r\n <span class=\"text-primary fw-semibold ms-1\" *ngIf=\"targetSectionName\">{{targetSectionName}}</span>\r\n <span class=\"text-secondary ms-1\" *ngIf=\"!targetSectionName\">{{labelConfig['COMMONS_ASSESSMENT.LABEL.IMPORT_QUESTIONS_INTO_NEW_SECTION'] || 'Import questions into a new section'}}</span>\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Search & Filter Controls Deck -->\r\n <div class=\"picker-search-deck px-4 pt-3 pb-2 border-bottom\">\r\n <div class=\"d-flex gap-3 align-items-center mb-2\">\r\n <!-- Search Box -->\r\n <div class=\"search-input-wrapper flex-grow-1 position-relative\">\r\n <input type=\"text\"\r\n class=\"form-control search-input\"\r\n [placeholder]=\"labelConfig['COMMONS_ASSESSMENT.LABEL.SEARCH_QUESTION'] || 'Search Question'\"\r\n [ngModel]=\"searchTerm\"\r\n (ngModelChange)=\"onSearchChange($event)\">\r\n <button *ngIf=\"searchTerm\" (click)=\"clearSearch()\" class=\"search-clear-btn\" aria-label=\"Clear Search\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.CLOSE']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/close.svg')\"\r\n class=\"action-icon\" />\r\n </button>\r\n </div>\r\n\r\n <!-- Type Filter Dropdown using arrow-down-black.svg -->\r\n <div class=\"type-filter-wrapper position-relative\">\r\n <select class=\"form-select filter-select cursor-pointer\"\r\n [ngModel]=\"selectedTypeCode\"\r\n (ngModelChange)=\"onTypeFilterChange($event)\">\r\n <option value=\"\">{{labelConfig['COMMONS_ASSESSMENT.LABEL.ALL_TYPES'] || 'All Types'}}</option>\r\n <option *ngFor=\"let type of questionTypes\" [value]=\"type.code\">\r\n {{type.label || type.code}}\r\n </option>\r\n </select>\r\n </div>\r\n </div>\r\n\r\n <!-- Section Header: Question Count & Select All -->\r\n <div class=\"d-flex align-items-center justify-content-between pt-2 pb-1\">\r\n <h5 class=\"mb-0 fw-bold questions-heading\">\r\n {{totalElements || filteredQuestions.length}} {{labelConfig['COMMONS_ASSESSMENT.LABEL.QUESTIONS'] || 'Questions'}}\r\n </h5>\r\n <div class=\"form-check d-flex align-items-center gap-2 mb-0\">\r\n <input class=\"form-check-input select-all-checkbox cursor-pointer\"\r\n type=\"checkbox\"\r\n id=\"selectAllQuestions\"\r\n [checked]=\"isAllVisibleSelected\"\r\n [indeterminate]=\"isSomeVisibleSelected\"\r\n [disabled]=\"eligibleVisibleQuestions.length === 0\"\r\n (change)=\"toggleSelectAllVisible()\">\r\n <label class=\"form-check-label select-all-label cursor-pointer\" for=\"selectAllQuestions\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.SELECT_ALL_QUESTIONS'] || 'Select All Questions'}}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Questions Viewport Box -->\r\n <div class=\"flex-grow-1 overflow-auto assessment-custom-scrollbar-thumb p-3\" (scroll)=\"onScroll($event)\">\r\n <!-- Skeleton Loading State -->\r\n <div *ngIf=\"isInitialLoading\" class=\"d-flex flex-column gap-3 py-1\">\r\n <div *ngFor=\"let i of [1, 2, 3, 4, 5]\" class=\"skeleton-card\">\r\n <div class=\"skeleton-line line-full\"></div>\r\n <div class=\"skeleton-meta\"></div>\r\n </div>\r\n </div>\r\n\r\n <!-- Question Cards -->\r\n <div *ngIf=\"!isInitialLoading && filteredQuestions.length > 0\" class=\"d-flex flex-column gap-3\">\r\n <div *ngFor=\"let question of filteredQuestions; trackBy: trackByQuestionId\"\r\n class=\"question-card\"\r\n [class.disabled-card]=\"isAlreadyInAssessment(question.id)\"\r\n [class.selected-card]=\"isSelected(question)\"\r\n (click)=\"toggleSelection(question)\">\r\n\r\n <!-- Main Card Header: Checkbox + Question Text + #ID -->\r\n <div class=\"d-flex align-items-start gap-3\">\r\n <div class=\"pt-1 flex-shrink-0\">\r\n <input class=\"form-check-input card-checkbox cursor-pointer\"\r\n type=\"checkbox\"\r\n [checked]=\"isSelected(question)\"\r\n [disabled]=\"isAlreadyInAssessment(question.id)\"\r\n (click)=\"$event.stopPropagation()\"\r\n (change)=\"toggleSelection(question)\">\r\n </div>\r\n\r\n <div class=\"flex-grow-1 min-w-0\">\r\n <div class=\"d-flex align-items-start justify-content-between gap-3 mb-2\">\r\n <div class=\"question-body-text fw-medium text-break\"\r\n [innerHTML]=\"question?.questionText?.[0]?.text\"></div>\r\n <span class=\"question-id-badge flex-shrink-0\" *ngIf=\"question?.id\">#{{question.id}}</span>\r\n </div>\r\n\r\n <!-- Badges Row: Type Pill, Marks Pill, Mandatory Pill, and Added Pill -->\r\n <div class=\"d-flex align-items-center justify-content-between flex-wrap gap-2 mt-1\">\r\n <div class=\"d-flex align-items-center flex-wrap gap-2\">\r\n <!-- Question Type Pill (Orange/Amber) -->\r\n <span class=\"badge-pill badge-type-pill p-2 rounded\" *ngIf=\"question?.questionType\">\r\n {{getQuestionTypeLabel(question)}}\r\n </span>\r\n\r\n <!-- Marks Pill (Blue/Indigo) -->\r\n <span class=\"badge-pill badge-marks-pill p-2 rounded\" *ngIf=\"question?.weight !== undefined && question?.weight !== null\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.MARKS'] || 'Marks'}} {{question.weight}}\r\n </span>\r\n\r\n <!-- Mandatory Pill (Green) -->\r\n <span class=\"badge-pill badge-mandatory-pill p-2 rounded\" *ngIf=\"question?.isMandatory\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.MANDATORY'] || 'Mandatory'}}\r\n </span>\r\n </div>\r\n\r\n <!-- Right-aligned Already Added Pill -->\r\n <span *ngIf=\"isAlreadyInAssessment(question.id)\" class=\"badge-pill badge-added-pill p-2\">\r\n <span class=\"dot-indicator\"></span>\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADDED'] || 'Added'}}\r\n </span>\r\n </div>\r\n\r\n <!-- Options Accordion (if question has defaultOptionsList) -->\r\n <div *ngIf=\"hasOptions(question)\" class=\"options-accordion-section mt-3 pt-2\">\r\n <!-- Toggle Button Row with Arrow & Divider Line -->\r\n <div class=\"d-flex align-items-center gap-2 cursor-pointer options-toggle-row\"\r\n (click)=\"toggleExpandOptions(question.id, $event)\">\r\n <span class=\"options-count-text text-primary fw-semibold\">\r\n {{question.defaultOptionsList?.length || 0}} {{labelConfig['COMMONS_ASSESSMENT.LABEL.OPTIONS'] || 'Options'}}\r\n </span>\r\n <img [src]=\"isOptionsExpanded(question.id) ? (imageConfig['COMMONS_ASSESSMENT.ICON.ARROW_UP_BLUE'] || 'assets/commons-assessment/images/arrow-up-blue.svg') : (imageConfig['COMMONS_ASSESSMENT.ICON.ARROW_DOWN_BLUE'] || 'assets/commons-assessment/images/arrow-down-blue.svg')\"\r\n (error)=\"imageErrorHandler($event, isOptionsExpanded(question.id) ? 'assets/commons-assessment/images/arrow-up-blue.svg' : 'assets/commons-assessment/images/arrow-down-blue.svg')\"\r\n class=\"options-arrow-icon\" />\r\n <div class=\"options-divider-line flex-grow-1\"></div>\r\n <span class=\"text-secondary text-12 options-hint-text\">\r\n \u2022 {{labelConfig['COMMONS_ASSESSMENT.LABEL.CLICK_TO_VIEW'] || 'Click to view'}}\r\n </span>\r\n </div>\r\n\r\n <!-- Expanded Options List (Radio options) -->\r\n <div *ngIf=\"isOptionsExpanded(question.id)\"\r\n class=\"options-list-container d-flex flex-column gap-2 mt-3 ps-1\"\r\n (click)=\"$event.stopPropagation()\">\r\n <div *ngFor=\"let opt of question.defaultOptionsList\"\r\n class=\"d-flex align-items-center gap-2 option-item-row\">\r\n <span class=\"option-radio-circle\"></span>\r\n <span class=\"option-text text-break\">\r\n {{opt.options?.optionName?.[0]?.text || opt.options?.optionCode || 'Option'}}\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Empty State: No matching filter results -->\r\n <div *ngIf=\"!isInitialLoading && filteredQuestions.length === 0 && allQuestions.length > 0\"\r\n class=\"empty-state-box py-5 text-center\">\r\n <p class=\"empty-state-title fw-semibold text-15 mb-1\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.NO_MATCHING_QUESTIONS'] || 'No matching questions found'}}\r\n </p>\r\n <p class=\"empty-state-desc text-secondary text-13 mb-3\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.NO_MATCHING_QUESTIONS_DESC'] || 'Try adjusting your search terms or clearing selected question type filters.'}}\r\n </p>\r\n <button (click)=\"clearSearch(); selectedTypeCode = ''; applyFilters();\"\r\n class=\"btn btn-outline-primary btn-sm px-3\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.CLEAR_FILTERS'] || 'Clear Filters'}}\r\n </button>\r\n </div>\r\n\r\n <!-- Empty State: Question bank is empty -->\r\n <div *ngIf=\"!isInitialLoading && allQuestions.length === 0\"\r\n class=\"empty-state-box py-5 text-center\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.NO_QUESTIONS']\" class=\"empty-state-img mb-3\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/no-questions.svg')\" />\r\n <p class=\"empty-state-title fw-semibold text-15 mb-1\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.NO_QUESTIONS_IN_BANK'] || 'No Questions in Bank!'}}\r\n </p>\r\n <p class=\"empty-state-desc text-secondary text-13 mb-0\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.NO_QUESTIONS_IN_BANK_DESC'] || 'Create standalone questions in the Question Bank to reuse them here.'}}\r\n </p>\r\n </div>\r\n\r\n <!-- Infinite Scroll Bottom Loader -->\r\n <div *ngIf=\"isLoading && !isInitialLoading\" class=\"py-3 d-flex align-items-center justify-content-center gap-2\">\r\n <div class=\"spinner-border spinner-border-sm text-primary\" role=\"status\">\r\n <span class=\"visually-hidden\">Loading...</span>\r\n </div>\r\n <span class=\"text-secondary text-13\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.LOADING_MORE_QUESTIONS'] || 'Loading more questions...'}}\r\n </span>\r\n </div>\r\n\r\n <!-- End of list reached -->\r\n <div *ngIf=\"!hasNext && allQuestions.length > 0 && !isLoading\" class=\"text-center py-3 text-secondary text-12\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ALL_QUESTIONS_LOADED'] || 'All questions loaded'}} ({{totalElements}})\r\n </div>\r\n </div>\r\n\r\n <!-- Sticky Footer -->\r\n <div class=\"px-4 py-3 border-top picker-footer d-flex align-items-center justify-content-between bg-white\">\r\n <div class=\"footer-summary\">\r\n <span class=\"text-secondary text-13\" *ngIf=\"selectedCount === 0\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.NO_QUESTIONS_SELECTED'] || 'No questions selected'}}\r\n </span>\r\n <span class=\"text-secondary text-13\" *ngIf=\"selectedCount > 0\">\r\n <strong class=\"text-primary\">{{selectedCount}}</strong> {{labelConfig['COMMONS_ASSESSMENT.LABEL.QUESTIONS_SELECTED'] || 'questions selected'}}\r\n · <strong class=\"text-dark\">{{totalSelectedMarks}}</strong> {{labelConfig['COMMONS_ASSESSMENT.LABEL.MARKS'] || 'Marks'}}\r\n </span>\r\n </div>\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <button (click)=\"close()\" class=\"btn btn-outline-secondary px-4 py-2 footer-btn\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.CANCEL'] || 'Cancel'}}\r\n </button>\r\n <button (click)=\"importSelected()\"\r\n [disabled]=\"selectedCount === 0\"\r\n class=\"btn btn-primary px-4 py-2 footer-btn footer-btn-import\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.IMPORT_COUNT'] || 'Import'}}\r\n </button>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".question-bank-picker{background-color:var(--assessment-bg-white, #ffffff);color:var(--assessment-text-grey-ten, #202124);font-family:var(--assessment-font-family, inherit)}.question-bank-picker .picker-header{background-color:var(--assessment-bg-white, #ffffff);border-color:var(--assessment-grey-four, #e8eaed)!important}.question-bank-picker .picker-header .btn-icon-back{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:50%;border:none;background-color:transparent;cursor:pointer;transition:background-color .15s ease}.question-bank-picker .picker-header .btn-icon-back:hover{background-color:var(--assessment-palette-EDF3FD, #EDF3FD)}.question-bank-picker .picker-header .btn-icon-back .action-icon{width:1.125rem;height:1.125rem}.question-bank-picker .picker-header .picker-title{font-size:1.25rem;font-weight:700;color:var(--assessment-text-grey-ten, #1e293b);line-height:1.25}.question-bank-picker .picker-header .picker-subtitle{font-size:.8125rem;margin-top:2px}.question-bank-picker .picker-search-deck{background-color:var(--assessment-bg-white, #ffffff);border-color:var(--assessment-grey-four, #e8eaed)!important}.question-bank-picker .picker-search-deck .search-input-wrapper{position:relative}.question-bank-picker .picker-search-deck .search-input-wrapper .search-input{height:2.6rem;padding-right:2rem;padding-left:.875rem;font-size:.875rem;border-radius:var(--assessment-border-radius-two, .375rem);border:1px solid var(--assessment-grey-four, #e2e8f0);background-color:var(--assessment-bg-white, #ffffff);color:var(--assessment-text-grey-ten, #202124)}.question-bank-picker .picker-search-deck .search-input-wrapper .search-input::placeholder{color:var(--assessment-text-grey-seven, #94a3b8)}.question-bank-picker .picker-search-deck .search-input-wrapper .search-input:focus{border-color:var(--assessment-primary-one, #467DD6);box-shadow:0 0 0 2px #467dd626}.question-bank-picker .picker-search-deck .search-input-wrapper .search-clear-btn{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);border:none;background:transparent;color:var(--assessment-text-grey-seven, #94a3b8);font-size:.75rem;cursor:pointer;padding:2px 4px;border-radius:4px}.question-bank-picker .picker-search-deck .search-input-wrapper .search-clear-btn:hover{color:var(--assessment-text-grey-ten, #202124);background-color:var(--assessment-palette-EDF3FD, #EDF3FD)}.question-bank-picker .picker-search-deck .type-filter-wrapper{min-width:11rem;max-width:14rem}.question-bank-picker .picker-search-deck .type-filter-wrapper .filter-select{height:2.6rem;padding-right:2rem;font-size:.875rem;font-weight:500;border-radius:var(--assessment-border-radius-two, .375rem);border:1px solid var(--assessment-grey-four, #e2e8f0);background-color:var(--assessment-bg-white, #ffffff);color:var(--assessment-text-grey-ten, #334155);appearance:none;-webkit-appearance:none;-moz-appearance:none}.question-bank-picker .picker-search-deck .type-filter-wrapper .filter-select:focus{border-color:var(--assessment-primary-one, #467DD6);box-shadow:0 0 0 2px #467dd626}.question-bank-picker .picker-search-deck .type-filter-wrapper .select-arrow-icon{position:absolute;right:.75rem;top:50%;transform:translateY(-50%);width:.875rem;height:.875rem}.question-bank-picker .picker-search-deck .questions-heading{font-size:1.125rem;color:var(--assessment-text-grey-ten, #1e293b)}.question-bank-picker .picker-search-deck .select-all-label{font-size:.875rem;font-weight:600;color:var(--assessment-text-grey-nine, #334155);-webkit-user-select:none;user-select:none}.question-bank-picker .form-check-input{width:1.2rem;height:1.2rem;border-radius:4px;border:1.5px solid var(--assessment-grey-five, #cbd5e1);cursor:pointer}.question-bank-picker .form-check-input:checked{background-color:var(--assessment-primary-one, #467DD6);border-color:var(--assessment-primary-one, #467DD6)}.question-bank-picker .form-check-input:focus{box-shadow:0 0 0 2px #467dd633}.question-bank-picker .form-check-input:disabled{cursor:not-allowed;opacity:.5}.question-bank-picker .question-card{border:1px solid var(--assessment-grey-four, #e2e8f0);border-radius:var(--assessment-border-radius-two, .5rem);background-color:var(--assessment-bg-grey-one, #f8f9fa);padding:1rem 1.125rem;transition:border-color .15s ease,box-shadow .15s ease;cursor:pointer}.question-bank-picker .question-card:hover:not(.disabled-card){border-color:var(--assessment-palette-ADC9F6, #93c5fd);box-shadow:0 2px 6px #467dd60f}.question-bank-picker .question-card.selected-card{border-color:var(--assessment-primary-one, #467DD6);background-color:var(--assessment-bg-white, #ffffff)}.question-bank-picker .question-card.disabled-card{background-color:var(--assessment-bg-grey-one, #f8fafc);opacity:.75;cursor:not-allowed!important}.question-bank-picker .question-card .question-body-text{font-size:.9375rem;color:var(--assessment-text-grey-ten, #1e293b);line-height:1.45;word-break:break-word}.question-bank-picker .question-card .question-body-text ::ng-deep p,.question-bank-picker .question-card .question-body-text ::ng-deep div,.question-bank-picker .question-card .question-body-text p,.question-bank-picker .question-card .question-body-text div{margin:0!important;padding:0!important}.question-bank-picker .question-card .question-id-badge{font-size:.8125rem;font-weight:500;color:var(--assessment-text-grey-seven, #94a3b8)}.question-bank-picker .badge-pill{display:inline-flex;align-items:center;grid-gap:4px;gap:4px;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:500;line-height:1.2}.question-bank-picker .badge-type-pill{background-color:#fffbeb;color:#b45309;border:1px solid #fde68a}.question-bank-picker .badge-marks-pill{background-color:#eff6ff;color:#2563eb;border:1px solid #bfdbfe}.question-bank-picker .badge-mandatory-pill{background-color:#ecfdf5;color:#059669;border:1px solid #a7f3d0}.question-bank-picker .badge-added-pill{background-color:#f0fdf4;color:#16a34a;border:1px solid #bbf7d0;font-weight:600}.question-bank-picker .badge-added-pill .dot-indicator{width:6px;height:6px;border-radius:50%;background-color:#16a34a;display:inline-block}.question-bank-picker .options-accordion-section .options-toggle-row{-webkit-user-select:none;user-select:none}.question-bank-picker .options-accordion-section .options-toggle-row .options-count-text{font-size:.8125rem;font-weight:600;color:var(--assessment-primary-one, #467DD6)}.question-bank-picker .options-accordion-section .options-toggle-row .options-arrow-icon{width:.875rem;height:.875rem}.question-bank-picker .options-accordion-section .options-toggle-row .options-divider-line{height:1px;background-color:var(--assessment-grey-four, #e2e8f0)}.question-bank-picker .options-accordion-section .options-toggle-row .options-hint-text{font-size:.75rem;color:var(--assessment-text-grey-seven, #94a3b8)}.question-bank-picker .options-accordion-section .options-list-container .option-item-row{font-size:.875rem;color:var(--assessment-text-grey-nine, #334155)}.question-bank-picker .options-accordion-section .options-list-container .option-item-row .option-radio-circle{width:.875rem;height:.875rem;border-radius:50%;border:1.5px solid var(--assessment-text-grey-nine, #334155);flex-shrink:0}.question-bank-picker .options-accordion-section .options-list-container .option-item-row .option-text{font-size:.875rem;color:var(--assessment-text-grey-nine, #334155)}.question-bank-picker .skeleton-card{border:1px solid var(--assessment-grey-four, #e2e8f0);border-radius:var(--assessment-border-radius-two, .5rem);background:var(--assessment-bg-white, #ffffff);padding:1rem 1.125rem}.question-bank-picker .skeleton-card .skeleton-line{height:14px;border-radius:4px;margin-bottom:12px;background:linear-gradient(90deg,#f1f5f9 25%,#e2e8f0 50%,#f1f5f9 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}.question-bank-picker .skeleton-card .skeleton-line.line-full{width:75%}.question-bank-picker .skeleton-card .skeleton-meta{height:18px;width:160px;border-radius:9999px;background:linear-gradient(90deg,#f1f5f9 25%,#e2e8f0 50%,#f1f5f9 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.question-bank-picker .empty-state-box .empty-state-img{max-width:5.5rem}.question-bank-picker .empty-state-box .empty-state-title{color:var(--assessment-text-grey-ten, #1e293b)}.question-bank-picker .empty-state-box .empty-state-desc{max-width:22rem;margin:0 auto}.question-bank-picker .picker-footer{border-color:var(--assessment-grey-four, #e8eaed)!important}.question-bank-picker .picker-footer .footer-btn{font-size:.875rem;font-weight:600;border-radius:var(--assessment-border-radius-two, .375rem)}.question-bank-picker .picker-footer .footer-btn-import{background-color:var(--assessment-primary-one, #467DD6);border-color:var(--assessment-primary-one, #467DD6)}.question-bank-picker .picker-footer .footer-btn-import:hover:not(:disabled){background-color:var(--assessment-primary-four, #295eb7);border-color:var(--assessment-primary-four, #295eb7)}.question-bank-picker .pointer-events-none{pointer-events:none}.question-bank-picker .min-w-0{min-width:0}.question-bank-picker .text-12{font-size:.75rem}.question-bank-picker .text-13{font-size:.8125rem}.question-bank-picker .text-15{font-size:.9375rem}\n"], directives: [{ type: i2__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$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: i1__namespace$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1__namespace$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1__namespace$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i1__namespace$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
5454
5454
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: QuestionBankPickerComponent, decorators: [{
|
|
5455
5455
|
type: i0.Component,
|
|
5456
5456
|
args: [{
|
|
@@ -5593,8 +5593,31 @@
|
|
|
5593
5593
|
this.responseCount = 0;
|
|
5594
5594
|
this.proctoringEnabled = false;
|
|
5595
5595
|
this.durationMinutes = null;
|
|
5596
|
+
this.activeDropdownId = null;
|
|
5597
|
+
this.dropdownPlacementMap = {};
|
|
5596
5598
|
this.PROCTORING_CONFIG_KEY = 'assessment.config.is-proctoring-enabled';
|
|
5597
5599
|
}
|
|
5600
|
+
AssessmentMakerComponent.prototype.toggleDropdown = function (id, event) {
|
|
5601
|
+
if (event) {
|
|
5602
|
+
event.stopPropagation();
|
|
5603
|
+
var targetEl = (event.currentTarget || event.target);
|
|
5604
|
+
if (targetEl && typeof targetEl.getBoundingClientRect === 'function') {
|
|
5605
|
+
var rect = targetEl.getBoundingClientRect();
|
|
5606
|
+
var spaceBelow = window.innerHeight - rect.bottom;
|
|
5607
|
+
var ESTIMATED_DROPDOWN_HEIGHT = 135;
|
|
5608
|
+
if (spaceBelow < ESTIMATED_DROPDOWN_HEIGHT && rect.top > ESTIMATED_DROPDOWN_HEIGHT) {
|
|
5609
|
+
this.dropdownPlacementMap[id] = 'top';
|
|
5610
|
+
}
|
|
5611
|
+
else {
|
|
5612
|
+
this.dropdownPlacementMap[id] = 'bottom';
|
|
5613
|
+
}
|
|
5614
|
+
}
|
|
5615
|
+
}
|
|
5616
|
+
this.activeDropdownId = this.activeDropdownId === id ? null : id;
|
|
5617
|
+
};
|
|
5618
|
+
AssessmentMakerComponent.prototype.closeAllDropdowns = function () {
|
|
5619
|
+
this.activeDropdownId = null;
|
|
5620
|
+
};
|
|
5598
5621
|
AssessmentMakerComponent.prototype.ngOnInit = function () {
|
|
5599
5622
|
var _a, _b, _c, _d, _e;
|
|
5600
5623
|
this.assessmentBuilderService.setDefaultAssessmentDTO(this.defaultAssessmentDTO);
|
|
@@ -6244,7 +6267,7 @@
|
|
|
6244
6267
|
return AssessmentMakerComponent;
|
|
6245
6268
|
}());
|
|
6246
6269
|
AssessmentMakerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AssessmentMakerComponent, deps: [{ token: AssessmentMakerService }, { token: AssessmentBuilderService }, { token: i1__namespace.MatDialog }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
6247
|
-
AssessmentMakerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: AssessmentMakerComponent, selector: "lib-assessment-maker", inputs: { labelConfig: "labelConfig", imageConfig: "imageConfig", questionTypes: "questionTypes", showFooter: "showFooter", customRules: "customRules", assessmentId: "assessmentId", assessmentInstanceId: "assessmentInstanceId", defaultAssessmentDTO: "defaultAssessmentDTO", predefinedAssessmentInstance: "predefinedAssessmentInstance", enableSkillsToQuestionMapping: "enableSkillsToQuestionMapping", assessmentContext: "assessmentContext", minimumRequiredSections: "minimumRequiredSections", checkForResponses: "checkForResponses", showProctoringToggle: "showProctoringToggle", showTimeInput: "showTimeInput", enableImportFromQuestionBank: "enableImportFromQuestionBank", questionBankConfig: "questionBankConfig" }, outputs: { assessmentIdChange: "assessmentIdChange", assessmentInstanceIdChange: "assessmentInstanceIdChange", snackbarMessage: "snackbarMessage" }, ngImport: i0__namespace, template: "<div *ngIf=\"configsLoaded && !showLoader; else loader\" class=\"col-12 h-100\">\r\n <div class=\"col-12 h-100 py-4\" [class.height-without-footer]=\"showFooter\">\r\n <ng-container *ngIf=\"assessmentQuestionPaperData?.questionPaperSectionList?.length\">\r\n <div *ngIf=\"showProctoringToggle || showTimeInput\"\r\n class=\"d-flex align-items-center justify-content-end flex-wrap gap-4 mb-3\">\r\n <div *ngIf=\"showTimeInput\" class=\"d-flex align-items-center gap-2\">\r\n <label for=\"durationInput\" class=\"assessment-text-medium-13 assessment-text-grey-ten mb-0 cursor-pointer\">\r\n {{ labelConfig['COMMONS_ASSESSMENT.LABEL.DURATION'] }}\r\n </label>\r\n <input type=\"number\" id=\"durationInput\" min=\"1\" [(ngModel)]=\"durationMinutes\"\r\n (keydown)=\"blockNegativeKeys($event)\" (ngModelChange)=\"durationMinutes = $event > 0 ? $event : null\"\r\n [placeholder]=\"0\"\r\n class=\"form-control form-control-sm assessment-border-radius-two assessment-text-regular-13\" style=\"width: 4rem;\">\r\n <span class=\"assessment-text-regular-13 assessment-text-grey-seven\">\r\n {{ labelConfig['COMMONS_ASSESSMENT.LABEL.MINUTES'] }}\r\n </span>\r\n </div>\r\n <div *ngIf=\"showProctoringToggle\" class=\"d-flex align-items-center gap-2\">\r\n <label for=\"proctoringToggle\" class=\"assessment-text-medium-13 assessment-text-grey-ten mb-0 cursor-pointer\">\r\n {{ labelConfig['COMMONS_ASSESSMENT.LABEL.ENABLE_PROCTORING'] }}\r\n </label>\r\n <div class=\"form-check form-switch m-0\">\r\n <input type=\"checkbox\" id=\"proctoringToggle\" class=\"form-check-input cursor-pointer\"\r\n [(ngModel)]=\"proctoringEnabled\">\r\n </div>\r\n </div>\r\n </div>\r\n <mat-accordion multi=\"true\" cdkDropList (cdkDropListDropped)=\"dropSection($event)\">\r\n <mat-expansion-panel [hideToggle]=\"true\" #panel=\"matExpansionPanel\" [expanded]=\"section.isExpanded\"\r\n (opened)=\"section.isExpanded = true\" (closed)=\"section.isExpanded = false\"\r\n class=\"mb-4 border-0 overflow-hidden assessment-panel shadow-none bg-transparent\" cdkDrag\r\n *ngFor=\"let section of assessmentQuestionPaperData?.questionPaperSectionList; let sectionIndex = index; trackBy: trackBySectionId\">\r\n <!-- Section Header -->\r\n <mat-expansion-panel-header class=\"col-12 p-0 h-auto bg-transparent\">\r\n <div class=\"d-flex col-12 align-items-center gap-md-3 gap-2\">\r\n <img cdkDragHandle [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.DRAG_DROP']\"\r\n class=\"cursor-grab\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/drag-drop.svg')\" />\r\n <div class=\"d-flex align-items-center gap-2 flex-grow-1 justify-content-between p-3 assessment-border-radius-two assessment-border-two assessment-bg-white\"\r\n [class.no-border]=\"section.isExpanded\">\r\n <div>\r\n <div class=\"d-flex align-items-center mb-1\">\r\n <input type=\"text\" [id]=\"'sectionNameInput_' + sectionIndex\"\r\n class=\"col-md-11 col-10 assessment-text-semibold-18 border-0 outline-0 bg-transparent p-0 input-focus\"\r\n [(ngModel)]=\"section.qpsName[0].text\"\r\n [attr.size]=\"(section.qpsName[0].text?.length || 1)\"\r\n (click)=\"$event.stopPropagation()\" (keydown)=\"$event.stopPropagation()\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.EDIT']\"\r\n class=\"action-icon cursor-pointer\"\r\n (click)=\"focusSectionInput(sectionIndex, $event)\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/pencil.svg')\" />\r\n </div>\r\n <p class=\"mb-0 assessment-text-medium-12 assessment-text-grey-seven\">\r\n {{section?.sectionQuestionsList?.length || 0}}\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.QUESTIONS']}}\r\n </p>\r\n </div>\r\n <div class=\"d-flex align-items-center gap-md-4 gap-2\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.ARROW_DOWN_BLACK']\"\r\n [ngClass]=\"panel.expanded ? 'change-direction' : 'change-direction-reverse'\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/arrow-down-black.svg')\" />\r\n <button [matMenuTriggerFor]=\"menu\" (click)=\"$event.stopPropagation()\"\r\n class=\"border-0 bg-transparent py-2\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.ACTION_DOTS']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/action-dots.svg')\" />\r\n </button>\r\n <mat-menu #menu=\"matMenu\"\r\n class=\"mat-menu assessment-border-radius-two assessment-border-grey-four-1\">\r\n <button (click)=\"addInstruction(section)\" mat-menu-item\r\n class=\"py-2 assessment-text-semibold-12\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_INSTRUCTIONS']}}\r\n </button>\r\n <button (click)=\"duplicateSection(section.id)\" mat-menu-item\r\n class=\"py-2 assessment-text-semibold-12\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.DUPLICATE']}}\r\n </button>\r\n <button *ngIf=\"(assessmentQuestionPaperData?.questionPaperSectionList?.length ?? 0) > minimumRequiredSections\" \r\n (click)=\"deleteSection(section)\" mat-menu-item\r\n class=\"py-2 assessment-text-semibold-12 assessment-text-danger\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.DELETE']}}\r\n </button>\r\n </mat-menu>\r\n </div>\r\n </div>\r\n </div>\r\n </mat-expansion-panel-header>\r\n\r\n <!-- Questions inside section -->\r\n <div cdkDropList [cdkDropListData]=\"section.sectionQuestionsList || []\"\r\n (cdkDropListDropped)=\"dropQuestion($event)\">\r\n <div cdkDrag *ngFor=\"let sectionQuestion of section.sectionQuestionsList; let i = index; trackBy: trackBySectionQuestion\"\r\n class=\"d-flex align-items-start gap-md-3 gap-2 my-3 overflow-hidden\">\r\n <img cdkDragHandle [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.DRAG_DROP']\"\r\n class=\"cursor-grab mt-4\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/drag-drop.svg')\" />\r\n <div class=\"flex-grow-1 p-3 assessment-border-two assessment-border-radius-two question-container assessment-bg-white\">\r\n <lib-question-details [sectionQuestion]=\"sectionQuestion\"\r\n [question]=\"getQuestionFromBank(sectionQuestion.questionId) || {}\"\r\n [questionBank]=\"questionBank\" [imageConfig]=\"imageConfig\"\r\n [labelConfig]=\"labelConfig\" [allowDelete]=\"(section?.sectionQuestionsList?.length ?? 0) > 1\"\r\n [isLocked]=\"isQuestionLocked(sectionQuestion?.questionId)\"\r\n (editQuestion)=\"createEditQuestion(section, $event?.questionId, $event?.isChildQuestion)\"\r\n (duplicateQuestion)=\"duplicateQuestion(section, $event)\"\r\n (deleteParentQuestion)=\"deleteParentQuestion($event)\"\r\n (deleteChildQuestion)=\"deleteChildQuestion($event.option, $event.childQuestionId)\">\r\n </lib-question-details>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"col-12 ps-4 border-bottom pb-4 d-flex align-items-center\">\r\n <ng-container *ngIf=\"enableImportFromQuestionBank; else singleAddQuestionBtn\">\r\n <button [matMenuTriggerFor]=\"addQuestionMenu\"\r\n class=\"assessment-zoom-animation assessment-button-padding d-flex align-items-center justify-content-center gap-2 assessment-text-primary-one assessment-bg-palette-EDF3FD assessment-text-semibold-12 outline-0 assessment-border-radius-two mt-3 border-ADC9F6\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.PLUS_PRIMARY']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/plus-primary.svg')\" />\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_QUESTION'] || 'Add Question'}}\r\n </button>\r\n <mat-menu #addQuestionMenu=\"matMenu\" yPosition=\"below\" [overlapTrigger]=\"false\" class=\"assessment-cta-menu assessment-border-radius-two\">\r\n <button (click)=\"createEditQuestion(section)\" mat-menu-item class=\"d-flex align-items-center gap-2 py-3\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.PLUS_PRIMARY']\" class=\"menu-action-icon\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/plus-primary.svg')\" />\r\n <span class=\"assessment-text-semibold-13 menu-item-text\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.CREATE_NEW_QUESTION'] || 'Create New Question'}}\r\n </span>\r\n </button>\r\n <button (click)=\"openQuestionBankPicker(section)\" mat-menu-item class=\"d-flex align-items-center gap-2 py-3\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.FILE_IMPORT'] || 'assets/commons-assessment/images/file-import.svg'\" class=\"menu-action-icon\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/file-import.svg')\" />\r\n <span class=\"assessment-text-semibold-13 menu-item-text\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.IMPORT_FROM_QUESTION_BANK'] || 'Import from Question Bank'}}\r\n </span>\r\n </button>\r\n </mat-menu>\r\n </ng-container>\r\n <ng-template #singleAddQuestionBtn>\r\n <button (click)=\"createEditQuestion(section)\"\r\n class=\"assessment-zoom-animation assessment-button-padding d-flex align-items-center justify-content-center gap-2 assessment-text-primary-one assessment-bg-palette-EDF3FD assessment-text-semibold-12 outline-0 assessment-border-radius-two mt-3 border-ADC9F6\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.PLUS_PRIMARY']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/plus-primary.svg')\" />\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_A_QUESTION']}}\r\n </button>\r\n </ng-template>\r\n </div>\r\n </mat-expansion-panel>\r\n </mat-accordion>\r\n <div class=\"d-flex align-items-center ms-4\">\r\n <ng-container *ngIf=\"enableImportFromQuestionBank; else singleAddSectionBtn\">\r\n <button [matMenuTriggerFor]=\"addSectionMenu\"\r\n class=\"assessment-zoom-animation assessment-button-padding d-flex align-items-center justify-content-center gap-2 assessment-text-primary-one assessment-bg-palette-EDF3FD assessment-text-semibold-12 outline-0 assessment-border-radius-two mt-3 border-ADC9F6\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.ADD_SECTION']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/add-section.svg')\" />\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_A_SECTION']}}\r\n </button>\r\n <mat-menu #addSectionMenu=\"matMenu\" yPosition=\"below\" [overlapTrigger]=\"false\" class=\"assessment-cta-menu assessment-border-radius-two\">\r\n <button (click)=\"createEditQuestion()\" mat-menu-item class=\"d-flex align-items-center gap-2 py-3\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.ADD_SECTION']\" class=\"menu-action-icon\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/add-section.svg')\" />\r\n <span class=\"assessment-text-semibold-13 menu-item-text\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.CREATE_NEW_QUESTION'] || 'Create New Question'}}\r\n </span>\r\n </button>\r\n <button (click)=\"openQuestionBankPicker()\" mat-menu-item class=\"d-flex align-items-center gap-2 py-3\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.FILE_IMPORT'] || 'assets/commons-assessment/images/file-import.svg'\" class=\"menu-action-icon\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/file-import.svg')\" />\r\n <span class=\"assessment-text-semibold-13 menu-item-text\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.IMPORT_FROM_QUESTION_BANK'] || 'Import from Question Bank'}}\r\n </span>\r\n </button>\r\n </mat-menu>\r\n </ng-container>\r\n <ng-template #singleAddSectionBtn>\r\n <button (click)=\"createEditQuestion()\"\r\n class=\"assessment-zoom-animation assessment-button-padding d-flex align-items-center justify-content-center gap-2 assessment-text-primary-one assessment-bg-palette-EDF3FD assessment-text-semibold-12 outline-0 assessment-border-radius-two mt-3 border-ADC9F6\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.ADD_SECTION']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/add-section.svg')\" />\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_A_SECTION']}}\r\n </button>\r\n </ng-template>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"!assessmentQuestionPaperData?.questionPaperSectionList?.length\"\r\n class=\"h-100 d-flex flex-column align-items-center justify-content-center gap-3\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.NO_QUESTIONS']\" class=\"col-sm-auto col-6\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/no-questions.svg')\" />\r\n <div class=\"text-center\">\r\n <p class=\"mb-1 assessment-text-medium-18\">{{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_CUSTOM_QUESTIONS']}}</p>\r\n <p class=\"mb-0 assessment-text-medium-12 assessment-text-grey-seven\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_QUESTION_DESC']}}</p>\r\n </div>\r\n <div class=\"d-flex align-items-center\">\r\n <ng-container *ngIf=\"enableImportFromQuestionBank; else singleEmptyAddBtn\">\r\n <button [matMenuTriggerFor]=\"emptyAddMenu\"\r\n class=\"assessment-button-padding assessment-border-radius-two d-flex align-items-center gap-2 assessment-bg-palette-EDF3FD assessment-text-primary-one assessment-text-semibold-12 border-0 assessment-zoom-animation\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.PLUS_PRIMARY']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/plus-primary.svg')\" />\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_A_QUESTION']}}\r\n </button>\r\n <mat-menu #emptyAddMenu=\"matMenu\" yPosition=\"below\" [overlapTrigger]=\"false\" class=\"assessment-cta-menu assessment-border-radius-two\">\r\n <button (click)=\"createEditQuestion()\" mat-menu-item class=\"d-flex align-items-center gap-2 py-3\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.PLUS_PRIMARY']\" class=\"menu-action-icon\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/plus-primary.svg')\" />\r\n <span class=\"assessment-text-semibold-13 menu-item-text\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.CREATE_NEW_QUESTION'] || 'Create New Question'}}\r\n </span>\r\n </button>\r\n <button (click)=\"openQuestionBankPicker()\" mat-menu-item class=\"d-flex align-items-center gap-2 py-3\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.FILE_IMPORT'] || 'assets/commons-assessment/images/file-import.svg'\" class=\"menu-action-icon\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/file-import.svg')\" />\r\n <span class=\"assessment-text-semibold-13 menu-item-text\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.IMPORT_FROM_QUESTION_BANK'] || 'Import from Question Bank'}}\r\n </span>\r\n </button>\r\n </mat-menu>\r\n </ng-container>\r\n <ng-template #singleEmptyAddBtn>\r\n <button (click)=\"createEditQuestion()\"\r\n class=\"assessment-button-padding assessment-border-radius-two d-flex align-items-center gap-2 assessment-bg-palette-EDF3FD assessment-text-primary-one assessment-text-semibold-12 border-0 assessment-zoom-animation\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.PLUS_PRIMARY']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/plus-primary.svg')\" />\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_A_QUESTION']}}\r\n </button>\r\n </ng-template>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"showFooter\"\r\n class=\"bg-white p-3 position-sticky bottom-0 d-flex align-items-center justify-content-end border-top gap-3\">\r\n <button (click)=\"discardChanges()\" [disabled]=\"isSubmitting\"\r\n class=\"assessment-zoom-animation assessment-border-radius-two assessment-button-padding-large assessment-btn-primary-transparent assessment-text-semibold-13\">{{labelConfig['COMMONS_ASSESSMENT.LABEL.DISCARD']}}</button>\r\n <button (click)=\"finalSubmit()\" [disabled]=\"isSubmitting\"\r\n class=\"assessment-zoom-animation assessment-border-radius-two assessment-button-padding-large assessment-btn-primary assessment-text-semibold-13 position-relative\">\r\n <span [ngClass]=\"{'opacity-0': isSubmitting}\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.PUBLISH']}}\r\n </span>\r\n <mat-spinner *ngIf=\"isSubmitting\" [diameter]=\"20\"\r\n class=\"position-absolute top-50 start-50 translate-middle assessment-spinner-white\"></mat-spinner>\r\n </button>\r\n </div>\r\n</div>\r\n<ng-template #loader>\r\n <div class=\"h-100 col-12 d-flex align-items-center justify-content-center py-5\">\r\n <mat-spinner diameter=\"60\" class=\"assessment-spinner-primary\"></mat-spinner>\r\n </div>\r\n</ng-template>", styles: ["@charset \"UTF-8\";.assessment-text-grey-ten{color:var(--assessment-grey-ten)!important}.assessment-bg-grey-ten{background-color:var(--assessment-grey-ten)!important}.assessment-text-grey-nine{color:var(--assessment-grey-nine)!important}.assessment-bg-grey-nine{background-color:var(--assessment-grey-nine)!important}.assessment-text-grey-eight{color:var(--assessment-grey-eight)!important}.assessment-bg-grey-eight{background-color:var(--assessment-grey-eight)!important}.assessment-text-grey-seven{color:var(--assessment-grey-seven)!important}.assessment-bg-grey-seven{background-color:var(--assessment-grey-seven)!important}.assessment-text-grey-six{color:var(--assessment-grey-six)!important}.assessment-bg-grey-six{background-color:var(--assessment-grey-six)!important}.assessment-text-grey-five{color:var(--assessment-grey-five)!important}.assessment-bg-grey-five{background-color:var(--assessment-grey-five)!important}.assessment-text-grey-four{color:var(--assessment-grey-four)!important}.assessment-bg-grey-four{background-color:var(--assessment-grey-four)!important}.assessment-text-grey-three{color:var(--assessment-grey-three)!important}.assessment-bg-grey-three{background-color:var(--assessment-grey-three)!important}.assessment-text-grey-two{color:var(--assessment-grey-two)!important}.assessment-bg-grey-two{background-color:var(--assessment-grey-two)!important}.assessment-text-grey-one{color:var(--assessment-grey-one)!important}.assessment-bg-grey-one{background-color:var(--assessment-grey-one)!important}.assessment-text-white{color:var(--assessment-white)!important}.assessment-bg-white{background-color:var(--assessment-white)!important}.assessment-text-black{color:var(--assessment-black)!important}.assessment-bg-black{background-color:var(--assessment-black)!important}.assessment-text-danger{color:var(--assessment-danger)!important}.assessment-bg-danger{background-color:var(--assessment-danger)!important}.assessment-text-danger-bg{color:var(--assessment-danger-bg)!important}.assessment-bg-danger-bg{background-color:var(--assessment-danger-bg)!important}.assessment-text-success{color:var(--assessment-success)!important}.assessment-bg-success{background-color:var(--assessment-success)!important}.assessment-text-success-bg{color:var(--assessment-success-bg)!important}.assessment-bg-success-bg{background-color:var(--assessment-success-bg)!important}.assessment-text-warning{color:var(--assessment-warning)!important}.assessment-bg-warning{background-color:var(--assessment-warning)!important}.assessment-text-warning-bg{color:var(--assessment-warning-bg)!important}.assessment-bg-warning-bg{background-color:var(--assessment-warning-bg)!important}.assessment-text-primary-one{color:var(--assessment-primary-one)!important}.assessment-bg-primary-one{background-color:var(--assessment-primary-one)!important}.assessment-text-primary-four{color:var(--assessment-primary-four)!important}.assessment-bg-primary-four{background-color:var(--assessment-primary-four)!important}.assessment-text-palette-EDF3FD{color:var(--assessment-palette-EDF3FD)!important}.assessment-bg-palette-EDF3FD{background-color:var(--assessment-palette-EDF3FD)!important}.assessment-text-palette-C8DAF9{color:var(--assessment-palette-C8DAF9)!important}.assessment-bg-palette-C8DAF9{background-color:var(--assessment-palette-C8DAF9)!important}.assessment-text-palette-ADC9F6{color:var(--assessment-palette-ADC9F6)!important}.assessment-bg-palette-ADC9F6{background-color:var(--assessment-palette-ADC9F6)!important}.assessment-text-palette-FEF9F1{color:var(--assessment-palette-FEF9F1)!important}.assessment-bg-palette-FEF9F1{background-color:var(--assessment-palette-FEF9F1)!important}.assessment-text-palette-F9DAA6{color:var(--assessment-palette-F9DAA6)!important}.assessment-bg-palette-F9DAA6{background-color:var(--assessment-palette-F9DAA6)!important}.assessment-text-palette-E8F7F0{color:var(--assessment-palette-E8F7F0)!important}.assessment-bg-palette-E8F7F0{background-color:var(--assessment-palette-E8F7F0)!important}.assessment-text-palette-B7E7CF{color:var(--assessment-palette-B7E7CF)!important}.assessment-bg-palette-B7E7CF{background-color:var(--assessment-palette-B7E7CF)!important}.assessment-text-palette-FEF1E8{color:var(--assessment-palette-FEF1E8)!important}.assessment-bg-palette-FEF1E8{background-color:var(--assessment-palette-FEF1E8)!important}.assessment-text-palette-FAD2B9{color:var(--assessment-palette-FAD2B9)!important}.assessment-bg-palette-FAD2B9{background-color:var(--assessment-palette-FAD2B9)!important}.assessment-box-shadow-one{box-shadow:var(--assessment-box-shadow-one)!important}.assessment-border-radius-one{border-radius:var(--assessment-border-radius-one)!important}.assessment-border-radius-two{border-radius:var(--assessment-border-radius-two)!important}.assessment-border-radius-three{border-radius:var(--assessment-border-radius-three)!important}.assessment-border-radius-four{border-radius:var(--assessment-border-radius-four)!important}.assessment-border-radius-five{border-radius:var(--assessment-border-radius-five)!important}.assessment-border-radius-six{border-radius:var(--assessment-border-radius-six)!important}.assessment-input-border-one{border:var(--assessment-input-border-one)!important}.assessment-input-border-invalid{border:var(--assessment-input-border-invalid)!important}.assessment-input-focus-border{border:var(--assessment-input-focus-border)!important}.assessment-border-two{border:var(--assessment-border-two)!important}.assessment-card-border{border:var(--assessment-card-border)!important}.assessment-tooltip-border{border:var(--assessment-tooltip-border)!important}.assessment-box-shadow-tooltip{box-shadow:var(--assessment-box-shadow-tooltip)!important}.assessment-button-padding{padding:var(--assessment-button-padding)!important}.assessment-button-padding-large{padding:var(--assessment-button-padding-large)!important}.assessment-input-padding{padding:var(--assessment-input-padding)!important}.assessment-text-font-family{color:var(--assessment-font-family)!important}.assessment-bg-font-family{background-color:var(--assessment-font-family)!important}.assessment-text-regular-12{font-weight:400;font-family:var(--assessment-font-family);font-size:calc(.48rem + .3vw);line-height:calc(.9rem + .3vw)}.assessment-text-semibold-12{font-weight:600;font-family:var(--assessment-font-family)!important;font-size:calc(.48rem + .3vw);line-height:calc(.9rem + .3vw)}.assessment-text-medium-11{font-weight:500;font-family:var(--assessment-font-family);font-size:calc(.48rem + .25vw);line-height:calc(.8rem + .25vw)}.assessment-text-medium-10{font-weight:500;font-family:var(--assessment-font-family);font-size:calc(.42rem + .2vw);line-height:calc(.72rem + .2vw)}.assessment-text-regular-11{font-weight:400;font-family:var(--assessment-font-family);font-size:calc(.48rem + .25vw);line-height:calc(.8rem + .25vw)}.assessment-text-medium-12{font-weight:500;font-family:var(--assessment-font-family);font-size:calc(.48rem + .3vw);line-height:calc(.9rem + .3vw)}.assessment-text-regular-13{font-weight:400;font-family:var(--assessment-font-family)!important;font-size:calc(.64rem + .2vw)!important;line-height:calc(.9rem + .2vw)!important}.assessment-text-semibold-13{font-weight:600;font-family:var(--assessment-font-family)!important;font-size:calc(.64rem + .2vw)!important;line-height:calc(.9rem + .2vw)!important}.assessment-text-medium-13{font-weight:500;font-family:var(--assessment-font-family)!important;font-size:calc(.64rem + .2vw)!important;line-height:calc(.9rem + .2vw)!important}.assessment-text-medium-14{font-weight:500;font-family:var(--assessment-font-family)!important;font-size:calc(.7rem + .2vw)!important;line-height:calc(1.2rem + .2vw)!important}.assessment-text-semibold-14{font-weight:600;font-family:var(--assessment-font-family)!important;font-size:calc(.7rem + .2vw);line-height:calc(1.2rem + .2vw)}.assessment-text-regular-15{font-weight:400;font-family:var(--assessment-font-family);font-size:calc(.85rem + .1vw);line-height:calc(1.4rem + .1vw)}.assessment-text-medium-15{font-weight:500;font-family:var(--assessment-font-family);font-size:calc(.85rem + .1vw);line-height:calc(1.25rem + .1vw)}.assessment-text-semibold-15{font-weight:600;font-family:var(--assessment-font-family)!important;font-size:calc(.85rem + .1vw);line-height:calc(1.25rem + .1vw)}.assessment-text-semibold-16{font-weight:600;font-family:var(--assessment-font-family)!important;font-size:calc(.77rem + .25vw);line-height:calc(1.25rem + .2vw)}.assessment-text-medium-16{font-weight:500;font-family:var(--assessment-font-family)!important;font-size:calc(.77rem + .25vw);line-height:calc(1.25rem + .2vw)}.assessment-text-medium-18{font-weight:500;font-family:var(--assessment-font-family)!important;font-size:calc(1rem + .125vw)!important;line-height:calc(1.5rem + .1vw)!important}.assessment-text-semibold-18{font-weight:600;font-family:var(--assessment-font-family)!important;font-size:calc(1rem + .125vw)!important;line-height:calc(1.5rem + .1vw)!important}@media (min-height: 100vw) and (orientation: portrait){.assessment-text-medium-18,.assessment-text-semibold-18{font-size:calc(1rem + .1vh)!important;line-height:calc(1.6rem + .1vh)!important}.assessment-text-medium-16,.assessment-text-semibold-16{font-size:calc(.9rem + .2vh)!important;line-height:calc(1.4rem + .2vh)!important}.assessment-text-regular-15,.assessment-text-semibold-15{font-size:calc(.8rem + .2vh);line-height:calc(1.27rem + .2vh)}.assessment-text-medium-15{font-size:calc(.82rem + .2vh);line-height:calc(1.27rem + .2vh)}.assessment-text-medium-12,.assessment-text-regular-12,.assessment-text-semibold-12{font-size:calc(.5rem + .4vh);line-height:calc(.8rem + .4vh)}.assessment-text-medium-14,.assessment-text-semibold-14{font-size:calc(.8rem + .1vh)!important;line-height:calc(1.2rem + .2vh)!important}.assessment-text-regular-13,.assessment-text-medium-13,.assessment-text-semibold-13{font-size:calc(.7rem + .2vh)!important;line-height:calc(1rem + .3vh)!important}.assessment-text-regular-11,.assessment-text-medium-11{font-size:calc(.5rem + .2vh)!important;line-height:calc(.8rem + .2vh)!important}.assessment-text-medium-10{font-size:calc(.45rem + .2vh)!important;line-height:calc(.72rem + .2vh)!important}}.assessment-btn-primary{background-color:var(--assessment-primary-one);color:var(--assessment-white);border:.064rem solid var(--assessment-primary-one);border-radius:var(--assessment-border-radius-two)}.assessment-btn-primary-transparent{background-color:var(--assessment-white);color:var(--assessment-primary-one);border-radius:var(--assessment-border-radius-two);border:.064rem solid var(--assessment-primary-one)}.assessment-zoom-animation{transition:transform .2s ease;transform:translateZ(0);text-rendering:optimizeLegibility}.assessment-zoom-animation:hover{transform:scale(1.03)}.assessment-zoom-animation:active{transform:scale(1)}.assessment-zoom-animation:disabled{transform:none!important}.change-direction{transform:rotate(180deg);transition:.3s ease-out}.change-direction-reverse{transform:rotate(0);transition:.3s ease-out}.outline-0{outline:none}.cursor-grab{cursor:grab}.cursor-pointer{cursor:pointer}.action-icon{width:1.2rem}.mat-menu-item,.mat-mdc-menu-item{height:inherit;min-height:unset;--mat-menu-item-label-text-font: var(--assessment-font-family) !important;--mat-menu-item-label-text-size: 14px !important;--mat-menu-item-label-text-weight: 600 !important;--mat-menu-item-label-text-line-height: inherit !important}.skill-chip{width:-moz-fit-content;width:fit-content;background:var(--assessment-palette-EDF3FD);border:.064rem solid var(--assessment-palette-C8DAF9)}.assessment-form-check-input-primary-one{min-height:unset}.assessment-form-check-input-primary-one .form-check-input{width:1rem;height:1rem}.assessment-form-check-input-primary-one .form-check-input:checked{background-color:var(--assessment-primary-one);color:var(--assessment-primary-one)}.assessment-form-check-input-primary-one .form-check-input:disabled{opacity:.8}.form-check-input:checked{background-color:var(--assessment-primary-one);border-color:var(--assessment-primary-one)}.form-check-input:focus{border-color:var(--assessment-primary-one);box-shadow:none}.input-focus{overflow:hidden;text-overflow:ellipsis}.input-focus:focus-visible{border-bottom:var(--assessment-input-focus-border)!important}.one-line-truncate{display:inline-block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.height-without-footer{height:calc(100% - 4.4rem)!important}.question-container{transition:all .3s ease}.question-container:hover{box-shadow:var(--assessment-box-shadow-one);background-color:var(--assessment-palette-EDF3FD);border-color:var(--assessment-palette-C8DAF9)!important}.border-ADC9F6{border:.064rem solid var(--assessment-palette-ADC9F6)}.no-border{border-color:transparent!important}@keyframes ctaMenuBloom{0%{opacity:0;transform:translateY(-8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}::ng-deep .assessment-cta-menu.mat-menu-panel{min-width:15rem;max-width:22rem;margin-top:.5rem!important;border:1px solid var(--assessment-grey-four, #e2e8f0);border-radius:var(--assessment-border-radius-two, .5rem);background-color:var(--assessment-bg-grey-one, #f8fafc)!important;box-shadow:0 4px 6px -1px #0000000a,0 14px 28px -3px #00000014!important;padding:0;overflow:hidden;transform-origin:top left;animation:ctaMenuBloom .2s cubic-bezier(.16,1,.3,1) forwards;will-change:transform,opacity}::ng-deep .assessment-cta-menu.mat-menu-panel .mat-menu-content{padding:0!important}::ng-deep .assessment-cta-menu.mat-menu-panel .mat-menu-item{height:auto;line-height:normal;padding:.75rem 1rem;display:flex;align-items:center;grid-gap:.75rem;gap:.75rem;background-color:transparent;transition:background-color .14s ease-out,transform .14s ease-out}::ng-deep .assessment-cta-menu.mat-menu-panel .mat-menu-item:not(:last-child){border-bottom:1px solid var(--assessment-grey-four, #e2e8f0)}::ng-deep .assessment-cta-menu.mat-menu-panel .mat-menu-item .menu-item-text{color:var(--assessment-text-grey-ten, #1e293b);transition:color .14s ease-out}::ng-deep .assessment-cta-menu.mat-menu-panel .mat-menu-item .menu-action-icon{width:1.125rem;height:1.125rem;flex-shrink:0;transition:transform .14s ease-out}::ng-deep .assessment-cta-menu.mat-menu-panel .mat-menu-item:hover{background-color:var(--assessment-palette-EDF3FD, #EDF3FD);transform:translate(2px)}::ng-deep .assessment-cta-menu.mat-menu-panel .mat-menu-item:hover .menu-item-text{color:var(--assessment-primary-one, #467DD6)}::ng-deep .assessment-cta-menu.mat-menu-panel .mat-menu-item:hover .menu-action-icon{transform:scale(1.08)}\n"], components: [{ type: i3__namespace.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { type: i3__namespace.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["tabIndex", "expandedHeight", "collapsedHeight"] }, { type: i1__namespace$3.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i1__namespace$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: QuestionDetailsComponent, selector: "lib-question-details", inputs: ["sectionQuestion", "question", "questionBank", "labelConfig", "imageConfig", "allowDelete", "isLocked"], outputs: ["editQuestion", "duplicateQuestion", "deleteParentQuestion", "deleteChildQuestion"] }, { type: i10__namespace.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i2__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i1__namespace$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i1__namespace$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: i1__namespace$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1__namespace$2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i3__namespace.MatAccordion, selector: "mat-accordion", inputs: ["multi", "displayMode", "togglePosition", "hideToggle"], exportAs: ["matAccordion"] }, { type: i10__namespace$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i2__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i10__namespace$2.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { type: i2__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1__namespace$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }] });
|
|
6270
|
+
AssessmentMakerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: AssessmentMakerComponent, selector: "lib-assessment-maker", inputs: { labelConfig: "labelConfig", imageConfig: "imageConfig", questionTypes: "questionTypes", showFooter: "showFooter", customRules: "customRules", assessmentId: "assessmentId", assessmentInstanceId: "assessmentInstanceId", defaultAssessmentDTO: "defaultAssessmentDTO", predefinedAssessmentInstance: "predefinedAssessmentInstance", enableSkillsToQuestionMapping: "enableSkillsToQuestionMapping", assessmentContext: "assessmentContext", minimumRequiredSections: "minimumRequiredSections", checkForResponses: "checkForResponses", showProctoringToggle: "showProctoringToggle", showTimeInput: "showTimeInput", enableImportFromQuestionBank: "enableImportFromQuestionBank", questionBankConfig: "questionBankConfig" }, outputs: { assessmentIdChange: "assessmentIdChange", assessmentInstanceIdChange: "assessmentInstanceIdChange", snackbarMessage: "snackbarMessage" }, ngImport: i0__namespace, template: "<div *ngIf=\"configsLoaded && !showLoader; else loader\" class=\"col-12 h-100\">\r\n <div class=\"col-12 h-100 py-4\" [class.height-without-footer]=\"showFooter\">\r\n <ng-container *ngIf=\"assessmentQuestionPaperData?.questionPaperSectionList?.length\">\r\n <div *ngIf=\"showProctoringToggle || showTimeInput\"\r\n class=\"d-flex align-items-center justify-content-end flex-wrap gap-4 mb-3\">\r\n <div *ngIf=\"showTimeInput\" class=\"d-flex align-items-center gap-2\">\r\n <label for=\"durationInput\" class=\"assessment-text-medium-13 assessment-text-grey-ten mb-0 cursor-pointer\">\r\n {{ labelConfig['COMMONS_ASSESSMENT.LABEL.DURATION'] }}\r\n </label>\r\n <input type=\"number\" id=\"durationInput\" min=\"1\" [(ngModel)]=\"durationMinutes\"\r\n (keydown)=\"blockNegativeKeys($event)\" (ngModelChange)=\"durationMinutes = $event > 0 ? $event : null\"\r\n [placeholder]=\"0\"\r\n class=\"form-control form-control-sm assessment-border-radius-two assessment-text-regular-13\" style=\"width: 4rem;\">\r\n <span class=\"assessment-text-regular-13 assessment-text-grey-seven\">\r\n {{ labelConfig['COMMONS_ASSESSMENT.LABEL.MINUTES'] }}\r\n </span>\r\n </div>\r\n <div *ngIf=\"showProctoringToggle\" class=\"d-flex align-items-center gap-2\">\r\n <label for=\"proctoringToggle\" class=\"assessment-text-medium-13 assessment-text-grey-ten mb-0 cursor-pointer\">\r\n {{ labelConfig['COMMONS_ASSESSMENT.LABEL.ENABLE_PROCTORING'] }}\r\n </label>\r\n <div class=\"form-check form-switch m-0\">\r\n <input type=\"checkbox\" id=\"proctoringToggle\" class=\"form-check-input cursor-pointer\"\r\n [(ngModel)]=\"proctoringEnabled\">\r\n </div>\r\n </div>\r\n </div>\r\n <mat-accordion multi=\"true\" cdkDropList (cdkDropListDropped)=\"dropSection($event)\">\r\n <mat-expansion-panel [hideToggle]=\"true\" #panel=\"matExpansionPanel\" [expanded]=\"section.isExpanded\"\r\n (opened)=\"section.isExpanded = true\" (closed)=\"section.isExpanded = false\"\r\n class=\"mb-4 border-0 assessment-panel shadow-none bg-transparent\" cdkDrag\r\n *ngFor=\"let section of assessmentQuestionPaperData?.questionPaperSectionList; let sectionIndex = index; trackBy: trackBySectionId\">\r\n <!-- Section Header -->\r\n <mat-expansion-panel-header class=\"col-12 p-0 h-auto bg-transparent\">\r\n <div class=\"d-flex col-12 align-items-center gap-md-3 gap-2\">\r\n <img cdkDragHandle [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.DRAG_DROP']\"\r\n class=\"cursor-grab\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/drag-drop.svg')\" />\r\n <div class=\"d-flex align-items-center gap-2 flex-grow-1 justify-content-between p-3 assessment-border-radius-two assessment-border-two assessment-bg-white\"\r\n [class.border-transparent]=\"section.isExpanded\">\r\n <div>\r\n <div class=\"d-flex align-items-center mb-1\">\r\n <input type=\"text\" [id]=\"'sectionNameInput_' + sectionIndex\"\r\n class=\"col-md-11 col-10 assessment-text-semibold-18 border-0 outline-0 bg-transparent p-0 input-focus\"\r\n [(ngModel)]=\"section.qpsName[0].text\"\r\n [attr.size]=\"(section.qpsName[0].text?.length || 1)\"\r\n (click)=\"$event.stopPropagation()\" (keydown)=\"$event.stopPropagation()\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.EDIT']\"\r\n class=\"action-icon cursor-pointer\"\r\n (click)=\"focusSectionInput(sectionIndex, $event)\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/pencil.svg')\" />\r\n </div>\r\n <p class=\"mb-0 assessment-text-medium-12 assessment-text-grey-seven\">\r\n {{section?.sectionQuestionsList?.length || 0}}\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.QUESTIONS']}}\r\n </p>\r\n </div>\r\n <div class=\"d-flex align-items-center gap-md-4 gap-2\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.ARROW_DOWN_BLACK']\"\r\n [ngClass]=\"panel.expanded ? 'change-direction' : 'change-direction-reverse'\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/arrow-down-black.svg')\" />\r\n <button [matMenuTriggerFor]=\"menu\" (click)=\"$event.stopPropagation()\"\r\n class=\"border-0 bg-transparent py-2\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.ACTION_DOTS']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/action-dots.svg')\" />\r\n </button>\r\n <mat-menu #menu=\"matMenu\"\r\n class=\"mat-menu assessment-border-radius-two assessment-border-grey-four-1\">\r\n <button (click)=\"addInstruction(section)\" mat-menu-item\r\n class=\"py-2 assessment-text-semibold-12\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_INSTRUCTIONS']}}\r\n </button>\r\n <button (click)=\"duplicateSection(section.id)\" mat-menu-item\r\n class=\"py-2 assessment-text-semibold-12\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.DUPLICATE']}}\r\n </button>\r\n <button *ngIf=\"(assessmentQuestionPaperData?.questionPaperSectionList?.length ?? 0) > minimumRequiredSections\" \r\n (click)=\"deleteSection(section)\" mat-menu-item\r\n class=\"py-2 assessment-text-semibold-12 assessment-text-danger\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.DELETE']}}\r\n </button>\r\n </mat-menu>\r\n </div>\r\n </div>\r\n </div>\r\n </mat-expansion-panel-header>\r\n\r\n <!-- Questions inside section -->\r\n <div cdkDropList [cdkDropListData]=\"section.sectionQuestionsList || []\"\r\n (cdkDropListDropped)=\"dropQuestion($event)\">\r\n <div cdkDrag *ngFor=\"let sectionQuestion of section.sectionQuestionsList; let i = index; trackBy: trackBySectionQuestion\"\r\n class=\"d-flex align-items-start gap-md-3 gap-2 my-3 overflow-hidden\">\r\n <img cdkDragHandle [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.DRAG_DROP']\"\r\n class=\"cursor-grab mt-4\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/drag-drop.svg')\" />\r\n <div class=\"flex-grow-1 p-3 assessment-border-two assessment-border-radius-two question-container assessment-bg-white\">\r\n <lib-question-details [sectionQuestion]=\"sectionQuestion\"\r\n [question]=\"getQuestionFromBank(sectionQuestion.questionId) || {}\"\r\n [questionBank]=\"questionBank\" [imageConfig]=\"imageConfig\"\r\n [labelConfig]=\"labelConfig\" [allowDelete]=\"(section?.sectionQuestionsList?.length ?? 0) > 1\"\r\n [isLocked]=\"isQuestionLocked(sectionQuestion?.questionId)\"\r\n (editQuestion)=\"createEditQuestion(section, $event?.questionId, $event?.isChildQuestion)\"\r\n (duplicateQuestion)=\"duplicateQuestion(section, $event)\"\r\n (deleteParentQuestion)=\"deleteParentQuestion($event)\"\r\n (deleteChildQuestion)=\"deleteChildQuestion($event.option, $event.childQuestionId)\">\r\n </lib-question-details>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"col-12 ps-4 border-bottom pb-4 d-flex align-items-center\">\r\n <ng-container *ngIf=\"enableImportFromQuestionBank; else singleAddQuestionBtn\">\r\n <div class=\"position-relative d-inline-block\" [style.z-index]=\"activeDropdownId === ('question_' + section.id) ? 1005 : 'auto'\">\r\n <button (click)=\"toggleDropdown('question_' + section.id, $event)\"\r\n class=\"assessment-zoom-animation assessment-button-padding d-flex align-items-center justify-content-center gap-2 assessment-text-primary-one assessment-bg-palette-EDF3FD assessment-text-semibold-12 outline-0 assessment-border-radius-two mt-3 border-ADC9F6\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.PLUS_PRIMARY']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/plus-primary.svg')\" />\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_QUESTION'] || 'Add Question'}}\r\n </button>\r\n <div *ngIf=\"activeDropdownId === 'question_' + section.id\" (click)=\"closeAllDropdowns()\" class=\"position-fixed top-0 start-0 w-100 h-100 bg-transparent\" style=\"z-index: 1000;\"></div>\r\n <div *ngIf=\"activeDropdownId === 'question_' + section.id\"\r\n class=\"dropdown-menu assessment-dropdown-menu show shadow border rounded-3 p-0 overflow-hidden position-absolute start-0\"\r\n [ngClass]=\"dropdownPlacementMap['question_' + section.id] === 'top' ? 'bottom-100 mb-2 assessment-bloom-up' : 'top-100 mt-2 assessment-bloom-down'\"\r\n style=\"min-width: 16rem; z-index: 1010;\">\r\n <button (click)=\"createEditQuestion(section); closeAllDropdowns()\" class=\"dropdown-item d-flex align-items-center gap-2 py-3 px-3 fw-medium border-bottom\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.PLUS_PRIMARY']\" style=\"width: 1rem; height: 1rem;\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/plus-primary.svg')\" />\r\n <span class=\"assessment-text-semibold-13\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.CREATE_NEW_QUESTION'] || 'Create New Question'}}\r\n </span>\r\n </button>\r\n <button (click)=\"openQuestionBankPicker(section); closeAllDropdowns()\" class=\"dropdown-item d-flex align-items-center gap-2 py-3 px-3 fw-medium\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.FILE_IMPORT'] || 'assets/commons-assessment/images/file-import.svg'\" style=\"width: 1rem; height: 1rem;\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/file-import.svg')\" />\r\n <span class=\"assessment-text-semibold-13\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.IMPORT_FROM_QUESTION_BANK'] || 'Import from Question Bank'}}\r\n </span>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-template #singleAddQuestionBtn>\r\n <button (click)=\"createEditQuestion(section)\"\r\n class=\"assessment-zoom-animation assessment-button-padding d-flex align-items-center justify-content-center gap-2 assessment-text-primary-one assessment-bg-palette-EDF3FD assessment-text-semibold-12 outline-0 assessment-border-radius-two mt-3 border-ADC9F6\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.PLUS_PRIMARY']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/plus-primary.svg')\" />\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_A_QUESTION']}}\r\n </button>\r\n </ng-template>\r\n </div>\r\n </mat-expansion-panel>\r\n </mat-accordion>\r\n <div class=\"d-flex align-items-center ms-4\">\r\n <ng-container *ngIf=\"enableImportFromQuestionBank; else singleAddSectionBtn\">\r\n <div class=\"position-relative d-inline-block\" [style.z-index]=\"activeDropdownId === 'add_section' ? 1005 : 'auto'\">\r\n <button (click)=\"toggleDropdown('add_section', $event)\"\r\n class=\"assessment-zoom-animation assessment-button-padding d-flex align-items-center justify-content-center gap-2 assessment-text-primary-one assessment-bg-palette-EDF3FD assessment-text-semibold-12 outline-0 assessment-border-radius-two mt-3 border-ADC9F6\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.ADD_SECTION']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/add-section.svg')\" />\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_A_SECTION']}}\r\n </button>\r\n <div *ngIf=\"activeDropdownId === 'add_section'\" (click)=\"closeAllDropdowns()\" class=\"position-fixed top-0 start-0 w-100 h-100 bg-transparent\" style=\"z-index: 1000;\"></div>\r\n <div *ngIf=\"activeDropdownId === 'add_section'\"\r\n class=\"dropdown-menu assessment-dropdown-menu show shadow border rounded-3 p-0 overflow-hidden position-absolute start-0\"\r\n [ngClass]=\"dropdownPlacementMap['add_section'] === 'top' ? 'bottom-100 mb-2 assessment-bloom-up' : 'top-100 mt-2 assessment-bloom-down'\"\r\n style=\"min-width: 16rem; z-index: 1010;\">\r\n <button (click)=\"createEditQuestion(); closeAllDropdowns()\" class=\"dropdown-item d-flex align-items-center gap-2 py-3 px-3 fw-medium border-bottom\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.ADD_SECTION']\" style=\"width: 1rem; height: 1rem;\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/add-section.svg')\" />\r\n <span class=\"assessment-text-semibold-13\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.CREATE_NEW_QUESTION'] || 'Create New Question'}}\r\n </span>\r\n </button>\r\n <button (click)=\"openQuestionBankPicker(); closeAllDropdowns()\" class=\"dropdown-item d-flex align-items-center gap-2 py-3 px-3 fw-medium\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.FILE_IMPORT'] || 'assets/commons-assessment/images/file-import.svg'\" style=\"width: 1rem; height: 1rem;\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/file-import.svg')\" />\r\n <span class=\"assessment-text-semibold-13\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.IMPORT_FROM_QUESTION_BANK'] || 'Import from Question Bank'}}\r\n </span>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-template #singleAddSectionBtn>\r\n <button (click)=\"createEditQuestion()\"\r\n class=\"assessment-zoom-animation assessment-button-padding d-flex align-items-center justify-content-center gap-2 assessment-text-primary-one assessment-bg-palette-EDF3FD assessment-text-semibold-12 outline-0 assessment-border-radius-two mt-3 border-ADC9F6\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.ADD_SECTION']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/add-section.svg')\" />\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_A_SECTION']}}\r\n </button>\r\n </ng-template>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"!assessmentQuestionPaperData?.questionPaperSectionList?.length\"\r\n class=\"h-100 d-flex flex-column align-items-center justify-content-center gap-3\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.NO_QUESTIONS']\" class=\"col-sm-auto col-6\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/no-questions.svg')\" />\r\n <div class=\"text-center\">\r\n <p class=\"mb-1 assessment-text-medium-18\">{{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_CUSTOM_QUESTIONS']}}</p>\r\n <p class=\"mb-0 assessment-text-medium-12 assessment-text-grey-seven\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_QUESTION_DESC']}}</p>\r\n </div>\r\n <div class=\"d-flex align-items-center\">\r\n <ng-container *ngIf=\"enableImportFromQuestionBank; else singleEmptyAddBtn\">\r\n <div class=\"position-relative d-inline-block\" [style.z-index]=\"activeDropdownId === 'empty_add' ? 1005 : 'auto'\">\r\n <button (click)=\"toggleDropdown('empty_add', $event)\"\r\n class=\"assessment-button-padding assessment-border-radius-two d-flex align-items-center gap-2 assessment-bg-palette-EDF3FD assessment-text-primary-one assessment-text-semibold-12 border-0 assessment-zoom-animation\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.PLUS_PRIMARY']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/plus-primary.svg')\" />\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_A_QUESTION']}}\r\n </button>\r\n <div *ngIf=\"activeDropdownId === 'empty_add'\" (click)=\"closeAllDropdowns()\" class=\"position-fixed top-0 start-0 w-100 h-100 bg-transparent\" style=\"z-index: 1000;\"></div>\r\n <div *ngIf=\"activeDropdownId === 'empty_add'\"\r\n class=\"dropdown-menu assessment-dropdown-menu show shadow border rounded-3 p-0 overflow-hidden position-absolute start-0\"\r\n [ngClass]=\"dropdownPlacementMap['empty_add'] === 'top' ? 'bottom-100 mb-2 assessment-bloom-up' : 'top-100 mt-2 assessment-bloom-down'\"\r\n style=\"min-width: 16rem; z-index: 1010;\">\r\n <button (click)=\"createEditQuestion(); closeAllDropdowns()\" class=\"dropdown-item d-flex align-items-center gap-2 py-3 px-3 fw-medium border-bottom\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.PLUS_PRIMARY']\" style=\"width: 1rem; height: 1rem;\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/plus-primary.svg')\" />\r\n <span class=\"assessment-text-semibold-13\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.CREATE_NEW_QUESTION'] || 'Create New Question'}}\r\n </span>\r\n </button>\r\n <button (click)=\"openQuestionBankPicker(); closeAllDropdowns()\" class=\"dropdown-item d-flex align-items-center gap-2 py-3 px-3 fw-medium\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.FILE_IMPORT'] || 'assets/commons-assessment/images/file-import.svg'\" style=\"width: 1rem; height: 1rem;\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/file-import.svg')\" />\r\n <span class=\"assessment-text-semibold-13\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.IMPORT_FROM_QUESTION_BANK'] || 'Import from Question Bank'}}\r\n </span>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-template #singleEmptyAddBtn>\r\n <button (click)=\"createEditQuestion()\"\r\n class=\"assessment-button-padding assessment-border-radius-two d-flex align-items-center gap-2 assessment-bg-palette-EDF3FD assessment-text-primary-one assessment-text-semibold-12 border-0 assessment-zoom-animation\">\r\n <img [src]=\"imageConfig['COMMONS_ASSESSMENT.ICON.PLUS_PRIMARY']\"\r\n (error)=\"imageErrorHandler($event, 'assets/commons-assessment/images/plus-primary.svg')\" />\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.ADD_A_QUESTION']}}\r\n </button>\r\n </ng-template>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"showFooter\"\r\n class=\"bg-white p-3 position-sticky bottom-0 d-flex align-items-center justify-content-end border-top gap-3\">\r\n <button (click)=\"discardChanges()\" [disabled]=\"isSubmitting\"\r\n class=\"assessment-zoom-animation assessment-border-radius-two assessment-button-padding-large assessment-btn-primary-transparent assessment-text-semibold-13\">{{labelConfig['COMMONS_ASSESSMENT.LABEL.DISCARD']}}</button>\r\n <button (click)=\"finalSubmit()\" [disabled]=\"isSubmitting\"\r\n class=\"assessment-zoom-animation assessment-border-radius-two assessment-button-padding-large assessment-btn-primary assessment-text-semibold-13 position-relative\">\r\n <span [ngClass]=\"{'opacity-0': isSubmitting}\">\r\n {{labelConfig['COMMONS_ASSESSMENT.LABEL.PUBLISH']}}\r\n </span>\r\n <mat-spinner *ngIf=\"isSubmitting\" [diameter]=\"20\"\r\n class=\"position-absolute top-50 start-50 translate-middle assessment-spinner-white\"></mat-spinner>\r\n </button>\r\n </div>\r\n</div>\r\n<ng-template #loader>\r\n <div class=\"h-100 col-12 d-flex align-items-center justify-content-center py-5\">\r\n <mat-spinner diameter=\"60\" class=\"assessment-spinner-primary\"></mat-spinner>\r\n </div>\r\n</ng-template>", styles: ["@charset \"UTF-8\";.assessment-text-grey-ten{color:var(--assessment-grey-ten)!important}.assessment-bg-grey-ten{background-color:var(--assessment-grey-ten)!important}.assessment-text-grey-nine{color:var(--assessment-grey-nine)!important}.assessment-bg-grey-nine{background-color:var(--assessment-grey-nine)!important}.assessment-text-grey-eight{color:var(--assessment-grey-eight)!important}.assessment-bg-grey-eight{background-color:var(--assessment-grey-eight)!important}.assessment-text-grey-seven{color:var(--assessment-grey-seven)!important}.assessment-bg-grey-seven{background-color:var(--assessment-grey-seven)!important}.assessment-text-grey-six{color:var(--assessment-grey-six)!important}.assessment-bg-grey-six{background-color:var(--assessment-grey-six)!important}.assessment-text-grey-five{color:var(--assessment-grey-five)!important}.assessment-bg-grey-five{background-color:var(--assessment-grey-five)!important}.assessment-text-grey-four{color:var(--assessment-grey-four)!important}.assessment-bg-grey-four{background-color:var(--assessment-grey-four)!important}.assessment-text-grey-three{color:var(--assessment-grey-three)!important}.assessment-bg-grey-three{background-color:var(--assessment-grey-three)!important}.assessment-text-grey-two{color:var(--assessment-grey-two)!important}.assessment-bg-grey-two{background-color:var(--assessment-grey-two)!important}.assessment-text-grey-one{color:var(--assessment-grey-one)!important}.assessment-bg-grey-one{background-color:var(--assessment-grey-one)!important}.assessment-text-white{color:var(--assessment-white)!important}.assessment-bg-white{background-color:var(--assessment-white)!important}.assessment-text-black{color:var(--assessment-black)!important}.assessment-bg-black{background-color:var(--assessment-black)!important}.assessment-text-danger{color:var(--assessment-danger)!important}.assessment-bg-danger{background-color:var(--assessment-danger)!important}.assessment-text-danger-bg{color:var(--assessment-danger-bg)!important}.assessment-bg-danger-bg{background-color:var(--assessment-danger-bg)!important}.assessment-text-success{color:var(--assessment-success)!important}.assessment-bg-success{background-color:var(--assessment-success)!important}.assessment-text-success-bg{color:var(--assessment-success-bg)!important}.assessment-bg-success-bg{background-color:var(--assessment-success-bg)!important}.assessment-text-warning{color:var(--assessment-warning)!important}.assessment-bg-warning{background-color:var(--assessment-warning)!important}.assessment-text-warning-bg{color:var(--assessment-warning-bg)!important}.assessment-bg-warning-bg{background-color:var(--assessment-warning-bg)!important}.assessment-text-primary-one{color:var(--assessment-primary-one)!important}.assessment-bg-primary-one{background-color:var(--assessment-primary-one)!important}.assessment-text-primary-four{color:var(--assessment-primary-four)!important}.assessment-bg-primary-four{background-color:var(--assessment-primary-four)!important}.assessment-text-palette-EDF3FD{color:var(--assessment-palette-EDF3FD)!important}.assessment-bg-palette-EDF3FD{background-color:var(--assessment-palette-EDF3FD)!important}.assessment-text-palette-C8DAF9{color:var(--assessment-palette-C8DAF9)!important}.assessment-bg-palette-C8DAF9{background-color:var(--assessment-palette-C8DAF9)!important}.assessment-text-palette-ADC9F6{color:var(--assessment-palette-ADC9F6)!important}.assessment-bg-palette-ADC9F6{background-color:var(--assessment-palette-ADC9F6)!important}.assessment-text-palette-FEF9F1{color:var(--assessment-palette-FEF9F1)!important}.assessment-bg-palette-FEF9F1{background-color:var(--assessment-palette-FEF9F1)!important}.assessment-text-palette-F9DAA6{color:var(--assessment-palette-F9DAA6)!important}.assessment-bg-palette-F9DAA6{background-color:var(--assessment-palette-F9DAA6)!important}.assessment-text-palette-E8F7F0{color:var(--assessment-palette-E8F7F0)!important}.assessment-bg-palette-E8F7F0{background-color:var(--assessment-palette-E8F7F0)!important}.assessment-text-palette-B7E7CF{color:var(--assessment-palette-B7E7CF)!important}.assessment-bg-palette-B7E7CF{background-color:var(--assessment-palette-B7E7CF)!important}.assessment-text-palette-FEF1E8{color:var(--assessment-palette-FEF1E8)!important}.assessment-bg-palette-FEF1E8{background-color:var(--assessment-palette-FEF1E8)!important}.assessment-text-palette-FAD2B9{color:var(--assessment-palette-FAD2B9)!important}.assessment-bg-palette-FAD2B9{background-color:var(--assessment-palette-FAD2B9)!important}.assessment-box-shadow-one{box-shadow:var(--assessment-box-shadow-one)!important}.assessment-border-radius-one{border-radius:var(--assessment-border-radius-one)!important}.assessment-border-radius-two{border-radius:var(--assessment-border-radius-two)!important}.assessment-border-radius-three{border-radius:var(--assessment-border-radius-three)!important}.assessment-border-radius-four{border-radius:var(--assessment-border-radius-four)!important}.assessment-border-radius-five{border-radius:var(--assessment-border-radius-five)!important}.assessment-border-radius-six{border-radius:var(--assessment-border-radius-six)!important}.assessment-input-border-one{border:var(--assessment-input-border-one)!important}.assessment-input-border-invalid{border:var(--assessment-input-border-invalid)!important}.assessment-input-focus-border{border:var(--assessment-input-focus-border)!important}.assessment-border-two{border:var(--assessment-border-two)!important}.assessment-card-border{border:var(--assessment-card-border)!important}.assessment-tooltip-border{border:var(--assessment-tooltip-border)!important}.assessment-box-shadow-tooltip{box-shadow:var(--assessment-box-shadow-tooltip)!important}.assessment-button-padding{padding:var(--assessment-button-padding)!important}.assessment-button-padding-large{padding:var(--assessment-button-padding-large)!important}.assessment-input-padding{padding:var(--assessment-input-padding)!important}.assessment-text-font-family{color:var(--assessment-font-family)!important}.assessment-bg-font-family{background-color:var(--assessment-font-family)!important}.assessment-text-regular-12{font-weight:400;font-family:var(--assessment-font-family);font-size:calc(.48rem + .3vw);line-height:calc(.9rem + .3vw)}.assessment-text-semibold-12{font-weight:600;font-family:var(--assessment-font-family)!important;font-size:calc(.48rem + .3vw);line-height:calc(.9rem + .3vw)}.assessment-text-medium-11{font-weight:500;font-family:var(--assessment-font-family);font-size:calc(.48rem + .25vw);line-height:calc(.8rem + .25vw)}.assessment-text-medium-10{font-weight:500;font-family:var(--assessment-font-family);font-size:calc(.42rem + .2vw);line-height:calc(.72rem + .2vw)}.assessment-text-regular-11{font-weight:400;font-family:var(--assessment-font-family);font-size:calc(.48rem + .25vw);line-height:calc(.8rem + .25vw)}.assessment-text-medium-12{font-weight:500;font-family:var(--assessment-font-family);font-size:calc(.48rem + .3vw);line-height:calc(.9rem + .3vw)}.assessment-text-regular-13{font-weight:400;font-family:var(--assessment-font-family)!important;font-size:calc(.64rem + .2vw)!important;line-height:calc(.9rem + .2vw)!important}.assessment-text-semibold-13{font-weight:600;font-family:var(--assessment-font-family)!important;font-size:calc(.64rem + .2vw)!important;line-height:calc(.9rem + .2vw)!important}.assessment-text-medium-13{font-weight:500;font-family:var(--assessment-font-family)!important;font-size:calc(.64rem + .2vw)!important;line-height:calc(.9rem + .2vw)!important}.assessment-text-medium-14{font-weight:500;font-family:var(--assessment-font-family)!important;font-size:calc(.7rem + .2vw)!important;line-height:calc(1.2rem + .2vw)!important}.assessment-text-semibold-14{font-weight:600;font-family:var(--assessment-font-family)!important;font-size:calc(.7rem + .2vw);line-height:calc(1.2rem + .2vw)}.assessment-text-regular-15{font-weight:400;font-family:var(--assessment-font-family);font-size:calc(.85rem + .1vw);line-height:calc(1.4rem + .1vw)}.assessment-text-medium-15{font-weight:500;font-family:var(--assessment-font-family);font-size:calc(.85rem + .1vw);line-height:calc(1.25rem + .1vw)}.assessment-text-semibold-15{font-weight:600;font-family:var(--assessment-font-family)!important;font-size:calc(.85rem + .1vw);line-height:calc(1.25rem + .1vw)}.assessment-text-semibold-16{font-weight:600;font-family:var(--assessment-font-family)!important;font-size:calc(.77rem + .25vw);line-height:calc(1.25rem + .2vw)}.assessment-text-medium-16{font-weight:500;font-family:var(--assessment-font-family)!important;font-size:calc(.77rem + .25vw);line-height:calc(1.25rem + .2vw)}.assessment-text-medium-18{font-weight:500;font-family:var(--assessment-font-family)!important;font-size:calc(1rem + .125vw)!important;line-height:calc(1.5rem + .1vw)!important}.assessment-text-semibold-18{font-weight:600;font-family:var(--assessment-font-family)!important;font-size:calc(1rem + .125vw)!important;line-height:calc(1.5rem + .1vw)!important}@media (min-height: 100vw) and (orientation: portrait){.assessment-text-medium-18,.assessment-text-semibold-18{font-size:calc(1rem + .1vh)!important;line-height:calc(1.6rem + .1vh)!important}.assessment-text-medium-16,.assessment-text-semibold-16{font-size:calc(.9rem + .2vh)!important;line-height:calc(1.4rem + .2vh)!important}.assessment-text-regular-15,.assessment-text-semibold-15{font-size:calc(.8rem + .2vh);line-height:calc(1.27rem + .2vh)}.assessment-text-medium-15{font-size:calc(.82rem + .2vh);line-height:calc(1.27rem + .2vh)}.assessment-text-medium-12,.assessment-text-regular-12,.assessment-text-semibold-12{font-size:calc(.5rem + .4vh);line-height:calc(.8rem + .4vh)}.assessment-text-medium-14,.assessment-text-semibold-14{font-size:calc(.8rem + .1vh)!important;line-height:calc(1.2rem + .2vh)!important}.assessment-text-regular-13,.assessment-text-medium-13,.assessment-text-semibold-13{font-size:calc(.7rem + .2vh)!important;line-height:calc(1rem + .3vh)!important}.assessment-text-regular-11,.assessment-text-medium-11{font-size:calc(.5rem + .2vh)!important;line-height:calc(.8rem + .2vh)!important}.assessment-text-medium-10{font-size:calc(.45rem + .2vh)!important;line-height:calc(.72rem + .2vh)!important}}.assessment-btn-primary{background-color:var(--assessment-primary-one);color:var(--assessment-white);border:.064rem solid var(--assessment-primary-one);border-radius:var(--assessment-border-radius-two)}.assessment-btn-primary-transparent{background-color:var(--assessment-white);color:var(--assessment-primary-one);border-radius:var(--assessment-border-radius-two);border:.064rem solid var(--assessment-primary-one)}.assessment-zoom-animation{transition:transform .2s ease;transform:translateZ(0);text-rendering:optimizeLegibility}.assessment-zoom-animation:hover{transform:scale(1.03)}.assessment-zoom-animation:active{transform:scale(1)}.assessment-zoom-animation:disabled{transform:none!important}.change-direction{transform:rotate(180deg);transition:.3s ease-out}.change-direction-reverse{transform:rotate(0);transition:.3s ease-out}.outline-0{outline:none}.cursor-grab{cursor:grab}.cursor-pointer{cursor:pointer}.action-icon{width:1.2rem}.mat-menu-item,.mat-mdc-menu-item{height:inherit;min-height:unset;--mat-menu-item-label-text-font: var(--assessment-font-family) !important;--mat-menu-item-label-text-size: 14px !important;--mat-menu-item-label-text-weight: 600 !important;--mat-menu-item-label-text-line-height: inherit !important}.skill-chip{width:-moz-fit-content;width:fit-content;background:var(--assessment-palette-EDF3FD);border:.064rem solid var(--assessment-palette-C8DAF9)}.assessment-form-check-input-primary-one{min-height:unset}.assessment-form-check-input-primary-one .form-check-input{width:1rem;height:1rem}.assessment-form-check-input-primary-one .form-check-input:checked{background-color:var(--assessment-primary-one);color:var(--assessment-primary-one)}.assessment-form-check-input-primary-one .form-check-input:disabled{opacity:.8}.form-check-input:checked{background-color:var(--assessment-primary-one);border-color:var(--assessment-primary-one)}.form-check-input:focus{border-color:var(--assessment-primary-one);box-shadow:none}.input-focus{overflow:hidden;text-overflow:ellipsis}.input-focus:focus-visible{border-bottom:var(--assessment-input-focus-border)!important}.height-without-footer{height:calc(100% - 4.4rem)!important}.question-container{transition:all .3s ease}.question-container:hover{box-shadow:var(--assessment-box-shadow-one);background-color:var(--assessment-palette-EDF3FD);border-color:var(--assessment-palette-C8DAF9)!important}.border-ADC9F6{border:.064rem solid var(--assessment-palette-ADC9F6)}\n"], components: [{ type: i3__namespace.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { type: i3__namespace.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["tabIndex", "expandedHeight", "collapsedHeight"] }, { type: i1__namespace$3.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i1__namespace$3.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { type: QuestionDetailsComponent, selector: "lib-question-details", inputs: ["sectionQuestion", "question", "questionBank", "labelConfig", "imageConfig", "allowDelete", "isLocked"], outputs: ["editQuestion", "duplicateQuestion", "deleteParentQuestion", "deleteChildQuestion"] }, { type: i10__namespace.MatSpinner, selector: "mat-spinner", inputs: ["color"] }], directives: [{ type: i2__namespace$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { type: i1__namespace$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { type: i1__namespace$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: i1__namespace$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i1__namespace$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i1__namespace$2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { type: i3__namespace.MatAccordion, selector: "mat-accordion", inputs: ["multi", "displayMode", "togglePosition", "hideToggle"], exportAs: ["matAccordion"] }, { type: i10__namespace$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i2__namespace$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10__namespace$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i10__namespace$2.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { type: i2__namespace$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1__namespace$3.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }] });
|
|
6248
6271
|
i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AssessmentMakerComponent, decorators: [{
|
|
6249
6272
|
type: i0.Component,
|
|
6250
6273
|
args: [{
|
|
@@ -6366,7 +6389,7 @@
|
|
|
6366
6389
|
this.searchTerm = '';
|
|
6367
6390
|
this.selectedTypeCode = '';
|
|
6368
6391
|
this.currentPage = 0;
|
|
6369
|
-
this.pageSize =
|
|
6392
|
+
this.pageSize = 100;
|
|
6370
6393
|
this.totalElements = 0;
|
|
6371
6394
|
this.hasNext = false;
|
|
6372
6395
|
this.isLoadingMore = false;
|