[ENG-35793] feat: new dropdown component, improvement dropdown lazy loading

[pauloSF0]

Pull Request

What is the new behavior introduced by this PR?

Linhas de código

• fieldDropdownLazyLoader.vue: 627 linhas
• fieldDropdownLazyLoaderDinaminc.vue: 427 linhas
• PaginatedDropdown.vue (novo): 285 linhas
• PaginatedDropdown + utils.js (novo módulo): 285 + 97 = 382 linhas

Redução de tamanho

• Vs. fieldDropdownLazyLoader.vue:
  • Apenas .vue: −342 linhas (~54.6% menor)
  • .vue + utils: −245 linhas (~39.1% menor)
• Vs. fieldDropdownLazyLoaderDinaminc.vue:
  • Apenas .vue: −142 linhas (~33.3% menor)
  • .vue + utils: −45 linhas (~10.5% menor)

Alertas/Warnings no console

• Removido qualquer console.log/debug.
• Sem warnings de filtro local/estado duplicado: busca é 100% remota e debounced.
• Sem injeção indevida em busca: item selecionado não aparece na lista se o backend não retornar.
• Sem observer manual: VirtualScroller do PrimeVue cuida do lazy-load.

Responsabilidades e clareza

• Separação de helpers puros:
  • buildListParams, markEndOfData, isEndOfList, addUniqueItems, createSelectPayload em utils.js.
• APIs explícitas e previsíveis:
  • listService({ page, pageSize, search, ordering }) → { body, count }.
  • getByIdService({ id }).
  • moreOptions controla o shape do onSelectOption.
• Legibilidade:
  • Helpers reutilizáveis (deriveId, findOptionById, getSelectedOption).
  • Comentários JSDoc nas funções principais.
  • Atualização imutável de options.

Performance e UX

• Prefetch on mount: elimina requisição ao abrir o dropdown.
• Scroll infinito confiável:
  • Uma página por vez.
  • noMore para parar quando < pageSize ou atingiu total.
• Busca remota debounced:
  • Threshold configurado (>=3 ou limpar).
  • Sem filtragem local.
• Sem over-fetch:
  • Guarda contra concorrência (isLoading/isAppending).
  • Evita injeção de selecionado durante busca.
• Selecionado fora da primeira página:
  • getByIdService coloca no topo (prepend) apenas no estado base (sem busca).

Funcionalidades mantidas/melhoradas

• Slots compatíveis:
  • #header com InputText.
  • #value e #option (ícone + label).
  • #footer para ações (ex.: “criar”).
• Acessibilidade/Rotulagem:
  • LabelBlock com label/name.
  • appendTo="self" estável.

Conclusão

• Código significativamente menor e mais fácil de manter.
• Sem warnings no console.
• Fluxo de dados previsível, com melhor UX (sem atrasos na abertura).
• Pronto para reaproveitamento com helpers puros e documentação atualizada.

Does this PR introduce breaking changes?

• No
• Yes

Does this PR introduce UI changes? Add a video or screenshots here.

Does it have a link on Figma?

---

Checklist

Make sure your pull request fits the checklist below (when applicable):

• The issue title follows the format: [ISSUE_CODE] TYPE: TITLE
• Commits are tagged with the right word (feat, test, refactor, etc)
• Application responsiveness was tested to different screen sizes
• Code is formatted and linted
• Tags are added to the PR

These changes were tested on the following browsers:

• Chrome
• Edge
• Firefox
• Safari
• Brave

[robsongajunior]

Esse Pull Request é perante criação do componente, a migração dele será atuado em outra task.