This release marks the 30th update to the editor plugin. The highlights are broken down below.

Block Library

Arguably, one of the key pieces of the new editor UI is the block library or inserter. Unifying the way users can insert content has been one of the main objectives of the whole project. It has gone through multiple iterations and testing; balancing clarity, usability, flexibility, and extensibility. This release offers the result of some very fruitful collaborations between designers and developers.

Notably, tabs are being removed; blocks have bigger surface areas; and plugins can supply a distinct color for the block icon background. This seeks to allow the inserter to better scale while retaining visual clarity. The other addition to the inserter is related to the new concept of child blocks explained below.

Child Blocks

The editor has had support for nesting blocks since around the beginning of this year. With 3.0, a block author can now also register a block as being a child of another block by declaring parent: [ 'block-name' ]. This now causes a few changes in the interface: the root inserter won’t show child blocks unless the user is within the context of the right parent block. (It aims to reduce the amounts of blocks shown at any given time by making the inserter more contextual.)

Note that for a block to be effectively a child two conditions must apply:

• The block must provide a valid parent property.
• The parent must have an InnerBlocks area declared.

This is how the block library looks after both changes:

Theme Styles

During the whole process of Gutenberg, we have come to the realization that in order to have the most flexible system for styling within themes — and letting us get closer to visual parity between front-end and the editor — we had to separate presentational styles from structural styles when it comes to individual blocks. So far, we have not been loading presentational styles on the front-end in order to avoid unintentional changes to site’s appearance, but that also causes issues for new themes that would like to start working from the visual design baseline that Gutenberg offers by default as shown on the admin side.

The decision has been made to allow themes to opt-in to these styles with an add_theme_support( 'wp-block-styles' ) registration. This will allow us to keep (or reintroduce) some more opinionated styles for elements like Quotes, Tables, the Separator, and so on.

3.0 🍠

• Redesign the inserter with collapsible panels.
• Add support for Child Blocks. These create a relationship between blocks and updates the inserter to show blocks based on context.
• Implement a new block hover and select approach to improve nested block selection and clarity.
• Allow expanding selection on consecutive Meta+A presses.
• Add shared blocks to the blocks autocompleter.
• Iterate on behaviour of the “between blocks inserter”.
• Multiple longstanding fixes to the UrlInput box by using Popover component instead of custom positioning.
• Allow themes to opt-in to the visual styles provided by core blocks.
• When focused on a parent with InnerBlocks set, show available child blocks clearly at the top. Blocks with children are marked visually in the root inserter.
• Add publish panels support for plugins.
• Add support for specifying background and foreground icon color when registering a block.
• Scroll the inserter menu to the relevant position when opening a panel.
• Expand matching categories when searching the block library.
• Introduce a dedicated autosaves endpoint for handling autosave behavior. Improves general handling of revisions through REST API saves.
• Allow clicking the block’s input fields.
• Move “Saved” blocks to the bottom and show distinct icon on the panel name.
• Improve max-upload size error message.
• Show autosave message when autosave exists.
• Normalize unicode in raw handling.
• Allow inserting a link with no text selected.
• Center the background of the cover image block.
• Make the Classic block toolbar sticky while scrolling.
• Make Button component styles independent from Core Styles.
• Make various greys less dull when used with opacity.
• Set the correct min-width for the ChromePicker popover.
• Unify all the media blocks placeholders under a unique component.
• Address focus style regression in menu and improve display of keyboard shortcut.
• Refactor popover to clarify computations and address multiple cases of overflow issues.
• Refactor URL redirect as BrowserURL component. Resolves an issue where the browser URL does not change when a new post is autosaved.
• Send all fields when transmitting an autosave.
• Avoid URL redirect for published post autosave.
• Avoid superfluous changes in RichText.
• Improve performance for PublishPanel and extensions.
• Unselect blocks when opening the document settings.
• Simplify the accessibility handling of the updated inserter.
• Use new “theme” style mechanism to restore Quote styles on the front.
• Add text alignment options to verse block toolbar.
• Make sure the Title element uses the same max-width as blocks.
• Improve title component so it works with and without editor styles.
• Properly associate the spacer height input label.
• Further visual polish to new inserter design.
• Fix block icon alignment in block inspector.
  
• Fix issue with excerpt textarea height overflow.
• Fix typo in withRehydration function call.
• Fix Post Formats UI not showing.
  
• Fix regressions with Button component after PostCSS.
• Fix issue with applied formats being lost.
• Fix unset background-color on sidebar headings.
• Fix case where inbetweenserter would linger if you clicked to insert and then clicked away.
• Fix issue with rich text toolbar being gone in captions.
• Fix padding and outline style for expander panel.
• Fix CodeEditor component not loading when WordPress is installed in a subfolder.
• Fix regression with sticky toolbar border.
• Fix some intermittent E2E test failures.
• Fix “no results” message within inserter.
• Fix visual issue with normal buttons with icons.
• Fix issue where the sidebar would remain open on mobile when the page loaded if it was opened before.
• Fix fileName not being respected when the image is uploaded via drag & drop.
  
• Fix regression in spacer block.
• Fix getInserterItems cache.
• Fix intermittent adding-blocks E2E test failure.
• Fix issue with shared block preview being rendered hidden.
• Fix alignment issue with hover label on wide and full-wide.
• Fix Windows-unfriendly theme.scss loader rule.
• Fix issue where pasting would fail in IE11.
• Fix issue with editing paragraph blocks in shared blocks.
• Address small code style fixes on the core-data module.
• Add support for getEntityRecords selectors/resolvers to the core data module to avoid duplication across the different entities.
• Remove drag handle from block breadcrumb.
• Improve Child Blocks code footprint.
• Address package issues with npm audit fix.
• Use Core’s TinyMCE version to avoid conflicts.
• Scope the rule adding a white background to the html element.
• Remove onFocus from core blocks’ RichText usage.
• Remove post type capabilities from the user object.
  
• Remove the dependency on the editor module code from blocks tests.
• Expose preview_link through the REST API and use within client.
• Only load Gutenberg Polyfill in editor pages.
• Refine code statement of image classes.
• Add support for the default_page_template_title filter in page-attributes meta-box.
• Add additional condition to “Available templates” meta-box logic.
• Ensure the wp-editor script is also enqueued soon using the enqueue_block_assets hook.
• Cleanup shared block tests.
• Provide cross-browser node containment checking.
• Add unit tests for core-blocks/more/edit.js components.
• Add documentation about ServerSideRender.
• Auto-generate human-readable version of Gutenberg block grammar.
• Doc Block cleanup for rich-text component.
• Address multiple typos in code comments.
• Skip test files when generating build folders for packages.
• Fail E2E tests when uncaught page error occurs.
• Extract new blob package out of utils module.
• Update the wait function name to discourage its use in E2E tests.
• Introduce new module with deprecation utility.
• Introduce insertBlock() utility for E2E tests.
• Move data module to the package maintained by Lerna.
• Avoid using spread for objects to work with all node 8x versions.
• Add lint rule to check that memize() is used.
• Add global guard against ZWSP in E2E content retrieval.
• Add building/watching support to Gutenberg packages.
• Add further explanation for why .normalize() is optional.
• Add new webpack plugin to handle library default export.
  
• Reload the page after webpack watch compile.
• Publish numerous WP packages updates from repository.
• Drop deprecations slated for 3.0 removal.
• Always publish main and module distributions in packages.
• Upgrade mousetrap to 1.6.2.
• Update all WordPress packages to the latest version.

#core-editor, #editor, #gutenberg

This update is packed with improvements and fixes. It introduces the Plugin API that allows pinning items for quick access in the editor header. There are many refinements to the UI and consistency of various block tools. Toolbars now expose the keyboard shortcuts used to access most features. It also includes significant improvements around API support — lifting limits to various endpoints, capabilities, conditional UI, etc. Dive into the changes below to find all the details.

2.9 🍂

• Add support for pinning plugin items in the main editor header. This is an important part of the editor Plugin API seeking to both grant plugins high visibility while offering users a consistent and flexible UI that can scale better.
• Add shortcut tooltips for main toolbar.
• Add remaining RichText shortcuts for formatting toolbar. Display them in tooltips.
• Display the block toolbar and controls below the block on mobile.
• Add automatic handling of focus for RichText component.
• New reusable component: FontSizePicker. Example use in paragraph block.
• Query for all authors with an unbounded per_page=-1 request. Makes sure no users appear missing.
• Make the editor canvas friendly towards colored backgrounds. Improves support of nested structures over backgrounds as well.
• Remove block alignment from paragraph block with deprecation handling.
• Ensure contributors can create tags and manage categories.
• Exclude private blocks from the slash autocompleter.
• Close the post publish panel only when the post becomes dirty.
• Add toggle to set fixed widths in Table block.
• Surface and style the resizing tool in Table block.
• Iterate on table block front-end styles.
• Transform into the correct embed block based on URL patterns.
• Allow resetting the permalink by saving it as empty.
  
• Add text alignment options to Subhead block.
• Move Heading block alignment options from the inspector to the toolbar.
• Writing Flow: consider tabbable edge if no adjacent tabbable.
• Implement Button as assigning ref via forwardRef.
• Avoid adding terms when tabbing away from the tag selector field.
• Add a max-height to Table of Contents menu.
• Make any iframe embed responsive in the editor.
• Update PostExcerpt component to use TextareaControl.
• Show block remove button on empty paragraph blocks.
  
• Introduce wp:action-publish and update corresponding UI to reference it. Use wp:action-publish to determine whether to display publish UI.
• Use wp:action-assign-author to indicate if user can assign authors. Fixes issues with author selector not appearing under certain circumstances.
• Permit unbounded per_page=-1 requests for Pages and Shared Blocks. Removes limit on how many items are retrieved.
• Permit unbounded per_page=-1 requests for Categories and Tags.
• Improve written descriptions of core blocks.
• Show caption and description settings in featured image modal.
• Make sidebar toggle button open the block inspector if a block is selected.
• Avoid setting font-style when using dropcap.
• Preserve image ID in raw handling.
• Add a data store to manage the block/categories registration.
• Avoid change in RichText when possible. It prevents unnecessary history records.
• Stop unnecessary re-renders caused by withColors. Also solve memoize problems.
• Move components from the blocks to the editor module.
• Move editorMediaUpload to the editor module.
• Move the editor settings into the editor’s store.
• Change subhead block to subheading.
• Add cache to getUserQueryResults and avoid authors rerender on every key press.
• Rename isPrivate → supports.inserter in Block API.
• Fix multi selection with arrows + shift.
• Fix caretRangeFromPoint for Firefox.
• Fix a PHP Notice in REST API responses.
  
• Fix broken example in withAPIData README.
• Fix issue with UrlInput autofocus when used in a custom block.
• Fix issue with high contrast indicator in Edge.
• Fix and update block fixture regeneration.
• Fix gallery width to match width of other elements.
• Fix Fragment render error on empty children.
• Fix ServerSideRender bug with Columns block.
• Fix block icon alignment.
  
• Fix absent editor styles in Classic block.
• Fix state variable name in core-data.
• Fix generating admin schemes styles.
• Fix captions on resized images.
• Fix case where link modal would hide on rerender.
• Fix paste with selection/caret at start or end.
• Fix appender height to match paragraph block.
• Use core-blocks prefix for class names.
• Prevent classname override when passing className as argument.
• Remove document outline from the sidebar.
  
• Framework work to support React Native mobile app explorations:
  • Refactor the Code block .
  • Refactor “More” block.
  • Extract edit to their own file (part 1, part 2).
• Use targetSchema of JSON Hyper Schema to communicate sticky action.
• Tweak targetSchema Response for sticky posts.
• Load additional REST API files if controller is defined.
• Restore the wp-blocks stylesheet for backwards compatibility concerns.
• Add documentation for title and modalClass props in MediaUpload.
  
• Copy edits to theme extensibility.
• Add a lint rule for enforcing ellipsis use.
• Use a postcss plugin to generate the admin-schemes styles.
• Move date module to packages maintained by Lerna. Move element to packages maintained by Lerna.
• Extract dom package and make it maintained with Lerna.
• Move blocks raw handling tests to test/integration folder.
• Remove skipped tests which fail, enable those that pass.
• Add missing unit test for received entity records.
• Update Notice README.
• Update wordcount package to prevent crash.
• Update dom-react to 2.2.1.
• Update React to 16.3.2.
• Update packages to pass npm audit.
• Upgrade rememo dependency to 3.0.0.
• Updates the minimum required version of npm to version 6.0.0 or greater.
• Update testing-overview document.
• Update package-lock.json for fsevents.
• Avoid tail-ing the PHP 5.2/3 build logs.
• Remove Docker compose deprecated parallel option.
• Remove fsevents from optionalDependencies.
• Remove %s from Lerna publish message.
• Deprecate isExtraSmall utility function.
• Add npm update to build script.
• Make lerna a dependency rather than a devDependency.
• Support adding a human-readable deprecation hint.
• Drop features slated for 2.9 removal.
• Introduce the common build folder to be used by all modules.

#core-editor, #editor, #gutenberg

Things are going well on the road towards completing the first phase of the editor project. Most of the work is centered around polish, getting things ready for merge, and tightening existing APIs.

This release has many refinements and improves the capabilities of the Block and Plugin APIs. It also adds a new “spacer” block for generating visual space. The color palette component has been improved to be based on classes instead of inline styles (for registered colors) and includes some important accessibility improvements (like naming the color). Thank you to everyone involved!

2.8 🌌

• Add a pasting schema in raw content handling. It simplifies whitelisting and reduces the amount of filters run. Should improve reliability, clarity, markdown conversion, and usage in blocks.
• Add “Spacer” block to create empty areas.
• Add Server Side Render component.
• Expand public InnerBlocks API with support for template configuration and allowedBlocks logic.
• ColorPalette improvements:
  • Implement mechanism to use classes for configured colors instead of inline styles. Use it in Button block as well.
  • Use color name in ColorPalette aria-label for making color selection more accessible.
  • Improve accessibility of PanelColor by announcing currently set color by name.
  • Hide color pickers in paragraph and button if no colors are available.

Other changes

• Add a format prop to allow HTML string values to be used in RichText component. This should be a useful API addition for plugin developers.
• Improve the make gallery modal and allow it to use the correct mode when editing.
• Improve performance by avoiding creating a new uids prop on each block rerender.
• Make sure createInnerBlockList never updates when passed using context.
• Introduce initial “entities” data model abstraction to automatically build state selectors.
  
• Hide the movers and the block menu when typing.
• Optimize the shouldComponentUpdate path of withSelect.
• Use support: align API in Columns block, fixes issue with alignment.
• Filter the PostFormat list to those supported by the theme.
• Used fallback styles to compute font size slider initial position.
• Indent serialized block output with tabs as part of Block API.
• Add a RichText.Content component to be used in conjunction with RichText.
• Determine emptiness by value in RichText.
• Call resolver isFulfilled once per argument set in data modules.
• Extend BlockEdit context with name and use it for autocompleters.
• Improve order of block shortcuts within inline inserter.
• Improve terms token feedback and accessibility.
• Introduce theme_supports with formats to REST API index.
• Switch post-author component to use /wp/v2/users/?who=authors. Related #42202.
• Further harden who=authors check by author support for post type.
• Disable link suggestions when value is URL.
• Make CodeEditor component more extensible.
• Allow the new “block remove” button appear on focus.
• Add new “pure” higher order component to wp/element.
• Add Embed Preview support for classic embed providers. This handled legacy embeds.
• Add missing label and focus style to the code editor textarea.
• Introduce editorMediaUpload wrapper and fix issue with images not being attached to a post.
  
• Used editorMediaUpload in Gallery files transform (images drag&drop).
• Make URL creation mechanism smarter around relative links.
• Add a type attribute to input elements.
• Add missing custom class in latest posts & categories block.
• Add visible label to shared block name input.
• Add ref="noreferrer noopener" for target="_blank" links.
• Add drop cap help text in paragraph block.
• Remove the text alignment from the block inspector in Cover Image.
• Make sure aria-disabled buttons (movers) stay disabled on focus.
  
• Simplify the BlockBreadcrumb component and its semantics.
• Only display featured image UI when theme supports it.
• Improve display of URL input.
• Improve consistency in how + icon is shown on the inserters.
• Extract block library to separate module.
  
• Improve handling of admin theme colors.
• Avoid calculating the closest positioned parent by binding the RichText wrapper div.
• Use IconButton on breadcrumbs to increase consistency and accessibility.
• Reset change detection on post update, resolving an issue where changes made while a post is saving are not accurately reflected in change detection.
• Hide inspector controls if no image is selected in Cover Image.
• Minor improvements for the permalink “Copy to clipboard” button.
• Fix scrolling issues with very long and multi-line captions.
• Fix problem with front-end output of LatestsPosts block.
• Fix issue with using zero min value in RangeControl.
• Fix Markdown paste containing HTML.
• Fix permalink linking to preview URL instead of live.
• Fix issue with update button becoming invisible on mobile on already published posts.
• Fix showing/hiding the right block side UI on RTL languages.
• Fix Classic block regression after extraction of the blocks into a separate script.
• Fix issue where when creating a new post would default to the block sidebar if it was opened before.
• Fix issue when pasting content with inline shortcodes would produce a separate block.
• Fix BlockEdit hooks not working properly with context.
• Fix regression with select box.
• Fix translation strings in embed block.
• Fix regression with formatting button hover/focus style.
• Fix arrow navigation in the shared block more options menu.
• Fix orderby typo in latest posts block.
• Fix the clipboard button as IconButton usage.
• Restore hiding drop cap on focus to prevent bugs with contenteditable.
• Restore priority on embed block for raw transforming.
• Remove no longer mandatory use of isSelected in block edit.
• Remove permalink_structure from REST API index as per #42465.
• Remove old solution for focus after deprecation period.
• Refactor withColors HOC to allow configuring the mapping when instantiating the component.
• Refactor PanelColor to avoid the need for the colorName prop.
• Use a “users” reducer combined with a “queries” sub state to map authors to users.
• Make sure block assets are always registered before wp-edit-post script.
• Expose Gutenberg Data Format version in the REST API response.
• Split loading of API actions and filters to its own file.
• Switch to rest_get_server() for compatibility with trunk.
• Pre-load REST API index data to avoid flash of missing data.
• Deprecate event proxying in RichText.
• Avoid duplicate save request in shared block which could cause race conditions.
• Update docs folder structure and make all internal handbook links relative.
• Update theme extensibility documentation to include editor widths.
• Add section about translating the plugin to the contributing doc.
• Improve documentation and clarity of the Toolbar component.
• Add documentation for undefined attribute source.
• Add isDebounced prop in autocompleter doc.
• Add arrow-spacing rule to eslint config.
• Add arrow-parens rule to eslint config.
• Enforce array as Lodash path argument.
• Upgrade react-datepicker to 1.4.1.
• Upgrade showdown to 1.8.6.
• Drop deprecations slated for 2.8 removal.
• Use the @wordpress/word-count package.
  
• Use @wordpress/is-shallow-equal for shallow equality.
• Build Tools: Fix the package plugin script.
• Improve the G in Gutenberg ASCII 🔷

#core-editor, #editor, #gutenberg

This release introduces drag and drop capabilities for sorting blocks, various refinements to the block visual interface (including a label with block type identifier) and extensibility APIs, plus a lot of bug fixes. Thanks to everyone who contributed for all the ongoing efforts!

2.6 🐉 💧

• Add drag and drop functionality to reorder blocks (in addition to arrow movers).
• Improve side UI around nested groups and introduce a block name label on hover.
• Focus the block inspector automatically when a block is selected.
  
• Allow extending auto-completers via filters — this also exposes the "user" auto-complete to all RichText component instances, making it much easier to leverage for external blocks.
• Use debounced search request in user auto-complete mechanism improving the experience of mentioning in sites with more than 100 users.

Other changes

• Use custom serializer for texturize compatibility. This removes dependency on react-dom/server and integrates better with wptexturize expectations.
  
• Group advanced block settings (class name and anchor) in a panel.
• Move Post Types Data Fetching to the core-data module.
• Refactor DocumentOutline to use the data module.
• Improve performance of drag and drop by avoiding excessive re-rendering.
• Various UI improvements to controls and components in Block Inspector.
• Remove react-redux usage from the edit-post module, replacing it with the data module. Also improves performance on some block operations.
• Add role=menuitem to the More Options menu items.
• Renamed "Frequent" to "Suggested" in block inserter tab.
• Invert speak messages in block inspector button.
• Include only known terms in rendered Terms selector, fixing issue with occasional empty tags.
• Apply centering style to the theme style output.
• Avoid term request if term set is empty array.
• Provide createHigherOrderComponent helper to Element abstraction.
• Reset block selection when replacing with empty set.
• Prevent unnecessary state updates to edit-post preferences.
• Update Sidebar and Menu Item implementations to use React 16.3 context API.
• Generalise and comment on DOMRect calculation and storage.
• Reopen sidebar when going to viewport sizes larger than medium.
• Widen dropzone indicator to match block width.
• Reset margin and padding values for gallery.
• More defensive checks when accessing capabilities and terms.
• Fix autosave condition while editing a post using the Text Mode editor.
• Fix block movers aria-label info on multi-select groups.
• Fix centered multiline labels in the block settings menu.
• Fix issue with Publish button caused by moment timezone configuration.
• Fix arrow movement inside search input in Inserter.
• Fix broken translation in FormTokenField placeholder.
  
• Fix issue with invalid string value passed to caption in Image block.
• Fix findDOMNode lint warning.
• Fix error when DOCKER is not defined.
• Fix Safari flashing a white screen just before the editor is loaded.
• Fix problem with meta-boxes toggling.
• Fix WordCounter error when loading meta boxes.
• Fix clone function to allow cloning nested blocks.
• Fix issue with meta-boxes and file inputs.
• Fix issue with block more button when multi selected.
• Handle post ID and WP_Post objects passed to gutenberg_can_edit_post().
• Clear attribute and reset text back to default when cleared in the "More" block.
• Remove an invalid test case from isCurrentPostScheduled.
• Remove code transform for uppercase text in Tooltip component.
• Remove unused PrismJS dependency.
• Remove redundant z-index in block mover.
• Remove background color from paragraph and fixed contrast checker on transparent colors.
• Make block preview title translatable.
• Make the click-redirector responsive (handles clicking on the bottom area of the editor to focus on last field).
• Replace cases of bold font weight with weight 600.
• Various Sass code improvements.
• Add E2E test for splitting/merging paragraph blocks with Enter/Backspace.
• Add test to check CPT templates initialization in E2E tests.
• Add helpers to install/activate/deactivate and remove plugins in E2E tests.
• Re-incorporate Webpack devtool into development build for improved debugging.
• Add $HOME/.npm to Travis cache after addition of Puppeteer library.
• Improve MediaUpload docs.
• Rework all the extensibility related docs to add structure and clarity.
• Remove deprecations slated for 2.6.
• Upgrade React to version 16.3.0.
• Migrate to Webpack 4.

#core-editor, #editor, #gutenberg