{"__symbolic":"module","version":4,"metadata":{"ExpandableTableModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":10,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ExpandableTableComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":13,"character":4},{"__symbolic":"reference","module":"@angular/material/table","name":"MatTableModule","line":14,"character":4},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":15,"character":4},{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/material/expansion","name":"MatExpansionModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/material/checkbox","name":"MatCheckboxModule","line":18,"character":4},{"__symbolic":"reference","module":"@ffdc/uxg-angular-components/table","name":"UxgTableModule","line":19,"character":4}],"exports":[{"__symbolic":"reference","name":"ExpandableTableComponent"}],"entryComponents":[{"__symbolic":"reference","name":"ExpandableTableComponent"}]}]}],"members":{}},"ExpandableTableComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":26,"character":1},"arguments":[{"selector":"uxg-expandable-table","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":30,"character":17},"member":"None"},"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":31,"character":19},"member":"OnPush"},"animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger","line":33,"character":4},"arguments":["detailExpand",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":34,"character":6},"arguments":["collapsed",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":34,"character":25},"arguments":[{"height":"0px","minHeight":"0","padding":"0"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":35,"character":6},"arguments":["expanded",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":35,"character":24},"arguments":[{"height":"*"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":36,"character":6},"arguments":["expanded <=> collapsed",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":36,"character":43},"arguments":["225ms cubic-bezier(0.4, 0.0, 0.2, 1)"]}]}]]}],"template":"<div class=\"expandable-table-header\">\n  <mat-checkbox\n    class=\"check-box-header\"\n    (click)=\"$event.stopPropagation()\"\n    [checked]=\"selectionModel.selected.length > 0 && isAllSelected()\"\n    [indeterminate]=\"selectionModel.selected.length > 0 && !isAllSelected()\"\n    (change)=\"$event ? toggleAll() : null\"\n    *ngIf=\"selectable\"\n    color=\"primary\"\n  >\n  </mat-checkbox>\n  <div class=\"title uxg-subtitle-1\" [ngClass]=\"{ selectable: selectable }\">\n    {{ groupInfo?.displayName || groupInfo?.name }}\n  </div>\n\n  <div class=\"up-down\">\n    <button mat-icon-button (click)=\"collapseAll(); $event.stopPropagation()\" [disableRipple]=\"true\">\n      <mat-icon>code</mat-icon>\n    </button>\n  </div>\n</div>\n\n<mat-accordion *ngIf=\"_dataSource && _dataSource.length > 0\" multi=\"true\">\n  <mat-expansion-panel\n    *ngFor=\"let row of _dataSource\"\n    [expanded]=\"row.expanded\"\n    (opened)=\"row.expanded = true\"\n    (closed)=\"row.expanded = false\"\n  >\n    <mat-expansion-panel-header>\n      <mat-panel-title>\n        <mat-checkbox\n          class=\"check-box-header\"\n          (click)=\"$event.stopPropagation()\"\n          [checked]=\"selectionHasRowValue(row) && isRowAllSelected(row)\"\n          [indeterminate]=\"selectionHasRowValue(row) && !isRowAllSelected(row)\"\n          (change)=\"$event ? toggleRow(row) : null\"\n          *ngIf=\"selectable\"\n          color=\"primary\"\n        >\n        </mat-checkbox>\n        <div class=\"header-text\" [ngClass]=\"{ selectable: selectable }\">\n          <span class=\"title uxg-subtitle-1\">{{ row.label }}</span>\n          <span class=\"subtitle uxg-body-3\">\n            <ng-container *ngTemplateOutlet=\"templateHeaderSubtitle; context: { row: row, subtitle: subtitle }\">\n            </ng-container>\n          </span>\n        </div>\n        <div class=\"header-buttons\">\n          <ng-container\n            *ngTemplateOutlet=\"templateHeaderButtons; context: { row: row, emiter: tableHeaderCallBack }\"\n          ></ng-container>\n        </div>\n      </mat-panel-title>\n    </mat-expansion-panel-header>\n    <uxg-table\n      id=\"{{ row.id }}\"\n      class=\"sub-table\"\n      [data]=\"row.values\"\n      [columns]=\"_columns\"\n      [columnsToDisplay]=\"visibleColumns\"\n      (selectChanged)=\"onTableSelectionChange($event, row)\"\n      [multiSelect]=\"selectable\"\n      [singleSelect]=\"!selectable\"\n      [selectedKeys]=\"getSelectedKeys(row)\"\n      (multiSelectSingleRowClicked)=\"onRowClicked($event)\"\n      *ngIf=\"row && row.values && _columns\"\n    >\n    </uxg-table>\n    <div class=\"table-buttons\">\n      <ng-container *ngTemplateOutlet=\"templateTableButtons; context: { row: row, emiter: tableButtonsCallBack }\">\n      </ng-container>\n    </div>\n  </mat-expansion-panel>\n</mat-accordion>\n","styles":[".mt-0{margin-top:0!important}.pt-0{padding-top:0!important}.mb-0{margin-bottom:0!important}.pb-0{padding-bottom:0!important}.ml-0{margin-left:0!important}.pl-0{padding-left:0!important}.mr-0{margin-right:0!important}.pr-0{padding-right:0!important}.m-0{margin:0!important}.p-0{padding:0!important}.mt-1{margin-top:4px!important}.pt-1{padding-top:4px!important}.mb-1{margin-bottom:4px!important}.pb-1{padding-bottom:4px!important}.ml-1{margin-left:4px!important}.pl-1{padding-left:4px!important}.mr-1{margin-right:4px!important}.pr-1{padding-right:4px!important}.m-1{margin:4px!important}.p-1{padding:4px!important}.mt-2{margin-top:8px!important}.pt-2{padding-top:8px!important}.mb-2{margin-bottom:8px!important}.pb-2{padding-bottom:8px!important}.ml-2{margin-left:8px!important}.pl-2{padding-left:8px!important}.mr-2{margin-right:8px!important}.pr-2{padding-right:8px!important}.m-2{margin:8px!important}.p-2{padding:8px!important}.mt-3{margin-top:16px!important}.pt-3{padding-top:16px!important}.mb-3{margin-bottom:16px!important}.pb-3{padding-bottom:16px!important}.ml-3{margin-left:16px!important}.pl-3{padding-left:16px!important}.mr-3{margin-right:16px!important}.pr-3{padding-right:16px!important}.m-3{margin:16px!important}.p-3{padding:16px!important}.mt-4{margin-top:24px!important}.pt-4{padding-top:24px!important}.mb-4{margin-bottom:24px!important}.pb-4{padding-bottom:24px!important}.ml-4{margin-left:24px!important}.pl-4{padding-left:24px!important}.mr-4{margin-right:24px!important}.pr-4{padding-right:24px!important}.m-4{margin:24px!important}.p-4{padding:24px!important}.mt-5{margin-top:48px!important}.pt-5{padding-top:48px!important}.mb-5{margin-bottom:48px!important}.pb-5{padding-bottom:48px!important}.ml-5{margin-left:48px!important}.pl-5{padding-left:48px!important}.mr-5{margin-right:48px!important}.pr-5{padding-right:48px!important}.m-5{margin:48px!important}.p-5{padding:48px!important}.mt-6{margin-top:96px!important}.pt-6{padding-top:96px!important}.mb-6{margin-bottom:96px!important}.pb-6{padding-bottom:96px!important}.ml-6{margin-left:96px!important}.pl-6{padding-left:96px!important}.mr-6{margin-right:96px!important}.pr-6{padding-right:96px!important}.m-6{margin:96px!important}.p-6{padding:96px!important}uxg-expandable-table{width:100%;border-collapse:collapse}uxg-expandable-table .expandable-table-header{display:flex;align-items:center;padding:8px 8px 8px 24px}uxg-expandable-table .expandable-table-header .title.selectable{padding-left:16px}uxg-expandable-table .expandable-table-header .up-down{transform:rotate(90deg);margin-left:auto}uxg-expandable-table .check-box-header{margin-right:16px;display:flex}uxg-expandable-table .mat-expansion-panel{border-radius:0!important}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-header{padding-left:0}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-header .mat-expansion-panel-header-title{margin-right:0;align-items:center;padding-left:24px;min-height:48px}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-header .mat-expansion-panel-header-title .header-text{display:flex;flex-direction:column}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-header .mat-expansion-panel-header-title .header-text.selectable{padding-left:16px}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-header .mat-expansion-panel-header-title .header-text .subtitle{opacity:.8}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-header .mat-expansion-panel-header-title .header-buttons{margin-left:auto}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-header .mat-expansion-indicator{display:flex}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-body{padding:0}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-body .mat-table{table-layout:fixed}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-body .mat-table .mat-header-cell .mat-checkbox{display:none}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-body .mat-table tr.clickable{cursor:pointer}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-body .mat-table.sub-table{width:100%}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-body .mat-table.not-selectable td.mat-cell:first-of-type,uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-body .mat-table.not-selectable th.mat-header-cell:first-of-type{padding-left:32px!important}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-body .mat-table td.mat-cell:first-of-type,uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-body .mat-table th.mat-header-cell:first-of-type{padding-left:24px!important}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-body .mat-table .mat-column-uxg-table-select-row{width:16px}uxg-expandable-table .mat-expansion-panel .mat-expansion-panel-body .mat-table .mat-column-uxg-table-select-row .check-box{display:flex}"]}]}],"members":{"dataSource":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"columns":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"groupByKey":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3}}]}],"groupByKeyLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":47,"character":3}}]}],"subtitle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":49,"character":3}}]}],"selectable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":51,"character":3}}]}],"rowClickable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":53,"character":3}}]}],"selection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":3}}]}],"startExpanded":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3}}]}],"rowClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":59,"character":3}}]}],"selectionChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":60,"character":3}}]}],"tableButtonsCallBack":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":61,"character":3}}]}],"tableHeaderCallBack":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":62,"character":3}}]}],"accordion":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":73,"character":3},"arguments":[{"__symbolic":"reference","module":"@angular/material/expansion","name":"MatAccordion","line":73,"character":13},{"static":false}]}]}],"templateHeaderButtons":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":75,"character":3},"arguments":["expandableHeaderButtonsTemplate",{"static":false}]}]}],"templateTableButtons":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":76,"character":3},"arguments":["expandableTableButtonsTemplate",{"static":false}]}]}],"templateHeaderSubtitle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":77,"character":3},"arguments":["expandableTableSubtitleTemplate",{"static":false}]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnChanges":[{"__symbolic":"method"}],"generateData":[{"__symbolic":"method"}],"generateColumns":[{"__symbolic":"method"}],"groupBy":[{"__symbolic":"method"}],"toggleAll":[{"__symbolic":"method"}],"isAllSelected":[{"__symbolic":"method"}],"toggleRow":[{"__symbolic":"method"}],"selectionHasRowValue":[{"__symbolic":"method"}],"isRowAllSelected":[{"__symbolic":"method"}],"getSelectionByRow":[{"__symbolic":"method"}],"collapseAll":[{"__symbolic":"method"}],"getSelectedKeys":[{"__symbolic":"method"}],"onTableSelectionChange":[{"__symbolic":"method"}],"onSelectionChanged":[{"__symbolic":"method"}],"onRowClicked":[{"__symbolic":"method"}]}}},"origins":{"ExpandableTableModule":"./expandable-table.module","ExpandableTableComponent":"./expandable-table.component"},"importAs":"@ffdc/uxg-angular-components/expandable-table"}