{#
Title: Column Single
Description: Single configurable bootstrap column
Category: formatting
Icon: editor-table
Keywords: column bootstrap width
Mode: preview
SupportsJSX: true
Align: full
SupportsAlign: full false
Parent: acf/columns
#}
{% extends '/views/parts/logic/block-settings.twig' %}
{% block blocksettings %}
    {% set widths = fields.column_settings ?? {} %}
    {% set classes = ['column'] %}

    {% if widths.width_default is defined and widths.width_default %}
        {% set classes = classes|merge(['col-' ~ widths.width_default]) %}
    {% else %}
        {% set classes = classes|merge(['col-12']) %}
    {% endif %}

    {% if widths.width_sm is defined and widths.width_sm %}
        {% set classes = classes|merge(['col-sm-' ~ widths.width_sm]) %}
    {% endif %}
    {% if widths.width_md is defined and widths.width_md %}
        {% set classes = classes|merge(['col-md-' ~ widths.width_md]) %}
    {% endif %}
    {% if widths.width_lg is defined and widths.width_lg %}
        {% set classes = classes|merge(['col-lg-' ~ widths.width_lg]) %}
    {% endif %}
    {% if widths.width_xl is defined and widths.width_xl %}
        {% set classes = classes|merge(['col-xl-' ~ widths.width_xl]) %}
    {% endif %}
    {% if widths.width_xxl is defined and widths.width_xxl %}
        {% set classes = classes|merge(['col-xxl-' ~ widths.width_xxl]) %}
    {% endif %}

    <div class="{{ classes|join(' ') }}">
        <InnerBlocks
                allowedBlocks="true"
                templateLock="false"
        />
    </div>
{% endblock %}