import { Component, EventEmitter, Input, Output } from '@angular/core';
import { FormControl } from '@angular/forms';
import { validateStringValue } from '../../utils/attribute.util';
import * as i0 from "@angular/core";
import * as i1 from "@ionic/angular";
import * as i2 from "@angular/common";
import * as i3 from "@angular/forms";
import * as i4 from "../form-validation/form-validation.component";
const inputSelectC = {
    labelPlacement: ['fixed', 'floating', 'stacked', 'start', 'end'],
};
export class FormInputSelectComponent {
    label;
    options;
    labelPlacement;
    placeholder;
    control;
    value;
    valueChange = new EventEmitter();
    inputLabelPlacement;
    ngOnChanges(changes) {
        this.inputLabelPlacement =
            validateStringValue(changes, 'labelPlacement', inputSelectC.labelPlacement.slice(), this.inputLabelPlacement) || 'floating';
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FormInputSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: FormInputSelectComponent, selector: "cf-form-input-select", inputs: { label: "label", options: "options", labelPlacement: "labelPlacement", placeholder: "placeholder", control: "control", value: "value" }, outputs: { valueChange: "valueChange" }, usesOnChanges: true, ngImport: i0, template: "<!-- ngModel -->\n<ion-select\n  *ngIf=\"!control\"\n  [label]=\"label\"\n  [labelPlacement]=\"inputLabelPlacement\"\n  [placeholder]=\"placeholder\"\n  fill=\"outline\"\n  mode=\"md\"\n  interface=\"popover\"\n  (ionChange)=\"valueChange.emit($event.detail.value ?? undefined)\"\n  [value]=\"value\">\n  <ion-select-option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.displayName }}</ion-select-option>\n</ion-select>\n<!-- Form Control -->\n<ion-select\n  *ngIf=\"control\"\n  [label]=\"label\"\n  [labelPlacement]=\"inputLabelPlacement\"\n  [placeholder]=\"placeholder\"\n  fill=\"outline\"\n  mode=\"md\"\n  interface=\"popover\"\n  [formControl]=\"control\"\n  (ionChange)=\"valueChange.emit($event.detail.value ?? undefined)\">\n  <ion-select-option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.displayName }}</ion-select-option>\n</ion-select>\n<cf-form-validation *ngIf=\"control\" [control]=\"control\"></cf-form-validation>\n", styles: ["ion-select{font-family:Roboto,sans-serif;font-weight:400;font-style:normal;font-size:1.6rem;color:var(--cf-app-text-color-default);text-align:start;--border-radius: 8px !important;--highlight-color-focused: var(--cf-app-color-primary);--highlight-color-invalid: var(--cf-app-system-color-error);--highlight-color-valid: var(--cf-app-color-primary)}::ng-deep ion-select-popover ion-list[class*=popover]{background:var(--cf-app-background-light)}::ng-deep ion-select-popover ion-list[class*=popover] ion-item[class*=popover]{--background: transparent;--border-radius: 8px;--background-focused: var(--cf-app-color-accent);--background-focused-opacity: .5;--background-hover: var(--cf-app-color-primary);--background-hover-opacity: .1;padding:4px}::ng-deep ion-select-popover ion-list[class*=popover] ion-item[class*=popover] ion-radio{font-family:Roboto,sans-serif;font-weight:400;font-style:normal;font-size:1.6rem;color:var(--cf-app-text-color-default);text-align:start}\n"], dependencies: [{ kind: "component", type: i1.IonSelect, selector: "ion-select", inputs: ["cancelText", "color", "compareWith", "disabled", "expandedIcon", "fill", "interface", "interfaceOptions", "justify", "label", "labelPlacement", "legacy", "mode", "multiple", "name", "okText", "placeholder", "selectedText", "shape", "toggleIcon", "value"] }, { kind: "component", type: i1.IonSelectOption, selector: "ion-select-option", inputs: ["disabled", "value"] }, { kind: "directive", type: i1.SelectValueAccessor, selector: "ion-select, ion-radio-group, ion-segment, ion-datetime" }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.FormValidationComponent, selector: "cf-form-validation", inputs: ["control"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: FormInputSelectComponent, decorators: [{
            type: Component,
            args: [{ selector: 'cf-form-input-select', template: "<!-- ngModel -->\n<ion-select\n  *ngIf=\"!control\"\n  [label]=\"label\"\n  [labelPlacement]=\"inputLabelPlacement\"\n  [placeholder]=\"placeholder\"\n  fill=\"outline\"\n  mode=\"md\"\n  interface=\"popover\"\n  (ionChange)=\"valueChange.emit($event.detail.value ?? undefined)\"\n  [value]=\"value\">\n  <ion-select-option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.displayName }}</ion-select-option>\n</ion-select>\n<!-- Form Control -->\n<ion-select\n  *ngIf=\"control\"\n  [label]=\"label\"\n  [labelPlacement]=\"inputLabelPlacement\"\n  [placeholder]=\"placeholder\"\n  fill=\"outline\"\n  mode=\"md\"\n  interface=\"popover\"\n  [formControl]=\"control\"\n  (ionChange)=\"valueChange.emit($event.detail.value ?? undefined)\">\n  <ion-select-option *ngFor=\"let option of options\" [value]=\"option.value\">{{ option.displayName }}</ion-select-option>\n</ion-select>\n<cf-form-validation *ngIf=\"control\" [control]=\"control\"></cf-form-validation>\n", styles: ["ion-select{font-family:Roboto,sans-serif;font-weight:400;font-style:normal;font-size:1.6rem;color:var(--cf-app-text-color-default);text-align:start;--border-radius: 8px !important;--highlight-color-focused: var(--cf-app-color-primary);--highlight-color-invalid: var(--cf-app-system-color-error);--highlight-color-valid: var(--cf-app-color-primary)}::ng-deep ion-select-popover ion-list[class*=popover]{background:var(--cf-app-background-light)}::ng-deep ion-select-popover ion-list[class*=popover] ion-item[class*=popover]{--background: transparent;--border-radius: 8px;--background-focused: var(--cf-app-color-accent);--background-focused-opacity: .5;--background-hover: var(--cf-app-color-primary);--background-hover-opacity: .1;padding:4px}::ng-deep ion-select-popover ion-list[class*=popover] ion-item[class*=popover] ion-radio{font-family:Roboto,sans-serif;font-weight:400;font-style:normal;font-size:1.6rem;color:var(--cf-app-text-color-default);text-align:start}\n"] }]
        }], propDecorators: { label: [{
                type: Input
            }], options: [{
                type: Input
            }], labelPlacement: [{
                type: Input
            }], placeholder: [{
                type: Input
            }], control: [{
                type: Input
            }], value: [{
                type: Input
            }], valueChange: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64, 