import { h, Host } from "@stencil/core";
import { FlexClass } from "./constants";
import { govHost } from "../../helpers/Dom/template";
export class GovFlex {
    constructor() {
        /**
         * Controls the flex direction of the container.
         */
        this.direction = 'row';
        /**
         * Option to turn off responsive
         */
        this.responsive = "true";
        this.h = govHost(this.host);
    }
    render() {
        return (h(Host, { key: '1c88a4c6aaf69a13c514bc24c10fd2a32316a7c0', class: this.h.classes(FlexClass.root) }, h("slot", { key: 'b055e2aff7056be660e53d5036341fbaabe796b1' })));
    }
    static get is() { return "gov-flex"; }
    static get properties() {
        return {
            "direction": {
                "type": "string",
                "attribute": "direction",
                "mutable": false,
                "complexType": {
                    "original": "'row' | 'row-reverse' | 'column' | 'column-reverse'",
                    "resolved": "\"column\" | \"column-reverse\" | \"row\" | \"row-reverse\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Controls the flex direction of the container."
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "defaultValue": "'row'"
            },
            "justifyContent": {
                "type": "string",
                "attribute": "justify-content",
                "mutable": false,
                "complexType": {
                    "original": "'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly'",
                    "resolved": "\"center\" | \"flex-end\" | \"flex-start\" | \"space-around\" | \"space-between\" | \"space-evenly\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Defines how the browser distributes space between and around content items along the main axis."
                },
                "getter": false,
                "setter": false,
                "reflect": true
            },
            "alignItems": {
                "type": "string",
                "attribute": "align-items",
                "mutable": false,
                "complexType": {
                    "original": "'stretch' | 'flex-start' | 'flex-end' | 'center' | 'baseline'",
                    "resolved": "\"baseline\" | \"center\" | \"flex-end\" | \"flex-start\" | \"stretch\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Aligns flex items along the cross axis."
                },
                "getter": false,
                "setter": false,
                "reflect": true
            },
            "wrap": {
                "type": "string",
                "attribute": "wrap",
                "mutable": false,
                "complexType": {
                    "original": "'nowrap' | 'wrap' | 'wrap-reverse'",
                    "resolved": "\"nowrap\" | \"wrap\" | \"wrap-reverse\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Controls whether the flex container is a single-line or multi-line flex container."
                },
                "getter": false,
                "setter": false,
                "reflect": true
            },
            "alignContent": {
                "type": "string",
                "attribute": "align-content",
                "mutable": false,
                "complexType": {
                    "original": "'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'stretch'",
                    "resolved": "\"center\" | \"flex-end\" | \"flex-start\" | \"space-around\" | \"space-between\" | \"stretch\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Aligns the flex container's lines within when there is extra space in the cross-axis."
                },
                "getter": false,
                "setter": false,
                "reflect": true
            },
            "alignSelf": {
                "type": "string",
                "attribute": "align-self",
                "mutable": false,
                "complexType": {
                    "original": "'auto' | 'normal' | 'self-start' | 'self-end' | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch' | 'anchor-center'",
                    "resolved": "\"anchor-center\" | \"auto\" | \"baseline\" | \"center\" | \"flex-end\" | \"flex-start\" | \"normal\" | \"self-end\" | \"self-start\" | \"stretch\"",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Sets the alignment of the flex container\u2019s children along the flex container\u2019s cross axis, overriding the `align-items` property for individual flex items."
                },
                "getter": false,
                "setter": false,
                "reflect": true
            },
            "gap": {
                "type": "string",
                "attribute": "gap",
                "mutable": false,
                "complexType": {
                    "original": "FlexSizesType",
                    "resolved": "\"2xl\" | \"2xs\" | \"3xl\" | \"4xl\" | \"5xl\" | \"6xl\" | \"l\" | \"m\" | \"s\" | \"xl\" | \"xs\"",
                    "references": {
                        "FlexSizesType": {
                            "location": "import",
                            "path": "./constants",
                            "id": "../../../packages/core/src/components/gov-flex/constants.ts::FlexSizesType"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "The gap property creates consistent spacing between flex items in the container."
                },
                "getter": false,
                "setter": false,
                "reflect": true
            },
            "responsive": {
                "type": "string",
                "attribute": "responsive",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Option to turn off responsive"
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "defaultValue": "\"true\""
            }
        };
    }
    static get elementRef() { return "host"; }
}
//# sourceMappingURL=gov-flex.js.map
