Enhancement: Drag-and-Drop fuer Formular-Editor #132

New issue

Open

opened 2026-06-28 10:09:49 +02:00 by niboer · 0 comments

niboer commented

2026-06-28 10:09:49 +02:00

Owner

Beschreibung

Der Formular-Editor in MS-FE-4 (#104) verwendet derzeit Up/Down-Buttons zum Umordnen von Formular-Feldern. Fuer eine bessere User Experience soll ein Drag-and-Drop-Mechanismus implementiert werden.

Akzeptanzkriterien

Formular-Felder koennen per Drag-and-Drop umsortiert werden
Visuelles Feedback waehrend des Drag-Vorgangs (Hover-Effekt, Platzhalter)
Touch-Unterstuetzung fuer mobile Geraete
Barrierefrei: Alternativ per Tastatur (Tab + Pfeiltasten)
Keine neuen Abhaengigkeiten (oder nur leichtgewichtige, gut gewartete Bibliothek)

Technische Hinweise

Der Editor ist als FormEditor.svelte in $lib/components/ implementiert
shadcn-svelte bietet keine DnD-Komponente
Moegliche Ansaetze: nativer HTML5 DnD API, oder Leichtgewicht-Bibliothek wie @neodrag/svelte oder sortablejs + Svelte-Wrapper
Die Implementierung muss mit Svelte 5 (Runes: $state, $derived) kompatibel sein

Priorisierung

Niedrige Prioritaet — kann nach MS-REST-Kernfunktionen umgesetzt werden.

## Beschreibung Der Formular-Editor in MS-FE-4 (#104) verwendet derzeit Up/Down-Buttons zum Umordnen von Formular-Feldern. Fuer eine bessere User Experience soll ein Drag-and-Drop-Mechanismus implementiert werden. ## Akzeptanzkriterien - Formular-Felder koennen per Drag-and-Drop umsortiert werden - Visuelles Feedback waehrend des Drag-Vorgangs (Hover-Effekt, Platzhalter) - Touch-Unterstuetzung fuer mobile Geraete - Barrierefrei: Alternativ per Tastatur (Tab + Pfeiltasten) - Keine neuen Abhaengigkeiten (oder nur leichtgewichtige, gut gewartete Bibliothek) ## Technische Hinweise - Der Editor ist als `FormEditor.svelte` in `$lib/components/` implementiert - shadcn-svelte bietet keine DnD-Komponente - Moegliche Ansaetze: nativer HTML5 DnD API, oder Leichtgewicht-Bibliothek wie `@neodrag/svelte` oder `sortablejs` + Svelte-Wrapper - Die Implementierung muss mit Svelte 5 (Runes: $state, $derived) kompatibel sein ## Priorisierung Niedrige Prioritaet — kann nach MS-REST-Kernfunktionen umgesetzt werden.

niboer added this to the MS-REST: Restliche Aufgaben milestone

2026-06-28 10:09:49 +02:00

niboer added the

component/frontend

prio/low

type/refactor

labels

2026-06-28 10:09:57 +02:00

niboer referenced this issue

2026-06-28 10:10:03 +02:00

MS-FE-4: Formular UI umsetzen #104

niboer referenced this issue