@fundamental-ngx/platform 0.65.0-rc.8 → 0.65.0

package/fesm2022/fundamental-ngx-platform-value-help-dialog.mjs

@@ -695,7 +695,7 @@ class SelectTabComponent extends VhdBaseTab {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectTabComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SelectTabComponent, isStandalone: true, selector: "fdp-select-tab", inputs: { selectTabTitleId: "selectTabTitleId", selectTabCountId: "selectTabCountId", selected: "selected", loading: "loading", filters: "filters", selection: "selection", allowSelectAll: "allowSelectAll", uniqueKey: "uniqueKey", pageSize: "pageSize", defaultMobileHeaders: "defaultMobileHeaders", displayedData: "displayedData" }, outputs: { select: "select" }, viewQueries: [{ propertyName: "infiniteScrollTable", first: true, predicate: InfiniteScrollDirective, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"table-header\">\n    <h5 fd-title role=\"heading\" aria-level=\"5\">\n        {{ ('platformVHD.selectTabDisplayCountLabel' | fdTranslate: { count: displayedData.length })() }}\n    </h5>\n</div>\n<div\n    class=\"fdp-value-help-dialog__table-holder table-content\"\n    fd-scrollbar\n    fdInfiniteScroll\n    (onScrollAction)=\"_showMoreElements()\"\n    [scrollPercent]=\"80\"\n    role=\"table\"\n>\n    <table\n        fd-table\n        [popIn]=\"mobile\"\n        [noBorderX]=\"mobile\"\n        [noBorderY]=\"false\"\n        [attr.aria-colcount]=\"_tableFilters.main.length\"\n        [attr.aria-rowcount]=\"displayedData.length\"\n        role=\"grid\"\n        aria-multiselectable=\"true\"\n        [attr.aria-labelledby]=\"selectTabTitleId + ' ' + selectTabCountId\"\n        [allCellsFocusable]=\"true\"\n    >\n        <label [id]=\"selectTabCountId\" fd-form-label class=\"fdp-value-help-dialog__hidden_label\">\n            {{\n                (\n                    'platformVHD.selectTabCountHiddenA11yLabel'\n                    | fdTranslate: { rowCount: displayedData.length, colCount: _tableFilters.main.length }\n                )()\n            }}\n        </label>\n        <label [id]=\"selectTabTitleId\" fd-form-label class=\"fdp-value-help-dialog__hidden_label\">\n            {{ ('platformVHD.selectTabDisplayCountLabel' | fdTranslate: { count: displayedData.length })() }}\n        </label>\n        <thead fd-table-header>\n            @if (displayedData.length && _tableFilters) {\n                <tr fd-table-row>\n                    <th fd-table-cell [fitContent]=\"mobile\">\n                        @if (isMultiSelection && allowSelectAll) {\n                            <fd-checkbox\n                                [name]=\"uid + '-row-all'\"\n                                [tristate]=\"true\"\n                                [tristateSelectable]=\"false\"\n                                [ngModel]=\"_selectedAll\"\n                                (ngModelChange)=\"_toggleAllRows()\"\n                            ></fd-checkbox>\n                        }\n                    </th>\n                    @for (\n                        filter of _tableFilters.main;\n                        track _trackByFilterFn(colindex, filter);\n                        let colindex = $index\n                    ) {\n                        <th fd-table-cell [attr.aria-colindex]=\"colindex\">\n                            {{ filter.label }}\n                        </th>\n                    }\n                </tr>\n            }\n        </thead>\n        <tbody fd-table-body>\n            @for (\n                row of displayedData | slice: _shownFrom : _shownCount;\n                track _trackByTableRowFn(i, row);\n                let i = $index\n            ) {\n                <tr\n                    fd-table-row\n                    [hoverable]=\"!mobile\"\n                    [main]=\"mobile\"\n                    [attr.aria-selected]=\"_selectedMap[row[uniqueKey]]\"\n                    [activable]=\"!isMultiSelection\"\n                    (click)=\"!isMultiSelection && _toggleSelectRow(row)\"\n                >\n                    <td fd-table-cell [fitContent]=\"mobile\">\n                        @if (isMultiSelection) {\n                            <fd-checkbox\n                                [name]=\"uid + '-row-' + i\"\n                                [ngModel]=\"_selectedMap[row[uniqueKey]]\"\n                                (change)=\"_toggleSelectRow(row)\"\n                            ></fd-checkbox>\n                        }\n                    </td>\n                    @for (filter of _tableFilters.main; track filter; let rowIndex = $index) {\n                        <td fd-table-cell [attr.aria-rowindex]=\"rowIndex\">\n                            @if (_columnDefMap.get(filter.key); as columnDef) {\n                                <ng-template\n                                    [ngTemplateOutlet]=\"columnDef.templateRef\"\n                                    [ngTemplateOutletContext]=\"{\n                                        $implicit: row,\n                                        key: filter.key,\n                                        value: row[filter.key] || ''\n                                    }\"\n                                ></ng-template>\n                            } @else {\n                                {{ row[filter.key] || '' }}\n                            }\n                        </td>\n                    }\n                </tr>\n                @if (mobile && _tableFilters.secondary.length) {\n                    <tr fd-table-row [secondary]=\"true\" [attr.aria-selected]=\"_selectedMap[row[uniqueKey]]\">\n                        <td fd-table-cell></td>\n                        <td colspan=\"100%\" fd-table-cell [fitContent]=\"true\">\n                            @for (filter of _tableFilters.secondary; track filter) {\n                                <p fd-table-text>\n                                    <label>{{ filter.label }}:</label>\n                                    {{ row[filter.key] || '' }}\n                                </p>\n                            }\n                        </td>\n                    </tr>\n                }\n            }\n            @if (displayedData.length && mobile && _shownCount && _shownCount !== displayedData.length) {\n                <tr fd-table-row>\n                    <td colspan=\"100%\">\n                        <div fd-bar barDesign=\"header-with-subheader\">\n                            <div fd-bar-middle>\n                                <fd-bar-element>\n                                    <button\n                                        fd-button\n                                        fdType=\"transparent\"\n                                        [label]=\"('platformVHD.selectTabMoreBtnLabel' | fdTranslate)()\"\n                                        (click)=\"_showMoreElements()\"\n                                    ></button>\n                                </fd-bar-element>\n                            </div>\n                        </div>\n                    </td>\n                </tr>\n            }\n            @if (!displayedData.length) {\n                @if (loading) {\n                    @for (_ of loadingRange; track $index) {\n                        <tr fd-table-row>\n                            @for (_ of loadingRange; track $index) {\n                                <td fd-table-cell>\n                                    <fd-skeleton\n                                        [style.margin]=\"'auto 0'\"\n                                        type=\"text\"\n                                        textLines=\"1\"\n                                        width=\"60%\"\n                                    ></fd-skeleton>\n                                </td>\n                            }\n                        </tr>\n                    }\n                } @else {\n                    <tr fd-table-row>\n                        <td fd-table-cell colspan=\"100%\">\n                            <div class=\"fdp-value-help-dialog__empty-message\">\n                                {{ ('platformVHD.searchTableEmptyMessage' | fdTranslate)() }}\n                            </div>\n                        </td>\n                    </tr>\n                }\n            }\n        </tbody>\n    </table>\n</div>\n", styles: [".fdp-value-help-dialog__advanced-filters .fd-col{padding-top:0}.fdp-value-help-dialog__content-holder fdp-select-tab{display:flex;flex-direction:column;overflow:hidden;height:100%}.fdp-value-help-dialog__content-holder .table-header{flex:0 0 auto}.fdp-value-help-dialog__content-holder .table-content{flex:1 1 auto;overflow:auto;min-height:5rem}.fdp-value-help-dialog__table-holder{padding-top:0;padding-bottom:0}.fdp-value-help-dialog__empty-message{padding:1rem 2rem}\n"], dependencies: [{ kind: "component", type: TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["twoLineClamp", "headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: ScrollbarDirective, selector: "[fdScrollbar], [fd-scrollbar]", inputs: ["noHorizontalScroll", "noVerticalScroll", "alwaysVisible"] }, { kind: "directive", type: InfiniteScrollDirective, selector: "[fdInfiniteScroll]", inputs: ["scrollPercent", "scrollOffset"], outputs: ["onScrollAction"] }, { kind: "component", type: TableComponent, selector: "table[fd-table]", inputs: ["noBorderX", "noBorderY", "noOuterBorder", "topBorder", "popIn", "responsive", "keys", "allCellsFocusable"], exportAs: ["fd-table"] }, { kind: "component", type: FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id", "disabled", "unitDescription", "independent"] }, { kind: "directive", type: TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY", "nonInteractive"] }, { kind: "directive", type: TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "nonInteractive", "key"] }, { kind: "component", type: CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: TableBodyDirective, selector: "[fdTableBody], [fd-table-body]", inputs: ["noBorderX", "noBorderY"] }, { kind: "directive", type: TableTextDirective, selector: "[fdTableText], [fd-table-text]", inputs: ["fdTableTextClass", "noWrap", "title", "maxWidth"] }, { kind: "component", type: BarComponent, selector: "[fd-bar]", inputs: ["barDesign", "inPage", "inHomePage", "clear", "size", "initialSuggestionTitle", "initialSuggestionSubline", "role"] }, { kind: "directive", type: BarMiddleDirective, selector: "[fd-bar-middle]", inputs: ["stackContentsVertically"] }, { kind: "directive", type: BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["id"], exportAs: ["fd-button"] }, { kind: "component", type: SkeletonComponent, selector: "fd-skeleton", inputs: ["animated", "type", "textLines", "width", "height"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: SlicePipe, name: "slice" }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: SelectTabComponent, isStandalone: true, selector: "fdp-select-tab", inputs: { selectTabTitleId: "selectTabTitleId", selectTabCountId: "selectTabCountId", selected: "selected", loading: "loading", filters: "filters", selection: "selection", allowSelectAll: "allowSelectAll", uniqueKey: "uniqueKey", pageSize: "pageSize", defaultMobileHeaders: "defaultMobileHeaders", displayedData: "displayedData" }, outputs: { select: "select" }, viewQueries: [{ propertyName: "infiniteScrollTable", first: true, predicate: InfiniteScrollDirective, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"table-header\">\n    <h5 fd-title role=\"heading\" aria-level=\"5\">\n        {{ ('platformVHD.selectTabDisplayCountLabel' | fdTranslate: { count: displayedData.length })() }}\n    </h5>\n</div>\n<div\n    class=\"fdp-value-help-dialog__table-holder table-content\"\n    fd-scrollbar\n    fdInfiniteScroll\n    (onScrollAction)=\"_showMoreElements()\"\n    [scrollPercent]=\"80\"\n    role=\"table\"\n>\n    <table\n        fd-table\n        [popIn]=\"mobile\"\n        [noBorderX]=\"mobile\"\n        [noBorderY]=\"false\"\n        [attr.aria-colcount]=\"_tableFilters.main.length\"\n        [attr.aria-rowcount]=\"displayedData.length\"\n        role=\"grid\"\n        aria-multiselectable=\"true\"\n        [attr.aria-labelledby]=\"selectTabTitleId + ' ' + selectTabCountId\"\n        [allCellsFocusable]=\"true\"\n    >\n        <label [id]=\"selectTabCountId\" fd-form-label class=\"fdp-value-help-dialog__hidden_label\">\n            {{\n                (\n                    'platformVHD.selectTabCountHiddenA11yLabel'\n                    | fdTranslate: { rowCount: displayedData.length, colCount: _tableFilters.main.length }\n                )()\n            }}\n        </label>\n        <label [id]=\"selectTabTitleId\" fd-form-label class=\"fdp-value-help-dialog__hidden_label\">\n            {{ ('platformVHD.selectTabDisplayCountLabel' | fdTranslate: { count: displayedData.length })() }}\n        </label>\n        <thead fd-table-header>\n            @if (displayedData.length && _tableFilters) {\n                <tr fd-table-row>\n                    <th fd-table-cell [fitContent]=\"mobile\">\n                        @if (isMultiSelection && allowSelectAll) {\n                            <fd-checkbox\n                                [name]=\"uid + '-row-all'\"\n                                [tristate]=\"true\"\n                                [tristateSelectable]=\"false\"\n                                [ngModel]=\"_selectedAll\"\n                                (ngModelChange)=\"_toggleAllRows()\"\n                            ></fd-checkbox>\n                        }\n                    </th>\n                    @for (\n                        filter of _tableFilters.main;\n                        track _trackByFilterFn(colindex, filter);\n                        let colindex = $index\n                    ) {\n                        <th fd-table-cell [attr.aria-colindex]=\"colindex\">\n                            {{ filter.label }}\n                        </th>\n                    }\n                </tr>\n            }\n        </thead>\n        <tbody fd-table-body>\n            @for (\n                row of displayedData | slice: _shownFrom : _shownCount;\n                track _trackByTableRowFn(i, row);\n                let i = $index\n            ) {\n                <tr\n                    fd-table-row\n                    [hoverable]=\"!mobile\"\n                    [main]=\"mobile\"\n                    [attr.aria-selected]=\"_selectedMap[row[uniqueKey]]\"\n                    [activable]=\"!isMultiSelection\"\n                    (click)=\"!isMultiSelection && _toggleSelectRow(row)\"\n                >\n                    <td fd-table-cell [fitContent]=\"mobile\">\n                        @if (isMultiSelection) {\n                            <fd-checkbox\n                                [name]=\"uid + '-row-' + i\"\n                                [ngModel]=\"_selectedMap[row[uniqueKey]]\"\n                                (change)=\"_toggleSelectRow(row)\"\n                            ></fd-checkbox>\n                        }\n                    </td>\n                    @for (filter of _tableFilters.main; track filter; let rowIndex = $index) {\n                        <td fd-table-cell [attr.aria-rowindex]=\"rowIndex\">\n                            @if (_columnDefMap.get(filter.key); as columnDef) {\n                                <ng-template\n                                    [ngTemplateOutlet]=\"columnDef.templateRef\"\n                                    [ngTemplateOutletContext]=\"{\n                                        $implicit: row,\n                                        key: filter.key,\n                                        value: row[filter.key] || ''\n                                    }\"\n                                ></ng-template>\n                            } @else {\n                                {{ row[filter.key] || '' }}\n                            }\n                        </td>\n                    }\n                </tr>\n                @if (mobile && _tableFilters.secondary.length) {\n                    <tr fd-table-row [secondary]=\"true\" [attr.aria-selected]=\"_selectedMap[row[uniqueKey]]\">\n                        <td fd-table-cell></td>\n                        <td colspan=\"100%\" fd-table-cell [fitContent]=\"true\">\n                            @for (filter of _tableFilters.secondary; track filter) {\n                                <p fd-table-text>\n                                    <label>{{ filter.label }}:</label>\n                                    {{ row[filter.key] || '' }}\n                                </p>\n                            }\n                        </td>\n                    </tr>\n                }\n            }\n            @if (displayedData.length && mobile && _shownCount && _shownCount !== displayedData.length) {\n                <tr fd-table-row>\n                    <td colspan=\"100%\">\n                        <div fd-bar barDesign=\"header-with-subheader\">\n                            <div fd-bar-middle>\n                                <fd-bar-element>\n                                    <button\n                                        fd-button\n                                        fdType=\"transparent\"\n                                        [label]=\"('platformVHD.selectTabMoreBtnLabel' | fdTranslate)()\"\n                                        (click)=\"_showMoreElements()\"\n                                    ></button>\n                                </fd-bar-element>\n                            </div>\n                        </div>\n                    </td>\n                </tr>\n            }\n            @if (!displayedData.length) {\n                @if (loading) {\n                    @for (_ of loadingRange; track $index) {\n                        <tr fd-table-row>\n                            @for (_ of loadingRange; track $index) {\n                                <td fd-table-cell>\n                                    <fd-skeleton\n                                        [style.margin]=\"'auto 0'\"\n                                        type=\"text\"\n                                        textLines=\"1\"\n                                        width=\"60%\"\n                                    ></fd-skeleton>\n                                </td>\n                            }\n                        </tr>\n                    }\n                } @else {\n                    <tr fd-table-row>\n                        <td fd-table-cell colspan=\"100%\">\n                            <div class=\"fdp-value-help-dialog__empty-message\">\n                                {{ ('platformVHD.searchTableEmptyMessage' | fdTranslate)() }}\n                            </div>\n                        </td>\n                    </tr>\n                }\n            }\n        </tbody>\n    </table>\n</div>\n", styles: [".fdp-value-help-dialog__advanced-filters .fd-col{padding-top:0}.fdp-value-help-dialog__content-holder fdp-select-tab{display:flex;flex-direction:column;overflow:hidden;height:100%}.fdp-value-help-dialog__content-holder .table-header{flex:0 0 auto}.fdp-value-help-dialog__content-holder .table-content{flex:1 1 auto;overflow:auto;min-height:5rem}.fdp-value-help-dialog__table-holder{padding-top:0;padding-bottom:0}.fdp-value-help-dialog__empty-message{padding:1rem 2rem}\n"], dependencies: [{ kind: "component", type: TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["twoLineClamp", "headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: ScrollbarDirective, selector: "[fdScrollbar], [fd-scrollbar]", inputs: ["noHorizontalScroll", "noVerticalScroll", "alwaysVisible"] }, { kind: "directive", type: InfiniteScrollDirective, selector: "[fdInfiniteScroll]", inputs: ["scrollPercent", "scrollOffset"], outputs: ["onScrollAction"] }, { kind: "component", type: TableComponent, selector: "table[fd-table]", inputs: ["role", "noBorderX", "noBorderY", "noOuterBorder", "topBorder", "popIn", "responsive", "keys", "allCellsFocusable"], exportAs: ["fd-table"] }, { kind: "component", type: FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id", "disabled", "unitDescription", "independent"] }, { kind: "directive", type: TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["role", "noBorderX", "noBorderY", "nonInteractive"] }, { kind: "directive", type: TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["role", "activable", "highlightActive", "hoverable", "main", "secondary", "active"] }, { kind: "directive", type: TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["role", "noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "nonInteractive", "key"] }, { kind: "component", type: CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: TableBodyDirective, selector: "[fdTableBody], [fd-table-body]", inputs: ["role", "noBorderX", "noBorderY"] }, { kind: "directive", type: TableTextDirective, selector: "[fdTableText], [fd-table-text]", inputs: ["fdTableTextClass", "noWrap", "title", "maxWidth"] }, { kind: "component", type: BarComponent, selector: "[fd-bar]", inputs: ["barDesign", "inPage", "inHomePage", "clear", "size", "initialSuggestionTitle", "initialSuggestionSubline", "role"] }, { kind: "directive", type: BarMiddleDirective, selector: "[fd-bar-middle]", inputs: ["stackContentsVertically"] }, { kind: "directive", type: BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["id"], exportAs: ["fd-button"] }, { kind: "component", type: SkeletonComponent, selector: "fd-skeleton", inputs: ["animated", "type", "textLines", "width", "height"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: SlicePipe, name: "slice" }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: SelectTabComponent, decorators: [{
             type: Component,