ngx-surveys
Version:
Angular 18+ survey / form builder
58 lines • 8.24 kB
JavaScript
import { Component, Input, Output, EventEmitter, ViewEncapsulation } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/material/button";
import * as i3 from "@angular/material/form-field";
import * as i4 from "@angular/material/tooltip";
import * as i5 from "@angular/material/icon";
export class StarRatingComponent {
constructor() {
this.ratingUpdated = new EventEmitter();
this.snackBarDuration = 2000;
this.ratingArr = [];
}
ngOnInit() {
for (let index = 0; index < this.starCount; index++) {
this.ratingArr.push(index);
}
}
onClick(rating) {
if (this.readOnly) {
return false;
}
this.rating = rating;
this.ratingUpdated.emit(rating);
return false;
}
showIcon(index) {
if (this.rating >= index + 1) {
return 'star';
}
else {
return 'star_border';
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: StarRatingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.12", type: StarRatingComponent, selector: "mat-star-rating", inputs: { rating: "rating", starCount: "starCount", color: "color", readOnly: "readOnly" }, outputs: { ratingUpdated: "ratingUpdated" }, ngImport: i0, template: "<button mat-icon-button [color]=\"color\" *ngFor=\"let ratingId of ratingArr;index as i\" [id]=\"'star_'+i\" (click)=\"onClick(i+1)\" [matTooltip]=\"ratingId+1\" matTooltipPosition=\"above\">\n <mat-icon>\n {{showIcon(i)}}\n </mat-icon>\n</button>\n<mat-error *ngIf=\"starCount == null || starCount == 0\">\n Star count is <strong>required</strong> and cannot be zero\n</mat-error>\n", styles: ["button{height:20px;width:25px;line-height:20px}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i3.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: StarRatingComponent, decorators: [{
type: Component,
args: [{ selector: 'mat-star-rating', encapsulation: ViewEncapsulation.Emulated, template: "<button mat-icon-button [color]=\"color\" *ngFor=\"let ratingId of ratingArr;index as i\" [id]=\"'star_'+i\" (click)=\"onClick(i+1)\" [matTooltip]=\"ratingId+1\" matTooltipPosition=\"above\">\n <mat-icon>\n {{showIcon(i)}}\n </mat-icon>\n</button>\n<mat-error *ngIf=\"starCount == null || starCount == 0\">\n Star count is <strong>required</strong> and cannot be zero\n</mat-error>\n", styles: ["button{height:20px;width:25px;line-height:20px}\n"] }]
}], ctorParameters: () => [], propDecorators: { rating: [{
type: Input
}], starCount: [{
type: Input
}], color: [{
type: Input
}], readOnly: [{
type: Input
}], ratingUpdated: [{
type: Output
}] } });
export var StarRatingColor;
(function (StarRatingColor) {
StarRatingColor["primary"] = "primary";
StarRatingColor["accent"] = "accent";
StarRatingColor["warn"] = "warn";
})(StarRatingColor || (StarRatingColor = {}));
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3Rhci1yYXRpbmcuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LXN1cnZleXMvc3JjL2xpYi9jb21wb25lbnRzL3N0YXItcmF0aW5nL3N0YXItcmF0aW5nLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1zdXJ2ZXlzL3NyYy9saWIvY29tcG9uZW50cy9zdGFyLXJhdGluZy9zdGFyLXJhdGluZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFVLEtBQUssRUFBRSxNQUFNLEVBQUUsWUFBWSxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDOzs7Ozs7O0FBU2xHLE1BQU0sT0FBTyxtQkFBbUI7SUFXOUI7UUFMaUIsa0JBQWEsR0FBRyxJQUFJLFlBQVksRUFBRSxDQUFDO1FBRTdDLHFCQUFnQixHQUFXLElBQUksQ0FBQztRQUNoQyxjQUFTLEdBQVksRUFBRSxDQUFDO0lBRy9CLENBQUM7SUFHRCxRQUFRO1FBQ04sS0FBSyxJQUFJLEtBQUssR0FBRyxDQUFDLEVBQUUsS0FBSyxHQUFHLElBQUksQ0FBQyxTQUFTLEVBQUUsS0FBSyxFQUFFLEVBQUUsQ0FBQztZQUNwRCxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUM3QixDQUFDO0lBQ0gsQ0FBQztJQUNELE9BQU8sQ0FBQyxNQUFhO1FBQ25CLElBQUksSUFBSSxDQUFDLFFBQVEsRUFBQyxDQUFDO1lBQ2YsT0FBTyxLQUFLLENBQUM7UUFDakIsQ0FBQztRQUNELElBQUksQ0FBQyxNQUFNLEdBQUMsTUFBTSxDQUFDO1FBQ25CLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDO1FBQ2hDLE9BQU8sS0FBSyxDQUFDO0lBQ2YsQ0FBQztJQUVELFFBQVEsQ0FBQyxLQUFZO1FBQ25CLElBQUksSUFBSSxDQUFDLE1BQU0sSUFBSSxLQUFLLEdBQUcsQ0FBQyxFQUFFLENBQUM7WUFDN0IsT0FBTyxNQUFNLENBQUM7UUFDaEIsQ0FBQzthQUFNLENBQUM7WUFDTixPQUFPLGFBQWEsQ0FBQztRQUN2QixDQUFDO0lBQ0gsQ0FBQzsrR0FuQ1UsbUJBQW1CO21HQUFuQixtQkFBbUIsZ01DVGhDLHVZQVFBOzs0RkRDYSxtQkFBbUI7a0JBTi9CLFNBQVM7K0JBQ0UsaUJBQWlCLGlCQUdaLGlCQUFpQixDQUFDLFFBQVE7d0RBSXpCLE1BQU07c0JBQXJCLEtBQUs7Z0JBQ1UsU0FBUztzQkFBeEIsS0FBSztnQkFDVSxLQUFLO3NCQUFwQixLQUFLO2dCQUNVLFFBQVE7c0JBQXZCLEtBQUs7Z0JBQ1csYUFBYTtzQkFBN0IsTUFBTTs7QUFnQ1QsTUFBTSxDQUFOLElBQVksZUFJWDtBQUpELFdBQVksZUFBZTtJQUN6QixzQ0FBbUIsQ0FBQTtJQUNuQixvQ0FBaUIsQ0FBQTtJQUNqQixnQ0FBYSxDQUFBO0FBQ2YsQ0FBQyxFQUpXLGVBQWUsS0FBZixlQUFlLFFBSTFCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBPbkluaXQsIElucHV0LCBPdXRwdXQsIEV2ZW50RW1pdHRlciwgVmlld0VuY2Fwc3VsYXRpb24gfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdtYXQtc3Rhci1yYXRpbmcnLFxuICB0ZW1wbGF0ZVVybDogJy4vc3Rhci1yYXRpbmcuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9zdGFyLXJhdGluZy5jb21wb25lbnQuY3NzJ10sXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLkVtdWxhdGVkXG59KVxuZXhwb3J0IGNsYXNzIFN0YXJSYXRpbmdDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuXG4gIEBJbnB1dCgpIHB1YmxpYyByYXRpbmc6IG51bWJlcjtcbiAgQElucHV0KCkgcHVibGljIHN0YXJDb3VudDogbnVtYmVyO1xuICBASW5wdXQoKSBwdWJsaWMgY29sb3I6IHN0cmluZztcbiAgQElucHV0KCkgcHVibGljIHJlYWRPbmx5OiBib29sZWFuO1xuICBAT3V0cHV0KCkgcHVibGljIHJhdGluZ1VwZGF0ZWQgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG5cbiAgcHVibGljIHNuYWNrQmFyRHVyYXRpb246IG51bWJlciA9IDIwMDA7XG4gIHB1YmxpYyByYXRpbmdBcnIgOiBudW1iZXJbXT1bXTtcblxuICBjb25zdHJ1Y3RvcigpIHtcbiAgfVxuXG5cbiAgbmdPbkluaXQoKSB7XG4gICAgZm9yIChsZXQgaW5kZXggPSAwOyBpbmRleCA8IHRoaXMuc3RhckNvdW50OyBpbmRleCsrKSB7XG4gICAgICB0aGlzLnJhdGluZ0Fyci5wdXNoKGluZGV4KTtcbiAgICB9XG4gIH1cbiAgb25DbGljayhyYXRpbmc6bnVtYmVyKSB7XG4gICAgaWYgKHRoaXMucmVhZE9ubHkpe1xuICAgICAgICByZXR1cm4gZmFsc2U7XG4gICAgfVxuICAgIHRoaXMucmF0aW5nPXJhdGluZztcbiAgICB0aGlzLnJhdGluZ1VwZGF0ZWQuZW1pdChyYXRpbmcpO1xuICAgIHJldHVybiBmYWxzZTtcbiAgfVxuXG4gIHNob3dJY29uKGluZGV4Om51bWJlcikge1xuICAgIGlmICh0aGlzLnJhdGluZyA+PSBpbmRleCArIDEpIHtcbiAgICAgIHJldHVybiAnc3Rhcic7XG4gICAgfSBlbHNlIHtcbiAgICAgIHJldHVybiAnc3Rhcl9ib3JkZXInO1xuICAgIH1cbiAgfVxuXG59XG5leHBvcnQgZW51bSBTdGFyUmF0aW5nQ29sb3Ige1xuICBwcmltYXJ5ID0gXCJwcmltYXJ5XCIsXG4gIGFjY2VudCA9IFwiYWNjZW50XCIsXG4gIHdhcm4gPSBcIndhcm5cIlxufVxuIiwiPGJ1dHRvbiBtYXQtaWNvbi1idXR0b24gW2NvbG9yXT1cImNvbG9yXCIgKm5nRm9yPVwibGV0IHJhdGluZ0lkIG9mIHJhdGluZ0FycjtpbmRleCBhcyBpXCIgW2lkXT1cIidzdGFyXycraVwiIChjbGljayk9XCJvbkNsaWNrKGkrMSlcIiBbbWF0VG9vbHRpcF09XCJyYXRpbmdJZCsxXCIgbWF0VG9vbHRpcFBvc2l0aW9uPVwiYWJvdmVcIj5cbiAgPG1hdC1pY29uPlxuICAgIHt7c2hvd0ljb24oaSl9fVxuICA8L21hdC1pY29uPlxuPC9idXR0b24+XG48bWF0LWVycm9yICpuZ0lmPVwic3RhckNvdW50ID09IG51bGwgfHwgc3RhckNvdW50ID09IDBcIj5cbiAgU3RhciBjb3VudCBpcyA8c3Ryb25nPnJlcXVpcmVkPC9zdHJvbmc+IGFuZCBjYW5ub3QgYmUgemVyb1xuPC9tYXQtZXJyb3I+XG4iXX0=