UBERF-4251 Use prosemirror-codemark plugin for inline code (#3999)

Signed-off-by: Alexander Onnikov <alexander.onnikov@xored.com>

common/config/rush/pnpm-lock.yaml

@@ -824,9 +824,6 @@ dependencies:
   '@typescript-eslint/parser':
     specifier: ^5.41.0
     version: 5.62.0(eslint@8.51.0)(typescript@5.2.2)
-  allure-commandline:
-    specifier: 2.24.1
-    version: 2.24.1
   allure-playwright:
     specifier: 2.9.2
     version: 2.9.2
@@ -1022,6 +1019,9 @@ dependencies:
   prosemirror-changeset:
     specifier: ^2.2.1
     version: 2.2.1
+  prosemirror-codemark:
+    specifier: ^0.4.2
+    version: 0.4.2(prosemirror-model@1.19.3)(prosemirror-state@1.4.3)(prosemirror-view@1.32.0)
   prosemirror-collab:
     specifier: ^1.3.1
     version: 1.3.1
@@ -13981,6 +13981,19 @@ packages:
       prosemirror-transform: 1.8.0
     dev: false
 
+  /prosemirror-codemark@0.4.2(prosemirror-model@1.19.3)(prosemirror-state@1.4.3)(prosemirror-view@1.32.0):
+    resolution: {integrity: sha512-4n+PnGQToa/vTjn0OiivUvE8/moLtguUAfry8UA4Q8p47MhqT2Qpf2zBLustX5Upi4mSp3z1ZYBqLLovZC6abA==}
+    peerDependencies:
+      prosemirror-inputrules: ^1.2.0
+      prosemirror-model: ^1.18.1
+      prosemirror-state: ^1.4.1
+      prosemirror-view: ^1.26.2
+    dependencies:
+      prosemirror-model: 1.19.3
+      prosemirror-state: 1.4.3
+      prosemirror-view: 1.32.0
+    dev: false
+
   /prosemirror-collab@1.3.1:
     resolution: {integrity: sha512-4SnynYR9TTYaQVXd/ieUvsVV4PDMBzrq2xPUWutHivDuOshZXqQ5rGbZM84HEaXKbLdItse7weMGOUdDVcLKEQ==}
     dependencies:
@@ -22711,7 +22724,7 @@ packages:
     dev: false
 
   file:projects/tests-sanity.tgz:
-    resolution: {integrity: sha512-Mpuuf0/aFi8XMdgJ8YKvLWE6xJ+gThtS0hZA9bjLdBV1sKUT8jMdHDfxaAcdtrSkWXymVggP+Qs8AAqpwIA8ug==, tarball: file:projects/tests-sanity.tgz}
+    resolution: {integrity: sha512-gkKzOUcbuaLf4uN8Fd7Mv9+GrAGW+LXCUc+dBuXNgV20G81BUXyFfsTgA/Xib5DntTe+tO+zYQmjMCGZfAHjIQ==, tarball: file:projects/tests-sanity.tgz}
     name: '@rush-temp/tests-sanity'
     version: 0.0.0
     dependencies:
@@ -22736,7 +22749,7 @@ packages:
     dev: false
 
   file:projects/text-editor.tgz(@types/node@16.11.68)(bufferutil@4.0.7)(esbuild@0.16.17)(postcss-load-config@4.0.1)(postcss@8.4.31)(ts-node@10.9.1):
-    resolution: {integrity: sha512-OzXa/nYb9KYZcR07KJ2MZdeQEKBuy5eV3AO4OPDsvlZZpy7o6Tl3osEImE4kiRgT31bnLs39SD8KNzM1EJhU6g==, tarball: file:projects/text-editor.tgz}
+    resolution: {integrity: sha512-tOQA1DBz3uTu9nL2yKDYBkvDvF7EDTyD6HHuJx/GVGGD7rXsfYlZrrqM1y212xeggC1IGg3NAjOvODJ/0gKk8g==, tarball: file:projects/text-editor.tgz}
     id: file:projects/text-editor.tgz
     name: '@rush-temp/text-editor'
     version: 0.0.0
@@ -22782,6 +22795,7 @@ packages:
       prettier: 2.8.8
       prettier-plugin-svelte: 2.10.1(prettier@2.8.8)(svelte@3.55.1)
       prosemirror-changeset: 2.2.1
+      prosemirror-codemark: 0.4.2(prosemirror-model@1.19.3)(prosemirror-state@1.4.3)(prosemirror-view@1.32.0)
       prosemirror-collab: 1.3.1
       prosemirror-commands: 1.5.2
       prosemirror-dropcursor: 1.8.1
@@ -22818,6 +22832,7 @@ packages:
       - node-notifier
       - postcss
       - postcss-load-config
+      - prosemirror-inputrules
       - pug
       - stylus
       - sugarss

packages/text-editor/package.json

@@ -84,6 +84,7 @@
     "@tiptap/extension-underline": "^2.1.12",
     "@tiptap/extension-list-keymap": "^2.1.12",
     "@hocuspocus/provider": "^2.5.0",
-    "slugify": "^1.6.6"
+    "slugify": "^1.6.6",
+    "prosemirror-codemark": "^0.4.2"
   }
 }

packages/text-editor/src/components/extension/codemark.ts

@@ -0,0 +1,24 @@
+//
+// Copyright © 2023 Hardcore Engineering Inc.
+//
+// Licensed under the Eclipse Public License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License. You may
+// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+
+import { Extension } from '@tiptap/core'
+import codemark from 'prosemirror-codemark'
+
+export const CodemarkExtension = Extension.create({
+  name: 'codemark',
+  addProseMirrorPlugins () {
+    return codemark({ markType: this.editor.schema.marks.code })
+  }
+})

packages/text-editor/src/components/extensions.ts

@@ -21,6 +21,7 @@ import { CompletionOptions } from '../Completion'
 import MentionList from './MentionList.svelte'
 import { NodeUuidExtension } from './extension/nodeUuid'
 import { SvelteRenderer } from './node-view'
+import { CodemarkExtension } from './extension/codemark'
 
 export const tableExtensions = [
   Table.configure({
@@ -68,6 +69,7 @@ export const defaultExtensions: AnyExtension[] = [
       }
     }
   }),
+  CodemarkExtension,
   Highlight.configure({
     multicolor: false
   }),

packages/theme/styles/prose.scss

@@ -47,7 +47,7 @@ table.proseTable {
 }
 
 .proseCode {
-  display: inline-block;
+  display: inline;
   margin: 0;
   padding: 0 .25rem;
   font-family: var(--mono-font);