<!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
{% block sw_flow_sequence_selector %}
<div class="sw-flow-sequence-selector">
    <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
    {% block sw_flow_sequence_selector_title %}
    <div class="sw-flow-sequence-selector__title">
        <slot name="title">
            <h4>{{ title }}</h4>
        </slot>
    </div>
    {% endblock %}

    <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
    {% block sw_flow_sequence_selector_help_text %}
    <div class="sw-flow-sequence-selector__help-text">
        <slot name="helpText">
            <p v-html="helpText"></p>
        </slot>
    </div>
    {% endblock %}

    <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
    {% block sw_flow_sequence_selector_actions %}
    <div class="sw-flow-sequence-selector__actions">
        <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
        {% block sw_flow_sequence_selector_if_condition %}
        <sw-button
            class="sw-flow-sequence-selector__add-condition"
            :disabled="disabled"
            @click="addIfCondition"
        >

            <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
            {% block sw_flow_sequence_selector_then_action_icon_rule %}
            <sw-icon
                size="16"
                name="regular-rule-s"
            />
            {% endblock %}

            {{ $tc('sw-flow.detail.sequence.selectorIfCondition') }}
        </sw-button>
        {% endblock %}

        <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
        {% block sw_flow_sequence_selector_then_action %}
        <sw-button
            class="sw-flow-sequence-selector__add-action"
            :disabled="disabled"
            @click="addThenAction"
        >

            <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
            {% block sw_flow_sequence_selector_then_action_icon_file %}
            <sw-icon
                size="16"
                name="regular-file-edit-s"
            />
            {% endblock %}

            {{ $tc('sw-flow.detail.sequence.selectorThenAction') }}
        </sw-button>
        {% endblock %}

        <!-- eslint-disable-next-line sw-deprecation-rules/no-twigjs-blocks -->
        {% block sw_flow_sequence_selector_extension_options %}{% endblock %}
    </div>
    {% endblock %}
</div>
{% endblock %}
