mss-engine-forms/esm2020/lib/components/dynamic-field/dynamic-slider/dynamic-slider.component.mjs

A simple typehead library developed by MSS development team to be used for dynamic forms

import { ChangeDetectionStrategy, Component, Input } from "@angular/core";
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
import * as i2 from "@angular/common";
import * as i3 from "@angular-slider/ngx-slider";
export class DynamicSliderComponent {
    constructor(formgroupDirective) {
        this.formgroupDirective = formgroupDirective;
        this.tempType = "";
        this.formName = formgroupDirective.control;
    }
    ngOnChanges() {
        console.log({ DynamicInputComponentField: this.field });
        this.tempType = this.field.type;
    }
    getFieldClassname() {
        return {
            [this.field.customClass]: this.field?.customClass
        };
    }
}
DynamicSliderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DynamicSliderComponent, deps: [{ token: i1.FormGroupDirective }], target: i0.ɵɵFactoryTarget.Component });
DynamicSliderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DynamicSliderComponent, selector: "app-dynamic-slider", inputs: { field: "field" }, usesOnChanges: true, ngImport: i0, template: "<form [formGroup]=\"formName\">\n    <div class=\"form-group\" [ngClass]=\"getFieldClassname()\">\n        <label>{{field.label}} <span *ngIf=\"field?.rules?.required\" class=\"red-asterisk\">*</span></label>\n        <ngx-slider [(value)]=\"field.sliderValue\" [(highValue)]=\"field.sliderHignValue\"\n            [formControlName]=\"field.fieldName\" [options]=\"field.sliderOptions\"></ngx-slider>\n        <p class=\"text-center mb-2\">\n            De {{field.sliderValue}} Dinars - \u00E0 {{field.sliderHignValue}} Dinars\n        </p>\n    </div>\n</form>", styles: [".password-eye{position:absolute}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3.SliderComponent, selector: "ngx-slider", inputs: ["value", "highValue", "options", "manualRefresh", "triggerFocus"], outputs: ["valueChange", "highValueChange", "userChangeStart", "userChange", "userChangeEnd"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DynamicSliderComponent, decorators: [{
            type: Component,
            args: [{ selector: "app-dynamic-slider", changeDetection: ChangeDetectionStrategy.OnPush, template: "<form [formGroup]=\"formName\">\n    <div class=\"form-group\" [ngClass]=\"getFieldClassname()\">\n        <label>{{field.label}} <span *ngIf=\"field?.rules?.required\" class=\"red-asterisk\">*</span></label>\n        <ngx-slider [(value)]=\"field.sliderValue\" [(highValue)]=\"field.sliderHignValue\"\n            [formControlName]=\"field.fieldName\" [options]=\"field.sliderOptions\"></ngx-slider>\n        <p class=\"text-center mb-2\">\n            De {{field.sliderValue}} Dinars - \u00E0 {{field.sliderHignValue}} Dinars\n        </p>\n    </div>\n</form>", styles: [".password-eye{position:absolute}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.FormGroupDirective }]; }, propDecorators: { field: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHluYW1pYy1zbGlkZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbXNzLWZvcm1zL3NyYy9saWIvY29tcG9uZW50cy9keW5hbWljLWZpZWxkL2R5bmFtaWMtc2xpZGVyL2R5bmFtaWMtc2xpZGVyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL21zcy1mb3Jtcy9zcmMvbGliL2NvbXBvbmVudHMvZHluYW1pYy1maWVsZC9keW5hbWljLXNsaWRlci9keW5hbWljLXNsaWRlci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBb0MsTUFBTSxlQUFlLENBQUM7Ozs7O0FBUzVHLE1BQU0sT0FBTyxzQkFBc0I7SUFJakMsWUFBb0Isa0JBQXNDO1FBQXRDLHVCQUFrQixHQUFsQixrQkFBa0IsQ0FBb0I7UUFEMUQsYUFBUSxHQUFXLEVBQUUsQ0FBQTtRQUVuQixJQUFJLENBQUMsUUFBUSxHQUFHLGtCQUFrQixDQUFDLE9BQU8sQ0FBQztJQUM3QyxDQUFDO0lBRUQsV0FBVztRQUNULE9BQU8sQ0FBQyxHQUFHLENBQUMsRUFBQywwQkFBMEIsRUFBQyxJQUFJLENBQUMsS0FBSyxFQUFDLENBQUMsQ0FBQTtRQUNwRCxJQUFJLENBQUMsUUFBUSxHQUFHLElBQUksQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFBO0lBQ2pDLENBQUM7SUFFRCxpQkFBaUI7UUFDZixPQUFPO1lBQ0wsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLFdBQVcsQ0FBQyxFQUFFLElBQUksQ0FBQyxLQUFLLEVBQUUsV0FBVztTQUNsRCxDQUFBO0lBQ0gsQ0FBQzs7b0hBakJVLHNCQUFzQjt3R0FBdEIsc0JBQXNCLDJHQ1RuQyxvakJBU087NEZEQU0sc0JBQXNCO2tCQU5sQyxTQUFTOytCQUNFLG9CQUFvQixtQkFHZCx1QkFBdUIsQ0FBQyxNQUFNO3lHQUdyQyxLQUFLO3NCQUFiLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBJbnB1dCwgT25DaGFuZ2VzLCBPbkluaXQsIFNpbXBsZUNoYW5nZXMgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgRm9ybUdyb3VwLCBGb3JtR3JvdXBEaXJlY3RpdmUgfSBmcm9tIFwiQGFuZ3VsYXIvZm9ybXNcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiBcImFwcC1keW5hbWljLXNsaWRlclwiLFxuICB0ZW1wbGF0ZVVybDogXCIuL2R5bmFtaWMtc2xpZGVyLmNvbXBvbmVudC5odG1sXCIsXG4gIHN0eWxlVXJsczogW1wiLi9keW5hbWljLXNsaWRlci5jb21wb25lbnQuY3NzXCJdLFxuICBjaGFuZ2VEZXRlY3Rpb246Q2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoXG59KVxuZXhwb3J0IGNsYXNzIER5bmFtaWNTbGlkZXJDb21wb25lbnQgaW1wbGVtZW50cyBPbkNoYW5nZXMge1xuICBASW5wdXQoKSBmaWVsZDogYW55O1xuICBmb3JtTmFtZTogRm9ybUdyb3VwO1xuICB0ZW1wVHlwZTogc3RyaW5nID0gXCJcIlxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGZvcm1ncm91cERpcmVjdGl2ZTogRm9ybUdyb3VwRGlyZWN0aXZlKSB7XG4gICAgdGhpcy5mb3JtTmFtZSA9IGZvcm1ncm91cERpcmVjdGl2ZS5jb250cm9sO1xuICB9XG5cbiAgbmdPbkNoYW5nZXMoKSB7XG4gICAgY29uc29sZS5sb2coe0R5bmFtaWNJbnB1dENvbXBvbmVudEZpZWxkOnRoaXMuZmllbGR9KVxuICAgIHRoaXMudGVtcFR5cGUgPSB0aGlzLmZpZWxkLnR5cGVcbiAgfVxuXG4gIGdldEZpZWxkQ2xhc3NuYW1lKCkge1xuICAgIHJldHVybiB7XG4gICAgICBbdGhpcy5maWVsZC5jdXN0b21DbGFzc106IHRoaXMuZmllbGQ/LmN1c3RvbUNsYXNzXG4gICAgfVxuICB9XG59XG4iLCI8Zm9ybSBbZm9ybUdyb3VwXT1cImZvcm1OYW1lXCI+XG4gICAgPGRpdiBjbGFzcz1cImZvcm0tZ3JvdXBcIiBbbmdDbGFzc109XCJnZXRGaWVsZENsYXNzbmFtZSgpXCI+XG4gICAgICAgIDxsYWJlbD57e2ZpZWxkLmxhYmVsfX0gPHNwYW4gKm5nSWY9XCJmaWVsZD8ucnVsZXM/LnJlcXVpcmVkXCIgY2xhc3M9XCJyZWQtYXN0ZXJpc2tcIj4qPC9zcGFuPjwvbGFiZWw+XG4gICAgICAgIDxuZ3gtc2xpZGVyIFsodmFsdWUpXT1cImZpZWxkLnNsaWRlclZhbHVlXCIgWyhoaWdoVmFsdWUpXT1cImZpZWxkLnNsaWRlckhpZ25WYWx1ZVwiXG4gICAgICAgICAgICBbZm9ybUNvbnRyb2xOYW1lXT1cImZpZWxkLmZpZWxkTmFtZVwiIFtvcHRpb25zXT1cImZpZWxkLnNsaWRlck9wdGlvbnNcIj48L25neC1zbGlkZXI+XG4gICAgICAgIDxwIGNsYXNzPVwidGV4dC1jZW50ZXIgbWItMlwiPlxuICAgICAgICAgICAgRGUge3tmaWVsZC5zbGlkZXJWYWx1ZX19IERpbmFycyAtIMOgIHt7ZmllbGQuc2xpZGVySGlnblZhbHVlfX0gRGluYXJzXG4gICAgICAgIDwvcD5cbiAgICA8L2Rpdj5cbjwvZm9ybT4iXX0=