import { jsx as _jsx } from "@emotion/react/jsx-runtime";
import { registerComponent } from "../interfaces";
import ContainerComponent from "../components/Container";
const Container = registerComponent("Container", {
    type: "none",
    icon: "Container",
    group: "layout",
    kind: "container",
    experimental: true,
    hidden: true,
    defaultProps: {
        padding: "2",
        background: "fill",
        length: "1",
        justify: "start",
        direction: "row",
        gap: "2",
    },
    propDefinition: {
        padding: {
            group: "Design",
            type: "string",
            options: {
                format: "select",
                options: [
                    { label: "Large", value: "6" },
                    { label: "Medium", value: "4" },
                    { label: "Small", value: "2" },
                    { label: "None", value: "0" },
                ],
            },
        },
        background: {
            group: "Design",
            type: "string",
            options: {
                format: "select",
                options: [
                    { label: "Fill", value: "fill" },
                    { label: "Transparent", value: "transparent" },
                ],
            },
        },
        justify: {
            group: "Design",
            type: "string",
            options: {
                format: "select",
                options: [
                    { label: "Stretch", value: "stretch" },
                    { label: "Start", value: "start" },
                    { label: "Center", value: "center" },
                    { label: "End", value: "end" },
                ],
            },
        },
        direction: {
            group: "Design",
            type: "string",
            options: {
                format: "select",
                options: [
                    { label: "Horizontal", value: "row" },
                    { label: "Vertical", value: "column" },
                ],
            },
        },
        gap: {
            group: "Design",
            type: "string",
            options: {
                format: "select",
                options: [
                    { label: "Large", value: "6" },
                    { label: "Medium", value: "4" },
                    { label: "Small", value: "2" },
                    { label: "None", value: "0" },
                ],
            },
        },
        length: { group: "Design", type: "string", options: { format: "text" } },
    },
    Component: (props) => _jsx(ContainerComponent, Object.assign({}, props)),
});
export default Container;
//# sourceMappingURL=buildContainer.js.map