import * as i0 from '@angular/core';
import { Pipe, EventEmitter, Component, Input, Output, ViewChildren, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import * as i1 from '@angular/forms';
import { FormArray, FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
import * as i2 from '@laserfiche/lf-ui-components/internal-shared';
import { ValidationRule, ValidationUtils } from '@laserfiche/lf-ui-components/internal-shared';
import * as i3 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i4 from '@angular/material/checkbox';
import { MatCheckboxModule } from '@angular/material/checkbox';
import * as i5 from '@angular/material/form-field';
import { MatFormFieldModule } from '@angular/material/form-field';
import * as i6 from '@angular/material/input';
import { MatInputModule } from '@angular/material/input';
import { of } from 'rxjs';
import { mergeMap, map } from 'rxjs/operators';
import * as i2$1 from '@angular/material/expansion';
import { MatExpansionModule } from '@angular/material/expansion';
import { MatButtonModule } from '@angular/material/button';
import { BrowserModule } from '@angular/platform-browser';
import { createCustomElement } from '@angular/elements';

// Copyright (c) Laserfiche.
// Licensed under the MIT License. See LICENSE in the project root for license information.

// Copyright (c) Laserfiche.
// Licensed under the MIT License. See LICENSE in the project root for license information.
/**
 * Pipe that gets the error message for a checklist item depending on the type of error
 */
class ItemsValidationTextPipe {
    constructor() { }
    /**
     * Gets the error message for the checklist item as an observable
     * @param currentChecklistItem The metadata for the current checklist item
     * @param currentFormControl The form control for the checklist item (i.e. value, validity)
     * @param localizedStrings Map of possible localized strings
     * @returns The error message for the checklist item
     */
    transform(currentChecklistItem, currentFormControl, localizedStrings) {
        this.localizedStrings = localizedStrings;
        const validationObservable = this.getValidationObservable(currentChecklistItem, currentFormControl);
        return validationObservable;
    }
    getValidationObservable(item, formControl) {
        const validationObservable = formControl?.statusChanges.pipe(mergeMap((validity) => {
            const validationRuleName = this.getBrokenValidationRule(formControl);
            if (validationRuleName === ValidationRule.PATTERN) {
                return of(item?.constraintError);
            }
            if (validationRuleName === ValidationRule.REQUIRED && item.requiredError) {
                return of(item.requiredError);
            }
            const requiredString = this.localizedStrings?.get('REQUIRED');
            if (requiredString) {
                return requiredString?.pipe(map((stringVal) => {
                    if (validationRuleName === ValidationRule.REQUIRED) {
                        return item?.requiredError ? item.requiredError : stringVal;
                    }
                    else {
                        return undefined;
                    }
                }));
            }
            else {
                return of(undefined);
            }
        }));
        return validationObservable;
    }
    getBrokenValidationRule(formControl) {
        if (formControl?.hasError(ValidationRule.PATTERN)) {
            return ValidationRule.PATTERN;
        }
        else if (formControl?.hasError(ValidationRule.REQUIRED)) {
            return ValidationRule.REQUIRED;
        }
        return undefined;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ItemsValidationTextPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: ItemsValidationTextPipe, name: "itemsValidationText" }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ItemsValidationTextPipe, decorators: [{
            type: Pipe,
            args: [{
                    name: 'itemsValidationText'
                }]
        }], ctorParameters: () => [] });

// Copyright (c) Laserfiche.
// Licensed under the MIT License. See LICENSE in the project root for license information.
/**
 * @internal
 */
class ItemsComponent {
    constructor(fb, ref, localizationService) {
        this.fb = fb;
        this.ref = ref;
        this.localizationService = localizationService;
        this.items = [];
        this.itemsChanged = new EventEmitter();
        this.labelPosition = 'before';
        /** @internal */
        this.LOCALIZED_STRINGS = new Map([
            ['REQUIRED', this.localizationService.getStringLaserficheObservable('REQUIRED')]
        ]);
        this.refreshChecklistItems = () => {
            this.syncFormControlDataToFieldValues();
            this.ref.detectChanges();
        };
        this.forceValidation = () => {
            let isValid = true;
            this.items.forEach((val, index) => {
                if (val.editable && val.checked) {
                    // don't return invalid if not editable, since user can't fix it
                    const control = this.getSingleField(index);
                    this.triggerValidation(control);
                    const controlValid = control.valid;
                    if (!controlValid) {
                        isValid = false;
                    }
                }
            });
            return isValid;
        };
        this.checklistParentForm = this.fb.group({
            fieldArray: new FormArray([])
        });
    }
    ngOnInit() {
        this.refreshChecklistItems();
    }
    onItemCheckboxChanged(index) {
        const field = this.getSingleField(index);
        const item = this.items[index];
        item.name = field.value;
        if (!item.checked) {
            field.clearValidators();
        }
        else {
            this.addValidators(item, field);
        }
        this.triggerValidation(field);
        this.itemsChanged.emit();
    }
    addValidators(item, field) {
        const constraint = item.constraint;
        const required = item.isRequired;
        const validators = [];
        if (constraint) {
            validators.push(ValidationUtils.generalRegexValidator(new RegExp(constraint)));
        }
        if (required) {
            const requiredRegexValidator = ValidationUtils.requiredValidator();
            validators.push(requiredRegexValidator);
        }
        field.setValidators(validators);
    }
    triggerValidation(field) {
        field.markAsDirty();
        field.markAllAsTouched();
        field.updateValueAndValidity();
    }
    onItemValueChanged(index) {
        const field = this.getSingleField(index);
        this.items[index].name = field.value;
        this.itemsChanged.emit();
    }
    getIcons(item) {
        // TODO add error icon if there is an error on node
        if (typeof (item.icon) === 'string') {
            return [item.icon];
        }
        else {
            return item.icon;
        }
    }
    getArray() {
        return this.checklistParentForm.get('fieldArray');
    }
    getSingleField(index) {
        return this.getArray().controls[index];
    }
    syncFormControlDataToFieldValues() {
        this.getArray().clear();
        if (this.items) {
            this.items.forEach(item => {
                const formControl = new FormControl(item.name);
                if (item.editable && item.checked) {
                    this.addValidators(item, formControl);
                }
                if (!item.editable || item.disabled) {
                    formControl.disable();
                }
                this.getArray().push(formControl);
            });
        }
    }
    doNothing(event) {
        event.preventDefault();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ItemsComponent, deps: [{ token: i1.FormBuilder }, { token: i0.ChangeDetectorRef }, { token: i2.AppLocalizationService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: ItemsComponent, selector: "lf-items-component", inputs: { items: "items", refreshChecklistItems: "refreshChecklistItems" }, outputs: { itemsChanged: "itemsChanged" }, ngImport: i0, template: "<!--Copyright (c) Laserfiche.\nLicensed under the MIT License. See LICENSE in the project root for license information.-->\n\n<div id=\"lf-checklist-item-container\" class=\"lf-checklist-item-container\">\n    <div id=\"lf-checklist-item\" class=\"lf-checklist-item\" *ngFor=\"let item of items; index as currentIndex\">\n        <div id=\"lf-checklist-item-label\" class=\"fixed-width-label\" (click)=\"doNothing($event)\">\n            <div *ngIf=\"getIcons(item).length>0\" class=\"fixed-size-icon-container\">\n                <img *ngFor=\"let icon of getIcons(item)\" src=\"{{icon}}\" alt=\"\" class='lf-checklist-item-icon' />\n            </div>\n            <div id=\"lf-checklist-item-name\" class=\"lf-checklist-item-name\">\n                <mat-form-field class=\"lf-checklist-field stretch-width lf-text-field\">\n                    <input matInput type=\"text\" title=\"{{item.name}}\" [formControl]=\"getSingleField(currentIndex)\"\n                    (change)=\"onItemValueChanged(currentIndex)\" (focusout)=\"onItemValueChanged(currentIndex)\">\n                    <mat-error *ngIf=\"!getSingleField(currentIndex).valid\"\n                        title=\"{{item | itemsValidationText: getSingleField(currentIndex) : LOCALIZED_STRINGS | async}}\">\n                        {{item | itemsValidationText: getSingleField(currentIndex): LOCALIZED_STRINGS | async}}\n                    </mat-error>\n                </mat-form-field>\n            </div>\n        </div>\n        <mat-checkbox color=\"primary\" ngDefaultControl [labelPosition]=\"labelPosition\" [(ngModel)]=\"item.checked\"\n            [disabled]=\"item.disabled\" (change)=\"onItemCheckboxChanged(currentIndex)\" class=\"lf-checkbox\">\n        </mat-checkbox>\n    </div>\n</div>\n", styles: [".lf-checklist-item{display:flex;width:100%}.fixed-width-label{display:flex;flex-grow:1}.fixed-size-icon-container{display:flex;min-width:30px;width:30px;height:34px;align-items:center;margin-right:5px;position:relative}.lf-checklist-item-icon{display:block;height:24px;width:24px;overflow:hidden;position:absolute}.lf-checklist-field{width:100%}.mat-mdc-input-element{caret-color:#000;padding-left:8px}.field-box{flex-grow:1}::ng-deep .lf-checklist-item mat-error{max-width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:100}::ng-deep .lf-checklist-item-name{max-width:calc(100% - 35px)}::ng-deep mat-form-field.lf-checklist-field>.mat-mdc-form-field-wrapper>.mat-form-field-flex>.mat-form-field-infix{border-top:0px;padding:0;width:inherit}::ng-deep mat-form-field.lf-checklist-field .mdc-line-ripple{display:none}::ng-deep mat-form-field.lf-checklist-field>.mat-mdc-text-field-wrapper>.mat-mdc-form-field-flex>.mat-mdc-form-field-infix input{font-size:14px}::ng-deep mat-form-field.lf-checklist-field>.mat-mdc-text-field-wrapper>.mat-mdc-form-field-flex>.mat-mdc-form-field-infix{min-height:28px!important;padding:4px 0}::ng-deep .lf-checklist-item .mat-form-field-appearance-fill .mat-mdc-form-field-flex{align-items:center;border-radius:2px;border-color:#6d6d6d;border-width:1px;border-style:solid;box-sizing:border-box}::ng-deep .lf-checklist-item .mat-mdc-form-field-subscript-wrapper{margin-top:0}::ng-deep .lf-checklist-item .mat-form-field-invalid .mat-mdc-form-field-subscript-wrapper{padding-top:5px}::ng-deep .lf-checklist-item .mat-mdc-text-field-wrapper{padding-bottom:0;padding-left:0;padding-right:0}::ng-deep .lf-checklist-item .mat-form-field-disabled .mat-mdc-form-field-flex{border-color:#f3f3f3;background-color:#f3f3f3;color:#8a8a8a}::ng-deep .lf-checklist-item .mat-focused .mat-mdc-form-field-flex{outline-offset:0px}::ng-deep .lf-checklist-field>.mat-mdc-text-field-wrapper{height:inherit}::ng-deep .lf-checklist-item .mdc-text-field,::ng-deep .lf-checklist-item .mdc-text-field--filled{border-radius:0}\n", ".lf-checklist-name-container{padding:15px 0 5px;white-space:nowrap;display:block;text-overflow:ellipsis;overflow:hidden}.lf-checklist-button-container{padding-top:10px;display:flex;justify-content:flex-end}::ng-deep .checklist-expansion-panel .mat-expansion-panel-header.mat-expanded{height:48px}::ng-deep .checklist-expansion-panel.mat-expansion-panel{position:static;border-radius:0;box-shadow:none;padding:0}::ng-deep .checklist-expansion-panel mat-expansion-panel-header{padding-left:0;padding-right:10px}::ng-deep .checklist-expansion-panel div.mat-expansion-panel-body{padding:0}mat-checkbox.lf-checkbox.full-width-checkbox{width:100%}::ng-deep .lf-checklist-field>.mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:#fff}::ng-deep .lf-checklist-field .mat-mdc-form-field-flex{height:inherit}::ng-deep .lf-checklist-field .mat-mdc-form-field-infix{height:inherit;padding:0}::ng-deep .lf-checklist-option .mat-mdc-checkbox-touch-target{height:20px;width:20px}::ng-deep .lf-checklist-option .mdc-checkbox__native-control{top:10px;left:10px;right:10px;width:20px;height:20px}.lf-checklist-option>.lf-checkbox{height:25px}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i6.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: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: ItemsValidationTextPipe, name: "itemsValidationText" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ItemsComponent, decorators: [{
            type: Component,
            args: [{ selector: 'lf-items-component', template: "<!--Copyright (c) Laserfiche.\nLicensed under the MIT License. See LICENSE in the project root for license information.-->\n\n<div id=\"lf-checklist-item-container\" class=\"lf-checklist-item-container\">\n    <div id=\"lf-checklist-item\" class=\"lf-checklist-item\" *ngFor=\"let item of items; index as currentIndex\">\n        <div id=\"lf-checklist-item-label\" class=\"fixed-width-label\" (click)=\"doNothing($event)\">\n            <div *ngIf=\"getIcons(item).length>0\" class=\"fixed-size-icon-container\">\n                <img *ngFor=\"let icon of getIcons(item)\" src=\"{{icon}}\" alt=\"\" class='lf-checklist-item-icon' />\n            </div>\n            <div id=\"lf-checklist-item-name\" class=\"lf-checklist-item-name\">\n                <mat-form-field class=\"lf-checklist-field stretch-width lf-text-field\">\n                    <input matInput type=\"text\" title=\"{{item.name}}\" [formControl]=\"getSingleField(currentIndex)\"\n                    (change)=\"onItemValueChanged(currentIndex)\" (focusout)=\"onItemValueChanged(currentIndex)\">\n                    <mat-error *ngIf=\"!getSingleField(currentIndex).valid\"\n                        title=\"{{item | itemsValidationText: getSingleField(currentIndex) : LOCALIZED_STRINGS | async}}\">\n                        {{item | itemsValidationText: getSingleField(currentIndex): LOCALIZED_STRINGS | async}}\n                    </mat-error>\n                </mat-form-field>\n            </div>\n        </div>\n        <mat-checkbox color=\"primary\" ngDefaultControl [labelPosition]=\"labelPosition\" [(ngModel)]=\"item.checked\"\n            [disabled]=\"item.disabled\" (change)=\"onItemCheckboxChanged(currentIndex)\" class=\"lf-checkbox\">\n        </mat-checkbox>\n    </div>\n</div>\n", styles: [".lf-checklist-item{display:flex;width:100%}.fixed-width-label{display:flex;flex-grow:1}.fixed-size-icon-container{display:flex;min-width:30px;width:30px;height:34px;align-items:center;margin-right:5px;position:relative}.lf-checklist-item-icon{display:block;height:24px;width:24px;overflow:hidden;position:absolute}.lf-checklist-field{width:100%}.mat-mdc-input-element{caret-color:#000;padding-left:8px}.field-box{flex-grow:1}::ng-deep .lf-checklist-item mat-error{max-width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:100}::ng-deep .lf-checklist-item-name{max-width:calc(100% - 35px)}::ng-deep mat-form-field.lf-checklist-field>.mat-mdc-form-field-wrapper>.mat-form-field-flex>.mat-form-field-infix{border-top:0px;padding:0;width:inherit}::ng-deep mat-form-field.lf-checklist-field .mdc-line-ripple{display:none}::ng-deep mat-form-field.lf-checklist-field>.mat-mdc-text-field-wrapper>.mat-mdc-form-field-flex>.mat-mdc-form-field-infix input{font-size:14px}::ng-deep mat-form-field.lf-checklist-field>.mat-mdc-text-field-wrapper>.mat-mdc-form-field-flex>.mat-mdc-form-field-infix{min-height:28px!important;padding:4px 0}::ng-deep .lf-checklist-item .mat-form-field-appearance-fill .mat-mdc-form-field-flex{align-items:center;border-radius:2px;border-color:#6d6d6d;border-width:1px;border-style:solid;box-sizing:border-box}::ng-deep .lf-checklist-item .mat-mdc-form-field-subscript-wrapper{margin-top:0}::ng-deep .lf-checklist-item .mat-form-field-invalid .mat-mdc-form-field-subscript-wrapper{padding-top:5px}::ng-deep .lf-checklist-item .mat-mdc-text-field-wrapper{padding-bottom:0;padding-left:0;padding-right:0}::ng-deep .lf-checklist-item .mat-form-field-disabled .mat-mdc-form-field-flex{border-color:#f3f3f3;background-color:#f3f3f3;color:#8a8a8a}::ng-deep .lf-checklist-item .mat-focused .mat-mdc-form-field-flex{outline-offset:0px}::ng-deep .lf-checklist-field>.mat-mdc-text-field-wrapper{height:inherit}::ng-deep .lf-checklist-item .mdc-text-field,::ng-deep .lf-checklist-item .mdc-text-field--filled{border-radius:0}\n", ".lf-checklist-name-container{padding:15px 0 5px;white-space:nowrap;display:block;text-overflow:ellipsis;overflow:hidden}.lf-checklist-button-container{padding-top:10px;display:flex;justify-content:flex-end}::ng-deep .checklist-expansion-panel .mat-expansion-panel-header.mat-expanded{height:48px}::ng-deep .checklist-expansion-panel.mat-expansion-panel{position:static;border-radius:0;box-shadow:none;padding:0}::ng-deep .checklist-expansion-panel mat-expansion-panel-header{padding-left:0;padding-right:10px}::ng-deep .checklist-expansion-panel div.mat-expansion-panel-body{padding:0}mat-checkbox.lf-checkbox.full-width-checkbox{width:100%}::ng-deep .lf-checklist-field>.mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:#fff}::ng-deep .lf-checklist-field .mat-mdc-form-field-flex{height:inherit}::ng-deep .lf-checklist-field .mat-mdc-form-field-infix{height:inherit;padding:0}::ng-deep .lf-checklist-option .mat-mdc-checkbox-touch-target{height:20px;width:20px}::ng-deep .lf-checklist-option .mdc-checkbox__native-control{top:10px;left:10px;right:10px;width:20px;height:20px}.lf-checklist-option>.lf-checkbox{height:25px}\n"] }]
        }], ctorParameters: () => [{ type: i1.FormBuilder }, { type: i0.ChangeDetectorRef }, { type: i2.AppLocalizationService }], propDecorators: { items: [{
                type: Input
            }], itemsChanged: [{
                type: Output
            }], refreshChecklistItems: [{
                type: Input
            }] } });

// Copyright (c) Laserfiche.
// Licensed under the MIT License. See LICENSE in the project root for license information.
class OptionsComponent {
    constructor() {
        this.options = [];
        this.optionsChanged = new EventEmitter();
    }
    onOptionCheckboxChanged() {
        this.optionsChanged.emit();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: OptionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: OptionsComponent, selector: "lf-options-component", inputs: { options: "options" }, outputs: { optionsChanged: "optionsChanged" }, ngImport: i0, template: "<!--Copyright (c) Laserfiche.\r\nLicensed under the MIT License. See LICENSE in the project root for license information.-->\r\n\r\n<div id=\"lf-checklist-option-container\" class=\"lf-checklist-option-container\">\r\n    <div id=\"lf-checklist-option\" class=\"lf-checklist-option\" *ngFor=\"let option of options\">\r\n        <mat-checkbox color=\"primary\" ngDefaultControl [(ngModel)]=\"option.checked\" [disabled]=\"option.disabled\"\r\n            (change)=\"onOptionCheckboxChanged()\" title=\"{{option.name}}\" class=\"lf-checkbox full-width-checkbox\">{{option.name}}</mat-checkbox>\r\n    </div>\r\n</div>\r\n", styles: [".lf-checklist-option-container{padding:5px 0 5px 45px}::ng-deep .lf-checklist-option-container .lf-checkbox.mat-mdc-checkbox .mdc-label{text-overflow:ellipsis;overflow:hidden}.lf-checklist-option{margin-bottom:5px}\n", ".lf-checklist-name-container{padding:15px 0 5px;white-space:nowrap;display:block;text-overflow:ellipsis;overflow:hidden}.lf-checklist-button-container{padding-top:10px;display:flex;justify-content:flex-end}::ng-deep .checklist-expansion-panel .mat-expansion-panel-header.mat-expanded{height:48px}::ng-deep .checklist-expansion-panel.mat-expansion-panel{position:static;border-radius:0;box-shadow:none;padding:0}::ng-deep .checklist-expansion-panel mat-expansion-panel-header{padding-left:0;padding-right:10px}::ng-deep .checklist-expansion-panel div.mat-expansion-panel-body{padding:0}mat-checkbox.lf-checkbox.full-width-checkbox{width:100%}::ng-deep .lf-checklist-field>.mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:#fff}::ng-deep .lf-checklist-field .mat-mdc-form-field-flex{height:inherit}::ng-deep .lf-checklist-field .mat-mdc-form-field-infix{height:inherit;padding:0}::ng-deep .lf-checklist-option .mat-mdc-checkbox-touch-target{height:20px;width:20px}::ng-deep .lf-checklist-option .mdc-checkbox__native-control{top:10px;left:10px;right:10px;width:20px;height:20px}.lf-checklist-option>.lf-checkbox{height:25px}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i4.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: OptionsComponent, decorators: [{
            type: Component,
            args: [{ selector: 'lf-options-component', template: "<!--Copyright (c) Laserfiche.\r\nLicensed under the MIT License. See LICENSE in the project root for license information.-->\r\n\r\n<div id=\"lf-checklist-option-container\" class=\"lf-checklist-option-container\">\r\n    <div id=\"lf-checklist-option\" class=\"lf-checklist-option\" *ngFor=\"let option of options\">\r\n        <mat-checkbox color=\"primary\" ngDefaultControl [(ngModel)]=\"option.checked\" [disabled]=\"option.disabled\"\r\n            (change)=\"onOptionCheckboxChanged()\" title=\"{{option.name}}\" class=\"lf-checkbox full-width-checkbox\">{{option.name}}</mat-checkbox>\r\n    </div>\r\n</div>\r\n", styles: [".lf-checklist-option-container{padding:5px 0 5px 45px}::ng-deep .lf-checklist-option-container .lf-checkbox.mat-mdc-checkbox .mdc-label{text-overflow:ellipsis;overflow:hidden}.lf-checklist-option{margin-bottom:5px}\n", ".lf-checklist-name-container{padding:15px 0 5px;white-space:nowrap;display:block;text-overflow:ellipsis;overflow:hidden}.lf-checklist-button-container{padding-top:10px;display:flex;justify-content:flex-end}::ng-deep .checklist-expansion-panel .mat-expansion-panel-header.mat-expanded{height:48px}::ng-deep .checklist-expansion-panel.mat-expansion-panel{position:static;border-radius:0;box-shadow:none;padding:0}::ng-deep .checklist-expansion-panel mat-expansion-panel-header{padding-left:0;padding-right:10px}::ng-deep .checklist-expansion-panel div.mat-expansion-panel-body{padding:0}mat-checkbox.lf-checkbox.full-width-checkbox{width:100%}::ng-deep .lf-checklist-field>.mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:#fff}::ng-deep .lf-checklist-field .mat-mdc-form-field-flex{height:inherit}::ng-deep .lf-checklist-field .mat-mdc-form-field-infix{height:inherit;padding:0}::ng-deep .lf-checklist-option .mat-mdc-checkbox-touch-target{height:20px;width:20px}::ng-deep .lf-checklist-option .mdc-checkbox__native-control{top:10px;left:10px;right:10px;width:20px;height:20px}.lf-checklist-option>.lf-checkbox{height:25px}\n"] }]
        }], ctorParameters: () => [], propDecorators: { options: [{
                type: Input
            }], optionsChanged: [{
                type: Output
            }] } });

// Copyright (c) Laserfiche.
// Licensed under the MIT License. See LICENSE in the project root for license information.
class LfChecklistComponent {
    /** @internal */
    constructor(
    /** @internal */
    zone) {
        this.zone = zone;
        this.checklistChanged = new EventEmitter();
        this.actionClick = new EventEmitter();
        this.cancelClick = new EventEmitter();
        /** @internal */
        this.checklists = [];
        this.initAsync = async (providers) => {
            return new Promise((resolve) => {
                this.zone.run(() => {
                    requestAnimationFrame(async () => {
                        this.checklists =
                            await providers.checklistService.loadChecklistsAsync();
                        this.itemsComponents?.forEach((component) => component.refreshChecklistItems());
                        this.checklistChanged.emit(this.checklists);
                        resolve();
                    });
                });
            });
        };
        this.forceValidation = () => {
            let isValid = true;
            this.itemsComponents.forEach((component) => {
                if (!component.forceValidation()) {
                    isValid = false;
                }
            });
            return isValid;
        };
    }
    /** @internal */
    onActionButtonClicked() {
        this.actionClick.emit(this.checklists);
    }
    /** @internal */
    onCancelButtonClicked() {
        this.cancelClick.emit(this.checklists);
    }
    /** @internal */
    emitChecklistChanges() {
        this.checklistChanged.emit(this.checklists);
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LfChecklistComponent, deps: [{ token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: LfChecklistComponent, selector: "lf-checklist-component", inputs: { action_button_text: "action_button_text", cancel_button_text: "cancel_button_text", initAsync: "initAsync", forceValidation: "forceValidation" }, outputs: { checklistChanged: "checklistChanged", actionClick: "actionClick", cancelClick: "cancelClick" }, viewQueries: [{ propertyName: "itemsComponents", predicate: ItemsComponent, descendants: true }], ngImport: i0, template: "<!--Copyright (c) Laserfiche.\r\nLicensed under the MIT License. See LICENSE in the project root for license information.-->\r\n\r\n<div id=\"lf-checklist-container\" class=\"lf-checklist-container\">\r\n    <div id=\"lf-checklist-list-container\" class=\"lf-checklist-list-container\">\r\n        <div id=\"lf-checklist-list\" class=\"lf-checklist-list\" *ngFor=\"let checklist of checklists\">\r\n            <div *ngIf=\"!checklist.collapsible\">\r\n                <div id=\"lf-checklist-name-container\" class=\"lf-checklist-name-container\">\r\n                    <span id=\"lf-checklist-name\" class=\"lf-text-label\"\r\n                        title=\"{{checklist.name}}\">{{checklist.name}}</span>\r\n                </div>\r\n                <lf-items-component *ngIf=\"checklist.checklistItems.length > 0\" [items]=\"checklist.checklistItems\"\r\n                    (itemsChanged)=\"emitChecklistChanges()\"></lf-items-component>\r\n                <lf-options-component *ngIf=\"checklist.checklistOptions.length > 0\" [options]=\"checklist.checklistOptions\"\r\n                    (optionsChanged)=\"emitChecklistChanges()\"></lf-options-component>\r\n            </div>\r\n            <div *ngIf=\"checklist.collapsible\">\r\n                <mat-expansion-panel [expanded]=\"false\" class=\"checklist-expansion-panel\">\r\n                    <mat-expansion-panel-header class=\"checklist-expansion-panel\">\r\n                        <mat-panel-title>\r\n                            <span id=\"lf-checklist-name\" class=\"lf-text-label\"\r\n                                title=\"{{checklist.name}}\">{{checklist.name}}</span>\r\n                        </mat-panel-title>\r\n                    </mat-expansion-panel-header>\r\n                    <lf-items-component *ngIf=\"checklist.checklistItems.length > 0\" [items]=\"checklist.checklistItems\"\r\n                        (itemsChanged)=\"emitChecklistChanges()\"></lf-items-component>\r\n                    <lf-options-component *ngIf=\"checklist.checklistOptions.length > 0\" [options]=\"checklist.checklistOptions\"\r\n                        (optionsChanged)=\"emitChecklistChanges()\"></lf-options-component>\r\n                </mat-expansion-panel>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div id=\"lf-checklist-button-container\" class=\"lf-checklist-button-container\">\r\n        <button *ngIf=\"action_button_text\" id=\"lf-checklist-action-button\"\r\n            class=\"lf-checklist-action-button primary-button lf-button\"\r\n            (click)=\"onActionButtonClicked()\">{{action_button_text}}</button>\r\n        <button *ngIf=\"cancel_button_text\" id=\"lf-checklist-cancel-button\"\r\n            class=\"lf-checklist-cancel-button lf-button sec-button\"\r\n            (click)=\"onCancelButtonClicked()\">{{cancel_button_text}}</button>\r\n    </div>\r\n</div>\r\n", styles: [".lf-checklist-name-container{padding:15px 0 5px;white-space:nowrap;display:block;text-overflow:ellipsis;overflow:hidden}.lf-checklist-button-container{padding-top:10px;display:flex;justify-content:flex-end}::ng-deep .checklist-expansion-panel .mat-expansion-panel-header.mat-expanded{height:48px}::ng-deep .checklist-expansion-panel.mat-expansion-panel{position:static;border-radius:0;box-shadow:none;padding:0}::ng-deep .checklist-expansion-panel mat-expansion-panel-header{padding-left:0;padding-right:10px}::ng-deep .checklist-expansion-panel div.mat-expansion-panel-body{padding:0}mat-checkbox.lf-checkbox.full-width-checkbox{width:100%}::ng-deep .lf-checklist-field>.mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:#fff}::ng-deep .lf-checklist-field .mat-mdc-form-field-flex{height:inherit}::ng-deep .lf-checklist-field .mat-mdc-form-field-infix{height:inherit;padding:0}::ng-deep .lf-checklist-option .mat-mdc-checkbox-touch-target{height:20px;width:20px}::ng-deep .lf-checklist-option .mdc-checkbox__native-control{top:10px;left:10px;right:10px;width:20px;height:20px}.lf-checklist-option>.lf-checkbox{height:25px}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2$1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i2$1.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "component", type: ItemsComponent, selector: "lf-items-component", inputs: ["items", "refreshChecklistItems"], outputs: ["itemsChanged"] }, { kind: "component", type: OptionsComponent, selector: "lf-options-component", inputs: ["options"], outputs: ["optionsChanged"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LfChecklistComponent, decorators: [{
            type: Component,
            args: [{ selector: 'lf-checklist-component', template: "<!--Copyright (c) Laserfiche.\r\nLicensed under the MIT License. See LICENSE in the project root for license information.-->\r\n\r\n<div id=\"lf-checklist-container\" class=\"lf-checklist-container\">\r\n    <div id=\"lf-checklist-list-container\" class=\"lf-checklist-list-container\">\r\n        <div id=\"lf-checklist-list\" class=\"lf-checklist-list\" *ngFor=\"let checklist of checklists\">\r\n            <div *ngIf=\"!checklist.collapsible\">\r\n                <div id=\"lf-checklist-name-container\" class=\"lf-checklist-name-container\">\r\n                    <span id=\"lf-checklist-name\" class=\"lf-text-label\"\r\n                        title=\"{{checklist.name}}\">{{checklist.name}}</span>\r\n                </div>\r\n                <lf-items-component *ngIf=\"checklist.checklistItems.length > 0\" [items]=\"checklist.checklistItems\"\r\n                    (itemsChanged)=\"emitChecklistChanges()\"></lf-items-component>\r\n                <lf-options-component *ngIf=\"checklist.checklistOptions.length > 0\" [options]=\"checklist.checklistOptions\"\r\n                    (optionsChanged)=\"emitChecklistChanges()\"></lf-options-component>\r\n            </div>\r\n            <div *ngIf=\"checklist.collapsible\">\r\n                <mat-expansion-panel [expanded]=\"false\" class=\"checklist-expansion-panel\">\r\n                    <mat-expansion-panel-header class=\"checklist-expansion-panel\">\r\n                        <mat-panel-title>\r\n                            <span id=\"lf-checklist-name\" class=\"lf-text-label\"\r\n                                title=\"{{checklist.name}}\">{{checklist.name}}</span>\r\n                        </mat-panel-title>\r\n                    </mat-expansion-panel-header>\r\n                    <lf-items-component *ngIf=\"checklist.checklistItems.length > 0\" [items]=\"checklist.checklistItems\"\r\n                        (itemsChanged)=\"emitChecklistChanges()\"></lf-items-component>\r\n                    <lf-options-component *ngIf=\"checklist.checklistOptions.length > 0\" [options]=\"checklist.checklistOptions\"\r\n                        (optionsChanged)=\"emitChecklistChanges()\"></lf-options-component>\r\n                </mat-expansion-panel>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div id=\"lf-checklist-button-container\" class=\"lf-checklist-button-container\">\r\n        <button *ngIf=\"action_button_text\" id=\"lf-checklist-action-button\"\r\n            class=\"lf-checklist-action-button primary-button lf-button\"\r\n            (click)=\"onActionButtonClicked()\">{{action_button_text}}</button>\r\n        <button *ngIf=\"cancel_button_text\" id=\"lf-checklist-cancel-button\"\r\n            class=\"lf-checklist-cancel-button lf-button sec-button\"\r\n            (click)=\"onCancelButtonClicked()\">{{cancel_button_text}}</button>\r\n    </div>\r\n</div>\r\n", styles: [".lf-checklist-name-container{padding:15px 0 5px;white-space:nowrap;display:block;text-overflow:ellipsis;overflow:hidden}.lf-checklist-button-container{padding-top:10px;display:flex;justify-content:flex-end}::ng-deep .checklist-expansion-panel .mat-expansion-panel-header.mat-expanded{height:48px}::ng-deep .checklist-expansion-panel.mat-expansion-panel{position:static;border-radius:0;box-shadow:none;padding:0}::ng-deep .checklist-expansion-panel mat-expansion-panel-header{padding-left:0;padding-right:10px}::ng-deep .checklist-expansion-panel div.mat-expansion-panel-body{padding:0}mat-checkbox.lf-checkbox.full-width-checkbox{width:100%}::ng-deep .lf-checklist-field>.mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:#fff}::ng-deep .lf-checklist-field .mat-mdc-form-field-flex{height:inherit}::ng-deep .lf-checklist-field .mat-mdc-form-field-infix{height:inherit;padding:0}::ng-deep .lf-checklist-option .mat-mdc-checkbox-touch-target{height:20px;width:20px}::ng-deep .lf-checklist-option .mdc-checkbox__native-control{top:10px;left:10px;right:10px;width:20px;height:20px}.lf-checklist-option>.lf-checkbox{height:25px}\n"] }]
        }], ctorParameters: () => [{ type: i0.NgZone }], propDecorators: { action_button_text: [{
                type: Input
            }], cancel_button_text: [{
                type: Input
            }], checklistChanged: [{
                type: Output
            }], actionClick: [{
                type: Output
            }], cancelClick: [{
                type: Output
            }], itemsComponents: [{
                type: ViewChildren,
                args: [ItemsComponent]
            }], initAsync: [{
                type: Input
            }], forceValidation: [{
                type: Input
            }] } });

// Copyright (c) Laserfiche.
// Licensed under the MIT License. See LICENSE in the project root for license information.

// Copyright (c) Laserfiche.
// Licensed under the MIT License. See LICENSE in the project root for license information.

// Copyright (c) Laserfiche.
// Licensed under the MIT License. See LICENSE in the project root for license information.

// Copyright (c) Laserfiche.
// Licensed under the MIT License. See LICENSE in the project root for license information.
class LfChecklistModule {
    /** @internal */
    constructor(
    /** @internal */ injector) {
        const elementName = 'lf-checklist';
        if (window.customElements && !customElements.get(elementName)) {
            const newElement = createCustomElement(LfChecklistComponent, { injector });
            customElements.define(elementName, newElement);
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LfChecklistModule, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.NgModule }); }
    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: LfChecklistModule, bootstrap: [LfChecklistComponent], declarations: [LfChecklistComponent,
            ItemsComponent,
            OptionsComponent,
            ItemsValidationTextPipe], imports: [BrowserModule,
            CommonModule,
            MatButtonModule,
            MatCheckboxModule,
            FormsModule,
            MatFormFieldModule,
            MatInputModule,
            ReactiveFormsModule,
            MatExpansionModule], exports: [LfChecklistComponent] }); }
    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LfChecklistModule, imports: [BrowserModule,
            CommonModule,
            MatButtonModule,
            MatCheckboxModule,
            FormsModule,
            MatFormFieldModule,
            MatInputModule,
            ReactiveFormsModule,
            MatExpansionModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: LfChecklistModule, decorators: [{
            type: NgModule,
            args: [{
                    declarations: [
                        LfChecklistComponent,
                        ItemsComponent,
                        OptionsComponent,
                        ItemsValidationTextPipe
                    ],
                    imports: [
                        BrowserModule,
                        CommonModule,
                        MatButtonModule,
                        MatCheckboxModule,
                        FormsModule,
                        MatFormFieldModule,
                        MatInputModule,
                        ReactiveFormsModule,
                        MatExpansionModule
                    ],
                    exports: [
                        LfChecklistComponent
                    ],
                    providers: [],
                    bootstrap: [LfChecklistComponent],
                    schemas: [CUSTOM_ELEMENTS_SCHEMA],
                }]
        }], ctorParameters: () => [{ type: i0.Injector }] });

// Copyright (c) Laserfiche.
// Licensed under the MIT License. See LICENSE in the project root for license information.

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

export { LfChecklistComponent, LfChecklistModule };
//# sourceMappingURL=laserfiche-lf-ui-components-lf-checklist.mjs.map
