Lexical is an extensible text editor framework that provides excellent reliability, accessibility and performance.
MIT License
Published by acywatson over 1 year ago
aria-label
typo (#4229) Hao LuoPublished by zurfyx over 1 year ago
HorizontalRuleNode
(#4097) Chris MontroisaddUpdateListener
method in transforms doc (#4094) Kevin AnsfieldPublished by thegreatercurve over 1 year ago
Published by thegreatercurve over 1 year ago
Published by thegreatercurve over 1 year ago
Fix bad import into core (https://github.com/facebook/lexical/pull/3861) Dominic Gannaway
Add import/export DOM methods to YouTubeNode and improve EquationNode (https://github.com/facebook/lexical/pull/3835) Pervez Ali
Fix backspace regression (https://github.com/facebook/lexical/pull/3862) Dominic Gannaway
Fix restoreEditorState (https://github.com/facebook/lexical/pull/3856) Dominic Gannaway
Add more configuration for heading in INSERT_TABLE_COMMAND (https://github.com/facebook/lexical/pull/3843) Sebastien Ahkrin
perf(playground): load prettier and its parsers on demand in code block (https://github.com/facebook/lexical/pull/3637) Shanmughapriyan
Published by trueadm over 1 year ago
createParentElementNode
method on LexicalNode to fix copy/paste issues with clipboard (#3800) John FlocktonPublished by trueadm almost 2 years ago
Published by trueadm almost 2 years ago
Published by thegreatercurve almost 2 years ago
$applyNodeReplacement
(#3592) John FlocktonPublished by trueadm almost 2 years ago
Published by trueadm almost 2 years ago
Published by thegreatercurve almost 2 years ago
Contains several small bug fixes from the Lexical 0.7.0 release.
Published by thegreatercurve almost 2 years ago
Lexical 0.7 includes some breaking changes, including:
$cloneContents
from @lexical/selection
PlainTextPlugin
and RichTextPlugin
with regards to how placeholders are handledRichTextPlugin
no longer indents by default, use the LexicalTabIndentationPlugin
for this behavior.unstable_convertLegacyJSONEditorState
has been removed. This was always meant to be a temporary work-around to allow developers to convert their formats to the new JSON format rather than using the actual editor state internals directly.Lexical 0.7 includes performance and usability improvements. Notably, Lexical has a new internal architecture that allows for much better performance with large documents of content. Lexical also now provides a way to handle selection between blocks of content by providing an emulated cursor (make sure you add a blockCursor
theme to your editor config to use it).
Published by trueadm almost 2 years ago
Published by zurfyx almost 2 years ago
Happy halloween!
108 commits! That's 66% more than 0.5.0. This release comes with many many fixes. But let's go over the highlights first:
We just introduced a semi-automated release process for those of you who want to be at the cutting edge (looking at you Discord folks). New versions with the latest on the main branch will be pushed Monday through Friday.
You can find on NPM tagged with next
(npm i lexical@next
)
These will likely be more unstable, informal and might contain undocumented breaking changes. That said, that's what we do internally at Meta where we sync the Lexical GitHub repository onto Mercurial multiple times per week.
The possibility to do spoiler containers has been a highly requested feature. We prototyped an efficient React-agnostic playground plugin that you can find on the playground (CollapsiblePlugin). It may eventually make it to @lexical/react
https://user-images.githubusercontent.com/193447/199079683-a065cc72-f526-42d6-a8c2-2f4fe6640ba5.mov
Having seen many and very similar drag & drop implementations at Meta, we have come to the conclusion that dragging, dropping and pasting media is a fundamental piece of rich text. Hence, it is now built-in into the RichTextPlugin and you no longer have to implement your own event handling.
https://user-images.githubusercontent.com/193447/199079730-c9e6182c-64bd-4329-b536-9524c2fb3e09.mov
See the DragDropPaste playground plugin for an example on how to validate and insert your media nodes into the editor.
Safety first! React Decorators will now be independently wrapped with an ErrorBoundary and Suspense.
We found that it is very easy to miss either of them when implementing custom DecoratorNodes, and when either is missed and the component either crashes or suspends this causes the editor to be unusable.
https://user-images.githubusercontent.com/193447/199079773-f132645e-1822-497d-9768-b1694e688c7e.mov
Breaking change: you now have to provide an ErrorBoundary to RichTextPlugin (you can use ours).
import {LexicalErrorBoundary} from 'lexical/@react/LexicalErrorBoundary';
<RichTextEditor ... ErrorBoundary={LexicalErrorBoundary} />
From internal and open-source feedback, TreeView has become an indispensable tool to work with Lexical. It gives you the ability to glance over the current state and understand how plugins work with each other.
We added the namespace and the editable state, which we feel is important to complement the read-only mode version of Lexical.
Note that, while you can convert to HTML for the read-only view, Lexical size and the possibility to have high-fidelity rendering at no cost makes it a perfect candidate for to place in a read-only mode.
In any case, @im-adithya continues the work on the cross-browser extension, what will be the preferred and most complete approach for day-to-day development.
discrete
property to editor.update
to perform synchronous non-batched updates. Synchronous updates are often terrible performance-wise but there are concrete occasions where they can come useful. TL;DR be careful!getSelection
by @yongdamsh in https://github.com/facebook/lexical/pull/3162
time travel
after reaching maximum range by @shanpriyan in https://github.com/facebook/lexical/pull/3197
eslint-plugin
with rule no-optional-chaining
locally by @shanpriyan in https://github.com/facebook/lexical/pull/3233
isHighlighting
flag into object literal by @thegreatercurve in https://github.com/facebook/lexical/pull/3256
Full Changelog: https://github.com/facebook/lexical/compare/v0.5.0...v0.6.0
Thank you open-source community for helping us shape yet another version! Happy halloween and back to coding 👨💻
Published by zurfyx about 2 years ago
v0.5.0 (20 days after v0.4.0) comes with a meaty set of features, API refinements and bugfixes.
One of the most beloved features of Notion is the ability to seamlessly move blocks within the same document. @LuciNyan has ported this behavior to Lexical under the DraggableBlockPlugin name. You can check it out in our playground!
We started our tables (@lexical/react/LexicalTablePlugin) development at the start of the year, one of the most ambitious and complex plugins we have built for rich text. We have blocked a good amount of time during this past month to work with multiple internal teams to identify and squash most of these (10+) high-pri bugs that make the experience unideal and we believe they are now in a good shape to meet their first internal users.
We have introduced a new advanced concept for Lexical ElementNodes: [Shadow Root](https://lexical.dev/docs/api/classes/lexical.ElementNode#isshadowroot)
. A Shadow Root is a Node that behaves like a root (we stole the name from Shadow DOM). This method enables you to have complex deep rich text hierarchies where children node shouldn't see beyond the parent. For example, the cell node content.
We introduced a seamless way to handle node insertion. We bundled {rangeSelection/nodeSelection/gridSelection}.insertNode
into just one method: $insertNodes
. We also added insertNodes support for NodeSelection and GridSelection that was previously not supported.
https://user-images.githubusercontent.com/193447/178761488-d39987f7-2a90-4604-b4fc-dfbf57178f35.mov
initialEditorState
. We found that this is unintuitive to handle nested editors and harder to control SSR-enabled pages. Instead, MLCComposer will take and apply the initialEditorState
on editor creationlexical
package, it serves a very specific use case and it's redundant for plain text.We listened to your (mostly Discord) feedback, you want to have the latest, more frequently, especially when some of you are heavily involved into the development and growth of the Lexical framework.
The reality is, we didn't choose to postpone releases for 2 weeks. It has mostly been a lack of automation and making sure we bundle breaking API changes to avoid developer churn.
We know that there's no one-size-fits-all when it comes to developers, and that's why we want to offer different ways to play with the library, what we have now, a slow-ish but less time-consuming (for you) release cycle but also offer nightly releases that would happen automatically once per day and would include the very latest of the development.
The work is still under development but we plan to start this soon, stay tuned!
Full Changelog: https://github.com/facebook/lexical/compare/v0.4.1...v0.5.0
Thank you open-source community for your help shaping this brand new release, either via direct PR contributions, feedback or bug reports!
Published by acywatson about 2 years ago
editor.isReadyOnly -> editor.isEditable()
editor.setReadyOnly -> editor.setEditable()
editor.registerReadOnlyListener -> editor.registerEditableListener()
editor config { readOnly: true } -> { editable: boolean }
https://github.com/facebook/lexical/pull/2912
The "dependencies" property is now required for custom markdown Element and TextMatch Transformers. It takes an array of LexicalNode subclasses and
asserts that they're available in the editor when transforms are registered.
https://github.com/facebook/lexical/pull/2910
Lexical will now track and update selection in response to DOM selectionchange events when editor.isEditable is false. This is necessary for enabling some behavior
such as commenting via marks, but may cause other indirect changes such as update listeners firing when they didn't previously.
addTransform
with registerNodeTransform
in transforms doc (#2882) Kevin AnsfieldFull Changelog: https://github.com/facebook/lexical/compare/v0.3.9...v0.4.0
Published by zurfyx about 2 years ago
Most notably:
Commits:
timeoutId
type (#2735) Shanmughapriyan S@lexical/code
into more atomic modules (#2673) John FlocktonstartTransition
if it's present (#2676) Jack HanfordPublished by acywatson over 2 years ago
Lots of bug fixes.
Introduces TypeaheadPlugin and associated primitives, which consolidate the implementation of all such functionality (mentions and component picker) and create a base to build similar typeahead functionality from.
Introduces TableOfContents plugin for easier navigation of long-form documents. Available in the playground in the settings menu (bottom-left corner).
Introduces a "clipboard viewer" functionality in the local dev environment. When active, it shows the clipboard content the last time the paste event was fired with the editor focused.
Published by zurfyx over 2 years ago
Lots of bug fixes and polish. Notably, the full text of minifed Lexical error codes can now be accessed via the Lexical website.
lexical.dev/error/<code>
(#2574) Gerard Rovira