import * as i0 from '@angular/core';
import { Component, Input } from '@angular/core';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i4 from '@angular/forms';
import { ReactiveFormsModule } from '@angular/forms';
import { LdcDynamicButtonsComponent } from '@testlocallibrary/shared-kernel/components/ldc-dynamic-buttons';
import { LdcButtonTypes, ButtonType, LdcThemePalette } from '@testlocallibrary/shared-kernel/components/ldc-button';
import * as i2 from '@angular/material/input';
import { MatInputModule } from '@angular/material/input';
import * as i5 from '@ngx-translate/core';
import { TranslateModule } from '@ngx-translate/core';
import * as i3 from '@angular/material/form-field';

const DEFAULT_FORM_CONTROL_INPUT = {
    matType: LdcButtonTypes.Stroked,
    type: ButtonType.Button,
    color: LdcThemePalette.Secondary,
    className: "m-2",
};
class LdcSocialReferenceComponent {
    constructor() {
        this.placeholder = '';
        this.inputId = '';
        this.isRequired = false;
        this.buttonsOptions = [
            {
                ...DEFAULT_FORM_CONTROL_INPUT,
                id: "facebook",
                text: "social.facebook",
                onClick: () => {
                    this.controller.setValue("facebook");
                    this.toggleButton(0);
                },
            },
            {
                ...DEFAULT_FORM_CONTROL_INPUT,
                id: "instagram",
                text: "social.instagram",
                onClick: () => {
                    this.toggleButton(1);
                    this.controller.setValue("instagram");
                },
            },
            {
                ...DEFAULT_FORM_CONTROL_INPUT,
                id: "linkedIn",
                text: "social.linkedIn",
                onClick: () => {
                    this.toggleButton(2);
                    this.controller.setValue("linkedIn");
                },
            },
            {
                ...DEFAULT_FORM_CONTROL_INPUT,
                id: "google",
                text: "social.google",
                onClick: () => {
                    this.toggleButton(3);
                    this.controller.setValue("google");
                },
            },
            {
                ...DEFAULT_FORM_CONTROL_INPUT,
                id: "e-mail",
                text: "social.email",
                onClick: () => {
                    this.toggleButton(4);
                    this.controller.setValue("email");
                },
            },
            {
                ...DEFAULT_FORM_CONTROL_INPUT,
                id: "friends",
                text: "social.friends",
                onClick: () => {
                    this.toggleButton(5);
                    this.controller.setValue("friends");
                },
            },
            {
                matType: LdcButtonTypes.Raised,
                type: ButtonType.Button,
                color: LdcThemePalette.Primary,
                className: "m-2",
                id: "others",
                text: "social.others",
                onClick: () => {
                    this.toggleButton(6);
                    this.controller.setValue(null);
                    this.controller.markAsUntouched();
                },
            },
        ];
    }
    toggleButton(buttonIndex) {
        this.buttonsOptions.forEach((button, index) => {
            if (index !== buttonIndex) {
                button.matType = LdcButtonTypes.Stroked;
                button.color = LdcThemePalette.Secondary;
            }
            else {
                button.matType = LdcButtonTypes.Raised;
                button.color = LdcThemePalette.Primary;
            }
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LdcSocialReferenceComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LdcSocialReferenceComponent, isStandalone: true, selector: "lib-ldc-social-reference", inputs: { label: "label", controller: "controller", placeholder: "placeholder", inputId: "inputId", isRequired: "isRequired" }, ngImport: i0, template: "<div class=\"my-5 ldc-input\">\r\n  <mat-label class=\"stc-label justify-content-center d-flex\"\r\n  >{{'registrationForm.HowDoYouKnowAboutLdc' | translate}}\r\n    <small *ngIf=\"isRequired\" class=\"font-14 text-danger\">*</small>\r\n  </mat-label>\r\n  <div class=\"justify-content-center row my-3\">\r\n    <div class=\"col-12 justify-content-center d-flex\">\r\n      <lib-ldc-dynamic-buttons\r\n        class=\"text-center\"\r\n        [buttons]=\"buttonsOptions\"></lib-ldc-dynamic-buttons>\r\n    </div>\r\n    <mat-form-field\r\n      appearance=\"outline\"\r\n      class=\"ldc-input col-8 justify-content-center d-flex\"\r\n      *ngIf=\"controller.value !== 'facebook' && controller.value !==\r\n        'instagram' && controller.value !== 'linkedIn' && controller.value !== 'email' && controller.value !== 'google' && controller.value !== 'friends'\"\r\n    >\r\n      <input\r\n        [formControl]=\"controller\"\r\n        [placeholder]=\"placeholder | translate\"\r\n        [required]=\"isRequired\"\r\n        [id]=\"inputId\"\r\n        matInput\r\n      />\r\n    </mat-form-field>\r\n  </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LdcDynamicButtonsComponent, selector: "lib-ldc-dynamic-buttons", inputs: ["buttons", "item"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3.MatLabel, selector: "mat-label" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LdcSocialReferenceComponent, decorators: [{
            type: Component,
            args: [{ selector: 'lib-ldc-social-reference', standalone: true, imports: [
                        CommonModule,
                        LdcDynamicButtonsComponent,
                        MatInputModule,
                        ReactiveFormsModule,
                        TranslateModule,
                    ], template: "<div class=\"my-5 ldc-input\">\r\n  <mat-label class=\"stc-label justify-content-center d-flex\"\r\n  >{{'registrationForm.HowDoYouKnowAboutLdc' | translate}}\r\n    <small *ngIf=\"isRequired\" class=\"font-14 text-danger\">*</small>\r\n  </mat-label>\r\n  <div class=\"justify-content-center row my-3\">\r\n    <div class=\"col-12 justify-content-center d-flex\">\r\n      <lib-ldc-dynamic-buttons\r\n        class=\"text-center\"\r\n        [buttons]=\"buttonsOptions\"></lib-ldc-dynamic-buttons>\r\n    </div>\r\n    <mat-form-field\r\n      appearance=\"outline\"\r\n      class=\"ldc-input col-8 justify-content-center d-flex\"\r\n      *ngIf=\"controller.value !== 'facebook' && controller.value !==\r\n        'instagram' && controller.value !== 'linkedIn' && controller.value !== 'email' && controller.value !== 'google' && controller.value !== 'friends'\"\r\n    >\r\n      <input\r\n        [formControl]=\"controller\"\r\n        [placeholder]=\"placeholder | translate\"\r\n        [required]=\"isRequired\"\r\n        [id]=\"inputId\"\r\n        matInput\r\n      />\r\n    </mat-form-field>\r\n  </div>\r\n</div>\r\n" }]
        }], propDecorators: { label: [{
                type: Input,
                args: [{ required: true }]
            }], controller: [{
                type: Input
            }], placeholder: [{
                type: Input
            }], inputId: [{
                type: Input
            }], isRequired: [{
                type: Input
            }] } });

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

export { DEFAULT_FORM_CONTROL_INPUT, LdcSocialReferenceComponent };
//# sourceMappingURL=testlocallibrary-shared-kernel-components-ldc-form-ldc-fields-ldc-social-reference.mjs.map
