/**
 * @license
 * Copyright 2017 JBoss Inc
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Output, ViewEncapsulation } from "@angular/core";
import { DropDownOptionValue as Value } from '../../../../../../../components/common/drop-down.component';
import { CommandService } from "../../../_services/command.service";
import { DocumentService } from "../../../_services/document.service";
import { SelectionService } from "../../../_services/selection.service";
import { AbstractRowComponent } from "../../common/item-row.abstract";
import { CommandFactory, DocumentType, SimplifiedPropertyType } from "apicurio-data-models";
export class PropertyRowComponent extends AbstractRowComponent {
    /**
     * C'tor.
     * @param changeDetectorRef
     * @param documentService
     * @param commandService
     * @param selectionService
     */
    constructor(changeDetectorRef, documentService, commandService, selectionService) {
        super(changeDetectorRef, documentService, selectionService);
        this.commandService = commandService;
        this.onDelete = new EventEmitter();
        this.onRename = new EventEmitter();
        this._ptab = null;
    }
    updateModel() {
        this._model = SimplifiedPropertyType.fromPropertySchema(this.item);
    }
    isParameter() {
        return false;
    }
    hasDescription() {
        if (this.item.description) {
            return true;
        }
        else {
            return false;
        }
    }
    hasType() {
        if (this.item.type) {
            return true;
        }
        else {
            return false;
        }
    }
    description() {
        return this.item.description;
    }
    example() {
        return this.item.example;
    }
    minimum() {
        return this.item.minimum;
    }
    maximum() {
        return this.item.maximum;
    }
    isRequired() {
        let required = this.item.parent()["required"];
        if (required && required.length > 0) {
            return required.indexOf(this.item.getPropertyName()) != -1;
        }
        return false;
    }
    required() {
        return this.isRequired() ? "required" : "not-required";
    }
    requiredOptions() {
        return [
            new Value("Required", "required"),
            new Value("Not Required", "not-required")
        ];
    }
    minimumIsSet() {
        return this.item.minimum ? this.item.minimum.toString() : null;
    }
    maximumIsSet() {
        return this.item.maximum ? this.item.maximum.toString() : null;
    }
    multipleOfIsSet() {
        return this.item.multipleOf ? this.item.multipleOf.toString() : null;
    }
    minItemsIsSet() {
        return this.item.minItems ? this.item.minItems.toString() : null;
    }
    maxItemsIsSet() {
        return this.item.maxItems ? this.item.maxItems.toString() : null;
    }
    minLengthIsSet() {
        return this.item.minLength ? this.item.minLength.toString() : null;
    }
    maxLengthIsSet() {
        return this.item.maxLength ? this.item.maxLength.toString() : null;
    }
    exclusiveMinIsSet() {
        return this.item.exclusiveMinimum ? this.item.exclusiveMinimum : false;
    }
    uniqueItemsIsSet() {
        return this.item.uniqueItems ? this.item.uniqueItems : false;
    }
    readOnlyIsSet() {
        return this.item.readOnly ? this.item.readOnly : false;
    }
    writeOnlyIsSet() {
        if (this.item.ownerDocument().getDocumentType() == DocumentType.openapi3) {
            return this.item.writeOnly ? true : false;
        }
        return false;
    }
    minPropertiesIsSet() {
        return this.item.minProperties ? this.item.minProperties.toString() : null;
    }
    maxPropertiesIsSet() {
        return this.item.maxProperties ? this.item.maxProperties.toString() : null;
    }
    // public writeOnlyIsSet(): boolean | null {
    //     return  this.item.writeOnly ? this.item.writeOnly : false; TODO nullable not exist in dataModels
    // }
    // public nullableIsSet(): boolean | null {
    //     return  this.item.nullable ? this.item.nullable : false; TODO nullable not exist in dataModels
    // }
    exclusiveMaxIsSet() {
        return this.item.exclusiveMaximum ? this.item.exclusiveMaximum : false;
    }
    isEditingDescription() {
        return this.isEditingTab("description");
    }
    isEditingSummary() {
        return this.isEditingTab("summary");
    }
    isEditingExample() {
        return this.isEditingTab("example");
    }
    isIntFloatEligible() {
        return this.item.type === "integer" || this.item.type === "float";
    }
    isStringEligible() {
        return this.item.type === "string";
    }
    isArrayEligible() {
        return this.item.type === "array";
    }
    toggleDescription() {
        this.toggleTab("description");
    }
    toggleSummary() {
        this.toggleTab("summary");
    }
    toggleExample() {
        this.toggleTab("example");
    }
    delete() {
        this.onDelete.emit();
    }
    displayType() {
        return SimplifiedPropertyType.fromPropertySchema(this.item);
    }
    rename() {
        this.onRename.emit();
    }
    setDescription(description) {
        let command = CommandFactory.createChangePropertyCommand(this.item, "description", description);
        this.commandService.emit(command);
    }
    setExample(example) {
        let command = CommandFactory.createChangePropertyCommand(this.item, "example", example);
        this.commandService.emit(command);
    }
    setNumValue(val, name) {
        let command = CommandFactory.createChangePropertyCommand(this.item, name, Number(val));
        this.commandService.emit(command);
    }
    setArrayValue(val, name) {
        let command = CommandFactory.createChangePropertyCommand(this.item, name, Array(val));
        this.commandService.emit(command);
    }
    setPattern(pattern) {
        let command = CommandFactory.createChangePropertyCommand(this.item, "pattern", pattern);
        this.commandService.emit(command);
    }
    changeRequired(newValue) {
        this.model().required = newValue === "required";
        let nt = SimplifiedPropertyType.fromPropertySchema(this.item);
        nt.required = this.model().required;
        let command = CommandFactory.createChangePropertyTypeCommand(this.item, nt);
        this.commandService.emit(command);
    }
    changeType(newType) {
        let nt = new SimplifiedPropertyType();
        nt.required = this.model().required;
        nt.type = newType.type;
        nt.enum_ = newType.enum_;
        nt.of = newType.of;
        nt.as = newType.as;
        let command = CommandFactory.createChangePropertyTypeCommand(this.item, nt);
        this.commandService.emit(command);
        this._model = nt;
        this._ptab = null;
    }
    setBoolean(val, name) {
        let command = CommandFactory.createChangePropertyCommand(this.item, name, val);
        this.commandService.emit(command);
    }
}
PropertyRowComponent.decorators = [
    { type: Component, args: [{
                selector: "property-row",
                template: "<div class=\"property\" [class.expanded]=\"isEditing()\" [class.required]=\"isRequired()\">\n    <div class=\"header\">\n        <div class=\"name\">\n            <validation-problem [model]=\"item\"></validation-problem>\n            <span title=\"{{ item.getPropertyName() }}\">{{ item.getPropertyName() }}</span>\n        </div>\n        <div class=\"description\" (click)=\"toggleDescription()\" [class.selected]=\"isEditingDescription()\">\n            <span class=\"fa fa-angle-right\" [class.fa-angle-down]=\"isEditingDescription()\"></span>\n            <markdown-summary [data]=\"description()\" emptyText=\"No description.\"></markdown-summary>\n        </div>\n        <div class=\"summary\" (click)=\"toggleSummary()\" [class.selected]=\"isEditingSummary()\">\n            <span class=\"fa fa-angle-right\" [class.fa-angle-down]=\"isEditingSummary()\"></span>\n            <span class=\"property-required\" *ngIf=\"isRequired()\" title=\"This property is required.\">[required]</span>\n            <schema-type [type]=\"displayType()\"></schema-type>\n        </div>\n        <div class=\"example\" (click)=\"toggleExample()\" [class.selected]=\"isEditingExample()\">\n            <span class=\"fa fa-angle-right\" [class.fa-angle-down]=\"isEditingExample()\"></span>\n            <markdown-summary [data]=\"example()\" emptyText=\"No example.\"></markdown-summary>\n        </div>\n        <div class=\"actions\">\n            <div class=\"dropdown dropdown-kebab-pf\">\n                <button class=\"btn btn-link dropdown-toggle\" type=\"button\" (click)=\"$event.preventDefault()\"\n                        data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"true\">\n                    <span class=\"fa fa-ellipsis-v\"></span>\n                </button>\n                <ul class=\"dropdown-menu dropdown-menu-right\">\n                    <li><a (click)=\"rename()\"><span class=\"fa fa-fw fa-pencil-square-o\"></span><span>Rename</span></a></li>\n                    <li role=\"separator\" class=\"divider\"></li>\n                    <li><a (click)=\"delete()\"><span class=\"fa fa-fw fa-trash\"></span><span>Delete</span></a></li>\n                </ul>\n            </div>\n        </div>\n    </div>\n    <div class=\"body\" *ngIf=\"isEditing()\">\n        <div class=\"content container-fluid\">\n            <form  class=\"form-horizontal\">\n                <div class=\"col-md-11\">\n                    <div class=\"property-description\" *ngIf=\"isEditingDescription()\">\n                        <div class=\"form-label\">Description</div>\n                        <inline-markdown-editor [value]=\"item.description\" [noValueMessage]=\"'No description.'\"\n                                                [baseNode]=\"item\" nodePath=\"description\"\n                                                (onChange)=\"setDescription($event)\"></inline-markdown-editor>\n                    </div>\n                    <div class=\"property-content\" *ngIf=\"isEditingSummary()\">\n                        <div class=\"property-required\">\n                            <span class=\"dropdown-label\">Property is</span>\n                            <drop-down id=\"api-property-required\"\n                                       [value]=\"required()\"\n                                       [options]=\"requiredOptions()\"\n                                       (onValueChange)=\"changeRequired($event)\"\n                                       [noSelectionLabel]=\"'Not Required'\"></drop-down>\n                        </div>\n                        <div class=\"property-type\">\n                            <schema-type-editor [document]=\"document()\" [value]=\"model()\" [isParameter]=\"isParameter()\"\n                                                (onChange)=\"changeType($event)\"></schema-type-editor>\n                        </div>\n\n                        <div class=\"property-config-tabs\" *ngIf=\"hasType()\">\n                            <ul class=\"nav nav-tabs nav-tabs-pf\">\n                                <li [class.active]=\"_ptab == null\"><a (click)=\"_ptab = null\">Advanced</a></li>\n                                <li [class.active]=\"_ptab == 'minmax'\" *ngIf=\"isIntFloatEligible()\"><a (click)=\"_ptab = 'minmax'\">Minimum/Maximum</a></li>\n                                <li [class.active]=\"_ptab == 'length'\" *ngIf=\"isStringEligible()\"><a (click)=\"_ptab = 'length'\">Min/Max Length</a></li>\n                                <li [class.active]=\"_ptab == 'exclusive'\" *ngIf=\"isStringEligible()\"><a (click)=\"_ptab = 'exclusive'\">Min/Max Exclusive</a></li>\n                                <li [class.active]=\"_ptab == 'items'\" *ngIf=\"isArrayEligible()\"><a (click)=\"_ptab = 'items'\">Min/Max/Unique Items</a></li>\n                            </ul>\n                        </div>\n                        <div class=\"property-config-tabcontent\" *ngIf=\"hasType()\">\n                            <!-- Advanced tab content -->\n                            <div class=\"tabcontent-advanced\" *ngIf=\"_ptab == null\">\n                                <div class=\"property-readOnly\">\n                                    <checkbox-input [defaultValue]=\"readOnlyIsSet()\" [name]=\"'readOnly'\" label=\"Read Only\"\n                                                    id=\"read-only\" [baseNode]=\"item\" nodePath=\"readOnly\"\n                                                    (onChange)=\"setBoolean($event,'readOnly')\"></checkbox-input>\n                                </div>\n                                <div class=\"property-writeOnly\">\n                                    <checkbox-input [defaultValue]=\"writeOnlyIsSet()\" [name]=\"'writeOnly'\" label=\"Write Only\"\n                                                    id=\"write-only\" [baseNode]=\"item\" nodePath=\"writeOnly\"\n                                                    (onChange)=\"setBoolean($event,'writeOnly')\"></checkbox-input>\n                                </div>\n\n                                <div class=\"property-pattern\" *ngIf=\"isStringEligible()\">\n                                    <div class=\"property-label\">\n                                        <label for=\"pattern\">Pattern</label>\n                                    </div>\n                                    <div class=\"property-value\">\n                                        <pf-inline-text-editor [value]=\"item.pattern\"\n                                                               noValueMessage=\"No pattern.\"\n                                                               id=\"pattern\"\n                                                               [baseNode]=\"item\"\n                                                               nodePath=\"pattern\"\n                                                               (onChange)=\"setPattern($event)\"></pf-inline-text-editor>\n                                    </div>\n                                </div>\n                            </div>\n\n                            <!-- Min/max tab content -->\n                            <div class=\"tabcontent-minmax\" *ngIf=\"_ptab == 'minmax'\">\n                                <div class=\"property-minimum\">\n                                    <div class=\"property-label\">\n                                        <label for=\"minimum\">Minimum</label>\n                                    </div>\n                                    <div class=\"property-value\">\n                                        <pf-inline-text-editor [value]=\"minimumIsSet()\" noValueMessage=\"No minimum.\"\n                                                                [baseNode]=\"item\" nodePath=\"minimum\" id=\"minimum\"\n                                                                (onChange)=\"setNumValue($event,'minimum')\"></pf-inline-text-editor>\n                                    </div>\n                                </div>\n\n                                <div class=\"property-maximum\">\n                                    <div class=\"property-label\">\n                                        <label for=\"maximum\">Maximum</label>\n                                    </div>\n                                    <div class=\"property-value\">\n                                        <pf-inline-text-editor [value]=\"maximumIsSet()\" noValueMessage=\"No maximum.\"\n                                                                [baseNode]=\"item\" nodePath=\"maximum\" id=\"maximum\"\n                                                                (onChange)=\"setNumValue($event,'maximum')\"></pf-inline-text-editor>\n                                    </div>\n                                </div>\n\n                                <div class=\"property-multipleOf\">\n                                    <div class=\"property-label\">\n                                        <label for=\"multiple-of\">MultipleOf</label>\n                                    </div>\n                                    <div class=\"property-value\">\n                                        <pf-inline-text-editor [value]=\"multipleOfIsSet()\" noValueMessage=\"No multipleOf.\"\n                                                                [baseNode]=\"item\" nodePath=\"multipleOf\" id=\"multiple-of\"\n                                                                (onChange)=\"setNumValue($event,'multipleOf')\"></pf-inline-text-editor>\n                                    </div>\n                                </div>\n                            </div>\n\n                            <!-- Min/Max Length tab content -->\n                            <div class=\"tabcontent-length\" *ngIf=\"_ptab == 'length'\">\n                                <div class=\"property-min-length\">\n                                    <div class=\"property-label\">\n                                        <label for=\"min-length\">Minimum Length</label>\n                                    </div>\n                                    <pf-inline-text-editor [value]=\"minLengthIsSet()\" noValueMessage=\"No minLength.\"\n                                                            [baseNode]=\"item\" nodePath=\"minLength\" id=\"min-length\"\n                                                            (onChange)=\"setNumValue($event,'minLength')\"></pf-inline-text-editor>\n                                </div>\n\n                                <div class=\"property-max-length\">\n                                    <div class=\"property-label\">\n                                        <label for=\"max-length\">Maximum Length</label>\n                                    </div>\n                                    <div class=\"property-value\">\n                                        <pf-inline-text-editor [value]=\"maxLengthIsSet()\" noValueMessage=\"No maxLength.\"\n                                                                [baseNode]=\"item\" nodePath=\"maxLength\" id=\"max-length\"\n                                                                (onChange)=\"setNumValue($event,'maxLength')\"></pf-inline-text-editor>\n                                    </div>\n                                </div>\n                            </div>\n\n                            <!-- Exclusive min/max tab content -->\n                            <div class=\"tabcontent-exclusive\" *ngIf=\"_ptab == 'exclusive'\">\n                                <div class=\"property-exclusive-minimum\">\n                                    <checkbox-input [defaultValue]=\"exclusiveMinIsSet()\" name=\"exclusive-minimum\" label=\"Exclusive Min\"\n                                                    id=\"exclusive-minimum\" [baseNode]=\"item\" nodePath=\"exclusiveMinimum\"\n                                                    (onChange)=\"setBoolean($event,'exclusiveMinimum')\"></checkbox-input>\n                                </div>\n                                <div class=\"property-exclusive-maximum\">\n                                    <checkbox-input [defaultValue]=\"exclusiveMaxIsSet()\" name=\"exclusive-maximum\" label=\"Exclusive Max\"\n                                                    id=\"exclusive-maximum\" [baseNode]=\"item\" nodePath=\"exclusiveMaximum\"\n                                                    (onChange)=\"setBoolean($event,'exclusiveMaximum')\"></checkbox-input>\n                                </div>\n                            </div>\n\n                            <!-- Min/max Items tab content -->\n                            <div class=\"tabcontent-items\" *ngIf=\"_ptab == 'items'\">\n                                <div class=\"property-min-items\">\n                                    <div class=\"property-label\">\n                                        <label for=\"min-items\">Minimum Items</label>\n                                    </div>\n                                    <div class=\"property-value\">\n                                        <pf-inline-text-editor [value]=\"minItemsIsSet()\" noValueMessage=\"No minItems.\"\n                                                                [baseNode]=\"item\" nodePath=\"minItems\" id=\"min-items\"\n                                                                (onChange)=\"setNumValue($event,'minItems')\"></pf-inline-text-editor>\n                                    </div>\n                                </div>\n\n                                <div class=\"property-max-items\">\n                                    <div class=\"property-label\">\n                                        <label for=\"max-items\">Maximum Items</label>\n                                    </div>\n                                    <div class=\"property-value\">\n                                        <pf-inline-text-editor [value]=\"maxItemsIsSet()\" noValueMessage=\"No maxItems.\"\n                                                                [baseNode]=\"item\" nodePath=\"maxItems\" id=\"max-items\"\n                                                                (onChange)=\"setNumValue($event,'maxItems')\"></pf-inline-text-editor>\n                                    </div>\n                                </div>\n\n                                <div class=\"property-unique-items\">\n                                    <checkbox-input [defaultValue]=\"uniqueItemsIsSet()\" name=\"unique-items\" label=\"Unique Items\"\n                                                    id=\"unique-items\" [baseNode]=\"item\" nodePath=\"uniqueItems\"\n                                                    (onChange)=\"setBoolean($event,'uniqueItems')\"></checkbox-input>\n                                </div>\n                            </div>\n                        </div>\n                    </div>\n                    <div class=\"property-example\" *ngIf=\"isEditingExample()\">\n                        <div class=\"form-label\">Example</div>\n                        <inline-markdown-editor [value]=\"item.example\" [noValueMessage]=\"'No example.'\"\n                                                [baseNode]=\"item\" nodePath=\"example\"\n                                                (onChange)=\"setExample($event)\"></inline-markdown-editor>\n                    </div>\n                </div>\n            </form>\n        </div>\n    </div>\n</div>\n",
                encapsulation: ViewEncapsulation.None,
                changeDetection: ChangeDetectionStrategy.OnPush,
                styles: [".property{border:1px solid transparent;position:relative}.property.expanded{border:1px solid #bbb;box-shadow:0 2px 6px rgba(3,3,3,.2);margin-bottom:3px}.property-config-tabcontent{margin-top:8px;padding-left:10px;padding-right:10px}.property .header{display:flex;flex-direction:row;flex-wrap:nowrap;padding:8px 8px 3px;border-bottom:1px solid #f5f5f5}.property .header:hover{background-color:#edf8ff}.property.expanded .header{border-bottom:1px solid #bbb;background-color:#def3ff}.property .header .name{flex-basis:18%;overflow-x:hidden;white-space:nowrap;text-overflow:ellipsis;padding-right:5px}.property .header .name>span{font-weight:600}.property .header .description{flex-basis:39%;overflow-x:hidden;white-space:nowrap;text-overflow:ellipsis;padding-right:5px}.property .header .description:hover{color:#0088ce;cursor:pointer}.property .header .example{flex-basis:39%;overflow-x:hidden;white-space:nowrap;text-overflow:ellipsis;padding-right:5px}.property .header .example:hover{color:#0088ce;cursor:pointer}.property .header .summary{flex-basis:41%}.property .header .summary:hover{color:#0088ce;cursor:pointer}.property .header .summary .property-required{font-weight:600;margin-right:3px}.property .header .summary .property-required:hover{filter:brightness(120%)}.property .header .minmax{flex-basis:41%}.property .header .minmax:hover{color:#0088ce;cursor:pointer}.property .header .minmax .property-required{font-weight:600;margin-right:3px}.property .header .minmax .property-required:hover{filter:brightness(120%)}.property .header .actions{flex-basis:2%;text-align:center}.property .header>.selected{margin-bottom:-4px;border-bottom:2px solid #0088ce;color:#0088ce}.property .body{position:relative;padding:15px}.property .body .close{position:absolute;right:10px;top:5px}.property .body .property-description form{width:100%}.property .body .property-description .form-label{font-weight:600}.property .body .property-example form{width:100%}.property .body .property-example .form-label,.property .body span.strong{font-weight:600}.property .body .property-required{margin-bottom:20px}.property .body .property-type{margin-bottom:10px}.property .body .property-minmax{margin-bottom:10px;margin-top:20px}.property .body .toggle-buttons{margin:20px auto}.property .body .toggle-buttons button{margin-left:10px}.property .body .divider{height:1px;width:100%;display:block;margin:15px 0;overflow:hidden;background-color:#e5e5e5}.property .body .property-pattern{margin-bottom:10px}.property .body .property-required .dropdown{display:inline-block;margin-left:3px;margin-right:3px}.property .header .description>.fa,.property .header .example>.fa,.property .header .summary>.fa{margin-right:2px}.property .summary .parameter-required{margin-right:3px}.property .header .minmax>.fa{margin-right:2px}.property .minmax .parameter-required{margin-right:3px}.property .body .exclusive-div,.property .body .nullable-div{margin-top:10px}.property-label>label{margin-bottom:0;margin-top:3px}"]
            },] }
];
PropertyRowComponent.ctorParameters = () => [
    { type: ChangeDetectorRef },
    { type: DocumentService },
    { type: CommandService },
    { type: SelectionService }
];
PropertyRowComponent.propDecorators = {
    onDelete: [{ type: Output }],
    onRename: [{ type: Output }]
};
//# sourceMappingURL=data:application/json;base64, 