refactor: merge blocks-editor package with web

packages/web/package.json

@@ -40,7 +40,6 @@
     "@reach/visually-hidden": "^0.18.0",
     "@standardnotes/authenticator": "^2.3.9",
     "@standardnotes/autobiography-theme": "^1.2.7",
-    "@standardnotes/blocks-editor": "workspace:*",
     "@standardnotes/bold-editor": "^1.6.4",
     "@standardnotes/classic-code-editor": "^1.5.7",
     "@standardnotes/dynamic-theme": "^1.2.8",

packages/web/src/javascripts/Components/ChangeEditor/ChangeEditorMenu.tsx

@@ -10,7 +10,7 @@ import { EditorMenuItem } from '@/Components/NotesOptions/EditorMenuItem'
 import { createEditorMenuGroups } from '../../Utils/createEditorMenuGroups'
 import { reloadFont } from '../NoteView/FontFunctions'
 import { PremiumFeatureIconClass, PremiumFeatureIconName } from '../Icon/PremiumFeatureIcon'
-import { SuperNoteImporter } from '../NoteView/SuperEditor/SuperNoteImporter'
+import { SuperNoteImporter } from '../SuperEditor/SuperNoteImporter'
 import MenuRadioButtonItem from '../Menu/MenuRadioButtonItem'
 import { Pill } from '../Preferences/PreferencesComponents/Content'
 import ModalOverlay from '../Modal/ModalOverlay'

packages/web/src/javascripts/Components/ChangeEditor/ChangeMultipleMenu.tsx

@@ -10,7 +10,7 @@ import Menu from '../Menu/Menu'
 import MenuItem from '../Menu/MenuItem'
 import { EditorMenuGroup } from '../NotesOptions/EditorMenuGroup'
 import { EditorMenuItem } from '../NotesOptions/EditorMenuItem'
-import { SuperNoteImporter } from '../NoteView/SuperEditor/SuperNoteImporter'
+import { SuperNoteImporter } from '../SuperEditor/SuperNoteImporter'
 import { Pill } from '../Preferences/PreferencesComponents/Content'
 import ModalOverlay from '../Modal/ModalOverlay'
 

packages/web/src/javascripts/Components/NoteView/NoteView.tsx

@@ -27,7 +27,7 @@ import {
 } from '@standardnotes/snjs'
 import { confirmDialog, DELETE_NOTE_KEYBOARD_COMMAND, KeyboardKey } from '@standardnotes/ui-services'
 import { ChangeEventHandler, createRef, KeyboardEventHandler, RefObject } from 'react'
-import { SuperEditor } from './SuperEditor/SuperEditor'
+import { SuperEditor } from '../SuperEditor/SuperEditor'
 import IndicatorCircle from '../IndicatorCircle/IndicatorCircle'
 import LinkedItemBubblesContainer from '../LinkedItems/LinkedItemBubblesContainer'
 import LinkedItemsButton from '../LinkedItems/LinkedItemsButton'
@@ -41,7 +41,7 @@ import {
   transactionForAssociateComponentWithCurrentNote,
   transactionForDisassociateComponentWithCurrentNote,
 } from './TransactionFunctions'
-import { SuperEditorContentId } from '@standardnotes/blocks-editor'
+import { SuperEditorContentId } from '../SuperEditor/Constants'
 import { NoteViewController } from './Controller/NoteViewController'
 import { PlainEditor, PlainEditorInterface } from './PlainEditor/PlainEditor'
 

packages/web/src/javascripts/Components/RevisionHistoryModal/SelectedRevisionContent.tsx

@@ -6,9 +6,8 @@ import ComponentView from '@/Components/ComponentView/ComponentView'
 import { NotesController } from '@/Controllers/NotesController/NotesController'
 import { NoteHistoryController } from '@/Controllers/NoteHistory/NoteHistoryController'
 import { ErrorBoundary } from '@/Utils/ErrorBoundary'
-import { BlocksEditorComposer, BlocksEditor } from '@standardnotes/blocks-editor'
-import { FileNode } from '../NoteView/SuperEditor/Plugins/EncryptedFilePlugin/Nodes/FileNode'
-import { BubbleNode } from '../NoteView/SuperEditor/Plugins/ItemBubblePlugin/Nodes/BubbleNode'
+import { BlocksEditor } from '../SuperEditor/BlocksEditor'
+import { BlocksEditorComposer } from '../SuperEditor/BlocksEditorComposer'
 
 const ABSOLUTE_CENTER_CLASSNAME = 'absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2'
 
@@ -64,15 +63,11 @@ const SelectedRevisionContent: FunctionComponent<SelectedRevisionContentProps> =
         </div>
       ) : note?.noteType === NoteType.Super ? (
         <ErrorBoundary>
-          <div className="blocks-editor w-full flex-grow overflow-hidden overflow-y-auto p-4">
-            <BlocksEditorComposer
-              readonly
-              initialValue={selectedRevision?.payload.content.text}
-              nodes={[FileNode, BubbleNode]}
-            >
+          <div className="w-full flex-grow overflow-hidden overflow-y-auto">
+            <BlocksEditorComposer readonly initialValue={selectedRevision?.payload.content.text}>
               <BlocksEditor
                 readonly
-                className="relative resize-none text-base focus:shadow-none focus:outline-none"
+                className="blocks-editor relative h-full resize-none p-4 text-base focus:shadow-none focus:outline-none"
                 spellcheck={note.spellcheck}
               ></BlocksEditor>
             </BlocksEditorComposer>

packages/blocks-editor/src/Editor/BlocksEditor.tsx → packages/web/src/javascripts/Components/SuperEditor/BlocksEditor.tsx

@@ -12,16 +12,16 @@ import { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin'
 import { LinkPlugin } from '@lexical/react/LexicalLinkPlugin'
 import { ListPlugin } from '@lexical/react/LexicalListPlugin'
 import { EditorState, LexicalEditor } from 'lexical'
-import HorizontalRulePlugin from '../Lexical/Plugins/HorizontalRulePlugin'
-import TwitterPlugin from '../Lexical/Plugins/TwitterPlugin'
-import YouTubePlugin from '../Lexical/Plugins/YouTubePlugin'
-import AutoEmbedPlugin from '../Lexical/Plugins/AutoEmbedPlugin'
-import CollapsiblePlugin from '../Lexical/Plugins/CollapsiblePlugin'
-import DraggableBlockPlugin from '../Lexical/Plugins/DraggableBlockPlugin'
-import CodeHighlightPlugin from '../Lexical/Plugins/CodeHighlightPlugin'
-import FloatingTextFormatToolbarPlugin from '../Lexical/Plugins/FloatingTextFormatToolbarPlugin'
-import FloatingLinkEditorPlugin from '../Lexical/Plugins/FloatingLinkEditorPlugin'
-import { TabIndentationPlugin } from '../Lexical/Plugins/TabIndentationPlugin'
+import HorizontalRulePlugin from './Plugins/HorizontalRulePlugin'
+import TwitterPlugin from './Plugins/TwitterPlugin'
+import YouTubePlugin from './Plugins/YouTubePlugin'
+import AutoEmbedPlugin from './Plugins/AutoEmbedPlugin'
+import CollapsiblePlugin from './Plugins/CollapsiblePlugin'
+import DraggableBlockPlugin from './Plugins/DraggableBlockPlugin'
+import CodeHighlightPlugin from './Plugins/CodeHighlightPlugin'
+import FloatingTextFormatToolbarPlugin from './Plugins/FloatingTextFormatToolbarPlugin'
+import FloatingLinkEditorPlugin from './Plugins/FloatingLinkEditorPlugin'
+import { TabIndentationPlugin } from './Plugins/TabIndentationPlugin'
 import { handleEditorChange } from './Utils'
 import { SuperEditorContentId } from './Constants'
 import { classNames } from '@standardnotes/utils'
@@ -106,7 +106,7 @@ export const BlocksEditor: FunctionComponent<BlocksEditorProps> = ({
       {!readonly && floatingAnchorElem && (
         <>
           <FloatingTextFormatToolbarPlugin anchorElem={floatingAnchorElem} />
-          <FloatingLinkEditorPlugin />
+          <FloatingLinkEditorPlugin anchorElem={floatingAnchorElem} />
           <DraggableBlockPlugin anchorElem={floatingAnchorElem} />
         </>
       )}

packages/blocks-editor/src/Editor/BlocksEditorComposer.tsx → packages/web/src/javascripts/Components/SuperEditor/BlocksEditorComposer.tsx

@@ -1,7 +1,7 @@
 import { FunctionComponent } from 'react'
 import { LexicalComposer } from '@lexical/react/LexicalComposer'
-import BlocksEditorTheme from '../Lexical/Theme/Theme'
-import { BlockEditorNodes } from '../Lexical/Nodes/AllNodes'
+import BlocksEditorTheme from './Lexical/Theme/Theme'
+import { BlockEditorNodes } from './Lexical/Nodes/AllNodes'
 import { Klass, LexicalNode } from 'lexical'
 
 type BlocksEditorComposerProps = {

packages/blocks-editor/src/Lexical/Nodes/AllNodes.ts → packages/web/src/javascripts/Components/SuperEditor/Lexical/Nodes/AllNodes.ts

@@ -9,9 +9,11 @@ import { HeadingNode, QuoteNode } from '@lexical/rich-text'
 import { TableCellNode, TableNode, TableRowNode } from '@lexical/table'
 import { TweetNode } from './TweetNode'
 import { YouTubeNode } from './YouTubeNode'
-import { CollapsibleContainerNode } from '../Plugins/CollapsiblePlugin/CollapsibleContainerNode'
-import { CollapsibleContentNode } from '../Plugins/CollapsiblePlugin/CollapsibleContentNode'
-import { CollapsibleTitleNode } from '../Plugins/CollapsiblePlugin/CollapsibleTitleNode'
+import { CollapsibleContainerNode } from '../../Plugins/CollapsiblePlugin/CollapsibleContainerNode'
+import { CollapsibleContentNode } from '../../Plugins/CollapsiblePlugin/CollapsibleContentNode'
+import { CollapsibleTitleNode } from '../../Plugins/CollapsiblePlugin/CollapsibleTitleNode'
+import { FileNode } from '../../Plugins/EncryptedFilePlugin/Nodes/FileNode'
+import { BubbleNode } from '../../Plugins/ItemBubblePlugin/Nodes/BubbleNode'
 
 export const BlockEditorNodes = [
   AutoLinkNode,
@@ -34,4 +36,6 @@ export const BlockEditorNodes = [
   TableRowNode,
   TweetNode,
   YouTubeNode,
+  FileNode,
+  BubbleNode,
 ]

packages/blocks-editor/src/Lexical/Nodes/TableComponent.tsx → packages/web/src/javascripts/Components/SuperEditor/Lexical/Nodes/TableComponent.tsx

@@ -50,8 +50,7 @@ import {
 import { useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { IS_APPLE } from '../Shared/environment'
-
-import { CellContext } from '../Plugins/TablePlugin'
+import { CellContext } from '../../Plugins/TablePlugin'
 import {
   $isTableNode,
   Cell,

packages/blocks-editor/src/Lexical/Theme/custom.scss → packages/web/src/javascripts/Components/SuperEditor/Lexical/Theme/custom.scss

@@ -1,4 +1,4 @@
-@import '../Plugins//DraggableBlockPlugin/index.scss';
+@import '../../Plugins/DraggableBlockPlugin/index.scss';
 
 #typeahead-menu {
   z-index: 10000;

packages/blocks-editor/src/Lexical/Plugins/AutoEmbedPlugin/index.tsx → packages/web/src/javascripts/Components/SuperEditor/Plugins/AutoEmbedPlugin/index.tsx

@@ -19,9 +19,9 @@ import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext
 import { useState } from 'react'
 import * as ReactDOM from 'react-dom'
 
-import useModal from '../../Hooks/useModal'
-import Button from '../../UI/Button'
-import { DialogActions } from '../../UI/Dialog'
+import useModal from '../../Lexical/Hooks/useModal'
+import Button from '../../Lexical/UI/Button'
+import { DialogActions } from '../../Lexical/UI/Dialog'
 import { INSERT_TWEET_COMMAND } from '../TwitterPlugin'
 import { INSERT_YOUTUBE_COMMAND } from '../YouTubePlugin'
 

packages/web/src/javascripts/Components/NoteView/SuperEditor/Plugins/BlockPickerPlugin/BlockPickerPlugin.tsx → packages/web/src/javascripts/Components/SuperEditor/Plugins/BlockPickerPlugin/BlockPickerPlugin.tsx

@@ -2,8 +2,8 @@ import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext
 import { LexicalTypeaheadMenuPlugin, useBasicTypeaheadTriggerMatch } from '@lexical/react/LexicalTypeaheadMenuPlugin'
 import { TextNode } from 'lexical'
 import { useCallback, useMemo, useState } from 'react'
-import useModal from '@standardnotes/blocks-editor/src/Lexical/Hooks/useModal'
-import { InsertTableDialog } from '@standardnotes/blocks-editor/src/Lexical/Plugins/TablePlugin'
+import useModal from '../../Lexical/Hooks/useModal'
+import { InsertTableDialog } from '../../Plugins/TablePlugin'
 import { BlockPickerOption } from './BlockPickerOption'
 import { BlockPickerMenuItem } from './BlockPickerMenuItem'
 import { GetNumberedListBlockOption } from './Options/NumberedList'

packages/web/src/javascripts/Components/NoteView/SuperEditor/Plugins/Blocks/Collapsible.tsx → packages/web/src/javascripts/Components/SuperEditor/Plugins/Blocks/Collapsible.tsx

@@ -1,5 +1,5 @@
 import { LexicalEditor } from 'lexical'
-import { INSERT_COLLAPSIBLE_COMMAND } from '@standardnotes/blocks-editor/src/Lexical/Plugins/CollapsiblePlugin'
+import { INSERT_COLLAPSIBLE_COMMAND } from '../../Plugins/CollapsiblePlugin'
 import { LexicalIconName } from '@/Components/Icon/LexicalIcons'
 
 export function GetCollapsibleBlock(editor: LexicalEditor) {

packages/web/src/javascripts/Components/NoteView/SuperEditor/Plugins/Blocks/Embeds.tsx → packages/web/src/javascripts/Components/SuperEditor/Plugins/Blocks/Embeds.tsx

@@ -1,6 +1,6 @@
 import { LexicalEditor } from 'lexical'
 import { INSERT_EMBED_COMMAND } from '@lexical/react/LexicalAutoEmbedPlugin'
-import { EmbedConfigs } from '@standardnotes/blocks-editor/src/Lexical/Plugins/AutoEmbedPlugin'
+import { EmbedConfigs } from '../AutoEmbedPlugin'
 import { LexicalIconName } from '@/Components/Icon/LexicalIcons'
 
 export function GetEmbedsBlocks(editor: LexicalEditor) {

packages/blocks-editor/src/Lexical/Plugins/DraggableBlockPlugin/index.tsx → packages/web/src/javascripts/Components/SuperEditor/Plugins/DraggableBlockPlugin/index.tsx

@@ -24,9 +24,9 @@ import { DragEvent as ReactDragEvent, TouchEvent, useCallback, useEffect, useRef
 import { createPortal } from 'react-dom'
 import { BlockIcon } from '@standardnotes/icons'
 
-import { isHTMLElement } from '../../Utils/guard'
-import { Point } from '../../Utils/point'
-import { ContainsPointReturn, Rect } from '../../Utils/rect'
+import { isHTMLElement } from '../../Lexical/Utils/guard'
+import { Point } from '../../Lexical/Utils/point'
+import { ContainsPointReturn, Rect } from '../../Lexical/Utils/rect'
 
 const DRAGGABLE_BLOCK_MENU_LEFT_SPACE = -2
 const TARGET_LINE_HALF_HEIGHT = 2

packages/web/src/javascripts/Components/NoteView/SuperEditor/Plugins/ExportPlugin/ExportPlugin.ts → packages/web/src/javascripts/Components/SuperEditor/Plugins/ExportPlugin/ExportPlugin.ts

@@ -11,7 +11,7 @@ import {
 } from '@standardnotes/ui-services'
 import { useCallback, useEffect } from 'react'
 import { $convertToMarkdownString } from '@lexical/markdown'
-import { MarkdownTransformers } from '@standardnotes/blocks-editor'
+import { MarkdownTransformers } from '../../MarkdownTransformers'
 import { $generateHtmlFromNodes } from '@lexical/html'
 import { useCommandService } from '@/Components/CommandProvider'