Fassung 1.5.0: die Vorschau wird zur Arbeitsflaeche

Abgleich mit dem Flatsome UX Builder (docs/FLATSOME-ABGLEICH.md): die Gestaltung
ist Flatsome voraus, die Luecken liegen beim Elementkatalog und bei der
Bedienung. Umuts Entscheidung: Bedienung zuerst, Shop-Elemente ausgelassen.

Erste Haelfte der Bedienung:

- Werkzeugleiste am Element in der Vorschau. Sie nennt das Element, auf das sie
  wirkt - die Seitenleiste hat dieselben fuenf Aktionen, und zwei gleichnamige
  Bedienelemente auf einem Bildschirm sind fuer eine Sprachausgabe nicht
  unterscheidbar. Beide Wege rufen dieselben Funktionen auf.
- Auswahl- und Ueberfahrrahmen mit Beschriftung.
- Einfuegepunkte an Ober- und Unterkante: das naechste Element landet dort
  statt am Ende.
- Ziehen aus dem Werkzeugkasten in die Vorschau, mit Ablegemarke zwischen den
  Elementen und Rahmen um einen aufnehmenden Behaelter. Der Strukturbaum zieht
  in dieselbe Flaeche.

Die Ebene liegt ueber dem Rahmen, nicht darin: die Vorschau wird bei jeder
Aenderung ersetzt, eingezeichnete Bedienelemente waeren weg und stuenden in der
Auszeichnung, die die Vorschau wahrheitsgetreu zeigen soll. Leiste und
Pluszeichen werden gegenskaliert und bleiben in der Mobilvorschau fingergross.

Im Modell neu: insertBlockAt, moveBlockTo, dropList.

Dabei behoben: die Ebene war aria-hidden und enthielt fokussierbare
Schaltflaechen; canContain zerbrach an einem fehlenden Block beim Ziehen aus
dem Werkzeugkasten; beim Verschieben ans Listenende wurde der Index begrenzt,
bevor die Entnahme verrechnet war.

Geprueft: npm test 22/22, phpunit 434/434, npm run test:editor vollstaendig
mit neuem Abschnitt und ohne axe-Verstoss.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

public/assets/editor-model.js

@@ -10,10 +10,13 @@ export const isContainer = block => ['section', 'row', 'column', 'gallery', 'log
 // Nothing may be dropped into a plugin block: the core does not know its layout contract.
 // Containers that accept only one kind of child, mirrored by the server side validator.
 export const ONLY_CHILD = { gallery: 'image', logos: 'image', accordion: 'accordionitem', tabs: 'tabitem' };
+/** Types DocumentValidator refuses outside their group: an entry without its accordion, a tab
+    without its tab group. An image is not one of them - it stands on its own anywhere. */
+export const NEEDS_GROUP = ['accordionitem', 'tabitem'];
 export const canContain = (parent, block) => isContainer(parent) && !isPluginBlock(parent)
-  && (ONLY_CHILD[parent.type] === undefined || ONLY_CHILD[parent.type] === block.type)
-  && (block.type !== 'accordionitem' || parent.type === 'accordion')
-  && (block.type !== 'tabitem' || parent.type === 'tabs');
+  && (ONLY_CHILD[parent.type] === undefined || ONLY_CHILD[parent.type] === block?.type)
+  && (block?.type !== 'accordionitem' || parent.type === 'accordion')
+  && (block?.type !== 'tabitem' || parent.type === 'tabs');
 export const clone = value => structuredClone(value);
 
 export function locate(blocks, id, parent = null) {
@@ -59,8 +62,8 @@ export function createBlock(type) {
   return block;
 }
 
-export function insertBlock(document, type, selected) {
-  const block = createBlock(type);
+/** Raises the document schema to the version that knows this block type. */
+export function upgradeForType(document, type) {
   if (type === 'gallery') upgradeDocument(document, 3);
   if (type === 'postlist') upgradeDocument(document, 5);
   if (type === 'postnav') upgradeDocument(document, 18);
@@ -72,6 +75,11 @@ export function insertBlock(document, type, selected) {
   if (type === 'menu' || type === 'partialref') upgradeDocument(document, 11);
   if (type === 'embed') upgradeDocument(document, 14);
   if (['icon', 'progress', 'slider'].includes(type)) upgradeDocument(document, 15);
+}
+
+export function insertBlock(document, type, selected) {
+  const block = createBlock(type);
+  upgradeForType(document, type);
   let target = locate(document.blocks, selected);
   if (target?.block.type === 'gallery' && type !== 'image') { target.siblings.splice(target.index + 1, 0, block); return block.id; }
   if (target?.parent?.type === 'gallery' && type !== 'image') target = locate(document.blocks, target.parent.id);
@@ -109,6 +117,55 @@ export function moveBlock(document, selected, targetId, inside = false) {
   return true;
 }
 
+/**
+ * Where a block may land. `parentId` of null means the top level. Returns the list that would
+ * hold the block, or null when the parent refuses this kind of child - a gallery takes images
+ * and nothing else, an accordion takes entries.
+ */
+export function dropList(document, parentId, block) {
+  // The top level mirrors DocumentValidator: everything is allowed there except the two types
+  // that only ever exist inside their group. Being stricter here than the validator would make
+  // dragging refuse what the buttons happily insert.
+  if (parentId === null) return NEEDS_GROUP.includes(block?.type) ? null : document.blocks;
+  const parent = locate(document.blocks, parentId)?.block;
+  return parent && canContain(parent, block) ? (parent.children ??= []) : null;
+}
+
+/** Inserts a new block at an exact position instead of behind the selection. */
+export function insertBlockAt(document, type, parentId, index) {
+  const block = createBlock(type);
+  upgradeForType(document, type);
+  const list = dropList(document, parentId, block);
+  if (!list) return null;
+  list.splice(Math.max(0, Math.min(index, list.length)), 0, block);
+  return block.id;
+}
+
+/**
+ * Moves an existing block to an exact position. Unlike moveBlock this keeps the index, so a
+ * block dragged between two others lands between them and not at the end of the container.
+ */
+export function moveBlockTo(document, selected, parentId, index) {
+  const source = locate(document.blocks, selected);
+  if (!source) return false;
+  // Dropping a container into itself or into its own child would detach the branch.
+  if (parentId === selected || (parentId !== null && locate(source.block.children || [], parentId))) return false;
+  if (!dropList(document, parentId, source.block)) return false;
+  const from = source.siblings, fromIndex = source.index;
+  from.splice(fromIndex, 1);
+  // Re-read: removing the block may have shifted the target list or emptied a parent.
+  const list = dropList(document, parentId, source.block);
+  if (!list) { from.splice(fromIndex, 0, source.block); return false; }
+  // The index still counts in the list as it was before the block was taken out, so the shift
+  // has to be settled first and only then clamped - the other way round an index pointing past
+  // the end is clamped to the old length and then pulled one step too far forward.
+  let at = index;
+  if (list === from && fromIndex < index) at -= 1;
+  at = Math.max(0, Math.min(at, list.length));
+  list.splice(at, 0, source.block);
+  return true;
+}
+
 export const devices = { desktop: 'Desktop', tablet: 'Tablet', mobile: 'Mobil' };
 
 // Called only inside a history transaction: all other fields and IDs stay untouched.