Changelog

this is a list of changes to slate with each new release until 1 0 is released, breaking changes will be added as minor version bumps, and smaller, patch level changes won't be noted since the library is moving quickly while in beta ⚠️ until https //github com/atlassian/changesets/issues/264 is solved, each package will maintain its own individual changelog, which you can find here https //github com/ianstormtaylor/slate/tree/71ff94c8d866a3ad9582ec4b84258d99d508fd70/packages/slate/changelog md https //github com/ianstormtaylor/slate/tree/71ff94c8d866a3ad9582ec4b84258d99d508fd70/packages/slate history/changelog md https //github com/ianstormtaylor/slate/tree/71ff94c8d866a3ad9582ec4b84258d99d508fd70/packages/slate hyperscript/changelog md https //github com/ianstormtaylor/slate/tree/71ff94c8d866a3ad9582ec4b84258d99d508fd70/packages/slate react/changelog md 0 61 — march 29, 2021 breaking new customtypes for editor, element, text and other implementation specific objects improved typing with typescript lets you add customtypes for the slate editor this change requires you to set up your types at the start it's a new concept so please read the new typescript documentation here https //docs slatejs org/concepts/11 typescript 0 60 — november 24, 2020 breaking introduced new customizable typescript typings you can override the built in types to extend them for your own editor's domain model however the changes to make this possible likely resulted in some changes to the existing type contracts the useeditor hook was renamed to useslatestatic this was done to better differentiate between the useslate hook and to make it clear that the static version will not re render when changes occur 0 59 — september 24, 2020 there were no breaking changes or new additions in this release 0 58 — may 5th, 2020 breaking user properties on elements and texts now have an unknown type instead of any previously, the arbitrary user defined keys on the text and element interface had a type of any which effectively removed any potential type checking on those properties now these have a type of unknown so that type checking can be done by consumers of the api when they are applying their own custom properties to the text s and element s 0 57 — december 18, 2019 breaking overridable commands now live directly on the editor object previously the command concept was implemented as an interface that was passed into the editor exec function, allowing the "core" commands to be overridden in one place but this introduced a lot of redux like indirection when implementing custom commands that wasn't necessary because they are never overridden instead, now the core actions that can be overridden are implemented as individual functions on the editor (eg editor inserttext ) and they can be overridden just like any other function (eg isvoid ) previously to override a command you'd do const withplugin = editor => { const { exec } = editor editor exec = command => { if (command type === 'insert text') { const { text } = command if (mycustomlogic) { // return } } exec(command) } return editor } now, you'd override the specific function directly const withplugin = editor => { const { inserttext } = editor editor inserttext = text => { if (mycustomlogic) { // return } inserttext(text) } return editor } you shouldn't ever need to call these functions directly! they are there for plugins to tap into, but there are higher level helpers for you to call whenever you actually need to invoke them read on… transforms now live in a separate namespace of helpers previously the document and selection transformation helpers were available directly on the editor interface as editor but these helpers are fairly low level, and not something that you'd use in your own codebase all over the place, usually only inside specific custom helpers of your own to make room for custom userland commands, these helpers have been moved to a new transforms namespace previously you'd write editor unwrapnodes(editor, ) now you'd write transforms unwrapnodes(editor, ) the command interfaces were removed as part of those changes, the existing command , corecommand , historycommand , and reactcommand interfaces were all removed you no longer need to define these "command objects", because you can just call the functions directly plugins can still define their own overridable commands by extending the editor interface with new functions the slate react plugin does this with insertdata and the slate history plugin does this with undo and redo new user action helpers now live directly on the editor interface these are taking the place of the existing transforms helpers that were moved these helpers are equivalent to user actions, and they always operate on the existing selection there are some defined by core, but you are likely to define your own custom helpers that are specific to your domain as well for example, here are some of the built in actions editor inserttext(editor, 'a string of text') editor deleteforward(editor) editor deletebackward(editor, { unit 'word' }) editor addmark(editor, 'bold', true) editor insertbreak(editor) every one of the old "core commands" has an equivalent editor helper exposed now however, you can easily define your own custom helpers and place them in a namespace as well const myeditor = { editor, insertparagraph(editor) { }, toggleboldmark(editor) { }, formatlink(editor, url) { }, } whatever makes sense for your specific use case! 0 56 — december 17, 2019 breaking the format text command is split into add mark and remove mark although the goal is to keep the number of commands in core to a minimum, having this as a combined command made it very hard to write logic that wanted to guarantee to only ever add or remove a mark from a text node now you can be guaranteed that the add mark command will only ever add custom properties to text nodes, and the remove mark command will only ever remove them previously you would write editor exec({ type 'format text', properties { bold true }, }) now you would write if (isactive) { editor exec({ type 'remove mark', key 'bold' }) } else { editor exec({ type 'add mark', key 'bold', value true }) } 🤖 note that the "mark" term does not mean what it meant in 0 47 and earlier it simply means formatting that is applied at the text level—bold, italic, etc we need a term for it because it's such a common pattern in richtext editors, and "mark" is often the term that is used for example the \<mark> tag in html the node text helper was renamed to node string this was simply to reduce the confusion between "the text string" and "text nodes" the helper still just returns the concatenated string content of a node 0 55 — december 15, 2019 breaking the match option must now be a function previously there were a few shorthands, like passing in a plain object this behavior was removed because it made it harder to reason about exactly what was being matched, it made debugging harder, and it made it hard to type well now the match option must be a function that receives the node object to match if you're using typescript, and the function you pass in is a type guard, that will be taken into account in the return value! previously you might write editor nodes(editor, { at range, match 'text', }) editor nodes(editor, { at range, match { type 'paragraph' }, }) now you'd write editor nodes(editor, { at range, match text istext, }) editor nodes(editor, { at range, match node => node type === 'paragraph', }) the mode option now defaults to 'lowest' previously the default varied depending on where in the codebase it was used now it defaults to 'lowest' everywhere, and you can always pass in 'highest' to change the behavior the one exception is the editor nodes helper which defaults to 'all' since that's the expected behavior most of the time the editor match helper was renamed to editor above this was just to make it clear how it searched in the tree—it looks through all of the nodes directly above a location in the document the editor above/previous/next helpers now take all options in a dictionary previously their apis did not exactly match the editor nodes helper which they are shorthand for, but now this is no longer the case the at , match and mode options are all passed in the options argument previously you would use editor previous(editor, path, n => text istext(n), { mode 'lowest', }) now you'd use editor previous(editor, { at path, match n => text istext(n), mode 'lowest', }) the editor elements and editor texts helpers were removed these were simple convenience helpers that were rarely used you can now achieve the same thing by using the editor nodes helper directly along with the match option for example editor nodes(editor, { at range, match element iselement, }) 0 54 — december 12, 2019 breaking the \<slate> onchange handler no longer receives the selection argument previously it received (value, selection) , now it receives simply (value) instead, you can access any property of the editor directly (including the value as editor children ) the value/onchange convention is provided purely for form related use cases that expect it this is along with the change to how extra props are "controlled" by default they are uncontrolled, but you can pass in any of the other top level editor properties to take control of them the command and corecommand interfaces have been split apart previously you could access command iscorecommand , however now this helper lives directly on the core command interface as corecommand iscorecommand this makes it more symmetrical with userland commands command checkers have been simplified previously slate exposed command checking helpers like command isinserttextcommand however these were verbose and not useful most of the time instead, you can now check for corecommand iscorecommand and then use the command type property to narrow further this keeps core more symmetrical with how userland will implement custom commands new the \<slate> component is now pseudo controlled it requires a value= prop to be passed in which is controlled however, the selection , marks , history , or any other props are not required to be controlled they default to being uncontrolled if your use case requires controlling these extra props you can pass them in and they will start being controlled again this change was made to make using slate easier, while still allowing for more complex state to be controlled by core or plugins going forward—state that users don't need to concern themselves with most of time the editor now has a marks property this property represents text level formatting that will be applied to the next character that is inserted this is a common richtext editor behavior, where pressing a bold button with a collapsed selection turns on "bold" formatting mode, and then typing a character becomes bold this state isn't stored in the document, and is instead stored as an extra property on the editor itself 0 53 — december 10, 2019 breaking the slate schema package has been removed! this decision was made because with the new helpers on the editor interface, and with the changes to normalizenode in the latest version of slate, adding constraints using normalizenode actually leads to more maintainable code than using slate schema previously it was required to keep things from getting too unreadable, but that always came at a large cost of indirection and learning additional apis everything you could do with slate schema you can do with normalizenode , and more node matching functions now receive just a node previously they received a nodeentry tuple, which consisted of \[node, path] however now they receive only a node argument, which makes it easier to write one off node checking helpers and pass them in directly as arguments if you need to ensure a path, lookup the node first a few unnecessary helpers were removed there were a handful of leftovers helpers that were not used anywhere in slate's core logic, and were very unlikely to be used in userland, so they've been removed to reduce bundle size you are always free to re implement them if you truly need them the list of helpers removed is editor ancestor node closest node furthest range exists range israngelist range israngemap 0 52 — december 5, 2019 breaking the slate schema package now exports a factory previously you imported the withschema function directly from the package, and passed in your schema rules when you called it however, now you import the defineschema factory instead which takes your schema rules and returns a custom withschema plugin function this way you can still use helpers like compose with the plugin, while pre defining your custom rules the properties validation in the schema is now exhaustive previously a properties validation would check any properties you defined, and leave any unknown ones as is this made it hard to be certain about which properties would end up on a node now any non defined properties are considered invalid and using an empty {} validation would ensure that there are no custom properties at all new the leaves schema validation ensures text level formatting you can use it from any higher up element node in the tree, to guarantee that it only contains certain types of text level formatting on its inner text nodes for example you could use it to ensure that a code block doesn't allow any of its text to be bolded or italicized 0 51 — december 5, 2019 breaking the mark interface has been removed! previously text level formatting was stored in an array of unique marks now that same formatting is stored directly on the text nodes themselves for example instead of { text 'a line of text ', marks \[{ type 'bold' }], } you now have { text 'a line of text ', bold true, } and the marks are added and removed from the text nodes using the same editor setnodes transform that you use for toggling formatting on block and inline nodes this greatly simplifies things and makes slate's core even smaller the \<slate> component is now a "controlled" component this makes things a bit more react ish, and makes it easier to update the editor's value when new data is received after the initial render to arrive at the previous "uncontrolled" behavior you'll need to implement it in userland using react's built in hooks whereas previously you would do \<slate defaultvalue={initialvalue}> \</slate> now you must manage the value and selection yourself, like const \[value, setvalue] = usestate(initialvalue) const \[selection, setselection] = usestate(null) \<slate value={value} selection={selection} onchange={(value, selection) => { setvalue(value) setselection(selection) }} \> \</slate> 0 50 — november 27, 2019 breaking a complete overhaul the slate codebase has had a complete overhaul and many pieces of its core architecture have been reconsidered from the ground up there are lots of changes we recommend re reading the https //docs slatejs org/walkthroughs and https //docs slatejs org/concepts documentation and the https //github com/ianstormtaylor/slate/tree/71ff94c8d866a3ad9582ec4b84258d99d508fd70/site/examples/readme md to get a sense for everything that has changed as well as the https //docs slatejs org/concepts/xx migrating writeup for what the major changes are ⚠ warning changes past this point refer to the older slate architecture, based on immutable js and without typescript many things are different in the older architecture and may not apply to the newer one 0 47 — may 8, 2019 new introducing the annotation model this is very similar to what used to be stored in value decorations , except they also contain a unique "key" to be identified by they can be used for things like comments, suggestions, collaborative cursors, etc { object 'annotation', key string, type string, data map, anchor point, focus point, } there are three new annotation operations the set of operations now includes add annotation , remove annotation and set annotation they are similar to the existing mark operations introducing "iterable" model methods this introduces several iteratable producing methods on the element interface, which document , block and inline all implement there are iterables for traversing the entire tree element blocks(options) element descendants(options) element inlines(options) element texts(options) element ancestors(path, options) element siblings(path, options) you can use them just like the native javascript iterables for example, you can loop through the text nodes after a specific node for (const next of document texts({ path start path })) { const \[node, path] = next // do something with the text node or its path } or you can traverse all of the "leaf" blocks for (const \[block] of document blocks({ onlyleaves true })) { // } and because these iterations use native for/of loops, you can easily break or return out of the loops directly—a much nicer dx than remembering to return false breaking the value decorations property is now value annotations following with the split of decorations into annotations, this property was also renamed they must now contain unique key properties, as they are stored as a map instead of a list this allows for much more performant updates the decoration model no longer has a nested mark property previously a real mark object was used as a property on decorations, but now the type and data properties are first class properties instead { object 'decoration', type string, data map, anchor point, focus point, } 0 46 — may 1, 2019 breaking mark operations no longer have offset or length properties since text nodes now contain a unique set of marks, it wouldn't make sense for a single mark related operation to result in a splitting of nodes instead, when a mark is added to only part of a text node, it will result in a split node operation as well as an add mark operation text operations no longer have a marks property previously it was used to add text with a specific set of marks however this is no longer necessary, and when text is added with marks it will result in an insert text operation as well as an add mark operation using text create or text createlist with a leaves property will error now that text nodes no longer have leaves, you will need to pass in the text string and marks directly when creating a new text node (however, you can still create entire values using value create in a backwards compatible way for convenience while migrating ) // this works, although deprecated, which is the common case value create(oldvaluejson) // but this will error! text create(oldtextjson) value tojson returns the new data model format, without leaves although value fromjson and value create allow the old format in deprecated mode, calling value tojson will return the new data format if you still need the old one you'll need to iterate the document tree converting text nodes yourself the low level value and node mutation methods have changed these changes follow the operation signature changes, since the methods take the same arguments as the operations themselves for example // previously value addmark(path, offset, length, mark) // is now value addmark(path, mark) these are low level methods, so this change shouldn't affect the majority of use cases deprecated initializing editors with text nodes with a leaves property is deprecated in this new version of slate, creating a new value with value create with the old leaf data model is still allowed for convenience in migration, but it will be removed in a coming version (however, using the low level text create will throw an error!) // this works, although deprecated, which is the common case value create(oldvaluejson) // but this will error! text create(oldtextjson) 0 45 — april 2, 2019 breaking a few properties of operation objects have changed in an effort to standardize and streamline operations, their properties have changed this won't affect 90% of use cases, since operations are usually low level concerns however, if you are using operational transform or some other low level parts of slate, this may affect you the value , selection , node , and mark properties—which contained references to immutable js objects—have all been removed in their place, we have standardized a properties and newproperties pair this will greatly reduce the size of operations stored in memory, and makes dealing with them easier when serialized as well 0 44 — november 8, 2018 new introducing the child min invalid and child max invalid schema errors these new schema errors map directly to the mix and max schema rule definitions, and make it easier to determine exactly what your normalization logic needs to do to fix the document added new node retrieval methods there are three new methdos for node retrieval the first is getnodesatrange which will retrieve all of the nodes in the tree in a given range and the second two are getrootblocksatrange and getrootinlinesatrange for retrieving the top most blocks or inlines in a given range these should be helpful in defining your own command logic breaking schema errors for min and max rules have changed previously they would result in errors of child required , child object invalid , child type invalid and child unknown now that we have the new child min invalid and child max invalid errors, these schema rules will return them instead, making it much easier to determine exactly which rule is causing a schema error deprecated the getblocksatrange and getinlinesatrange methods have been renamed to clear up confusion about which blocks and inlines are retrieve in the case of nesting, these two methods have been renamed to getleafblocksatrange and getleafinlinesatrange to clarify that they retrieve the bottom most nodes and now there are two additional methods called getrootblocksatrange and getrootinlinesatrange for cases where you want the top most nodes instead 0 43 — october 27, 2018 new the editor command and editor query methods can take functions previously they only accepted a type string and would look up the command or query by type now, they also accept a custom function this is helpful for plugin authors, who want to accept a "command option", since it gives users more flexibility to write one off commands or queries for example a plugin could be passed either hotkey({ hotkey 'cmd+b', command 'addboldmark', }) or a custom command function hotkey({ hotkey 'cmd+b', command editor => editor addboldmark() movetoend(), }) breaking the change object has been removed the change object as we know it previously has been removed, and all of its behaviors have been folded into the editor controller this includes the top level commands and queries methods, as well as methods like applyoperation and normalize all places that used to receive change now receive editor , which is api equivalent changes are now flushed to onchange asynchronously previously this was done synchronously, which resulted in some strange race conditions in react environments now they will always be flushed asynchronously, just like setstate the normalize and validate middleware signatures have changed! previously the normalize and validate middleware was passed (node, next) however now, for consistency with the other middleware they are all passed (node, editor, next) this way, all middleware always receive editor and next as their final two arguments the editor event method has been removed previously this is what you'd use when writing tests to simulate events being fired—which were slightly different to other running other middleware with the simplification to the editor and to the newly consistent middleware signatures, you can now use editor run directly to simulate events editor run('onkeydown', { key 'tab', }) deprecated the editor change method is deprecated with the removal of the change object, there's no need anymore to create the small closures with editor change() instead you can directly invoke commands on the editor in series, and all of the changes will be emitted asynchronously on the next tick editor inserttext('word') movefocusforward(10) addmark('bold') the applyoperations method is deprecated instead you can loop a set of operations and apply each one using applyoperation this is to reduce the number of methods exposed on the editor to keep it simpler the change call method is deprecated previously this was used to call a one off function as a change method now this behavior is equivalent to calling editor command(fn) instead 0 42 — october 9, 2018 new introducing the editor controller previously there was a vague editor concept, that was the react component itself this was helpful, but because it was tightly coupled to react and the browser, it didn't lend itself to non browser use cases well this meant that the line between "model" and "controller/view" was blurred, and some concepts lived in both places at once, in inconsistent ways a new editor controller now makes this relationship clear it borrows many of its behaviors from the react \<editor> component and the component actually just instantiates its own plain javascript editor under the covers to delegate the work to this new concept powers a lot of the thinking in this new version, unlocking a lot of changes that bring a clearer separation of responsibilities to slate it allows us to create editors in any environment, which makes server side use cases easier, brings parity to testing, and even opens us up to supporting other view layers like react native or vue js in the future it has a familiar api, based on the existing editor concept const editor = new editor({ plugins, value, onchange }) editor change(change => { }) however it also introduces imperative methods to make testing easier editor run('rendernode', props) editor event('onkeydown', event) editor command('addmark', 'bold') editor query('isvoid', node) i'm very excited about it, so i hope you like it! introducing the "commands" concept previously, "change methods" were treated in a first class way, but plugins had no easy way to add their own change methods that were reusable elsewhere and they had no way to override the built in logic for certain commands, for example splitblock or inserttext however, now this is all customizable by plugins, with the core slate plugin providing all of the previous default commands const plugin = { commands { wrapquote(change) { change wrapblock('quote') }, }, } those commands are then available directly on the change objects, which are now editor specific change wrapquote() this allows you to define all of your commands in a single, easily testable place and then "behavioral" plugins can simply take command names as options, so that you have full control over the logic they trigger introducing the "queries" concept similarly to the commands, queries allow plugins to define specific behaviors that the editor can be queried for in a reusable way, to be used when rendering buttons, or deciding on command behaviors, etc for example, you might define an getactivelist query const plugin = { queries { getactivelist(editor) {}, }, } and then be able to re use that logic easily in different places in your codebase, or pass in the query name to a plugin that can use your custom logic itself const list = change getactivelist() if (list) { } else { } taken together, commands and queries offer a better way for plugins to manage their inter dependencies they can take in command or query names as options to change their behaviors, or they can export new commands and queries that you can reuse in your codebase the middleware stack is now deferrable with the introduction of the editor controller, the middleware stack in slate has also been upgraded each middleware now receives a next function (similar to express or koa) that allows you to choose whether to iterating the stack or not // previously, you'd return `undefined` to continue function onkeydown(event, editor, next) { if (event key !== 'enter') return } // now, you call `next()` to continue function onkeydown(event, editor, next) { if (event key !== 'enter') return next() } while that may seem inconvenient, it opens up an entire new behavior, which is deferring to the plugins later in the stack to see if they "handle" a specific case, and if not, handling it yourself function onkeydown(event, editor, next) { if (event key === 'enter') { const handled = next() if (handled) return handled // otherwise, handle `enter` yourself } } this is how all of the core logic in slate react is now implemented, eliminating the need for a "before" and an "after" plugin that duplicate logic under the covers, the schema , commands and queries concept are all implemented as plugins that attach varying middleware as well for example, commands are processed using the oncommand middleware under the covers const plugin = { oncommand(command, editor, next) { } } this allows you to actually listen in to all commands, and override individual behaviors if you choose to do so, without having to override the command itself this is a very advanced feature, which most people won't need, but it shows the flexibility provided by migrating all of the previously custom internal logic to be based on the new middleware stack plugins can now be defined in nested arrays this is a small addition, but it means that you no longer need to differentiate between individual plugins and multiple plugins in an array this allows plugins to be more easily composed up from multiple other plugins themselves, without the end user having to change how they use them small, but encourages reuse just a little bit more deprecated the slate simulator is deprecated previously this was used as a pseudo controller for testing purposes however, now with the new editor controller as a first class concept, everything the simulator could do can now be done directly in the library this should make testing in non browser environments much easier to do breaking the value object is no longer tied to changes previously, you could create a new change by calling value change() and retrieve a new value with the re architecture to properly decouple the schema, commands, queries and plugins from the core slate data models, this is no longer possible instead, changes are always created via an editor instance, where those concepts live // instead of const { value } = this state const change = value change() this onchange(change) // you now would do this editor change(change => { const { value } = change }) sometimes this means you will need to store the react ref of the editor to be able to access its editor change method in your react components remove the stack "model", in favor of the new editor previously there was a pseudo model called the stack that was very low level, and not really a model this concept has now been rolled into the new editor controller, which can be used in any environment because it's just plain javascript there was almost no need to directly use a stack instance previously, so this change shouldn't affect almost anyone remove the schema "model", in favor of the new editor previously there was another pseudo model called the schema , that was used to contain validation logic all of the same validation features are still available, but the old schema model is now rolled into the editor controller as well, in the form of an internal schemaplugin that isn't exposed remove the schema isvoid and schema isatomic in favor of queries previously these two methods were used to query the schema about the behavior of a specific node or decoration now these same queries as possible using the "queries" concept, and are available directly on the change object if (change isvoid(node)) { } the middleware stack must now be explicitly continued, using next previously returning undefined from a middleware would (usually) continue the stack onto the next middleware now, with middleware taking a next function argument you must explicitly decide to continue the stack by call next() yourself remove the history model, in favor of commands previously there was a history model that stored the undo/redo stacks, and managing saving new operations to those stacks all of this logic has been folded into the new "commands" concept, and the undo/redo stacks now live in value data this has the benefit of allowing the history behavior to be completely overridable by userland plugins, which was not an easy feat to manage before values can no longer be normalized on creation with the decoupling of the data model and the plugin layer, the schema rules are no longer available inside the value model this means that you can no longer receive a "normalized" value without having access to the editor and its plugins // while previously you could attach a `schema` to a value const normalized = value create({ , schema }) // now you'd need to do that with the `editor` const value = value create({ }) const editor = new editor({ value, plugins \[{ schema }] }) const normalized = editor value while this seems inconvenient, it makes the boundaries in the api much more clear, and keeps the immutable and mutable concepts separated this specific code sample gets longer, but the complexities elsewhere in the library are removed the change class is no longer exported changes are now editor specific, so exporting the change class no longer makes sense instead, you can use the editor change() api to receive a new change object with the commands and queries specific to your editor's plugins the getclosestvoid , getdecorations and hasvoidparent method now take an editor previously these node methods took a schema argument, but this has been replaced with the new editor controller instead now that the schema model has been removed 0 41 — september 21, 2018 deprecated the withoutnormalization helper has been renamed to withoutnormalizing this is to stay consistent with the new helpers for withoutsaving and withoutmerging breaking the the "operation flags" concept was removed this was a confusing concept that was implemented in multiple different ways and led to the logic around normalizing, saving, and merging operations being more complex than it needed to be these flags have been replaced with three simpler helper functions withoutnormalizing , withoutsaving and withoutmerging change withoutnormalizing(() => { nodes foreach(node => change removenodebykey(node key)) }) change withoutsaving(() => { change setvalue({ decorations }) }) this means that you no longer use the { normalize false } or { save false } options as arguments to individual change methods, and instead use these new helper methods to apply these behaviors to groups of changes at once the "normalize" change methods have been removed previously there were a handful of different normalization change methods like normalizenodebypath , normalizeparentbykey , etc these were confusing because it put the onus on the implemented to know exact which nodes needed to be normalized they have been removed, and implementers no longer ever need to worry about which specific nodes to normalize, as slate will handle that for them the internal refindnode and refindpath methods were removed these should never have been exposed in the first place, and are now no longer present on the element interface these were only used internally during the normalization process 0 40 — august 22, 2018 breaking remove all previously deprecated code paths this helps to reduce some of the complexity in slate by not having to handle these code paths anymore and it helps to reduce file size when upgrading, it's highly recommended that you upgrade to the previous version first and ensure there are no deprecation warnings being logged, then upgrade to this version 0 39 — august 22, 2018 new introducing the range model and interface previously the "range" concept was used in multiple different places, for the selection, for decorations, and for acting on ranges of the document this worked okay, but it was hiding the underlying system which is that range is really an interface that other models can choose to implement now, we still use the range model for referencing parts of the document, but it can also be implemented by other models that need to attach more semantic meaning introducing the decoration and selection models these two new models both implement the new range interface where previously they had to mis use the range model itself with added semantics this just cleans up some of the confusion around overlapping properties, and allows us to add even more domain specific methods and properties in the future without trouble breaking decorations have changed! previously, decorations piggybacked on the range model, using the existing marks property, and introducing their own isatomic property however, they have now been split out into their own decoration model with a single mark and with the isatomic property controlled by the schema what previously would have looked like range create({ anchor { }, focus { }, marks \[{ type 'highlight' }], isatomic true, }) is now decoration create({ anchor { }, focus { }, mark { type 'highlight' }, }) each decoration maps to a single mark object and the atomicity of the mark controlled in the schema instead, for example const schema = { marks { highlight { isatomic true, }, }, } the range model has reduced semantics previously, since all decorations and selections were ranges, you could create ranges with an isfocused , isatomic or marks properties now range objects are much simpler, offering only an anchor and a focus , and can be extended by other models implementing the range interface however, this means that using range create or document createrange might not be what you want anymore for example, for creating a new selection, you used to use const selection = document createrange({ isfocused true, anchor { }, focus { }, }) but now, you'll need to use document createselection instead const selection = document createselection({ isfocused true, anchor { }, focus { }, }) the value decorations property is no longer nullable previously when no decorations were applied to the value, the decorations property would be set to null now it will be an empty list object, so that the interface is more consistent deprecated the node createchildren static method is deprecated this was just an alias for node createlist and wasn't necessary you can use node createlist going forward for the same effect the renderportal property of plugins is deprecated this allows slate react to be slightly slimmer, since this behavior can be handled in react 16 with the new \<react fragment> using the rendereditor property instead, in a way that offers more control over the portal behavior the data property of plugins is deprecated this property wasn't well designed and circumvented the core tenet that all changes to the value object will flow through operations inside change objects it was mostly used for view layer state which should be handled with react specific conventions for state management instead 0 38 — august 21, 2018 deprecated node isvoid access is deprecated previously the "voidness" of a node was hardcoded in the data model soon it will be determined at runtime based on your editor's schema this deprecation just ensures that you aren't using the node isvoid property which will not work in future verisons what previously would have been if (node isvoid) { } now becomes if (schema isvoid(node)) { } this requires you to have a reference to the schema object, which can be access as value schema value isfocused/isblurred and value hasundos/hasredos are deprecated these properties are easily available via value selection and value history instead, and are now deprecated to reduce the complexity and number of different ways of doing things 0 37 — august 3, 2018 new introducing the point model ranges are now built up of two point models—an anchor and a focus —instead of having the properties set directly on the range itself this makes the "point" concept first class in slate and better api's can be built around point objects point create({ key 'a', path \[0, 0], offset 31, }) these points are exposed on range objects via the anchor , focus , start and end properties const { anchor, focus } = range change removenodebykey(anchor key) these replace the earlier anchorkey , anchoroffset , etc properties document createrange creates a relative range previously you'd have to use range create and make sure that you passed valid arguments, and ensure that you "normalized" the range to sync its keys and paths this is no longer the case, since the createrange method will do it for you const range = document createrange({ anchor { key 'a', offset 1, }, focus { key 'a', offset 4, }, }) this will automatically ensure that the range references leaf text nodes, and that its anchor and focus paths are set document createpoint creates a relative point just like the createrange method, createpoint will create a point that is guaranteed to be relative to the document itself this is often a lot easier than using point create directly const anchor = document createpoint({ key 'a', offset 1, }) breaking the range focus method was removed (not change focus !) this was necessary to make way for the new range focus point property usually this would have been done in a migration friendly way like the rest of the method changes in this release, but this was an exception however the change focus() method is still available and works as expected range set and range merge are dangerous if you were previously using the super low level immutable js methods range set or range merge with any of the now removed properties of ranges, these invocations will fail instead, you should use the range set helpers going forward which can be migrated with deprecations warnings instead of failing outright the offset property of points defaults to null previously it would default to 0 but that could be confusing because it made no distinction from a "set" or "unset" offset now they default to null instead this shouldn't really affect any real world usage of slate the range tojson() structure has changed with the introduction of points, the range now returns its anchor and focus properties as nested point json objects instead of directly as properties for example { "object" "range", "anchor" { "object" "point", "key" "a", "offset" 1, "path" \[0, 0] }, "focus" { "object" "point", "key" "a", "offset" 3, "path" \[0, 0] }, "isatomic" false, "isfocused" false, "marks" \[] } deprecated the selection based shorts on value were deprecated previously you could access things like anchorkey , startoffset and iscollapsed directly on value objects this results in extra duplication that is hard to maintain over time, and hard for newcomers to understand, without much benefit all of these properties are deprecated and should be accessed on the value selection object directly instead the range methods were standardized, with many deprecated the methods on range objects had grown drastically in size many of them weren't consistently named, or overlapped in unnecessary ways with the introduction of point objects a lot of these methods could be cleaned up and their logic delegated to the points directly all of these methods remain available but will raise deprecation warnings, making it easier to upgrade there's a very good chance you're only using a handful of them in your codebase either way, all of them will log warnings for an example of migrating see https //github com/ianstormtaylor/slate/pull/2035/commits/1bc560ab6242bc015c9f6d3bd20086f18849f8b7 here's a full list of the newly deprecated methods and properties, and their new alternative if one exists anchorkey > anchor key anchoroffset > anchor offset anchorpath > anchor path blur > setisfocused collapseto > moveto collapsetoanchor > movetoanchor collapsetoend > movetoend collapsetoendof > movetoendofnode collapsetofocus > movetofocus collapsetostart > movetostart collapsetostartof > movetostartofnode deselect > range create endkey > end key endoffset > end offset endpath > end path extend > movefocus extendto > movefocusto extendtoendof > movefocustoendofnode extendtostartof > movefocustostartofnode focuskey > focus key focusoffset > focus offset focuspath > focus path hasanchoratendof > anchor isatendofnode hasanchoratstartof > anchor isatstartofnode hasanchorbetween > hasanchorin > anchor isinnode hasedgeatendof > anchor isatendofnode || focus isatendofnode hasedgeatstartof > anchor isatstartofnode || focus isatstartofnode hasedgebetween > hasedgein > anchor isinnode || focus isinnode hasendatendof > end isatendofnode hasendatstartof > end isatendofnode hasendbetween > hasendin > end isinnode hasfocusatendof > focus isatendofnode hasfocusatstartof > focus isatstartofnode hasfocusbetween > hasfocusin > focus isinnode hasstartatendof > start isatendofnode hasstartatstartof > start isatstartofnode hasstartbetween > hasstartin > start isinnode isatendof > iscollapsed && anchor isatendofnode isatstartof > iscollapsed && anchor isatstartofnode move > moveforward/backward moveanchor > moveanchorforward/backward moveanchoroffsetto > moveanchorto moveanchoroffsetto > moveanchorto moveanchortoendof > moveanchortoendofnode moveanchortostartof > moveanchortostartofnode moveend > moveendforward/backward moveendoffsetto > moveendto movefocus > movefocusforward/backward movefocusoffsetto > movefocusto movefocusoffsetto > movefocusto movefocustoendof > movefocustoendofnode movefocustostartof > movefocustostartofnode moveoffsetsto > moveanchorto && movefocusto movestart > movestartforward/backward movestartoffsetto > movestartto movetoendof > movetoendofnode movetorangeof > movetorangeofnode movetostartof > movetostartofnode startkey > start key startoffset > start offset startpath > start path the selection based changes were standardized, with many deprecated similarly to the range method deprecations, the same confusion and poor naming choices existed in the change methods that dealt with selections many of them have been renamed for consistency, or deprecated when alternatives existed all of these methods remain available but will raise deprecation warnings, making it easier to upgrade there's a very good chance you're only using a handful of these change methods in your codebase either way, all of them will log warnings for an example of migrating see https //github com/ianstormtaylor/slate/pull/2035/commits/1bc560ab6242bc015c9f6d3bd20086f18849f8b7 here's a full list of the newly deprecated changed methods, and their new alternative if one exists collapsecharbackward > movebackward collapsecharforward > moveforward collapselinebackward > movetostartofblock collapselineforward > movetoendofblock collapseto > moveto collapsetoanchor > movetoanchor collapsetoend > movetoend collapsetoendof > movetoendofnode collapsetoendofblock > movetoendofblock collapsetoendofnextblock > movetoendofnextblock collapsetoendofnexttext > movetoendofnexttext collapsetoendofpreviousblock > movetoendofpreviousblock collapsetoendofprevioustext > movetoendofprevioustext collapsetofocus > movetofocus collapsetostart > movetostart collapsetostartof > movetostartofnode collapsetostartofblock > movetostartofblock collapsetostartofnextblock > movetostartofnextblock collapsetostartofnexttext > movetostartofnexttext collapsetostartofpreviousblock > movetostartofpreviousblock collapsetostartofprevioustext > movetostartofprevioustext extend > movefocusforward/backward extendcharbackward > movefocusbackward extendcharforward > movefocusforward extendlinebackward > movefocustostartofblock extendlineforward > movefocustoendofblock extendto > movefocusto extendtoendof > movefocustoendofnode extendtoendofblock > movefocustoendofblock extendtoendofnextblock > movefocustoendofnextblock extendtoendofnextinline > movefocustoendofnextinline extendtoendofnexttext > movefocustoendofnexttext extendtoendofpreviousblock > movefocustoendofpreviousblock extendtoendofpreviousinline > movefocustoendofpreviousinline extendtoendofprevioustext > movefocustoendofprevioustext extendtostartof > movefocustostartofnode extendtostartofblock > movefocustostartofblock extendtostartofnextblock > movefocustostartofnextblock extendtostartofnextinline > movefocustostartofnextinline extendtostartofnexttext > movefocustostartofnexttext extendtostartofpreviousblock > movefocustostartofpreviousblock extendtostartofpreviousinline > movefocustostartofpreviousinline extendtostartofprevioustext > movefocustostartofprevioustext move > moveforward/backward moveanchor > moveanchorforward/backward moveanchorcharbackward > moveanchorbackward moveanchorcharforward > moveanchorforward moveanchoroffsetto > moveanchorto moveanchortoendof > moveanchortoendofnode moveanchortostartof > moveanchortoendofnode movecharbackward > movebackward movecharforward > moveforward moveend > moveendforward/backward moveendcharbackward > moveendbackward moveendcharforward > moveendforward moveendoffsetto > moveendto movefocus > movefocusforward/backward movefocuscharbackward > movefocusbackward movefocuscharforward > movefocusforward movefocusoffsetto > movefocusto movefocustoendof > movefocustoendofnode movefocustostartof > movefocustoendofnode moveoffsetsto > moveanchorto/movefocusto movestart > movestartforward/backward movestartcharbackward > movestartbackward movestartcharforward > movestartforward movestartoffsetto > movestartto movetoendof > movetoendofnode movetorangeof > movetorangeofnode movetostartof > movetostartofnode selectall > movetorangeofdocument 0 36 — july 27, 2018 breaking schema rules have changed! to make them able to be used in more cases (so you don't have to dip down to the slower validatenode/normalizenode function), the matching syntax for schema rules has changed previously multiples types/objects would be expressed as { parent { types \['ordered list', 'unordered list'] }, } now there is a new match object concept, which looks like { parent { object 'block', type 'list' }, } match objects can be objects, or an array of objects which acts as or { parent \[{ type 'ordered list' }, { type 'unordered list' }], } additionally, schema rules can now be defined using a schema rules array of objects with top level match properties this allows for matching nodes in ways that were previously impossible for example { schema { rules \[{ // match all blocks, regardless of type! match { object 'block' }, text / /g, normalize () => { }, }] } } all of the shorthands like schema blocks and schema inlines are still available, and are simply rewritten to the more flexible rules syntax under the covers these changes are just a small way of making slate more flexible for advanced use cases when you run into them schema rule normalize functions now receive slateerror objects previously they would be called with a signature of (change, violation, context) they are now called with (change, error) this new error is a slateerror object with an error code and all of the same context properties a normalizer that previously looked like { normalize (change, violation, context) { if (violation === 'child type invalid') { const type = index === 0 ? 'title' 'paragraph' return change setnodebykey(context child key, type) } } } would now look like { normalize (change, error) { if (error code === 'child type invalid') { const type = index === 0 ? 'title' 'paragraph' return change setnodebykey(error child key, type) } } } this is just an attempt to make dealing with normalization errors slightly more idiomatic with how errors are represented in most libraries, in order to not reinvent the wheel unnecessarily 0 35 — july 27, 2018 new range objects now keep track of paths, in addition to keys previously ranges only stored their points as keys now both paths and keys are used, which allows you to choose which one is the most convenient or most performant for your use case they are kept in sync my slate under the covers a new set of bypath change methods have been added all of the changes you could previously do with a bykey change are now also supported with a bypath change of the same name the path based changes are often more performant than the key based ones paths are now of type list https //facebook github io/immutable js/docs/#/list instead of array see the documentation of list https //facebook github io/immutable js/docs/#/list for its differences to array ( get method instead of array indexing, size instead of length , etc) breaking internal yet public node methods have been changed there were a handful of internal methods that shouldn't be used in 99% of slate implementations that updated or removed this was done in the process of streamlining many of the node methods to make them more consistent and easier to use for a list of those affected node assertpath was changed it was previously confusingly named because the equivalent node getpath did something completely different you should now use node assertnode(path) if you need this behavior node removedescendant was removed there's no reason you should have been using this, since it was an undocumented and unused method that was left over from a previous version node updatenode , node insertnode , node removenode , node splitnode and node mergenode mutating methods were changed all of your changes should be done with operations, so you likely weren't using these internal methods they have been changed internally to use paths deprecated the setkeygenerator and resetkeygenerator helpers are deprecated these were previously used to change the default key generation logic now you can use the equivalent keyutils setgenerator and keyutils resetgenerator helpers instead this follows the new pattern of grouping related utilities into single namespaces, as is the case with the new pathutils and textutils internal yet public node methods have been deprecated there were a handful of internal methods that shouldn't be used in 99% of slate implementations that were deprecated for a list of those affected node getkeys and node getkeysasarray were deprecated if you really need to check the presence of a key, use the new node getkeystopathsobject instead node aredescendantssorted and node isinrange were deprecated these were used to check whether a node was in a range, but this can be done more performantly and more easily with paths now node getnodeatpath and node getdescendantatpath were deprecated these were probably not in use by anyone, but if you were using them you can use the existing node getnode and node getdescendant methods instead which now take either paths or keys 0 34 — june 14, 2018 new decorations can now be "atomic" if you set a decoration as atomic, it will be removed when changed, preventing it from entering a "partial" state, which can be useful for some use cases breaking text nodes now represent their content as "leaves" previously their immutable representation used individual character instance for each character now they have changed to group characters into leaf models, which more closely resembles how they are used, and results in a lot fewer immutable object instances floating around for most people this shouldn't cause any issues, since this is a low level aspect of slate deprecated the character model is deprecated although the character concept is still in the repository for now, it is deprecated and will be removed in a future release everything it solves can be solved with leaves instead 0 33 — february 21, 2018 breaking void nodes no longer prescribe their text content previously void nodes would automatically normalize their text content to be a single text node containing ' ' an empty string of content this restriction was removed, so that void nodes can have arbitrary content you can use this to store information in void nodes in a way that is more consistent with non void nodes deprecated the setblock method has been renamed to setblocks this is to make it more clear that it operates on any of the current blocks in the selection, not just a single blocks the setinline method has been renamed to setinlines for the same reason as setblocks , to be clear and stay consistent 0 32 — january 4, 2018 breaking the kind property of slate objects has been renamed to object this is to reduce the confusion over the difference between "kind" and "type" which are practically synonyms the "object" name was chosen to match the stripe api, since it seems like a sensible choice and reads much more nicely when looking through json all normalization reasons containing kind have been renamed too previously there were normalization reason strings like child kind invalid these types of strings have been renamed to child object invalid to stay consistent 0 31 — november 16, 2017 new added a new operation model this model is used to store operations for the history stack, and (de)serializes them in a consistent way for collaborative editing use cases breaking operation objects in slate are now immutable records previously they were native, mutable javascript objects now, there's a new immutable operation model in slate, ensuring that all of the data inside value objects are immutable and it allows for easy serialization of operations using operation tojson() for when sending them between editors this should not affect most users, unless you are relying on changing the values of the low level slate operations (simply reading them is fine) operation lists in slate are now immutable lists previously they were native, mutable javascript arrays now, to keep consistent with other immutable uses, they are immutable lists this should not affect most users 0 30 — october 27, 2017 breaking remove all previously deprecated code paths this helps to reduce some of the complexity in slate by not having to handle these code paths anymore and it helps to reduce file size when upgrading, it's highly recommended that you upgrade to the previous version first and ensure there are no deprecation warnings being logged, then upgrade to this version 0 29 — october 27, 2017 new added the new value model to replace state the new model is exactly the same, but with a new name there is also a shimmed state model exported that warns when used, to ease migration breaking the set state operation has been renamed set value this shouldn't affect almost anyone, but in the event that you were relying on the low level operation types you'll need to update this deprecated the "state" has been renamed to "value" everywhere all of the current references are maintained as deprecations, so you should be able to upgrade and see warnings logged instead of being greeted with a broken editor this is to reduce the confusion between react's "state" and slate's editor value, and in an effort to further mimic the native dom apis 0 28 — october 25, 2017 new state objects now have an embedded state schema property this new schema property is used to automatically normalize the state as it changes, according to the editor's current schema this makes normalization much easier breaking the schema objects in slate have changed! previously, they used to be where you could define normalization rules, define rendering rules, and define decoration rules this was overloaded, and made other improvements hard now, rendering and decorating is done via the newly added plugin functions ( rendernode , rendermark , decoratenode ) and validation is done either via the lower level validatenode plugin function, or via the new schema objects the normalize change methods no longer take a schema argument previously you had to maintain a reference to your schema, and pass it into the normalize methods when you called them since state objects now have an embedded state schema property, this is no longer needed 0 27 — october 14, 2017 breaking the range model is now called leaf this is to disambiguate with the concept of "ranges" that is used throughout the codebase to be synonymous to selections for example in methods like getblocksatrange(selection) the text ranges property in the json representation is now text leaves when passing in json with text ranges you'll now receive a deprecation warning in the console in development deprecated the selection model is now called range this is to make it more clear what a "selection" really is, to make many of the other methods that act on "ranges" make sense, and to more closely parallel the native dom api for selections and ranges a mock selection object is still exported with deprecated static methods, to make the transition to the new api easier the text getranges() method is now text getleaves() it will still work, and it will return a list of leaves, but you will see a deprecation warning in the console in development 0 26 — october 13, 2017 breaking the decorate function of schema rules has changed previously, in decorate you would receive a text node and the matched node, and you'd need to manually add any marks you wanted to the text node's characters now, "decorations" have changed to just be selection objects with marks in the selection marks property instead of applying the marks yourself, you simply return selection ranges with the marks to be applied, and slate will apply them internally this makes it possible to write much more complex decoration behaviors check out the revamped code highlighting https //github com/ianstormtaylor/slate/blob/master/examples/code highlighting/index js example and the new search highlighting https //github com/ianstormtaylor/slate/blob/master/examples/search highlighting/index js example to see this in action the set data operation type has been replaced by set state with the new state decorations property, it doesn't make sense to have a new operation type for every property of state objects instead, the new set state operation more closely mimics the existing set mark and set node operations deprecated new you can now set decorations based on external information previously, the "decoration" logic in slate was always based off of the text of a node, and would only re render when that text changed now, there is a new state decorations property that you can set via change setstate({ decorations }) you can use this to add presentation only marks to arbitrary ranges of text in the document check out the new search highlighting https //github com/ianstormtaylor/slate/blob/master/examples/search highlighting/index js example to see this in action the setdata change method has been replaced by setstate previously you would call change setdata(data) but as new state properties are introduced it doesn't make sense to need to add new change methods each time instead, the new change setstate(properties) more closesely mimics the existing setmarkbykey and setnodebykey to achieve the old behavior, you can do change setstate({ data }) the preservestatedata option of state tojson has changed the same behavior is now called preservedata instead this makes it consistent with all of the existing options, and the new preservedecorations option as well 0 25 — september 21, 2017 breaking the insertblock change method no longer replaces empty blocks previously if you used insertblock and the selection was in an empty block, it would replace it now you'll need to perform that check yourself and use the new replacenodebykey method instead the block create and inline create methods no longer normalize previously if you used one of them to create a block or inline with zero nodes in it, they would automatically add a single empty text node as the only child this was unexpected in certain situations, and if you were relying on this you'll need to handle it manually instead now 0 24 — september 11, 2017 new slate is now a "monorepo" instead of a single package, slate has been divided up into individual packages so that you can only require what you need, cutting down on file size in the process, some helpful modules that used to be internal only are now exposed there's a new slate hyperscript helper this was possible thanks to the work on slate sugar https //github com/gitbookio/slate sugar , which paved the way the slate prop types package is now exposed previously this was an internal module, but now you can use it for adding prop types to any components or plugins you create the slate simulator package is now exposed previously this was an internal testing utility, but now you can use it in your own tests as well it's currently pretty bare bones, but we can add to it over time breaking immutable is now a peer dependency of slate previously it was a regular dependency, but this prevented you from bringing your own version, or you'd have duplication you'll need to ensure you install it! the html , plain and raw serializers are broken into new packages previously you'd import them from slate but now you'll import them from slate html serializer and slate plain serializer and the raw serializer that was deprecated is now removed the editor and placeholder components are broken into a new react specific package previously you'd import them from slate but now you import { editor } from 'slate react' instead 0 23 — september 10, 2017 new slate models now have model fromjson(object) and model tojson() methods these methods operate with the canonical json form (which used to be called "raw") this way you don't need to import a serializer to retrieve json, if you have the model you can serialize/deserialize models also have tojs and fromjs aliases this is just to match immutable js objects, which have both methods for slate though, the methods are equivalent breaking the isnative property of state has been removed previously this was used for performance reasons to avoid re rendering, but it is no longer needed this shouldn't really affect most people because it's rare that you'd be relying on this property to exist deprecated the raw serializer is now deprecated the entire "raw" concept is being removed, in favor of allowing all models to be able to serialize and deserialize to json themselves instead of using the raw serializer, you can now use the fromjson and tojson on the models directly the toraw options for the plain and html serializers are now called tojson this is to stay symmetrical with the removal of the "raw" concept everywhere the terse option for json serialization has been deprecated! this option causes lots of abstraction leakiness because it means there is no one canonical json representation of objects you had to work with either terse or not terse data the html serializer no longer uses the terse representation this shouldn't actually be an issue for anyone because the main manifestation of this has a deprecation notice with a patch in place for now the defaultblocktype of the html serializer is now called defaultblock this is just to make it more clear that it supports not only setting the default type but also data and isvoid 0 22 — september 5, 2017 new the state activemarks returns the intersection of marks in the selection previously there was only state marks which returns marks that appeared on any character in the selection but state activemarks returns marks that appear on every character in the selection, which is often more useful for implementing standard richtext editor behaviors breaking the plain serializer now adds line breaks between blocks previously between blocks the text would be joined without any space whatsoever, but this wasn't really that useful or what you'd expect the togglemark transform now checks the intersection of marks previously, toggling would remove the mark from the range if any of the characters in a range didn't have it however, this wasn't what all other richtext editors did, so the behavior has changed to mimic the standard behavior now, if any characters in the selection have the mark applied, it will first be added when toggling the length property of nodes has been removed this property caused issues with code like in lodash that checked for "array likeness" by simply looking for a length property that was a number onchange now receives a change object (previously named transform ) instead of a state this is needed because it enforces that all changes are represented by a single set of operations otherwise right now it's possible to do things like state transform() apply({ save false }) transform() apply() and result in losing the operation information in the history with ot, we need all transforms that may happen to be exposed and emitted by the editor the new syntax looks like onchange(change) { this setstate({ state change state }) } onchange({ state }) { this setstate({ state }) } similarly, handlers now receive e, data, change instead of e, data, state instead of doing return state transform() apply() the plugins can now act on the change object directly plugins can still return change if they want to break the stack from continuing on to other plugins (any != null value will break out ) but they can also now not return anything, and the stack will apply their changes and continue onwards this was previously impossible the new syntax looks like function onkeydown(e, data, change) { if (data key == 'enter') { return change splitblock() } } the onchange and on\[before]change handlers now receive change objects previously they would also receive a state object, but now they receive change objects like the rest of the plugin api the apply({ save }) option is now state change({ save }) instead this is the easiest way to use it, but requires that you know whether to save or not up front if you want to use it inline after already saving some changes, you can use the change setoperationflag('save', true) flag instead this shouldn't be necessary for 99% of use cases though the undo() and redo() transforms don't save by default previously you had to specifically tell these transforms not to save into the history, which was awkward now they won't save the operations they're undoing/redoing by default onbeforechange is no longer called from componentwillreceiveprops , when a new state is passed in as props to the \<editor> component this caused lots of state management issues and was weird in the first place because passing in props would result in changes firing it is now the parent component's responsibility to not pass in improperly formatted state objects the splitnodebykey change method has changed to be shallow previously, it would deeply split to an offset but now it is shallow and another splitdescendantsbykey change method has been added (with a different signature) for the deep splitting behavior this is needed because splitting and joining operations have been changed to all be shallow, which is required so that operational transforms can be written against them blocks cannot have mixed "inline" and "block" children anymore blocks were implicitly expected to either contain "text" and "inline" nodes only, or to contain "block" nodes only invalid case are now normalized by the core schema the shape of many operations has changed this was needed to make operations completely invertible without any extra context the operations were never really exposed in a consumable way, so i won't detail all of the changes here, but feel free to look at the source to see the details all references to "joining" nodes is now called "merging" this is to be slightly clearer, since merging can only happen with adjacent nodes already, and to have a nicer parallel with "splitting", as in cells the operation is now called merge node , and the transforms are now merge deprecated the transform apply() method is deprecated previously this is where the saving into the history would happen, but it created an awkward convention that wasn't necessary now operations are saved into the history as they are created with change methods, instead of waiting until the end you can access the new state of a change at any time via change state 0 21 — july 20, 2017 breaking the html serializer now uses domparser instead of cheerio previously, the html serializer used the cheerio library for representing elements in the serialization rule logic, but cheerio was a very large dependency it has been removed, and the native browser domparser is now used instead all html serialization rules will need to be updated if you are working with slate on the server, you can now pass in a custom serializer to the html constructor, using the parse5 library 0 20 — may 17, 2017 breaking returning null from the html serializer skips the element previously, null and undefined had the same behavior of skipping the rule and trying the rest of the rules now if you explicitly return null it will skip the element itself 0 19 — march 3, 2017 breaking the filterdescendants and finddescendants methods are now depth first this shouldn't affect almost anyone, since they are usually not the best things to be using for performance reasons if you happen to have a very specific use case that needs breadth first, (or even likely something better), you'll need to implement it yourself deprecated some node methods have been deprecated! there were a few methods that had been added over time that were either poorly named that have been deprecated and renamed, and a handful of methods that are no longer useful for the core library that have been deprecated here's a full list aredescendantsorted > aredescendantssorted gethighestchild > getfurthestancestor gethighestonlychildparent > getfurthestonlychildancestor concatchildren decoratetexts filterdescendantsdeep finddescendantdeep getchildrenbetween getchildrenbetweenincluding isinlinesplitatrange 0 18 — march 2, 2017 breaking the plugin render property is now called plugin renderportal this is to make way for the new plugin render property that offers hoc like behavior, so that plugins can augment the editor however they choose 0 17 — february 27, 2017 deprecated some selection methods have been deprecated! previously there were many inconsistencies in the naming and handling of selection changes this has all been cleaned up, but in the process some methods have been deprecated here is a full list of the deprecated methods and their new alternatives movetooffsets > moveoffsetsto moveforward > move movebackward > move moveanchoroffset > moveanchor movefocusoffset > movefocus movestartoffset > movestart moveendoffset > moveend extendforward > extend extendbackward > extend unset > deselect some selection transforms have been deprecated! along with the methods, the selection based transforms have also been refactored, resulting in deprecations here is a full list of the deprecated transforms and their new alternatives moveto > select movetooffsets > moveoffsetsto moveforward > move movebackward > move movestartoffset > movestart moveendoffset > moveend extendforward > extend extendbackward > extend flipselection > flip unsetselection > deselect unsetmarks 0 16 — december 2, 2016 breaking inline nodes are now always surrounded by text nodes previously this behavior only occured for inline nodes with isvoid true now, all inline nodes will always be surrounded by text nodes if text nodes don't exist, empty ones will be created this allows for more consistent behavior across slate, and parity with other editing experiences 0 15 — november 17, 2016 breaking the unique key generated values have changed previously, slate generated unique keys that looked like '9dk3' but they were not very conflict resistant now the keys are simple string of auto incrementing numbers, like '0' , '1' , '2' this makes more clear that keys are simply a convenient way to uniquely reference nodes in the short term lifespan of a single in memory instance of slate they are not designed to be used for long term uniqueness a new setkeygenerator function has been exported that allows you to pass in your own key generating mechanism if you want to ensure uniqueness the raw serializer doesn't preserve keys by default previously, the raw serializer would omit keys when passed the terse true option, but preserve them without it now it will always omit keys, unless you pass the new preservekeys true option this better reflects that keys are temporary, in memory ids operations on the document now update the selection when needed this won't affect you unless you were doing some very specific things with transforms and updating selections overall, this makes it much easier to write transforms, since in most cases, the underlying operations will update the selection as you would expect without you doing anything deprecated node accessor methods no longer accept being passed another node! previously, node accessor methods like node getparent could be passed either a key string or a node object for performance reasons, passing in a node object is being deprecated so if you have any calls that look like node getparent(descendant) , they will now need to be written as node getparent(descendant key) they will throw a warning for now, and will throw an error in a later version of slate 0 14 — september 10, 2016 breaking the undo and redo transforms need to be applied! previously, undo and redo were special cased such that they did not require an apply() call, and instead would return a new state directly now this is no longer the case, and they are just like every other transform transforms are no longer exposed on state or node the transforms api has been completely refactored to be built up of "operations" for collaborative editing support as part of this refactor, the transforms are now only available via the state transform() api, and aren't exposed on the state or node objects as they were before transform objects are now mutable previously transform was an immutable js record , but now it is a simple constructor this is because transforms are inherently mutating their representation of a state, but this decision is https //github com/ianstormtaylor/slate/issues/328 the selection can now be "unset" previously, a selection could never be in an "unset" state where the anchorkey or focuskey was null this is no longer technically true, although this shouldn't really affect anyone in practice 0 13 — august 15, 2016 breaking the rendernode and rendermark properties are gone! previously, rendering nodes and marks happened via these two properties of the \<editor> , but this has been replaced by the new schema property check out the updated examples to see how to define a schema! there's a good chance this eliminates extra code for most use cases! 😄 the renderdecorations property is gone! decoration rendering has also been replaced by the new schema property of the \<editor> 0 12 — august 9, 2016 breaking the data files property is now an array previously it was a native filelist object, but needed to be changed to add full support for pasting an dropping files in all browsers this shouldn't affect you unless you were specifically depending on it being array like instead of a true array 0 11 — august 4, 2016 breaking void nodes are renderered implicitly again! previously slate had required that you wrap void node renderers yourself with the exposed \<void> wrapping component this was to allow for selection styling, but a change was made to make selection styling able to handled in javascript now the \<void> wrapper will be implicitly rendered by slate, so you do not need to worry about it, and "voidness" only needs to toggled in one place, the isvoid true property of a node 0 10 — july 29, 2016 breaking marks are now renderable as components previously the only supported way to render marks was by returning a style object now you can return a style object, a class name string, or a full react component because of this, the dom will be renderered slightly differently than before, resulting in an extra \<span> when rendering non component marks this won't affect you unless you were depending on the dom output by slate for some reason 0 9 — july 28, 2016 breaking the wrap and unwrap method signatures have changed! previously, you would pass type and data as separate parameters, for example wrapblock('code', { src true }) this was inconsistent with other transforms, and has been updated such that a single argument of properties is passed instead so that example could now be wrapblock({ type 'code', { data { src true }}) you can still pass a type string as shorthand, which will be the most frequent use case, for example wrapblock('code') 0 8 — july 27, 2016 breaking the onkeydown and onbeforeinput handlers signatures have changed! previously, some slate handlers had a signature of (e, state, editor) and others had a signature of (e, data, state, editor) now all handlers will be passed a data object—which contains slate specific data related to the event—even if it is empty this is helpful for future compatibility where we might need to add data to a handler that previously didn't have any, and is nicer for consistency the onkeydown handler's new data object contains the key name, code and a series of is properties to make working with hotkeys easier the onbeforeinput handler's new data object is empty the utils export has been removed previously, a key utility and the finddomnode utility were exposed under the utils object the key has been removed in favor of the data object passed to onkeydown and then finddomnode utility has been upgraded to a top level named export, so you'll now need to access it via import { finddomnode } from 'slate' void nodes now permanently have " " as content previously, they contained an empty string, but this isn't technically correct, since they have content and shouldn't be considered "empty" now they will have a single space of content this shouldn't really affect anyone, unless you happened to be accessing that string for serialization empty inline nodes are now impossible this is to stay consistent with native contenteditable behavior, where although technically the elements can exist, they have odd behavior and can never be selected 0 7 — july 24, 2016 breaking the raw serializer is no longer terse by default! previously, the raw serializer would return a "terse" representation of the document, omitting information that wasn't strictly necessary to deserialize later, like the key of nodes by default this no longer happens you have to opt in to the behavior by passing { terse true } as the second options argument of the deserialize and serialize methods 0 6 — july 22, 2016 breaking void components are no longer rendered implicity! previously, slate would automatically wrap any node with isvoid true in a \<void> component but doing this prevented you from customizing the wrapper, like adding a classname or style property so you must now render the wrapper yourself , and it has been exported as slate void this, combined with a small change to the \<void> component's structure allows the "selected" state of void nodes to be rendered purely with css based on the \ focus property of a \<void> element, which previously https //github com/ianstormtaylor/slate/commit/31782cb11a272466b6b9f1e4d6cc0c698504d97f this allows us to streamline selection handling logic, improving performance and reducing complexity data offset key is now \<key> \<index> instead of \<key> \<start> \<end> this shouldn't actually affect anyone, unless you were specifically relying on that attribute in the dom this change greatly reduces the number of re renders needed, since previously any additional characters would cause a cascading change in the \<start> and \<end> offsets of latter text ranges 0 5 — july 20, 2016 breaking node gettextnodes() is now node gettexts() this is just for consistency with the other existing node methods like getblocks() , getinlines() , etc and it's nicely shorter 😉 node methods now throw earlier during unexpected states this shouldn't break anything for most folks, unless a strange edge case was going undetected previously 0 4 — july 20, 2016 breaking rendermark(mark, state, editor) is now rendermark(mark, marks, state, editor) this change allows you to render marks based on multiple marks presence at once on a given range of text, for example using a custom bolditalic otf font when text has both bold and italic marks 0 3 — july 20, 2016 breaking transform unwrapblock() now unwraps selectively previously, calling unwrapblock with a range representing a middle sibling would unwrap all of the siblings, removing the wrapping block entirely now, calling it with those same arguments will only move the middle sibling up a layer in the hierarchy, preserving the nesting on any of its siblings this changes makes it much simpler to implement functionality like unwrapping a single list item, which previously would unwrap the entire list 0 2 — july 18, 2016 breaking transform mark() is now transform addmark() and transform unmark() is now transform removemark() the new names make it clearer that the transforms are actions being performed, and it paves the way for adding a togglemark convenience as well 0 1 — july 13, 2016 🎉