'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-7a477838.js');
const layoutColumnsVariation_enum = require('./layout-columns-variation.enum-65675649.js');

const layoutColumnsCss = ".sc-digi-layout-columns-h{--digi--layout-columns--gap--column:var(--digi--gutter--largest);--digi--layout-columns--gap--row:var(--digi--gutter--largest);--digi--layout-columns--min-width:0;--digi--layout-columns--gap--column--32:var(--digi--global--spacing--largest-4)}.sc-digi-layout-columns-h .digi-layout-columns.sc-digi-layout-columns{display:grid;grid-column-gap:var(--digi--layout-columns--gap--column);grid-row-gap:var(--digi--layout-columns--gap--row);grid-template-columns:repeat(auto-fit, minmax(var(--digi--layout-columns--min-width), 1fr))}.sc-digi-layout-columns-h .digi-layout-columns--column-gap-32.sc-digi-layout-columns{--digi--layout-columns--gap--column:var(--digi--layout-columns--gap--column--32)}.sc-digi-layout-columns-h .digi-layout-columns--one.sc-digi-layout-columns{--digi--layout-columns--min-width:100%}.sc-digi-layout-columns-h .digi-layout-columns--two.sc-digi-layout-columns{--digi--layout-columns--min-width:calc(50% - var(--digi--layout-columns--gap--column))}.sc-digi-layout-columns-h .digi-layout-columns--three.sc-digi-layout-columns{--digi--layout-columns--min-width:calc(33% - var(--digi--layout-columns--gap--column))}.sc-digi-layout-columns-h .digi-layout-columns--four.sc-digi-layout-columns{--digi--layout-columns--min-width:calc(25% - var(--digi--layout-columns--gap--column))}";
const DigiLayoutColumnsStyle0 = layoutColumnsCss;

const LayoutColumns = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.afElement = layoutColumnsVariation_enum.LayoutColumnsElement.DIV;
        this.afVariation = undefined;
        this.afColumnGap = layoutColumnsVariation_enum.LayoutColumnsGap.DEFAULT;
    }
    get cssModifiers() {
        return {
            'digi-layout-columns--one': this.afVariation === layoutColumnsVariation_enum.LayoutColumnsVariation.ONE,
            'digi-layout-columns--two': this.afVariation === layoutColumnsVariation_enum.LayoutColumnsVariation.TWO,
            'digi-layout-columns--three': this.afVariation === layoutColumnsVariation_enum.LayoutColumnsVariation.THREE,
            'digi-layout-columns--four': this.afVariation === layoutColumnsVariation_enum.LayoutColumnsVariation.FOUR,
            'digi-layout-columns--column-gap-32': this.afColumnGap === layoutColumnsVariation_enum.LayoutColumnsGap.GAP_32
        };
    }
    render() {
        return (index.h(this.afElement, { key: '6dc9ed51631d90ea92f5e405d49edca25c5d800d', class: Object.assign({ 'digi-layout-columns': true }, this.cssModifiers) }, index.h("slot", { key: 'ffe0da97c5d4bd5d656da66441cc16367d810b0a' })));
    }
};
LayoutColumns.style = DigiLayoutColumnsStyle0;

exports.digi_layout_columns = LayoutColumns;
