@cuby-ui/core 0.0.233 → 0.0.234

package/fesm2022/cuby-ui-core.mjs

@@ -7942,6 +7942,9 @@ class CuiUtilityInfoComponent {
         this.form.valueChanges
             .pipe(takeUntilDestroyed(this.destroy), startWith(this.form.value), pairwise(), debounceTime(this.CONTROL_DELAY), map(([prev, current]) => this.compareFormValues([prev, current])))
             .subscribe((value) => {
+            if (!Object.keys(value).length) {
+                return;
+            }
             this.formChanged.emit(value);
         });
     }
@@ -7967,7 +7970,7 @@ class CuiUtilityInfoComponent {
         keys.forEach((key) => {
             const prev = prevGroup[key];
             const current = currentGruop[key];
-            if (prev === current) {
+            if (prev === current || this.controls[key].invalid) {
                 return;
             }
             changedFields[key] = current;
@@ -8043,11 +8046,10 @@ class CuiUtilityInfoComponent {
         video.load();
     }
     checkFormValidation() {
-        console.log(this.isDescriptionEmpty(), this.form.invalid);
         return !this.isDescriptionEmpty() && !this.form.invalid;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiUtilityInfoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: CuiUtilityInfoComponent, isStandalone: true, selector: "cui-utility-info", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, framerId: { classPropertyName: "framerId", publicName: "framerId", isSignal: true, isRequired: true, transformFunction: null }, baseResourceUrl: { classPropertyName: "baseResourceUrl", publicName: "baseResourceUrl", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { formChanged: "formChanged", isFormValidChanged: "isFormValidChanged" }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\r\n  <section class=\"content\">\r\n    <cui-form-field>\r\n        <label cuiLabel [isRequired]=\"true\" [for]=\"titleId\">\r\n            {{ t('TITLE') }}\r\n        </label>\r\n        <cui-input-text\r\n            [cuiTextFieldId]=\"titleId\"\r\n            [cuiTextFieldPlaceholder]=\"t('ADD_TITLE')\"\r\n            [cuiTextFieldIsError]=\"isTitleError\"\r\n            [formControl]=\"form.controls.title\"\r\n        />\r\n        @if (isTitleError) {\r\n            <cui-general-control-error-hint [control]=\"form.controls.title\" [isVisible]=\"true\" />\r\n        }\r\n    </cui-form-field>\r\n    <cui-form-field>\r\n        <label cuiLabel [isRequired]=\"true\" [for]=\"descriptionId\">\r\n            {{ t('SHORT_DESCRIPTION') }}\r\n        </label>\r\n         <cui-input-text\r\n            [cuiTextFieldId]=\"descriptionId\"\r\n            cuiTextFieldPlaceholder=\"{{t('SHORT_DESCRIPTION')}}...\"\r\n            [cuiTextFieldIsError]=\"isDescriptionError\"\r\n            [formControl]=\"form.controls.description\"\r\n        />\r\n        @if (isDescriptionError) {\r\n            <cui-general-control-error-hint [control]=\"form.controls.description\" [isVisible]=\"true\" />\r\n        }\r\n    </cui-form-field>\r\n    <section class=\"file\">\r\n      <span class=\"title\">{{ t('THUMBNAIL') }}</span>\r\n      <div class=\"content__upload\">\r\n        <div class=\"content__upload-file\">\r\n          @if (thumbnail()?.name; as fileId) {\r\n          <div class=\"image\">\r\n            <span class=\"image__name\">{{ thumbnail()?.name }}</span>\r\n            <!-- TODO: ngSrc -->\r\n            <img class=\"image__view\" [src]=\"thumbnailUrl()\" height=\"120\" width=\"184\" alt=\"Thumbnail\" />\r\n          </div>\r\n          }\r\n          <button type=\"button\" cuiButton appearance=\"outlined-gray\" size=\"xxs\" icon=\"cuiIconUpload\"\r\n            (click)=\"onSelectFile()\">\r\n            {{ uploadButtonName() }}\r\n          </button>\r\n          @if (thumbnail()?.name) {\r\n          <button class=\"content__remove-button\" cuiButton appearance=\"link\" size=\"sm\" type=\"button\"\r\n            (click)=\"onRemoveThumbnail()\">\r\n            {{ t('REMOVE') }}\r\n          </button>\r\n          }\r\n          <span class=\"content__accepted\">\r\n            {{ t('ACCEPTED') }}: JPG, JPEG, PNG, MP4 {{ t('UP_TO') }} 20MB\r\n          </span>\r\n        </div>\r\n      </div>\r\n    </section>\r\n    @if (editorId(); as editorId) {\r\n        <cui-editor-block\r\n            [title]=\"form.controls.title.value || title()\"\r\n            [config]=\"config()\"\r\n            [editorId]=\"editorId\"\r\n            [required]=\"true\"\r\n            (editorEmpty)=\"onEditorEmpty($event)\"\r\n        ></cui-editor-block>\r\n    }\r\n  </section>\r\n</ng-container>\r\n", styles: ["::ng-deep cui-dialog:has(.instruction-description-modal){inset:0;margin:auto;transform:none!important}:host{display:block}.title{font-weight:500;font-size:14px;line-height:20px;display:flex;gap:2px}.title_required{color:var(--cui-danger)}.content{display:flex;flex-direction:column;gap:16px;padding:16px 24px}.content__upload{padding:12px 16px;border-radius:8px;border:1px solid var(--cui-base-200);background:var(--cui-base-10)}.content__accepted{color:var(--cui-base-500)}.content__upload-file{display:flex;align-items:center;gap:8px}.content__upload-file input[type=file]{display:none}.content__remove-button ::ng-deep .c-content{color:var(--cui-danger)!important}.file{display:flex;flex-direction:column;gap:4px}.description_invalid{border:1px solid var(--cui-danger)}.image{position:relative;display:inline-block}.image__view{border-radius:8px;object-fit:cover}.image__name{position:absolute;top:6px;left:14px;color:var(--cui-base-0);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:170px;z-index:1}.image:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#0003;z-index:0;pointer-events:none;border-radius:8px}.button-save{margin-left:auto}.instruction-description-modal{text-transform:none}.empty{padding:16px;color:var(--cui-base-500);text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => CuiAccordionModule) }, { kind: "ngmodule", type: i0.forwardRef(() => CuiButtonModule) }, { kind: "component", type: i0.forwardRef(() => CuiButtonComponent), selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "size"] }, { kind: "ngmodule", type: i0.forwardRef(() => CuiFormFieldModule) }, { kind: "component", type: i0.forwardRef(() => CuiFormFieldComponent), selector: "cui-form-field" }, { kind: "ngmodule", type: i0.forwardRef(() => CuiHintModule) }, { kind: "ngmodule", type: i0.forwardRef(() => CuiInputModule) }, { kind: "component", type: i0.forwardRef(() => CuiInputTextComponent), selector: "cui-input-text" }, { kind: "directive", type: i0.forwardRef(() => CuiTextFieldIdDirective), selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: i0.forwardRef(() => CuiTextFieldPlaceholderDirective), selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: i0.forwardRef(() => CuiTextFieldIsErrorDirective), selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: i0.forwardRef(() => CuiLabelModule) }, { kind: "component", type: i0.forwardRef(() => CuiLabelComponent), selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "component", type: i0.forwardRef(() => CuiEditorBlockComponent), selector: "cui-editor-block", inputs: ["title", "editorId", "config", "required"], outputs: ["editorEmpty"] }, { kind: "component", type: i0.forwardRef(() => CuiGeneralControlErrorHintComponent), selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }, { kind: "ngmodule", type: i0.forwardRef(() => ReactiveFormsModule) }, { kind: "directive", type: i0.forwardRef(() => i2$1.NgControlStatus), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(() => i2$1.FormControlDirective), selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i0.forwardRef(() => TranslocoDirective), selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: CuiUtilityInfoComponent, isStandalone: true, selector: "cui-utility-info", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, framerId: { classPropertyName: "framerId", publicName: "framerId", isSignal: true, isRequired: true, transformFunction: null }, baseResourceUrl: { classPropertyName: "baseResourceUrl", publicName: "baseResourceUrl", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { formChanged: "formChanged", isFormValidChanged: "isFormValidChanged" }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\r\n  <section class=\"content\">\r\n    <cui-form-field>\r\n        <label cuiLabel [isRequired]=\"true\" [for]=\"titleId\">\r\n            {{ t('TITLE') }}\r\n        </label>\r\n        <cui-input-text\r\n            [cuiTextFieldId]=\"titleId\"\r\n            [cuiTextFieldPlaceholder]=\"t('ADD_TITLE')\"\r\n            [cuiTextFieldIsError]=\"isTitleError\"\r\n            [formControl]=\"form.controls.title\"\r\n        />\r\n        @if (isTitleError) {\r\n            <cui-general-control-error-hint [control]=\"form.controls.title\" [isVisible]=\"true\" />\r\n        }\r\n    </cui-form-field>\r\n    <cui-form-field>\r\n        <label cuiLabel [isRequired]=\"true\" [for]=\"descriptionId\">\r\n            {{ t('SHORT_DESCRIPTION') }}\r\n        </label>\r\n         <cui-input-text\r\n            [cuiTextFieldId]=\"descriptionId\"\r\n            cuiTextFieldPlaceholder=\"{{t('SHORT_DESCRIPTION')}}...\"\r\n            [cuiTextFieldIsError]=\"isDescriptionError\"\r\n            [formControl]=\"form.controls.description\"\r\n        />\r\n        @if (isDescriptionError) {\r\n            <cui-general-control-error-hint [control]=\"form.controls.description\" [isVisible]=\"true\" />\r\n        }\r\n    </cui-form-field>\r\n    <section class=\"file\">\r\n      <span class=\"title\">{{ t('THUMBNAIL') }}</span>\r\n      <div class=\"content__upload\">\r\n        <div class=\"content__upload-file\">\r\n          @if (thumbnail()?.name; as fileId) {\r\n          <div class=\"image\">\r\n            <span class=\"image__name\">{{ thumbnail()?.name }}</span>\r\n            <!-- TODO: ngSrc -->\r\n            <img class=\"image__view\" [src]=\"thumbnailUrl()\" height=\"120\" width=\"184\" alt=\"Thumbnail\" />\r\n          </div>\r\n          }\r\n          <div class=\"content__info\">\r\n                <button type=\"button\" cuiButton appearance=\"outlined-gray\" size=\"xxs\" icon=\"cuiIconUpload\"\r\n                (click)=\"onSelectFile()\">\r\n                {{ uploadButtonName() }}\r\n                </button>\r\n                @if (thumbnail()?.name) {\r\n                <button class=\"content__remove-button\" cuiButton appearance=\"link\" size=\"sm\" type=\"button\"\r\n                    (click)=\"onRemoveThumbnail()\">\r\n                    {{ t('REMOVE') }}\r\n                </button>\r\n                }\r\n\r\n                <span class=\"content__accepted\">\r\n                    {{ t('ACCEPTED') }}: JPG, JPEG, PNG, MP4 {{ t('UP_TO') }} 20MB\r\n                </span>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </section>\r\n    @if (editorId(); as editorId) {\r\n        <cui-editor-block\r\n            [title]=\"form.controls.title.value || title()\"\r\n            [config]=\"config()\"\r\n            [editorId]=\"editorId\"\r\n            [required]=\"true\"\r\n            (editorEmpty)=\"onEditorEmpty($event)\"\r\n        ></cui-editor-block>\r\n    }\r\n  </section>\r\n</ng-container>\r\n", styles: ["::ng-deep cui-dialog:has(.instruction-description-modal){inset:0;margin:auto;transform:none!important}:host{display:block}.title{font-weight:500;font-size:14px;line-height:20px;display:flex;gap:2px}.title_required{color:var(--cui-danger)}.content{display:flex;flex-direction:column;gap:16px;padding:16px 24px}.content__upload{padding:12px 16px;border-radius:8px;border:1px solid var(--cui-base-200);background:var(--cui-base-10)}.content__info{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.content__accepted{color:var(--cui-base-500)}.content__upload-file{display:flex;align-items:center;gap:8px}.content__upload-file input[type=file]{display:none}.content__remove-button ::ng-deep .c-content{color:var(--cui-danger)!important}.file{display:flex;flex-direction:column;gap:4px}.description_invalid{border:1px solid var(--cui-danger)}.image{position:relative;display:inline-block}.image__view{border-radius:8px;object-fit:cover}.image__name{position:absolute;top:6px;left:14px;color:var(--cui-base-0);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:170px;z-index:1}.image:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#0003;z-index:0;pointer-events:none;border-radius:8px}.button-save{margin-left:auto}.instruction-description-modal{text-transform:none}.empty{padding:16px;color:var(--cui-base-500);text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: i0.forwardRef(() => CuiAccordionModule) }, { kind: "ngmodule", type: i0.forwardRef(() => CuiButtonModule) }, { kind: "component", type: i0.forwardRef(() => CuiButtonComponent), selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "size"] }, { kind: "ngmodule", type: i0.forwardRef(() => CuiFormFieldModule) }, { kind: "component", type: i0.forwardRef(() => CuiFormFieldComponent), selector: "cui-form-field" }, { kind: "ngmodule", type: i0.forwardRef(() => CuiHintModule) }, { kind: "ngmodule", type: i0.forwardRef(() => CuiInputModule) }, { kind: "component", type: i0.forwardRef(() => CuiInputTextComponent), selector: "cui-input-text" }, { kind: "directive", type: i0.forwardRef(() => CuiTextFieldIdDirective), selector: "[cuiTextFieldId]", inputs: ["cuiTextFieldId"] }, { kind: "directive", type: i0.forwardRef(() => CuiTextFieldPlaceholderDirective), selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: i0.forwardRef(() => CuiTextFieldIsErrorDirective), selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "ngmodule", type: i0.forwardRef(() => CuiLabelModule) }, { kind: "component", type: i0.forwardRef(() => CuiLabelComponent), selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "component", type: i0.forwardRef(() => CuiEditorBlockComponent), selector: "cui-editor-block", inputs: ["title", "editorId", "config", "required"], outputs: ["editorEmpty"] }, { kind: "component", type: i0.forwardRef(() => CuiGeneralControlErrorHintComponent), selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }, { kind: "ngmodule", type: i0.forwardRef(() => ReactiveFormsModule) }, { kind: "directive", type: i0.forwardRef(() => i2$1.NgControlStatus), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(() => i2$1.FormControlDirective), selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i0.forwardRef(() => TranslocoDirective), selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiUtilityInfoComponent, decorators: [{
             type: Component,
@@ -8063,7 +8065,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         ReactiveFormsModule,
                         TranslocoDirective,
                         CuiTooltip
-                    ], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *transloco=\"let t\">\r\n  <section class=\"content\">\r\n    <cui-form-field>\r\n        <label cuiLabel [isRequired]=\"true\" [for]=\"titleId\">\r\n            {{ t('TITLE') }}\r\n        </label>\r\n        <cui-input-text\r\n            [cuiTextFieldId]=\"titleId\"\r\n            [cuiTextFieldPlaceholder]=\"t('ADD_TITLE')\"\r\n            [cuiTextFieldIsError]=\"isTitleError\"\r\n            [formControl]=\"form.controls.title\"\r\n        />\r\n        @if (isTitleError) {\r\n            <cui-general-control-error-hint [control]=\"form.controls.title\" [isVisible]=\"true\" />\r\n        }\r\n    </cui-form-field>\r\n    <cui-form-field>\r\n        <label cuiLabel [isRequired]=\"true\" [for]=\"descriptionId\">\r\n            {{ t('SHORT_DESCRIPTION') }}\r\n        </label>\r\n         <cui-input-text\r\n            [cuiTextFieldId]=\"descriptionId\"\r\n            cuiTextFieldPlaceholder=\"{{t('SHORT_DESCRIPTION')}}...\"\r\n            [cuiTextFieldIsError]=\"isDescriptionError\"\r\n            [formControl]=\"form.controls.description\"\r\n        />\r\n        @if (isDescriptionError) {\r\n            <cui-general-control-error-hint [control]=\"form.controls.description\" [isVisible]=\"true\" />\r\n        }\r\n    </cui-form-field>\r\n    <section class=\"file\">\r\n      <span class=\"title\">{{ t('THUMBNAIL') }}</span>\r\n      <div class=\"content__upload\">\r\n        <div class=\"content__upload-file\">\r\n          @if (thumbnail()?.name; as fileId) {\r\n          <div class=\"image\">\r\n            <span class=\"image__name\">{{ thumbnail()?.name }}</span>\r\n            <!-- TODO: ngSrc -->\r\n            <img class=\"image__view\" [src]=\"thumbnailUrl()\" height=\"120\" width=\"184\" alt=\"Thumbnail\" />\r\n          </div>\r\n          }\r\n          <button type=\"button\" cuiButton appearance=\"outlined-gray\" size=\"xxs\" icon=\"cuiIconUpload\"\r\n            (click)=\"onSelectFile()\">\r\n            {{ uploadButtonName() }}\r\n          </button>\r\n          @if (thumbnail()?.name) {\r\n          <button class=\"content__remove-button\" cuiButton appearance=\"link\" size=\"sm\" type=\"button\"\r\n            (click)=\"onRemoveThumbnail()\">\r\n            {{ t('REMOVE') }}\r\n          </button>\r\n          }\r\n          <span class=\"content__accepted\">\r\n            {{ t('ACCEPTED') }}: JPG, JPEG, PNG, MP4 {{ t('UP_TO') }} 20MB\r\n          </span>\r\n        </div>\r\n      </div>\r\n    </section>\r\n    @if (editorId(); as editorId) {\r\n        <cui-editor-block\r\n            [title]=\"form.controls.title.value || title()\"\r\n            [config]=\"config()\"\r\n            [editorId]=\"editorId\"\r\n            [required]=\"true\"\r\n            (editorEmpty)=\"onEditorEmpty($event)\"\r\n        ></cui-editor-block>\r\n    }\r\n  </section>\r\n</ng-container>\r\n", styles: ["::ng-deep cui-dialog:has(.instruction-description-modal){inset:0;margin:auto;transform:none!important}:host{display:block}.title{font-weight:500;font-size:14px;line-height:20px;display:flex;gap:2px}.title_required{color:var(--cui-danger)}.content{display:flex;flex-direction:column;gap:16px;padding:16px 24px}.content__upload{padding:12px 16px;border-radius:8px;border:1px solid var(--cui-base-200);background:var(--cui-base-10)}.content__accepted{color:var(--cui-base-500)}.content__upload-file{display:flex;align-items:center;gap:8px}.content__upload-file input[type=file]{display:none}.content__remove-button ::ng-deep .c-content{color:var(--cui-danger)!important}.file{display:flex;flex-direction:column;gap:4px}.description_invalid{border:1px solid var(--cui-danger)}.image{position:relative;display:inline-block}.image__view{border-radius:8px;object-fit:cover}.image__name{position:absolute;top:6px;left:14px;color:var(--cui-base-0);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:170px;z-index:1}.image:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#0003;z-index:0;pointer-events:none;border-radius:8px}.button-save{margin-left:auto}.instruction-description-modal{text-transform:none}.empty{padding:16px;color:var(--cui-base-500);text-align:center}\n"] }]
+                    ], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *transloco=\"let t\">\r\n  <section class=\"content\">\r\n    <cui-form-field>\r\n        <label cuiLabel [isRequired]=\"true\" [for]=\"titleId\">\r\n            {{ t('TITLE') }}\r\n        </label>\r\n        <cui-input-text\r\n            [cuiTextFieldId]=\"titleId\"\r\n            [cuiTextFieldPlaceholder]=\"t('ADD_TITLE')\"\r\n            [cuiTextFieldIsError]=\"isTitleError\"\r\n            [formControl]=\"form.controls.title\"\r\n        />\r\n        @if (isTitleError) {\r\n            <cui-general-control-error-hint [control]=\"form.controls.title\" [isVisible]=\"true\" />\r\n        }\r\n    </cui-form-field>\r\n    <cui-form-field>\r\n        <label cuiLabel [isRequired]=\"true\" [for]=\"descriptionId\">\r\n            {{ t('SHORT_DESCRIPTION') }}\r\n        </label>\r\n         <cui-input-text\r\n            [cuiTextFieldId]=\"descriptionId\"\r\n            cuiTextFieldPlaceholder=\"{{t('SHORT_DESCRIPTION')}}...\"\r\n            [cuiTextFieldIsError]=\"isDescriptionError\"\r\n            [formControl]=\"form.controls.description\"\r\n        />\r\n        @if (isDescriptionError) {\r\n            <cui-general-control-error-hint [control]=\"form.controls.description\" [isVisible]=\"true\" />\r\n        }\r\n    </cui-form-field>\r\n    <section class=\"file\">\r\n      <span class=\"title\">{{ t('THUMBNAIL') }}</span>\r\n      <div class=\"content__upload\">\r\n        <div class=\"content__upload-file\">\r\n          @if (thumbnail()?.name; as fileId) {\r\n          <div class=\"image\">\r\n            <span class=\"image__name\">{{ thumbnail()?.name }}</span>\r\n            <!-- TODO: ngSrc -->\r\n            <img class=\"image__view\" [src]=\"thumbnailUrl()\" height=\"120\" width=\"184\" alt=\"Thumbnail\" />\r\n          </div>\r\n          }\r\n          <div class=\"content__info\">\r\n                <button type=\"button\" cuiButton appearance=\"outlined-gray\" size=\"xxs\" icon=\"cuiIconUpload\"\r\n                (click)=\"onSelectFile()\">\r\n                {{ uploadButtonName() }}\r\n                </button>\r\n                @if (thumbnail()?.name) {\r\n                <button class=\"content__remove-button\" cuiButton appearance=\"link\" size=\"sm\" type=\"button\"\r\n                    (click)=\"onRemoveThumbnail()\">\r\n                    {{ t('REMOVE') }}\r\n                </button>\r\n                }\r\n\r\n                <span class=\"content__accepted\">\r\n                    {{ t('ACCEPTED') }}: JPG, JPEG, PNG, MP4 {{ t('UP_TO') }} 20MB\r\n                </span>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </section>\r\n    @if (editorId(); as editorId) {\r\n        <cui-editor-block\r\n            [title]=\"form.controls.title.value || title()\"\r\n            [config]=\"config()\"\r\n            [editorId]=\"editorId\"\r\n            [required]=\"true\"\r\n            (editorEmpty)=\"onEditorEmpty($event)\"\r\n        ></cui-editor-block>\r\n    }\r\n  </section>\r\n</ng-container>\r\n", styles: ["::ng-deep cui-dialog:has(.instruction-description-modal){inset:0;margin:auto;transform:none!important}:host{display:block}.title{font-weight:500;font-size:14px;line-height:20px;display:flex;gap:2px}.title_required{color:var(--cui-danger)}.content{display:flex;flex-direction:column;gap:16px;padding:16px 24px}.content__upload{padding:12px 16px;border-radius:8px;border:1px solid var(--cui-base-200);background:var(--cui-base-10)}.content__info{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.content__accepted{color:var(--cui-base-500)}.content__upload-file{display:flex;align-items:center;gap:8px}.content__upload-file input[type=file]{display:none}.content__remove-button ::ng-deep .c-content{color:var(--cui-danger)!important}.file{display:flex;flex-direction:column;gap:4px}.description_invalid{border:1px solid var(--cui-danger)}.image{position:relative;display:inline-block}.image__view{border-radius:8px;object-fit:cover}.image__name{position:absolute;top:6px;left:14px;color:var(--cui-base-0);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:170px;z-index:1}.image:after{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;background-color:#0003;z-index:0;pointer-events:none;border-radius:8px}.button-save{margin-left:auto}.instruction-description-modal{text-transform:none}.empty{padding:16px;color:var(--cui-base-500);text-align:center}\n"] }]
         }], ctorParameters: () => [] });
 
 class CuiCheckListBlockService {
@@ -8217,7 +8219,7 @@ class CuiCheckListBlockListItemActionCardComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiCheckListBlockListItemActionCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: CuiCheckListBlockListItemActionCardComponent, isStandalone: true, selector: "cui-checklist-block-list-item-action-card", inputs: { purposeType: { classPropertyName: "purposeType", publicName: "purposeType", isSignal: true, isRequired: false, transformFunction: null }, isConsiderationNeeded: { classPropertyName: "isConsiderationNeeded", publicName: "isConsiderationNeeded", isSignal: true, isRequired: false, transformFunction: null }, actionInfo: { classPropertyName: "actionInfo", publicName: "actionInfo", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { consideredCorrectChanged: "consideredCorrectChanged", checkListActionChanged: "checkListActionChanged" }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\r\n    <div\r\n        class=\"card\"\r\n        [formGroup]=\"actionForm\"\r\n    >\r\n        <div class=\"title-container\">\r\n            <span class=\"title\">{{ actionInfo().title }}</span>\r\n            @if (isConsiderationNeeded()) {\r\n                <label\r\n                    cuiLabel\r\n                    class=\"title__input\"\r\n                >\r\n                    <input\r\n                        cuiRadio\r\n                        type=\"radio\"\r\n                        [checked]=\"actionInfo().considerCorrect\"\r\n                        [formControl]=\"isConsideredCorrectControl\"\r\n                        [value]=\"true\"\r\n                    />\r\n                    {{ t('CONSIDER_CORRECT') }}\r\n                </label>\r\n            }\r\n        </div>\r\n        <div class=\"blocks\">\r\n            <div\r\n                class=\"block-card\"\r\n                [formGroup]=\"photoGroup\"\r\n            >\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiCheckbox\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isEnable\"\r\n                    />\r\n                    {{ t('PHOTO') }}\r\n                </label>\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiToggle\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isRequired\"\r\n                    />\r\n                    {{ t('REQUIRED') }}\r\n                </label>\r\n            </div>\r\n            <div\r\n                class=\"block-card\"\r\n                [formGroup]=\"commentGroup\"\r\n            >\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiCheckbox\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isEnable\"\r\n                    />\r\n                    {{ t('COMMENT') }}\r\n                </label>\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiToggle\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isRequired\"\r\n                    />\r\n                    {{ t('REQUIRED') }}\r\n                </label>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</ng-container>\r\n", styles: [":host{flex:1}.card{padding:11px;display:flex;flex-direction:column;gap:10px;border:1px solid var(--cui-base-200);border-radius:8px}.title-container{display:flex;flex-direction:row;gap:8px;justify-content:space-between;align-items:center}.title{font-weight:500;font-size:14px;line-height:20px}.title__input{font-weight:400;font-size:14px;line-height:20px}.blocks{display:flex;flex-direction:column;gap:8px}.block-card{padding:13px 11px;display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px}.block-card_multiple-lines{flex-direction:column;align-items:unset}.block-card__checkboxes-container{padding:13px 8px;display:flex;gap:12px}\n"], dependencies: [{ kind: "ngmodule", type: CuiCheckboxModule }, { kind: "component", type: CuiCheckboxComponent, selector: "input[type=\"checkbox\"][cuiCheckbox]" }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "ngmodule", type: CuiRadioModule }, { kind: "component", type: CuiRadioComponent, selector: "input[type=\"radio\"][cuiRadio]" }, { kind: "ngmodule", type: CuiSelectModule }, { kind: "ngmodule", type: CuiTextareaModule }, { kind: "ngmodule", type: CuiTextFieldControllerModule }, { kind: "ngmodule", type: CuiToggleModule }, { kind: "component", type: CuiToggleComponent, selector: "input[type=\"checkbox\"][cuiToggle]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: CuiCheckListBlockListItemActionCardComponent, isStandalone: true, selector: "cui-checklist-block-list-item-action-card", inputs: { purposeType: { classPropertyName: "purposeType", publicName: "purposeType", isSignal: true, isRequired: false, transformFunction: null }, isConsiderationNeeded: { classPropertyName: "isConsiderationNeeded", publicName: "isConsiderationNeeded", isSignal: true, isRequired: false, transformFunction: null }, actionInfo: { classPropertyName: "actionInfo", publicName: "actionInfo", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { consideredCorrectChanged: "consideredCorrectChanged", checkListActionChanged: "checkListActionChanged" }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\r\n    <div\r\n        class=\"card\"\r\n        [formGroup]=\"actionForm\"\r\n    >\r\n        <div class=\"title-container\">\r\n            <span class=\"title\">{{ actionInfo().title }}</span>\r\n            @if (isConsiderationNeeded()) {\r\n                <label\r\n                    cuiLabel\r\n                    class=\"title__input\"\r\n                >\r\n                    <input\r\n                        cuiRadio\r\n                        type=\"radio\"\r\n                        [checked]=\"actionInfo().considerCorrect\"\r\n                        [formControl]=\"isConsideredCorrectControl\"\r\n                        [value]=\"true\"\r\n                    />\r\n                    {{ t('CONSIDER_CORRECT') }}\r\n                </label>\r\n            }\r\n        </div>\r\n        <div class=\"blocks\">\r\n            <div\r\n                class=\"block-card\"\r\n                [formGroup]=\"photoGroup\"\r\n            >\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiCheckbox\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isEnable\"\r\n                    />\r\n                    {{ t('PHOTO') }}\r\n                </label>\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiToggle\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isRequired\"\r\n                    />\r\n                    {{ t('REQUIRED') }}\r\n                </label>\r\n            </div>\r\n            <div\r\n                class=\"block-card\"\r\n                [formGroup]=\"commentGroup\"\r\n            >\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiCheckbox\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isEnable\"\r\n                    />\r\n                    {{ t('COMMENT') }}\r\n                </label>\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiToggle\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isRequired\"\r\n                    />\r\n                    {{ t('REQUIRED') }}\r\n                </label>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</ng-container>\r\n", styles: [":host{flex:1 1 240px;min-width:240px}.card{padding:11px;display:flex;flex-direction:column;gap:10px;border:1px solid var(--cui-base-200);border-radius:8px}.title-container{display:flex;flex-direction:row;gap:8px;justify-content:space-between;align-items:center}.title{font-weight:500;font-size:14px;line-height:20px}.title__input{font-weight:400;font-size:14px;line-height:20px}.blocks{display:flex;flex-direction:column;gap:8px}.block-card{padding:13px 11px;display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px}.block-card_multiple-lines{flex-direction:column;align-items:unset}.block-card__checkboxes-container{padding:13px 8px;display:flex;gap:12px}\n"], dependencies: [{ kind: "ngmodule", type: CuiCheckboxModule }, { kind: "component", type: CuiCheckboxComponent, selector: "input[type=\"checkbox\"][cuiCheckbox]" }, { kind: "ngmodule", type: CuiFormFieldModule }, { kind: "ngmodule", type: CuiLabelModule }, { kind: "component", type: CuiLabelComponent, selector: "label[cuiLabel]", inputs: ["isRequired"] }, { kind: "ngmodule", type: CuiRadioModule }, { kind: "component", type: CuiRadioComponent, selector: "input[type=\"radio\"][cuiRadio]" }, { kind: "ngmodule", type: CuiSelectModule }, { kind: "ngmodule", type: CuiTextareaModule }, { kind: "ngmodule", type: CuiTextFieldControllerModule }, { kind: "ngmodule", type: CuiToggleModule }, { kind: "component", type: CuiToggleComponent, selector: "input[type=\"checkbox\"][cuiToggle]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiCheckListBlockListItemActionCardComponent, decorators: [{
             type: Component,
@@ -8232,7 +8234,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         CuiToggleModule,
                         ReactiveFormsModule,
                         TranslocoDirective
-                    ], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *transloco=\"let t\">\r\n    <div\r\n        class=\"card\"\r\n        [formGroup]=\"actionForm\"\r\n    >\r\n        <div class=\"title-container\">\r\n            <span class=\"title\">{{ actionInfo().title }}</span>\r\n            @if (isConsiderationNeeded()) {\r\n                <label\r\n                    cuiLabel\r\n                    class=\"title__input\"\r\n                >\r\n                    <input\r\n                        cuiRadio\r\n                        type=\"radio\"\r\n                        [checked]=\"actionInfo().considerCorrect\"\r\n                        [formControl]=\"isConsideredCorrectControl\"\r\n                        [value]=\"true\"\r\n                    />\r\n                    {{ t('CONSIDER_CORRECT') }}\r\n                </label>\r\n            }\r\n        </div>\r\n        <div class=\"blocks\">\r\n            <div\r\n                class=\"block-card\"\r\n                [formGroup]=\"photoGroup\"\r\n            >\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiCheckbox\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isEnable\"\r\n                    />\r\n                    {{ t('PHOTO') }}\r\n                </label>\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiToggle\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isRequired\"\r\n                    />\r\n                    {{ t('REQUIRED') }}\r\n                </label>\r\n            </div>\r\n            <div\r\n                class=\"block-card\"\r\n                [formGroup]=\"commentGroup\"\r\n            >\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiCheckbox\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isEnable\"\r\n                    />\r\n                    {{ t('COMMENT') }}\r\n                </label>\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiToggle\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isRequired\"\r\n                    />\r\n                    {{ t('REQUIRED') }}\r\n                </label>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</ng-container>\r\n", styles: [":host{flex:1}.card{padding:11px;display:flex;flex-direction:column;gap:10px;border:1px solid var(--cui-base-200);border-radius:8px}.title-container{display:flex;flex-direction:row;gap:8px;justify-content:space-between;align-items:center}.title{font-weight:500;font-size:14px;line-height:20px}.title__input{font-weight:400;font-size:14px;line-height:20px}.blocks{display:flex;flex-direction:column;gap:8px}.block-card{padding:13px 11px;display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px}.block-card_multiple-lines{flex-direction:column;align-items:unset}.block-card__checkboxes-container{padding:13px 8px;display:flex;gap:12px}\n"] }]
+                    ], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *transloco=\"let t\">\r\n    <div\r\n        class=\"card\"\r\n        [formGroup]=\"actionForm\"\r\n    >\r\n        <div class=\"title-container\">\r\n            <span class=\"title\">{{ actionInfo().title }}</span>\r\n            @if (isConsiderationNeeded()) {\r\n                <label\r\n                    cuiLabel\r\n                    class=\"title__input\"\r\n                >\r\n                    <input\r\n                        cuiRadio\r\n                        type=\"radio\"\r\n                        [checked]=\"actionInfo().considerCorrect\"\r\n                        [formControl]=\"isConsideredCorrectControl\"\r\n                        [value]=\"true\"\r\n                    />\r\n                    {{ t('CONSIDER_CORRECT') }}\r\n                </label>\r\n            }\r\n        </div>\r\n        <div class=\"blocks\">\r\n            <div\r\n                class=\"block-card\"\r\n                [formGroup]=\"photoGroup\"\r\n            >\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiCheckbox\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isEnable\"\r\n                    />\r\n                    {{ t('PHOTO') }}\r\n                </label>\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiToggle\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isRequired\"\r\n                    />\r\n                    {{ t('REQUIRED') }}\r\n                </label>\r\n            </div>\r\n            <div\r\n                class=\"block-card\"\r\n                [formGroup]=\"commentGroup\"\r\n            >\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiCheckbox\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isEnable\"\r\n                    />\r\n                    {{ t('COMMENT') }}\r\n                </label>\r\n                <label cuiLabel>\r\n                    <input\r\n                        cuiToggle\r\n                        type=\"checkbox\"\r\n                        formControlName=\"isRequired\"\r\n                    />\r\n                    {{ t('REQUIRED') }}\r\n                </label>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</ng-container>\r\n", styles: [":host{flex:1 1 240px;min-width:240px}.card{padding:11px;display:flex;flex-direction:column;gap:10px;border:1px solid var(--cui-base-200);border-radius:8px}.title-container{display:flex;flex-direction:row;gap:8px;justify-content:space-between;align-items:center}.title{font-weight:500;font-size:14px;line-height:20px}.title__input{font-weight:400;font-size:14px;line-height:20px}.blocks{display:flex;flex-direction:column;gap:8px}.block-card{padding:13px 11px;display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid var(--cui-base-200);border-radius:8px}.block-card_multiple-lines{flex-direction:column;align-items:unset}.block-card__checkboxes-container{padding:13px 8px;display:flex;gap:12px}\n"] }]
         }], ctorParameters: () => [] });
 
 class CuiCheckListBlockListItemActionWithVerificationComponent {
@@ -8265,11 +8267,11 @@ class CuiCheckListBlockListItemActionWithVerificationComponent {
             .subscribe((checkListItem) => this.checkListBlockService.updateCheckListItem(checkListItem));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiCheckListBlockListItemActionWithVerificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: CuiCheckListBlockListItemActionWithVerificationComponent, isStandalone: true, selector: "cui-checklist-block-list-item-action-with-verification", inputs: { checkListItem: { classPropertyName: "checkListItem", publicName: "checkListItem", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\r\n    <ng-container *cuiLet=\"checkListItem().content as checkListItemContent\">\r\n        <div class=\"action\">\r\n            <div class=\"action__header action__assignee-header\">\r\n                {{ t('CONDITIONAL_LOGIC_FOR_ASSIGNEE') | uppercase }}\r\n            </div>\r\n            <div class=\"action__content\">\r\n                <div class=\"cards-container\">\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'ASSIGN'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![0]\"\r\n                        [isConsiderationNeeded]=\"true\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'ASSIGN')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![0].id, 'ASSIGN')\r\n                        \"\r\n                    />\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'ASSIGN'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![1]\"\r\n                        [isConsiderationNeeded]=\"true\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'ASSIGN')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![1].id, 'ASSIGN')\r\n                        \"\r\n                    />\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"action\">\r\n            <div class=\"action__header action__approver-header\">\r\n                {{ t('CONDITIONAL_LOGIC_FOR_APPROVER') | uppercase }}\r\n            </div>\r\n            <div class=\"action__content\">\r\n                <div class=\"cards-container\">\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'APPROVE'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsApprove![0]\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'APPROVE')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsApprove![0].id, 'APPROVE')\r\n                        \"\r\n                    />\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'APPROVE'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsApprove![1]\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'APPROVE')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsApprove![1].id, 'APPROVE')\r\n                        \"\r\n                    />\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</ng-container>\r\n", styles: [":host{padding-right:15px;padding-left:15px;padding-bottom:15px;display:flex;flex-direction:column;gap:16px;border-radius:inherit}.action{display:flex;flex-direction:column;border:1px solid var(--cui-base-200);border-radius:8px}.action__content{padding:15px;display:flex;flex-direction:column;border-radius:8px;background:var(--cui-base-0);gap:16px}.action__header{font-weight:400;font-size:12px;line-height:14px;padding:15px 19px 15.5px;display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--cui-base-900);border-bottom:.5px solid var(--cui-base-200);border-radius:8px 8px 0 0}.action__assignee-header{background:var(--cui-badge-warning-bg)}.action__approver-header{background:var(--cui-badge-violet-bg)}.action__estimated-time{display:flex;flex-direction:column;gap:4px}.action__input{padding:11px 13px;border-radius:8px;border:1px solid var(--cui-base-200);background:var(--cui-gray-10);outline:none}.action__input:focus-within{box-shadow:0 0 0 2px var(--cui-blue-100);border-color:var(--cui-blue-600)}.cards-container{display:flex;flex-direction:row;justify-items:center;gap:16px}\n"], dependencies: [{ kind: "component", type: CuiCheckListBlockListItemActionCardComponent, selector: "cui-checklist-block-list-item-action-card", inputs: ["purposeType", "isConsiderationNeeded", "actionInfo"], outputs: ["consideredCorrectChanged", "checkListActionChanged"] }, { kind: "directive", type: CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "pipe", type: UpperCasePipe, name: "uppercase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: CuiCheckListBlockListItemActionWithVerificationComponent, isStandalone: true, selector: "cui-checklist-block-list-item-action-with-verification", inputs: { checkListItem: { classPropertyName: "checkListItem", publicName: "checkListItem", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\r\n    <ng-container *cuiLet=\"checkListItem().content as checkListItemContent\">\r\n        <div class=\"action\">\r\n            <div class=\"action__header action__assignee-header\">\r\n                {{ t('CONDITIONAL_LOGIC_FOR_ASSIGNEE') | uppercase }}\r\n            </div>\r\n            <div class=\"action__content\">\r\n                <div class=\"cards-container\">\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'ASSIGN'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![0]\"\r\n                        [isConsiderationNeeded]=\"true\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'ASSIGN')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![0].id, 'ASSIGN')\r\n                        \"\r\n                    />\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'ASSIGN'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![1]\"\r\n                        [isConsiderationNeeded]=\"true\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'ASSIGN')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![1].id, 'ASSIGN')\r\n                        \"\r\n                    />\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"action\">\r\n            <div class=\"action__header action__approver-header\">\r\n                {{ t('CONDITIONAL_LOGIC_FOR_APPROVER') | uppercase }}\r\n            </div>\r\n            <div class=\"action__content\">\r\n                <div class=\"cards-container\">\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'APPROVE'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsApprove![0]\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'APPROVE')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsApprove![0].id, 'APPROVE')\r\n                        \"\r\n                    />\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'APPROVE'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsApprove![1]\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'APPROVE')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsApprove![1].id, 'APPROVE')\r\n                        \"\r\n                    />\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</ng-container>\r\n", styles: [":host{padding-right:15px;padding-left:15px;padding-bottom:15px;display:flex;flex-direction:column;gap:16px;border-radius:inherit}.action{display:flex;flex-direction:column;border:1px solid var(--cui-base-200);border-radius:8px}.action__content{padding:15px;display:flex;flex-direction:column;border-radius:8px;background:var(--cui-base-0);gap:16px}.action__header{font-weight:400;font-size:12px;line-height:14px;padding:15px 19px 15.5px;display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--cui-base-900);border-bottom:.5px solid var(--cui-base-200);border-radius:8px 8px 0 0}.action__assignee-header{background:var(--cui-badge-warning-bg)}.action__approver-header{background:var(--cui-badge-violet-bg)}.action__estimated-time{display:flex;flex-direction:column;gap:4px}.action__input{padding:11px 13px;border-radius:8px;border:1px solid var(--cui-base-200);background:var(--cui-gray-10);outline:none}.action__input:focus-within{box-shadow:0 0 0 2px var(--cui-blue-100);border-color:var(--cui-blue-600)}.cards-container{display:flex;flex-direction:row;flex-wrap:wrap;justify-items:center;gap:16px}\n"], dependencies: [{ kind: "component", type: CuiCheckListBlockListItemActionCardComponent, selector: "cui-checklist-block-list-item-action-card", inputs: ["purposeType", "isConsiderationNeeded", "actionInfo"], outputs: ["consideredCorrectChanged", "checkListActionChanged"] }, { kind: "directive", type: CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "pipe", type: UpperCasePipe, name: "uppercase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiCheckListBlockListItemActionWithVerificationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cui-checklist-block-list-item-action-with-verification', imports: [CuiCheckListBlockListItemActionCardComponent, CuiLetDirective, TranslocoDirective, UpperCasePipe], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *transloco=\"let t\">\r\n    <ng-container *cuiLet=\"checkListItem().content as checkListItemContent\">\r\n        <div class=\"action\">\r\n            <div class=\"action__header action__assignee-header\">\r\n                {{ t('CONDITIONAL_LOGIC_FOR_ASSIGNEE') | uppercase }}\r\n            </div>\r\n            <div class=\"action__content\">\r\n                <div class=\"cards-container\">\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'ASSIGN'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![0]\"\r\n                        [isConsiderationNeeded]=\"true\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'ASSIGN')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![0].id, 'ASSIGN')\r\n                        \"\r\n                    />\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'ASSIGN'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![1]\"\r\n                        [isConsiderationNeeded]=\"true\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'ASSIGN')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![1].id, 'ASSIGN')\r\n                        \"\r\n                    />\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"action\">\r\n            <div class=\"action__header action__approver-header\">\r\n                {{ t('CONDITIONAL_LOGIC_FOR_APPROVER') | uppercase }}\r\n            </div>\r\n            <div class=\"action__content\">\r\n                <div class=\"cards-container\">\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'APPROVE'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsApprove![0]\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'APPROVE')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsApprove![0].id, 'APPROVE')\r\n                        \"\r\n                    />\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'APPROVE'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsApprove![1]\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'APPROVE')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsApprove![1].id, 'APPROVE')\r\n                        \"\r\n                    />\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</ng-container>\r\n", styles: [":host{padding-right:15px;padding-left:15px;padding-bottom:15px;display:flex;flex-direction:column;gap:16px;border-radius:inherit}.action{display:flex;flex-direction:column;border:1px solid var(--cui-base-200);border-radius:8px}.action__content{padding:15px;display:flex;flex-direction:column;border-radius:8px;background:var(--cui-base-0);gap:16px}.action__header{font-weight:400;font-size:12px;line-height:14px;padding:15px 19px 15.5px;display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--cui-base-900);border-bottom:.5px solid var(--cui-base-200);border-radius:8px 8px 0 0}.action__assignee-header{background:var(--cui-badge-warning-bg)}.action__approver-header{background:var(--cui-badge-violet-bg)}.action__estimated-time{display:flex;flex-direction:column;gap:4px}.action__input{padding:11px 13px;border-radius:8px;border:1px solid var(--cui-base-200);background:var(--cui-gray-10);outline:none}.action__input:focus-within{box-shadow:0 0 0 2px var(--cui-blue-100);border-color:var(--cui-blue-600)}.cards-container{display:flex;flex-direction:row;justify-items:center;gap:16px}\n"] }]
+            args: [{ selector: 'cui-checklist-block-list-item-action-with-verification', imports: [CuiCheckListBlockListItemActionCardComponent, CuiLetDirective, TranslocoDirective, UpperCasePipe], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *transloco=\"let t\">\r\n    <ng-container *cuiLet=\"checkListItem().content as checkListItemContent\">\r\n        <div class=\"action\">\r\n            <div class=\"action__header action__assignee-header\">\r\n                {{ t('CONDITIONAL_LOGIC_FOR_ASSIGNEE') | uppercase }}\r\n            </div>\r\n            <div class=\"action__content\">\r\n                <div class=\"cards-container\">\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'ASSIGN'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![0]\"\r\n                        [isConsiderationNeeded]=\"true\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'ASSIGN')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![0].id, 'ASSIGN')\r\n                        \"\r\n                    />\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'ASSIGN'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![1]\"\r\n                        [isConsiderationNeeded]=\"true\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'ASSIGN')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![1].id, 'ASSIGN')\r\n                        \"\r\n                    />\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <div class=\"action\">\r\n            <div class=\"action__header action__approver-header\">\r\n                {{ t('CONDITIONAL_LOGIC_FOR_APPROVER') | uppercase }}\r\n            </div>\r\n            <div class=\"action__content\">\r\n                <div class=\"cards-container\">\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'APPROVE'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsApprove![0]\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'APPROVE')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsApprove![0].id, 'APPROVE')\r\n                        \"\r\n                    />\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [purposeType]=\"'APPROVE'\"\r\n                        [actionInfo]=\"checkListItemContent.actionsApprove![1]\"\r\n                        (consideredCorrectChanged)=\"onConsiderCorrectChanged($event, 'APPROVE')\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsApprove![1].id, 'APPROVE')\r\n                        \"\r\n                    />\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</ng-container>\r\n", styles: [":host{padding-right:15px;padding-left:15px;padding-bottom:15px;display:flex;flex-direction:column;gap:16px;border-radius:inherit}.action{display:flex;flex-direction:column;border:1px solid var(--cui-base-200);border-radius:8px}.action__content{padding:15px;display:flex;flex-direction:column;border-radius:8px;background:var(--cui-base-0);gap:16px}.action__header{font-weight:400;font-size:12px;line-height:14px;padding:15px 19px 15.5px;display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--cui-base-900);border-bottom:.5px solid var(--cui-base-200);border-radius:8px 8px 0 0}.action__assignee-header{background:var(--cui-badge-warning-bg)}.action__approver-header{background:var(--cui-badge-violet-bg)}.action__estimated-time{display:flex;flex-direction:column;gap:4px}.action__input{padding:11px 13px;border-radius:8px;border:1px solid var(--cui-base-200);background:var(--cui-gray-10);outline:none}.action__input:focus-within{box-shadow:0 0 0 2px var(--cui-blue-100);border-color:var(--cui-blue-600)}.cards-container{display:flex;flex-direction:row;flex-wrap:wrap;justify-items:center;gap:16px}\n"] }]
         }] });
 
 class CuiCheckListBlockListItemActionWithoutVerificationComponent {
@@ -8292,11 +8294,11 @@ class CuiCheckListBlockListItemActionWithoutVerificationComponent {
             .subscribe((checkListItem) => this.checkListBlockService.updateCheckListItem(checkListItem));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiCheckListBlockListItemActionWithoutVerificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: CuiCheckListBlockListItemActionWithoutVerificationComponent, isStandalone: true, selector: "cui-checklist-block-list-item-action-without-verification", inputs: { checkListItem: { classPropertyName: "checkListItem", publicName: "checkListItem", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\r\n    <ng-container *cuiLet=\"checkListItem().content as checkListItemContent\">\r\n        <div class=\"action\">\r\n            <div class=\"action__header\">\r\n                {{ t('CONDITIONAL_LOGIC') | uppercase }}\r\n            </div>\r\n            <div class=\"action__content\">\r\n                <div class=\"cards-container\">\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![0]\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![0].id)\r\n                        \"\r\n                    />\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![1]\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![1].id)\r\n                        \"\r\n                    />\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</ng-container>\r\n", styles: [":host{padding-right:15px;padding-left:15px;padding-bottom:15px;border-radius:inherit}.action{display:flex;flex-direction:column;border:1px solid var(--cui-base-200);border-radius:8px}.action__content{padding:15px;display:flex;flex-direction:column;border-radius:8px;background:var(--cui-base-0);gap:16px}.action__header{font-weight:400;font-size:12px;line-height:14px;padding:15px 19px 15.5px;display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--cui-base-900);border-bottom:.5px solid var(--cui-base-200);border-radius:8px 8px 0 0}.cards-container{display:flex;flex-direction:row;justify-items:center;gap:16px}\n"], dependencies: [{ kind: "component", type: CuiCheckListBlockListItemActionCardComponent, selector: "cui-checklist-block-list-item-action-card", inputs: ["purposeType", "isConsiderationNeeded", "actionInfo"], outputs: ["consideredCorrectChanged", "checkListActionChanged"] }, { kind: "directive", type: CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "pipe", type: UpperCasePipe, name: "uppercase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: CuiCheckListBlockListItemActionWithoutVerificationComponent, isStandalone: true, selector: "cui-checklist-block-list-item-action-without-verification", inputs: { checkListItem: { classPropertyName: "checkListItem", publicName: "checkListItem", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\r\n    <ng-container *cuiLet=\"checkListItem().content as checkListItemContent\">\r\n        <div class=\"action\">\r\n            <div class=\"action__header\">\r\n                {{ t('CONDITIONAL_LOGIC') | uppercase }}\r\n            </div>\r\n            <div class=\"action__content\">\r\n                <div class=\"cards-container\">\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![0]\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![0].id)\r\n                        \"\r\n                    />\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![1]\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![1].id)\r\n                        \"\r\n                    />\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</ng-container>\r\n", styles: [":host{padding-right:15px;padding-left:15px;padding-bottom:15px;border-radius:inherit}.action{display:flex;flex-direction:column;border:1px solid var(--cui-base-200);border-radius:8px}.action__content{padding:15px;display:flex;flex-direction:column;border-radius:8px;background:var(--cui-base-0);gap:16px}.action__header{font-weight:400;font-size:12px;line-height:14px;padding:15px 19px 15.5px;display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--cui-base-900);border-bottom:.5px solid var(--cui-base-200);border-radius:8px 8px 0 0}.cards-container{display:flex;flex-direction:row;flex-wrap:wrap;justify-items:center;gap:16px}\n"], dependencies: [{ kind: "component", type: CuiCheckListBlockListItemActionCardComponent, selector: "cui-checklist-block-list-item-action-card", inputs: ["purposeType", "isConsiderationNeeded", "actionInfo"], outputs: ["consideredCorrectChanged", "checkListActionChanged"] }, { kind: "directive", type: CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "pipe", type: UpperCasePipe, name: "uppercase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiCheckListBlockListItemActionWithoutVerificationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cui-checklist-block-list-item-action-without-verification', imports: [CuiCheckListBlockListItemActionCardComponent, CuiLetDirective, TranslocoDirective, UpperCasePipe], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *transloco=\"let t\">\r\n    <ng-container *cuiLet=\"checkListItem().content as checkListItemContent\">\r\n        <div class=\"action\">\r\n            <div class=\"action__header\">\r\n                {{ t('CONDITIONAL_LOGIC') | uppercase }}\r\n            </div>\r\n            <div class=\"action__content\">\r\n                <div class=\"cards-container\">\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![0]\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![0].id)\r\n                        \"\r\n                    />\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![1]\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![1].id)\r\n                        \"\r\n                    />\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</ng-container>\r\n", styles: [":host{padding-right:15px;padding-left:15px;padding-bottom:15px;border-radius:inherit}.action{display:flex;flex-direction:column;border:1px solid var(--cui-base-200);border-radius:8px}.action__content{padding:15px;display:flex;flex-direction:column;border-radius:8px;background:var(--cui-base-0);gap:16px}.action__header{font-weight:400;font-size:12px;line-height:14px;padding:15px 19px 15.5px;display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--cui-base-900);border-bottom:.5px solid var(--cui-base-200);border-radius:8px 8px 0 0}.cards-container{display:flex;flex-direction:row;justify-items:center;gap:16px}\n"] }]
+            args: [{ selector: 'cui-checklist-block-list-item-action-without-verification', imports: [CuiCheckListBlockListItemActionCardComponent, CuiLetDirective, TranslocoDirective, UpperCasePipe], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *transloco=\"let t\">\r\n    <ng-container *cuiLet=\"checkListItem().content as checkListItemContent\">\r\n        <div class=\"action\">\r\n            <div class=\"action__header\">\r\n                {{ t('CONDITIONAL_LOGIC') | uppercase }}\r\n            </div>\r\n            <div class=\"action__content\">\r\n                <div class=\"cards-container\">\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![0]\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![0].id)\r\n                        \"\r\n                    />\r\n                    <cui-checklist-block-list-item-action-card\r\n                        [actionInfo]=\"checkListItemContent.actionsAssignee![1]\"\r\n                        (checkListActionChanged)=\"\r\n                            onCheckListActionChanged($event, checkListItemContent.actionsAssignee![1].id)\r\n                        \"\r\n                    />\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </ng-container>\r\n</ng-container>\r\n", styles: [":host{padding-right:15px;padding-left:15px;padding-bottom:15px;border-radius:inherit}.action{display:flex;flex-direction:column;border:1px solid var(--cui-base-200);border-radius:8px}.action__content{padding:15px;display:flex;flex-direction:column;border-radius:8px;background:var(--cui-base-0);gap:16px}.action__header{font-weight:400;font-size:12px;line-height:14px;padding:15px 19px 15.5px;display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--cui-base-900);border-bottom:.5px solid var(--cui-base-200);border-radius:8px 8px 0 0}.cards-container{display:flex;flex-direction:row;flex-wrap:wrap;justify-items:center;gap:16px}\n"] }]
         }] });
 
 class CuiChecklistBlockTitleControlComponent {
@@ -8538,7 +8540,7 @@ class CuiCheckListBlockListItemEvaluationCriteriaComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiCheckListBlockListItemEvaluationCriteriaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: CuiCheckListBlockListItemEvaluationCriteriaComponent, isStandalone: true, selector: "li[cuiChecklistBlockListItemEvaluationCriteria]", inputs: { loadingIds: { classPropertyName: "loadingIds", publicName: "loadingIds", isSignal: true, isRequired: true, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null }, criteriaGroup: { classPropertyName: "criteriaGroup", publicName: "criteriaGroup", isSignal: true, isRequired: true, transformFunction: null }, evaluationCriteriaFormArray: { classPropertyName: "evaluationCriteriaFormArray", publicName: "evaluationCriteriaFormArray", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { saveClicked: "saveClicked", deleteClicked: "deleteClicked", cancelClicked: "cancelClicked" }, ngImport: i0, template: "<div *transloco=\"let t\">\r\n    <form\r\n        *cuiLet=\"criteriaGroup() as form\"\r\n        [formGroup]=\"form\"\r\n        [class.form_edit]=\"isEditMode()\"\r\n        clas=\"form\"\r\n    >\r\n        <div class=\"content\">\r\n            <span class=\"index\">{{ index() }}.</span>\r\n            @if (!isEditMode()) {\r\n                <cui-svg\r\n                    cuiDragPointer\r\n                    icon=\"cuiIconDragHandleDots\"\r\n                    color=\"var(--cui-base-500)\"\r\n                    class=\"icon\"\r\n                />\r\n            }\r\n            <div\r\n                style.gap=\"{{gap()}}px\"\r\n                class=\"wrapper\"\r\n            >\r\n                <cui-input-number\r\n                    formControlName=\"evaluation\"\r\n                    cuiTextFieldPlaceholder=\"0\"\r\n                    [cuiTextFieldIsError]=\"isEvaluationInvalid\"\r\n                    [min]=\"1\"\r\n                    [max]=\"99\"\r\n                    class=\"input-number\"\r\n                />\r\n                <textarea\r\n                    cuiTextarea\r\n                    formControlName=\"criteria\"\r\n                    [rows]=\"1\"\r\n                    [cuiTextFieldIsError]=\"isCriteriaInvalid\"\r\n                    placeholder=\"{{ t('ADD_A_DESCRIPTION') }}...\"\r\n                    class=\"textarea\"\r\n                ></textarea>\r\n            </div>\r\n            @if (isEditMode()) {\r\n                <button\r\n                    type=\"submit\"\r\n                    cuiIconButton\r\n                    icon=\"cuiIconCheck\"\r\n                    color=\"var(--cui-success)\"\r\n                    [disabled]=\"form.invalid\"\r\n                    class=\"button\"\r\n                    (click)=\"onSave()\"\r\n                ></button>\r\n                <button\r\n                    type=\"button\"\r\n                    cuiIconButton\r\n                    icon=\"cuiIconXCircle\"\r\n                    color=\"var(--cui-danger)\"\r\n                    class=\"button\"\r\n                    (click)=\"onCancel()\"\r\n                ></button>\r\n            } @else {\r\n                <button\r\n                    cuiButton\r\n                    type=\"button\"\r\n                    appearance=\"ghost\"\r\n                    size=\"xxs\"\r\n                    icon=\"cuiIconEdit\"\r\n                    [disabled]=\"isLoading()\"\r\n                    (click)=\"onToggleEditMode()\"\r\n                ></button>\r\n                <button\r\n                    cuiButton\r\n                    type=\"button\"\r\n                    appearance=\"ghost\"\r\n                    size=\"xxs\"\r\n                    icon=\"cuiIconTrash\"\r\n                    [isLoaderShown]=\"isLoading()\"\r\n                    (click)=\"onDelete()\"\r\n                ></button>\r\n            }\r\n        </div>\r\n        <cui-general-control-error-hint\r\n            [control]=\"form.controls.criteria\"\r\n            class=\"error-hint\"\r\n        />\r\n    </form>\r\n</div>\r\n", styles: [".form{display:flex;flex-direction:column;gap:8px}.form_edit{padding:12px;border-radius:8px;border:1px solid var(--cui-base-200);background-color:var(--cui-base-0)}.content{display:flex;gap:8px;align-items:center}.index{font-weight:500;font-size:14px;line-height:20px;width:22px}.icon{cursor:grab}.icon:active{cursor:grabbing}.wrapper{display:flex;flex-grow:1}.input-number{padding-right:9px;padding-left:9px;flex-shrink:0;width:44px;background:inherit}.input-number._disabled{cursor:initial;opacity:1;border-right-width:0;border-radius:8px 0 0 8px}.input-number ::ng-deep .c-input{text-align:center}.input-number ::ng-deep .c-input:disabled{cursor:text}.textarea{background:var(--cui-base-0)}.textarea:disabled{cursor:initial;opacity:1;background:var(--cui-base-0);border-left-width:0;border-radius:0 8px 8px 0}.button:disabled{cursor:not-allowed;opacity:.5}.error-hint{margin-left:82px}.cc-drag-drop-placeholder{height:44px;border:1px dashed var(--cui-base-200);border-radius:8px;background:var(--cui-base-0)}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "size"] }, { kind: "ngmodule", type: CuiIconButtonModule }, { kind: "component", type: CuiIconButtonComponent, selector: "button[cuiIconButton][icon], a[cuiIconButton][icon]", inputs: ["icon", "color", "hoverColor"] }, { kind: "ngmodule", type: CuiInputModule }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "directive", type: CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "ngmodule", type: CuiTextareaModule }, { kind: "component", type: CuiTextareaComponent, selector: "textarea[cuiTextarea]", inputs: ["rows", "noBordersAndPaddings"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "ngmodule", type: CuiInputNumberModule }, { kind: "component", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: ["precision", "min", "max"] }, { kind: "directive", type: CuiDragPointerDirective, selector: "[cuiDragPointer]" }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: CuiCheckListBlockListItemEvaluationCriteriaComponent, isStandalone: true, selector: "li[cuiChecklistBlockListItemEvaluationCriteria]", inputs: { loadingIds: { classPropertyName: "loadingIds", publicName: "loadingIds", isSignal: true, isRequired: true, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: true, transformFunction: null }, criteriaGroup: { classPropertyName: "criteriaGroup", publicName: "criteriaGroup", isSignal: true, isRequired: true, transformFunction: null }, evaluationCriteriaFormArray: { classPropertyName: "evaluationCriteriaFormArray", publicName: "evaluationCriteriaFormArray", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { saveClicked: "saveClicked", deleteClicked: "deleteClicked", cancelClicked: "cancelClicked" }, ngImport: i0, template: "<div *transloco=\"let t\">\r\n    <form\r\n        *cuiLet=\"criteriaGroup() as form\"\r\n        [formGroup]=\"form\"\r\n        [class.form_edit]=\"isEditMode()\"\r\n        clas=\"form\"\r\n    >\r\n        <div class=\"content\">\r\n            <span class=\"index\">{{ index() }}.</span>\r\n            @if (!isEditMode()) {\r\n                <cui-svg\r\n                    cuiDragPointer\r\n                    icon=\"cuiIconDragHandleDots\"\r\n                    color=\"var(--cui-base-500)\"\r\n                    class=\"icon\"\r\n                />\r\n            }\r\n            <div\r\n                style.gap=\"{{gap()}}px\"\r\n                class=\"wrapper\"\r\n            >\r\n                <cui-input-number\r\n                    formControlName=\"evaluation\"\r\n                    cuiTextFieldPlaceholder=\"0\"\r\n                    [cuiTextFieldIsError]=\"isEvaluationInvalid\"\r\n                    [min]=\"1\"\r\n                    [max]=\"99\"\r\n                    class=\"input-number\"\r\n                />\r\n                <textarea\r\n                    cuiTextarea\r\n                    formControlName=\"criteria\"\r\n                    [rows]=\"1\"\r\n                    [cuiTextFieldIsError]=\"isCriteriaInvalid\"\r\n                    placeholder=\"{{ t('ADD_A_DESCRIPTION') }}...\"\r\n                    class=\"textarea\"\r\n                ></textarea>\r\n            </div>\r\n            @if (isEditMode()) {\r\n                <button\r\n                    type=\"submit\"\r\n                    cuiIconButton\r\n                    icon=\"cuiIconCheck\"\r\n                    color=\"var(--cui-success)\"\r\n                    [disabled]=\"form.invalid\"\r\n                    class=\"button\"\r\n                    (click)=\"onSave()\"\r\n                ></button>\r\n                <button\r\n                    type=\"button\"\r\n                    cuiIconButton\r\n                    icon=\"cuiIconXCircle\"\r\n                    color=\"var(--cui-danger)\"\r\n                    class=\"button\"\r\n                    (click)=\"onCancel()\"\r\n                ></button>\r\n            } @else {\r\n                <button\r\n                    cuiButton\r\n                    type=\"button\"\r\n                    appearance=\"ghost\"\r\n                    size=\"xxs\"\r\n                    icon=\"cuiIconEdit\"\r\n                    [disabled]=\"isLoading()\"\r\n                    (click)=\"onToggleEditMode()\"\r\n                ></button>\r\n                <button\r\n                    cuiButton\r\n                    type=\"button\"\r\n                    appearance=\"ghost\"\r\n                    size=\"xxs\"\r\n                    icon=\"cuiIconTrash\"\r\n                    [isLoaderShown]=\"isLoading()\"\r\n                    (click)=\"onDelete()\"\r\n                ></button>\r\n            }\r\n        </div>\r\n        <cui-general-control-error-hint\r\n            [control]=\"form.controls.criteria\"\r\n            class=\"error-hint\"\r\n        />\r\n    </form>\r\n</div>\r\n", styles: [".form{display:flex;flex-direction:column;gap:8px}.form_edit{padding:12px;border-radius:8px;border:1px solid var(--cui-base-200);background-color:var(--cui-base-0)}.content{display:flex;gap:8px;align-items:center}.index{font-weight:500;font-size:14px;line-height:20px;width:22px}.icon{cursor:grab}.icon:active{cursor:grabbing}.wrapper{display:flex;flex-grow:1}.input-number{padding-right:9px;padding-left:9px;flex-shrink:0;width:44px;background:inherit}.input-number._disabled{cursor:initial;opacity:1;border-right-width:0;border-radius:8px 0 0 8px}.input-number ::ng-deep .c-input{text-align:center}.input-number ::ng-deep .c-input:disabled{cursor:text}.textarea{background:var(--cui-base-0)}.textarea:disabled{cursor:initial;opacity:1;background:var(--cui-base-0);border-left-width:0;border-radius:0 8px 8px 0}.button:disabled{cursor:not-allowed;opacity:.5}.error-hint{margin-left:82px}.cui-drag-drop-placeholder{height:44px;border:1px dashed var(--cui-base-200);border-radius:8px;background:var(--cui-base-0)}\n"], dependencies: [{ kind: "ngmodule", type: CuiButtonModule }, { kind: "component", type: CuiButtonComponent, selector: "button[cuiButton], a[cuiButton]", inputs: ["shape", "disabled", "isLoaderShown", "icon", "iconRight", "appearance", "size"] }, { kind: "ngmodule", type: CuiIconButtonModule }, { kind: "component", type: CuiIconButtonComponent, selector: "button[cuiIconButton][icon], a[cuiIconButton][icon]", inputs: ["icon", "color", "hoverColor"] }, { kind: "ngmodule", type: CuiInputModule }, { kind: "directive", type: CuiTextFieldPlaceholderDirective, selector: "[cuiTextFieldPlaceholder]", inputs: ["cuiTextFieldPlaceholder"] }, { kind: "directive", type: CuiTextFieldIsErrorDirective, selector: "[cuiTextFieldIsError]", inputs: ["cuiTextFieldIsError"] }, { kind: "directive", type: CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "ngmodule", type: CuiSvgModule }, { kind: "component", type: CuiSvgComponent, selector: "cui-svg[icon]", inputs: ["width", "height", "strokeWidth", "color", "icon"] }, { kind: "ngmodule", type: CuiTextareaModule }, { kind: "component", type: CuiTextareaComponent, selector: "textarea[cuiTextarea]", inputs: ["rows", "noBordersAndPaddings"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "ngmodule", type: CuiInputNumberModule }, { kind: "component", type: CuiInputNumberComponent, selector: "cui-input-number", inputs: ["precision", "min", "max"] }, { kind: "directive", type: CuiDragPointerDirective, selector: "[cuiDragPointer]" }, { kind: "component", type: CuiGeneralControlErrorHintComponent, selector: "cui-general-control-error-hint", inputs: ["control", "isVisible"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiCheckListBlockListItemEvaluationCriteriaComponent, decorators: [{
             type: Component,
@@ -8554,7 +8556,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         CuiInputNumberModule,
                         CuiDragPointerDirective,
                         CuiGeneralControlErrorHintComponent
-                    ], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *transloco=\"let t\">\r\n    <form\r\n        *cuiLet=\"criteriaGroup() as form\"\r\n        [formGroup]=\"form\"\r\n        [class.form_edit]=\"isEditMode()\"\r\n        clas=\"form\"\r\n    >\r\n        <div class=\"content\">\r\n            <span class=\"index\">{{ index() }}.</span>\r\n            @if (!isEditMode()) {\r\n                <cui-svg\r\n                    cuiDragPointer\r\n                    icon=\"cuiIconDragHandleDots\"\r\n                    color=\"var(--cui-base-500)\"\r\n                    class=\"icon\"\r\n                />\r\n            }\r\n            <div\r\n                style.gap=\"{{gap()}}px\"\r\n                class=\"wrapper\"\r\n            >\r\n                <cui-input-number\r\n                    formControlName=\"evaluation\"\r\n                    cuiTextFieldPlaceholder=\"0\"\r\n                    [cuiTextFieldIsError]=\"isEvaluationInvalid\"\r\n                    [min]=\"1\"\r\n                    [max]=\"99\"\r\n                    class=\"input-number\"\r\n                />\r\n                <textarea\r\n                    cuiTextarea\r\n                    formControlName=\"criteria\"\r\n                    [rows]=\"1\"\r\n                    [cuiTextFieldIsError]=\"isCriteriaInvalid\"\r\n                    placeholder=\"{{ t('ADD_A_DESCRIPTION') }}...\"\r\n                    class=\"textarea\"\r\n                ></textarea>\r\n            </div>\r\n            @if (isEditMode()) {\r\n                <button\r\n                    type=\"submit\"\r\n                    cuiIconButton\r\n                    icon=\"cuiIconCheck\"\r\n                    color=\"var(--cui-success)\"\r\n                    [disabled]=\"form.invalid\"\r\n                    class=\"button\"\r\n                    (click)=\"onSave()\"\r\n                ></button>\r\n                <button\r\n                    type=\"button\"\r\n                    cuiIconButton\r\n                    icon=\"cuiIconXCircle\"\r\n                    color=\"var(--cui-danger)\"\r\n                    class=\"button\"\r\n                    (click)=\"onCancel()\"\r\n                ></button>\r\n            } @else {\r\n                <button\r\n                    cuiButton\r\n                    type=\"button\"\r\n                    appearance=\"ghost\"\r\n                    size=\"xxs\"\r\n                    icon=\"cuiIconEdit\"\r\n                    [disabled]=\"isLoading()\"\r\n                    (click)=\"onToggleEditMode()\"\r\n                ></button>\r\n                <button\r\n                    cuiButton\r\n                    type=\"button\"\r\n                    appearance=\"ghost\"\r\n                    size=\"xxs\"\r\n                    icon=\"cuiIconTrash\"\r\n                    [isLoaderShown]=\"isLoading()\"\r\n                    (click)=\"onDelete()\"\r\n                ></button>\r\n            }\r\n        </div>\r\n        <cui-general-control-error-hint\r\n            [control]=\"form.controls.criteria\"\r\n            class=\"error-hint\"\r\n        />\r\n    </form>\r\n</div>\r\n", styles: [".form{display:flex;flex-direction:column;gap:8px}.form_edit{padding:12px;border-radius:8px;border:1px solid var(--cui-base-200);background-color:var(--cui-base-0)}.content{display:flex;gap:8px;align-items:center}.index{font-weight:500;font-size:14px;line-height:20px;width:22px}.icon{cursor:grab}.icon:active{cursor:grabbing}.wrapper{display:flex;flex-grow:1}.input-number{padding-right:9px;padding-left:9px;flex-shrink:0;width:44px;background:inherit}.input-number._disabled{cursor:initial;opacity:1;border-right-width:0;border-radius:8px 0 0 8px}.input-number ::ng-deep .c-input{text-align:center}.input-number ::ng-deep .c-input:disabled{cursor:text}.textarea{background:var(--cui-base-0)}.textarea:disabled{cursor:initial;opacity:1;background:var(--cui-base-0);border-left-width:0;border-radius:0 8px 8px 0}.button:disabled{cursor:not-allowed;opacity:.5}.error-hint{margin-left:82px}.cc-drag-drop-placeholder{height:44px;border:1px dashed var(--cui-base-200);border-radius:8px;background:var(--cui-base-0)}\n"] }]
+                    ], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *transloco=\"let t\">\r\n    <form\r\n        *cuiLet=\"criteriaGroup() as form\"\r\n        [formGroup]=\"form\"\r\n        [class.form_edit]=\"isEditMode()\"\r\n        clas=\"form\"\r\n    >\r\n        <div class=\"content\">\r\n            <span class=\"index\">{{ index() }}.</span>\r\n            @if (!isEditMode()) {\r\n                <cui-svg\r\n                    cuiDragPointer\r\n                    icon=\"cuiIconDragHandleDots\"\r\n                    color=\"var(--cui-base-500)\"\r\n                    class=\"icon\"\r\n                />\r\n            }\r\n            <div\r\n                style.gap=\"{{gap()}}px\"\r\n                class=\"wrapper\"\r\n            >\r\n                <cui-input-number\r\n                    formControlName=\"evaluation\"\r\n                    cuiTextFieldPlaceholder=\"0\"\r\n                    [cuiTextFieldIsError]=\"isEvaluationInvalid\"\r\n                    [min]=\"1\"\r\n                    [max]=\"99\"\r\n                    class=\"input-number\"\r\n                />\r\n                <textarea\r\n                    cuiTextarea\r\n                    formControlName=\"criteria\"\r\n                    [rows]=\"1\"\r\n                    [cuiTextFieldIsError]=\"isCriteriaInvalid\"\r\n                    placeholder=\"{{ t('ADD_A_DESCRIPTION') }}...\"\r\n                    class=\"textarea\"\r\n                ></textarea>\r\n            </div>\r\n            @if (isEditMode()) {\r\n                <button\r\n                    type=\"submit\"\r\n                    cuiIconButton\r\n                    icon=\"cuiIconCheck\"\r\n                    color=\"var(--cui-success)\"\r\n                    [disabled]=\"form.invalid\"\r\n                    class=\"button\"\r\n                    (click)=\"onSave()\"\r\n                ></button>\r\n                <button\r\n                    type=\"button\"\r\n                    cuiIconButton\r\n                    icon=\"cuiIconXCircle\"\r\n                    color=\"var(--cui-danger)\"\r\n                    class=\"button\"\r\n                    (click)=\"onCancel()\"\r\n                ></button>\r\n            } @else {\r\n                <button\r\n                    cuiButton\r\n                    type=\"button\"\r\n                    appearance=\"ghost\"\r\n                    size=\"xxs\"\r\n                    icon=\"cuiIconEdit\"\r\n                    [disabled]=\"isLoading()\"\r\n                    (click)=\"onToggleEditMode()\"\r\n                ></button>\r\n                <button\r\n                    cuiButton\r\n                    type=\"button\"\r\n                    appearance=\"ghost\"\r\n                    size=\"xxs\"\r\n                    icon=\"cuiIconTrash\"\r\n                    [isLoaderShown]=\"isLoading()\"\r\n                    (click)=\"onDelete()\"\r\n                ></button>\r\n            }\r\n        </div>\r\n        <cui-general-control-error-hint\r\n            [control]=\"form.controls.criteria\"\r\n            class=\"error-hint\"\r\n        />\r\n    </form>\r\n</div>\r\n", styles: [".form{display:flex;flex-direction:column;gap:8px}.form_edit{padding:12px;border-radius:8px;border:1px solid var(--cui-base-200);background-color:var(--cui-base-0)}.content{display:flex;gap:8px;align-items:center}.index{font-weight:500;font-size:14px;line-height:20px;width:22px}.icon{cursor:grab}.icon:active{cursor:grabbing}.wrapper{display:flex;flex-grow:1}.input-number{padding-right:9px;padding-left:9px;flex-shrink:0;width:44px;background:inherit}.input-number._disabled{cursor:initial;opacity:1;border-right-width:0;border-radius:8px 0 0 8px}.input-number ::ng-deep .c-input{text-align:center}.input-number ::ng-deep .c-input:disabled{cursor:text}.textarea{background:var(--cui-base-0)}.textarea:disabled{cursor:initial;opacity:1;background:var(--cui-base-0);border-left-width:0;border-radius:0 8px 8px 0}.button:disabled{cursor:not-allowed;opacity:.5}.error-hint{margin-left:82px}.cui-drag-drop-placeholder{height:44px;border:1px dashed var(--cui-base-200);border-radius:8px;background:var(--cui-base-0)}\n"] }]
         }], ctorParameters: () => [] });
 
 class CuiCheckListBlockListItemEvaluationComponent {
@@ -8874,7 +8876,7 @@ class CuiChecklistBlockListComponent {
         return this.checkListItemActionWithoutVerification;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiChecklistBlockListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: CuiChecklistBlockListComponent, isStandalone: true, selector: "cui-checklist-block-list", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\r\n    <ng-container *cuiLet=\"checkListItemsWithComponents() as checkListItemsWithComponents\">\r\n        @if (checkListItemsWithComponents?.length) {\r\n            <ul\r\n                class=\"list__items\"\r\n                #list\r\n                cuiDragList\r\n            >\r\n                <ng-container *ngTemplateOutlet=\"items; context: { $implicit: checkListItemsWithComponents }\" />\r\n                <ng-template\r\n                    #items\r\n                    let-items\r\n                    let-isHidden=\"isHidden\"\r\n                >\r\n                    @for (item of items; track item.id; let index = $index) {\r\n                        <li\r\n                            [attr.data-id]=\"item.content.id\"\r\n                            [attr.data-parent-id]=\"componentId()\"\r\n                            [hidden]=\"isHidden\"\r\n                            cuiHandleScroll\r\n                            cuiDragDrop\r\n                            class=\"list__item\"\r\n                            [class.list__item_disabled]=\"isLoading()\"\r\n                            (elementDragged)=\"moveTreeStruct($event, item)\"\r\n                        >\r\n                            <cui-checklist-block-list-item-container\r\n                                [checkListBlockItem]=\"item\"\r\n                                [index]=\"index + 1\"\r\n                                [config]=\"config()\"\r\n                            />\r\n                        </li>\r\n                    }\r\n                </ng-template>\r\n            </ul>\r\n        } @else {\r\n            <cui-empty-state [subtitle]=\"t('NO_CHECKLIST_ITEMS')\" />\r\n        }\r\n    </ng-container>\r\n</ng-container>\r\n", styles: [":host ::ng-deep .codex-editor-overlay{position:unset}.list__items{display:flex;flex-direction:column;border:1px solid var(--cui-base-200);border-radius:8px}.list__item{border-bottom:.5px solid var(--cui-base-200)}.list__item_disabled{pointer-events:none;opacity:.5}.list__item:only-child{border-radius:8px!important}.list__item:first-child{border-radius:8px 8px 0 0}.list__item:last-child{border-radius:0 0 8px 8px;border:none}.cc-drag-drop-placeholder{position:relative;z-index:1;height:40px;border:1px dashed var(--cui-base-200);border-radius:8px;background:var(--cui-base-0)}\n"], dependencies: [{ kind: "component", type: CuiChecklistBlockListItemContainerComponent, selector: "cui-checklist-block-list-item-container", inputs: ["checkListBlockItem", "config", "index"] }, { kind: "ngmodule", type: CuiButtonModule }, { kind: "ngmodule", type: CuiContextMenuModule }, { kind: "directive", type: CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "component", type: CuiEmptyStateComponent, selector: "cui-empty-state, [cuiEmptyState]", inputs: ["title", "subtitle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "directive", type: CuiDragDropDirective, selector: "[cuiDragDrop]", inputs: ["disabled"], outputs: ["elementDragged"] }, { kind: "directive", type: CuiHandleScrollDirective, selector: "[cuiHandleScroll]", inputs: ["scrollSpeed"] }, { kind: "directive", type: CuiDragListDirective, selector: "[cuiDragList]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: CuiChecklistBlockListComponent, isStandalone: true, selector: "cui-checklist-block-list", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<ng-container *transloco=\"let t\">\r\n    <ng-container *cuiLet=\"checkListItemsWithComponents() as checkListItemsWithComponents\">\r\n        @if (checkListItemsWithComponents?.length) {\r\n            <ul\r\n                class=\"list__items\"\r\n                #list\r\n                cuiDragList\r\n            >\r\n                <ng-container *ngTemplateOutlet=\"items; context: { $implicit: checkListItemsWithComponents }\" />\r\n                <ng-template\r\n                    #items\r\n                    let-items\r\n                    let-isHidden=\"isHidden\"\r\n                >\r\n                    @for (item of items; track item.id; let index = $index) {\r\n                        <li\r\n                            [attr.data-id]=\"item.content.id\"\r\n                            [attr.data-parent-id]=\"componentId()\"\r\n                            [hidden]=\"isHidden\"\r\n                            cuiHandleScroll\r\n                            cuiDragDrop\r\n                            class=\"list__item\"\r\n                            [class.list__item_disabled]=\"isLoading()\"\r\n                            (elementDragged)=\"moveTreeStruct($event, item)\"\r\n                        >\r\n                            <cui-checklist-block-list-item-container\r\n                                [checkListBlockItem]=\"item\"\r\n                                [index]=\"index + 1\"\r\n                                [config]=\"config()\"\r\n                            />\r\n                        </li>\r\n                    }\r\n                </ng-template>\r\n            </ul>\r\n        } @else {\r\n            <cui-empty-state [subtitle]=\"t('NO_CHECKLIST_ITEMS')\" />\r\n        }\r\n    </ng-container>\r\n</ng-container>\r\n", styles: [":host ::ng-deep .codex-editor-overlay{position:unset}.list__items{display:flex;flex-direction:column;border:1px solid var(--cui-base-200);border-radius:8px}.list__item{border-bottom:.5px solid var(--cui-base-200)}.list__item_disabled{pointer-events:none;opacity:.5}.list__item:only-child{border-radius:8px!important}.list__item:first-child{border-radius:8px 8px 0 0}.list__item:last-child{border-radius:0 0 8px 8px;border:none}.cui-drag-drop-placeholder{position:relative;z-index:1;height:40px;border:1px dashed var(--cui-base-200);border-radius:8px;background:var(--cui-base-0)}\n"], dependencies: [{ kind: "component", type: CuiChecklistBlockListItemContainerComponent, selector: "cui-checklist-block-list-item-container", inputs: ["checkListBlockItem", "config", "index"] }, { kind: "ngmodule", type: CuiButtonModule }, { kind: "ngmodule", type: CuiContextMenuModule }, { kind: "directive", type: CuiLetDirective, selector: "[cuiLet]", inputs: ["cuiLet"] }, { kind: "component", type: CuiEmptyStateComponent, selector: "cui-empty-state, [cuiEmptyState]", inputs: ["title", "subtitle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoPrefix", "translocoLang", "translocoLoadingTpl"] }, { kind: "directive", type: CuiDragDropDirective, selector: "[cuiDragDrop]", inputs: ["disabled"], outputs: ["elementDragged"] }, { kind: "directive", type: CuiHandleScrollDirective, selector: "[cuiHandleScroll]", inputs: ["scrollSpeed"] }, { kind: "directive", type: CuiDragListDirective, selector: "[cuiDragList]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiChecklistBlockListComponent, decorators: [{
             type: Component,
@@ -8889,11 +8891,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                         CuiDragDropDirective,
                         CuiHandleScrollDirective,
                         CuiDragListDirective
-                    ], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *transloco=\"let t\">\r\n    <ng-container *cuiLet=\"checkListItemsWithComponents() as checkListItemsWithComponents\">\r\n        @if (checkListItemsWithComponents?.length) {\r\n            <ul\r\n                class=\"list__items\"\r\n                #list\r\n                cuiDragList\r\n            >\r\n                <ng-container *ngTemplateOutlet=\"items; context: { $implicit: checkListItemsWithComponents }\" />\r\n                <ng-template\r\n                    #items\r\n                    let-items\r\n                    let-isHidden=\"isHidden\"\r\n                >\r\n                    @for (item of items; track item.id; let index = $index) {\r\n                        <li\r\n                            [attr.data-id]=\"item.content.id\"\r\n                            [attr.data-parent-id]=\"componentId()\"\r\n                            [hidden]=\"isHidden\"\r\n                            cuiHandleScroll\r\n                            cuiDragDrop\r\n                            class=\"list__item\"\r\n                            [class.list__item_disabled]=\"isLoading()\"\r\n                            (elementDragged)=\"moveTreeStruct($event, item)\"\r\n                        >\r\n                            <cui-checklist-block-list-item-container\r\n                                [checkListBlockItem]=\"item\"\r\n                                [index]=\"index + 1\"\r\n                                [config]=\"config()\"\r\n                            />\r\n                        </li>\r\n                    }\r\n                </ng-template>\r\n            </ul>\r\n        } @else {\r\n            <cui-empty-state [subtitle]=\"t('NO_CHECKLIST_ITEMS')\" />\r\n        }\r\n    </ng-container>\r\n</ng-container>\r\n", styles: [":host ::ng-deep .codex-editor-overlay{position:unset}.list__items{display:flex;flex-direction:column;border:1px solid var(--cui-base-200);border-radius:8px}.list__item{border-bottom:.5px solid var(--cui-base-200)}.list__item_disabled{pointer-events:none;opacity:.5}.list__item:only-child{border-radius:8px!important}.list__item:first-child{border-radius:8px 8px 0 0}.list__item:last-child{border-radius:0 0 8px 8px;border:none}.cc-drag-drop-placeholder{position:relative;z-index:1;height:40px;border:1px dashed var(--cui-base-200);border-radius:8px;background:var(--cui-base-0)}\n"] }]
+                    ], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *transloco=\"let t\">\r\n    <ng-container *cuiLet=\"checkListItemsWithComponents() as checkListItemsWithComponents\">\r\n        @if (checkListItemsWithComponents?.length) {\r\n            <ul\r\n                class=\"list__items\"\r\n                #list\r\n                cuiDragList\r\n            >\r\n                <ng-container *ngTemplateOutlet=\"items; context: { $implicit: checkListItemsWithComponents }\" />\r\n                <ng-template\r\n                    #items\r\n                    let-items\r\n                    let-isHidden=\"isHidden\"\r\n                >\r\n                    @for (item of items; track item.id; let index = $index) {\r\n                        <li\r\n                            [attr.data-id]=\"item.content.id\"\r\n                            [attr.data-parent-id]=\"componentId()\"\r\n                            [hidden]=\"isHidden\"\r\n                            cuiHandleScroll\r\n                            cuiDragDrop\r\n                            class=\"list__item\"\r\n                            [class.list__item_disabled]=\"isLoading()\"\r\n                            (elementDragged)=\"moveTreeStruct($event, item)\"\r\n                        >\r\n                            <cui-checklist-block-list-item-container\r\n                                [checkListBlockItem]=\"item\"\r\n                                [index]=\"index + 1\"\r\n                                [config]=\"config()\"\r\n                            />\r\n                        </li>\r\n                    }\r\n                </ng-template>\r\n            </ul>\r\n        } @else {\r\n            <cui-empty-state [subtitle]=\"t('NO_CHECKLIST_ITEMS')\" />\r\n        }\r\n    </ng-container>\r\n</ng-container>\r\n", styles: [":host ::ng-deep .codex-editor-overlay{position:unset}.list__items{display:flex;flex-direction:column;border:1px solid var(--cui-base-200);border-radius:8px}.list__item{border-bottom:.5px solid var(--cui-base-200)}.list__item_disabled{pointer-events:none;opacity:.5}.list__item:only-child{border-radius:8px!important}.list__item:first-child{border-radius:8px 8px 0 0}.list__item:last-child{border-radius:0 0 8px 8px;border:none}.cui-drag-drop-placeholder{position:relative;z-index:1;height:40px;border:1px dashed var(--cui-base-200);border-radius:8px;background:var(--cui-base-0)}\n"] }]
         }] });
 
 class CuiChecklistBlockComponent {
     constructor() {
+        this.destroyRef = inject(DestroyRef);
         this.treeStructApiService = inject(CuiTreeStructApiService);
         this.translocoService = inject(TranslocoService);
         this.nodeCheckListApiService = inject(CuiNodeChecklistApiService);
@@ -8923,6 +8926,7 @@ class CuiChecklistBlockComponent {
             this.checkListBlockService.setComponentId(this.componentId());
             this.treeStructApiService
                 .getById(this.componentId())
+                .pipe(takeUntilDestroyed(this.destroyRef))
                 .subscribe((treeStruct) => this.checkListBlockService.setCheckListItems(treeStruct.elements));
         }, { allowSignalWrites: true });
     }
@@ -8934,7 +8938,7 @@ class CuiChecklistBlockComponent {
             title: 'New checklist item',
             type_operations: type
         })
-            .pipe(finalize(() => this.isLoading.set(false)))
+            .pipe(takeUntilDestroyed(this.destroyRef), finalize(() => this.isLoading.set(false)))
             .subscribe((checkListItem) => this.checkListBlockService.addCheckListItem(checkListItem));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CuiChecklistBlockComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }