angular-wizard-form
Version:
<!-- [](https://badge.fury.io/js/angular2-wizard) --> <!-- [](https://travis-ci.org/maiyaporn/angular2-wizard) --
1 lines • 6.4 kB
JSON
[{"__symbolic":"module","version":3,"metadata":{"WizardComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"form-wizard","template":"<div class=\"card\">\n <div class=\"card-header\">\n <ul class=\"nav nav-justified\">\n <li class=\"nav-item\"\n *ngFor=\"let step of steps\"\n [ngClass]=\"{'active': step.isActive, 'enabled': !step.isDisabled, 'disabled': step.isDisabled, 'completed': isCompleted}\">\n <a (click)=\"goToStep(step)\">{{step.title}}</a>\n </li>\n </ul>\n </div>\n <div class=\"card-block\">\n <ng-content></ng-content>\n </div>\n <div class=\"card-footer\" [hidden]=\"isCompleted\">\n <button\n type=\"button\"\n class=\"btn btn-secondary float-left\"\n (click)=\"previous()\"\n [hidden]=\"!hasPrevStep || !activeStep.showPrev\">{{txtBtnPrevious}}</button>\n <button\n type=\"button\"\n class=\"btn btn-secondary float-right\"\n (click)=\"next()\"\n [disabled]=\"!activeStep.isValid\"\n [hidden]=\"!hasNextStep || !activeStep.showNext\">{{txtBtnNext}}</button>\n\n <button\n type=\"button\"\n class=\"btn btn-secondary float-right\"\n (click)=\"complete()\"\n [disabled]=\"!activeStep.isValid\"\n [hidden]=\"hasNextStep\">{{txtBtnDone}}</button>\n </div>\n </div>","styles":[".card { height: 100%; }",".card-header { background-color: #fff; padding: 0; font-size: 1.25rem; }",".card-block { overflow-y: auto; }",".card-footer { background-color: #fff; border-top: 0 none; }",".nav-item { padding: 1rem 0rem; border-bottom: 0.5rem solid #ccc; }",".active { font-weight: bold; color: black; border-bottom-color: #1976D2 !important; }",".enabled { cursor: pointer; border-bottom-color: rgb(88, 162, 234); }",".disabled { color: #ccc; }",".completed { cursor: default; }"]}]}],"members":{"wizardSteps":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"./wizard-step.component","name":"WizardStepComponent"}]}]}],"txtBtnPrevious":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"txtBtnNext":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"txtBtnDone":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onStepChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngAfterContentInit":[{"__symbolic":"method"}],"goToStep":[{"__symbolic":"method"}],"next":[{"__symbolic":"method"}],"previous":[{"__symbolic":"method"}],"complete":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"WizardComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component"},"arguments":[{"selector":"form-wizard","template":"<div class=\"card\">\n <div class=\"card-header\">\n <ul class=\"nav nav-justified\">\n <li class=\"nav-item\"\n *ngFor=\"let step of steps\"\n [ngClass]=\"{'active': step.isActive, 'enabled': !step.isDisabled, 'disabled': step.isDisabled, 'completed': isCompleted}\">\n <a (click)=\"goToStep(step)\">{{step.title}}</a>\n </li>\n </ul>\n </div>\n <div class=\"card-block\">\n <ng-content></ng-content>\n </div>\n <div class=\"card-footer\" [hidden]=\"isCompleted\">\n <button\n type=\"button\"\n class=\"btn btn-secondary float-left\"\n (click)=\"previous()\"\n [hidden]=\"!hasPrevStep || !activeStep.showPrev\">{{txtBtnPrevious}}</button>\n <button\n type=\"button\"\n class=\"btn btn-secondary float-right\"\n (click)=\"next()\"\n [disabled]=\"!activeStep.isValid\"\n [hidden]=\"!hasNextStep || !activeStep.showNext\">{{txtBtnNext}}</button>\n\n <button\n type=\"button\"\n class=\"btn btn-secondary float-right\"\n (click)=\"complete()\"\n [disabled]=\"!activeStep.isValid\"\n [hidden]=\"hasNextStep\">{{txtBtnDone}}</button>\n </div>\n </div>","styles":[".card { height: 100%; }",".card-header { background-color: #fff; padding: 0; font-size: 1.25rem; }",".card-block { overflow-y: auto; }",".card-footer { background-color: #fff; border-top: 0 none; }",".nav-item { padding: 1rem 0rem; border-bottom: 0.5rem solid #ccc; }",".active { font-weight: bold; color: black; border-bottom-color: #1976D2 !important; }",".enabled { cursor: pointer; border-bottom-color: rgb(88, 162, 234); }",".disabled { color: #ccc; }",".completed { cursor: default; }"]}]}],"members":{"wizardSteps":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren"},"arguments":[{"__symbolic":"reference","module":"./wizard-step.component","name":"WizardStepComponent"}]}]}],"txtBtnPrevious":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"txtBtnNext":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"txtBtnDone":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onStepChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngAfterContentInit":[{"__symbolic":"method"}],"goToStep":[{"__symbolic":"method"}],"next":[{"__symbolic":"method"}],"previous":[{"__symbolic":"method"}],"complete":[{"__symbolic":"method"}]}}}}]