@biit-solutions/wizardry-theme 1.22.21 → 1.22.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (28) hide show
  1. package/assets/styles/context-menu/base.scss +1 -1
  2. package/esm2020/button/biit-action-button/biit-action-button.component.mjs +2 -2
  3. package/esm2020/inputs/biit-input-text/biit-input-text.component.mjs +2 -2
  4. package/esm2020/inputs/biit-multiselect/biit-multiselect.component.mjs +2 -2
  5. package/esm2020/navigation/biit-nav-menu/biit-nav-menu.component.mjs +2 -2
  6. package/esm2020/popup/biit-popup/biit-popup.component.mjs +2 -2
  7. package/esm2020/table/biit-datatable/biit-datatable.component.mjs +2 -2
  8. package/fesm2015/biit-solutions-wizardry-theme-button.mjs +2 -2
  9. package/fesm2015/biit-solutions-wizardry-theme-button.mjs.map +1 -1
  10. package/fesm2015/biit-solutions-wizardry-theme-inputs.mjs +4 -4
  11. package/fesm2015/biit-solutions-wizardry-theme-inputs.mjs.map +1 -1
  12. package/fesm2015/biit-solutions-wizardry-theme-navigation.mjs +2 -2
  13. package/fesm2015/biit-solutions-wizardry-theme-navigation.mjs.map +1 -1
  14. package/fesm2015/biit-solutions-wizardry-theme-popup.mjs +2 -2
  15. package/fesm2015/biit-solutions-wizardry-theme-popup.mjs.map +1 -1
  16. package/fesm2015/biit-solutions-wizardry-theme-table.mjs +2 -2
  17. package/fesm2015/biit-solutions-wizardry-theme-table.mjs.map +1 -1
  18. package/fesm2020/biit-solutions-wizardry-theme-button.mjs +2 -2
  19. package/fesm2020/biit-solutions-wizardry-theme-button.mjs.map +1 -1
  20. package/fesm2020/biit-solutions-wizardry-theme-inputs.mjs +4 -4
  21. package/fesm2020/biit-solutions-wizardry-theme-inputs.mjs.map +1 -1
  22. package/fesm2020/biit-solutions-wizardry-theme-navigation.mjs +2 -2
  23. package/fesm2020/biit-solutions-wizardry-theme-navigation.mjs.map +1 -1
  24. package/fesm2020/biit-solutions-wizardry-theme-popup.mjs +2 -2
  25. package/fesm2020/biit-solutions-wizardry-theme-popup.mjs.map +1 -1
  26. package/fesm2020/biit-solutions-wizardry-theme-table.mjs +2 -2
  27. package/fesm2020/biit-solutions-wizardry-theme-table.mjs.map +1 -1
  28. package/package.json +1 -1
package/esm2020/table/biit-datatable/biit-datatable.component.mjs CHANGED
@@ -96,10 +96,10 @@ export class BiitDatatableComponent {
96
96
  }
97
97
  }
98
98
  BiitDatatableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitDatatableComponent, deps: [{ token: i1.BiitIconService }], target: i0.ɵɵFactoryTarget.Component });
99
- BiitDatatableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitDatatableComponent, selector: "biit-datatable", inputs: { data: "data", columns: "columns", pageSize: "pageSize", pageSizeList: "pageSizeList", loading: "loading", selectable: "selectable", singleSelection: "singleSelection", scrollbarH: "scrollbarH", hideHeader: "hideHeader", hideFooter: "hideFooter", serverSide: "serverSide", page: "page" }, outputs: { onSelection: "onSelection", onPageChange: "onPageChange" }, providers: [provideTranslocoScope({ scope: 'wizardry-theme/table', alias: 't' })], queries: [{ propertyName: "actionsTpl", first: true, predicate: ["actions"], descendants: true }], viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true }], ngImport: i0, template: "<div id=\"biit-table\" class=\"table-canvas\" *transloco=\"let t\">\n <div class=\"top\" *ngIf=\"!hideHeader\">\n <div id=\"menu\" class=\"action-bar\">\n <biit-vertical-menu *ngIf=\"actionsTpl\" class=\"vertical-menu\">\n <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n </biit-vertical-menu>\n <div *ngIf=\"actionsTpl\" class=\"horizontal-menu default-menu\">\n <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n </div>\n <div class=\"default-menu\" *ngIf=\"!actionsTpl\">\n <ng-content></ng-content>\n </div>\n </div>\n <div id=\"options\" class=\"options\">\n <biit-input-text id=\"search\" #searchInput\n [ngModel]=\"search\"\n (onActionPerformed)=\"\n onFilter($event, true);\n \"\n (ngModelChange)=\"onFilter($event)\"\n (focusout)=\"searchInput.value = search\"\n icon=\"search\"\n [placeholder]=\"t('t.search')\"\n ></biit-input-text>\n <biit-multiselect id=\"column-selector\" [ngModel]=\"_columns\"\n (ngModelChange)=\"setColumnVisibility($event)\"\n [data]=\"allColumns\"\n label=\"name\"\n value=\"visible\"\n [type]=\"BiitMultiselectType.ICON\"\n [title]=\"t('t.column-selector')\"\n [compact]=\"true\"\n ></biit-multiselect>\n </div>\n </div>\n <div id=\"content\" class=\"table\">\n <biit-progress-bar *ngIf=\"loading\"></biit-progress-bar>\n <ng-container *ngIf=\"!serverSide\">\n <ngx-datatable #table\n [rows]=\"data\"\n [columns]=\"_columns\"\n [columnMode]=\"'force'\"\n [headerHeight]=\"42\"\n [footerHeight]=\"hideFooter ? 0 : 34\"\n [rowHeight]=\"'auto'\"\n [reorderable]=\"false\"\n [selectionType]=\"SelectionType.checkbox\"\n [selected]=\"selected\"\n (select)=\"onSelect($event)\"\n (activate)=\"onActivate($event)\"\n [virtualization]=\"false\"\n [scrollbarVDynamic]=\"true\"\n [limit]=\"pageSize\"\n [scrollbarH]=\"scrollbarH\"\n [messages]=\"{emptyMessage: t('t.empty-message')}\"\n >\n <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n #chkbox\n [width]=\"42\"\n [sortable]=\"false\"\n [canAutoResize]=\"false\"\n [draggable]=\"false\"\n [resizeable]=\"false\"\n [name]=\"'chkbox'\"\n >\n <ng-template\n ngx-datatable-header-template\n let-value=\"value\"\n let-allRowsSelected=\"allRowsSelected\"\n let-selectFn=\"selectFn\"\n >\n <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n </ng-template>\n <ng-template\n ngx-datatable-cell-template\n let-value=\"value\"\n let-isSelected=\"isSelected\"\n let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n >\n <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n </ng-template>\n </ngx-datatable-column>\n\n <ngx-datatable-column *ngFor=\"let column of _columns\"\n [name]=\"column.name\"\n [prop]=\"column.prop\"\n [checkboxable]=\"column.checkboxable\"\n [frozenLeft]=\"column.frozenLeft\"\n [frozenRight]=\"column.frozenRight\"\n [flexGrow]=\"column.flexGrow\"\n [minWidth]=\"column.minWidth\"\n [maxWidth]=\"column.maxWidth\"\n [width]=\"column.width\"\n [resizeable]=\"column.resizeable\"\n [comparator]=\"column.comparator\"\n [pipe]=\"column.pipe\"\n [sortable]=\"column.sortable\"\n [draggable]=\"column.draggable\"\n [canAutoResize]=\"column.canAutoResize\"\n [cellTemplate]=\"column.cellTemplate\"\n [ghostCellTemplate]=\"column.ghostCellTemplate\"\n [treeToggleTemplate]=\"column.treeToggleTemplate\"\n [cellClass]=\"column.cellClass\"\n [headerTemplate]=\"column.headerTemplate\"\n [headerClass]=\"column.headerClass\"\n [headerCheckboxable]=\"column.headerCheckboxable\"\n [isTreeColumn]=\"column.isTreeColumn\"\n [treeLevelIndent]=\"column.treeLevelIndent\"\n [summaryFunc]=\"column.summaryFunc\"\n [summaryTemplate]=\"column.summaryTemplate\"\n ></ngx-datatable-column>\n\n <ngx-datatable-footer id=\"datatable-footer\">\n <ng-template\n ngx-datatable-footer-template\n let-rowCount=\"rowCount\"\n let-pageSizeCurrent=\"pageSize\"\n let-selectedCount=\"selectedCount\"\n let-curPage=\"curPage\"\n let-offset=\"offset\"\n >\n <div class=\"label\">\n <span>{{ t('t.total') }}: </span><span id=\"total-number-of-items\">{{rowCount}}</span>\n <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: </span><span *ngIf=\"selectedCount\" id=\"number-of-items-selected\">{{selectedCount}}</span>\n </div>\n <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n <biit-datatable-pager #pager\n [page]=\"curPage\"\n [size]=\"pageSizeCurrent\"\n [count]=\"rowCount\"\n [hidden]=\"!((rowCount / pageSize) > 1)\"\n (change)=\"table.onFooterPage($event)\">\n </biit-datatable-pager>\n </div>\n <div class=\"page-items\" *ngIf=\"pageSizeList\">\n <div *ngIf=\"pageSizeList?.length\">\n <span>{{ t('t.rows-per-page') }}:</span>\n <select [(ngModel)]=\"pageSize\"\n (ngModelChange)=\"pager.size = $event\">\n <option *ngFor=\"let size of pageSizeList\"\n [ngValue]=\"size\"\n >\n {{size}}\n </option>\n </select>\n </div>\n </div>\n </ng-template>\n </ngx-datatable-footer>\n </ngx-datatable>\n </ng-container>\n\n <ng-container *ngIf=\"serverSide\">\n <ngx-datatable #table\n [rows]=\"data\"\n [columns]=\"_columns\"\n [columnMode]=\"'force'\"\n [headerHeight]=\"42\"\n [footerHeight]=\"hideFooter ? 0 : 34\"\n [rowHeight]=\"'auto'\"\n [reorderable]=\"false\"\n [selectionType]=\"SelectionType.checkbox\"\n [selected]=\"selected\"\n (select)=\"onSelect($event)\"\n (activate)=\"onActivate($event)\"\n [virtualization]=\"false\"\n [scrollbarVDynamic]=\"true\"\n [scrollbarH]=\"scrollbarH\"\n [messages]=\"{emptyMessage: t('t.empty-message')}\"\n [externalPaging]=\"true\"\n [count]=\"page.totalElements\"\n [offset]=\"page.pageNumber\"\n [limit]=\"page.pageSize\"\n (page)=\"onFooterPageChange($event)\"\n >\n <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n #chkbox\n [width]=\"42\"\n [sortable]=\"false\"\n [canAutoResize]=\"false\"\n [draggable]=\"false\"\n [resizeable]=\"false\"\n [name]=\"'chkbox'\"\n >\n <ng-template\n ngx-datatable-header-template\n let-value=\"value\"\n let-allRowsSelected=\"allRowsSelected\"\n let-selectFn=\"selectFn\"\n >\n <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n </ng-template>\n <ng-template\n ngx-datatable-cell-template\n let-value=\"value\"\n let-isSelected=\"isSelected\"\n let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n >\n <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n </ng-template>\n </ngx-datatable-column>\n\n <ngx-datatable-column *ngFor=\"let column of _columns\"\n [name]=\"column.name\"\n [prop]=\"column.prop\"\n [checkboxable]=\"column.checkboxable\"\n [frozenLeft]=\"column.frozenLeft\"\n [frozenRight]=\"column.frozenRight\"\n [flexGrow]=\"column.flexGrow\"\n [minWidth]=\"column.minWidth\"\n [maxWidth]=\"column.maxWidth\"\n [width]=\"column.width\"\n [resizeable]=\"column.resizeable\"\n [comparator]=\"column.comparator\"\n [pipe]=\"column.pipe\"\n [sortable]=\"column.sortable\"\n [draggable]=\"column.draggable\"\n [canAutoResize]=\"column.canAutoResize\"\n [cellTemplate]=\"column.cellTemplate\"\n [ghostCellTemplate]=\"column.ghostCellTemplate\"\n [treeToggleTemplate]=\"column.treeToggleTemplate\"\n [cellClass]=\"column.cellClass\"\n [headerTemplate]=\"column.headerTemplate\"\n [headerClass]=\"column.headerClass\"\n [headerCheckboxable]=\"column.headerCheckboxable\"\n [isTreeColumn]=\"column.isTreeColumn\"\n [treeLevelIndent]=\"column.treeLevelIndent\"\n [summaryFunc]=\"column.summaryFunc\"\n [summaryTemplate]=\"column.summaryTemplate\"\n ></ngx-datatable-column>\n\n <ngx-datatable-footer>\n <ng-template\n ngx-datatable-footer-template\n let-rowCount=\"rowCount\"\n let-pageSizeCurrent=\"pageSize\"\n let-selectedCount=\"selectedCount\"\n let-curPage=\"curPage\"\n let-offset=\"offset\"\n >\n <div class=\"label\" id=\"total-elements\">\n <span>{{ t('t.total') }}: {{rowCount}}</span>\n <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: {{selectedCount}}</span>\n </div>\n <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n <biit-datatable-pager #pager\n [page]=\"curPage\"\n [size]=\"pageSizeCurrent\"\n [count]=\"rowCount\"\n [hidden]=\"!((rowCount / pageSize) > 1)\"\n (change)=\"table.onFooterPage($event)\">\n </biit-datatable-pager>\n </div>\n <div class=\"page-items\" *ngIf=\"pageSizeList\">\n <div *ngIf=\"pageSizeList?.length\">\n <span>{{ t('t.rows-per-page') }}:</span>\n <select [(ngModel)]=\"pageSize\"\n (ngModelChange)=\"pager.size = $event\">\n <option *ngFor=\"let size of pageSizeList\"\n [ngValue]=\"size\"\n >\n {{size}}\n </option>\n </select>\n </div>\n </div>\n </ng-template>\n </ngx-datatable-footer>\n </ngx-datatable>\n </ng-container>\n </div>\n</div>\n", styles: [".table-canvas{height:100%;display:flex;flex-direction:column;gap:14px;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .top{display:flex;flex:0}.table-canvas .top .action-bar{display:flex;flex:1}.table-canvas .top .options{display:flex;flex:0}.table-canvas .table{position:relative;flex:1;min-height:0;min-width:0}.table-canvas .table biit-progress-bar{position:absolute;z-index:1;left:0;right:3px;top:42px}.table-canvas .table ::ng-deep ngx-datatable{height:100%;position:absolute;inset:0}.table-canvas .table ::ng-deep ngx-datatable>div{height:calc(100% - 42px)}.table-canvas .table ::ng-deep ngx-datatable>div>div{height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner{height:inherit}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap{height:100%!important;width:calc(100% - 3px);display:flex;align-items:center;justify-content:center;background:var(--table-header-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap span{color:var(--table-text-color);font-size:16px;line-height:100%;font-weight:700;text-transform:uppercase}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap .sort-btn{position:absolute;right:14px}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap:has(biit-checkbox){background:var(--chart-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-body{height:100%!important;overflow-y:auto!important}.table-canvas .table ::ng-deep ngx-datatable datatable-body .empty-row{height:100%;display:flex;align-items:center;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row .datatable-body-cell-label{display:flex;align-items:center;min-height:42px;border-bottom:3px solid var(--table-header-color);width:calc(100% - 3px);padding:9px 14px;line-height:120%;height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row:hover .datatable-body-cell-label{background:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row.active .datatable-body-cell-label{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer{position:absolute;bottom:0;background:var(--chart-background);z-index:10}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .label{flex:1 0}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination{display:flex;margin:auto;flex:0;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination biit-datatable-pager{flex:none!important}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items{flex:1 0;display:flex;justify-content:flex-end;align-items:center;color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select{appearance:none;border:none;height:34px;min-width:34px;padding:8px 14px;text-align:end;font-size:14px;font-family:Montserrat,serif;cursor:pointer;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:focus-visible{outline:none;background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:hover{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select *{background:var(--chart-background);padding:5px}.table-canvas .table ::ng-deep ngx-datatable:has(datatable-footer) datatable-body{height:calc(100% - 48px)!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper{height:unset!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper .datatable-row-detail{height:unset!important}.default-menu{display:flex;flex-direction:row}@media screen and (max-width: 600px){.page-items,.page-size-selector,.horizontal-menu{display:none!important}}@media screen and (min-width: 601px){.vertical-menu{display:none!important}}\n"], dependencies: [{ kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.BiitCheckboxComponent, selector: "biit-checkbox", inputs: ["disabled", "description", "showAlwaysDescription"], outputs: ["onValueChange"] }, { kind: "component", type: i5.BiitDatatablePagerComponent, selector: "biit-datatable-pager" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarVDynamic", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "ghostLoadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "disableRowCheck", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction"] }, { kind: "directive", type: i6.DataTableColumnDirective, selector: "ngx-datatable-column", inputs: ["name", "prop", "frozenLeft", "frozenRight", "flexGrow", "resizeable", "comparator", "pipe", "sortable", "draggable", "canAutoResize", "minWidth", "width", "maxWidth", "checkboxable", "headerCheckboxable", "headerClass", "cellClass", "isTreeColumn", "treeLevelIndent", "summaryFunc", "summaryTemplate", "cellTemplate", "headerTemplate", "treeToggleTemplate", "ghostCellTemplate"] }, { kind: "directive", type: i6.DataTableColumnHeaderDirective, selector: "[ngx-datatable-header-template]" }, { kind: "directive", type: i6.DataTableColumnCellDirective, selector: "[ngx-datatable-cell-template]" }, { kind: "directive", type: i6.DataTableFooterTemplateDirective, selector: "[ngx-datatable-footer-template]" }, { kind: "directive", type: i6.DatatableFooterDirective, selector: "ngx-datatable-footer", inputs: ["footerHeight", "totalMessage", "selectedMessage", "pagerLeftArrowIcon", "pagerRightArrowIcon", "pagerPreviousIcon", "pagerNextIcon", "template"] }, { kind: "component", type: i7.BiitProgressBarComponent, selector: "biit-progress-bar", inputs: ["type", "_value", "value"] }, { kind: "component", type: i4.BiitMultiselectComponent, selector: "biit-multiselect", inputs: ["title", "type", "icon", "label", "value", "descriptionField", "description", "data", "primitive", "compact", "disabled", "required", "sort-asc", "sort-desc"], outputs: ["onCreate"] }, { kind: "directive", type: i8.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: i4.BiitInputTextComponent, selector: "biit-input-text", inputs: ["placeholder", "error", "description", "info", "type", "icon", "fieldName", "disabled", "required", "readonly", "min", "max", "minLength", "maxLength", "regEx"], outputs: ["onActionPerformed"] }, { kind: "component", type: i9.BiitVerticalMenuComponent, selector: "biit-vertical-menu" }] });
99
+ BiitDatatableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitDatatableComponent, selector: "biit-datatable", inputs: { data: "data", columns: "columns", pageSize: "pageSize", pageSizeList: "pageSizeList", loading: "loading", selectable: "selectable", singleSelection: "singleSelection", scrollbarH: "scrollbarH", hideHeader: "hideHeader", hideFooter: "hideFooter", serverSide: "serverSide", page: "page" }, outputs: { onSelection: "onSelection", onPageChange: "onPageChange" }, providers: [provideTranslocoScope({ scope: 'wizardry-theme/table', alias: 't' })], queries: [{ propertyName: "actionsTpl", first: true, predicate: ["actions"], descendants: true }], viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true }], ngImport: i0, template: "<div id=\"biit-table\" class=\"table-canvas\" *transloco=\"let t\">\n <div class=\"top\" *ngIf=\"!hideHeader\">\n <div id=\"menu\" class=\"action-bar\">\n <biit-vertical-menu *ngIf=\"actionsTpl\" class=\"vertical-menu\">\n <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n </biit-vertical-menu>\n <div *ngIf=\"actionsTpl\" class=\"horizontal-menu default-menu\">\n <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n </div>\n <div class=\"default-menu\" *ngIf=\"!actionsTpl\">\n <ng-content></ng-content>\n </div>\n </div>\n <div id=\"options\" class=\"options\">\n <biit-input-text id=\"search\" #searchInput\n [ngModel]=\"search\"\n (onActionPerformed)=\"\n onFilter($event, true);\n \"\n (ngModelChange)=\"onFilter($event)\"\n (focusout)=\"searchInput.value = search\"\n icon=\"search\"\n [placeholder]=\"t('t.search')\"\n ></biit-input-text>\n <biit-multiselect id=\"column-selector\" [ngModel]=\"_columns\"\n (ngModelChange)=\"setColumnVisibility($event)\"\n [data]=\"allColumns\"\n label=\"name\"\n value=\"visible\"\n [type]=\"BiitMultiselectType.ICON\"\n [title]=\"t('t.column-selector')\"\n [compact]=\"true\"\n ></biit-multiselect>\n </div>\n </div>\n <div id=\"content\" class=\"table\">\n <biit-progress-bar *ngIf=\"loading\"></biit-progress-bar>\n <ng-container *ngIf=\"!serverSide\">\n <ngx-datatable #table\n [rows]=\"data\"\n [columns]=\"_columns\"\n [columnMode]=\"'force'\"\n [headerHeight]=\"42\"\n [footerHeight]=\"hideFooter ? 0 : 34\"\n [rowHeight]=\"'auto'\"\n [reorderable]=\"false\"\n [selectionType]=\"SelectionType.checkbox\"\n [selected]=\"selected\"\n (select)=\"onSelect($event)\"\n (activate)=\"onActivate($event)\"\n [virtualization]=\"false\"\n [scrollbarVDynamic]=\"true\"\n [limit]=\"pageSize\"\n [scrollbarH]=\"scrollbarH\"\n [messages]=\"{emptyMessage: t('t.empty-message')}\"\n >\n <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n #chkbox\n [width]=\"42\"\n [sortable]=\"false\"\n [canAutoResize]=\"false\"\n [draggable]=\"false\"\n [resizeable]=\"false\"\n [name]=\"'chkbox'\"\n >\n <ng-template\n ngx-datatable-header-template\n let-value=\"value\"\n let-allRowsSelected=\"allRowsSelected\"\n let-selectFn=\"selectFn\"\n >\n <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n </ng-template>\n <ng-template\n ngx-datatable-cell-template\n let-value=\"value\"\n let-isSelected=\"isSelected\"\n let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n >\n <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n </ng-template>\n </ngx-datatable-column>\n\n <ngx-datatable-column *ngFor=\"let column of _columns\"\n [name]=\"column.name\"\n [prop]=\"column.prop\"\n [checkboxable]=\"column.checkboxable\"\n [frozenLeft]=\"column.frozenLeft\"\n [frozenRight]=\"column.frozenRight\"\n [flexGrow]=\"column.flexGrow\"\n [minWidth]=\"column.minWidth\"\n [maxWidth]=\"column.maxWidth\"\n [width]=\"column.width\"\n [resizeable]=\"column.resizeable\"\n [comparator]=\"column.comparator\"\n [pipe]=\"column.pipe\"\n [sortable]=\"column.sortable\"\n [draggable]=\"column.draggable\"\n [canAutoResize]=\"column.canAutoResize\"\n [cellTemplate]=\"column.cellTemplate\"\n [ghostCellTemplate]=\"column.ghostCellTemplate\"\n [treeToggleTemplate]=\"column.treeToggleTemplate\"\n [cellClass]=\"column.cellClass\"\n [headerTemplate]=\"column.headerTemplate\"\n [headerClass]=\"column.headerClass\"\n [headerCheckboxable]=\"column.headerCheckboxable\"\n [isTreeColumn]=\"column.isTreeColumn\"\n [treeLevelIndent]=\"column.treeLevelIndent\"\n [summaryFunc]=\"column.summaryFunc\"\n [summaryTemplate]=\"column.summaryTemplate\"\n ></ngx-datatable-column>\n\n <ngx-datatable-footer id=\"datatable-footer\">\n <ng-template\n ngx-datatable-footer-template\n let-rowCount=\"rowCount\"\n let-pageSizeCurrent=\"pageSize\"\n let-selectedCount=\"selectedCount\"\n let-curPage=\"curPage\"\n let-offset=\"offset\"\n >\n <div class=\"label\">\n <span>{{ t('t.total') }}: </span><span id=\"total-number-of-items\">{{rowCount}}</span>\n <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: </span><span *ngIf=\"selectedCount\" id=\"number-of-items-selected\">{{selectedCount}}</span>\n </div>\n <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n <biit-datatable-pager #pager\n [page]=\"curPage\"\n [size]=\"pageSizeCurrent\"\n [count]=\"rowCount\"\n [hidden]=\"!((rowCount / pageSize) > 1)\"\n (change)=\"table.onFooterPage($event)\">\n </biit-datatable-pager>\n </div>\n <div class=\"page-items\" *ngIf=\"pageSizeList\">\n <div *ngIf=\"pageSizeList?.length\">\n <span>{{ t('t.rows-per-page') }}:</span>\n <select [(ngModel)]=\"pageSize\"\n (ngModelChange)=\"pager.size = $event\">\n <option *ngFor=\"let size of pageSizeList\"\n [ngValue]=\"size\"\n >\n {{size}}\n </option>\n </select>\n </div>\n </div>\n </ng-template>\n </ngx-datatable-footer>\n </ngx-datatable>\n </ng-container>\n\n <ng-container *ngIf=\"serverSide\">\n <ngx-datatable #table\n [rows]=\"data\"\n [columns]=\"_columns\"\n [columnMode]=\"'force'\"\n [headerHeight]=\"42\"\n [footerHeight]=\"hideFooter ? 0 : 34\"\n [rowHeight]=\"'auto'\"\n [reorderable]=\"false\"\n [selectionType]=\"SelectionType.checkbox\"\n [selected]=\"selected\"\n (select)=\"onSelect($event)\"\n (activate)=\"onActivate($event)\"\n [virtualization]=\"false\"\n [scrollbarVDynamic]=\"true\"\n [scrollbarH]=\"scrollbarH\"\n [messages]=\"{emptyMessage: t('t.empty-message')}\"\n [externalPaging]=\"true\"\n [count]=\"page.totalElements\"\n [offset]=\"page.pageNumber\"\n [limit]=\"page.pageSize\"\n (page)=\"onFooterPageChange($event)\"\n >\n <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n #chkbox\n [width]=\"42\"\n [sortable]=\"false\"\n [canAutoResize]=\"false\"\n [draggable]=\"false\"\n [resizeable]=\"false\"\n [name]=\"'chkbox'\"\n >\n <ng-template\n ngx-datatable-header-template\n let-value=\"value\"\n let-allRowsSelected=\"allRowsSelected\"\n let-selectFn=\"selectFn\"\n >\n <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n </ng-template>\n <ng-template\n ngx-datatable-cell-template\n let-value=\"value\"\n let-isSelected=\"isSelected\"\n let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n >\n <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n </ng-template>\n </ngx-datatable-column>\n\n <ngx-datatable-column *ngFor=\"let column of _columns\"\n [name]=\"column.name\"\n [prop]=\"column.prop\"\n [checkboxable]=\"column.checkboxable\"\n [frozenLeft]=\"column.frozenLeft\"\n [frozenRight]=\"column.frozenRight\"\n [flexGrow]=\"column.flexGrow\"\n [minWidth]=\"column.minWidth\"\n [maxWidth]=\"column.maxWidth\"\n [width]=\"column.width\"\n [resizeable]=\"column.resizeable\"\n [comparator]=\"column.comparator\"\n [pipe]=\"column.pipe\"\n [sortable]=\"column.sortable\"\n [draggable]=\"column.draggable\"\n [canAutoResize]=\"column.canAutoResize\"\n [cellTemplate]=\"column.cellTemplate\"\n [ghostCellTemplate]=\"column.ghostCellTemplate\"\n [treeToggleTemplate]=\"column.treeToggleTemplate\"\n [cellClass]=\"column.cellClass\"\n [headerTemplate]=\"column.headerTemplate\"\n [headerClass]=\"column.headerClass\"\n [headerCheckboxable]=\"column.headerCheckboxable\"\n [isTreeColumn]=\"column.isTreeColumn\"\n [treeLevelIndent]=\"column.treeLevelIndent\"\n [summaryFunc]=\"column.summaryFunc\"\n [summaryTemplate]=\"column.summaryTemplate\"\n ></ngx-datatable-column>\n\n <ngx-datatable-footer>\n <ng-template\n ngx-datatable-footer-template\n let-rowCount=\"rowCount\"\n let-pageSizeCurrent=\"pageSize\"\n let-selectedCount=\"selectedCount\"\n let-curPage=\"curPage\"\n let-offset=\"offset\"\n >\n <div class=\"label\" id=\"total-elements\">\n <span>{{ t('t.total') }}: {{rowCount}}</span>\n <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: {{selectedCount}}</span>\n </div>\n <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n <biit-datatable-pager #pager\n [page]=\"curPage\"\n [size]=\"pageSizeCurrent\"\n [count]=\"rowCount\"\n [hidden]=\"!((rowCount / pageSize) > 1)\"\n (change)=\"table.onFooterPage($event)\">\n </biit-datatable-pager>\n </div>\n <div class=\"page-items\" *ngIf=\"pageSizeList\">\n <div *ngIf=\"pageSizeList?.length\">\n <span>{{ t('t.rows-per-page') }}:</span>\n <select [(ngModel)]=\"pageSize\"\n (ngModelChange)=\"pager.size = $event\">\n <option *ngFor=\"let size of pageSizeList\"\n [ngValue]=\"size\"\n >\n {{size}}\n </option>\n </select>\n </div>\n </div>\n </ng-template>\n </ngx-datatable-footer>\n </ngx-datatable>\n </ng-container>\n </div>\n</div>\n", styles: [".table-canvas{height:100%;display:flex;flex-direction:column;gap:14px;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .top{display:flex;flex:0}.table-canvas .top .action-bar{display:flex;flex:1}.table-canvas .top .options{display:flex;flex:0}.table-canvas .table{position:relative;flex:1;min-height:0;min-width:0}.table-canvas .table biit-progress-bar{position:absolute;z-index:1;left:0;right:3px;top:42px}.table-canvas .table ::ng-deep ngx-datatable{height:100%;position:absolute;inset:0}.table-canvas .table ::ng-deep ngx-datatable>div{height:calc(100% - 42px)}.table-canvas .table ::ng-deep ngx-datatable>div>div{height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner{height:inherit}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap{height:100%!important;width:calc(100% - 3px);display:flex;align-items:center;justify-content:center;background:var(--table-header-color);color:var(--table-header-text)}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap span{color:var(--table-text-color);font-size:16px;line-height:100%;font-weight:700;text-transform:uppercase}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap .sort-btn{position:absolute;right:14px}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap:has(biit-checkbox){background:var(--chart-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-body{height:100%!important;overflow-y:auto!important}.table-canvas .table ::ng-deep ngx-datatable datatable-body .empty-row{height:100%;display:flex;align-items:center;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row .datatable-body-cell-label{display:flex;align-items:center;min-height:42px;border-bottom:3px solid var(--table-header-color);width:calc(100% - 3px);padding:9px 14px;line-height:120%;height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row:hover .datatable-body-cell-label{background:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row.active .datatable-body-cell-label{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer{position:absolute;bottom:0;background:var(--chart-background);z-index:10}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .label{flex:1 0}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination{display:flex;margin:auto;flex:0;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination biit-datatable-pager{flex:none!important}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items{flex:1 0;display:flex;justify-content:flex-end;align-items:center;color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select{appearance:none;border:none;height:34px;min-width:34px;padding:8px 14px;text-align:end;font-size:14px;font-family:Montserrat,serif;cursor:pointer;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:focus-visible{outline:none;background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:hover{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select *{background:var(--chart-background);padding:5px}.table-canvas .table ::ng-deep ngx-datatable:has(datatable-footer) datatable-body{height:calc(100% - 48px)!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper{height:unset!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper .datatable-row-detail{height:unset!important}.default-menu{display:flex;flex-direction:row}@media screen and (max-width: 600px){.page-items,.page-size-selector,.horizontal-menu{display:none!important}}@media screen and (min-width: 601px){.vertical-menu{display:none!important}}\n"], dependencies: [{ kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.BiitCheckboxComponent, selector: "biit-checkbox", inputs: ["disabled", "description", "showAlwaysDescription"], outputs: ["onValueChange"] }, { kind: "component", type: i5.BiitDatatablePagerComponent, selector: "biit-datatable-pager" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarVDynamic", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "ghostLoadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "disableRowCheck", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction"] }, { kind: "directive", type: i6.DataTableColumnDirective, selector: "ngx-datatable-column", inputs: ["name", "prop", "frozenLeft", "frozenRight", "flexGrow", "resizeable", "comparator", "pipe", "sortable", "draggable", "canAutoResize", "minWidth", "width", "maxWidth", "checkboxable", "headerCheckboxable", "headerClass", "cellClass", "isTreeColumn", "treeLevelIndent", "summaryFunc", "summaryTemplate", "cellTemplate", "headerTemplate", "treeToggleTemplate", "ghostCellTemplate"] }, { kind: "directive", type: i6.DataTableColumnHeaderDirective, selector: "[ngx-datatable-header-template]" }, { kind: "directive", type: i6.DataTableColumnCellDirective, selector: "[ngx-datatable-cell-template]" }, { kind: "directive", type: i6.DataTableFooterTemplateDirective, selector: "[ngx-datatable-footer-template]" }, { kind: "directive", type: i6.DatatableFooterDirective, selector: "ngx-datatable-footer", inputs: ["footerHeight", "totalMessage", "selectedMessage", "pagerLeftArrowIcon", "pagerRightArrowIcon", "pagerPreviousIcon", "pagerNextIcon", "template"] }, { kind: "component", type: i7.BiitProgressBarComponent, selector: "biit-progress-bar", inputs: ["type", "_value", "value"] }, { kind: "component", type: i4.BiitMultiselectComponent, selector: "biit-multiselect", inputs: ["title", "type", "icon", "label", "value", "descriptionField", "description", "data", "primitive", "compact", "disabled", "required", "sort-asc", "sort-desc"], outputs: ["onCreate"] }, { kind: "directive", type: i8.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: i4.BiitInputTextComponent, selector: "biit-input-text", inputs: ["placeholder", "error", "description", "info", "type", "icon", "fieldName", "disabled", "required", "readonly", "min", "max", "minLength", "maxLength", "regEx"], outputs: ["onActionPerformed"] }, { kind: "component", type: i9.BiitVerticalMenuComponent, selector: "biit-vertical-menu" }] });
100
100
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitDatatableComponent, decorators: [{
101
101
  type: Component,
102
- args: [{ selector: 'biit-datatable', providers: [provideTranslocoScope({ scope: 'wizardry-theme/table', alias: 't' })], template: "<div id=\"biit-table\" class=\"table-canvas\" *transloco=\"let t\">\n <div class=\"top\" *ngIf=\"!hideHeader\">\n <div id=\"menu\" class=\"action-bar\">\n <biit-vertical-menu *ngIf=\"actionsTpl\" class=\"vertical-menu\">\n <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n </biit-vertical-menu>\n <div *ngIf=\"actionsTpl\" class=\"horizontal-menu default-menu\">\n <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n </div>\n <div class=\"default-menu\" *ngIf=\"!actionsTpl\">\n <ng-content></ng-content>\n </div>\n </div>\n <div id=\"options\" class=\"options\">\n <biit-input-text id=\"search\" #searchInput\n [ngModel]=\"search\"\n (onActionPerformed)=\"\n onFilter($event, true);\n \"\n (ngModelChange)=\"onFilter($event)\"\n (focusout)=\"searchInput.value = search\"\n icon=\"search\"\n [placeholder]=\"t('t.search')\"\n ></biit-input-text>\n <biit-multiselect id=\"column-selector\" [ngModel]=\"_columns\"\n (ngModelChange)=\"setColumnVisibility($event)\"\n [data]=\"allColumns\"\n label=\"name\"\n value=\"visible\"\n [type]=\"BiitMultiselectType.ICON\"\n [title]=\"t('t.column-selector')\"\n [compact]=\"true\"\n ></biit-multiselect>\n </div>\n </div>\n <div id=\"content\" class=\"table\">\n <biit-progress-bar *ngIf=\"loading\"></biit-progress-bar>\n <ng-container *ngIf=\"!serverSide\">\n <ngx-datatable #table\n [rows]=\"data\"\n [columns]=\"_columns\"\n [columnMode]=\"'force'\"\n [headerHeight]=\"42\"\n [footerHeight]=\"hideFooter ? 0 : 34\"\n [rowHeight]=\"'auto'\"\n [reorderable]=\"false\"\n [selectionType]=\"SelectionType.checkbox\"\n [selected]=\"selected\"\n (select)=\"onSelect($event)\"\n (activate)=\"onActivate($event)\"\n [virtualization]=\"false\"\n [scrollbarVDynamic]=\"true\"\n [limit]=\"pageSize\"\n [scrollbarH]=\"scrollbarH\"\n [messages]=\"{emptyMessage: t('t.empty-message')}\"\n >\n <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n #chkbox\n [width]=\"42\"\n [sortable]=\"false\"\n [canAutoResize]=\"false\"\n [draggable]=\"false\"\n [resizeable]=\"false\"\n [name]=\"'chkbox'\"\n >\n <ng-template\n ngx-datatable-header-template\n let-value=\"value\"\n let-allRowsSelected=\"allRowsSelected\"\n let-selectFn=\"selectFn\"\n >\n <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n </ng-template>\n <ng-template\n ngx-datatable-cell-template\n let-value=\"value\"\n let-isSelected=\"isSelected\"\n let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n >\n <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n </ng-template>\n </ngx-datatable-column>\n\n <ngx-datatable-column *ngFor=\"let column of _columns\"\n [name]=\"column.name\"\n [prop]=\"column.prop\"\n [checkboxable]=\"column.checkboxable\"\n [frozenLeft]=\"column.frozenLeft\"\n [frozenRight]=\"column.frozenRight\"\n [flexGrow]=\"column.flexGrow\"\n [minWidth]=\"column.minWidth\"\n [maxWidth]=\"column.maxWidth\"\n [width]=\"column.width\"\n [resizeable]=\"column.resizeable\"\n [comparator]=\"column.comparator\"\n [pipe]=\"column.pipe\"\n [sortable]=\"column.sortable\"\n [draggable]=\"column.draggable\"\n [canAutoResize]=\"column.canAutoResize\"\n [cellTemplate]=\"column.cellTemplate\"\n [ghostCellTemplate]=\"column.ghostCellTemplate\"\n [treeToggleTemplate]=\"column.treeToggleTemplate\"\n [cellClass]=\"column.cellClass\"\n [headerTemplate]=\"column.headerTemplate\"\n [headerClass]=\"column.headerClass\"\n [headerCheckboxable]=\"column.headerCheckboxable\"\n [isTreeColumn]=\"column.isTreeColumn\"\n [treeLevelIndent]=\"column.treeLevelIndent\"\n [summaryFunc]=\"column.summaryFunc\"\n [summaryTemplate]=\"column.summaryTemplate\"\n ></ngx-datatable-column>\n\n <ngx-datatable-footer id=\"datatable-footer\">\n <ng-template\n ngx-datatable-footer-template\n let-rowCount=\"rowCount\"\n let-pageSizeCurrent=\"pageSize\"\n let-selectedCount=\"selectedCount\"\n let-curPage=\"curPage\"\n let-offset=\"offset\"\n >\n <div class=\"label\">\n <span>{{ t('t.total') }}: </span><span id=\"total-number-of-items\">{{rowCount}}</span>\n <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: </span><span *ngIf=\"selectedCount\" id=\"number-of-items-selected\">{{selectedCount}}</span>\n </div>\n <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n <biit-datatable-pager #pager\n [page]=\"curPage\"\n [size]=\"pageSizeCurrent\"\n [count]=\"rowCount\"\n [hidden]=\"!((rowCount / pageSize) > 1)\"\n (change)=\"table.onFooterPage($event)\">\n </biit-datatable-pager>\n </div>\n <div class=\"page-items\" *ngIf=\"pageSizeList\">\n <div *ngIf=\"pageSizeList?.length\">\n <span>{{ t('t.rows-per-page') }}:</span>\n <select [(ngModel)]=\"pageSize\"\n (ngModelChange)=\"pager.size = $event\">\n <option *ngFor=\"let size of pageSizeList\"\n [ngValue]=\"size\"\n >\n {{size}}\n </option>\n </select>\n </div>\n </div>\n </ng-template>\n </ngx-datatable-footer>\n </ngx-datatable>\n </ng-container>\n\n <ng-container *ngIf=\"serverSide\">\n <ngx-datatable #table\n [rows]=\"data\"\n [columns]=\"_columns\"\n [columnMode]=\"'force'\"\n [headerHeight]=\"42\"\n [footerHeight]=\"hideFooter ? 0 : 34\"\n [rowHeight]=\"'auto'\"\n [reorderable]=\"false\"\n [selectionType]=\"SelectionType.checkbox\"\n [selected]=\"selected\"\n (select)=\"onSelect($event)\"\n (activate)=\"onActivate($event)\"\n [virtualization]=\"false\"\n [scrollbarVDynamic]=\"true\"\n [scrollbarH]=\"scrollbarH\"\n [messages]=\"{emptyMessage: t('t.empty-message')}\"\n [externalPaging]=\"true\"\n [count]=\"page.totalElements\"\n [offset]=\"page.pageNumber\"\n [limit]=\"page.pageSize\"\n (page)=\"onFooterPageChange($event)\"\n >\n <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n #chkbox\n [width]=\"42\"\n [sortable]=\"false\"\n [canAutoResize]=\"false\"\n [draggable]=\"false\"\n [resizeable]=\"false\"\n [name]=\"'chkbox'\"\n >\n <ng-template\n ngx-datatable-header-template\n let-value=\"value\"\n let-allRowsSelected=\"allRowsSelected\"\n let-selectFn=\"selectFn\"\n >\n <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n </ng-template>\n <ng-template\n ngx-datatable-cell-template\n let-value=\"value\"\n let-isSelected=\"isSelected\"\n let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n >\n <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n </ng-template>\n </ngx-datatable-column>\n\n <ngx-datatable-column *ngFor=\"let column of _columns\"\n [name]=\"column.name\"\n [prop]=\"column.prop\"\n [checkboxable]=\"column.checkboxable\"\n [frozenLeft]=\"column.frozenLeft\"\n [frozenRight]=\"column.frozenRight\"\n [flexGrow]=\"column.flexGrow\"\n [minWidth]=\"column.minWidth\"\n [maxWidth]=\"column.maxWidth\"\n [width]=\"column.width\"\n [resizeable]=\"column.resizeable\"\n [comparator]=\"column.comparator\"\n [pipe]=\"column.pipe\"\n [sortable]=\"column.sortable\"\n [draggable]=\"column.draggable\"\n [canAutoResize]=\"column.canAutoResize\"\n [cellTemplate]=\"column.cellTemplate\"\n [ghostCellTemplate]=\"column.ghostCellTemplate\"\n [treeToggleTemplate]=\"column.treeToggleTemplate\"\n [cellClass]=\"column.cellClass\"\n [headerTemplate]=\"column.headerTemplate\"\n [headerClass]=\"column.headerClass\"\n [headerCheckboxable]=\"column.headerCheckboxable\"\n [isTreeColumn]=\"column.isTreeColumn\"\n [treeLevelIndent]=\"column.treeLevelIndent\"\n [summaryFunc]=\"column.summaryFunc\"\n [summaryTemplate]=\"column.summaryTemplate\"\n ></ngx-datatable-column>\n\n <ngx-datatable-footer>\n <ng-template\n ngx-datatable-footer-template\n let-rowCount=\"rowCount\"\n let-pageSizeCurrent=\"pageSize\"\n let-selectedCount=\"selectedCount\"\n let-curPage=\"curPage\"\n let-offset=\"offset\"\n >\n <div class=\"label\" id=\"total-elements\">\n <span>{{ t('t.total') }}: {{rowCount}}</span>\n <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: {{selectedCount}}</span>\n </div>\n <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n <biit-datatable-pager #pager\n [page]=\"curPage\"\n [size]=\"pageSizeCurrent\"\n [count]=\"rowCount\"\n [hidden]=\"!((rowCount / pageSize) > 1)\"\n (change)=\"table.onFooterPage($event)\">\n </biit-datatable-pager>\n </div>\n <div class=\"page-items\" *ngIf=\"pageSizeList\">\n <div *ngIf=\"pageSizeList?.length\">\n <span>{{ t('t.rows-per-page') }}:</span>\n <select [(ngModel)]=\"pageSize\"\n (ngModelChange)=\"pager.size = $event\">\n <option *ngFor=\"let size of pageSizeList\"\n [ngValue]=\"size\"\n >\n {{size}}\n </option>\n </select>\n </div>\n </div>\n </ng-template>\n </ngx-datatable-footer>\n </ngx-datatable>\n </ng-container>\n </div>\n</div>\n", styles: [".table-canvas{height:100%;display:flex;flex-direction:column;gap:14px;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .top{display:flex;flex:0}.table-canvas .top .action-bar{display:flex;flex:1}.table-canvas .top .options{display:flex;flex:0}.table-canvas .table{position:relative;flex:1;min-height:0;min-width:0}.table-canvas .table biit-progress-bar{position:absolute;z-index:1;left:0;right:3px;top:42px}.table-canvas .table ::ng-deep ngx-datatable{height:100%;position:absolute;inset:0}.table-canvas .table ::ng-deep ngx-datatable>div{height:calc(100% - 42px)}.table-canvas .table ::ng-deep ngx-datatable>div>div{height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner{height:inherit}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap{height:100%!important;width:calc(100% - 3px);display:flex;align-items:center;justify-content:center;background:var(--table-header-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap span{color:var(--table-text-color);font-size:16px;line-height:100%;font-weight:700;text-transform:uppercase}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap .sort-btn{position:absolute;right:14px}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap:has(biit-checkbox){background:var(--chart-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-body{height:100%!important;overflow-y:auto!important}.table-canvas .table ::ng-deep ngx-datatable datatable-body .empty-row{height:100%;display:flex;align-items:center;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row .datatable-body-cell-label{display:flex;align-items:center;min-height:42px;border-bottom:3px solid var(--table-header-color);width:calc(100% - 3px);padding:9px 14px;line-height:120%;height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row:hover .datatable-body-cell-label{background:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row.active .datatable-body-cell-label{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer{position:absolute;bottom:0;background:var(--chart-background);z-index:10}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .label{flex:1 0}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination{display:flex;margin:auto;flex:0;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination biit-datatable-pager{flex:none!important}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items{flex:1 0;display:flex;justify-content:flex-end;align-items:center;color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select{appearance:none;border:none;height:34px;min-width:34px;padding:8px 14px;text-align:end;font-size:14px;font-family:Montserrat,serif;cursor:pointer;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:focus-visible{outline:none;background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:hover{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select *{background:var(--chart-background);padding:5px}.table-canvas .table ::ng-deep ngx-datatable:has(datatable-footer) datatable-body{height:calc(100% - 48px)!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper{height:unset!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper .datatable-row-detail{height:unset!important}.default-menu{display:flex;flex-direction:row}@media screen and (max-width: 600px){.page-items,.page-size-selector,.horizontal-menu{display:none!important}}@media screen and (min-width: 601px){.vertical-menu{display:none!important}}\n"] }]
102
+ args: [{ selector: 'biit-datatable', providers: [provideTranslocoScope({ scope: 'wizardry-theme/table', alias: 't' })], template: "<div id=\"biit-table\" class=\"table-canvas\" *transloco=\"let t\">\n <div class=\"top\" *ngIf=\"!hideHeader\">\n <div id=\"menu\" class=\"action-bar\">\n <biit-vertical-menu *ngIf=\"actionsTpl\" class=\"vertical-menu\">\n <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n </biit-vertical-menu>\n <div *ngIf=\"actionsTpl\" class=\"horizontal-menu default-menu\">\n <ng-container *ngTemplateOutlet=\"actionsTpl\"></ng-container>\n </div>\n <div class=\"default-menu\" *ngIf=\"!actionsTpl\">\n <ng-content></ng-content>\n </div>\n </div>\n <div id=\"options\" class=\"options\">\n <biit-input-text id=\"search\" #searchInput\n [ngModel]=\"search\"\n (onActionPerformed)=\"\n onFilter($event, true);\n \"\n (ngModelChange)=\"onFilter($event)\"\n (focusout)=\"searchInput.value = search\"\n icon=\"search\"\n [placeholder]=\"t('t.search')\"\n ></biit-input-text>\n <biit-multiselect id=\"column-selector\" [ngModel]=\"_columns\"\n (ngModelChange)=\"setColumnVisibility($event)\"\n [data]=\"allColumns\"\n label=\"name\"\n value=\"visible\"\n [type]=\"BiitMultiselectType.ICON\"\n [title]=\"t('t.column-selector')\"\n [compact]=\"true\"\n ></biit-multiselect>\n </div>\n </div>\n <div id=\"content\" class=\"table\">\n <biit-progress-bar *ngIf=\"loading\"></biit-progress-bar>\n <ng-container *ngIf=\"!serverSide\">\n <ngx-datatable #table\n [rows]=\"data\"\n [columns]=\"_columns\"\n [columnMode]=\"'force'\"\n [headerHeight]=\"42\"\n [footerHeight]=\"hideFooter ? 0 : 34\"\n [rowHeight]=\"'auto'\"\n [reorderable]=\"false\"\n [selectionType]=\"SelectionType.checkbox\"\n [selected]=\"selected\"\n (select)=\"onSelect($event)\"\n (activate)=\"onActivate($event)\"\n [virtualization]=\"false\"\n [scrollbarVDynamic]=\"true\"\n [limit]=\"pageSize\"\n [scrollbarH]=\"scrollbarH\"\n [messages]=\"{emptyMessage: t('t.empty-message')}\"\n >\n <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n #chkbox\n [width]=\"42\"\n [sortable]=\"false\"\n [canAutoResize]=\"false\"\n [draggable]=\"false\"\n [resizeable]=\"false\"\n [name]=\"'chkbox'\"\n >\n <ng-template\n ngx-datatable-header-template\n let-value=\"value\"\n let-allRowsSelected=\"allRowsSelected\"\n let-selectFn=\"selectFn\"\n >\n <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n </ng-template>\n <ng-template\n ngx-datatable-cell-template\n let-value=\"value\"\n let-isSelected=\"isSelected\"\n let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n >\n <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n </ng-template>\n </ngx-datatable-column>\n\n <ngx-datatable-column *ngFor=\"let column of _columns\"\n [name]=\"column.name\"\n [prop]=\"column.prop\"\n [checkboxable]=\"column.checkboxable\"\n [frozenLeft]=\"column.frozenLeft\"\n [frozenRight]=\"column.frozenRight\"\n [flexGrow]=\"column.flexGrow\"\n [minWidth]=\"column.minWidth\"\n [maxWidth]=\"column.maxWidth\"\n [width]=\"column.width\"\n [resizeable]=\"column.resizeable\"\n [comparator]=\"column.comparator\"\n [pipe]=\"column.pipe\"\n [sortable]=\"column.sortable\"\n [draggable]=\"column.draggable\"\n [canAutoResize]=\"column.canAutoResize\"\n [cellTemplate]=\"column.cellTemplate\"\n [ghostCellTemplate]=\"column.ghostCellTemplate\"\n [treeToggleTemplate]=\"column.treeToggleTemplate\"\n [cellClass]=\"column.cellClass\"\n [headerTemplate]=\"column.headerTemplate\"\n [headerClass]=\"column.headerClass\"\n [headerCheckboxable]=\"column.headerCheckboxable\"\n [isTreeColumn]=\"column.isTreeColumn\"\n [treeLevelIndent]=\"column.treeLevelIndent\"\n [summaryFunc]=\"column.summaryFunc\"\n [summaryTemplate]=\"column.summaryTemplate\"\n ></ngx-datatable-column>\n\n <ngx-datatable-footer id=\"datatable-footer\">\n <ng-template\n ngx-datatable-footer-template\n let-rowCount=\"rowCount\"\n let-pageSizeCurrent=\"pageSize\"\n let-selectedCount=\"selectedCount\"\n let-curPage=\"curPage\"\n let-offset=\"offset\"\n >\n <div class=\"label\">\n <span>{{ t('t.total') }}: </span><span id=\"total-number-of-items\">{{rowCount}}</span>\n <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: </span><span *ngIf=\"selectedCount\" id=\"number-of-items-selected\">{{selectedCount}}</span>\n </div>\n <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n <biit-datatable-pager #pager\n [page]=\"curPage\"\n [size]=\"pageSizeCurrent\"\n [count]=\"rowCount\"\n [hidden]=\"!((rowCount / pageSize) > 1)\"\n (change)=\"table.onFooterPage($event)\">\n </biit-datatable-pager>\n </div>\n <div class=\"page-items\" *ngIf=\"pageSizeList\">\n <div *ngIf=\"pageSizeList?.length\">\n <span>{{ t('t.rows-per-page') }}:</span>\n <select [(ngModel)]=\"pageSize\"\n (ngModelChange)=\"pager.size = $event\">\n <option *ngFor=\"let size of pageSizeList\"\n [ngValue]=\"size\"\n >\n {{size}}\n </option>\n </select>\n </div>\n </div>\n </ng-template>\n </ngx-datatable-footer>\n </ngx-datatable>\n </ng-container>\n\n <ng-container *ngIf=\"serverSide\">\n <ngx-datatable #table\n [rows]=\"data\"\n [columns]=\"_columns\"\n [columnMode]=\"'force'\"\n [headerHeight]=\"42\"\n [footerHeight]=\"hideFooter ? 0 : 34\"\n [rowHeight]=\"'auto'\"\n [reorderable]=\"false\"\n [selectionType]=\"SelectionType.checkbox\"\n [selected]=\"selected\"\n (select)=\"onSelect($event)\"\n (activate)=\"onActivate($event)\"\n [virtualization]=\"false\"\n [scrollbarVDynamic]=\"true\"\n [scrollbarH]=\"scrollbarH\"\n [messages]=\"{emptyMessage: t('t.empty-message')}\"\n [externalPaging]=\"true\"\n [count]=\"page.totalElements\"\n [offset]=\"page.pageNumber\"\n [limit]=\"page.pageSize\"\n (page)=\"onFooterPageChange($event)\"\n >\n <ngx-datatable-column *ngIf=\"selectable && !singleSelection\"\n #chkbox\n [width]=\"42\"\n [sortable]=\"false\"\n [canAutoResize]=\"false\"\n [draggable]=\"false\"\n [resizeable]=\"false\"\n [name]=\"'chkbox'\"\n >\n <ng-template\n ngx-datatable-header-template\n let-value=\"value\"\n let-allRowsSelected=\"allRowsSelected\"\n let-selectFn=\"selectFn\"\n >\n <biit-checkbox [ngModel]=\"allRowsSelected\" (ngModelChange)=\"selectFn(!allRowsSelected)\"></biit-checkbox>\n </ng-template>\n <ng-template\n ngx-datatable-cell-template\n let-value=\"value\"\n let-isSelected=\"isSelected\"\n let-onCheckboxChangeFn=\"onCheckboxChangeFn\"\n >\n <biit-checkbox [ngModel]=\"isSelected\" (ngModelChange)=\"onCheckboxChangeFn($event)\"></biit-checkbox>\n </ng-template>\n </ngx-datatable-column>\n\n <ngx-datatable-column *ngFor=\"let column of _columns\"\n [name]=\"column.name\"\n [prop]=\"column.prop\"\n [checkboxable]=\"column.checkboxable\"\n [frozenLeft]=\"column.frozenLeft\"\n [frozenRight]=\"column.frozenRight\"\n [flexGrow]=\"column.flexGrow\"\n [minWidth]=\"column.minWidth\"\n [maxWidth]=\"column.maxWidth\"\n [width]=\"column.width\"\n [resizeable]=\"column.resizeable\"\n [comparator]=\"column.comparator\"\n [pipe]=\"column.pipe\"\n [sortable]=\"column.sortable\"\n [draggable]=\"column.draggable\"\n [canAutoResize]=\"column.canAutoResize\"\n [cellTemplate]=\"column.cellTemplate\"\n [ghostCellTemplate]=\"column.ghostCellTemplate\"\n [treeToggleTemplate]=\"column.treeToggleTemplate\"\n [cellClass]=\"column.cellClass\"\n [headerTemplate]=\"column.headerTemplate\"\n [headerClass]=\"column.headerClass\"\n [headerCheckboxable]=\"column.headerCheckboxable\"\n [isTreeColumn]=\"column.isTreeColumn\"\n [treeLevelIndent]=\"column.treeLevelIndent\"\n [summaryFunc]=\"column.summaryFunc\"\n [summaryTemplate]=\"column.summaryTemplate\"\n ></ngx-datatable-column>\n\n <ngx-datatable-footer>\n <ng-template\n ngx-datatable-footer-template\n let-rowCount=\"rowCount\"\n let-pageSizeCurrent=\"pageSize\"\n let-selectedCount=\"selectedCount\"\n let-curPage=\"curPage\"\n let-offset=\"offset\"\n >\n <div class=\"label\" id=\"total-elements\">\n <span>{{ t('t.total') }}: {{rowCount}}</span>\n <span *ngIf=\"selectedCount\">&nbsp;&nbsp;|&nbsp;&nbsp;{{ t('t.selected') }}: {{selectedCount}}</span>\n </div>\n <div class=\"pagination\" [style.display]=\"!((rowCount / pageSize) > 1) ? 'none' : null\">\n <biit-datatable-pager #pager\n [page]=\"curPage\"\n [size]=\"pageSizeCurrent\"\n [count]=\"rowCount\"\n [hidden]=\"!((rowCount / pageSize) > 1)\"\n (change)=\"table.onFooterPage($event)\">\n </biit-datatable-pager>\n </div>\n <div class=\"page-items\" *ngIf=\"pageSizeList\">\n <div *ngIf=\"pageSizeList?.length\">\n <span>{{ t('t.rows-per-page') }}:</span>\n <select [(ngModel)]=\"pageSize\"\n (ngModelChange)=\"pager.size = $event\">\n <option *ngFor=\"let size of pageSizeList\"\n [ngValue]=\"size\"\n >\n {{size}}\n </option>\n </select>\n </div>\n </div>\n </ng-template>\n </ngx-datatable-footer>\n </ngx-datatable>\n </ng-container>\n </div>\n</div>\n", styles: [".table-canvas{height:100%;display:flex;flex-direction:column;gap:14px;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .top{display:flex;flex:0}.table-canvas .top .action-bar{display:flex;flex:1}.table-canvas .top .options{display:flex;flex:0}.table-canvas .table{position:relative;flex:1;min-height:0;min-width:0}.table-canvas .table biit-progress-bar{position:absolute;z-index:1;left:0;right:3px;top:42px}.table-canvas .table ::ng-deep ngx-datatable{height:100%;position:absolute;inset:0}.table-canvas .table ::ng-deep ngx-datatable>div{height:calc(100% - 42px)}.table-canvas .table ::ng-deep ngx-datatable>div>div{height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner{height:inherit}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap{height:100%!important;width:calc(100% - 3px);display:flex;align-items:center;justify-content:center;background:var(--table-header-color);color:var(--table-header-text)}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap span{color:var(--table-text-color);font-size:16px;line-height:100%;font-weight:700;text-transform:uppercase}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap .sort-btn{position:absolute;right:14px}.table-canvas .table ::ng-deep ngx-datatable datatable-header .datatable-header-inner .datatable-header-cell-template-wrap:has(biit-checkbox){background:var(--chart-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-body{height:100%!important;overflow-y:auto!important}.table-canvas .table ::ng-deep ngx-datatable datatable-body .empty-row{height:100%;display:flex;align-items:center;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row .datatable-body-cell-label{display:flex;align-items:center;min-height:42px;border-bottom:3px solid var(--table-header-color);width:calc(100% - 3px);padding:9px 14px;line-height:120%;height:100%}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row:hover .datatable-body-cell-label{background:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-body datatable-body-row.active .datatable-body-cell-label{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer{position:absolute;bottom:0;background:var(--chart-background);z-index:10}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .label{flex:1 0}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination{display:flex;margin:auto;flex:0;justify-content:center}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .pagination biit-datatable-pager{flex:none!important}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items{flex:1 0;display:flex;justify-content:flex-end;align-items:center;color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select{appearance:none;border:none;height:34px;min-width:34px;padding:8px 14px;text-align:end;font-size:14px;font-family:Montserrat,serif;cursor:pointer;background:var(--chart-background);color:var(--table-text-color)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:focus-visible{outline:none;background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select:hover{background:var(--main-background)}.table-canvas .table ::ng-deep ngx-datatable datatable-footer .datatable-footer-inner .page-items select *{background:var(--chart-background);padding:5px}.table-canvas .table ::ng-deep ngx-datatable:has(datatable-footer) datatable-body{height:calc(100% - 48px)!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper{height:unset!important}::ng-deep ngx-datatable .auto-details-height .datatable-row-wrapper .datatable-row-detail{height:unset!important}.default-menu{display:flex;flex-direction:row}@media screen and (max-width: 600px){.page-items,.page-size-selector,.horizontal-menu{display:none!important}}@media screen and (min-width: 601px){.vertical-menu{display:none!important}}\n"] }]
103
103
  }], ctorParameters: function () { return [{ type: i1.BiitIconService }]; }, propDecorators: { table: [{
104
104
  type: ViewChild,
105
105
  args: ['table']
package/fesm2015/biit-solutions-wizardry-theme-button.mjs CHANGED
@@ -198,10 +198,10 @@ class BiitActionButtonComponent {
198
198
  }
199
199
  }
200
200
  BiitActionButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitActionButtonComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
201
- BiitActionButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitActionButtonComponent, selector: "biit-action-button", inputs: { position: "position", additionalX: "additionalX", additionalY: "additionalY" }, queries: [{ propertyName: "inputButtons", predicate: BiitIconButtonComponent }], ngImport: i0, template: "<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n <ng-content></ng-content>\n</div>\n", styles: [":root{--main-color: #F20D5E;--popup-background-color: rgba(0, 0, 0, .15);--main-background: #D9D9D9;--body-background: #EDEDED;--light-background: #D7D7D7;--error-color: #A1093F;--warning-color: var(--main-color);--floating-background: white;--main-font-color: white;--secondary-color: #808080;--secondary-text-color: #EDEDED;--secondary-background-color: #808080;--disabled-primary-color: #808080;--disabled-secondary-color: var(--main-color);--component-color: #262626;--active-color: var(--component-color);--hover-color: #EDEDED;--hover-primary-color: var(--main-color);--secondary-button-color: var(--component-color);--secondary-button-background-color: var(--main-font-color);--secondary-button-hover-background: var(--main-background);--secondary-button-active-background: var(--main-background);--quaternary-button-color: var(--main-font-color);--quaternary-button-background-color: var(--error-color);--quaternary-button-hover-background: var(--main-color);--quaternary-button-active-background: var(--main-color);--text-hover-color: #5A6473;--selected-color: #FBAEC9;--chart-background: #FFFFFF;--chart-component-color: var(--component-color);--icon-color: var(--main-color);--table-header-color: var(--component-color);--table-border-color: var(--table-header-color);--table-selected-row-color: var(--main-background);--table-text-color: var(--secondary-text-color);--scrollbar-color: var(--main-color);--menu-button-active: var(--main-color);--disabled-menu-color: #D9D9D9;--disabled-menu-color-hover: #FFFFFF;--nav-menu-hover-color: #70757e;--nav-menu-text-hover-color: var(--text-hover-color);--nav-menu-active-background: var(--hover-color);--nav-menu-disable-font: var(--hover-color);--nav-menu-separator-color: var(--secondary-color);--nav-menu-font-color: var(--nav-menu-hover-color);--nav-menu-font-disabled-color: #8a909a;--nav-menu-background-color: #FFFFFF;--nav-menu-border-color: rgba(0, 0, 0, .18)}.floating-action-button{box-sizing:border-box;position:fixed;z-index:999;opacity:50%;background:white;border:3px solid var(--component-color);display:flex;flex-direction:column;justify-content:flex-end}.floating-action-button:hover{opacity:100%}.floating-action-button:hover ::ng-deep button:not(:first-child){display:flex}.floating-action-button ::ng-deep button:not(:first-child){display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
201
+ BiitActionButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: BiitActionButtonComponent, selector: "biit-action-button", inputs: { position: "position", additionalX: "additionalX", additionalY: "additionalY" }, queries: [{ propertyName: "inputButtons", predicate: BiitIconButtonComponent }], ngImport: i0, template: "<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n <ng-content></ng-content>\n</div>\n", styles: [":root{--main-color: #F20D5E;--popup-background-color: rgba(0, 0, 0, .15);--main-background: #D9D9D9;--body-background: #EDEDED;--light-background: #D7D7D7;--error-color: #A1093F;--warning-color: var(--main-color);--floating-background: white;--main-font-color: white;--secondary-color: #808080;--secondary-text-color: #EDEDED;--secondary-background-color: #808080;--disabled-primary-color: #808080;--disabled-secondary-color: var(--main-color);--component-color: #262626;--active-color: var(--component-color);--hover-color: #EDEDED;--hover-primary-color: var(--main-color);--secondary-button-color: var(--component-color);--secondary-button-background-color: var(--main-font-color);--secondary-button-hover-background: var(--main-background);--secondary-button-active-background: var(--main-background);--quaternary-button-color: var(--main-font-color);--quaternary-button-background-color: var(--error-color);--quaternary-button-hover-background: var(--main-color);--quaternary-button-active-background: var(--main-color);--text-hover-color: #5A6473;--selected-color: #FBAEC9;--chart-background: #FFFFFF;--chart-component-color: var(--component-color);--icon-color: var(--main-color);--table-header-color: var(--component-color);--table-header-text: var(--main-background);--table-border-color: var(--table-header-color);--table-selected-row-color: var(--main-background);--table-text-color: var(--secondary-text-color);--scrollbar-color: var(--main-color);--menu-button-active: var(--main-color);--disabled-menu-color: #D9D9D9;--disabled-menu-color-hover: #FFFFFF;--nav-menu-hover-color: #70757e;--nav-menu-text-hover-color: var(--text-hover-color);--nav-menu-active-background: var(--hover-color);--nav-menu-disable-font: var(--hover-color);--nav-menu-separator-color: var(--secondary-color);--nav-menu-font-color: var(--nav-menu-hover-color);--nav-menu-font-disabled-color: #8a909a;--nav-menu-background-color: #FFFFFF;--nav-menu-active-color: var(--hover-color);--nav-menu-border-color: rgba(0, 0, 0, .18);--input-text-background: var(--main-background);--input-text-focus-background: var(--main-background);--input-text-hover-background: var(--main-background);--popup-color: var(--component-color);--popup-background: #FFFFFF;--popup-error-color: var(--error-color)}.floating-action-button{box-sizing:border-box;position:fixed;z-index:999;opacity:50%;background:white;border:3px solid var(--component-color);display:flex;flex-direction:column;justify-content:flex-end}.floating-action-button:hover{opacity:100%}.floating-action-button:hover ::ng-deep button:not(:first-child){display:flex}.floating-action-button ::ng-deep button:not(:first-child){display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
202
202
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitActionButtonComponent, decorators: [{
203
203
  type: Component,
204
- args: [{ selector: 'biit-action-button', template: "<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n <ng-content></ng-content>\n</div>\n", styles: [":root{--main-color: #F20D5E;--popup-background-color: rgba(0, 0, 0, .15);--main-background: #D9D9D9;--body-background: #EDEDED;--light-background: #D7D7D7;--error-color: #A1093F;--warning-color: var(--main-color);--floating-background: white;--main-font-color: white;--secondary-color: #808080;--secondary-text-color: #EDEDED;--secondary-background-color: #808080;--disabled-primary-color: #808080;--disabled-secondary-color: var(--main-color);--component-color: #262626;--active-color: var(--component-color);--hover-color: #EDEDED;--hover-primary-color: var(--main-color);--secondary-button-color: var(--component-color);--secondary-button-background-color: var(--main-font-color);--secondary-button-hover-background: var(--main-background);--secondary-button-active-background: var(--main-background);--quaternary-button-color: var(--main-font-color);--quaternary-button-background-color: var(--error-color);--quaternary-button-hover-background: var(--main-color);--quaternary-button-active-background: var(--main-color);--text-hover-color: #5A6473;--selected-color: #FBAEC9;--chart-background: #FFFFFF;--chart-component-color: var(--component-color);--icon-color: var(--main-color);--table-header-color: var(--component-color);--table-border-color: var(--table-header-color);--table-selected-row-color: var(--main-background);--table-text-color: var(--secondary-text-color);--scrollbar-color: var(--main-color);--menu-button-active: var(--main-color);--disabled-menu-color: #D9D9D9;--disabled-menu-color-hover: #FFFFFF;--nav-menu-hover-color: #70757e;--nav-menu-text-hover-color: var(--text-hover-color);--nav-menu-active-background: var(--hover-color);--nav-menu-disable-font: var(--hover-color);--nav-menu-separator-color: var(--secondary-color);--nav-menu-font-color: var(--nav-menu-hover-color);--nav-menu-font-disabled-color: #8a909a;--nav-menu-background-color: #FFFFFF;--nav-menu-border-color: rgba(0, 0, 0, .18)}.floating-action-button{box-sizing:border-box;position:fixed;z-index:999;opacity:50%;background:white;border:3px solid var(--component-color);display:flex;flex-direction:column;justify-content:flex-end}.floating-action-button:hover{opacity:100%}.floating-action-button:hover ::ng-deep button:not(:first-child){display:flex}.floating-action-button ::ng-deep button:not(:first-child){display:none}\n"] }]
204
+ args: [{ selector: 'biit-action-button', template: "<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n <ng-content></ng-content>\n</div>\n", styles: [":root{--main-color: #F20D5E;--popup-background-color: rgba(0, 0, 0, .15);--main-background: #D9D9D9;--body-background: #EDEDED;--light-background: #D7D7D7;--error-color: #A1093F;--warning-color: var(--main-color);--floating-background: white;--main-font-color: white;--secondary-color: #808080;--secondary-text-color: #EDEDED;--secondary-background-color: #808080;--disabled-primary-color: #808080;--disabled-secondary-color: var(--main-color);--component-color: #262626;--active-color: var(--component-color);--hover-color: #EDEDED;--hover-primary-color: var(--main-color);--secondary-button-color: var(--component-color);--secondary-button-background-color: var(--main-font-color);--secondary-button-hover-background: var(--main-background);--secondary-button-active-background: var(--main-background);--quaternary-button-color: var(--main-font-color);--quaternary-button-background-color: var(--error-color);--quaternary-button-hover-background: var(--main-color);--quaternary-button-active-background: var(--main-color);--text-hover-color: #5A6473;--selected-color: #FBAEC9;--chart-background: #FFFFFF;--chart-component-color: var(--component-color);--icon-color: var(--main-color);--table-header-color: var(--component-color);--table-header-text: var(--main-background);--table-border-color: var(--table-header-color);--table-selected-row-color: var(--main-background);--table-text-color: var(--secondary-text-color);--scrollbar-color: var(--main-color);--menu-button-active: var(--main-color);--disabled-menu-color: #D9D9D9;--disabled-menu-color-hover: #FFFFFF;--nav-menu-hover-color: #70757e;--nav-menu-text-hover-color: var(--text-hover-color);--nav-menu-active-background: var(--hover-color);--nav-menu-disable-font: var(--hover-color);--nav-menu-separator-color: var(--secondary-color);--nav-menu-font-color: var(--nav-menu-hover-color);--nav-menu-font-disabled-color: #8a909a;--nav-menu-background-color: #FFFFFF;--nav-menu-active-color: var(--hover-color);--nav-menu-border-color: rgba(0, 0, 0, .18);--input-text-background: var(--main-background);--input-text-focus-background: var(--main-background);--input-text-hover-background: var(--main-background);--popup-color: var(--component-color);--popup-background: #FFFFFF;--popup-error-color: var(--error-color)}.floating-action-button{box-sizing:border-box;position:fixed;z-index:999;opacity:50%;background:white;border:3px solid var(--component-color);display:flex;flex-direction:column;justify-content:flex-end}.floating-action-button:hover{opacity:100%}.floating-action-button:hover ::ng-deep button:not(:first-child){display:flex}.floating-action-button ::ng-deep button:not(:first-child){display:none}\n"] }]
205
205
  }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { position: [{
206
206
  type: Input
207
207
  }], additionalX: [{
package/fesm2015/biit-solutions-wizardry-theme-button.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"biit-solutions-wizardry-theme-button.mjs","sources":["../../../projects/wizardry-theme/button/src/biit-button/biit-button.component.ts","../../../projects/wizardry-theme/button/src/biit-button/biit-button.component.html","../../../projects/wizardry-theme/button/src/biit-button/biit-button.module.ts","../../../projects/wizardry-theme/button/src/biit-icon-button/biit-icon-button.component.ts","../../../projects/wizardry-theme/button/src/biit-icon-button/biit-icon-button.component.html","../../../projects/wizardry-theme/button/src/biit-icon-button/biit-icon-button.module.ts","../../../projects/wizardry-theme/button/src/biit-action-button/biit-action-button.component.ts","../../../projects/wizardry-theme/button/src/biit-action-button/biit-action-button.component.html","../../../projects/wizardry-theme/button/src/biit-action-button/biit-action-button.module.ts","../../../projects/wizardry-theme/button/src/public-api.ts","../../../projects/wizardry-theme/button/src/biit-solutions-wizardry-theme-button.ts"],"sourcesContent":["import {Component, Directive} from '@angular/core';\n\n@Directive({\n selector: '[primary]'\n})\nexport class BiitButtonPrimaryDirective {\n constructor(private parent: BiitButtonComponent) {\n parent.color = 'primary';\n }\n}\n\n@Directive({\n selector: '[secondary]'\n})\nexport class BiitButtonSecondaryDirective {\n constructor(private parent: BiitButtonComponent) {\n parent.color = 'secondary';\n }\n}\n\n@Directive({\n selector: '[tertiary]'\n})\nexport class BiitButtonTertiaryDirective {\n constructor(private parent: BiitButtonComponent) {\n parent.color = 'tertiary';\n }\n}\n\n@Directive({\n selector: '[quaternary]'\n})\nexport class BiitButtonQuaternaryDirective {\n constructor(private parent: BiitButtonComponent) {\n parent.color = 'quaternary';\n }\n}\n\n@Component({\n selector: 'button[biit-button]',\n templateUrl: 'biit-button.component.html',\n styleUrls: ['biit-button.component.scss'],\n})\n\nexport class BiitButtonComponent {\n color = 'primary';\n\n constructor() { }\n}\n","<div class=\"button-base prevent-select {{color}}\">\n <div class=\"button-content\">\n <span #text>\n <ng-content></ng-content>\n </span>\n <div *ngIf=\"color == 'tertiary'\" class=\"bar\" [ngStyle]=\"{'width.px': text.offsetWidth }\"></div>\n </div>\n</div>\n","import {NgModule} from '@angular/core';\nimport {\n BiitButtonComponent,\n BiitButtonPrimaryDirective, BiitButtonQuaternaryDirective,\n BiitButtonSecondaryDirective,\n BiitButtonTertiaryDirective\n} from './biit-button.component';\nimport {CommonModule} from \"@angular/common\";\nimport {FormsModule} from '@angular/forms';\n\n@NgModule({\n declarations: [\n BiitButtonComponent,\n BiitButtonPrimaryDirective,\n BiitButtonSecondaryDirective,\n BiitButtonTertiaryDirective,\n BiitButtonQuaternaryDirective\n ],\n imports: [\n CommonModule,\n FormsModule\n ],\n exports: [\n BiitButtonComponent,\n BiitButtonPrimaryDirective,\n BiitButtonSecondaryDirective,\n BiitButtonTertiaryDirective,\n BiitButtonQuaternaryDirective\n ]\n})\nexport class BiitButtonModule { }\n","import {Component, Input} from '@angular/core';\nimport {biitIcon} from '@biit-solutions/biit-icons-collection';\n\n@Component({\n selector: 'button[biit-icon]',\n templateUrl: 'biit-icon-button.component.html',\n styleUrls: ['biit-icon-button.component.scss'],\n})\n\nexport class BiitIconButtonComponent {\n\n @Input() icon: biitIcon;\n @Input() checked: boolean = false;\n}\n","<div [class.checked]=\"checked\" style=\"display: flex;\">\n <biit-icon [name]=\"icon\"\n [pathStyle]=\"{fill: 'var(--component-color)'}\"\n class=\"icon-button-svg\"\n ></biit-icon>\n <ng-content></ng-content>\n</div>\n","import {NgModule} from '@angular/core';\nimport {BiitIconButtonComponent} from './biit-icon-button.component';\nimport {BiitIconModule} from '@biit-solutions/wizardry-theme/icon';\n\n@NgModule({\n declarations: [\n BiitIconButtonComponent\n ],\n imports: [\n BiitIconModule\n ],\n exports: [\n BiitIconButtonComponent\n ]\n})\nexport class BiitIconButtonModule { }\n","import {AfterContentInit, Component, ContentChildren, ElementRef, Input, QueryList} from '@angular/core';\nimport {BiitIconButtonComponent} from \"../biit-icon-button/biit-icon-button.component\";\n\n@Component({\n selector: 'biit-action-button',\n templateUrl: './biit-action-button.component.html',\n styleUrls: ['./biit-action-button.component.scss']\n})\nexport class BiitActionButtonComponent implements AfterContentInit {\n\n @Input() position: FabPosition = 'bottom-right';\n @Input() additionalX: number = 0;\n @Input() additionalY: number = 0;\n @ContentChildren(BiitIconButtonComponent) inputButtons: QueryList<BiitIconButtonComponent>;\n protected buttons: BiitIconButtonComponent[];\n protected hover = false;\n\n constructor(private elementRef: ElementRef) {\n }\n\n ngAfterContentInit(): void {\n this.buttons = this.inputButtons.toArray();\n }\n\n positionStyle(): Object {\n const parentBoundingRect = this.elementRef.nativeElement.parentElement.getBoundingClientRect();\n const rem = parseFloat(getComputedStyle(document.documentElement).fontSize);\n const fabWidth = (rem * 2.125) + 6;\n const desiredOffsetX = (rem * 1.5) + this.additionalX;\n const desiredOffsetY = rem + this.additionalY;\n const bottomOffsetX = desiredOffsetY + (this.hover ? (rem * 2.125)*(this.buttons.length-1) : 0);\n\n const leftLeft = `${parentBoundingRect.left + desiredOffsetX}px`;\n const leftMid = `${parentBoundingRect.left + (parentBoundingRect.width / 2) - (fabWidth / 2) + this.additionalX}px`;\n const leftRight = `${parentBoundingRect.right - (fabWidth + desiredOffsetX)}px`;\n\n const topTop = `${parentBoundingRect.top + desiredOffsetY}px`;\n const topMid = `${parentBoundingRect.top + (parentBoundingRect.height / 2) - (fabWidth / 2) + this.additionalY}px`;\n const topBottom = `${parentBoundingRect.bottom - (fabWidth + bottomOffsetX)}px`;\n\n switch (this.position) {\n case 'top-left':\n return {top: topTop, left: leftLeft};\n case 'top-middle':\n return {top: topTop, left: leftMid};\n case 'top-right':\n return {top: topTop, left: leftRight};\n case 'middle-left':\n return {top: topMid, left: leftLeft};\n case 'middle-right':\n return {top: topMid, left: leftRight};\n case 'middle-middle':\n return {top: topMid, left: leftMid};\n case 'bottom-left':\n return {top: topBottom, left: leftLeft, 'flex-direction': 'column-reverse'};\n case 'bottom-middle':\n return {top: topBottom, left: leftMid, 'flex-direction': 'column-reverse'};\n case 'bottom-right':\n return {top: topBottom, left: leftRight, 'flex-direction': 'column-reverse'};\n default:\n return {};\n }\n }\n}\n\nexport type FabPosition = 'top-left' | 'top-middle' | 'top-right' | 'middle-left' | 'middle-middle' | 'middle-right' | 'bottom-left' | 'bottom-middle' | 'bottom-right' | 'custom';\n","<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n <ng-content></ng-content>\n</div>\n","import {NgModule} from '@angular/core';\nimport {CommonModule} from \"@angular/common\";\nimport {FormsModule} from '@angular/forms';\nimport {BiitActionButtonComponent} from \"./biit-action-button.component\";\nimport {BiitIconButtonModule} from \"../biit-icon-button/biit-icon-button.module\";\n\n@NgModule({\n declarations: [\n BiitActionButtonComponent\n ],\n imports: [\n CommonModule,\n FormsModule,\n BiitIconButtonModule\n ],\n exports: [\n BiitActionButtonComponent\n ]\n})\nexport class BiitActionButtonModule { }\n","/*\n * Public API Surface of wizardry-theme/button\n */\n\nexport * from './biit-button/biit-button.component';\nexport * from './biit-button/biit-button.module';\nexport * from './biit-icon-button/biit-icon-button.component';\nexport * from './biit-icon-button/biit-icon-button.module';\nexport * from './biit-action-button/biit-action-button.component';\nexport * from './biit-action-button/biit-action-button.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1"],"mappings":"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"}
1
+ {"version":3,"file":"biit-solutions-wizardry-theme-button.mjs","sources":["../../../projects/wizardry-theme/button/src/biit-button/biit-button.component.ts","../../../projects/wizardry-theme/button/src/biit-button/biit-button.component.html","../../../projects/wizardry-theme/button/src/biit-button/biit-button.module.ts","../../../projects/wizardry-theme/button/src/biit-icon-button/biit-icon-button.component.ts","../../../projects/wizardry-theme/button/src/biit-icon-button/biit-icon-button.component.html","../../../projects/wizardry-theme/button/src/biit-icon-button/biit-icon-button.module.ts","../../../projects/wizardry-theme/button/src/biit-action-button/biit-action-button.component.ts","../../../projects/wizardry-theme/button/src/biit-action-button/biit-action-button.component.html","../../../projects/wizardry-theme/button/src/biit-action-button/biit-action-button.module.ts","../../../projects/wizardry-theme/button/src/public-api.ts","../../../projects/wizardry-theme/button/src/biit-solutions-wizardry-theme-button.ts"],"sourcesContent":["import {Component, Directive} from '@angular/core';\n\n@Directive({\n selector: '[primary]'\n})\nexport class BiitButtonPrimaryDirective {\n constructor(private parent: BiitButtonComponent) {\n parent.color = 'primary';\n }\n}\n\n@Directive({\n selector: '[secondary]'\n})\nexport class BiitButtonSecondaryDirective {\n constructor(private parent: BiitButtonComponent) {\n parent.color = 'secondary';\n }\n}\n\n@Directive({\n selector: '[tertiary]'\n})\nexport class BiitButtonTertiaryDirective {\n constructor(private parent: BiitButtonComponent) {\n parent.color = 'tertiary';\n }\n}\n\n@Directive({\n selector: '[quaternary]'\n})\nexport class BiitButtonQuaternaryDirective {\n constructor(private parent: BiitButtonComponent) {\n parent.color = 'quaternary';\n }\n}\n\n@Component({\n selector: 'button[biit-button]',\n templateUrl: 'biit-button.component.html',\n styleUrls: ['biit-button.component.scss'],\n})\n\nexport class BiitButtonComponent {\n color = 'primary';\n\n constructor() { }\n}\n","<div class=\"button-base prevent-select {{color}}\">\n <div class=\"button-content\">\n <span #text>\n <ng-content></ng-content>\n </span>\n <div *ngIf=\"color == 'tertiary'\" class=\"bar\" [ngStyle]=\"{'width.px': text.offsetWidth }\"></div>\n </div>\n</div>\n","import {NgModule} from '@angular/core';\nimport {\n BiitButtonComponent,\n BiitButtonPrimaryDirective, BiitButtonQuaternaryDirective,\n BiitButtonSecondaryDirective,\n BiitButtonTertiaryDirective\n} from './biit-button.component';\nimport {CommonModule} from \"@angular/common\";\nimport {FormsModule} from '@angular/forms';\n\n@NgModule({\n declarations: [\n BiitButtonComponent,\n BiitButtonPrimaryDirective,\n BiitButtonSecondaryDirective,\n BiitButtonTertiaryDirective,\n BiitButtonQuaternaryDirective\n ],\n imports: [\n CommonModule,\n FormsModule\n ],\n exports: [\n BiitButtonComponent,\n BiitButtonPrimaryDirective,\n BiitButtonSecondaryDirective,\n BiitButtonTertiaryDirective,\n BiitButtonQuaternaryDirective\n ]\n})\nexport class BiitButtonModule { }\n","import {Component, Input} from '@angular/core';\nimport {biitIcon} from '@biit-solutions/biit-icons-collection';\n\n@Component({\n selector: 'button[biit-icon]',\n templateUrl: 'biit-icon-button.component.html',\n styleUrls: ['biit-icon-button.component.scss'],\n})\n\nexport class BiitIconButtonComponent {\n\n @Input() icon: biitIcon;\n @Input() checked: boolean = false;\n}\n","<div [class.checked]=\"checked\" style=\"display: flex;\">\n <biit-icon [name]=\"icon\"\n [pathStyle]=\"{fill: 'var(--component-color)'}\"\n class=\"icon-button-svg\"\n ></biit-icon>\n <ng-content></ng-content>\n</div>\n","import {NgModule} from '@angular/core';\nimport {BiitIconButtonComponent} from './biit-icon-button.component';\nimport {BiitIconModule} from '@biit-solutions/wizardry-theme/icon';\n\n@NgModule({\n declarations: [\n BiitIconButtonComponent\n ],\n imports: [\n BiitIconModule\n ],\n exports: [\n BiitIconButtonComponent\n ]\n})\nexport class BiitIconButtonModule { }\n","import {AfterContentInit, Component, ContentChildren, ElementRef, Input, QueryList} from '@angular/core';\nimport {BiitIconButtonComponent} from \"../biit-icon-button/biit-icon-button.component\";\n\n@Component({\n selector: 'biit-action-button',\n templateUrl: './biit-action-button.component.html',\n styleUrls: ['./biit-action-button.component.scss']\n})\nexport class BiitActionButtonComponent implements AfterContentInit {\n\n @Input() position: FabPosition = 'bottom-right';\n @Input() additionalX: number = 0;\n @Input() additionalY: number = 0;\n @ContentChildren(BiitIconButtonComponent) inputButtons: QueryList<BiitIconButtonComponent>;\n protected buttons: BiitIconButtonComponent[];\n protected hover = false;\n\n constructor(private elementRef: ElementRef) {\n }\n\n ngAfterContentInit(): void {\n this.buttons = this.inputButtons.toArray();\n }\n\n positionStyle(): Object {\n const parentBoundingRect = this.elementRef.nativeElement.parentElement.getBoundingClientRect();\n const rem = parseFloat(getComputedStyle(document.documentElement).fontSize);\n const fabWidth = (rem * 2.125) + 6;\n const desiredOffsetX = (rem * 1.5) + this.additionalX;\n const desiredOffsetY = rem + this.additionalY;\n const bottomOffsetX = desiredOffsetY + (this.hover ? (rem * 2.125)*(this.buttons.length-1) : 0);\n\n const leftLeft = `${parentBoundingRect.left + desiredOffsetX}px`;\n const leftMid = `${parentBoundingRect.left + (parentBoundingRect.width / 2) - (fabWidth / 2) + this.additionalX}px`;\n const leftRight = `${parentBoundingRect.right - (fabWidth + desiredOffsetX)}px`;\n\n const topTop = `${parentBoundingRect.top + desiredOffsetY}px`;\n const topMid = `${parentBoundingRect.top + (parentBoundingRect.height / 2) - (fabWidth / 2) + this.additionalY}px`;\n const topBottom = `${parentBoundingRect.bottom - (fabWidth + bottomOffsetX)}px`;\n\n switch (this.position) {\n case 'top-left':\n return {top: topTop, left: leftLeft};\n case 'top-middle':\n return {top: topTop, left: leftMid};\n case 'top-right':\n return {top: topTop, left: leftRight};\n case 'middle-left':\n return {top: topMid, left: leftLeft};\n case 'middle-right':\n return {top: topMid, left: leftRight};\n case 'middle-middle':\n return {top: topMid, left: leftMid};\n case 'bottom-left':\n return {top: topBottom, left: leftLeft, 'flex-direction': 'column-reverse'};\n case 'bottom-middle':\n return {top: topBottom, left: leftMid, 'flex-direction': 'column-reverse'};\n case 'bottom-right':\n return {top: topBottom, left: leftRight, 'flex-direction': 'column-reverse'};\n default:\n return {};\n }\n }\n}\n\nexport type FabPosition = 'top-left' | 'top-middle' | 'top-right' | 'middle-left' | 'middle-middle' | 'middle-right' | 'bottom-left' | 'bottom-middle' | 'bottom-right' | 'custom';\n","<div id=\"fab\" class=\"floating-action-button\" [ngStyle]=\"positionStyle()\" (pointerover)=\"hover = true;\" (pointerleave)=\"hover = false\">\n <ng-content></ng-content>\n</div>\n","import {NgModule} from '@angular/core';\nimport {CommonModule} from \"@angular/common\";\nimport {FormsModule} from '@angular/forms';\nimport {BiitActionButtonComponent} from \"./biit-action-button.component\";\nimport {BiitIconButtonModule} from \"../biit-icon-button/biit-icon-button.module\";\n\n@NgModule({\n declarations: [\n BiitActionButtonComponent\n ],\n imports: [\n CommonModule,\n FormsModule,\n BiitIconButtonModule\n ],\n exports: [\n BiitActionButtonComponent\n ]\n})\nexport class BiitActionButtonModule { }\n","/*\n * Public API Surface of wizardry-theme/button\n */\n\nexport * from './biit-button/biit-button.component';\nexport * from './biit-button/biit-button.module';\nexport * from './biit-icon-button/biit-icon-button.component';\nexport * from './biit-icon-button/biit-icon-button.module';\nexport * from './biit-action-button/biit-action-button.component';\nexport * from './biit-action-button/biit-action-button.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["i1"],"mappings":"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"}
package/fesm2015/biit-solutions-wizardry-theme-inputs.mjs CHANGED
@@ -98,7 +98,7 @@ BiitInputTextComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
98
98
  provide: TRANSLOCO_SCOPE,
99
99
  useValue: { scope: 'wizardry-theme/inputs', alias: "inputs" }
100
100
  }
101
- ], ngImport: i0, template: "<div class=\"biit-input\" [class.disabled]=\"disabled\" [class.readonly]=\"readonly\" *transloco=\"let t\">\n <div class=\"input-container\">\n <biit-tooltip-icon *ngIf=\"info\"\n class=\"tooltip-icon\"\n [text]=\"info\"></biit-tooltip-icon>\n <input\n class=\"input-object\"\n (keydown)=\"checkValue($event)\"\n [(ngModel)]=\"value\"\n (input)=\"value\"\n (ngModelChange)=\"onChange($event); validateInput();\"\n (keydown.enter)=\"onActionPerformed.emit(value)\"\n [type]=\"reveal ? Type.TEXT : type\" required\n [min]=\"min\"\n [max]=\"max\"\n [minlength]=\"minLength\"\n [maxlength]=\"maxLength ? maxLength : 100\"\n [attr.name]=\"fieldName\"\n [class.error]=\"error || regExError || minLengthError\"\n [class.reveal]=\"reveal\"\n >\n <div *ngIf=\"type === Type.PASSWORD || icon\" class=\"input-show-icon-container\"\n (click)=\"reveal = (type === Type.PASSWORD ? !reveal : false); onActionPerformed.emit(value)\"\n (keydown.enter)=\"reveal = (type === Type.PASSWORD ? !reveal : false); onActionPerformed.emit(value)\"\n tabindex=\"0\">\n <biit-icon [name]=\"type === Type.PASSWORD ? 'show' : icon\"\n class=\"input-show-icon\"\n [pathStyle]=\"{fill: reveal ? 'var(--main-color)' : 'var(--component-color)'}\"\n ></biit-icon>\n </div>\n <div class=\"input-placeholder\" [class.input-filled]=\"this.value?.toString().length\">\n {{ _placeholder }}\n <a *ngIf=\"required\"\n [style.color]=\"value ? null : 'red'\">*</a>\n </div>\n <biit-icon *ngIf=\"error || regExError || minLengthError\" id=\"exclamation\" name=\"exclamation\"\n class=\"input-error-icon\" [pathStyle]=\"{fill:'#A1093F'}\"></biit-icon>\n <div class=\"bottom-line\"\n [class.disabled]=\"disabled\"\n [class.readonly]=\"readonly\"\n ></div>\n <div *ngIf=\"error\" class=\"input-error-msg\" id=\"error-message\">\n <a id=\"message\">\n {{ error }}\n </a>\n </div>\n <div *ngIf=\"regExError && !error\" id=\"regex-error-message\" class=\"input-error-msg\">\n <a id=\"regex-message\">\n {{ t('inputs.regex-error') }}\n </a>\n </div>\n <div *ngIf=\"minLengthError && !error && !regExError\" id=\"length-error-message\" class=\"input-error-msg\">\n <a id=\"length-message\">\n {{ t('inputs.minlength-error') }}\n </a>\n </div>\n <span *ngIf=\"description\" id=\"description\" class=\"input-description\">\n {{ description }}\n </span>\n </div>\n</div>\n", styles: ["*{box-sizing:border-box}.biit-input{display:flex;min-width:12.8em}.biit-input.disabled{pointer-events:none}.biit-input.disabled .input-object{background:var(--main-background);color:var(--secondary-color)}.biit-input.readonly .input-object{color:var(--secondary-color)}.input-container{position:relative;width:100%}.input-object{font-size:1em;display:block;border:none;color:var(--component-color);padding:.7em;height:2.1em;width:100%;min-width:2.1em;font-weight:400}.input-object:focus{outline:none;background:var(--main-background)}.input-object:hover{background:var(--main-background)}.input-object.error{color:var(--error-color);border-color:var(--error-color)}.input-object.password{padding:.7em 2.1em .55em .7em}.input-object.password.reveal{-webkit-text-security:none;input-security:none}.input-placeholder{color:var(--component-color);font-size:1em;font-weight:bolder;text-transform:uppercase;position:absolute;pointer-events:none;left:.7em;top:.42em;height:.7em;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input-object:focus~.input-placeholder,.input-object:-webkit-autofill~.input-placeholder,.input-filled{top:-.95em;font-size:.7em;line-height:.7em;font-weight:400;color:var(--secondary-color)}.input-error-icon{display:flex;top:.7em;position:absolute;width:.7em;height:.7em}.input-error-msg{position:absolute;display:flex;align-items:center;font-size:.75em;color:var(--error-color);padding-top:.2em;min-height:1.05em;line-height:120%}.input-error-msg a{display:block;line-height:1.1em}.input-show-icon{width:1.05em;height:1.05em}.input-show-icon-container{top:0;right:0;position:absolute;width:2.1em;height:2.1em;align-content:center;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.input-show-icon-container:hover,.input-show-icon-container:focus,.input-show-icon-container:focus-visible{background-color:var(--main-background);border:none;outline:none}.input-description{position:absolute;display:flex;align-items:center;font-size:.75em;color:gray;padding-top:1.4em;min-height:1.05em;line-height:120%;font-style:italic}.input-description a{display:block;line-height:1.1em}.bottom-line{position:relative;top:-3px;margin-bottom:-3px;width:auto;height:3px;background:var(--component-color)}.bottom-line.disabled,.bottom-line.readonly{background:var(--secondary-color)}.tooltip-icon{position:absolute;top:-.5em;left:-.5em}@media (max-width: 550px){.popup-canvas{min-width:0}.login-container{flex-direction:column-reverse;gap:2rem}}input[type=password]::-webkit-contacts-auto-fill-button,input[type=password]::-webkit-credentials-auto-fill-button{visibility:hidden;display:none!important;pointer-events:none;height:0;width:0;margin:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.BiitIconComponent, selector: "biit-icon", inputs: ["name", "svgStyle", "pathStyle"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: i3$1.BiitTooltipIconComponent, selector: "biit-tooltip-icon", inputs: ["text", "inline"] }] });
101
+ ], ngImport: i0, template: "<div class=\"biit-input\" [class.disabled]=\"disabled\" [class.readonly]=\"readonly\" *transloco=\"let t\">\n <div class=\"input-container\">\n <biit-tooltip-icon *ngIf=\"info\"\n class=\"tooltip-icon\"\n [text]=\"info\"></biit-tooltip-icon>\n <input\n class=\"input-object\"\n (keydown)=\"checkValue($event)\"\n [(ngModel)]=\"value\"\n (input)=\"value\"\n (ngModelChange)=\"onChange($event); validateInput();\"\n (keydown.enter)=\"onActionPerformed.emit(value)\"\n [type]=\"reveal ? Type.TEXT : type\" required\n [min]=\"min\"\n [max]=\"max\"\n [minlength]=\"minLength\"\n [maxlength]=\"maxLength ? maxLength : 100\"\n [attr.name]=\"fieldName\"\n [class.error]=\"error || regExError || minLengthError\"\n [class.reveal]=\"reveal\"\n >\n <div *ngIf=\"type === Type.PASSWORD || icon\" class=\"input-show-icon-container\"\n (click)=\"reveal = (type === Type.PASSWORD ? !reveal : false); onActionPerformed.emit(value)\"\n (keydown.enter)=\"reveal = (type === Type.PASSWORD ? !reveal : false); onActionPerformed.emit(value)\"\n tabindex=\"0\">\n <biit-icon [name]=\"type === Type.PASSWORD ? 'show' : icon\"\n class=\"input-show-icon\"\n [pathStyle]=\"{fill: reveal ? 'var(--main-color)' : 'var(--component-color)'}\"\n ></biit-icon>\n </div>\n <div class=\"input-placeholder\" [class.input-filled]=\"this.value?.toString().length\">\n {{ _placeholder }}\n <a *ngIf=\"required\"\n [style.color]=\"value ? null : 'red'\">*</a>\n </div>\n <biit-icon *ngIf=\"error || regExError || minLengthError\" id=\"exclamation\" name=\"exclamation\"\n class=\"input-error-icon\" [pathStyle]=\"{fill:'#A1093F'}\"></biit-icon>\n <div class=\"bottom-line\"\n [class.disabled]=\"disabled\"\n [class.readonly]=\"readonly\"\n ></div>\n <div *ngIf=\"error\" class=\"input-error-msg\" id=\"error-message\">\n <a id=\"message\">\n {{ error }}\n </a>\n </div>\n <div *ngIf=\"regExError && !error\" id=\"regex-error-message\" class=\"input-error-msg\">\n <a id=\"regex-message\">\n {{ t('inputs.regex-error') }}\n </a>\n </div>\n <div *ngIf=\"minLengthError && !error && !regExError\" id=\"length-error-message\" class=\"input-error-msg\">\n <a id=\"length-message\">\n {{ t('inputs.minlength-error') }}\n </a>\n </div>\n <span *ngIf=\"description\" id=\"description\" class=\"input-description\">\n {{ description }}\n </span>\n </div>\n</div>\n", styles: ["*{box-sizing:border-box}.biit-input{display:flex;min-width:12.8em}.biit-input.disabled{pointer-events:none}.biit-input.disabled .input-object{background:var(--input-text-background);color:var(--secondary-color)}.biit-input.readonly .input-object{color:var(--secondary-color)}.input-container{position:relative;width:100%}.input-object{font-size:1em;display:block;border:none;color:var(--component-color);padding:.7em;height:2.1em;width:100%;min-width:2.1em;font-weight:400;background:var(--input-text-background)}.input-object:focus{outline:none;background:var(--input-text-focus-background)}.input-object:hover{background:var(--input-text-hover-background)}.input-object.error{color:var(--error-color);border-color:var(--error-color)}.input-object.password{padding:.7em 2.1em .55em .7em}.input-object.password.reveal{-webkit-text-security:none;input-security:none}.input-placeholder{color:var(--component-color);font-size:1em;font-weight:bolder;text-transform:uppercase;position:absolute;pointer-events:none;left:.7em;top:.42em;height:.7em;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input-object:focus~.input-placeholder,.input-object:-webkit-autofill~.input-placeholder,.input-filled{top:-.95em;font-size:.7em;line-height:.7em;font-weight:400;color:var(--secondary-color)}.input-error-icon{display:flex;top:.7em;position:absolute;width:.7em;height:.7em}.input-error-msg{position:absolute;display:flex;align-items:center;font-size:.75em;color:var(--error-color);padding-top:.2em;min-height:1.05em;line-height:120%}.input-error-msg a{display:block;line-height:1.1em}.input-show-icon{width:1.05em;height:1.05em}.input-show-icon-container{top:0;right:0;position:absolute;width:2.1em;height:2.1em;align-content:center;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.input-show-icon-container:hover,.input-show-icon-container:focus,.input-show-icon-container:focus-visible{background-color:var(--input-text-background);border:none;outline:none}.input-description{position:absolute;display:flex;align-items:center;font-size:.75em;color:gray;padding-top:1.4em;min-height:1.05em;line-height:120%;font-style:italic}.input-description a{display:block;line-height:1.1em}.bottom-line{position:relative;top:-3px;margin-bottom:-3px;width:auto;height:3px;background:var(--component-color)}.bottom-line.disabled,.bottom-line.readonly{background:var(--secondary-color)}.tooltip-icon{position:absolute;top:-.5em;left:-.5em}@media (max-width: 550px){.popup-canvas{min-width:0}.login-container{flex-direction:column-reverse;gap:2rem}}input[type=password]::-webkit-contacts-auto-fill-button,input[type=password]::-webkit-credentials-auto-fill-button{visibility:hidden;display:none!important;pointer-events:none;height:0;width:0;margin:0}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.BiitIconComponent, selector: "biit-icon", inputs: ["name", "svgStyle", "pathStyle"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.TranslocoDirective, selector: "[transloco]", inputs: ["transloco", "translocoParams", "translocoScope", "translocoRead", "translocoLang", "translocoLoadingTpl"] }, { kind: "component", type: i3$1.BiitTooltipIconComponent, selector: "biit-tooltip-icon", inputs: ["text", "inline"] }] });
102
102
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitInputTextComponent, decorators: [{
103
103
  type: Component,
104
104
  args: [{ selector: 'biit-input-text', providers: [
@@ -111,7 +111,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
111
111
  provide: TRANSLOCO_SCOPE,
112
112
  useValue: { scope: 'wizardry-theme/inputs', alias: "inputs" }
113
113
  }
114
- ], template: "<div class=\"biit-input\" [class.disabled]=\"disabled\" [class.readonly]=\"readonly\" *transloco=\"let t\">\n <div class=\"input-container\">\n <biit-tooltip-icon *ngIf=\"info\"\n class=\"tooltip-icon\"\n [text]=\"info\"></biit-tooltip-icon>\n <input\n class=\"input-object\"\n (keydown)=\"checkValue($event)\"\n [(ngModel)]=\"value\"\n (input)=\"value\"\n (ngModelChange)=\"onChange($event); validateInput();\"\n (keydown.enter)=\"onActionPerformed.emit(value)\"\n [type]=\"reveal ? Type.TEXT : type\" required\n [min]=\"min\"\n [max]=\"max\"\n [minlength]=\"minLength\"\n [maxlength]=\"maxLength ? maxLength : 100\"\n [attr.name]=\"fieldName\"\n [class.error]=\"error || regExError || minLengthError\"\n [class.reveal]=\"reveal\"\n >\n <div *ngIf=\"type === Type.PASSWORD || icon\" class=\"input-show-icon-container\"\n (click)=\"reveal = (type === Type.PASSWORD ? !reveal : false); onActionPerformed.emit(value)\"\n (keydown.enter)=\"reveal = (type === Type.PASSWORD ? !reveal : false); onActionPerformed.emit(value)\"\n tabindex=\"0\">\n <biit-icon [name]=\"type === Type.PASSWORD ? 'show' : icon\"\n class=\"input-show-icon\"\n [pathStyle]=\"{fill: reveal ? 'var(--main-color)' : 'var(--component-color)'}\"\n ></biit-icon>\n </div>\n <div class=\"input-placeholder\" [class.input-filled]=\"this.value?.toString().length\">\n {{ _placeholder }}\n <a *ngIf=\"required\"\n [style.color]=\"value ? null : 'red'\">*</a>\n </div>\n <biit-icon *ngIf=\"error || regExError || minLengthError\" id=\"exclamation\" name=\"exclamation\"\n class=\"input-error-icon\" [pathStyle]=\"{fill:'#A1093F'}\"></biit-icon>\n <div class=\"bottom-line\"\n [class.disabled]=\"disabled\"\n [class.readonly]=\"readonly\"\n ></div>\n <div *ngIf=\"error\" class=\"input-error-msg\" id=\"error-message\">\n <a id=\"message\">\n {{ error }}\n </a>\n </div>\n <div *ngIf=\"regExError && !error\" id=\"regex-error-message\" class=\"input-error-msg\">\n <a id=\"regex-message\">\n {{ t('inputs.regex-error') }}\n </a>\n </div>\n <div *ngIf=\"minLengthError && !error && !regExError\" id=\"length-error-message\" class=\"input-error-msg\">\n <a id=\"length-message\">\n {{ t('inputs.minlength-error') }}\n </a>\n </div>\n <span *ngIf=\"description\" id=\"description\" class=\"input-description\">\n {{ description }}\n </span>\n </div>\n</div>\n", styles: ["*{box-sizing:border-box}.biit-input{display:flex;min-width:12.8em}.biit-input.disabled{pointer-events:none}.biit-input.disabled .input-object{background:var(--main-background);color:var(--secondary-color)}.biit-input.readonly .input-object{color:var(--secondary-color)}.input-container{position:relative;width:100%}.input-object{font-size:1em;display:block;border:none;color:var(--component-color);padding:.7em;height:2.1em;width:100%;min-width:2.1em;font-weight:400}.input-object:focus{outline:none;background:var(--main-background)}.input-object:hover{background:var(--main-background)}.input-object.error{color:var(--error-color);border-color:var(--error-color)}.input-object.password{padding:.7em 2.1em .55em .7em}.input-object.password.reveal{-webkit-text-security:none;input-security:none}.input-placeholder{color:var(--component-color);font-size:1em;font-weight:bolder;text-transform:uppercase;position:absolute;pointer-events:none;left:.7em;top:.42em;height:.7em;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input-object:focus~.input-placeholder,.input-object:-webkit-autofill~.input-placeholder,.input-filled{top:-.95em;font-size:.7em;line-height:.7em;font-weight:400;color:var(--secondary-color)}.input-error-icon{display:flex;top:.7em;position:absolute;width:.7em;height:.7em}.input-error-msg{position:absolute;display:flex;align-items:center;font-size:.75em;color:var(--error-color);padding-top:.2em;min-height:1.05em;line-height:120%}.input-error-msg a{display:block;line-height:1.1em}.input-show-icon{width:1.05em;height:1.05em}.input-show-icon-container{top:0;right:0;position:absolute;width:2.1em;height:2.1em;align-content:center;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.input-show-icon-container:hover,.input-show-icon-container:focus,.input-show-icon-container:focus-visible{background-color:var(--main-background);border:none;outline:none}.input-description{position:absolute;display:flex;align-items:center;font-size:.75em;color:gray;padding-top:1.4em;min-height:1.05em;line-height:120%;font-style:italic}.input-description a{display:block;line-height:1.1em}.bottom-line{position:relative;top:-3px;margin-bottom:-3px;width:auto;height:3px;background:var(--component-color)}.bottom-line.disabled,.bottom-line.readonly{background:var(--secondary-color)}.tooltip-icon{position:absolute;top:-.5em;left:-.5em}@media (max-width: 550px){.popup-canvas{min-width:0}.login-container{flex-direction:column-reverse;gap:2rem}}input[type=password]::-webkit-contacts-auto-fill-button,input[type=password]::-webkit-credentials-auto-fill-button{visibility:hidden;display:none!important;pointer-events:none;height:0;width:0;margin:0}\n"] }]
114
+ ], template: "<div class=\"biit-input\" [class.disabled]=\"disabled\" [class.readonly]=\"readonly\" *transloco=\"let t\">\n <div class=\"input-container\">\n <biit-tooltip-icon *ngIf=\"info\"\n class=\"tooltip-icon\"\n [text]=\"info\"></biit-tooltip-icon>\n <input\n class=\"input-object\"\n (keydown)=\"checkValue($event)\"\n [(ngModel)]=\"value\"\n (input)=\"value\"\n (ngModelChange)=\"onChange($event); validateInput();\"\n (keydown.enter)=\"onActionPerformed.emit(value)\"\n [type]=\"reveal ? Type.TEXT : type\" required\n [min]=\"min\"\n [max]=\"max\"\n [minlength]=\"minLength\"\n [maxlength]=\"maxLength ? maxLength : 100\"\n [attr.name]=\"fieldName\"\n [class.error]=\"error || regExError || minLengthError\"\n [class.reveal]=\"reveal\"\n >\n <div *ngIf=\"type === Type.PASSWORD || icon\" class=\"input-show-icon-container\"\n (click)=\"reveal = (type === Type.PASSWORD ? !reveal : false); onActionPerformed.emit(value)\"\n (keydown.enter)=\"reveal = (type === Type.PASSWORD ? !reveal : false); onActionPerformed.emit(value)\"\n tabindex=\"0\">\n <biit-icon [name]=\"type === Type.PASSWORD ? 'show' : icon\"\n class=\"input-show-icon\"\n [pathStyle]=\"{fill: reveal ? 'var(--main-color)' : 'var(--component-color)'}\"\n ></biit-icon>\n </div>\n <div class=\"input-placeholder\" [class.input-filled]=\"this.value?.toString().length\">\n {{ _placeholder }}\n <a *ngIf=\"required\"\n [style.color]=\"value ? null : 'red'\">*</a>\n </div>\n <biit-icon *ngIf=\"error || regExError || minLengthError\" id=\"exclamation\" name=\"exclamation\"\n class=\"input-error-icon\" [pathStyle]=\"{fill:'#A1093F'}\"></biit-icon>\n <div class=\"bottom-line\"\n [class.disabled]=\"disabled\"\n [class.readonly]=\"readonly\"\n ></div>\n <div *ngIf=\"error\" class=\"input-error-msg\" id=\"error-message\">\n <a id=\"message\">\n {{ error }}\n </a>\n </div>\n <div *ngIf=\"regExError && !error\" id=\"regex-error-message\" class=\"input-error-msg\">\n <a id=\"regex-message\">\n {{ t('inputs.regex-error') }}\n </a>\n </div>\n <div *ngIf=\"minLengthError && !error && !regExError\" id=\"length-error-message\" class=\"input-error-msg\">\n <a id=\"length-message\">\n {{ t('inputs.minlength-error') }}\n </a>\n </div>\n <span *ngIf=\"description\" id=\"description\" class=\"input-description\">\n {{ description }}\n </span>\n </div>\n</div>\n", styles: ["*{box-sizing:border-box}.biit-input{display:flex;min-width:12.8em}.biit-input.disabled{pointer-events:none}.biit-input.disabled .input-object{background:var(--input-text-background);color:var(--secondary-color)}.biit-input.readonly .input-object{color:var(--secondary-color)}.input-container{position:relative;width:100%}.input-object{font-size:1em;display:block;border:none;color:var(--component-color);padding:.7em;height:2.1em;width:100%;min-width:2.1em;font-weight:400;background:var(--input-text-background)}.input-object:focus{outline:none;background:var(--input-text-focus-background)}.input-object:hover{background:var(--input-text-hover-background)}.input-object.error{color:var(--error-color);border-color:var(--error-color)}.input-object.password{padding:.7em 2.1em .55em .7em}.input-object.password.reveal{-webkit-text-security:none;input-security:none}.input-placeholder{color:var(--component-color);font-size:1em;font-weight:bolder;text-transform:uppercase;position:absolute;pointer-events:none;left:.7em;top:.42em;height:.7em;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input-object:focus~.input-placeholder,.input-object:-webkit-autofill~.input-placeholder,.input-filled{top:-.95em;font-size:.7em;line-height:.7em;font-weight:400;color:var(--secondary-color)}.input-error-icon{display:flex;top:.7em;position:absolute;width:.7em;height:.7em}.input-error-msg{position:absolute;display:flex;align-items:center;font-size:.75em;color:var(--error-color);padding-top:.2em;min-height:1.05em;line-height:120%}.input-error-msg a{display:block;line-height:1.1em}.input-show-icon{width:1.05em;height:1.05em}.input-show-icon-container{top:0;right:0;position:absolute;width:2.1em;height:2.1em;align-content:center;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.input-show-icon-container:hover,.input-show-icon-container:focus,.input-show-icon-container:focus-visible{background-color:var(--input-text-background);border:none;outline:none}.input-description{position:absolute;display:flex;align-items:center;font-size:.75em;color:gray;padding-top:1.4em;min-height:1.05em;line-height:120%;font-style:italic}.input-description a{display:block;line-height:1.1em}.bottom-line{position:relative;top:-3px;margin-bottom:-3px;width:auto;height:3px;background:var(--component-color)}.bottom-line.disabled,.bottom-line.readonly{background:var(--secondary-color)}.tooltip-icon{position:absolute;top:-.5em;left:-.5em}@media (max-width: 550px){.popup-canvas{min-width:0}.login-container{flex-direction:column-reverse;gap:2rem}}input[type=password]::-webkit-contacts-auto-fill-button,input[type=password]::-webkit-credentials-auto-fill-button{visibility:hidden;display:none!important;pointer-events:none;height:0;width:0;margin:0}\n"] }]
115
115
  }], propDecorators: { placeholder: [{
116
116
  type: Input
117
117
  }], error: [{
@@ -796,7 +796,7 @@ BiitMultiselectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0
796
796
  useExisting: forwardRef(() => BiitMultiselectComponent),
797
797
  multi: true
798
798
  }
799
- ], ngImport: i0, template: "<!-- DEFAULT MODE -->\n<div *ngIf=\"type != 'icon'\"\n class=\"biit-input\" aria-haspopup=\"listbox\"\n [class.compact]=\"isCompact\"\n [class.disabled]=\"isDisabled\"\n (keydown)=\"!isDisabled && handleKeyboardEvents($event)\"\n (keydown.enter)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n (keydown.space)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n>\n <div class=\"input-container\" #input>\n <input [ngModel]=\"dropdownOpen ? filterText :\n currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n (ngModelChange)=\"filterText = $event; handleFilter()\"\n (click)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n (keydown.enter)=\"filterText.length ? onCreate.emit(filterText) : false; clearFilter();\"\n [placeholder]=\"dropdownOpen && currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n tabindex=\"0\"\n class=\"input-object\"\n [class.grey-bg]=\"dropdownOpen\"\n [class.default-cursor]=\"dropdownOpen\"\n [disabled]=\"isDisabled\"\n [readonly]=\"!dropdownOpen\"/>\n <div class=\"input-show-icon-container\" id=\"arrow\"\n [class.passthrough]=\"!dropdownOpen\"\n [class.rotate-90]=\"dropdownOpen\"\n (click)=\"dropdownOpen && closeDropdown()\">\n <biit-icon [name]=\"'right_arrow'\"\n class=\"input-show-icon\"\n [pathStyle]=\"{fill: isDisabled ? '#D9D9D9' : dropdownOpen ? 'var(--main-color)' : 'var(--component-color)'}\"\n ></biit-icon>\n </div>\n <div id=\"dropdown-label\"\n class=\"input-placeholder\"\n [class.disabled]=\"isDisabled\"\n [class.compact]=\"dropdownOpen || (currentValues?.length)\">\n {{ title }}\n <a *ngIf=\"isRequired\"\n [style.color]=\"currentValues.length ? null : 'red'\">*</a>\n </div>\n <div class=\"bottom-line\"\n [class.disabled]=\"isDisabled\"\n ></div>\n <span class=\"description\">{{ description }}</span>\n </div>\n</div>\n\n<!-- ICON MODE -->\n<button biit-icon *ngIf=\"type == 'icon'\"\n [icon]=\"icon\"\n (click)=\"!dropdownOpen ? openDropdown() : closeDropdown()\"\n [checked]=\"dropdownOpen\"\n [disabled]=\"isDisabled\"\n></button>\n\n<!-- DROPDOWN -->\n<div style=\"position: relative; height: 0; width: 100%\">\n <div #dropdown id=\"options\"\n [class.disabled]=\"isDisabled\"\n class=\"dropdown-list\"\n role=\"listbox\"\n aria-expanded=\"false\"\n aria-labelledby=\"dropdown-label\"\n [class.dropdown-open]=\"dropdownOpen\"\n [class.compact]=\"isCompact\"\n (keydown)=\"dropdownOpen && handleKeyboardEvents($event)\"\n >\n <biit-checkbox *ngFor=\"let item of filteredData; index as i\"\n [attr.id]=\"'option-' + (isPrimitive ? item : item[label])\"\n class=\"dropdown-item\"\n [class.selected]=\"currentValues && currentValues.includes(item)\"\n [ngModel]=\"currentValues && currentValues.includes(item)\"\n [description]=\"descriptionField && item[descriptionField]\"\n (click)=\"onModelChange(item); $event.stopPropagation(); $event.preventDefault();\"\n (keydown.enter)=\"onModelChange(item)\"\n (keydown.space)=\"onModelChange(item)\"\n [tabindex]=\"!dropdownOpen || isDisabled ? -1 : 0\"\n role=\"option\"\n aria-selected=\"false\"\n [disabled]=\"false\">\n {{ isPrimitive ? item : item[label] }}\n </biit-checkbox>\n <button *ngIf=\"!filteredData?.length\"\n class=\"dropdown-item no-results\"\n disabled\n >\n <a>No results found</a>\n </button>\n </div>\n</div>\n\n<div *ngIf=\"type == 'chips'\"\n class=\"chips\">\n <span\n *ngFor=\"let item of currentValues\"\n (click)=\"onModelChange(item)\"\n class=\"chips-item\"\n >\n {{ item[label] }}\n <biit-icon\n [name]=\"'cross_wide'\"\n [pathStyle]=\"{fill: '#ffffff'}\"\n ></biit-icon>\n </span>\n</div>\n", styles: ["*{box-sizing:border-box}input::selection{background-color:transparent}.biit-input{display:flex;min-width:12.8rem}.biit-input.compact{width:12.8rem}.input-container{position:relative;width:100%}.input-object{background-color:#fff;font-size:1rem;display:block;border:none;color:var(--component-color);padding:.7rem;height:2.1rem;width:100%;min-width:2.1rem;font-weight:400;cursor:pointer}.input-object:focus,.input-object:active,.input-object:hover{outline:none;background:var(--main-background)}.input-object:disabled{pointer-events:none;background-color:transparent;color:var(--main-background)}.default-cursor{cursor:auto}.input-placeholder{color:var(--component-color);font-size:1rem;font-weight:bolder;text-transform:uppercase;position:absolute;pointer-events:none;left:.7rem;top:.42rem;height:.7rem;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input-placeholder.compact{top:-.95rem;font-size:.7rem;font-weight:400;color:var(--secondary-color)}.input-placeholder.disabled{color:var(--main-background)}.input-show-icon{width:1rem;height:1rem}.input-show-icon-container{top:0;right:0;position:absolute;width:2.1rem;height:2.1rem;align-content:center;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transform:rotate(90deg);transition:transform .5s ease}.input-show-icon-container:hover,.input-show-icon-container:focus,.input-show-icon-container:focus-visible{border:none;outline:none}.input-show-icon-container:hover~.input-object{background:var(--main-background)}.input-show-icon-container.rotate-90{transform:rotate(-90deg)}.bottom-line{position:relative;top:-3px;margin-bottom:-3px;width:auto;height:3px;background:var(--component-color)}.bottom-line.disabled{background:var(--main-background)}.dropdown-list{background:white;position:absolute;z-index:2;box-sizing:border-box;border:3px solid black;margin-top:-3px;min-width:100%;width:100%;cursor:pointer;transform-origin:top;opacity:0;display:none;pointer-events:none;transform:translateY(var(--origin));transition:opacity .5s ease,transform .5s ease;max-height:20rem;overflow-y:auto;overflow-x:hidden}.dropdown-list.dropdown-open{opacity:1;pointer-events:auto;transform:translate(0)}.dropdown-list.compact{width:12.8rem}.dropdown-list.disabled{visibility:hidden}.dropdown-item{background:none;color:inherit;border:none;font:inherit;width:100%;cursor:pointer;line-height:1rem;min-height:1.4rem;display:flex;align-items:center;padding:.2rem .7rem}.dropdown-item:not(.no-results):hover,.dropdown-item:not(.no-results):focus-visible{outline:none;background:var(--hover-color);width:calc(100% + 6px);margin-left:-3px;padding-left:calc(.7rem + 3px)}.dropdown-item.no-results{justify-content:center;padding:1rem;color:#d9d9d9}.dropdown-item ::ng-deep label{width:100%;height:100%;cursor:pointer}.dropdown-item ::ng-deep label input[type=checkbox]{cursor:pointer;pointer-events:none}.passthrough{pointer-events:none}.grey-bg{background:var(--main-background)}.onwards{--origin: 1rem}.downwards{--origin: -1rem}.description{position:absolute;display:flex;align-items:center;font-size:.75em;color:gray;padding-top:.2em;min-height:1.05em;line-height:120%;font-style:italic}.chips{display:flex;flex-wrap:wrap;gap:2px;margin-top:2px}.chips .chips-item{font-size:.75rem;color:#fff;background:var(--main-color);padding:.25rem .75rem;position:relative;cursor:pointer}.chips .chips-item biit-icon{display:none}.chips .chips-item:hover biit-icon{display:block;height:100%;width:5px;position:absolute;top:0;right:4px}\n"], dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.BiitIconComponent, selector: "biit-icon", inputs: ["name", "svgStyle", "pathStyle"] }, { kind: "component", type: BiitCheckboxComponent, selector: "biit-checkbox", inputs: ["disabled", "description", "showAlwaysDescription"], outputs: ["onValueChange"] }, { kind: "component", type: i4.BiitIconButtonComponent, selector: "button[biit-icon]", inputs: ["icon", "checked"] }] });
799
+ ], ngImport: i0, template: "<!-- DEFAULT MODE -->\n<div *ngIf=\"type != 'icon'\"\n class=\"biit-input\" aria-haspopup=\"listbox\"\n [class.compact]=\"isCompact\"\n [class.disabled]=\"isDisabled\"\n (keydown)=\"!isDisabled && handleKeyboardEvents($event)\"\n (keydown.enter)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n (keydown.space)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n>\n <div class=\"input-container\" #input>\n <input [ngModel]=\"dropdownOpen ? filterText :\n currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n (ngModelChange)=\"filterText = $event; handleFilter()\"\n (click)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n (keydown.enter)=\"filterText.length ? onCreate.emit(filterText) : false; clearFilter();\"\n [placeholder]=\"dropdownOpen && currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n tabindex=\"0\"\n class=\"input-object\"\n [class.grey-bg]=\"dropdownOpen\"\n [class.default-cursor]=\"dropdownOpen\"\n [disabled]=\"isDisabled\"\n [readonly]=\"!dropdownOpen\"/>\n <div class=\"input-show-icon-container\" id=\"arrow\"\n [class.passthrough]=\"!dropdownOpen\"\n [class.rotate-90]=\"dropdownOpen\"\n (click)=\"dropdownOpen && closeDropdown()\">\n <biit-icon [name]=\"'right_arrow'\"\n class=\"input-show-icon\"\n [pathStyle]=\"{fill: isDisabled ? '#D9D9D9' : dropdownOpen ? 'var(--main-color)' : 'var(--component-color)'}\"\n ></biit-icon>\n </div>\n <div id=\"dropdown-label\"\n class=\"input-placeholder\"\n [class.disabled]=\"isDisabled\"\n [class.compact]=\"dropdownOpen || (currentValues?.length)\">\n {{ title }}\n <a *ngIf=\"isRequired\"\n [style.color]=\"currentValues.length ? null : 'red'\">*</a>\n </div>\n <div class=\"bottom-line\"\n [class.disabled]=\"isDisabled\"\n ></div>\n <span class=\"description\">{{ description }}</span>\n </div>\n</div>\n\n<!-- ICON MODE -->\n<button biit-icon *ngIf=\"type == 'icon'\"\n [icon]=\"icon\"\n (click)=\"!dropdownOpen ? openDropdown() : closeDropdown()\"\n [checked]=\"dropdownOpen\"\n [disabled]=\"isDisabled\"\n></button>\n\n<!-- DROPDOWN -->\n<div style=\"position: relative; height: 0; width: 100%\">\n <div #dropdown id=\"options\"\n [class.disabled]=\"isDisabled\"\n class=\"dropdown-list\"\n role=\"listbox\"\n aria-expanded=\"false\"\n aria-labelledby=\"dropdown-label\"\n [class.dropdown-open]=\"dropdownOpen\"\n [class.compact]=\"isCompact\"\n (keydown)=\"dropdownOpen && handleKeyboardEvents($event)\"\n >\n <biit-checkbox *ngFor=\"let item of filteredData; index as i\"\n [attr.id]=\"'option-' + (isPrimitive ? item : item[label])\"\n class=\"dropdown-item\"\n [class.selected]=\"currentValues && currentValues.includes(item)\"\n [ngModel]=\"currentValues && currentValues.includes(item)\"\n [description]=\"descriptionField && item[descriptionField]\"\n (click)=\"onModelChange(item); $event.stopPropagation(); $event.preventDefault();\"\n (keydown.enter)=\"onModelChange(item)\"\n (keydown.space)=\"onModelChange(item)\"\n [tabindex]=\"!dropdownOpen || isDisabled ? -1 : 0\"\n role=\"option\"\n aria-selected=\"false\"\n [disabled]=\"false\">\n {{ isPrimitive ? item : item[label] }}\n </biit-checkbox>\n <button *ngIf=\"!filteredData?.length\"\n class=\"dropdown-item no-results\"\n disabled\n >\n <a>No results found</a>\n </button>\n </div>\n</div>\n\n<div *ngIf=\"type == 'chips'\"\n class=\"chips\">\n <span\n *ngFor=\"let item of currentValues\"\n (click)=\"onModelChange(item)\"\n class=\"chips-item\"\n >\n {{ item[label] }}\n <biit-icon\n [name]=\"'cross_wide'\"\n [pathStyle]=\"{fill: '#ffffff'}\"\n ></biit-icon>\n </span>\n</div>\n", styles: ["*{box-sizing:border-box}input::selection{background-color:transparent}.biit-input{display:flex;min-width:12.8rem}.biit-input.compact{width:12.8rem}.input-container{position:relative;width:100%}.input-object{background-color:#fff;font-size:1rem;display:block;border:none;color:var(--component-color);padding:.7rem;height:2.1rem;width:100%;min-width:2.1rem;font-weight:400;cursor:pointer}.input-object:focus,.input-object:active,.input-object:hover{outline:none;background:var(--main-background)}.input-object:disabled{pointer-events:none;background-color:transparent;color:var(--main-background)}.default-cursor{cursor:auto}.input-placeholder{color:var(--component-color);font-size:1rem;font-weight:bolder;text-transform:uppercase;position:absolute;pointer-events:none;left:.7rem;top:.42rem;height:.7rem;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input-placeholder.compact{top:-.95rem;font-size:.7rem;font-weight:400;color:var(--secondary-color)}.input-placeholder.disabled{color:var(--main-background)}.input-show-icon{width:1rem;height:1rem}.input-show-icon-container{top:0;right:0;position:absolute;width:2.1rem;height:2.1rem;align-content:center;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transform:rotate(90deg);transition:transform .5s ease}.input-show-icon-container:hover,.input-show-icon-container:focus,.input-show-icon-container:focus-visible{border:none;outline:none}.input-show-icon-container:hover~.input-object{background:var(--main-background)}.input-show-icon-container.rotate-90{transform:rotate(-90deg)}.bottom-line{position:relative;top:-3px;margin-bottom:-3px;width:auto;height:3px;background:var(--component-color)}.bottom-line.disabled{background:var(--main-background)}.dropdown-list{background:var(--main-background);position:absolute;z-index:2;box-sizing:border-box;border:3px solid var(--border-color);margin-top:-3px;min-width:100%;width:100%;cursor:pointer;transform-origin:top;opacity:0;display:none;pointer-events:none;transform:translateY(var(--origin));transition:opacity .5s ease,transform .5s ease;max-height:20rem;overflow-y:auto;overflow-x:hidden}.dropdown-list.dropdown-open{opacity:1;pointer-events:auto;transform:translate(0)}.dropdown-list.compact{width:12.8rem}.dropdown-list.disabled{visibility:hidden}.dropdown-item{background:none;color:inherit;border:none;font:inherit;width:100%;cursor:pointer;line-height:1rem;min-height:1.4rem;display:flex;align-items:center;padding:.2rem .7rem}.dropdown-item:not(.no-results):hover,.dropdown-item:not(.no-results):focus-visible{outline:none;background:var(--hover-color);width:calc(100% + 6px);margin-left:-3px;padding-left:calc(.7rem + 3px)}.dropdown-item.no-results{justify-content:center;padding:1rem;color:#d9d9d9}.dropdown-item ::ng-deep label{width:100%;height:100%;cursor:pointer}.dropdown-item ::ng-deep label input[type=checkbox]{cursor:pointer;pointer-events:none}.passthrough{pointer-events:none}.grey-bg{background:var(--main-background)}.onwards{--origin: 1rem}.downwards{--origin: -1rem}.description{position:absolute;display:flex;align-items:center;font-size:.75em;color:var(--secondary-color);padding-top:.2em;min-height:1.05em;line-height:120%;font-style:italic}.chips{display:flex;flex-wrap:wrap;gap:2px;margin-top:2px}.chips .chips-item{font-size:.75rem;color:#fff;background:var(--main-color);padding:.25rem .75rem;position:relative;cursor:pointer}.chips .chips-item biit-icon{display:none}.chips .chips-item:hover biit-icon{display:block;height:100%;width:5px;position:absolute;top:0;right:4px}\n"], dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.BiitIconComponent, selector: "biit-icon", inputs: ["name", "svgStyle", "pathStyle"] }, { kind: "component", type: BiitCheckboxComponent, selector: "biit-checkbox", inputs: ["disabled", "description", "showAlwaysDescription"], outputs: ["onValueChange"] }, { kind: "component", type: i4.BiitIconButtonComponent, selector: "button[biit-icon]", inputs: ["icon", "checked"] }] });
800
800
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: BiitMultiselectComponent, decorators: [{
801
801
  type: Component,
802
802
  args: [{ selector: 'biit-multiselect', providers: [
@@ -807,7 +807,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
807
807
  }
808
808
  ], host: {
809
809
  '(document:pointerdown)': 'handleMouseEvents($event)'
810
- }, template: "<!-- DEFAULT MODE -->\n<div *ngIf=\"type != 'icon'\"\n class=\"biit-input\" aria-haspopup=\"listbox\"\n [class.compact]=\"isCompact\"\n [class.disabled]=\"isDisabled\"\n (keydown)=\"!isDisabled && handleKeyboardEvents($event)\"\n (keydown.enter)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n (keydown.space)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n>\n <div class=\"input-container\" #input>\n <input [ngModel]=\"dropdownOpen ? filterText :\n currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n (ngModelChange)=\"filterText = $event; handleFilter()\"\n (click)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n (keydown.enter)=\"filterText.length ? onCreate.emit(filterText) : false; clearFilter();\"\n [placeholder]=\"dropdownOpen && currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n tabindex=\"0\"\n class=\"input-object\"\n [class.grey-bg]=\"dropdownOpen\"\n [class.default-cursor]=\"dropdownOpen\"\n [disabled]=\"isDisabled\"\n [readonly]=\"!dropdownOpen\"/>\n <div class=\"input-show-icon-container\" id=\"arrow\"\n [class.passthrough]=\"!dropdownOpen\"\n [class.rotate-90]=\"dropdownOpen\"\n (click)=\"dropdownOpen && closeDropdown()\">\n <biit-icon [name]=\"'right_arrow'\"\n class=\"input-show-icon\"\n [pathStyle]=\"{fill: isDisabled ? '#D9D9D9' : dropdownOpen ? 'var(--main-color)' : 'var(--component-color)'}\"\n ></biit-icon>\n </div>\n <div id=\"dropdown-label\"\n class=\"input-placeholder\"\n [class.disabled]=\"isDisabled\"\n [class.compact]=\"dropdownOpen || (currentValues?.length)\">\n {{ title }}\n <a *ngIf=\"isRequired\"\n [style.color]=\"currentValues.length ? null : 'red'\">*</a>\n </div>\n <div class=\"bottom-line\"\n [class.disabled]=\"isDisabled\"\n ></div>\n <span class=\"description\">{{ description }}</span>\n </div>\n</div>\n\n<!-- ICON MODE -->\n<button biit-icon *ngIf=\"type == 'icon'\"\n [icon]=\"icon\"\n (click)=\"!dropdownOpen ? openDropdown() : closeDropdown()\"\n [checked]=\"dropdownOpen\"\n [disabled]=\"isDisabled\"\n></button>\n\n<!-- DROPDOWN -->\n<div style=\"position: relative; height: 0; width: 100%\">\n <div #dropdown id=\"options\"\n [class.disabled]=\"isDisabled\"\n class=\"dropdown-list\"\n role=\"listbox\"\n aria-expanded=\"false\"\n aria-labelledby=\"dropdown-label\"\n [class.dropdown-open]=\"dropdownOpen\"\n [class.compact]=\"isCompact\"\n (keydown)=\"dropdownOpen && handleKeyboardEvents($event)\"\n >\n <biit-checkbox *ngFor=\"let item of filteredData; index as i\"\n [attr.id]=\"'option-' + (isPrimitive ? item : item[label])\"\n class=\"dropdown-item\"\n [class.selected]=\"currentValues && currentValues.includes(item)\"\n [ngModel]=\"currentValues && currentValues.includes(item)\"\n [description]=\"descriptionField && item[descriptionField]\"\n (click)=\"onModelChange(item); $event.stopPropagation(); $event.preventDefault();\"\n (keydown.enter)=\"onModelChange(item)\"\n (keydown.space)=\"onModelChange(item)\"\n [tabindex]=\"!dropdownOpen || isDisabled ? -1 : 0\"\n role=\"option\"\n aria-selected=\"false\"\n [disabled]=\"false\">\n {{ isPrimitive ? item : item[label] }}\n </biit-checkbox>\n <button *ngIf=\"!filteredData?.length\"\n class=\"dropdown-item no-results\"\n disabled\n >\n <a>No results found</a>\n </button>\n </div>\n</div>\n\n<div *ngIf=\"type == 'chips'\"\n class=\"chips\">\n <span\n *ngFor=\"let item of currentValues\"\n (click)=\"onModelChange(item)\"\n class=\"chips-item\"\n >\n {{ item[label] }}\n <biit-icon\n [name]=\"'cross_wide'\"\n [pathStyle]=\"{fill: '#ffffff'}\"\n ></biit-icon>\n </span>\n</div>\n", styles: ["*{box-sizing:border-box}input::selection{background-color:transparent}.biit-input{display:flex;min-width:12.8rem}.biit-input.compact{width:12.8rem}.input-container{position:relative;width:100%}.input-object{background-color:#fff;font-size:1rem;display:block;border:none;color:var(--component-color);padding:.7rem;height:2.1rem;width:100%;min-width:2.1rem;font-weight:400;cursor:pointer}.input-object:focus,.input-object:active,.input-object:hover{outline:none;background:var(--main-background)}.input-object:disabled{pointer-events:none;background-color:transparent;color:var(--main-background)}.default-cursor{cursor:auto}.input-placeholder{color:var(--component-color);font-size:1rem;font-weight:bolder;text-transform:uppercase;position:absolute;pointer-events:none;left:.7rem;top:.42rem;height:.7rem;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input-placeholder.compact{top:-.95rem;font-size:.7rem;font-weight:400;color:var(--secondary-color)}.input-placeholder.disabled{color:var(--main-background)}.input-show-icon{width:1rem;height:1rem}.input-show-icon-container{top:0;right:0;position:absolute;width:2.1rem;height:2.1rem;align-content:center;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transform:rotate(90deg);transition:transform .5s ease}.input-show-icon-container:hover,.input-show-icon-container:focus,.input-show-icon-container:focus-visible{border:none;outline:none}.input-show-icon-container:hover~.input-object{background:var(--main-background)}.input-show-icon-container.rotate-90{transform:rotate(-90deg)}.bottom-line{position:relative;top:-3px;margin-bottom:-3px;width:auto;height:3px;background:var(--component-color)}.bottom-line.disabled{background:var(--main-background)}.dropdown-list{background:white;position:absolute;z-index:2;box-sizing:border-box;border:3px solid black;margin-top:-3px;min-width:100%;width:100%;cursor:pointer;transform-origin:top;opacity:0;display:none;pointer-events:none;transform:translateY(var(--origin));transition:opacity .5s ease,transform .5s ease;max-height:20rem;overflow-y:auto;overflow-x:hidden}.dropdown-list.dropdown-open{opacity:1;pointer-events:auto;transform:translate(0)}.dropdown-list.compact{width:12.8rem}.dropdown-list.disabled{visibility:hidden}.dropdown-item{background:none;color:inherit;border:none;font:inherit;width:100%;cursor:pointer;line-height:1rem;min-height:1.4rem;display:flex;align-items:center;padding:.2rem .7rem}.dropdown-item:not(.no-results):hover,.dropdown-item:not(.no-results):focus-visible{outline:none;background:var(--hover-color);width:calc(100% + 6px);margin-left:-3px;padding-left:calc(.7rem + 3px)}.dropdown-item.no-results{justify-content:center;padding:1rem;color:#d9d9d9}.dropdown-item ::ng-deep label{width:100%;height:100%;cursor:pointer}.dropdown-item ::ng-deep label input[type=checkbox]{cursor:pointer;pointer-events:none}.passthrough{pointer-events:none}.grey-bg{background:var(--main-background)}.onwards{--origin: 1rem}.downwards{--origin: -1rem}.description{position:absolute;display:flex;align-items:center;font-size:.75em;color:gray;padding-top:.2em;min-height:1.05em;line-height:120%;font-style:italic}.chips{display:flex;flex-wrap:wrap;gap:2px;margin-top:2px}.chips .chips-item{font-size:.75rem;color:#fff;background:var(--main-color);padding:.25rem .75rem;position:relative;cursor:pointer}.chips .chips-item biit-icon{display:none}.chips .chips-item:hover biit-icon{display:block;height:100%;width:5px;position:absolute;top:0;right:4px}\n"] }]
810
+ }, template: "<!-- DEFAULT MODE -->\n<div *ngIf=\"type != 'icon'\"\n class=\"biit-input\" aria-haspopup=\"listbox\"\n [class.compact]=\"isCompact\"\n [class.disabled]=\"isDisabled\"\n (keydown)=\"!isDisabled && handleKeyboardEvents($event)\"\n (keydown.enter)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n (keydown.space)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n>\n <div class=\"input-container\" #input>\n <input [ngModel]=\"dropdownOpen ? filterText :\n currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n (ngModelChange)=\"filterText = $event; handleFilter()\"\n (click)=\"!dropdownOpen && !isDisabled && openDropdown()\"\n (keydown.enter)=\"filterText.length ? onCreate.emit(filterText) : false; clearFilter();\"\n [placeholder]=\"dropdownOpen && currentValues && currentValues.length ? currentValues.length + ' selected' : ''\"\n tabindex=\"0\"\n class=\"input-object\"\n [class.grey-bg]=\"dropdownOpen\"\n [class.default-cursor]=\"dropdownOpen\"\n [disabled]=\"isDisabled\"\n [readonly]=\"!dropdownOpen\"/>\n <div class=\"input-show-icon-container\" id=\"arrow\"\n [class.passthrough]=\"!dropdownOpen\"\n [class.rotate-90]=\"dropdownOpen\"\n (click)=\"dropdownOpen && closeDropdown()\">\n <biit-icon [name]=\"'right_arrow'\"\n class=\"input-show-icon\"\n [pathStyle]=\"{fill: isDisabled ? '#D9D9D9' : dropdownOpen ? 'var(--main-color)' : 'var(--component-color)'}\"\n ></biit-icon>\n </div>\n <div id=\"dropdown-label\"\n class=\"input-placeholder\"\n [class.disabled]=\"isDisabled\"\n [class.compact]=\"dropdownOpen || (currentValues?.length)\">\n {{ title }}\n <a *ngIf=\"isRequired\"\n [style.color]=\"currentValues.length ? null : 'red'\">*</a>\n </div>\n <div class=\"bottom-line\"\n [class.disabled]=\"isDisabled\"\n ></div>\n <span class=\"description\">{{ description }}</span>\n </div>\n</div>\n\n<!-- ICON MODE -->\n<button biit-icon *ngIf=\"type == 'icon'\"\n [icon]=\"icon\"\n (click)=\"!dropdownOpen ? openDropdown() : closeDropdown()\"\n [checked]=\"dropdownOpen\"\n [disabled]=\"isDisabled\"\n></button>\n\n<!-- DROPDOWN -->\n<div style=\"position: relative; height: 0; width: 100%\">\n <div #dropdown id=\"options\"\n [class.disabled]=\"isDisabled\"\n class=\"dropdown-list\"\n role=\"listbox\"\n aria-expanded=\"false\"\n aria-labelledby=\"dropdown-label\"\n [class.dropdown-open]=\"dropdownOpen\"\n [class.compact]=\"isCompact\"\n (keydown)=\"dropdownOpen && handleKeyboardEvents($event)\"\n >\n <biit-checkbox *ngFor=\"let item of filteredData; index as i\"\n [attr.id]=\"'option-' + (isPrimitive ? item : item[label])\"\n class=\"dropdown-item\"\n [class.selected]=\"currentValues && currentValues.includes(item)\"\n [ngModel]=\"currentValues && currentValues.includes(item)\"\n [description]=\"descriptionField && item[descriptionField]\"\n (click)=\"onModelChange(item); $event.stopPropagation(); $event.preventDefault();\"\n (keydown.enter)=\"onModelChange(item)\"\n (keydown.space)=\"onModelChange(item)\"\n [tabindex]=\"!dropdownOpen || isDisabled ? -1 : 0\"\n role=\"option\"\n aria-selected=\"false\"\n [disabled]=\"false\">\n {{ isPrimitive ? item : item[label] }}\n </biit-checkbox>\n <button *ngIf=\"!filteredData?.length\"\n class=\"dropdown-item no-results\"\n disabled\n >\n <a>No results found</a>\n </button>\n </div>\n</div>\n\n<div *ngIf=\"type == 'chips'\"\n class=\"chips\">\n <span\n *ngFor=\"let item of currentValues\"\n (click)=\"onModelChange(item)\"\n class=\"chips-item\"\n >\n {{ item[label] }}\n <biit-icon\n [name]=\"'cross_wide'\"\n [pathStyle]=\"{fill: '#ffffff'}\"\n ></biit-icon>\n </span>\n</div>\n", styles: ["*{box-sizing:border-box}input::selection{background-color:transparent}.biit-input{display:flex;min-width:12.8rem}.biit-input.compact{width:12.8rem}.input-container{position:relative;width:100%}.input-object{background-color:#fff;font-size:1rem;display:block;border:none;color:var(--component-color);padding:.7rem;height:2.1rem;width:100%;min-width:2.1rem;font-weight:400;cursor:pointer}.input-object:focus,.input-object:active,.input-object:hover{outline:none;background:var(--main-background)}.input-object:disabled{pointer-events:none;background-color:transparent;color:var(--main-background)}.default-cursor{cursor:auto}.input-placeholder{color:var(--component-color);font-size:1rem;font-weight:bolder;text-transform:uppercase;position:absolute;pointer-events:none;left:.7rem;top:.42rem;height:.7rem;transition:.2s ease all;-moz-transition:.2s ease all;-webkit-transition:.2s ease all}.input-placeholder.compact{top:-.95rem;font-size:.7rem;font-weight:400;color:var(--secondary-color)}.input-placeholder.disabled{color:var(--main-background)}.input-show-icon{width:1rem;height:1rem}.input-show-icon-container{top:0;right:0;position:absolute;width:2.1rem;height:2.1rem;align-content:center;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transform:rotate(90deg);transition:transform .5s ease}.input-show-icon-container:hover,.input-show-icon-container:focus,.input-show-icon-container:focus-visible{border:none;outline:none}.input-show-icon-container:hover~.input-object{background:var(--main-background)}.input-show-icon-container.rotate-90{transform:rotate(-90deg)}.bottom-line{position:relative;top:-3px;margin-bottom:-3px;width:auto;height:3px;background:var(--component-color)}.bottom-line.disabled{background:var(--main-background)}.dropdown-list{background:var(--main-background);position:absolute;z-index:2;box-sizing:border-box;border:3px solid var(--border-color);margin-top:-3px;min-width:100%;width:100%;cursor:pointer;transform-origin:top;opacity:0;display:none;pointer-events:none;transform:translateY(var(--origin));transition:opacity .5s ease,transform .5s ease;max-height:20rem;overflow-y:auto;overflow-x:hidden}.dropdown-list.dropdown-open{opacity:1;pointer-events:auto;transform:translate(0)}.dropdown-list.compact{width:12.8rem}.dropdown-list.disabled{visibility:hidden}.dropdown-item{background:none;color:inherit;border:none;font:inherit;width:100%;cursor:pointer;line-height:1rem;min-height:1.4rem;display:flex;align-items:center;padding:.2rem .7rem}.dropdown-item:not(.no-results):hover,.dropdown-item:not(.no-results):focus-visible{outline:none;background:var(--hover-color);width:calc(100% + 6px);margin-left:-3px;padding-left:calc(.7rem + 3px)}.dropdown-item.no-results{justify-content:center;padding:1rem;color:#d9d9d9}.dropdown-item ::ng-deep label{width:100%;height:100%;cursor:pointer}.dropdown-item ::ng-deep label input[type=checkbox]{cursor:pointer;pointer-events:none}.passthrough{pointer-events:none}.grey-bg{background:var(--main-background)}.onwards{--origin: 1rem}.downwards{--origin: -1rem}.description{position:absolute;display:flex;align-items:center;font-size:.75em;color:var(--secondary-color);padding-top:.2em;min-height:1.05em;line-height:120%;font-style:italic}.chips{display:flex;flex-wrap:wrap;gap:2px;margin-top:2px}.chips .chips-item{font-size:.75rem;color:#fff;background:var(--main-color);padding:.25rem .75rem;position:relative;cursor:pointer}.chips .chips-item biit-icon{display:none}.chips .chips-item:hover biit-icon{display:block;height:100%;width:5px;position:absolute;top:0;right:4px}\n"] }]
811
811
  }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.IterableDiffers }]; }, propDecorators: { title: [{
812
812
  type: Input
813
813
  }], type: [{