cocori-ng
Version:
Cocori-ng is an Angular full of great components & utilites based on Material
569 lines (557 loc) • 311 kB
JavaScript
import * as i0 from '@angular/core';
import { EventEmitter, Component, Output, Input, ChangeDetectionStrategy, Pipe, Inject, Injectable, ViewContainerRef, ViewChild, HostListener, Directive, NgModule, HostBinding, LOCALE_ID, ChangeDetectorRef, ViewEncapsulation } from '@angular/core';
import * as i1$2 from '@angular/forms';
import { UntypedFormControl, UntypedFormArray, ReactiveFormsModule, FormsModule } from '@angular/forms';
import * as i1 from 'cocori-ng/src/feature-core';
import { TypeButtonEnum, HttpService, DatasourceService, ValidatorsService, HelperService, FormInputComponents, ButtonIconPositon, QueryBuilder, WysiwygService, MappingBuilderService, HelperUploaderService, OdataClass, DataSourceType } from 'cocori-ng/src/feature-core';
import * as i2 from '@angular/router';
import { NavigationStart, RouterModule } from '@angular/router';
import { Subject, takeUntil, merge, BehaviorSubject, of, Observable, filter as filter$1, fromEvent } from 'rxjs';
import * as i1$1 from '@angular/common';
import { CommonModule, formatDate } from '@angular/common';
import * as i3 from '@angular/material/icon';
import { MatIconModule } from '@angular/material/icon';
import * as i5 from '@angular/material/button';
import { MatButtonModule } from '@angular/material/button';
import * as i3$2 from '@angular/material/checkbox';
import { MatCheckboxModule } from '@angular/material/checkbox';
import * as i3$1 from '@angular/material/form-field';
import { MatFormFieldModule } from '@angular/material/form-field';
import { filter, map, takeUntil as takeUntil$1, tap, last, catchError, take, debounceTime, switchMap } from 'rxjs/operators';
import * as i1$3 from '@angular/platform-browser';
import * as i5$2 from '@angular/material/core';
import { MAT_DATE_LOCALE } from '@angular/material/core';
import { DateTime } from 'luxon';
import * as i4 from '@angular/material/input';
import { MatInputModule } from '@angular/material/input';
import * as i5$1 from '@angular/material/datepicker';
import { MatDatepickerModule } from '@angular/material/datepicker';
import * as i8 from 'ngx-mask';
import { NgxMaskModule } from 'ngx-mask';
import * as i4$1 from '@angular/material/select';
import { MatSelectModule } from '@angular/material/select';
import * as i3$3 from '@angular/material/slide-toggle';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { HttpEventType } from '@angular/common/http';
import SparkMD5 from 'spark-md5';
import * as i1$4 from '@angular/material/snack-bar';
import { MAT_SNACK_BAR_DATA } from '@angular/material/snack-bar';
import * as i2$1 from '@angular/material/dialog';
import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
import * as i6 from '@tinymce/tinymce-angular';
import { EditorModule } from '@tinymce/tinymce-angular';
import * as i4$2 from '@angular/cdk/drag-drop';
import { DragDropModule, moveItemInArray } from '@angular/cdk/drag-drop';
import * as i2$2 from '@angular/material/bottom-sheet';
import { MAT_BOTTOM_SHEET_DATA, MatBottomSheetModule } from '@angular/material/bottom-sheet';
import * as i1$5 from '@angular/material/list';
import { MatListModule } from '@angular/material/list';
import { MatMenuModule } from '@angular/material/menu';
import * as i7 from '@angular/material/progress-bar';
import { MatProgressBarModule } from '@angular/material/progress-bar';
import * as i6$1 from '@angular/material/sidenav';
import { MatSidenavModule } from '@angular/material/sidenav';
const DefaultConfigComponent = {
form: {
keyId: "formId",
appearance: 'outline',
styleCompact: false
},
button: {
text: "Valider"
},
date: {
dateTimeSeparator: ' à '
},
upload: {
chunkSize: 2 * 1048576
},
wysiwyg: {
plugins: [
'quickbars',
'advlist',
'autolink',
'lists',
'link',
'image',
'media',
'imagetools',
'emoticons',
'preview',
'searchreplace',
'media',
'table',
'paste',
'code',
'help',
],
toolbar: 'undo redo | bullist | imageoptions | quicklink | outdent | indent | emoticons',
quickbarsInsert: 'bullist numlist | imageoptions media | quicklink | quicktable | emoticons'
}
};
const ConfigEvents = {
FORM_SUBMITTED: "FORM_SUBMITTED",
CMS_RESPONSIVE_ORIENTATION_CHANGED: "CMS_RESPONSIVE_ORIENTATION_CHANGED",
};
class CocoringButtonComponent {
constructor(loadingService, cdr) {
this.loadingService = loadingService;
this.cdr = cdr;
this.callback = new EventEmitter();
this.click = new EventEmitter();
this.disabled = false;
this.type = TypeButtonEnum.SUBMIT;
this.class = 'primary';
this.isLoading = false;
this.destroy$ = new Subject();
}
set config(config) {
if (!config)
return;
this.text = config.text;
this.icon = config.icon;
this.class = config.className || this.class;
this.iconPosition = config.iconPosition;
this.type = config.type;
this.onClickSubmit = config.onClickSubmit;
}
ngOnInit() {
this.loadingService.subject.pipe(takeUntil(this.destroy$)).subscribe((isLoading) => {
this.isLoading = isLoading;
this.cdr.detectChanges();
});
this.callback.emit(this.text);
}
ngOnDestroy() {
this.destroy$.next(undefined);
this.destroy$.complete();
}
onClick() {
if (this.type === TypeButtonEnum.SUBMIT && this.onClickSubmit) {
this.onClickSubmit();
}
else if (this.type === TypeButtonEnum.BUTTON && this.onClickSubmit) {
this.click.emit();
}
}
}
CocoringButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringButtonComponent, deps: [{ token: i1.LoadingService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
CocoringButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: CocoringButtonComponent, selector: "cocoring-button", inputs: { disabled: "disabled", text: "text", type: "type", class: "class", config: "config" }, outputs: { callback: "callback", click: "click" }, ngImport: i0, template: "<button class=\"btn\" mat-raised-button [ngClass]=\"class\" [class.spinner]=\"isLoading\" type=\"{{type}}\"\r\n [disabled]=\"isLoading || disabled\" (click)=\"onClick()\">\r\n <mat-icon *ngIf=\"icon && iconPosition === 'start' \">{{icon}}</mat-icon>\r\n {{text}}\r\n <ng-content></ng-content>\r\n <mat-icon *ngIf=\"icon && iconPosition === 'end'\">{{icon}}</mat-icon>\r\n</button>", styles: [""], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringButtonComponent, decorators: [{
type: Component,
args: [{ selector: 'cocoring-button', template: "<button class=\"btn\" mat-raised-button [ngClass]=\"class\" [class.spinner]=\"isLoading\" type=\"{{type}}\"\r\n [disabled]=\"isLoading || disabled\" (click)=\"onClick()\">\r\n <mat-icon *ngIf=\"icon && iconPosition === 'start' \">{{icon}}</mat-icon>\r\n {{text}}\r\n <ng-content></ng-content>\r\n <mat-icon *ngIf=\"icon && iconPosition === 'end'\">{{icon}}</mat-icon>\r\n</button>" }]
}], ctorParameters: function () { return [{ type: i1.LoadingService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { callback: [{
type: Output
}], click: [{
type: Output
}], disabled: [{
type: Input
}], text: [{
type: Input
}], type: [{
type: Input
}], class: [{
type: Input
}], config: [{
type: Input
}] } });
class CocoringButtonLinkComponent {
/** Mettre les bons Inputs de base comme ceux utilisé dans le projet atlantX */
constructor() {
this.url = '/bo/home';
this.openNewTab = false;
}
set config(config) {
if (!config)
return;
config.type = TypeButtonEnum.BUTTON;
this.url = config.url;
this.openNewTab = config.openNewTab || false;
this.btnConfig = config;
}
ngOnInit() { }
ngOnDestroy() { }
}
CocoringButtonLinkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringButtonLinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
CocoringButtonLinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: CocoringButtonLinkComponent, selector: "cocoring-button-link", inputs: { config: "config" }, ngImport: i0, template: "<a [routerLink]=\"url ? url : null\" target=\"{{openNewTab ? '_blank' : '_self'}}\">\r\n <cocoring-button [config]=\"btnConfig\"></cocoring-button>\r\n</a>", styles: [""], dependencies: [{ kind: "directive", type: i2.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { kind: "component", type: CocoringButtonComponent, selector: "cocoring-button", inputs: ["disabled", "text", "type", "class", "config"], outputs: ["callback", "click"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringButtonLinkComponent, decorators: [{
type: Component,
args: [{ selector: 'cocoring-button-link', template: "<a [routerLink]=\"url ? url : null\" target=\"{{openNewTab ? '_blank' : '_self'}}\">\r\n <cocoring-button [config]=\"btnConfig\"></cocoring-button>\r\n</a>" }]
}], ctorParameters: function () { return []; }, propDecorators: { config: [{
type: Input
}] } });
class ExtendInputsComponent {
constructor(injector) {
this.color = 'primary'; /** à factoriser dans le helper pour la construction de form */
/** méthode appelée lorsque que le contrôle a été ajouté au formulaire avec en paramètre le nom du contrôle créé */
this.callback = new EventEmitter();
this.destroy$ = new Subject();
this.httpService = injector.get(HttpService);
this.datasourceService = injector.get(DatasourceService);
}
ngOnDestroy() {
this.destroy$.next(undefined);
this.destroy$.complete();
}
configInput(config) {
this.nameLabel = config.nameLabel;
this.nameControl = config.nameControl;
this.formGroup = config.formGroup;
this.styleCompact = config.styleCompact;
this.maxlength = config.maxlength;
this.icon = config.icon;
this.appearance = config.appearance;
this.dataSource$ = this.loadDataSource(config.dataSource);
this.inRelationWith = config.inRelationWith;
this.validators = config.validators;
this.callbackComponent = config.callbackComponent;
this.nameLabel += this.isControlRequired() ? ' *' : '';
}
emitEvent() {
if (!this.formGroup || !this.nameControl) {
throw new Error(`Données formulaire manquantes, formGroup : ${this.formGroup} - nameControl : ${this.nameControl}`);
}
this.inRelatioNWith();
if (this.callbackComponent) {
this.callbackComponent.callback(this.nameControl);
}
else {
this.callback.emit(this.nameControl);
}
}
clearValue(event) {
this.formGroup.get(this.nameControl).reset();
this.formGroup.get(this.nameControl).markAsUntouched();
if (event)
event.stopPropagation();
}
addControlForm() {
if (this.controlAlreadyAdded())
return;
this.formGroup.addControl(this.nameControl, new UntypedFormControl(null, this.validators));
this.emitEvent();
}
addArrayForm() {
if (this.controlAlreadyAdded())
return;
this.formGroup.addControl(this.nameControl, new UntypedFormArray([], this.validators));
this.emitEvent();
}
controlAlreadyAdded() {
return this.formGroup.contains(this.nameControl);
}
loadDataSource(configDataSource) {
if (!configDataSource)
return;
this.dataSourceNameProperty = configDataSource.dataSourceNameProperty || 'name';
return this.datasourceService.loadDataSource(configDataSource);
}
inRelatioNWith() {
if (this.inRelationWith && typeof this.inRelationWith !== 'undefined') {
console.log("inRelationWith>>", this.inRelationWith, this.formGroup);
this.formGroup.get(this.inRelationWith).valueChanges.pipe(takeUntil(this.destroy$)).subscribe((parentValue) => {
console.log("Parent Value ", parentValue);
});
}
}
isControlRequired() {
if (!this.validators)
return;
const d = this.validators.find((validatorFn) => validatorFn.name === ValidatorsService.require.name);
return typeof d === 'undefined' ? false : true;
}
}
ExtendInputsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: ExtendInputsComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
ExtendInputsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: ExtendInputsComponent, selector: "extend-inputs", inputs: { formGroup: "formGroup", nameControl: "nameControl", nameLabel: "nameLabel", color: "color" }, outputs: { callback: "callback" }, host: { classAttribute: "input-form" }, ngImport: i0, template: '', isInline: true });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: ExtendInputsComponent, decorators: [{
type: Component,
args: [{
selector: 'extend-inputs',
template: '',
host: { 'class': 'input-form' }
}]
}], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { formGroup: [{
type: Input
}], nameControl: [{
type: Input
}], nameLabel: [{
type: Input
}], color: [{
type: Input
}], callback: [{
type: Output
}] } });
class CocoringInputErrorComponent {
constructor(broadcastEventService, validatorsService) {
this.broadcastEventService = broadcastEventService;
this.validatorsService = validatorsService;
}
ngOnInit() {
if (!this.form.get(DefaultConfigComponent.form.keyId))
return;
this.formId = this.form.get(DefaultConfigComponent.form.keyId).value;
const onSubmitObs = this.broadcastEventService.listen([ConfigEvents.FORM_SUBMITTED, this.formId]);
const valueChangesObs = this.form.get(this.controlName).valueChanges;
this.mergeObservables(onSubmitObs, valueChangesObs);
}
ngOnDestroy() { }
mergeObservables(onSubmitObs, valueChangesObs) {
this.errorMessage$ = merge(onSubmitObs, valueChangesObs)
.pipe(filter((value) => this.form.get(this.controlName).errors !== null), map((value) => this.form.get(this.controlName).errors), map((formError) => {
const errorKey = Object.keys(formError)[0];
/** pour déclencher l'erreur angular material */
this.form.get(this.controlName).markAsTouched();
return this.validatorsService.getValidationErrorMessage({ key: errorKey, value: formError[errorKey] });
}));
}
}
CocoringInputErrorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringInputErrorComponent, deps: [{ token: i1.BroadcastEventService }, { token: i1.ValidatorsService }], target: i0.ɵɵFactoryTarget.Component });
CocoringInputErrorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: CocoringInputErrorComponent, selector: "[error-handler]", inputs: { form: "form", controlName: "controlName" }, ngImport: i0, template: `
<ng-container *ngIf="(errorMessage$ | async) as errorMessage">
<mat-error>{{errorMessage}}</mat-error>
</ng-container>
`, isInline: true, styles: [".error{position:absolute;margin-left:8px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringInputErrorComponent, decorators: [{
type: Component,
args: [{ selector: '[error-handler]', template: `
<ng-container *ngIf="(errorMessage$ | async) as errorMessage">
<mat-error>{{errorMessage}}</mat-error>
</ng-container>
`, styles: [".error{position:absolute;margin-left:8px}\n"] }]
}], ctorParameters: function () { return [{ type: i1.BroadcastEventService }, { type: i1.ValidatorsService }]; }, propDecorators: { form: [{
type: Input
}], controlName: [{
type: Input
}] } });
class CocoringCheckboxIndeterminateComponent extends ExtendInputsComponent {
constructor(fb, cdr, injector) {
super(injector);
this.fb = fb;
this.cdr = cdr;
this.nestedNameForm = 'nestedValues';
this.someComplete = false;
}
set config(config) {
this.configInput(config);
this.addControlForm();
this.dataSource$.pipe(takeUntil(this.destroy$)).subscribe((datasource) => {
this.addNestedForm(datasource);
});
}
addNestedForm(datasource) {
if (!datasource.length)
return;
const nestedFrom = this.fb.group({});
datasource.forEach((datas) => {
nestedFrom.addControl(datas.id, new UntypedFormControl(false));
});
this.formGroup.addControl(this.nestedNameForm, nestedFrom);
this.formChangeEvent();
this.nestedFormChangeEvent();
}
formChangeEvent() {
this.formGroup.get(this.nameControl).valueChanges.pipe(takeUntil(this.destroy$)).subscribe((value) => {
this.setValueControls(value);
});
}
setValueControls(value) {
Object.keys(this.nestedForm['controls']).forEach(key => {
this.nestedForm['controls'][key].setValue(value, { emitEvent: false });
});
}
nestedFormChangeEvent() {
// const nestedFormPropertiesLength: number = this.formHelperService.countControlsForm(this.nestedForm)
const nestedFormPropertiesLength = 3;
this.nestedForm.valueChanges.pipe(takeUntil(this.destroy$)).subscribe((values) => {
const completed = Object.entries(values).filter(([key, value]) => value === true);
if (completed.length === nestedFormPropertiesLength) {
this.formGroup.get(this.nameControl).setValue(true, { emitEvent: false });
setTimeout(() => {
this.someComplete = false;
this.cdr.detectChanges();
});
}
else if (completed.length > 0 && completed.length < nestedFormPropertiesLength) {
this.formGroup.get(this.nameControl).setValue(false, { emitEvent: false });
setTimeout(() => {
this.someComplete = true;
this.cdr.detectChanges();
});
}
else {
this.someComplete = false;
this.formGroup.get(this.nameControl).setValue(false, { emitEvent: false });
}
});
}
get nestedForm() {
return this.formGroup.get(this.nestedNameForm);
}
}
CocoringCheckboxIndeterminateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringCheckboxIndeterminateComponent, deps: [{ token: i1$2.UntypedFormBuilder }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
CocoringCheckboxIndeterminateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: CocoringCheckboxIndeterminateComponent, selector: "cocoring-checkbox-indeterminate", inputs: { config: "config" }, usesInheritance: true, ngImport: i0, template: "<ng-container [formGroup]=\"formGroup\">\r\n <mat-checkbox\r\n class=\"optionSelectAll\"\r\n [formControlName]=\"nameControl\" \r\n [indeterminate]=\"someComplete\"\r\n color=\"primary\"\r\n (click)=\"$event.stopPropagation()\">\r\n {{nameLabel}}\r\n </mat-checkbox>\r\n\r\n <ng-container [formGroupName]=\"nestedNameForm\">\r\n <mat-checkbox *ngFor=\"let item of (dataSource$ | async)\" \r\n [formControlName]=\"item.id\"\r\n color=\"primary\">\r\n {{item[dataSourceNameProperty]}}\r\n </mat-checkbox>\r\n </ng-container>\r\n\r\n <mat-error error-handler [form]=\"formGroup\" [controlName]=\"nameControl\"></mat-error>\r\n</ng-container>", styles: [".align-center{text-align:center}.align-left{text-align:left}.align-right{text-align:right}.noselect{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.stickyPosition{-webkit-position:sticky;-moz-position:sticky;-ms-position:sticky;-o-position:sticky;position:sticky;z-index:1001;top:0px}@media (min-width: 601px){.hide-scroll{scrollbar-color:white white}.hide-scroll::-webkit-scrollbar{background-color:transparent;height:13px}.hide-scroll::-webkit-scrollbar-thumb{background-color:transparent}.hide-scroll:hover{scrollbar-color:#d9d9d9 white}.hide-scroll:hover::-webkit-scrollbar-thumb{border-radius:3px;background-color:#d9d9d9}}.m-t-0{margin-top:0}.m-t-5{margin-top:5px}.m-t-10{margin-top:10px}.m-t-15{margin-top:15px}.m-t-20{margin-top:20px}.m-t-25{margin-top:25px}.m-t-30{margin-top:30px}.m-t-35{margin-top:35px}.m-t-40{margin-top:40px}.m-t-45{margin-top:45px}.m-t-50{margin-top:50px}.m-r-0{margin-right:0}.m-r-5{margin-right:5px}.m-r-10{margin-right:10px}.m-r-15{margin-right:15px}.m-r-20{margin-right:20px}.m-r-25{margin-right:25px}.m-r-30{margin-right:30px}.m-r-35{margin-right:35px}.m-r-40{margin-right:40px}.m-r-45{margin-right:45px}.m-r-50{margin-right:50px}.m-b-0{margin-bottom:0}.m-b-5{margin-bottom:5px}.m-b-10{margin-bottom:10px}.m-b-15{margin-bottom:15px}.m-b-20{margin-bottom:20px}.m-b-25{margin-bottom:25px}.m-b-30{margin-bottom:30px}.m-b-35{margin-bottom:35px}.m-b-40{margin-bottom:40px}.m-b-45{margin-bottom:45px}.m-b-50{margin-bottom:50px}.m-l-0{margin-left:0}.m-l-5{margin-left:5px}.m-l-10{margin-left:10px}.m-l-15{margin-left:15px}.m-l-20{margin-left:20px}.m-l-25{margin-left:25px}.m-l-30{margin-left:30px}.m-l-35{margin-left:35px}.m-l-40{margin-left:40px}.m-l-45{margin-left:45px}.m-l-50{margin-left:50px}.m-x-0{margin:0}.m-x-5{margin:5px}.m-x-10{margin:10px}.m-x-15{margin:15px}.m-x-20{margin:20px}.m-x-25{margin:25px}.m-x-30{margin:30px}.m-x-35{margin:35px}.m-x-40{margin:40px}.m-x-45{margin:45px}.m-x-50{margin:50px}.p-t-0{padding-top:0}.p-t-5{padding-top:5px}.p-t-10{padding-top:10px}.p-t-15{padding-top:15px}.p-t-20{padding-top:20px}.p-t-25{padding-top:25px}.p-t-30{padding-top:30px}.p-t-35{padding-top:35px}.p-t-40{padding-top:40px}.p-t-45{padding-top:45px}.p-t-50{padding-top:50px}.p-r-0{padding-right:0}.p-r-5{padding-right:5px}.p-r-10{padding-right:10px}.p-r-15{padding-right:15px}.p-r-20{padding-right:20px}.p-r-25{padding-right:25px}.p-r-30{padding-right:30px}.p-r-35{padding-right:35px}.p-r-40{padding-right:40px}.p-r-45{padding-right:45px}.p-r-50{padding-right:50px}.p-b-0{padding-bottom:0}.p-b-5{padding-bottom:5px}.p-b-10{padding-bottom:10px}.p-b-15{padding-bottom:15px}.p-b-20{padding-bottom:20px}.p-b-25{padding-bottom:25px}.p-b-30{padding-bottom:30px}.p-b-35{padding-bottom:35px}.p-b-40{padding-bottom:40px}.p-b-45{padding-bottom:45px}.p-b-50{padding-bottom:50px}.p-l-0{padding-left:0}.p-l-5{padding-left:5px}.p-l-10{padding-left:10px}.p-l-15{padding-left:15px}.p-l-20{padding-left:20px}.p-l-25{padding-left:25px}.p-l-30{padding-left:30px}.p-l-35{padding-left:35px}.p-l-40{padding-left:40px}.p-l-45{padding-left:45px}.p-l-50{padding-left:50px}.p-x-0{padding:0}.p-x-5{padding:5px}.p-x-10{padding:10px}.p-x-15{padding:15px}.p-x-20{padding:20px}.p-x-25{padding:25px}.p-x-30{padding:30px}.p-x-35{padding:35px}.p-x-40{padding:40px}.p-x-45{padding:45px}.p-x-50{padding:50px}.mat-form-field{width:100%}.mat-calendar-body-selected{color:#fff!important}.mat-form-field-appearance-standard.mat-form-field-has-label .mat-select:not(.mat-select-empty) .mat-select-arrow-wrapper{transform:translateY(-17%)!important}.mat-checkbox-label{margin-left:5px}:host{display:block;flex-direction:column;display:flex}.optionSelectAll{position:relative;margin-bottom:10px}.optionSelectAll:before{content:\"\";position:absolute;left:0;bottom:0;height:1px;width:50%;border-bottom:1px solid yellow}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "component", type: i3$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i3$1.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: CocoringInputErrorComponent, selector: "[error-handler]", inputs: ["form", "controlName"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringCheckboxIndeterminateComponent, decorators: [{
type: Component,
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'cocoring-checkbox-indeterminate', template: "<ng-container [formGroup]=\"formGroup\">\r\n <mat-checkbox\r\n class=\"optionSelectAll\"\r\n [formControlName]=\"nameControl\" \r\n [indeterminate]=\"someComplete\"\r\n color=\"primary\"\r\n (click)=\"$event.stopPropagation()\">\r\n {{nameLabel}}\r\n </mat-checkbox>\r\n\r\n <ng-container [formGroupName]=\"nestedNameForm\">\r\n <mat-checkbox *ngFor=\"let item of (dataSource$ | async)\" \r\n [formControlName]=\"item.id\"\r\n color=\"primary\">\r\n {{item[dataSourceNameProperty]}}\r\n </mat-checkbox>\r\n </ng-container>\r\n\r\n <mat-error error-handler [form]=\"formGroup\" [controlName]=\"nameControl\"></mat-error>\r\n</ng-container>", styles: [".align-center{text-align:center}.align-left{text-align:left}.align-right{text-align:right}.noselect{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.stickyPosition{-webkit-position:sticky;-moz-position:sticky;-ms-position:sticky;-o-position:sticky;position:sticky;z-index:1001;top:0px}@media (min-width: 601px){.hide-scroll{scrollbar-color:white white}.hide-scroll::-webkit-scrollbar{background-color:transparent;height:13px}.hide-scroll::-webkit-scrollbar-thumb{background-color:transparent}.hide-scroll:hover{scrollbar-color:#d9d9d9 white}.hide-scroll:hover::-webkit-scrollbar-thumb{border-radius:3px;background-color:#d9d9d9}}.m-t-0{margin-top:0}.m-t-5{margin-top:5px}.m-t-10{margin-top:10px}.m-t-15{margin-top:15px}.m-t-20{margin-top:20px}.m-t-25{margin-top:25px}.m-t-30{margin-top:30px}.m-t-35{margin-top:35px}.m-t-40{margin-top:40px}.m-t-45{margin-top:45px}.m-t-50{margin-top:50px}.m-r-0{margin-right:0}.m-r-5{margin-right:5px}.m-r-10{margin-right:10px}.m-r-15{margin-right:15px}.m-r-20{margin-right:20px}.m-r-25{margin-right:25px}.m-r-30{margin-right:30px}.m-r-35{margin-right:35px}.m-r-40{margin-right:40px}.m-r-45{margin-right:45px}.m-r-50{margin-right:50px}.m-b-0{margin-bottom:0}.m-b-5{margin-bottom:5px}.m-b-10{margin-bottom:10px}.m-b-15{margin-bottom:15px}.m-b-20{margin-bottom:20px}.m-b-25{margin-bottom:25px}.m-b-30{margin-bottom:30px}.m-b-35{margin-bottom:35px}.m-b-40{margin-bottom:40px}.m-b-45{margin-bottom:45px}.m-b-50{margin-bottom:50px}.m-l-0{margin-left:0}.m-l-5{margin-left:5px}.m-l-10{margin-left:10px}.m-l-15{margin-left:15px}.m-l-20{margin-left:20px}.m-l-25{margin-left:25px}.m-l-30{margin-left:30px}.m-l-35{margin-left:35px}.m-l-40{margin-left:40px}.m-l-45{margin-left:45px}.m-l-50{margin-left:50px}.m-x-0{margin:0}.m-x-5{margin:5px}.m-x-10{margin:10px}.m-x-15{margin:15px}.m-x-20{margin:20px}.m-x-25{margin:25px}.m-x-30{margin:30px}.m-x-35{margin:35px}.m-x-40{margin:40px}.m-x-45{margin:45px}.m-x-50{margin:50px}.p-t-0{padding-top:0}.p-t-5{padding-top:5px}.p-t-10{padding-top:10px}.p-t-15{padding-top:15px}.p-t-20{padding-top:20px}.p-t-25{padding-top:25px}.p-t-30{padding-top:30px}.p-t-35{padding-top:35px}.p-t-40{padding-top:40px}.p-t-45{padding-top:45px}.p-t-50{padding-top:50px}.p-r-0{padding-right:0}.p-r-5{padding-right:5px}.p-r-10{padding-right:10px}.p-r-15{padding-right:15px}.p-r-20{padding-right:20px}.p-r-25{padding-right:25px}.p-r-30{padding-right:30px}.p-r-35{padding-right:35px}.p-r-40{padding-right:40px}.p-r-45{padding-right:45px}.p-r-50{padding-right:50px}.p-b-0{padding-bottom:0}.p-b-5{padding-bottom:5px}.p-b-10{padding-bottom:10px}.p-b-15{padding-bottom:15px}.p-b-20{padding-bottom:20px}.p-b-25{padding-bottom:25px}.p-b-30{padding-bottom:30px}.p-b-35{padding-bottom:35px}.p-b-40{padding-bottom:40px}.p-b-45{padding-bottom:45px}.p-b-50{padding-bottom:50px}.p-l-0{padding-left:0}.p-l-5{padding-left:5px}.p-l-10{padding-left:10px}.p-l-15{padding-left:15px}.p-l-20{padding-left:20px}.p-l-25{padding-left:25px}.p-l-30{padding-left:30px}.p-l-35{padding-left:35px}.p-l-40{padding-left:40px}.p-l-45{padding-left:45px}.p-l-50{padding-left:50px}.p-x-0{padding:0}.p-x-5{padding:5px}.p-x-10{padding:10px}.p-x-15{padding:15px}.p-x-20{padding:20px}.p-x-25{padding:25px}.p-x-30{padding:30px}.p-x-35{padding:35px}.p-x-40{padding:40px}.p-x-45{padding:45px}.p-x-50{padding:50px}.mat-form-field{width:100%}.mat-calendar-body-selected{color:#fff!important}.mat-form-field-appearance-standard.mat-form-field-has-label .mat-select:not(.mat-select-empty) .mat-select-arrow-wrapper{transform:translateY(-17%)!important}.mat-checkbox-label{margin-left:5px}:host{display:block;flex-direction:column;display:flex}.optionSelectAll{position:relative;margin-bottom:10px}.optionSelectAll:before{content:\"\";position:absolute;left:0;bottom:0;height:1px;width:50%;border-bottom:1px solid yellow}\n"] }]
}], ctorParameters: function () { return [{ type: i1$2.UntypedFormBuilder }, { type: i0.ChangeDetectorRef }, { type: i0.Injector }]; }, propDecorators: { config: [{
type: Input
}] } });
class CocoringVariableHtmlPipe {
constructor(sanitizer) {
this.sanitizer = sanitizer;
}
transform(texteHtml) {
if (!texteHtml)
return '';
return this.sanitizer.bypassSecurityTrustHtml(texteHtml);
}
}
CocoringVariableHtmlPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringVariableHtmlPipe, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
CocoringVariableHtmlPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.1.1", ngImport: i0, type: CocoringVariableHtmlPipe, name: "variableHtml", pure: false });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringVariableHtmlPipe, decorators: [{
type: Pipe,
args: [{
name: 'variableHtml',
pure: false
}]
}], ctorParameters: function () { return [{ type: i1$3.DomSanitizer }]; } });
class CocoringCheckboxComponent extends ExtendInputsComponent {
constructor(injector) {
super(injector);
}
set config(config) {
this.configInput(config);
this.addControlForm();
}
ngOnInit() { }
}
CocoringCheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringCheckboxComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
CocoringCheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: CocoringCheckboxComponent, selector: "cocoring-checkbox", inputs: { config: "config" }, usesInheritance: true, ngImport: i0, template: "<ng-container [formGroup]=\"formGroup\">\r\n <mat-checkbox (click)=\"$event.stopPropagation()\" [formControlName]=\"nameControl\" [color]=\"color\">\r\n <div [innerHtml]=\"nameLabel | variableHtml\"></div>\r\n </mat-checkbox>\r\n <mat-error error-handler [form]=\"formGroup\" [controlName]=\"nameControl\"></mat-error>\r\n</ng-container>", dependencies: [{ kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3$2.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i3$1.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: CocoringInputErrorComponent, selector: "[error-handler]", inputs: ["form", "controlName"] }, { kind: "pipe", type: CocoringVariableHtmlPipe, name: "variableHtml" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringCheckboxComponent, decorators: [{
type: Component,
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'cocoring-checkbox', template: "<ng-container [formGroup]=\"formGroup\">\r\n <mat-checkbox (click)=\"$event.stopPropagation()\" [formControlName]=\"nameControl\" [color]=\"color\">\r\n <div [innerHtml]=\"nameLabel | variableHtml\"></div>\r\n </mat-checkbox>\r\n <mat-error error-handler [form]=\"formGroup\" [controlName]=\"nameControl\"></mat-error>\r\n</ng-container>" }]
}], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { config: [{
type: Input
}] } });
class InputIconComponent {
constructor() {
this.clickEvent = new EventEmitter();
}
ngOnInit() {
}
emitClickEvent() {
this.clickEvent.emit(true);
}
}
InputIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: InputIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
InputIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: InputIconComponent, selector: "input-icon", inputs: { icon: "icon" }, outputs: { clickEvent: "clickEvent" }, ngImport: i0, template: "<button type=\"button\" tabindex=\"-1\" *ngIf=\"icon\" (click)=\"emitClickEvent()\" mat-icon-button aria-label=\"Icone dans le champ de saisi\">\r\n <mat-icon>\r\n {{icon}}\r\n </mat-icon>\r\n</button>", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: InputIconComponent, decorators: [{
type: Component,
args: [{ selector: 'input-icon', template: "<button type=\"button\" tabindex=\"-1\" *ngIf=\"icon\" (click)=\"emitClickEvent()\" mat-icon-button aria-label=\"Icone dans le champ de saisi\">\r\n <mat-icon>\r\n {{icon}}\r\n </mat-icon>\r\n</button>", styles: [":host{display:block}\n"] }]
}], ctorParameters: function () { return []; }, propDecorators: { icon: [{
type: Input
}], clickEvent: [{
type: Output
}] } });
class CocoringDateComponent extends ExtendInputsComponent {
constructor(locale, cdr, injector) {
super(injector);
this.locale = locale;
this.cdr = cdr;
// dateMask: any = { guide: false, showMask : false, mask: [/\d/, /\d/, '/', /\d/, /\d/, '/', /\d/, /\d/, /\d/, /\d/], placeholderChar: '\u2000' };
this.maskInputControlName = null;
}
set config(config) {
config.validators.push(ValidatorsService.dateValidator);
this.configInput(config);
this.addControlForm();
this.maskInputControlName = `m${this.nameControl}`;
/** le masque de saisie ne fonctionne pas avec le composant de material datepicker */
this.addDateMaskControl();
this.valueChangeEvent();
}
ngOnInit() { }
/** Value from datepicker changed event */
valueChangeEvent() {
this.formGroup.get(this.nameControl).valueChanges.pipe(takeUntil(this.destroy$)).subscribe((val) => {
let d = null;
if (!val)
return;
if (typeof val.getMonth === 'function' || typeof val === 'string') {
d = DateTime.fromJSDate(new Date(val)).setLocale(this.locale).toLocaleString(); // sous la forme de 21/12/2021
}
else if (val.hasOwnProperty("isLuxonDateTime")) {
d = DateTime.fromISO(val).setLocale(this.locale).toLocaleString(); // sous la forme de 21/12/2021
}
if (d) {
this.formGroup.get(this.maskInputControlName).setValue(HelperService.replaceAll(d, '/', ''));
setTimeout(() => {
this.cdr.detectChanges();
});
}
});
}
maskInputChangeEvent() {
this.formGroup.get(this.maskInputControlName).valueChanges.pipe(takeUntil(this.destroy$)).subscribe((dateInput) => {
this.dispatchValueInput(dateInput);
});
}
dispatchValueInput(dateInput) {
if (dateInput && dateInput.length === 8) {
const day = dateInput.substring(0, 2);
const month = dateInput.substring(2, 4);
const year = dateInput.substring(4);
const dateFormated = DateTime.fromISO(year + month + day);
if (dateFormated.isValid) {
this.formGroup.get(this.nameControl).setValue(DateTime.fromISO(year + month + day), { emitEvent: false });
}
else
this.clearDateMaskValue();
}
else {
this.clearValue();
}
}
onBlur() {
const dateInput = this.formGroup.get(this.maskInputControlName).value;
if (!dateInput || dateInput.length !== 8) {
this.clearDateMaskValue();
}
}
addDateMaskControl() {
this.formGroup.addControl(this.maskInputControlName, new UntypedFormControl(null, this.validators));
this.maskInputChangeEvent();
this.emitEvent();
}
clearDateMaskValue(event) {
this.formGroup.get(this.maskInputControlName).reset();
this.formGroup.get(this.maskInputControlName).markAsUntouched();
this.clearValue(event);
if (event)
event.stopPropagation();
}
}
CocoringDateComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringDateComponent, deps: [{ token: MAT_DATE_LOCALE }, { token: i0.ChangeDetectorRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
CocoringDateComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: CocoringDateComponent, selector: "cocoring-date", inputs: { config: "config" }, usesInheritance: true, ngImport: i0, template: "<ng-container [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"appearance\" [ngClass]=\"{'mat-form-compact': styleCompact}\">\r\n <mat-label>{{nameLabel}}</mat-label>\r\n <!-- <input matInput [matDatepicker]=\"picker\" [formControlName]=\"nameControl\"> -->\r\n <input [attr.data-cy]=\"nameControl\" matInput type=\"text\" mask=\"d0/M0/0000\" [leadZeroDateTime]=\"true\" [formControlName]=\"maskInputControlName\" (blur)=\"onBlur()\"/>\r\n <input [matDatepicker]=\"picker\" [formControlName]=\"nameControl\">\r\n <div matSuffix style=\"display:flex\">\r\n <mat-datepicker-toggle tabindex=\"-1\" matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n <input-icon icon=\"close\" *ngIf=\"formGroup.get(maskInputControlName).value\" (click)=\"clearDateMaskValue($event)\"></input-icon>\r\n </div>\r\n <mat-datepicker #picker></mat-datepicker>\r\n <mat-error error-handler [form]=\"formGroup\" [controlName]=\"maskInputControlName\"></mat-error>\r\n </mat-form-field>\r\n</ng-container>", styles: [":host{display:block}.mat-datepicker-input{display:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.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: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3$1.MatError, selector: "mat-error", inputs: ["id"] }, { kind: "component", type: i3$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i3$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i3$1.MatSuffix, selector: "[matSuffix]" }, { kind: "directive", type: i4.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: i5$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: CocoringInputErrorComponent, selector: "[error-handler]", inputs: ["form", "controlName"] }, { kind: "component", type: InputIconComponent, selector: "input-icon", inputs: ["icon"], outputs: ["clickEvent"] }, { kind: "directive", type: i8.MaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "triggerOnMaskChange"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringDateComponent, decorators: [{
type: Component,
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'cocoring-date', template: "<ng-container [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"appearance\" [ngClass]=\"{'mat-form-compact': styleCompact}\">\r\n <mat-label>{{nameLabel}}</mat-label>\r\n <!-- <input matInput [matDatepicker]=\"picker\" [formControlName]=\"nameControl\"> -->\r\n <input [attr.data-cy]=\"nameControl\" matInput type=\"text\" mask=\"d0/M0/0000\" [leadZeroDateTime]=\"true\" [formControlName]=\"maskInputControlName\" (blur)=\"onBlur()\"/>\r\n <input [matDatepicker]=\"picker\" [formControlName]=\"nameControl\">\r\n <div matSuffix style=\"display:flex\">\r\n <mat-datepicker-toggle tabindex=\"-1\" matSuffix [for]=\"picker\"></mat-datepicker-toggle>\r\n <input-icon icon=\"close\" *ngIf=\"formGroup.get(maskInputControlName).value\" (click)=\"clearDateMaskValue($event)\"></input-icon>\r\n </div>\r\n <mat-datepicker #picker></mat-datepicker>\r\n <mat-error error-handler [form]=\"formGroup\" [controlName]=\"maskInputControlName\"></mat-error>\r\n </mat-form-field>\r\n</ng-container>", styles: [":host{display:block}.mat-datepicker-input{display:none}\n"] }]
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
type: Inject,
args: [MAT_DATE_LOCALE]
}] }, { type: i0.ChangeDetectorRef }, { type: i0.Injector }]; }, propDecorators: { config: [{
type: Input
}] } });
class CocoringEmailComponent extends ExtendInputsComponent {
constructor(injector) {
super(injector);
}
set config(config) {
config.validators.push(ValidatorsService.emailValidator);
this.configInput(config);
this.addControlForm();
}
ngOnInit() { }
}
CocoringEmailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.1", ngImport: i0, type: CocoringEmailComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component });
CocoringEmailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.1", type: CocoringEmailComponent, selector: "cocoring-email", inputs: { config: "config" }, usesInheritance: true, ngImport: i0, template: "<ng-container [formGroup]=\"formGroup\">\r\n <mat-form-field [appearance]=\"appearance\" [ngClass]=\"{'mat-form-compact': styleCompact}\">\r\n <mat-label>{{nameLabel}}</mat-label>\r\n <div matPrefix>\r\n <input-icon [icon]=\"icon\"></input-icon>\r\n </div>\r\n <input [attr.data-cy]=\"nameControl\" type=\"email\" matInput [formControlName]=\"nameControl\" />\r\n <div matSuffix style=\"display:flex\">\r\n <input-icon icon=\"