@kushki/ng-suka
Version:
<p align="center"> <h1 align="center">Suka Components Angular</h1> <p align="center"> An Angular implementation of the Suka Design System </p> </p>
158 lines • 11.7 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import * as tslib_1 from "tslib";
import { Component, Input, HostBinding, Output, EventEmitter } from '@angular/core';
var Progress = /** @class */ (function () {
function Progress() {
this.baseClass = true;
this.linear = false;
this.editable = false;
this.selected = new EventEmitter();
this.stepsChange = new EventEmitter();
}
Object.defineProperty(Progress.prototype, "steps", {
get: /**
* @return {?}
*/
function () {
return this._steps;
},
set: /**
* @param {?} value
* @return {?}
*/
function (value) {
this._steps = value;
this.stepsChange.emit(this._steps);
},
enumerable: true,
configurable: true
});
/**
* @param {?} newIndex
* @return {?}
*/
Progress.prototype.select = /**
* @param {?} newIndex
* @return {?}
*/
function (newIndex) {
this._steps.forEach((/**
* @param {?} step
* @param {?} index
* @return {?}
*/
function (step, index) {
if (index === newIndex) {
step.current = true;
}
else if (step.current) {
delete step.current;
}
}));
this.selected.emit(newIndex);
this.steps = this._steps;
};
/**
* @param {?} step
* @return {?}
*/
Progress.prototype.isComplete = /**
* @param {?} step
* @return {?}
*/
function (step) {
return step.state === 'complete';
};
/**
* @param {?} step
* @return {?}
*/
Progress.prototype.isEditable = /**
* @param {?} step
* @return {?}
*/
function (step) {
return step.state === 'complete' && this.editable;
};
/**
* @param {?} step
* @param {?} index
* @return {?}
*/
Progress.prototype.isUnclickable = /**
* @param {?} step
* @param {?} index
* @return {?}
*/
function (step, index) {
if (step.state === 'complete' && !this.editable) {
return true;
}
if (step.state === 'incomplete' && !this.linear && index !== this.getNextStep()) {
return true;
}
return false;
};
/**
* @return {?}
*/
Progress.prototype.getNextStep = /**
* @return {?}
*/
function () {
var e_1, _a;
try {
for (var _b = tslib_1.__values(this.steps.entries()), _c = _b.next(); !_c.done; _c = _b.next()) {
var _d = tslib_1.__read(_c.value, 2), index = _d[0], step = _d[1];
if (step.state === 'incomplete') {
return index;
}
}
}
catch (e_1_1) { e_1 = { error: e_1_1 }; }
finally {
try {
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
}
finally { if (e_1) throw e_1.error; }
}
return -1;
};
Progress.decorators = [
{ type: Component, args: [{
selector: 'suka-progress',
template: "\n <div class=\"progress__wrapper\">\n <ul class=\"progress-bar\">\n <li\n *ngFor=\"let step of steps; let i = index\"\n class=\"progress-bar__step\"\n [ngClass]=\"{\n 'progress-bar__step--complete': isComplete(step),\n 'progress-bar__step--editable': isEditable(step),\n 'progress-bar__step--error': step.state === 'error',\n 'progress-bar__step--current': step.current,\n 'progress-bar__step--unclickable': isUnclickable(step, i)\n }\"\n >\n <div class=\"step\" role=\"button\" (click)=\"select(i)\">\n <div class=\"step__indicator\">\n <ng-container *ngIf=\"step.state !== 'complete' || step.current\">{{ i + 1 }}</ng-container>\n <suka-icon icon=\"check\" *ngIf=\"isComplete(step) && !isEditable(step) && !step.current\"></suka-icon>\n <suka-icon icon=\"edit-2\" *ngIf=\"isEditable(step) && !step.current\"></suka-icon>\n </div>\n <span class=\"step__label\"> {{ step.label }}</span>\n </div>\n </li>\n </ul>\n </div>\n "
}] }
];
Progress.propDecorators = {
baseClass: [{ type: HostBinding, args: ['class.progress',] }],
linear: [{ type: Input }],
editable: [{ type: Input }],
selected: [{ type: Output }],
stepsChange: [{ type: Output }],
steps: [{ type: Input }]
};
return Progress;
}());
export { Progress };
if (false) {
/**
* @type {?}
* @private
*/
Progress.prototype._steps;
/** @type {?} */
Progress.prototype.baseClass;
/** @type {?} */
Progress.prototype.linear;
/** @type {?} */
Progress.prototype.editable;
/** @type {?} */
Progress.prototype.selected;
/** @type {?} */
Progress.prototype.stepsChange;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvZ3Jlc3MuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGt1c2hraS9uZy1zdWthLyIsInNvdXJjZXMiOlsibGliL3Byb2dyZXNzL3Byb2dyZXNzLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7OztBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLFdBQVcsRUFBRSxNQUFNLEVBQUUsWUFBWSxFQUFVLE1BQU0sZUFBZSxDQUFDO0FBSTVGO0lBQUE7UUFnQ2lDLGNBQVMsR0FBRyxJQUFJLENBQUM7UUFFdkMsV0FBTSxHQUFHLEtBQUssQ0FBQztRQUNmLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFFaEIsYUFBUSxHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7UUFFOUIsZ0JBQVcsR0FBRyxJQUFJLFlBQVksRUFBRSxDQUFDO0lBb0Q3QyxDQUFDO0lBbkRDLHNCQUFhLDJCQUFLOzs7O1FBQWxCO1lBQ0UsT0FBTyxJQUFJLENBQUMsTUFBTSxDQUFDO1FBQ3JCLENBQUM7Ozs7O1FBQ0QsVUFBVSxLQUFLO1lBQ2IsSUFBSSxDQUFDLE1BQU0sR0FBRyxLQUFLLENBQUM7WUFFcEIsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBQ3JDLENBQUM7OztPQUxBOzs7OztJQU9ELHlCQUFNOzs7O0lBQU4sVUFBTyxRQUFRO1FBQ2IsSUFBSSxDQUFDLE1BQU0sQ0FBQyxPQUFPOzs7OztRQUFDLFVBQUMsSUFBSSxFQUFFLEtBQUs7WUFDOUIsSUFBSSxLQUFLLEtBQUssUUFBUSxFQUFFO2dCQUN0QixJQUFJLENBQUMsT0FBTyxHQUFHLElBQUksQ0FBQzthQUNyQjtpQkFBTSxJQUFHLElBQUksQ0FBQyxPQUFPLEVBQUU7Z0JBQ3RCLE9BQU8sSUFBSSxDQUFDLE9BQU8sQ0FBQzthQUNyQjtRQUNILENBQUMsRUFBQyxDQUFDO1FBRUgsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUM7UUFFN0IsSUFBSSxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUMsTUFBTSxDQUFDO0lBQzNCLENBQUM7Ozs7O0lBRUQsNkJBQVU7Ozs7SUFBVixVQUFXLElBQWtCO1FBQzNCLE9BQU8sSUFBSSxDQUFDLEtBQUssS0FBSyxVQUFVLENBQUM7SUFDbkMsQ0FBQzs7Ozs7SUFFRCw2QkFBVTs7OztJQUFWLFVBQVcsSUFBa0I7UUFDM0IsT0FBTyxJQUFJLENBQUMsS0FBSyxLQUFLLFVBQVUsSUFBSSxJQUFJLENBQUMsUUFBUSxDQUFDO0lBQ3BELENBQUM7Ozs7OztJQUVELGdDQUFhOzs7OztJQUFiLFVBQWMsSUFBa0IsRUFBRSxLQUFhO1FBQzdDLElBQUksSUFBSSxDQUFDLEtBQUssS0FBSyxVQUFVLElBQUksQ0FBQyxJQUFJLENBQUMsUUFBUSxFQUFFO1lBQy9DLE9BQU8sSUFBSSxDQUFDO1NBQ2I7UUFDRCxJQUFJLElBQUksQ0FBQyxLQUFLLEtBQUssWUFBWSxJQUFJLENBQUMsSUFBSSxDQUFDLE1BQU0sSUFBSSxLQUFLLEtBQUssSUFBSSxDQUFDLFdBQVcsRUFBRSxFQUFFO1lBQy9FLE9BQU8sSUFBSSxDQUFDO1NBQ2I7UUFFRCxPQUFPLEtBQUssQ0FBQztJQUNmLENBQUM7Ozs7SUFFRCw4QkFBVzs7O0lBQVg7OztZQUNFLEtBQTRCLElBQUEsS0FBQSxpQkFBQSxJQUFJLENBQUMsS0FBSyxDQUFDLE9BQU8sRUFBRSxDQUFBLGdCQUFBLDRCQUFFO2dCQUF2QyxJQUFBLGdDQUFhLEVBQVosYUFBSyxFQUFFLFlBQUk7Z0JBQ3JCLElBQUksSUFBSSxDQUFDLEtBQUssS0FBSyxZQUFZLEVBQUU7b0JBQy9CLE9BQU8sS0FBSyxDQUFDO2lCQUNkO2FBQ0Y7Ozs7Ozs7OztRQUVELE9BQU8sQ0FBQyxDQUFDLENBQUM7SUFDWixDQUFDOztnQkExRkYsU0FBUyxTQUFDO29CQUNULFFBQVEsRUFBRSxlQUFlO29CQUN6QixRQUFRLEVBQUUseW5DQXlCVDtpQkFDRjs7OzRCQUlFLFdBQVcsU0FBQyxnQkFBZ0I7eUJBRTVCLEtBQUs7MkJBQ0wsS0FBSzsyQkFFTCxNQUFNOzhCQUVOLE1BQU07d0JBQ04sS0FBSzs7SUFtRFIsZUFBQztDQUFBLEFBM0ZELElBMkZDO1NBOURZLFFBQVE7Ozs7OztJQUNuQiwwQkFBb0M7O0lBRXBDLDZCQUFnRDs7SUFFaEQsMEJBQXdCOztJQUN4Qiw0QkFBMEI7O0lBRTFCLDRCQUF3Qzs7SUFFeEMsK0JBQTJDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgSG9zdEJpbmRpbmcsIE91dHB1dCwgRXZlbnRFbWl0dGVyLCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFByb2dyZXNzU3RlcCB9IGZyb20gJy4vcHJvZ3Jlc3Mtc3RlcC5pbnRlcmZhY2UnO1xuXG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3N1a2EtcHJvZ3Jlc3MnLFxuICB0ZW1wbGF0ZTogYFxuICAgIDxkaXYgY2xhc3M9XCJwcm9ncmVzc19fd3JhcHBlclwiPlxuICAgICAgPHVsIGNsYXNzPVwicHJvZ3Jlc3MtYmFyXCI+XG4gICAgICAgIDxsaVxuICAgICAgICAgICpuZ0Zvcj1cImxldCBzdGVwIG9mIHN0ZXBzOyBsZXQgaSA9IGluZGV4XCJcbiAgICAgICAgICBjbGFzcz1cInByb2dyZXNzLWJhcl9fc3RlcFwiXG4gICAgICAgICAgW25nQ2xhc3NdPVwie1xuICAgICAgICAgICAgJ3Byb2dyZXNzLWJhcl9fc3RlcC0tY29tcGxldGUnOiBpc0NvbXBsZXRlKHN0ZXApLFxuICAgICAgICAgICAgJ3Byb2dyZXNzLWJhcl9fc3RlcC0tZWRpdGFibGUnOiBpc0VkaXRhYmxlKHN0ZXApLFxuICAgICAgICAgICAgJ3Byb2dyZXNzLWJhcl9fc3RlcC0tZXJyb3InOiBzdGVwLnN0YXRlID09PSAnZXJyb3InLFxuICAgICAgICAgICAgJ3Byb2dyZXNzLWJhcl9fc3RlcC0tY3VycmVudCc6IHN0ZXAuY3VycmVudCxcbiAgICAgICAgICAgICdwcm9ncmVzcy1iYXJfX3N0ZXAtLXVuY2xpY2thYmxlJzogaXNVbmNsaWNrYWJsZShzdGVwLCBpKVxuICAgICAgICAgIH1cIlxuICAgICAgICA+XG4gICAgICAgICAgPGRpdiBjbGFzcz1cInN0ZXBcIiByb2xlPVwiYnV0dG9uXCIgKGNsaWNrKT1cInNlbGVjdChpKVwiPlxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cInN0ZXBfX2luZGljYXRvclwiPlxuICAgICAgICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwic3RlcC5zdGF0ZSAhPT0gJ2NvbXBsZXRlJyB8fCBzdGVwLmN1cnJlbnRcIj57eyBpICsgMSB9fTwvbmctY29udGFpbmVyPlxuICAgICAgICAgICAgICA8c3VrYS1pY29uIGljb249XCJjaGVja1wiICpuZ0lmPVwiaXNDb21wbGV0ZShzdGVwKSAmJiAhaXNFZGl0YWJsZShzdGVwKSAmJiAhc3RlcC5jdXJyZW50XCI+PC9zdWthLWljb24+XG4gICAgICAgICAgICAgIDxzdWthLWljb24gaWNvbj1cImVkaXQtMlwiICpuZ0lmPVwiaXNFZGl0YWJsZShzdGVwKSAmJiAhc3RlcC5jdXJyZW50XCI+PC9zdWthLWljb24+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIDxzcGFuIGNsYXNzPVwic3RlcF9fbGFiZWxcIj4ge3sgc3RlcC5sYWJlbCB9fTwvc3Bhbj5cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC9saT5cbiAgICAgIDwvdWw+XG4gICAgPC9kaXY+XG4gIGBcbn0pXG5leHBvcnQgY2xhc3MgUHJvZ3Jlc3Mge1xuICBwcml2YXRlIF9zdGVwczogQXJyYXk8UHJvZ3Jlc3NTdGVwPjtcblxuICBASG9zdEJpbmRpbmcoJ2NsYXNzLnByb2dyZXNzJykgYmFzZUNsYXNzID0gdHJ1ZTtcblxuICBASW5wdXQoKSBsaW5lYXIgPSBmYWxzZTtcbiAgQElucHV0KCkgZWRpdGFibGUgPSBmYWxzZTtcblxuICBAT3V0cHV0KCkgc2VsZWN0ZWQgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG5cbiAgQE91dHB1dCgpIHN0ZXBzQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuICBASW5wdXQoKSBnZXQgc3RlcHMoKSB7XG4gICAgcmV0dXJuIHRoaXMuX3N0ZXBzO1xuICB9XG4gIHNldCBzdGVwcyh2YWx1ZSkge1xuICAgIHRoaXMuX3N0ZXBzID0gdmFsdWU7XG5cbiAgICB0aGlzLnN0ZXBzQ2hhbmdlLmVtaXQodGhpcy5fc3RlcHMpO1xuICB9XG5cbiAgc2VsZWN0KG5ld0luZGV4KTogdm9pZCB7XG4gICAgdGhpcy5fc3RlcHMuZm9yRWFjaCgoc3RlcCwgaW5kZXgpID0+IHtcbiAgICAgIGlmIChpbmRleCA9PT0gbmV3SW5kZXgpIHtcbiAgICAgICAgc3RlcC5jdXJyZW50ID0gdHJ1ZTtcbiAgICAgIH0gZWxzZSBpZihzdGVwLmN1cnJlbnQpIHtcbiAgICAgICAgZGVsZXRlIHN0ZXAuY3VycmVudDtcbiAgICAgIH1cbiAgICB9KTtcblxuICAgIHRoaXMuc2VsZWN0ZWQuZW1pdChuZXdJbmRleCk7XG5cbiAgICB0aGlzLnN0ZXBzID0gdGhpcy5fc3RlcHM7XG4gIH1cblxuICBpc0NvbXBsZXRlKHN0ZXA6IFByb2dyZXNzU3RlcCkge1xuICAgIHJldHVybiBzdGVwLnN0YXRlID09PSAnY29tcGxldGUnO1xuICB9XG5cbiAgaXNFZGl0YWJsZShzdGVwOiBQcm9ncmVzc1N0ZXApIHtcbiAgICByZXR1cm4gc3RlcC5zdGF0ZSA9PT0gJ2NvbXBsZXRlJyAmJiB0aGlzLmVkaXRhYmxlO1xuICB9XG5cbiAgaXNVbmNsaWNrYWJsZShzdGVwOiBQcm9ncmVzc1N0ZXAsIGluZGV4OiBudW1iZXIpOiBib29sZWFuIHtcbiAgICBpZiAoc3RlcC5zdGF0ZSA9PT0gJ2NvbXBsZXRlJyAmJiAhdGhpcy5lZGl0YWJsZSkge1xuICAgICAgcmV0dXJuIHRydWU7XG4gICAgfVxuICAgIGlmIChzdGVwLnN0YXRlID09PSAnaW5jb21wbGV0ZScgJiYgIXRoaXMubGluZWFyICYmIGluZGV4ICE9PSB0aGlzLmdldE5leHRTdGVwKCkpIHtcbiAgICAgIHJldHVybiB0cnVlO1xuICAgIH1cblxuICAgIHJldHVybiBmYWxzZTtcbiAgfVxuXG4gIGdldE5leHRTdGVwKCk6IG51bWJlciB7XG4gICAgZm9yIChjb25zdCBbaW5kZXgsIHN0ZXBdIG9mIHRoaXMuc3RlcHMuZW50cmllcygpKSB7XG4gICAgICBpZiAoc3RlcC5zdGF0ZSA9PT0gJ2luY29tcGxldGUnKSB7XG4gICAgICAgIHJldHVybiBpbmRleDtcbiAgICAgIH1cbiAgICB9XG5cbiAgICByZXR1cm4gLTE7XG4gIH1cbn1cbiJdfQ==