{#
    This Twig template include load vue_address component.
    It push all variables from context in Address/App.vue.

    OPTIONS
    * targetEntity  {
          name:     string
          id:       integer
      }
    * mode          string ['edit*'|'new']
    * addressId     integer
    * backUrl       twig route:   path('route', {parameters})
    * modalTitle    twig translated chain
    * buttonText    twig translated chain
    * buttonSize    bootstrap class like 'btn-sm'
    * buttonDisplayText     bool (default: true)
    * openPanesInModal      bool (default: true)
    * stickyActions         bool (default: false)
    * useValidFrom          bool (default: false)
    * useValidTo            bool (default: false)
    * onlyButton           bool (default: false)
#}
<div class="address-container"

     data-target-name="{{ targetEntity.name|e('html_attr') }}"
     data-target-id="{{ targetEntity.id|e('html_attr') }}"

    {% if 'edit' in app.request.get('_route') %}
        data-mode="edit"
        data-address-id="{{ app.request.get('address_id')|e('html_attr') }}"
    {% elseif mode is defined and mode == 'edit' %}
        data-mode="edit"
        data-address-id="{{ addressId|e('html_attr') }}"
    {% endif %}

    {% if backUrl is defined %}
        data-back-url="{{ backUrl|e('html_attr') }}"
    {% endif %}

    {% if modalTitle is defined %}
        data-modal-title="{{ modalTitle|trans|e('html_attr') }}"
    {% endif %}

    {% if buttonText is defined %}
        data-button-text="{{ buttonText|trans|e('html_attr') }}"
    {% endif %}

    {% if buttonSize is defined %}
        data-button-size="{{ buttonSize|e('html_attr') }}"
    {% endif %}

    {% if buttonDisplayText is defined and buttonDisplayText != 1 %}
        data-button-display-text="false"
    {% endif %}

    {% if openPanesInModal is defined and openPanesInModal != 1 %}
        data-open-panes-in-modal="false"
    {% endif %}

    {% if stickyActions is defined and stickyActions == 1 %}
        data-sticky-actions="true"
    {% endif %}

    {% if useValidFrom is defined and useValidFrom == 1 %}
        data-use-valid-from="true"
    {% endif %}

    {% if useValidTo is defined and useValidTo == 1 %}
        data-use-valid-to="true"
    {% endif %}

    {% if onlyButton is defined and onlyButton == 1 %}
        data-hide-address="true"
    {% endif %}

    data-address-defaults="{{ add_address|json_encode|e('html') }}"
></div>

{{ encore_entry_script_tags('vue_address') }}
{{ encore_entry_link_tags('vue_address') }}
