@blocklet/editor 2.0.3 → 2.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/config.d.ts
CHANGED
|
@@ -17,6 +17,8 @@ export interface EditorConfig {
|
|
|
17
17
|
openGraphEndpoint?: string;
|
|
18
18
|
AI?: AI;
|
|
19
19
|
templatePlugin?: any;
|
|
20
|
+
minimalMode?: boolean;
|
|
21
|
+
openLinkInNewTab?: boolean;
|
|
20
22
|
}
|
|
21
23
|
export declare function EditorConfigProvider({ children, value }: {
|
|
22
24
|
children: React.ReactNode;
|
package/lib/main/editor.js
CHANGED
|
@@ -88,6 +88,7 @@ export default function Editor({ children, placeholder, onChange, autoFocus = tr
|
|
|
88
88
|
const [editor] = useLexicalComposerContext();
|
|
89
89
|
const [editable, setEditable] = useState(false);
|
|
90
90
|
const config = useEditorConfig();
|
|
91
|
+
const { minimalMode } = config;
|
|
91
92
|
const hasUploader = !!config.uploader;
|
|
92
93
|
useEffect(() => {
|
|
93
94
|
setEditable(editor.isEditable());
|
|
@@ -111,6 +112,9 @@ export default function Editor({ children, placeholder, onChange, autoFocus = tr
|
|
|
111
112
|
console.warn('You need to configure uploader to use ImagesPlugin');
|
|
112
113
|
}
|
|
113
114
|
}, [hasNodes('image'), hasUploader]);
|
|
115
|
+
if (minimalMode) {
|
|
116
|
+
return (_jsxs(_Fragment, { children: [isRichText && editable && showToolbar && _jsx(ToolbarPlugin, {}), hasNodes('image') && hasUploader && _jsx(DragDropPaste, {}), autoFocus && _jsx(AutoFocusPlugin, { defaultSelection: "rootEnd" }), _jsx(ClearEditorPlugin, {}), !!editable && _jsx(ComponentPickerPlugin, {}), hasNodes('link') && _jsx(AutoEmbedPlugin, {}), _jsx(EditorContent, { ref: onRef, className: cx('be-content', editable && 'editable'), children: _jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: cx('be-editable', 'notranslate') }), placeholder: _jsx(Placeholder, { className: "be-placeholder", children: placeholder }), ErrorBoundary: LexicalErrorBoundary }) }), hasNodes('code', 'code-highlight') && _jsx(CodeHighlightPlugin, {}), hasNodes('image') && hasUploader && _jsx(ImagesPlugin, {}), hasNodes('video') && _jsx(VideoPlugin, {}), hasNodes('link') && _jsx(LinkPlugin, {}), hasNodes('tweet') && _jsx(TwitterPlugin, {}), hasNodes('youtube') && _jsx(YouTubePlugin, {}), hasNodes('figma') && _jsx(FigmaPlugin, {}), _jsx(BilibiliPlugin, {}), _jsx(PostLinkEmbedPlugin, {}), _jsx(BookmarkPlugin, {}), editable && _jsx(CustomOnChangePlugin, { placeholder: placeholder }), editable && _jsx(TemplatePlugin, {}), !editable && _jsx(BlurTextPlugin, {}), hasNodes('pdf') && _jsx(PdfPlugin, {}), hasNodes('file') && _jsx(FilePlugin, {}), hasNodes('horizontalrule') && _jsx(HorizontalRulePlugin, {}), hasNodes('equation') && _jsx(EquationsPlugin, {}), hasNodes('excalidraw') && _jsx(ExcalidrawPlugin, {}), hasNodes('alert') && _jsx(AlertPlugin, {}), hasNodes('pages-kit-component') && _jsx(PagesKitComponentPlugin, {}), _jsx(TabFocusPlugin, {}), onChange && _jsx(OnChangePlugin, { onChange: onChange }), floatingAnchorElem && editable && (_jsxs(_Fragment, { children: [hasNodes('code') && _jsx(CodeActionMenuPlugin, { anchorElem: floatingAnchorElem }), hasNodes('link') && _jsx(FloatingLinkEditorPlugin, { anchorElem: floatingAnchorElem })] })), _jsx(AiImagePlugin, {}), editorRef && _jsx(EditorRefPlugin, { editorRef: editorRef }), children] }));
|
|
117
|
+
}
|
|
114
118
|
return (_jsxs(_Fragment, { children: [isRichText && editable && showToolbar && _jsx(ToolbarPlugin, {}), isMaxLength && _jsx(MaxLengthPlugin, { maxLength: 30 }), hasNodes('image') && hasUploader && _jsx(DragDropPaste, {}), autoFocus && _jsx(AutoFocusPlugin, { defaultSelection: "rootEnd" }), _jsx(ClearEditorPlugin, {}), !!editable && _jsx(ComponentPickerPlugin, {}), _jsx(EmojiPickerPlugin, {}), hasNodes('link') && _jsx(AutoEmbedPlugin, {}), !!editable && _jsx(MentionsPlugin, {}), hasNodes('emoji') && _jsx(EmojisPlugin, {}), hasNodes('hashtag') && _jsx(HashtagPlugin, {}), hasNodes('keyword') && _jsx(KeywordsPlugin, {}), _jsx(SpeechToTextPlugin, {}), hasNodes('autolink') && _jsx(AutoLinkPlugin, {}), isRichText ? (_jsxs(_Fragment, { children: [_jsx(HistoryPlugin, { externalHistoryState: historyState }), _jsx(EditorContent, { ref: onRef, className: cx('be-content', editable && 'editable'), children: _jsx(RichTextPlugin, { contentEditable: _jsx(ContentEditable, { className: cx('be-editable', 'notranslate') }), placeholder: _jsx(Placeholder, { className: "be-placeholder", children: placeholder }), ErrorBoundary: LexicalErrorBoundary }) }), _jsx(MarkdownShortcutPlugin, {}), _jsx(TabIndentationPlugin, {}), hasNodes('code', 'code-highlight') && _jsx(CodeHighlightPlugin, {}), hasNodes('list', 'listitem') && _jsx(ListPlugin, {}), hasNodes('list', 'listitem') && _jsx(CheckListPlugin, {}), hasNodes('list', 'listitem') && _jsx(ListMaxIndentLevelPlugin, { maxDepth: 7 }), hasNodes('table', 'tablerow', 'tablecell') && editable && (_jsx(TablePlugin, { hasCellMerge: true, hasCellBackgroundColor: true })), hasNodes('table', 'tablerow', 'tablecell') && _jsx(TableCellResizer, {}), hasNodes('image') && hasUploader && _jsx(ImagesPlugin, {}), hasNodes('video') && _jsx(VideoPlugin, {}), hasNodes('link') && _jsx(LinkPlugin, {}), hasNodes('tweet') && _jsx(TwitterPlugin, {}), hasNodes('youtube') && _jsx(YouTubePlugin, {}), hasNodes('figma') && _jsx(FigmaPlugin, {}), _jsx(BilibiliPlugin, {}), _jsx(BlockletEmbedPlugin, {}), _jsx(PostLinkEmbedPlugin, {}), _jsx(BookmarkPlugin, {}), _jsx(AidePlugin, {}), editable && _jsx(CustomOnChangePlugin, { placeholder: placeholder }), editable && _jsx(TemplatePlugin, {}), !editable && _jsx(BlurTextPlugin, {}), hasNodes('pdf') && _jsx(PdfPlugin, {}), hasNodes('file') && _jsx(FilePlugin, {}), hasNodes('link') && _jsx(ClickableLinkPlugin, {}), hasNodes('horizontalrule') && _jsx(HorizontalRulePlugin, {}), hasNodes('equation') && _jsx(EquationsPlugin, {}), hasNodes('excalidraw') && _jsx(ExcalidrawPlugin, {}), hasNodes('alert') && _jsx(AlertPlugin, {}), hasNodes('pages-kit-component') && _jsx(PagesKitComponentPlugin, {}), _jsx(TabFocusPlugin, {}), hasNodes('collapsible-container', 'collapsible-content', 'collapsible-title') && _jsx(CollapsiblePlugin, {}), onChange && _jsx(OnChangePlugin, { onChange: onChange }), floatingAnchorElem && editable && (_jsxs(_Fragment, { children: [_jsx(DraggableBlockPlugin, { anchorElem: floatingAnchorElem }), hasNodes('code') && _jsx(CodeActionMenuPlugin, { anchorElem: floatingAnchorElem }), hasNodes('link') && _jsx(FloatingLinkEditorPlugin, { anchorElem: floatingAnchorElem }), hasNodes('table') && _jsx(TableCellActionMenuPlugin, { anchorElem: floatingAnchorElem, cellMerge: true }), _jsx(FloatingTextFormatToolbarPlugin, { anchorElem: floatingAnchorElem })] })), enableHeadingsIdPlugin && _jsx(HeadingsIdPlugin, {})] })) : (_jsxs(_Fragment, { children: [_jsx(PlainTextPlugin, { contentEditable: _jsx(ContentEditable, {}), placeholder: _jsx(Placeholder, { children: "placeholder" }), ErrorBoundary: LexicalErrorBoundary }), _jsx(HistoryPlugin, { externalHistoryState: historyState })] })), (isCharLimit || isCharLimitUtf8) && (_jsx(CharacterLimitPlugin, { charset: isCharLimit ? 'UTF-16' : 'UTF-8', maxLength: 5 })), isAutocomplete && hasNodes('autocomplete') && _jsx(AutocompletePlugin, {}), _jsx("div", { children: showTableOfContents && _jsx(TableOfContentsPlugin, {}) }), _jsx(SelectBlockPlugin, {}), _jsx(RemoveListPlugin, {}), _jsx(MarkdownHeadTextPlugin, {}), _jsx(AiImagePlugin, {}), editorRef && _jsx(EditorRefPlugin, { editorRef: editorRef }), onReady && _jsx(EditorReadyPlugin, { onReady: onReady }), children] }));
|
|
115
119
|
}
|
|
116
120
|
const EditorContent = styled.div `
|
|
@@ -4,6 +4,7 @@ import { $findMatchingParent, isHTMLAnchorElement } from '@lexical/utils';
|
|
|
4
4
|
import { $getNearestNodeFromDOMNode, $getSelection, $isElementNode, $isRangeSelection, getNearestEditorFromDOMNode, } from 'lexical';
|
|
5
5
|
import { useEffect } from 'react';
|
|
6
6
|
import { useParams, useNavigate } from 'react-router-dom';
|
|
7
|
+
import { useEditorConfig } from '../../../config';
|
|
7
8
|
function findMatchingDOM(startNode, predicate) {
|
|
8
9
|
let node = startNode;
|
|
9
10
|
while (node != null) {
|
|
@@ -30,6 +31,7 @@ function isSameOrigin(url) {
|
|
|
30
31
|
*/
|
|
31
32
|
export default function LexicalClickableLinkPlugin({ newTab = true }) {
|
|
32
33
|
const [editor] = useLexicalComposerContext();
|
|
34
|
+
const config = useEditorConfig();
|
|
33
35
|
const { boardId } = useParams();
|
|
34
36
|
const navigate = useNavigate();
|
|
35
37
|
useEffect(() => {
|
|
@@ -71,7 +73,7 @@ export default function LexicalClickableLinkPlugin({ newTab = true }) {
|
|
|
71
73
|
return;
|
|
72
74
|
}
|
|
73
75
|
const isMiddle = event.type === 'auxclick' && event.button === 1;
|
|
74
|
-
if (isSameOrigin(url) && !editor.isEditable()) {
|
|
76
|
+
if (isSameOrigin(url) && !editor.isEditable() && config.openLinkInNewTab !== true) {
|
|
75
77
|
// HOTFIX: for docs board
|
|
76
78
|
// if url starts with /docs, use navigate instead of window.open
|
|
77
79
|
if (url && url?.startsWith?.('/docs')) {
|
|
@@ -71,6 +71,7 @@ export default function ComponentPickerMenuPlugin() {
|
|
|
71
71
|
const [modal, showModal] = useModal();
|
|
72
72
|
const [queryString, setQueryString] = useState(null);
|
|
73
73
|
const config = useEditorConfig();
|
|
74
|
+
const { minimalMode } = config;
|
|
74
75
|
const { pagesKitComponents } = usePagesKitComponents();
|
|
75
76
|
const hasUploader = !!config.uploader;
|
|
76
77
|
const checkForTriggerMatch = useBasicTypeaheadTriggerMatch('/', {
|
|
@@ -110,16 +111,17 @@ export default function ComponentPickerMenuPlugin() {
|
|
|
110
111
|
const hasNodes = useHasNodes();
|
|
111
112
|
const options = useMemo(() => {
|
|
112
113
|
const baseOptions = [
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
114
|
+
!minimalMode &&
|
|
115
|
+
new ComponentPickerOption('Paragraph', {
|
|
116
|
+
icon: _jsx("i", { className: "iconify", "data-icon": "bi:text-paragraph" }),
|
|
117
|
+
keywords: ['normal', 'paragraph', 'p', 'text'],
|
|
118
|
+
onSelect: () => editor.update(() => {
|
|
119
|
+
const selection = $getSelection();
|
|
120
|
+
if ($isRangeSelection(selection)) {
|
|
121
|
+
$wrapNodes(selection, () => $createParagraphNode());
|
|
122
|
+
}
|
|
123
|
+
}),
|
|
121
124
|
}),
|
|
122
|
-
}),
|
|
123
125
|
// isExistAiKit() &&
|
|
124
126
|
// new ComponentPickerOption('AI Image', {
|
|
125
127
|
// icon: <i className="iconify" data-icon="tabler:photo-ai" />,
|
|
@@ -142,7 +144,7 @@ export default function ComponentPickerMenuPlugin() {
|
|
|
142
144
|
// }
|
|
143
145
|
// },
|
|
144
146
|
// }),
|
|
145
|
-
...(hasNodes('heading')
|
|
147
|
+
...(hasNodes('heading') && !minimalMode
|
|
146
148
|
? Array.from({ length: 3 }, (_, i) => i + 1).map((n) => new ComponentPickerOption(`Heading ${n}`, {
|
|
147
149
|
icon: _jsx("i", { className: "iconify", "data-icon": `mdi:format-heading-${n}` }),
|
|
148
150
|
keywords: ['heading', 'header', `h${n}`],
|
|
@@ -157,30 +159,35 @@ export default function ComponentPickerMenuPlugin() {
|
|
|
157
159
|
}))
|
|
158
160
|
: []),
|
|
159
161
|
hasNodes('table') &&
|
|
162
|
+
!minimalMode &&
|
|
160
163
|
new ComponentPickerOption('Table', {
|
|
161
164
|
icon: _jsx("i", { className: "iconify", "data-icon": "mdi:table" }),
|
|
162
165
|
keywords: ['table', 'grid', 'spreadsheet', 'rows', 'columns'],
|
|
163
166
|
onSelect: () => showModal('Insert Table', (onClose) => _jsx(InsertTableDialog, { activeEditor: editor, onClose: onClose })),
|
|
164
167
|
}),
|
|
165
168
|
hasNodes('list', 'listitem') &&
|
|
169
|
+
!minimalMode &&
|
|
166
170
|
new ComponentPickerOption('Numbered List', {
|
|
167
171
|
icon: _jsx("i", { className: "iconify", "data-icon": "mdi:format-list-numbered" }),
|
|
168
172
|
keywords: ['numbered list', 'ordered list', 'ol'],
|
|
169
173
|
onSelect: () => editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND, undefined),
|
|
170
174
|
}),
|
|
171
175
|
hasNodes('list', 'listitem') &&
|
|
176
|
+
!minimalMode &&
|
|
172
177
|
new ComponentPickerOption('Bulleted List', {
|
|
173
178
|
icon: _jsx("i", { className: "iconify", "data-icon": "mdi:format-list-bulleted" }),
|
|
174
179
|
keywords: ['bulleted list', 'unordered list', 'ul'],
|
|
175
180
|
onSelect: () => editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND, undefined),
|
|
176
181
|
}),
|
|
177
182
|
hasNodes('list', 'listitem') &&
|
|
183
|
+
!minimalMode &&
|
|
178
184
|
new ComponentPickerOption('Check List', {
|
|
179
185
|
icon: _jsx("i", { className: "iconify", "data-icon": "mdi:format-list-checkbox" }),
|
|
180
186
|
keywords: ['check list', 'todo list'],
|
|
181
187
|
onSelect: () => editor.dispatchCommand(INSERT_CHECK_LIST_COMMAND, undefined),
|
|
182
188
|
}),
|
|
183
|
-
|
|
189
|
+
!minimalMode &&
|
|
190
|
+
hasNodes('quote') &&
|
|
184
191
|
new ComponentPickerOption('Quote', {
|
|
185
192
|
icon: _jsx("i", { className: "iconify", "data-icon": "mdi:comment-quote-outline" }),
|
|
186
193
|
keywords: ['block quote'],
|
|
@@ -191,25 +198,29 @@ export default function ComponentPickerMenuPlugin() {
|
|
|
191
198
|
}
|
|
192
199
|
}),
|
|
193
200
|
}),
|
|
194
|
-
|
|
201
|
+
!minimalMode &&
|
|
202
|
+
hasNodes('alert') &&
|
|
195
203
|
new ComponentPickerOption('Alert (Warning)', {
|
|
196
204
|
icon: _jsx("i", { className: "iconify", "data-icon": "ic:outline-info" }),
|
|
197
205
|
keywords: ['alert', 'warning'],
|
|
198
206
|
onSelect: () => $insertAlert(editor, 'warning'),
|
|
199
207
|
}),
|
|
200
|
-
|
|
208
|
+
!minimalMode &&
|
|
209
|
+
hasNodes('alert') &&
|
|
201
210
|
new ComponentPickerOption('Alert (Success)', {
|
|
202
211
|
icon: _jsx("i", { className: "iconify", "data-icon": "ic:outline-info" }),
|
|
203
212
|
keywords: ['alert', 'success'],
|
|
204
213
|
onSelect: () => $insertAlert(editor, 'success'),
|
|
205
214
|
}),
|
|
206
|
-
|
|
215
|
+
!minimalMode &&
|
|
216
|
+
hasNodes('alert') &&
|
|
207
217
|
new ComponentPickerOption('Alert (Info)', {
|
|
208
218
|
icon: _jsx("i", { className: "iconify", "data-icon": "ic:outline-info" }),
|
|
209
219
|
keywords: ['alert', 'info'],
|
|
210
220
|
onSelect: () => $insertAlert(editor, 'info'),
|
|
211
221
|
}),
|
|
212
|
-
|
|
222
|
+
!minimalMode &&
|
|
223
|
+
hasNodes('alert') &&
|
|
213
224
|
new ComponentPickerOption('Alert (Error)', {
|
|
214
225
|
icon: _jsx("i", { className: "iconify", "data-icon": "ic:outline-info" }),
|
|
215
226
|
keywords: ['alert', 'error'],
|
|
@@ -235,25 +246,30 @@ export default function ComponentPickerMenuPlugin() {
|
|
|
235
246
|
}
|
|
236
247
|
}),
|
|
237
248
|
}),
|
|
238
|
-
|
|
249
|
+
!minimalMode &&
|
|
250
|
+
hasNodes('horizontalrule') &&
|
|
239
251
|
new ComponentPickerOption('Divider', {
|
|
240
252
|
icon: _jsx("i", { className: "iconify", "data-icon": "mdi:border-horizontal" }),
|
|
241
253
|
keywords: ['horizontal rule', 'divider', 'hr'],
|
|
242
254
|
onSelect: () => editor.dispatchCommand(INSERT_HORIZONTAL_RULE_COMMAND, undefined),
|
|
243
255
|
}),
|
|
244
|
-
|
|
256
|
+
!minimalMode &&
|
|
257
|
+
hasNodes('excalidraw') &&
|
|
245
258
|
new ComponentPickerOption('Excalidraw', {
|
|
246
259
|
icon: _jsx("i", { className: "iconify", "data-icon": "mdi:graph-outline" }),
|
|
247
260
|
keywords: ['excalidraw', 'diagram', 'drawing'],
|
|
248
261
|
onSelect: () => editor.dispatchCommand(INSERT_EXCALIDRAW_COMMAND, undefined),
|
|
249
262
|
}),
|
|
250
|
-
...
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
263
|
+
...(minimalMode
|
|
264
|
+
? []
|
|
265
|
+
: EmbedConfigs.map((embedConfig) => hasNodes(embedConfig.type) &&
|
|
266
|
+
new ComponentPickerOption(`Embed ${embedConfig.contentName}`, {
|
|
267
|
+
icon: embedConfig.icon,
|
|
268
|
+
keywords: [...embedConfig.keywords, 'embed'],
|
|
269
|
+
onSelect: () => editor.dispatchCommand(INSERT_EMBED_COMMAND, embedConfig.type),
|
|
270
|
+
}))),
|
|
271
|
+
!minimalMode &&
|
|
272
|
+
hasNodes('equation') &&
|
|
257
273
|
new ComponentPickerOption('Equation', {
|
|
258
274
|
icon: _jsx("i", { className: "iconify", "data-icon": "mdi:function-variant" }),
|
|
259
275
|
keywords: ['equation', 'latex', 'math'],
|
|
@@ -268,39 +284,46 @@ export default function ComponentPickerMenuPlugin() {
|
|
|
268
284
|
uploadFile(editor);
|
|
269
285
|
},
|
|
270
286
|
}),
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
287
|
+
!minimalMode &&
|
|
288
|
+
new ComponentPickerOption('Templates', {
|
|
289
|
+
icon: _jsx("i", { className: "iconify", "data-icon": "tabler:template" }),
|
|
290
|
+
keywords: ['templates'],
|
|
291
|
+
onSelect: () => {
|
|
292
|
+
editor.dispatchCommand(INSERT_TEMPLATE_COMMAND, undefined);
|
|
293
|
+
},
|
|
294
|
+
}),
|
|
295
|
+
!minimalMode &&
|
|
296
|
+
hasNodes('collapsible-container') &&
|
|
279
297
|
new ComponentPickerOption('Collapsible', {
|
|
280
298
|
icon: _jsx("i", { className: "iconify", "data-icon": "bi:caret-right-fill" }),
|
|
281
299
|
keywords: ['collapse', 'collapsible', 'toggle'],
|
|
282
300
|
onSelect: () => editor.dispatchCommand(INSERT_COLLAPSIBLE_COMMAND, undefined),
|
|
283
301
|
}),
|
|
284
|
-
...
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
302
|
+
...(minimalMode
|
|
303
|
+
? []
|
|
304
|
+
: ['left', 'center', 'right', 'justify'].map((alignment) => new ComponentPickerOption(`Align ${alignment}`, {
|
|
305
|
+
icon: _jsx("i", { className: "iconify", "data-icon": `mdi:format-align-${alignment}` }),
|
|
306
|
+
keywords: ['align', 'justify', alignment],
|
|
307
|
+
onSelect: () =>
|
|
308
|
+
// @ts-ignore Correct types, but since they're dynamic TS doesn't like it.
|
|
309
|
+
editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, alignment),
|
|
310
|
+
}))),
|
|
311
|
+
!minimalMode &&
|
|
312
|
+
hasNodes('subpage-listing') &&
|
|
292
313
|
new ComponentPickerOption('Subpage Listing', {
|
|
293
314
|
icon: _jsx("i", { className: "iconify", "data-icon": "material-symbols:list-alt-outline-sharp" }),
|
|
294
315
|
keywords: ['subpage', 'doc', 'list'],
|
|
295
316
|
onSelect: () => $insertSubpageListing(editor, 'children'),
|
|
296
317
|
}),
|
|
297
|
-
...
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
318
|
+
...(minimalMode
|
|
319
|
+
? []
|
|
320
|
+
: pagesKitComponents
|
|
321
|
+
.filter((x) => !!x.name)
|
|
322
|
+
.map((x) => new ComponentPickerOption(`${x.name}`, {
|
|
323
|
+
icon: (_jsx(Box, { component: "span", sx: { display: 'inline-flex', width: 20, px: 0.25, mr: '1px', fontSize: 13 }, title: "Pages kit custom component", children: "\uD83E\uDDE9" })),
|
|
324
|
+
keywords: [x.name],
|
|
325
|
+
onSelect: () => editor.dispatchCommand(INSERT_PAGES_KIT_COMPONENT_COMMAND, { id: x.id, name: x.name }),
|
|
326
|
+
}))),
|
|
304
327
|
].filter(Boolean);
|
|
305
328
|
const dynamicOptions = getDynamicOptions();
|
|
306
329
|
return queryString
|
|
@@ -296,21 +296,24 @@ export default function ToolbarPlugin() {
|
|
|
296
296
|
const insertGifOnClick = (payload) => {
|
|
297
297
|
activeEditor.dispatchCommand(INSERT_IMAGE_COMMAND, payload);
|
|
298
298
|
};
|
|
299
|
-
const
|
|
300
|
-
const
|
|
301
|
-
'component',
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
299
|
+
const { toolbar: toolbarConfig, minimalMode } = useEditorConfig();
|
|
300
|
+
const defaultItems = minimalMode
|
|
301
|
+
? ['component', 'block', 'bold', 'italic', 'underline', 'code', 'link', 'media']
|
|
302
|
+
: [
|
|
303
|
+
'component',
|
|
304
|
+
'block',
|
|
305
|
+
'align',
|
|
306
|
+
'bold',
|
|
307
|
+
'italic',
|
|
308
|
+
'underline',
|
|
309
|
+
'code',
|
|
310
|
+
'link',
|
|
311
|
+
'color',
|
|
312
|
+
'bgcolor',
|
|
313
|
+
'strikethrough',
|
|
314
|
+
'media',
|
|
315
|
+
];
|
|
316
|
+
const items = toolbarConfig?.items ?? defaultItems;
|
|
314
317
|
const menus = [];
|
|
315
318
|
for (const item of items) {
|
|
316
319
|
switch (item) {
|
|
@@ -322,7 +325,8 @@ export default function ToolbarPlugin() {
|
|
|
322
325
|
break;
|
|
323
326
|
}
|
|
324
327
|
case 'block': {
|
|
325
|
-
|
|
328
|
+
// minimalMode 不需要 'block', 但需要 'code (block)'
|
|
329
|
+
if (blockType in blockTypeToBlockName && activeEditor === editor && !minimalMode) {
|
|
326
330
|
menus.push(_jsx(BlockFormatDropDown, { disabled: !isEditable, blockType: blockType, editor: editor }, "block")
|
|
327
331
|
// <Divider key="block-divider" />
|
|
328
332
|
);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blocklet/editor",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.4",
|
|
4
4
|
"main": "lib/index.js",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"dev": "npm run storybook",
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
"@arcblock/ux": "^2.9.77",
|
|
41
41
|
"@blocklet/embed": "^0.1.11",
|
|
42
42
|
"@blocklet/pages-kit": "^0.2.302",
|
|
43
|
-
"@blocklet/pdf": "2.0.
|
|
43
|
+
"@blocklet/pdf": "2.0.4",
|
|
44
44
|
"@excalidraw/excalidraw": "^0.14.2",
|
|
45
45
|
"@iconify/iconify": "^3.0.1",
|
|
46
46
|
"@iconify/icons-tabler": "^1.2.95",
|
|
@@ -113,5 +113,5 @@
|
|
|
113
113
|
"react": "*",
|
|
114
114
|
"react-dom": "*"
|
|
115
115
|
},
|
|
116
|
-
"gitHead": "
|
|
116
|
+
"gitHead": "6cf0a1ddf0aa7bfaadbf5b1b2ce85eceb3706841"
|
|
117
117
|
}
|