barsa-sap-ui 2.0.42 → 2.0.44

package/fesm2022/barsa-sap-ui.mjs

@@ -2442,11 +2442,11 @@ class UlvToolbarComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvToolbarComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: { allowGridColumnSort: "allowGridColumnSort", useLayoutItemTextForControl: "useLayoutItemTextForControl", enableSearch: "enableSearch", hideTitle: "hideTitle", title: "title", icon: "icon", deviceName: "deviceName", deviceSize: "deviceSize", access: "access", hideToolbar: "hideToolbar", toolbarButtons: "toolbarButtons", contentDensity: "contentDensity", inlineEditMode: "inlineEditMode", allowInlineEdit: "allowInlineEdit", gridSetting: "gridSetting", viewCollection: "viewCollection", reportView: "reportView", inDialog: "inDialog", isMultiSelect: "isMultiSelect", hasSelected: "hasSelected", config: "config", hidden: "hidden", buttons: "buttons", moDataListCount: "moDataListCount" }, outputs: { search: "search", groupbyClick: "groupbyClick", sortClick: "sortClick", columnClick: "columnClick", editModeClick: "editModeClick", viewClick: "viewClick", createNewInlineMo: "createNewInlineMo" }, viewQueries: [{ propertyName: "_tlbCmp", first: true, predicate: ToolbarComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (!useLayoutItemTextForControl && !hideToolbar) {\n<fd-toolbar\n    #toolbar\n    [shouldOverflow]=\"deviceSize === 's'\"\n    [ngClass]=\"deviceSize\"\n    [hasTitle]=\"!hideTitle\"\n    [forceOverflow]=\"true\"\n>\n    @if(!hideTitle && deviceSize !== 's' ? (title | bbbTranslate) : ''){ @if(icon){\n    <fd-icon [glyph]=\"icon\"></fd-icon>\n    }\n    <h4 fd-title>{{ title | bbbTranslate }}</h4>\n    } @if (deviceSize !== 's') {\n    <fd-toolbar-spacer fd-toolbar-item></fd-toolbar-spacer>\n    } @if (!hideToolbar) { @for (btn of toolbarButtons; track _trackBy(i, btn); let i = $index) { @if (btn !== '-' &&\n    btn.Command && !btn.Command.CustomUi && !btn.menu) {\n    <button\n        fd-button\n        fd-toolbar-item\n        [attr.fdOverflowPriority]=\"btn.itemId === 'Edit' ? 'always' : btn.Command?.IsBuiltin ? 'low' : 'high'\"\n        [ulvCommandHandler]=\"btn\"\n        [disable]=\"inlineEditMode && btn.itemId === 'New'\"\n        [disabled]=\"btn.Command._isEnable === false ? true : false\"\n        [fdType]=\"!btn.Command._isEnable ? 'transparent' : btn.Command.JsonExtraProp?.Design || 'transparent'\"\n        [glyph]=\"deviceSize === 's' ? null : btn.Command.JsonExtraProp?.Icon\"\n        [title]=\"(btn.Command?.IsBuiltin ? btn.text : '') | bbbTranslate\"\n        (click)=\"inlineEditMode && btn.itemId === 'New' && createNewInlineMo.emit()\"\n        bodyClick\n    >\n        @if (!btn.Command.JsonExtraProp?.Icon && !btn.Command?.IsBuiltin && btn.icon) {\n        <img width=\"16\" [src]=\"btn.icon\" />\n        } @if (!btn.hideText || deviceSize === 's') {\n        <span>{{ btn.text | bbbTranslate }}</span>\n        }\n    </button>\n    } @if ((btn === '-' || btn.type === 'seperator') && deviceName !== 'mobile') {\n    <fd-toolbar-separator fd-toolbar-item></fd-toolbar-separator>\n    } @if (btn.menu) {\n    <button\n        fd-button\n        fd-toolbar-item\n        [fdMenu]=\"true\"\n        [fdType]=\"btn.Command?.IsBuiltin ? 'standard' : 'transparent'\"\n        [label]=\"btn.text | bbbTranslate\"\n        [ariaLabel]=\"btn.text | bbbTranslate\"\n        [fdMenuTrigger]=\"menu\"\n        bodyClick\n    >\n        <fd-menu #menu>\n            @for (btnCommand of btn.menu.items; track btnCommand) {\n            <li fd-menu-item [ulvCommandHandler]=\"btnCommand\" (click)=\"menu.close()\">\n                <div fd-menu-interactive>\n                    <span fd-menu-title>{{ btnCommand.text | bbbTranslate }}</span>\n                </div>\n            </li>\n            }\n        </fd-menu>\n    </button>\n    } @if (btn !== '-' && btn.Command && btn.Command.CustomUi) {\n    <bnrc-dynamic-form-toolbaritem\n        fd-toolbar-item\n        [ulvCommandHandler]=\"btn\"\n        [component]=\"btn.Command?.CustomUi\"\n        [context]=\"btn\"\n        [isEnable]=\"btn.Command?._isEnable\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        bodyClick\n    ></bnrc-dynamic-form-toolbaritem>\n    } }\n    <ng-content select=\"[fd-toolbar-item]\"></ng-content>\n    @if (allowInlineEdit && access?.Edit) {\n    <button\n        fd-button\n        fd-toolbar-item\n        [fdType]=\"inlineEditMode ? 'emphasized' : 'transparent'\"\n        [glyph]=\"'edit'\"\n        [label]=\"deviceSize === 's' ? ('Inline Edit In List' | bbbTranslate) : ''\"\n        (click)=\"onEditMode()\"\n        [attr.fdOverflowPriority]=\"'always'\"\n        [title]=\"'Inline Edit In List' | bbbTranslate\"\n        bodyClick\n    ></button>\n    } @if (gridSetting && gridSetting.Hidden !== true && allowGridColumnSort) { @if (deviceSize === 's') {\n    <button\n        fd-toolbar-item\n        fd-button\n        [contentDensity]=\"contentDensity\"\n        fdType=\"transparent\"\n        [attr.fdOverflowPriority]=\"'always'\"\n        (click)=\"onGroupbySettings()\"\n        [label]=\"'Groups' | bbbTranslate\"\n        bodyClick\n    ></button>\n    <button\n        fd-toolbar-item\n        fd-button\n        [contentDensity]=\"contentDensity\"\n        fdType=\"transparent\"\n        [attr.fdOverflowPriority]=\"'always'\"\n        (click)=\"onSortSettings()\"\n        [label]=\"'Sort' | bbbTranslate\"\n        bodyClick\n    ></button>\n    <button\n        fd-toolbar-item\n        fd-button\n        [contentDensity]=\"contentDensity\"\n        fdType=\"transparent\"\n        [attr.fdOverflowPriority]=\"'always'\"\n        (click)=\"onColumnSettings()\"\n        [label]=\"'Columns' | bbbTranslate\"\n        bodyClick\n    ></button>\n    } @if (deviceSize !== 's') {\n    <button\n        fd-button\n        fd-toolbar-item\n        [attr.fdOverflowPriority]=\"'never'\"\n        [fdMenu]=\"true\"\n        fdType=\"transparent\"\n        glyph=\"action-settings\"\n        [title]=\"'Settings' | bbbTranslate\"\n        [fdMenuTrigger]=\"tableMenuSettings\"\n        bodyClick\n    ></button>\n    }\n    <fd-menu #tableMenuSettings>\n        <li fd-menu-item>\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onColumnSettings()\" bodyClick>\n                <fd-menu-addon position=\"before\" glyph=\"action-settings\"></fd-menu-addon>\n                <span fd-menu-title>\n                    {{ 'Columns' | bbbTranslate }}\n                </span>\n            </div>\n        </li>\n        <li fd-menu-item>\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onSortSettings()\" bodyClick>\n                <fd-menu-addon position=\"before\" glyph=\"sort\"></fd-menu-addon>\n                <span fd-menu-title>\n                    {{ 'Sort' | bbbTranslate }}\n                </span>\n            </div>\n        </li>\n        <li fd-menu-item>\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onGroupbySettings()\" bodyClick>\n                <fd-menu-addon position=\"before\" glyph=\"group-2\"></fd-menu-addon>\n                <span fd-menu-title>\n                    {{ 'Groups' | bbbTranslate }}\n                </span>\n            </div>\n        </li>\n    </fd-menu>\n    } @if (viewCollection && viewCollection.length > 1) {\n    <fd-split-button\n        fd-toolbar-item\n        [attr.fdOverflowPriority]=\"deviceSize === 's' ? 'always' : 'low'\"\n        [fdType]=\"'transparent'\"\n        [mainAction]=\"{\n            keepMainAction: true,\n            mainActionTitle: splitBtnTitle\n        }\"\n    >\n        <fd-menu>\n            @for (viewObject of viewCollection; track viewObject) {\n            <li fd-menu-item>\n                <div fd-menu-interactive (click)=\"onChangeView(viewObject)\" bodyClick>\n                    <span fd-menu-title>\n                        <fd-icon [glyph]=\"viewObject.UiComponent.Settings?.Icon\"> </fd-icon>\n                    </span>\n                </div>\n            </li>\n            }\n        </fd-menu>\n    </fd-split-button>\n    }\n    <ng-template #splitBtnTitle>\n        <fd-icon [glyph]=\"reportView.UiComponent.Settings?.Icon\"></fd-icon>\n    </ng-template>\n    <ng-template #splitBtnSettings>\n        <fd-icon [glyph]=\"'action-settings'\"></fd-icon>\n    </ng-template>\n    }\n</fd-toolbar>\n}\n", styles: [":host{display:block;width:100%;position:relative}:host ::ng-deep .fd-toolbar{flex-wrap:nowrap!important}:host ::ng-deep .fd-toolbar{border-top:var(--sapList_BorderWidth) solid var(--sapList_BorderColor);border-left:var(--sapList_BorderWidth) solid var(--sapList_BorderColor);border-right:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host fd-toolbar.s ::ng-deep .fd-toolbar{justify-content:end}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.UlvCommandDirective, selector: "[ulvCommandHandler]", inputs: ["ulvCommandHandler", "disable"], outputs: ["commandClick"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i6$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: { allowGridColumnSort: "allowGridColumnSort", useLayoutItemTextForControl: "useLayoutItemTextForControl", enableSearch: "enableSearch", hideTitle: "hideTitle", title: "title", icon: "icon", deviceName: "deviceName", deviceSize: "deviceSize", access: "access", hideToolbar: "hideToolbar", toolbarButtons: "toolbarButtons", contentDensity: "contentDensity", inlineEditMode: "inlineEditMode", allowInlineEdit: "allowInlineEdit", gridSetting: "gridSetting", viewCollection: "viewCollection", reportView: "reportView", inDialog: "inDialog", isMultiSelect: "isMultiSelect", hasSelected: "hasSelected", config: "config", hidden: "hidden", buttons: "buttons", moDataListCount: "moDataListCount" }, outputs: { search: "search", groupbyClick: "groupbyClick", sortClick: "sortClick", columnClick: "columnClick", editModeClick: "editModeClick", viewClick: "viewClick", createNewInlineMo: "createNewInlineMo" }, viewQueries: [{ propertyName: "_tlbCmp", first: true, predicate: ToolbarComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (!useLayoutItemTextForControl && !hideToolbar) {\r\n<fd-toolbar\r\n    #toolbar\r\n    [shouldOverflow]=\"deviceSize === 's'\"\r\n    [ngClass]=\"deviceSize\"\r\n    [hasTitle]=\"!hideTitle\"\r\n    [forceOverflow]=\"true\"\r\n>\r\n    @if(!hideTitle && deviceSize !== 's' ? (title | bbbTranslate) : ''){ @if(icon){\r\n    <fd-icon [glyph]=\"icon\"></fd-icon>\r\n    }\r\n    <h4 fd-title>{{ title | bbbTranslate }}</h4>\r\n    } @if (deviceSize !== 's') {\r\n    <fd-toolbar-spacer fd-toolbar-item></fd-toolbar-spacer>\r\n    } @if (!hideToolbar) { @for (btn of toolbarButtons; track _trackBy(i, btn); let i = $index) { @if (btn !== '-' &&\r\n    btn.Command && !btn.Command.CustomUi && !btn.menu) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"btn.itemId === 'Edit' ? 'always' : btn.Command?.IsBuiltin ? 'low' : 'high'\"\r\n        [ulvCommandHandler]=\"btn\"\r\n        [disable]=\"inlineEditMode && btn.itemId === 'New'\"\r\n        [disabled]=\"btn.Command._isEnable === false ? true : false\"\r\n        [fdType]=\"!btn.Command._isEnable ? 'transparent' : btn.Command.JsonExtraProp?.Design || 'transparent'\"\r\n        [glyph]=\"deviceSize === 's' ? null : btn.Command.JsonExtraProp?.Icon\"\r\n        [title]=\"(btn.Command?.IsBuiltin ? btn.text : '') | bbbTranslate\"\r\n        (click)=\"inlineEditMode && btn.itemId === 'New' && createNewInlineMo.emit()\"\r\n        bodyClick\r\n    >\r\n        @if (!btn.Command.JsonExtraProp?.Icon && !btn.Command?.IsBuiltin && btn.icon) {\r\n        <img width=\"16\" [src]=\"btn.icon\" />\r\n        } @if (!btn.hideText || deviceSize === 's') {\r\n        <span>{{ btn.text | bbbTranslate }}</span>\r\n        }\r\n    </button>\r\n    } @if ((btn === '-' || btn.type === 'seperator') && deviceName !== 'mobile') {\r\n    <fd-toolbar-separator fd-toolbar-item></fd-toolbar-separator>\r\n    } @if (btn.menu) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [fdMenu]=\"true\"\r\n        [fdType]=\"btn.Command?.IsBuiltin ? 'standard' : 'transparent'\"\r\n        [label]=\"btn.text | bbbTranslate\"\r\n        [ariaLabel]=\"btn.text | bbbTranslate\"\r\n        [fdMenuTrigger]=\"menu\"\r\n        bodyClick\r\n    >\r\n        <fd-menu #menu>\r\n            @for (btnCommand of btn.menu.items; track btnCommand) {\r\n            <li fd-menu-item [ulvCommandHandler]=\"btnCommand\" (click)=\"menu.close()\">\r\n                <div fd-menu-interactive>\r\n                    <span fd-menu-title>{{ btnCommand.text | bbbTranslate }}</span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </button>\r\n    } @if (btn !== '-' && btn.Command && btn.Command.CustomUi) {\r\n    <bnrc-dynamic-form-toolbaritem\r\n        fd-toolbar-item\r\n        [ulvCommandHandler]=\"btn\"\r\n        [component]=\"btn.Command?.CustomUi\"\r\n        [context]=\"btn\"\r\n        [isEnable]=\"btn.Command?._isEnable\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        bodyClick\r\n    ></bnrc-dynamic-form-toolbaritem>\r\n    } }\r\n    <ng-content select=\"[fd-toolbar-item]\"></ng-content>\r\n    @if (allowInlineEdit && access?.Edit) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [fdType]=\"inlineEditMode ? 'emphasized' : 'transparent'\"\r\n        [glyph]=\"'edit'\"\r\n        [label]=\"deviceSize === 's' ? ('Inline Edit In List' | bbbTranslate) : ''\"\r\n        (click)=\"onEditMode()\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        [title]=\"'Inline Edit In List' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    } @if (gridSetting && gridSetting.Hidden !== true && allowGridColumnSort) { @if (deviceSize === 's') {\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        [contentDensity]=\"contentDensity\"\r\n        fdType=\"transparent\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        (click)=\"onGroupbySettings()\"\r\n        [label]=\"'Groups' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        [contentDensity]=\"contentDensity\"\r\n        fdType=\"transparent\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        (click)=\"onSortSettings()\"\r\n        [label]=\"'Sort' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        [contentDensity]=\"contentDensity\"\r\n        fdType=\"transparent\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        (click)=\"onColumnSettings()\"\r\n        [label]=\"'Columns' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    } @if (deviceSize !== 's') {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"'never'\"\r\n        [fdMenu]=\"true\"\r\n        fdType=\"transparent\"\r\n        glyph=\"action-settings\"\r\n        [title]=\"'Settings' | bbbTranslate\"\r\n        [fdMenuTrigger]=\"tableMenuSettings\"\r\n        bodyClick\r\n    ></button>\r\n    }\r\n    <fd-menu #tableMenuSettings>\r\n        <li fd-menu-item>\r\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onColumnSettings()\" bodyClick>\r\n                <fd-menu-addon position=\"before\" glyph=\"action-settings\"></fd-menu-addon>\r\n                <span fd-menu-title>\r\n                    {{ 'Columns' | bbbTranslate }}\r\n                </span>\r\n            </div>\r\n        </li>\r\n        <li fd-menu-item>\r\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onSortSettings()\" bodyClick>\r\n                <fd-menu-addon position=\"before\" glyph=\"sort\"></fd-menu-addon>\r\n                <span fd-menu-title>\r\n                    {{ 'Sort' | bbbTranslate }}\r\n                </span>\r\n            </div>\r\n        </li>\r\n        <li fd-menu-item>\r\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onGroupbySettings()\" bodyClick>\r\n                <fd-menu-addon position=\"before\" glyph=\"group-2\"></fd-menu-addon>\r\n                <span fd-menu-title>\r\n                    {{ 'Groups' | bbbTranslate }}\r\n                </span>\r\n            </div>\r\n        </li>\r\n    </fd-menu>\r\n    } @if (viewCollection && viewCollection.length > 1) {\r\n    <fd-split-button\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"deviceSize === 's' ? 'always' : 'low'\"\r\n        [fdType]=\"'transparent'\"\r\n        [mainAction]=\"{\r\n            keepMainAction: true,\r\n            mainActionTitle: splitBtnTitle\r\n        }\"\r\n    >\r\n        <fd-menu>\r\n            @for (viewObject of viewCollection; track viewObject) {\r\n            <li fd-menu-item>\r\n                <div fd-menu-interactive (click)=\"onChangeView(viewObject)\" bodyClick>\r\n                    <span fd-menu-title>\r\n                        <fd-icon [glyph]=\"viewObject.UiComponent.Settings?.Icon\"> </fd-icon>\r\n                    </span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </fd-split-button>\r\n    }\r\n    <ng-template #splitBtnTitle>\r\n        <fd-icon [glyph]=\"reportView.UiComponent.Settings?.Icon\"></fd-icon>\r\n    </ng-template>\r\n    <ng-template #splitBtnSettings>\r\n        <fd-icon [glyph]=\"'action-settings'\"></fd-icon>\r\n    </ng-template>\r\n    }\r\n</fd-toolbar>\r\n}\r\n", styles: [":host{display:block;width:100%;position:relative}:host ::ng-deep .fd-toolbar{flex-wrap:nowrap!important}:host ::ng-deep .fd-toolbar{border-top:var(--sapList_BorderWidth) solid var(--sapList_BorderColor);border-left:var(--sapList_BorderWidth) solid var(--sapList_BorderColor);border-right:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host fd-toolbar.s ::ng-deep .fd-toolbar{justify-content:end}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.UlvCommandDirective, selector: "[ulvCommandHandler]", inputs: ["ulvCommandHandler", "disable"], outputs: ["commandClick"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i6$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i6$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i6$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i6$1.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: UlvToolbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ulv-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!useLayoutItemTextForControl && !hideToolbar) {\n<fd-toolbar\n    #toolbar\n    [shouldOverflow]=\"deviceSize === 's'\"\n    [ngClass]=\"deviceSize\"\n    [hasTitle]=\"!hideTitle\"\n    [forceOverflow]=\"true\"\n>\n    @if(!hideTitle && deviceSize !== 's' ? (title | bbbTranslate) : ''){ @if(icon){\n    <fd-icon [glyph]=\"icon\"></fd-icon>\n    }\n    <h4 fd-title>{{ title | bbbTranslate }}</h4>\n    } @if (deviceSize !== 's') {\n    <fd-toolbar-spacer fd-toolbar-item></fd-toolbar-spacer>\n    } @if (!hideToolbar) { @for (btn of toolbarButtons; track _trackBy(i, btn); let i = $index) { @if (btn !== '-' &&\n    btn.Command && !btn.Command.CustomUi && !btn.menu) {\n    <button\n        fd-button\n        fd-toolbar-item\n        [attr.fdOverflowPriority]=\"btn.itemId === 'Edit' ? 'always' : btn.Command?.IsBuiltin ? 'low' : 'high'\"\n        [ulvCommandHandler]=\"btn\"\n        [disable]=\"inlineEditMode && btn.itemId === 'New'\"\n        [disabled]=\"btn.Command._isEnable === false ? true : false\"\n        [fdType]=\"!btn.Command._isEnable ? 'transparent' : btn.Command.JsonExtraProp?.Design || 'transparent'\"\n        [glyph]=\"deviceSize === 's' ? null : btn.Command.JsonExtraProp?.Icon\"\n        [title]=\"(btn.Command?.IsBuiltin ? btn.text : '') | bbbTranslate\"\n        (click)=\"inlineEditMode && btn.itemId === 'New' && createNewInlineMo.emit()\"\n        bodyClick\n    >\n        @if (!btn.Command.JsonExtraProp?.Icon && !btn.Command?.IsBuiltin && btn.icon) {\n        <img width=\"16\" [src]=\"btn.icon\" />\n        } @if (!btn.hideText || deviceSize === 's') {\n        <span>{{ btn.text | bbbTranslate }}</span>\n        }\n    </button>\n    } @if ((btn === '-' || btn.type === 'seperator') && deviceName !== 'mobile') {\n    <fd-toolbar-separator fd-toolbar-item></fd-toolbar-separator>\n    } @if (btn.menu) {\n    <button\n        fd-button\n        fd-toolbar-item\n        [fdMenu]=\"true\"\n        [fdType]=\"btn.Command?.IsBuiltin ? 'standard' : 'transparent'\"\n        [label]=\"btn.text | bbbTranslate\"\n        [ariaLabel]=\"btn.text | bbbTranslate\"\n        [fdMenuTrigger]=\"menu\"\n        bodyClick\n    >\n        <fd-menu #menu>\n            @for (btnCommand of btn.menu.items; track btnCommand) {\n            <li fd-menu-item [ulvCommandHandler]=\"btnCommand\" (click)=\"menu.close()\">\n                <div fd-menu-interactive>\n                    <span fd-menu-title>{{ btnCommand.text | bbbTranslate }}</span>\n                </div>\n            </li>\n            }\n        </fd-menu>\n    </button>\n    } @if (btn !== '-' && btn.Command && btn.Command.CustomUi) {\n    <bnrc-dynamic-form-toolbaritem\n        fd-toolbar-item\n        [ulvCommandHandler]=\"btn\"\n        [component]=\"btn.Command?.CustomUi\"\n        [context]=\"btn\"\n        [isEnable]=\"btn.Command?._isEnable\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        bodyClick\n    ></bnrc-dynamic-form-toolbaritem>\n    } }\n    <ng-content select=\"[fd-toolbar-item]\"></ng-content>\n    @if (allowInlineEdit && access?.Edit) {\n    <button\n        fd-button\n        fd-toolbar-item\n        [fdType]=\"inlineEditMode ? 'emphasized' : 'transparent'\"\n        [glyph]=\"'edit'\"\n        [label]=\"deviceSize === 's' ? ('Inline Edit In List' | bbbTranslate) : ''\"\n        (click)=\"onEditMode()\"\n        [attr.fdOverflowPriority]=\"'always'\"\n        [title]=\"'Inline Edit In List' | bbbTranslate\"\n        bodyClick\n    ></button>\n    } @if (gridSetting && gridSetting.Hidden !== true && allowGridColumnSort) { @if (deviceSize === 's') {\n    <button\n        fd-toolbar-item\n        fd-button\n        [contentDensity]=\"contentDensity\"\n        fdType=\"transparent\"\n        [attr.fdOverflowPriority]=\"'always'\"\n        (click)=\"onGroupbySettings()\"\n        [label]=\"'Groups' | bbbTranslate\"\n        bodyClick\n    ></button>\n    <button\n        fd-toolbar-item\n        fd-button\n        [contentDensity]=\"contentDensity\"\n        fdType=\"transparent\"\n        [attr.fdOverflowPriority]=\"'always'\"\n        (click)=\"onSortSettings()\"\n        [label]=\"'Sort' | bbbTranslate\"\n        bodyClick\n    ></button>\n    <button\n        fd-toolbar-item\n        fd-button\n        [contentDensity]=\"contentDensity\"\n        fdType=\"transparent\"\n        [attr.fdOverflowPriority]=\"'always'\"\n        (click)=\"onColumnSettings()\"\n        [label]=\"'Columns' | bbbTranslate\"\n        bodyClick\n    ></button>\n    } @if (deviceSize !== 's') {\n    <button\n        fd-button\n        fd-toolbar-item\n        [attr.fdOverflowPriority]=\"'never'\"\n        [fdMenu]=\"true\"\n        fdType=\"transparent\"\n        glyph=\"action-settings\"\n        [title]=\"'Settings' | bbbTranslate\"\n        [fdMenuTrigger]=\"tableMenuSettings\"\n        bodyClick\n    ></button>\n    }\n    <fd-menu #tableMenuSettings>\n        <li fd-menu-item>\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onColumnSettings()\" bodyClick>\n                <fd-menu-addon position=\"before\" glyph=\"action-settings\"></fd-menu-addon>\n                <span fd-menu-title>\n                    {{ 'Columns' | bbbTranslate }}\n                </span>\n            </div>\n        </li>\n        <li fd-menu-item>\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onSortSettings()\" bodyClick>\n                <fd-menu-addon position=\"before\" glyph=\"sort\"></fd-menu-addon>\n                <span fd-menu-title>\n                    {{ 'Sort' | bbbTranslate }}\n                </span>\n            </div>\n        </li>\n        <li fd-menu-item>\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onGroupbySettings()\" bodyClick>\n                <fd-menu-addon position=\"before\" glyph=\"group-2\"></fd-menu-addon>\n                <span fd-menu-title>\n                    {{ 'Groups' | bbbTranslate }}\n                </span>\n            </div>\n        </li>\n    </fd-menu>\n    } @if (viewCollection && viewCollection.length > 1) {\n    <fd-split-button\n        fd-toolbar-item\n        [attr.fdOverflowPriority]=\"deviceSize === 's' ? 'always' : 'low'\"\n        [fdType]=\"'transparent'\"\n        [mainAction]=\"{\n            keepMainAction: true,\n            mainActionTitle: splitBtnTitle\n        }\"\n    >\n        <fd-menu>\n            @for (viewObject of viewCollection; track viewObject) {\n            <li fd-menu-item>\n                <div fd-menu-interactive (click)=\"onChangeView(viewObject)\" bodyClick>\n                    <span fd-menu-title>\n                        <fd-icon [glyph]=\"viewObject.UiComponent.Settings?.Icon\"> </fd-icon>\n                    </span>\n                </div>\n            </li>\n            }\n        </fd-menu>\n    </fd-split-button>\n    }\n    <ng-template #splitBtnTitle>\n        <fd-icon [glyph]=\"reportView.UiComponent.Settings?.Icon\"></fd-icon>\n    </ng-template>\n    <ng-template #splitBtnSettings>\n        <fd-icon [glyph]=\"'action-settings'\"></fd-icon>\n    </ng-template>\n    }\n</fd-toolbar>\n}\n", styles: [":host{display:block;width:100%;position:relative}:host ::ng-deep .fd-toolbar{flex-wrap:nowrap!important}:host ::ng-deep .fd-toolbar{border-top:var(--sapList_BorderWidth) solid var(--sapList_BorderColor);border-left:var(--sapList_BorderWidth) solid var(--sapList_BorderColor);border-right:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host fd-toolbar.s ::ng-deep .fd-toolbar{justify-content:end}\n"] }]
+            args: [{ selector: 'bsu-ulv-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!useLayoutItemTextForControl && !hideToolbar) {\r\n<fd-toolbar\r\n    #toolbar\r\n    [shouldOverflow]=\"deviceSize === 's'\"\r\n    [ngClass]=\"deviceSize\"\r\n    [hasTitle]=\"!hideTitle\"\r\n    [forceOverflow]=\"true\"\r\n>\r\n    @if(!hideTitle && deviceSize !== 's' ? (title | bbbTranslate) : ''){ @if(icon){\r\n    <fd-icon [glyph]=\"icon\"></fd-icon>\r\n    }\r\n    <h4 fd-title>{{ title | bbbTranslate }}</h4>\r\n    } @if (deviceSize !== 's') {\r\n    <fd-toolbar-spacer fd-toolbar-item></fd-toolbar-spacer>\r\n    } @if (!hideToolbar) { @for (btn of toolbarButtons; track _trackBy(i, btn); let i = $index) { @if (btn !== '-' &&\r\n    btn.Command && !btn.Command.CustomUi && !btn.menu) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"btn.itemId === 'Edit' ? 'always' : btn.Command?.IsBuiltin ? 'low' : 'high'\"\r\n        [ulvCommandHandler]=\"btn\"\r\n        [disable]=\"inlineEditMode && btn.itemId === 'New'\"\r\n        [disabled]=\"btn.Command._isEnable === false ? true : false\"\r\n        [fdType]=\"!btn.Command._isEnable ? 'transparent' : btn.Command.JsonExtraProp?.Design || 'transparent'\"\r\n        [glyph]=\"deviceSize === 's' ? null : btn.Command.JsonExtraProp?.Icon\"\r\n        [title]=\"(btn.Command?.IsBuiltin ? btn.text : '') | bbbTranslate\"\r\n        (click)=\"inlineEditMode && btn.itemId === 'New' && createNewInlineMo.emit()\"\r\n        bodyClick\r\n    >\r\n        @if (!btn.Command.JsonExtraProp?.Icon && !btn.Command?.IsBuiltin && btn.icon) {\r\n        <img width=\"16\" [src]=\"btn.icon\" />\r\n        } @if (!btn.hideText || deviceSize === 's') {\r\n        <span>{{ btn.text | bbbTranslate }}</span>\r\n        }\r\n    </button>\r\n    } @if ((btn === '-' || btn.type === 'seperator') && deviceName !== 'mobile') {\r\n    <fd-toolbar-separator fd-toolbar-item></fd-toolbar-separator>\r\n    } @if (btn.menu) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [fdMenu]=\"true\"\r\n        [fdType]=\"btn.Command?.IsBuiltin ? 'standard' : 'transparent'\"\r\n        [label]=\"btn.text | bbbTranslate\"\r\n        [ariaLabel]=\"btn.text | bbbTranslate\"\r\n        [fdMenuTrigger]=\"menu\"\r\n        bodyClick\r\n    >\r\n        <fd-menu #menu>\r\n            @for (btnCommand of btn.menu.items; track btnCommand) {\r\n            <li fd-menu-item [ulvCommandHandler]=\"btnCommand\" (click)=\"menu.close()\">\r\n                <div fd-menu-interactive>\r\n                    <span fd-menu-title>{{ btnCommand.text | bbbTranslate }}</span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </button>\r\n    } @if (btn !== '-' && btn.Command && btn.Command.CustomUi) {\r\n    <bnrc-dynamic-form-toolbaritem\r\n        fd-toolbar-item\r\n        [ulvCommandHandler]=\"btn\"\r\n        [component]=\"btn.Command?.CustomUi\"\r\n        [context]=\"btn\"\r\n        [isEnable]=\"btn.Command?._isEnable\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        bodyClick\r\n    ></bnrc-dynamic-form-toolbaritem>\r\n    } }\r\n    <ng-content select=\"[fd-toolbar-item]\"></ng-content>\r\n    @if (allowInlineEdit && access?.Edit) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [fdType]=\"inlineEditMode ? 'emphasized' : 'transparent'\"\r\n        [glyph]=\"'edit'\"\r\n        [label]=\"deviceSize === 's' ? ('Inline Edit In List' | bbbTranslate) : ''\"\r\n        (click)=\"onEditMode()\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        [title]=\"'Inline Edit In List' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    } @if (gridSetting && gridSetting.Hidden !== true && allowGridColumnSort) { @if (deviceSize === 's') {\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        [contentDensity]=\"contentDensity\"\r\n        fdType=\"transparent\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        (click)=\"onGroupbySettings()\"\r\n        [label]=\"'Groups' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        [contentDensity]=\"contentDensity\"\r\n        fdType=\"transparent\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        (click)=\"onSortSettings()\"\r\n        [label]=\"'Sort' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        [contentDensity]=\"contentDensity\"\r\n        fdType=\"transparent\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        (click)=\"onColumnSettings()\"\r\n        [label]=\"'Columns' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    } @if (deviceSize !== 's') {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"'never'\"\r\n        [fdMenu]=\"true\"\r\n        fdType=\"transparent\"\r\n        glyph=\"action-settings\"\r\n        [title]=\"'Settings' | bbbTranslate\"\r\n        [fdMenuTrigger]=\"tableMenuSettings\"\r\n        bodyClick\r\n    ></button>\r\n    }\r\n    <fd-menu #tableMenuSettings>\r\n        <li fd-menu-item>\r\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onColumnSettings()\" bodyClick>\r\n                <fd-menu-addon position=\"before\" glyph=\"action-settings\"></fd-menu-addon>\r\n                <span fd-menu-title>\r\n                    {{ 'Columns' | bbbTranslate }}\r\n                </span>\r\n            </div>\r\n        </li>\r\n        <li fd-menu-item>\r\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onSortSettings()\" bodyClick>\r\n                <fd-menu-addon position=\"before\" glyph=\"sort\"></fd-menu-addon>\r\n                <span fd-menu-title>\r\n                    {{ 'Sort' | bbbTranslate }}\r\n                </span>\r\n            </div>\r\n        </li>\r\n        <li fd-menu-item>\r\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onGroupbySettings()\" bodyClick>\r\n                <fd-menu-addon position=\"before\" glyph=\"group-2\"></fd-menu-addon>\r\n                <span fd-menu-title>\r\n                    {{ 'Groups' | bbbTranslate }}\r\n                </span>\r\n            </div>\r\n        </li>\r\n    </fd-menu>\r\n    } @if (viewCollection && viewCollection.length > 1) {\r\n    <fd-split-button\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"deviceSize === 's' ? 'always' : 'low'\"\r\n        [fdType]=\"'transparent'\"\r\n        [mainAction]=\"{\r\n            keepMainAction: true,\r\n            mainActionTitle: splitBtnTitle\r\n        }\"\r\n    >\r\n        <fd-menu>\r\n            @for (viewObject of viewCollection; track viewObject) {\r\n            <li fd-menu-item>\r\n                <div fd-menu-interactive (click)=\"onChangeView(viewObject)\" bodyClick>\r\n                    <span fd-menu-title>\r\n                        <fd-icon [glyph]=\"viewObject.UiComponent.Settings?.Icon\"> </fd-icon>\r\n                    </span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </fd-split-button>\r\n    }\r\n    <ng-template #splitBtnTitle>\r\n        <fd-icon [glyph]=\"reportView.UiComponent.Settings?.Icon\"></fd-icon>\r\n    </ng-template>\r\n    <ng-template #splitBtnSettings>\r\n        <fd-icon [glyph]=\"'action-settings'\"></fd-icon>\r\n    </ng-template>\r\n    }\r\n</fd-toolbar>\r\n}\r\n", styles: [":host{display:block;width:100%;position:relative}:host ::ng-deep .fd-toolbar{flex-wrap:nowrap!important}:host ::ng-deep .fd-toolbar{border-top:var(--sapList_BorderWidth) solid var(--sapList_BorderColor);border-left:var(--sapList_BorderWidth) solid var(--sapList_BorderColor);border-right:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host fd-toolbar.s ::ng-deep .fd-toolbar{justify-content:end}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { _tlbCmp: [{
                 type: ViewChild,
                 args: [ToolbarComponent]
@@ -6622,6 +6622,7 @@ class UiUlvMainUiComponent extends BaseComponent {
         this.selectedSearchPanelSettings$ = this._ulvMainService.selectedSearchPanelSettings$;
         this.selectedSearchPanelSettingsId$ = this._ulvMainService.selectedSearchPanelSettingsId$;
         this.deviceSize$ = this._portalService.deviceSize$.pipe(takeUntil(this._onDestroy$), distinctUntilChanged());
+        this.context.fireEvent('render', this);
     }
     onClose() {
         this._router.navigate(['../..'], { relativeTo: this._activatedRoute });
@@ -13065,6 +13066,8 @@ class BarsaFormSideContentComponent extends FormPropsBaseComponent {
     constructor() {
         super(...arguments);
         this._isSmallDevice = false;
+        this.isOpenQuickAccess = false;
+        this.afterViewInit = false;
     }
     ngOnInit() {
         super.ngOnInit();
@@ -13073,17 +13076,22 @@ class BarsaFormSideContentComponent extends FormPropsBaseComponent {
         this._background = this.parameters.BgColor || 'var(--sapBaseColor)';
         this.autoHeight = this.parameters.AutoHeight;
         this.smallDevice = this._isSmallDeviceSize(this.deviceSize);
+        this.isOpenQuickAccess = Number(this.parameters.FirstDefaultMenuState) === 1;
+    }
+    ngAfterViewInit() {
+        super.ngAfterViewInit();
+        this.afterViewInit = true;
     }
     _isSmallDeviceSize(deviceSize) {
         const isSmallDevice = deviceSize === 's' || deviceSize === 'm' ? true : false;
         return isSmallDevice;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaFormSideContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaFormSideContentComponent, selector: "bsu-barsa-form-side-content", host: { properties: { "class.smallDevice": "this._isSmallDevice", "style.background": "this._background" } }, providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "@if(isMobile) {\n<button\n    fd-shellbar-side-nav\n    fd-button\n    fdType=\"transparent\"\n    glyph=\"menu2\"\n    style=\"width: 2.75rem\"\n    (click)=\"$event.stopPropagation(); isOpenQuickAccess = true\"\n></button>\n\n<div\n    class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[100] tw-shadow-2xl tw-overflow-auto\"\n    [class.tw-w-screen]=\"isMobile\"\n    [class.-tw-right-full]=\"isMobile\"\n    [class.tw-w-96]=\"!isMobile\"\n    [class.-tw-right-96]=\"!isMobile\"\n    fillEmptySpace\n    [class.!tw-right-0]=\"isOpenQuickAccess\"\n    (click)=\"$event.stopPropagation()\"\n>\n    <button\n        fd-shellbar-side-nav\n        fd-button\n        fdType=\"transparent\"\n        glyph=\"decline\"\n        (click)=\"$event.stopPropagation(); isOpenQuickAccess = false\"\n        routeFormChange\n        [bodyClick]=\"true\"\n        (stateChanged)=\"isOpenQuickAccess = false\"\n    ></button>\n    @if (sideContentLayout ) {\n    <bsu-ly-layout-panel\n        style=\"width: 100%\"\n        [config]=\"sideContentLayout\"\n        [hideTitle]=\"parameters?.HideSideContentTitle === true\"\n        (click)=\"isOpenQuickAccess = false\"\n    ></bsu-ly-layout-panel\n    >}\n</div>\n} @if (sideContentLayout && mainContentLayout) {\n\n<fd-dynamic-side-content\n    [class.rtl]=\"rtl\"\n    fillEmptySpace\n    [decrement]=\"'40px'\"\n    [disable]=\"autoHeight\"\n    [setMinHeight]=\"true\"\n    [size]=\"isMobile ? 'sm' : smallDevice ? 'md' : 'xl'\"\n>\n    <fd-dynamic-side-content-side>\n        <bsu-ly-layout-panel [config]=\"sideContentLayout\" [hideTitle]=\"parameters?.HideSideContentTitle === true\">\n        </bsu-ly-layout-panel>\n    </fd-dynamic-side-content-side>\n    <fd-dynamic-side-content-main [style.width]=\"isMobile ? 'auto' : parameters?.MainContentWidth\">\n        <bsu-ly-layout-panel [config]=\"mainContentLayout\" [hideTitle]=\"parameters?.HideMainContentTitle === true\">\n        </bsu-ly-layout-panel>\n    </fd-dynamic-side-content-main>\n</fd-dynamic-side-content>\n} @else {\n<fd-message-strip type=\"error\" [dismissible]=\"false\"\n    >side content and main content does not defined correctly.</fd-message-strip\n>\n}\n<ng-template #error>\n    <fd-message-strip type=\"error\" [dismissible]=\"false\"\n        >side content and main content does not defined correctly.</fd-message-strip\n    >\n</ng-template>\n", styles: [":host{width:100%;height:100%;display:flex;position:relative;flex-direction:column}fd-dynamic-side-content-main{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important}fd-dynamic-side-content-side{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important;border-left:none}fd-dynamic-side-content.rtl fd-dynamic-side-content-side{border-left:none!important}:host ::ng-deep bnrc-field-ui{padding:0!important}:host ::ng-deep bsu-ly-vertical-layout bsu-ly-layout-panel:last-of-type .fd-panel__content{border-bottom:none!important}\n"], dependencies: [{ kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i2.RouteFormChangeDirective, selector: "[routeFormChange]", inputs: ["handleBodyClick"], outputs: ["stateChanged"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i10$1.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i10$1.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i10$1.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "directive", type: i5$6.ShellbarSidenavDirective, selector: "[fdShellbarSidenav], [fd-shellbar-side-nav]" }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.5", type: BarsaFormSideContentComponent, selector: "bsu-barsa-form-side-content", host: { properties: { "class.smallDevice": "this._isSmallDevice", "style.background": "this._background" } }, providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "@if(isMobile) {\n<button\n    fd-shellbar-side-nav\n    fd-button\n    fdType=\"transparent\"\n    glyph=\"menu2\"\n    style=\"width: 2.75rem\"\n    (click)=\"$event.stopPropagation(); isOpenQuickAccess = true\"\n></button>\n\n<div\n    class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[100] tw-shadow-2xl tw-overflow-auto\"\n    [class.tw-w-screen]=\"isMobile\"\n    [class.-tw-right-full]=\"isMobile\"\n    [class.tw-w-96]=\"!isMobile\"\n    [class.-tw-right-96]=\"!isMobile\"\n    fillEmptySpace\n    [class.!tw-right-0]=\"isOpenQuickAccess\"\n    (click)=\"$event.stopPropagation()\"\n>\n    <button\n        fd-shellbar-side-nav\n        fd-button\n        fdType=\"transparent\"\n        glyph=\"decline\"\n        (click)=\"$event.stopPropagation(); isOpenQuickAccess = false\"\n        routeFormChange\n        [bodyClick]=\"true\"\n        (stateChanged)=\"afterViewInit && (isOpenQuickAccess = false)\"\n    ></button>\n    @if (sideContentLayout ) {\n    <bsu-ly-layout-panel\n        style=\"width: 100%\"\n        [config]=\"sideContentLayout\"\n        [hideTitle]=\"parameters?.HideSideContentTitle === true\"\n        (click)=\"isOpenQuickAccess = false\"\n    ></bsu-ly-layout-panel\n    >}\n</div>\n} @if (sideContentLayout && mainContentLayout) {\n\n<fd-dynamic-side-content\n    [class.rtl]=\"rtl\"\n    fillEmptySpace\n    [decrement]=\"'40px'\"\n    [disable]=\"autoHeight\"\n    [setMinHeight]=\"true\"\n    [size]=\"isMobile ? 'sm' : smallDevice ? 'md' : 'xl'\"\n>\n    <fd-dynamic-side-content-side>\n        <bsu-ly-layout-panel [config]=\"sideContentLayout\" [hideTitle]=\"parameters?.HideSideContentTitle === true\">\n        </bsu-ly-layout-panel>\n    </fd-dynamic-side-content-side>\n    <fd-dynamic-side-content-main [style.width]=\"isMobile ? null : parameters?.MainContentWidth\">\n        <bsu-ly-layout-panel [config]=\"mainContentLayout\" [hideTitle]=\"parameters?.HideMainContentTitle === true\">\n        </bsu-ly-layout-panel>\n    </fd-dynamic-side-content-main>\n</fd-dynamic-side-content>\n} @else {\n<fd-message-strip type=\"error\" [dismissible]=\"false\"\n    >side content and main content does not defined correctly.</fd-message-strip\n>\n}\n<ng-template #error>\n    <fd-message-strip type=\"error\" [dismissible]=\"false\"\n        >side content and main content does not defined correctly.</fd-message-strip\n    >\n</ng-template>\n", styles: [":host{width:100%;height:100%;display:flex;position:relative;flex-direction:column}fd-dynamic-side-content-main{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important}fd-dynamic-side-content-side{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important;border-left:none}fd-dynamic-side-content.rtl fd-dynamic-side-content-side{border-left:none!important}:host ::ng-deep bnrc-field-ui{padding:0!important}:host ::ng-deep bsu-ly-vertical-layout bsu-ly-layout-panel:last-of-type .fd-panel__content{border-bottom:none!important}\n"], dependencies: [{ kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i2.RouteFormChangeDirective, selector: "[routeFormChange]", inputs: ["handleBodyClick"], outputs: ["stateChanged"] }, { kind: "component", type: i3.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i10$1.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i10$1.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i10$1.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i9$1.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "directive", type: i5$6.ShellbarSidenavDirective, selector: "[fdShellbarSidenav], [fd-shellbar-side-nav]" }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.5", ngImport: i0, type: BarsaFormSideContentComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-barsa-form-side-content', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "@if(isMobile) {\n<button\n    fd-shellbar-side-nav\n    fd-button\n    fdType=\"transparent\"\n    glyph=\"menu2\"\n    style=\"width: 2.75rem\"\n    (click)=\"$event.stopPropagation(); isOpenQuickAccess = true\"\n></button>\n\n<div\n    class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[100] tw-shadow-2xl tw-overflow-auto\"\n    [class.tw-w-screen]=\"isMobile\"\n    [class.-tw-right-full]=\"isMobile\"\n    [class.tw-w-96]=\"!isMobile\"\n    [class.-tw-right-96]=\"!isMobile\"\n    fillEmptySpace\n    [class.!tw-right-0]=\"isOpenQuickAccess\"\n    (click)=\"$event.stopPropagation()\"\n>\n    <button\n        fd-shellbar-side-nav\n        fd-button\n        fdType=\"transparent\"\n        glyph=\"decline\"\n        (click)=\"$event.stopPropagation(); isOpenQuickAccess = false\"\n        routeFormChange\n        [bodyClick]=\"true\"\n        (stateChanged)=\"isOpenQuickAccess = false\"\n    ></button>\n    @if (sideContentLayout ) {\n    <bsu-ly-layout-panel\n        style=\"width: 100%\"\n        [config]=\"sideContentLayout\"\n        [hideTitle]=\"parameters?.HideSideContentTitle === true\"\n        (click)=\"isOpenQuickAccess = false\"\n    ></bsu-ly-layout-panel\n    >}\n</div>\n} @if (sideContentLayout && mainContentLayout) {\n\n<fd-dynamic-side-content\n    [class.rtl]=\"rtl\"\n    fillEmptySpace\n    [decrement]=\"'40px'\"\n    [disable]=\"autoHeight\"\n    [setMinHeight]=\"true\"\n    [size]=\"isMobile ? 'sm' : smallDevice ? 'md' : 'xl'\"\n>\n    <fd-dynamic-side-content-side>\n        <bsu-ly-layout-panel [config]=\"sideContentLayout\" [hideTitle]=\"parameters?.HideSideContentTitle === true\">\n        </bsu-ly-layout-panel>\n    </fd-dynamic-side-content-side>\n    <fd-dynamic-side-content-main [style.width]=\"isMobile ? 'auto' : parameters?.MainContentWidth\">\n        <bsu-ly-layout-panel [config]=\"mainContentLayout\" [hideTitle]=\"parameters?.HideMainContentTitle === true\">\n        </bsu-ly-layout-panel>\n    </fd-dynamic-side-content-main>\n</fd-dynamic-side-content>\n} @else {\n<fd-message-strip type=\"error\" [dismissible]=\"false\"\n    >side content and main content does not defined correctly.</fd-message-strip\n>\n}\n<ng-template #error>\n    <fd-message-strip type=\"error\" [dismissible]=\"false\"\n        >side content and main content does not defined correctly.</fd-message-strip\n    >\n</ng-template>\n", styles: [":host{width:100%;height:100%;display:flex;position:relative;flex-direction:column}fd-dynamic-side-content-main{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important}fd-dynamic-side-content-side{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important;border-left:none}fd-dynamic-side-content.rtl fd-dynamic-side-content-side{border-left:none!important}:host ::ng-deep bnrc-field-ui{padding:0!important}:host ::ng-deep bsu-ly-vertical-layout bsu-ly-layout-panel:last-of-type .fd-panel__content{border-bottom:none!important}\n"] }]
+            args: [{ selector: 'bsu-barsa-form-side-content', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], template: "@if(isMobile) {\n<button\n    fd-shellbar-side-nav\n    fd-button\n    fdType=\"transparent\"\n    glyph=\"menu2\"\n    style=\"width: 2.75rem\"\n    (click)=\"$event.stopPropagation(); isOpenQuickAccess = true\"\n></button>\n\n<div\n    class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[100] tw-shadow-2xl tw-overflow-auto\"\n    [class.tw-w-screen]=\"isMobile\"\n    [class.-tw-right-full]=\"isMobile\"\n    [class.tw-w-96]=\"!isMobile\"\n    [class.-tw-right-96]=\"!isMobile\"\n    fillEmptySpace\n    [class.!tw-right-0]=\"isOpenQuickAccess\"\n    (click)=\"$event.stopPropagation()\"\n>\n    <button\n        fd-shellbar-side-nav\n        fd-button\n        fdType=\"transparent\"\n        glyph=\"decline\"\n        (click)=\"$event.stopPropagation(); isOpenQuickAccess = false\"\n        routeFormChange\n        [bodyClick]=\"true\"\n        (stateChanged)=\"afterViewInit && (isOpenQuickAccess = false)\"\n    ></button>\n    @if (sideContentLayout ) {\n    <bsu-ly-layout-panel\n        style=\"width: 100%\"\n        [config]=\"sideContentLayout\"\n        [hideTitle]=\"parameters?.HideSideContentTitle === true\"\n        (click)=\"isOpenQuickAccess = false\"\n    ></bsu-ly-layout-panel\n    >}\n</div>\n} @if (sideContentLayout && mainContentLayout) {\n\n<fd-dynamic-side-content\n    [class.rtl]=\"rtl\"\n    fillEmptySpace\n    [decrement]=\"'40px'\"\n    [disable]=\"autoHeight\"\n    [setMinHeight]=\"true\"\n    [size]=\"isMobile ? 'sm' : smallDevice ? 'md' : 'xl'\"\n>\n    <fd-dynamic-side-content-side>\n        <bsu-ly-layout-panel [config]=\"sideContentLayout\" [hideTitle]=\"parameters?.HideSideContentTitle === true\">\n        </bsu-ly-layout-panel>\n    </fd-dynamic-side-content-side>\n    <fd-dynamic-side-content-main [style.width]=\"isMobile ? null : parameters?.MainContentWidth\">\n        <bsu-ly-layout-panel [config]=\"mainContentLayout\" [hideTitle]=\"parameters?.HideMainContentTitle === true\">\n        </bsu-ly-layout-panel>\n    </fd-dynamic-side-content-main>\n</fd-dynamic-side-content>\n} @else {\n<fd-message-strip type=\"error\" [dismissible]=\"false\"\n    >side content and main content does not defined correctly.</fd-message-strip\n>\n}\n<ng-template #error>\n    <fd-message-strip type=\"error\" [dismissible]=\"false\"\n        >side content and main content does not defined correctly.</fd-message-strip\n    >\n</ng-template>\n", styles: [":host{width:100%;height:100%;display:flex;position:relative;flex-direction:column}fd-dynamic-side-content-main{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important}fd-dynamic-side-content-side{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important;border-left:none}fd-dynamic-side-content.rtl fd-dynamic-side-content-side{border-left:none!important}:host ::ng-deep bnrc-field-ui{padding:0!important}:host ::ng-deep bsu-ly-vertical-layout bsu-ly-layout-panel:last-of-type .fd-panel__content{border-bottom:none!important}\n"] }]
         }], propDecorators: { _isSmallDevice: [{
                 type: HostBinding,
                 args: ['class.smallDevice']