import { Host, h } from "@stencil/core";
import { cls } from "../../utils/helpers";
export class XGridRow {
    constructor() {
        this.gutter = undefined;
        this.cols = undefined;
        this.align = undefined;
        this.justify = undefined;
        this.gutterSm = undefined;
        this.gutterMd = undefined;
        this.gutterLg = undefined;
        this.gutterXl = undefined;
        this.colsSm = undefined;
        this.colsMd = undefined;
        this.colsLg = undefined;
        this.colsXl = undefined;
        this.alignSm = undefined;
        this.alignMd = undefined;
        this.alignLg = undefined;
        this.alignXl = undefined;
        this.justifySm = undefined;
        this.justifyMd = undefined;
        this.justifyLg = undefined;
        this.justifyXl = undefined;
    }
    /**
     * Watch gutters property changes for update child items padding
     */
    watchMultiple() {
        this.updateChildsElements();
    }
    /**
     * On component did loaded hook
     */
    componentDidLoad() {
        this.updateChildsElements();
    }
    /**
     * Update child classes of item
     */
    updateChildsElements() {
        Array.from(this.el.children)
            .filter(el => el.nodeName.toLowerCase() === 'x-col')
            .forEach((el) => {
            this.gutter && el.setPaddingGutters(this.gutter);
            this.gutterSm && el.setPaddingGutters(this.gutterSm, 'sm');
            this.gutterMd && el.setPaddingGutters(this.gutterMd, 'md');
            this.gutterLg && el.setPaddingGutters(this.gutterLg, 'lg');
            this.gutterXl && el.setPaddingGutters(this.gutterXl, 'xl');
        });
    }
    /**
     * Render component
     */
    render() {
        return h(Host, { key: 'f609d9bd9b3cec2315f4c3f958e41b2cccbe30ed', class: cls('row', this.gutter && (this.gutter === '0' ? 'no-gutters' : `mx-n${this.gutter}`), this.gutterSm && `mx-sm-n${this.gutterSm}`, this.gutterMd && `mx-md-n${this.gutterMd}`, this.gutterLg && `mx-lg-n${this.gutterLg}`, this.gutterXl && `mx-xl-n${this.gutterXl}`, this.cols && `row-cols-${this.cols}`, this.colsSm && `row-cols-sm-${this.colsSm}`, this.colsMd && `row-cols-md-${this.colsMd}`, this.colsLg && `row-cols-lg-${this.colsLg}`, this.colsXl && `row-cols-xl-${this.colsXl}`, this.align && `align-items-${this.align}`, this.alignSm && `align-items-sm-${this.alignSm}`, this.alignMd && `align-items-md-${this.alignMd}`, this.alignLg && `align-items-lg-${this.alignLg}`, this.alignXl && `align-items-xl-${this.alignXl}`, this.justify && `justify-content-${this.justify}`, this.justifySm && `justify-content-sm-${this.justifySm}`, this.justifyMd && `justify-content-md-${this.justifyMd}`, this.justifyLg && `justify-content-lg-${this.justifyLg}`, this.justifyXl && `justify-content-xl-${this.justifyXl}`) }, h("slot", { key: '4e29b9f0f1d4f89c3d195b49a92d039d412f4cae' }));
    }
    static get is() { return "x-row"; }
    static get originalStyleUrls() {
        return {
            "$": ["./style.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["style.css"]
        };
    }
    static get properties() {
        return {
            "gutter": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowGuttersType",
                    "resolved": "\"0\" | \"1\" | \"2\" | \"3\" | \"4\" | \"5\"",
                    "references": {
                        "RowGuttersType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowGuttersType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element gutters padding size"
                },
                "attribute": "gutter",
                "reflect": false
            },
            "cols": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowColsType",
                    "resolved": "\"1\" | \"10\" | \"11\" | \"12\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\" | \"7\" | \"8\" | \"9\"",
                    "references": {
                        "RowColsType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowColsType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element columns count"
                },
                "attribute": "cols",
                "reflect": false
            },
            "align": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowAlignType",
                    "resolved": "\"center\" | \"end\" | \"normal\" | \"start\" | \"stretch\"",
                    "references": {
                        "RowAlignType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowAlignType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element align items style"
                },
                "attribute": "align",
                "reflect": false
            },
            "justify": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowJustifyType",
                    "resolved": "\"around\" | \"between\" | \"center\" | \"end\" | \"evenly\" | \"left\" | \"normal\" | \"right\" | \"start\" | \"stretch\"",
                    "references": {
                        "RowJustifyType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowJustifyType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element justify content style"
                },
                "attribute": "justify",
                "reflect": false
            },
            "gutterSm": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowGuttersType",
                    "resolved": "\"0\" | \"1\" | \"2\" | \"3\" | \"4\" | \"5\"",
                    "references": {
                        "RowGuttersType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowGuttersType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element gutters padding size in small screens"
                },
                "attribute": "gutter-sm",
                "reflect": false
            },
            "gutterMd": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowGuttersType",
                    "resolved": "\"0\" | \"1\" | \"2\" | \"3\" | \"4\" | \"5\"",
                    "references": {
                        "RowGuttersType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowGuttersType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element gutters padding size in medium screens"
                },
                "attribute": "gutter-md",
                "reflect": false
            },
            "gutterLg": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowGuttersType",
                    "resolved": "\"0\" | \"1\" | \"2\" | \"3\" | \"4\" | \"5\"",
                    "references": {
                        "RowGuttersType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowGuttersType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element gutters padding size in large screens"
                },
                "attribute": "gutter-lg",
                "reflect": false
            },
            "gutterXl": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowGuttersType",
                    "resolved": "\"0\" | \"1\" | \"2\" | \"3\" | \"4\" | \"5\"",
                    "references": {
                        "RowGuttersType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowGuttersType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element gutters padding size in extra large screens"
                },
                "attribute": "gutter-xl",
                "reflect": false
            },
            "colsSm": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowColsType",
                    "resolved": "\"1\" | \"10\" | \"11\" | \"12\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\" | \"7\" | \"8\" | \"9\"",
                    "references": {
                        "RowColsType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowColsType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element columns count in small screens"
                },
                "attribute": "cols-sm",
                "reflect": false
            },
            "colsMd": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowColsType",
                    "resolved": "\"1\" | \"10\" | \"11\" | \"12\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\" | \"7\" | \"8\" | \"9\"",
                    "references": {
                        "RowColsType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowColsType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element columns count in medium screens"
                },
                "attribute": "cols-md",
                "reflect": false
            },
            "colsLg": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowColsType",
                    "resolved": "\"1\" | \"10\" | \"11\" | \"12\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\" | \"7\" | \"8\" | \"9\"",
                    "references": {
                        "RowColsType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowColsType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element columns count in large screens"
                },
                "attribute": "cols-lg",
                "reflect": false
            },
            "colsXl": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowColsType",
                    "resolved": "\"1\" | \"10\" | \"11\" | \"12\" | \"2\" | \"3\" | \"4\" | \"5\" | \"6\" | \"7\" | \"8\" | \"9\"",
                    "references": {
                        "RowColsType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowColsType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element columns count in extra large screens"
                },
                "attribute": "cols-xl",
                "reflect": false
            },
            "alignSm": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowAlignType",
                    "resolved": "\"center\" | \"end\" | \"normal\" | \"start\" | \"stretch\"",
                    "references": {
                        "RowAlignType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowAlignType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element align items style in small screens"
                },
                "attribute": "align-sm",
                "reflect": false
            },
            "alignMd": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowAlignType",
                    "resolved": "\"center\" | \"end\" | \"normal\" | \"start\" | \"stretch\"",
                    "references": {
                        "RowAlignType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowAlignType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element align items style in medium screens"
                },
                "attribute": "align-md",
                "reflect": false
            },
            "alignLg": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowAlignType",
                    "resolved": "\"center\" | \"end\" | \"normal\" | \"start\" | \"stretch\"",
                    "references": {
                        "RowAlignType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowAlignType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element align items style in large screens"
                },
                "attribute": "align-lg",
                "reflect": false
            },
            "alignXl": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowAlignType",
                    "resolved": "\"center\" | \"end\" | \"normal\" | \"start\" | \"stretch\"",
                    "references": {
                        "RowAlignType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowAlignType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element align items style in extra large screens"
                },
                "attribute": "align-xl",
                "reflect": false
            },
            "justifySm": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowJustifyType",
                    "resolved": "\"around\" | \"between\" | \"center\" | \"end\" | \"evenly\" | \"left\" | \"normal\" | \"right\" | \"start\" | \"stretch\"",
                    "references": {
                        "RowJustifyType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowJustifyType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element justify content style in small screens"
                },
                "attribute": "justify-sm",
                "reflect": false
            },
            "justifyMd": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowJustifyType",
                    "resolved": "\"around\" | \"between\" | \"center\" | \"end\" | \"evenly\" | \"left\" | \"normal\" | \"right\" | \"start\" | \"stretch\"",
                    "references": {
                        "RowJustifyType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowJustifyType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element justify content style in medium screens"
                },
                "attribute": "justify-md",
                "reflect": false
            },
            "justifyLg": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowJustifyType",
                    "resolved": "\"around\" | \"between\" | \"center\" | \"end\" | \"evenly\" | \"left\" | \"normal\" | \"right\" | \"start\" | \"stretch\"",
                    "references": {
                        "RowJustifyType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowJustifyType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element justify content style in large screens"
                },
                "attribute": "justify-lg",
                "reflect": false
            },
            "justifyXl": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "RowJustifyType",
                    "resolved": "\"around\" | \"between\" | \"center\" | \"end\" | \"evenly\" | \"left\" | \"normal\" | \"right\" | \"start\" | \"stretch\"",
                    "references": {
                        "RowJustifyType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-grid/component-row.tsx",
                            "id": "src/components/x-grid/component-row.tsx::RowJustifyType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element justify content style in extra large screens"
                },
                "attribute": "justify-xl",
                "reflect": false
            }
        };
    }
    static get elementRef() { return "el"; }
    static get watchers() {
        return [{
                "propName": "gutters",
                "methodName": "watchMultiple"
            }, {
                "propName": "guttersSm",
                "methodName": "watchMultiple"
            }, {
                "propName": "guttersMd",
                "methodName": "watchMultiple"
            }, {
                "propName": "guttersLg",
                "methodName": "watchMultiple"
            }, {
                "propName": "guttersXl",
                "methodName": "watchMultiple"
            }];
    }
}
