primeng-extensions
Version:
[![NPM version][npm-image]][npm-url] [![Build Status][travis-image]][travis-url] []() [![Dependency Status][daviddm-image]][daviddm-url] ;
var core_1 = require("@angular/core");
var common_1 = require("@angular/common");
var button_1 = require("primeng/button");
var steps_1 = require("primeng/steps");
var i0 = require("@angular/core");
var i1 = require("@angular/common");
var i2 = require("primeng/steps");
var i3 = require("primeng/button");
function StepComponent_div_0_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "div", 1);
i0.ɵɵprojection(1);
i0.ɵɵelementEnd();
} if (rf & 2) {
var ctx_r2 = i0.ɵɵnextContext();
i0.ɵɵclassMap(ctx_r2.styleClass);
i0.ɵɵproperty("ngClass", "ui-widget-content ui-corner-all pe-step-container");
} }
var _c0 = ["*"];
function StepsComponent_button_2_Template(rf, ctx) { if (rf & 1) {
var _r6 = i0.ɵɵgetCurrentView();
i0.ɵɵelementStart(0, "button", 3);
i0.ɵɵlistener("click", function StepsComponent_button_2_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); var ctx_r5 = i0.ɵɵnextContext(); return ctx_r5.previous(); });
i0.ɵɵelementEnd();
} }
function StepsComponent_button_3_Template(rf, ctx) { if (rf & 1) {
var _r8 = i0.ɵɵgetCurrentView();
i0.ɵɵelementStart(0, "button", 4);
i0.ɵɵlistener("click", function StepsComponent_button_3_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r8); var ctx_r7 = i0.ɵɵnextContext(); return ctx_r7.next(); });
i0.ɵɵelementEnd();
} }
var StepComponent = /** @class */ (function () {
function StepComponent() {
this.active = false;
}
StepComponent.ɵfac = function StepComponent_Factory(t) { return new (t || StepComponent)(); };
StepComponent.ɵcmp = i0.ɵɵdefineComponent({ type: StepComponent, selectors: [["pe-step"]], inputs: { styleClass: "styleClass", label: "label" }, ngContentSelectors: _c0, decls: 1, vars: 1, consts: [[3, "ngClass", "class", 4, "ngIf"], [3, "ngClass"]], template: function StepComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵprojectionDef();
i0.ɵɵtemplate(0, StepComponent_div_0_Template, 2, 3, "div", 0);
} if (rf & 2) {
i0.ɵɵproperty("ngIf", ctx.active);
} }, directives: [i1.NgIf, i1.NgClass], encapsulation: 2 });
return StepComponent;
}());
exports.StepComponent = StepComponent;
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(StepComponent, [{
type: core_1.Component,
args: [{
selector: 'pe-step',
template: "\n <div *ngIf=\"active\" [ngClass]=\"'ui-widget-content ui-corner-all pe-step-container'\" [class]=\"styleClass\">\n <ng-content></ng-content>\n </div>\n "
}]
}], null, { styleClass: [{
type: core_1.Input
}], label: [{
type: core_1.Input
}] }); })();
var StepsComponent = /** @class */ (function () {
function StepsComponent() {
this.activeIndex = 0;
this.activeIndexChange = new core_1.EventEmitter();
this.change = new core_1.EventEmitter();
this.items = [];
}
StepsComponent.prototype.ngAfterContentInit = function () {
var _this = this;
this.steps.toArray().forEach(function (step, index) {
if (!step.styleClass) {
// set style class if it was not set on step component directly
step.styleClass = _this.stepClass;
}
if (index === _this.activeIndex) {
// show this step on init
step.active = true;
}
_this.items[index] = {
label: step.label,
command: function () {
// hide all steps
_this.steps.toArray().forEach(function (s) { return s.active = false; });
// show the step the user has clicked on.
step.active = true;
_this.activeIndex = index;
// emit currently selected index (two-way binding)
_this.activeIndexChange.emit(index);
// emit currently selected label
_this.change.next(step.label);
}
};
});
};
StepsComponent.prototype.ngOnChanges = function (changes) {
var _this = this;
if (!this.steps) {
// we could also check changes['activeIndex'].isFirstChange()
return;
}
var _loop_1 = function (prop) {
if (prop === 'activeIndex') {
var curIndex_1 = changes[prop].currentValue;
this_1.steps.toArray().forEach(function (step, index) {
// show / hide the step
var selected = index === curIndex_1;
step.active = selected;
if (selected) {
// emit currently selected label
_this.change.next(step.label);
}
});
}
};
var this_1 = this;
for (var prop in changes) {
_loop_1(prop);
}
};
StepsComponent.prototype.previous = function () {
this.activeIndex--;
// emit currently selected index (two-way binding)
this.activeIndexChange.emit(this.activeIndex);
// show / hide steps and emit selected label
this.ngOnChanges({
activeIndex: {
currentValue: this.activeIndex,
previousValue: this.activeIndex + 1,
firstChange: false,
isFirstChange: returnIsFirstChange
}
});
};
StepsComponent.prototype.next = function () {
this.activeIndex++;
// emit currently selected index (two-way binding)
this.activeIndexChange.emit(this.activeIndex);
// show / hide steps and emit selected label
this.ngOnChanges({
activeIndex: {
currentValue: this.activeIndex,
previousValue: this.activeIndex - 1,
firstChange: false,
isFirstChange: returnIsFirstChange
}
});
};
StepsComponent.ɵfac = function StepsComponent_Factory(t) { return new (t || StepsComponent)(); };
StepsComponent.ɵcmp = i0.ɵɵdefineComponent({ type: StepsComponent, selectors: [["pe-steps"]], contentQueries: function StepsComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
i0.ɵɵcontentQuery(dirIndex, StepComponent, false);
} if (rf & 2) {
var _t;
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.steps = _t);
} }, inputs: { activeIndex: "activeIndex", styleClass: "styleClass", stepClass: "stepClass" }, outputs: { activeIndexChange: "activeIndexChange", change: "change" }, features: [i0.ɵɵNgOnChangesFeature], ngContentSelectors: _c0, decls: 4, vars: 7, consts: [[3, "model", "activeIndex", "readonly", "activeIndexChange"], ["pButton", "", "type", "text", "icon", "fa fa-hand-o-left", "label", "Previous", "class", "buttonsPadding", 3, "click", 4, "ngIf"], ["pButton", "", "type", "text", "icon", "fa fa-hand-o-right", "iconPos", "right", "label", "Next", 3, "click", 4, "ngIf"], ["pButton", "", "type", "text", "icon", "fa fa-hand-o-left", "label", "Previous", 1, "buttonsPadding", 3, "click"], ["pButton", "", "type", "text", "icon", "fa fa-hand-o-right", "iconPos", "right", "label", "Next", 3, "click"]], template: function StepsComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵprojectionDef();
i0.ɵɵelementStart(0, "p-steps", 0);
i0.ɵɵlistener("activeIndexChange", function StepsComponent_Template_p_steps_activeIndexChange_0_listener($event) { return ctx.activeIndex = $event; });
i0.ɵɵelementEnd();
i0.ɵɵprojection(1);
i0.ɵɵtemplate(2, StepsComponent_button_2_Template, 1, 0, "button", 1);
i0.ɵɵtemplate(3, StepsComponent_button_3_Template, 1, 0, "button", 2);
} if (rf & 2) {
i0.ɵɵclassMap(ctx.styleClass);
i0.ɵɵproperty("model", ctx.items)("activeIndex", ctx.activeIndex)("readonly", false);
i0.ɵɵadvance(2);
i0.ɵɵproperty("ngIf", ctx.activeIndex > 0);
i0.ɵɵadvance(1);
i0.ɵɵproperty("ngIf", ctx.activeIndex < ctx.items.length - 1);
} }, directives: [i2.Steps, i1.NgIf, i3.ButtonDirective], encapsulation: 2 });
return StepsComponent;
}());
exports.StepsComponent = StepsComponent;
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(StepsComponent, [{
type: core_1.Component,
args: [{
selector: 'pe-steps',
template: "\n <p-steps [model]=\"items\" [(activeIndex)]=\"activeIndex\"\n [class]=\"styleClass\" [readonly]=\"false\"></p-steps>\n <ng-content></ng-content>\n <button pButton type=\"text\" *ngIf=\"activeIndex > 0\"\n (click)=\"previous()\" icon=\"fa fa-hand-o-left\" label=\"Previous\" class=\"buttonsPadding\"></button>\n <button pButton type=\"text\" *ngIf=\"activeIndex < items.length - 1\"\n (click)=\"next()\" icon=\"fa fa-hand-o-right\" iconPos=\"right\" label=\"Next\">\n </button>\n "
}]
}], null, { activeIndex: [{
type: core_1.Input
}], styleClass: [{
type: core_1.Input
}], stepClass: [{
type: core_1.Input
}], activeIndexChange: [{
type: core_1.Output
}], change: [{
type: core_1.Output
}], steps: [{
type: core_1.ContentChildren,
args: [StepComponent]
}] }); })();
function returnIsFirstChange() {
return false;
}
exports.returnIsFirstChange = returnIsFirstChange;
var WizardModule = /** @class */ (function () {
function WizardModule() {
}
WizardModule.ɵmod = i0.ɵɵdefineNgModule({ type: WizardModule });
WizardModule.ɵinj = i0.ɵɵdefineInjector({ factory: function WizardModule_Factory(t) { return new (t || WizardModule)(); }, imports: [[common_1.CommonModule, button_1.ButtonModule, steps_1.StepsModule]] });
return WizardModule;
}());
exports.WizardModule = WizardModule;
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(WizardModule, { declarations: [StepComponent,
StepsComponent], imports: [common_1.CommonModule, button_1.ButtonModule, steps_1.StepsModule], exports: [StepComponent,
StepsComponent] }); })();
/*@__PURE__*/ (function () { i0.ɵsetClassMetadata(WizardModule, [{
type: core_1.NgModule,
args: [{
imports: [common_1.CommonModule, button_1.ButtonModule, steps_1.StepsModule],
exports: [StepComponent, StepsComponent],
declarations: [StepComponent, StepsComponent]
}]
}], null, null); })();
//# sourceMappingURL=wizard.js.map