UNPKG

primeng-extensions

Version:

[![NPM version][npm-image]][npm-url] [![Build Status][travis-image]][travis-url] [![npm](https://img.shields.io/npm/dt/primeng-extensions.svg)]() [![Dependency Status][daviddm-image]][daviddm-url] ![Crates.io](https://img.shields.io/github/license/mashape

213 lines 10.9 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); 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