draftail - npm Package Versions

[v0.9.0]

Added

• Add support for custom inline styles, thanks to @vincentaudebert (#97).
• Add basic styles for common inline styles.
• Add new description prop for all formats to describe the format's use with more text than the label.
• Add tooltips for toolbar buttons to display the full control description as well as its keyboard shortcut.
• Add separate button groups in the toolbar.
• Add basic undo/redo controls in the toolbar (#100), displaying the related keyboard shortcuts.
• Introduce icons for hr: ― and br: ↵.
• Add keyboard shortcuts for superscript & subscript.
• Add more Markdown-like markers for heading levels (##), code block (triple backtick), blockquote (>), hr (---) (#53).
• Add spellCheck prop, passed to Draft.js Editor. Sets whether spellcheck is turned on for your editor.
• Add support for React 16.

Changed

• Update keyboard shortcuts format to follow that of Google Docs.
• Refine toolbar styles. Fix toolbar to the top of the page when sticky.
• Make the editor look closer to a textarea (#96).
• Update strikethrough shortcut from Google Docs.
• Update Draft.js dependency to 0.10.4, and draftjs-utils to 0.8.8.
• Stop preserving Markdown-like block marker when undoing block type change.
• Stop restricting block type changes based on Markdown-style markers to unstyled blocks only.

Fixed

• Fix tooltip position when scrolling (#99).
• Fix beforeInput text replacement happening on non-collapsed selections.
• Prevent text inserted after entities from continuing the entity. Fix #86 (#106).

How to upgrade

This release does not have many breaking changes, but the editor's toolbar styles have changed a lot and this may cause breakage.

First, update Draftail and its Draft.js peer dependency: npm install --save draft-js@^0.10.4 draftail@0.9.0.

Then, you will want to update controls to leverage the new description prop. It will be displayed in the new toolbar tooltips. Here is a brief example:

blockTypes={[
    {
        type: BLOCK_TYPE.HEADER_THREE,
        label: 'H3',
        // Use a description to further convey what the control does.
+        description: 'Heading 3',
    },
    {
        type: BLOCK_TYPE.UNORDERED_LIST_ITEM,
        // The icon is enough – but use the new prop to help screen reader users.
-        label: 'UL',
+        description: 'Bulleted list',
        icon: 'icon-list-ul',
    },
]}

[v0.8.0]

Added

• Add name attribute to button elements to simplify targeting in browser automation tests.
• Publish the package as an ES2015 module.

Changed

• Upgrade draftjs-utils to latest (draftjs-utils).
• Use references to window object instead of global.
• Update dependencies to remove Immutable.js duplication

[v0.7.3]

Added

• Expose reusable Portal component as part of the API.

[v0.7.2]

Changed

• Only stick toolbar when editor is active.
• Make editor slightly bigger.

Fixed

• Fix editor class name concatenation.

[v0.7.1]

Fixed

• Fix CSS import present in published library.

[v0.7.0]

Added

• Make the editor toolbar sticky (requires a polyfill, documented in README).
• Add support for placeholder attribute.

Changed

• Improve "active block" rendering and disabled state.

Fixed

• Fix missing vertical spacing between button rows.
• Fix missing pointer cursor on tooltip button.

Removed

• Remove Element.closest polyfill from main lib.

[v0.6.0]

Added

• Add default strategy for entity types based on type.

Changed

• Change empty RawDraftContentState in conversion API to be null.
• Change entity type nomenclature to use source and decorator in place of control and component.

[v0.5.0]

Added

• Implement list depth normalisation on copy/paste.
• Add title attributes on buttons to display keyboard shortcuts. Fix #37.
• Override default code-block element. Fix #41.

Changed

• Update project to use draft-js@0.10 API
• Move draftjs-utils peerDependency to be a dependency.
• Move immutable peerDependency to be a dependency.
• Copy/paste of rich text is now configurable via the stripPastedStyles option.
• Copy/paste of rich text is now disabled by default. This will be enabled by default once it is better supported.

[v0.4.1]

Fixed

• Fix image block not unlocking editor on cancel.