UNPKG

primeng

Version:

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/primeng.svg)](https://badge.fury.io/js/primeng) [![npm downloads](https://img.shields.io/npm/dm/primeng.sv

1 lines 6.22 kB
{"__symbolic":"module","version":4,"metadata":{"Steps":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"p-steps","template":"\n <div [ngClass]=\"{'p-steps p-component':true,'p-readonly':readonly}\" [ngStyle]=\"style\" [class]=\"styleClass\">\n <ul role=\"tablist\">\n <li *ngFor=\"let item of model; let i = index\" class=\"p-steps-item\" #menuitem [ngStyle]=\"item.style\" [class]=\"item.styleClass\" role=\"tab\" [attr.aria-selected]=\"i === activeIndex\" [attr.aria-expanded]=\"i === activeIndex\"\n [ngClass]=\"{'p-highlight p-steps-current': isActive(item, i), 'p-disabled': item.disabled || (readonly && !isActive(item, i))}\">\n <a *ngIf=\"isClickableRouterLink(item); else elseBlock\" [routerLink]=\"item.routerLink\" [queryParams]=\"item.queryParams\" role=\"presentation\" [routerLinkActive]=\"'p-menuitem-link-active'\" [routerLinkActiveOptions]=\"item.routerLinkActiveOptions||{exact:false}\" class=\"p-menuitem-link\" \n (click)=\"itemClick($event, item, i)\" (keydown.enter)=\"itemClick($event, item, i)\" [attr.target]=\"item.target\" [attr.id]=\"item.id\" [attr.tabindex]=\"item.disabled || readonly ? null : (item.tabindex ? item.tabindex : '0')\"\n [fragment]=\"item.fragment\" [queryParamsHandling]=\"item.queryParamsHandling\" [preserveFragment]=\"item.preserveFragment\" [skipLocationChange]=\"item.skipLocationChange\" [replaceUrl]=\"item.replaceUrl\" [state]=\"item.state\">\n <span class=\"p-steps-number\">{{i + 1}}</span>\n <span class=\"p-steps-title\" *ngIf=\"item.escape !== false; else htmlLabel\">{{item.label}}</span>\n <ng-template #htmlLabel><span class=\"p-steps-title\" [innerHTML]=\"item.label\"></span></ng-template>\n </a>\n <ng-template #elseBlock>\n <a [attr.href]=\"item.url\" class=\"p-menuitem-link\" role=\"presentation\" (click)=\"itemClick($event, item, i)\" (keydown.enter)=\"itemClick($event, item, i)\" [attr.target]=\"item.target\" [attr.id]=\"item.id\" \n [attr.tabindex]=\"item.disabled||(i !== activeIndex && readonly) ? null : (item.tabindex ? item.tabindex : '0')\">\n <span class=\"p-steps-number\">{{i + 1}}</span>\n <span class=\"p-steps-title\" *ngIf=\"item.escape !== false; else htmlRouteLabel\">{{item.label}}</span>\n <ng-template #htmlRouteLabel><span class=\"p-steps-title\" [innerHTML]=\"item.label\"></span></ng-template>\n </a>\n </ng-template>\n </li>\n </ul>\n </div>\n ","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":32,"character":21},"member":"OnPush"},"encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":33,"character":19},"member":"None"},"styles":[".p-steps{position:relative}.p-steps ul{display:flex;list-style-type:none;margin:0;padding:0}.p-steps-item{display:flex;flex:1 1 auto;justify-content:center;position:relative}.p-steps-item .p-menuitem-link{align-items:center;display:inline-flex;flex-direction:column;overflow:hidden;text-decoration:none}.p-steps.p-steps-readonly .p-steps-item{cursor:auto}.p-steps-item.p-steps-current .p-menuitem-link{cursor:default}.p-steps-title{white-space:nowrap}.p-steps-number{align-items:center;display:flex;justify-content:center}.p-steps-title{display:block}"]}]}],"members":{"activeIndex":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":5}}]}],"model":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":5}}]}],"readonly":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":5}}]}],"style":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":5}}]}],"styleClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":46,"character":5}}]}],"activeIndexChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":48,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":50,"character":32},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":50,"character":54},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":50,"character":82}]}],"ngOnInit":[{"__symbolic":"method"}],"itemClick":[{"__symbolic":"method"}],"isClickableRouterLink":[{"__symbolic":"method"}],"isActive":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}]}},"StepsModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":95,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":96,"character":14},{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":96,"character":27}],"exports":[{"__symbolic":"reference","name":"Steps"},{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":97,"character":20}],"declarations":[{"__symbolic":"reference","name":"Steps"}]}]}],"members":{}}},"origins":{"Steps":"./steps","StepsModule":"./steps"},"importAs":"primeng/steps"}