2D: Inline-Text-Editor-Nachbesserung (unsichtbarer Anker) + Textspalte als echtes Rechteck
Nutzer-Report nach der Umstellung auf Inline-Editing: beides funktionierte nicht — "Text" liess sich kein Ankerpunkt setzen, "Textspalte" sollte ein Rechteck statt nur eine Breite sein. Root Cause für "Text": `.planview-inline-text` bekam ohne Spaltenbreite `width: undefined` — bei position:fixed ohne rechten Rand greift shrink-to- fit-Sizing, das für ein LEERES contentEditable auf ~0px kollabiert. Der Klick erzeugte tatsächlich ein Element + öffnete den Editor, beides war nur unsichtbar (eine 0px-Box lässt sich nicht anklicken/fokussieren). Fix: neue Klasse .planview-inline-text-free (kein wrapWidth) erzwingt `width: max-content` + `white-space: pre` auf Editor/Surface (Box wächst mit dem Inhalt statt umzubrechen — "Text" bleibt einzeilig bis Enter, wie gewünscht) plus eine CSS-Mindestbreite (160px) für den leeren Startzustand. "Textspalte" (textbox.ts) zeichnet jetzt ein RECHTECK (zwei diagonale Ecken, beliebige Zugrichtung) statt nur eine horizontale Breitenlinie — die aufgezogene Höhe wird nicht im Modell gespeichert (das Textformat kennt nur `width` für den Wortumbruch, keine feste Rahmenhöhe), sondern als Editor-MINDESThöhe durchgereicht: CommandResult/EngineHost.focusDrawing um `focusMinHeightM` erweitert (Passthrough wie focusDrawingId), App.tsx hält sie in einem neuen editTextMinHeightM-State (useContextMenuState.ts), PlanView nutzt sie als CSS-min-height des Editors — der Rahmen wächst bei mehr Text darüber hinaus, schrumpft aber nicht darunter (InDesign-Verhalten). Beim Doppelklick-Editieren bestehender Elemente wird die Mindesthöhe zurückgesetzt (kein Nachwirken einer vorigen Textspalten-Erstellung). textbox.test.ts an die neue Rechteck-Geste angepasst (+ Test für beliebige Zugrichtung). tsc -b / vitest run (919/919) / npm run build grün. Die eigentliche Sichtbarkeits-Vermutung (CSS-Kollaps) konnte ich nicht interaktiv im Browser verifizieren (kein Browser-Tool verfügbar) — Nutzer prüft erneut in der laufenden App.
This commit is contained in:
+22
-2
@@ -313,6 +313,12 @@ export interface PlanViewProps {
|
||||
* Ausschnitt.
|
||||
*/
|
||||
editTextId?: string | null;
|
||||
/**
|
||||
* Mindesthöhe (Meter) des Inline-Editors, wenn `editTextId` aus einem
|
||||
* frisch aufgezogenen Textspalten-RAHMEN kommt (s. textbox.ts). `null`/
|
||||
* undefined = keine Mindesthöhe, der Inhalt bestimmt die Höhe allein.
|
||||
*/
|
||||
editTextMinHeightM?: number | null;
|
||||
/** Jede Änderung im Inline-Text-Editor (live, pro Tastendruck). */
|
||||
onCommitTextEdit?: (doc: RichTextDoc) => void;
|
||||
/** Inline-Text-Editor schliessen (Backdrop-Klick/Escape). */
|
||||
@@ -445,6 +451,7 @@ export const PlanView = forwardRef<PlanViewHandle, PlanViewProps>(
|
||||
onStampEdit,
|
||||
onEditDrawingText,
|
||||
editTextId,
|
||||
editTextMinHeightM,
|
||||
onCommitTextEdit,
|
||||
onCloseTextEdit,
|
||||
onOpenSectionLevel,
|
||||
@@ -2494,7 +2501,18 @@ export const PlanView = forwardRef<PlanViewHandle, PlanViewProps>(
|
||||
const screen = vbToClient(topAnchor.x, topAnchor.y);
|
||||
const FONT_PX_AT_12PT = 16; // 12pt @ 96dpi (RichTextEditor-Default, s. LayoutSheet.tsx).
|
||||
const scale = (prim.heightM * pxPerM) / FONT_PX_AT_12PT;
|
||||
const widthPx = prim.wrapWidth ? (prim.wrapWidth * pxPerM) / scale : undefined;
|
||||
// MIT wrapWidth (Textspalte): feste Breite, Editor bricht live um (nowrap
|
||||
// AUS). OHNE (Text-Werkzeug): keine feste Breite — `.planview-inline-text
|
||||
// .rt-surface` steht auf nowrap (s. styles.css), die Box wächst mit jedem
|
||||
// Zeichen; eine Mindestbreite verhindert eine unsichtbare 0px-Box beim
|
||||
// leeren Start (der eigentliche Grund, warum der Anker bisher unsichtbar
|
||||
// blieb — `width:undefined` kollabierte auf shrink-to-fit von NICHTS).
|
||||
const hasWrap = !!prim.wrapWidth;
|
||||
const widthPx = hasWrap ? (prim.wrapWidth! * pxPerM) / scale : undefined;
|
||||
const minWidthPx = hasWrap ? undefined : 160;
|
||||
// Aufgezogener Textspalten-Rahmen (textbox.ts): dessen Höhe als
|
||||
// Mindesthöhe des Editors — wächst bei mehr Text darüber hinaus.
|
||||
const minHeightPx = editTextMinHeightM ? (editTextMinHeightM * pxPerM) / scale : undefined;
|
||||
return (
|
||||
<>
|
||||
<div
|
||||
@@ -2502,11 +2520,13 @@ export const PlanView = forwardRef<PlanViewHandle, PlanViewProps>(
|
||||
onPointerDown={() => onCloseTextEdit?.()}
|
||||
/>
|
||||
<div
|
||||
className="planview-inline-text"
|
||||
className={"planview-inline-text" + (hasWrap ? "" : " planview-inline-text-free")}
|
||||
style={{
|
||||
left: screen.x,
|
||||
top: screen.y,
|
||||
width: widthPx,
|
||||
minWidth: minWidthPx,
|
||||
minHeight: minHeightPx,
|
||||
transform: `scale(${scale})`,
|
||||
transformOrigin: "0 0",
|
||||
}}
|
||||
|
||||
Reference in New Issue
Block a user