import { ChangeDetectionStrategy, Component, Input, ViewChild } from '@angular/core';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
import { RelationSelectorDialogComponent } from '../relation-selector-dialog/relation-selector-dialog.component';
import * as i0 from "@angular/core";
import * as i1 from "../../../../providers/modal/modal.service";
import * as i2 from "@clr/angular";
import * as i3 from "@angular/forms";
import * as i4 from "../../../components/form-field/form-field-control.directive";
import * as i5 from "../../../components/object-tree/object-tree.component";
import * as i6 from "../relation-card/relation-card.component";
import * as i7 from "@angular/common";
import * as i8 from "@ngx-translate/core";
export class RelationGenericInputComponent {
    constructor(modalService) {
        this.modalService = modalService;
    }
    selectRelationId() {
        this.modalService
            .fromComponent(RelationSelectorDialogComponent, {
            size: 'md',
            closable: true,
            locals: {
                title: _('common.select-relation-id'),
                selectorTemplate: this.template,
            },
        })
            .subscribe(result => {
            if (result) {
                this.parentFormControl.setValue({ id: result });
                this.parentFormControl.markAsDirty();
            }
        });
    }
    remove() {
        this.parentFormControl.setValue(null);
        this.parentFormControl.markAsDirty();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: RelationGenericInputComponent, deps: [{ token: i1.ModalService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: RelationGenericInputComponent, selector: "vdr-relation-generic-input", inputs: { readonly: "readonly", parentFormControl: "parentFormControl", config: "config" }, viewQueries: [{ propertyName: "template", first: true, predicate: ["selector"], descendants: true }], ngImport: i0, template: "<vdr-relation-card\n    (select)=\"selectRelationId()\"\n    (remove)=\"remove()\"\n    placeholderIcon=\"objects\"\n    [entity]=\"parentFormControl.value\"\n    [selectLabel]=\"'common.select-relation-id' | translate\"\n    [removable]=\"!config.list\"\n    [readonly]=\"readonly\"\n>\n    {{ parentFormControl.value | json }}\n    <ng-template vdrRelationCardPreview>\n        <div class=\"placeholder\">\n            <clr-icon shape=\"objects\" size=\"50\"></clr-icon>\n        </div>\n    </ng-template>\n    <ng-template vdrRelationCardDetail let-entity=\"entity\">\n        <div class=\"\">\n            {{ config.entity }}: <strong>{{ entity.id }}</strong>\n        </div>\n        <vdr-object-tree [value]=\"{ properties: parentFormControl.value }\"></vdr-object-tree>\n    </ng-template>\n</vdr-relation-card>\n\n<ng-template #selector let-select=\"select\">\n    <div class=\"id-select-wrapper\">\n        <clr-input-container>\n            <input [(ngModel)]=\"relationId\" type=\"text\" clrInput [readonly]=\"readonly\" />\n        </clr-input-container>\n        <div>\n            <button class=\"btn btn-primary m0\" (click)=\"select(relationId)\">\n                {{ 'common.confirm' | translate }}\n            </button>\n        </div>\n    </div>\n</ng-template>\n", styles: [".id-select-wrapper{display:flex;align-items:flex-end}\n"], dependencies: [{ kind: "directive", type: i2.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.ClrInput, selector: "[clrInput]" }, { kind: "component", type: i2.ClrInputContainer, selector: "clr-input-container" }, { kind: "directive", type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.FormFieldControlDirective, selector: "input, textarea, select" }, { kind: "component", type: i5.ObjectTreeComponent, selector: "vdr-object-tree", inputs: ["value", "isArrayItem"] }, { kind: "component", type: i6.RelationCardComponent, selector: "vdr-relation-card", inputs: ["entity", "placeholderIcon", "selectLabel", "readonly", "removable"], outputs: ["select", "remove"] }, { kind: "directive", type: i6.RelationCardPreviewDirective, selector: "[vdrRelationCardPreview]" }, { kind: "directive", type: i6.RelationCardDetailDirective, selector: "[vdrRelationCardDetail]" }, { kind: "pipe", type: i7.JsonPipe, name: "json" }, { kind: "pipe", type: i8.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: RelationGenericInputComponent, decorators: [{
            type: Component,
            args: [{ selector: 'vdr-relation-generic-input', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-relation-card\n    (select)=\"selectRelationId()\"\n    (remove)=\"remove()\"\n    placeholderIcon=\"objects\"\n    [entity]=\"parentFormControl.value\"\n    [selectLabel]=\"'common.select-relation-id' | translate\"\n    [removable]=\"!config.list\"\n    [readonly]=\"readonly\"\n>\n    {{ parentFormControl.value | json }}\n    <ng-template vdrRelationCardPreview>\n        <div class=\"placeholder\">\n            <clr-icon shape=\"objects\" size=\"50\"></clr-icon>\n        </div>\n    </ng-template>\n    <ng-template vdrRelationCardDetail let-entity=\"entity\">\n        <div class=\"\">\n            {{ config.entity }}: <strong>{{ entity.id }}</strong>\n        </div>\n        <vdr-object-tree [value]=\"{ properties: parentFormControl.value }\"></vdr-object-tree>\n    </ng-template>\n</vdr-relation-card>\n\n<ng-template #selector let-select=\"select\">\n    <div class=\"id-select-wrapper\">\n        <clr-input-container>\n            <input [(ngModel)]=\"relationId\" type=\"text\" clrInput [readonly]=\"readonly\" />\n        </clr-input-container>\n        <div>\n            <button class=\"btn btn-primary m0\" (click)=\"select(relationId)\">\n                {{ 'common.confirm' | translate }}\n            </button>\n        </div>\n    </div>\n</ng-template>\n", styles: [".id-select-wrapper{display:flex;align-items:flex-end}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.ModalService }]; }, propDecorators: { readonly: [{
                type: Input
            }], parentFormControl: [{
                type: Input
            }], config: [{
                type: Input
            }], template: [{
                type: ViewChild,
                args: ['selector']
            }] } });
//# sourceMappingURL=data:application/json;base64, 