@ceedcv-maya/shared-editor-react 0.6.0 → 0.7.0

package/README.md

@@ -4,7 +4,7 @@ Unified TipTap editor for the Maya ecosystem.
 
 ## Components
 
-- **`<MayaEditor mode="lite" | "full" />`** — single editor with two visual modes. `lite` for short comments and alerts; `full` for templates and documents (BlockNote parity).
+- **`<MayaEditor mode="lite" | "full" />`** — single editor with two visual modes. `lite` for short comments and alerts; `full` for templates and documents.
 - **`<EditorContentHtml html />`** — read-only renderer with DOMPurify sanitisation (aligned with the server-side `TiptapHtmlRenderer`).
 - **`<EditorToolbar />`** — toolbar builder, used internally by `MayaEditor` and exposed for custom integrations.
 
@@ -14,10 +14,6 @@ Unified TipTap editor for the Maya ecosystem.
 - `AlertBlock` — variants info / warning / success / danger.
 - `CommentMark` — anchored-comment mark (paired with `AnchoredCommentController` server-side).
 
-## Conversion
-
-- `convertBlockNoteToTiptap(blocks)` — legacy → ProseMirror conversion. Mirror of the PHP `Maya\Editor\Renderers\BlockNoteToTiptap`.
-
 ## Document import & block splitting
 
 Helpers behind the "Import from Word → blocks" flow (`DocxBlockSplitter` in maya_dms):

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ceedcv-maya/shared-editor-react",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "type": "module",
   "main": "src/index.ts",
   "types": "src/index.ts",
@@ -57,12 +57,11 @@
   "publishConfig": {
     "access": "public"
   },
-  "description": "Unified rich-text editor for Maya: MayaEditor (TipTap) with lite/full modes, BlockNote→TipTap converter, HTML SSR renderer, anchored-comments support.",
+  "description": "Unified rich-text editor for Maya: MayaEditor (TipTap) with lite/full modes, HTML SSR renderer, anchored-comments support.",
   "keywords": [
     "react",
     "tiptap",
     "prosemirror",
-    "blocknote",
     "editor",
     "wysiwyg",
     "ceedcv",

package/src/components/EditorToolbar.tsx

@@ -198,7 +198,8 @@ export function EditorToolbar({
           <ListAndBlockButtons editor={editor} labels={L} />
           <TableAndMediaButtons editor={editor} labels={L} onImage={onImage} />
 
-          <span className="maya-editor-toolbar__sep" aria-hidden />
+
+          <div className="flex items-end gap-0.5 shrink-0 pl-1 border-l border-ui-border dark:border-ui-dark-border ml-auto">
           <DocumentButtons
             editor={editor}
             labels={L}
@@ -218,6 +219,7 @@ export function EditorToolbar({
             onInsertMarkdown={onInsertMarkdown}
             onToggleFullscreen={onToggleFullscreen}
           />
+          </div>
         </>
       )}
     </div>

package/src/components/EditorToolbarGroups.tsx

@@ -388,13 +388,14 @@ export function ViewModeButtons({
           <span style={{ fontFamily: 'ui-monospace, monospace', fontSize: 11 }}>{'<>'}</span>
         </Btn>
       )}
+      <span className="maya-editor-toolbar__sep" aria-hidden />
       {onToggleFullscreen && (
-        <Btn
-          onClick={onToggleFullscreen}
-          title={isFullscreen ? L.exitFullscreen : L.fullscreen}
-        >
-          {isFullscreen ? '⤓' : '⛶'}
-        </Btn>
+          <Btn
+            onClick={onToggleFullscreen}
+            title={isFullscreen ? L.exitFullscreen : L.fullscreen}
+          >
+            {isFullscreen ? '🗗' : '🗖'}
+          </Btn>
       )}
     </>
   );

package/src/index.ts

@@ -12,7 +12,6 @@ export { Indent } from './extensions/Indent';
 export type { IndentOptions } from './extensions/Indent';
 export { ColorPicker } from './components/ColorPicker';
 
-export { convertBlockNoteToTiptap } from './serializers/BlockNoteToTiptap';
 export { useEditorContent } from './hooks/useEditorContent';
 export { getAnchorRange, setAnchorRange, rebaseAnchors } from './lib/CommentAnchor';
 export type { AnchorRange } from './lib/CommentAnchor';
@@ -38,9 +37,6 @@ export type {
   TiptapNode,
   TiptapDoc,
   AnchoredComment,
-  BlockNoteBlock,
-  BlockNoteInline,
-  BlockNoteStyles,
 } from './types';
 
 export { default as esTranslations } from './i18n/es.json';

package/src/types.ts

@@ -29,28 +29,3 @@ export interface AnchoredComment {
   anchorIsValid: boolean;
   anchorLastSyncedAt: string | null;
 }
-
-export interface BlockNoteStyles {
-  bold?: boolean;
-  italic?: boolean;
-  underline?: boolean;
-  strike?: boolean;
-  code?: boolean;
-  textColor?: string;
-  backgroundColor?: string;
-}
-
-export interface BlockNoteInline {
-  type: string;
-  text?: string;
-  styles?: BlockNoteStyles;
-  href?: string;
-  content?: BlockNoteInline[];
-}
-
-export interface BlockNoteBlock {
-  type: string;
-  props?: Record<string, unknown>;
-  content?: BlockNoteInline[] | { rows?: Array<{ cells: unknown[] }> };
-  children?: BlockNoteBlock[];
-}

package/src/serializers/BlockNoteToTiptap.ts

@@ -1,223 +0,0 @@
-/**
- * JS mirror of Maya\Editor\Renderers\BlockNoteToTiptap (PHP).
- *
- * Same input/output as the PHP version — used for round-trip oracle tests
- * (BlockNote → Tiptap → HTML via both renderers must produce identical
- * output) and at-runtime when the frontend reads legacy `content` columns
- * during the migration window.
- */
-import type {
-  BlockNoteBlock,
-  BlockNoteInline,
-  BlockNoteStyles,
-  TiptapDoc,
-  TiptapMark,
-  TiptapNode,
-} from '../types';
-
-type ListBlockType = 'bulletListItem' | 'numberedListItem' | 'checkListItem';
-
-const LIST_TO_LIST_NODE: Record<ListBlockType, 'bulletList' | 'orderedList' | 'taskList'> = {
-  bulletListItem: 'bulletList',
-  numberedListItem: 'orderedList',
-  checkListItem: 'taskList',
-};
-
-export function convertBlockNoteToTiptap(blocks: BlockNoteBlock[]): TiptapDoc {
-  const content: TiptapNode[] = [];
-  let i = 0;
-  const n = blocks.length;
-  while (i < n) {
-    const block = blocks[i];
-    if (!block || typeof block !== 'object') {
-      i++;
-      continue;
-    }
-    const type = String(block.type ?? 'paragraph');
-
-    if (type === 'bulletListItem' || type === 'numberedListItem' || type === 'checkListItem') {
-      const listType = LIST_TO_LIST_NODE[type as ListBlockType];
-      const items: TiptapNode[] = [];
-      while (
-        i < n &&
-        blocks[i] &&
-        (blocks[i].type === type)
-      ) {
-        items.push(convertListItem(blocks[i], type as ListBlockType));
-        i++;
-      }
-      content.push({ type: listType, content: items });
-      continue;
-    }
-
-    content.push(convertBlock(block));
-    i++;
-  }
-
-  return { type: 'doc', content };
-}
-
-function convertBlock(block: BlockNoteBlock): TiptapNode {
-  const type = String(block.type ?? 'paragraph');
-  const props = (block.props ?? {}) as Record<string, unknown>;
-  const inline = convertInline((block.content as BlockNoteInline[] | undefined) ?? []);
-  const attrs = propsToAttrs(props);
-
-  switch (type) {
-    case 'heading': {
-      const lvl = Math.max(1, Math.min(6, Number(props.level ?? 2) || 2));
-      return { type: 'heading', attrs: { ...attrs, level: lvl }, content: inline };
-    }
-    case 'paragraph':
-      return { type: 'paragraph', attrs, content: inline };
-    case 'quote':
-      return {
-        type: 'blockquote',
-        attrs,
-        content: [{ type: 'paragraph', content: inline }],
-      };
-    case 'codeBlock':
-      return { type: 'codeBlock', attrs, content: inline };
-    case 'image':
-      return {
-        type: 'image',
-        attrs: {
-          src: String(props.url ?? ''),
-          alt: String(props.caption ?? ''),
-          caption: String(props.caption ?? ''),
-        },
-      };
-    case 'table':
-      return convertTable((block.content as { rows?: unknown[] } | undefined) ?? {});
-    default:
-      return {
-        type: 'paragraph',
-        attrs: { ...attrs, 'data-original-type': type },
-        content: inline,
-      };
-  }
-}
-
-function convertListItem(block: BlockNoteBlock, blockType: ListBlockType): TiptapNode {
-  const props = (block.props ?? {}) as Record<string, unknown>;
-  const inline = convertInline((block.content as BlockNoteInline[] | undefined) ?? []);
-  const attrs = propsToAttrs(props);
-
-  const itemContent: TiptapNode[] = [{ type: 'paragraph', content: inline }];
-
-  const children = block.children ?? [];
-  if (children.length > 0) {
-    const childDoc = convertBlockNoteToTiptap(children);
-    for (const childNode of childDoc.content) {
-      itemContent.push(childNode);
-    }
-  }
-
-  if (blockType === 'checkListItem') {
-    return {
-      type: 'taskItem',
-      attrs: { ...attrs, checked: !!props.checked },
-      content: itemContent,
-    };
-  }
-
-  return { type: 'listItem', attrs, content: itemContent };
-}
-
-function convertTable(content: { rows?: unknown[] }): TiptapNode {
-  const rows = Array.isArray(content.rows) ? content.rows : [];
-  const proseRows: TiptapNode[] = [];
-  let isFirstRow = true;
-  for (const row of rows) {
-    if (!row || typeof row !== 'object' || !Array.isArray((row as { cells?: unknown[] }).cells)) {
-      continue;
-    }
-    const cells: TiptapNode[] = [];
-    for (const cell of (row as { cells: unknown[] }).cells) {
-      let cellContent: TiptapNode[] = [];
-      const cellAttrs: Record<string, unknown> = {};
-      if (cell && typeof cell === 'object') {
-        const cellObj = cell as { content?: unknown; props?: { colspan?: unknown; rowspan?: unknown } };
-        if (Array.isArray(cellObj.content)) {
-          cellContent = convertInline(cellObj.content as BlockNoteInline[]);
-          if (cellObj.props) {
-            if (cellObj.props.colspan != null) {
-              cellAttrs.colspan = Number(cellObj.props.colspan) || 1;
-            }
-            if (cellObj.props.rowspan != null) {
-              cellAttrs.rowspan = Number(cellObj.props.rowspan) || 1;
-            }
-          }
-        } else if (Array.isArray(cell)) {
-          cellContent = convertInline(cell as BlockNoteInline[]);
-        }
-      }
-      cells.push({
-        type: isFirstRow ? 'tableHeader' : 'tableCell',
-        attrs: cellAttrs,
-        content: [{ type: 'paragraph', content: cellContent }],
-      });
-    }
-    proseRows.push({ type: 'tableRow', content: cells });
-    isFirstRow = false;
-  }
-
-  return { type: 'table', content: proseRows };
-}
-
-function convertInline(content: BlockNoteInline[]): TiptapNode[] {
-  const out: TiptapNode[] = [];
-  for (const span of content) {
-    if (!span || typeof span !== 'object') continue;
-    const type = String(span.type ?? 'text');
-    if (type === 'text') {
-      const text = String(span.text ?? '');
-      if (text === '') continue;
-      const marks = stylesToMarks(span.styles ?? {});
-      const node: TiptapNode = { type: 'text', text };
-      if (marks.length > 0) node.marks = marks;
-      out.push(node);
-    } else if (type === 'link') {
-      const href = String(span.href ?? '');
-      const linkMark: TiptapMark = { type: 'link', attrs: { href } };
-      for (const inner of span.content ?? []) {
-        if (!inner || inner.type !== 'text') continue;
-        const text = String(inner.text ?? '');
-        if (text === '') continue;
-        const marks = [...stylesToMarks(inner.styles ?? {}), linkMark];
-        out.push({ type: 'text', text, marks });
-      }
-    }
-  }
-  return out;
-}
-
-function stylesToMarks(styles: BlockNoteStyles): TiptapMark[] {
-  const marks: TiptapMark[] = [];
-  if (styles.bold) marks.push({ type: 'bold' });
-  if (styles.italic) marks.push({ type: 'italic' });
-  if (styles.underline) marks.push({ type: 'underline' });
-  if (styles.strike) marks.push({ type: 'strike' });
-  if (styles.code) marks.push({ type: 'code' });
-  if (styles.textColor && styles.textColor !== 'default') {
-    marks.push({ type: 'textStyle', attrs: { color: styles.textColor } });
-  }
-  if (styles.backgroundColor && styles.backgroundColor !== 'default') {
-    marks.push({ type: 'highlight', attrs: { color: styles.backgroundColor } });
-  }
-  return marks;
-}
-
-function propsToAttrs(props: Record<string, unknown>): Record<string, unknown> {
-  const attrs: Record<string, unknown> = {};
-  if (props.textColor && props.textColor !== 'default') {
-    attrs.textColor = String(props.textColor);
-  }
-  if (props.backgroundColor && props.backgroundColor !== 'default') {
-    attrs.backgroundColor = String(props.backgroundColor);
-  }
-  if (props.textAlignment) {
-    attrs.textAlign = String(props.textAlignment);
-  }
-  return attrs;
-}