Dúvida - Teria outra forma de fazer?

Olá! Sim, é possível utilizar JavaScript para adicionar ou remover classes sem mexer diretamente no HTML. Nesse caso, você pode usar a propriedade classList dos elementos HTML para adicionar ou remover classes dinamicamente. Aqui está um exemplo de como você pode fazer isso no trecho de código que você forneceu:

} else {
    const li = document.createElement('li');
    li.classList.add('item-compra', 'is-flex', 'is-justify-content-space-between');
    li.setAttribute('data-value', index);

    const div1 = document.createElement('div');

    const checkbox = document.createElement('input');
    checkbox.setAttribute('type', 'checkbox');
    checkbox.classList.add('is-clickable');
    div1.appendChild(checkbox);

    const inputText = document.createElement('input');
    inputText.setAttribute('type', 'text');
    inputText.setAttribute('class', 'is-size-5');
    inputText.setAttribute('value', elemento.valor);
    
    // Adiciona a classe 'disabled' ao inputText se index for diferente de itemAEditar
    if (index != itemAEditar) {
        inputText.setAttribute('disabled', '');
    }

    div1.appendChild(inputText);
    li.appendChild(div1);

    const div2 = document.createElement('div');

    // Adiciona o botão de salvar edição apenas se index for igual a itemAEditar
    if (index == itemAEditar) {
        const saveButton = document.createElement('button');
        saveButton.setAttribute('onclick', 'salvarEdicao()');
        saveButton.innerHTML = '<i class="fa-regular fa-floppy-disk is-clickable"></i>';
        div2.appendChild(saveButton);
    } else {
        const editIcon = document.createElement('i');
        editIcon.setAttribute('class', 'fa-regular is-clickable fa-pen-to-square editar');
        div2.appendChild(editIcon);
    }

    const deleteIcon = document.createElement('i');
    deleteIcon.setAttribute('class', 'fa-solid fa-trash is-clickable deletar');
    div2.appendChild(deleteIcon);

    li.appendChild(div2);

    ulItens.appendChild(li);
}

Este código cria elementos HTML dinamicamente em vez de usar a string de template, e adiciona ou remove classes e atributos com base nas condições. Isso permite maior flexibilidade e controle sobre a manipulação do DOM.