barsa-sap-ui 2.1.11 → 2.1.12

package/fesm2022/barsa-sap-ui.mjs

@@ -8972,6 +8972,7 @@ class FundamentalDynamicFormComponent extends BaseComponent {
         this.hideTitle = true;
         this.toolbarShouldOverflow = false;
         this.worfklowButtonsOnFooter = false;
+        this.hasLayoutButtons = true;
     }
     ngOnInit() {
         super.ngOnInit();
@@ -8982,6 +8983,9 @@ class FundamentalDynamicFormComponent extends BaseComponent {
         this.workflowButtonsComboMode = this.isMobile;
         this.worfklowButtonsOnFooter = this.parameters?.WorkflowButtonsOnFooter;
         // this.workflowButtons = workflowButtons;
+        this.hasLayoutButtons =
+            this.layoutActions.length > 0 ||
+                (this.workflowButtons.length > 0 && (this.workflowButtonsComboMode || this.worfklowButtonsOnFooter));
         this.canFullscreen = this.parameters?.CanFullscreen === true;
         const toolbarButtonsCount = this.toolbarItems.filter((c) => typeof c !== 'string' && c.text !== '-').length;
         if (this.deviceSize === 's' && toolbarButtonsCount > 1) {
@@ -9030,11 +9034,11 @@ class FundamentalDynamicFormComponent extends BaseComponent {
         this.layout2 = GetFormLayoutGrid(false, this.colXl, this.colLg, this.colMd);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FundamentalDynamicFormComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FundamentalDynamicFormComponent, 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", fieldDict: "fieldDict", removeHeaderBorder: "removeHeaderBorder", removeContentPadding: "removeContentPadding", isMobile: "isMobile", mo: "mo", avatar: "avatar", circleAvatar: "circleAvatar", 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", 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" }, 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) {\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\n    <bsu-mask size=\"m\"></bsu-mask>\n</div>\n}\n\n<fd-dynamic-page\n    [size]=\"isMobile ? 'small' : 'large'\"\n    [ngClass]=\"{ 'floating-footer': footerDesign === 'floating-footer' }\"\n    [class.header-border]=\"!removeHeaderBorder\"\n    [attr.isMobile]=\"isMobile\"\n    [attr.contentIsPage]=\"contentIsPage\"\n    mobile\n    formClose\n    [isMobile]=\"isMobile\"\n>\n    <fd-dynamic-page-header\n        [class.simple-title]=\"!description\"\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\n        [class.p-b0]=\"removeContentPadding\"\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\n        [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\n        #titleRef\n    >\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\n            <fd-breadcrumb>\n                @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\n                breadCrumb.url; let i = $index; let last = $last) {\n                <fd-breadcrumb-item>\n                    <bsu-breadcrumb\n                        [index]=\"i\"\n                        [isLast]=\"last\"\n                        [breadCrumb]=\"breadCrumb\"\n                        [allBreadCrumb]=\"breadCrumbs\"\n                    ></bsu-breadcrumb>\n                </fd-breadcrumb-item>\n                } }\n            </fd-breadcrumb>\n        </fd-dynamic-page-breadcrumb>\n        <fd-dynamic-page-global-actions>\n            <!-- global actions -->\n\n            <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n            <!-- added this because in mobile landscape toolbar disapper -->\n            @if (toolbarVisible) {\n            <bsu-form-toolbar\n                [deviceSize]=\"deviceSize\"\n                [buttons]=\"toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter\"\n                [dirValue]=\"dirValue\"\n                [isFirefox]=\"isFirefox\"\n                (toolbarClick)=\"toolbarClick.emit($event)\"\n                #formToolbar\n            ></bsu-form-toolbar>\n            }\n        </fd-dynamic-page-global-actions>\n        <fd-dynamic-page-layout-actions>\n            <!-- layout actions -->\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\n            @if (!hideClose) {\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n                @if (deviceSize !== 's') {\n                <fd-toolbar-separator></fd-toolbar-separator>\n                }\n                <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\n            </fd-toolbar>\n            }\n        </fd-dynamic-page-layout-actions>\n    </fd-dynamic-page-header>\n    @if (description || facetList.length > 0 || workflowInfoText || avatar) {}\n    <fd-dynamic-page-subheader\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\n        [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText)\"\n        [collapsible]=\"true\"\n        [pinnable]=\"false\"\n        [collapsed]=\"!facetList?.length && !workflowInfoText\"\n    >\n        @if (workflowInfoText) {\n        <fd-message-strip [type]=\"'warning'\" [dismissible]=\"false\">\n            {{ workflowInfoText | bbbTranslate }}\n        </fd-message-strip>\n        }\n        <fd-facet-group ariaLabel=\"Facet Group\">\n            @if (avatar) {\n            <fd-facet type=\"image\">\n                <fd-avatar\n                    title=\"avatar\"\n                    [glyph]=\"avatar\"\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n                    [transparent]=\"true\"\n                    [circle]=\"circleAvatar\"\n                ></fd-avatar>\n                <!-- <div\n                  class=\"fd-avatar fd-avatar--circle\"\n                  [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\n                  >\n                  <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\n                </div> -->\n            </fd-facet>\n            } @for (facet of facetList; track facet) {\n            <fd-facet\n                [type]=\"facet.type\"\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\n            >\n                @for (item of facet.mo.ItemList?.MoDataList; track item) {\n                <fd-facet-content>\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\n                    <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\n                </fd-facet-content>\n                } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\n                <span\n                    fd-object-status\n                    [status]=\"facet.mo.Status | facetValue\"\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\n                    [large]=\"facet.mo.IsLarge\"\n                    [title]=\"facet.mo.Text | facetValue\"\n                    [aria-label]=\"facet.mo.Text | facetValue\"\n                    [glyph]=\"facet.mo.Icon\"\n                >\n                </span>\n                } @else {\n                <bnrc-dynamic-component\n                    [class]=\"'fd-object-status fd-object-status--' + facet.mo.Status | facetValue\"\n                    [class.fd-object-status--large]=\"facet.mo.IsLarge\"\n                    [component]=\"facet.mo.Component\"\n                    [value]=\"facet.mo.Text\"\n                ></bnrc-dynamic-component>\n                } @if (facet.mo.IsNumber && facet.type === 'key-value') {\n                <fd-object-number\n                    [number]=\"facet.mo.Text | facetValue\"\n                    [large]=\"facet.mo.IsLarge\"\n                    [unit]=\"facet.mo.Unit | facetValue\"\n                    [status]=\"facet.mo.Status | facetValue\"\n                    [decimal]=\"facet.mo.DecimalValue | facetValue\"\n                ></fd-object-number>\n                } @if (facet.type === 'plain-text') {\n                <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\n                    <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\n                </div>\n                } @if (facet.type === 'rating-indicator') {\n                <fd-facet-content>\n                    <fd-rating-indicator\n                        style=\"pointer-events: none\"\n                        size=\"md\"\n                        [dynamicTextIndicator]=\"facet.mo.Footer\"\n                        [displayMode]=\"true\"\n                        [value]=\"facet.mo | facetValue: facet.type\"\n                    ></fd-rating-indicator>\n                </fd-facet-content>\n                } @if (facet.type === 'progress') {\n                <div [style.width]=\"'10rem'\">\n                    <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\n                    <fd-progress-indicator\n                        style=\"width: 10r em\"\n                        [state]=\"facet.mo.State\"\n                        [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\n                        [valueNow]=\"facet.mo | facetValue: facet.type\"\n                        [valueMax]=\"10\"\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\n                    ></fd-progress-indicator>\n                    <!-- <ui5-progress-indicator\n                    style=\"width: 10rem\"\n                    [valueState]=\"facet.mo.State\"\n                    [value]=\"getNumber(facet.mo.Value)\"\n                  ></ui5-progress-indicator> -->\n                </div>\n                } @if (facet.type === 'microcharts') {\n                <div>\n                    <label wrap>in progress ...</label>\n                </div>\n                }\n            </fd-facet>\n            }\n        </fd-facet-group>\n        @if (description) {\n        <span>{{ description }}</span>\n        }\n    </fd-dynamic-page-subheader>\n    @if(!modernTabs.length && !contentIsPage){\n    <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\n        <fd-layout-grid style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\n            <div fdLayoutGridRow>\n                <div\n                    style=\"padding: 0\"\n                    [class.hide]=\"layout2.colXl === 0\"\n                    [fdLayoutGridCol]=\"0\"\n                    [colMd]=\"layout1.colMd\"\n                    [colLg]=\"layout1.colLg\"\n                    [colXl]=\"layout1.colXl\"\n                ></div>\n                <div style=\"min-height: 100%\" [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\n                            context: {\n                                $implicit: parameters?.LayoutComponent,\n                                layout94: layout94\n                            }\n                        \"\n                    ></ng-container>\n                </div>\n                <div\n                    style=\"padding: 0\"\n                    [class.hide]=\"layout2.colXl === 0\"\n                    [fdLayoutGridCol]=\"0\"\n                    [colMd]=\"layout2.colMd\"\n                    [colLg]=\"layout2.colLg\"\n                    [colXl]=\"layout2.colXl\"\n                ></div>\n            </div>\n        </fd-layout-grid>\n    </fd-dynamic-page-content>\n    } @else if(modernTabs.length && !contentIsPage && !parameters?.LayoutComponent){\n    <fdp-icon-tab-bar [stackContent]=\"false\" [collapseOverflow]=\"true\" [expandOverflowText]=\"'More' | bbbTranslate\">\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\n\n        <fdp-icon-tab-bar-tab\n            [id]=\"tab.id\"\n            [label]=\"tab.Title!! | bbbTranslate\"\n            [title]=\"tab.Title!! | bbbTranslate\"\n            [class.is-expanded]=\"selectedTab === tab.Title\"\n            #tablist\n        >\n            <fd-dynamic-page-content [id]=\"tab.id\" [class.limit-content-width]=\"formContentMaxWidth > 0\">\n                <fd-layout-grid [style.max-width.px]=\"formContentMaxWidth\">\n                    <div fdLayoutGridRow>\n                        <div\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout1.colMd\"\n                            [colLg]=\"layout1.colLg\"\n                            [colXl]=\"layout1.colXl\"\n                        ></div>\n                        <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n                            <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\n                        </div>\n                        <div\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout2.colMd\"\n                            [colLg]=\"layout2.colLg\"\n                            [colXl]=\"layout2.colXl\"\n                        ></div>\n                    </div>\n                </fd-layout-grid>\n            </fd-dynamic-page-content>\n        </fdp-icon-tab-bar-tab>\n        }\n    </fdp-icon-tab-bar>\n    } @if(!hideFooter && layoutActions.length){\n    <fd-dynamic-page-footer>\n        <ng-container *ngTemplateOutlet=\"layoutActionsTemplateRef\"></ng-container>\n    </fd-dynamic-page-footer>\n    }\n</fd-dynamic-page>\n@if (contentIsPage) {\n<ng-container\n    *ngTemplateOutlet=\"\n        renderLayoutComponent;\n        context: {\n            $implicit: parameters?.LayoutComponent,\n            layout94: layout94\n        }\n    \"\n></ng-container>\n}\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\n    <bsu-ly-layout-container-of-root\n        [config]=\"layout94\"\n        [isPanel]=\"false\"\n        [isRoot]=\"true\"\n    ></bsu-ly-layout-container-of-root>\n</ng-template>\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\n    <bnrc-dynamic-form-component\n        [component]=\"component\"\n        [layoutActionsTemplateRef]=\"layoutActionsTemplateRef\"\n        [removeContentPadding]=\"removeContentPadding\"\n        [breadCrumbs]=\"breadCrumbs\"\n        [description]=\"description\"\n        [title]=\"title\"\n        [subtitle]=\"subtitle\"\n        [toolbarItems]=\"toolbarItems\"\n        [layoutActions]=\"layoutActions\"\n        [footerDesign]=\"footerDesign\"\n        [facetList]=\"facetList\"\n        [settings]=\"component.Settings\"\n        [workflowButtons]=\"workflowButtons\"\n        [workflowPanelUi]=\"workflowPanelUi\"\n        [isMobile]=\"isMobile\"\n        [mo]=\"mo\"\n        [layout94]=\"layout94\"\n        [context]=\"context\"\n        [rtl]=\"rtl\"\n        [fieldDict]=\"fieldDict\"\n        [mask]=\"mask\"\n        [dirValue]=\"dirValue\"\n        [deviceSize]=\"deviceSize\"\n        [contentDensity]=\"contentDensity\"\n        [modernTabs]=\"modernTabs\"\n        [avatar]=\"avatar\"\n        (events)=\"onDynamicComponentEvents($event)\"\n    ></bnrc-dynamic-form-component>\n</ng-template>\n<ng-template #closeForm>\n    <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\n        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n    </button>\n</ng-template>\n<ng-template #fullscreenForm>\n    @if (canFullscreen) {\n    <button\n        fd-button\n        fdType=\"transparent\"\n        [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n        (click)=\"fullscreenRequest.emit()\"\n        [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n        [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\n    ></button>\n    }\n</ng-template>\n<ng-template #layoutActionsTemplateRef>\n    <bsu-layout-actions\n        [canSend]=\"canSend\"\n        [buttons]=\"layoutActions\"\n        [isMobile]=\"isMobile\"\n        [landscape]=\"landscape\"\n        [standalone]=\"standalone\"\n        [footerDesign]=\"footerDesign\"\n        [workflowButtons]=\"workflowButtons\"\n        [workflowButtonsComboMode]=\"workflowButtonsComboMode || worfklowButtonsOnFooter\"\n        [deviceSize]=\"deviceSize\"\n        [rtl]=\"rtl\"\n        (toolClick)=\"toolbarClick.emit($event)\"\n        (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\n    >\n    </bsu-layout-actions>\n</ng-template>\n", styles: [":host{display:block;height:auto;width:100%}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important}:host ::ng-deep .fd-progress-indicator__container,:host ::ng-deep .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 ::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}.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$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.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: i1$6.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: i5$5.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i5$5.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i9$1.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i9$1.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i9$1.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i9$1.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i9$1.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i9$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i9$1.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i9$1.DynamicPageBreadcrumbComponent, selector: "fd-dynamic-page-breadcrumb" }, { kind: "component", type: i8$1.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "headingLevel", "id", "alignEnd"] }, { kind: "component", type: i8$1.FacetGroupComponent, selector: "fd-facet-group", inputs: ["ariaLabel"] }, { kind: "component", type: i8$1.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$2.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$2.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$2.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i9.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i3$8.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$4.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", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "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: "pipe", type: i1$2.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.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FundamentalDynamicFormComponent, 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", fieldDict: "fieldDict", removeHeaderBorder: "removeHeaderBorder", removeContentPadding: "removeContentPadding", isMobile: "isMobile", mo: "mo", avatar: "avatar", circleAvatar: "circleAvatar", 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", 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" }, 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) {\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\n    <bsu-mask size=\"m\"></bsu-mask>\n</div>\n}\n\n<fd-dynamic-page\n    [size]=\"isMobile ? 'small' : 'large'\"\n    [ngClass]=\"{ 'floating-footer': footerDesign === 'floating-footer' }\"\n    [class.header-border]=\"!removeHeaderBorder\"\n    [attr.isMobile]=\"isMobile\"\n    [attr.contentIsPage]=\"contentIsPage\"\n    mobile\n    formClose\n    [isMobile]=\"isMobile\"\n>\n    <fd-dynamic-page-header\n        [class.simple-title]=\"!description\"\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\n        [class.p-b0]=\"removeContentPadding\"\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\n        [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\n        #titleRef\n    >\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\n            <fd-breadcrumb>\n                @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\n                breadCrumb.url; let i = $index; let last = $last) {\n                <fd-breadcrumb-item>\n                    <bsu-breadcrumb\n                        [index]=\"i\"\n                        [isLast]=\"last\"\n                        [breadCrumb]=\"breadCrumb\"\n                        [allBreadCrumb]=\"breadCrumbs\"\n                    ></bsu-breadcrumb>\n                </fd-breadcrumb-item>\n                } }\n            </fd-breadcrumb>\n        </fd-dynamic-page-breadcrumb>\n        <fd-dynamic-page-global-actions>\n            <!-- global actions -->\n\n            <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n            <!-- added this because in mobile landscape toolbar disapper -->\n            @if (toolbarVisible) {\n            <bsu-form-toolbar\n                [deviceSize]=\"deviceSize\"\n                [buttons]=\"toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter\"\n                [dirValue]=\"dirValue\"\n                [isFirefox]=\"isFirefox\"\n                (toolbarClick)=\"toolbarClick.emit($event)\"\n                #formToolbar\n            ></bsu-form-toolbar>\n            }\n        </fd-dynamic-page-global-actions>\n        <fd-dynamic-page-layout-actions>\n            <!-- layout actions -->\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\n            @if (!hideClose) {\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n                @if (deviceSize !== 's') {\n                <fd-toolbar-separator></fd-toolbar-separator>\n                }\n                <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\n            </fd-toolbar>\n            }\n        </fd-dynamic-page-layout-actions>\n    </fd-dynamic-page-header>\n    @if (description || facetList.length > 0 || workflowInfoText || avatar) {}\n    <fd-dynamic-page-subheader\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\n        [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText)\"\n        [collapsible]=\"true\"\n        [pinnable]=\"false\"\n        [collapsed]=\"!facetList?.length && !workflowInfoText\"\n    >\n        @if (workflowInfoText) {\n        <fd-message-strip [type]=\"'warning'\" [dismissible]=\"false\">\n            {{ workflowInfoText | bbbTranslate }}\n        </fd-message-strip>\n        }\n        <fd-facet-group ariaLabel=\"Facet Group\">\n            @if (avatar) {\n            <fd-facet type=\"image\">\n                <fd-avatar\n                    title=\"avatar\"\n                    [glyph]=\"avatar\"\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n                    [transparent]=\"true\"\n                    [circle]=\"circleAvatar\"\n                ></fd-avatar>\n                <!-- <div\n                  class=\"fd-avatar fd-avatar--circle\"\n                  [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\n                  >\n                  <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\n                </div> -->\n            </fd-facet>\n            } @for (facet of facetList; track facet) {\n            <fd-facet\n                [type]=\"facet.type\"\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\n            >\n                @for (item of facet.mo.ItemList?.MoDataList; track item) {\n                <fd-facet-content>\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\n                    <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\n                </fd-facet-content>\n                } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\n                <span\n                    fd-object-status\n                    [status]=\"facet.mo.Status | facetValue\"\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\n                    [large]=\"facet.mo.IsLarge\"\n                    [title]=\"facet.mo.Text | facetValue\"\n                    [aria-label]=\"facet.mo.Text | facetValue\"\n                    [glyph]=\"facet.mo.Icon\"\n                >\n                </span>\n                } @else {\n                <bnrc-dynamic-component\n                    [class]=\"'fd-object-status fd-object-status--' + facet.mo.Status | facetValue\"\n                    [class.fd-object-status--large]=\"facet.mo.IsLarge\"\n                    [component]=\"facet.mo.Component\"\n                    [value]=\"facet.mo.Text\"\n                ></bnrc-dynamic-component>\n                } @if (facet.mo.IsNumber && facet.type === 'key-value') {\n                <fd-object-number\n                    [number]=\"facet.mo.Text | facetValue\"\n                    [large]=\"facet.mo.IsLarge\"\n                    [unit]=\"facet.mo.Unit | facetValue\"\n                    [status]=\"facet.mo.Status | facetValue\"\n                    [decimal]=\"facet.mo.DecimalValue | facetValue\"\n                ></fd-object-number>\n                } @if (facet.type === 'plain-text') {\n                <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\n                    <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\n                </div>\n                } @if (facet.type === 'rating-indicator') {\n                <fd-facet-content>\n                    <fd-rating-indicator\n                        style=\"pointer-events: none\"\n                        size=\"md\"\n                        [dynamicTextIndicator]=\"facet.mo.Footer\"\n                        [displayMode]=\"true\"\n                        [value]=\"facet.mo | facetValue: facet.type\"\n                    ></fd-rating-indicator>\n                </fd-facet-content>\n                } @if (facet.type === 'progress') {\n                <div [style.width]=\"'10rem'\">\n                    <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\n                    <fd-progress-indicator\n                        style=\"width: 10r em\"\n                        [state]=\"facet.mo.State\"\n                        [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\n                        [valueNow]=\"facet.mo | facetValue: facet.type\"\n                        [valueMax]=\"10\"\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\n                    ></fd-progress-indicator>\n                    <!-- <ui5-progress-indicator\n                    style=\"width: 10rem\"\n                    [valueState]=\"facet.mo.State\"\n                    [value]=\"getNumber(facet.mo.Value)\"\n                  ></ui5-progress-indicator> -->\n                </div>\n                } @if (facet.type === 'microcharts') {\n                <div>\n                    <label wrap>in progress ...</label>\n                </div>\n                }\n            </fd-facet>\n            }\n        </fd-facet-group>\n        @if (description) {\n        <span>{{ description }}</span>\n        }\n    </fd-dynamic-page-subheader>\n    @if(!modernTabs.length && !contentIsPage){\n    <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\n        <fd-layout-grid style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\n            <div fdLayoutGridRow>\n                <div\n                    style=\"padding: 0\"\n                    [class.hide]=\"layout2.colXl === 0\"\n                    [fdLayoutGridCol]=\"0\"\n                    [colMd]=\"layout1.colMd\"\n                    [colLg]=\"layout1.colLg\"\n                    [colXl]=\"layout1.colXl\"\n                ></div>\n                <div style=\"min-height: 100%\" [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\n                            context: {\n                                $implicit: parameters?.LayoutComponent,\n                                layout94: layout94\n                            }\n                        \"\n                    ></ng-container>\n                </div>\n                <div\n                    style=\"padding: 0\"\n                    [class.hide]=\"layout2.colXl === 0\"\n                    [fdLayoutGridCol]=\"0\"\n                    [colMd]=\"layout2.colMd\"\n                    [colLg]=\"layout2.colLg\"\n                    [colXl]=\"layout2.colXl\"\n                ></div>\n            </div>\n        </fd-layout-grid>\n    </fd-dynamic-page-content>\n    } @else if(modernTabs.length && !contentIsPage && !parameters?.LayoutComponent){\n    <fdp-icon-tab-bar [stackContent]=\"false\" [collapseOverflow]=\"true\" [expandOverflowText]=\"'More' | bbbTranslate\">\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\n\n        <fdp-icon-tab-bar-tab\n            [id]=\"tab.id\"\n            [label]=\"tab.Title!! | bbbTranslate\"\n            [title]=\"tab.Title!! | bbbTranslate\"\n            [class.is-expanded]=\"selectedTab === tab.Title\"\n            #tablist\n        >\n            <fd-dynamic-page-content [id]=\"tab.id\" [class.limit-content-width]=\"formContentMaxWidth > 0\">\n                <fd-layout-grid [style.max-width.px]=\"formContentMaxWidth\">\n                    <div fdLayoutGridRow>\n                        <div\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout1.colMd\"\n                            [colLg]=\"layout1.colLg\"\n                            [colXl]=\"layout1.colXl\"\n                        ></div>\n                        <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n                            <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\n                        </div>\n                        <div\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout2.colMd\"\n                            [colLg]=\"layout2.colLg\"\n                            [colXl]=\"layout2.colXl\"\n                        ></div>\n                    </div>\n                </fd-layout-grid>\n            </fd-dynamic-page-content>\n        </fdp-icon-tab-bar-tab>\n        }\n    </fdp-icon-tab-bar>\n    } @if(!hideFooter && hasLayoutButtons){\n    <fd-dynamic-page-footer>\n        <ng-container *ngTemplateOutlet=\"layoutActionsTemplateRef\"></ng-container>\n    </fd-dynamic-page-footer>\n    }\n</fd-dynamic-page>\n@if (contentIsPage) {\n<ng-container\n    *ngTemplateOutlet=\"\n        renderLayoutComponent;\n        context: {\n            $implicit: parameters?.LayoutComponent,\n            layout94: layout94\n        }\n    \"\n></ng-container>\n}\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\n    <bsu-ly-layout-container-of-root\n        [config]=\"layout94\"\n        [isPanel]=\"false\"\n        [isRoot]=\"true\"\n    ></bsu-ly-layout-container-of-root>\n</ng-template>\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\n    <bnrc-dynamic-form-component\n        [component]=\"component\"\n        [layoutActionsTemplateRef]=\"layoutActionsTemplateRef\"\n        [removeContentPadding]=\"removeContentPadding\"\n        [breadCrumbs]=\"breadCrumbs\"\n        [description]=\"description\"\n        [title]=\"title\"\n        [subtitle]=\"subtitle\"\n        [toolbarItems]=\"toolbarItems\"\n        [layoutActions]=\"layoutActions\"\n        [footerDesign]=\"footerDesign\"\n        [facetList]=\"facetList\"\n        [settings]=\"component.Settings\"\n        [workflowButtons]=\"workflowButtons\"\n        [workflowPanelUi]=\"workflowPanelUi\"\n        [isMobile]=\"isMobile\"\n        [mo]=\"mo\"\n        [layout94]=\"layout94\"\n        [context]=\"context\"\n        [rtl]=\"rtl\"\n        [fieldDict]=\"fieldDict\"\n        [mask]=\"mask\"\n        [dirValue]=\"dirValue\"\n        [deviceSize]=\"deviceSize\"\n        [contentDensity]=\"contentDensity\"\n        [modernTabs]=\"modernTabs\"\n        [avatar]=\"avatar\"\n        (events)=\"onDynamicComponentEvents($event)\"\n    ></bnrc-dynamic-form-component>\n</ng-template>\n<ng-template #closeForm>\n    <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\n        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n    </button>\n</ng-template>\n<ng-template #fullscreenForm>\n    @if (canFullscreen) {\n    <button\n        fd-button\n        fdType=\"transparent\"\n        [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n        (click)=\"fullscreenRequest.emit()\"\n        [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n        [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\n    ></button>\n    }\n</ng-template>\n<ng-template #layoutActionsTemplateRef>\n    <bsu-layout-actions\n        [canSend]=\"canSend\"\n        [buttons]=\"layoutActions\"\n        [isMobile]=\"isMobile\"\n        [landscape]=\"landscape\"\n        [standalone]=\"standalone\"\n        [footerDesign]=\"footerDesign\"\n        [workflowButtons]=\"workflowButtons\"\n        [workflowButtonsComboMode]=\"workflowButtonsComboMode || worfklowButtonsOnFooter\"\n        [deviceSize]=\"deviceSize\"\n        [rtl]=\"rtl\"\n        (toolClick)=\"toolbarClick.emit($event)\"\n        (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\n    >\n    </bsu-layout-actions>\n</ng-template>\n", styles: [":host{display:block;height:auto;width:100%}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important}:host ::ng-deep .fd-progress-indicator__container,:host ::ng-deep .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 ::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}.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$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.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: i1$6.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: i5$5.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i5$5.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i9$1.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i9$1.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i9$1.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i9$1.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i9$1.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i9$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i9$1.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i9$1.DynamicPageBreadcrumbComponent, selector: "fd-dynamic-page-breadcrumb" }, { kind: "component", type: i8$1.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "headingLevel", "id", "alignEnd"] }, { kind: "component", type: i8$1.FacetGroupComponent, selector: "fd-facet-group", inputs: ["ariaLabel"] }, { kind: "component", type: i8$1.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$2.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i4$2.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i4$2.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i9.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i3$8.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$4.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", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "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: "pipe", type: i1$2.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.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FundamentalDynamicFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-fundamental-dynamic-form', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if (mask) {\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\n    <bsu-mask size=\"m\"></bsu-mask>\n</div>\n}\n\n<fd-dynamic-page\n    [size]=\"isMobile ? 'small' : 'large'\"\n    [ngClass]=\"{ 'floating-footer': footerDesign === 'floating-footer' }\"\n    [class.header-border]=\"!removeHeaderBorder\"\n    [attr.isMobile]=\"isMobile\"\n    [attr.contentIsPage]=\"contentIsPage\"\n    mobile\n    formClose\n    [isMobile]=\"isMobile\"\n>\n    <fd-dynamic-page-header\n        [class.simple-title]=\"!description\"\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\n        [class.p-b0]=\"removeContentPadding\"\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\n        [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\n        #titleRef\n    >\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\n            <fd-breadcrumb>\n                @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\n                breadCrumb.url; let i = $index; let last = $last) {\n                <fd-breadcrumb-item>\n                    <bsu-breadcrumb\n                        [index]=\"i\"\n                        [isLast]=\"last\"\n                        [breadCrumb]=\"breadCrumb\"\n                        [allBreadCrumb]=\"breadCrumbs\"\n                    ></bsu-breadcrumb>\n                </fd-breadcrumb-item>\n                } }\n            </fd-breadcrumb>\n        </fd-dynamic-page-breadcrumb>\n        <fd-dynamic-page-global-actions>\n            <!-- global actions -->\n\n            <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n            <!-- added this because in mobile landscape toolbar disapper -->\n            @if (toolbarVisible) {\n            <bsu-form-toolbar\n                [deviceSize]=\"deviceSize\"\n                [buttons]=\"toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter\"\n                [dirValue]=\"dirValue\"\n                [isFirefox]=\"isFirefox\"\n                (toolbarClick)=\"toolbarClick.emit($event)\"\n                #formToolbar\n            ></bsu-form-toolbar>\n            }\n        </fd-dynamic-page-global-actions>\n        <fd-dynamic-page-layout-actions>\n            <!-- layout actions -->\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\n            @if (!hideClose) {\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n                @if (deviceSize !== 's') {\n                <fd-toolbar-separator></fd-toolbar-separator>\n                }\n                <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\n            </fd-toolbar>\n            }\n        </fd-dynamic-page-layout-actions>\n    </fd-dynamic-page-header>\n    @if (description || facetList.length > 0 || workflowInfoText || avatar) {}\n    <fd-dynamic-page-subheader\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\n        [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText)\"\n        [collapsible]=\"true\"\n        [pinnable]=\"false\"\n        [collapsed]=\"!facetList?.length && !workflowInfoText\"\n    >\n        @if (workflowInfoText) {\n        <fd-message-strip [type]=\"'warning'\" [dismissible]=\"false\">\n            {{ workflowInfoText | bbbTranslate }}\n        </fd-message-strip>\n        }\n        <fd-facet-group ariaLabel=\"Facet Group\">\n            @if (avatar) {\n            <fd-facet type=\"image\">\n                <fd-avatar\n                    title=\"avatar\"\n                    [glyph]=\"avatar\"\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n                    [transparent]=\"true\"\n                    [circle]=\"circleAvatar\"\n                ></fd-avatar>\n                <!-- <div\n                  class=\"fd-avatar fd-avatar--circle\"\n                  [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\n                  >\n                  <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\n                </div> -->\n            </fd-facet>\n            } @for (facet of facetList; track facet) {\n            <fd-facet\n                [type]=\"facet.type\"\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\n            >\n                @for (item of facet.mo.ItemList?.MoDataList; track item) {\n                <fd-facet-content>\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\n                    <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\n                </fd-facet-content>\n                } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\n                <span\n                    fd-object-status\n                    [status]=\"facet.mo.Status | facetValue\"\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\n                    [large]=\"facet.mo.IsLarge\"\n                    [title]=\"facet.mo.Text | facetValue\"\n                    [aria-label]=\"facet.mo.Text | facetValue\"\n                    [glyph]=\"facet.mo.Icon\"\n                >\n                </span>\n                } @else {\n                <bnrc-dynamic-component\n                    [class]=\"'fd-object-status fd-object-status--' + facet.mo.Status | facetValue\"\n                    [class.fd-object-status--large]=\"facet.mo.IsLarge\"\n                    [component]=\"facet.mo.Component\"\n                    [value]=\"facet.mo.Text\"\n                ></bnrc-dynamic-component>\n                } @if (facet.mo.IsNumber && facet.type === 'key-value') {\n                <fd-object-number\n                    [number]=\"facet.mo.Text | facetValue\"\n                    [large]=\"facet.mo.IsLarge\"\n                    [unit]=\"facet.mo.Unit | facetValue\"\n                    [status]=\"facet.mo.Status | facetValue\"\n                    [decimal]=\"facet.mo.DecimalValue | facetValue\"\n                ></fd-object-number>\n                } @if (facet.type === 'plain-text') {\n                <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\n                    <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\n                </div>\n                } @if (facet.type === 'rating-indicator') {\n                <fd-facet-content>\n                    <fd-rating-indicator\n                        style=\"pointer-events: none\"\n                        size=\"md\"\n                        [dynamicTextIndicator]=\"facet.mo.Footer\"\n                        [displayMode]=\"true\"\n                        [value]=\"facet.mo | facetValue: facet.type\"\n                    ></fd-rating-indicator>\n                </fd-facet-content>\n                } @if (facet.type === 'progress') {\n                <div [style.width]=\"'10rem'\">\n                    <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\n                    <fd-progress-indicator\n                        style=\"width: 10r em\"\n                        [state]=\"facet.mo.State\"\n                        [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\n                        [valueNow]=\"facet.mo | facetValue: facet.type\"\n                        [valueMax]=\"10\"\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\n                    ></fd-progress-indicator>\n                    <!-- <ui5-progress-indicator\n                    style=\"width: 10rem\"\n                    [valueState]=\"facet.mo.State\"\n                    [value]=\"getNumber(facet.mo.Value)\"\n                  ></ui5-progress-indicator> -->\n                </div>\n                } @if (facet.type === 'microcharts') {\n                <div>\n                    <label wrap>in progress ...</label>\n                </div>\n                }\n            </fd-facet>\n            }\n        </fd-facet-group>\n        @if (description) {\n        <span>{{ description }}</span>\n        }\n    </fd-dynamic-page-subheader>\n    @if(!modernTabs.length && !contentIsPage){\n    <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\n        <fd-layout-grid style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\n            <div fdLayoutGridRow>\n                <div\n                    style=\"padding: 0\"\n                    [class.hide]=\"layout2.colXl === 0\"\n                    [fdLayoutGridCol]=\"0\"\n                    [colMd]=\"layout1.colMd\"\n                    [colLg]=\"layout1.colLg\"\n                    [colXl]=\"layout1.colXl\"\n                ></div>\n                <div style=\"min-height: 100%\" [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\n                            context: {\n                                $implicit: parameters?.LayoutComponent,\n                                layout94: layout94\n                            }\n                        \"\n                    ></ng-container>\n                </div>\n                <div\n                    style=\"padding: 0\"\n                    [class.hide]=\"layout2.colXl === 0\"\n                    [fdLayoutGridCol]=\"0\"\n                    [colMd]=\"layout2.colMd\"\n                    [colLg]=\"layout2.colLg\"\n                    [colXl]=\"layout2.colXl\"\n                ></div>\n            </div>\n        </fd-layout-grid>\n    </fd-dynamic-page-content>\n    } @else if(modernTabs.length && !contentIsPage && !parameters?.LayoutComponent){\n    <fdp-icon-tab-bar [stackContent]=\"false\" [collapseOverflow]=\"true\" [expandOverflowText]=\"'More' | bbbTranslate\">\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\n\n        <fdp-icon-tab-bar-tab\n            [id]=\"tab.id\"\n            [label]=\"tab.Title!! | bbbTranslate\"\n            [title]=\"tab.Title!! | bbbTranslate\"\n            [class.is-expanded]=\"selectedTab === tab.Title\"\n            #tablist\n        >\n            <fd-dynamic-page-content [id]=\"tab.id\" [class.limit-content-width]=\"formContentMaxWidth > 0\">\n                <fd-layout-grid [style.max-width.px]=\"formContentMaxWidth\">\n                    <div fdLayoutGridRow>\n                        <div\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout1.colMd\"\n                            [colLg]=\"layout1.colLg\"\n                            [colXl]=\"layout1.colXl\"\n                        ></div>\n                        <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n                            <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\n                        </div>\n                        <div\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout2.colMd\"\n                            [colLg]=\"layout2.colLg\"\n                            [colXl]=\"layout2.colXl\"\n                        ></div>\n                    </div>\n                </fd-layout-grid>\n            </fd-dynamic-page-content>\n        </fdp-icon-tab-bar-tab>\n        }\n    </fdp-icon-tab-bar>\n    } @if(!hideFooter && layoutActions.length){\n    <fd-dynamic-page-footer>\n        <ng-container *ngTemplateOutlet=\"layoutActionsTemplateRef\"></ng-container>\n    </fd-dynamic-page-footer>\n    }\n</fd-dynamic-page>\n@if (contentIsPage) {\n<ng-container\n    *ngTemplateOutlet=\"\n        renderLayoutComponent;\n        context: {\n            $implicit: parameters?.LayoutComponent,\n            layout94: layout94\n        }\n    \"\n></ng-container>\n}\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\n    <bsu-ly-layout-container-of-root\n        [config]=\"layout94\"\n        [isPanel]=\"false\"\n        [isRoot]=\"true\"\n    ></bsu-ly-layout-container-of-root>\n</ng-template>\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\n    <bnrc-dynamic-form-component\n        [component]=\"component\"\n        [layoutActionsTemplateRef]=\"layoutActionsTemplateRef\"\n        [removeContentPadding]=\"removeContentPadding\"\n        [breadCrumbs]=\"breadCrumbs\"\n        [description]=\"description\"\n        [title]=\"title\"\n        [subtitle]=\"subtitle\"\n        [toolbarItems]=\"toolbarItems\"\n        [layoutActions]=\"layoutActions\"\n        [footerDesign]=\"footerDesign\"\n        [facetList]=\"facetList\"\n        [settings]=\"component.Settings\"\n        [workflowButtons]=\"workflowButtons\"\n        [workflowPanelUi]=\"workflowPanelUi\"\n        [isMobile]=\"isMobile\"\n        [mo]=\"mo\"\n        [layout94]=\"layout94\"\n        [context]=\"context\"\n        [rtl]=\"rtl\"\n        [fieldDict]=\"fieldDict\"\n        [mask]=\"mask\"\n        [dirValue]=\"dirValue\"\n        [deviceSize]=\"deviceSize\"\n        [contentDensity]=\"contentDensity\"\n        [modernTabs]=\"modernTabs\"\n        [avatar]=\"avatar\"\n        (events)=\"onDynamicComponentEvents($event)\"\n    ></bnrc-dynamic-form-component>\n</ng-template>\n<ng-template #closeForm>\n    <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\n        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n    </button>\n</ng-template>\n<ng-template #fullscreenForm>\n    @if (canFullscreen) {\n    <button\n        fd-button\n        fdType=\"transparent\"\n        [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n        (click)=\"fullscreenRequest.emit()\"\n        [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n        [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\n    ></button>\n    }\n</ng-template>\n<ng-template #layoutActionsTemplateRef>\n    <bsu-layout-actions\n        [canSend]=\"canSend\"\n        [buttons]=\"layoutActions\"\n        [isMobile]=\"isMobile\"\n        [landscape]=\"landscape\"\n        [standalone]=\"standalone\"\n        [footerDesign]=\"footerDesign\"\n        [workflowButtons]=\"workflowButtons\"\n        [workflowButtonsComboMode]=\"workflowButtonsComboMode || worfklowButtonsOnFooter\"\n        [deviceSize]=\"deviceSize\"\n        [rtl]=\"rtl\"\n        (toolClick)=\"toolbarClick.emit($event)\"\n        (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\n    >\n    </bsu-layout-actions>\n</ng-template>\n", styles: [":host{display:block;height:auto;width:100%}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important}:host ::ng-deep .fd-progress-indicator__container,:host ::ng-deep .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 ::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}.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"] }]
+            args: [{ selector: 'bsu-fundamental-dynamic-form', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if (mask) {\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\n    <bsu-mask size=\"m\"></bsu-mask>\n</div>\n}\n\n<fd-dynamic-page\n    [size]=\"isMobile ? 'small' : 'large'\"\n    [ngClass]=\"{ 'floating-footer': footerDesign === 'floating-footer' }\"\n    [class.header-border]=\"!removeHeaderBorder\"\n    [attr.isMobile]=\"isMobile\"\n    [attr.contentIsPage]=\"contentIsPage\"\n    mobile\n    formClose\n    [isMobile]=\"isMobile\"\n>\n    <fd-dynamic-page-header\n        [class.simple-title]=\"!description\"\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\n        [class.p-b0]=\"removeContentPadding\"\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\n        [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\n        #titleRef\n    >\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\n            <fd-breadcrumb>\n                @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\n                breadCrumb.url; let i = $index; let last = $last) {\n                <fd-breadcrumb-item>\n                    <bsu-breadcrumb\n                        [index]=\"i\"\n                        [isLast]=\"last\"\n                        [breadCrumb]=\"breadCrumb\"\n                        [allBreadCrumb]=\"breadCrumbs\"\n                    ></bsu-breadcrumb>\n                </fd-breadcrumb-item>\n                } }\n            </fd-breadcrumb>\n        </fd-dynamic-page-breadcrumb>\n        <fd-dynamic-page-global-actions>\n            <!-- global actions -->\n\n            <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\n            <!-- added this because in mobile landscape toolbar disapper -->\n            @if (toolbarVisible) {\n            <bsu-form-toolbar\n                [deviceSize]=\"deviceSize\"\n                [buttons]=\"toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter\"\n                [dirValue]=\"dirValue\"\n                [isFirefox]=\"isFirefox\"\n                (toolbarClick)=\"toolbarClick.emit($event)\"\n                #formToolbar\n            ></bsu-form-toolbar>\n            }\n        </fd-dynamic-page-global-actions>\n        <fd-dynamic-page-layout-actions>\n            <!-- layout actions -->\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\n            @if (!hideClose) {\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n                @if (deviceSize !== 's') {\n                <fd-toolbar-separator></fd-toolbar-separator>\n                }\n                <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\n                <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\n            </fd-toolbar>\n            }\n        </fd-dynamic-page-layout-actions>\n    </fd-dynamic-page-header>\n    @if (description || facetList.length > 0 || workflowInfoText || avatar) {}\n    <fd-dynamic-page-subheader\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\n        [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText)\"\n        [collapsible]=\"true\"\n        [pinnable]=\"false\"\n        [collapsed]=\"!facetList?.length && !workflowInfoText\"\n    >\n        @if (workflowInfoText) {\n        <fd-message-strip [type]=\"'warning'\" [dismissible]=\"false\">\n            {{ workflowInfoText | bbbTranslate }}\n        </fd-message-strip>\n        }\n        <fd-facet-group ariaLabel=\"Facet Group\">\n            @if (avatar) {\n            <fd-facet type=\"image\">\n                <fd-avatar\n                    title=\"avatar\"\n                    [glyph]=\"avatar\"\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\n                    [transparent]=\"true\"\n                    [circle]=\"circleAvatar\"\n                ></fd-avatar>\n                <!-- <div\n                  class=\"fd-avatar fd-avatar--circle\"\n                  [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\n                  >\n                  <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\n                </div> -->\n            </fd-facet>\n            } @for (facet of facetList; track facet) {\n            <fd-facet\n                [type]=\"facet.type\"\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\n            >\n                @for (item of facet.mo.ItemList?.MoDataList; track item) {\n                <fd-facet-content>\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title }}</label>\n                    <fd-text [text]=\"item.Value | facetValue\" id=\"form-value-10\"></fd-text>\n                </fd-facet-content>\n                } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\n                <span\n                    fd-object-status\n                    [status]=\"facet.mo.Status | facetValue\"\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue)\"\n                    [large]=\"facet.mo.IsLarge\"\n                    [title]=\"facet.mo.Text | facetValue\"\n                    [aria-label]=\"facet.mo.Text | facetValue\"\n                    [glyph]=\"facet.mo.Icon\"\n                >\n                </span>\n                } @else {\n                <bnrc-dynamic-component\n                    [class]=\"'fd-object-status fd-object-status--' + facet.mo.Status | facetValue\"\n                    [class.fd-object-status--large]=\"facet.mo.IsLarge\"\n                    [component]=\"facet.mo.Component\"\n                    [value]=\"facet.mo.Text\"\n                ></bnrc-dynamic-component>\n                } @if (facet.mo.IsNumber && facet.type === 'key-value') {\n                <fd-object-number\n                    [number]=\"facet.mo.Text | facetValue\"\n                    [large]=\"facet.mo.IsLarge\"\n                    [unit]=\"facet.mo.Unit | facetValue\"\n                    [status]=\"facet.mo.Status | facetValue\"\n                    [decimal]=\"facet.mo.DecimalValue | facetValue\"\n                ></fd-object-number>\n                } @if (facet.type === 'plain-text') {\n                <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\n                    <fd-text [text]=\"facet.mo.Text | facetValue\" hyphenation=\"auto\"></fd-text>\n                </div>\n                } @if (facet.type === 'rating-indicator') {\n                <fd-facet-content>\n                    <fd-rating-indicator\n                        style=\"pointer-events: none\"\n                        size=\"md\"\n                        [dynamicTextIndicator]=\"facet.mo.Footer\"\n                        [displayMode]=\"true\"\n                        [value]=\"facet.mo | facetValue: facet.type\"\n                    ></fd-rating-indicator>\n                </fd-facet-content>\n                } @if (facet.type === 'progress') {\n                <div [style.width]=\"'10rem'\">\n                    <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\n                    <fd-progress-indicator\n                        style=\"width: 10r em\"\n                        [state]=\"facet.mo.State\"\n                        [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647'\"\n                        [valueNow]=\"facet.mo | facetValue: facet.type\"\n                        [valueMax]=\"10\"\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\n                    ></fd-progress-indicator>\n                    <!-- <ui5-progress-indicator\n                    style=\"width: 10rem\"\n                    [valueState]=\"facet.mo.State\"\n                    [value]=\"getNumber(facet.mo.Value)\"\n                  ></ui5-progress-indicator> -->\n                </div>\n                } @if (facet.type === 'microcharts') {\n                <div>\n                    <label wrap>in progress ...</label>\n                </div>\n                }\n            </fd-facet>\n            }\n        </fd-facet-group>\n        @if (description) {\n        <span>{{ description }}</span>\n        }\n    </fd-dynamic-page-subheader>\n    @if(!modernTabs.length && !contentIsPage){\n    <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\n        <fd-layout-grid style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\n            <div fdLayoutGridRow>\n                <div\n                    style=\"padding: 0\"\n                    [class.hide]=\"layout2.colXl === 0\"\n                    [fdLayoutGridCol]=\"0\"\n                    [colMd]=\"layout1.colMd\"\n                    [colLg]=\"layout1.colLg\"\n                    [colXl]=\"layout1.colXl\"\n                ></div>\n                <div style=\"min-height: 100%\" [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\n                            context: {\n                                $implicit: parameters?.LayoutComponent,\n                                layout94: layout94\n                            }\n                        \"\n                    ></ng-container>\n                </div>\n                <div\n                    style=\"padding: 0\"\n                    [class.hide]=\"layout2.colXl === 0\"\n                    [fdLayoutGridCol]=\"0\"\n                    [colMd]=\"layout2.colMd\"\n                    [colLg]=\"layout2.colLg\"\n                    [colXl]=\"layout2.colXl\"\n                ></div>\n            </div>\n        </fd-layout-grid>\n    </fd-dynamic-page-content>\n    } @else if(modernTabs.length && !contentIsPage && !parameters?.LayoutComponent){\n    <fdp-icon-tab-bar [stackContent]=\"false\" [collapseOverflow]=\"true\" [expandOverflowText]=\"'More' | bbbTranslate\">\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\n\n        <fdp-icon-tab-bar-tab\n            [id]=\"tab.id\"\n            [label]=\"tab.Title!! | bbbTranslate\"\n            [title]=\"tab.Title!! | bbbTranslate\"\n            [class.is-expanded]=\"selectedTab === tab.Title\"\n            #tablist\n        >\n            <fd-dynamic-page-content [id]=\"tab.id\" [class.limit-content-width]=\"formContentMaxWidth > 0\">\n                <fd-layout-grid [style.max-width.px]=\"formContentMaxWidth\">\n                    <div fdLayoutGridRow>\n                        <div\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout1.colMd\"\n                            [colLg]=\"layout1.colLg\"\n                            [colXl]=\"layout1.colXl\"\n                        ></div>\n                        <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\n                            <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\n                        </div>\n                        <div\n                            [fdLayoutGridCol]=\"0\"\n                            [colMd]=\"layout2.colMd\"\n                            [colLg]=\"layout2.colLg\"\n                            [colXl]=\"layout2.colXl\"\n                        ></div>\n                    </div>\n                </fd-layout-grid>\n            </fd-dynamic-page-content>\n        </fdp-icon-tab-bar-tab>\n        }\n    </fdp-icon-tab-bar>\n    } @if(!hideFooter && hasLayoutButtons){\n    <fd-dynamic-page-footer>\n        <ng-container *ngTemplateOutlet=\"layoutActionsTemplateRef\"></ng-container>\n    </fd-dynamic-page-footer>\n    }\n</fd-dynamic-page>\n@if (contentIsPage) {\n<ng-container\n    *ngTemplateOutlet=\"\n        renderLayoutComponent;\n        context: {\n            $implicit: parameters?.LayoutComponent,\n            layout94: layout94\n        }\n    \"\n></ng-container>\n}\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\n    <bsu-ly-layout-container-of-root\n        [config]=\"layout94\"\n        [isPanel]=\"false\"\n        [isRoot]=\"true\"\n    ></bsu-ly-layout-container-of-root>\n</ng-template>\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\n    <bnrc-dynamic-form-component\n        [component]=\"component\"\n        [layoutActionsTemplateRef]=\"layoutActionsTemplateRef\"\n        [removeContentPadding]=\"removeContentPadding\"\n        [breadCrumbs]=\"breadCrumbs\"\n        [description]=\"description\"\n        [title]=\"title\"\n        [subtitle]=\"subtitle\"\n        [toolbarItems]=\"toolbarItems\"\n        [layoutActions]=\"layoutActions\"\n        [footerDesign]=\"footerDesign\"\n        [facetList]=\"facetList\"\n        [settings]=\"component.Settings\"\n        [workflowButtons]=\"workflowButtons\"\n        [workflowPanelUi]=\"workflowPanelUi\"\n        [isMobile]=\"isMobile\"\n        [mo]=\"mo\"\n        [layout94]=\"layout94\"\n        [context]=\"context\"\n        [rtl]=\"rtl\"\n        [fieldDict]=\"fieldDict\"\n        [mask]=\"mask\"\n        [dirValue]=\"dirValue\"\n        [deviceSize]=\"deviceSize\"\n        [contentDensity]=\"contentDensity\"\n        [modernTabs]=\"modernTabs\"\n        [avatar]=\"avatar\"\n        (events)=\"onDynamicComponentEvents($event)\"\n    ></bnrc-dynamic-form-component>\n</ng-template>\n<ng-template #closeForm>\n    <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\n        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\n    </button>\n</ng-template>\n<ng-template #fullscreenForm>\n    @if (canFullscreen) {\n    <button\n        fd-button\n        fdType=\"transparent\"\n        [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n        (click)=\"fullscreenRequest.emit()\"\n        [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\n        [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\n    ></button>\n    }\n</ng-template>\n<ng-template #layoutActionsTemplateRef>\n    <bsu-layout-actions\n        [canSend]=\"canSend\"\n        [buttons]=\"layoutActions\"\n        [isMobile]=\"isMobile\"\n        [landscape]=\"landscape\"\n        [standalone]=\"standalone\"\n        [footerDesign]=\"footerDesign\"\n        [workflowButtons]=\"workflowButtons\"\n        [workflowButtonsComboMode]=\"workflowButtonsComboMode || worfklowButtonsOnFooter\"\n        [deviceSize]=\"deviceSize\"\n        [rtl]=\"rtl\"\n        (toolClick)=\"toolbarClick.emit($event)\"\n        (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\n    >\n    </bsu-layout-actions>\n</ng-template>\n", styles: [":host{display:block;height:auto;width:100%}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important}:host ::ng-deep .fd-progress-indicator__container,:host ::ng-deep .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 ::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}.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"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { _dynamicPageComponent: [{
                 type: ViewChild,
                 args: [DynamicPageComponent, { static: true }]