barsa-sap-ui 2.3.57 → 2.3.59

package/fesm2022/barsa-sap-ui.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
-import { ChangeDetectionStrategy, Component, Input, Pipe, EventEmitter, inject, NgZone, Renderer2, ElementRef, Output, HostBinding, ViewChild, ViewEncapsulation, ChangeDetectorRef, ViewChildren, DOCUMENT, Directive, TemplateRef, HostListener, signal, ViewContainerRef, Injector, ComponentFactoryResolver, NgModule, input, output, EnvironmentInjector, afterNextRender, runInInjectionContext, Injectable, provideAppInitializer, NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { ChangeDetectionStrategy, Component, Input, Pipe, EventEmitter, inject, NgZone, Renderer2, ElementRef, Output, HostBinding, ViewChild, ViewEncapsulation, ChangeDetectorRef, ViewChildren, DOCUMENT, Directive, TemplateRef, HostListener, signal, ViewContainerRef, Injector, computed, ComponentFactoryResolver, NgModule, input, output, EnvironmentInjector, afterNextRender, runInInjectionContext, Injectable, provideAppInitializer, NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import * as i2 from 'barsa-novin-ray-core';
-import { BaseComponent, ReportViewBaseComponent, getUniqueId, BarsaApi, LayoutItemBaseComponent, getDeviceIsMobile, BbbTranslatePipe, LayoutService, measureText, getLabelWidth, SortDirection, BaseUlvSettingComponent, getResetGridSettings, FormComponent, createFormPanelMetaConditions, ReportBaseComponent, SelectionMode, FormPanelService, LayoutMainContentService, GetAllColumnsSorted, getParentHeight, getControlSizeMode, getDeviceIsDesktop, getDeviceIsTablet, getGridSettings, BaseDirective, PortalService, FieldBaseComponent, getDateService as getDateService$1, DateService, DateMiladiService, DateHijriService, DateShamsiService, DynamicDarkColorPipe, EllipsifyDirective, createGridEditorFormPanel, TabpageService, LocalStorageService, getAllItemsPerChildren, setOneDepthLevel, BaseViewItemPropsComponent, MoReportValuePipe, ExecuteDynamicCommand, PictureFieldSourcePipe, isImage, getIcon, UploadService, LayoutPanelBaseComponent, UlvMainService, BaseColumnPropsComponent, ColumnService, BaseViewContentPropsComponent, enumValueToStringSize, PreventDefaulEvent, setTableThWidth, TableHeaderWidthMode, calcContextMenuWidth, setColumnWidthByMaxMoContentWidth, calculateColumnWidth, calculateColumnContent, calculateColumnWidthFitToContainer, calculateFreeColumnSize, NotificationService, DateRanges, LogService, ApplicationCtrlrService, BreadcrumbService, IsDarkMode, isFunction, FilesValidationHelper, getValidExtension, getImagePath, LinearListHelper, FormToolbarBaseComponent, isFirefox, FormBaseComponent, getFieldValue, ContainerComponent, DialogParams, ContainerService, FindToolbarItem, FindLayoutSettingFromLayout94, FormPropsBaseComponent, UiService, NumberBaseComponent, ImageMimeType, BaseFormToolbaritemPropsComponent, NetworkStatusService, isInLocalMode, executeUlvCommandHandler, FillAllLayoutControls, IntersectionStatus, FORM_DIALOG_COMPONENT, NOTIFICATAION_POPUP_SERVER, TOAST_SERVICE, BaseModule, DynamicComponentService, BarsaNovinRayCoreModule, ResizableModule, DIALOG_SERVICE } from 'barsa-novin-ray-core';
+import { BaseComponent, ReportViewBaseComponent, getUniqueId, BarsaApi, LayoutItemBaseComponent, getDeviceIsMobile, BbbTranslatePipe, LayoutService, measureText, getLabelWidth, SortDirection, BaseUlvSettingComponent, getResetGridSettings, FormComponent, createFormPanelMetaConditions, ReportBaseComponent, SelectionMode, FormPanelService, LayoutMainContentService, GetAllColumnsSorted, getParentHeight, getControlSizeMode, getDeviceIsDesktop, getDeviceIsTablet, getGridSettings, BaseDirective, PortalService, FieldBaseComponent, getDateService as getDateService$1, DateService, DateMiladiService, DateHijriService, DateShamsiService, DynamicDarkColorPipe, EllipsifyDirective, createGridEditorFormPanel, TabpageService, LocalStorageService, getAllItemsPerChildren, setOneDepthLevel, BaseViewItemPropsComponent, MoReportValuePipe, ExecuteDynamicCommand, PictureFieldSourcePipe, isImage, getIcon, UploadService, LayoutPanelBaseComponent, UlvMainService, BaseColumnPropsComponent, ColumnService, BaseViewContentPropsComponent, enumValueToStringSize, PreventDefaulEvent, setTableThWidth, TableHeaderWidthMode, calcContextMenuWidth, setColumnWidthByMaxMoContentWidth, calculateColumnWidth, calculateColumnContent, calculateColumnWidthFitToContainer, calculateFreeColumnSize, NotificationService, DateRanges, LogService, ApplicationCtrlrService, BreadcrumbService, IsDarkMode, isFunction, FilesValidationHelper, getValidExtension, getImagePath, LinearListHelper, FormToolbarBaseComponent, isFirefox, FormBaseComponent, getFieldValue, ContainerComponent, DialogParams, ContainerService, FindToolbarItem, FindLayoutSettingFromLayout94, FormPropsBaseComponent, UiService, measureText2, NumberBaseComponent, ImageMimeType, BaseFormToolbaritemPropsComponent, NetworkStatusService, isInLocalMode, executeUlvCommandHandler, FillAllLayoutControls, IntersectionStatus, FORM_DIALOG_COMPONENT, NOTIFICATAION_POPUP_SERVER, TOAST_SERVICE, BaseModule, DynamicComponentService, BarsaNovinRayCoreModule, ResizableModule, DIALOG_SERVICE } from 'barsa-novin-ray-core';
 import moment from 'moment';
 import jmoment from 'moment-jalaali';
 import { combineLatest, of, BehaviorSubject, Subject, takeUntil as takeUntil$1, debounceTime as debounceTime$1, concatMap, tap as tap$1, Observable, fromEvent, first as first$1, filter as filter$1, skip, map as map$1, from } from 'rxjs';
@@ -9145,17 +9145,16 @@ class LayoutActionsComponent extends FormToolbarBaseComponent {
     constructor() {
         super(...arguments);
         this.workflowChoiceSelect = new EventEmitter();
+        this.isMobile = getDeviceIsMobile();
         this.autoClose = false;
-        this.mobileBottomBar = false;
-        this.hasButtons = false;
+        this.hasButtons = signal(false);
+        this.mobileBottomBar = computed(() => this.isMobile && !this.standalone && this.hasButtons());
         this.scrollThrottle = 0;
         this._overlay = inject(Overlay);
     }
     ngOnInit() {
         super.ngOnInit();
-        this.hasButtons = this.workflowButtons.length > 0 || this.buttons.length > 0;
-        this.isMobile = getDeviceIsMobile();
-        this.mobileBottomBar = this.isMobile && !this.standalone && this.hasButtons;
+        this._setHasButtons(this.workflowButtons, this.buttons);
         this.repositionScrollStrategy = this._overlay.scrollStrategies.reposition({
             autoClose: this.autoClose,
             scrollThrottle: this.scrollThrottle
@@ -9174,6 +9173,13 @@ class LayoutActionsComponent extends FormToolbarBaseComponent {
             }
         }
     }
+    ngOnChanges(changes) {
+        super.ngOnChanges(changes);
+        const { workflowButtons, buttons } = changes;
+        if (workflowButtons || buttons) {
+            this._setHasButtons(workflowButtons ? workflowButtons.currentValue : this.workflowButtons, buttons ? buttons.currentValue : this.buttons);
+        }
+    }
     onAcceptWorkflow() {
         this.onToolClick(this.selectedWorkflowButton);
     }
@@ -9181,12 +9187,15 @@ class LayoutActionsComponent extends FormToolbarBaseComponent {
         this.selectedWorkflowButton = workflowButton;
         this.workflowChoiceSelect.emit(workflowButton.Data);
     }
+    _setHasButtons(workflowButtons, buttons) {
+        this.hasButtons.set(workflowButtons?.length > 0 || buttons?.length > 0);
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LayoutActionsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: LayoutActionsComponent, isStandalone: false, selector: "bsu-layout-actions", inputs: { workflowButtons: "workflowButtons", workflowButtonsComboMode: "workflowButtonsComboMode", canSend: "canSend", simple: "simple", footerDesign: "footerDesign" }, outputs: { workflowChoiceSelect: "workflowChoiceSelect" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"simple ? buttonsMode : defaultTemplate\"> </ng-container>\r\n<ng-template #defaultTemplate>\r\n    @if (visible) { @if (hasButtons) {\r\n    <div fd-bar [barDesign]=\"footerDesign ? footerDesign : 'footer'\" [inPage]=\"true\">\r\n        @if (canSend && false) {\r\n        <div fd-bar-left>\r\n            <fd-bar-element class=\"forward\">\r\n                <fd-popover\r\n                    [focusTrapped]=\"true\"\r\n                    [focusAutoCapture]=\"true\"\r\n                    [closeOnOutsideClick]=\"false\"\r\n                    [scrollStrategy]=\"repositionScrollStrategy\"\r\n                    #forwardPopover\r\n                >\r\n                    <fd-popover-control class=\"forward\">\r\n                        <button fd-button [fdType]=\"'standard'\" [label]=\"'Forward' | bbbTranslate\"></button>\r\n                    </fd-popover-control>\r\n                    <fd-popover-body style=\"min-width: 30vw; max-width: 30vw; min-height: 30vh\">\r\n                        <div fd-popover-body-header>\r\n                            <div fd-bar barDesign=\"header\" [cozy]=\"true\">\r\n                                <div fd-bar-right>\r\n                                    <fd-bar-element\r\n                                        ><button\r\n                                            fd-button\r\n                                            (click)=\"forwardPopover.close()\"\r\n                                            [fdType]=\"'transparent'\"\r\n                                            [glyph]=\"'decline'\"\r\n                                        ></button>\r\n                                    </fd-bar-element>\r\n                                    <div fd-bar-left>\r\n                                        <fd-bar-element>\u0627\u0631\u062C\u0627\u0639 \u0641\u0631\u0645 \u0628\u0647 \u0634\u062E\u0635 \u062F\u06CC\u06AF\u0631 </fd-bar-element>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                        <bnrc-form-new\r\n                            class=\"form-erja\"\r\n                            [settings]=\"{\r\n                                MetaTypeDef: { Id: '', $Caption: '' },\r\n                                MetaView: { Id: '', $Caption: '' },\r\n                                DisableGenerateId: true\r\n                            }\"\r\n                        ></bnrc-form-new>\r\n                        <div fd-popover-body-footer>\r\n                            <div fd-bar barDesign=\"footer\" [cozy]=\"true\">\r\n                                <div fd-bar-right>\r\n                                    <fd-button-bar [label]=\"'Send' | bbbTranslate\" fdType=\"emphasized\"></fd-button-bar>\r\n                                    <fd-button-bar\r\n                                        [label]=\"'Cancel' | bbbTranslate\"\r\n                                        [fdType]=\"'transparent'\"\r\n                                        (click)=\"forwardPopover.close()\"\r\n                                    ></fd-button-bar>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </fd-popover-body>\r\n                </fd-popover>\r\n            </fd-bar-element>\r\n        </div>\r\n        }\r\n        <div fd-bar-right>\r\n            @if (workflowButtonsComboMode && workflowButtons.length) { @if(workflowButtons.length === 1){\r\n            <fd-button-bar\r\n                [fdType]=\"'emphasized'\"\r\n                [label]=\"workflowButtons[0].text | bbbTranslate\"\r\n                [glyph]=\"'accept'\"\r\n                (click)=\"onWorkflowButtonSelected(workflowButtons[0]); onAcceptWorkflow()\"\r\n            ></fd-button-bar>\r\n            } @else{\r\n            <button\r\n                fd-button\r\n                [fdMenu]=\"true\"\r\n                fdType=\"emphasized\"\r\n                [label]=\"selectedWorkflowButton?.text || 'Select' | bbbTranslate\"\r\n                [ariaLabel]=\"selectedWorkflowButton?.text || 'Select' | bbbTranslate\"\r\n                [fdMenuTrigger]=\"menu\"\r\n            ></button>\r\n            <fd-menu #menu>\r\n                @for (btn of workflowButtons; track btn) {\r\n                <li fd-menu-item (click)=\"menu.close(); onWorkflowButtonSelected(btn)\">\r\n                    <div fd-menu-interactive>\r\n                        <span fd-menu-title>{{ btn.text }}</span>\r\n                    </div>\r\n                </li>\r\n                }\r\n            </fd-menu>\r\n            <fd-button-bar\r\n                [fdType]=\"'positive'\"\r\n                [label]=\"'Send' | bbbTranslate\"\r\n                [disabled]=\"!selectedWorkflowButton\"\r\n                [glyph]=\"'accept'\"\r\n                (click)=\"onAcceptWorkflow()\"\r\n            ></fd-button-bar>\r\n            } }@for (btn of buttons; track btn; let i = $index) { @if (btn.Data?.CustomUi?.Selector) {\r\n            <bnrc-dynamic-form-toolbaritem\r\n                class=\"fd-bar__element\"\r\n                [component]=\"btn.Data.CustomUi\"\r\n                [context]=\"btn\"\r\n                [isEnable]=\"btn.Command?._isEnable\"\r\n                (btnClick)=\"onToolClick(btn)\"\r\n            ></bnrc-dynamic-form-toolbaritem>\r\n            } @if (btn !== '-' && !btn.Data?.CustomUi?.Selector) {\r\n            <fd-button-bar\r\n                [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n                [label]=\"btn.text | bbbTranslate\"\r\n                [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n                (click)=\"onToolClick(btn)\"\r\n            ></fd-button-bar>\r\n            } }\r\n        </div>\r\n    </div>\r\n    } } \r\n</ng-template>\r\n<ng-template #buttonsMode>\r\n    @for (btn of workflowButtons; track btn; let i = $index) { @if (btn !== '-') {\r\n    <fd-button-bar\r\n        [attr.workflowButton]=\"true\"\r\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n        [label]=\"btn.text | bbbTranslate\"\r\n        [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n        (click)=\"onToolClick(btn)\"\r\n    ></fd-button-bar>\r\n    } }\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";:host{padding-bottom:env(safe-area-inset-bottom);padding-bottom:constant(safe-area-inset-bottom)}:host[rtl=true] fd-split-button{margin-left:.5rem}:host[rtl=false] fd-split-button{margin-right:.5rem}.forward button{min-width:6rem}.form-erja{padding-top:1rem;padding-bottom:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.FormNewComponent, selector: "bnrc-form-new", inputs: ["settings"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size", "role"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i5$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i5$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i5$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i5$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: LayoutActionsComponent, isStandalone: false, selector: "bsu-layout-actions", inputs: { workflowButtons: "workflowButtons", workflowButtonsComboMode: "workflowButtonsComboMode", canSend: "canSend", simple: "simple", footerDesign: "footerDesign" }, outputs: { workflowChoiceSelect: "workflowChoiceSelect" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"simple ? buttonsMode : defaultTemplate\"> </ng-container>\r\n<ng-template #defaultTemplate>\r\n    @if (visible) { @if (hasButtons()) {\r\n    <div fd-bar [barDesign]=\"footerDesign ? footerDesign : 'footer'\" [inPage]=\"true\">\r\n        @if (canSend && false) {\r\n        <div fd-bar-left>\r\n            <fd-bar-element class=\"forward\">\r\n                <fd-popover\r\n                    [focusTrapped]=\"true\"\r\n                    [focusAutoCapture]=\"true\"\r\n                    [closeOnOutsideClick]=\"false\"\r\n                    [scrollStrategy]=\"repositionScrollStrategy\"\r\n                    #forwardPopover\r\n                >\r\n                    <fd-popover-control class=\"forward\">\r\n                        <button fd-button [fdType]=\"'standard'\" [label]=\"'Forward' | bbbTranslate\"></button>\r\n                    </fd-popover-control>\r\n                    <fd-popover-body style=\"min-width: 30vw; max-width: 30vw; min-height: 30vh\">\r\n                        <div fd-popover-body-header>\r\n                            <div fd-bar barDesign=\"header\" [cozy]=\"true\">\r\n                                <div fd-bar-right>\r\n                                    <fd-bar-element\r\n                                        ><button\r\n                                            fd-button\r\n                                            (click)=\"forwardPopover.close()\"\r\n                                            [fdType]=\"'transparent'\"\r\n                                            [glyph]=\"'decline'\"\r\n                                        ></button>\r\n                                    </fd-bar-element>\r\n                                    <div fd-bar-left>\r\n                                        <fd-bar-element>\u0627\u0631\u062C\u0627\u0639 \u0641\u0631\u0645 \u0628\u0647 \u0634\u062E\u0635 \u062F\u06CC\u06AF\u0631 </fd-bar-element>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                        <bnrc-form-new\r\n                            class=\"form-erja\"\r\n                            [settings]=\"{\r\n                                MetaTypeDef: { Id: '', $Caption: '' },\r\n                                MetaView: { Id: '', $Caption: '' },\r\n                                DisableGenerateId: true\r\n                            }\"\r\n                        ></bnrc-form-new>\r\n                        <div fd-popover-body-footer>\r\n                            <div fd-bar barDesign=\"footer\" [cozy]=\"true\">\r\n                                <div fd-bar-right>\r\n                                    <fd-button-bar [label]=\"'Send' | bbbTranslate\" fdType=\"emphasized\"></fd-button-bar>\r\n                                    <fd-button-bar\r\n                                        [label]=\"'Cancel' | bbbTranslate\"\r\n                                        [fdType]=\"'transparent'\"\r\n                                        (click)=\"forwardPopover.close()\"\r\n                                    ></fd-button-bar>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </fd-popover-body>\r\n                </fd-popover>\r\n            </fd-bar-element>\r\n        </div>\r\n        }\r\n        <div fd-bar-right>\r\n            @if (workflowButtonsComboMode && workflowButtons.length) { @if(workflowButtons.length === 1){\r\n            <fd-button-bar\r\n                [fdType]=\"'emphasized'\"\r\n                [label]=\"workflowButtons[0].text | bbbTranslate\"\r\n                [glyph]=\"'accept'\"\r\n                (click)=\"onWorkflowButtonSelected(workflowButtons[0]); onAcceptWorkflow()\"\r\n            ></fd-button-bar>\r\n            } @else{\r\n            <button\r\n                fd-button\r\n                [fdMenu]=\"true\"\r\n                fdType=\"emphasized\"\r\n                [label]=\"selectedWorkflowButton?.text || 'Select' | bbbTranslate\"\r\n                [ariaLabel]=\"selectedWorkflowButton?.text || 'Select' | bbbTranslate\"\r\n                [fdMenuTrigger]=\"menu\"\r\n            ></button>\r\n            <fd-menu #menu>\r\n                @for (btn of workflowButtons; track btn) {\r\n                <li fd-menu-item (click)=\"menu.close(); onWorkflowButtonSelected(btn)\">\r\n                    <div fd-menu-interactive>\r\n                        <span fd-menu-title>{{ btn.text }}</span>\r\n                    </div>\r\n                </li>\r\n                }\r\n            </fd-menu>\r\n            <fd-button-bar\r\n                [fdType]=\"'positive'\"\r\n                [label]=\"'Send' | bbbTranslate\"\r\n                [disabled]=\"!selectedWorkflowButton\"\r\n                [glyph]=\"'accept'\"\r\n                (click)=\"onAcceptWorkflow()\"\r\n            ></fd-button-bar>\r\n            } }@for (btn of buttons; track btn; let i = $index) { @if (btn.Data?.CustomUi?.Selector) {\r\n            <bnrc-dynamic-form-toolbaritem\r\n                class=\"fd-bar__element\"\r\n                [component]=\"btn.Data.CustomUi\"\r\n                [context]=\"btn\"\r\n                [isEnable]=\"btn.Command?._isEnable\"\r\n                (btnClick)=\"onToolClick(btn)\"\r\n            ></bnrc-dynamic-form-toolbaritem>\r\n            } @if (btn !== '-' && !btn.Data?.CustomUi?.Selector) {\r\n            <fd-button-bar\r\n                [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n                [label]=\"btn.text | bbbTranslate\"\r\n                [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n                (click)=\"onToolClick(btn)\"\r\n            ></fd-button-bar>\r\n            } }\r\n        </div>\r\n    </div>\r\n    } } \r\n</ng-template>\r\n<ng-template #buttonsMode>\r\n    @for (btn of workflowButtons; track btn; let i = $index) { @if (btn !== '-') {\r\n    <fd-button-bar\r\n        [attr.workflowButton]=\"true\"\r\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n        [label]=\"btn.text | bbbTranslate\"\r\n        [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n        (click)=\"onToolClick(btn)\"\r\n    ></fd-button-bar>\r\n    } }\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";:host{padding-bottom:env(safe-area-inset-bottom);padding-bottom:constant(safe-area-inset-bottom)}:host[rtl=true] fd-split-button{margin-left:.5rem}:host[rtl=false] fd-split-button{margin-right:.5rem}.forward button{min-width:6rem}.form-erja{padding-top:1rem;padding-bottom:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.FormNewComponent, selector: "bnrc-form-new", inputs: ["settings"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size", "role"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i5$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i5$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i5$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i5$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LayoutActionsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-layout-actions', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container *ngTemplateOutlet=\"simple ? buttonsMode : defaultTemplate\"> </ng-container>\r\n<ng-template #defaultTemplate>\r\n    @if (visible) { @if (hasButtons) {\r\n    <div fd-bar [barDesign]=\"footerDesign ? footerDesign : 'footer'\" [inPage]=\"true\">\r\n        @if (canSend && false) {\r\n        <div fd-bar-left>\r\n            <fd-bar-element class=\"forward\">\r\n                <fd-popover\r\n                    [focusTrapped]=\"true\"\r\n                    [focusAutoCapture]=\"true\"\r\n                    [closeOnOutsideClick]=\"false\"\r\n                    [scrollStrategy]=\"repositionScrollStrategy\"\r\n                    #forwardPopover\r\n                >\r\n                    <fd-popover-control class=\"forward\">\r\n                        <button fd-button [fdType]=\"'standard'\" [label]=\"'Forward' | bbbTranslate\"></button>\r\n                    </fd-popover-control>\r\n                    <fd-popover-body style=\"min-width: 30vw; max-width: 30vw; min-height: 30vh\">\r\n                        <div fd-popover-body-header>\r\n                            <div fd-bar barDesign=\"header\" [cozy]=\"true\">\r\n                                <div fd-bar-right>\r\n                                    <fd-bar-element\r\n                                        ><button\r\n                                            fd-button\r\n                                            (click)=\"forwardPopover.close()\"\r\n                                            [fdType]=\"'transparent'\"\r\n                                            [glyph]=\"'decline'\"\r\n                                        ></button>\r\n                                    </fd-bar-element>\r\n                                    <div fd-bar-left>\r\n                                        <fd-bar-element>\u0627\u0631\u062C\u0627\u0639 \u0641\u0631\u0645 \u0628\u0647 \u0634\u062E\u0635 \u062F\u06CC\u06AF\u0631 </fd-bar-element>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                        <bnrc-form-new\r\n                            class=\"form-erja\"\r\n                            [settings]=\"{\r\n                                MetaTypeDef: { Id: '', $Caption: '' },\r\n                                MetaView: { Id: '', $Caption: '' },\r\n                                DisableGenerateId: true\r\n                            }\"\r\n                        ></bnrc-form-new>\r\n                        <div fd-popover-body-footer>\r\n                            <div fd-bar barDesign=\"footer\" [cozy]=\"true\">\r\n                                <div fd-bar-right>\r\n                                    <fd-button-bar [label]=\"'Send' | bbbTranslate\" fdType=\"emphasized\"></fd-button-bar>\r\n                                    <fd-button-bar\r\n                                        [label]=\"'Cancel' | bbbTranslate\"\r\n                                        [fdType]=\"'transparent'\"\r\n                                        (click)=\"forwardPopover.close()\"\r\n                                    ></fd-button-bar>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </fd-popover-body>\r\n                </fd-popover>\r\n            </fd-bar-element>\r\n        </div>\r\n        }\r\n        <div fd-bar-right>\r\n            @if (workflowButtonsComboMode && workflowButtons.length) { @if(workflowButtons.length === 1){\r\n            <fd-button-bar\r\n                [fdType]=\"'emphasized'\"\r\n                [label]=\"workflowButtons[0].text | bbbTranslate\"\r\n                [glyph]=\"'accept'\"\r\n                (click)=\"onWorkflowButtonSelected(workflowButtons[0]); onAcceptWorkflow()\"\r\n            ></fd-button-bar>\r\n            } @else{\r\n            <button\r\n                fd-button\r\n                [fdMenu]=\"true\"\r\n                fdType=\"emphasized\"\r\n                [label]=\"selectedWorkflowButton?.text || 'Select' | bbbTranslate\"\r\n                [ariaLabel]=\"selectedWorkflowButton?.text || 'Select' | bbbTranslate\"\r\n                [fdMenuTrigger]=\"menu\"\r\n            ></button>\r\n            <fd-menu #menu>\r\n                @for (btn of workflowButtons; track btn) {\r\n                <li fd-menu-item (click)=\"menu.close(); onWorkflowButtonSelected(btn)\">\r\n                    <div fd-menu-interactive>\r\n                        <span fd-menu-title>{{ btn.text }}</span>\r\n                    </div>\r\n                </li>\r\n                }\r\n            </fd-menu>\r\n            <fd-button-bar\r\n                [fdType]=\"'positive'\"\r\n                [label]=\"'Send' | bbbTranslate\"\r\n                [disabled]=\"!selectedWorkflowButton\"\r\n                [glyph]=\"'accept'\"\r\n                (click)=\"onAcceptWorkflow()\"\r\n            ></fd-button-bar>\r\n            } }@for (btn of buttons; track btn; let i = $index) { @if (btn.Data?.CustomUi?.Selector) {\r\n            <bnrc-dynamic-form-toolbaritem\r\n                class=\"fd-bar__element\"\r\n                [component]=\"btn.Data.CustomUi\"\r\n                [context]=\"btn\"\r\n                [isEnable]=\"btn.Command?._isEnable\"\r\n                (btnClick)=\"onToolClick(btn)\"\r\n            ></bnrc-dynamic-form-toolbaritem>\r\n            } @if (btn !== '-' && !btn.Data?.CustomUi?.Selector) {\r\n            <fd-button-bar\r\n                [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n                [label]=\"btn.text | bbbTranslate\"\r\n                [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n                (click)=\"onToolClick(btn)\"\r\n            ></fd-button-bar>\r\n            } }\r\n        </div>\r\n    </div>\r\n    } } \r\n</ng-template>\r\n<ng-template #buttonsMode>\r\n    @for (btn of workflowButtons; track btn; let i = $index) { @if (btn !== '-') {\r\n    <fd-button-bar\r\n        [attr.workflowButton]=\"true\"\r\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n        [label]=\"btn.text | bbbTranslate\"\r\n        [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n        (click)=\"onToolClick(btn)\"\r\n    ></fd-button-bar>\r\n    } }\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";:host{padding-bottom:env(safe-area-inset-bottom);padding-bottom:constant(safe-area-inset-bottom)}:host[rtl=true] fd-split-button{margin-left:.5rem}:host[rtl=false] fd-split-button{margin-right:.5rem}.forward button{min-width:6rem}.form-erja{padding-top:1rem;padding-bottom:1rem}\n"] }]
+            args: [{ selector: 'bsu-layout-actions', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container *ngTemplateOutlet=\"simple ? buttonsMode : defaultTemplate\"> </ng-container>\r\n<ng-template #defaultTemplate>\r\n    @if (visible) { @if (hasButtons()) {\r\n    <div fd-bar [barDesign]=\"footerDesign ? footerDesign : 'footer'\" [inPage]=\"true\">\r\n        @if (canSend && false) {\r\n        <div fd-bar-left>\r\n            <fd-bar-element class=\"forward\">\r\n                <fd-popover\r\n                    [focusTrapped]=\"true\"\r\n                    [focusAutoCapture]=\"true\"\r\n                    [closeOnOutsideClick]=\"false\"\r\n                    [scrollStrategy]=\"repositionScrollStrategy\"\r\n                    #forwardPopover\r\n                >\r\n                    <fd-popover-control class=\"forward\">\r\n                        <button fd-button [fdType]=\"'standard'\" [label]=\"'Forward' | bbbTranslate\"></button>\r\n                    </fd-popover-control>\r\n                    <fd-popover-body style=\"min-width: 30vw; max-width: 30vw; min-height: 30vh\">\r\n                        <div fd-popover-body-header>\r\n                            <div fd-bar barDesign=\"header\" [cozy]=\"true\">\r\n                                <div fd-bar-right>\r\n                                    <fd-bar-element\r\n                                        ><button\r\n                                            fd-button\r\n                                            (click)=\"forwardPopover.close()\"\r\n                                            [fdType]=\"'transparent'\"\r\n                                            [glyph]=\"'decline'\"\r\n                                        ></button>\r\n                                    </fd-bar-element>\r\n                                    <div fd-bar-left>\r\n                                        <fd-bar-element>\u0627\u0631\u062C\u0627\u0639 \u0641\u0631\u0645 \u0628\u0647 \u0634\u062E\u0635 \u062F\u06CC\u06AF\u0631 </fd-bar-element>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                        <bnrc-form-new\r\n                            class=\"form-erja\"\r\n                            [settings]=\"{\r\n                                MetaTypeDef: { Id: '', $Caption: '' },\r\n                                MetaView: { Id: '', $Caption: '' },\r\n                                DisableGenerateId: true\r\n                            }\"\r\n                        ></bnrc-form-new>\r\n                        <div fd-popover-body-footer>\r\n                            <div fd-bar barDesign=\"footer\" [cozy]=\"true\">\r\n                                <div fd-bar-right>\r\n                                    <fd-button-bar [label]=\"'Send' | bbbTranslate\" fdType=\"emphasized\"></fd-button-bar>\r\n                                    <fd-button-bar\r\n                                        [label]=\"'Cancel' | bbbTranslate\"\r\n                                        [fdType]=\"'transparent'\"\r\n                                        (click)=\"forwardPopover.close()\"\r\n                                    ></fd-button-bar>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </fd-popover-body>\r\n                </fd-popover>\r\n            </fd-bar-element>\r\n        </div>\r\n        }\r\n        <div fd-bar-right>\r\n            @if (workflowButtonsComboMode && workflowButtons.length) { @if(workflowButtons.length === 1){\r\n            <fd-button-bar\r\n                [fdType]=\"'emphasized'\"\r\n                [label]=\"workflowButtons[0].text | bbbTranslate\"\r\n                [glyph]=\"'accept'\"\r\n                (click)=\"onWorkflowButtonSelected(workflowButtons[0]); onAcceptWorkflow()\"\r\n            ></fd-button-bar>\r\n            } @else{\r\n            <button\r\n                fd-button\r\n                [fdMenu]=\"true\"\r\n                fdType=\"emphasized\"\r\n                [label]=\"selectedWorkflowButton?.text || 'Select' | bbbTranslate\"\r\n                [ariaLabel]=\"selectedWorkflowButton?.text || 'Select' | bbbTranslate\"\r\n                [fdMenuTrigger]=\"menu\"\r\n            ></button>\r\n            <fd-menu #menu>\r\n                @for (btn of workflowButtons; track btn) {\r\n                <li fd-menu-item (click)=\"menu.close(); onWorkflowButtonSelected(btn)\">\r\n                    <div fd-menu-interactive>\r\n                        <span fd-menu-title>{{ btn.text }}</span>\r\n                    </div>\r\n                </li>\r\n                }\r\n            </fd-menu>\r\n            <fd-button-bar\r\n                [fdType]=\"'positive'\"\r\n                [label]=\"'Send' | bbbTranslate\"\r\n                [disabled]=\"!selectedWorkflowButton\"\r\n                [glyph]=\"'accept'\"\r\n                (click)=\"onAcceptWorkflow()\"\r\n            ></fd-button-bar>\r\n            } }@for (btn of buttons; track btn; let i = $index) { @if (btn.Data?.CustomUi?.Selector) {\r\n            <bnrc-dynamic-form-toolbaritem\r\n                class=\"fd-bar__element\"\r\n                [component]=\"btn.Data.CustomUi\"\r\n                [context]=\"btn\"\r\n                [isEnable]=\"btn.Command?._isEnable\"\r\n                (btnClick)=\"onToolClick(btn)\"\r\n            ></bnrc-dynamic-form-toolbaritem>\r\n            } @if (btn !== '-' && !btn.Data?.CustomUi?.Selector) {\r\n            <fd-button-bar\r\n                [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n                [label]=\"btn.text | bbbTranslate\"\r\n                [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n                (click)=\"onToolClick(btn)\"\r\n            ></fd-button-bar>\r\n            } }\r\n        </div>\r\n    </div>\r\n    } } \r\n</ng-template>\r\n<ng-template #buttonsMode>\r\n    @for (btn of workflowButtons; track btn; let i = $index) { @if (btn !== '-') {\r\n    <fd-button-bar\r\n        [attr.workflowButton]=\"true\"\r\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n        [label]=\"btn.text | bbbTranslate\"\r\n        [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n        (click)=\"onToolClick(btn)\"\r\n    ></fd-button-bar>\r\n    } }\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";:host{padding-bottom:env(safe-area-inset-bottom);padding-bottom:constant(safe-area-inset-bottom)}:host[rtl=true] fd-split-button{margin-left:.5rem}:host[rtl=false] fd-split-button{margin-right:.5rem}.forward button{min-width:6rem}.form-erja{padding-top:1rem;padding-bottom:1rem}\n"] }]
         }], propDecorators: { workflowButtons: [{
                 type: Input
             }], workflowButtonsComboMode: [{
@@ -9392,7 +9401,7 @@ class FundamentalDynamicFormComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FundamentalDynamicFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FundamentalDynamicFormComponent, isStandalone: false, selector: "bsu-fundamental-dynamic-form", inputs: { breadCrumbs: "breadCrumbs", toolbarVisible: "toolbarVisible", toolbarItems: "toolbarItems", layoutActions: "layoutActions", layout94: "layout94", parameters: "parameters", workflowPanelUi: "workflowPanelUi", context: "context", title: "title", subtitle: "subtitle", description: "description", facetList: "facetList", infobars: "infobars", fieldDict: "fieldDict", removeHeaderBorder: "removeHeaderBorder", removeContentPadding: "removeContentPadding", isMobile: "isMobile", mo: "mo", avatar: "avatar", circleAvatar: "circleAvatar", hideBreadCrumb: "hideBreadCrumb", rtl: "rtl", hideFooter: "hideFooter", hideTitle: "hideTitle", hideClose: "hideClose", hidePin: "hidePin", fullscreen: "fullscreen", mask: "mask", canSend: "canSend", contentIsPage: "contentIsPage", contentDensity: "contentDensity", deviceSize: "deviceSize", dirValue: "dirValue", landscape: "landscape", standalone: "standalone", modernTabs: "modernTabs", modernTabContainerComponent: "modernTabContainerComponent", formVisibilityStatus: "formVisibilityStatus", layoutGridCol: "layoutGridCol", colLg: "colLg", colXl: "colXl", colMd: "colMd", footerDesign: "footerDesign", formContentMaxWidth: "formContentMaxWidth", workflowButtons: "workflowButtons" }, outputs: { toolbarClick: "toolbarClick", workflowChoiceClick: "workflowChoiceClick", close: "close", fullscreenRequest: "fullscreenRequest", dismissInfobar: "dismissInfobar" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true, static: true }, { propertyName: "_toolbarComponent", first: true, predicate: ["formToolbar"], descendants: true }, { propertyName: "titleRef", first: true, predicate: ["titleRef"], descendants: true, read: ViewContainerRef }, { propertyName: "headerAvatarRef", first: true, predicate: ["headerAvatar"], descendants: true }, { propertyName: "closeFormTemplate", first: true, predicate: ["closeForm"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (mask) {\r\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\r\n    <bsu-mask size=\"m\"></bsu-mask>\r\n</div>\r\n}\r\n\r\n<fd-dynamic-page\r\n    [size]=\"isMobile ? 'small' : 'large'\"\r\n    [ngClass]=\"{ 'floating-footer': footerDesign === 'floating-footer' }\"\r\n    [class.header-border]=\"!removeHeaderBorder\"\r\n    [attr.isMobile]=\"isMobile\"\r\n    [attr.contentIsPage]=\"contentIsPage\"\r\n    mobile\r\n    formClose\r\n    [isMobile]=\"isMobile\"\r\n>\r\n    <fd-dynamic-page-header\r\n        [class.simple-title]=\"!description\"\r\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\r\n        [class.notitle]=\"title.length < 2 || hideTitle\"\r\n        [class.p-b0]=\"removeContentPadding\"\r\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\r\n        [class.hide-breadcrumb]=\"hideBreadCrumb\"\r\n        [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\r\n        [mWidthTitle]=\"title\"\r\n        #titleRef\r\n    >\r\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile || hideBreadCrumb\">\r\n            <fd-breadcrumb>\r\n                @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\r\n                breadCrumb.url; let i = $index; let last = $last) {\r\n                <fd-breadcrumb-item>\r\n                    <bsu-breadcrumb\r\n                        [index]=\"i\"\r\n                        [isLast]=\"last\"\r\n                        [breadCrumb]=\"breadCrumb\"\r\n                        [allBreadCrumb]=\"breadCrumbs\"\r\n                    ></bsu-breadcrumb>\r\n                </fd-breadcrumb-item>\r\n                } }\r\n            </fd-breadcrumb>\r\n        </fd-dynamic-page-breadcrumb>\r\n        <fd-dynamic-page-global-actions>\r\n            <!-- global actions -->\r\n\r\n            <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\r\n            <!-- added this because in mobile landscape toolbar disapper -->\r\n            @if (toolbarVisible) {\r\n            <bsu-form-toolbar\r\n                [deviceSize]=\"deviceSize\"\r\n                [buttons]=\"toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter\"\r\n                [dirValue]=\"dirValue\"\r\n                [isFirefox]=\"isFirefox\"\r\n                (toolbarClick)=\"toolbarClick.emit($event)\"\r\n                #formToolbar\r\n            ></bsu-form-toolbar>\r\n            }\r\n        </fd-dynamic-page-global-actions>\r\n        <fd-dynamic-page-layout-actions>\r\n            <!-- layout actions -->\r\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\r\n            @if (!hideClose) {\r\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\r\n                @if (deviceSize !== 's') {\r\n                <fd-toolbar-separator></fd-toolbar-separator>\r\n                }\r\n                <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\r\n            </fd-toolbar>\r\n            }\r\n        </fd-dynamic-page-layout-actions>\r\n    </fd-dynamic-page-header>\r\n    @if (description || facetList.length > 0 || workflowInfoText || avatar || infobars.length) {}\r\n    <fd-dynamic-page-subheader\r\n        [class.header-no-description]=\"!(description || workflowInfoText || infobars.length)\"\r\n        [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText && !infobars.length)\"\r\n        [collapsible]=\"true\"\r\n        [pinnable]=\"false\"\r\n        [collapsed]=\"!facetList?.length && !workflowInfoText && !infobars.length\"\r\n    >\r\n        @if (workflowInfoText) {\r\n        <fd-message-strip\r\n            [type]=\"'warning'\"\r\n            [dismissible]=\"false\"\r\n            [innerHtml]=\"workflowInfoText | bbbTranslate | sanitizeText\"\r\n        >\r\n        </fd-message-strip>\r\n        }\r\n        <bsu-barsa-infobars [infobars]=\"infobars\" (dismiss)=\"dismissInfobar.emit($event)\"></bsu-barsa-infobars>\r\n        <fd-facet-group ariaLabel=\"Facet Group\">\r\n            @if (avatar) {\r\n            <fd-facet type=\"image\">\r\n                <fd-avatar\r\n                    title=\"avatar\"\r\n                    [glyph]=\"avatar\"\r\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\r\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\r\n                    [transparent]=\"true\"\r\n                    [circle]=\"circleAvatar\"\r\n                ></fd-avatar>\r\n                <!-- <div\r\n                  class=\"fd-avatar fd-avatar--circle\"\r\n                  [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\r\n                  >\r\n                  <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\r\n                </div> -->\r\n            </fd-facet>\r\n            } @for (facet of facetList; track facet) {\r\n            <fd-facet\r\n                [type]=\"facet.type\"\r\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\r\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\r\n            >\r\n                @for (item of facet.mo.ItemList?.MoDataList; track item) {\r\n                <fd-facet-content>\r\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title | bbbTranslate }}</label>\r\n                    <fd-text [text]=\"item.Value | facetValue | bbbTranslate\" id=\"form-value-10\"></fd-text>\r\n                </fd-facet-content>\r\n                } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\r\n                <span\r\n                    fd-object-status\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue | bbbTranslate)\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [title]=\"facet.mo.Text | facetValue | bbbTranslate\"\r\n                    [aria-label]=\"facet.mo.Text | facetValue | bbbTranslate\"\r\n                    [glyph]=\"facet.mo.Icon\"\r\n                >\r\n                </span>\r\n                } @else {\r\n                <bnrc-dynamic-component\r\n                    [class]=\"'fd-object-status fd-object-status--' + facet.mo.Status | facetValue\"\r\n                    [class.fd-object-status--large]=\"facet.mo.IsLarge\"\r\n                    [component]=\"facet.mo.Component\"\r\n                    [value]=\"facet.mo.Text | bbbTranslate\"\r\n                ></bnrc-dynamic-component>\r\n                } @if (facet.mo.IsNumber && facet.type === 'key-value') {\r\n                <fd-object-number\r\n                    [number]=\"facet.mo.Text | facetValue\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [unit]=\"facet.mo.Unit | facetValue | bbbTranslate\"\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [decimal]=\"facet.mo.DecimalValue | facetValue\"\r\n                ></fd-object-number>\r\n                } @if (facet.type === 'plain-text') {\r\n                <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\r\n                    <fd-text [text]=\"facet.mo.Text | facetValue | bbbTranslate\" hyphenation=\"auto\"></fd-text>\r\n                </div>\r\n                } @if (facet.type === 'rating-indicator') {\r\n                <fd-facet-content>\r\n                    <fd-rating-indicator\r\n                        style=\"pointer-events: none\"\r\n                        size=\"md\"\r\n                        [dynamicTextIndicator]=\"facet.mo.Footer | bbbTranslate\"\r\n                        [displayMode]=\"true\"\r\n                        [value]=\"facet.mo | facetValue: facet.type\"\r\n                    ></fd-rating-indicator>\r\n                </fd-facet-content>\r\n                } @if (facet.type === 'progress') {\r\n                <div [style.width]=\"'10rem'\">\r\n                    <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\r\n                    <fd-progress-indicator\r\n                        class=\"facet-progress\"\r\n                        style=\"width: 10r em\"\r\n                        [state]=\"facet.mo.State\"\r\n                        [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647' | bbbTranslate\"\r\n                        [valueNow]=\"facet.mo | facetValue: facet.type\"\r\n                        [valueMax]=\"10\"\r\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\r\n                    ></fd-progress-indicator>\r\n                    <!-- <ui5-progress-indicator\r\n                    style=\"width: 10rem\"\r\n                    [valueState]=\"facet.mo.State\"\r\n                    [value]=\"getNumber(facet.mo.Value)\"\r\n                  ></ui5-progress-indicator> -->\r\n                </div>\r\n                } @if (facet.type === 'microcharts') {\r\n                <div>\r\n                    <label wrap>in progress ...</label>\r\n                </div>\r\n                }\r\n            </fd-facet>\r\n            }\r\n        </fd-facet-group>\r\n        @if (description) {\r\n        <span>{{ description | bbbTranslate }}</span>\r\n        }\r\n    </fd-dynamic-page-subheader>\r\n    @if((!modernTabs.length && !contentIsPage) || (modernTabs.length && !contentIsPage && parameters?.LayoutComponent))\r\n    {\r\n    <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\r\n        <fd-layout-grid class=\"!tw-p-0\" style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\r\n            <div fdLayoutGridRow class=\"!tw-p-0\">\r\n                <div\r\n                    class=\"!tw-p-0\"\r\n                    [class.hide]=\"layout2.colXl === 0\"\r\n                    [class.hide]=\"disableGrid\"\r\n                    [fdLayoutGridCol]=\"0\"\r\n                    [colMd]=\"layout1.colMd\"\r\n                    [colLg]=\"layout1.colLg\"\r\n                    [colXl]=\"layout1.colXl\"\r\n                ></div>\r\n                <div class=\"!tw-p-0\" [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\r\n                            context: {\r\n                                $implicit: parameters?.LayoutComponent,\r\n                                layout94: layout94\r\n                            }\r\n                        \"\r\n                    ></ng-container>\r\n                </div>\r\n                <div\r\n                    class=\"!tw-p-0\"\r\n                    [class.hide]=\"disableGrid\"\r\n                    [class.hide]=\"layout2.colXl === 0\"\r\n                    [fdLayoutGridCol]=\"0\"\r\n                    [colMd]=\"layout2.colMd\"\r\n                    [colLg]=\"layout2.colLg\"\r\n                    [colXl]=\"layout2.colXl\"\r\n                ></div>\r\n            </div>\r\n        </fd-layout-grid>\r\n    </fd-dynamic-page-content>\r\n    } @else if(modernTabs.length && !contentIsPage && !parameters?.LayoutComponent){\r\n    <fdp-icon-tab-bar\r\n        [stackContent]=\"false\"\r\n        [collapseOverflow]=\"true\"\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        [iconTabType]=\"modernTabContainerComponent?.Settings?.TabType.$Caption || 'text'\"\r\n        [layoutMode]=\"modernTabContainerComponent?.Settings?.LayoutMode$Caption\"\r\n    >\r\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\r\n        <fdp-icon-tab-bar-tab\r\n            [id]=\"tab.id\"\r\n            [label]=\"tab.Title!! | bbbTranslate\"\r\n            [title]=\"tab.Title!! | bbbTranslate\"\r\n            [color]=\"tab.SemanticColor?.$Caption\"\r\n            [icon]=\"tab.FontIcon\"\r\n            [iconFont]=\"tab.IconFontName?.$Caption\"\r\n            [counter]=\"tab.CustomUi?.Settings?.CounterValue\"\r\n            [class.is-expanded]=\"selectedTab === tab.Title\"\r\n            #tablist\r\n        >\r\n            <fd-dynamic-page-content [id]=\"tab.id\" [class.limit-content-width]=\"formContentMaxWidth > 0\">\r\n                <fd-layout-grid [style.max-width.px]=\"formContentMaxWidth\" class=\"!tw-p-0\">\r\n                    <div fdLayoutGridRow>\r\n                        <div\r\n                            class=\"!tw-p-0\"\r\n                            [fdLayoutGridCol]=\"0\"\r\n                            [colMd]=\"layout1.colMd\"\r\n                            [colLg]=\"layout1.colLg\"\r\n                            [colXl]=\"layout1.colXl\"\r\n                            [class.hide]=\"disableGrid\"\r\n                        ></div>\r\n                        <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\" class=\"!tw-p-0\">\r\n                            <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\r\n                        </div>\r\n                        <div\r\n                            class=\"!tw-p-0\"\r\n                            [fdLayoutGridCol]=\"0\"\r\n                            [colMd]=\"layout2.colMd\"\r\n                            [colLg]=\"layout2.colLg\"\r\n                            [colXl]=\"layout2.colXl\"\r\n                            [class.hide]=\"disableGrid\"\r\n                        ></div>\r\n                    </div>\r\n                </fd-layout-grid>\r\n            </fd-dynamic-page-content>\r\n        </fdp-icon-tab-bar-tab>\r\n        }\r\n    </fdp-icon-tab-bar>\r\n    } @if(!hideFooter && hasLayoutButtons){\r\n    <fd-dynamic-page-footer>\r\n        <ng-container *ngTemplateOutlet=\"layoutActionsTemplateRef\"></ng-container>\r\n    </fd-dynamic-page-footer>\r\n    }\r\n</fd-dynamic-page>\r\n@if (contentIsPage) {\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderLayoutComponent;\r\n        context: {\r\n            $implicit: parameters?.LayoutComponent,\r\n            layout94: layout94\r\n        }\r\n    \"\r\n></ng-container>\r\n}\r\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\r\n    <bsu-ly-layout-container-of-root\r\n        [config]=\"layout94\"\r\n        [isPanel]=\"false\"\r\n        [isRoot]=\"true\"\r\n    ></bsu-ly-layout-container-of-root>\r\n</ng-template>\r\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\r\n    <bnrc-dynamic-form-component\r\n        [component]=\"component\"\r\n        [layoutActionsTemplateRef]=\"layoutActionsTemplateRef\"\r\n        [removeContentPadding]=\"removeContentPadding\"\r\n        [breadCrumbs]=\"breadCrumbs\"\r\n        [description]=\"description\"\r\n        [title]=\"title\"\r\n        [subtitle]=\"subtitle\"\r\n        [toolbarItems]=\"toolbarItems\"\r\n        [layoutActions]=\"layoutActions\"\r\n        [footerDesign]=\"footerDesign\"\r\n        [facetList]=\"facetList\"\r\n        [settings]=\"component.Settings\"\r\n        [workflowButtons]=\"workflowButtons\"\r\n        [workflowPanelUi]=\"workflowPanelUi\"\r\n        [isMobile]=\"isMobile\"\r\n        [mo]=\"mo\"\r\n        [layout94]=\"layout94\"\r\n        [context]=\"context\"\r\n        [rtl]=\"rtl\"\r\n        [fieldDict]=\"fieldDict\"\r\n        [mask]=\"mask\"\r\n        [dirValue]=\"dirValue\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [modernTabs]=\"modernTabs\"\r\n        [avatar]=\"avatar\"\r\n        (events)=\"onDynamicComponentEvents($event)\"\r\n    ></bnrc-dynamic-form-component>\r\n</ng-template>\r\n<ng-template #closeForm>\r\n    <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\r\n        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\r\n    </button>\r\n</ng-template>\r\n<ng-template #fullscreenForm>\r\n    @if (canFullscreen) {\r\n    <button\r\n        fd-button\r\n        fdType=\"transparent\"\r\n        [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\r\n        (click)=\"fullscreenRequest.emit()\"\r\n        [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\r\n        [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\r\n    ></button>\r\n    }\r\n</ng-template>\r\n<ng-template #layoutActionsTemplateRef>\r\n    <bsu-layout-actions\r\n        [canSend]=\"canSend\"\r\n        [buttons]=\"layoutActions\"\r\n        [isMobile]=\"isMobile\"\r\n        [landscape]=\"landscape\"\r\n        [standalone]=\"standalone\"\r\n        [footerDesign]=\"footerDesign\"\r\n        [workflowButtons]=\"workflowButtons\"\r\n        [workflowButtonsComboMode]=\"workflowButtonsComboMode || worfklowButtonsOnFooter\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [rtl]=\"rtl\"\r\n        (toolClick)=\"toolbarClick.emit($event)\"\r\n        (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\r\n    >\r\n    </bsu-layout-actions>\r\n</ng-template>\r\n", styles: [":host{display:block;height:auto;width:100%}:host>fd-dynamic-page[contentispage=false]:not([ismobile=true]) ::ng-deep fd-dynamic-page-header .fd-dynamic-page__title{max-width:50svw}:host ::ng-deep .fd-facet .fd-title{font-family:B-Font Medium}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important}:host ::ng-deep .facet-progress .fd-progress-indicator__container,:host ::ng-deep .facet-progress .fd-progress-indicator__progress-bar{height:1.5rem}:host ::ng-deep fd-facet .fd-object-status--large{font-size:1.1rem}.no-toolbar-items ::ng-deep .fd-dynamic-page__toolbar-container{width:auto}fd-dynamic-page[ismobile=true] fd-dynamic-page-header.notitle ::ng-deep .fd-dynamic-page__title{width:auto}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%;overflow:hidden}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded bsu-ly-layout-container-of-root{min-height:100%}fd-dynamic-page ::ng-deep>article>.fd-scrollbar{height:inherit}fd-dynamic-page fd-dynamic-page-content.limit-content-width{display:flex;justify-content:center}fd-facet{display:flex;flex-direction:column}.hide-title ::ng-deep .fd-dynamic-page__title-container{display:none!important}.hide-title.hide-breadcrumb{display:none}.no-pin ::ng-deep .fd-dynamic-page__collapsible-header-visibility-container,.no-pin ::ng-deep .fd-dynamic-page__collapsible-header{display:none!important}fd-toolbar.firefox ::ng-deep .fd-toolbar{flex-direction:row-reverse}fd-toolbar.firefox ::ng-deep .fd-toolbar>:first-child{margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicFormComponent, selector: "bnrc-dynamic-form-component", inputs: ["breadCrumbs", "toolbarVisible", "toolbarItems", "layoutActions", "layoutActionsTemplateRef", "workflowButtons", "layout94", "footerDesign", "settings", "workflowPanelUi", "title", "subtitle", "description", "facetList", "removeHeaderBorder", "removeContentPadding", "isMobile", "avatar", "rtl", "mask", "mo", "contentDensity", "deviceSize", "dirValue", "fieldDict", "modernTabs"] }, { kind: "component", type: i2.BaseDynamicComponent, selector: "bnrc-dynamic-component", inputs: ["component", "value"], outputs: ["events"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i2.MeasureFormTitleWidthDirective, selector: "[mWidthTitle]", inputs: ["mWidthTitle"] }, { kind: "directive", type: i3$1.ɵɵCdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i4$6.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i4$6.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i8$1.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i8$1.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i8$1.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i8$1.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i8$1.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i8$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i8$1.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i8$1.DynamicPageBreadcrumbComponent, selector: "fd-dynamic-page-breadcrumb" }, { kind: "component", type: i8$2.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "headingLevel", "id", "alignEnd"] }, { kind: "component", type: i8$2.FacetGroupComponent, selector: "fd-facet-group", inputs: ["ariaLabel"] }, { kind: "component", type: i8$2.FacetContentComponent, selector: "fd-facet-content" }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i4$4.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$4.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$4.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i2$8.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "dismissBtnTitle", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i5$6.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i14.RatingIndicatorComponent, selector: "fd-rating-indicator", inputs: ["class", "name", "ariaLabel", "ariaLabelledBy", "disabled", "displayMode", "nonInteractive", "indicatorCapacity", "allowHalves", "value", "totalRatings", "ratingAverage", "ratings", "displayAllRatings", "ratedIcon", "unratedIcon", "size", "dynamicTextIndicator"], outputs: ["ratingChanged"] }, { kind: "component", type: i5$3.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "component", type: i12$1.ProgressIndicatorComponent, selector: "fd-progress-indicator", inputs: ["valueText", "unit", "valueMin", "valueMax", "valueNow", "state", "animate"] }, { kind: "component", type: i18.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "tabHeadingLevel", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "settings", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i18.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: LyLayoutContainerOfRootComponent, selector: "bsu-ly-layout-container-of-root" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: ["renderItems", "tablist"] }, { kind: "component", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: ["workflowButtons", "workflowButtonsComboMode", "canSend", "simple", "footerDesign"], outputs: ["workflowChoiceSelect"] }, { kind: "component", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "component", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: ["toolbarClick"] }, { kind: "component", type: BarsaInfobarsComponent, selector: "bsu-barsa-infobars", inputs: ["infobars"], outputs: ["dismiss"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.HeaderFacetValuePipe, name: "facetValue" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.SanitizeTextPipe, name: "sanitizeText" }, { kind: "pipe", type: i2.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FundamentalDynamicFormComponent, isStandalone: false, selector: "bsu-fundamental-dynamic-form", inputs: { breadCrumbs: "breadCrumbs", toolbarVisible: "toolbarVisible", toolbarItems: "toolbarItems", layoutActions: "layoutActions", layout94: "layout94", parameters: "parameters", workflowPanelUi: "workflowPanelUi", context: "context", title: "title", subtitle: "subtitle", description: "description", facetList: "facetList", infobars: "infobars", fieldDict: "fieldDict", removeHeaderBorder: "removeHeaderBorder", removeContentPadding: "removeContentPadding", isMobile: "isMobile", mo: "mo", avatar: "avatar", circleAvatar: "circleAvatar", hideBreadCrumb: "hideBreadCrumb", rtl: "rtl", hideFooter: "hideFooter", hideTitle: "hideTitle", hideClose: "hideClose", hidePin: "hidePin", fullscreen: "fullscreen", mask: "mask", canSend: "canSend", contentIsPage: "contentIsPage", contentDensity: "contentDensity", deviceSize: "deviceSize", dirValue: "dirValue", landscape: "landscape", standalone: "standalone", modernTabs: "modernTabs", modernTabContainerComponent: "modernTabContainerComponent", formVisibilityStatus: "formVisibilityStatus", layoutGridCol: "layoutGridCol", colLg: "colLg", colXl: "colXl", colMd: "colMd", footerDesign: "footerDesign", formContentMaxWidth: "formContentMaxWidth", workflowButtons: "workflowButtons" }, outputs: { toolbarClick: "toolbarClick", workflowChoiceClick: "workflowChoiceClick", close: "close", fullscreenRequest: "fullscreenRequest", dismissInfobar: "dismissInfobar" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true, static: true }, { propertyName: "_toolbarComponent", first: true, predicate: ["formToolbar"], descendants: true }, { propertyName: "titleRef", first: true, predicate: ["titleRef"], descendants: true, read: ViewContainerRef }, { propertyName: "headerAvatarRef", first: true, predicate: ["headerAvatar"], descendants: true }, { propertyName: "closeFormTemplate", first: true, predicate: ["closeForm"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (mask) {\r\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\r\n    <bsu-mask size=\"m\"></bsu-mask>\r\n</div>\r\n}\r\n\r\n<fd-dynamic-page\r\n    [size]=\"isMobile ? 'small' : 'large'\"\r\n    [ngClass]=\"{ 'floating-footer': footerDesign === 'floating-footer' }\"\r\n    [class.header-border]=\"!removeHeaderBorder\"\r\n    [attr.isMobile]=\"isMobile\"\r\n    [attr.contentIsPage]=\"contentIsPage\"\r\n    mobile\r\n    formClose\r\n    [isMobile]=\"isMobile\"\r\n>\r\n    <fd-dynamic-page-header\r\n        [class.simple-title]=\"!description\"\r\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\r\n        [class.notitle]=\"title.length < 2 || hideTitle\"\r\n        [class.p-b0]=\"removeContentPadding\"\r\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\r\n        [class.hide-breadcrumb]=\"hideBreadCrumb\"\r\n        [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\r\n        [mWidthTitle]=\"title\"\r\n        #titleRef\r\n    >\r\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile || hideBreadCrumb\">\r\n            <fd-breadcrumb>\r\n                @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\r\n                breadCrumb.url; let i = $index; let last = $last) {\r\n                <fd-breadcrumb-item>\r\n                    <bsu-breadcrumb\r\n                        [index]=\"i\"\r\n                        [isLast]=\"last\"\r\n                        [breadCrumb]=\"breadCrumb\"\r\n                        [allBreadCrumb]=\"breadCrumbs\"\r\n                    ></bsu-breadcrumb>\r\n                </fd-breadcrumb-item>\r\n                } }\r\n            </fd-breadcrumb>\r\n        </fd-dynamic-page-breadcrumb>\r\n        <fd-dynamic-page-global-actions>\r\n            <!-- global actions -->\r\n\r\n            <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\r\n            <!-- added this because in mobile landscape toolbar disapper -->\r\n            @if (toolbarVisible) {\r\n            <bsu-form-toolbar\r\n                [deviceSize]=\"deviceSize\"\r\n                [buttons]=\"toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter\"\r\n                [dirValue]=\"dirValue\"\r\n                [isFirefox]=\"isFirefox\"\r\n                (toolbarClick)=\"toolbarClick.emit($event)\"\r\n                #formToolbar\r\n            ></bsu-form-toolbar>\r\n            }\r\n        </fd-dynamic-page-global-actions>\r\n        <fd-dynamic-page-layout-actions>\r\n            <!-- layout actions -->\r\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\r\n            @if (!hideClose) {\r\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\r\n                @if (deviceSize !== 's') {\r\n                <fd-toolbar-separator></fd-toolbar-separator>\r\n                }\r\n                <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\r\n            </fd-toolbar>\r\n            }\r\n        </fd-dynamic-page-layout-actions>\r\n    </fd-dynamic-page-header>\r\n    @if (description || facetList.length > 0 || workflowInfoText || avatar || infobars.length) {}\r\n    <fd-dynamic-page-subheader\r\n        [class.header-no-description]=\"!(description || workflowInfoText || infobars.length)\"\r\n        [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText && !infobars.length)\"\r\n        [collapsible]=\"true\"\r\n        [pinnable]=\"false\"\r\n        [collapsed]=\"!facetList?.length && !workflowInfoText && !infobars.length\"\r\n    >\r\n        @if (workflowInfoText) {\r\n        <fd-message-strip\r\n            [type]=\"'warning'\"\r\n            [dismissible]=\"false\"\r\n            [innerHtml]=\"workflowInfoText | bbbTranslate | sanitizeText\"\r\n        >\r\n        </fd-message-strip>\r\n        }\r\n        <bsu-barsa-infobars [infobars]=\"infobars\" (dismiss)=\"dismissInfobar.emit($event)\"></bsu-barsa-infobars>\r\n        <fd-facet-group ariaLabel=\"Facet Group\">\r\n            @if (avatar) {\r\n            <fd-facet type=\"image\">\r\n                <fd-avatar\r\n                    title=\"avatar\"\r\n                    [glyph]=\"avatar\"\r\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\r\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\r\n                    [transparent]=\"true\"\r\n                    [circle]=\"circleAvatar\"\r\n                ></fd-avatar>\r\n                <!-- <div\r\n                  class=\"fd-avatar fd-avatar--circle\"\r\n                  [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\r\n                  >\r\n                  <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\r\n                </div> -->\r\n            </fd-facet>\r\n            } @for (facet of facetList; track facet) {\r\n            <fd-facet\r\n                [type]=\"facet.type\"\r\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\r\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\r\n            >\r\n                @for (item of facet.mo.ItemList?.MoDataList; track item) {\r\n                <fd-facet-content>\r\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title | bbbTranslate }}</label>\r\n                    <fd-text [text]=\"item.Value | facetValue | bbbTranslate\" id=\"form-value-10\"></fd-text>\r\n                </fd-facet-content>\r\n                } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\r\n                <span\r\n                    fd-object-status\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue | bbbTranslate)\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [title]=\"facet.mo.Text | facetValue | bbbTranslate\"\r\n                    [aria-label]=\"facet.mo.Text | facetValue | bbbTranslate\"\r\n                    [glyph]=\"facet.mo.Icon\"\r\n                >\r\n                </span>\r\n                } @else {\r\n                <bnrc-dynamic-component\r\n                    [class]=\"'fd-object-status fd-object-status--' + facet.mo.Status | facetValue\"\r\n                    [class.fd-object-status--large]=\"facet.mo.IsLarge\"\r\n                    [component]=\"facet.mo.Component\"\r\n                    [value]=\"facet.mo.Text | bbbTranslate\"\r\n                ></bnrc-dynamic-component>\r\n                } @if (facet.mo.IsNumber && facet.type === 'key-value') {\r\n                <fd-object-number\r\n                    [number]=\"facet.mo.Text | facetValue\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [unit]=\"facet.mo.Unit | facetValue | bbbTranslate\"\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [decimal]=\"facet.mo.DecimalValue | facetValue\"\r\n                ></fd-object-number>\r\n                } @if (facet.type === 'plain-text') {\r\n                <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\r\n                    <fd-text [text]=\"facet.mo.Text | facetValue | bbbTranslate\" hyphenation=\"auto\"></fd-text>\r\n                </div>\r\n                } @if (facet.type === 'rating-indicator') {\r\n                <fd-facet-content>\r\n                    <fd-rating-indicator\r\n                        style=\"pointer-events: none\"\r\n                        size=\"md\"\r\n                        [dynamicTextIndicator]=\"facet.mo.Footer | bbbTranslate\"\r\n                        [displayMode]=\"true\"\r\n                        [value]=\"facet.mo | facetValue: facet.type\"\r\n                    ></fd-rating-indicator>\r\n                </fd-facet-content>\r\n                } @if (facet.type === 'progress') {\r\n                <div [style.width]=\"'10rem'\">\r\n                    <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\r\n                    <fd-progress-indicator\r\n                        class=\"facet-progress\"\r\n                        style=\"width: 10r em\"\r\n                        [state]=\"facet.mo.State\"\r\n                        [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647' | bbbTranslate\"\r\n                        [valueNow]=\"facet.mo | facetValue: facet.type\"\r\n                        [valueMax]=\"10\"\r\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\r\n                    ></fd-progress-indicator>\r\n                    <!-- <ui5-progress-indicator\r\n                    style=\"width: 10rem\"\r\n                    [valueState]=\"facet.mo.State\"\r\n                    [value]=\"getNumber(facet.mo.Value)\"\r\n                  ></ui5-progress-indicator> -->\r\n                </div>\r\n                } @if (facet.type === 'microcharts') {\r\n                <div>\r\n                    <label wrap>in progress ...</label>\r\n                </div>\r\n                }\r\n            </fd-facet>\r\n            }\r\n        </fd-facet-group>\r\n        @if (description) {\r\n        <span>{{ description | bbbTranslate }}</span>\r\n        }\r\n    </fd-dynamic-page-subheader>\r\n    @if((!modernTabs.length && !contentIsPage) || (modernTabs.length && !contentIsPage && parameters?.LayoutComponent))\r\n    {\r\n    <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\r\n        <fd-layout-grid class=\"!tw-p-0\" style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\r\n            <div fdLayoutGridRow class=\"!tw-p-0\">\r\n                <div\r\n                    class=\"!tw-p-0\"\r\n                    [class.hide]=\"layout2.colXl === 0\"\r\n                    [class.hide]=\"disableGrid\"\r\n                    [fdLayoutGridCol]=\"0\"\r\n                    [colMd]=\"layout1.colMd\"\r\n                    [colLg]=\"layout1.colLg\"\r\n                    [colXl]=\"layout1.colXl\"\r\n                ></div>\r\n                <div class=\"!tw-p-0\" [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\r\n                            context: {\r\n                                $implicit: parameters?.LayoutComponent,\r\n                                layout94: layout94\r\n                            }\r\n                        \"\r\n                    ></ng-container>\r\n                </div>\r\n                <div\r\n                    class=\"!tw-p-0\"\r\n                    [class.hide]=\"disableGrid\"\r\n                    [class.hide]=\"layout2.colXl === 0\"\r\n                    [fdLayoutGridCol]=\"0\"\r\n                    [colMd]=\"layout2.colMd\"\r\n                    [colLg]=\"layout2.colLg\"\r\n                    [colXl]=\"layout2.colXl\"\r\n                ></div>\r\n            </div>\r\n        </fd-layout-grid>\r\n    </fd-dynamic-page-content>\r\n    } @else if(modernTabs.length && !contentIsPage && !parameters?.LayoutComponent){\r\n    <fdp-icon-tab-bar\r\n        [stackContent]=\"false\"\r\n        [collapseOverflow]=\"true\"\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        [iconTabType]=\"modernTabContainerComponent?.Settings?.TabType.$Caption || 'text'\"\r\n        [layoutMode]=\"modernTabContainerComponent?.Settings?.LayoutMode$Caption\"\r\n    >\r\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\r\n        <fdp-icon-tab-bar-tab\r\n            [id]=\"tab.id\"\r\n            [label]=\"tab.Title!! | bbbTranslate\"\r\n            [title]=\"tab.Title!! | bbbTranslate\"\r\n            [color]=\"tab.SemanticColor?.$Caption\"\r\n            [icon]=\"tab.FontIcon\"\r\n            [iconFont]=\"tab.IconFontName?.$Caption\"\r\n            [counter]=\"tab.CustomUi?.Settings?.CounterValue\"\r\n            [class.is-expanded]=\"selectedTab === tab.Title\"\r\n            #tablist\r\n        >\r\n            <fd-dynamic-page-content [id]=\"tab.id\" [class.limit-content-width]=\"formContentMaxWidth > 0\">\r\n                <fd-layout-grid [style.max-width.px]=\"formContentMaxWidth\" class=\"!tw-p-0\">\r\n                    <div fdLayoutGridRow>\r\n                        <div\r\n                            class=\"!tw-p-0\"\r\n                            [fdLayoutGridCol]=\"0\"\r\n                            [colMd]=\"layout1.colMd\"\r\n                            [colLg]=\"layout1.colLg\"\r\n                            [colXl]=\"layout1.colXl\"\r\n                            [class.hide]=\"disableGrid\"\r\n                        ></div>\r\n                        <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\" class=\"!tw-p-0\">\r\n                            <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\r\n                        </div>\r\n                        <div\r\n                            class=\"!tw-p-0\"\r\n                            [fdLayoutGridCol]=\"0\"\r\n                            [colMd]=\"layout2.colMd\"\r\n                            [colLg]=\"layout2.colLg\"\r\n                            [colXl]=\"layout2.colXl\"\r\n                            [class.hide]=\"disableGrid\"\r\n                        ></div>\r\n                    </div>\r\n                </fd-layout-grid>\r\n            </fd-dynamic-page-content>\r\n        </fdp-icon-tab-bar-tab>\r\n        }\r\n    </fdp-icon-tab-bar>\r\n    } @if(!hideFooter && hasLayoutButtons){\r\n    <fd-dynamic-page-footer>\r\n        <ng-container *ngTemplateOutlet=\"layoutActionsTemplateRef\"></ng-container>\r\n    </fd-dynamic-page-footer>\r\n    }\r\n</fd-dynamic-page>\r\n@if (contentIsPage) {\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderLayoutComponent;\r\n        context: {\r\n            $implicit: parameters?.LayoutComponent,\r\n            layout94: layout94\r\n        }\r\n    \"\r\n></ng-container>\r\n}\r\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\r\n    <bsu-ly-layout-container-of-root\r\n        [config]=\"layout94\"\r\n        [isPanel]=\"false\"\r\n        [isRoot]=\"true\"\r\n    ></bsu-ly-layout-container-of-root>\r\n</ng-template>\r\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\r\n    <bnrc-dynamic-form-component\r\n        [component]=\"component\"\r\n        [layoutActionsTemplateRef]=\"layoutActionsTemplateRef\"\r\n        [removeContentPadding]=\"removeContentPadding\"\r\n        [breadCrumbs]=\"breadCrumbs\"\r\n        [description]=\"description\"\r\n        [title]=\"title\"\r\n        [subtitle]=\"subtitle\"\r\n        [toolbarItems]=\"toolbarItems\"\r\n        [layoutActions]=\"layoutActions\"\r\n        [footerDesign]=\"footerDesign\"\r\n        [facetList]=\"facetList\"\r\n        [settings]=\"component.Settings\"\r\n        [workflowButtons]=\"workflowButtons\"\r\n        [workflowPanelUi]=\"workflowPanelUi\"\r\n        [isMobile]=\"isMobile\"\r\n        [mo]=\"mo\"\r\n        [layout94]=\"layout94\"\r\n        [context]=\"context\"\r\n        [rtl]=\"rtl\"\r\n        [fieldDict]=\"fieldDict\"\r\n        [mask]=\"mask\"\r\n        [dirValue]=\"dirValue\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [modernTabs]=\"modernTabs\"\r\n        [avatar]=\"avatar\"\r\n        (events)=\"onDynamicComponentEvents($event)\"\r\n    ></bnrc-dynamic-form-component>\r\n</ng-template>\r\n<ng-template #closeForm>\r\n    <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\r\n        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\r\n    </button>\r\n</ng-template>\r\n<ng-template #fullscreenForm>\r\n    @if (canFullscreen) {\r\n    <button\r\n        fd-button\r\n        fdType=\"transparent\"\r\n        [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\r\n        (click)=\"fullscreenRequest.emit()\"\r\n        [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\r\n        [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\r\n    ></button>\r\n    }\r\n</ng-template>\r\n<ng-template #layoutActionsTemplateRef>\r\n    <bsu-layout-actions\r\n        [canSend]=\"canSend\"\r\n        [buttons]=\"layoutActions\"\r\n        [isMobile]=\"isMobile\"\r\n        [landscape]=\"landscape\"\r\n        [standalone]=\"standalone\"\r\n        [footerDesign]=\"footerDesign\"\r\n        [workflowButtons]=\"workflowButtons\"\r\n        [workflowButtonsComboMode]=\"workflowButtonsComboMode || worfklowButtonsOnFooter\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [rtl]=\"rtl\"\r\n        (toolClick)=\"toolbarClick.emit($event)\"\r\n        (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\r\n    >\r\n    </bsu-layout-actions>\r\n</ng-template>\r\n", styles: [":host{display:block;height:auto;width:100%}:host>fd-dynamic-page[contentispage=false]:not([ismobile=true]) ::ng-deep fd-dynamic-page-header .fd-dynamic-page__title{max-width:50svw}:host ::ng-deep .fd-facet .fd-title{font-family:B-Font Medium}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important}:host ::ng-deep .facet-progress .fd-progress-indicator__container,:host ::ng-deep .facet-progress .fd-progress-indicator__progress-bar{height:1.5rem}:host ::ng-deep fd-facet .fd-object-status--large{font-size:1.1rem}.no-toolbar-items ::ng-deep .fd-dynamic-page__toolbar-container{width:auto}fd-dynamic-page[ismobile=true] fd-dynamic-page-header.notitle ::ng-deep .fd-dynamic-page__title{width:auto}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%;overflow:hidden}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded bsu-ly-layout-container-of-root{min-height:100%}fd-dynamic-page ::ng-deep>article>.fd-scrollbar{height:inherit}fd-dynamic-page fd-dynamic-page-content.limit-content-width{display:flex;justify-content:center}fd-facet{display:flex;flex-direction:column}.hide-title ::ng-deep .fd-dynamic-page__title-container{display:none!important}.hide-title.hide-breadcrumb{display:none}.no-pin ::ng-deep .fd-dynamic-page__collapsible-header-visibility-container,.no-pin ::ng-deep .fd-dynamic-page__collapsible-header{display:none!important}fd-toolbar.firefox ::ng-deep .fd-toolbar{flex-direction:row-reverse}fd-toolbar.firefox ::ng-deep .fd-toolbar>:first-child{margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicFormComponent, selector: "bnrc-dynamic-form-component", inputs: ["breadCrumbs", "toolbarVisible", "toolbarItems", "layoutActions", "layoutActionsTemplateRef", "workflowButtons", "layout94", "footerDesign", "settings", "workflowPanelUi", "title", "subtitle", "description", "facetList", "removeHeaderBorder", "removeContentPadding", "isMobile", "avatar", "rtl", "mask", "mo", "contentDensity", "deviceSize", "dirValue", "fieldDict", "modernTabs"] }, { kind: "component", type: i2.BaseDynamicComponent, selector: "bnrc-dynamic-component", inputs: ["component", "value"], outputs: ["events"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i2.MeasureFormTitleWidthDirective, selector: "[mWidthTitle]", inputs: ["mWidthTitle", "enableMobile"] }, { kind: "directive", type: i3$1.ɵɵCdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i4$6.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i4$6.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i8$1.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i8$1.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i8$1.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i8$1.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i8$1.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i8$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i8$1.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i8$1.DynamicPageBreadcrumbComponent, selector: "fd-dynamic-page-breadcrumb" }, { kind: "component", type: i8$2.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "headingLevel", "id", "alignEnd"] }, { kind: "component", type: i8$2.FacetGroupComponent, selector: "fd-facet-group", inputs: ["ariaLabel"] }, { kind: "component", type: i8$2.FacetContentComponent, selector: "fd-facet-content" }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i4$4.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$4.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$4.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i2$8.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "dismissBtnTitle", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i5$6.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i10.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i14.RatingIndicatorComponent, selector: "fd-rating-indicator", inputs: ["class", "name", "ariaLabel", "ariaLabelledBy", "disabled", "displayMode", "nonInteractive", "indicatorCapacity", "allowHalves", "value", "totalRatings", "ratingAverage", "ratings", "displayAllRatings", "ratedIcon", "unratedIcon", "size", "dynamicTextIndicator"], outputs: ["ratingChanged"] }, { kind: "component", type: i5$3.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "component", type: i12$1.ProgressIndicatorComponent, selector: "fd-progress-indicator", inputs: ["valueText", "unit", "valueMin", "valueMax", "valueNow", "state", "animate"] }, { kind: "component", type: i18.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "tabHeadingLevel", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "settings", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i18.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: LyLayoutContainerOfRootComponent, selector: "bsu-ly-layout-container-of-root" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: ["renderItems", "tablist"] }, { kind: "component", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: ["workflowButtons", "workflowButtonsComboMode", "canSend", "simple", "footerDesign"], outputs: ["workflowChoiceSelect"] }, { kind: "component", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "component", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: ["toolbarClick"] }, { kind: "component", type: BarsaInfobarsComponent, selector: "bsu-barsa-infobars", inputs: ["infobars"], outputs: ["dismiss"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.HeaderFacetValuePipe, name: "facetValue" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.SanitizeTextPipe, name: "sanitizeText" }, { kind: "pipe", type: i2.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FundamentalDynamicFormComponent, decorators: [{
             type: Component,
@@ -11618,6 +11627,7 @@ class FormDialogComponent extends BaseComponent {
         this.dialogParams = inject(DialogParams);
         this._portalService = inject(PortalService);
         this._renderer2 = inject(Renderer2);
+        this._bbbtranslate = inject(BbbTranslatePipe);
         this._portalService.deviceSize$.subscribe((deviceSize) => {
             this.deviceSize = deviceSize;
         });
@@ -11643,6 +11653,10 @@ class FormDialogComponent extends BaseComponent {
         this.params = { moId, typeDefId, reportId, inDialog: true };
         this._setCaption(formPanelCtrlr);
         this.formPanelCtrlr = formPanelCtrlr;
+        this.title = this._bbbtranslate.transform(this.title || this.caption);
+        this.title = "this is a big title in the form that must be overflow and have just 50% size";
+        this.titleWidth = measureText2(this.title, '1rem');
+        console.log(this.titleWidth);
     }
     get Adapter() {
         return this.formPanelCtrlr.Adapter;
@@ -11662,6 +11676,16 @@ class FormDialogComponent extends BaseComponent {
         }
         this.openDialog();
     }
+    onHeaderTitleVisibilityChange(e, barLeft) {
+        if (e === 'Visible') {
+            if (this.titleWidth < barLeft.offsetWidth) {
+                barLeft.classList.add('auto-size');
+            }
+            else {
+                barLeft.classList.add('overflow-size');
+            }
+        }
+    }
     onToolbarClick(e) {
         this._formUiComponent.onToolbarClick(e);
     }
@@ -11779,11 +11803,11 @@ class FormDialogComponent extends BaseComponent {
         this.caption = typeDefName + ':' + moCaption;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FormDialogComponent, isStandalone: false, selector: "bsu-form-dialog", providers: [ContainerService], viewQueries: [{ propertyName: "dialogTemplateRef", first: true, predicate: ["dialog"], descendants: true, read: TemplateRef, static: true }, { propertyName: "_dialogForm", first: true, predicate: ["dialogTplRef"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialog>\r\n    <fd-dialog\r\n        [dialogConfig]=\"dialogConfig\"\r\n        [dialogRef]=\"dialog\"\r\n        #dialogTplRef\r\n        class=\"form-dialog\"\r\n        intersectionObserver\r\n        [intersectionThreshold]=\"0.5\"\r\n        (visibilityChange)=\"onBarRightVisibilityChange($event, dialogBody, dialogTplRef)\"\r\n    >\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                @if(formUi()?.extendToolbarItems$ | async | tlbButtons: 'inFooter':false:true;as toolbarItems){\r\n                <div fd-bar-left style=\"flex: 1; min-width: 0\">\r\n                    <h1 fd-title>\r\n                        {{ title || dialogConfig.data.caption | bbbTranslate }}\r\n                    </h1>\r\n                </div>\r\n                <div fd-bar-center style=\"flex: 1; display: none\"></div>\r\n                <div fd-bar-right #barRight class=\"bar-right\" [attr.items]=\"toolbarItems.length\">\r\n                    <bsu-form-toolbar\r\n                        fd-bar-right\r\n                        class=\"toolbar-hide-spacer\"\r\n                        [width]=\"'100%'\"\r\n                        [shouldOverflow]=\"true\"\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [buttons]=\"toolbarItems | filterWorkflowInMobile: workflowButtonsOnFooter\"\r\n                        [dirValue]=\"(formUi()?.dirValue$ | async)!!\"\r\n                        [isFirefox]=\"isFirefox\"\r\n                        (toolbarClick)=\"onToolbarClick($event)\"\r\n                        #formToolbar\r\n                    ></bsu-form-toolbar>\r\n                    @if (dialogConfig.data.canFullscreen) {\r\n                    <fd-button-bar\r\n                        ariaLabel=\"fullscreen\"\r\n                        fullscreenDialog\r\n                        [glyph]=\"(dialog.fullScreen | async) === true ? 'exitfullscreen' : 'resize'\"\r\n                        (click)=\"onFullscreenToggle(dialog, dialogBody, dialogTplRef)\"\r\n                    ></fd-button-bar>\r\n                    }\r\n                    <fd-button-bar\r\n                        ariaLabel=\"close\"\r\n                        glyph=\"decline\"\r\n                        (click)=\"onCancel()\"\r\n                        [style.width]=\"\"\r\n                    ></fd-button-bar>\r\n                </div>\r\n                }\r\n            </ng-template>\r\n        </fd-dialog-header>\r\n\r\n        <fd-dialog-body #dialogBody>\r\n            <bnrc-form\r\n                [formPanelCtrl]=\"formPanelCtrlr\"\r\n                [params]=\"params\"\r\n                (formClose)=\"onFormClose()\"\r\n                (uiComponent)=\"onFormUiComponentReady($event)\"\r\n            ></bnrc-form>\r\n        </fd-dialog-body>\r\n        <fd-dialog-footer [style.display]=\"!showFooter && !isWorkflowForm && !workflowButtonsOnFooter ? 'none' : null\">\r\n            @if (isMobile || workflowButtonsOnFooter ) { @if(formUi()?.workflowButtons$ | async ;as workflowButtons){\r\n            <bsu-layout-actions\r\n                [canSend]=\"false\"\r\n                [buttons]=\"[]\"\r\n                [isMobile]=\"isMobile\"\r\n                [landscape]=\"(formUi()?.landscape$ | async) === true\"\r\n                [standalone]=\"(formUi()?.standalone$ | async) === true\"\r\n                [workflowButtons]=\"workflowButtons\"\r\n                [workflowButtonsComboMode]=\"true\"\r\n                [deviceSize]=\"deviceSize\"\r\n                [rtl]=\"(formUi()?.rtl$ | async) === true\"\r\n                (toolClick)=\"onToolbarClick($event)\"\r\n                (workflowChoiceSelect)=\"onWorkflowChoiceClick($event)\"\r\n            >\r\n            </bsu-layout-actions>\r\n            } } @for (btn of (formUi()?.extendToolbarItems$ | async | tlbButtons: 'inFooter':true) ; track btn.Id) { @if\r\n            (!(btn === '-' || btn.text === '-') && ((btn.isBuiltin && btn.inFooter) || btn.isWorkflow)) {\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate;\r\n                    context: { $implicit: btn }\r\n                \"\r\n            ></ng-container>\r\n            <ng-template #btnTemplate let-btn>\r\n                <fd-dialog-footer-button>\r\n                    <fd-button-bar\r\n                        fd-dialog-decisive-button\r\n                        [fdType]=\"btn.isWorkflow ? 'attention' : btn.design\"\r\n                        [label]=\"btn.text | bbbTranslate\"\r\n                        [glyph]=\"btn.newIcon ? btn.newIcon : null\"\r\n                        (click)=\"btn.handler(btn, formPanelCtrlr?.Adapter?.Control)\"\r\n                    ></fd-button-bar>\r\n                </fd-dialog-footer-button>\r\n            </ng-template>\r\n            <ng-template #dynamicBtnTemplate let-btn>\r\n                <fd-dialog-footer-button>\r\n                    <bnrc-dynamic-form-toolbaritem\r\n                        fd-toolbar-item\r\n                        [component]=\"btn.Data.CustomUi\"\r\n                        [context]=\"btn\"\r\n                        [isEnable]=\"btn.Command?._isEnable\"\r\n                        (btnClick)=\"btn.handler(btn, formPanelCtrlr?.Adapter?.Control)\"\r\n                    ></bnrc-dynamic-form-toolbaritem>\r\n                </fd-dialog-footer-button>\r\n            </ng-template>\r\n            } } @if (!isNonePersistance && showSaveButton !== false) {\r\n            <fd-dialog-footer-button>\r\n                <fd-button-bar\r\n                    fd-initial-focus\r\n                    fd-dialog-decisive-button\r\n                    [label]=\"'Cancel' | bbbTranslate\"\r\n                    (click)=\"onCancel()\"\r\n                ></fd-button-bar>\r\n            </fd-dialog-footer-button>\r\n            }\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;height:auto}fd-dialog-body{display:flex;flex-direction:column;height:100%;align-items:stretch;justify-content:stretch}fd-dialog-body>bnrc-form{flex-grow:1;display:flex;flex-direction:row;height:100%;justify-content:stretch;align-items:stretch}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "UlvMainCtrlr", "formPanelCtrlId", "saveOnChange", "inlineEditInReport"], outputs: ["titleChanged", "moChanged", "formClose", "uiComponent", "formRendered", "bruleAction", "beforeTransition", "afterTransition"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "directive", type: i2.IntersectionObserverDirective, selector: "[intersectionObserver]", inputs: ["intersectionDebounce", "intersectionRootMargin", "intersectionRoot", "intersectionThreshold"], outputs: ["visibilityChange"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: ["workflowButtons", "workflowButtonsComboMode", "canSend", "simple", "footerDesign"], outputs: ["workflowChoiceSelect"] }, { kind: "component", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: ["toolbarClick"] }, { kind: "directive", type: FullscreenDialogDirective, selector: "[fullscreenDialog]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.TlbButtonsPipe, name: "tlbButtons" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FormDialogComponent, isStandalone: false, selector: "bsu-form-dialog", providers: [ContainerService], viewQueries: [{ propertyName: "dialogTemplateRef", first: true, predicate: ["dialog"], descendants: true, read: TemplateRef, static: true }, { propertyName: "_dialogForm", first: true, predicate: ["dialogTplRef"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialog>\r\n    <fd-dialog\r\n        [dialogConfig]=\"dialogConfig\"\r\n        [dialogRef]=\"dialog\"\r\n        #dialogTplRef\r\n        class=\"form-dialog\"\r\n        intersectionObserver\r\n        [intersectionThreshold]=\"0.5\"\r\n        (visibilityChange)=\"onBarRightVisibilityChange($event, dialogBody, dialogTplRef)\"\r\n    >\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                @if(formUi()?.extendToolbarItems$ | async | tlbButtons: 'inFooter':false:true;as toolbarItems){\r\n                <div\r\n                    fd-bar-left\r\n                    #barLeft\r\n                    intersectionObserver\r\n                    [intersectionThreshold]=\"0.5\"\r\n                    (visibilityChange)=\"onHeaderTitleVisibilityChange($event, barLeft)\"\r\n                >\r\n                    <h1 fd-title>\r\n                        {{ title }}\r\n                    </h1>\r\n                </div>\r\n                <div fd-bar-center style=\"flex: 1; display: none\"></div>\r\n                <div fd-bar-right #barRight class=\"bar-right\" [attr.items]=\"toolbarItems.length\">\r\n                    <bsu-form-toolbar\r\n                        fd-bar-right\r\n                        class=\"toolbar-hide-spacer\"\r\n                        [width]=\"'100%'\"\r\n                        [shouldOverflow]=\"true\"\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [buttons]=\"toolbarItems | filterWorkflowInMobile: workflowButtonsOnFooter\"\r\n                        [dirValue]=\"(formUi()?.dirValue$ | async)!!\"\r\n                        [isFirefox]=\"isFirefox\"\r\n                        (toolbarClick)=\"onToolbarClick($event)\"\r\n                        #formToolbar\r\n                    ></bsu-form-toolbar>\r\n                    @if (dialogConfig.data.canFullscreen) {\r\n                    <fd-button-bar\r\n                        ariaLabel=\"fullscreen\"\r\n                        fullscreenDialog\r\n                        [glyph]=\"(dialog.fullScreen | async) === true ? 'exitfullscreen' : 'resize'\"\r\n                        (click)=\"onFullscreenToggle(dialog, dialogBody, dialogTplRef)\"\r\n                    ></fd-button-bar>\r\n                    }\r\n                    <fd-button-bar\r\n                        ariaLabel=\"close\"\r\n                        glyph=\"decline\"\r\n                        (click)=\"onCancel()\"\r\n                        [style.width]=\"\"\r\n                    ></fd-button-bar>\r\n                </div>\r\n                }\r\n            </ng-template>\r\n        </fd-dialog-header>\r\n\r\n        <fd-dialog-body #dialogBody>\r\n            <bnrc-form\r\n                [formPanelCtrl]=\"formPanelCtrlr\"\r\n                [params]=\"params\"\r\n                (formClose)=\"onFormClose()\"\r\n                (uiComponent)=\"onFormUiComponentReady($event)\"\r\n            ></bnrc-form>\r\n        </fd-dialog-body>\r\n        <fd-dialog-footer [style.display]=\"!showFooter && !isWorkflowForm ? 'none' : null\">\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div fd-bar-right>\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            layoutactions;\r\n                            context: {\r\n                                workflowButtons: (formUi()?.workflowButtons$ | async),\r\n                                extendToolbarItems:\r\n                                    (formUi()?.extendToolbarItems$ | async | tlbButtons: 'inFooter':true)\r\n                            }\r\n                        \"\r\n                    >\r\n                    </ng-container>\r\n                    <ng-template\r\n                        #layoutactions\r\n                        let-workflowButtons=\"workflowButtons\"\r\n                        let-extendToolbarItems=\"extendToolbarItems\"\r\n                    >\r\n                        @if(workflowButtons.length){\r\n                        <bsu-layout-actions\r\n                            [canSend]=\"false\"\r\n                            [buttons]=\"[]\"\r\n                            [isMobile]=\"isMobile\"\r\n                            [landscape]=\"(formUi()?.landscape$ | async) === true\"\r\n                            [standalone]=\"(formUi()?.standalone$ | async) === true\"\r\n                            [workflowButtons]=\"workflowButtons\"\r\n                            [workflowButtonsComboMode]=\"true\"\r\n                            [deviceSize]=\"deviceSize\"\r\n                            [rtl]=\"(formUi()?.rtl$ | async) === true\"\r\n                            (toolClick)=\"onToolbarClick($event)\"\r\n                            (workflowChoiceSelect)=\"onWorkflowChoiceClick($event)\"\r\n                        >\r\n                        </bsu-layout-actions>\r\n                        } @for (btn of extendToolbarItems ; track btn.Id) { @if (!(btn === '-' || btn.text === '-') ) {\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"\r\n                            btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate;\r\n                            context: { $implicit: btn ,}\r\n                        \"\r\n                        ></ng-container>\r\n                        <ng-template #btnTemplate let-btn>\r\n                            <fd-dialog-footer-button>\r\n                                <fd-button-bar\r\n                                    [fdType]=\"\r\n                                        workflowButtons?.length && btn.design === 'emphasized' ? 'ghost' : btn.design\r\n                                    \"\r\n                                    [label]=\"btn.text | bbbTranslate\"\r\n                                    [glyph]=\"btn.newIcon ? btn.newIcon : null\"\r\n                                    (click)=\"btn.handler(btn, formPanelCtrlr?.Adapter?.Control)\"\r\n                                ></fd-button-bar>\r\n                            </fd-dialog-footer-button>\r\n                        </ng-template>\r\n                        <ng-template #dynamicBtnTemplate let-btn>\r\n                            <fd-dialog-footer-button>\r\n                                <bnrc-dynamic-form-toolbaritem\r\n                                    fd-toolbar-item\r\n                                    [component]=\"btn.Data.CustomUi\"\r\n                                    [context]=\"btn\"\r\n                                    [isEnable]=\"btn.Command?._isEnable\"\r\n                                    (btnClick)=\"btn.handler(btn, formPanelCtrlr?.Adapter?.Control)\"\r\n                                ></bnrc-dynamic-form-toolbaritem>\r\n                            </fd-dialog-footer-button>\r\n                        </ng-template>\r\n                        } } @if (!isNonePersistance && showSaveButton !== false) {\r\n                        <fd-dialog-footer-button>\r\n                            <fd-button-bar\r\n                                fd-initial-focus\r\n                                fd-dialog-decisive-button\r\n                                [label]=\"'Cancel' | bbbTranslate\"\r\n                                (click)=\"onCancel()\"\r\n                            ></fd-button-bar>\r\n                        </fd-dialog-footer-button>\r\n                        }\r\n                    </ng-template>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;height:auto}fd-dialog-body{display:flex;flex-direction:column;height:100%;align-items:stretch;justify-content:stretch}fd-dialog-body>bnrc-form{flex-grow:1;display:flex;flex-direction:row;height:100%;justify-content:stretch;align-items:stretch}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "UlvMainCtrlr", "formPanelCtrlId", "saveOnChange", "inlineEditInReport"], outputs: ["titleChanged", "moChanged", "formClose", "uiComponent", "formRendered", "bruleAction", "beforeTransition", "afterTransition"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "directive", type: i2.IntersectionObserverDirective, selector: "[intersectionObserver]", inputs: ["intersectionDebounce", "intersectionRootMargin", "intersectionRoot", "intersectionThreshold"], outputs: ["visibilityChange"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: ["workflowButtons", "workflowButtonsComboMode", "canSend", "simple", "footerDesign"], outputs: ["workflowChoiceSelect"] }, { kind: "component", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: ["toolbarClick"] }, { kind: "directive", type: FullscreenDialogDirective, selector: "[fullscreenDialog]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.TlbButtonsPipe, name: "tlbButtons" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormDialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-form-dialog', providers: [ContainerService], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialog>\r\n    <fd-dialog\r\n        [dialogConfig]=\"dialogConfig\"\r\n        [dialogRef]=\"dialog\"\r\n        #dialogTplRef\r\n        class=\"form-dialog\"\r\n        intersectionObserver\r\n        [intersectionThreshold]=\"0.5\"\r\n        (visibilityChange)=\"onBarRightVisibilityChange($event, dialogBody, dialogTplRef)\"\r\n    >\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                @if(formUi()?.extendToolbarItems$ | async | tlbButtons: 'inFooter':false:true;as toolbarItems){\r\n                <div fd-bar-left style=\"flex: 1; min-width: 0\">\r\n                    <h1 fd-title>\r\n                        {{ title || dialogConfig.data.caption | bbbTranslate }}\r\n                    </h1>\r\n                </div>\r\n                <div fd-bar-center style=\"flex: 1; display: none\"></div>\r\n                <div fd-bar-right #barRight class=\"bar-right\" [attr.items]=\"toolbarItems.length\">\r\n                    <bsu-form-toolbar\r\n                        fd-bar-right\r\n                        class=\"toolbar-hide-spacer\"\r\n                        [width]=\"'100%'\"\r\n                        [shouldOverflow]=\"true\"\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [buttons]=\"toolbarItems | filterWorkflowInMobile: workflowButtonsOnFooter\"\r\n                        [dirValue]=\"(formUi()?.dirValue$ | async)!!\"\r\n                        [isFirefox]=\"isFirefox\"\r\n                        (toolbarClick)=\"onToolbarClick($event)\"\r\n                        #formToolbar\r\n                    ></bsu-form-toolbar>\r\n                    @if (dialogConfig.data.canFullscreen) {\r\n                    <fd-button-bar\r\n                        ariaLabel=\"fullscreen\"\r\n                        fullscreenDialog\r\n                        [glyph]=\"(dialog.fullScreen | async) === true ? 'exitfullscreen' : 'resize'\"\r\n                        (click)=\"onFullscreenToggle(dialog, dialogBody, dialogTplRef)\"\r\n                    ></fd-button-bar>\r\n                    }\r\n                    <fd-button-bar\r\n                        ariaLabel=\"close\"\r\n                        glyph=\"decline\"\r\n                        (click)=\"onCancel()\"\r\n                        [style.width]=\"\"\r\n                    ></fd-button-bar>\r\n                </div>\r\n                }\r\n            </ng-template>\r\n        </fd-dialog-header>\r\n\r\n        <fd-dialog-body #dialogBody>\r\n            <bnrc-form\r\n                [formPanelCtrl]=\"formPanelCtrlr\"\r\n                [params]=\"params\"\r\n                (formClose)=\"onFormClose()\"\r\n                (uiComponent)=\"onFormUiComponentReady($event)\"\r\n            ></bnrc-form>\r\n        </fd-dialog-body>\r\n        <fd-dialog-footer [style.display]=\"!showFooter && !isWorkflowForm && !workflowButtonsOnFooter ? 'none' : null\">\r\n            @if (isMobile || workflowButtonsOnFooter ) { @if(formUi()?.workflowButtons$ | async ;as workflowButtons){\r\n            <bsu-layout-actions\r\n                [canSend]=\"false\"\r\n                [buttons]=\"[]\"\r\n                [isMobile]=\"isMobile\"\r\n                [landscape]=\"(formUi()?.landscape$ | async) === true\"\r\n                [standalone]=\"(formUi()?.standalone$ | async) === true\"\r\n                [workflowButtons]=\"workflowButtons\"\r\n                [workflowButtonsComboMode]=\"true\"\r\n                [deviceSize]=\"deviceSize\"\r\n                [rtl]=\"(formUi()?.rtl$ | async) === true\"\r\n                (toolClick)=\"onToolbarClick($event)\"\r\n                (workflowChoiceSelect)=\"onWorkflowChoiceClick($event)\"\r\n            >\r\n            </bsu-layout-actions>\r\n            } } @for (btn of (formUi()?.extendToolbarItems$ | async | tlbButtons: 'inFooter':true) ; track btn.Id) { @if\r\n            (!(btn === '-' || btn.text === '-') && ((btn.isBuiltin && btn.inFooter) || btn.isWorkflow)) {\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate;\r\n                    context: { $implicit: btn }\r\n                \"\r\n            ></ng-container>\r\n            <ng-template #btnTemplate let-btn>\r\n                <fd-dialog-footer-button>\r\n                    <fd-button-bar\r\n                        fd-dialog-decisive-button\r\n                        [fdType]=\"btn.isWorkflow ? 'attention' : btn.design\"\r\n                        [label]=\"btn.text | bbbTranslate\"\r\n                        [glyph]=\"btn.newIcon ? btn.newIcon : null\"\r\n                        (click)=\"btn.handler(btn, formPanelCtrlr?.Adapter?.Control)\"\r\n                    ></fd-button-bar>\r\n                </fd-dialog-footer-button>\r\n            </ng-template>\r\n            <ng-template #dynamicBtnTemplate let-btn>\r\n                <fd-dialog-footer-button>\r\n                    <bnrc-dynamic-form-toolbaritem\r\n                        fd-toolbar-item\r\n                        [component]=\"btn.Data.CustomUi\"\r\n                        [context]=\"btn\"\r\n                        [isEnable]=\"btn.Command?._isEnable\"\r\n                        (btnClick)=\"btn.handler(btn, formPanelCtrlr?.Adapter?.Control)\"\r\n                    ></bnrc-dynamic-form-toolbaritem>\r\n                </fd-dialog-footer-button>\r\n            </ng-template>\r\n            } } @if (!isNonePersistance && showSaveButton !== false) {\r\n            <fd-dialog-footer-button>\r\n                <fd-button-bar\r\n                    fd-initial-focus\r\n                    fd-dialog-decisive-button\r\n                    [label]=\"'Cancel' | bbbTranslate\"\r\n                    (click)=\"onCancel()\"\r\n                ></fd-button-bar>\r\n            </fd-dialog-footer-button>\r\n            }\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;height:auto}fd-dialog-body{display:flex;flex-direction:column;height:100%;align-items:stretch;justify-content:stretch}fd-dialog-body>bnrc-form{flex-grow:1;display:flex;flex-direction:row;height:100%;justify-content:stretch;align-items:stretch}\n"] }]
+            args: [{ selector: 'bsu-form-dialog', providers: [ContainerService], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialog>\r\n    <fd-dialog\r\n        [dialogConfig]=\"dialogConfig\"\r\n        [dialogRef]=\"dialog\"\r\n        #dialogTplRef\r\n        class=\"form-dialog\"\r\n        intersectionObserver\r\n        [intersectionThreshold]=\"0.5\"\r\n        (visibilityChange)=\"onBarRightVisibilityChange($event, dialogBody, dialogTplRef)\"\r\n    >\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                @if(formUi()?.extendToolbarItems$ | async | tlbButtons: 'inFooter':false:true;as toolbarItems){\r\n                <div\r\n                    fd-bar-left\r\n                    #barLeft\r\n                    intersectionObserver\r\n                    [intersectionThreshold]=\"0.5\"\r\n                    (visibilityChange)=\"onHeaderTitleVisibilityChange($event, barLeft)\"\r\n                >\r\n                    <h1 fd-title>\r\n                        {{ title }}\r\n                    </h1>\r\n                </div>\r\n                <div fd-bar-center style=\"flex: 1; display: none\"></div>\r\n                <div fd-bar-right #barRight class=\"bar-right\" [attr.items]=\"toolbarItems.length\">\r\n                    <bsu-form-toolbar\r\n                        fd-bar-right\r\n                        class=\"toolbar-hide-spacer\"\r\n                        [width]=\"'100%'\"\r\n                        [shouldOverflow]=\"true\"\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [buttons]=\"toolbarItems | filterWorkflowInMobile: workflowButtonsOnFooter\"\r\n                        [dirValue]=\"(formUi()?.dirValue$ | async)!!\"\r\n                        [isFirefox]=\"isFirefox\"\r\n                        (toolbarClick)=\"onToolbarClick($event)\"\r\n                        #formToolbar\r\n                    ></bsu-form-toolbar>\r\n                    @if (dialogConfig.data.canFullscreen) {\r\n                    <fd-button-bar\r\n                        ariaLabel=\"fullscreen\"\r\n                        fullscreenDialog\r\n                        [glyph]=\"(dialog.fullScreen | async) === true ? 'exitfullscreen' : 'resize'\"\r\n                        (click)=\"onFullscreenToggle(dialog, dialogBody, dialogTplRef)\"\r\n                    ></fd-button-bar>\r\n                    }\r\n                    <fd-button-bar\r\n                        ariaLabel=\"close\"\r\n                        glyph=\"decline\"\r\n                        (click)=\"onCancel()\"\r\n                        [style.width]=\"\"\r\n                    ></fd-button-bar>\r\n                </div>\r\n                }\r\n            </ng-template>\r\n        </fd-dialog-header>\r\n\r\n        <fd-dialog-body #dialogBody>\r\n            <bnrc-form\r\n                [formPanelCtrl]=\"formPanelCtrlr\"\r\n                [params]=\"params\"\r\n                (formClose)=\"onFormClose()\"\r\n                (uiComponent)=\"onFormUiComponentReady($event)\"\r\n            ></bnrc-form>\r\n        </fd-dialog-body>\r\n        <fd-dialog-footer [style.display]=\"!showFooter && !isWorkflowForm ? 'none' : null\">\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div fd-bar-right>\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            layoutactions;\r\n                            context: {\r\n                                workflowButtons: (formUi()?.workflowButtons$ | async),\r\n                                extendToolbarItems:\r\n                                    (formUi()?.extendToolbarItems$ | async | tlbButtons: 'inFooter':true)\r\n                            }\r\n                        \"\r\n                    >\r\n                    </ng-container>\r\n                    <ng-template\r\n                        #layoutactions\r\n                        let-workflowButtons=\"workflowButtons\"\r\n                        let-extendToolbarItems=\"extendToolbarItems\"\r\n                    >\r\n                        @if(workflowButtons.length){\r\n                        <bsu-layout-actions\r\n                            [canSend]=\"false\"\r\n                            [buttons]=\"[]\"\r\n                            [isMobile]=\"isMobile\"\r\n                            [landscape]=\"(formUi()?.landscape$ | async) === true\"\r\n                            [standalone]=\"(formUi()?.standalone$ | async) === true\"\r\n                            [workflowButtons]=\"workflowButtons\"\r\n                            [workflowButtonsComboMode]=\"true\"\r\n                            [deviceSize]=\"deviceSize\"\r\n                            [rtl]=\"(formUi()?.rtl$ | async) === true\"\r\n                            (toolClick)=\"onToolbarClick($event)\"\r\n                            (workflowChoiceSelect)=\"onWorkflowChoiceClick($event)\"\r\n                        >\r\n                        </bsu-layout-actions>\r\n                        } @for (btn of extendToolbarItems ; track btn.Id) { @if (!(btn === '-' || btn.text === '-') ) {\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"\r\n                            btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate;\r\n                            context: { $implicit: btn ,}\r\n                        \"\r\n                        ></ng-container>\r\n                        <ng-template #btnTemplate let-btn>\r\n                            <fd-dialog-footer-button>\r\n                                <fd-button-bar\r\n                                    [fdType]=\"\r\n                                        workflowButtons?.length && btn.design === 'emphasized' ? 'ghost' : btn.design\r\n                                    \"\r\n                                    [label]=\"btn.text | bbbTranslate\"\r\n                                    [glyph]=\"btn.newIcon ? btn.newIcon : null\"\r\n                                    (click)=\"btn.handler(btn, formPanelCtrlr?.Adapter?.Control)\"\r\n                                ></fd-button-bar>\r\n                            </fd-dialog-footer-button>\r\n                        </ng-template>\r\n                        <ng-template #dynamicBtnTemplate let-btn>\r\n                            <fd-dialog-footer-button>\r\n                                <bnrc-dynamic-form-toolbaritem\r\n                                    fd-toolbar-item\r\n                                    [component]=\"btn.Data.CustomUi\"\r\n                                    [context]=\"btn\"\r\n                                    [isEnable]=\"btn.Command?._isEnable\"\r\n                                    (btnClick)=\"btn.handler(btn, formPanelCtrlr?.Adapter?.Control)\"\r\n                                ></bnrc-dynamic-form-toolbaritem>\r\n                            </fd-dialog-footer-button>\r\n                        </ng-template>\r\n                        } } @if (!isNonePersistance && showSaveButton !== false) {\r\n                        <fd-dialog-footer-button>\r\n                            <fd-button-bar\r\n                                fd-initial-focus\r\n                                fd-dialog-decisive-button\r\n                                [label]=\"'Cancel' | bbbTranslate\"\r\n                                (click)=\"onCancel()\"\r\n                            ></fd-button-bar>\r\n                        </fd-dialog-footer-button>\r\n                        }\r\n                    </ng-template>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;height:auto}fd-dialog-body{display:flex;flex-direction:column;height:100%;align-items:stretch;justify-content:stretch}fd-dialog-body>bnrc-form{flex-grow:1;display:flex;flex-direction:row;height:100%;justify-content:stretch;align-items:stretch}\n"] }]
         }], ctorParameters: () => [], propDecorators: { dialogTemplateRef: [{
                 type: ViewChild,
                 args: ['dialog', { read: TemplateRef, static: true }]
@@ -15259,7 +15283,7 @@ class BarsaChatComponent extends FormBaseComponent {
         this._newMessageText = $event.target.value;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaChatComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaChatComponent, isStandalone: false, selector: "bsu-barsa-chat", providers: [FormPanelService], usesInheritance: true, ngImport: i0, template: "@if(layout94$ | async;as layout94){\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        chatTpl;\r\n        context: {\r\n            mo: mo$ | async,\r\n            karbaranEntekhabShode: '\u06A9\u0627\u0631\u0628\u0631\u0627\u0646 \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u062F\u0647' | controlUi: layout94,\r\n            jostejoKarbar: '\u062C\u0633\u062A\u062C\u0648 \u06A9\u0627\u0631\u0628\u0631' | controlUi: layout94,\r\n            listGoftego: '\u0644\u06CC\u0633\u062A \u06AF\u0641\u062A\u06AF\u0648' | controlUi: layout94,\r\n            listGoftegoKarbarn: '\u0644\u06CC\u0633\u062A \u06AF\u0641\u062A\u06AF\u0648 \u06A9\u0627\u0631\u0628\u0631\u0627\u0646' | controlUi: layout94,\r\n            matnpishrafte: '\u0645\u062A\u0646 \u067E\u06CC\u0634\u0631\u0641\u062A\u0647 \u0635\u0641\u062D\u0647 \u0627\u0648\u0644' | controlUi: layout94,\r\n            radifGoftego: '\u0631\u062F\u06CC\u0641 \u06AF\u0641\u062A\u06AF\u0648 \u0645\u0648\u062C\u0648\u062F\u06CC\u062A' | controlUi: layout94,\r\n            deviceSize: deviceSize$ | async,\r\n            toolbarItems: toolbarItems$ | async,\r\n            dirValue: dirValue$ | async,\r\n            hasListKarbaran: '\u06A9\u0627\u0631\u0628\u0631\u0627\u0646 \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u062F\u0647' | controlUi: layout94\r\n        }\r\n    \"\r\n></ng-container>\r\n}\r\n\r\n<ng-template\r\n    #chatTpl\r\n    let-hasListKarbaran=\"hasListKarbaran\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-dirValue=\"dirValue\"\r\n    let-toolbarItems=\"toolbarItems\"\r\n    let-karbaranEntekhabShode=\"karbaranEntekhabShode\"\r\n    let-jostejoKarbar=\"jostejoKarbar\"\r\n    let-listGoftego=\"listGoftego\"\r\n    let-listGoftegoKarbarn=\"listGoftegoKarbarn\"\r\n    let-matnpishrafte=\"matnpishrafte\"\r\n    let-radifGoftego=\"radifGoftego\"\r\n>\r\n    <div\r\n        class=\"tw-flex tw-w-full tw-bg-gradient-to-r tw-bg-gradient-to-r tw-from-[color-mix(in_srgb,var(--sapBackgroundColor)_95%,black_10%)] tw-to-[var(--sapBackgroundColor)]\"\r\n        fillEmptySpace\r\n        [class.tw-h-screen]=\"!karbaranEntekhabShode\"\r\n        [class.tw-justify-center]=\"karbaranEntekhabShode\"\r\n    >\r\n        @if (hasListKarbaran) {\r\n        <div class=\"tw-bg-black/[.3] 2xl:tw-grow tw-shrink tw-h-full\"></div>\r\n        }\r\n        <div\r\n            class=\"tw-w-full tw-h-full tw-flex tw-shrink-0 tw-relative\"\r\n            [style.background-color]=\"'var(--sapBaseColor)'\"\r\n        >\r\n            @if(hasListKarbaran){\r\n            <div class=\"tw-grow-0 tw-shrink-0 tw-w-full md:tw-w-96 tw-p-0 md:tw-p-6\">\r\n                <div\r\n                    class=\"tw-flex tw-flex-col tw-w-full tw-h-full tw-overflow-hidden tw-border-l tw-border-l-gray-300 md:tw-rounded-2xl md:tw-border md:tw-border-l-gray-300 md:tw-border-gray-300 dark:tw-border-l-gray-600 md:dark:tw-border-l-gray-600 md:dark:tw-border-gray-600\"\r\n                >\r\n                    <bsu-form-toolbar\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [buttons]=\"toolbarItems\"\r\n                        [dirValue]=\"(dirValue$ | async)!!\"\r\n                        (toolbarClick)=\"onToolbarClick($event)\"\r\n                        #formToolbar\r\n                    ></bsu-form-toolbar>\r\n                    @if (jostejoKarbar) {\r\n                    <bsu-layout-control [config]=\"jostejoKarbar\"></bsu-layout-control>\r\n                    } @if (karbaranEntekhabShode) {\r\n                    <bsu-layout-control [config]=\"karbaranEntekhabShode\" style=\"flex: 1\"></bsu-layout-control>\r\n                    }\r\n                </div>\r\n            </div>\r\n            } @else {\r\n            <div\r\n                class=\"tw-absolute tw-top-0 tw-left-0 tw-w-full tw-h-full tw-bg-[url('assets/chat-bg.png')] tw-bg-fixed tw-opacity-25\"\r\n            ></div>\r\n            }\r\n            <div\r\n                class=\"tw-grow tw-shrink tw-relative\"\r\n                [ngClass]=\"{\r\n                    'md:tw-py-6 md:tw-pl-6 tw-hidden md:tw-flex': hasListKarbaran,\r\n                    'tw-flex': !hasListKarbaran\r\n                }\"\r\n            >\r\n                <div\r\n                    @inContentAnimation\r\n                    class=\"tw-h-full tw-bg-gradient-to-r tw-w-full tw-flex tw-flex-col tw-relative md:tw-border-gray-300 md:dark:tw-border-gray-600 tw-overflow-hidden\"\r\n                    [ngClass]=\"{\r\n                        'md:tw-border md:tw-rounded-2xl': hasListKarbaran\r\n                    }\"\r\n                >\r\n                    @if(listGoftego) {\r\n                    <bsu-layout-control class=\"maincontent\" [config]=\"listGoftego\" style=\"flex: 1\"></bsu-layout-control>\r\n                    } @if(listGoftegoKarbarn) {\r\n                    <bsu-layout-control class=\"maincontent\" [config]=\"listGoftegoKarbarn\" style=\"flex: 1\"></bsu-layout-control>\r\n                    } @if(matnpishrafte) {\r\n                    <bsu-layout-control class=\"maincontent\" [config]=\"matnpishrafte\" style=\"flex: 1\"></bsu-layout-control>\r\n                    }\r\n                    <div\r\n                        class=\"tw-w-full\"\r\n                        [ngClass]=\"{\r\n                            'tw-relative': hasListKarbaran,\r\n                            '2xl:tw-rounded-t-xl tw-grow-0 tw-shrink-0': !hasListKarbaran\r\n                        }\"\r\n                    >\r\n                        @if (replyingMessage()) {\r\n                        <div\r\n                            @inOutReplyingMessage\r\n                            class=\"tw-w-full tw-px-2 tw-py-1 tw-border-r-4 tw-border-r-bubble-mine tw-flex tw-gap-2 te-items-center tw-absolute tw-z-0 tw-bg-default tw-right-0 -tw-top-14\"\r\n                        >\r\n                            <button\r\n                                fd-button\r\n                                fdType=\"transparent\"\r\n                                glyph=\"decline\"\r\n                                class=\"tw-grow-0 tw-shrink-0\"\r\n                                (click)=\"replyingMessage.set(null)\"\r\n                            ></button>\r\n                            <div class=\"tw-flex tw-flex-col tw-grow tw-shrink tw-overflow-hidden\">\r\n                                <span class=\"tw-font-bold\">{{ replyingMessage().owner.name }}</span>\r\n                                <span class=\"tw-truncate\">{{\r\n                                    replyingMessage().text ??\r\n                                        replyingMessage().file?.name ??\r\n                                        replyingMessage().image?.name\r\n                                }}</span>\r\n                            </div>\r\n                            <div class=\"tw-w-8 tw-shrink-0 tw-grow-0\"></div>\r\n                        </div>\r\n                        }\r\n                        <div\r\n                            class=\"tw-w-full tw-flex tw-gap-2 tw-border-t tw-border-t-gray-300 dark:tw-border-t-gray-600 tw-bg-default tw-items-end tw-z-10\"\r\n                        >\r\n                            @if(radifGoftego) {\r\n                            <bsu-layout-control [config]=\"radifGoftego\"></bsu-layout-control>\r\n                            }\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n\r\n                <div\r\n                    class=\"tw-absolute tw-top-1/2 -tw-translate-y-1/2 tw-left-1/2 -tw-translate-x-1/2 tw-flex tw-flex-col tw-gap-8 tw-items-center\"\r\n                >\r\n                    <!-- <img src=\"assets/not-selected-chat.png\" class=\"tw-w-64 tw-opacity-25\" /> -->\r\n                    <!--            <span class=\"tw-text-xl tw-font-bold tw-text-gray-400 dark:tw-text-gray-500\">-->\r\n                    <!--                \u0628\u0631\u0627\u06CC \u0634\u0631\u0648\u0639 \u06CC\u06A9 \u0686\u062A \u0631\u0627 \u0627\u0646\u062A\u062E\u0627\u0628 \u06A9\u0646\u06CC\u062F-->\r\n                    <!--            </span>-->\r\n                </div>\r\n            </div>\r\n        </div>\r\n        @if (hasListKarbaran) {\r\n        <div class=\"tw-bg-black/[.3] 2xl:tw-grow tw-shrink tw-h-full\"></div>\r\n        }\r\n    </div>\r\n</ng-template>\r\n", styles: ["bsu-layout-control.maincontent ::ng-deep>bnrc-field-ui>bsu-ui-ulv-main-ui{min-height:100%!important}bsu-layout-control.maincontent ::ng-deep>bnrc-field-ui>bsu-ui-ulv-main-ui>bsu-barsa-ulv-main{display:flex;flex-grow:1}bsu-layout-control.maincontent ::ng-deep>bnrc-field-ui>bsu-ui-ulv-main-ui>bsu-barsa-ulv-main>div{min-height:100%!important;width:100%;flex-grow:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "cellEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "flex", "RefreshLabel", "SetVisible"], outputs: ["events"] }, { kind: "component", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: ["toolbarClick"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaChatComponent, isStandalone: false, selector: "bsu-barsa-chat", providers: [FormPanelService], usesInheritance: true, ngImport: i0, template: "@if(layout94$ | async;as layout94){\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        chatTpl;\r\n        context: {\r\n            mo: mo$ | async,\r\n            karbaranEntekhabShode: '\u06A9\u0627\u0631\u0628\u0631\u0627\u0646 \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u062F\u0647' | controlUi: layout94,\r\n            jostejoKarbar: '\u062C\u0633\u062A\u062C\u0648 \u06A9\u0627\u0631\u0628\u0631' | controlUi: layout94,\r\n            listGoftego: '\u0644\u06CC\u0633\u062A \u06AF\u0641\u062A\u06AF\u0648' | controlUi: layout94,\r\n            listGoftegoKarbarn: '\u0644\u06CC\u0633\u062A \u06AF\u0641\u062A\u06AF\u0648 \u06A9\u0627\u0631\u0628\u0631\u0627\u0646' | controlUi: layout94,\r\n            matnpishrafte: '\u0645\u062A\u0646 \u067E\u06CC\u0634\u0631\u0641\u062A\u0647 \u0635\u0641\u062D\u0647 \u0627\u0648\u0644' | controlUi: layout94,\r\n            radifGoftego: '\u0631\u062F\u06CC\u0641 \u06AF\u0641\u062A\u06AF\u0648 \u0645\u0648\u062C\u0648\u062F\u06CC\u062A' | controlUi: layout94,\r\n            deviceSize: deviceSize$ | async,\r\n            toolbarItems: toolbarItems$ | async,\r\n            dirValue: dirValue$ | async,\r\n            hasListKarbaran: '\u06A9\u0627\u0631\u0628\u0631\u0627\u0646 \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u062F\u0647' | controlUi: layout94,\r\n            selectedUserProfile: '\u067E\u0631\u0648\u0641\u0627\u06CC\u0644 \u06A9\u0627\u0631\u0628\u0631 \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u062F\u0647' | controlUi: layout94\r\n        }\r\n    \"\r\n></ng-container>\r\n}\r\n\r\n<ng-template\r\n    #chatTpl\r\n    let-hasListKarbaran=\"hasListKarbaran\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-dirValue=\"dirValue\"\r\n    let-toolbarItems=\"toolbarItems\"\r\n    let-karbaranEntekhabShode=\"karbaranEntekhabShode\"\r\n    let-jostejoKarbar=\"jostejoKarbar\"\r\n    let-listGoftego=\"listGoftego\"\r\n    let-listGoftegoKarbarn=\"listGoftegoKarbarn\"\r\n    let-matnpishrafte=\"matnpishrafte\"\r\n    let-radifGoftego=\"radifGoftego\"\r\n    let-selectedUserProfile=\"selectedUserProfile\"\r\n>\r\n    <div\r\n        class=\"tw-flex tw-w-full tw-bg-gradient-to-r tw-bg-gradient-to-r tw-from-[color-mix(in_srgb,var(--sapBackgroundColor)_95%,black_10%)] tw-to-[var(--sapBackgroundColor)]\"\r\n        fillEmptySpace\r\n        [class.tw-h-screen]=\"!karbaranEntekhabShode\"\r\n        [class.tw-justify-center]=\"karbaranEntekhabShode\"\r\n        [style.border]=\"'var(--fdCard_Border)'\"\r\n    >\r\n        @if (hasListKarbaran) {\r\n        <div class=\"tw-bg-black/[.3] 2xl:tw-grow tw-shrink tw-h-full\"></div>\r\n        }\r\n        <div class=\"tw-w-full tw-h-full tw-flex tw-shrink-0 tw-relative\">\r\n            @if(hasListKarbaran){\r\n            <div class=\"tw-grow-0 tw-shrink-0 tw-w-full md:tw-w-96 tw-p-0\">\r\n                <div\r\n                    [style.background-color]=\"'var(--sapBaseColor)'\"\r\n                    class=\"tw-flex tw-flex-col tw-w-full tw-h-full tw-overflow-hidden\"\r\n                >\r\n                    <bsu-form-toolbar\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [buttons]=\"toolbarItems\"\r\n                        [dirValue]=\"(dirValue$ | async)!!\"\r\n                        (toolbarClick)=\"onToolbarClick($event)\"\r\n                        #formToolbar\r\n                    ></bsu-form-toolbar>\r\n                    @if (jostejoKarbar) {\r\n                    <bsu-layout-control [config]=\"jostejoKarbar\"></bsu-layout-control>\r\n                    } @if (karbaranEntekhabShode) {\r\n                    <bsu-layout-control [config]=\"karbaranEntekhabShode\" style=\"flex: 1\"></bsu-layout-control>\r\n                    }\r\n                </div>\r\n            </div>\r\n            } @else {\r\n            <div\r\n                class=\"tw-absolute tw-top-0 tw-left-0 tw-w-full tw-h-full tw-bg-[url('assets/chat-bg.png')] tw-bg-fixed tw-opacity-25\"\r\n            ></div>\r\n            }\r\n            <div\r\n                class=\"tw-grow tw-shrink tw-relative\"\r\n                [ngClass]=\"{\r\n                    'md:tw-py-6 md:tw-pl-6 tw-hidden md:tw-flex': hasListKarbaran,\r\n                    'tw-flex': !hasListKarbaran\r\n                }\"\r\n            >\r\n                <div\r\n                    @inContentAnimation\r\n                    class=\"tw-h-full tw-bg-gradient-to-r tw-w-full tw-flex tw-flex-col tw-relative tw-overflow-hidden tw-relative\"                  \r\n                >\r\n                    @if(selectedUserProfile) {\r\n                    <bsu-layout-control class=\"ulv-m-0\" [config]=\"selectedUserProfile\"></bsu-layout-control>\r\n                    } @if(listGoftego) {\r\n                    <bsu-layout-control\r\n                        class=\"maincontent tw-relative\"\r\n                        [config]=\"listGoftego\"\r\n                        style=\"flex: 1\"\r\n                    ></bsu-layout-control>\r\n                    } @if(listGoftegoKarbarn) {\r\n                    <bsu-layout-control\r\n                        class=\"maincontent tw-relative\"\r\n                        [config]=\"listGoftegoKarbarn\"\r\n                        style=\"flex: 1\"\r\n                    ></bsu-layout-control>\r\n                    } @if(matnpishrafte) {\r\n                    <bsu-layout-control\r\n                        class=\"maincontent tw-relative\"\r\n                        [config]=\"matnpishrafte\"\r\n                        style=\"flex: 1\"\r\n                    ></bsu-layout-control>\r\n                    }\r\n                    <div\r\n                        class=\"tw-w-full\"\r\n                        [ngClass]=\"{\r\n                            'tw-relative': hasListKarbaran,\r\n                            '2xl:tw-rounded-t-xl tw-grow-0 tw-shrink-0': !hasListKarbaran\r\n                        }\"\r\n                    >\r\n                        @if (replyingMessage()) {\r\n                        <div\r\n                            @inOutReplyingMessage\r\n                            class=\"tw-w-full tw-px-2 tw-py-1 tw-flex tw-gap-2 te-items-center tw-absolute tw-z-0 tw-bg-default tw-right-0 -tw-top-14\"\r\n                        >\r\n                            <button\r\n                                fd-button\r\n                                fdType=\"transparent\"\r\n                                glyph=\"decline\"\r\n                                class=\"tw-grow-0 tw-shrink-0\"\r\n                                (click)=\"replyingMessage.set(null)\"\r\n                            ></button>\r\n                            <div class=\"tw-flex tw-flex-col tw-grow tw-shrink tw-overflow-hidden\">\r\n                                <span class=\"tw-font-bold\">{{ replyingMessage().owner.name }}</span>\r\n                                <span class=\"tw-truncate\">{{\r\n                                    replyingMessage().text ??\r\n                                        replyingMessage().file?.name ??\r\n                                        replyingMessage().image?.name\r\n                                }}</span>\r\n                            </div>\r\n                            <div class=\"tw-w-8 tw-shrink-0 tw-grow-0\"></div>\r\n                        </div>\r\n                        }\r\n                        <div\r\n                            class=\"tw-w-full tw-flex tw-gap-2  tw-bg-default tw-items-end tw-z-10\"\r\n                        >\r\n                            @if(radifGoftego) {\r\n                            <bsu-layout-control [config]=\"radifGoftego\"></bsu-layout-control>\r\n                            }\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n\r\n                <div\r\n                    class=\"tw-absolute tw-top-1/2 -tw-translate-y-1/2 tw-left-1/2 -tw-translate-x-1/2 tw-flex tw-flex-col tw-gap-8 tw-items-center\"\r\n                >\r\n                    <!-- <img src=\"assets/not-selected-chat.png\" class=\"tw-w-64 tw-opacity-25\" /> -->\r\n                    <!--            <span class=\"tw-text-xl tw-font-bold tw-text-gray-400 dark:tw-text-gray-500\">-->\r\n                    <!--                \u0628\u0631\u0627\u06CC \u0634\u0631\u0648\u0639 \u06CC\u06A9 \u0686\u062A \u0631\u0627 \u0627\u0646\u062A\u062E\u0627\u0628 \u06A9\u0646\u06CC\u062F-->\r\n                    <!--            </span>-->\r\n                </div>\r\n            </div>\r\n        </div>\r\n        @if (hasListKarbaran) {\r\n        <div class=\"tw-bg-black/[.3] 2xl:tw-grow tw-shrink tw-h-full\"></div>\r\n        }\r\n    </div>\r\n</ng-template>\r\n", styles: ["bsu-layout-control.maincontent ::ng-deep>bnrc-field-ui>bsu-ui-ulv-main-ui{min-height:100%!important}bsu-layout-control.maincontent ::ng-deep>bnrc-field-ui>bsu-ui-ulv-main-ui>bsu-barsa-ulv-main{display:flex;flex-grow:1}bsu-layout-control.maincontent ::ng-deep>bnrc-field-ui>bsu-ui-ulv-main-ui>bsu-barsa-ulv-main>div{min-height:100%!important;width:100%;flex-grow:1}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "cellEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "flex", "RefreshLabel", "SetVisible"], outputs: ["events"] }, { kind: "component", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: ["toolbarClick"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.ControlUiPipe, name: "controlUi" }], animations: [
             trigger('inContentAnimation', [
                 transition(':enter', [
                     style({ opacity: 0, transform: 'scale(50%, 50%)' }),
@@ -15305,19 +15329,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
                                 animate('300ms ease-in', style({ opacity: 0, transform: 'translateY(50%)' }))
                             ])
                         ])
-                    ], standalone: false, template: "@if(layout94$ | async;as layout94){\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        chatTpl;\r\n        context: {\r\n            mo: mo$ | async,\r\n            karbaranEntekhabShode: '\u06A9\u0627\u0631\u0628\u0631\u0627\u0646 \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u062F\u0647' | controlUi: layout94,\r\n            jostejoKarbar: '\u062C\u0633\u062A\u062C\u0648 \u06A9\u0627\u0631\u0628\u0631' | controlUi: layout94,\r\n            listGoftego: '\u0644\u06CC\u0633\u062A \u06AF\u0641\u062A\u06AF\u0648' | controlUi: layout94,\r\n            listGoftegoKarbarn: '\u0644\u06CC\u0633\u062A \u06AF\u0641\u062A\u06AF\u0648 \u06A9\u0627\u0631\u0628\u0631\u0627\u0646' | controlUi: layout94,\r\n            matnpishrafte: '\u0645\u062A\u0646 \u067E\u06CC\u0634\u0631\u0641\u062A\u0647 \u0635\u0641\u062D\u0647 \u0627\u0648\u0644' | controlUi: layout94,\r\n            radifGoftego: '\u0631\u062F\u06CC\u0641 \u06AF\u0641\u062A\u06AF\u0648 \u0645\u0648\u062C\u0648\u062F\u06CC\u062A' | controlUi: layout94,\r\n            deviceSize: deviceSize$ | async,\r\n            toolbarItems: toolbarItems$ | async,\r\n            dirValue: dirValue$ | async,\r\n            hasListKarbaran: '\u06A9\u0627\u0631\u0628\u0631\u0627\u0646 \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u062F\u0647' | controlUi: layout94\r\n        }\r\n    \"\r\n></ng-container>\r\n}\r\n\r\n<ng-template\r\n    #chatTpl\r\n    let-hasListKarbaran=\"hasListKarbaran\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-dirValue=\"dirValue\"\r\n    let-toolbarItems=\"toolbarItems\"\r\n    let-karbaranEntekhabShode=\"karbaranEntekhabShode\"\r\n    let-jostejoKarbar=\"jostejoKarbar\"\r\n    let-listGoftego=\"listGoftego\"\r\n    let-listGoftegoKarbarn=\"listGoftegoKarbarn\"\r\n    let-matnpishrafte=\"matnpishrafte\"\r\n    let-radifGoftego=\"radifGoftego\"\r\n>\r\n    <div\r\n        class=\"tw-flex tw-w-full tw-bg-gradient-to-r tw-bg-gradient-to-r tw-from-[color-mix(in_srgb,var(--sapBackgroundColor)_95%,black_10%)] tw-to-[var(--sapBackgroundColor)]\"\r\n        fillEmptySpace\r\n        [class.tw-h-screen]=\"!karbaranEntekhabShode\"\r\n        [class.tw-justify-center]=\"karbaranEntekhabShode\"\r\n    >\r\n        @if (hasListKarbaran) {\r\n        <div class=\"tw-bg-black/[.3] 2xl:tw-grow tw-shrink tw-h-full\"></div>\r\n        }\r\n        <div\r\n            class=\"tw-w-full tw-h-full tw-flex tw-shrink-0 tw-relative\"\r\n            [style.background-color]=\"'var(--sapBaseColor)'\"\r\n        >\r\n            @if(hasListKarbaran){\r\n            <div class=\"tw-grow-0 tw-shrink-0 tw-w-full md:tw-w-96 tw-p-0 md:tw-p-6\">\r\n                <div\r\n                    class=\"tw-flex tw-flex-col tw-w-full tw-h-full tw-overflow-hidden tw-border-l tw-border-l-gray-300 md:tw-rounded-2xl md:tw-border md:tw-border-l-gray-300 md:tw-border-gray-300 dark:tw-border-l-gray-600 md:dark:tw-border-l-gray-600 md:dark:tw-border-gray-600\"\r\n                >\r\n                    <bsu-form-toolbar\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [buttons]=\"toolbarItems\"\r\n                        [dirValue]=\"(dirValue$ | async)!!\"\r\n                        (toolbarClick)=\"onToolbarClick($event)\"\r\n                        #formToolbar\r\n                    ></bsu-form-toolbar>\r\n                    @if (jostejoKarbar) {\r\n                    <bsu-layout-control [config]=\"jostejoKarbar\"></bsu-layout-control>\r\n                    } @if (karbaranEntekhabShode) {\r\n                    <bsu-layout-control [config]=\"karbaranEntekhabShode\" style=\"flex: 1\"></bsu-layout-control>\r\n                    }\r\n                </div>\r\n            </div>\r\n            } @else {\r\n            <div\r\n                class=\"tw-absolute tw-top-0 tw-left-0 tw-w-full tw-h-full tw-bg-[url('assets/chat-bg.png')] tw-bg-fixed tw-opacity-25\"\r\n            ></div>\r\n            }\r\n            <div\r\n                class=\"tw-grow tw-shrink tw-relative\"\r\n                [ngClass]=\"{\r\n                    'md:tw-py-6 md:tw-pl-6 tw-hidden md:tw-flex': hasListKarbaran,\r\n                    'tw-flex': !hasListKarbaran\r\n                }\"\r\n            >\r\n                <div\r\n                    @inContentAnimation\r\n                    class=\"tw-h-full tw-bg-gradient-to-r tw-w-full tw-flex tw-flex-col tw-relative md:tw-border-gray-300 md:dark:tw-border-gray-600 tw-overflow-hidden\"\r\n                    [ngClass]=\"{\r\n                        'md:tw-border md:tw-rounded-2xl': hasListKarbaran\r\n                    }\"\r\n                >\r\n                    @if(listGoftego) {\r\n                    <bsu-layout-control class=\"maincontent\" [config]=\"listGoftego\" style=\"flex: 1\"></bsu-layout-control>\r\n                    } @if(listGoftegoKarbarn) {\r\n                    <bsu-layout-control class=\"maincontent\" [config]=\"listGoftegoKarbarn\" style=\"flex: 1\"></bsu-layout-control>\r\n                    } @if(matnpishrafte) {\r\n                    <bsu-layout-control class=\"maincontent\" [config]=\"matnpishrafte\" style=\"flex: 1\"></bsu-layout-control>\r\n                    }\r\n                    <div\r\n                        class=\"tw-w-full\"\r\n                        [ngClass]=\"{\r\n                            'tw-relative': hasListKarbaran,\r\n                            '2xl:tw-rounded-t-xl tw-grow-0 tw-shrink-0': !hasListKarbaran\r\n                        }\"\r\n                    >\r\n                        @if (replyingMessage()) {\r\n                        <div\r\n                            @inOutReplyingMessage\r\n                            class=\"tw-w-full tw-px-2 tw-py-1 tw-border-r-4 tw-border-r-bubble-mine tw-flex tw-gap-2 te-items-center tw-absolute tw-z-0 tw-bg-default tw-right-0 -tw-top-14\"\r\n                        >\r\n                            <button\r\n                                fd-button\r\n                                fdType=\"transparent\"\r\n                                glyph=\"decline\"\r\n                                class=\"tw-grow-0 tw-shrink-0\"\r\n                                (click)=\"replyingMessage.set(null)\"\r\n                            ></button>\r\n                            <div class=\"tw-flex tw-flex-col tw-grow tw-shrink tw-overflow-hidden\">\r\n                                <span class=\"tw-font-bold\">{{ replyingMessage().owner.name }}</span>\r\n                                <span class=\"tw-truncate\">{{\r\n                                    replyingMessage().text ??\r\n                                        replyingMessage().file?.name ??\r\n                                        replyingMessage().image?.name\r\n                                }}</span>\r\n                            </div>\r\n                            <div class=\"tw-w-8 tw-shrink-0 tw-grow-0\"></div>\r\n                        </div>\r\n                        }\r\n                        <div\r\n                            class=\"tw-w-full tw-flex tw-gap-2 tw-border-t tw-border-t-gray-300 dark:tw-border-t-gray-600 tw-bg-default tw-items-end tw-z-10\"\r\n                        >\r\n                            @if(radifGoftego) {\r\n                            <bsu-layout-control [config]=\"radifGoftego\"></bsu-layout-control>\r\n                            }\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n\r\n                <div\r\n                    class=\"tw-absolute tw-top-1/2 -tw-translate-y-1/2 tw-left-1/2 -tw-translate-x-1/2 tw-flex tw-flex-col tw-gap-8 tw-items-center\"\r\n                >\r\n                    <!-- <img src=\"assets/not-selected-chat.png\" class=\"tw-w-64 tw-opacity-25\" /> -->\r\n                    <!--            <span class=\"tw-text-xl tw-font-bold tw-text-gray-400 dark:tw-text-gray-500\">-->\r\n                    <!--                \u0628\u0631\u0627\u06CC \u0634\u0631\u0648\u0639 \u06CC\u06A9 \u0686\u062A \u0631\u0627 \u0627\u0646\u062A\u062E\u0627\u0628 \u06A9\u0646\u06CC\u062F-->\r\n                    <!--            </span>-->\r\n                </div>\r\n            </div>\r\n        </div>\r\n        @if (hasListKarbaran) {\r\n        <div class=\"tw-bg-black/[.3] 2xl:tw-grow tw-shrink tw-h-full\"></div>\r\n        }\r\n    </div>\r\n</ng-template>\r\n", styles: ["bsu-layout-control.maincontent ::ng-deep>bnrc-field-ui>bsu-ui-ulv-main-ui{min-height:100%!important}bsu-layout-control.maincontent ::ng-deep>bnrc-field-ui>bsu-ui-ulv-main-ui>bsu-barsa-ulv-main{display:flex;flex-grow:1}bsu-layout-control.maincontent ::ng-deep>bnrc-field-ui>bsu-ui-ulv-main-ui>bsu-barsa-ulv-main>div{min-height:100%!important;width:100%;flex-grow:1}\n"] }]
+                    ], standalone: false, template: "@if(layout94$ | async;as layout94){\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        chatTpl;\r\n        context: {\r\n            mo: mo$ | async,\r\n            karbaranEntekhabShode: '\u06A9\u0627\u0631\u0628\u0631\u0627\u0646 \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u062F\u0647' | controlUi: layout94,\r\n            jostejoKarbar: '\u062C\u0633\u062A\u062C\u0648 \u06A9\u0627\u0631\u0628\u0631' | controlUi: layout94,\r\n            listGoftego: '\u0644\u06CC\u0633\u062A \u06AF\u0641\u062A\u06AF\u0648' | controlUi: layout94,\r\n            listGoftegoKarbarn: '\u0644\u06CC\u0633\u062A \u06AF\u0641\u062A\u06AF\u0648 \u06A9\u0627\u0631\u0628\u0631\u0627\u0646' | controlUi: layout94,\r\n            matnpishrafte: '\u0645\u062A\u0646 \u067E\u06CC\u0634\u0631\u0641\u062A\u0647 \u0635\u0641\u062D\u0647 \u0627\u0648\u0644' | controlUi: layout94,\r\n            radifGoftego: '\u0631\u062F\u06CC\u0641 \u06AF\u0641\u062A\u06AF\u0648 \u0645\u0648\u062C\u0648\u062F\u06CC\u062A' | controlUi: layout94,\r\n            deviceSize: deviceSize$ | async,\r\n            toolbarItems: toolbarItems$ | async,\r\n            dirValue: dirValue$ | async,\r\n            hasListKarbaran: '\u06A9\u0627\u0631\u0628\u0631\u0627\u0646 \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u062F\u0647' | controlUi: layout94,\r\n            selectedUserProfile: '\u067E\u0631\u0648\u0641\u0627\u06CC\u0644 \u06A9\u0627\u0631\u0628\u0631 \u0627\u0646\u062A\u062E\u0627\u0628 \u0634\u062F\u0647' | controlUi: layout94\r\n        }\r\n    \"\r\n></ng-container>\r\n}\r\n\r\n<ng-template\r\n    #chatTpl\r\n    let-hasListKarbaran=\"hasListKarbaran\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-dirValue=\"dirValue\"\r\n    let-toolbarItems=\"toolbarItems\"\r\n    let-karbaranEntekhabShode=\"karbaranEntekhabShode\"\r\n    let-jostejoKarbar=\"jostejoKarbar\"\r\n    let-listGoftego=\"listGoftego\"\r\n    let-listGoftegoKarbarn=\"listGoftegoKarbarn\"\r\n    let-matnpishrafte=\"matnpishrafte\"\r\n    let-radifGoftego=\"radifGoftego\"\r\n    let-selectedUserProfile=\"selectedUserProfile\"\r\n>\r\n    <div\r\n        class=\"tw-flex tw-w-full tw-bg-gradient-to-r tw-bg-gradient-to-r tw-from-[color-mix(in_srgb,var(--sapBackgroundColor)_95%,black_10%)] tw-to-[var(--sapBackgroundColor)]\"\r\n        fillEmptySpace\r\n        [class.tw-h-screen]=\"!karbaranEntekhabShode\"\r\n        [class.tw-justify-center]=\"karbaranEntekhabShode\"\r\n        [style.border]=\"'var(--fdCard_Border)'\"\r\n    >\r\n        @if (hasListKarbaran) {\r\n        <div class=\"tw-bg-black/[.3] 2xl:tw-grow tw-shrink tw-h-full\"></div>\r\n        }\r\n        <div class=\"tw-w-full tw-h-full tw-flex tw-shrink-0 tw-relative\">\r\n            @if(hasListKarbaran){\r\n            <div class=\"tw-grow-0 tw-shrink-0 tw-w-full md:tw-w-96 tw-p-0\">\r\n                <div\r\n                    [style.background-color]=\"'var(--sapBaseColor)'\"\r\n                    class=\"tw-flex tw-flex-col tw-w-full tw-h-full tw-overflow-hidden\"\r\n                >\r\n                    <bsu-form-toolbar\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [buttons]=\"toolbarItems\"\r\n                        [dirValue]=\"(dirValue$ | async)!!\"\r\n                        (toolbarClick)=\"onToolbarClick($event)\"\r\n                        #formToolbar\r\n                    ></bsu-form-toolbar>\r\n                    @if (jostejoKarbar) {\r\n                    <bsu-layout-control [config]=\"jostejoKarbar\"></bsu-layout-control>\r\n                    } @if (karbaranEntekhabShode) {\r\n                    <bsu-layout-control [config]=\"karbaranEntekhabShode\" style=\"flex: 1\"></bsu-layout-control>\r\n                    }\r\n                </div>\r\n            </div>\r\n            } @else {\r\n            <div\r\n                class=\"tw-absolute tw-top-0 tw-left-0 tw-w-full tw-h-full tw-bg-[url('assets/chat-bg.png')] tw-bg-fixed tw-opacity-25\"\r\n            ></div>\r\n            }\r\n            <div\r\n                class=\"tw-grow tw-shrink tw-relative\"\r\n                [ngClass]=\"{\r\n                    'md:tw-py-6 md:tw-pl-6 tw-hidden md:tw-flex': hasListKarbaran,\r\n                    'tw-flex': !hasListKarbaran\r\n                }\"\r\n            >\r\n                <div\r\n                    @inContentAnimation\r\n                    class=\"tw-h-full tw-bg-gradient-to-r tw-w-full tw-flex tw-flex-col tw-relative tw-overflow-hidden tw-relative\"                  \r\n                >\r\n                    @if(selectedUserProfile) {\r\n                    <bsu-layout-control class=\"ulv-m-0\" [config]=\"selectedUserProfile\"></bsu-layout-control>\r\n                    } @if(listGoftego) {\r\n                    <bsu-layout-control\r\n                        class=\"maincontent tw-relative\"\r\n                        [config]=\"listGoftego\"\r\n                        style=\"flex: 1\"\r\n                    ></bsu-layout-control>\r\n                    } @if(listGoftegoKarbarn) {\r\n                    <bsu-layout-control\r\n                        class=\"maincontent tw-relative\"\r\n                        [config]=\"listGoftegoKarbarn\"\r\n                        style=\"flex: 1\"\r\n                    ></bsu-layout-control>\r\n                    } @if(matnpishrafte) {\r\n                    <bsu-layout-control\r\n                        class=\"maincontent tw-relative\"\r\n                        [config]=\"matnpishrafte\"\r\n                        style=\"flex: 1\"\r\n                    ></bsu-layout-control>\r\n                    }\r\n                    <div\r\n                        class=\"tw-w-full\"\r\n                        [ngClass]=\"{\r\n                            'tw-relative': hasListKarbaran,\r\n                            '2xl:tw-rounded-t-xl tw-grow-0 tw-shrink-0': !hasListKarbaran\r\n                        }\"\r\n                    >\r\n                        @if (replyingMessage()) {\r\n                        <div\r\n                            @inOutReplyingMessage\r\n                            class=\"tw-w-full tw-px-2 tw-py-1 tw-flex tw-gap-2 te-items-center tw-absolute tw-z-0 tw-bg-default tw-right-0 -tw-top-14\"\r\n                        >\r\n                            <button\r\n                                fd-button\r\n                                fdType=\"transparent\"\r\n                                glyph=\"decline\"\r\n                                class=\"tw-grow-0 tw-shrink-0\"\r\n                                (click)=\"replyingMessage.set(null)\"\r\n                            ></button>\r\n                            <div class=\"tw-flex tw-flex-col tw-grow tw-shrink tw-overflow-hidden\">\r\n                                <span class=\"tw-font-bold\">{{ replyingMessage().owner.name }}</span>\r\n                                <span class=\"tw-truncate\">{{\r\n                                    replyingMessage().text ??\r\n                                        replyingMessage().file?.name ??\r\n                                        replyingMessage().image?.name\r\n                                }}</span>\r\n                            </div>\r\n                            <div class=\"tw-w-8 tw-shrink-0 tw-grow-0\"></div>\r\n                        </div>\r\n                        }\r\n                        <div\r\n                            class=\"tw-w-full tw-flex tw-gap-2  tw-bg-default tw-items-end tw-z-10\"\r\n                        >\r\n                            @if(radifGoftego) {\r\n                            <bsu-layout-control [config]=\"radifGoftego\"></bsu-layout-control>\r\n                            }\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n\r\n                <div\r\n                    class=\"tw-absolute tw-top-1/2 -tw-translate-y-1/2 tw-left-1/2 -tw-translate-x-1/2 tw-flex tw-flex-col tw-gap-8 tw-items-center\"\r\n                >\r\n                    <!-- <img src=\"assets/not-selected-chat.png\" class=\"tw-w-64 tw-opacity-25\" /> -->\r\n                    <!--            <span class=\"tw-text-xl tw-font-bold tw-text-gray-400 dark:tw-text-gray-500\">-->\r\n                    <!--                \u0628\u0631\u0627\u06CC \u0634\u0631\u0648\u0639 \u06CC\u06A9 \u0686\u062A \u0631\u0627 \u0627\u0646\u062A\u062E\u0627\u0628 \u06A9\u0646\u06CC\u062F-->\r\n                    <!--            </span>-->\r\n                </div>\r\n            </div>\r\n        </div>\r\n        @if (hasListKarbaran) {\r\n        <div class=\"tw-bg-black/[.3] 2xl:tw-grow tw-shrink tw-h-full\"></div>\r\n        }\r\n    </div>\r\n</ng-template>\r\n", styles: ["bsu-layout-control.maincontent ::ng-deep>bnrc-field-ui>bsu-ui-ulv-main-ui{min-height:100%!important}bsu-layout-control.maincontent ::ng-deep>bnrc-field-ui>bsu-ui-ulv-main-ui>bsu-barsa-ulv-main{display:flex;flex-grow:1}bsu-layout-control.maincontent ::ng-deep>bnrc-field-ui>bsu-ui-ulv-main-ui>bsu-barsa-ulv-main>div{min-height:100%!important;width:100%;flex-grow:1}\n"] }]
         }] });
 
 class BarsaChatContentToolbarComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaChatContentToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaChatContentToolbarComponent, isStandalone: false, selector: "bsu-barsa-chat-content-toolbar", inputs: { avatar: "avatar", title: "title", subtitle: "subtitle", status: "status" }, host: { classAttribute: "tw-shrink-0 tw-grow-0 tw-flex tw-gap-2 tw-justify-between tw-items-center tw-px-4 tw-right-0 tw-w-full tw-h-16 tw-flex tw-bg-zinc-200/[.7] dark:tw-bg-zinc-700/[.7] tw-backdrop-blur-lg tw-z-10" }, ngImport: i0, template: "@if (title) { @if (avatar) {\r\n<img [src]=\"avatar\" class=\"tw-size-12 tw-rounded-full\" />\r\n}\r\n<div class=\"tw-flex tw-grow tw-shrink tw-flex-col tw-items-start tw-justify-between\">\r\n    <span class=\"tw-text-lg tw-font-bold tw-text-base\">{{ title }}</span>\r\n    <span class=\"tw-text-sm tw-text-base\">\r\n        @if (status === 2) {\r\n        <span class=\"tw-relative tw-inline-flex tw-size-2.5 tw-me-1.5\">\r\n            <!--            <span-->\r\n            <!--                class=\"tw-animate-ping tw-absolute tw-inline-flex tw-h-full tw-w-full tw-rounded-full tw-opacity-75\"-->\r\n            <!--                [ngClass]=\"{-->\r\n            <!--                   'tw-bg-gray-300': status === 0,-->\r\n            <!--                   'tw-bg-gray-700': status === 1,-->\r\n            <!--                   'tw-bg-green-600 tw-animate-ping': status === 2,-->\r\n            <!--                   'tw-bg-red-600': status === 3,-->\r\n            <!--                   }\"-->\r\n            <!--            ></span>-->\r\n            <!--            <span-->\r\n            <!--                class=\"tw-inline-flex tw-rounded-full tw-size-2.5\"-->\r\n            <!--                [ngClass]=\"{-->\r\n            <!--                   'tw-bg-gray-300': status === 0,-->\r\n            <!--                   'tw-bg-gray-700': status === 1,-->\r\n            <!--                   'tw-bg-green-600': status === 2,-->\r\n            <!--                   'tw-bg-red-600': status === 3,-->\r\n            <!--                   }\"-->\r\n            <!--            >-->\r\n            <!--            </span>-->\r\n            <span\r\n                class=\"tw-animate-ping tw-absolute tw-inline-flex tw-h-full tw-w-full tw-rounded-full tw-opacity-75 tw-bg-green-600 tw-animate-ping\"\r\n            ></span>\r\n            <span class=\"tw-inline-flex tw-rounded-full tw-size-2.5 tw-bg-green-600\"> </span>\r\n        </span>\r\n        {{ subtitle }}\r\n        }\r\n    </span>\r\n</div>\r\n}\r\n", styles: [""] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaChatContentToolbarComponent, isStandalone: false, selector: "bsu-barsa-chat-content-toolbar", inputs: { avatar: "avatar", title: "title", subtitle: "subtitle", status: "status" }, host: { classAttribute: "tw-shrink-0 tw-grow-0 tw-flex tw-gap-2 tw-justify-between tw-items-center tw-px-4 tw-right-0 tw-w-full tw-h-16 tw-flex tw-bg-zinc-200/[.7] dark:tw-bg-zinc-700/[.7] tw-backdrop-blur-lg tw-z-10" }, ngImport: i0, template: "@if (title) { @if (avatar) {\r\n<img [src]=\"avatar\" class=\"tw-size-12 tw-rounded-full\" />\r\n}\r\n<div class=\"tw-flex tw-grow tw-shrink tw-flex-col tw-items-start tw-justify-between\">\r\n    <span class=\"tw-text-lg tw-font-bold tw-text-base\">{{ title }}</span>\r\n    <span class=\"tw-text-sm tw-text-base\">\r\n        <span class=\"tw-relative tw-inline-flex tw-size-2.5 tw-me-1.5\">\r\n            <span\r\n                class=\"tw-animate-ping tw-absolute tw-inline-flex tw-h-full tw-w-full tw-rounded-full tw-opacity-75\"\r\n                [ngClass]=\"{\r\n                   'tw-bg-gray-300': status === 0,\r\n                   'tw-bg-gray-700': status === 1,\r\n                   'tw-bg-green-600 tw-animate-ping': status === 2,\r\n                   'tw-bg-red-600': status === 3,\r\n                   }\"\r\n            ></span>\r\n            <span\r\n                class=\"tw-inline-flex tw-rounded-full tw-size-2.5\"\r\n                [ngClass]=\"{\r\n                   'tw-bg-gray-300': status === 0,\r\n                   'tw-bg-gray-700': status === 1,\r\n                   'tw-bg-green-600': status === 2,\r\n                   'tw-bg-red-600': status === 3,\r\n                   }\"\r\n            >\r\n            </span>\r\n        </span>\r\n        {{ subtitle }}\r\n    </span>\r\n</div>\r\n}\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaChatContentToolbarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bsu-barsa-chat-content-toolbar', host: {
                         class: 'tw-shrink-0 tw-grow-0 tw-flex tw-gap-2 tw-justify-between tw-items-center tw-px-4 tw-right-0 tw-w-full ' +
                             'tw-h-16 tw-flex tw-bg-zinc-200/[.7] dark:tw-bg-zinc-700/[.7] tw-backdrop-blur-lg tw-z-10'
-                    }, standalone: false, template: "@if (title) { @if (avatar) {\r\n<img [src]=\"avatar\" class=\"tw-size-12 tw-rounded-full\" />\r\n}\r\n<div class=\"tw-flex tw-grow tw-shrink tw-flex-col tw-items-start tw-justify-between\">\r\n    <span class=\"tw-text-lg tw-font-bold tw-text-base\">{{ title }}</span>\r\n    <span class=\"tw-text-sm tw-text-base\">\r\n        @if (status === 2) {\r\n        <span class=\"tw-relative tw-inline-flex tw-size-2.5 tw-me-1.5\">\r\n            <!--            <span-->\r\n            <!--                class=\"tw-animate-ping tw-absolute tw-inline-flex tw-h-full tw-w-full tw-rounded-full tw-opacity-75\"-->\r\n            <!--                [ngClass]=\"{-->\r\n            <!--                   'tw-bg-gray-300': status === 0,-->\r\n            <!--                   'tw-bg-gray-700': status === 1,-->\r\n            <!--                   'tw-bg-green-600 tw-animate-ping': status === 2,-->\r\n            <!--                   'tw-bg-red-600': status === 3,-->\r\n            <!--                   }\"-->\r\n            <!--            ></span>-->\r\n            <!--            <span-->\r\n            <!--                class=\"tw-inline-flex tw-rounded-full tw-size-2.5\"-->\r\n            <!--                [ngClass]=\"{-->\r\n            <!--                   'tw-bg-gray-300': status === 0,-->\r\n            <!--                   'tw-bg-gray-700': status === 1,-->\r\n            <!--                   'tw-bg-green-600': status === 2,-->\r\n            <!--                   'tw-bg-red-600': status === 3,-->\r\n            <!--                   }\"-->\r\n            <!--            >-->\r\n            <!--            </span>-->\r\n            <span\r\n                class=\"tw-animate-ping tw-absolute tw-inline-flex tw-h-full tw-w-full tw-rounded-full tw-opacity-75 tw-bg-green-600 tw-animate-ping\"\r\n            ></span>\r\n            <span class=\"tw-inline-flex tw-rounded-full tw-size-2.5 tw-bg-green-600\"> </span>\r\n        </span>\r\n        {{ subtitle }}\r\n        }\r\n    </span>\r\n</div>\r\n}\r\n" }]
+                    }, standalone: false, template: "@if (title) { @if (avatar) {\r\n<img [src]=\"avatar\" class=\"tw-size-12 tw-rounded-full\" />\r\n}\r\n<div class=\"tw-flex tw-grow tw-shrink tw-flex-col tw-items-start tw-justify-between\">\r\n    <span class=\"tw-text-lg tw-font-bold tw-text-base\">{{ title }}</span>\r\n    <span class=\"tw-text-sm tw-text-base\">\r\n        <span class=\"tw-relative tw-inline-flex tw-size-2.5 tw-me-1.5\">\r\n            <span\r\n                class=\"tw-animate-ping tw-absolute tw-inline-flex tw-h-full tw-w-full tw-rounded-full tw-opacity-75\"\r\n                [ngClass]=\"{\r\n                   'tw-bg-gray-300': status === 0,\r\n                   'tw-bg-gray-700': status === 1,\r\n                   'tw-bg-green-600 tw-animate-ping': status === 2,\r\n                   'tw-bg-red-600': status === 3,\r\n                   }\"\r\n            ></span>\r\n            <span\r\n                class=\"tw-inline-flex tw-rounded-full tw-size-2.5\"\r\n                [ngClass]=\"{\r\n                   'tw-bg-gray-300': status === 0,\r\n                   'tw-bg-gray-700': status === 1,\r\n                   'tw-bg-green-600': status === 2,\r\n                   'tw-bg-red-600': status === 3,\r\n                   }\"\r\n            >\r\n            </span>\r\n        </span>\r\n        {{ subtitle }}\r\n    </span>\r\n</div>\r\n}\r\n" }]
         }], propDecorators: { avatar: [{
                 type: Input
             }], title: [{