import * as i0 from '@angular/core';
import { Component, HostBinding, Input, NgModule } from '@angular/core';
import * as i2 from '@angular/forms';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i3 from '@aztrix/icons';
import { IconsModule } from '@aztrix/icons';
import * as i4 from '@aztrix/components/button';
import { ButtonModule } from '@aztrix/components/button';
import { MatLegacyFormFieldModule } from '@angular/material/legacy-form-field';
import { MatLegacyInputModule } from '@angular/material/legacy-input';
import { HelperPipesModule } from '@aztrix/helpers';

class RatingEditComponent {
    constructor() {
        this.propertyEditClass = true;
        this.required = false;
    }
    clearValue() {
        this.form.get('value').setValue(null);
    }
    get hasValue() {
        return this.form?.value?.value;
    }
}
RatingEditComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: RatingEditComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
RatingEditComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: RatingEditComponent, selector: "ax-rating-edit", inputs: { form: "form", label: "label", required: "required" }, host: { properties: { "class.c-property-edit": "this.propertyEditClass" } }, ngImport: i0, template: "<div class=\"header\">\n  <span class=\"label\">{{ label }}<span *ngIf=\"required\">&nbsp;*</span></span>\n\n  <button\n    axButton\n    icon-button\n    type=\"button\"\n    *ngIf=\"form?.enabled && hasValue\"\n    (click)=\"clearValue()\"\n  >\n    <ax-icon class=\"icon\" name=\"close\"></ax-icon>\n  </button>\n</div>\n<form [formGroup]=\"form\">\n  <span class=\"stars\">\n    <ng-container *ngFor=\"let number of ['5', '4', '3', '2', '1']\">\n      <input\n        [formControl]=\"form.get('value')\"\n        type=\"radio\"\n        [id]=\"'rating-' + number\"\n        name=\"rating\"\n        [value]=\"number\"\n        [checked]=\"form.get('value').value === number\"\n      />\n      <label [for]=\"'rating-' + number\" (click)=\"form.touched ? null : form.markAsTouched()\">\n        <ax-icon class=\"icon star\" name=\"star\"></ax-icon>\n      </label>\n    </ng-container>\n  </span>\n</form>\n", styles: [":host{display:flex;flex-direction:column}form{display:flex}.header{display:flex;justify-content:space-between}.header button{margin:-6px 0}.stars{display:inline-flex;flex-direction:row-reverse}.stars input{display:none}.stars input:hover~label .star{color:var(--primary-color-200)}.stars input:checked~label .star{color:var(--primary-color-500)}.stars label{cursor:pointer}.star{display:inline-block;color:#bdc3c9;transition:transform .4s cubic-bezier(.25,.8,.25,1),color .4s cubic-bezier(.25,.8,.25,1)}.star:hover{transform:scale(1.2)}\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: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.IconComponent, selector: "ax-icon", inputs: ["name", "inline"] }, { kind: "directive", type: i4.ButtonDirective, selector: "[axButton]", inputs: ["color", "labelHideMobile", "smallButton", "bigButton", "fullWidth", "filled", "outline", "icon-button", "hoverLabel", "hover", "lowercase", "disabled"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: RatingEditComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ax-rating-edit', template: "<div class=\"header\">\n  <span class=\"label\">{{ label }}<span *ngIf=\"required\">&nbsp;*</span></span>\n\n  <button\n    axButton\n    icon-button\n    type=\"button\"\n    *ngIf=\"form?.enabled && hasValue\"\n    (click)=\"clearValue()\"\n  >\n    <ax-icon class=\"icon\" name=\"close\"></ax-icon>\n  </button>\n</div>\n<form [formGroup]=\"form\">\n  <span class=\"stars\">\n    <ng-container *ngFor=\"let number of ['5', '4', '3', '2', '1']\">\n      <input\n        [formControl]=\"form.get('value')\"\n        type=\"radio\"\n        [id]=\"'rating-' + number\"\n        name=\"rating\"\n        [value]=\"number\"\n        [checked]=\"form.get('value').value === number\"\n      />\n      <label [for]=\"'rating-' + number\" (click)=\"form.touched ? null : form.markAsTouched()\">\n        <ax-icon class=\"icon star\" name=\"star\"></ax-icon>\n      </label>\n    </ng-container>\n  </span>\n</form>\n", styles: [":host{display:flex;flex-direction:column}form{display:flex}.header{display:flex;justify-content:space-between}.header button{margin:-6px 0}.stars{display:inline-flex;flex-direction:row-reverse}.stars input{display:none}.stars input:hover~label .star{color:var(--primary-color-200)}.stars input:checked~label .star{color:var(--primary-color-500)}.stars label{cursor:pointer}.star{display:inline-block;color:#bdc3c9;transition:transform .4s cubic-bezier(.25,.8,.25,1),color .4s cubic-bezier(.25,.8,.25,1)}.star:hover{transform:scale(1.2)}\n"] }]
        }], propDecorators: { propertyEditClass: [{
                type: HostBinding,
                args: ['class.c-property-edit']
            }], form: [{
                type: Input
            }], label: [{
                type: Input
            }], required: [{
                type: Input
            }] } });

class RatingEditModule {
}
RatingEditModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: RatingEditModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
RatingEditModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.1.5", ngImport: i0, type: RatingEditModule, declarations: [RatingEditComponent], imports: [CommonModule,
        FormsModule,
        ReactiveFormsModule,
        MatLegacyFormFieldModule,
        MatLegacyInputModule,
        IconsModule,
        HelperPipesModule,
        ButtonModule], exports: [RatingEditComponent] });
RatingEditModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: RatingEditModule, imports: [CommonModule,
        FormsModule,
        ReactiveFormsModule,
        MatLegacyFormFieldModule,
        MatLegacyInputModule,
        IconsModule,
        HelperPipesModule,
        ButtonModule] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: RatingEditModule, decorators: [{
            type: NgModule,
            args: [{
                    declarations: [RatingEditComponent],
                    imports: [
                        CommonModule,
                        FormsModule,
                        ReactiveFormsModule,
                        MatLegacyFormFieldModule,
                        MatLegacyInputModule,
                        IconsModule,
                        HelperPipesModule,
                        ButtonModule,
                    ],
                    exports: [RatingEditComponent],
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { RatingEditComponent, RatingEditModule };
//# sourceMappingURL=aztrix-components-rating-edit.mjs.map
//# sourceMappingURL=aztrix-components-rating-edit.mjs.map
