Document Configuration
This section is used to configure the display and behavior of the Umo Editor document area and document name.
Default Configuration
{
document: {
title: 'Untitled Document',
content: '',
placeholder: {
en_US: 'Please enter the document content...',
zh_CN: '请输入文档内容...',
},
enableSpellcheck: true,
enableMarkdown: true,
enableBubbleMenu: true,
enableBlockMenu: true, // New in v1.3.0
readOnly: false,
autofocus: true,
characterLimit: 0,
typographyRules: {},
editorProps: {}, // New in v2.3.0
parseOptions: { // New in v2.3.0
preserveWhitespace: 'full',
},
autoSave: { // New in v1.4.0
enabled: true,
interval: 300000,
},
},
}
Configuration Item Descriptions
document.title
Description: The document title, used for the file name when exporting, etc. You can dynamically set or modify the document title using the setDocument.
Type: String
Default: Untitled Document
document.content
Description: The initial document content, which users can modify. You can dynamically set or modify the document content using the setContent.
Type: String
Default: Empty
document.placeholder
Description: The placeholder displayed when the document content is empty.
Type: String
or Object
Default: Please enter the document content...
document.enableSpellcheck
Description: Whether to enable the browser’s spellcheck feature. When enabled, users can manually turn it off. You can dynamically set whether to enable the browser’s spellcheck feature using the setDocument.
Type: Boolean
Default: true
document.enableMarkdown
Description: Whether to enable Markdown syntax. When enabled, users can manually turn it off. You can dynamically set whether to enable Markdown syntax using the setDocument.
Type: Boolean
Default: true
document.enableBubbleMenu
Description: Whether to display the bubble menu. You can dynamically set whether to display the bubble menu using the setDocument.
Type: Boolean
Default: true
document.enableBlockMenu v1.3.0 Added
Description: Whether to display the block menu. You can dynamically set whether to display the block menu using the setDocument.
Type: Boolean
Default: true
document.readOnly
Description: Determines whether the document is read-only. When set to true
, users cannot edit the current document. You can set the read-only status using the setReadOnly method.
Type: Boolean
Default: false
document.autofocus
Description: Whether the document automatically receives cursor focus.
Type: Boolean
Default: true
document.characterLimit
Description: The character limit for the document. If 0
, there is no limit on the number of characters.
Type: Number
Default: 0
document.typographyRules
Description: Document typography rules.
Type: Object
Default: {}
Configuration Items:
Name | Description | Default Enabled |
---|---|---|
emDash | Converts double hyphens — to an em dash —. | ✅ Enabled |
ellipsis | Converts three dots … to an ellipsis …. | ✅ Enabled |
openDoubleQuote | “Smart” left double quotes. | ✅ Enabled |
… | … | … |
To disable an item, set it to false
. For example:
{
document: {
typographyRules: {
emDash: false
}
}
}
document.autoSave v1.4.0 Added
Description: Document auto-save configuration. You can dynamically set or modify this configuration using the setDocument.
Type: Object
Configuration Items:
enabled
:Boolean
, whether to enable auto-save, default istrue
.interval
:Number
, the interval between auto-saves in milliseconds, default is300000
(5 minutes).
document.editorProps v2.3.0 Added
Description:For advanced use cases, you can pass which will be handled by ProseMirror. You can use it to override various editor events or change editor DOM element attributes, for example to add some Tailwind classes. For more information, see: https://prosemirror.net/docs/ref/#view.EditorProps
Example:
{
editorProps: {
attributes: {
class: 'prose prose-sm sm:prose lg:prose-lg xl:prose-2xl mx-auto focus:outline-none',
},
transformPastedText(text) {
return text.toUpperCase()
},
},
}
Type:Object
Default:{}
document.parseOptions v2.3.0 Added
Description:Passed content is parsed by ProseMirror. To hook into the parsing, you can pass which are then handled by ProseMirror. For more information, see: https://prosemirror.net/docs/ref/#view.EditorProps
Type:Object
Default:{ preserveWhitespace: 'full' }