@disane/ngx-taskboard/bundles/disane-ngx-taskboard.umd.min.js

Yet another angular taskboard

!function(t,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("@angular/core"),require("@angular/forms"),require("@angular/platform-browser"),require("@angular/platform-browser/animations"),require("rxjs"),require("@fortawesome/angular-fontawesome"),require("@fortawesome/free-brands-svg-icons"),require("@fortawesome/free-regular-svg-icons"),require("@fortawesome/free-solid-svg-icons"),require("rxjs/operators")):"function"==typeof define&&define.amd?define("@disane/ngx-taskboard",["exports","@angular/core","@angular/forms","@angular/platform-browser","@angular/platform-browser/animations","rxjs","@fortawesome/angular-fontawesome","@fortawesome/free-brands-svg-icons","@fortawesome/free-regular-svg-icons","@fortawesome/free-solid-svg-icons","rxjs/operators"],o):o(((t="undefined"!=typeof globalThis?globalThis:t||self).disane=t.disane||{},t.disane["ngx-taskboard"]={}),t.ng.core,t.ng.forms,t.ng.platformBrowser,t.ng.platformBrowser.animations,t.rxjs,t.angularFontawesome,t.freeBrandsSvgIcons,t.freeRegularSvgIcons,t.freeSolidSvgIcons,t.rxjs.operators)}(this,(function(t,o,e,r,n,a,i,l,d,m,s){"use strict";
/*! *****************************************************************************
    Copyright (c) Microsoft Corporation.

    Permission to use, copy, modify, and/or distribute this software for any
    purpose with or without fee is hereby granted.

    THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
    REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
    AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
    INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
    LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
    OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
    PERFORMANCE OF THIS SOFTWARE.
    ***************************************************************************** */Object.create;function c(t,o){var e="function"==typeof Symbol&&t[Symbol.iterator];if(!e)return t;var r,n,a=e.call(t),i=[];try{for(;(void 0===o||o-- >0)&&!(r=a.next()).done;)i.push(r.value)}catch(t){n={error:t}}finally{try{r&&!r.done&&(e=a.return)&&e.call(a)}finally{if(n)throw n.error}}return i}Object.create;var p=function(){this.filterChanged$=new o.EventEmitter,this.objectProperties=[]};p.decorators=[{type:o.Injectable,args:[{providedIn:"root"}]}],p.ɵprov=o.ɵɵdefineInjectable({factory:function(){return new p},token:p,providedIn:"root"});var g=function(){function t(t,e,r,n,a){this.renderer=t,this.elRef=e,this.cd=r,this.taskboardService=n,this.ngZone=a,this.showBacklog=!0,this.backlogName="Backlog",this.hGroupKeys=[],this.vGroupKeys=[],this.hAddNewItems=!0,this.vAddNewItems=!0,this.cellAddNewItems=!0,this.vGroupKey="",this.hGroupKey="",this.sortBy="",this.boardName="",this.invertGroupDirection=!1,this.showUngroupedInBacklog=!0,this.smallText=!1,this.itemTemplate=null,this.noElementsTemplate=null,this.hHeaderTemplate=null,this.vHeaderTemplate=null,this.actionsTemplate=null,this.dragoverPlaceholderTemplate=null,this.addIconTemplate=null,this.collapseIconTemplate=null,this.expandIconTemplate=null,this.vHeaderClass="card-header",this.hHeaderClass="card-header card-header-bg",this.stickyHorizontalHeaderKeys=!0,this.stickyVerticalHeaderKeys=!1,this.cellClass="card-header",this.columnWidth=200,this.backlogWidth=this.columnWidth+"px",this.vCollapsable=!0,this.vCollapsed=!1,this.hCollapsed=!1,this.showFilterRow=!0,this.filterRowPlaceholder="Search for items",this.filter="",this.filterOnProperties=[],this.initialCollapseState=[],this.dragStarted=new o.EventEmitter,this.dropped=new o.EventEmitter,this.elementCreateClick=new o.EventEmitter,this.headingCollapsed=new o.EventEmitter,this.isScrolling=new o.EventEmitter,this.scrolledToEnd=new o.EventEmitter,this.scrollEnded=new o.EventEmitter,this.hHeadings=[],this.vHeadings=[],this.scrollable=!1,this.verticalScrolling=!1,this.horizontalScrolling=!1,this._items=[],this.collapseStates=[],this.placeholderSet=!1,this.isScrollingTimeout=0,this.scrollableContainer=".column-cards"}return Object.defineProperty(t.prototype,"items",{get:function(){return this._items},set:function(t){this._items=t,t.length>0&&this.prepareBoard()},enumerable:!1,configurable:!0}),t.prototype.onResize=function(){this.checkIfContentNeedsToScroll()},t.prototype.ngOnInit=function(){this.items.length>0&&this.prepareBoard()},t.prototype.executeChangeDetection=function(){this.cd.detectChanges()},t.prototype.ngDoCheck=function(){},t.prototype.ngAfterViewInit=function(){},t.prototype.checkIfContentNeedsToScroll=function(){var t=this,o=this.containerIsScrollable(this.scrollableContainer),e=o.hScroll,r=o.vScroll;this.horizontalScrolling=e,this.verticalScrolling=r,this.scrollable=r||e,this.scrollStates&&(this.horizontalScrolling||this.verticalScrolling)&&setTimeout((function(){t.restoreScrollState(e,r,t.scrollStates)&&(t.scrollStates=null)}),500)},t.prototype.prepareBoard=function(){var t=this;this.checkPrerequisites().then((function(){var o;t.generateHeadings(),(o=t.collapseStates).push.apply(o,function(){for(var t=[],o=0;o<arguments.length;o++)t=t.concat(c(arguments[o]));return t}(t.generateCollapseStates(t.hHeadings,"h"),t.generateCollapseStates(t.vHeadings,"v"))),t.matchAndSetInitialCollapseState(),t.taskboardService.filterChanged$.subscribe((function(o){return t.filter=o})),t.checkIfContentNeedsToScroll(),t.executeChangeDetection()}))},t.prototype.restoreScrollState=function(t,o,e){var r=this.elRef.nativeElement.querySelector(this.scrollableContainer);return!(!r||!e)&&(o&&(r.scrollTop=e.scrollTop),t&&(r.scrollLeft=e.scrollLeft),!0)},t.prototype.matchAndSetInitialCollapseState=function(){var t=this;this.initialCollapseState.forEach((function(o){var e=t.collapseStates.find((function(t){return t.name.toLowerCase()===o.name.toLowerCase()}));e&&e.collapsed!==o.collapsed&&(e.collapsed=o.collapsed)}))},t.prototype.checkPrerequisites=function(){if(this.checkIfPropIsObject(this.hGroupKeys[0])&&!this.hGroupKeys.every((function(t){return null!=t.value})))throw new Error("Column headers are objects but field 'value' is missing in one or more items.");if(this.checkIfPropIsObject(this.vGroupKeys[0])&&!this.vGroupKeys.every((function(t){return null!=t.value})))throw new Error("Row headers are objects but field 'value' is missing in one or more items.");return Promise.resolve(!0)},t.prototype.checkIfPropIsObject=function(t){return"object"==typeof t},t.prototype.generateHeadings=function(){if(this.invertGroupDirection){var t=this.vGroupKey,o=this.hGroupKey;this.hGroupKey=t,this.vGroupKey=o}this.vHeadings=this.getHeadings(this.vGroupKeys,this.vGroupKey),this.hHeadings=this.getHeadings(this.hGroupKeys,this.hGroupKey)},t.prototype.generateCollapseStates=function(t,o){var e=this;return t.map((function(t){return{name:e.getValue(t),collapsed:"h"===o?e.hCollapsed:e.vCollapsed}}))},t.prototype.getItemsOfGroup=function(t,o){var e=this,r=this.items.filter((function(r){0===e.taskboardService.objectProperties.length&&(e.taskboardService.objectProperties=Object.keys(r));var n=e.determineCorrectGroupKeys(),a=e.getValue(r[n.vGroupKey]),i=e.getValue(r[n.hGroupKey]);return void 0!==i&&(void 0!==i||void 0!==a)&&void 0!==a&&(a.toString().toLowerCase()===t.toString().toLowerCase()&&i.toString().toLowerCase()===o.toString().toLowerCase())}));if(this.showUngroupedInBacklog&&(r=r.filter((function(t){return""!==t[e.vGroupKey]&&""!==t[e.hGroupKey]}))),""!==this.sortBy){var n=typeof r.some((function(){return void 0!==r[0][e.sortBy]&&null!==r[0][e.sortBy]}))[this.sortBy];n&&(r=r.sort((function(t,o){var r=t[e.sortBy],a=o[e.sortBy];return"number"===n?a-r:"string"===n?r<a?-1:r>a?1:0:void 0})))}return""!==this.filter?r.filter((function(t){return(e.filterOnProperties.length>0?e.filterOnProperties:Object.keys(t)).some((function(o){return null!==t[o]&&"number"!=typeof t[o]&&t[o].indexOf(e.filter)>-1}))})):r},t.prototype.toggleCollapseGroup=function(t,o){var e=this;this.ngZone.runOutsideAngular((function(){var r=e.collapseStates.filter((function(o){return("vertical"===t?e.vHeadings:e.hHeadings).some((function(t){return e.getValue(t).toString().toLowerCase()===o.name.toString().toLowerCase()}))}));r.forEach((function(t){return t.collapsed=!o})),r.length>0&&("vertical"===t?e.vCollapsed=!o:e.hCollapsed=!o),e.headingCollapsed.emit({group:t,collapsed:!o,overallCollapseState:e.collapseStates})})),setTimeout((function(){e.executeChangeDetection(),e.checkIfContentNeedsToScroll()}),100)},t.prototype.getValue=function(t){return t?t.value?t.value:t:""},t.prototype.determineCorrectGroupKeys=function(){return{hGroupKey:this.getCaseInsensitivePropKey(this.items[0],this.hGroupKey),vGroupKey:this.getCaseInsensitivePropKey(this.items[0],this.vGroupKey)}},t.prototype.getCaseInsensitivePropKey=function(t,o){return t?Object.keys(t).find((function(t){return""!==t&&void 0!==t&&void 0!==t&&t.toLowerCase()===o.toLowerCase()})):""},t.prototype.getHeadingsFromItems=function(t){var o=this;return void 0===t&&(t=this.vGroupKey),this.items.map((function(o){return o[Object.keys(o).find((function(o){return o.toLowerCase()===t.toLowerCase()}))]})).filter((function(t,e,r){return r.indexOf(t)===e&&o.showUngroupedInBacklog&&""!==t&&void 0!==t}))},t.prototype.getUngroupedItems=function(){var t=this;return this.showUngroupedInBacklog?this.items.filter((function(o){var e=t.determineCorrectGroupKeys();return""===o[e.vGroupKey]&&""===o[e.hGroupKey]||null===o[e.vGroupKey]&&null===o[e.hGroupKey]})):[]},t.prototype.toggleCollapse=function(t){var o=this;this.ngZone.runOutsideAngular((function(){var e=o.getValue(t.hGroup||t.vGroup),r=o.collapseState(e);o.collapseStates.find((function(t){return t.name===e})).collapsed=!r,o.headingCollapsed.emit({group:t.hGroup||t.vGroup,collapsed:!r,overallCollapseState:o.collapseStates})})),a.timer(100).subscribe((function(t){o.executeChangeDetection(),o.checkIfContentNeedsToScroll()}))},t.prototype.collapseState=function(t){var o=this;"object"==typeof t&&(t=t.value);var e=this.collapseStates.find((function(e){return e.name===o.getValue(t)}));return!!e&&e.collapsed},t.prototype.dragStart=function(t,o){this.dragItem=o,this.nativeDragItem=t.currentTarget,this.dragStarted.emit(this.dragItem),this.cd.detach()},t.prototype.dragEnd=function(){this.dragItem=void 0},t.prototype.createElement=function(t){this.elementCreateClick.emit(t)},t.prototype.drop=function(t,o,e){if(t.preventDefault(),t.currentTarget){var r=t.currentTarget.querySelector(".placeholder");r&&this.renderer.removeChild(r.parentNode,r),this.currentDragZone="",this.placeholderSet=!1}var n=this.determineCorrectGroupKeys(),a=Object.assign({},this.dragItem);this.dragItem[n.vGroupKey]=this.getValue(o),this.dragItem[n.hGroupKey]=this.getValue(e),this.dropped.emit({hGroup:e,vGroup:o,item:this.dragItem,itemBeforeChange:a,nativeItemElement:this.nativeDragItem}),this.dragItem=void 0,this.cd.reattach(),this.executeChangeDetection()},t.prototype.dragOver=function(t,o,e){if(this.dragItem){if(t.preventDefault(),void 0===o&&(o=""),void 0===e&&(e=""),((o=this.getValue(o).toString())+"-"+(e=this.getValue(e).toString()).replace(" ","")).toLowerCase()!==this.currentDragZone&&""!==this.currentDragZone){var r=document.getElementById(this.currentDragZone);r&&(this.renderer.removeChild(r.parentNode,r),this.placeholderSet=!1)}if(this.currentDragZone=(o+"-"+e.replace(" ","")).toLowerCase(),!this.placeholderSet){var n=this.createPlaceholderElement();this.renderer.appendChild(t.currentTarget,n),this.placeholderSet=!0}}},t.prototype.containerIsScrollable=function(t){var o=this.elRef.nativeElement.querySelector(t);return o?{hScroll:o.scrollWidth>o.clientWidth,vScroll:o.scrollHeight>o.clientHeight}:null},t.prototype.scrollBarStyle=function(){return{"padding-right":this.calculateScrollBarWidth()+"px"}},t.prototype.getColumnWidth=function(){return this.scrollable?{"min-width":this.columnWidth+"px"}:{}},t.prototype.calculateScrollBarWidth=function(){return this.elRef.nativeElement.querySelector(".headings").clientWidth-this.elRef.nativeElement.querySelector(".row-content").clientWidth},t.prototype.createPlaceholderElement=function(){if(this.dragoverPlaceholderTemplate)return this.dragoverPlaceholderTemplate.elementRef.nativeElement.cloneNode(!0);var t=this.renderer.createElement("div");return this.renderer.setStyle(t,"border","1px dashed gray"),this.renderer.setStyle(t,"width","100%"),this.renderer.setStyle(t,"height","50px"),this.renderer.setAttribute(t,"id",this.currentDragZone),this.renderer.setAttribute(t,"class","placeholder"),t},t.prototype.getHeadings=function(t,o){return t.length>0&&""!==t[0].value?t.sort((function(t,o){return t.orderId-o.orderId})):this.getHeadingsFromItems(o)},t.prototype.scrolling=function(t){var o=this,e=t.currentTarget;this.detectIfUserHasEndedScrolling().then((function(){var t=o.getScrollState(e);t.hasReachedEnd=!1,t.isScrolling=!1,Math.round(t.distance)!==Math.round(t.maxDistance)?(t.hasReachedEnd=!1,o.scrollEnded.emit(t)):(t.hasReachedEnd=!0,o.scrolledToEnd.emit(t),o.scrollEnded.emit(t))}));var r=this.getScrollState(e);r.hasReachedEnd=!1,r.isScrolling=!0,this.isScrolling.emit(r)},t.prototype.getScrollState=function(t){var o=t.scrollTop>0?"y":"x";return{axis:o,distance:"y"===o?t.scrollTop:t.scrollWidth,maxDistance:"y"===o?t.scrollHeight-t.clientHeight:t.scrollWidth-t.clientWidth}},t.prototype.detectIfUserHasEndedScrolling=function(){var t=this;return new Promise((function(o){window.clearTimeout(t.isScrollingTimeout),t.isScrollingTimeout=window.setTimeout((function(){return o(!0)}),66)}))},t}();g.decorators=[{type:o.Component,args:[{selector:"ngx-taskboard",template:'<div class="h-100 d-flex flex-column align-items-stretch border-0" [class.small]="smallText" style="overflow: hidden">\n\t<ngx-taskboard-filter-search-bar [placeholder]="filterRowPlaceholder"></ngx-taskboard-filter-search-bar>\n\t\n\t<div class="d-flex flex-row align-items-stretch flex-fill overflow-y-auto">\n\t\t<ng-container *ngTemplateOutlet="backlogColumn"></ng-container>\n\n\t\t<div class="column-cards d-flex flex-column flex-fill " [class.overflow-x-auto]="horizontalScrolling"\n\t\t\t[class.overflow-y-auto]="verticalScrolling" (outSideEventHandler)="scrolling($event)"\n\t\t\t[class.border-bottom]="(scrollable && verticalScrolling)">\n\n\t\t\t<ng-container *ngTemplateOutlet="columnHeadings"></ng-container>\n\n\t\t\t<div class="d-flex flex-column row-content flex-fill align-items-stretch"\n\t\t\t\t[class.flex-fill]="!(scrollable && verticalScrolling)">\n\t\t\t\t<ng-container *ngFor="let vGroup of vHeadings">\n\n\t\t\t\t\t<div class="d-flex flex-row taskboard-row" [class.collapsed]="!collapseState(vGroup)" [class.flex-fill]="!collapseState(vGroup)">\n\t\t\t\t\t\t<ng-container *ngTemplateOutlet="rowHeadings; context: { vGroup: vGroup }"></ng-container>\n\n\t\t\t\t\t\t<ng-container *ngFor="let hGroup of hHeadings; let hLast = last">\n\n\t\t\t\t\t\t\t<ng-container\n\t\t\t\t\t\t\t\t*ngTemplateOutlet="cellItem; context: { hGroup: hGroup, vGroup: vGroup, hLast: hLast } ">\n\t\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t</div>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</div>\n\n\x3c!-- Templates --\x3e\n<ng-template #cardAction let-withNew="withNew" let-group="group" let-collapsed="collapsed"\n\tlet-collapser="collapser">\n\n\t<ng-container [ngIf]="actionsTemplate"\n\t\t*ngTemplateOutlet="actionsTemplate; context: { actionConfig: { group: group, collapsed: collapsed, collapser: collapser  }  }">\n\t</ng-container>\n\n\t<ng-container *ngIf="!actionsTemplate">\n\t\t<div class="actions ml-3" *ngIf="vGroupKey">\n\n\t\t\t<div class="new-action" *ngIf="withNew" (click)="createElement(group)">\n\t\t\t\t<ng-container *ngTemplateOutlet="addIcon"></ng-container>\n\t\t\t</div>\n\n\t\t\t<div class="collapse-action" *ngIf="(collapser != null ? collapser : true)" (click)="toggleCollapse(group)">\n\t\t\t\t<ng-container *ngIf="collapsed">\n\t\t\t\t\t<ng-container *ngTemplateOutlet="expandIconTemplate"></ng-container>\n\t\t\t\t</ng-container>\n\n\t\t\t\t<ng-container *ngIf="!collapsed">\n\t\t\t\t\t<ng-container *ngTemplateOutlet="collapseIconTemplate"></ng-container>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t\t\n\t\t\t\x3c!-- <fa-icon [icon]="[\'fas\',\'plus-square\']" [fixedWidth]="true" >\n\t\t\t</fa-icon> --\x3e\n\t\t\t\x3c!-- <fa-icon [icon]="[\'fas\',chevronIcon ? chevronIcon : \'chevron-left\']" [fixedWidth]="true"\n\t\t\t\t(click)="toggleCollapse(group)" *ngIf="(collapser != null ? collapser : true)"></fa-icon> --\x3e\n\t\t</div>\n\t</ng-container>\n</ng-template>\n\n<ng-template #defaultItemTemplate let-item="item">\n\t<div class="card mb-1 border-bottom-0 border-top-0" style="border-left: 5px solid; border-radius: 0;"\n\t\t[style.border-left-color]="item?.color">\n\t\t<div class="card-header border-top d-flex flex-row justify-content-between">\n\t\t\t<div class="">\n\t\t\t\t<span class="font-weight-bold">#{{item.id}}</span>\n\t\t\t\t<span class="ml-3">{{ item.name }}</span>\n\t\t\t\t<span class="ml-3">{{ item.priority }}</span>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</ng-template>\n\n\n\x3c!-- Layout parts --\x3e\n<ng-template #backlogColumn>\n\t<div class="backlog border-right" *ngIf="showBacklog" [style.width]="backlogWidth">\n\t\t<div class="card border-right-0 border-top-0 border-left-0 w-100 h-100">\n\t\t\t<div class="{{hHeaderClass}} d-flex flex-row justify-content-between">\n\n\t\t\t\t{{ backlogName }}\n\n\t\t\t\t<div class="actions ml-3">\n\t\t\t\t\t<ng-container *ngTemplateOutlet="addIcon"></ng-container>\n\t\t\t\t</div>\n\t\t\t</div>\n\n\t\t\t<ul class="list-group list-group-flush p-3 h-100" (outSideEventHandler)="dragOver($event, null, null)">\n\t\t\t\t<div class=" ungrouped-item" *ngFor="let item of getUngroupedItems()" draggable="true"\n\t\t\t\t\t(outSideEventHandler)="dragStart($event, item)" (outSideEventHandler)="dragEnd()">\n\t\t\t\t\t<ng-container *ngIf="itemTemplate">\n\t\t\t\t\t\t<ng-container *ngTemplateOutlet="itemTemplate; context { item: item }"></ng-container>\n\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t<ng-container *ngIf="!itemTemplate">\n\t\t\t\t\t\t<ng-container *ngTemplateOutlet="defaultItemTemplate; context: { item: item }"></ng-container>\n\t\t\t\t\t</ng-container>\n\t\t\t\t</div>\n\t\t\t</ul>\n\t\t</div>\n\t</div>\n</ng-template>\n\n<ng-template #columnHeadings>\n\t<div class="headings d-flex flex-row align-items-stretch w-100" [ngStyle]="scrollBarStyle()"\n\t\t[class.sticky-top]="stickyHorizontalHeaderKeys">\n\t\t<div class="col-2 border-left {{hHeaderClass}} border-left-0 d-flex flex-row" *ngIf="vGroupKey">\n\t\t\t<div class="d-flex flex-row w-100">\n\t\t\t\t<div class="boardname flex-fill">{{ boardName }}</div>\n\t\t\t\t<div class="h-v-actions align-self-end" (click)="toggleCollapseGroup(\'vertical\', vCollapsed)">\n\n\t\t\t\t\t<ng-container *ngIf="vCollapsed">\n\t\t\t\t\t\t<ng-container *ngTemplateOutlet="collapseIcon" [ngIf]="vCollapsed"></ng-container>\n\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t<ng-container *ngIf="!vCollapsed">\n\t\t\t\t\t\t<ng-container *ngTemplateOutlet="expandIcon" [ngIf]="vCollapsed"></ng-container>\n\t\t\t\t\t</ng-container>\n\t\t\t\t\t\x3c!-- <fa-icon [icon]="[\'fas\', vCollapsed ? \'chevron-down\' : \'chevron-up\']" [fixedWidth]="true"\n\t\t\t\t\t\t(click)="toggleCollapseGroup(\'vertical\', vCollapsed)"></fa-icon> --\x3e\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\n\t\t<div class="border-left {{hHeaderClass}} d-flex flex-row justify-content-between horizontal-group-header"\n\t\t\t[class.bg-white]="collapseState(hGroup)" [class.border-bottom-0]="collapseState(hGroup)"\n\t\t\t[class.col]="!collapseState(hGroup) && !(scrollable && horizontalScrolling)"\n\t\t\t*ngFor="let hGroup of hHeadings; let hLast = last" [class.h-collapsed]="collapseState(hGroup)"\n\t\t\t[ngStyle]="getColumnWidth()" [class.border-right]="(scrollable && horizontalScrolling) && hLast">\n\t\t\t<div class="" *ngIf="!collapseState(hGroup)">\n\t\t\t\t<ng-container [ngIf]="hHeaderTemplate"\n\t\t\t\t\t*ngTemplateOutlet="hHeaderTemplate; context: { groupName: hGroup }">\n\t\t\t\t</ng-container>\n\t\t\t\t<ng-container *ngIf="!hHeaderTemplate">\n\t\t\t\t\t{{ hGroup?.display || getValue(hGroup) || \'Ungrouped\' }}\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t\t<div *ngIf="!collapseState(hGroup)">\n\t\t\t\t<ng-content\n\t\t\t\t\t*ngTemplateOutlet="cardAction; context: { withNew: hAddNewItems, group: { hGroup: hGroup, vGroup: null}, collapser: false, collapsed: !collapseState(hGroup)}">\n\t\t\t\t</ng-content>\n\t\t\t</div>\n\t\t</div>\n\t</div>\n</ng-template>\n\n<ng-template #rowHeadings let-vGroup="vGroup">\n\t<div class="col-2 {{vHeaderClass}} border-left-0 d-flex flex-row justify-content-between" *ngIf="vGroupKey">\n\t\t<div class="vertical-group-header h-100 border-bottom-0 border-left-0 p-0 m-0 flex-fill">\n\n\t\t\t<ng-container [ngIf]="vHeaderTemplate" *ngTemplateOutlet="vHeaderTemplate; context: { groupName: vGroup }">\n\t\t\t</ng-container>\n\t\t\t<ng-container *ngIf="!vHeaderTemplate">\n\t\t\t\t{{ vGroup?.display || getValue(vGroup) || \'Ungrouped\' }}\n\t\t\t</ng-container>\n\t\t</div>\n\n\t\t<div class="vertical-actions d-flex flex-column" [class.flex-column]="!collapseState(vGroup)"\n\t\t\t[class.flex-row]="collapseState(vGroup)" [class.flex-row-reverse]="collapseState(vGroup)">\n\t\t\t<div class="align-self-start flex-fill">\n\t\t\t\t<ng-content\n\t\t\t\t\t*ngTemplateOutlet="cardAction; context: { withNew: false, group: { hGroup: null, vGroup: vGroup}, collapser: true, collapsed: !collapseState(vGroup)}">\n\t\t\t\t</ng-content>\n\t\t\t</div>\n\t\t\t<div class="align-self-start">\n\t\t\t\t<ng-content class="align-self-end"\n\t\t\t\t\t*ngTemplateOutlet="cardAction; context: { withNew: vAddNewItems, group: { hGroup: null, vGroup: vGroup}, collapser: false }">\n\t\t\t\t</ng-content>\n\t\t\t</div>\n\t\t</div>\n\n\t</div>\n</ng-template>\n\n<ng-template #cellItem let-vGroup="vGroup" let-hGroup="hGroup" let-hLast="hLast">\n\t<div class="cell-item border-left {{cellClass}} bg-white d-flex flex-column"\n\t\t[class.col]="!collapseState(hGroup) && !(scrollable && horizontalScrolling)"\n\t\t[class.border-bottom-0]="collapseState(hGroup)" [class.v-collapsed]="collapseState(vGroup)"\n\t\t[class.h-collapsed]="collapseState(hGroup)" [ngStyle]="getColumnWidth()"\n\t\t[class.border-right]="(scrollable && horizontalScrolling) && hLast">\n\n\n\t\t<ng-container *ngIf="!collapseState(vGroup) && !collapseState(hGroup)">\n\n\t\t\t<div class="cell-items flex-fill" (dragover)="dragOver($event, vGroup, hGroup)"\n\t\t\t\t(drop)="drop($event, vGroup, hGroup)">\n\t\t\t\t<ng-container *ngFor="let item of getItemsOfGroup(getValue(vGroup), getValue(hGroup))">\n\n\t\t\t\t\t<div class="item-container p-0 m-0" draggable="true" (dragstart)="dragStart($event, item)"\n\t\t\t\t\t\t(dragend)="dragEnd()">\n\t\t\t\t\t\t<ng-container *ngIf="itemTemplate">\n\t\t\t\t\t\t\t<ng-container *ngTemplateOutlet="itemTemplate; context { item: item }"></ng-container>\n\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t<ng-container *ngIf="!itemTemplate">\n\t\t\t\t\t\t\t<ng-container *ngTemplateOutlet="defaultItemTemplate; context: { item: item }">\n\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t</div>\n\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t\t<div class="cell-actions d-flex flex-row align-self-end">\n\t\t\t\t<ng-content\n\t\t\t\t\t*ngTemplateOutlet="cardAction; context: { withNew: cellAddNewItems, group: { hGroup: hGroup, vGroup: vGroup}, collapser: false }">\n\t\t\t\t</ng-content>\n\t\t\t</div>\n\n\t\t</ng-container>\n\n\t\t<ng-container *ngIf="collapseState(vGroup) && !collapseState(hGroup)">\n\t\t\t<div class="text-center" (dragover)="dragOver($event, vGroup, hGroup)"\n\t\t\t\t(drop)="drop($event, vGroup, hGroup)">\n\t\t\t\t<ng-container [ngIf]="noElementsTemplate"\n\t\t\t\t\t*ngTemplateOutlet="noElementsTemplate; context: { count: getItemsOfGroup(getValue(vGroup), getValue(hGroup)).length, filter: this.filter }">\n\t\t\t\t</ng-container>\n\t\t\t\t<ng-container *ngIf="!noElementsTemplate">\n\t\t\t\t\t{{ getItemsOfGroup(getValue(vGroup), getValue(hGroup)).length }} elements\n\t\t\t\t\t<span *ngIf="filter !== \'\'" class="code"> (filtered by <code>{{filter}}</code>)</span>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t</ng-container>\n\t\t<ng-container *ngIf="collapseState(hGroup)">\n\n\t\t</ng-container>\n\n\t</div>\n\n</ng-template>\n\n\x3c!-- Icons --\x3e\n<ng-template #addIcon>\n\t<ng-container *ngTemplateOutlet="icon; context: { template: addIconTemplate, defaultIcon: [\'fas\',\'plus-square\'] }"></ng-container>\n</ng-template>\n\n<ng-template #collapseIcon>\n\t<ng-container *ngTemplateOutlet="icon; context: { template: collapseIconTemplate, defaultIcon: [\'fas\',\'chevron-up\'] }"></ng-container>\n</ng-template>\n\n<ng-template #expandIcon>\n\t<ng-container *ngTemplateOutlet="icon; context: { template: expandIconTemplate, defaultIcon: [\'fas\',\'chevron-up\'] }"></ng-container>\n</ng-template>\n\n<ng-template #icon let-template="template" let-defaultIcon="defaultIcon">\n\t<ng-container *ngIf="template else noIcon">\n\t\t<ng-container *ngTemplateOutlet="template; context: { defaultIcon: defaultIcon }"></ng-container>\n\t</ng-container> \n\t<ng-template #noIcon>\n\t\t<fa-icon [icon]="defaultIcon" [fixedWidth]="true"></fa-icon>\n\t</ng-template>\n</ng-template>',changeDetection:o.ChangeDetectionStrategy.OnPush,styles:["@charset \"UTF-8\";\n/*!\n * Bootstrap v4.4.1 (https://getbootstrap.com/)\n * Copyright 2011-2019 The Bootstrap Authors\n * Copyright 2011-2019 Twitter, Inc.\n * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)\n */:root{--blue:#007bff;--breakpoint-lg:992px;--breakpoint-md:768px;--breakpoint-sm:576px;--breakpoint-xl:1200px;--breakpoint-xs:0;--cyan:#17a2b8;--danger:#dc3545;--dark:#343a40;--font-family-monospace:SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--font-family-sans-serif:-apple-system,BlinkMacSystemFont,\"Segoe UI\",Roboto,\"Helvetica Neue\",Arial,\"Noto Sans\",sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\";--gray:#6c757d;--gray-dark:#343a40;--green:#28a745;--indigo:#6610f2;--info:#17a2b8;--light:#f8f9fa;--orange:#fd7e14;--pink:#e83e8c;--primary:#007bff;--purple:#6f42c1;--red:#dc3545;--secondary:#6c757d;--success:#28a745;--teal:#20c997;--warning:#ffc107;--white:#fff;--yellow:#ffc107}*,:after,:before{box-sizing:border-box}html{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-text-size-adjust:100%;font-family:sans-serif;line-height:1.15}article,aside,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}body{background-color:#fff;color:#212529;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-size:1rem;font-weight:400;line-height:1.5;margin:0;text-align:left}[tabindex=\"-1\"]:focus:not(:focus-visible){outline:0!important}hr{box-sizing:content-box;height:0;overflow:visible}h1,h2,h3,h4,h5,h6{margin-bottom:.5rem;margin-top:0}p{margin-bottom:1rem;margin-top:0}abbr[data-original-title],abbr[title]{-webkit-text-decoration:underline dotted;-webkit-text-decoration-skip-ink:none;border-bottom:0;cursor:help;text-decoration:underline;text-decoration:underline dotted;text-decoration-skip-ink:none}address{font-style:normal;line-height:inherit}address,dl,ol,ul{margin-bottom:1rem}dl,ol,ul{margin-top:0}ol ol,ol ul,ul ol,ul ul{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}a{background-color:transparent;color:#007bff;text-decoration:none}a:hover{color:#0056b3;text-decoration:underline}a:not([href]),a:not([href]):hover{color:inherit;text-decoration:none}code,kbd,pre,samp{font-family:SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}pre{margin-bottom:1rem;margin-top:0;overflow:auto}figure{margin:0 0 1rem}img{border-style:none}img,svg{vertical-align:middle}svg{overflow:hidden}table{border-collapse:collapse}caption{caption-side:bottom;color:#6c757d;padding-bottom:.75rem;padding-top:.75rem;text-align:left}th{text-align:inherit}label{display:inline-block;margin-bottom:.5rem}button{border-radius:0}button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}button,input,optgroup,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0}button,input{overflow:visible}button,select{text-transform:none}select{word-wrap:normal}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=date],input[type=datetime-local],input[type=month],input[type=time]{-webkit-appearance:listbox}textarea{overflow:auto;resize:vertical}fieldset{border:0;margin:0;min-width:0;padding:0}legend{color:inherit;display:block;font-size:1.5rem;line-height:inherit;margin-bottom:.5rem;max-width:100%;padding:0;white-space:normal;width:100%}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:none;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}output{display:inline-block}summary{cursor:pointer;display:list-item}template{display:none}[hidden]{display:none!important}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{font-weight:500;line-height:1.2;margin-bottom:.5rem}.h1,h1{font-size:2.5rem}.h2,h2{font-size:2rem}.h3,h3{font-size:1.75rem}.h4,h4{font-size:1.5rem}.h5,h5{font-size:1.25rem}.h6,h6{font-size:1rem}.lead{font-size:1.25rem;font-weight:300}.display-1{font-size:6rem}.display-1,.display-2{font-weight:300;line-height:1.2}.display-2{font-size:5.5rem}.display-3{font-size:4.5rem}.display-3,.display-4{font-weight:300;line-height:1.2}.display-4{font-size:3.5rem}hr{border:0;border-top:1px solid rgba(0,0,0,.1);margin-bottom:1rem;margin-top:1rem}.small,small{font-size:80%;font-weight:400}.mark,mark{background-color:#fcf8e3;padding:.2em}.list-inline,.list-unstyled{list-style:none;padding-left:0}.list-inline-item{display:inline-block}.list-inline-item:not(:last-child){margin-right:.5rem}.initialism{font-size:90%;text-transform:uppercase}.blockquote{font-size:1.25rem;margin-bottom:1rem}.blockquote-footer{color:#6c757d;display:block;font-size:80%}.blockquote-footer:before{content:\"— \"}.img-fluid,.img-thumbnail{height:auto;max-width:100%}.img-thumbnail{background-color:#fff;border:1px solid #dee2e6;border-radius:.25rem;padding:.25rem}.figure{display:inline-block}.figure-img{line-height:1;margin-bottom:.5rem}.figure-caption{color:#6c757d;font-size:90%}code{color:#e83e8c;font-size:87.5%;word-wrap:break-word}a>code{color:inherit}kbd{background-color:#212529;border-radius:.2rem;color:#fff;font-size:87.5%;padding:.2rem .4rem}kbd kbd{font-size:100%;font-weight:700;padding:0}pre{color:#212529;display:block;font-size:87.5%}pre code{color:inherit;font-size:inherit;word-break:normal}.pre-scrollable{max-height:340px;overflow-y:scroll}.container{margin-left:auto;margin-right:auto;padding-left:15px;padding-right:15px;width:100%}@media (min-width:576px){.container{max-width:540px}}@media (min-width:768px){.container{max-width:720px}}@media (min-width:992px){.container{max-width:960px}}@media (min-width:1200px){.container{max-width:1140px}}.container-fluid,.container-lg,.container-md,.container-sm,.container-xl{margin-left:auto;margin-right:auto;padding-left:15px;padding-right:15px;width:100%}@media (min-width:576px){.container,.container-sm{max-width:540px}}@media (min-width:768px){.container,.container-md,.container-sm{max-width:720px}}@media (min-width:992px){.container,.container-lg,.container-md,.container-sm{max-width:960px}}@media (min-width:1200px){.container,.container-lg,.container-md,.container-sm,.container-xl{max-width:1140px}}.row{display:flex;flex-wrap:wrap;margin-left:-15px;margin-right:-15px}.no-gutters{margin-left:0;margin-right:0}.no-gutters>.col,.no-gutters>[class*=col-]{padding-left:0;padding-right:0}.col,.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col-auto,.col-lg,.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-auto,.col-md,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-md-auto,.col-sm,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-auto,.col-xl,.col-xl-1,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl-auto{padding-left:15px;padding-right:15px;position:relative;width:100%}.col{flex-basis:0;flex-grow:1;max-width:100%}.row-cols-1>*{flex:0 0 100%;max-width:100%}.row-cols-2>*{flex:0 0 50%;max-width:50%}.row-cols-3>*{flex:0 0 33.3333333333%;max-width:33.3333333333%}.row-cols-4>*{flex:0 0 25%;max-width:25%}.row-cols-5>*{flex:0 0 20%;max-width:20%}.row-cols-6>*{flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-auto{flex:0 0 auto;max-width:100%;width:auto}.col-1{flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-2{flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-3{flex:0 0 25%;max-width:25%}.col-4{flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-5{flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-6{flex:0 0 50%;max-width:50%}.col-7{flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-8{flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-9{flex:0 0 75%;max-width:75%}.col-10{flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-11{flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-12{flex:0 0 100%;max-width:100%}.order-first{order:-1}.order-last{order:13}.order-0{order:0}.order-1{order:1}.order-2{order:2}.order-3{order:3}.order-4{order:4}.order-5{order:5}.order-6{order:6}.order-7{order:7}.order-8{order:8}.order-9{order:9}.order-10{order:10}.order-11{order:11}.order-12{order:12}.offset-1{margin-left:8.3333333333%}.offset-2{margin-left:16.6666666667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.3333333333%}.offset-5{margin-left:41.6666666667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.3333333333%}.offset-8{margin-left:66.6666666667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.3333333333%}.offset-11{margin-left:91.6666666667%}@media (min-width:576px){.col-sm{flex-basis:0;flex-grow:1;max-width:100%}.row-cols-sm-1>*{flex:0 0 100%;max-width:100%}.row-cols-sm-2>*{flex:0 0 50%;max-width:50%}.row-cols-sm-3>*{flex:0 0 33.3333333333%;max-width:33.3333333333%}.row-cols-sm-4>*{flex:0 0 25%;max-width:25%}.row-cols-sm-5>*{flex:0 0 20%;max-width:20%}.row-cols-sm-6>*{flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-sm-auto{flex:0 0 auto;max-width:100%;width:auto}.col-sm-1{flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-sm-2{flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-sm-3{flex:0 0 25%;max-width:25%}.col-sm-4{flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-sm-5{flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-sm-6{flex:0 0 50%;max-width:50%}.col-sm-7{flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-sm-8{flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-sm-9{flex:0 0 75%;max-width:75%}.col-sm-10{flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-sm-11{flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-sm-12{flex:0 0 100%;max-width:100%}.order-sm-first{order:-1}.order-sm-last{order:13}.order-sm-0{order:0}.order-sm-1{order:1}.order-sm-2{order:2}.order-sm-3{order:3}.order-sm-4{order:4}.order-sm-5{order:5}.order-sm-6{order:6}.order-sm-7{order:7}.order-sm-8{order:8}.order-sm-9{order:9}.order-sm-10{order:10}.order-sm-11{order:11}.order-sm-12{order:12}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.3333333333%}.offset-sm-2{margin-left:16.6666666667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.3333333333%}.offset-sm-5{margin-left:41.6666666667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.3333333333%}.offset-sm-8{margin-left:66.6666666667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.3333333333%}.offset-sm-11{margin-left:91.6666666667%}}@media (min-width:768px){.col-md{flex-basis:0;flex-grow:1;max-width:100%}.row-cols-md-1>*{flex:0 0 100%;max-width:100%}.row-cols-md-2>*{flex:0 0 50%;max-width:50%}.row-cols-md-3>*{flex:0 0 33.3333333333%;max-width:33.3333333333%}.row-cols-md-4>*{flex:0 0 25%;max-width:25%}.row-cols-md-5>*{flex:0 0 20%;max-width:20%}.row-cols-md-6>*{flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-md-auto{flex:0 0 auto;max-width:100%;width:auto}.col-md-1{flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-md-2{flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-md-3{flex:0 0 25%;max-width:25%}.col-md-4{flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-md-5{flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-md-6{flex:0 0 50%;max-width:50%}.col-md-7{flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-md-8{flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-md-9{flex:0 0 75%;max-width:75%}.col-md-10{flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-md-11{flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-md-12{flex:0 0 100%;max-width:100%}.order-md-first{order:-1}.order-md-last{order:13}.order-md-0{order:0}.order-md-1{order:1}.order-md-2{order:2}.order-md-3{order:3}.order-md-4{order:4}.order-md-5{order:5}.order-md-6{order:6}.order-md-7{order:7}.order-md-8{order:8}.order-md-9{order:9}.order-md-10{order:10}.order-md-11{order:11}.order-md-12{order:12}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.3333333333%}.offset-md-2{margin-left:16.6666666667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.3333333333%}.offset-md-5{margin-left:41.6666666667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.3333333333%}.offset-md-8{margin-left:66.6666666667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.3333333333%}.offset-md-11{margin-left:91.6666666667%}}@media (min-width:992px){.col-lg{flex-basis:0;flex-grow:1;max-width:100%}.row-cols-lg-1>*{flex:0 0 100%;max-width:100%}.row-cols-lg-2>*{flex:0 0 50%;max-width:50%}.row-cols-lg-3>*{flex:0 0 33.3333333333%;max-width:33.3333333333%}.row-cols-lg-4>*{flex:0 0 25%;max-width:25%}.row-cols-lg-5>*{flex:0 0 20%;max-width:20%}.row-cols-lg-6>*{flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-lg-auto{flex:0 0 auto;max-width:100%;width:auto}.col-lg-1{flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-lg-2{flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-lg-3{flex:0 0 25%;max-width:25%}.col-lg-4{flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-lg-5{flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-lg-6{flex:0 0 50%;max-width:50%}.col-lg-7{flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-lg-8{flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-lg-9{flex:0 0 75%;max-width:75%}.col-lg-10{flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-lg-11{flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-lg-12{flex:0 0 100%;max-width:100%}.order-lg-first{order:-1}.order-lg-last{order:13}.order-lg-0{order:0}.order-lg-1{order:1}.order-lg-2{order:2}.order-lg-3{order:3}.order-lg-4{order:4}.order-lg-5{order:5}.order-lg-6{order:6}.order-lg-7{order:7}.order-lg-8{order:8}.order-lg-9{order:9}.order-lg-10{order:10}.order-lg-11{order:11}.order-lg-12{order:12}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.3333333333%}.offset-lg-2{margin-left:16.6666666667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.3333333333%}.offset-lg-5{margin-left:41.6666666667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.3333333333%}.offset-lg-8{margin-left:66.6666666667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.3333333333%}.offset-lg-11{margin-left:91.6666666667%}}@media (min-width:1200px){.col-xl{flex-basis:0;flex-grow:1;max-width:100%}.row-cols-xl-1>*{flex:0 0 100%;max-width:100%}.row-cols-xl-2>*{flex:0 0 50%;max-width:50%}.row-cols-xl-3>*{flex:0 0 33.3333333333%;max-width:33.3333333333%}.row-cols-xl-4>*{flex:0 0 25%;max-width:25%}.row-cols-xl-5>*{flex:0 0 20%;max-width:20%}.row-cols-xl-6>*{flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-xl-auto{flex:0 0 auto;max-width:100%;width:auto}.col-xl-1{flex:0 0 8.3333333333%;max-width:8.3333333333%}.col-xl-2{flex:0 0 16.6666666667%;max-width:16.6666666667%}.col-xl-3{flex:0 0 25%;max-width:25%}.col-xl-4{flex:0 0 33.3333333333%;max-width:33.3333333333%}.col-xl-5{flex:0 0 41.6666666667%;max-width:41.6666666667%}.col-xl-6{flex:0 0 50%;max-width:50%}.col-xl-7{flex:0 0 58.3333333333%;max-width:58.3333333333%}.col-xl-8{flex:0 0 66.6666666667%;max-width:66.6666666667%}.col-xl-9{flex:0 0 75%;max-width:75%}.col-xl-10{flex:0 0 83.3333333333%;max-width:83.3333333333%}.col-xl-11{flex:0 0 91.6666666667%;max-width:91.6666666667%}.col-xl-12{flex:0 0 100%;max-width:100%}.order-xl-first{order:-1}.order-xl-last{order:13}.order-xl-0{order:0}.order-xl-1{order:1}.order-xl-2{order:2}.order-xl-3{order:3}.order-xl-4{order:4}.order-xl-5{order:5}.order-xl-6{order:6}.order-xl-7{order:7}.order-xl-8{order:8}.order-xl-9{order:9}.order-xl-10{order:10}.order-xl-11{order:11}.order-xl-12{order:12}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.3333333333%}.offset-xl-2{margin-left:16.6666666667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.3333333333%}.offset-xl-5{margin-left:41.6666666667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.3333333333%}.offset-xl-8{margin-left:66.6666666667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.3333333333%}.offset-xl-11{margin-left:91.6666666667%}}.table{color:#212529;margin-bottom:1rem;width:100%}.table td,.table th{border-top:1px solid #dee2e6;padding:.75rem;vertical-align:top}.table thead th{border-bottom:2px solid #dee2e6;vertical-align:bottom}.table tbody+tbody{border-top:2px solid #dee2e6}.table-sm td,.table-sm th{padding:.3rem}.table-bordered,.table-bordered td,.table-bordered th{border:1px solid #dee2e6}.table-bordered thead td,.table-bordered thead th{border-bottom-width:2px}.table-borderless tbody+tbody,.table-borderless td,.table-borderless th,.table-borderless thead th{border:0}.table-striped tbody tr:nth-of-type(odd){background-color:rgba(0,0,0,.05)}.table-hover tbody tr:hover{background-color:rgba(0,0,0,.075);color:#212529}.table-primary,.table-primary>td,.table-primary>th{background-color:#b8daff}.table-primary tbody+tbody,.table-primary td,.table-primary th,.table-primary thead th{border-color:#7abaff}.table-hover .table-primary:hover,.table-hover .table-primary:hover>td,.table-hover .table-primary:hover>th{background-color:#9fcdff}.table-secondary,.table-secondary>td,.table-secondary>th{background-color:#d6d8db}.table-secondary tbody+tbody,.table-secondary td,.table-secondary th,.table-secondary thead th{border-color:#b3b7bb}.table-hover .table-secondary:hover,.table-hover .table-secondary:hover>td,.table-hover .table-secondary:hover>th{background-color:#c8cbcf}.table-success,.table-success>td,.table-success>th{background-color:#c3e6cb}.table-success tbody+tbody,.table-success td,.table-success th,.table-success thead th{border-color:#8fd19e}.table-hover .table-success:hover,.table-hover .table-success:hover>td,.table-hover .table-success:hover>th{background-color:#b1dfbb}.table-info,.table-info>td,.table-info>th{background-color:#bee5eb}.table-info tbody+tbody,.table-info td,.table-info th,.table-info thead th{border-color:#86cfda}.table-hover .table-info:hover,.table-hover .table-info:hover>td,.table-hover .table-info:hover>th{background-color:#abdde5}.table-warning,.table-warning>td,.table-warning>th{background-color:#ffeeba}.table-warning tbody+tbody,.table-warning td,.table-warning th,.table-warning thead th{border-color:#ffdf7e}.table-hover .table-warning:hover,.table-hover .table-warning:hover>td,.table-hover .table-warning:hover>th{background-color:#ffe8a1}.table-danger,.table-danger>td,.table-danger>th{background-color:#f5c6cb}.table-danger tbody+tbody,.table-danger td,.table-danger th,.table-danger thead th{border-color:#ed969e}.table-hover .table-danger:hover,.table-hover .table-danger:hover>td,.table-hover .table-danger:hover>th{background-color:#f1b0b7}.table-light,.table-light>td,.table-light>th{background-color:#fdfdfe}.table-light tbody+tbody,.table-light td,.table-light th,.table-light thead th{border-color:#fbfcfc}.table-hover .table-light:hover,.table-hover .table-light:hover>td,.table-hover .table-light:hover>th{background-color:#ececf6}.table-dark,.table-dark>td,.table-dark>th{background-color:#c6c8ca}.table-dark tbody+tbody,.table-dark td,.table-dark th,.table-dark thead th{border-color:#95999c}.table-hover .table-dark:hover,.table-hover .table-dark:hover>td,.table-hover .table-dark:hover>th{background-color:#b9bbbe}.table-active,.table-active>td,.table-active>th,.table-hover .table-active:hover,.table-hover .table-active:hover>td,.table-hover .table-active:hover>th{background-color:rgba(0,0,0,.075)}.table .thead-dark th{background-color:#343a40;border-color:#454d55;color:#fff}.table .thead-light th{background-color:#e9ecef;border-color:#dee2e6;color:#495057}.table-dark{background-color:#343a40;color:#fff}.table-dark td,.table-dark th,.table-dark thead th{border-color:#454d55}.table-dark.table-bordered{border:0}.table-dark.table-striped tbody tr:nth-of-type(odd){background-color:hsla(0,0%,100%,.05)}.table-dark.table-hover tbody tr:hover{background-color:hsla(0,0%,100%,.075);color:#fff}@media (max-width:575.98px){.table-responsive-sm{-webkit-overflow-scrolling:touch;display:block;overflow-x:auto;width:100%}.table-responsive-sm>.table-bordered{border:0}}@media (max-width:767.98px){.table-responsive-md{-webkit-overflow-scrolling:touch;display:block;overflow-x:auto;width:100%}.table-responsive-md>.table-bordered{border:0}}@media (max-width:991.98px){.table-responsive-lg{-webkit-overflow-scrolling:touch;display:block;overflow-x:auto;width:100%}.table-responsive-lg>.table-bordered{border:0}}@media (max-width:1199.98px){.table-responsive-xl{-webkit-overflow-scrolling:touch;display:block;overflow-x:auto;width:100%}.table-responsive-xl>.table-bordered{border:0}}.table-responsive{-webkit-overflow-scrolling:touch;display:block;overflow-x:auto;width:100%}.table-responsive>.table-bordered{border:0}.form-control{background-clip:padding-box;background-color:#fff;border:1px solid #ced4da;border-radius:.25rem;color:#495057;display:block;font-size:1rem;font-weight:400;height:calc(1.5em + .75rem + 2px);line-height:1.5;padding:.375rem .75rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:100%}@media (prefers-reduced-motion:reduce){.form-control{transition:none}}.form-control::-ms-expand{background-color:transparent;border:0}.form-control:-moz-focusring{color:transparent;text-shadow:0 0 0 #495057}.form-control:focus{background-color:#fff;border-color:#80bdff;box-shadow:0 0 0 .2rem rgba(0,123,255,.25);color:#495057;outline:0}.form-control::-moz-placeholder{color:#6c757d;opacity:1}.form-control::placeholder{color:#6c757d;opacity:1}.form-control:disabled,.form-control[readonly]{background-color:#e9ecef;opacity:1}select.form-control:focus::-ms-value{background-color:#fff;color:#495057}.form-control-file,.form-control-range{display:block;width:100%}.col-form-label{font-size:inherit;line-height:1.5;margin-bottom:0;padding-bottom:calc(.375rem + 1px);padding-top:calc(.375rem + 1px)}.col-form-label-lg{font-size:1.25rem;line-height:1.5;padding-bottom:calc(.5rem + 1px);padding-top:calc(.5rem + 1px)}.col-form-label-sm{font-size:.875rem;line-height:1.5;padding-bottom:calc(.25rem + 1px);padding-top:calc(.25rem + 1px)}.form-control-plaintext{background-color:transparent;border:solid transparent;border-width:1px 0;color:#212529;display:block;font-size:1rem;line-height:1.5;margin-bottom:0;padding:.375rem 0;width:100%}.form-control-plaintext.form-control-lg,.form-control-plaintext.form-control-sm{padding-left:0;padding-right:0}.form-control-sm{border-radius:.2rem;font-size:.875rem;height:calc(1.5em + .5rem + 2px);line-height:1.5;padding:.25rem .5rem}.form-control-lg{border-radius:.3rem;font-size:1.25rem;height:calc(1.5em + 1rem + 2px);line-height:1.5;padding:.5rem 1rem}select.form-control[multiple],select.form-control[size],textarea.form-control{height:auto}.form-group{margin-bottom:1rem}.form-text{display:block;margin-top:.25rem}.form-row{display:flex;flex-wrap:wrap;margin-left:-5px;margin-right:-5px}.form-row>.col,.form-row>[class*=col-]{padding-left:5px;padding-right:5px}.form-check{display:block;padding-left:1.25rem;position:relative}.form-check-input{margin-left:-1.25rem;margin-top:.3rem;position:absolute}.form-check-input:disabled~.form-check-label,.form-check-input[disabled]~.form-check-label{color:#6c757d}.form-check-label{margin-bottom:0}.form-check-inline{align-items:center;display:inline-flex;margin-right:.75rem;padding-left:0}.form-check-inline .form-check-input{margin-left:0;margin-right:.3125rem;margin-top:0;position:static}.valid-feedback{color:#28a745;display:none;font-size:80%;margin-top:.25rem;width:100%}.valid-tooltip{background-color:rgba(40,167,69,.9);border-radius:.25rem;color:#fff;display:none;font-size:.875rem;line-height:1.5;margin-top:.1rem;max-width:100%;padding:.25rem .5rem;position:absolute;top:100%;z-index:5}.is-valid~.valid-feedback,.is-valid~.valid-tooltip,.was-validated :valid~.valid-feedback,.was-validated :valid~.valid-toolti