import { h } from "@stencil/core";
import { resolveJson } from "../../utils/utils";
import _ from "lodash";
export class PwcDynamicFormContent {
    itemsWatchHandler(items) {
        this.resolvedItems = resolveJson(items);
    }
    async getFieldRefs() {
        return this.fieldRefs;
    }
    componentWillLoad() {
        this.itemsWatchHandler(this.items);
    }
    handleFieldRef(fieldConfig, fieldRef) {
        if (fieldRef) {
            this.fieldRefs = _.unionBy(this.fieldRefs, [fieldRef], i => i.config.name);
        }
        else {
            _.remove(this.fieldRefs, i => i.config.name === fieldConfig.name);
        }
    }
    constructField(fieldConfig) {
        let nameIndexer = 0;
        const nameGenerator = name => {
            return name || "pwc-dynamic-form___generated-name-" + nameIndexer++;
        };
        fieldConfig.name = nameGenerator(fieldConfig.name);
        return (h("pwc-dynamic-form-field", { config: fieldConfig, ref: this.handleFieldRef.bind(this, fieldConfig) }));
    }
    render() {
        if (this.resolvedItems) {
            // we are mutating the config, therefore we have to clone it to leave the user input intact.
            const resolvedItemsClone = _.cloneDeep(this.resolvedItems);
            return resolvedItemsClone.map(this.constructField.bind(this));
        }
        else {
            return "";
        }
    }
    static get is() { return "pwc-dynamic-form-content"; }
    static get originalStyleUrls() { return {
        "$": ["pwc-dynamic-form-content.css"]
    }; }
    static get styleUrls() { return {
        "$": ["pwc-dynamic-form-content.css"]
    }; }
    static get properties() { return {
        "items": {
            "type": "string",
            "mutable": false,
            "complexType": {
                "original": "string | ContentItemConfig[]",
                "resolved": "ContentItemConfig[] | string",
                "references": {
                    "ContentItemConfig": {
                        "location": "import",
                        "path": "../pwc-dynamic-form-field/ContentItemConfig"
                    }
                }
            },
            "required": false,
            "optional": false,
            "docs": {
                "tags": [],
                "text": ""
            },
            "attribute": "items",
            "reflect": false
        }
    }; }
    static get methods() { return {
        "getFieldRefs": {
            "complexType": {
                "signature": "() => Promise<HTMLPwcDynamicFormFieldElement[]>",
                "parameters": [],
                "references": {
                    "Promise": {
                        "location": "global"
                    },
                    "HTMLPwcDynamicFormFieldElement": {
                        "location": "global"
                    }
                },
                "return": "Promise<HTMLPwcDynamicFormFieldElement[]>"
            },
            "docs": {
                "text": "",
                "tags": []
            }
        }
    }; }
    static get elementRef() { return "rootElement"; }
    static get watchers() { return [{
            "propName": "items",
            "methodName": "itemsWatchHandler"
        }]; }
}
