{% if data.isTracked %}
    <div class="badge {{ data.onHand > 0 ? 'text-bg-success' : 'text-bg-danger' }}  d-flex w-fit-content">
        {{ ux_icon('tabler:cube', {'class': 'icon mr-1'}) }}
        <div class="text-start">
            <span>{{ data.onHand }}</span> {{ 'sylius.ui.available_on_hand'|trans }}
            {% if data.onHold > 0 %}
                <br>
                <span class="onHold" data-product-variant-id="{{ data.id }}">{{ data.onHold }}</span> {{ 'sylius.ui.reserved'|trans }}
            {% endif %}
        </div>
    </div>
{% else %}
    <span class="ui red label">
        <i class="remove icon"></i>
        {{ 'sylius.ui.not_tracked'|trans }}
    </span>
{% endif %}