Skip to content

Commit e303c3d

Browse files
tjbckMJ16MJ
andcommitted
refac: inline codespan rich text input
Co-Authored-By: Abdul Moiz <86627657+abdulmoizjawed@users.noreply.github.com>
1 parent bc5d519 commit e303c3d

3 files changed

Lines changed: 38 additions & 16 deletions

File tree

package-lock.json

Lines changed: 15 additions & 14 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,7 @@
6666
"@sveltejs/svelte-virtual-list": "^3.0.1",
6767
"@tiptap/core": "^3.0.7",
6868
"@tiptap/extension-bubble-menu": "^2.26.1",
69+
"@tiptap/extension-code": "^3.0.7",
6970
"@tiptap/extension-code-block-lowlight": "^3.0.7",
7071
"@tiptap/extension-drag-handle": "^3.4.5",
7172
"@tiptap/extension-file-handler": "^3.0.7",
@@ -157,4 +158,4 @@
157158
"node": ">=18.13.0 <=22.x.x",
158159
"npm": ">=6.0.0"
159160
}
160-
}
161+
}

src/lib/components/common/RichTextInput.svelte

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@
114114
import { Fragment, DOMParser } from 'prosemirror-model';
115115
import { EditorState, Plugin, PluginKey, TextSelection, Selection } from 'prosemirror-state';
116116
import { Decoration, DecorationSet } from 'prosemirror-view';
117-
import { Editor, Extension, mergeAttributes } from '@tiptap/core';
117+
import { Editor, Extension, markInputRule, mergeAttributes } from '@tiptap/core';
118118
119119
import { AIAutocompletion } from './RichTextInput/AutoCompletion.js';
120120
@@ -135,8 +135,26 @@
135135
import FileHandler from '@tiptap/extension-file-handler';
136136
import Typography from '@tiptap/extension-typography';
137137
import Highlight from '@tiptap/extension-highlight';
138+
import Code from '@tiptap/extension-code';
138139
import CodeBlockLowlight from '@tiptap/extension-code-block-lowlight';
139140
141+
// WORKAROUND: TipTap's default Code mark input rule regex captures the
142+
// character before the opening backtick, causing it to be deleted.
143+
// This uses a lookbehind assertion instead so the preceding character is
144+
// matched for position but not captured/deleted.
145+
// Upstream fix: https://github.com/ueberdosis/tiptap/pull/7124
146+
const backtickInputRegex = /(?<=\s|^)`([^`]+)`(?!`)$/;
147+
const FixedCode = Code.extend({
148+
addInputRules() {
149+
return [
150+
markInputRule({
151+
find: backtickInputRegex,
152+
type: this.type
153+
})
154+
];
155+
}
156+
});
157+
140158
import Mention from '@tiptap/extension-mention';
141159
import FormattingButtons from './RichTextInput/FormattingButtons.svelte';
142160
@@ -692,12 +710,14 @@
692710
extensions: [
693711
StarterKit.configure({
694712
link: link,
713+
code: false, // Disabled in favor of FixedCode (see workaround above)
695714
// When rich text is off, disable Strike from StarterKit so we can
696715
// re-add it below without its Mod-Shift-s shortcut (which conflicts
697716
// with the Toggle Sidebar shortcut). When rich text is on, the user
698717
// can undo strikethrough via the toolbar, so the shortcut is fine.
699718
...(richText ? {} : { strike: false })
700719
}),
720+
FixedCode,
701721
...(dragHandle ? [ListItemDragHandle] : []),
702722
Placeholder.configure({ placeholder: () => _placeholder, showOnlyWhenEditable: false }),
703723
SelectionDecoration,

0 commit comments

Comments
 (0)