@volter/editor-core 0.5.57

package/src/components/RootTextEditor.tsx

@@ -0,0 +1,79 @@
+/**
+ * RootTextEditor — spec 27 §6 D3.b double-click-to-edit-text: an inline canonical
+ * multiline text control positioned over the double-clicked node's rect. Escape cancels;
+ * Enter (no shift) or blur commits. Purely a controlled presentational component —
+ * `RootSelectionOverlay` decides WHETHER to render this (via `adapter.text`/`textForId`,
+ * rule zero) and supplies the initial text + the commit/cancel callbacks; this file has
+ * no adapter/DOM reach of its own.
+ */
+
+import { TextArea, zIndex } from '@volter/editor-sdk/widgets';
+import { useEffect, useRef, useState } from 'react';
+
+export interface RootTextEditorProps {
+  rect: { x: number; y: number; width: number; height: number };
+  initialText: string;
+  onCommit: (text: string) => void;
+  onCancel: () => void;
+}
+
+export function RootTextEditor({
+  rect,
+  initialText,
+  onCommit,
+  onCancel,
+}: RootTextEditorProps): React.ReactNode {
+  const [value, setValue] = useState(initialText);
+  const ref = useRef<HTMLTextAreaElement>(null);
+  const committedRef = useRef(false);
+
+  useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    el.focus();
+    el.select();
+  }, []);
+
+  const commit = (): void => {
+    if (committedRef.current) return;
+    committedRef.current = true;
+    onCommit(value);
+  };
+
+  const cancel = (): void => {
+    if (committedRef.current) return;
+    committedRef.current = true;
+    onCancel();
+  };
+
+  return (
+    <TextArea
+      ref={ref}
+      data-testid="world-text-editor"
+      value={value}
+      onChange={(e) => setValue(e.target.value)}
+      onBlur={commit}
+      onKeyDown={(e) => {
+        if (e.key === 'Escape') {
+          e.stopPropagation();
+          cancel();
+        } else if (e.key === 'Enter' && !e.shiftKey) {
+          e.preventDefault();
+          commit();
+        }
+      }}
+      data-variant="inline-editor"
+      style={{
+        position: 'absolute',
+        left: rect.x,
+        top: rect.y,
+        width: Math.max(rect.width, 40),
+        height: Math.max(rect.height, 20),
+        boxSizing: 'border-box',
+        zIndex: zIndex.overlayLow,
+        pointerEvents: 'auto',
+        resize: 'none',
+      }}
+    />
+  );
+}

package/src/components/SaveStatus.tsx

@@ -0,0 +1,70 @@
+import { Button } from '@volter/editor-sdk/widgets';
+import { useSyncExternalStore } from 'react';
+import {
+  activeSaveDestination,
+  activeSaveFailure,
+  activeSaveState,
+  saveActiveAuthoring,
+} from '../authoring/shell-document-ops';
+import { useEditorStore, useOptionalHistoryService } from '../editor-runtime';
+import { showConsoleUtility } from '../workspace-utility-commands';
+
+const subscribeToNothing = () => () => undefined;
+const noHistorySnapshot = () => null;
+
+/**
+ * Compact save-status affordance for the status bar. Surfaces whether the
+ * ACTIVE authoring adapter has unsaved edits. Click to force a save (also bound
+ * to Cmd/Ctrl+S).
+ */
+export function SaveStatus() {
+  const store = useEditorStore();
+  const history = useOptionalHistoryService();
+  useSyncExternalStore(store.subscribe, store.getShellSnapshot ?? store.getSnapshot);
+  // Source writes clear HistoryService.lastError only after the async commit
+  // succeeds. Subscribe directly so the red failure state clears at that
+  // exact point rather than waiting for an unrelated store/HMR notification.
+  useSyncExternalStore(
+    history?.subscribe ?? subscribeToNothing,
+    history?.getSnapshot ?? noHistorySnapshot,
+    history?.getSnapshot ?? noHistorySnapshot,
+  );
+  const state = activeSaveState(store);
+  // Success is the steady state, not an alert. Keep the status bar quiet
+  // until there is unsaved work or a failure requiring attention.
+  if (state === 'saved') return null;
+  // Destination is the active adapter's own — never a hard-coded path — so
+  // the status honestly reflects where a save (or autosave) would actually go.
+  const destination = activeSaveDestination(store);
+
+  const failed = state === 'failed';
+  const failure = failed ? activeSaveFailure(store) : null;
+  const config = failed
+    ? {
+        label: 'Save failed',
+        title: failure
+          ? `Save failed: ${failure} — click to open Console`
+          : 'Save failed — click to open Console',
+      }
+    : {
+        label: 'Unsaved',
+        title: 'Unsaved changes — click to save (Cmd/Ctrl+S)',
+      };
+  const title = destination ? `${config.title} — ${destination}` : config.title;
+
+  return (
+    <Button
+      type="button"
+      data-testid="save-status"
+      data-save-state={state}
+      variant="ghost"
+      size="compact"
+      className="vgai-save-status"
+      onClick={() => (failed ? showConsoleUtility() : void saveActiveAuthoring(store))}
+      title={title}
+    >
+      <span className="vgai-save-status-dot" />
+      {config.label}
+    </Button>
+  );
+}