import { ChangeDetectionStrategy, Component, importProvidersFrom } from '@angular/core';
import { FieldWrapper, FormlyModule } from '@ngx-formly/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "../../common/icon.directive";
import * as i3 from "ngx-bootstrap/popover";
import * as i4 from "@ngx-formly/core";
import * as i5 from "../../i18n/c8y-translate.pipe";
import * as i6 from "../../common/humanize.pipe";
export const wrapperFormFieldConfig = () => importProvidersFrom(FormlyModule.forChild({
    wrappers: [{ name: 'c8y-form-field', component: WrapperFormField }]
}));
export class WrapperFormField extends FieldWrapper {
    constructor() {
        super(...arguments);
        this.maxHelpBlockLength = 64;
        this.smallFormGroup = false;
    }
    ngOnInit() {
        this.showDescriptionAsPopup =
            this.field.type === 'radio' ||
                this.field.type === 'typeahead' ||
                (this.to.description && this.to.description.length > this.maxHelpBlockLength);
        this.smallFormGroup = this.props?.smallFormGroup || false;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: WrapperFormField, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: WrapperFormField, selector: "c8y-wrapper-form-field", usesInheritance: true, ngImport: i0, template: "<div\n  class=\"form-group\"\n  [class.has-error]=\"showError\"\n  [class.form-group-sm]=\"smallFormGroup\"\n>\n  <label\n    class=\"text-pre-wrap\"\n    *ngIf=\"to.label && to.hideLabel !== true\"\n    [attr.for]=\"id\"\n  >\n    {{ to.humanizeLabel === false ? to.label : (to.label | humanize) }}\n    <i\n      class=\"text-info\"\n      c8yIcon=\"info-circle\"\n      title=\"{{ to.tooltip | translate }}\"\n      *ngIf=\"to.tooltip\"\n    ></i>\n    <ng-template #description><div [innerHTML]=\"to.description | translate\"></div></ng-template>\n    <button\n      class=\"btn-help btn-help--sm m-t-auto m-b-auto\"\n      [attr.aria-label]=\"'Help' | translate\"\n      [popover]=\"description\"\n      placement=\"right\"\n      type=\"button\"\n      [outsideClick]=\"true\"\n      *ngIf=\"to.description && showDescriptionAsPopup\"\n    ></button>\n  </label>\n  <div class=\"d-flex\">\n    <div class=\"flex-grow\">\n      <ng-template #fieldComponent></ng-template>\n    </div>\n    <ng-container *ngIf=\"to.customTemplateRef\">\n      <ng-container *ngTemplateOutlet=\"to.customTemplateRef\"></ng-container>\n    </ng-container>\n  </div>\n\n  <div\n    class=\"c8y-messages\"\n    *ngIf=\"showError\"\n  >\n    <formly-validation-message\n      class=\"form-control-feedback-message\"\n      [field]=\"field\"\n    ></formly-validation-message>\n  </div>\n\n  <div\n    class=\"help-block has-info text-muted\"\n    *ngIf=\"!showError && to.description && !showDescriptionAsPopup\"\n    [innerHTML]=\"to.description | translate\"\n  ></div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i3.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "component", type: i4.ɵFormlyValidationMessage, selector: "formly-validation-message", inputs: ["field"] }, { kind: "pipe", type: i5.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i6.HumanizePipe, name: "humanize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: WrapperFormField, decorators: [{
            type: Component,
            args: [{ selector: 'c8y-wrapper-form-field', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"form-group\"\n  [class.has-error]=\"showError\"\n  [class.form-group-sm]=\"smallFormGroup\"\n>\n  <label\n    class=\"text-pre-wrap\"\n    *ngIf=\"to.label && to.hideLabel !== true\"\n    [attr.for]=\"id\"\n  >\n    {{ to.humanizeLabel === false ? to.label : (to.label | humanize) }}\n    <i\n      class=\"text-info\"\n      c8yIcon=\"info-circle\"\n      title=\"{{ to.tooltip | translate }}\"\n      *ngIf=\"to.tooltip\"\n    ></i>\n    <ng-template #description><div [innerHTML]=\"to.description | translate\"></div></ng-template>\n    <button\n      class=\"btn-help btn-help--sm m-t-auto m-b-auto\"\n      [attr.aria-label]=\"'Help' | translate\"\n      [popover]=\"description\"\n      placement=\"right\"\n      type=\"button\"\n      [outsideClick]=\"true\"\n      *ngIf=\"to.description && showDescriptionAsPopup\"\n    ></button>\n  </label>\n  <div class=\"d-flex\">\n    <div class=\"flex-grow\">\n      <ng-template #fieldComponent></ng-template>\n    </div>\n    <ng-container *ngIf=\"to.customTemplateRef\">\n      <ng-container *ngTemplateOutlet=\"to.customTemplateRef\"></ng-container>\n    </ng-container>\n  </div>\n\n  <div\n    class=\"c8y-messages\"\n    *ngIf=\"showError\"\n  >\n    <formly-validation-message\n      class=\"form-control-feedback-message\"\n      [field]=\"field\"\n    ></formly-validation-message>\n  </div>\n\n  <div\n    class=\"help-block has-info text-muted\"\n    *ngIf=\"!showError && to.description && !showDescriptionAsPopup\"\n    [innerHTML]=\"to.description | translate\"\n  ></div>\n</div>\n" }]
        }] });
//# sourceMappingURL=data:application/json;base64, 