<form class="favourite-add-form" @submit.prevent="save">
    <div class="form-group">
        <label for="favourite_add_name">Nazwa</label>
        <div class="input-group">
            <input class="form-control form-control-sm" placeholder="np. Z pracy"
                   :class="{ 'is-invalid': errors.name.length > 0 }" id="favourite_add_name"
                   v-model="name" v-autofocus/>
            <div v-if="errors.name.length > 0" class="invalid-feedback">
                <p v-for="error in errors.name">{{ error }}</p>
            </div>
        </div>
    </div>
    <ul class="favourite__stops">
        <li class="favourite__stop" v-for="stop in stops" :key="stop.id">
            <stop :stop="stop"/>
        </li>
    </ul>
    <div class="favourite-add-form__actions">
        <template v-if="confirmation">
            <button class="btn btn-xs btn-danger" type="submit">
                nadpisz
            </button>
            <button class="btn btn-xs btn-action" @click="$emit('close')">
                anuluj
            </button>
        </template>
        <template v-else>
            <button class="btn btn-xs btn-primary" type="submit">
                <ui-icon icon="add" />
                zapisz
            </button>
        </template>
    </div>
</form>
