Security News
JavaScript Leaders Demand Oracle Release the JavaScript Trademark
In an open letter, JavaScript community leaders urge Oracle to give up the JavaScript trademark, arguing that it has been effectively abandoned through nonuse.
@tiptap/extension-placeholder
Advanced tools
@tiptap/extension-placeholder is an extension for the Tiptap editor that allows you to add placeholder text to your editor. This can be useful for providing users with guidance on what to input in the editor.
Basic Placeholder
This feature allows you to add a basic placeholder text to the editor. The placeholder text will be displayed when the editor is empty.
{"import":"import Placeholder from '@tiptap/extension-placeholder';","usage":"const editor = new Editor({\n extensions: [\n Placeholder.configure({\n placeholder: 'Start typing here...',\n }),\n ],\n});"}
Dynamic Placeholder
This feature allows you to set dynamic placeholder text based on the node type. For example, you can have different placeholder texts for headings and paragraphs.
{"import":"import Placeholder from '@tiptap/extension-placeholder';","usage":"const editor = new Editor({\n extensions: [\n Placeholder.configure({\n placeholder: ({ node }) => {\n if (node.type.name === 'heading') {\n return 'Enter a heading';\n }\n return 'Start typing here...';\n },\n }),\n ],\n});"}
Custom Placeholder Styles
This feature allows you to apply custom styles to the placeholder text by specifying a CSS class.
{"import":"import Placeholder from '@tiptap/extension-placeholder';","usage":"const editor = new Editor({\n extensions: [\n Placeholder.configure({\n placeholder: 'Start typing here...',\n emptyEditorClass: 'my-custom-placeholder',\n }),\n ],\n});"}
The draft-js-placeholder-plugin is a plugin for the Draft.js editor that provides similar functionality to @tiptap/extension-placeholder. It allows you to add placeholder text to your Draft.js editor. However, it is specific to Draft.js and may not offer the same level of customization as @tiptap/extension-placeholder.
Tiptap is a headless wrapper around ProseMirror – a toolkit for building rich text WYSIWYG editors, which is already in use at many well-known companies such as New York Times, The Guardian or Atlassian.
Documentation can be found on the Tiptap website.
Tiptap is open sourced software licensed under the MIT license.
FAQs
placeholder extension for tiptap
The npm package @tiptap/extension-placeholder receives a total of 463,383 weekly downloads. As such, @tiptap/extension-placeholder popularity was classified as popular.
We found that @tiptap/extension-placeholder demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 5 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
In an open letter, JavaScript community leaders urge Oracle to give up the JavaScript trademark, arguing that it has been effectively abandoned through nonuse.
Security News
The initial version of the Socket Python SDK is now on PyPI, enabling developers to more easily interact with the Socket REST API in Python projects.
Security News
Floating dependency ranges in npm can introduce instability and security risks into your project by allowing unverified or incompatible versions to be installed automatically, leading to unpredictable behavior and potential conflicts.