import { h } from "@stencil/core";
import { ElementQuestionBase } from '../../../utils/element-question-base';
export class ElementMatrixEditor {
    constructor() {
        this.label = {
            name: 'Matrix',
            labelQuestion: 'Formulate your question',
            labelRequired: 'Required',
            labelRows: 'Rows',
            labelColumns: 'Columns',
            labelOrientation: 'Column Oriëntation',
            labelOrientationH: 'Horizontal',
            labelOrientationV: 'Vertical',
            placeholderRows: 'Row',
            placeholderColumns: 'Column',
            rows: {
                labelOCOptionAdd: 'Add Row',
                labelOCOptionRemove: 'Delete Row'
            },
            columns: {
                labelOCOptionAdd: 'Add Row',
                labelOCOptionRemove: 'Delete Row'
            }
        };
    }
    prop(path, options = {}) {
        return this.handler.prop(path, Object.assign(Object.assign({}, options), { label: this.label }));
    }
    render() {
        const { labelOrientationH, labelOrientationV } = this.label;
        return (h(ElementQuestionBase, { question: this.prop('question', { localize: true }), required: this.prop('required') },
            h("div", { class: "option-creator" },
                h("bce-option-creator", Object.assign({}, this.prop('rows', { default: () => [], localize: true }), { label: this.label.rows })),
                h("bce-option-creator", Object.assign({}, this.prop('columns', { default: () => [], localize: true }), { label: this.label.columns }))),
            h("bce-select", Object.assign({}, this.prop('orientation'), { type: "radio" }),
                h("bce-option", { value: "horizontal" }, labelOrientationH),
                h("bce-option", { value: "vertical" }, labelOrientationV)),
            h("slot", null)));
    }
    static get is() { return "bce-element-matrix-editor"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() { return {
        "$": ["bce-element-matrix-editor.scss"]
    }; }
    static get styleUrls() { return {
        "$": ["bce-element-matrix-editor.css"]
    }; }
    static get properties() { return {
        "handler": {
            "type": "unknown",
            "mutable": false,
            "complexType": {
                "original": "InputHandler",
                "resolved": "InputHandler",
                "references": {
                    "InputHandler": {
                        "location": "import",
                        "path": "../../../utils/input-handler"
                    }
                }
            },
            "required": true,
            "optional": false,
            "docs": {
                "tags": [],
                "text": ""
            }
        },
        "language": {
            "type": "string",
            "mutable": false,
            "complexType": {
                "original": "string",
                "resolved": "string | undefined",
                "references": {}
            },
            "required": false,
            "optional": true,
            "docs": {
                "tags": [],
                "text": ""
            },
            "attribute": "language",
            "reflect": false
        },
        "label": {
            "type": "unknown",
            "mutable": false,
            "complexType": {
                "original": "MatrixElement.Label",
                "resolved": "Label",
                "references": {
                    "MatrixElement": {
                        "location": "import",
                        "path": "./element-matrix"
                    }
                }
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": ""
            },
            "defaultValue": "{\n    name: 'Matrix',\n    labelQuestion: 'Formulate your question',\n    labelRequired: 'Required',\n    labelRows: 'Rows',\n    labelColumns: 'Columns',\n    labelOrientation: 'Column Ori\u00EBntation',\n    labelOrientationH: 'Horizontal',\n    labelOrientationV: 'Vertical',\n    placeholderRows: 'Row',\n    placeholderColumns: 'Column',\n    rows: {\n      labelOCOptionAdd: 'Add Row',\n      labelOCOptionRemove: 'Delete Row'\n    },\n    columns: {\n      labelOCOptionAdd: 'Add Row',\n      labelOCOptionRemove: 'Delete Row'\n    }\n  }"
        },
        "tick": {
            "type": "boolean",
            "mutable": false,
            "complexType": {
                "original": "boolean",
                "resolved": "boolean | undefined",
                "references": {}
            },
            "required": false,
            "optional": true,
            "docs": {
                "tags": [],
                "text": ""
            },
            "attribute": "tick",
            "reflect": false
        }
    }; }
}
