{"__symbolic":"module","version":4,"metadata":{"UxgBreadcrumbModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":10,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":11,"character":12},{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":11,"character":26},{"__symbolic":"reference","module":"@angular/material/menu","name":"MatMenuModule","line":11,"character":40},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":11,"character":55},{"__symbolic":"reference","module":"@angular/material/list","name":"MatListModule","line":11,"character":70},{"__symbolic":"reference","module":"@angular/material/icon","name":"MatIconModule","line":11,"character":85},{"__symbolic":"reference","module":"@angular/material/button","name":"MatButtonModule","line":11,"character":100}],"exports":[{"__symbolic":"reference","name":"UxgBreadcrumbComponent"}],"declarations":[{"__symbolic":"reference","name":"UxgBreadcrumbComponent"}]}]}],"members":{}},"UxgBreadcrumbComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":15,"character":1},"arguments":[{"selector":"uxg-breadcrumb","host":{"class":"uxg-breadcrumb"},"encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":21,"character":17},"member":"None"},"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":22,"character":19},"member":"OnPush"},"template":"<ul class=\"uxg-breadcrumb\" [attr.dense]=\"dense === '' ? '' : null\" [attr.color]=\"color !== '' ? color : null\">\n  <!-- back button -->\n  <ng-container *ngIf=\"shouldDisplayBackButton && enableBackButton\">\n    <li class=\"uxg-breadcrumb-back\">\n      <mat-icon class=\"uxg-breadcrumb-back\" [color]=\"color\" (click)=\"backToPreviousPage()\">chevron_left</mat-icon>\n    </li>\n  </ng-container>\n\n  <ng-container *ngFor=\"let breadcrumbItem of breadcrumbs; last as isLast\">\n    <ng-container *ngIf=\"!isLast; else lastItem\">\n      <ng-template [ngTemplateOutlet]=\"linkItem\" [ngTemplateOutletContext]=\"{ item: breadcrumbItem }\"></ng-template>\n    </ng-container>\n    <!-- Last item template -->\n    <ng-template #lastItem>\n      <!-- whether last item has items data -->\n      <ng-container *ngIf=\"breadcrumbItem.items\">\n        <li>\n          <button mat-flat-button [matMenuTriggerFor]=\"menu\" disableRipple=\"true\" [color]=\"color\">\n            <span [class]=\"breadcrumbItem.itemClass\">{{ breadcrumbItem.label }}</span>\n            <mat-icon>expand_more</mat-icon>\n          </button>\n          <mat-menu #menu=\"matMenu\" class=\"uxg-breadcrumb-menu\">\n            <mat-nav-list class=\"uxg-nav-list-level\">\n              <a\n                *ngFor=\"let item of breadcrumbItem.items\"\n                [routerLink]=\"item.url\"\n                [queryParamsHandling]=\"item.queryParamsHandling\"\n                [ngClass]=\"{ 'uxg-list-item-selected': item.label === breadcrumbItem.label }\"\n                mat-list-item\n              >\n                <mat-icon mat-list-icon>{{ item.icon ? item.icon : 'filter_none' }}</mat-icon>\n                <p>{{ item.label }}</p>\n              </a>\n            </mat-nav-list>\n          </mat-menu>\n        </li>\n      </ng-container>\n\n      <!-- display last item as  a normal linkItem -->\n      <ng-container *ngIf=\"!breadcrumbItem.items\">\n        <ng-template [ngTemplateOutlet]=\"linkItem\" [ngTemplateOutletContext]=\"{ item: breadcrumbItem }\"></ng-template>\n      </ng-container>\n    </ng-template>\n  </ng-container>\n</ul>\n\n<!-- LinkItem template -->\n<ng-template #linkItem let-breadcrumbItem=\"item\">\n  <li [class]=\"breadcrumbItem.itemClass\">\n    <ng-container *ngIf=\"breadcrumbItem.url\">\n      <a [routerLink]=\"breadcrumbItem.url\" [queryParamsHandling]=\"breadcrumbItem.queryParamsHandling\">{{\n        breadcrumbItem.label\n      }}</a>\n    </ng-container>\n    <ng-container *ngIf=\"!breadcrumbItem.url\">\n      {{ breadcrumbItem.label }}\n    </ng-container>\n  </li>\n</ng-template>\n"}]}],"members":{"breadcrumbs":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"enableBackButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Attribute","line":57,"character":5},"arguments":["dense"]}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Attribute","line":58,"character":5},"arguments":["color"]}],null,null,null],"parameters":[{"__symbolic":"reference","name":"any"},{"__symbolic":"reference","name":"any"},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":59,"character":20},{"__symbolic":"reference","module":"@angular/cdk/layout","name":"BreakpointObserver","line":60,"character":32},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":61,"character":16}]}],"ngOnDestroy":[{"__symbolic":"method"}],"backToPreviousPage":[{"__symbolic":"method"}]}},"Breadcrumb":{"__symbolic":"interface"}},"origins":{"UxgBreadcrumbModule":"./src/breadcrumb.module","UxgBreadcrumbComponent":"./src/breadcrumb.component","Breadcrumb":"./src/breadcrumb"},"importAs":"@ffdc/uxg-angular-components/breadcrumb"}